/* =====================================================================
   AI Automation page — section styles (loads after bpa.css)
   ===================================================================== */

/* ---------- 1. Hero illustration ---------- */
.ai-hx{display:block;width:100%;height:auto;font-family:inherit}
.ah-cap{font-size:12px;font-weight:700;fill:#9FD3E4;letter-spacing:.02em}
.ah-doc{animation:ahFloat 6s ease-in-out infinite}
.ah-rec{animation:ahFloat 6s ease-in-out -3s infinite}
@keyframes ahFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
.ah-scan{animation:ahScan 6s linear infinite}
@keyframes ahScan{0%{transform:translateY(0)}45%{transform:translateY(232px)}100%{transform:translateY(232px)}}
.ah-hl rect{fill:#5BFBC2;opacity:0;animation:ahHl 6s ease infinite}
.ah-hl rect:nth-child(2){animation-delay:.35s}.ah-hl rect:nth-child(3){animation-delay:.7s}
@keyframes ahHl{0%,18%{opacity:0}26%,88%{opacity:.32}100%{opacity:0}}
.ah-flow{fill:none;stroke:#7FC6DD;stroke-width:1.5;stroke-dasharray:3 6;opacity:.6}
.ah-p{fill:#5BFBC2}
.ah-ring{transform-box:fill-box;transform-origin:center;animation:ahSpin 22s linear infinite}
@keyframes ahSpin{to{transform:rotate(360deg)}}
.ah-pulse{opacity:.25;transform-box:fill-box;transform-origin:center;animation:ahPulse 2.4s ease-out infinite}
@keyframes ahPulse{0%{transform:scale(1);opacity:.35}100%{transform:scale(1.6);opacity:0}}
.ah-chip-t{font-size:11px;font-weight:700;fill:#CDE9F2}
.ah-rt{font-size:12.5px;font-weight:800;fill:#102B46}
.ah-fl{font-size:9.5px;font-weight:700;fill:#7A8D97;letter-spacing:.03em}
.ah-fb{fill:#E7EFF2}
.ah-fv{fill:#1B7699;transform-box:fill-box;transform-origin:left center;transform:scaleX(0);animation:ahFill 6s var(--ease) infinite}
.f2 .ah-fv{animation-delay:.45s}.f3 .ah-fv{animation-delay:.9s}
@keyframes ahFill{0%,38%{transform:scaleX(0)}50%,92%{transform:scaleX(1)}100%{transform:scaleX(0)}}
.ah-ok{opacity:0;animation:ahOk 6s ease infinite}
.ah-ok rect{fill:#5BFBC2}.ah-ok circle{fill:#fff}.ah-ok text{font-size:10.5px;font-weight:800;fill:#102B46}
@keyframes ahOk{0%,66%{opacity:0;transform:translateY(4px)}74%,92%{opacity:1;transform:none}100%{opacity:0}}
.ah-foot rect{fill:rgba(91,251,194,.12);stroke:rgba(91,251,194,.5)}
.ah-foot text{fill:#fff;font-size:13px;font-weight:700}
@media (prefers-reduced-motion:reduce){
  .ah-doc,.ah-rec,.ah-scan,.ah-ring,.ah-pulse{animation:none}.ah-p{display:none}
  .ah-hl rect{animation:none;opacity:.32}.ah-fv{animation:none;transform:none}.ah-ok{animation:none;opacity:1}
}

/* ---------- 2. Signs: paper pile ---------- */
.ai-signs{background:var(--white)}
.sec-head.is-c{text-align:center;display:flex;flex-direction:column;align-items:center}
.sec-head.is-c .h2{margin-inline:auto}
.sec-head.is-c .lede{margin-inline:auto}
.pile{display:grid;gap:22px;margin-top:10px}
@media (min-width:1000px){.pile{display:flex;align-items:flex-start;gap:0;padding:10px 6px 40px}}
.sheet{position:relative;flex:1 1 0;min-width:0;background-color:#fff;border:1px solid #DCE7EC;border-radius:6px 6px 18px 6px;padding:30px 22px 26px;
  background-image:repeating-linear-gradient(180deg,transparent 0 27px,#EEF4F6 27px 28px);background-position:0 18px;
  box-shadow:0 22px 40px -30px rgba(16,43,70,.55),0 2px 0 #fff inset;transition:transform .5s var(--ease),box-shadow .5s var(--ease),opacity .7s var(--ease)}
@media (min-width:1000px){
  .sheet+.sheet{margin-left:-14px}
  .sheet.rv{transform:rotate(var(--r)) translateY(calc(var(--y) + 30px))}
  .sheet.rv.in{transform:rotate(var(--r)) translateY(var(--y))}
  .sheet.rv.in:hover{transform:rotate(0deg) translateY(-10px);box-shadow:0 34px 60px -32px rgba(16,43,70,.6);z-index:5}
}
.sh-clip{position:absolute;top:-10px;left:50%;width:62px;height:20px;margin-left:-31px;border-radius:3px;background:rgba(91,251,194,.55);transform:rotate(-3deg);box-shadow:0 2px 6px -2px rgba(16,43,70,.25)}
.sh-ic{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--navy);color:var(--mint)}
.sh-ic svg{width:21px;height:21px}
.sheet h3{margin:18px 0 0;font-size:1.1rem;font-weight:800;letter-spacing:-.02em;line-height:1.28;color:var(--navy)}
.sheet p{margin:10px 0 0;font-size:.9rem;line-height:1.62;color:#000}
.sh-lines{display:flex;flex-direction:column;gap:6px;margin-top:18px}
.sh-lines i{display:block;height:5px;border-radius:3px;background:#E6EEF1}
.sh-lines i:nth-child(1){width:86%}.sh-lines i:nth-child(2){width:64%}.sh-lines i:nth-child(3){width:40%}

.scope{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin-top:22px}
.scope b{font-size:.88rem;font-weight:800;color:var(--navy)}
.scope ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.scope li{font-size:.76rem;font-weight:700;padding:6px 12px;border-radius:999px;background:#fff;border:1px solid var(--line-2);color:var(--navy)}

/* ---------- 5. Outcomes: wave ---------- */
.wv{position:relative}
.wv-svg{display:none}
.wv-row{display:grid;gap:26px}
.wv-i{position:relative;display:grid;grid-template-columns:auto 1fr;column-gap:18px}
.wv-node{grid-row:span 2;display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:var(--navy);color:var(--mint);box-shadow:0 0 0 6px var(--paper),0 0 0 7px rgba(27,118,153,.25);transition:background .35s,color .35s}
.wv-node svg{width:24px;height:24px}
.wv-i:hover .wv-node{background:var(--mint);color:var(--navy)}
.wv-i h3{margin:4px 0 0;font-size:1.12rem;font-weight:800;letter-spacing:-.02em;line-height:1.3;color:var(--navy)}
.wv-i p{margin:8px 0 0;font-size:.9rem;line-height:1.62;color:#000}
@media (min-width:1000px){
  .wv{padding-top:4px}
  .wv-svg{display:block;position:absolute;left:0;top:0;width:100%;height:140px;overflow:visible}
  .wv-bg{fill:none;stroke:var(--line-2);stroke-width:2}
  .wv-ln{fill:none;stroke:url(#wvG);stroke-width:3.5;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 2.2s var(--ease) .2s}
  .wv.in .wv-ln{stroke-dashoffset:0}
  .wv-row{grid-template-columns:repeat(5,1fr);gap:24px}
  .wv-i{display:block;text-align:center;padding-top:calc(var(--y) - 28px)}
  .wv-node{margin:0 auto 18px;opacity:0;transform:scale(.6);transition:opacity .5s var(--ease),transform .5s var(--ease),background .35s,color .35s;transition-delay:calc(var(--d) + .5s),calc(var(--d) + .5s),0s,0s}
  .wv.in .wv-node{opacity:1;transform:none}
  .wv-i p{max-width:26ch;margin-inline:auto}
}
.msr{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px 28px;margin-top:40px;padding:18px 22px;border-radius:18px;background:#fff;border:1px solid var(--line)}
.msr p{margin:0;font-size:.92rem;line-height:1.55;color:#000;max-width:56ch}
.msr ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.msr li{display:inline-flex;align-items:center;gap:7px;font-size:.78rem;font-weight:800;padding:7px 12px;border-radius:999px;background:var(--navy);color:#fff}
.msr li i{display:grid;color:var(--mint)}.msr li svg{width:14px;height:14px}

/* ---------- 8. Approach: rising steps ---------- */
.ai-appr{background:var(--white)}
.stair{list-style:none;margin:0;padding:0;display:grid;gap:26px}
.st-i{display:flex;flex-direction:column}
.st-tx h3{margin:0;font-size:1.14rem;font-weight:800;letter-spacing:-.02em;line-height:1.3;color:var(--navy)}
.st-tx p{margin:10px 0 0;font-size:.92rem;line-height:1.64;color:#000}
.st-bar{position:relative;margin-top:16px;height:14px;width:calc(34% + var(--h) * .9);max-width:100%;border-radius:8px;background:linear-gradient(90deg,var(--navy),var(--turq))}
.st-bar span{position:absolute;right:10px;top:50%;transform:translateY(-50%);font-size:.66rem;font-weight:800;color:var(--mint)}
@media (min-width:960px){
  .stair{position:relative;grid-template-columns:repeat(4,1fr);gap:22px;align-items:stretch;padding-bottom:2px}
  .stair::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--navy);border-radius:2px}
  .st-tx{flex:1;padding-bottom:20px}
  .st-bar{margin-top:0;width:100%;height:var(--h);border-radius:16px 16px 0 0;background:linear-gradient(180deg,#1B7699 0%,#102B46 100%);transform-origin:bottom;transform:scaleY(0);transition:transform .8s var(--ease) calc(var(--d) + .2s)}
  .st-i.in .st-bar{transform:none}
  .st-bar::before{content:"";position:absolute;left:0;right:0;top:0;height:5px;border-radius:16px 16px 0 0;background:var(--mint)}
  .st-bar span{left:18px;right:auto;top:auto;bottom:14px;transform:none;font-size:1.5rem;letter-spacing:-.03em}
  .st-i.rv{transform:none}
}

/* ---------- 9. Why: statement + checklist ---------- */
.wyp{display:grid;gap:28px}
@media (min-width:960px){.wyp{grid-template-columns:minmax(0,40fr) minmax(0,60fr);gap:52px;align-items:stretch}}
.wyp-q{position:relative;overflow:hidden;border-radius:28px;padding:40px 36px;background:radial-gradient(120% 120% at 0% 0%,#1D6A90 0%,#102B46 55%,#0B2038 100%);color:#fff;display:flex;flex-direction:column;justify-content:center;min-height:280px}
.wyp-mk{font-size:7rem;line-height:.6;font-weight:800;color:var(--mint);opacity:.85;height:52px}
.wyp-q p{margin:10px 0 0;font-size:clamp(1.4rem,2.4vw,1.85rem);font-weight:800;letter-spacing:-.03em;line-height:1.22;max-width:18ch}
.wyp-ic{position:absolute;right:26px;bottom:22px;width:90px;height:90px;color:rgba(91,251,194,.18)}.wyp-ic svg{width:100%;height:100%}
.wyp-i{display:grid;grid-template-columns:auto 1fr;gap:18px;padding:22px 0;border-bottom:1px solid var(--line)}
.wyp-i:first-child{padding-top:4px}
.wyp-ck{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--mint);color:var(--navy)}.wyp-ck svg{width:17px;height:17px}
.wyp-i h3{margin:4px 0 0;font-size:1.2rem;font-weight:800;letter-spacing:-.02em;color:var(--navy)}
.wyp-i p{margin:8px 0 0;font-size:.93rem;line-height:1.64;color:#000}

/* ---------- 10. Platforms: connection map ---------- */
.ai-plat{background:var(--white)}
.pf{display:grid;gap:30px;align-items:center}
@media (min-width:960px){.pf{grid-template-columns:minmax(0,46fr) minmax(0,54fr);gap:56px}}
.pf .sec-head{margin-bottom:0}
.pf-p{margin:20px 0 0;font-size:1rem;line-height:1.65;color:#000;max-width:56ch}
.pf-n{display:flex;gap:12px;margin:18px 0 0;padding:14px 16px;border-radius:14px;background:var(--paper);font-size:.88rem;line-height:1.6;color:#000;max-width:60ch}
.pf-n span{flex:none;color:var(--turq)}.pf-n svg{width:20px;height:20px}
.pf-v{border-radius:26px;padding:18px;background:radial-gradient(#D2E3E9 1px,transparent 1.2px) 0 0/18px 18px,#F5FAFB;border:1px solid var(--line)}
.net{display:block;width:100%;height:auto;font-family:inherit;overflow:visible}
.net-l{fill:none;stroke:#B9CCD5;stroke-width:2;stroke-dasharray:5 6}
.net-p{fill:var(--mint);stroke:var(--navy);stroke-width:1.4}
.net-n rect{fill:#fff;stroke:var(--turq);stroke-width:1.5}
.net-n{color:var(--turq)}
.net-n text{font-size:12.5px;font-weight:800;fill:var(--navy)}
.net-core circle{fill:var(--navy)}
.net-core .net-pulse{fill:var(--mint);opacity:.3;transform-box:fill-box;transform-origin:center;animation:ahPulse 2.6s ease-out infinite}
.net-core text{font-size:10.5px;font-weight:800;fill:#fff}
@media (prefers-reduced-motion:reduce){.net-p{display:none}.net-core .net-pulse{animation:none}}

/* ---------- 12. FAQ: conversation ---------- */
.ai-faq{background:var(--white)}
.cv{display:grid;gap:26px}
@media (min-width:1000px){.cv{grid-template-columns:minmax(0,36fr) minmax(0,64fr);gap:56px;align-items:start}.cv>.sec-head{position:sticky;top:calc(var(--nav-h) + 40px);margin-bottom:0}}
.chat.faqs{display:flex;flex-direction:column;gap:12px;border-top:0;padding:22px;border-radius:26px;background:#F4F9FA;border:1px solid var(--line)}
.chat .faq{border-bottom:0;display:flex;flex-direction:column}
.chat .faq-q{display:grid;grid-template-columns:minmax(0,1fr) 20px;gap:14px;align-self:flex-end;width:auto;max-width:88%;padding:13px 16px 13px 18px;border-radius:18px 18px 4px 18px;background:var(--navy);color:#fff;font-size:.95rem;box-shadow:0 10px 22px -16px rgba(16,43,70,.6);transition:background .3s}
.chat .faq-q:hover{background:#1A4E73;color:#fff}
.chat .faq-q i{width:20px;height:20px}
.chat .faq-q i::before,.chat .faq-q i::after{background:var(--mint);left:2px;top:9px}
.chat .faq-a>p{padding:0;max-width:none}
.chat .faq.is-open .faq-a{padding:10px 0 4px}
.ch-row{display:flex;gap:10px;align-items:flex-end;max-width:92%}
.ch-av{flex:none;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--mint);color:var(--navy)}.ch-av svg{width:16px;height:16px}
.ch-b{display:block;padding:13px 16px;border-radius:18px 18px 18px 4px;background:#fff;border:1px solid var(--line);font-size:.92rem;line-height:1.62;color:#000}


/* =====================================================================
   v2: centred headings + redesigned sections
   ===================================================================== */
body .sec-head{display:flex;flex-direction:column;align-items:center;text-align:center}
.sec-head .h2,.sec-head .lede,.sec-head .sub{margin-inline:auto}
.sec-head .sub{margin:10px auto 0;font-size:.95rem;line-height:1.6;color:#000;max-width:64ch}
.scope{justify-content:center}

/* ---------- 3. Services: AI circuit ---------- */
.cir{position:relative;display:grid;gap:16px;margin-top:8px}
.cir-c{display:none}
.cir-i{display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:start;padding:16px 4px;border-bottom:1px solid var(--line);outline:none}
.cir-ic{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:var(--navy);color:var(--mint);transition:background .35s,color .35s,box-shadow .35s}
.cir-ic svg{width:22px;height:22px}
.cir-i h3{margin:2px 0 0;font-size:1.08rem;font-weight:800;letter-spacing:-.02em;line-height:1.3;color:var(--navy)}
.cir-i p{margin:6px 0 0;font-size:.88rem;line-height:1.6;color:#000}
.cir-i:focus-visible .cir-ic{box-shadow:0 0 0 3px var(--turq)}
@media (min-width:1000px){
  .cir{grid-template-columns:minmax(0,1fr) 280px minmax(0,1fr);grid-template-rows:repeat(3,160px);gap:0 18px;margin-top:20px}
  .cir-c{display:block;grid-column:2;grid-row:1/4;position:relative}
  .cir-svg{position:absolute;inset:0;width:280px;height:480px;overflow:visible}
  .cir-i{border-bottom:0;padding:0;align-self:center;grid-row:var(--row);cursor:default}
  .cir-l{grid-column:1;grid-template-columns:1fr auto;text-align:right}
  .cir-l .cir-ic{grid-column:2;grid-row:1}
  .cir-l>div{grid-column:1;grid-row:1}
  .cir-r{grid-column:3}
  .cir-i p{max-width:46ch}
  .cir-l p{margin-left:auto}
  .cir[data-a] .cir-i{opacity:.55;transition:opacity .3s}
  .cir[data-a="0"] .cir-i[data-k="0"],.cir[data-a="1"] .cir-i[data-k="1"],.cir[data-a="2"] .cir-i[data-k="2"],
  .cir[data-a="3"] .cir-i[data-k="3"],.cir[data-a="4"] .cir-i[data-k="4"],.cir[data-a="5"] .cir-i[data-k="5"]{opacity:1}
  .cir[data-a="0"] .cir-i[data-k="0"] .cir-ic,.cir[data-a="1"] .cir-i[data-k="1"] .cir-ic,.cir[data-a="2"] .cir-i[data-k="2"] .cir-ic,
  .cir[data-a="3"] .cir-i[data-k="3"] .cir-ic,.cir[data-a="4"] .cir-i[data-k="4"] .cir-ic,.cir[data-a="5"] .cir-i[data-k="5"] .cir-ic{background:var(--mint);color:var(--navy);box-shadow:0 0 0 6px rgba(91,251,194,.25)}
}
.cir-t{fill:none;stroke:#B9CCD5;stroke-width:2;stroke-linejoin:round;transition:stroke .3s,stroke-width .3s}
.cir-pad{fill:#fff;stroke:var(--turq);stroke-width:2;transition:fill .3s}
.cir-p{fill:var(--mint);stroke:var(--navy);stroke-width:1.2}
.cir-ring{fill:none;stroke:var(--turq);stroke-width:1.4;stroke-dasharray:3 7;transform-box:fill-box;transform-origin:center;animation:ahSpin 24s linear infinite}
.cir-pulse{fill:var(--mint);opacity:.3;transform-box:fill-box;transform-origin:center;animation:ahPulse 2.6s ease-out infinite}
.cir-tx{fill:#fff;font-size:12px;font-weight:800;letter-spacing:.08em}
.cir[data-a="0"] .cir-t[data-k="0"],.cir[data-a="1"] .cir-t[data-k="1"],.cir[data-a="2"] .cir-t[data-k="2"],
.cir[data-a="3"] .cir-t[data-k="3"],.cir[data-a="4"] .cir-t[data-k="4"],.cir[data-a="5"] .cir-t[data-k="5"]{stroke:var(--turq);stroke-width:3}
.cir[data-a="0"] .cir-pad[data-k="0"],.cir[data-a="1"] .cir-pad[data-k="1"],.cir[data-a="2"] .cir-pad[data-k="2"],
.cir[data-a="3"] .cir-pad[data-k="3"],.cir[data-a="4"] .cir-pad[data-k="4"],.cir[data-a="5"] .cir-pad[data-k="5"]{fill:var(--mint)}
@media (prefers-reduced-motion:reduce){.cir-p{display:none}.cir-ring,.cir-pulse{animation:none}}

/* ---------- 6. Industries: compact selector ---------- */
.isel{max-width:980px;margin:0 auto}
.isel-tabs{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.isel-tabs button{font:inherit;font-size:.88rem;font-weight:700;padding:10px 16px;border-radius:999px;border:1px solid var(--line-2);background:#fff;color:var(--navy);cursor:pointer;transition:background .25s,color .25s,border-color .25s}
.isel-tabs button:hover{border-color:var(--turq)}
.isel-tabs button[aria-selected="true"]{background:var(--navy);border-color:var(--navy);color:#fff}
.isel-tabs button:focus-visible{outline:2.5px solid var(--turq);outline-offset:2px}
.isel-ps{margin-top:20px}
.isel-p{display:grid;gap:18px;align-items:center;padding:14px;border-radius:22px;background:var(--paper);border:1px solid var(--line)}
@media (min-width:700px){.isel-p{grid-template-columns:260px 1fr;gap:28px;padding:16px 28px 16px 16px}}
.isel-p.is-on{animation:svtIn .45s var(--ease)}
.isel-p figure{margin:0;border-radius:14px;overflow:hidden;aspect-ratio:700/466}
.isel-p img{display:block;width:100%;height:100%;object-fit:cover}
.isel-p b{display:block;font-size:1.3rem;font-weight:800;letter-spacing:-.025em;line-height:1.25;color:var(--navy)}
.isel-p p{margin:8px 0 0;font-size:.98rem;line-height:1.65;color:#000}
.isel-cta{display:flex;justify-content:center;margin-top:24px}

/* ---------- 8/9. Approach + Why centred tweaks ---------- */
.wyp-q{text-align:left}

/* ---------- 13. Close: example tasks (not an input) ---------- */
.exs{display:flex;flex-direction:column;align-items:center;gap:12px;margin:26px auto 0}
.exs-l{font-size:.72rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--turq-d)}
.exs ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.exs li{display:inline-flex;align-items:center;gap:9px;padding:9px 16px 9px 9px;border-radius:999px;background:var(--navy);color:#fff;font-size:.88rem;font-weight:700}
.exs li i{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:rgba(91,251,194,.16);color:var(--mint)}.exs li i svg{width:15px;height:15px}
.ai-close .close-cta{display:flex;justify-content:center;margin-top:24px}
/* v2 fixes */
body .sec-head{margin-inline:auto}
.cir-i{align-items:center}
.isel-ps{display:grid}
.isel-p{grid-area:1/1;visibility:hidden;opacity:0;transition:opacity .4s}
.isel-p.is-on{visibility:visible;opacity:1;animation:none}
.isel{max-width:1100px}

/* ---------- restored: Find Your Starting Point (original split layout) ---------- */
.ai-start{background:linear-gradient(115deg,#E2FBF2 0%,#E8F6FA 60%,#F2FAFB 100%)}
.as{display:grid;gap:30px;align-items:center}
@media (min-width:900px){.as{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:56px}}
.as-l h2{margin:14px 0 0;font-size:clamp(1.6rem,3vw,2.2rem);font-weight:800;letter-spacing:-.035em;line-height:1.15;color:var(--navy);max-width:20ch}
.as-l p{margin:14px 0 24px;font-size:1rem;line-height:1.6;color:#000;max-width:50ch}
.as-card{background:#fff;border-radius:22px;padding:20px;box-shadow:0 30px 60px -36px rgba(16,43,70,.5);border:1px solid rgba(27,118,153,.12)}
.as-hd{display:flex;align-items:center;gap:10px;font-size:.8rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--turq-d);margin-bottom:12px}
.as-hd span{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--navy);color:var(--mint)}.as-hd svg{width:15px;height:15px}
.as-row{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:13px 12px;border-radius:14px;border:1px solid var(--line);margin-top:8px;animation:asRow 7.5s ease infinite;animation-delay:calc(var(--i) * 1.2s)}
.as-row i{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:#EAF4F7;color:var(--turq)}.as-row i svg{width:17px;height:17px}
.as-row b{font-size:.95rem;font-weight:800;color:var(--navy)}
.as-row em{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;border:1.5px solid var(--line-2);color:transparent;animation:asCk 7.5s ease infinite;animation-delay:calc(var(--i) * 1.2s)}
.as-row em svg{width:13px;height:13px}
@keyframes asRow{0%,6%{border-color:var(--line);background:#fff}12%,80%{border-color:rgba(27,118,153,.35);background:#F6FCFB}100%{border-color:var(--line);background:#fff}}
@keyframes asCk{0%,8%{background:transparent;border-color:var(--line-2);color:transparent}14%,80%{background:var(--mint);border-color:var(--mint);color:var(--navy)}100%{background:transparent;color:transparent}}
@media (prefers-reduced-motion:reduce){.as-row,.as-row em{animation:none}.as-row em{background:var(--mint);border-color:var(--mint);color:var(--navy)}}
/* centred heading + text inside its column (requested) */
.as-l{display:flex;flex-direction:column;align-items:center;text-align:center}
.as-l h2,.as-l p{margin-inline:auto}

/* ---------- restored: Platforms text column centred (requested) ---------- */
.pf-p{margin-inline:auto;text-align:center}
.pf-n{margin-inline:auto}

/* ---------- restored: After Go-Live (original loop layout) ---------- */
.ai-sgo{position:relative;overflow:hidden;color:#fff;background:linear-gradient(160deg,#0E2A45 0%,#0B2038 55%,#081829 100%)}
.ai-sgo::before{content:"";position:absolute;left:-180px;bottom:-220px;width:560px;height:560px;border-radius:50%;background:radial-gradient(closest-side,rgba(91,251,194,.14),transparent)}
.sgo{position:relative;display:grid;gap:34px;align-items:center}
@media (min-width:1100px){.sgo{grid-template-columns:minmax(0,1fr) 280px minmax(0,1fr);gap:44px}}
@media (min-width:760px) and (max-width:1099px){.sgo{grid-template-columns:1fr 1fr}.sgo-v{order:3;grid-column:1/-1;max-width:260px;margin-inline:auto}}
.sgo-l h2{margin:16px 0 6px;font-size:clamp(1.7rem,3vw,2.3rem);font-weight:800;letter-spacing:-.035em;line-height:1.15;color:#fff}
.ai-sgo .hi{padding:0 3px;background:linear-gradient(var(--mint),var(--mint)) 0 88%/100% .3em no-repeat}
.sgo-lede{margin:16px 0 0;font-size:1rem;line-height:1.6;color:rgba(255,255,255,.78)}
.sgo-b{margin:12px 0 24px;font-size:1rem;font-weight:800;color:#fff}
.sgo-v{width:100%;max-width:280px;margin-inline:auto}
.lp{display:block;width:100%;height:auto;font-family:inherit}
.lp-r{fill:none;stroke:rgba(255,255,255,.14);stroke-width:2}
.lp-a{fill:none;stroke:var(--mint);stroke-width:3;stroke-linecap:round;stroke-dasharray:.22 .78;transform-box:fill-box;transform-origin:center;animation:ahSpin 9s linear infinite}
.lp-go circle{fill:rgba(91,251,194,.1);stroke:rgba(91,251,194,.6);stroke-width:1.4}
.lp-go text{fill:#fff;font-size:14px;font-weight:800}.lp-go text.s{font-size:10.5px;font-weight:600;fill:rgba(255,255,255,.7)}
.lp-n circle{fill:#0F3352;stroke:var(--mint);stroke-width:1.5}
.lp-n{color:var(--mint)}
.sgo-in{margin:0 0 6px;font-size:.92rem;color:rgba(255,255,255,.78)}
.sgo-i{display:grid;grid-template-columns:auto 1fr;gap:14px;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.1)}
.sgo-i>span{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;border:1px solid rgba(91,251,194,.45);color:var(--mint)}.sgo-i>span svg{width:18px;height:18px}
.sgo-i b{display:block;font-size:1rem;font-weight:800;color:#fff}
.sgo-i p{margin:4px 0 0;font-size:.88rem;line-height:1.55;color:rgba(255,255,255,.8)}
.sgo-note{margin:14px 0 0;font-size:.8rem;line-height:1.55;color:rgba(255,255,255,.6)}
@media (prefers-reduced-motion:reduce){.lp-a{animation:none}}
/* requested fixes: clear chip, visible CTA, centred heading + text in its column */
.ai-sgo .clabel{background:var(--mint);border-color:var(--mint);color:var(--navy)}
.ai-sgo .clabel em{background:var(--navy)}
.sgo-l{display:flex;flex-direction:column;align-items:center;text-align:center}

/* ---------- restored: FAQ font size ---------- */
.cv .h2{font-size:clamp(1.7rem,2.6vw,2.2rem)}

/* ---------- restored: Approach staircase alignment ---------- */
@media (min-width:960px){.st-i{justify-content:flex-end}.st-tx{flex:none}}


/* ---------- 4. In practice: banner-style illustration ---------- */
.ai-ip{background:var(--white)}
.jy{position:relative;max-width:1240px;margin:0 auto}
.jy-top{text-align:left}
.jy .tagline{display:inline-flex;font-size:.72rem;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--turq-d)}
.jy-top p{margin:8px 0 0;font-size:.95rem;line-height:1.6;color:#000;max-width:86ch}
.bn{position:relative;margin:20px 0 0;border-radius:120px 20px 120px 20px;overflow:hidden;
  background:radial-gradient(120% 110% at 30% 0%,#174A6E 0%,var(--navy) 46%,var(--navy-2) 100%);box-shadow:0 34px 70px -40px rgba(16,43,70,.75)}
@media (max-width:899px){.bn{border-radius:64px 14px 64px 14px}}
.b-svg{display:block;width:100%;height:auto;font-family:inherit}
.b-m{display:none;max-width:460px;margin:0 auto}
@media (max-width:899px){.b-d{display:none}.b-m{display:block}}
.b-grid circle{fill:rgba(127,198,221,.18)}
.b-tt circle{fill:var(--mint)}
.b-tt text{font-size:15px;font-weight:800;fill:#fff}
.b-tt text.n{font-size:12px;fill:var(--navy)}
.b-in rect{fill:#fff}
.b-in circle{fill:#EAF4F7}
.b-in .t{font-size:13.5px;font-weight:800;fill:var(--navy)}
.b-in .s{font-size:11.5px;font-weight:600;fill:#4F6370}
.b-in{animation:bIn 9s ease infinite}
.b-in.i1{animation-delay:.25s}.b-in.i2{animation-delay:.5s}
@keyframes bIn{0%,100%{transform:translateX(0)}4%{transform:translateX(6px)}9%{transform:translateX(0)}}
.b-fl{fill:none;stroke:#7FC6DD;stroke-width:1.6;stroke-dasharray:3 7;opacity:.7}
.b-p{fill:var(--mint)}
.b-br{fill:none;stroke:#7FC6DD;stroke-width:1.6;stroke-dasharray:4 5}
.b-q rect{fill:rgba(255,255,255,.06);stroke:#7FC6DD;stroke-width:1.4;stroke-dasharray:4 4}
.b-q text{font-size:12px;font-weight:700;fill:#CDE9F2}
.b-q text.sm{font-size:11.5px}
.b-core .ring{fill:none;stroke:#7FC6DD;stroke-width:1.4;stroke-dasharray:3 8;transform-box:fill-box;transform-origin:center;animation:ahSpin 22s linear infinite}
.b-core .pulse{fill:var(--mint);opacity:.25;transform-box:fill-box;transform-origin:center;animation:ahPulse 2.4s ease-out infinite}
.b-core text{font-size:13px;font-weight:800;fill:#fff;letter-spacing:.1em}
.b-chip rect{fill:rgba(255,255,255,.08);stroke:rgba(127,198,221,.45);stroke-width:1.2}
.b-chip circle{fill:rgba(91,251,194,.18)}
.b-chip text{font-size:12.5px;font-weight:700;fill:#fff}
.b-chip text.n{font-size:10.5px;font-weight:800;fill:var(--mint)}
.b-chip rect,.b-chip circle,.b-chip text{animation:bChip 9s ease infinite}
.b-chip.c1 rect,.b-chip.c1 circle,.b-chip.c1 text{animation-delay:1.1s}
.b-chip.c2 rect,.b-chip.c2 circle,.b-chip.c2 text{animation-delay:2.2s}
@keyframes bChip{0%,8%,26%,100%{fill:rgba(255,255,255,.08)}10%,24%{fill:#5BFBC2}}
.b-chip text{animation-name:bChipT}.b-chip circle{animation-name:bChipC}
@keyframes bChipT{0%,8%,26%,100%{fill:#fff}10%,24%{fill:#102B46}}
@keyframes bChipC{0%,8%,26%,100%{fill:rgba(91,251,194,.18)}10%,24%{fill:#fff}}
.b-chip text.n{animation-name:bChipN}
@keyframes bChipN{0%,8%,26%,100%{fill:#5BFBC2}10%,24%{fill:#102B46}}
.b-rec>rect{fill:#fff}
.b-rec .h{font-size:14px;font-weight:800;fill:var(--navy)}
.b-rec .l{font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;fill:#7A8D97}
.b-rec .bg{fill:#EEF5F8}
.b-rec .v{font-size:12.5px;font-weight:800;fill:var(--navy);opacity:0;animation:bVal 9s ease infinite}
.b-rec .v.f0{animation-delay:3.3s}.b-rec .v.f1{animation-delay:3.6s}.b-rec .v.f2{animation-delay:3.9s}
@keyframes bVal{0%{opacity:0}4%,62%{opacity:1}68%,100%{opacity:0}}
.b-ok{opacity:0;animation:bOk 9s ease infinite;animation-delay:4.8s}
.b-ok rect{fill:var(--mint)}
.b-ok text{font-size:11.5px;font-weight:800;fill:var(--navy)}
@keyframes bOk{0%{opacity:0}4%,46%{opacity:1}52%,100%{opacity:0}}
.b-act rect{fill:rgba(255,255,255,.08);stroke:rgba(127,198,221,.45);stroke-width:1.2}
.b-act>circle{fill:#0F3352;stroke:rgba(91,251,194,.5)}
.b-act text{font-size:13px;font-weight:800;fill:#fff}
.b-act .ck{opacity:0;animation:bCk 9s ease infinite}
.b-act .ck circle{fill:var(--mint)}
.b-act.a0 .ck{animation-delay:5.8s}.b-act.a1 .ck{animation-delay:6.2s}.b-act.a2 .ck{animation-delay:6.6s}
@keyframes bCk{0%{opacity:0}4%,30%{opacity:1}36%,100%{opacity:0}}
@media (prefers-reduced-motion:reduce){
  .b-in,.b-core .ring,.b-core .pulse,.b-chip rect,.b-chip circle,.b-chip text{animation:none}.b-p{display:none}
  .b-rec .v,.b-ok,.b-act .ck{animation:none;opacity:1}
}
/* captions */
.jc{display:grid;gap:12px;margin-top:18px}
@media (min-width:640px){.jc{grid-template-columns:1fr 1fr}}
@media (min-width:1000px){.jc{grid-template-columns:repeat(4,1fr);gap:16px}}
.jc-i{padding:16px 16px 14px;border-radius:16px;background:#F6FBFC;border:1px solid #DCE7EC;border-top:3px solid var(--mint)}
.jc-i h3{display:flex;align-items:center;gap:9px;margin:0 0 8px;font-size:1rem;font-weight:800;letter-spacing:-.02em;color:var(--navy)}
.jc-i h3 span{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--navy);color:var(--mint);font-size:.72rem;font-weight:800}
.jc-i p{margin:0;font-size:.85rem;line-height:1.55;color:#000}
.jc-l{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:7px}
.jc-l li{font-size:.83rem;line-height:1.5;color:#000}
.jc-l b{display:block;font-size:.85rem;font-weight:800;color:var(--navy)}
.jc-n{counter-reset:jn}
.jc-n li{position:relative;padding-left:22px;counter-increment:jn}
.jc-n li::before{content:counter(jn);position:absolute;left:0;top:1px;display:grid;place-items:center;width:16px;height:16px;border-radius:50%;background:#EAF4F7;color:var(--turq);font-size:.65rem;font-weight:800}
.jc-x{margin-top:10px!important;padding:8px 10px;border-radius:10px;border:1.5px dashed var(--turq);font-size:.8rem!important}
.jc-x b{color:var(--navy)}
.jy-foot{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:18px}
.jy-foot span{display:flex;align-items:center;gap:9px;padding:8px 16px;border-radius:999px;background:var(--navy);font-size:.86rem;font-weight:700;color:#fff}
.jy-foot i{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:rgba(91,251,194,.16);color:var(--mint)}.jy-foot i svg{width:14px;height:14px}
@media (max-width:760px){.jy-foot{flex-direction:column;align-items:stretch}}
@media (prefers-reduced-motion:reduce){.j-lane,.j-d .beam,.j-m .beam{animation:none}}
.b-fl{fill:none;stroke:#7FC6DD;stroke-width:2;stroke-dasharray:none;opacity:1;stroke-linecap:round}
.b-core .ring{stroke-dasharray:none;stroke-opacity:.35}
.b-fl{stroke-dasharray:1 7;stroke-width:2.6;stroke-linecap:round}
/* close: example tasks read as examples, CTA stands apart */
.exs li{background:#fff;color:var(--navy);border:1px solid var(--line-2);box-shadow:0 10px 22px -18px rgba(16,43,70,.45)}
.exs li i{background:#EAF4F7;color:var(--turq)}
.ai-close .close-cta{margin-top:34px}
/* approach bars: icon + texture so they don't look empty */
.st-ic{display:none}
@media (min-width:960px){
  .st-bar{overflow:hidden;background:linear-gradient(180deg,#1B7699 0%,#102B46 100%)}
  .st-bar::after{content:"";position:absolute;inset:5px 0 0;background-image:repeating-linear-gradient(135deg,rgba(255,255,255,.06) 0 2px,transparent 2px 12px);pointer-events:none}
  .st-ic{position:absolute;left:18px;top:20px;z-index:1;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:rgba(91,251,194,.16);border:1px solid rgba(91,251,194,.5);color:var(--mint)}
  .st-ic svg{width:21px;height:21px}
  .st-bar span{z-index:1}
  .st-i:hover .st-ic{background:var(--mint);color:var(--navy)}
}
@media (min-width:960px){.st-bar span{left:auto;right:18px;top:24px;bottom:auto;font-size:1.5rem;line-height:1}}
/* ---------- Approach: picture + numbered list (layout from supplied reference) ---------- */
.ap{display:grid;gap:30px}
@media (min-width:1000px){.ap{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:start}}
.ai-appr .ap .sec-head{align-items:flex-start;text-align:left;margin-inline:0;margin-bottom:0}
.ai-appr .ap .sec-head .h2,.ai-appr .ap .sec-head .lede{margin-inline:0}
.ap-img{margin:26px 0 0;border-radius:24px;overflow:hidden;aspect-ratio:799/623;box-shadow:0 30px 60px -40px rgba(16,43,70,.55)}
.ap-img img{display:block;width:100%;height:100%;object-fit:cover}
.ap-list{list-style:none;margin:0;padding:0}
.ap-list li{display:grid;grid-template-columns:84px minmax(0,1fr);gap:16px;padding:28px 0;border-bottom:1px solid var(--line)}
.ap-list li:first-child{padding-top:6px}
.ap-list li:last-child{border-bottom:0;padding-bottom:0}
.ap-n{font-size:clamp(2.4rem,3.6vw,3.1rem);font-weight:800;line-height:1;letter-spacing:-.04em;color:var(--turq)}
.ap-list h3{margin:4px 0 0;font-size:1.2rem;font-weight:800;letter-spacing:-.02em;line-height:1.3;color:var(--navy)}
.ap-list p{margin:12px 0 0;font-size:.95rem;line-height:1.7;color:#000}
@media (max-width:620px){.ap-list li{grid-template-columns:56px minmax(0,1fr);gap:10px;padding:22px 0}}

/* ---------- Why You Need It v2: AI hub with six benefits around it ---------- */
.hb{display:grid;gap:28px;align-items:center;margin-top:10px}
@media (min-width:1000px){.hb{grid-template-columns:minmax(0,42fr) minmax(0,58fr);gap:50px}}
.hb-ring{position:relative;width:100%;max-width:400px;aspect-ratio:1;margin:0 auto}
.hb-svg{position:absolute;inset:0;width:100%;height:100%}
.hb-orb{fill:none;stroke:#D7E5EA;stroke-width:3}
.hb-prog{fill:none;stroke:var(--mint);stroke-width:4;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--hk,0) / 6);transition:stroke-dashoffset .6s var(--ease)}
.hb-sp{stroke:#D7E5EA;stroke-width:1.5;stroke-dasharray:3 6}
.hb-core{position:absolute;left:50%;top:50%;display:grid;place-items:center;width:32%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(120% 120% at 30% 20%,#1D6A90,#102B46 60%,#0B2038);box-shadow:0 0 0 10px rgba(91,251,194,.14),0 24px 40px -20px rgba(16,43,70,.7)}
.hb-core b{font-size:clamp(1.6rem,3vw,2.2rem);font-weight:900;letter-spacing:-.04em;color:var(--mint)}
.hb-core::after{content:"";position:absolute;inset:-14px;border-radius:50%;border:2px dashed rgba(27,118,153,.35);animation:hbSpin 24s linear infinite}
@keyframes hbSpin{to{transform:rotate(360deg)}}
.hb-n{position:absolute;left:50%;top:50%;width:17%;aspect-ratio:1;margin:0;padding:0;border:0;background:none;cursor:pointer;transform:translate(-50%,-50%) rotate(var(--a)) translate(187.5%) rotate(calc(-1 * var(--a)))}
.hb-n span{display:grid;place-items:center;width:100%;height:100%;border-radius:50%;background:#fff;border:2px solid #C9DCE3;color:var(--turq);box-shadow:0 14px 26px -18px rgba(16,43,70,.6);transition:background .35s,border-color .35s,color .35s,transform .35s var(--ease)}
.hb-n span svg{width:42%;height:42%}
.hb-n:hover span{border-color:var(--turq);transform:scale(1.06)}
.hb-n[aria-pressed="true"] span{background:var(--navy);border-color:var(--mint);color:var(--mint);transform:scale(1.12);box-shadow:0 0 0 6px rgba(91,251,194,.22),0 18px 30px -16px rgba(16,43,70,.7)}
.hb-n:focus-visible{outline:none}.hb-n:focus-visible span{outline:2.5px solid var(--turq);outline-offset:3px}
.hb-ps{position:relative;display:grid}
.hb-p{grid-area:1/1;padding:24px 26px;border-radius:24px;background:#fff;border:1px solid var(--line);box-shadow:0 30px 60px -46px rgba(16,43,70,.6);visibility:hidden;opacity:0;transform:translateY(12px);transition:opacity .45s var(--ease),transform .45s var(--ease),visibility 0s .45s}
.hb-p.on{visibility:visible;opacity:1;transform:none;transition:opacity .45s var(--ease),transform .45s var(--ease)}
.hb-flow{display:flex;align-items:center;gap:10px;padding:14px;border-radius:18px;background:linear-gradient(160deg,#EEF6F9,#DDEEF3)}
.hb-in,.hb-out{flex:1;min-width:0;display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:14px;background:#fff;border:1px solid #D3E1E7}
.hb-in svg,.hb-out svg{flex:none;width:30px;height:30px;padding:6px;border-radius:9px;background:#EAF4F7;color:var(--turq)}
.hb-out{border-color:var(--mint)}
.hb-out svg{background:var(--mint);color:var(--navy)}
.hb-flow em{font-style:normal;font-size:.84rem;font-weight:800;line-height:1.25;color:var(--navy);min-width:0}
.hb-ai{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--navy);color:var(--mint);font-weight:900;font-size:.9rem}
.hb-ar{flex:none;position:relative;width:26px;height:2px;background:repeating-linear-gradient(90deg,var(--turq) 0 4px,transparent 4px 8px);background-size:16px 2px;animation:hbFlow 1s linear infinite}
.hb-ar::after{content:"";position:absolute;right:-2px;top:-4px;border-left:7px solid var(--turq);border-top:5px solid transparent;border-bottom:5px solid transparent}
@keyframes hbFlow{to{background-position:16px 0}}
.hb-p h3{margin:20px 0 0;font-size:1.35rem;font-weight:800;letter-spacing:-.025em;color:var(--navy)}
.hb-p p{margin:10px 0 0;font-size:1rem;line-height:1.7;color:#000}
.hb-dots{display:flex;gap:7px;margin-top:16px;justify-content:center}
.hb-dots i{width:8px;height:8px;border-radius:50%;background:#C9D9E0;transition:width .3s,background .3s}
.hb-dots i.on{width:22px;border-radius:4px;background:var(--turq)}
@media (max-width:560px){.hb-flow{flex-wrap:wrap}.hb-in,.hb-out{flex-basis:100%}.hb-ar{display:none}.hb-ai{display:none}.hb-ring{max-width:300px}}
@media (prefers-reduced-motion:reduce){.hb-p,.hb-prog{transition:none}.hb-core::after,.hb-ar{animation:none}}
.ai-signs .pile-note{text-align:center;margin-top:26px}

/* ---------- Why You Need It v3: simple picture cards ---------- */
.ag{display:grid;gap:16px;margin-top:6px}
@media (min-width:700px){.ag{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1100px){.ag{grid-template-columns:repeat(3,minmax(0,1fr))}}
.ag-c{display:flex;flex-direction:column;border-radius:22px;background:#fff;border:1px solid var(--line);overflow:hidden;box-shadow:0 26px 50px -42px rgba(16,43,70,.6);transition:transform .35s var(--ease),box-shadow .35s,border-color .35s}
.ag-c:hover{transform:translateY(-5px);border-color:var(--mint);box-shadow:0 32px 60px -40px rgba(16,43,70,.6)}
.ag-g{display:block;width:100%;height:auto;background:radial-gradient(120% 140% at 0% 0%,#1D6A90 0%,#102B46 60%,#0B2038 100%);padding:10px 6%}
.ag-b{padding:18px 20px 22px}
.ag-b h3{margin:0;font-size:1.06rem;font-weight:800;letter-spacing:-.015em;line-height:1.3;color:var(--navy)}
.ag-b p{margin:8px 0 0;font-size:.9rem;line-height:1.6;color:#33485A}
.ag-doc{fill:rgba(255,255,255,.1);stroke:rgba(127,198,221,.55);stroke-width:1.2}
.ag-doc.hi{fill:#fff;stroke:var(--mint);stroke-width:1.5}
.ag-l{fill:rgba(205,233,242,.55)}
.ag-lm{fill:#C9DCE3}
.ag-lm:first-of-type{fill:var(--navy)}
.ag-lw{fill:var(--navy)}
.ag-tag{fill:var(--mint)}
.ag-env{fill:none;stroke:rgba(205,233,242,.8);stroke-width:1.5;stroke-linejoin:round}
.ag-box{fill:none;stroke:rgba(205,233,242,.6);stroke-width:1.2}
.ag-ok{fill:var(--mint)}
.ag-okt{fill:none;stroke:var(--navy);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.ag-mag{fill:rgba(16,43,70,.6);stroke:var(--mint);stroke-width:2.5}
.ag-magh{stroke:var(--mint);stroke-width:3;stroke-linecap:round}
.ag-bub{fill:#fff;stroke:var(--mint);stroke-width:1.5}
.ag-pen{fill:var(--mint)}
.ag-cmp{stroke:rgba(205,233,242,.6);stroke-width:2;stroke-dasharray:3 4}
.ag-ar,.ag-ah{fill:none;stroke:var(--mint);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.ag-sp path{fill:var(--mint)}
.ag-sp{transform-box:fill-box;transform-origin:center;animation:agTw 2.6s ease-in-out infinite}
.ag-c:nth-child(2n) .ag-sp{animation-delay:-1.3s}
@keyframes agTw{0%,100%{opacity:1;scale:1}50%{opacity:.5;scale:.75}}
@media (max-width:699px){.ag{grid-auto-flow:column;grid-auto-columns:84%;grid-template-columns:none;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin:0 -20px;padding:4px 20px 8px}.ag::-webkit-scrollbar{display:none}.ag>*{scroll-snap-align:start}}
@media (prefers-reduced-motion:reduce){.ag-sp{animation:none}}
.ag-g{height:118px;padding:10px 0}
/* picture cards v2: labelled "in → AI → out" */
.ag-f{display:flex;align-items:stretch;gap:8px;padding:16px;background:radial-gradient(120% 140% at 0% 0%,#1D6A90 0%,#102B46 60%,#0B2038 100%)}
.ag-in,.ag-out{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:12px 8px;border-radius:14px;text-align:center}
.ag-in{background:rgba(255,255,255,.08);border:1px dashed rgba(205,233,242,.45)}
.ag-out{background:#fff;border:1px solid var(--mint);box-shadow:0 0 0 4px rgba(91,251,194,.18)}
.ag-in span,.ag-out span{display:grid;place-items:center;width:40px;height:40px;border-radius:12px}
.ag-in span{background:rgba(205,233,242,.14);color:#CDE9F2}
.ag-out span{background:var(--mint);color:var(--navy)}
.ag-in span svg,.ag-out span svg{width:21px;height:21px}
.ag-in em,.ag-out em{font-style:normal;font-size:.8rem;font-weight:800;line-height:1.25}
.ag-in em{color:#E3F2F7}
.ag-out em{color:var(--navy)}
.ag-mid{flex:none;display:flex;align-items:center;gap:4px}
.ag-mid b{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--mint);color:var(--navy);font-size:.8rem;font-weight:900;box-shadow:0 0 0 5px rgba(91,251,194,.2);animation:agPulse 2.4s ease-in-out infinite}
@keyframes agPulse{0%,100%{box-shadow:0 0 0 5px rgba(91,251,194,.2)}50%{box-shadow:0 0 0 9px rgba(91,251,194,.06)}}
.ag-mid .ag-ar{position:relative;display:block;width:12px;height:2px;background:var(--mint)}
.ag-mid .ag-ar:last-child::after{content:"";position:absolute;right:-3px;top:-4px;border-left:6px solid var(--mint);border-top:5px solid transparent;border-bottom:5px solid transparent}
@media (prefers-reduced-motion:reduce){.ag-mid b{animation:none}}
@media (max-width:420px){.ag-f{padding:12px;gap:6px}.ag-in,.ag-out{padding:10px 4px}.ag-in em,.ag-out em{font-size:.74rem}.ag-mid .ag-ar{width:6px}.ag-mid b{width:32px;height:32px;font-size:.72rem}}
.ag-f{min-height:150px}
/* picture cards v3: light, relatable illustrations */
.gx{display:block;width:100%;height:auto;aspect-ratio:2/1;background:linear-gradient(160deg,#F2FBF8 0%,#E6F4F8 100%);border-bottom:1px solid var(--line);font-family:inherit}
.gx-flow{animation:gxFlow 1.2s linear infinite}
@keyframes gxFlow{to{stroke-dashoffset:-18}}
.gx-sp{transform-box:fill-box;transform-origin:center;animation:agTw 2.6s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){.gx-flow,.gx-sp{animation:none}}
.gx{aspect-ratio:12/5;padding:4px 0}
.ai-ip .jy-top{text-align:center;display:flex;justify-content:center}.ai-ip .jy-top>div{max-width:820px;margin:0 auto}.ai-ip .jy-top p{margin-left:auto;margin-right:auto}
.ai-ip .jy-top>div{max-width:1000px}.ai-ip .jy-top p{max-width:none}
.ai-plat.band--paper{background:var(--paper)}
.ai-start2{padding-block:clamp(28px,4vw,48px)}