/* AI DFY home page layer. Loaded after site.css. Animates transform, opacity, clip-path and stroke-dashoffset only. */
:root{--tick-minor:rgba(171,166,188,.5);--ring-band:rgba(255,255,255,.06)}
html[data-theme=light]{--tick-minor:rgba(18,16,25,.38);--ring-band:rgba(18,16,25,.06)}
.mood{position:fixed;inset:0;z-index:-1;pointer-events:none;background-color:var(--t0);transition:background-color 1.1s ease}
.mood[data-t="1"]{background-color:var(--t1)}
.mood[data-t="2"]{background-color:var(--t2)}
.mood[data-t="3"]{background-color:var(--t3)}
@media (prefers-reduced-motion:reduce){.mood{transition:none}}

/* ---------- HERO: Circuit Field ---------- */
#hero{position:relative;overflow:hidden;min-height:780px;border-bottom:1px solid var(--line);touch-action:pan-y}
#heroCv{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:0}
.hero-in{position:relative;z-index:1;pointer-events:none;min-height:inherit}
.hero-in a,.hero-in button{pointer-events:auto}
.hdr-row{display:flex;justify-content:space-between;align-items:center;min-height:80px;gap:16px}
.hdr-row .ann{margin-left:auto;margin-right:8px}
.hero-copy{padding-top:56px;padding-bottom:150px}
.hero-copy .lbl{margin-top:0}
#hero .h1{font-size:clamp(46px,5.3vw,76px);line-height:.97;letter-spacing:-.03em;max-width:8.6em}
.hw{display:inline-block;opacity:0;transform:translateY(.4em);animation:rise .75s cubic-bezier(.2,.7,.2,1) forwards;padding-bottom:.14em;margin-bottom:-.14em}
.hw.g{background:var(--grad-t);-webkit-background-clip:text;background-clip:text;color:transparent}
@keyframes rise{to{opacity:1;transform:none}}
#hero .lead{margin-top:28px;max-width:30em;font-size:20px}
.cyc{display:inline-grid;overflow:hidden;vertical-align:bottom;color:var(--text);font-weight:500}
.cyc>span{grid-area:1/1;opacity:0;transform:translateY(100%);transition:transform .6s cubic-bezier(.2,.7,.2,1),opacity .5s ease;white-space:nowrap}
.cyc>span.on{opacity:1;transform:none}
.cyc>span.out{opacity:0;transform:translateY(-100%)}
.hero-cta{display:flex;flex-wrap:wrap;align-items:center;gap:18px 26px;margin-top:36px}
#heroNote{max-width:26em}
.forget{background:none;border:0;padding:0 6px;margin-left:6px;min-height:44px;color:var(--cyan);font:inherit;font-size:15px;text-decoration:underline;cursor:pointer}
.forget:hover{color:var(--text)}
.forget:focus-visible{outline:3px solid var(--cyan);outline-offset:2px}
.hero-tags{position:absolute;z-index:1;pointer-events:none;right:max(48px,calc((100% - 1240px) / 2 + 48px));bottom:26px;display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.hero-tags .ann{margin:0}
@media (prefers-reduced-motion:reduce){.hw{animation:none;opacity:1;transform:none}.cyc>span{transition:none}}

/* ---------- icons ---------- */
.ico{width:24px;height:24px;flex:none;display:block;overflow:visible}
.ico-m{width:30px;height:30px}
.ico-l{width:44px;height:44px}
.rico{color:var(--cyan);display:inline-flex}
.tw{display:flex;align-items:center;gap:14px;min-width:0}
.tw>span:last-child{min-width:0}

/* ---------- PROBLEM: scroll story ---------- */
.story{grid-template-areas:"copy vis" "quotes vis";row-gap:48px;align-items:start}
.pcopy{grid-area:copy}
.pvis{grid-area:vis;align-self:stretch}
.pquotes{grid-area:quotes;padding-top:8px}
.stick{position:sticky;top:max(88px,calc(50vh - 280px))}
.morph{margin:0;border:1px solid var(--line);border-radius:18px;background:var(--surface);padding:16px 16px 12px}
.morph svg{display:block;width:100%;height:auto;max-height:70vh}
.morph figcaption{display:grid;font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);padding:6px 4px 0}
.morph figcaption span{grid-area:1/1;transition:opacity .3s}
.m-sheet{fill:var(--surface-2);stroke:var(--cyan);stroke-opacity:.6;stroke-width:1.2}
.m-ln{stroke:var(--cyan);stroke-opacity:.38;stroke-width:2;stroke-linecap:round;fill:none}
.m-lb{font:500 10px 'IBM Plex Mono',monospace;letter-spacing:.1em;fill:var(--cyan)}
.m-tang{fill:none;stroke-width:1.4;stroke-linecap:round}
.m-str{fill:none;stroke:var(--cyan);stroke-opacity:.6;stroke-width:1.4;stroke-linecap:round}
.m-tk{fill:none;stroke:var(--vio-t);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1}
.m-ring{fill:var(--surface-2);stroke:var(--vio-t);stroke-width:1.4}
.story .qlist li{padding:34px 0}
.arts{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;margin:0 0 44px}
.art{margin:0}
.art .frame{overflow:hidden;border:1px solid var(--line);border-radius:14px;background:var(--surface);aspect-ratio:16/11}
.art .px{height:100%}
.art svg{display:block;width:100%;height:100%;transform:scale(1.12);transition:transform 1.8s cubic-bezier(.2,.7,.2,1)}
.art:hover svg{transform:scale(1.22)}
.art figcaption{font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-top:10px}
.a-c{stroke:var(--cyan)}.a-v{stroke:var(--vio-t)}.a-f{fill:var(--surface-2)}.a-n{fill:none}
@media (prefers-reduced-motion:no-preference){
 .js .art .frame{clip-path:inset(0 100% 0 0);transition:clip-path 1s cubic-bezier(.2,.7,.2,1)}
 .js .art.in .frame{clip-path:inset(0 0 0 0)}
}

/* tick that draws when an option is chosen */
.opt .tk{margin-right:10px;vertical-align:-3px;color:var(--cyan)}
.opt.on::before{display:none}

/* ---------- METHOD ring ---------- */
.ringwrap{touch-action:pan-y;-webkit-user-select:none;user-select:none}
.rl{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.rl-rot,.rl-in{will-change:transform}
.r-line{fill:none;stroke:var(--line);stroke-width:1}
.r-band{fill:none;stroke:var(--ring-band);stroke-width:18}
.r-core{fill:var(--surface-2)}
.r-dash{fill:none;stroke:var(--cyan);stroke-opacity:.35;stroke-dasharray:2 6}
.r-tk1{fill:none;stroke:var(--tick-minor);stroke-width:1.2}
.r-tk2{fill:none;stroke:var(--cyan);stroke-opacity:.75;stroke-width:2.4}
.r-arc{fill:none;stroke-width:18;stroke-linecap:round}
.r-txt{font:11.5px 'IBM Plex Mono',monospace;letter-spacing:3.2px;fill:var(--muted)}
.ltr{transition:background .2s,color .2s,border-color .2s}
.core{z-index:1}
.coreico{color:var(--cyan);margin-bottom:6px;display:flex;justify-content:center;min-height:30px}
.pkrow{display:flex;align-items:flex-end;gap:22px}
.pico{color:var(--cyan);padding-bottom:20px}
.panel .k{background:var(--grad-t);-webkit-background-clip:text;background-clip:text}
.dd-wrap{display:none}

/* ---------- decks (phones) ---------- */
.deck{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 -22px;padding:0 22px 10px;scroll-padding:0 22px;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
.dcard{flex:0 0 84%;scroll-snap-align:start;border:1px solid var(--line);border-radius:18px;background:var(--surface-2);padding:24px 22px;min-height:290px;display:flex;flex-direction:column}
.dcard .dtop{display:flex;justify-content:space-between;align-items:flex-start;color:var(--cyan)}
.dcard .k{font-family:var(--hf);font-weight:700;font-size:84px;line-height:.85;letter-spacing:-.04em;background:var(--grad-t);-webkit-background-clip:text;background-clip:text;color:transparent;margin:18px 0 12px;display:inline-block;padding-bottom:.08em}
.dcard p{margin:6px 0 0;color:var(--muted);font-size:17px}
.dcard .wk{margin-top:auto;padding-top:16px;color:var(--cyan);font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase}
.deckbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:14px}
.dcount{font-family:var(--mono);font-size:14px;letter-spacing:.1em;color:var(--muted);margin:0}
.ddots{display:flex;gap:2px}
.ddot{width:28px;height:44px;background:none;border:0;padding:0;cursor:pointer;display:flex;align-items:center;justify-content:center}
.ddot i{display:block;width:8px;height:8px;border-radius:50%;background:var(--field);opacity:.55;transition:transform .2s,opacity .2s,background .2s}
.ddot[aria-current=true] i{background:var(--cyan);opacity:1;transform:scale(1.5)}
.ddot:focus-visible{outline:3px solid var(--cyan);outline-offset:-2px;border-radius:6px}
.mdeckw,.ocount{display:none}

/* ---------- calculator: gauge and bars ---------- */
.live{display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px 28px;align-items:center;border:1px solid var(--line);border-radius:16px;background:var(--surface-2);padding:22px 26px;margin-bottom:20px}
.gauge{position:relative;width:150px;height:150px}
.gauge svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(135deg)}
.g-track,.g-val{fill:none;stroke-width:9;stroke-linecap:round;stroke-dasharray:.75 1}
.g-track{stroke:var(--line)}
.g-val{stroke:url(#gg);stroke-dashoffset:var(--go,.75);transition:stroke-dashoffset .7s cubic-bezier(.2,.7,.2,1)}
.gt{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.gt b{font-family:var(--hf);font-size:30px;line-height:1;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.gt span{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-top:4px}
.bars{display:grid;gap:14px}
.brow{display:grid;grid-template-columns:minmax(0,1fr);gap:6px}
.brow span{font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.bt{height:8px;border-radius:4px;background:var(--line);overflow:hidden}
.bf{height:100%;background:var(--grad);transform-origin:0 50%;transform:scaleX(var(--f,.01));transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.live .cap{grid-column:1/-1;margin:0;font-size:14px}
.sl input[type=range]{-webkit-appearance:none;appearance:none;background:transparent;height:48px;width:100%;margin:0;cursor:pointer;accent-color:var(--cyan)}
.sl input[type=range]::-webkit-slider-runnable-track{height:4px;border-radius:2px;background:linear-gradient(90deg,var(--cyan) var(--pct,0%),rgba(128,124,150,.45) var(--pct,0%))}
.sl input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:26px;height:26px;margin-top:-11px;border-radius:50%;background:var(--grad);border:2px solid var(--bg);transition:transform .18s cubic-bezier(.2,.7,.2,1)}
.sl input[type=range]:hover::-webkit-slider-thumb{transform:scale(1.12)}
.sl input[type=range]:active::-webkit-slider-thumb{transform:scale(1.22)}
.sl input[type=range]::-moz-range-track{height:4px;border-radius:2px;background:rgba(128,124,150,.45)}
.sl input[type=range]::-moz-range-progress{height:4px;border-radius:2px;background:var(--cyan)}
.sl input[type=range]::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:var(--violet);border:2px solid var(--bg);transition:transform .18s}
.sl input[type=range]:hover::-moz-range-thumb{transform:scale(1.12)}
.sl input[type=range]:focus-visible{outline:3px solid var(--cyan);outline-offset:2px;border-radius:8px}

/* ---------- plan ---------- */
.pq{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;margin-top:28px}
.pcard{--text:#F2F0F7;--muted:#ABA6BC;--cyan:#8FE3E8;--line:rgba(255,255,255,.12);--surface-2:#17142A;position:relative;margin-top:36px;max-width:820px;border-radius:18px;padding:36px;background:#100E18;color:#F2F0F7;border:1px solid rgba(255,255,255,.12);opacity:0;transform:translateY(14px);transition:opacity .6s ease,transform .6s ease}
.pcard.in{opacity:1;transform:none}
.pcard[hidden]{display:none}
.pcard::before{content:"";position:absolute;top:-1px;left:18px;right:18px;height:1px;background:linear-gradient(90deg,#8FE3E8,#A27BDD 55%,#B64CDC)}
.pc-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:22px}
.pc-head img{display:block;width:57px;height:50px}
.pc-head .qnum{color:#8FE3E8}
.pstages{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.pstages li{border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:12px 14px;display:grid;grid-template-columns:auto 1fr;column-gap:12px;align-items:center;min-height:64px}
.pstages .pk{font-family:var(--hf);font-weight:700;font-size:28px;line-height:1;color:#F2F0F7;grid-row:1/4}
.pstages .pw{font-weight:600;font-size:16px;line-height:1.2}
.pstages .pwk{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#ABA6BC;line-height:1.3}
.pstages li.hot{border-color:#8FE3E8;background:#17142A}
.pstages li.hot .pk{color:#8FE3E8}
.pstages li.hot .pwk{color:#8FE3E8}
.plines{list-style:none;margin:22px 0 0;padding:0;border-top:1px solid rgba(255,255,255,.12)}
.plines li{padding:14px 0;border-bottom:1px solid rgba(255,255,255,.12);font-size:17px;line-height:1.45}
.pc-act{display:flex;flex-wrap:wrap;gap:14px;margin-top:26px;align-items:center}
.pc-act .btn{flex:0 0 auto}
.gbtn2{display:inline-flex;align-items:center;justify-content:center;min-height:58px;padding:0 26px;border-radius:10px;border:1px solid rgba(255,255,255,.28);background:transparent;color:#F2F0F7;font:600 18px/1 'IBM Plex Sans',system-ui,sans-serif;cursor:pointer}
.gbtn2:hover{border-color:#8FE3E8}
.gbtn2:active{transform:scale(.97)}
.gbtn2:focus-visible{outline:3px solid #8FE3E8;outline-offset:3px}
.psave{margin:12px 0 0;min-height:1.4em;font-size:15px;color:#ABA6BC}
.popt{display:block;width:100%;text-align:left;min-height:52px;padding:12px 16px;margin:0 0 10px;border:1px solid var(--line);background:transparent;border-radius:10px;font:inherit;font-size:16px;line-height:1.35;color:var(--text);cursor:pointer;transition:border-color .15s,background .15s}
.popt:hover{border-color:var(--teal)}
.popt.on{border-color:var(--cyan);background:var(--bg)}
.popt:focus-visible{outline:3px solid var(--cyan);outline-offset:3px}
.popt .tk{margin-right:10px;vertical-align:-3px;color:var(--cyan)}

/* ---------- offer: remembered row ---------- */
.row .mine-tag{display:none;font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--cyan);margin-top:2px}
.row.mine .mine-tag{display:block}
.row.mine{position:relative}
.row.mine::before{content:"";position:absolute;left:-14px;top:14px;bottom:14px;width:3px;border-radius:2px;background:var(--cyan)}
.row button:disabled{color:var(--text);cursor:default}

/* ---------- chapter guide ---------- */
.guide a{font-size:0!important;width:14px!important;height:14px!important}
.guide a::after{content:"";width:4px;height:4px;border-radius:50%;background:currentColor}
.guide a[aria-current=true]{background:var(--cyan)!important}
.guide a[aria-current=true]::after{background:var(--bg)}
.guide .gl{font-size:12px!important}
.guide ol{gap:10px!important}
.guide{position:fixed;right:10px;top:50%;transform:translateY(-50%);z-index:80;display:none}
.guide ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.guide a{position:relative;display:flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;border:1px solid var(--line);background:var(--bg);color:var(--muted);font:500 11px/1 var(--mono);text-decoration:none;transition:border-color .2s,color .2s}
.guide a:hover,.guide a:focus-visible{border-color:var(--cyan);color:var(--text)}
.guide a[aria-current=true]{border-color:var(--cyan);color:var(--cyan)}
.guide a:focus-visible{outline:3px solid var(--cyan);outline-offset:2px}
.guide .gl{position:absolute;right:34px;top:50%;transform:translate(8px,-50%);opacity:0;pointer-events:none;white-space:nowrap;background:var(--bg);color:var(--text);border:1px solid var(--line);border-radius:6px;padding:6px 10px;font:500 12px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;transition:opacity .15s,transform .2s}
.guide a:hover .gl,.guide a:focus-visible .gl{opacity:1;transform:translate(0,-50%)}
.gpill{display:none}
@media (min-width:901px){.guide.show{display:block}}

/* ---------- phones ---------- */
@media (max-width:900px){
 #hero{min-height:860px}
 .hdr-row .ann{display:none}
 .hdr-row .theme-sw{margin-left:auto}
 .hero-copy{padding-top:28px;padding-bottom:330px}
 #hero .h1{font-size:46px}
 #hero .lead{font-size:19px;margin-top:24px}
 .hero-cta{margin-top:30px}
 .hero-tags{left:0;right:0;bottom:22px;align-items:center}
 .story{grid-template-areas:"copy" "vis" "quotes";row-gap:32px}
 .stick{position:relative;top:auto}
 .story .qlist li{padding:22px 0}
 .arts{gap:12px}
 .live{grid-template-columns:minmax(0,1fr);justify-items:center;gap:20px}
 .live .bars{width:100%}
 .pq,.pstages{grid-template-columns:minmax(0,1fr)}
 .pq{gap:24px}
 .pcard{padding:26px 20px}
 .pc-act .btn,.gbtn2{width:100%}
 .methodsplit{display:none}
 .mdeckw{display:block;margin-top:44px}
 .stack{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 -22px;padding:0 22px 10px;scroll-padding:0 22px;border-top:0;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
 .row{flex:0 0 84%;scroll-snap-align:start;border:1px solid var(--line);border-radius:16px;background:var(--surface);padding:18px 18px 20px;display:flex;flex-direction:column}
 .row button{grid-template-columns:minmax(0,1fr) auto;gap:6px 12px;min-height:0;padding:0}
 .row .no{grid-column:1;grid-row:1}
 .row .tw{grid-column:1/-1;grid-row:2;margin-top:8px}
 .row .v{display:block;grid-column:2;grid-row:1;font-size:16px;color:var(--cyan)}
 .row .pm{display:none}
 .row .body,.row .body[hidden]{display:block;padding:12px 0 0;font-size:17px}
 .row.mine::before{left:0;top:14px;bottom:14px}
 .ocount{display:block;margin:6px 0 0}
 .guide{display:none!important}
 .gpill{position:fixed;top:10px;left:10px;z-index:92}
 .gpill.show{display:block}
 .gbtn{display:inline-flex;align-items:center;gap:8px;min-height:44px;max-width:68vw;padding:0 14px;border:1px solid var(--line);border-radius:999px;background:var(--bg);color:var(--text);font:500 12px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;cursor:pointer}
 .gbtn span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 .gbtn svg{flex:none;width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s}
 .gbtn[aria-expanded=true] svg{transform:rotate(180deg)}
 .gbtn:focus-visible{outline:3px solid var(--cyan);outline-offset:3px}
 .gmenu{margin:8px 0 0;list-style:none;padding:6px;background:var(--bg);border:1px solid var(--line);border-radius:14px;max-height:62vh;overflow:auto;width:min(80vw,300px)}
 .gmenu[hidden]{display:none}
 .gmenu a{display:flex;align-items:center;min-height:44px;padding:0 12px;color:var(--text);text-decoration:none;font-size:16px;border-radius:8px}
 .gmenu a[aria-current=true]{color:var(--cyan)}
 .gmenu a:focus-visible{outline:3px solid var(--cyan);outline-offset:-3px}
}
@media (max-width:420px){.dcard{flex-basis:88%}.row{flex-basis:88%}}
@media (prefers-reduced-motion:reduce){
 .pcard{transition:none;opacity:1;transform:none}
 .g-val,.bf,.art svg{transition:none}
}
.ringwrap .coreico svg{position:static;inset:auto;width:30px;height:30px}
.pstages .pst{color:#8FE3E8;font-weight:500}
.logo-img,.logo img,.pc-head img{border-radius:8px}

@media (min-width:901px){.arts{display:none}}