/* AI — "Neural" (violet-led) */
body{ background:radial-gradient(120% 60% at 80% 0%,rgba(141,79,198,.16),transparent 60%) var(--ink-0); }

/* Hero */
.ai-hero{ position:relative; min-height:100svh; padding:calc(var(--nav-h) + 30px) 0 110px; overflow:hidden; display:flex; flex-direction:column; justify-content:center; }
.neural{ position:absolute; inset:0; width:100%; height:100%; z-index:0; opacity:.9; }
.ai-hero-grid{ position:relative; z-index:2; display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(30px,5vw,90px); align-items:center; }
.ai-hero-copy .crumbs{ margin-bottom:34px; }
.ai-title{ margin:26px 0 30px; font-size:clamp(2.6rem,min(6.6vw,11.5svh),7rem); }
.ai-title > span{ display:block; }
.ai-ctas{ display:flex; flex-wrap:wrap; gap:14px; margin-top:34px; }
.ai-portal-wrap{ position:relative; justify-self:center; width:min(100%,460px); }
.ai-portal{ position:relative; aspect-ratio:4/5; border-radius:999px 999px 28px 28px; overflow:visible; transform-style:preserve-3d; }
.ai-portal .media{ position:absolute; inset:0; border-radius:inherit; box-shadow:0 60px 120px -40px rgba(141,79,198,.6); }
.ai-portal .media img{ transform:scale(1.15); }
.ai-portal .tag{ position:absolute; z-index:4; display:inline-flex; align-items:center; gap:8px; padding:9px 14px; border-radius:999px; background:rgba(12,11,30,.86); border:1px solid var(--line-2); font-size:.62rem; color:var(--bone); white-space:nowrap; transform:translateZ(40px); }
.ai-portal .tag i{ width:6px; height:6px; border-radius:50%; background:var(--accent-2); box-shadow:0 0 10px var(--accent-2); animation:pulse 2s infinite; }
.ai-portal .t1{ top:16%; left:-14%; }
.ai-portal .t2{ top:48%; right:-12%; }
.ai-portal .t3{ bottom:9%; left:-6%; }
.portal-orbit{ position:absolute; inset:-6% -10%; width:120%; height:112%; pointer-events:none; z-index:-1; }
.portal-orbit ellipse{ fill:none; stroke:var(--line-2); stroke-dasharray:2 10; }
.ai-chips{ position:relative; z-index:2; display:flex; flex-wrap:wrap; gap:10px; margin-top:60px; }
.ai-chips li{ padding:10px 16px; border:1px solid var(--line-2); border-radius:999px; font-size:.85rem; color:var(--fog); background:rgba(12,11,30,.6); }
@media (max-width:960px){
  .ai-hero-grid{ grid-template-columns:1fr; }
  .ai-portal-wrap{ width:min(78%,380px); margin-top:30px; }
  .ai-portal .t2{ right:-4%; }
}

/* Sequence */
.ai-seq{ position:relative; }
.ai-seq-stage{ height:100vh; display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center; }
.ai-seq-lines{ position:relative; }
.seq-l{ font-size:clamp(2.4rem,min(5.6vw,10svh),6rem); margin-top:14px; opacity:.12; transition:none; }
.ai-seq-lines .label{ margin-bottom:30px; }
.seq-l .serif{ color:var(--accent-2); }
.seq-ticks{ display:flex; gap:22px; margin-top:44px; font-size:.7rem; color:var(--dim); }
.seq-ticks span{ position:relative; padding-top:14px; transition:color .5s; }
.seq-ticks span::before{ content:""; position:absolute; top:0; left:0; width:100%; height:2px; background:var(--line-2); }
.seq-ticks span.on{ color:var(--bone); }
.seq-ticks span.on::before{ background:var(--grad); }
.ai-seq-frames{ position:relative; height:min(72vh,680px); border-radius:28px; overflow:hidden; }
.frame{ position:absolute; inset:0; border-radius:inherit; }
.frame img{ width:100%; height:100%; object-fit:cover; }
.frame.f1, .frame.f2{ clip-path:circle(0% at 50% 50%); }
.frame-hud{ position:absolute; left:24px; bottom:22px; z-index:5; display:flex; align-items:center; gap:12px; font-size:.7rem; color:var(--bone); }
.fh-bar{ width:90px; height:1px; background:rgba(255,255,255,.3); position:relative; }
.fh-bar i{ position:absolute; inset:0; background:#fff; transform:scaleX(0); transform-origin:left; }
@media (max-width:900px){
  .ai-seq-stage{ grid-template-columns:1fr; height:auto; padding:100px var(--gutter); gap:40px; }
  .seq-l{ opacity:1; }
  .ai-seq-frames{ height:60vh; }
}

/* Deliver */
.ai-cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; perspective:1400px; }
.ai-card{ border-radius:24px; padding:30px; min-height:340px; display:flex; flex-direction:column; gap:14px; background:linear-gradient(180deg,rgba(23,21,47,.7),rgba(9,9,26,.7)); border:1px solid var(--line); }
.aic-top{ display:flex; justify-content:space-between; align-items:center; margin-bottom:auto; padding-bottom:40px; }
.aic-top .mono{ font-size:.7rem; color:var(--dim); }
.aic-model{ padding:6px 10px; border-radius:999px; border:1px solid var(--line-2); color:var(--accent-2) !important; }
.ai-card p{ color:var(--fog); }
.ai-card .chips{ margin-top:8px; }
@media (max-width:980px){ .ai-cards{ grid-template-columns:1fr 1fr; } }
@media (max-width:620px){ .ai-cards{ grid-template-columns:1fr; } }

/* Approach */
.ai-approach-grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(40px,8vw,140px); align-items:start; }
.ai-sticky{ position:sticky; top:calc(var(--nav-h) + 30px); }
.ai-sticky .h2{ margin:24px 0 10px; }
.big-step{ height:clamp(9rem,18vw,17rem); overflow:hidden; font-family:var(--f-display); font-weight:500; font-size:clamp(9rem,18vw,17rem); line-height:1; letter-spacing:-.06em; margin:10px 0 20px; }
.bs-roll{ display:flex; flex-direction:column; }
.bs-roll span{ display:block; height:clamp(9rem,18vw,17rem); background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent; }
.ai-steps{ display:grid; gap:0; counter-reset:s; padding-top:10vh; }
.ai-step{ position:relative; padding:56px 0 56px 44px; border-left:1px solid var(--line-2); min-height:46vh; display:flex; flex-direction:column; justify-content:center; gap:14px; opacity:.28; transition:opacity .6s; }
.ai-step.on{ opacity:1; }
.ai-step::before{ content:""; position:absolute; left:-6px; top:50%; width:11px; height:11px; border-radius:50%; background:var(--ink-0); border:1px solid var(--line-2); transition:all .5s; }
.ai-step.on::before{ background:var(--accent-2); border-color:var(--accent-2); box-shadow:0 0 0 6px rgba(220,199,255,.12),0 0 24px var(--accent-2); }
.ai-step .mono{ font-size:.7rem; color:var(--accent-2); }
.ai-step p{ color:var(--fog); max-width:44ch; }
.ai-steps-line{ position:absolute; left:-1px; top:0; width:2px; height:100%; background:var(--grad-v); transform-origin:top; transform:scaleY(0); }
@media (max-width:900px){
  .ai-approach-grid{ grid-template-columns:1fr; }
  .ai-sticky{ position:relative; top:auto; }
  .big-step{ display:none; }
  .ai-step{ opacity:1; min-height:auto; }
}

/* Outcomes list */
.oc-list{ border-top:1px solid var(--line-2); }
.oc-row{ position:relative; display:grid; grid-template-columns:80px 1fr 1.1fr; gap:30px; align-items:center; padding:36px 0; border-bottom:1px solid var(--line-2); transition:padding .6s var(--ease); }
.oc-row::after{ content:""; position:absolute; left:0; right:0; bottom:-1px; height:1px; background:var(--grad); transform:scaleX(0); transform-origin:left; transition:transform .8s var(--ease); }
.oc-row:hover{ padding-left:20px; }
.oc-row:hover::after{ transform:scaleX(1); }
.oc-row .mono{ font-size:.72rem; color:var(--dim); }
.oc-row .h3{ font-size:clamp(1.6rem,3vw,2.8rem); transition:color .4s; }
.oc-row:hover .h3{ color:var(--accent-2); }
.oc-row p{ color:var(--fog); }
.oc-preview{ position:fixed; left:0; top:0; width:300px; height:220px; border-radius:18px; overflow:hidden; pointer-events:none; z-index:120; opacity:0; transform:scale(.6); }
.oc-preview img{ width:100%; height:100%; object-fit:cover; }
@media (max-width:760px){ .oc-row{ grid-template-columns:1fr; gap:10px; } .oc-preview{ display:none; } }

@media (max-width:1240px){
  .ai-portal .t1{ left:-4%; }
  .ai-portal .t2{ right:-3%; }
  .ai-portal .t3{ left:2%; }
}
