/* AI-agency (landingspagina voor uniekaiagency.nl): navy hero met een glaspaneel (advies, bouw en
   beheer bij één persoon, daaronder Bart) → licht (wat een AI-agency doet: vier vinkjes in een kaart)
   → wit (verschil consultancy, agency en softwarehuis: de prijstabel als vergelijking) → licht (wat
   ik bouw: zes kaarten die doorlinken) → wit (werkwijze en prijs, stappenrail)
   → nacht (uitgangspunten) → licht (vragen) → blauwe CTA. Alleen bestaande bouwstenen; hier kleine
   aanpassingen, gescoped onder .pagina-ai-agency. */

/* ---- hero ---- */
.pagina-ai-agency .hero__tekst{min-width:0;}
.pagina-ai-agency .hero h1{font-size:clamp(44px,5.6vw,84px);padding-bottom:.5em;}
.pagina-ai-agency .aga-gratis{margin-top:18px;font-size:15px;color:var(--tekst-licht-zacht);animation:opdoemen .5s var(--ease) .68s both;}
@media (max-width:900px){
  .pagina-ai-agency .hero h1{font-size:clamp(42px,9.4vw,76px);}
  .pagina-ai-agency .hero__beeld{max-width:460px;}
}

/* glaspaneel: advies, bouw en beheer als witte rijen (zoals de meldingen op /automatisering), daaronder Bart */
.pagina-ai-agency .aga-rail{list-style:none;margin:0;padding:0;display:grid;gap:12px;}
.pagina-ai-agency .aga-rail li{display:flex;align-items:center;gap:12px;padding:12px 16px 12px 12px;border-radius:14px;background:var(--wit);color:var(--navy);box-shadow:var(--schaduw-toast);animation:plop .45s var(--ease) both;animation-delay:calc(700ms + var(--k,0) * 120ms);}
.pagina-ai-agency .aga-rail li:nth-child(2){--k:1}
.pagina-ai-agency .aga-rail li:nth-child(3){--k:2}
.pagina-ai-agency .aga-rail p{display:flex;flex-direction:column;line-height:1.25;}
.pagina-ai-agency .aga-rail b{font-size:15px;font-weight:600;}
.pagina-ai-agency .aga-rail small{font-size:12.5px;color:var(--tekst-zacht);}
.pagina-ai-agency .aga-paneel .persoon{margin-top:22px;padding-top:20px;border-top:1px solid rgba(255,255,255,.2);}
.pagina-ai-agency .aga-paneel .persoon p span{color:var(--ijs);opacity:1;}

/* ---- koppen: 'AI-agency' en 'AI-agent' niet op het koppelteken afbreken (ook op desktop) ---- */
.pagina-ai-agency .aga-heel{white-space:nowrap;}

/* ---- waarom ook agency: vinkjes in één kaart ---- */
.pagina-ai-agency .aga-waarom .vink{gap:16px;}
.pagina-ai-agency .aga-waarom .vink li{color:var(--tekst);}

/* ---- vergelijking: de prijstabel, met de partij in de eerste kolom ---- */
.pagina-ai-agency .aga-tabel td{font-size:15.5px;}
.pagina-ai-agency .aga-tabel td:first-child strong{display:block;font:800 18px/1.2 var(--f-display);white-space:nowrap;}
.pagina-ai-agency .aga-tabel tr.is-start .pil{margin:8px 0 0;}
.pagina-ai-agency .aga-ik{margin-top:28px;max-width:70ch;font-size:16px;color:var(--tekst-zacht);}

/* ---- wat ik bouw: zes kaarten die doorlinken ---- */
.pagina-ai-agency .aga-kaarten .kaart p{font-size:15.5px;}

/* ---- werkwijze: prijs onder elke stap ---- */
.pagina-ai-agency .aga-stappen .kaart__voet{margin-top:20px;max-width:none;}
.pagina-ai-agency .aga-stappen .aga-voet2{margin-top:12px;}
.pagina-ai-agency .aga-stappen .prijs{display:inline-flex;align-items:baseline;gap:8px;}
.pagina-ai-agency .aga-stappen .prijs small{font:600 14px/1 var(--f-tekst);color:var(--tekst-zacht);}

/* ---- uitgangspunten: vier kaarten op nacht ---- */
.pagina-ai-agency .aga-regels .kaart{gap:10px;}

/* ---- telefoon: rustig. Geen doelgroepzin onder de knoppen, geen Bart en geen bijregels in het
   glaspaneel, compacte kaarten zonder 'meer'-regel, geen chips in de stappen en uitgangspunten ---- */
@media (max-width:640px){
  .pagina-ai-agency .hero h1{font-size:min(12.4vw,52px);}
  .pagina-ai-agency .aga-breed{display:none;}
  .pagina-ai-agency .aga-paneel .persoon{display:none;}
  .pagina-ai-agency .aga-rail small{display:none;}
  .pagina-ai-agency .aga-rail{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;}
  .pagina-ai-agency .aga-rail li{flex-direction:column;gap:8px;padding:12px 6px;text-align:center;}
  .pagina-ai-agency .aga-tabel td:first-child::before{display:none;}
  .pagina-ai-agency .aga-ik{font-size:15.5px;}
  .pagina-ai-agency .aga-kaarten{gap:14px;}
  .pagina-ai-agency .aga-kaarten .kaart{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:14px;row-gap:8px;align-items:start;padding:20px;}
  .pagina-ai-agency .aga-kaarten .chip{margin:0;width:40px;height:40px;}
  .pagina-ai-agency .aga-kaarten .chip .icoon{width:19px;height:19px;}
  .pagina-ai-agency .aga-kaarten h3{align-self:center;font-size:18px;}
  .pagina-ai-agency .aga-kaarten .kaart p{grid-column:1/-1;margin:0;font-size:15px;}
  .pagina-ai-agency .aga-kaarten .kaart__meer{display:none;}
  .pagina-ai-agency .split__kop .aga-knop{display:none;}
  .pagina-ai-agency .stap .chip{display:none;}
  .pagina-ai-agency .aga-stappen .kaart__voet{flex-direction:column;align-items:flex-start;gap:4px;}
  .pagina-ai-agency .aga-regels{gap:14px;}
  .pagina-ai-agency .aga-regels .chip{display:none;}
}