/* AI-consultancy: de film als AI-assistent. Navy hero met een glazen "AI-assistent"-paneel
   (zoekpil die typt, een wit antwoord dat laadt) → licht (voorbeelden) → wit (vragen, vlak eronder)
   → nacht (aanbod, met de neon-glimlach uit de film, loopt over in de donkere CTA-strook) → blauwe CTA. */

.pagina-ai .ai-heel{white-space:nowrap;}

/* ---- hero: het assistent-paneel ---- */
.pagina-ai .hero__beeld{padding:0;}
.pagina-ai .ai-assistent{max-width:460px;margin-left:auto;}
.pagina-ai .ai-vraag{display:flex;width:100%;height:52px;margin-bottom:14px;box-shadow:0 14px 30px -18px rgba(7,20,42,.6),0 0 0 5px rgba(255,255,255,.14);}
.pagina-ai .ai-vraag .zoekpil__tekst{--zoek-w:14em;animation:typen .8s steps(22) .6s both,knipper 1.1s steps(1) 1.4s 3 backwards;}

.pagina-ai .ai-antwoord{display:grid;gap:10px;padding:18px 18px 16px;border-radius:18px;background:var(--wit);color:var(--navy);box-shadow:0 14px 30px -18px rgba(7,20,42,.6);animation:plop .45s var(--ease) .75s both;}
.pagina-ai .ai-antwoord__kop{display:flex;align-items:center;gap:10px;margin-bottom:4px;}
.pagina-ai .ai-antwoord__logo{flex:none;width:34px;height:34px;margin:-3px;}
.pagina-ai .ai-antwoord__kop p{display:flex;flex-direction:column;line-height:1.25;}
.pagina-ai .ai-antwoord__kop b{font-size:15px;font-weight:600;}
.pagina-ai .ai-antwoord__kop small{font-size:12.5px;color:var(--tekst-zacht);}
.pagina-ai .ai-balk{display:block;height:9px;border-radius:4px;background:var(--grijs);transform-origin:left;animation:ai-laden .45s var(--ease) both;animation-delay:calc(.85s + var(--b,0) * .08s);}
.pagina-ai .ai-balk:nth-of-type(1){width:92%;}
.pagina-ai .ai-balk:nth-of-type(2){width:78%;--b:1;}
.pagina-ai .ai-balk:nth-of-type(3){width:60%;--b:2;}
.pagina-ai .ai-antwoord__pillen{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px;}
.pagina-ai .ai-antwoord__pillen .pil:first-child{background:var(--blauw);color:var(--wit);}
@keyframes ai-laden{from{transform:scaleX(0);opacity:0}}

@media (max-width:900px){
  .pagina-ai .hero__beeld{max-width:460px;}
  /* tablet en mobiel: compact paneel (max ~360px hoog) */
  .pagina-ai .ai-assistent{margin-left:0;padding:18px;}
  .pagina-ai .ai-assistent .voorbeeld + .glas__kop{margin-top:30px;}
  .pagina-ai .ai-assistent .glas__kop{padding-bottom:14px;margin-bottom:16px;}
  .pagina-ai .ai-assistent .glas__kop small,.pagina-ai .ai-antwoord__kop small,.pagina-ai .ai-antwoord__pillen{display:none;}
  .pagina-ai .ai-antwoord{padding-bottom:30px;}
}

/* ---- voorbeelden: compacte kaarten, chip + één regel ---- */
.pagina-ai .ai-taken .kaart{gap:0;}
.pagina-ai .ai-taken h3{font-size:clamp(17px,1.6vw,20px);text-wrap:balance;}
@media (max-width:640px){
  .pagina-ai .ai-taken .kaart{flex-direction:row;align-items:center;gap:16px;padding:18px 20px;}
  .pagina-ai .ai-taken .chip{margin:0;}
  .pagina-ai .ai-taken h3{font-size:18px;}
}

/* ---- aanbod: kop met de neon-glimlach (de lichtlijn uit de film) ---- */
.pagina-ai .ai-aanbod{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:48px;}
.pagina-ai .ai-neon{width:clamp(200px,22vw,300px);height:auto;margin:0 4% -8px 0;overflow:visible;
  filter:drop-shadow(0 0 6px rgba(126,166,247,.9)) drop-shadow(0 0 22px rgba(37,99,235,.85));}
.pagina-ai .ai-neon path{fill:none;stroke:var(--wit);stroke-width:.8;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:0;transition:stroke-dashoffset .9s var(--ease) .1s;}
.pagina-ai .ai-neon circle{fill:var(--wit);transform-box:fill-box;transform-origin:center;transition:scale .25s var(--ease) .95s;}
.js .pagina-ai .ai-aanbod:not(.in) .ai-neon path{stroke-dashoffset:1;}
.js .pagina-ai .ai-aanbod:not(.in) .ai-neon circle{scale:0;}
@media (max-width:760px){.pagina-ai .ai-aanbod{display:block;}.pagina-ai .ai-neon{display:none;}}

.pagina-ai .ai-aanbod .lead{text-wrap:balance;}
.pagina-ai .ai-verder{margin-top:36px;}

@media (prefers-reduced-motion:reduce){
  .pagina-ai .ai-antwoord,.pagina-ai .ai-balk{animation:none;}
  .pagina-ai .ai-neon path,.pagina-ai .ai-neon circle{transition:none;}
}