/* ── hero-titel: vaste 2-regelige afbraak op telefoon (typewriter-stabiel) ──
       desktop/tablet: br verborgen → pixel-identiek aan voorheen */
    .ind-hero__br { display: none; }
    @media (max-width: 640px) {
      .ind-hero__br { display: inline; }   /* forceer de afbraak vóór "learning, not replaces it." */
      /* iets kleiner zodat "learning, not replaces it." (27 mono-tekens ≈ 15.5em)
         op één regel past binnen 100vw - 2×gutter; overschrijft ook de ≤420px-regel
         uit industry-hero.css (page-style komt later in de cascade) */
      .ind-hero__heading { font-size: clamp(1rem, 6vw - 2px, 2rem); }
    }

    /* ── short intro section under the hero ── */
    .ind-intro { padding: var(--section-pad-y) 0 230px; background: var(--e-global-color-bg); }   /* extra ruimte: contactkaart overlapt deze sectie (geen cases-sectie hier) */
    .ind-intro__wrap {
      max-width: var(--content-max); margin: 0 auto; padding: 0 var(--gutter);
      display: grid; grid-template-columns: 0.9fr 1.1fr;
      gap: clamp(28px, 4vw, 56px); align-items: start;
    }
    .ind-intro__label {
      font-family: 'JetBrains Mono', monospace; font-weight: 500;
      font-size: 12px; letter-spacing: 0.12em; text-transform: uppercase;
      color: var(--e-global-color-primary); margin: 0 0 16px;
    }
    .ind-intro__heading {
      font-family: 'JetBrains Mono', monospace; font-weight: 700;
      font-size: clamp(26px, 3vw, 40px); line-height: 1.12;
      letter-spacing: -0.02em; color: var(--e-global-color-text); margin: 0;
    }
    .ind-intro__copy { display: flex; flex-direction: column; gap: 18px; }
    .ind-intro__copy p {
      font-family: 'Inter', sans-serif; font-size: 16px; line-height: 1.75;
      color: var(--e-global-color-text-dim); margin: 0;
    }
    @media (max-width: 1024px) { .ind-intro__copy p, .ct-form-lead { max-width: var(--measure); } }

    /* ── CTA bar ── */
    .ind-cta-outer { background: var(--e-global-color-bg); padding: 0 var(--gutter) var(--section-pad-y); }
    .ind-cta {
      max-width: var(--content-max); margin: 0 auto;
      border-radius: 20px; background: var(--e-global-color-text);
      padding: 64px 56px; position: relative; overflow: hidden;
      display: flex; align-items: center; justify-content: space-between;
      gap: 32px; flex-wrap: wrap;
    }
    .ind-cta::before {
      content: ''; position: absolute; right: -120px; bottom: -120px;
      width: 340px; height: 340px;
      background: radial-gradient(circle, rgba(56,196,234,0.20) 0%, transparent 70%);
      pointer-events: none;
    }
    .ind-cta__text { position: relative; z-index: 1; }
    .ind-cta__heading {
      font-family: 'JetBrains Mono', monospace; font-weight: 700;
      font-size: clamp(24px, 2.6vw, 34px); line-height: 1.15;
      letter-spacing: -0.02em; color: #fff; margin: 0 0 10px;
    }
    .ind-cta__sub {
      font-family: 'Inter', sans-serif; font-size: 15px; line-height: 1.6;
      color: rgba(255,255,255,0.62); margin: 0; max-width: 440px;
    }
    .ind-cta__btns { position: relative; z-index: 1; }

    @media (max-width: 1024px) {
      .ind-intro__wrap { grid-template-columns: 1fr; gap: 28px; }
      .ind-cta { padding: 48px 32px; }
    }
    @media (max-width: 640px) {
      .ind-intro__wrap { gap: 22px; }
      .ind-intro__heading { font-size: clamp(22px, 6vw, 30px); }
      .ind-cta {
        padding: 32px 22px; gap: 22px;
        flex-direction: column; align-items: flex-start; text-align: left;
      }
      .ind-cta::before { width: 220px; height: 220px; right: -90px; bottom: -90px; }
      .ind-cta__heading { font-size: clamp(20px, 6vw, 28px); }
      .ind-cta__sub { max-width: 100%; }
      .ind-cta__btns { width: 100%; }
    }

    /* ── Education cases bento (content fades in on hover) ── */
    .eu-cases { padding: var(--section-pad-y) 0 230px; background: var(--e-global-color-bg); }   /* extra bottom gap so the contact card can overlap */
    .eu-cases__head {
      max-width: var(--content-max); margin: 0 auto 40px; padding: 0 var(--gutter);
      display: flex; flex-direction: column; gap: 12px;
    }
    .eu-cases__heading {
      font-family: 'JetBrains Mono', monospace; font-weight: 700;
      font-size: clamp(26px, 3vw, 40px); line-height: 1.12;
      letter-spacing: -0.02em; color: var(--e-global-color-text); margin: 0;
    }
    .eu-bento {
      max-width: var(--content-max); margin: 0 auto; padding: 0 var(--gutter);
      display: grid; grid-template-columns: repeat(6, 1fr);
      grid-auto-rows: 175px; gap: 18px;
    }
    .eu-bento__item {
      position: relative; border-radius: 0; overflow: hidden;
      text-decoration: none; background: var(--e-global-color-text);
      box-shadow: 0 10px 28px -14px rgba(15,26,46,0.22);
    }
    .eu-bento__item img {
      width: 100%; height: 100%; object-fit: cover; display: block;
      transition: transform .55s cubic-bezier(.4,0,.2,1);
    }
    .eu-bento__item:hover img,
    .eu-bento__item:focus-visible img { transform: scale(1.05); }
    /* content overlay, hidden until hover/focus, then fades in */
    /* Casenaam altijd in beeld; meta/tekst/knop schuiven smooth in bij hover */
    .eu-bento__overlay {
      position: absolute; inset: 0;
      padding: 24px;
      display: flex; flex-direction: column; justify-content: flex-end; gap: 9px;
      color: #fff;
    }
    .eu-bento__overlay::before,
    .eu-bento__overlay::after { content: ''; position: absolute; inset: 0; pointer-events: none; }
    .eu-bento__overlay::before {
      background: linear-gradient(to top, rgba(0,0,0,0.72) 0%, rgba(0,0,0,0.22) 45%, rgba(0,0,0,0) 72%);
    }
    .eu-bento__overlay::after {
      background: linear-gradient(to top, rgba(0,0,0,0.88) 0%, rgba(0,0,0,0.62) 50%, rgba(0,0,0,0.45) 100%);
      opacity: 0; transition: opacity .35s ease;
    }
    .eu-bento__overlay > * { position: relative; z-index: 1; }
    .eu-bento__item:hover .eu-bento__overlay::after,
    .eu-bento__item:focus-within .eu-bento__overlay::after { opacity: 1; }
    .eu-bento__more {
      display: grid; grid-template-rows: 0fr; opacity: 0;
      transition: grid-template-rows .4s ease, opacity .3s ease;
    }
    .eu-bento__more-inner {
      overflow: hidden; min-height: 0;
      display: flex; flex-direction: column; gap: 9px;
    }
    .eu-bento__item:hover .eu-bento__more,
    .eu-bento__item:focus-within .eu-bento__more { grid-template-rows: 1fr; opacity: 1; }
    .eu-bento__meta { display: flex; gap: 30px; margin-bottom: 2px; }
    .eu-bento__meta > div { display: flex; flex-direction: column; gap: 3px; }
    .eu-bento__meta span {
      font-family: 'JetBrains Mono', monospace; font-size: 10px;
      letter-spacing: 0.16em; text-transform: uppercase; color: rgba(255,255,255,0.55);
    }
    .eu-bento__meta strong {
      font-family: 'Inter', sans-serif; font-size: 14px; font-weight: 600; color: #fff;
    }
    .eu-bento__title {
      font-family: 'JetBrains Mono', monospace; font-weight: 700;
      font-size: 18px; letter-spacing: -0.01em; margin: 0; color: #fff;
    }
    .eu-bento__desc {
      font-family: 'Inter', sans-serif; font-size: 13px; line-height: 1.5;
      color: rgba(255,255,255,0.82); margin: 0;
    }
    /* exact case-slider button (copied from cases.html .pj-banner__btn) */
    .pj-banner__btn {
      align-self: flex-start;
      display: inline-flex; align-items: center; gap: 0;
      height: 44px; padding: 0 11px; margin-top: 6px;
      background: var(--e-global-color-primary);
      color: #fff; border: 0; border-radius: 12px;
      cursor: pointer; text-decoration: none; overflow: hidden;
      box-shadow: 0 6px 14px -6px rgba(56,196,234,0.55);
      transition: gap .25s ease, padding .25s ease, background .2s ease,
                  transform .2s ease, box-shadow .2s ease;
    }
    .pj-banner__btn-label {
      font-family: 'Inter', sans-serif; font-size: 14px; font-weight: 600;
      color: #fff; white-space: nowrap;
      max-width: 0; overflow: hidden;
      transition: max-width .45s steps(9, end);
    }
    .pj-banner__btn:hover {
      gap: 8px; padding-right: 16px;
      background: #28aed0;
      box-shadow: 0 10px 20px -8px rgba(56,196,234,0.65);
    }
    .pj-banner__btn:hover .pj-banner__btn-label {
      max-width: 120px; transition: max-width .5s steps(9, end) .1s;
    }
    .pj-banner__btn-arrow {
      width: 22px; height: 22px; color: #fff;
      display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;
    }
    .pj-banner__btn svg { width: 16px; height: 16px; }
    .eu-bento__item--lg { grid-column: span 3; grid-row: span 2; }
    .eu-bento__item--md { grid-column: span 3; grid-row: span 2; }
    .eu-bento__item--sm { grid-column: span 2; grid-row: span 2; }
    @media (max-width: 1024px) {
      .eu-bento { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 175px; }
      .eu-bento__item--lg, .eu-bento__item--md, .eu-bento__item--sm { grid-column: span 2; grid-row: span 2; }
    }
    @media (max-width: 640px) {
      .eu-cases { padding: var(--section-pad-y) 0; }
      .eu-cases__head { margin: 0 auto 28px; }
      /* hero-detailitems (stats) altijd 2-aan-2 op telefoon; overschrijft de
         1-koloms regel (flex:1 1 100%) van ≤420px uit industry-hero.css */
      .ind-hero__stat { flex: 1 1 calc(50% - 12px); }
      .eu-cases__heading { font-size: clamp(22px, 6vw, 30px); }
      .eu-bento {
        grid-template-columns: 1fr; grid-auto-rows: auto; gap: 14px;
      }
      .eu-bento__item--lg, .eu-bento__item--md, .eu-bento__item--sm {
        grid-column: span 1; grid-row: auto; height: 280px;
      }
      /* touch devices have no hover: keep case content visible by default */
      .eu-bento__overlay { padding: 20px; }
      .eu-bento__overlay::after { opacity: 1; }
      .eu-bento__more { grid-template-rows: 1fr; opacity: 1; }
      /* telefoon: intro-tekstje in de case-kaartjes vervalt */
      .eu-bento__desc { display: none; }
    }
    @media (prefers-reduced-motion: reduce) {
      .eu-bento__overlay, .eu-bento__item img { transition: none; }
    }

    /* ── contact form section, card overlaps the bento section above ── */
    .ct-section-2 { padding: 0 0 var(--section-pad-y); background: var(--e-global-color-bg-soft); }
    .ct-grid-2 {
      display: grid; grid-template-columns: 1fr 1fr;
      gap: clamp(32px, 5vw, 64px); align-items: start;
      max-width: var(--content-max); margin: 0 auto; padding: 0 var(--gutter);
    }
    .ct-form-side { padding-top: 110px; }   /* aligns the heading with the form's middle */
    .ct-form-heading {
      font-family: 'JetBrains Mono', monospace; font-weight: 700;
      font-size: clamp(32px, 3.6vw, 50px); line-height: 1.1;
      color: var(--e-global-color-text); margin: 0 0 20px; letter-spacing: -0.02em;
    }
    .ct-form-lead {
      font-family: 'Inter', sans-serif; font-size: 16px; line-height: 1.7;
      color: var(--e-global-color-text-dim); margin: 0;
    }
    .ct-card {
      background: #fff; border-radius: 16px; padding: 40px;
      box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);   /* same as the contact-page form */
      margin-top: -120px;          /* lift so the card overlaps the section above (subtler) */
      position: relative; z-index: 2;
    }
    .ct-card-title {
      font-family: 'JetBrains Mono', monospace; font-weight: 700; font-size: 22px;
      color: var(--e-global-color-text); margin: 0 0 8px;
    }
    .ct-card-sub {
      font-family: 'Inter', sans-serif; font-size: 14px;
      color: var(--e-global-color-text-mute); margin: 0 0 28px;
    }
    .ct-field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
    .ct-field { display: flex; flex-direction: column; gap: 6px; margin-bottom: 16px; }
    .ct-field label {
      font-family: 'Inter', sans-serif; font-size: 13px; font-weight: 600;
      color: var(--e-global-color-text);
    }
    .req { color: var(--e-global-color-primary); }
    .ct-field input, .ct-field textarea, .ct-field select {
      font-family: 'Inter', sans-serif; font-size: 14px; padding: 12px 16px;
      border-radius: 10px; border: 1.5px solid var(--e-global-color-border);
      background: transparent; color: var(--e-global-color-text); outline: none;
      transition: border-color .2s, background .2s; width: 100%; box-sizing: border-box;
    }
    .ct-field input:focus, .ct-field textarea:focus, .ct-field select:focus {
      border-color: var(--e-global-color-primary); background: #fff;
    }
    .ct-field textarea { resize: vertical; }
    .ct-submit {
      width: 100%; padding: 14px; border: none; border-radius: 10px;
      background: var(--e-global-color-primary); color: #fff;
      font-family: 'Inter', sans-serif; font-weight: 600; font-size: 15px;
      cursor: pointer; transition: background .2s; margin-top: 4px;
      display: flex; align-items: center; justify-content: center; gap: 8px;
    }
    .ct-submit:hover { background: #1FA7CC; }
    @media (max-width: 1024px) {
      .ct-grid-2 { grid-template-columns: 1fr; gap: 32px; }
      .ct-card { padding: 28px; margin-top: -56px; }
      .ct-form-side { padding-top: 0; order: -1; }
    }
    @media (max-width: 640px) {
      /* telefoon: geen overlap-kaart meer, dus gewone sectie-padding boven en onder */
      .ct-section-2 { padding: var(--section-pad-y) 0; }
      .ct-section-2 { padding: var(--section-pad-y) 0; }
      .ct-grid-2 { gap: 24px; }
      .ct-card { padding: 22px; margin-top: 0; }
      .ct-form-heading { font-size: clamp(28px, 8vw, 40px); }
    }