:root,[data-theme="dark"]{
 --bg:#06110E;--bg2:#0A1713;--fg:#fff;--fg2:#B8BFDB;--fg3:#7A82A6;
 --edge:rgba(255,255,255,.10);--edge2:rgba(255,255,255,.055);
 --glass:rgba(255,255,255,.045);--glass2:rgba(255,255,255,.025);--glasshi:rgba(255,255,255,.14);
 --shadow:0 34px 90px -34px rgba(0,12,8,.9);--scheme:dark;--aurora:.28;
}
[data-theme="light"]{
 --bg:#F6EFE4;--bg2:#FFF9F0;--fg:#12131A;--fg2:#4B4E62;--fg3:#74778E;
 --edge:rgba(18,19,26,.12);--edge2:rgba(18,19,26,.065);
 --glass:rgba(255,255,255,.70);--glass2:rgba(255,255,255,.48);--glasshi:rgba(255,255,255,.96);
 --shadow:0 32px 74px -36px rgba(67,53,42,.28);--scheme:light;--aurora:.5;
}
:root{
 --peri:#7C7CFF;--aqua:#3FE0C8;--coral:#FF9E7A;--violet:#C08BFF;--peri2:#4B4BE8;
 --ff-d:"Bricolage Grotesque",ui-sans-serif,system-ui,sans-serif;
 --ff:"Manrope",ui-sans-serif,system-ui,sans-serif;
 --ff-m:"JetBrains Mono",ui-monospace,monospace;
 --max:1260px;--gut:22px;--e:cubic-bezier(.22,.68,.24,1);--spring:cubic-bezier(.16,1,.3,1);
}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:94px;overflow-x:clip}
body{margin:0;color:var(--fg);font-family:var(--ff);font-size:16.5px;line-height:1.62;font-weight:450;background:
radial-gradient(1200px 780px at 50% -10%,rgba(12,91,67,.16),transparent 62%),
linear-gradient(180deg,#06110E 0%,var(--bg) 38%,#04100D 100%);color-scheme:var(--scheme);overflow-x:hidden;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}button,input{font:inherit;color:inherit}button{border:0;background:none;cursor:pointer}
.wrap{width:100%;max-width:var(--max);margin:auto;padding:0 var(--gut)}
h1,h2,h3,h4,p{margin:0}h1,h2,h3,h4{font-family:var(--ff-d);line-height:1;letter-spacing:-.04em;text-wrap:balance}
.d1{font-size:clamp(3.05rem,7.2vw,6.15rem);line-height:.93;letter-spacing:-.058em;font-weight:760}
.d2{font-size:clamp(2.15rem,4.7vw,4.1rem);line-height:.98}.lede{font-size:clamp(1.03rem,1.5vw,1.2rem);color:var(--fg2);max-width:62ch}
.grad{background:linear-gradient(100deg,var(--peri),var(--aqua) 46%,var(--coral));-webkit-background-clip:text;background-clip:text;color:transparent}
.kicker{display:inline-flex;align-items:center;gap:9px;font-family:var(--ff-m);font-size:.64rem;letter-spacing:.13em;text-transform:uppercase;color:var(--fg3)}
.kicker:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--peri);box-shadow:0 0 0 4px color-mix(in srgb,var(--peri) 18%,transparent)}
.muted{color:var(--fg3)}
.glass{position:relative;background:var(--glass);border:1px solid var(--edge);border-radius:22px;box-shadow:var(--shadow);overflow:hidden}
.glass:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(155deg,var(--glasshi),transparent 28%);opacity:.34}
.aurora{position:fixed;inset:0;z-index:-2;pointer-events:none;opacity:var(--aurora);overflow:hidden}.aurora i{position:absolute;border-radius:50%;filter:blur(104px);opacity:.24;animation:float 32s var(--e) infinite}
.aurora i:nth-child(1){width:50vw;height:50vw;left:-12vw;top:-16vw;background:var(--peri)}
.aurora i:nth-child(2){width:45vw;height:45vw;right:-13vw;top:7vw;background:var(--aqua);animation-delay:-10s}
.aurora i:nth-child(3){width:38vw;height:38vw;left:27vw;bottom:-18vw;background:var(--violet);animation-delay:-18s}
@keyframes float{50%{transform:translate3d(6vw,5vh,0) scale(1.12)}}
.grid{position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.035;background-image:linear-gradient(var(--fg) 1px,transparent 1px),linear-gradient(90deg,var(--fg) 1px,transparent 1px);background-size:64px 64px;mask-image:radial-gradient(115% 82% at 50% 0,#000 15%,transparent 80%)}
.progress{position:fixed;inset:0 0 auto;height:2px;z-index:180}.progress i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--peri),var(--aqua),var(--coral));box-shadow:0 0 14px var(--peri)}
.topbar{position:sticky;top:0;z-index:120;padding-top:12px}.topin{height:62px;display:flex;align-items:center;gap:20px;padding:0 9px 0 17px;border:1px solid var(--edge);border-radius:16px;background:color-mix(in srgb,var(--bg) 74%,transparent);backdrop-filter:blur(20px) saturate(1.45);-webkit-backdrop-filter:blur(20px) saturate(1.45)}
.brand{display:flex;align-items:center;gap:9px;font-family:var(--ff-d);font-weight:800;letter-spacing:-.04em;font-size:1.08rem}.mark{width:25px;height:25px;border-radius:8px;background:linear-gradient(140deg,var(--peri),var(--aqua));box-shadow:0 0 18px -4px var(--peri)}.brand small{font-family:var(--ff);font-weight:500;color:var(--fg3);font-size:.72rem;letter-spacing:0}
.nav{margin-left:auto;display:flex;gap:3px}.nav a{padding:8px 11px;border-radius:10px;font-size:.84rem;color:var(--fg2)}.nav a:hover,.nav a.active{color:var(--fg);background:var(--glass)}
.acts{display:flex;gap:7px;align-items:center}.icon{width:38px;height:38px;border-radius:11px;border:1px solid var(--edge);background:var(--glass2);display:grid;place-items:center}.icon svg{width:16px;height:16px}.theme .moon{display:none}[data-theme=light] .theme .moon{display:block}[data-theme=light] .theme .sun{display:none}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 20px;border-radius:13px;font-weight:700;font-size:.91rem;border:1px solid transparent;transition:transform .25s var(--e),box-shadow .3s var(--e),background .3s var(--e)}.btn:hover{transform:translateY(-2px)}.pri{background:linear-gradient(120deg,var(--peri),var(--peri2));color:#fff;box-shadow:0 15px 35px -16px var(--peri)}.ghost{border-color:var(--edge);background:var(--glass2)}.btnrow{display:flex;flex-wrap:wrap;gap:10px}
.burger{display:none}.drawer{display:none}
.hero{padding:clamp(62px,8vw,116px) 0 72px}.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:58px;align-items:center}.hero-copy .kicker{margin-bottom:22px}.hero-copy h1{max-width:10.5ch}.hero-copy .lede{margin-top:24px}.hero-copy .btnrow{margin-top:28px}
.hero-hud{padding:18px;min-height:440px;display:flex;flex-direction:column}.hud-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:5px 5px 15px;border-bottom:1px solid var(--edge2)}.hud-head small{font-family:var(--ff-m);font-size:.48rem;letter-spacing:.12em;color:var(--fg3)}.live{display:inline-flex;align-items:center;gap:7px;font-family:var(--ff-m);font-size:.48rem;color:var(--aqua)}.live i{width:6px;height:6px;border-radius:50%;background:var(--aqua);box-shadow:0 0 0 0 color-mix(in srgb,var(--aqua) 55%,transparent);animation:live 1.8s ease-out infinite}@keyframes live{100%{box-shadow:0 0 0 9px transparent}}
.hud-metrics{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:12px}.hud-metric{padding:15px;border:1px solid var(--edge2);border-radius:15px;background:var(--glass2)}.hud-metric small{font-family:var(--ff-m);font-size:.43rem;letter-spacing:.09em;color:var(--fg3)}.hud-metric strong{display:block;font-family:var(--ff-d);font-size:2rem;letter-spacing:-.055em;margin-top:8px}.hud-metric strong.good{color:var(--aqua)}
.hud-visual{margin-top:12px;position:relative;min-height:210px;border:1px solid var(--edge2);border-radius:17px;background:color-mix(in srgb,var(--bg2) 52%,transparent);overflow:hidden}.hud-visual:before{content:"";position:absolute;inset:0;background:radial-gradient(45% 70% at 76% 50%,color-mix(in srgb,var(--aqua) 8%,transparent),transparent 70%)}
.scatter{position:absolute;left:18px;top:18px;width:48%;height:174px}.scatter-chip{position:absolute;padding:7px 10px;border:1px solid color-mix(in srgb,var(--coral) 24%,var(--edge));border-radius:999px;background:var(--glass);font-family:var(--ff-m);font-size:.42rem;color:var(--fg2);animation:drift 7s var(--e) infinite;white-space:nowrap}.scatter-chip:nth-child(2){animation-delay:-1.3s}.scatter-chip:nth-child(3){animation-delay:-2.7s}.scatter-chip:nth-child(4){animation-delay:-4.4s}.scatter-chip:nth-child(5){animation-delay:-5.3s}.scatter-chip:nth-child(6){animation-delay:-6.2s}@keyframes drift{50%{transform:translate3d(8px,-8px,0)}}.hud-line{position:absolute;left:52%;top:25px;bottom:25px;width:1px;background:linear-gradient(transparent,var(--edge),transparent)}.hub{position:absolute;right:23px;top:50%;transform:translateY(-50%);width:150px;height:150px;border-radius:50%;display:grid;place-items:center;text-align:center;border:1px solid color-mix(in srgb,var(--aqua) 35%,var(--edge));background:radial-gradient(circle,color-mix(in srgb,var(--aqua) 7%,var(--bg)),var(--bg));box-shadow:0 0 50px -27px var(--aqua)}.hub:before,.hub:after{content:"";position:absolute;border-radius:50%;border:1px solid color-mix(in srgb,var(--aqua) 18%,transparent);animation:ring 3.4s ease-out infinite}.hub:before{inset:-12px}.hub:after{inset:-24px;animation-delay:-1.7s}@keyframes ring{0%{transform:scale(.92);opacity:.7}100%{transform:scale(1.14);opacity:0}}.hub b{font-family:var(--ff-d);font-size:1.35rem}.hub small{display:block;font-family:var(--ff-m);font-size:.4rem;color:var(--aqua);letter-spacing:.08em}
.sec{padding:clamp(80px,9vw,132px) 0;position:relative}.sec-head{max-width:830px;margin-bottom:38px}.sec-head .kicker{margin-bottom:18px}.sec-head h2{margin-bottom:18px}.ghost-no{position:absolute;right:max(var(--gut),calc((100vw - var(--max))/2 + var(--gut)));top:76px;font-family:var(--ff-m);font-size:clamp(3.6rem,9vw,7.2rem);line-height:1;color:color-mix(in srgb,var(--fg3) 10%,transparent);letter-spacing:-.08em;pointer-events:none}
.builder{display:grid;grid-template-columns:1fr 300px;gap:13px;align-items:start}.groups{display:grid;grid-template-columns:repeat(2,1fr);gap:11px}.group{padding:15px}.group-head{display:flex;align-items:center;justify-content:space-between;padding:4px 3px 12px;border-bottom:1px solid var(--edge2)}.group-head b{font-family:var(--ff-m);font-size:.52rem;letter-spacing:.11em;color:var(--fg3)}.group-head span{font-family:var(--ff-m);font-size:.42rem;color:var(--fg3)}
.choice-list{display:grid;gap:7px;margin-top:10px}.choice{position:relative;width:100%;text-align:left;display:grid;grid-template-columns:42px 1fr auto;gap:12px;align-items:center;padding:12px;border:1px solid var(--edge2);border-radius:15px;background:var(--glass2);transition:transform .35s var(--spring),border-color .3s var(--e),background .3s var(--e),box-shadow .35s var(--e);overflow:hidden}.choice:hover{transform:translateX(4px);border-color:var(--edge)}.choice[aria-pressed=true]{border-color:color-mix(in srgb,var(--tint) 54%,var(--edge));background:linear-gradient(105deg,color-mix(in srgb,var(--tint) 9%,var(--glass)),var(--glass2));box-shadow:0 18px 40px -30px var(--tint)}.choice[aria-pressed=true]:after{content:"";position:absolute;inset:0;background:linear-gradient(95deg,transparent,color-mix(in srgb,var(--tint) 14%,transparent),transparent);transform:translateX(-100%);animation:sweep .65s var(--spring)}@keyframes sweep{to{transform:translateX(100%)}}
.c-icon{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;border:1px solid var(--edge);background:color-mix(in srgb,var(--tint) 8%,var(--glass2));color:var(--tint);transition:.35s var(--spring)}.choice[aria-pressed=true] .c-icon{transform:scale(1.06);box-shadow:0 0 0 5px color-mix(in srgb,var(--tint) 9%,transparent),0 0 18px -7px var(--tint)}.c-icon svg{width:19px;height:19px}.choice b{display:block;font-family:var(--ff-d);font-size:.92rem;letter-spacing:-.025em;line-height:1.08}.choice small{display:block;color:var(--fg3);font-size:.66rem;line-height:1.35;margin-top:4px}.check{width:27px;height:27px;border-radius:9px;border:1px solid var(--edge);display:grid;place-items:center;font-family:var(--ff-m);font-size:.54rem;color:transparent;background:var(--glass2);transition:.3s var(--spring)}.choice[aria-pressed=true] .check{color:#04130f;border-color:var(--aqua);background:var(--aqua);transform:scale(1.06)}
.mix{position:sticky;top:90px;padding:18px;min-height:440px}.mix-top{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-bottom:14px;border-bottom:1px solid var(--edge2)}.mix-top b{font-family:var(--ff-d);font-size:1.05rem}.mix-count{font-family:var(--ff-m);font-size:.48rem;color:var(--aqua)}.mix-tray{display:flex;flex-wrap:wrap;align-content:flex-start;gap:7px;min-height:210px;padding:14px 0}.mix-chip{display:inline-flex;align-items:center;gap:6px;padding:7px 9px;border:1px solid color-mix(in srgb,var(--peri) 28%,var(--edge));border-radius:999px;background:var(--glass2);font-family:var(--ff-m);font-size:.43rem;color:var(--fg2);animation:chipIn .5s var(--spring) both}@keyframes chipIn{from{opacity:0;transform:translateY(8px) scale(.92)}}.mix-chip i{width:5px;height:5px;border-radius:50%;background:var(--aqua)}.mix-empty{display:grid;place-items:center;text-align:center;color:var(--fg3);font-size:.76rem;min-height:200px}.mix-foot{margin-top:auto;padding-top:13px;border-top:1px solid var(--edge2)}.mix-foot .btn{width:100%}.mix-note{font-size:.64rem;color:var(--fg3);margin-top:9px;text-align:center}
.compare-shell{padding:16px}.compare-top{display:grid;grid-template-columns:1fr auto;gap:16px;align-items:end;padding:8px 8px 16px;border-bottom:1px solid var(--edge2)}.compare-top h3{font-size:1.35rem}.compare-top p{color:var(--fg3);font-size:.75rem;margin-top:5px}.seatmini{display:flex;align-items:center;gap:11px;padding:8px 10px;border:1px solid var(--edge);border-radius:13px;background:var(--glass2)}.seatmini label{font-family:var(--ff-m);font-size:.43rem;color:var(--fg3)}.seatmini input[type=number]{width:82px;border:0;background:transparent;text-align:right;font-family:var(--ff-d);font-size:1.15rem;font-weight:700}.seatmini input[type=range]{width:150px;accent-color:var(--aqua)}
.compare-head,.cmp-row{display:grid;grid-template-columns:1.1fr 1fr 54px 1fr 110px;gap:10px;align-items:center}.compare-head{padding:13px 10px 9px;font-family:var(--ff-m);font-size:.42rem;letter-spacing:.1em;color:var(--fg3)}.cmp-body{display:grid;gap:7px}.cmp-row{position:relative;padding:10px;border:1px solid var(--edge2);border-radius:15px;background:var(--glass2);min-height:80px;overflow:hidden;animation:rowIn .55s var(--spring) both}@keyframes rowIn{from{opacity:0;transform:translateY(10px) scale(.99)}}.cmp-row:after{content:"";position:absolute;left:48%;right:22%;top:50%;height:1px;background:linear-gradient(90deg,color-mix(in srgb,var(--coral) 20%,transparent),color-mix(in srgb,var(--aqua) 30%,transparent));opacity:.7}.flowdot{position:absolute;top:calc(50% - 3px);left:49%;width:6px;height:6px;border-radius:50%;background:var(--aqua);box-shadow:0 0 11px var(--aqua);animation:rowFlow 2.8s linear infinite;z-index:3}@keyframes rowFlow{0%{transform:translateX(0);opacity:0}18%,82%{opacity:1}100%{transform:translateX(210px);opacity:0}}
.need-title b{display:block;font-family:var(--ff-d);font-size:.89rem;line-height:1.08}.need-title small{color:var(--fg3);font-size:.62rem}.prod{display:grid;grid-template-columns:34px 1fr;gap:9px;align-items:center}.prodmark{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;border:1px solid color-mix(in srgb,var(--coral) 24%,var(--edge));background:color-mix(in srgb,var(--coral) 6%,var(--glass));font-family:var(--ff-d);font-size:.72rem}.prod b{display:block;font-size:.76rem}.prod small{display:block;font-family:var(--ff-m);font-size:.42rem;color:var(--fg3);margin-top:2px}.arrow{display:grid;place-items:center;color:var(--aqua);font-size:1rem;z-index:4}.theos-cell b{font-family:var(--ff-d);font-size:.82rem}.included{display:inline-flex;margin-top:4px;padding:3px 6px;border-radius:999px;border:1px solid color-mix(in srgb,var(--aqua) 28%,var(--edge));font-family:var(--ff-m);font-size:.38rem;color:var(--aqua)}.rowcost{text-align:right;font-family:var(--ff-m);font-size:.66rem;color:var(--fg2);z-index:4}.rowcost small{display:block;color:var(--fg3);font-size:.4rem}
.dupe{color:var(--fg3);font-size:.61rem}.cmp-empty{padding:45px;text-align:center;color:var(--fg3);font-size:.82rem;border:1px dashed var(--edge);border-radius:15px}
.compare-total{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}.total{padding:18px;border-radius:17px;border:1px solid var(--edge2);background:var(--glass2)}.total.good{border-color:color-mix(in srgb,var(--aqua) 28%,var(--edge));background:color-mix(in srgb,var(--aqua) 4%,var(--glass))}.total small{font-family:var(--ff-m);font-size:.43rem;letter-spacing:.08em;color:var(--fg3)}.total strong{display:block;font-family:var(--ff-d);font-size:clamp(2.2rem,4.5vw,4rem);letter-spacing:-.065em;line-height:.95;margin-top:8px}.total em{font-style:normal;color:var(--fg3);font-size:.7rem}
.math{display:grid;grid-template-columns:.92fr 1.08fr;gap:13px}.team-card,.graph-card{padding:22px}.team-card h3,.graph-card h3{font-size:1.4rem;margin:8px 0 9px}.team-card p,.graph-card p{color:var(--fg3);font-size:.76rem}.seatBig{font-family:var(--ff-d);font-size:clamp(3.5rem,7vw,6rem);letter-spacing:-.075em;line-height:.92;margin-top:28px}.seatBig small{font-family:var(--ff);font-size:.72rem;letter-spacing:0;color:var(--fg3);margin-left:6px}.range{width:100%;margin-top:25px;accent-color:var(--aqua)}.ticks{display:flex;justify-content:space-between;font-family:var(--ff-m);font-size:.43rem;color:var(--fg3);margin-top:6px}.rate-line{display:flex;justify-content:space-between;gap:10px;border-top:1px solid var(--edge2);margin-top:20px;padding-top:14px;font-size:.72rem;color:var(--fg3)}.rate-line b{color:var(--aqua)}
.bars{height:250px;display:flex;align-items:end;justify-content:center;gap:44px;padding:18px 10px 0;border-bottom:1px solid var(--edge2);position:relative}.barcol{height:100%;width:min(34%,150px);display:flex;flex-direction:column;justify-content:end;align-items:center;gap:8px}.barv{width:100%;height:10%;border-radius:18px 18px 5px 5px;transition:height .9s var(--spring);position:relative}.barv.stack{background:linear-gradient(180deg,var(--coral),color-mix(in srgb,var(--coral) 32%,transparent));box-shadow:0 -15px 35px -25px var(--coral)}.barv.theos{background:linear-gradient(180deg,var(--aqua),color-mix(in srgb,var(--aqua) 28%,transparent));box-shadow:0 -15px 35px -25px var(--aqua)}.barv:before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(110deg,rgba(255,255,255,.22),transparent 28%)}.barprice{font-family:var(--ff-d);font-size:1.05rem}.barlabel{font-family:var(--ff-m);font-size:.42rem;color:var(--fg3);letter-spacing:.08em}.gap{margin-top:14px;padding:17px;border:1px solid color-mix(in srgb,var(--aqua) 22%,var(--edge));border-radius:16px;background:linear-gradient(105deg,color-mix(in srgb,var(--aqua) 5%,var(--glass2)),color-mix(in srgb,var(--peri) 4%,var(--glass2)));display:flex;align-items:center;justify-content:space-between;gap:12px}.gap span{font-size:.75rem;color:var(--fg2)}.gap strong{font-family:var(--ff-d);font-size:1.7rem;color:var(--aqua);letter-spacing:-.05em}.gap small{display:block;font-family:var(--ff-m);font-size:.37rem;color:var(--fg3);letter-spacing:.08em}
.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.metric{padding:19px;min-height:150px}.metric small{font-family:var(--ff-m);font-size:.43rem;letter-spacing:.08em;color:var(--fg3)}.metric strong{display:block;font-family:var(--ff-d);font-size:2.45rem;letter-spacing:-.06em;margin-top:27px}.metric p{font-size:.69rem;color:var(--fg3);margin-top:5px}.metric.good strong{color:var(--aqua)}
.cap-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.cap{padding:18px;min-height:178px;animation:capIn .5s var(--spring) both}@keyframes capIn{from{opacity:0;transform:translateY(10px)}}.cap small{font-family:var(--ff-m);font-size:.43rem;color:var(--aqua);letter-spacing:.09em}.cap h3{font-size:1.05rem;margin-top:24px}.cap p{font-size:.72rem;color:var(--fg3);margin-top:7px}.cap footer{margin-top:13px;padding-top:10px;border-top:1px solid var(--edge2);font-family:var(--ff-m);font-size:.39rem;color:var(--fg3)}
.sources{margin-top:12px;padding:16px 18px;border:1px solid var(--edge2);border-radius:16px;background:var(--glass2)}.sources summary{cursor:pointer;font-family:var(--ff-m);font-size:.56rem;letter-spacing:.08em;color:var(--fg2)}.sources-list{display:grid;gap:8px;margin-top:13px}.source-row{display:grid;grid-template-columns:1fr auto;gap:10px;padding-top:8px;border-top:1px solid var(--edge2);font-size:.7rem}.source-row small{color:var(--fg3)}.source-row a{color:var(--aqua)}.edit{width:78px;border:1px solid var(--edge);border-radius:8px;background:var(--glass2);padding:5px;text-align:right;font-family:var(--ff-m);font-size:.62rem}
.final{padding:clamp(92px,12vw,170px) 0;text-align:center}.final h2{max-width:13ch;margin:auto}.final .lede{margin:22px auto 0}.summary{max-width:900px;margin:34px auto 0;padding:22px;text-align:left}.summary-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.summary-box{padding:13px;border:1px solid var(--edge2);border-radius:13px;background:var(--glass2)}.summary-box small{font-family:var(--ff-m);font-size:.4rem;letter-spacing:.08em;color:var(--fg3)}.summary-box strong{display:block;font-family:var(--ff-d);font-size:1.3rem;margin-top:7px}.final .btnrow{justify-content:center;margin-top:22px}
.dock{position:fixed;left:50%;bottom:max(12px,env(safe-area-inset-bottom));transform:translateX(-50%) translateY(130%);z-index:90;width:min(95vw,820px);padding:8px 9px 8px 14px;border:1px solid var(--edge);border-radius:16px;background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:blur(18px);box-shadow:0 20px 52px -24px rgba(0,0,0,.78);display:grid;grid-template-columns:1fr auto auto;gap:12px;align-items:center;transition:transform .55s var(--spring)}.dock.show{transform:translateX(-50%)}.dock-copy small{font-family:var(--ff-m);font-size:.39rem;color:var(--fg3)}.dock-copy b{display:block;font-size:.76rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dock-delta{text-align:right}.dock-delta small{display:block;font-family:var(--ff-m);font-size:.36rem;color:var(--fg3)}.dock-delta b{font-family:var(--ff-d);font-size:1.06rem;color:var(--aqua)}
.toast{position:fixed;right:18px;bottom:18px;z-index:160;padding:10px 12px;border:1px solid var(--edge);border-radius:11px;background:var(--bg2);font-family:var(--ff-m);font-size:.52rem;color:var(--fg2);opacity:0;transform:translateY(10px);pointer-events:none;transition:.3s}.toast.show{opacity:1;transform:none}
.fly{position:fixed;z-index:200;pointer-events:none;padding:7px 10px;border-radius:999px;border:1px solid color-mix(in srgb,var(--aqua) 35%,var(--edge));background:var(--bg2);font-family:var(--ff-m);font-size:.42rem;color:var(--aqua);box-shadow:0 0 30px -10px var(--aqua)}
.footer{border-top:1px solid var(--edge);padding:48px 0 28px;background:var(--glass2)}.foot{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;color:var(--fg3);font-size:.78rem}
.rv{opacity:0;transform:translateY(22px);transition:opacity .8s var(--spring),transform .8s var(--spring)}.rv.in{opacity:1;transform:none}
@media(max-width:1000px){.nav{display:none}.burger{display:grid}.hero-grid{grid-template-columns:1fr}.hero-hud{min-height:410px}.builder{grid-template-columns:1fr}.mix{position:relative;top:auto;min-height:0}.groups{grid-template-columns:repeat(2,1fr)}.math{grid-template-columns:1fr}.metrics{grid-template-columns:repeat(2,1fr)}.cap-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){:root{--gut:13px}.topbar{padding-top:8px}.topin{height:58px;padding-left:13px}.brand small{display:none}.acts .btn,.acts .motion{display:none}.drawer{display:block;position:fixed;inset:0;z-index:150;visibility:hidden;pointer-events:none}.drawer.open{visibility:visible;pointer-events:auto}.scrim{position:absolute;inset:0;background:rgba(0,0,0,.58);opacity:0;transition:.3s}.drawer.open .scrim{opacity:1}.panel{position:absolute;right:0;top:0;bottom:0;width:min(86vw,350px);background:var(--bg2);padding:22px;transform:translateX(102%);transition:.42s var(--spring);border-left:1px solid var(--edge)}.drawer.open .panel{transform:none}.panel a{display:block;padding:14px 8px;border-bottom:1px solid var(--edge2);font-family:var(--ff-d);font-size:1.08rem}.panel .btn{margin-top:18px;border-bottom:0}.hero{padding-top:50px}.hero-hud{min-height:390px}.groups{grid-template-columns:1fr}.compare-shell{padding:10px}.compare-top{grid-template-columns:1fr}.seatmini{justify-content:space-between}.compare-head{display:none}.cmp-row{grid-template-columns:1fr 1fr;gap:10px;padding:13px}.cmp-row:after,.flowdot,.arrow{display:none}.need-title{grid-column:1/-1;padding-bottom:8px;border-bottom:1px solid var(--edge2)}.prod,.theos-cell{min-width:0}.rowcost{grid-column:1/-1;text-align:left;padding-top:8px;border-top:1px solid var(--edge2)}.compare-total{grid-template-columns:1fr}.hud-line{display:none}.scatter{width:52%}.hub{right:15px;width:135px;height:135px}.cap-grid{grid-template-columns:1fr}.metrics{grid-template-columns:1fr 1fr}.summary-grid{grid-template-columns:1fr 1fr}.dock{width:calc(100vw - 18px);grid-template-columns:1fr auto}.dock-delta{display:none}.dock .btn{padding:10px 13px;min-height:42px;font-size:.77rem}.ghost-no{display:none}}
@media(max-width:460px){.hud-metrics{grid-template-columns:1fr 1fr}.scatter{display:none}.hub{left:50%;right:auto;transform:translate(-50%,-50%)}.metrics{grid-template-columns:1fr 1fr}.choice{grid-template-columns:38px 1fr auto;padding:10px}.c-icon{width:38px;height:38px}.summary-grid{grid-template-columns:1fr 1fr}}
@media(prefers-reduced-motion:reduce){html:not(.motion-full) *{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.12s!important}}
html.motion-paused *{animation-play-state:paused!important}

/* =====================================================================
   V66 PRICING REFINEMENT
   Bigger type · cleaner outcome selection · living calculator guide
   · genuinely expanding / contracting comparison chart
   ===================================================================== */
@media(min-width:1200px){
  :root{--max:1380px;--gut:30px}
  body{font-size:18px}
  .hero-grid{grid-template-columns:1fr 1fr;gap:76px}
  .hero-hud{min-height:520px;padding:24px}
  .hud-head small{font-size:.68rem}
  .live{font-size:.65rem}
  .hud-metric{padding:19px}
  .hud-metric small{font-size:.62rem}
  .hud-metric strong{font-size:2.55rem}
  .hud-visual{min-height:270px}
  .scatter{left:24px;top:22px;height:215px}
  .scatter-chip{
    padding:9px 13px;
    font-size:.62rem;
    letter-spacing:.01em;
    font-weight:650;
    color:var(--fg2);
    background:color-mix(in srgb,var(--bg2) 82%,transparent);
    border-color:color-mix(in srgb,var(--coral) 34%,var(--edge));
    box-shadow:0 10px 26px -20px rgba(0,0,0,.8);
  }
  .hub{width:184px;height:184px;right:32px}
  .hub b{font-size:1.7rem}.hub small{font-size:.57rem}
  .sec-head{max-width:930px}.sec-head .lede{font-size:1.18rem}
}

/* Selection: one category at a time, large and quiet. */
.builder,.groups{display:none!important}
.selector-shell{padding:0;overflow:visible}
.category-tabs{
  display:grid;grid-template-columns:repeat(4,1fr);gap:7px;
  padding:12px;border-bottom:1px solid var(--edge2);
  background:color-mix(in srgb,var(--bg2) 30%,transparent);
  position:relative;z-index:2
}
.category-tab{
  min-height:64px;padding:12px 14px;border:1px solid transparent;border-radius:14px;
  text-align:left;color:var(--fg2);transition:.3s var(--spring);position:relative
}
.category-tab:hover{background:var(--glass2)}
.category-tab[aria-selected=true]{
  background:var(--glass);border-color:color-mix(in srgb,var(--tint) 38%,var(--edge));
  box-shadow:0 14px 34px -27px var(--tint)
}
.category-tab small{
  display:block;font-family:var(--ff-m);font-size:.58rem;letter-spacing:.08em;color:var(--fg3)
}
.category-tab b{
  display:block;font-family:var(--ff-d);font-size:1rem;letter-spacing:-.025em;margin-top:5px
}
.category-tab .tab-count{
  position:absolute;right:11px;top:10px;min-width:24px;height:24px;padding:0 6px;border-radius:999px;
  display:grid;place-items:center;font-family:var(--ff-m);font-size:.55rem;color:var(--fg3);
  border:1px solid var(--edge2);background:var(--glass2)
}
.category-tab[aria-selected=true] .tab-count{color:var(--aqua);border-color:color-mix(in srgb,var(--aqua) 28%,var(--edge))}
.selector-main{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:0;align-items:stretch}
.choice-stage{padding:18px;display:grid;gap:10px;align-content:start;min-height:445px}
.choice-stage-intro{padding:6px 4px 10px}
.choice-stage-intro small{font-family:var(--ff-m);font-size:.63rem;letter-spacing:.1em;color:var(--aqua)}
.choice-stage-intro h3{font-size:1.5rem;margin-top:8px}
.choice-stage-intro p{font-size:.92rem;color:var(--fg3);margin-top:8px;max-width:55ch}
.choice{
  grid-template-columns:58px 1fr auto!important;min-height:104px;padding:17px 18px!important;border-radius:18px!important
}
.c-icon{width:58px!important;height:58px!important;border-radius:16px!important}
.c-icon svg{width:25px!important;height:25px!important}
.choice b{font-size:1.15rem!important}
.choice small{font-size:.84rem!important;line-height:1.45!important;max-width:58ch}
.check{width:34px!important;height:34px!important;border-radius:11px!important;font-size:.72rem!important}
#mix{
  position:relative!important;top:auto!important;min-height:445px!important;border-left:1px solid var(--edge2);
  padding:20px;display:flex;flex-direction:column;background:color-mix(in srgb,var(--bg2) 26%,transparent)
}
.mix-top small{display:block;font-family:var(--ff-m);font-size:.58rem;letter-spacing:.1em;color:var(--fg3);margin-bottom:4px}
.mix-top b{font-size:1.16rem}
.mix-count{font-size:.6rem!important}
.mix-tray{min-height:225px!important;gap:8px!important;padding:18px 0!important}
.mix-chip{font-size:.62rem!important;padding:9px 11px!important}
.mix-foot{margin-top:auto!important}
.mix-note{font-size:.76rem!important;line-height:1.45}
.mini-action{
  width:100%;margin-top:8px;padding:10px;border-radius:11px;border:1px solid var(--edge2);
  color:var(--fg3);font-size:.78rem;background:var(--glass2)
}
.mini-action:hover{color:var(--fg);border-color:var(--edge)}

/* The comparison should read like an actual comparison, not micro copy. */
.compare-shell{padding:22px}
.compare-top h3{font-size:1.65rem}
.compare-top p{font-size:.92rem;max-width:72ch}
.seatmini label{font-size:.58rem}
.seatmini input[type=number]{font-size:1.4rem;width:92px}
.compare-head{
  grid-template-columns:1.15fr 1fr 64px 1fr 145px;
  padding:17px 14px 10px;font-size:.58rem
}
.cmp-row{
  grid-template-columns:1.15fr 1fr 64px 1fr 145px;
  min-height:112px;padding:16px 14px;border-radius:18px
}
.need-title b{font-size:1.08rem}.need-title small{font-size:.78rem;line-height:1.42;margin-top:5px;display:block}
.prod{grid-template-columns:44px 1fr;gap:12px}.prodmark{width:44px;height:44px;border-radius:13px;font-size:.86rem}
.prod b{font-size:.92rem}.prod small{font-size:.58rem;line-height:1.35}
.theos-cell b{font-size:1rem}.included{font-size:.52rem;padding:5px 8px;margin-top:7px}
.rowcost{font-size:.88rem;font-weight:650}.rowcost small{font-size:.53rem;margin-top:4px}
.dupe{font-size:.78rem;line-height:1.35}
.total{padding:22px}.total small{font-size:.58rem}.total strong{font-size:4.35rem}.total em{font-size:.9rem}
.sources summary{font-size:.68rem}.source-row{font-size:.82rem}.source-row small{font-size:.76rem;line-height:1.5}
.edit{font-size:.74rem;width:90px}

/* Bigger chart with a real changing scale. */
.graph-card{padding:26px;transition:border-color .35s var(--e),box-shadow .35s var(--e)}
.graph-card.is-changing{border-color:color-mix(in srgb,var(--aqua) 34%,var(--edge));box-shadow:0 30px 80px -42px var(--aqua)}
.chart-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}
.chart-head h3{font-size:1.55rem!important}.chart-head p{font-size:.88rem!important;max-width:54ch}
.chart-scale{
  flex:0 0 auto;padding:7px 10px;border-radius:999px;border:1px solid var(--edge);
  font-family:var(--ff-m);font-size:.58rem;color:var(--fg3);background:var(--glass2)
}
.bars{height:340px!important;gap:70px!important;padding:34px 24px 0!important;position:relative}
.chart-grid{position:absolute;inset:34px 22px 45px;pointer-events:none;display:grid;grid-template-rows:repeat(4,1fr)}
.chart-grid i{border-top:1px solid var(--edge2)}
.barcol{width:min(36%,190px)!important;z-index:2;gap:10px!important}
.bartrack{height:245px;width:100%;display:flex;align-items:flex-end;position:relative}
.barv{width:100%;height:0;border-radius:22px 22px 7px 7px;transition:height .95s var(--spring),filter .35s var(--e)}
.barprice{font-size:1.28rem!important;font-weight:700}
.barlabel{font-size:.55rem!important}
.ratio-strip{
  margin-top:10px;padding:14px 16px;border:1px solid var(--edge2);border-radius:14px;
  display:flex;justify-content:space-between;align-items:center;gap:14px;color:var(--fg2);font-size:.84rem
}
.ratio-strip strong{font-family:var(--ff-d);font-size:1.55rem;color:var(--aqua);letter-spacing:-.04em}
.gap span{font-size:.9rem}.gap strong{font-size:2rem!important}

/* General legibility */
.metric small{font-size:.58rem}.metric strong{font-size:3rem}.metric p{font-size:.83rem;line-height:1.45}
.cap small{font-size:.57rem}.cap h3{font-size:1.2rem}.cap p{font-size:.84rem;line-height:1.45}.cap footer{font-size:.5rem}
.summary-box small{font-size:.53rem}.summary-box strong{font-size:1.55rem}

/* Floating Value Guide / calculator */
.dock{display:none!important}
.value-guide{position:fixed;right:18px;bottom:max(18px,env(safe-area-inset-bottom));z-index:145;width:390px;pointer-events:none}
.guide-mini{
  width:100%;min-height:78px;padding:10px 13px;border-radius:18px;border:1px solid var(--edge);
  background:color-mix(in srgb,var(--bg) 84%,transparent);backdrop-filter:blur(22px) saturate(1.35);
  -webkit-backdrop-filter:blur(22px) saturate(1.35);box-shadow:0 24px 55px -28px rgba(0,0,0,.82);
  display:grid;grid-template-columns:48px 1fr 28px;gap:11px;align-items:center;text-align:left;
  pointer-events:auto;transition:.35s var(--spring)
}
.guide-mini:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--aqua) 28%,var(--edge))}
.guide-orb{position:relative;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;border:1px solid color-mix(in srgb,var(--aqua) 36%,var(--edge));background:radial-gradient(circle,color-mix(in srgb,var(--aqua) 12%,var(--bg)),var(--bg));box-shadow:0 0 30px -15px var(--aqua)}
.guide-orb:before{content:"";position:absolute;inset:-6px;border-radius:50%;border:1px solid color-mix(in srgb,var(--aqua) 18%,transparent);animation:guideRing 2.8s ease-out infinite}
.guide-orb i{width:7px;height:7px;border-radius:50%;background:var(--aqua);box-shadow:0 0 13px var(--aqua)}
@keyframes guideRing{0%{transform:scale(.88);opacity:.8}100%{transform:scale(1.25);opacity:0}}
.guide-mini-copy{min-width:0}.guide-mini-copy small{display:block;font-family:var(--ff-m);font-size:.55rem;letter-spacing:.08em;color:var(--aqua)}
.guide-mini-copy b{display:block;font-family:var(--ff-d);font-size:1rem;letter-spacing:-.025em;margin-top:2px}
.guide-mini-copy em{display:block;font-style:normal;font-size:.72rem;color:var(--fg3);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.guide-expand{font-size:1rem;color:var(--fg3)}
.guide-panel{
  position:absolute;right:0;bottom:0;width:420px;padding:18px;pointer-events:auto;
  opacity:0;transform:translateY(12px) scale(.97);visibility:hidden;transform-origin:100% 100%;
  transition:opacity .28s var(--e),transform .42s var(--spring),visibility 0s linear .42s
}
.value-guide.expanded .guide-mini{opacity:0;transform:translateY(12px) scale(.96);pointer-events:none}
.value-guide.expanded .guide-panel{opacity:1;transform:none;visibility:visible;transition-delay:0s}
.guide-panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-bottom:14px;border-bottom:1px solid var(--edge2)}
.guide-id{display:flex;align-items:center;gap:11px}.guide-id .guide-orb{width:38px;height:38px}.guide-id small{display:block;font-family:var(--ff-m);font-size:.5rem;letter-spacing:.09em;color:var(--aqua)}.guide-id b{font-size:.76rem}
.guide-close{width:34px;height:34px;border:1px solid var(--edge);border-radius:10px;background:var(--glass2);font-size:1rem}
.guide-message{padding:18px 2px 15px}.guide-message h3{font-size:1.45rem}.guide-message p{font-size:.84rem;color:var(--fg3);margin-top:8px;line-height:1.5}
.guide-live{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.guide-live>div{padding:11px;border:1px solid var(--edge2);border-radius:13px;background:var(--glass2)}
.guide-live small{display:block;font-family:var(--ff-m);font-size:.4rem;letter-spacing:.07em;color:var(--fg3)}.guide-live strong{display:block;font-family:var(--ff-d);font-size:1.12rem;margin-top:6px;letter-spacing:-.04em}.guide-live .good strong{color:var(--aqua)}
.guide-team{margin-top:10px;padding:12px;border:1px solid var(--edge2);border-radius:13px;background:var(--glass2)}.guide-team>div{display:flex;justify-content:space-between;gap:10px;align-items:center}.guide-team small{font-family:var(--ff-m);font-size:.47rem;color:var(--fg3)}.guide-team b{font-size:.82rem}.guide-team input{width:100%;margin-top:10px;accent-color:var(--aqua)}
.guide-progress{height:3px;border-radius:99px;background:var(--edge2);overflow:hidden;margin:14px 1px 0}.guide-progress i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--peri),var(--aqua));transition:width .5s var(--spring)}
.guide-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:12px}.guide-actions .btn{min-height:44px;padding:10px 12px;font-size:.8rem}

/* Small / tablet */
@media(max-width:1000px){
  .category-tabs{grid-template-columns:repeat(2,1fr)}
  .selector-main{grid-template-columns:1fr}
  #mix{border-left:0;border-top:1px solid var(--edge2);min-height:0!important}
  .choice-stage{min-height:0}
  .value-guide{right:12px;width:min(390px,calc(100vw - 24px))}
}
@media(max-width:760px){
  .category-tabs{
    display:flex;overflow-x:auto;scrollbar-width:none;padding:9px;gap:6px;
    -webkit-overflow-scrolling:touch
  }
  .category-tabs::-webkit-scrollbar{display:none}
  .category-tab{flex:0 0 190px;min-height:60px}
  .choice-stage{padding:11px}
  .choice{grid-template-columns:48px 1fr auto!important;min-height:92px;padding:13px!important}
  .c-icon{width:48px!important;height:48px!important}.c-icon svg{width:21px!important;height:21px!important}
  .choice b{font-size:1rem!important}.choice small{font-size:.76rem!important}
  .compare-shell{padding:11px}.cmp-row{min-height:0}
  .need-title b{font-size:1rem}.need-title small{font-size:.74rem}
  .prod b{font-size:.85rem}.prod small{font-size:.56rem}.theos-cell b{font-size:.9rem}.rowcost{font-size:.8rem}
  .bars{height:320px!important;gap:40px!important;padding-inline:12px!important}.bartrack{height:220px}
  .value-guide{left:9px;right:9px;bottom:max(9px,env(safe-area-inset-bottom));width:auto}
  .guide-panel{position:fixed;left:9px;right:9px;bottom:max(9px,env(safe-area-inset-bottom));width:auto;max-height:82vh;overflow:auto}
  .guide-mini{min-height:70px;grid-template-columns:42px 1fr 24px}.guide-orb{width:38px;height:38px}
  .guide-mini-copy b{font-size:.92rem}.guide-mini-copy em{font-size:.67rem}
}


/* =====================================================================
   V67 SURGICAL REFINEMENT
   Homepage atmosphere + living value guide + branded TheOS pricing cards
   ===================================================================== */
.pricing-finale-title{
  max-width:13ch!important;margin-inline:auto!important;
  font-family:var(--ff-d)!important;font-weight:750!important;
  letter-spacing:-.045em!important;line-height:.96!important
}
.pricing-finale-lead{
  font-family:var(--ff-d);font-size:clamp(1.15rem,2.25vw,1.7rem);line-height:1.45;
  color:var(--fg2);margin:22px auto 32px;max-width:46ch;font-weight:500;letter-spacing:-.03em
}
.pricing-finale-lead strong{color:var(--fg);font-weight:700}

.theos-brandline{
  font-family:var(--ff-d);font-size:1.55rem;font-weight:800;letter-spacing:-.055em;
  margin-bottom:8px;color:var(--fg)
}
.total.theos-total{
  position:relative;overflow:hidden;
  border-color:color-mix(in srgb,var(--aqua) 46%,var(--edge));
  background:
    radial-gradient(80% 130% at 96% 0%,color-mix(in srgb,var(--aqua) 20%,transparent),transparent 62%),
    radial-gradient(90% 130% at 0% 100%,color-mix(in srgb,var(--peri) 22%,transparent),transparent 66%),
    linear-gradient(135deg,color-mix(in srgb,var(--peri) 10%,var(--glass)),color-mix(in srgb,var(--aqua) 9%,var(--glass)) 56%,color-mix(in srgb,var(--coral) 7%,var(--glass)));
  box-shadow:0 28px 70px -42px var(--aqua),inset 0 1px 0 rgba(255,255,255,.08)
}
.total.theos-total:after{
  content:"";position:absolute;inset:-70% -20%;pointer-events:none;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.08),transparent);
  transform:translateX(-65%) rotate(8deg);animation:theosSheen 7s ease-in-out infinite
}
@keyframes theosSheen{0%,65%{transform:translateX(-65%) rotate(8deg);opacity:0}78%{opacity:1}100%{transform:translateX(65%) rotate(8deg);opacity:0}}
.total.theos-total strong{color:#fff;text-shadow:0 0 26px color-mix(in srgb,var(--aqua) 22%,transparent)}

.summary-box.theos-summary,.summary-box.savings-summary{position:relative;overflow:hidden;min-height:128px}
.summary-box.theos-summary{
  border-color:color-mix(in srgb,var(--aqua) 44%,var(--edge));
  background:
    radial-gradient(110% 150% at 100% 0%,color-mix(in srgb,var(--aqua) 26%,transparent),transparent 64%),
    radial-gradient(100% 140% at 0% 100%,color-mix(in srgb,var(--peri) 26%,transparent),transparent 67%),
    linear-gradient(135deg,color-mix(in srgb,var(--peri) 11%,var(--glass)),color-mix(in srgb,var(--aqua) 9%,var(--glass)) 58%,color-mix(in srgb,var(--coral) 8%,var(--glass)));
  box-shadow:0 22px 55px -36px var(--aqua)
}
.summary-box.savings-summary{
  border-color:color-mix(in srgb,var(--aqua) 50%,var(--edge));
  background:linear-gradient(145deg,color-mix(in srgb,var(--aqua) 12%,var(--glass)),color-mix(in srgb,var(--violet) 8%,var(--glass)));
  box-shadow:0 22px 56px -38px var(--aqua)
}
.summary-box.theos-summary small,.summary-box.savings-summary small{color:color-mix(in srgb,var(--aqua) 78%,var(--fg))}
.summary-box.theos-summary strong{font-size:1.85rem!important;color:#fff}
.summary-box.savings-summary strong{font-size:1.85rem!important;color:var(--aqua)}
.summary-box em{display:block;font-style:normal;font-size:.68rem;color:var(--fg3);margin-top:4px}

/* Make the living guide visibly alive and less corner-pinned. */
.value-guide{
  right:auto!important;left:calc(100vw - 430px);
  bottom:auto!important;top:var(--guide-y,58vh);
  transform:translateY(-50%);
  transition:left .8s var(--spring),top .9s var(--spring),transform .6s var(--spring);
  animation:guideFloat 5.8s ease-in-out infinite
}
@keyframes guideFloat{
  0%,100%{translate:0 -3px}
  50%{translate:-10px 8px}
}
.guide-mini{
  box-shadow:0 24px 60px -28px rgba(0,0,0,.86),0 0 0 1px color-mix(in srgb,var(--aqua) 8%,transparent);
  position:relative;overflow:visible
}
.guide-mini:before{
  content:"CLICK TO OPEN";position:absolute;right:14px;top:-24px;
  font-family:var(--ff-m);font-size:.48rem;letter-spacing:.1em;color:var(--aqua);
  opacity:.72;animation:guideHint 3s ease-in-out infinite
}
@keyframes guideHint{0%,100%{opacity:.32;transform:translateY(2px)}50%{opacity:1;transform:translateY(-2px)}}
.guide-mini:after{
  content:"";position:absolute;inset:-5px;border-radius:22px;border:1px solid color-mix(in srgb,var(--aqua) 20%,transparent);
  pointer-events:none;animation:guideAura 2.8s ease-out infinite
}
@keyframes guideAura{0%{transform:scale(.98);opacity:.65}100%{transform:scale(1.045);opacity:0}}
.value-guide.expanded{animation:none;left:calc(100vw - 465px)!important;top:58vh!important}
.value-guide.expanded .guide-panel{box-shadow:0 32px 85px -34px rgba(0,0,0,.9),0 0 60px -42px var(--aqua)}

/* Darker, quieter section ambience like the homepage. */
.sec,.hero,.final{isolation:isolate}
.hero:before,.sec:before,.final:before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.42;
  background:radial-gradient(600px 320px at 82% 18%,rgba(14,107,82,.06),transparent 72%)
}

@media(max-width:1180px){
  .value-guide{left:auto!important;right:14px!important;top:auto!important;bottom:max(14px,env(safe-area-inset-bottom))!important;transform:none!important;animation:none}
  .value-guide.expanded{left:auto!important;right:14px!important;top:auto!important;bottom:max(14px,env(safe-area-inset-bottom))!important}
}
@media(max-width:760px){
  .value-guide{left:9px!important;right:9px!important;top:auto!important;bottom:max(9px,env(safe-area-inset-bottom))!important;width:auto!important}
  .value-guide.expanded{left:9px!important;right:9px!important;top:auto!important;bottom:max(9px,env(safe-area-inset-bottom))!important}
  .guide-mini:before{display:none}
  .summary-box.theos-summary,.summary-box.savings-summary{min-height:112px}
}


/* =====================================================================
   V68 EDGE GUIDE
   Closed guide never obscures page content. Calculator opens deliberately
   as a side drawer.
   ===================================================================== */
body.guide-open{overflow:hidden}
.value-guide{display:none!important}
.edge-guide{position:fixed;right:0;top:var(--guide-y,52vh);z-index:142;transform:translateY(-50%);transition:top .8s var(--spring);pointer-events:none}
.edge-guide-btn{pointer-events:auto;position:relative;display:flex;align-items:center;gap:9px;height:66px;padding:6px 9px 6px 8px;border-radius:18px 0 0 18px;border:1px solid var(--edge);border-right:0;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(20px) saturate(1.3);-webkit-backdrop-filter:blur(20px) saturate(1.3);box-shadow:-16px 18px 45px -28px rgba(0,0,0,.9);transform:translateX(calc(100% - 60px));transition:transform .42s var(--spring),border-color .3s var(--e),background .3s var(--e)}
.edge-guide-btn:hover,.edge-guide-btn:focus-visible{transform:translateX(0);border-color:color-mix(in srgb,var(--aqua) 30%,var(--edge));background:color-mix(in srgb,var(--bg2) 92%,transparent)}
.edge-guide-ring{width:48px;height:48px;border-radius:50%;flex:0 0 auto;display:grid;place-items:center;position:relative;border:1px solid color-mix(in srgb,var(--aqua) 42%,var(--edge));background:radial-gradient(circle,color-mix(in srgb,var(--aqua) 14%,var(--bg)),var(--bg));box-shadow:0 0 30px -14px var(--aqua)}
.edge-guide-ring:before{content:"";position:absolute;inset:-6px;border-radius:50%;border:1px solid color-mix(in srgb,var(--aqua) 18%,transparent);animation:edgeGuidePulse 2.7s ease-out infinite}
.edge-guide-ring i{position:absolute;width:7px;height:7px;border-radius:50%;background:var(--aqua);box-shadow:0 0 14px var(--aqua);transform:translateY(-8px)}
.edge-guide-ring b{position:absolute;bottom:7px;font-family:var(--ff-m);font-size:.48rem;letter-spacing:.06em;color:var(--fg2)}
@keyframes edgeGuidePulse{0%{transform:scale(.9);opacity:.75}100%{transform:scale(1.28);opacity:0}}
.edge-guide-label{min-width:170px;text-align:left;white-space:nowrap;padding-right:4px}.edge-guide-label small{display:block;font-family:var(--ff-m);font-size:.48rem;letter-spacing:.1em;color:var(--aqua)}.edge-guide-label strong{display:block;font-family:var(--ff-d);font-size:.88rem;letter-spacing:-.02em;margin-top:2px}
.guide-overlay{position:fixed;inset:0;z-index:148;background:rgba(1,8,6,.54);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .3s var(--e),visibility 0s linear .3s}.guide-overlay.open{opacity:1;visibility:visible;pointer-events:auto;transition-delay:0s}
.guide-drawer{position:fixed;top:0;right:0;bottom:0;z-index:150;width:min(460px,94vw);padding:22px;overflow:auto;border-left:1px solid var(--edge);background:radial-gradient(110% 90% at 100% 0%,rgba(14,107,82,.16),transparent 64%),linear-gradient(180deg,#07140f 0%,#06110E 45%,#04100d 100%);box-shadow:-40px 0 90px -42px rgba(0,0,0,.95);transform:translateX(102%);transition:transform .52s var(--spring)}.guide-drawer.open{transform:none}
.guide-drawer-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-bottom:18px;border-bottom:1px solid var(--edge2)}.guide-drawer-id{display:flex;align-items:center;gap:12px}.drawer-ring{width:42px;height:42px}.guide-drawer-id small{display:block;font-family:var(--ff-m);font-size:.5rem;letter-spacing:.1em;color:var(--aqua)}.guide-drawer-id strong{display:block;font-family:var(--ff-d);font-size:.84rem;margin-top:3px;letter-spacing:-.02em}.guide-drawer-close{width:40px;height:40px;border-radius:12px;border:1px solid var(--edge);background:var(--glass2);font-size:1.35rem;line-height:1}
.guide-drawer-copy{padding:26px 2px 20px}.guide-drawer-copy h3{font-size:1.8rem;line-height:1.02}.guide-drawer-copy p{color:var(--fg2);font-size:.94rem;line-height:1.55;margin-top:10px}
.guide-drawer-live{display:grid;grid-template-columns:1fr;gap:8px}.guide-drawer-live>div{padding:16px;border:1px solid var(--edge2);border-radius:16px;background:var(--glass2);position:relative;overflow:hidden}.guide-drawer-live>div.good{border-color:color-mix(in srgb,var(--aqua) 38%,var(--edge));background:radial-gradient(100% 120% at 100% 0%,color-mix(in srgb,var(--aqua) 18%,transparent),transparent 65%),linear-gradient(135deg,color-mix(in srgb,var(--peri) 9%,var(--glass)),color-mix(in srgb,var(--aqua) 8%,var(--glass)))}.guide-drawer-live>div.saving{border-color:color-mix(in srgb,var(--aqua) 45%,var(--edge));background:linear-gradient(135deg,color-mix(in srgb,var(--aqua) 10%,var(--glass)),color-mix(in srgb,var(--violet) 7%,var(--glass)))}.guide-drawer-live small{display:block;font-family:var(--ff-m);font-size:.5rem;letter-spacing:.09em;color:var(--fg3)}.guide-drawer-live strong{display:inline-block;font-family:var(--ff-d);font-size:2.15rem;letter-spacing:-.055em;margin-top:7px}.guide-drawer-live .good strong,.guide-drawer-live .saving strong{color:var(--aqua)}.guide-drawer-live em{font-style:normal;color:var(--fg3);font-size:.7rem;margin-left:5px}
.guide-drawer-team{margin-top:10px;padding:16px;border:1px solid var(--edge2);border-radius:16px;background:var(--glass2)}.guide-team-line{display:flex;align-items:end;justify-content:space-between;gap:12px}.guide-team-line small{display:block;font-family:var(--ff-m);font-size:.48rem;color:var(--fg3)}.guide-team-line b{font-family:var(--ff-d);font-size:1rem}.guide-team-line>span{font-size:.75rem;color:var(--aqua)}.guide-drawer-team input{width:100%;margin-top:15px;accent-color:var(--aqua)}
.guide-drawer-progress{height:3px;border-radius:99px;background:var(--edge2);overflow:hidden;margin:18px 1px 0}.guide-drawer-progress i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--peri),var(--aqua),var(--coral));transition:width .5s var(--spring)}
.guide-drawer-actions{position:sticky;bottom:-1px;display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:16px;padding:12px 0 4px;background:linear-gradient(180deg,transparent,#04100d 24%)}.guide-drawer-actions .btn{min-height:48px;padding:11px 12px}
@media(max-width:760px){.edge-guide{top:auto!important;bottom:94px;right:0;transform:none}.edge-guide-btn{height:58px;transform:translateX(calc(100% - 54px));border-radius:16px 0 0 16px}.edge-guide-ring{width:42px;height:42px}.edge-guide-label{min-width:145px}.edge-guide-label strong{font-size:.8rem}.guide-drawer{width:100%;padding:18px;top:auto;height:min(82vh,720px);border-left:0;border-top:1px solid var(--edge);border-radius:22px 22px 0 0;transform:translateY(103%)}.guide-drawer.open{transform:none}.guide-drawer-copy h3{font-size:1.55rem}}



/* =====================================================================
   V48 - EDGE SCROLL RAIL
   Replace the bright native browser scrollbar with a transparent edge
   rail, a thin glowing progress line, and a draggable hover captor.
   ===================================================================== */
html,body{scrollbar-width:none!important;-ms-overflow-style:none}
html::-webkit-scrollbar,body::-webkit-scrollbar{width:0!important;height:0!important;display:none!important}

.scroll-edge{
  position:fixed;z-index:2147480000;
  right:max(3px,var(--safe-r,0px));top:calc(var(--safe-t,0px) + 8px);bottom:calc(var(--safe-b,0px) + 8px);
  width:18px;pointer-events:auto;touch-action:none;user-select:none;-webkit-user-select:none;
  opacity:.72;transition:opacity .25s var(--e),width .25s var(--e);
}
.scroll-edge:hover,.scroll-edge:focus-within{opacity:1;width:24px}
.scroll-edge__line,.scroll-edge__progress{
  position:absolute;left:50%;top:0;transform:translateX(-50%);border-radius:999px;pointer-events:none
}
.scroll-edge__line{
  bottom:0;width:1px;
  background:linear-gradient(180deg,transparent 0%,rgba(63,224,200,.18) 8%,rgba(124,124,255,.16) 48%,rgba(255,158,122,.17) 92%,transparent 100%);
}
.scroll-edge__progress{
  height:var(--edge-scroll-progress,0%);width:1.5px;
  background:linear-gradient(180deg,var(--aqua) 0%,var(--peri) 55%,var(--coral) 100%);
  box-shadow:0 0 7px color-mix(in srgb,var(--aqua) 55%,transparent),0 0 16px color-mix(in srgb,var(--peri) 28%,transparent);
  transition:height .08s linear;
}
.scroll-captor{
  position:absolute;left:50%;top:var(--edge-scroll-thumb,14px);width:6px;height:30px;
  transform:translate(-50%,-50%);border-radius:999px;
  border:1px solid color-mix(in srgb,var(--aqua) 48%,transparent);
  background:linear-gradient(180deg,color-mix(in srgb,var(--aqua) 84%,#fff),color-mix(in srgb,var(--peri) 82%,var(--aqua)),color-mix(in srgb,var(--coral) 78%,var(--peri)));
  box-shadow:0 0 7px color-mix(in srgb,var(--aqua) 62%,transparent),0 0 17px color-mix(in srgb,var(--peri) 28%,transparent);
  cursor:ns-resize;outline:none;transition:width .22s var(--e),height .22s var(--e),box-shadow .22s var(--e),border-color .22s var(--e),opacity .22s var(--e);
}
.scroll-captor__grip{
  position:absolute;left:50%;top:50%;width:2px;height:2px;border-radius:50%;transform:translate(-50%,-50%);
  background:rgba(6,17,14,.72);
  box-shadow:0 -5px 0 rgba(6,17,14,.48),0 5px 0 rgba(6,17,14,.48);
  opacity:0;transition:opacity .18s var(--e)
}
.scroll-edge:hover .scroll-captor,
.scroll-captor:hover,
.scroll-captor:focus-visible,
.scroll-captor.is-dragging{
  width:13px;height:42px;
  border-color:color-mix(in srgb,var(--aqua) 74%,var(--peri));
  box-shadow:0 0 0 4px color-mix(in srgb,var(--aqua) 7%,transparent),0 0 12px color-mix(in srgb,var(--aqua) 75%,transparent),0 0 28px color-mix(in srgb,var(--peri) 42%,transparent);
}
.scroll-edge:hover .scroll-captor__grip,
.scroll-captor:focus-visible .scroll-captor__grip,
.scroll-captor.is-dragging .scroll-captor__grip{opacity:1}
.scroll-captor:focus-visible{outline:1px solid color-mix(in srgb,var(--aqua) 88%,#fff);outline-offset:3px}

html.edge-scroll-dragging,html.edge-scroll-dragging body{cursor:ns-resize!important;user-select:none!important;-webkit-user-select:none!important}

/* On touch screens scrolling stays native by gesture; retain only the quiet
   progress filament so the edge never competes with page content. */
@media(pointer:coarse){
  .scroll-edge{right:max(1px,var(--safe-r,0px));width:6px;opacity:.42;pointer-events:none}
  .scroll-edge__line{width:.7px}
  .scroll-edge__progress{width:1px;box-shadow:0 0 5px color-mix(in srgb,var(--aqua) 42%,transparent)}
  .scroll-captor{display:none}
}
@media(max-width:700px){
  .scroll-edge{top:calc(var(--safe-t,0px) + 4px);bottom:calc(var(--safe-b,0px) + 4px)}
}
@media(prefers-reduced-motion:reduce){
  .scroll-edge,.scroll-captor,.scroll-captor__grip,.scroll-edge__progress{transition-duration:.01ms!important}
}



/* =====================================================================
   V70 - CONTEXT GUIDE MOVES THROUGH PRICING STORY
   Uses the uploaded homepage's exact edge-scroll system. The value guide
   is physically attached to the moving scroll position instead of floating
   over the pricing content.
   ===================================================================== */

/* Hide superseded standalone guide from V68. */
.edge-guide,.edge-guide-btn{display:none!important}

/* Make the index rail the single right-edge interaction system. */
.pricing-scroll-edge{z-index:2147480000}
.pricing-scroll-edge .scroll-captor{z-index:4}

.scroll-guide-orb{
  --guide-tint:var(--aqua);
  position:absolute;
  z-index:6;
  right:10px;
  top:var(--edge-scroll-thumb,14px);
  width:50px;height:50px;
  transform:translateY(-50%);
  border-radius:50%;
  border:1px solid color-mix(in srgb,var(--guide-tint) 52%,var(--edge));
  background:
    radial-gradient(circle at 50% 45%,color-mix(in srgb,var(--guide-tint) 16%,var(--bg-2)),var(--bg) 70%);
  box-shadow:
    0 0 0 5px color-mix(in srgb,var(--guide-tint) 6%,transparent),
    0 0 18px -4px color-mix(in srgb,var(--guide-tint) 62%,transparent),
    0 14px 34px -22px rgba(0,0,0,.88);
  display:grid;place-items:center;
  overflow:visible;
  transition:
    top .08s linear,
    width .32s var(--e-out),height .32s var(--e-out),
    border-radius .32s var(--e-out),
    background .32s var(--e),box-shadow .32s var(--e),
    transform .32s var(--e-out);
}
.scroll-guide-orb::before,
.scroll-guide-orb::after,
.scroll-guide-orb__rings::before{
  content:"";position:absolute;border-radius:999px;pointer-events:none;
  border:1px solid color-mix(in srgb,var(--guide-tint) 34%,transparent);
}
.scroll-guide-orb::before{inset:-7px;animation:pricingGuidePulse 2.35s ease-out infinite}
.scroll-guide-orb::after{inset:-14px;animation:pricingGuidePulse 2.35s ease-out -1.17s infinite;opacity:.5}
.scroll-guide-orb__rings::before{inset:-20px;animation:pricingGuideWhisper 4.6s ease-in-out infinite;opacity:.18}
@keyframes pricingGuidePulse{0%{transform:scale(.86);opacity:.78}100%{transform:scale(1.22);opacity:0}}
@keyframes pricingGuideWhisper{0%,100%{transform:scale(.9);opacity:.10}50%{transform:scale(1.08);opacity:.3}}

.scroll-guide-orb__num{
  position:relative;z-index:3;
  font-family:var(--ff-d);
  font-size:1.08rem;
  font-weight:800;
  line-height:1;
  letter-spacing:-.05em;
  color:var(--fg);
  text-shadow:0 0 16px color-mix(in srgb,var(--guide-tint) 42%,transparent);
  transition:transform .35s var(--e-out),color .35s var(--e)
}
.scroll-guide-orb__copy{
  position:absolute;right:58px;top:50%;
  width:0;max-width:250px;
  padding:0;
  transform:translate(10px,-50%);
  opacity:0;overflow:hidden;white-space:nowrap;
  text-align:left;pointer-events:none;
  border:1px solid transparent;border-radius:14px;
  background:color-mix(in srgb,var(--bg) 90%,transparent);
  backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3);
  box-shadow:0 22px 50px -30px rgba(0,0,0,.9);
  transition:width .36s var(--e-out),padding .36s var(--e-out),opacity .2s var(--e),transform .36s var(--e-out),border-color .3s var(--e)
}
.scroll-guide-orb__copy small{
  display:block;font-family:var(--ff-m);font-size:.58rem;letter-spacing:.11em;color:var(--guide-tint)
}
.scroll-guide-orb__copy b{
  display:block;font-family:var(--ff-d);font-size:.96rem;letter-spacing:-.025em;margin-top:3px;color:var(--fg)
}
.scroll-guide-orb:hover,
.scroll-guide-orb:focus-visible{
  width:58px;height:58px;
  box-shadow:0 0 0 7px color-mix(in srgb,var(--guide-tint) 8%,transparent),0 0 24px -3px color-mix(in srgb,var(--guide-tint) 78%,transparent),0 18px 42px -24px rgba(0,0,0,.9)
}
.scroll-guide-orb:hover .scroll-guide-orb__copy,
.scroll-guide-orb:focus-visible .scroll-guide-orb__copy{
  width:230px;padding:10px 13px;opacity:1;transform:translate(0,-50%);border-color:color-mix(in srgb,var(--guide-tint) 24%,var(--edge))
}
.scroll-guide-orb.is-speaking{animation:pricingGuideNudge .82s var(--e-out)}
.scroll-guide-orb.is-speaking .scroll-guide-orb__num{animation:pricingGuideNum .82s var(--e-out)}
@keyframes pricingGuideNudge{0%{transform:translateY(-50%) scale(1)}35%{transform:translateY(-50%) scale(1.16) translateX(-5px)}100%{transform:translateY(-50%) scale(1)}}
@keyframes pricingGuideNum{0%{transform:scale(.65);opacity:.3}42%{transform:scale(1.2);opacity:1}100%{transform:scale(1);opacity:1}}

/* Index-style chapter marker, but deliberately larger for pricing wayfinding. */
.pricing-step-marker{
  display:grid!important;
  grid-template-columns:auto 1px auto;
  align-items:center;
  gap:14px!important;
  width:max-content;
  margin-bottom:24px!important;
  color:inherit!important;
}
.pricing-step-marker::before{display:none!important}
.pricing-step-marker>b{
  font-family:var(--ff-d);
  font-size:clamp(2.1rem,3vw,3rem);
  line-height:.8;
  letter-spacing:-.065em;
  font-weight:800;
  background:linear-gradient(135deg,var(--aqua),var(--peri));
  -webkit-background-clip:text;background-clip:text;color:transparent
}
.pricing-step-marker::after{
  content:"";display:block;width:1px;height:38px;
  background:linear-gradient(180deg,transparent,color-mix(in srgb,var(--aqua) 64%,transparent),transparent);
  grid-column:2;grid-row:1
}
.pricing-step-marker>span{display:grid;gap:4px;grid-column:3;grid-row:1}
.pricing-step-marker small{
  font-family:var(--ff-m);font-size:.58rem;letter-spacing:.16em;text-transform:uppercase;color:var(--fg-3);font-weight:500
}
.pricing-step-marker em{
  font-family:var(--ff-m);font-size:.76rem;letter-spacing:.12em;text-transform:uppercase;color:var(--aqua);font-style:normal;font-weight:600
}

/* Increase the supporting chapter rail typography in large layouts. */
@media(min-width:1200px){
  .pricing-step-marker>b{font-size:3.15rem}
  .pricing-step-marker small{font-size:.64rem}
  .pricing-step-marker em{font-size:.86rem}
}

/* On touch, use the index's quiet filament but keep a discoverable guide orb. */
@media(pointer:coarse){
  .pricing-scroll-edge{pointer-events:none!important}
  .pricing-scroll-edge .scroll-guide-orb{
    display:grid!important;pointer-events:auto!important;
    right:8px;width:44px;height:44px;
  }
  .pricing-scroll-edge .scroll-guide-orb__copy{display:none!important}
}
@media(max-width:700px){
  .pricing-step-marker{gap:10px!important;margin-bottom:18px!important}
  .pricing-step-marker>b{font-size:2.2rem}
  .pricing-step-marker::after{height:31px}
  .pricing-step-marker small{font-size:.5rem}
  .pricing-step-marker em{font-size:.66rem;letter-spacing:.1em}
  .scroll-guide-orb{right:7px;width:42px;height:42px}
  .scroll-guide-orb__num{font-size:.95rem}
}


/* =====================================================================
   V70 CONTEXT GUIDE
   The index scrollbar stays untouched. The pricing guide lives in the
   story itself: first beneath the hero value card, then beside each
   chapter title. It moves between those anchors with gentle spring motion.
   ===================================================================== */
.scroll-guide-orb{display:none!important}

.context-guide{
  --guide-tint:var(--peri);
  position:fixed;left:0;top:0;z-index:118;
  width:58px;height:58px;border-radius:50%;
  display:grid;place-items:center;
  border:1px solid color-mix(in srgb,var(--guide-tint) 48%,var(--edge));
  background:
    radial-gradient(circle at 48% 42%,color-mix(in srgb,var(--guide-tint) 17%,var(--bg-2)),var(--bg) 68%);
  box-shadow:
    0 0 0 5px color-mix(in srgb,var(--guide-tint) 6%,transparent),
    0 0 24px -6px color-mix(in srgb,var(--guide-tint) 72%,transparent),
    0 18px 42px -26px rgba(0,0,0,.9);
  transform:translate3d(-120px,-120px,0);
  transform-origin:center;
  opacity:0;pointer-events:auto;
  will-change:transform;
  transition:opacity .35s var(--e),width .32s var(--e-out),height .32s var(--e-out),box-shadow .32s var(--e),border-color .32s var(--e);
}
.context-guide.is-ready{opacity:1}
.context-guide::before,.context-guide::after,.context-guide__halo{
  content:"";position:absolute;border-radius:50%;pointer-events:none;
  border:1px solid color-mix(in srgb,var(--guide-tint) 34%,transparent)
}
.context-guide::before{inset:-7px;animation:contextGuidePulse 2.25s ease-out infinite}
.context-guide::after{inset:-14px;animation:contextGuidePulse 2.25s ease-out -1.12s infinite;opacity:.55}
.context-guide__halo{inset:-22px;opacity:.14;animation:contextGuideBreathe 5s ease-in-out infinite}
@keyframes contextGuidePulse{0%{transform:scale(.86);opacity:.78}100%{transform:scale(1.2);opacity:0}}
@keyframes contextGuideBreathe{0%,100%{transform:scale(.92);opacity:.08}50%{transform:scale(1.11);opacity:.28}}

.context-guide__num{
  position:relative;z-index:4;font-family:var(--ff-d);font-size:1.22rem;font-weight:800;line-height:1;
  letter-spacing:-.055em;color:var(--fg);text-shadow:0 0 16px color-mix(in srgb,var(--guide-tint) 48%,transparent)
}
.context-guide__orbit{position:absolute;inset:-4px;border-radius:50%;animation:contextGuideOrbit 8s linear infinite;pointer-events:none}
.context-guide__orbit i{position:absolute;width:5px;height:5px;border-radius:50%;background:var(--guide-tint);box-shadow:0 0 11px var(--guide-tint)}
.context-guide__orbit i:nth-child(1){left:50%;top:-2px;transform:translateX(-50%)}
.context-guide__orbit i:nth-child(2){right:2px;bottom:9px;opacity:.7}
.context-guide__orbit i:nth-child(3){left:1px;bottom:13px;opacity:.42}
@keyframes contextGuideOrbit{to{transform:rotate(360deg)}}

.context-guide__copy{
  position:absolute;left:70px;top:50%;width:0;max-width:255px;padding:0;
  transform:translate(-8px,-50%);opacity:0;overflow:hidden;white-space:nowrap;text-align:left;pointer-events:none;
  border:1px solid transparent;border-radius:14px;background:color-mix(in srgb,var(--bg) 92%,transparent);
  backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3);
  box-shadow:0 22px 50px -30px rgba(0,0,0,.92);
  transition:width .34s var(--e-out),padding .34s var(--e-out),opacity .2s var(--e),transform .34s var(--e-out),border-color .3s var(--e)
}
.context-guide__copy small{display:block;font-family:var(--ff-m);font-size:.58rem;letter-spacing:.11em;color:var(--guide-tint)}
.context-guide__copy b{display:block;font-family:var(--ff-d);font-size:1rem;letter-spacing:-.025em;margin-top:2px;color:var(--fg)}
.context-guide__copy em{display:block;font-style:normal;font-family:var(--ff-m);font-size:.48rem;letter-spacing:.06em;color:var(--fg-3);margin-top:3px}
.context-guide:hover,.context-guide:focus-visible{width:64px;height:64px;box-shadow:0 0 0 7px color-mix(in srgb,var(--guide-tint) 8%,transparent),0 0 29px -3px color-mix(in srgb,var(--guide-tint) 80%,transparent),0 20px 48px -26px rgba(0,0,0,.92)}
.context-guide:hover .context-guide__copy,.context-guide:focus-visible .context-guide__copy{width:235px;padding:10px 13px;opacity:1;transform:translate(0,-50%);border-color:color-mix(in srgb,var(--guide-tint) 25%,var(--edge))}

/* When the guide travels to a new chapter it briefly announces the move. */
.context-guide.is-hopping{animation:contextGuideHop .72s var(--e-out)}
.context-guide.is-hopping .context-guide__num{animation:contextGuideNum .72s var(--e-out)}
.context-guide.is-hopping::before{animation-duration:.85s}
@keyframes contextGuideHop{0%{filter:brightness(1)}38%{filter:brightness(1.45)}100%{filter:brightness(1)}}
@keyframes contextGuideNum{0%{transform:scale(.72);opacity:.3}45%{transform:scale(1.22);opacity:1}100%{transform:scale(1);opacity:1}}

/* Small comet tail is shown only while moving. */
.context-guide .context-guide__halo::after{
  content:"";position:absolute;right:50%;top:50%;width:0;height:1px;transform-origin:right center;
  background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--guide-tint) 50%,transparent));opacity:0
}
.context-guide.is-travelling .context-guide__halo::after{width:72px;opacity:.5;animation:contextGuideTail .7s ease-out}
@keyframes contextGuideTail{from{transform:translateY(-50%) scaleX(.2);opacity:.8}to{transform:translateY(-50%) scaleX(1);opacity:0}}

/* Pricing chapter labels remain deliberately readable. */
.pricing-step-marker>b{font-size:clamp(2.35rem,3.3vw,3.35rem)!important}
.pricing-step-marker small{font-size:.66rem!important}
.pricing-step-marker em{font-size:.9rem!important;letter-spacing:.11em!important}

@media(max-width:980px){
  .context-guide{width:52px;height:52px}
  .context-guide__num{font-size:1.08rem}
  .context-guide__copy{display:none}
}
@media(max-width:700px){
  .context-guide{width:46px;height:46px}
  .context-guide__num{font-size:1rem}
  .pricing-step-marker>b{font-size:2.4rem!important}
  .pricing-step-marker small{font-size:.56rem!important}
  .pricing-step-marker em{font-size:.72rem!important}
}
@media(prefers-reduced-motion:reduce){
  .context-guide,.context-guide::before,.context-guide::after,.context-guide__halo,.context-guide__orbit,.context-guide.is-hopping,.context-guide.is-hopping .context-guide__num{animation:none!important}
}


/* =====================================================================
   V71 HEADER PARITY
   Exact header structure and visual system from the uploaded index.
   Pricing content below this header is unchanged.
   ===================================================================== */
:root{--nav-h:68px}

.topbar{
  position:sticky!important;
  top:0!important;
  z-index:100!important;
  padding-top:env(safe-area-inset-top,0px)!important;
  padding-left:env(safe-area-inset-left,0px);
  padding-right:env(safe-area-inset-right,0px);
}
.topbar>.wrap{
  width:100%;
  max-width:var(--max)!important;
  margin:0 auto;
  padding-left:var(--gut)!important;
  padding-right:var(--gut)!important;
}
.topbar__in{
  display:flex;
  align-items:center;
  gap:22px;
  height:var(--nav-h);
  margin-top:12px;
  padding:0 8px 0 18px;
  border-radius:16px;
  background:color-mix(in srgb,var(--bg) 72%,transparent);
  border:1px solid var(--edge);
  -webkit-backdrop-filter:blur(20px) saturate(1.5);
  backdrop-filter:blur(20px) saturate(1.5);
  transition:box-shadow .4s var(--e),background .4s var(--e);
}
.topbar.is-stuck .topbar__in{box-shadow:0 18px 40px -22px rgba(0,12,8,.78)}

.topbar .brand{
  display:flex;
  align-items:center;
  gap:10px;
  font-family:var(--ff-d);
  font-weight:800;
  letter-spacing:-.04em;
  font-size:1.1rem;
  white-space:nowrap;
}
.brand__mark{
  width:26px;
  height:26px;
  border-radius:8px;
  background:linear-gradient(140deg,var(--peri),var(--aqua));
  position:relative;
  flex:0 0 auto;
  box-shadow:0 0 18px -4px var(--peri);
}
.brand__mark::after{
  content:"";
  position:absolute;
  inset:6px 6px auto 6px;
  height:2px;
  border-radius:2px;
  background:rgba(255,255,255,.9);
}
.topbar .brand small{
  font-family:var(--ff);
  font-weight:500;
  color:var(--fg3);
  font-size:.76rem;
  letter-spacing:0;
}

.navlinks{
  display:none;
  gap:4px;
  margin-left:auto;
  align-items:center;
}
.navlinks a{
  position:relative;
  isolation:isolate;
  padding:9px 13px;
  border-radius:10px;
  font-size:.88rem;
  font-weight:550;
  color:var(--fg2);
  transition:color .22s var(--e),background .22s var(--e);
  white-space:nowrap;
}
.navlinks a:hover{color:var(--fg);background:var(--glass)}
.navlinks a::after{
  content:"";
  position:absolute;
  left:13px;right:13px;bottom:4px;
  height:1.5px;border-radius:999px;
  background:linear-gradient(90deg,var(--peri),var(--aqua));
  transform:scaleX(0);
  transform-origin:50% 50%;
  opacity:0;
  transition:transform .38s var(--spring),opacity .28s var(--e);
}
.navlinks a.is-active{
  color:var(--fg);
  background:color-mix(in srgb,var(--glass) 72%,transparent);
}
.navlinks a.is-active::after{transform:scaleX(1);opacity:.9}

.topbar__act{
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:8px;
}
.icon-btn{
  width:40px;
  min-width:40px;
  height:40px;
  border-radius:11px;
  border:1px solid var(--edge);
  display:grid;
  place-items:center;
  transition:background .24s var(--e),transform .3s var(--spring),border-color .3s var(--e);
  background:var(--glass2);
}
.icon-btn:hover{background:var(--glass);transform:translateY(-1px)}
.icon-btn:active{transform:scale(.93)}
.icon-btn svg{width:17px;height:17px}
.theme-btn .moon{display:none}
[data-theme="light"] .theme-btn .sun{display:none}
[data-theme="light"] .theme-btn .moon{display:block}

.sound-on,.haptic-on,.motion-play{display:none}
.sound-btn.is-on .sound-off,.haptic-btn.is-on .haptic-off,.motion-btn.is-paused .motion-pause{display:none}
.sound-btn.is-on .sound-on,.haptic-btn.is-on .haptic-on,.motion-btn.is-paused .motion-play{display:block}

.topbar .btn{
  min-height:50px;
  padding:13px 24px;
  border-radius:13px;
  font-weight:650;
  font-size:.94rem;
}
.topbar .header-demo{
  min-height:40px;
  padding:9px 17px;
  font-size:.86rem;
}
.btn--pri{
  background:linear-gradient(120deg,var(--peri),var(--peri2));
  color:#fff;
  box-shadow:0 14px 34px -14px var(--peri);
}
.btn--pri:hover{box-shadow:0 20px 44px -14px var(--peri)}
.burger{display:grid}

/* index responsive breakpoint: full nav gets breathing room at 1100px */
@media(min-width:1100px){
  .navlinks{display:flex}
  .burger{display:none}
  .topbar__act{margin-left:0}
}
@media(min-width:1000px) and (max-width:1099px){
  .navlinks{display:none}
  .burger{display:grid}
  .topbar__act{margin-left:auto}
}

/* exact index-style drawer */
.drawer{
  position:fixed!important;
  inset:0!important;
  z-index:110!important;
  visibility:hidden;
  pointer-events:none;
  overflow:hidden;
  display:block!important;
}
.drawer__scrim{
  position:absolute;inset:0;
  background:rgba(3,12,9,.66);
  opacity:0;
  transition:opacity .4s var(--e);
  -webkit-backdrop-filter:blur(6px);
  backdrop-filter:blur(6px);
}
.drawer__panel{
  position:absolute;
  right:0;top:0;bottom:0;
  width:min(86vw,360px);
  background:var(--bg2);
  border-left:1px solid var(--edge);
  padding:max(22px,env(safe-area-inset-top,0px)) max(22px,env(safe-area-inset-right,0px)) max(22px,env(safe-area-inset-bottom,0px)) 22px;
  transform:translateX(102%);
  transition:transform .48s var(--spring);
  display:flex;
  flex-direction:column;
  gap:6px;
  overscroll-behavior:contain;
}
.drawer.open{visibility:visible;pointer-events:auto}
.drawer.open .drawer__scrim{opacity:1}
.drawer.open .drawer__panel{transform:none}
.drawer__top{display:flex;justify-content:flex-end;margin-bottom:10px}
.drawer__panel a{
  padding:15px 14px;
  border-radius:12px;
  font-family:var(--ff-d);
  font-size:1.15rem;
  font-weight:650;
  letter-spacing:-.03em;
  border-bottom:1px solid var(--edge2);
}
.drawer__panel a.is-active{background:var(--glass);color:var(--fg)}
.drawer__panel a.btn{
  border-bottom:0;
  padding:14px 24px;
  font-size:.94rem;
  font-family:var(--ff);
  letter-spacing:-.005em;
  justify-content:center;
}

@media(max-width:599px){
  .topbar>.wrap{padding-left:var(--gut)!important;padding-right:var(--gut)!important}
  .topbar__in{
    height:60px;
    margin-top:8px;
    padding:0 7px 0 12px;
    gap:8px;
    border-radius:14px;
  }
  .topbar .brand{gap:8px;font-size:1.04rem}
  .brand__mark{width:24px;height:24px;border-radius:7px}
  .topbar .brand small{display:none}
  .topbar__act{gap:5px}
  .topbar__act>a.btn{display:none}
  .icon-btn{width:38px;min-width:38px;height:38px;border-radius:10px}
  .icon-btn svg{width:18px;height:18px}
  .drawer__panel{width:min(88vw,350px);padding-left:20px}
}
@media(max-width:390px){
  .icon-btn{width:35px;min-width:35px;height:35px}
  .topbar__act{gap:3px}
}
@supports (-webkit-touch-callout:none){
  .topbar__in{
    -webkit-backdrop-filter:blur(10px);
    backdrop-filter:blur(10px);
    background:color-mix(in srgb,var(--bg) 84%,transparent);
  }
}


/* =====================================================================
   V72 EXACT WIDE INDEX HEADER
   The original index uses a fluid shell on desktop. V71 accidentally
   locked the pricing header to 1200px, squeezing the CTA.
   ===================================================================== */

/* Same shell behaviour as the uploaded index. */
@media(min-width:1200px){
  :root{
    --max:clamp(1180px,88vw,1680px);
    --gut:clamp(30px,3.1vw,62px);
  }
}
@media(min-width:1450px){
  :root{--max:clamp(1320px,90vw,1740px)}
}
@media(min-width:1600px) and (min-aspect-ratio:19/10){
  :root{
    --max:min(1760px,92vw);
    --gut:clamp(34px,3vw,68px);
  }
}

/* Header must use that shell rather than a separate fixed width. */
.topbar>.wrap{
  max-width:var(--max)!important;
  padding-left:var(--gut)!important;
  padding-right:var(--gut)!important;
}

/* Match the index CTA exactly and never let it wrap. */
.topbar .header-demo{
  min-height:40px!important;
  height:40px;
  padding:9px 17px!important;
  font-size:.86rem!important;
  line-height:1!important;
  white-space:nowrap!important;
  flex:0 0 auto;
}

/* Protect every top-level nav item from wrapping. */
.topbar__in{min-width:0}
.navlinks{min-width:0}
.navlinks a{white-space:nowrap;flex:0 0 auto}
.topbar__act{flex:0 0 auto}

/* The full nav needs the same breathing room as the real index. */
@media(min-width:1100px){
  .topbar__in{gap:22px}
  .navlinks{gap:4px}
  .topbar__act{gap:8px}
}

/* If a desktop viewport is genuinely too narrow, use the burger rather
   than compressing the CTA or wrapping text. */
@media(min-width:1100px) and (max-width:1279px){
  .navlinks a{padding-inline:10px;font-size:.84rem}
  .topbar__in{gap:14px}
  .topbar__act{gap:6px}
}


/* =====================================================================
   V73 FULL OPERATING ECONOMICS
   Extends pricing beyond software consolidation into operating friction,
   Space Layer value, included platform capabilities, app building and AI.
   ===================================================================== */
.friction-layout{display:grid;grid-template-columns:1.2fr .8fr;gap:13px}.friction-board,.one-space-board{padding:24px}.friction-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;padding-bottom:18px;border-bottom:1px solid var(--edge2)}.friction-head small,.builder-label,.stack-label,.included-head small,.ai-control-head small,.ai-result-head small{font-family:var(--ff-m);font-size:.58rem;letter-spacing:.11em;color:var(--fg3)}.friction-head h3{font-size:1.5rem;margin-top:7px}.friction-badge{flex:0 0 auto;padding:8px 11px;border:1px solid var(--edge);border-radius:999px;font-size:.7rem;color:var(--fg3)}.friction-badge b{font-family:var(--ff-d);font-size:1rem;color:var(--coral);margin-right:4px}.friction-rows{display:grid;gap:0;margin-top:5px}.friction-row{display:grid;grid-template-columns:minmax(190px,1fr) minmax(120px,.8fr) 44px;gap:14px;align-items:center;padding:17px 0;border-bottom:1px solid var(--edge2)}.friction-row b{display:block;font-family:var(--ff-d);font-size:1rem}.friction-row small{display:block;color:var(--fg3);font-size:.76rem;line-height:1.4;margin-top:4px}.friction-row>strong{font-family:var(--ff-d);font-size:1.45rem;text-align:right}.friction-track{height:7px;border-radius:999px;background:var(--edge2);overflow:hidden}.friction-track i{display:block;width:10%;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--peri),var(--coral));transition:width .85s var(--spring);box-shadow:0 0 16px -4px var(--coral)}.friction-note{font-size:.72rem;color:var(--fg3);line-height:1.5;margin-top:15px}.one-space-board{display:flex;flex-direction:column;justify-content:center}.one-space-orb{width:178px;height:178px;border-radius:50%;margin:0 auto 22px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;border:1px solid color-mix(in srgb,var(--aqua) 38%,var(--edge));background:radial-gradient(circle,color-mix(in srgb,var(--aqua) 9%,var(--bg)),var(--bg));box-shadow:0 0 55px -30px var(--aqua);position:relative}.one-space-orb:before{content:"";position:absolute;inset:-13px;border-radius:50%;border:1px solid color-mix(in srgb,var(--aqua) 16%,transparent);animation:ring 3.6s ease-in-out infinite}.one-space-orb small{font-family:var(--ff-m);font-size:.5rem;color:var(--aqua)}.one-space-orb strong{font-family:var(--ff-d);font-size:3.3rem;line-height:.9}.one-space-orb span{font-size:.72rem;color:var(--fg3);margin-top:6px}.one-space-list{display:grid;gap:0}.one-space-list>div{display:grid;grid-template-columns:8px 1fr;gap:10px;padding:12px 0;border-top:1px solid var(--edge2)}.one-space-list i{width:7px;height:7px;border-radius:50%;background:var(--aqua);margin-top:7px;box-shadow:0 0 10px var(--aqua)}.one-space-list b{display:block;font-size:.84rem}.one-space-list small{display:block;color:var(--fg3);font-size:.72rem;line-height:1.42;margin-top:3px}
.space-economics{display:grid;grid-template-columns:.92fr 1.08fr;gap:13px}.space-stack-card{padding:24px;min-height:580px;display:flex;flex-direction:column;justify-content:center}.stack-label{text-align:center}.stack-label.bottom{margin-top:13px}.existing-row,.os-row{display:flex;justify-content:center;flex-wrap:wrap;gap:7px;margin:16px 0}.existing-row span,.os-row span{padding:8px 11px;border:1px solid var(--edge);border-radius:999px;background:var(--glass2);font-family:var(--ff-m);font-size:.58rem;color:var(--fg2)}.space-layer-live{position:relative;min-height:255px;border:1px solid color-mix(in srgb,var(--aqua) 30%,var(--edge));border-radius:28px;background:radial-gradient(100% 150% at 50% 50%,color-mix(in srgb,var(--aqua) 10%,transparent),transparent 62%),linear-gradient(135deg,color-mix(in srgb,var(--peri) 6%,var(--glass)),color-mix(in srgb,var(--aqua) 6%,var(--glass)));display:grid;place-items:center;overflow:hidden}.space-layer-title{text-align:center;z-index:2}.space-layer-title small{display:block;font-family:var(--ff-d);font-size:1.7rem;font-weight:800;letter-spacing:-.05em}.space-layer-title strong{display:block;font-family:var(--ff-d);font-size:2.1rem;letter-spacing:-.045em;margin-top:2px}.space-layer-title p{font-family:var(--ff-m);font-size:.55rem;color:var(--aqua);letter-spacing:.07em;margin-top:10px}.space-layer-live:before,.space-layer-live:after{content:"";position:absolute;border-radius:50%;border:1px solid color-mix(in srgb,var(--aqua) 13%,transparent);animation:spaceBreath 5s ease-in-out infinite}.space-layer-live:before{width:230px;height:230px}.space-layer-live:after{width:330px;height:330px;animation-delay:-2.5s}@keyframes spaceBreath{50%{transform:scale(1.12);opacity:.18}}.space-flow-dots i{position:absolute;width:6px;height:6px;border-radius:50%;background:var(--aqua);box-shadow:0 0 12px var(--aqua);animation:spaceDot 4.6s var(--e) infinite}.space-flow-dots i:nth-child(1){left:8%;top:22%}.space-flow-dots i:nth-child(2){right:9%;top:48%;animation-delay:-1.6s}.space-flow-dots i:nth-child(3){left:22%;bottom:12%;animation-delay:-3.1s}@keyframes spaceDot{0%,100%{transform:scale(.7);opacity:.2}50%{transform:scale(1.5);opacity:1}}.space-value-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.space-value-card{padding:18px;min-height:178px}.space-value-card small{font-family:var(--ff-m);font-size:.5rem;letter-spacing:.09em;color:var(--aqua)}.space-value-card h3{font-size:1.08rem;margin-top:22px}.space-value-card p{font-size:.78rem;color:var(--fg3);line-height:1.48;margin-top:7px}
.included-layout{display:grid;grid-template-columns:1fr 1fr;gap:13px}.included-selected,.included-core{padding:20px}.included-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;padding-bottom:15px;border-bottom:1px solid var(--edge2)}.included-head h3{font-size:1.3rem;margin-top:5px}.included-head>span{font-family:var(--ff-m);font-size:.52rem;color:var(--aqua);padding:6px 8px;border:1px solid color-mix(in srgb,var(--aqua) 24%,var(--edge));border-radius:999px}.cap-grid.compact{grid-template-columns:1fr 1fr;margin-top:12px}.cap-grid.compact .cap{min-height:135px;padding:14px}.cap-grid.compact .cap h3{font-size:.95rem;margin-top:18px}.cap-grid.compact .cap p{font-size:.69rem}.inherent-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:12px}.inherent-grid>div{padding:13px;border:1px solid var(--edge2);border-radius:13px;background:var(--glass2)}.inherent-grid b{display:block;font-size:.8rem}.inherent-grid small{display:block;color:var(--fg3);font-size:.67rem;line-height:1.4;margin-top:4px}.seat-value-band{margin-top:13px;padding:20px 22px;display:grid;grid-template-columns:.78fr 1.22fr;align-items:center;gap:20px;border-color:color-mix(in srgb,var(--aqua) 30%,var(--edge));background:radial-gradient(60% 150% at 0% 50%,color-mix(in srgb,var(--peri) 12%,transparent),transparent 70%),radial-gradient(60% 150% at 100% 50%,color-mix(in srgb,var(--aqua) 11%,transparent),transparent 70%),var(--glass)}.seat-value-band small{display:block;font-family:var(--ff-m);font-size:.5rem;color:var(--aqua);letter-spacing:.08em}.seat-value-band strong{display:block;font-family:var(--ff-d);font-size:2.75rem;letter-spacing:-.06em;margin-top:5px}.seat-value-band span{font-size:.72rem;color:var(--fg3)}.seat-value-message{padding-left:20px;border-left:1px solid var(--edge2)}.seat-value-message b{font-family:var(--ff-d);font-size:1.35rem}.seat-value-message p{color:var(--fg2);font-size:.83rem;margin-top:5px}
.builder-compare{display:grid;grid-template-columns:1fr 1fr;gap:13px}.builder-side{padding:22px}.builder-products{display:grid;gap:8px;margin-top:18px}.builder-product{display:grid;grid-template-columns:44px 1fr auto;gap:12px;align-items:center;padding:13px;border:1px solid var(--edge2);border-radius:15px;background:var(--glass2)}.builder-mark{width:44px;height:44px;border-radius:13px;display:grid;place-items:center;border:1px solid color-mix(in srgb,var(--coral) 28%,var(--edge));font-family:var(--ff-d);font-weight:800}.builder-product b{display:block;font-size:.9rem}.builder-product small{display:block;color:var(--fg3);font-size:.69rem;line-height:1.4;margin-top:3px}.builder-product>strong{font-family:var(--ff-m);font-size:.68rem;color:var(--fg2);white-space:nowrap}.muted-product{opacity:.78}.builder-disclaimer{font-size:.73rem;color:var(--fg3);line-height:1.5;margin-top:14px}.source-links{display:flex;flex-wrap:wrap;gap:7px;margin-top:13px}.source-links a{font-family:var(--ff-m);font-size:.52rem;color:var(--aqua);padding:6px 8px;border:1px solid var(--edge2);border-radius:9px}.theos-builder{border-color:color-mix(in srgb,var(--aqua) 32%,var(--edge));background:radial-gradient(80% 120% at 100% 0%,color-mix(in srgb,var(--aqua) 11%,transparent),transparent 66%),var(--glass)}.builder-theos-title{display:flex;align-items:end;justify-content:space-between;gap:12px;margin-top:18px}.builder-theos-title strong{font-family:var(--ff-d);font-size:2rem;letter-spacing:-.05em}.builder-theos-title span{font-family:var(--ff-m);font-size:.48rem;color:var(--aqua)}.build-idea-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:18px}.build-idea{text-align:left;padding:13px;border:1px solid var(--edge2);border-radius:13px;background:var(--glass2);transition:.3s var(--spring)}.build-idea:hover,.build-idea.is-active{transform:translateY(-2px);border-color:color-mix(in srgb,var(--aqua) 34%,var(--edge));background:color-mix(in srgb,var(--aqua) 5%,var(--glass))}.build-idea b{display:block;font-size:.82rem}.build-idea small{display:block;font-size:.66rem;color:var(--fg3);margin-top:3px}.build-result{margin-top:10px;padding:17px;border:1px solid color-mix(in srgb,var(--aqua) 25%,var(--edge));border-radius:15px;background:var(--glass2)}.build-result small{font-family:var(--ff-m);font-size:.46rem;color:var(--aqua)}.build-result strong{display:block;font-family:var(--ff-d);font-size:1.35rem;margin-top:4px}.build-result p{font-size:.75rem;color:var(--fg2);margin-top:5px}.build-result span{display:inline-flex;margin-top:10px;font-family:var(--ff-m);font-size:.42rem;color:var(--aqua)}
.ai-economics{display:grid;grid-template-columns:.82fr 1.18fr;gap:13px}.ai-controls,.ai-results{padding:22px}.ai-control-head,.ai-result-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding-bottom:16px;border-bottom:1px solid var(--edge2)}.ai-control-head h3,.ai-result-head h3{font-size:1.35rem;margin-top:5px}.ai-control-head>span,.ai-result-head>span{font-family:var(--ff-m);font-size:.48rem;color:var(--aqua);white-space:nowrap}.ai-control-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}.ai-field{display:block;margin-top:10px}.ai-field>span{display:block;font-size:.7rem;color:var(--fg3);margin-bottom:6px}.ai-field input,.ai-field select{width:100%;height:46px;border:1px solid var(--edge);border-radius:11px;background:var(--glass2);padding:0 11px;color:var(--fg)}.ai-route-control{margin-top:15px;padding-top:14px;border-top:1px solid var(--edge2)}.ai-route-control>div{display:flex;justify-content:space-between;gap:12px;font-size:.78rem}.ai-route-control b{color:var(--aqua)}.ai-route-control input{width:100%;margin:12px 0 6px;accent-color:var(--aqua)}.ai-route-control small{display:block;color:var(--fg3);font-size:.68rem;line-height:1.45}.ai-result-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:14px}.ai-result-grid>div{padding:16px;border:1px solid var(--edge2);border-radius:15px;background:var(--glass2)}.ai-result-grid>div.good{border-color:color-mix(in srgb,var(--aqua) 30%,var(--edge));background:color-mix(in srgb,var(--aqua) 5%,var(--glass))}.ai-result-grid>div.saving{border-color:color-mix(in srgb,var(--aqua) 40%,var(--edge));background:linear-gradient(135deg,color-mix(in srgb,var(--aqua) 8%,var(--glass)),color-mix(in srgb,var(--violet) 5%,var(--glass)))}.ai-result-grid small{display:block;font-family:var(--ff-m);font-size:.46rem;color:var(--fg3);letter-spacing:.08em}.ai-result-grid strong{display:inline-block;font-family:var(--ff-d);font-size:2rem;letter-spacing:-.05em;margin-top:7px}.ai-result-grid .good strong,.ai-result-grid .saving strong{color:var(--aqua)}.ai-result-grid em{display:block;font-style:normal;color:var(--fg3);font-size:.64rem;margin-top:3px}.ai-route-visual{display:grid;grid-template-columns:80px 1fr 80px;gap:12px;align-items:center;margin-top:15px;padding:14px;border:1px solid var(--edge2);border-radius:14px}.route-all,.route-theos{text-align:center}.route-all span,.route-theos span{display:block;font-family:var(--ff-d);font-size:1.35rem}.route-all small,.route-theos small{font-family:var(--ff-m);font-size:.4rem;color:var(--fg3)}.route-line{height:8px;border-radius:999px;background:color-mix(in srgb,var(--coral) 28%,var(--edge2));position:relative;overflow:hidden}.route-line i{position:absolute;left:0;top:0;bottom:0;width:35%;background:linear-gradient(90deg,var(--aqua),var(--peri));transition:width .7s var(--spring)}.route-line b{position:absolute;right:0;top:0;bottom:0;width:5px;background:var(--coral)}.ai-source{margin-top:10px;padding:12px 14px;border:1px solid var(--edge2);border-radius:13px;background:var(--glass2)}.ai-source summary{font-family:var(--ff-m);font-size:.5rem;color:var(--fg2);cursor:pointer}.ai-source>div{font-size:.7rem;color:var(--fg3);margin-top:8px;line-height:1.45}
.guide-focus{margin-top:15px;padding:12px;border-left:2px solid var(--aqua);background:color-mix(in srgb,var(--aqua) 4%,var(--glass2));border-radius:0 11px 11px 0}.guide-focus small{display:block;font-family:var(--ff-m);font-size:.43rem;letter-spacing:.08em;color:var(--aqua)}.guide-focus b{display:block;font-size:.78rem;line-height:1.45;margin-top:5px}.guide-story-map{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:0 0 14px}.guide-story-step{min-height:56px;padding:8px;border:1px solid var(--edge2);border-radius:11px;background:var(--glass2);text-align:left;transition:.25s var(--e)}.guide-story-step b{display:block;font-family:var(--ff-d);font-size:.95rem;color:var(--fg2)}.guide-story-step span{display:block;font-family:var(--ff-m);font-size:.36rem;line-height:1.25;color:var(--fg3);margin-top:2px}.guide-story-step.is-active{border-color:color-mix(in srgb,var(--aqua) 38%,var(--edge));background:color-mix(in srgb,var(--aqua) 5%,var(--glass));box-shadow:0 0 22px -15px var(--aqua)}.guide-story-step.is-active b{color:var(--aqua)}
.summary-grid-five{grid-template-columns:.7fr .7fr 1.15fr 1.25fr 1.25fr}.summary-box.ai-summary{border-color:color-mix(in srgb,var(--aqua) 34%,var(--edge));background:linear-gradient(135deg,color-mix(in srgb,var(--aqua) 8%,var(--glass)),color-mix(in srgb,var(--violet) 6%,var(--glass)))}.summary-box.ai-summary strong{color:var(--aqua);font-size:1.7rem}.final-included-line{display:flex;flex-wrap:wrap;justify-content:center;gap:7px;margin:17px auto 0;max-width:900px}.final-included-line span{padding:7px 9px;border:1px solid var(--edge2);border-radius:999px;font-family:var(--ff-m);font-size:.48rem;color:var(--fg3);background:var(--glass2)}
@media(max-width:1000px){.friction-layout,.space-economics,.included-layout,.builder-compare,.ai-economics{grid-template-columns:1fr}.space-stack-card{min-height:480px}.summary-grid-five{grid-template-columns:repeat(2,1fr)}.summary-grid-five .ai-summary{grid-column:1/-1}.included-layout .cap-grid.compact{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.friction-row{grid-template-columns:1fr 70px 34px;gap:8px}.friction-row small{font-size:.68rem}.space-value-grid,.cap-grid.compact,.inherent-grid,.build-idea-grid,.ai-control-grid,.ai-result-grid{grid-template-columns:1fr}.seat-value-band{grid-template-columns:1fr}.seat-value-message{border-left:0;border-top:1px solid var(--edge2);padding-left:0;padding-top:14px}.builder-product{grid-template-columns:40px 1fr}.builder-product>strong{grid-column:2;text-align:left}.ai-route-visual{grid-template-columns:60px 1fr 60px}.summary-grid-five{grid-template-columns:1fr 1fr}.summary-grid-five .theos-summary,.summary-grid-five .savings-summary,.summary-grid-five .ai-summary{grid-column:1/-1}.guide-story-map{grid-template-columns:repeat(3,1fr)}}


/* =====================================================================
   V74 READABLE GUIDE
   The guide is a story assistant, not a miniature dashboard.
   ===================================================================== */

/* Wider desktop drawer so text is read, not decoded. */
.guide-drawer{
  width:min(620px,96vw)!important;
  padding:28px 30px 30px!important;
}

/* Header */
.guide-drawer-head{padding-bottom:20px!important}
.guide-drawer-id{gap:14px!important}
.drawer-ring{width:52px!important;height:52px!important}
.guide-drawer-id small{
  font-size:.66rem!important;
  letter-spacing:.11em!important;
}
.guide-drawer-id strong{
  font-family:var(--ff-d)!important;
  font-size:1.05rem!important;
  line-height:1.15!important;
  margin-top:4px!important;
}
.guide-drawer-close{
  width:44px!important;height:44px!important;
  font-size:1.5rem!important;
}

/* Main story */
.guide-drawer-copy{padding:30px 2px 22px!important}
.guide-drawer-copy h3{
  font-family:var(--ff-d)!important;
  font-size:clamp(2rem,2.4vw,2.55rem)!important;
  line-height:1.02!important;
  letter-spacing:-.045em!important;
  max-width:16ch;
}
.guide-drawer-copy p{
  font-size:1.06rem!important;
  line-height:1.58!important;
  margin-top:14px!important;
  max-width:48ch;
  color:var(--fg2)!important;
}

/* Why it matters becomes one readable note, not micro-copy. */
.guide-focus{
  margin-top:20px!important;
  padding:16px 17px!important;
  border-left-width:3px!important;
  border-radius:0 14px 14px 0!important;
}
.guide-focus small{
  font-size:.62rem!important;
  letter-spacing:.1em!important;
}
.guide-focus b{
  font-family:var(--ff)!important;
  font-size:.94rem!important;
  line-height:1.52!important;
  margin-top:7px!important;
  font-weight:650!important;
}

/* Replace 3x3 tiny story map with one clear 01–09 progress rail. */
.guide-story-map{
  display:grid!important;
  grid-template-columns:repeat(9,1fr)!important;
  gap:7px!important;
  margin:3px 0 22px!important;
  padding:4px 0!important;
}
.guide-story-step{
  min-width:0!important;
  min-height:50px!important;
  height:50px!important;
  padding:0!important;
  border-radius:13px!important;
  display:grid!important;
  place-items:center!important;
  text-align:center!important;
  position:relative;
}
.guide-story-step b{
  font-family:var(--ff-d)!important;
  font-size:1rem!important;
  line-height:1!important;
  color:var(--fg2)!important;
}
.guide-story-step span{display:none!important}
.guide-story-step.is-active{
  transform:translateY(-2px);
  border-color:color-mix(in srgb,var(--aqua) 55%,var(--edge))!important;
  background:linear-gradient(145deg,color-mix(in srgb,var(--aqua) 10%,var(--glass)),color-mix(in srgb,var(--peri) 7%,var(--glass)))!important;
  box-shadow:0 10px 30px -20px var(--aqua)!important;
}
.guide-story-step.is-active b{
  color:var(--aqua)!important;
  font-size:1.15rem!important;
}
.guide-story-step.is-active:after{
  content:"";
  position:absolute;
  left:18%;right:18%;bottom:5px;height:2px;border-radius:99px;
  background:linear-gradient(90deg,var(--peri),var(--aqua));
}

/* Large live values. */
.guide-drawer-live{
  display:grid!important;
  grid-template-columns:repeat(3,1fr)!important;
  gap:10px!important;
}
.guide-drawer-live>div{
  min-height:132px!important;
  padding:17px 16px!important;
  border-radius:17px!important;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.guide-drawer-live small{
  font-size:.6rem!important;
  line-height:1.3!important;
  letter-spacing:.08em!important;
}
.guide-drawer-live strong{
  display:block!important;
  font-size:2.2rem!important;
  line-height:.95!important;
  margin-top:11px!important;
  white-space:nowrap;
}
.guide-drawer-live em{
  display:block!important;
  margin:8px 0 0!important;
  font-size:.78rem!important;
  line-height:1.2!important;
}

/* Make the TheOS and savings values visually obvious. */
.guide-drawer-live>div.good{
  border-color:color-mix(in srgb,var(--aqua) 45%,var(--edge))!important;
  background:
    radial-gradient(110% 130% at 100% 0%,color-mix(in srgb,var(--aqua) 18%,transparent),transparent 62%),
    linear-gradient(140deg,color-mix(in srgb,var(--peri) 8%,var(--glass)),color-mix(in srgb,var(--aqua) 8%,var(--glass)))!important;
}
.guide-drawer-live>div.saving{
  border-color:color-mix(in srgb,var(--aqua) 52%,var(--edge))!important;
  background:
    radial-gradient(110% 130% at 100% 0%,color-mix(in srgb,var(--violet) 16%,transparent),transparent 62%),
    linear-gradient(140deg,color-mix(in srgb,var(--aqua) 9%,var(--glass)),color-mix(in srgb,var(--violet) 7%,var(--glass)))!important;
}

/* Team control is contextual, hidden when it adds no value to the story. */
.guide-drawer-team{display:none!important}
.guide-drawer.show-team .guide-drawer-team{
  display:block!important;
  margin-top:12px!important;
  padding:17px 18px!important;
  border-radius:16px!important;
}
.guide-team-line small{font-size:.6rem!important}
.guide-team-line b{
  display:block;
  font-family:var(--ff-d)!important;
  font-size:1.15rem!important;
  margin-top:3px;
}
.guide-team-line>span{
  font-size:.88rem!important;
  font-weight:700;
}
.guide-drawer-team input{
  margin-top:17px!important;
  height:22px;
}

/* Progress + actions */
.guide-drawer-progress{
  margin:22px 1px 0!important;
  height:4px!important;
}
.guide-drawer-actions{
  gap:10px!important;
  margin-top:18px!important;
  padding-top:14px!important;
}
.guide-drawer-actions .btn{
  min-height:54px!important;
  font-size:.94rem!important;
}

/* Give the AI step a slightly different emphasis without adding more UI. */
.guide-drawer.ai-step .guide-drawer-live>div:first-child{
  border-color:color-mix(in srgb,var(--coral) 30%,var(--edge));
}
.guide-drawer.final-step .guide-drawer-live{
  grid-template-columns:1fr 1fr 1fr!important;
}

/* Desktop-height handling: if the screen is short, drawer scrolls naturally. */
@media(max-height:860px) and (min-width:761px){
  .guide-drawer{padding-top:20px!important;padding-bottom:20px!important}
  .guide-drawer-copy{padding-top:22px!important;padding-bottom:17px!important}
  .guide-drawer-copy h3{font-size:1.9rem!important}
  .guide-drawer-live>div{min-height:112px!important}
  .guide-drawer-live strong{font-size:1.9rem!important}
  .guide-focus{margin-top:15px!important}
  .guide-story-map{margin-bottom:16px!important}
}

/* Tablet/mobile: full width, still readable. */
@media(max-width:760px){
  .guide-drawer{
    width:100%!important;
    padding:20px 18px calc(20px + env(safe-area-inset-bottom))!important;
  }
  .guide-drawer-copy{padding:24px 0 18px!important}
  .guide-drawer-copy h3{
    font-size:1.85rem!important;
    max-width:18ch!important;
  }
  .guide-drawer-copy p{font-size:1rem!important}
  .guide-focus b{font-size:.9rem!important}
  .guide-story-map{
    grid-template-columns:repeat(9,48px)!important;
    overflow-x:auto!important;
    gap:6px!important;
    padding-bottom:6px!important;
    scrollbar-width:none;
  }
  .guide-story-map::-webkit-scrollbar{display:none}
  .guide-drawer-live{
    grid-template-columns:1fr!important;
  }
  .guide-drawer-live>div{
    min-height:100px!important;
    display:grid!important;
    grid-template-columns:1fr auto!important;
    grid-template-rows:auto auto!important;
    align-items:center;
    column-gap:10px;
  }
  .guide-drawer-live small{grid-column:1;grid-row:1}
  .guide-drawer-live strong{
    grid-column:2;grid-row:1 / span 2;
    font-size:2rem!important;
    margin-top:0!important;
  }
  .guide-drawer-live em{grid-column:1;grid-row:2;margin-top:4px!important}
  .guide-drawer-actions{grid-template-columns:1fr!important}
}


/* =====================================================================
   V75 NARRATIVE FLOW
   One story: need → stack → operating load → space layer → seat value
   → software price → AI price → full operating economics.
   ===================================================================== */
.pricing-bridge{
  position:relative;
  padding:10px 0 28px;
}
.pricing-bridge .wrap{
  max-width:920px;
  text-align:center;
  padding-top:24px;
  border-top:1px solid var(--edge2);
}
.pricing-bridge small{
  font-family:var(--ff-m);
  font-size:.58rem;
  letter-spacing:.12em;
  color:var(--aqua);
}
.pricing-bridge p{
  margin:10px auto 0;
  font-family:var(--ff-d);
  font-size:clamp(1.25rem,2vw,1.75rem);
  line-height:1.2;
  color:var(--fg2);
  letter-spacing:-.035em;
}
.pricing-bridge strong{color:var(--fg);font-weight:720}
.pricing-bridge--price small{color:var(--peri)}
.pricing-bridge--ai small{color:var(--coral)}

.stack-footprint{
  margin-top:12px;
  padding:16px;
  display:grid;
  grid-template-columns:1fr 48px 1fr;
  gap:10px;
  align-items:center;
  border:1px solid var(--edge2);
  border-radius:16px;
  background:var(--glass2);
}
.stack-footprint>div{padding:8px 10px}
.stack-footprint small{
  display:block;
  font-family:var(--ff-m);
  font-size:.55rem;
  letter-spacing:.09em;
  color:var(--fg3);
}
.stack-footprint strong{
  display:block;
  font-family:var(--ff-d);
  font-size:1.35rem;
  letter-spacing:-.035em;
  margin-top:6px;
}
.stack-footprint span{
  display:block;
  margin-top:5px;
  color:var(--fg3);
  font-size:.78rem;
  line-height:1.45;
}
.stack-footprint>i{
  width:42px;height:42px;border-radius:50%;
  display:grid;place-items:center;
  border:1px solid var(--edge);
  background:var(--glass);
  color:var(--aqua);
  font-style:normal;
}
.stack-footprint .space-footprint{
  border-left:1px solid color-mix(in srgb,var(--aqua) 22%,var(--edge));
}
.stack-footprint .space-footprint strong{color:var(--aqua)}

.included-builder-spotlight{
  margin-top:14px;
  padding:22px;
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:24px;
  align-items:start;
  border-color:color-mix(in srgb,var(--aqua) 24%,var(--edge));
}
.included-builder-spotlight>div:first-child small{
  font-family:var(--ff-m);
  font-size:.56rem;
  letter-spacing:.1em;
  color:var(--aqua);
}
.included-builder-spotlight h3{
  font-size:1.55rem;
  margin-top:10px;
}
.included-builder-spotlight p{
  color:var(--fg2);
  font-size:.86rem;
  line-height:1.55;
  margin-top:10px;
}
.builder-spotlight-value{
  padding:17px;
  border:1px solid var(--edge2);
  border-radius:15px;
  background:var(--glass2);
}
.builder-spotlight-value>span{
  display:inline-flex;
  padding:5px 8px;
  border-radius:999px;
  border:1px solid color-mix(in srgb,var(--aqua) 30%,var(--edge));
  font-family:var(--ff-m);
  font-size:.48rem;
  color:var(--aqua);
}
.builder-spotlight-value>strong{
  display:block;
  font-family:var(--ff-d);
  font-size:1.6rem;
  letter-spacing:-.04em;
  margin-top:10px;
}
.builder-spotlight-value .source-links{margin-top:12px}

.price-reveal-label{
  margin:20px 0 10px;
  padding:16px 3px 4px;
  border-top:1px solid var(--edge2);
}
.price-reveal-label small{
  display:block;
  font-family:var(--ff-m);
  font-size:.58rem;
  letter-spacing:.11em;
  color:var(--aqua);
}
.price-reveal-label strong{
  display:block;
  font-family:var(--ff-d);
  font-size:1.35rem;
  margin-top:5px;
  letter-spacing:-.03em;
}

/* The old compare total is now the intentional reveal in Step 06. */
#math .compare-total{margin-top:0}

/* Step 02 should feel like comparison discovery, not final checkout. */
#compare .compare-shell{
  border-color:color-mix(in srgb,var(--peri) 16%,var(--edge));
}

/* Give Step 06 a stronger reveal atmosphere. */
#math .graph-card,
#math .team-card{
  border-color:color-mix(in srgb,var(--aqua) 20%,var(--edge));
}

@media(max-width:900px){
  .stack-footprint{grid-template-columns:1fr}
  .stack-footprint>i{transform:rotate(90deg);margin:auto}
  .stack-footprint .space-footprint{border-left:0;border-top:1px solid color-mix(in srgb,var(--aqua) 22%,var(--edge));padding-top:14px}
  .included-builder-spotlight{grid-template-columns:1fr}
}


/* =====================================================================
   V76 METRICS-FIRST PRICING
   The page shows numbers. The guide carries the explanation.
   ===================================================================== */

.sec{padding:clamp(62px,7vw,104px) 0!important}
.sec-head{margin-bottom:22px!important}
.sec-head h2{margin-bottom:10px!important}
.sec-head .lede{
  max-width:54ch!important;
  font-size:1rem!important;
  line-height:1.5!important;
  color:var(--fg3)!important;
}

/* Live KPI strip on every chapter */
.chapter-kpis{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:9px;
  margin-bottom:16px;
}
.chapter-kpis--economics{grid-template-columns:repeat(5,1fr)}
.chapter-kpis>div{
  min-height:116px;
  padding:16px;
  border:1px solid var(--edge2);
  border-radius:16px;
  background:var(--glass2);
  display:flex;
  flex-direction:column;
  justify-content:center;
  position:relative;
  overflow:hidden;
}
.chapter-kpis>div.good{
  border-color:color-mix(in srgb,var(--aqua) 34%,var(--edge));
  background:linear-gradient(140deg,color-mix(in srgb,var(--aqua) 7%,var(--glass)),var(--glass2));
}
.chapter-kpis>div.saving{
  border-color:color-mix(in srgb,var(--aqua) 42%,var(--edge));
  background:linear-gradient(140deg,color-mix(in srgb,var(--aqua) 8%,var(--glass)),color-mix(in srgb,var(--violet) 5%,var(--glass)));
}
.chapter-kpis small{
  font-family:var(--ff-m);
  font-size:.55rem;
  letter-spacing:.08em;
  color:var(--fg3);
}
.chapter-kpis strong{
  display:block;
  margin-top:10px;
  font-family:var(--ff-d);
  font-size:clamp(1.65rem,2.5vw,2.35rem);
  line-height:.95;
  letter-spacing:-.05em;
}
.chapter-kpis .good strong,.chapter-kpis .saving strong{color:var(--aqua)}

/* Reduce explanation density in supporting cards. */
.friction-row{min-height:76px!important}
.friction-row b{font-size:.95rem!important}
.friction-row small{display:none!important}
.friction-note{font-size:.68rem!important}

.space-value-grid{gap:8px!important}
.space-value-card{min-height:126px!important;padding:16px!important}
.space-value-card h3{font-size:1rem!important;margin-top:18px!important}
.space-value-card p{display:none!important}

.inherent-grid>div{min-height:72px!important;padding:12px!important}
.inherent-grid>div b{font-size:.84rem!important}
.inherent-grid>div small{display:none!important}
.included-builder-spotlight p{font-size:.78rem!important;line-height:1.45!important}

/* Guide: always show the commercial calculator. */
.guide-drawer{
  width:min(620px,96vw)!important;
}
.guide-drawer-live{
  grid-template-columns:repeat(3,1fr)!important;
}
.guide-economics-strip{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:7px;
  margin-top:8px;
}
.guide-economics-strip>div,
.guide-context-strip>div{
  padding:12px;
  border:1px solid var(--edge2);
  border-radius:13px;
  background:var(--glass2);
}
.guide-economics-strip small,
.guide-context-strip small{
  display:block;
  font-family:var(--ff-m);
  font-size:.46rem;
  line-height:1.3;
  letter-spacing:.07em;
  color:var(--fg3);
}
.guide-economics-strip strong,
.guide-context-strip strong{
  display:block;
  margin-top:6px;
  font-family:var(--ff-d);
  font-size:1.12rem;
  letter-spacing:-.035em;
}
.guide-economics-strip>div:nth-child(2) strong,
.guide-economics-strip>div:nth-child(3) strong{color:var(--aqua)}

.guide-context-strip{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:7px;
  margin-top:8px;
}
.guide-context-strip>div{
  background:color-mix(in srgb,var(--aqua) 3%,var(--glass2));
}

/* Story map is navigation, not another content wall. */
.guide-story-map{margin-bottom:14px!important}
.guide-story-step{height:46px!important;min-height:46px!important}

/* Keep drawer open while navigation changes the page. */
@media(min-width:761px){
  body.guide-open{overflow:auto!important}
  body.guide-open .guide-overlay{display:none!important}
  .guide-drawer{pointer-events:auto}
}

/* On mobile, keep modal behaviour for usability. */
@media(max-width:760px){
  .chapter-kpis,
  .chapter-kpis--economics{
    grid-template-columns:1fr 1fr!important;
  }
  .chapter-kpis>div{min-height:96px}
  .guide-economics-strip{grid-template-columns:1fr 1fr}
  .guide-context-strip{grid-template-columns:1fr 1fr 1fr}
}


/* =====================================================================
   V77 FINAL PRICING
   Chapter 08 is the checkout moment: total value → monthly / annual /
   self-hosted → expandable BOQ.
   ===================================================================== */

.final-pricing{
  position:relative;
  padding:clamp(86px,9vw,145px) 0 clamp(110px,11vw,170px)!important;
  text-align:left!important;
}
.final-pricing .pricing-step-marker{margin-bottom:28px}
.final-pricing .pricing-finale-title{
  max-width:12ch!important;
  margin:0!important;
  text-align:left!important;
}
.final-pricing .pricing-finale-lead{
  max-width:46ch!important;
  margin:20px 0 34px!important;
  text-align:left!important;
  font-size:clamp(1.05rem,1.6vw,1.3rem)!important;
}
.final-pricing .pricing-finale-lead strong{font-weight:650!important}

/* Grand savings result */
.grand-value{
  display:grid;
  grid-template-columns:1.05fr 80px 1.35fr;
  gap:20px;
  align-items:center;
  padding:26px 28px;
  border-color:color-mix(in srgb,var(--aqua) 32%,var(--edge));
  background:
    radial-gradient(70% 150% at 0% 50%,color-mix(in srgb,var(--peri) 12%,transparent),transparent 70%),
    radial-gradient(80% 150% at 100% 50%,color-mix(in srgb,var(--aqua) 13%,transparent),transparent 68%),
    var(--glass);
}
.grand-value-copy small{
  font-family:var(--ff-m);
  font-size:.6rem;
  letter-spacing:.11em;
  color:var(--aqua);
}
.grand-value-copy>strong{
  display:block;
  margin-top:8px;
  font-family:var(--ff-d);
  font-size:clamp(3rem,5.6vw,5.25rem);
  line-height:.9;
  letter-spacing:-.07em;
  color:var(--aqua);
  text-shadow:0 0 30px color-mix(in srgb,var(--aqua) 14%,transparent);
}
.grand-value-copy p{
  margin-top:10px;
  color:var(--fg3);
  font-size:.8rem;
  max-width:34ch;
}
.grand-value-flow{
  position:relative;
  height:90px;
  display:grid;
  place-items:center;
}
.grand-value-flow i{
  width:2px;height:72px;
  background:linear-gradient(transparent,var(--edge),transparent);
}
.grand-value-flow span{
  position:absolute;
  width:10px;height:10px;border-radius:50%;
}
.grand-stack-dot{
  top:5px;
  background:var(--coral);
  box-shadow:0 0 14px var(--coral);
  animation:grandFlowDown 2.7s var(--e) infinite;
}
.grand-theos-dot{
  bottom:5px;
  background:var(--aqua);
  box-shadow:0 0 14px var(--aqua);
  animation:grandFlowUp 2.7s var(--e) infinite;
}
@keyframes grandFlowDown{
  0%{transform:translateY(0);opacity:.2}
  45%{opacity:1}
  100%{transform:translateY(70px);opacity:0}
}
@keyframes grandFlowUp{
  0%{transform:translateY(0);opacity:.15}
  45%{opacity:.8}
  100%{transform:translateY(-70px);opacity:0}
}
.grand-value-metrics{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}
.grand-value-metrics>div{
  min-height:92px;
  padding:13px 14px;
  border:1px solid var(--edge2);
  border-radius:14px;
  background:var(--glass2);
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.grand-value-metrics small{
  font-family:var(--ff-m);
  font-size:.48rem;
  letter-spacing:.07em;
  color:var(--fg3);
}
.grand-value-metrics b{
  display:block;
  margin-top:6px;
  font-family:var(--ff-d);
  font-size:1.35rem;
  letter-spacing:-.04em;
}
.grand-value-metrics>div:nth-child(1) b,
.grand-value-metrics>div:nth-child(2) b{color:var(--aqua)}

/* Final choice intro */
.final-choice-intro{
  margin:54px 0 16px;
}
.final-choice-intro small{
  font-family:var(--ff-m);
  font-size:.6rem;
  letter-spacing:.11em;
  color:var(--fg3);
}
.final-choice-intro h3{
  margin-top:8px;
  font-size:clamp(1.65rem,2.6vw,2.35rem);
}
.final-choice-intro p{
  margin-top:7px;
  color:var(--fg3);
  font-size:.84rem;
}

/* The three final pricing cards */
.final-price-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
}
.final-price-card{
  position:relative;
  min-height:430px;
  padding:22px;
  border:1px solid var(--edge);
  border-radius:22px;
  background:var(--glass);
  box-shadow:var(--shadow);
  overflow:hidden;
  display:flex;
  flex-direction:column;
  transition:transform .42s var(--spring),border-color .35s var(--e),box-shadow .35s var(--e);
}
.final-price-card:hover{
  transform:translateY(-6px);
  border-color:color-mix(in srgb,var(--aqua) 24%,var(--edge));
}
.final-price-card.featured{
  border-color:color-mix(in srgb,var(--aqua) 45%,var(--edge));
  background:
    radial-gradient(115% 110% at 100% 0%,color-mix(in srgb,var(--aqua) 17%,transparent),transparent 62%),
    radial-gradient(100% 100% at 0% 100%,color-mix(in srgb,var(--peri) 13%,transparent),transparent 64%),
    var(--glass);
  box-shadow:0 30px 76px -42px var(--aqua),var(--shadow);
  transform:translateY(-6px);
}
.final-price-card.featured:hover{transform:translateY(-10px)}
.featured-glow{
  position:absolute;
  inset:-50% -20%;
  pointer-events:none;
  background:linear-gradient(105deg,transparent,rgba(255,255,255,.07),transparent);
  transform:translateX(-70%) rotate(8deg);
  animation:featuredSheen 6.5s ease-in-out infinite;
}
@keyframes featuredSheen{
  0%,64%{transform:translateX(-70%) rotate(8deg);opacity:0}
  76%{opacity:1}
  100%{transform:translateX(70%) rotate(8deg);opacity:0}
}
.price-card-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.price-card-top small{
  font-family:var(--ff-m);
  font-size:.48rem;
  letter-spacing:.08em;
  color:var(--fg3);
}
.price-badge{
  display:inline-flex;
  align-items:center;
  min-height:25px;
  padding:4px 8px;
  border-radius:999px;
  border:1px solid color-mix(in srgb,var(--aqua) 28%,var(--edge));
  font-family:var(--ff-m);
  font-size:.46rem;
  letter-spacing:.08em;
  color:var(--aqua);
}
.final-price-card h3{
  margin-top:30px;
  font-size:1.6rem;
}
.final-price-number{
  display:flex;
  align-items:flex-end;
  gap:7px;
  margin-top:20px;
}
.final-price-number strong{
  font-family:var(--ff-d);
  font-size:clamp(3rem,4.8vw,4.7rem);
  line-height:.84;
  letter-spacing:-.075em;
}
.final-price-card.featured .final-price-number strong{color:var(--aqua)}
.final-price-number span{
  padding-bottom:5px;
  color:var(--fg3);
  font-size:.76rem;
}
.final-price-number.custom strong{
  font-size:clamp(2.8rem,4vw,4rem);
}
.final-price-unit{
  min-height:38px;
  margin-top:10px;
  color:var(--fg3);
  font-size:.76rem;
  line-height:1.4;
}
.final-price-saving{
  margin-top:22px;
  padding:12px 13px;
  border:1px solid color-mix(in srgb,var(--aqua) 20%,var(--edge));
  border-radius:13px;
  background:color-mix(in srgb,var(--aqua) 4%,var(--glass2));
}
.final-price-saving small{
  display:block;
  font-family:var(--ff-m);
  font-size:.46rem;
  letter-spacing:.08em;
  color:var(--fg3);
}
.final-price-saving b{
  display:block;
  margin-top:5px;
  font-family:var(--ff-d);
  font-size:1.15rem;
  color:var(--aqua);
}
.final-price-saving.neutral b{color:var(--fg)}
.final-price-card>p{
  margin:16px 0 18px;
  color:var(--fg3);
  font-size:.76rem;
  line-height:1.5;
}
.final-card-cta{
  width:100%;
  margin-top:auto;
}
.final-price-card.is-live-change{
  animation:priceCardUpdate .62s var(--spring);
}
@keyframes priceCardUpdate{
  0%{transform:translateY(var(--base-y,0)) scale(1)}
  45%{transform:translateY(var(--base-y,0)) scale(1.012);border-color:color-mix(in srgb,var(--aqua) 55%,var(--edge))}
  100%{transform:translateY(var(--base-y,0)) scale(1)}
}
.final-price-card.featured{--base-y:-6px}

/* Annual stack -> TheOS -> savings strip */
.final-value-strip{
  margin-top:12px;
  padding:16px 18px;
  display:grid;
  grid-template-columns:1fr 46px 1fr 46px 1fr;
  gap:8px;
  align-items:center;
  border:1px solid var(--edge2);
  border-radius:17px;
  background:var(--glass2);
}
.final-value-strip>div{text-align:center}
.final-value-strip small{
  display:block;
  font-family:var(--ff-m);
  font-size:.5rem;
  letter-spacing:.08em;
  color:var(--fg3);
}
.final-value-strip strong{
  display:block;
  margin-top:6px;
  font-family:var(--ff-d);
  font-size:1.45rem;
  letter-spacing:-.04em;
}
.final-value-strip>i{
  display:grid;
  place-items:center;
  width:36px;height:36px;
  border:1px solid var(--edge);
  border-radius:50%;
  font-style:normal;
  color:var(--fg3);
}
.final-value-strip .theos strong,
.final-value-strip .saving strong{color:var(--aqua)}

/* Expandable BOQ */
.boq-shell{
  margin-top:20px;
  border:1px solid var(--edge);
  border-radius:20px;
  background:var(--glass2);
  overflow:hidden;
}
.boq-toggle{
  width:100%;
  min-height:96px;
  padding:18px 20px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  text-align:left;
  transition:background .28s var(--e);
}
.boq-toggle:hover{background:var(--glass)}
.boq-toggle>span{display:block}
.boq-toggle small{
  display:block;
  font-family:var(--ff-m);
  font-size:.52rem;
  letter-spacing:.1em;
  color:var(--aqua);
}
.boq-toggle strong{
  display:block;
  margin-top:4px;
  font-family:var(--ff-d);
  font-size:1.15rem;
}
.boq-toggle em{
  display:block;
  margin-top:4px;
  font-style:normal;
  color:var(--fg3);
  font-size:.72rem;
}
.boq-toggle-icon{
  width:40px;height:40px;
  flex:0 0 auto;
  display:grid;
  place-items:center;
  border:1px solid var(--edge);
  border-radius:12px;
  background:var(--glass2);
  font-family:var(--ff-d);
  font-size:1.35rem;
  transition:transform .42s var(--spring),background .3s var(--e);
}
.boq-shell.open .boq-toggle-icon{
  transform:rotate(45deg);
  background:color-mix(in srgb,var(--aqua) 8%,var(--glass));
}
.boq-panel{
  display:grid;
  grid-template-rows:0fr;
  opacity:0;
  border-top:1px solid transparent;
  transition:grid-template-rows .6s var(--spring),opacity .38s var(--e),border-color .35s var(--e);
}
.boq-shell.open .boq-panel{
  grid-template-rows:1fr;
  opacity:1;
  border-top-color:var(--edge2);
}
.boq-panel-inner{
  min-height:0;
  overflow:hidden;
}
.boq-head{
  padding:22px 22px 15px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
}
.boq-head small{
  font-family:var(--ff-m);
  font-size:.52rem;
  letter-spacing:.1em;
  color:var(--aqua);
}
.boq-head h3{
  margin-top:5px;
  font-size:1.5rem;
}
.boq-head-metrics{
  display:flex;
  gap:7px;
}
.boq-head-metrics>span{
  min-width:105px;
  padding:10px 12px;
  border:1px solid var(--edge2);
  border-radius:12px;
  background:var(--glass2);
}
.boq-head-metrics small{
  color:var(--fg3);
  font-size:.42rem;
}
.boq-head-metrics b{
  display:block;
  margin-top:4px;
  font-family:var(--ff-d);
  font-size:.95rem;
}
.boq-table-wrap{
  overflow-x:auto;
  padding:0 22px;
}
.boq-table{
  width:100%;
  border-collapse:collapse;
  min-width:820px;
  font-size:.78rem;
}
.boq-table th{
  padding:11px 10px;
  border-bottom:1px solid var(--edge);
  text-align:left;
  font-family:var(--ff-m);
  font-size:.48rem;
  letter-spacing:.08em;
  color:var(--fg3);
  font-weight:500;
}
.boq-table th:nth-child(2),
.boq-table th:nth-child(3),
.boq-table th:nth-child(4),
.boq-table th:nth-child(5){text-align:right}
.boq-row td{
  padding:13px 10px;
  border-bottom:1px solid var(--edge2);
  vertical-align:middle;
}
.boq-row td:not(:first-child){text-align:right}
.boq-row strong{
  display:block;
  font-size:.8rem;
}
.boq-row small{
  display:block;
  margin-top:2px;
  color:var(--fg3);
  font-size:.63rem;
}
.boq-row .included{
  color:var(--aqua);
  font-family:var(--ff-m);
  font-size:.62rem;
}
.boq-row .benchmark{
  color:var(--fg2);
  font-family:var(--ff-m);
  font-size:.65rem;
}
.boq-row{
  animation:boqRowIn .48s var(--spring) both;
}
@keyframes boqRowIn{
  from{opacity:0;transform:translateY(8px)}
  to{opacity:1;transform:none}
}
.boq-group td{
  padding:16px 10px 8px;
  border-bottom:1px solid var(--edge);
  font-family:var(--ff-m);
  font-size:.5rem;
  letter-spacing:.1em;
  color:var(--aqua);
  background:color-mix(in srgb,var(--aqua) 2%,transparent);
}
.boq-total{
  margin:14px 22px 0;
  padding:16px;
  display:grid;
  grid-template-columns:1.4fr 1fr 1fr;
  gap:8px;
  border:1px solid color-mix(in srgb,var(--aqua) 24%,var(--edge));
  border-radius:15px;
  background:
    linear-gradient(135deg,color-mix(in srgb,var(--aqua) 5%,var(--glass)),color-mix(in srgb,var(--peri) 4%,var(--glass)));
}
.boq-total>div{
  padding:6px 8px;
}
.boq-total small{
  display:block;
  font-family:var(--ff-m);
  font-size:.48rem;
  letter-spacing:.08em;
  color:var(--fg3);
}
.boq-total strong{
  display:block;
  margin-top:5px;
  font-family:var(--ff-d);
  font-size:1.1rem;
}
.boq-total>div:nth-child(2) strong,
.boq-total>div:nth-child(3) strong{color:var(--aqua)}
.boq-note{
  margin:12px 22px 22px;
  padding:13px 14px;
  border-radius:13px;
  background:var(--glass2);
  color:var(--fg3);
  font-size:.7rem;
  line-height:1.5;
}
.boq-note b{color:var(--fg2)}

.final-actions{
  display:flex;
  justify-content:center;
  gap:9px;
  margin-top:24px;
}
.final-disclaimer{
  max-width:90ch;
  margin:16px auto 0;
  text-align:center;
  color:var(--fg3);
  font-size:.68rem;
  line-height:1.55;
}

/* Light mode */
[data-theme="light"] .final-price-card.featured{
  background:
    radial-gradient(115% 110% at 100% 0%,rgba(63,224,200,.16),transparent 62%),
    radial-gradient(100% 100% at 0% 100%,rgba(124,124,255,.12),transparent 64%),
    rgba(255,255,255,.68);
}
[data-theme="light"] .grand-value{
  background:
    radial-gradient(70% 150% at 0% 50%,rgba(124,124,255,.12),transparent 70%),
    radial-gradient(80% 150% at 100% 50%,rgba(63,224,200,.12),transparent 68%),
    rgba(255,255,255,.68);
}

/* Responsive */
@media(max-width:980px){
  .grand-value{grid-template-columns:1fr}
  .grand-value-flow{display:none}
  .final-price-grid{grid-template-columns:1fr}
  .final-price-card{min-height:0}
  .final-price-card.featured{transform:none}
  .grand-value-metrics{grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
  .final-pricing{padding-top:76px!important}
  .grand-value{padding:20px}
  .grand-value-copy>strong{font-size:3.4rem}
  .grand-value-metrics{grid-template-columns:1fr 1fr}
  .grand-value-metrics>div{min-height:82px}
  .final-value-strip{
    grid-template-columns:1fr;
    text-align:left;
  }
  .final-value-strip>i{transform:rotate(90deg);margin:auto}
  .boq-head{align-items:flex-start;flex-direction:column}
  .boq-head-metrics{width:100%;display:grid;grid-template-columns:repeat(3,1fr)}
  .boq-head-metrics>span{min-width:0}
  .boq-total{grid-template-columns:1fr}
  .final-actions{flex-direction:column}
  .final-actions .btn{width:100%}
}
@media(max-width:460px){
  .grand-value-metrics{grid-template-columns:1fr}
  .boq-head-metrics{grid-template-columns:1fr}
}


/* =====================================================================
   V80 PRICE WIZARD
   Four choices → one result. Everything else is optional evidence.
   ===================================================================== */
#legacyPricingSupport{display:none!important}
#wizardUsers,#wizardCommitment,#wizardDeployment,#quote{scroll-margin-top:96px}
.wizard-hero .hero-copy h1{max-width:10ch}
.wizard-hud{min-height:430px!important;justify-content:space-between}
.wizard-hud-price{padding:26px 6px 18px}
.wizard-hud-price small{display:block;font-family:var(--ff-m);font-size:.58rem;letter-spacing:.11em;color:var(--aqua)}
.wizard-hud-price strong{display:inline-block;margin-top:14px;font-family:var(--ff-d);font-size:clamp(3.8rem,6vw,6rem);line-height:.86;letter-spacing:-.075em}
.wizard-hud-price>span{margin-left:8px;color:var(--fg3);font-size:.82rem}.wizard-hud-price em{display:block;margin-top:12px;font-style:normal;color:var(--fg2);font-size:.84rem}
.wizard-hud-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;padding:14px 0;border-block:1px solid var(--edge2)}
.wizard-hud-steps a{padding:11px;border-radius:13px;background:var(--glass2);border:1px solid var(--edge2);transition:.3s var(--spring)}
.wizard-hud-steps a:hover{transform:translateY(-2px);border-color:var(--edge)}
.wizard-hud-steps b{display:block;font-family:var(--ff-d);font-size:1rem;color:var(--aqua)}.wizard-hud-steps span{display:block;margin-top:3px;font-family:var(--ff-m);font-size:.46rem;color:var(--fg3);letter-spacing:.06em}
.wizard-hud-benchmark{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:14px}
.wizard-hud-benchmark>div{padding:12px;border:1px solid var(--edge2);border-radius:13px;background:var(--glass2)}
.wizard-hud-benchmark small{display:block;font-family:var(--ff-m);font-size:.44rem;color:var(--fg3);letter-spacing:.06em}.wizard-hud-benchmark strong{display:block;margin-top:6px;font-family:var(--ff-d);font-size:1.25rem;letter-spacing:-.035em}.wizard-hud-benchmark .good strong{color:var(--aqua)}
.wizard-hidden-targets{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip-path:inset(100%)!important}

.users-picker{padding:26px;display:grid;grid-template-columns:.7fr 1.5fr .8fr;gap:28px;align-items:center}
.users-number small,.users-live small{font-family:var(--ff-m);font-size:.55rem;letter-spacing:.1em;color:var(--fg3)}
.users-number>div{display:flex;align-items:flex-end;gap:9px;margin-top:7px}.users-number input{width:180px;border:0;background:transparent;color:var(--fg);font-family:var(--ff-d);font-size:clamp(3.3rem,6vw,5.8rem);font-weight:750;line-height:.88;letter-spacing:-.07em;outline:none}.users-number span{padding-bottom:7px;color:var(--fg3);font-size:.8rem}
.users-number p{margin-top:10px;color:var(--aqua);font-size:.75rem}.users-control input[type=range]{width:100%;accent-color:var(--aqua)}
.users-presets{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;margin-top:14px}.users-presets button{min-height:38px;border:1px solid var(--edge2);border-radius:10px;background:var(--glass2);font-family:var(--ff-m);font-size:.56rem;color:var(--fg2)}.users-presets button:hover{border-color:color-mix(in srgb,var(--aqua) 35%,var(--edge));color:var(--fg)}
.users-live{text-align:right}.users-live strong{display:block;margin-top:8px;font-family:var(--ff-d);font-size:clamp(2.5rem,4.5vw,4.4rem);color:var(--aqua);letter-spacing:-.06em;line-height:.9}.users-live span{color:var(--fg3);font-size:.72rem}
.wizard-step-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:18px}

.wizard-choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.wizard-choice{position:relative;min-height:300px;padding:24px;text-align:left;border:1px solid var(--edge);border-radius:22px;background:var(--glass2);overflow:hidden;transition:transform .36s var(--spring),border-color .3s var(--e),background .3s var(--e),box-shadow .35s var(--e)}
.wizard-choice:hover{transform:translateY(-4px)}.wizard-choice.is-selected{border-color:color-mix(in srgb,var(--aqua) 55%,var(--edge));background:linear-gradient(140deg,color-mix(in srgb,var(--aqua) 8%,var(--glass)),color-mix(in srgb,var(--peri) 5%,var(--glass)));box-shadow:0 28px 70px -48px var(--aqua)}
.wizard-choice-icon{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;border:1px solid var(--edge);background:var(--glass2);font-family:var(--ff-d);font-weight:800;color:var(--aqua)}
.wizard-choice>small{display:block;margin-top:24px;font-family:var(--ff-m);font-size:.52rem;letter-spacing:.1em;color:var(--fg3)}.wizard-choice h3{margin-top:8px;font-size:1.55rem}
.wizard-choice-price{display:flex;align-items:flex-end;gap:7px;margin-top:24px}.wizard-choice-price strong{font-family:var(--ff-d);font-size:clamp(2.7rem,4.5vw,4.3rem);letter-spacing:-.065em;line-height:.88}.wizard-choice.is-selected .wizard-choice-price strong{color:var(--aqua)}.wizard-choice-price span{padding-bottom:4px;color:var(--fg3);font-size:.75rem}.wizard-choice-price.custom strong{font-size:3.4rem}
.wizard-choice>p{margin-top:13px;max-width:48ch;color:var(--fg3);font-size:.78rem;line-height:1.5}.wizard-check{position:absolute;right:20px;top:20px;width:30px;height:30px;border-radius:10px;display:grid;place-items:center;border:1px solid var(--edge);color:transparent;background:var(--glass2);transition:.3s var(--spring)}.wizard-choice.is-selected .wizard-check{color:#031612;background:var(--aqua);border-color:var(--aqua);transform:scale(1.06)}

.result-head{display:flex;justify-content:space-between;align-items:flex-end;gap:22px;margin-bottom:24px}.result-head .pricing-finale-title{margin:0!important}.result-head .pricing-finale-lead{margin:14px 0 0!important}
.calc-launch{display:flex;align-items:center;gap:10px;min-height:48px;padding:10px 14px;border:1px solid color-mix(in srgb,var(--aqua) 28%,var(--edge));border-radius:13px;background:var(--glass2);color:var(--fg2)}.calc-launch span{width:28px;height:28px;border-radius:9px;display:grid;place-items:center;background:color-mix(in srgb,var(--aqua) 10%,var(--glass));color:var(--aqua);font-size:1rem}.calc-launch b{font-size:.75rem}
.final-bill{padding:28px;border-color:color-mix(in srgb,var(--aqua) 42%,var(--edge));background:radial-gradient(90% 130% at 100% 0%,color-mix(in srgb,var(--aqua) 12%,transparent),transparent 66%),linear-gradient(135deg,color-mix(in srgb,var(--peri) 6%,var(--glass)),color-mix(in srgb,var(--aqua) 5%,var(--glass)))}
.final-bill-top{display:flex;justify-content:space-between;gap:18px;align-items:flex-start}.final-bill-top small{font-family:var(--ff-m);font-size:.56rem;letter-spacing:.1em;color:var(--aqua)}.final-bill-top h3{margin-top:6px;font-size:1.55rem}.final-bill-status{padding:6px 9px;border-radius:999px;border:1px solid color-mix(in srgb,var(--aqua) 28%,var(--edge));font-family:var(--ff-m);font-size:.46rem;color:var(--aqua)}
.final-bill-price{display:flex;align-items:flex-end;gap:10px;margin-top:30px}.final-bill-price strong{font-family:var(--ff-d);font-size:clamp(4.5rem,9vw,8.2rem);line-height:.8;letter-spacing:-.085em}.final-bill-price span{padding-bottom:8px;color:var(--fg3);font-size:.9rem}.final-bill>p{margin-top:15px;color:var(--fg2);font-size:.84rem}
.final-config{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-top:28px}.final-config>div{padding:12px;border:1px solid var(--edge2);border-radius:12px;background:var(--glass2)}.final-config small{display:block;font-family:var(--ff-m);font-size:.44rem;letter-spacing:.07em;color:var(--fg3)}.final-config b{display:block;margin-top:5px;font-size:.77rem}
.final-bill-actions{display:flex;gap:9px;margin-top:22px}

.result-comparison{margin-top:14px;padding:20px}.result-comparison-head{display:flex;align-items:center;justify-content:space-between;gap:16px}.result-comparison-head small{font-family:var(--ff-m);font-size:.48rem;letter-spacing:.09em;color:var(--fg3)}.result-comparison-head h3{margin-top:5px;font-size:1.2rem}.mini-calc-btn{width:40px;height:40px;border:1px solid var(--edge);border-radius:11px;background:var(--glass2);color:var(--aqua);font-size:1rem}
.result-comparison-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-top:15px}.result-comparison-metrics>div{padding:13px;border:1px solid var(--edge2);border-radius:13px;background:var(--glass2)}.result-comparison-metrics small{display:block;font-family:var(--ff-m);font-size:.43rem;letter-spacing:.06em;color:var(--fg3)}.result-comparison-metrics strong{display:block;margin-top:6px;font-family:var(--ff-d);font-size:1.5rem;letter-spacing:-.04em}.result-comparison-metrics span{display:block;margin-top:2px;color:var(--fg3);font-size:.62rem}.result-comparison-metrics .good strong,.result-comparison-metrics .saving strong,.result-comparison-metrics .modeled strong{color:var(--aqua)}
.result-comparison-note{margin-top:10px;color:var(--fg3);font-size:.68rem}

.included-expansion{margin-top:14px}.included-expansion>summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:92px;padding:18px 20px}.included-expansion>summary::-webkit-details-marker{display:none}.included-expansion summary small{display:block;font-family:var(--ff-m);font-size:.48rem;letter-spacing:.09em;color:var(--aqua)}.included-expansion summary strong{display:block;margin-top:4px;font-family:var(--ff-d);font-size:1.12rem}.included-expansion summary em{display:block;margin-top:4px;font-style:normal;color:var(--fg3);font-size:.7rem}.included-expansion summary>b{width:38px;height:38px;border:1px solid var(--edge);border-radius:11px;display:grid;place-items:center;background:var(--glass2);font-size:1.2rem;transition:transform .4s var(--spring)}.included-expansion[open] summary>b{transform:rotate(45deg)}
.included-expansion-body{padding:0 20px 20px;border-top:1px solid var(--edge2)}.inclusion-columns{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding-top:18px}.inclusion-columns article{padding:16px;border:1px solid var(--edge2);border-radius:15px;background:var(--glass2)}.inclusion-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-bottom:10px;border-bottom:1px solid var(--edge2)}.inclusion-head small{font-family:var(--ff-m);font-size:.48rem;letter-spacing:.08em;color:var(--fg3)}.inclusion-head strong{font-size:.7rem;color:var(--aqua)}
.result-inclusions,.result-foundations{display:grid;gap:0;margin-top:4px}.result-inclusions>div,.result-foundations>div{display:grid;grid-template-columns:1fr auto auto;gap:10px;align-items:center;padding:10px 2px;border-bottom:1px solid var(--edge2);font-size:.72rem}.result-inclusions b{font-family:var(--ff-d);font-size:.72rem}.result-inclusions em{font-style:normal;color:var(--aqua);font-family:var(--ff-m);font-size:.42rem}.result-foundations>div{grid-template-columns:1fr}.result-foundations small{color:var(--fg3);font-size:.62rem}
.inclusion-proof{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:10px}.inclusion-proof>div{position:relative;min-height:92px;padding:13px;border:1px solid var(--edge2);border-radius:13px;background:var(--glass2)}.inclusion-proof small{display:block;font-family:var(--ff-m);font-size:.44rem;color:var(--aqua);letter-spacing:.07em}.inclusion-proof b{display:block;margin-top:7px;font-size:.7rem;line-height:1.4;color:var(--fg2)}.inclusion-proof button{position:absolute;right:9px;top:9px;width:28px;height:28px;border:1px solid var(--edge);border-radius:8px;background:var(--glass2);color:var(--aqua)}.result-empty{display:block;padding:18px 2px;color:var(--fg3);font-size:.72rem}

.price-wizard-drawer .guide-drawer-copy{padding-bottom:14px!important}.wizard-live-price{padding:18px;border:1px solid color-mix(in srgb,var(--aqua) 32%,var(--edge));border-radius:16px;background:linear-gradient(135deg,color-mix(in srgb,var(--aqua) 6%,var(--glass)),color-mix(in srgb,var(--peri) 5%,var(--glass)));margin-top:18px}.wizard-live-price small{display:block;font-family:var(--ff-m);font-size:.5rem;letter-spacing:.09em;color:var(--aqua)}.wizard-live-price strong{display:inline-block;margin-top:8px;font-family:var(--ff-d);font-size:2.6rem;letter-spacing:-.06em;line-height:.9}.wizard-live-price em{font-style:normal;color:var(--fg3);font-size:.72rem;margin-left:5px}.wizard-live-price span{display:block;margin-top:8px;font-family:var(--ff-m);font-size:.45rem;letter-spacing:.08em;color:var(--fg3)}
.price-wizard-drawer .guide-story-map{grid-template-columns:repeat(5,1fr)!important}.price-wizard-drawer .guide-drawer-team{display:none!important}.price-wizard-drawer.show-team .guide-drawer-team{display:block!important}.price-wizard-drawer .guide-drawer-actions{grid-template-columns:1fr 1fr!important}.wizard-final-link{grid-column:1/-1;text-align:center;color:var(--aqua);font-family:var(--ff-m);font-size:.52rem;letter-spacing:.07em;padding:4px}#guideBack:disabled{opacity:.34;cursor:not-allowed}

.savings-calc-backdrop{position:fixed;inset:0;z-index:219;background:rgba(2,9,7,.58);backdrop-filter:blur(5px);opacity:0;visibility:hidden;transition:.3s var(--e)}.savings-calc-backdrop.open{opacity:1;visibility:visible}
.savings-calculator{position:fixed;right:0;top:0;bottom:0;z-index:220;width:min(680px,96vw);background:var(--bg2);border-left:1px solid var(--edge);box-shadow:-35px 0 85px -44px rgba(0,0,0,.9);transform:translateX(102%);transition:transform .58s var(--spring);display:flex;flex-direction:column}.savings-calculator.open{transform:none}
.savings-calc-head{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;padding:24px;border-bottom:1px solid var(--edge2)}.savings-calc-head small{font-family:var(--ff-m);font-size:.5rem;letter-spacing:.1em;color:var(--aqua)}.savings-calc-head h2{margin-top:5px;font-size:1.55rem}.savings-calc-head button{width:40px;height:40px;border:1px solid var(--edge);border-radius:11px;background:var(--glass2);font-size:1.25rem}
.savings-tabs{display:flex;gap:5px;padding:12px 16px;border-bottom:1px solid var(--edge2);overflow-x:auto}.savings-tabs button{flex:0 0 auto;padding:9px 12px;border-radius:10px;color:var(--fg3);font-size:.72rem}.savings-tabs button.is-active{background:var(--glass);color:var(--fg);box-shadow:inset 0 -2px 0 var(--aqua)}
.savings-calc-body{padding:18px;overflow:auto}.calc-panel{display:none}.calc-panel.is-active{display:block;animation:calcPanelIn .4s var(--spring)}@keyframes calcPanelIn{from{opacity:0;transform:translateX(12px)}}
.calc-intro small{font-family:var(--ff-m);font-size:.5rem;letter-spacing:.09em;color:var(--aqua)}.calc-intro h3{margin-top:7px;font-size:1.5rem}.calc-intro p{margin-top:7px;color:var(--fg3);font-size:.76rem}
.calc-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:18px}.calc-form-grid label{padding:11px;border:1px solid var(--edge2);border-radius:12px;background:var(--glass2)}.calc-form-grid label span{display:block;font-family:var(--ff-m);font-size:.46rem;color:var(--fg3);letter-spacing:.05em}.calc-form-grid input,.calc-form-grid select{width:100%;margin-top:7px;border:0;outline:0;background:transparent;color:var(--fg);font-family:var(--ff-d);font-size:1rem}.calc-form-grid select option{color:#111}.calc-form-grid label>b{display:block;margin-top:5px;color:var(--aqua);font-size:.72rem}
.calc-result-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:12px}.calc-result-grid>div,.calc-result-single{padding:14px;border:1px solid var(--edge2);border-radius:13px;background:var(--glass2)}.calc-result-grid small,.calc-result-single small{display:block;font-family:var(--ff-m);font-size:.44rem;color:var(--fg3);letter-spacing:.06em}.calc-result-grid strong,.calc-result-single strong{display:block;margin-top:7px;font-family:var(--ff-d);font-size:1.55rem}.calc-result-grid .good strong,.calc-result-grid .saving strong,.calc-result-single strong{color:var(--aqua)}.calc-result-grid span{color:var(--fg3);font-size:.6rem}.calc-result-single{margin-top:12px}.calc-note,.calc-disclaimer{margin-top:10px;color:var(--fg3);font-size:.66rem;line-height:1.5}
.calc-grand-total{display:grid;grid-template-columns:1fr 1fr 1fr;gap:7px;margin-top:22px;padding-top:14px;border-top:1px solid var(--edge2)}.calc-grand-total>div{padding:12px;border:1px solid var(--edge2);border-radius:12px;background:var(--glass2)}.calc-grand-total small{display:block;font-family:var(--ff-m);font-size:.43rem;color:var(--fg3)}.calc-grand-total strong{display:block;margin-top:6px;font-family:var(--ff-d);font-size:1.3rem}.calc-grand-total .good strong{color:var(--aqua)}

@media(max-width:900px){
  .users-picker{grid-template-columns:1fr;gap:20px}.users-live{text-align:left}.users-presets{grid-template-columns:repeat(4,1fr)}
  .wizard-choice-grid{grid-template-columns:1fr}.final-config{grid-template-columns:1fr 1fr}.result-comparison-metrics{grid-template-columns:1fr 1fr}.inclusion-columns{grid-template-columns:1fr}.inclusion-proof{grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
  .wizard-hero .hero-hud{min-height:0!important}.wizard-hud-price strong{font-size:3.8rem}.wizard-hud-steps{grid-template-columns:1fr 1fr}.wizard-hud-benchmark{grid-template-columns:1fr}
  .users-picker{padding:18px}.users-number input{width:155px;font-size:3.7rem}.users-presets{grid-template-columns:repeat(4,1fr)}
  .wizard-choice{min-height:250px;padding:19px}.wizard-choice-price strong{font-size:3rem}.wizard-step-actions .btn{flex:1}
  .result-head{align-items:flex-start;flex-direction:column}.calc-launch{width:100%;justify-content:center}.final-bill{padding:20px}.final-bill-price strong{font-size:4.5rem}.final-config{grid-template-columns:1fr 1fr}.final-bill-actions{flex-direction:column}.final-bill-actions .btn{width:100%}
  .result-comparison-metrics{grid-template-columns:1fr 1fr}.inclusion-proof{grid-template-columns:1fr}.included-expansion>summary{padding:16px}.included-expansion-body{padding:0 14px 14px}
  .price-wizard-drawer .guide-story-map{grid-template-columns:repeat(5,44px)!important;overflow-x:auto}
  .savings-calculator{left:0;right:0;top:auto;width:100%;height:min(82svh,760px);border-left:0;border-top:1px solid var(--edge);border-radius:20px 20px 0 0;transform:translateY(102%)}.savings-calculator.open{transform:none}
  .calc-form-grid{grid-template-columns:1fr}.calc-result-grid{grid-template-columns:1fr}.calc-grand-total{grid-template-columns:1fr}
}
@media(max-width:460px){.result-comparison-metrics{grid-template-columns:1fr}.final-config{grid-template-columns:1fr 1fr}}


/* =====================================================================
   V81 PRICE WIZARD POLISH
   Large readable UI · human labels · physics-like response · real light
   mode · mobile-first fallback · procurement-grade BOQ.
   ===================================================================== */

/* ---------- CORE READABILITY ---------- */
:root{
  --wizard-radius:24px;
  --wizard-soft:color-mix(in srgb,var(--aqua) 7%,var(--glass2));
}
body{font-size:17px}
.kicker,.pricing-step-marker{font-size:.72rem!important;letter-spacing:.09em!important}
.sec-head .lede{font-size:1.02rem!important;line-height:1.55!important}
.wizard-step,.wizard-result{position:relative}
.wizard-step .wrap,.wizard-result .wrap{max-width:1180px}

/* ---------- REAL LIGHT MODE ---------- */
[data-theme="light"]{
  --bg:#FBF8F1!important;
  --bg2:#FFFDF8!important;
  --fg:#171713!important;
  --fg2:#55564F!important;
  --fg3:#7B7C73!important;
  --edge:rgba(58,55,45,.14)!important;
  --edge2:rgba(58,55,45,.08)!important;
  --glass:rgba(255,255,255,.78)!important;
  --glass2:rgba(255,255,255,.56)!important;
  --glasshi:rgba(255,255,255,.98)!important;
  --shadow:0 26px 64px -38px rgba(95,72,35,.22)!important;
  --aurora:.34!important;
}
[data-theme="light"] body{
  background:
    radial-gradient(950px 620px at 12% -10%,rgba(124,124,255,.11),transparent 68%),
    radial-gradient(900px 600px at 86% 4%,rgba(63,224,200,.10),transparent 68%),
    linear-gradient(180deg,#FFFDF8 0%,#FBF8F1 48%,#F8F4EC 100%)!important;
}
[data-theme="light"] .grid{
  opacity:.045!important;
  background-image:linear-gradient(rgba(87,78,55,.15) 1px,transparent 1px),linear-gradient(90deg,rgba(87,78,55,.15) 1px,transparent 1px)!important;
}
[data-theme="light"] .topbar__in,
[data-theme="light"] .topin{
  background:rgba(255,253,248,.82)!important;
  box-shadow:0 14px 40px -30px rgba(80,61,35,.35);
}
[data-theme="light"] .wizard-choice.is-selected,
[data-theme="light"] .final-bill,
[data-theme="light"] .wizard-live-price{
  background:
    radial-gradient(110% 110% at 100% 0%,rgba(63,224,200,.11),transparent 65%),
    linear-gradient(140deg,rgba(255,255,255,.95),rgba(248,250,245,.86))!important;
}
[data-theme="light"] .savings-calculator{
  background:#FFFDF8!important;
  box-shadow:-30px 0 80px -44px rgba(90,65,28,.3)!important;
}
[data-theme="light"] .savings-calc-backdrop{background:rgba(92,75,48,.18)!important}
[data-theme="light"] .calc-form-grid select option{color:#171713;background:#FFFDF8}

/* ---------- HERO ---------- */
.wizard-hero{padding-top:clamp(70px,7vw,106px)!important}
.wizard-hero .hero-copy h1{max-width:9ch!important}
.wizard-hero .hero-copy .lede{
  max-width:34ch;
  font-size:clamp(1.15rem,1.5vw,1.32rem);
  line-height:1.48;
}
.wizard-hud{
  min-height:0!important;
  padding:24px!important;
  border-radius:28px!important;
}
.wizard-hud-price{padding:28px 2px 26px!important}
.wizard-hud-price small{
  font-family:var(--ff)!important;
  font-size:.8rem!important;
  font-weight:700;
  letter-spacing:.02em!important;
  color:var(--fg3)!important;
}
.wizard-hud-price strong{font-size:clamp(4rem,6vw,6.3rem)!important}
.wizard-hud-price em{font-size:.95rem!important}
.wizard-hud-steps{
  position:relative;
  gap:8px!important;
  border:0!important;
  padding:14px 0 4px!important;
}
.wizard-hud-steps:before{
  content:"";position:absolute;left:7%;right:7%;top:34px;height:2px;
  background:var(--edge2);z-index:0;
}
.wizard-hud-steps:after{
  content:"";position:absolute;left:7%;top:34px;height:2px;width:calc((var(--wizard-stage,0) / 3) * 86%);
  max-width:86%;background:linear-gradient(90deg,var(--peri),var(--aqua));z-index:0;
  transition:width .7s var(--spring);
}
.wizard-hud-steps a{
  position:relative;z-index:1;background:transparent!important;border:0!important;
  text-align:center;padding:4px!important;
}
.wizard-hud-steps b{
  width:42px;height:42px;margin:auto;border-radius:50%;display:grid;place-items:center;
  background:var(--bg2);border:1px solid var(--edge);transition:.45s var(--spring);
}
.wizard-hud-steps a.is-current b,.wizard-hud-steps a.is-done b{
  border-color:color-mix(in srgb,var(--aqua) 55%,var(--edge));color:var(--aqua);
  box-shadow:0 0 0 5px color-mix(in srgb,var(--aqua) 7%,transparent);
}
.wizard-hud-steps span{font-family:var(--ff)!important;font-size:.72rem!important;margin-top:7px!important;color:var(--fg2)!important}
.wizard-hud-benchmark{margin-top:22px!important}
.wizard-hud-benchmark>div{padding:15px!important;border-radius:15px!important}
.wizard-hud-benchmark small{font-family:var(--ff)!important;font-size:.68rem!important;letter-spacing:0!important}
.wizard-hud-benchmark strong{font-size:1.55rem!important}

/* ---------- STEP 01 ---------- */
#build .selector-shell{border-radius:26px!important}
.tabs button{font-size:.8rem!important;min-height:48px}
.option{min-height:170px!important;padding:18px!important}
.option h3{font-size:1.08rem!important;line-height:1.1!important}
.option p{font-size:.82rem!important;line-height:1.5!important}
.option small{font-size:.64rem!important}
.mix{border-radius:22px!important}
.mix-head small,.mix-note{font-family:var(--ff)!important;font-size:.72rem!important;letter-spacing:0!important}
.mix-head h3{font-size:1.22rem!important}

/* ---------- STEP 02 ---------- */
.users-picker{
  padding:30px!important;border-radius:28px!important;
  grid-template-columns:.75fr 1.4fr .75fr!important;
}
.users-number small,.users-live small{
  font-family:var(--ff)!important;font-size:.74rem!important;font-weight:700;letter-spacing:0!important;
}
.users-number input{font-size:clamp(3.7rem,6vw,6.2rem)!important}
.users-number p{font-size:.82rem!important}
.users-control input[type=range]{
  height:8px;appearance:none;border-radius:999px;background:linear-gradient(90deg,var(--aqua),color-mix(in srgb,var(--peri) 68%,var(--aqua)));
}
.users-control input[type=range]::-webkit-slider-thumb{
  appearance:none;width:28px;height:28px;border-radius:50%;background:#fff;border:6px solid var(--aqua);
  box-shadow:0 6px 20px -8px var(--aqua);transition:transform .25s var(--spring);
}
.users-control input[type=range]:active::-webkit-slider-thumb{transform:scale(1.15)}
.users-presets button{
  min-height:44px!important;font-family:var(--ff)!important;font-size:.76rem!important;font-weight:700;
  transition:transform .25s var(--spring),background .25s var(--e),border-color .25s var(--e);
}
.users-presets button:hover{transform:translateY(-2px);background:var(--wizard-soft)}
.users-live strong{font-size:clamp(3rem,4.5vw,4.8rem)!important}

/* ---------- STEPS 03 + 04 ---------- */
.wizard-choice-grid{gap:16px!important}
.wizard-choice{
  --rx:0deg;--ry:0deg;
  min-height:330px!important;padding:28px!important;border-radius:28px!important;
  transform:perspective(900px) rotateX(var(--rx)) rotateY(var(--ry));
  transform-style:preserve-3d;
  transition:transform .32s var(--spring),border-color .3s var(--e),box-shadow .35s var(--e),background .35s var(--e)!important;
}
.wizard-choice:before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:0;
  background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),color-mix(in srgb,var(--aqua) 12%,transparent),transparent 52%);
  transition:opacity .25s var(--e);
}
.wizard-choice:hover:before,.wizard-choice.is-selected:before{opacity:1}
.wizard-choice:hover{transform:perspective(900px) rotateX(var(--rx)) rotateY(var(--ry)) translateY(-5px)!important}
.wizard-choice-icon{width:52px!important;height:52px!important;border-radius:16px!important;font-size:1rem!important}
.wizard-choice>small{font-family:var(--ff)!important;font-size:.75rem!important;letter-spacing:0!important;font-weight:700;color:var(--fg3)!important}
.wizard-choice h3{font-size:1.85rem!important;margin-top:8px!important}
.wizard-choice-price{margin-top:28px!important}
.wizard-choice-price strong{font-size:clamp(3.1rem,4.6vw,4.8rem)!important}
.wizard-choice>p{font-size:.86rem!important;line-height:1.55!important;max-width:40ch!important}
.wizard-check{width:36px!important;height:36px!important;border-radius:12px!important;font-size:1rem}
.wizard-step-actions{margin-top:24px!important}

/* ---------- RESULT ---------- */
.wizard-result{padding-top:clamp(86px,9vw,130px)!important}
.result-head{align-items:center!important;margin-bottom:28px!important}
.result-head .pricing-finale-title{font-size:clamp(3.2rem,6.5vw,6rem)!important}
.result-head .pricing-finale-lead{font-size:1.05rem!important;color:var(--fg2)!important}
.calc-launch{
  min-height:54px!important;padding:12px 18px!important;border-radius:16px!important;
  font-size:.88rem!important;font-weight:750;transition:transform .3s var(--spring),box-shadow .3s var(--e),border-color .3s var(--e)!important;
}
.calc-launch:hover{transform:translateY(-3px);box-shadow:0 16px 32px -22px var(--aqua);border-color:color-mix(in srgb,var(--aqua) 55%,var(--edge))}
.calc-spark{position:relative;width:34px;height:34px;display:block;border-radius:11px;background:color-mix(in srgb,var(--aqua) 10%,var(--glass2))}
.calc-spark i{position:absolute;width:5px;height:5px;border-radius:50%;background:var(--aqua);box-shadow:0 0 10px var(--aqua);animation:sparkOrbit 2.8s var(--e) infinite}
.calc-spark i:nth-child(1){left:8px;top:14px}.calc-spark i:nth-child(2){right:7px;top:8px;animation-delay:-.9s}.calc-spark i:nth-child(3){right:10px;bottom:7px;animation-delay:-1.8s}
@keyframes sparkOrbit{50%{transform:translate3d(3px,-3px,0) scale(1.25)}}

.final-bill{
  position:relative;padding:34px!important;border-radius:30px!important;overflow:hidden;
  transition:transform .45s var(--spring),box-shadow .4s var(--e),border-color .35s var(--e);
}
.final-bill:after{
  content:"";position:absolute;inset:-25%;pointer-events:none;opacity:.7;
  background:radial-gradient(420px circle at var(--mx,76%) var(--my,24%),color-mix(in srgb,var(--aqua) 12%,transparent),transparent 58%);
}
.final-bill-top small{font-family:var(--ff)!important;font-size:.78rem!important;letter-spacing:0!important;font-weight:750}
.final-bill-top h3{font-size:1.8rem!important}
.final-bill-status{font-family:var(--ff)!important;font-size:.7rem!important;letter-spacing:0!important;font-weight:750;padding:7px 11px!important}
.final-bill-price{margin-top:38px!important}
.final-bill-price strong{font-size:clamp(5rem,9vw,9rem)!important}
.final-bill>p{font-size:.95rem!important}
.final-config{margin-top:32px!important;gap:10px!important}
.final-config>div{padding:15px!important;border-radius:14px!important}
.final-config small{font-family:var(--ff)!important;font-size:.68rem!important;letter-spacing:0!important}
.final-config b{font-size:.88rem!important}
.final-bill-actions{margin-top:26px!important}

.result-comparison{
  position:relative;margin-top:18px!important;padding:24px!important;border-radius:24px!important;overflow:hidden;
}
.result-comparison:before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(340px circle at var(--mx,80%) var(--my,20%),color-mix(in srgb,var(--peri) 7%,transparent),transparent 58%);
}
.result-comparison-head h3{font-size:1.45rem!important}
.result-comparison-head small{font-family:var(--ff)!important;font-size:.74rem!important;letter-spacing:0!important}
.text-calc-btn{
  width:auto!important;height:auto!important;min-height:44px;padding:10px 14px!important;border-radius:12px!important;
  font-size:.78rem!important;font-weight:750;color:var(--aqua)!important;
}
.result-comparison-metrics{gap:10px!important;margin-top:20px!important}
.result-comparison-metrics>div{padding:16px!important;border-radius:15px!important}
.result-comparison-metrics small{font-family:var(--ff)!important;font-size:.67rem!important;letter-spacing:0!important}
.result-comparison-metrics strong{font-size:1.85rem!important;margin-top:8px!important}
.result-comparison-metrics span{font-size:.7rem!important}
.result-comparison-note{font-size:.72rem!important;line-height:1.5!important}

/* ---------- INCLUSIONS ---------- */
.included-expansion{margin-top:18px!important;border-radius:24px!important}
.included-expansion>summary{min-height:104px!important;padding:22px 24px!important}
.included-expansion summary small{font-family:var(--ff)!important;font-size:.72rem!important;letter-spacing:0!important;font-weight:750}
.included-expansion summary strong{font-size:1.35rem!important;margin-top:5px!important}
.included-expansion summary em{font-size:.78rem!important;line-height:1.4!important}
.included-expansion-body{padding:0 24px 24px!important}
.inclusion-columns{gap:14px!important;padding-top:22px!important}
.inclusion-columns article{padding:20px!important;border-radius:18px!important}
.inclusion-head small{font-family:var(--ff)!important;font-size:.72rem!important;letter-spacing:0!important;font-weight:750}
.inclusion-head strong{font-size:.78rem!important}
.result-inclusions>div,.result-foundations>div{padding:13px 2px!important;font-size:.82rem!important;line-height:1.4}
.result-inclusions b{font-size:.8rem!important}.result-inclusions em{font-family:var(--ff)!important;font-size:.68rem!important;font-weight:750}
.result-foundations small{font-size:.72rem!important;line-height:1.45!important}
.inclusion-proof-title{margin-top:22px}
.inclusion-proof-title h3{font-size:1.5rem}.inclusion-proof-title p{margin-top:6px;color:var(--fg3);font-size:.84rem}
.inclusion-proof{gap:10px!important;margin-top:12px!important}
.inclusion-proof>div{min-height:132px!important;padding:16px!important;border-radius:16px!important;display:flex;flex-direction:column}
.inclusion-proof small{font-family:var(--ff)!important;font-size:.7rem!important;letter-spacing:0!important;font-weight:750}
.inclusion-proof b{font-size:.8rem!important;line-height:1.48!important;padding-right:0!important}
.inclusion-calc-link{
  position:static!important;width:auto!important;height:auto!important;margin-top:auto!important;align-self:flex-start;
  padding:8px 10px!important;border-radius:10px!important;font-size:.7rem!important;font-weight:750;color:var(--aqua)!important;
  background:color-mix(in srgb,var(--aqua) 7%,var(--glass2))!important;
}

/* ---------- BOQ LEDGER ---------- */
.boq-shell{margin-top:18px!important;border-radius:20px!important}
.boq-toggle{min-height:96px!important;padding:20px 22px!important}
.boq-toggle small{font-family:var(--ff)!important;font-size:.72rem!important;letter-spacing:0!important;font-weight:750}
.boq-toggle strong{font-size:1.25rem!important}
.boq-toggle em{font-size:.78rem!important;line-height:1.4!important}
.boq-head{padding:26px 24px 18px!important}
.boq-head small{font-family:var(--ff)!important;font-size:.72rem!important;letter-spacing:0!important;font-weight:750}
.boq-head h3{font-size:1.7rem!important}
.boq-head-metrics>span{min-width:125px!important;padding:12px 14px!important}
.boq-head-metrics small{font-family:var(--ff)!important;font-size:.66rem!important;letter-spacing:0!important}
.boq-head-metrics b{font-size:1.02rem!important}
.boq-table-wrap{padding:0 24px!important}
.boq-table{min-width:860px!important;font-size:.86rem!important}
.boq-table th{
  padding:14px 14px!important;font-family:var(--ff)!important;font-size:.72rem!important;letter-spacing:0!important;
  font-weight:750!important;color:var(--fg3)!important;
}
.boq-table th:nth-child(n+2){text-align:right}
.boq-group td{
  padding:24px 14px 10px!important;font-family:var(--ff)!important;font-size:.76rem!important;
  letter-spacing:0!important;font-weight:800!important;color:var(--aqua)!important;
}
.boq-row td{padding:17px 14px!important;border-bottom:1px solid var(--edge2)!important}
.boq-item strong{font-size:.9rem!important}.boq-item small{display:block;margin-top:4px;color:var(--fg3);font-size:.72rem;line-height:1.4}
.boq-benchmark,.boq-theos,.boq-state{text-align:right!important}
.boq-benchmark span{font-size:.8rem;color:var(--fg2)}
.boq-theos strong{font-size:.86rem;color:var(--aqua)}
.boq-state span{display:inline-flex;padding:6px 9px;border-radius:999px;border:1px solid var(--edge);font-size:.68rem;color:var(--fg2)}
.boq-state span.is-included{border-color:color-mix(in srgb,var(--aqua) 30%,var(--edge));color:var(--aqua);background:color-mix(in srgb,var(--aqua) 5%,var(--glass2))}
.boq-total{margin:18px 24px 0!important;padding:18px!important;border-radius:16px!important}
.boq-total small{font-family:var(--ff)!important;font-size:.68rem!important;letter-spacing:0!important}
.boq-total strong{font-size:1.2rem!important}
.boq-note{margin:14px 24px 24px!important;font-size:.76rem!important;line-height:1.55!important}

/* ---------- SAVINGS DRAWER ---------- */
.savings-calc-backdrop{backdrop-filter:blur(7px)!important}
.savings-calculator{width:min(720px,96vw)!important}
.savings-calc-head{padding:28px!important}
.savings-calc-head small{font-family:var(--ff)!important;font-size:.72rem!important;letter-spacing:0!important;font-weight:750}
.savings-calc-head h2{font-size:2rem!important;margin-top:6px!important}
.savings-tabs{padding:12px 20px!important;gap:7px!important}
.savings-tabs button{
  min-height:42px;padding:10px 14px!important;border:1px solid transparent;border-radius:12px!important;
  font-size:.78rem!important;font-weight:700;
}
.savings-tabs button.is-active{border-color:color-mix(in srgb,var(--aqua) 26%,var(--edge));box-shadow:none!important;background:color-mix(in srgb,var(--aqua) 7%,var(--glass))!important;color:var(--fg)!important}
.savings-calc-body{padding:24px!important}
.calc-intro small{font-family:var(--ff)!important;font-size:.72rem!important;letter-spacing:0!important;font-weight:750}
.calc-intro h3{font-size:1.75rem!important}
.calc-intro p{font-size:.84rem!important;line-height:1.5!important}
.calc-form-grid{gap:10px!important;margin-top:22px!important}
.calc-form-grid label{padding:14px!important;border-radius:14px!important}
.calc-form-grid label span{font-family:var(--ff)!important;font-size:.72rem!important;letter-spacing:0!important;color:var(--fg2)!important}
.calc-form-grid input,.calc-form-grid select{font-size:1.05rem!important;margin-top:8px!important}
.calc-result-grid{gap:10px!important;margin-top:16px!important}
.calc-result-grid>div,.calc-result-single{padding:17px!important;border-radius:15px!important}
.calc-result-grid small,.calc-result-single small{font-family:var(--ff)!important;font-size:.68rem!important;letter-spacing:0!important}
.calc-result-grid strong,.calc-result-single strong{font-size:1.9rem!important}
.calc-note,.calc-disclaimer{font-size:.74rem!important;line-height:1.55!important}
.calc-grand-total{gap:10px!important;margin-top:26px!important}
.calc-grand-total>div{padding:16px!important;border-radius:15px!important}
.calc-grand-total small{font-family:var(--ff)!important;font-size:.68rem!important}
.calc-grand-total strong{font-size:1.6rem!important}

/* ---------- PRICE WIZARD DRAWER ---------- */
.price-wizard-drawer{width:min(590px,94vw)!important}
.wizard-live-price{padding:20px!important}
.wizard-live-price small{font-family:var(--ff)!important;font-size:.72rem!important;letter-spacing:0!important;font-weight:750}
.wizard-live-price strong{font-size:3rem!important}
.wizard-live-price span{font-family:var(--ff)!important;font-size:.68rem!important;letter-spacing:0!important}
.price-wizard-drawer .guide-drawer-copy h3{font-size:2rem!important}
.price-wizard-drawer .guide-drawer-copy p{font-size:.95rem!important}
.price-wizard-drawer .guide-focus small{font-family:var(--ff)!important;font-size:.68rem!important;letter-spacing:0!important}
.price-wizard-drawer .guide-focus b{font-size:.88rem!important}
.price-wizard-drawer .guide-story-step b{font-size:1rem!important}
.guide-context-strip small{font-family:var(--ff)!important;font-size:.65rem!important;letter-spacing:0!important}
.guide-context-strip strong{font-size:1.05rem!important}
.guide-team-line small{font-family:var(--ff)!important;font-size:.68rem!important;letter-spacing:0!important}

/* ---------- CHANGE MOTION ---------- */
.price-refresh{animation:priceRefresh .65s var(--spring)!important}
@keyframes priceRefresh{
  0%{transform:translateY(0) scale(1)}
  42%{transform:translateY(-3px) scale(1.018);filter:brightness(1.08)}
  100%{transform:translateY(0) scale(1);filter:none}
}
html.motion-paused .price-refresh{animation:none!important}
html.motion-paused .calc-spark i{animation:none!important}

/* ---------- MOBILE VISIBILITY FAILSAFE ---------- */
@media(max-width:900px){
  .rv,.rv.in{opacity:1!important;transform:none!important;visibility:visible!important}
}

/* ---------- TABLET ---------- */
@media(max-width:900px){
  .wizard-hero .hero-grid{grid-template-columns:1fr!important}
  .users-picker{grid-template-columns:1fr!important;gap:22px!important}
  .users-live{text-align:left!important}
  .wizard-choice-grid{grid-template-columns:1fr!important}
  .inclusion-columns{grid-template-columns:1fr!important}
  .inclusion-proof{grid-template-columns:1fr 1fr!important}
  .result-comparison-metrics{grid-template-columns:1fr 1fr!important}
}

/* ---------- MOBILE ---------- */
@media(max-width:760px){
  :root{--gut:18px!important}
  html{scroll-padding-top:82px!important}
  body{font-size:16px!important}
  .sec{padding:58px 0!important}
  .wizard-hero{padding:44px 0 58px!important}
  .wizard-hero .hero-copy h1{font-size:clamp(3.25rem,14vw,4.6rem)!important;max-width:8ch!important}
  .wizard-hero .hero-copy .lede{font-size:1.08rem!important}
  .wizard-hud{padding:18px!important;border-radius:22px!important}
  .wizard-hud-price{padding:20px 0!important}
  .wizard-hud-price strong{font-size:3.65rem!important}
  .wizard-hud-steps{grid-template-columns:repeat(4,1fr)!important}
  .wizard-hud-steps:before,.wizard-hud-steps:after{top:27px!important}
  .wizard-hud-steps b{width:34px!important;height:34px!important;font-size:.82rem!important}
  .wizard-hud-steps span{font-size:.62rem!important}
  .wizard-hud-benchmark{grid-template-columns:1fr!important}

  #build .sec-head h2,.wizard-step .sec-head h2{font-size:clamp(2.6rem,11vw,3.7rem)!important}
  #build .sec-head .lede,.wizard-step .sec-head .lede{font-size:.96rem!important}

  .tabs{display:flex!important;overflow-x:auto!important;padding-bottom:5px!important;scrollbar-width:none}
  .tabs::-webkit-scrollbar{display:none}
  .tabs button{flex:0 0 auto!important;padding-inline:14px!important}
  .option-grid{grid-template-columns:1fr!important}
  .option{min-height:0!important}
  .selector-grid{grid-template-columns:1fr!important}
  .mix{position:static!important}

  .users-picker{padding:18px!important}
  .users-number input{width:145px!important;font-size:4rem!important}
  .users-presets{grid-template-columns:repeat(4,1fr)!important}
  .users-presets button{min-height:42px!important}
  .users-live strong{font-size:3.35rem!important}
  .wizard-step-actions{display:grid!important;grid-template-columns:1fr 1fr!important}
  .wizard-step-actions .btn{width:100%!important}

  .wizard-choice{min-height:0!important;padding:20px!important;border-radius:22px!important;transform:none!important}
  .wizard-choice:hover{transform:none!important}
  .wizard-choice h3{font-size:1.55rem!important}
  .wizard-choice-price strong{font-size:3rem!important}
  .wizard-choice>p{font-size:.82rem!important}

  .result-head{align-items:flex-start!important;flex-direction:column!important}
  .result-head .pricing-finale-title{font-size:3.5rem!important}
  .calc-launch{width:100%!important;justify-content:center!important}
  .final-bill{padding:20px!important;border-radius:22px!important}
  .final-bill-price strong{font-size:4.7rem!important}
  .final-bill>p{font-size:.84rem!important}
  .final-config{grid-template-columns:1fr 1fr!important;gap:7px!important}
  .final-config>div{padding:12px!important}
  .final-bill-actions{flex-direction:column!important}
  .final-bill-actions .btn{width:100%!important}

  .result-comparison{padding:18px!important}
  .result-comparison-head{align-items:flex-start!important}
  .result-comparison-head h3{font-size:1.25rem!important}
  .text-calc-btn{white-space:nowrap!important}
  .result-comparison-metrics{grid-template-columns:1fr 1fr!important}
  .result-comparison-metrics strong{font-size:1.55rem!important}

  .included-expansion>summary{padding:18px!important;min-height:92px!important}
  .included-expansion summary em{display:none!important}
  .included-expansion-body{padding:0 14px 14px!important}
  .inclusion-columns article{padding:14px!important}
  .result-inclusions>div{grid-template-columns:1fr!important;gap:3px!important}
  .result-inclusions em{justify-self:start}
  .inclusion-proof{grid-template-columns:1fr!important}
  .inclusion-proof>div{min-height:112px!important}

  /* BOQ becomes readable cards on phones */
  .boq-head{padding:20px 14px 12px!important;align-items:flex-start!important;flex-direction:column!important}
  .boq-head-metrics{width:100%!important;display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:6px!important}
  .boq-head-metrics>span{min-width:0!important;padding:10px!important}
  .boq-table-wrap{padding:0 14px!important;overflow:visible!important}
  .boq-table{display:block!important;min-width:0!important}
  .boq-table thead{display:none!important}
  .boq-table tbody{display:block!important}
  .boq-group{display:block!important;margin:18px 0 8px!important}
  .boq-group td{display:block!important;padding:4px 2px!important;border:0!important}
  .boq-row{
    display:grid!important;grid-template-columns:1fr auto!important;gap:4px 12px!important;
    margin-bottom:8px!important;padding:13px!important;border:1px solid var(--edge2)!important;border-radius:14px!important;background:var(--glass2)!important;
  }
  .boq-row td{display:block!important;padding:3px 0!important;border:0!important;text-align:left!important}
  .boq-item{grid-column:1/-1!important;padding-bottom:8px!important;border-bottom:1px solid var(--edge2)!important;margin-bottom:4px!important}
  .boq-benchmark{grid-column:1!important}.boq-theos{grid-column:2!important;text-align:right!important}.boq-state{grid-column:2!important;text-align:right!important}
  .boq-benchmark:before{content:"Benchmark";display:block;font-size:.66rem;color:var(--fg3);margin-bottom:3px}
  .boq-theos:before{content:"TheOS";display:block;font-size:.66rem;color:var(--fg3);margin-bottom:3px}
  .boq-state span{font-size:.64rem!important}
  .boq-total{margin:12px 14px 0!important;grid-template-columns:1fr!important}
  .boq-note{margin:10px 14px 16px!important}

  /* Savings calculator becomes a polished bottom sheet */
  .savings-calculator{
    left:7px!important;right:7px!important;top:auto!important;bottom:0!important;
    width:auto!important;height:min(86svh,780px)!important;border:1px solid var(--edge)!important;border-bottom:0!important;
    border-radius:22px 22px 0 0!important;transform:translateY(102%)!important;
  }
  .savings-calculator.open{transform:none!important}
  .savings-calc-head{padding:20px!important}
  .savings-calc-head h2{font-size:1.65rem!important}
  .savings-tabs{padding:10px 14px!important}
  .savings-calc-body{padding:16px!important}
  .calc-form-grid{grid-template-columns:1fr!important}
  .calc-result-grid{grid-template-columns:1fr!important}
  .calc-grand-total{grid-template-columns:1fr!important}

  .price-wizard-drawer{width:100%!important}
}

/* ---------- SMALL PHONE ---------- */
@media(max-width:460px){
  .wizard-hud-steps span{display:none!important}
  .result-comparison-metrics{grid-template-columns:1fr!important}
  .final-config{grid-template-columns:1fr 1fr!important}
  .boq-head-metrics{grid-template-columns:1fr 1fr!important}
  .boq-head-metrics>span:nth-child(3){grid-column:1/-1}
}

/* ---------- REDUCED MOTION ---------- */
@media(prefers-reduced-motion:reduce){
  .wizard-choice,.final-bill,.result-comparison,.price-refresh,.calc-spark i{animation:none!important;transition:none!important;transform:none!important}
}


/* =====================================================================
   V82 MOBILE NAV + LIGHT GUIDE FIX
   No hidden sideways navigation. Light Price Wizard is truly light.
   ===================================================================== */

/* ---------- OUTCOME CATEGORY NAVIGATION ---------- */
/* Desktop/tablet: all 4 categories visible at once. */
.category-tabs{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:8px!important;
  overflow:visible!important;
  padding:12px!important;
}
.category-tab{
  min-width:0!important;
  min-height:76px!important;
  padding:14px 15px!important;
  border-radius:15px!important;
}
.category-tab small{
  font-size:.68rem!important;
}
.category-tab b{
  max-width:90%;
  font-size:1.02rem!important;
  line-height:1.12!important;
  white-space:normal!important;
}
.category-tab .tab-count{
  top:11px!important;
  right:11px!important;
  min-width:28px!important;
  height:28px!important;
  font-size:.64rem!important;
}

/* ---------- SAVINGS CALCULATOR NAVIGATION ---------- */
/* Never use hidden horizontal swipe for the calculator modes. */
.savings-tabs{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:7px!important;
  overflow:visible!important;
  padding:14px 18px!important;
  background:color-mix(in srgb,var(--bg2) 88%,transparent);
}
.savings-tabs button{
  width:100%!important;
  min-width:0!important;
  min-height:54px!important;
  padding:10px 11px!important;
  white-space:normal!important;
  text-align:center!important;
  line-height:1.18!important;
  border:1px solid var(--edge2)!important;
  border-radius:13px!important;
  background:var(--glass2)!important;
  color:var(--fg2)!important;
  font-size:.76rem!important;
  font-weight:700!important;
  transition:
    transform .26s var(--spring),
    border-color .26s var(--e),
    background .26s var(--e),
    color .26s var(--e)!important;
}
.savings-tabs button:hover{
  transform:translateY(-2px);
  border-color:var(--edge)!important;
}
.savings-tabs button.is-active{
  border-color:color-mix(in srgb,var(--aqua) 48%,var(--edge))!important;
  background:
    linear-gradient(
      140deg,
      color-mix(in srgb,var(--aqua) 9%,var(--glass)),
      color-mix(in srgb,var(--peri) 5%,var(--glass))
    )!important;
  color:var(--fg)!important;
  box-shadow:
    inset 0 -2px 0 var(--aqua),
    0 12px 26px -24px var(--aqua)!important;
}

/* ---------- TRUE LIGHT PRICE WIZARD ---------- */
[data-theme="light"] .guide-overlay{
  background:rgba(70,62,45,.20)!important;
  backdrop-filter:blur(8px)!important;
  -webkit-backdrop-filter:blur(8px)!important;
}
[data-theme="light"] .guide-drawer.price-wizard-drawer{
  background:
    radial-gradient(115% 90% at 100% 0%,rgba(63,224,200,.10),transparent 62%),
    radial-gradient(90% 75% at 0% 100%,rgba(124,124,255,.08),transparent 68%),
    linear-gradient(180deg,#FFFDF8 0%,#FBF8F1 58%,#F8F3EA 100%)!important;
  color:#171713!important;
  border-color:rgba(58,55,45,.13)!important;
  box-shadow:-32px 0 78px -46px rgba(92,68,32,.34)!important;
}
[data-theme="light"] .price-wizard-drawer .guide-drawer-head{
  border-bottom-color:rgba(58,55,45,.10)!important;
}
[data-theme="light"] .price-wizard-drawer .guide-drawer-id strong,
[data-theme="light"] .price-wizard-drawer .guide-drawer-copy h3,
[data-theme="light"] .price-wizard-drawer .guide-focus b,
[data-theme="light"] .price-wizard-drawer .guide-context-strip strong,
[data-theme="light"] .price-wizard-drawer .guide-team-line b{
  color:#171713!important;
}
[data-theme="light"] .price-wizard-drawer .guide-drawer-id small,
[data-theme="light"] .price-wizard-drawer .guide-focus small{
  color:#13A997!important;
}
[data-theme="light"] .price-wizard-drawer .guide-drawer-copy p,
[data-theme="light"] .price-wizard-drawer .guide-context-strip small,
[data-theme="light"] .price-wizard-drawer .guide-team-line small{
  color:#72746C!important;
}
[data-theme="light"] .price-wizard-drawer .wizard-live-price{
  background:
    radial-gradient(110% 120% at 100% 0%,rgba(63,224,200,.13),transparent 65%),
    linear-gradient(145deg,rgba(255,255,255,.98),rgba(247,250,245,.92))!important;
  border-color:rgba(23,169,151,.24)!important;
  box-shadow:0 20px 42px -34px rgba(41,128,108,.26)!important;
}
[data-theme="light"] .price-wizard-drawer .wizard-live-price small{
  color:#13A997!important;
}
[data-theme="light"] .price-wizard-drawer .wizard-live-price strong{
  color:#171713!important;
}
[data-theme="light"] .price-wizard-drawer .wizard-live-price em,
[data-theme="light"] .price-wizard-drawer .wizard-live-price span{
  color:#72746C!important;
}
[data-theme="light"] .price-wizard-drawer .guide-focus,
[data-theme="light"] .price-wizard-drawer .guide-context-strip>div,
[data-theme="light"] .price-wizard-drawer .guide-drawer-team,
[data-theme="light"] .price-wizard-drawer .guide-story-step,
[data-theme="light"] .price-wizard-drawer .guide-drawer-close{
  background:rgba(255,255,255,.74)!important;
  border-color:rgba(58,55,45,.12)!important;
}
[data-theme="light"] .price-wizard-drawer .guide-story-step.is-active{
  background:
    linear-gradient(145deg,rgba(63,224,200,.12),rgba(124,124,255,.07))!important;
  border-color:rgba(23,169,151,.38)!important;
}
[data-theme="light"] .price-wizard-drawer .guide-drawer-progress{
  background:rgba(58,55,45,.10)!important;
}
[data-theme="light"] .price-wizard-drawer .guide-drawer-actions{
  background:
    linear-gradient(
      180deg,
      rgba(251,248,241,0),
      rgba(251,248,241,.96) 28%,
      #FBF8F1 58%
    )!important;
}
[data-theme="light"] .price-wizard-drawer .wizard-final-link{
  color:#159E8D!important;
}
[data-theme="light"] .price-wizard-drawer .btn.ghost{
  color:#25251F!important;
  border-color:rgba(58,55,45,.15)!important;
  background:rgba(255,255,255,.64)!important;
}

/* ---------- LIGHT SAVINGS CALCULATOR ---------- */
[data-theme="light"] .savings-tabs{
  background:rgba(255,253,248,.94)!important;
  border-bottom-color:rgba(58,55,45,.10)!important;
}
[data-theme="light"] .savings-tabs button{
  color:#66685F!important;
  background:rgba(255,255,255,.62)!important;
  border-color:rgba(58,55,45,.11)!important;
}
[data-theme="light"] .savings-tabs button.is-active{
  color:#171713!important;
  border-color:rgba(23,169,151,.34)!important;
  background:
    linear-gradient(145deg,rgba(63,224,200,.10),rgba(255,255,255,.92))!important;
}
[data-theme="light"] .calc-form-grid label,
[data-theme="light"] .calc-result-grid>div,
[data-theme="light"] .calc-result-single,
[data-theme="light"] .calc-grand-total>div{
  background:rgba(255,255,255,.70)!important;
  border-color:rgba(58,55,45,.11)!important;
}

/* ---------- MOBILE: NO SIDEWAYS DISCOVERY REQUIRED ---------- */
@media(max-width:760px){
  .category-tabs{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px!important;
    overflow:visible!important;
    padding:9px!important;
  }
  .category-tab{
    width:auto!important;
    flex:none!important;
    min-height:84px!important;
    padding:13px!important;
  }
  .category-tab b{
    max-width:calc(100% - 26px)!important;
    font-size:.96rem!important;
    line-height:1.12!important;
  }
  .category-tab small{
    font-size:.62rem!important;
  }
  .category-tab .tab-count{
    width:27px!important;
    min-width:27px!important;
    height:27px!important;
    top:10px!important;
    right:10px!important;
  }

  .choice-stage-intro{
    padding-top:12px!important;
  }
  .choice-stage-intro p{
    font-size:.82rem!important;
    line-height:1.45!important;
  }

  /* 2 × 2 calculator mode chooser. All modes always visible. */
  .savings-tabs{
    position:relative!important;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px!important;
    overflow:visible!important;
    padding:12px 14px!important;
    flex:none!important;
  }
  .savings-tabs button{
    min-height:58px!important;
    padding:10px 9px!important;
    font-size:.74rem!important;
    line-height:1.18!important;
  }

  /* Keep calculator header and mode chooser visible while its body scrolls. */
  .savings-calculator{
    overflow:hidden!important;
  }
  .savings-calc-head{
    flex:0 0 auto!important;
  }
  .savings-tabs{
    flex:0 0 auto!important;
  }
  .savings-calc-body{
    min-height:0!important;
    flex:1 1 auto!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
  }

  /* Light mobile guide should look like the light page, not a dark modal. */
  [data-theme="light"] .guide-drawer.price-wizard-drawer{
    background:
      radial-gradient(120% 95% at 100% 0%,rgba(63,224,200,.09),transparent 62%),
      linear-gradient(180deg,#FFFDF8 0%,#FBF8F1 62%,#F7F1E7 100%)!important;
    box-shadow:0 -28px 70px -40px rgba(87,65,31,.36)!important;
  }
}

/* Very small phones: still show all 4 category/calculator choices. */
@media(max-width:390px){
  .category-tab{
    min-height:78px!important;
    padding:11px!important;
  }
  .category-tab b{
    font-size:.87rem!important;
  }
  .savings-tabs button{
    min-height:54px!important;
    font-size:.69rem!important;
  }
}


/* =====================================================================
   V83 FINAL PRICE CLARITY
   TheOS cost is the hero. Savings is unmistakable.
   ===================================================================== */
.theos-title-grad,
.theos-price-gradient{
  background:linear-gradient(105deg,var(--peri) 0%,var(--aqua) 28%,#8FE7D5 44%,var(--coral) 72%,var(--peri) 100%);
  background-size:240% 100%;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent!important;
  -webkit-text-fill-color:transparent;
  animation:theosGradientDrift 8s ease-in-out infinite;
}
.theos-price-gradient{
  filter:drop-shadow(0 8px 28px color-mix(in srgb,var(--aqua) 16%,transparent));
}
@keyframes theosGradientDrift{
  0%,100%{background-position:0% 50%}
  50%{background-position:100% 50%}
}
.final-bill.is-self-hosted .theos-price-gradient{
  background:none!important;
  color:var(--fg)!important;
  -webkit-text-fill-color:var(--fg)!important;
  filter:none!important;
  animation:none!important;
}
.savings-hero-metric{
  position:relative;
  border-color:color-mix(in srgb,var(--aqua) 48%,var(--edge))!important;
  background:
    radial-gradient(120% 110% at 100% 0%,color-mix(in srgb,var(--aqua) 13%,transparent),transparent 64%),
    linear-gradient(140deg,color-mix(in srgb,var(--aqua) 7%,var(--glass)),color-mix(in srgb,var(--peri) 4%,var(--glass)))!important;
  overflow:hidden;
}
.savings-tag{
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  min-height:24px;
  padding:5px 9px;
  margin-bottom:9px;
  border-radius:999px;
  background:linear-gradient(120deg,var(--aqua),#77E6D5);
  color:#06110E!important;
  font-family:var(--ff)!important;
  font-size:.64rem!important;
  font-weight:850;
  letter-spacing:.035em!important;
  box-shadow:0 8px 22px -12px var(--aqua);
}
.savings-hero-metric strong{
  color:var(--aqua)!important;
  font-size:2.05rem!important;
}
.savings-hero-metric:after{
  content:"";
  position:absolute;
  right:-24px;
  bottom:-28px;
  width:92px;
  height:92px;
  border-radius:50%;
  border:1px solid color-mix(in srgb,var(--aqua) 24%,transparent);
  box-shadow:0 0 0 18px color-mix(in srgb,var(--aqua) 3%,transparent);
  pointer-events:none;
}
.final-bill-price strong{position:relative;z-index:2}
.final-bill-price span{font-size:1rem!important;font-weight:650}
.result-comparison-head h3{max-width:28ch}
[data-theme="light"] .theos-price-gradient,
[data-theme="light"] .theos-title-grad{
  background:linear-gradient(105deg,#6969F6 0%,#1FBFAE 30%,#49C9B6 46%,#EC8A67 73%,#6969F6 100%);
  background-size:240% 100%;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent!important;
  -webkit-text-fill-color:transparent;
}
[data-theme="light"] .savings-hero-metric{
  background:
    radial-gradient(120% 110% at 100% 0%,rgba(63,224,200,.14),transparent 64%),
    linear-gradient(140deg,rgba(255,255,255,.98),rgba(245,250,247,.92))!important;
  border-color:rgba(31,191,174,.26)!important;
}
[data-theme="light"] .savings-tag{
  background:linear-gradient(120deg,#31CDBA,#8BE2D3)!important;
  color:#10221D!important;
}
@media(max-width:760px){
  .final-bill-price strong{font-size:clamp(4.7rem,21vw,6.4rem)!important}
  .savings-tag{min-height:23px;padding:5px 8px;font-size:.61rem!important}
  .savings-hero-metric strong{font-size:1.72rem!important}
}
@media(prefers-reduced-motion:reduce){
  .theos-title-grad,.theos-price-gradient{animation:none!important;background-position:50% 50%!important}
}
html.motion-paused .theos-title-grad,
html.motion-paused .theos-price-gradient{
  animation:none!important;
  background-position:50% 50%!important;
}


/* =====================================================================
   V84 SAFARI / LOCAL-FILE FAILSAFE
   Basic content visibility can never depend on JavaScript or observers.
   ===================================================================== */
.rv,
.rv.in{
  opacity:1!important;
  transform:none!important;
  visibility:visible!important;
}

/* Keep interactive component motion, but disable only entrance hiding. */
main,
main section,
main .wrap,
.hero-copy,
.hero-hud,
.sec-head,
.wizard-choice-grid,
.users-picker,
.final-bill,
.result-comparison,
.included-expansion{
  visibility:visible!important;
}

/* Local Safari fallback for unsupported backdrop blur. */
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .topbar__in,
  .topin,
  .guide-overlay,
  .savings-calc-backdrop{
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
  }
  .topbar__in,
  .topin{
    background:var(--bg2)!important;
  }
}

/* Safari text gradient fallback. */
@supports not (-webkit-background-clip:text){
  .theos-title-grad,
  .theos-price-gradient,
  .grad{
    background:none!important;
    color:var(--aqua)!important;
    -webkit-text-fill-color:currentColor!important;
  }
}


/* V85 runtime diagnostic */
.runtime-warning{
  position:fixed;
  left:18px;right:18px;bottom:18px;
  z-index:9998;
  max-width:720px;
  margin-inline:auto;
  padding:15px 17px;
  border-radius:15px;
  border:1px solid color-mix(in srgb,var(--coral) 36%,var(--edge));
  background:var(--bg2);
  color:var(--fg);
  box-shadow:0 24px 64px -34px rgba(0,0,0,.52);
}
.runtime-warning strong{display:block;font-size:.95rem}
.runtime-warning span{display:block;margin-top:4px;color:var(--fg3);font-size:.8rem;line-height:1.45}


/* =====================================================================
   V87 INDEX TYPOGRAPHY RESTORE + ENTRY PRICE HERO
   Reference: Bricolage Grotesque display · Manrope UI/body · JetBrains Mono labels.
   ===================================================================== */
:root{
  --ff-d:"Bricolage Grotesque",ui-sans-serif,system-ui,sans-serif!important;
  --ff:"Manrope",ui-sans-serif,system-ui,sans-serif!important;
  --ff-m:"JetBrains Mono",ui-monospace,monospace!important;
}
body{
  font-family:var(--ff)!important;
  font-size:16.5px!important;
  line-height:1.62!important;
  font-weight:450!important;
  letter-spacing:0!important;
}
h1,h2,h3,h4{
  font-family:var(--ff-d)!important;
  letter-spacing:-.035em!important;
  line-height:1.02!important;
  font-weight:700!important;
}
.d1{
  font-family:var(--ff-d)!important;
  font-size:clamp(2.9rem,7.4vw,5.6rem)!important;
  line-height:.96!important;
  letter-spacing:-.045em!important;
  font-weight:750!important;
}
.d2{
  font-family:var(--ff-d)!important;
  font-size:clamp(2.1rem,4.4vw,3.5rem)!important;
  line-height:1!important;
  letter-spacing:-.04em!important;
  font-weight:700!important;
}
.d3{
  font-family:var(--ff-d)!important;
  font-size:clamp(1.35rem,2.2vw,1.85rem)!important;
  letter-spacing:-.03em!important;
  line-height:1.1!important;
}
.kicker,.pricing-step-marker{
  font-family:var(--ff-m)!important;
  font-size:.7rem!important;
  letter-spacing:.13em!important;
  text-transform:uppercase!important;
  font-weight:500!important;
}
.lede{
  font-family:var(--ff)!important;
  font-size:clamp(1.04rem,1.6vw,1.22rem)!important;
  line-height:1.6!important;
  font-weight:450!important;
}
.btn,button,input,select,textarea{
  font-family:var(--ff)!important;
}
.btn{
  font-weight:650!important;
  font-size:.94rem!important;
  letter-spacing:-.005em!important;
}

/* Hero entry price is a commercial anchor, not a live team calculation. */
.hero-entry-card{
  min-height:0!important;
  padding:28px!important;
  border-radius:28px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  background:
    radial-gradient(100% 120% at 100% 0%,color-mix(in srgb,var(--aqua) 12%,transparent),transparent 64%),
    radial-gradient(90% 100% at 0% 100%,color-mix(in srgb,var(--peri) 9%,transparent),transparent 68%),
    var(--glass)!important;
}
.hero-entry-head{
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding-bottom:20px;border-bottom:1px solid var(--edge2);
}
.hero-entry-head>small{
  font-family:var(--ff-m);font-size:.66rem;letter-spacing:.12em;color:var(--fg3);font-weight:500;
}
.hero-entry-head .live{font-family:var(--ff-m);font-size:.58rem;letter-spacing:.08em}
.hero-entry-price{
  display:flex;align-items:flex-end;gap:14px;padding:34px 0 22px;
}
.hero-entry-price>strong{
  font-family:var(--ff-d);font-size:clamp(4.7rem,8vw,7.6rem);font-weight:750;
  line-height:.78;letter-spacing:-.075em;
  background:linear-gradient(100deg,var(--peri),var(--aqua) 48%,var(--coral));
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 10px 30px color-mix(in srgb,var(--aqua) 12%,transparent));
}
.hero-entry-price>div{padding-bottom:6px;display:grid;gap:1px}
.hero-entry-price>div span{font-size:.9rem;color:var(--fg2);font-weight:600;line-height:1.25}
.hero-entry-copy{
  max-width:44ch;margin:0 0 24px;color:var(--fg2);font-size:.95rem;line-height:1.55;
}
.hero-entry-steps{margin-top:0!important;padding:16px 0!important}
.hero-entry-steps a span{font-size:.68rem!important}
.hero-entry-foot{
  display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px;
  padding-top:18px;color:var(--fg3);font-size:.75rem;font-weight:600;
}
.hero-entry-foot i{width:4px;height:4px;border-radius:50%;background:var(--aqua);opacity:.7}

/* Chapter 1 title should be direct and readable. */
#build .sec-head h2{max-width:13ch}
#build .sec-head .lede{max-width:52ch}

[data-theme="light"] .hero-entry-card{
  background:
    radial-gradient(100% 120% at 100% 0%,rgba(63,224,200,.12),transparent 64%),
    radial-gradient(90% 100% at 0% 100%,rgba(124,124,255,.08),transparent 68%),
    rgba(255,255,255,.78)!important;
}
[data-theme="light"] .hero-entry-price>strong{
  background:linear-gradient(100deg,#6969F6,#1FBFAE 48%,#EC8A67);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}

@media(max-width:760px){
  .hero-entry-card{padding:20px!important;border-radius:22px!important}
  .hero-entry-head{align-items:flex-start;padding-bottom:16px}
  .hero-entry-head .live{font-size:.5rem!important}
  .hero-entry-price{padding:28px 0 18px;gap:10px}
  .hero-entry-price>strong{font-size:clamp(4.3rem,20vw,6rem)!important}
  .hero-entry-price>div span{font-size:.78rem}
  .hero-entry-copy{font-size:.88rem;margin-bottom:18px}
  .hero-entry-steps{grid-template-columns:repeat(4,1fr)!important}
  .hero-entry-steps a span{font-size:.56rem!important;line-height:1.15}
  #build .sec-head h2{font-size:clamp(2.45rem,10.5vw,3.45rem)!important;max-width:12ch}
}
@media(max-width:420px){
  .hero-entry-head .live{display:none!important}
  .hero-entry-price>strong{font-size:4.25rem!important}
  .hero-entry-foot{justify-content:flex-start;font-size:.68rem}
}


/* V88 minimum-seat clarity */
.minimum-seat-note{
  margin-top:12px;
  padding:11px 12px;
  border:1px solid color-mix(in srgb,var(--aqua) 24%,var(--edge));
  border-radius:12px;
  background:color-mix(in srgb,var(--aqua) 5%,var(--glass2));
}
.minimum-seat-note strong{
  display:block;
  font-family:var(--ff);
  font-size:.78rem;
  font-weight:800;
  color:var(--fg);
}
.minimum-seat-note span{
  display:block;
  margin-top:4px;
  font-family:var(--ff);
  font-size:.72rem;
  line-height:1.45;
  color:var(--fg3);
}
.users-minimum-inline{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:6px;
  margin-top:10px;
  font-size:.7rem;
  color:var(--fg3);
}
.users-minimum-inline span{
  font-family:var(--ff);
}
.users-minimum-inline b{
  font-family:var(--ff);
  color:var(--aqua);
  font-weight:800;
}
[data-theme="light"] .minimum-seat-note{
  background:rgba(63,224,200,.07);
  border-color:rgba(31,191,174,.18);
}
@media(max-width:760px){
  .minimum-seat-note{
    padding:10px 11px;
  }
  .minimum-seat-note strong{font-size:.76rem}
  .minimum-seat-note span{font-size:.7rem}
  .users-minimum-inline{
    justify-content:flex-start;
    margin-top:12px;
  }
}


/* V89 minimum-seat simplification */
.minimum-seat-note{display:none!important}
.users-minimum-inline{
  display:block!important;
  margin-top:10px!important;
  text-align:right!important;
  font-family:var(--ff)!important;
  font-size:.74rem!important;
  color:var(--fg3)!important;
}
.users-minimum-inline b{
  color:var(--fg2)!important;
  font-weight:700!important;
}
@media(max-width:760px){
  .users-minimum-inline{
    text-align:left!important;
    margin-top:10px!important;
  }
}


/* =====================================================================
   V90 PRICE REVEAL PACING
   Choices first. Full calculation only in Chapter 5.
   ===================================================================== */
.preprice-hidden{display:none!important}

/* Hero keeps only the annual entry anchor. It is not a team calculation. */
.hero-entry-head>small:after{
  content:"";
}

/* Commitment = unit price, not team total. */
.wizard-choice-price.unit-price{
  align-items:flex-end!important;
}
.wizard-choice-price.unit-price strong{
  font-size:clamp(3.5rem,5vw,5.2rem)!important;
}
.wizard-choice-price.unit-price span{
  max-width:100px;
  line-height:1.25;
  padding-bottom:5px!important;
}

/* Deployment is a choice, not another price card. */
.wizard-choice-price.plan-only{
  align-items:center!important;
  gap:12px!important;
}
.wizard-choice-price.plan-only strong{
  font-size:2.65rem!important;
}
.wizard-choice-price.plan-only span{
  padding-bottom:0!important;
  font-size:.78rem!important;
}

/* Big configuration reveal under the final price. */
.final-config--reveal{
  grid-template-columns:repeat(3,1fr)!important;
  gap:10px!important;
}
.final-config--reveal>div{
  min-height:122px;
}
.final-config--reveal .reveal-count{
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:flex-start;
}
.final-config--reveal .reveal-count strong{
  display:block;
  font-family:var(--ff-d)!important;
  font-size:clamp(3rem,4.8vw,4.8rem)!important;
  line-height:.85!important;
  letter-spacing:-.07em!important;
  color:var(--aqua);
}
.final-config--reveal .reveal-count span{
  display:block;
  margin-top:9px;
  color:var(--fg2);
  font-size:.84rem;
  line-height:1.25;
}
.final-config--reveal .reveal-plan{
  grid-column:1/-1;
  min-height:72px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
}
.final-config--reveal .reveal-plan small{
  font-family:var(--ff-m)!important;
  font-size:.62rem!important;
  letter-spacing:.08em!important;
}
.final-config--reveal .reveal-plan b{
  font-family:var(--ff-d);
  font-size:1.18rem!important;
}

/* Guide deliberately hides money until the reveal. */
.price-wizard-drawer:not(.final-step) .wizard-live-price{
  background:var(--glass2)!important;
  border-color:var(--edge2)!important;
}
.price-wizard-drawer:not(.final-step) .wizard-live-price strong{
  font-size:1.35rem!important;
  color:var(--fg)!important;
  -webkit-text-fill-color:var(--fg)!important;
}
.price-wizard-drawer:not(.final-step) .wizard-live-price em{
  display:none!important;
}

/* Mobile */
@media(max-width:760px){
  .wizard-choice-price.unit-price strong{
    font-size:3.25rem!important;
  }
  .wizard-choice-price.plan-only strong{
    font-size:2.25rem!important;
  }
  .final-config--reveal{
    grid-template-columns:1fr 1fr!important;
  }
  .final-config--reveal .reveal-count:nth-child(3){
    grid-column:1/-1;
  }
  .final-config--reveal>div{
    min-height:102px!important;
  }
  .final-config--reveal .reveal-count strong{
    font-size:3rem!important;
  }
  .final-config--reveal .reveal-plan{
    grid-column:1/-1;
    min-height:82px!important;
    flex-direction:column;
    align-items:flex-start;
  }
}


/* V91 credible savings breakdown */
.savings-tabs{grid-template-columns:repeat(5,minmax(0,1fr))!important}
.savings-tabs button{min-height:58px!important}

.software-savings-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:22px}
.software-savings-summary>div{min-height:120px;padding:18px;border:1px solid var(--edge2);border-radius:16px;background:var(--glass2)}
.software-savings-summary small{display:block;font-family:var(--ff);font-size:.72rem;font-weight:750;color:var(--fg3)}
.software-savings-summary strong{display:inline-block;margin-top:10px;font-family:var(--ff-d);font-size:2.25rem;line-height:.9;letter-spacing:-.045em}
.software-savings-summary>div>span{margin-left:5px;color:var(--fg3);font-size:.7rem}
.software-savings-summary .good strong,.software-savings-summary .saving strong{color:var(--aqua)}
.software-savings-summary .saving{border-color:color-mix(in srgb,var(--aqua) 35%,var(--edge));background:color-mix(in srgb,var(--aqua) 5%,var(--glass2))}
.software-savings-summary .saving .savings-tag{display:flex!important;width:max-content;margin:0 0 5px!important}

.software-breakdown-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-top:28px;padding-bottom:12px;border-bottom:1px solid var(--edge)}
.software-breakdown-head h4{font-family:var(--ff-d);font-size:1.35rem}
.software-breakdown-head p{margin-top:5px;color:var(--fg3);font-size:.76rem}
.software-breakdown-head>span{flex:0 0 auto;padding:6px 9px;border:1px solid var(--edge);border-radius:999px;color:var(--fg2);font-size:.7rem}

.software-breakdown-list{display:grid;gap:8px;margin-top:12px}
.software-breakdown-row{display:grid;grid-template-columns:1.35fr .95fr 1fr auto;gap:14px;align-items:center;padding:15px;border:1px solid var(--edge2);border-radius:15px;background:var(--glass2);animation:softwareRowIn .48s var(--spring) both;animation-delay:var(--row-delay,0s)}
@keyframes softwareRowIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.software-product{display:flex;gap:11px;align-items:center;min-width:0}
.software-monogram{width:40px;height:40px;flex:0 0 auto;display:grid;place-items:center;border-radius:12px;border:1px solid var(--edge);background:var(--glass);font-family:var(--ff-d);font-weight:800;color:var(--aqua)}
.software-product strong,.software-price strong,.software-theos-map strong{display:block;font-size:.82rem;line-height:1.3}
.software-product small,.software-price small,.software-theos-map small{display:block;color:var(--fg3);font-family:var(--ff);font-size:.66rem;line-height:1.35}
.software-product small{margin-top:3px}.software-price>span{display:block;margin-top:4px;color:var(--fg3);font-size:.63rem;line-height:1.35}.software-theos-map strong{color:var(--aqua)}
.software-source{display:inline-flex;align-items:center;min-height:38px;padding:8px 10px;border:1px solid var(--edge);border-radius:10px;color:var(--fg2);font-size:.69rem;white-space:nowrap;transition:transform .25s var(--spring),border-color .25s var(--e),color .25s var(--e)}
.software-source:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--aqua) 40%,var(--edge));color:var(--aqua)}
.software-empty{padding:18px;border:1px solid var(--edge2);border-radius:14px;background:var(--glass2)}.software-empty strong{display:block;font-size:.84rem}.software-empty span{display:block;margin-top:5px;color:var(--fg3);font-size:.74rem}

.software-benchmark-note{margin-top:12px;padding:15px 16px;border:1px solid color-mix(in srgb,var(--aqua) 20%,var(--edge));border-radius:14px;background:color-mix(in srgb,var(--aqua) 4%,var(--glass2))}
.software-benchmark-note strong{font-size:.8rem}.software-benchmark-note p{margin-top:5px;color:var(--fg3);font-size:.74rem;line-height:1.5}

.included-extra-value{margin-top:24px;padding-top:20px;border-top:1px solid var(--edge)}
.included-extra-head small{font-family:var(--ff);font-size:.7rem;font-weight:800;color:var(--coral)}
.included-extra-head h4{margin-top:5px;font-family:var(--ff-d);font-size:1.3rem}
.included-extra-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:12px}
.included-extra-grid>div{padding:13px;border:1px solid var(--edge2);border-radius:13px;background:var(--glass2)}
.included-extra-grid strong{display:block;font-size:.78rem}.included-extra-grid span{display:block;margin-top:4px;color:var(--fg3);font-size:.69rem;line-height:1.4}
.included-extra-value>p{margin-top:10px;color:var(--fg3);font-size:.72rem;line-height:1.5}

.final-config--simple{grid-template-columns:1fr 1fr!important}.final-config--simple .reveal-plan{grid-column:1/-1!important}
.result-comparison-head p{max-width:48ch;margin-top:6px;color:var(--fg3);font-size:.76rem;line-height:1.45}

[data-theme="light"] .software-breakdown-row,[data-theme="light"] .software-savings-summary>div,[data-theme="light"] .included-extra-grid>div{background:rgba(255,255,255,.68)!important}
[data-theme="light"] .software-source{background:rgba(255,255,255,.60)}

@media(max-width:980px){.software-breakdown-row{grid-template-columns:1fr 1fr}.software-source{justify-self:start}}
@media(max-width:760px){
  .savings-tabs{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .savings-tabs button:first-child{grid-column:1/-1}
  .software-savings-summary{grid-template-columns:1fr}
  .software-savings-summary>div{min-height:96px}
  .software-breakdown-head{align-items:flex-start;flex-direction:column}
  .software-breakdown-row{grid-template-columns:1fr!important;gap:10px!important;padding:14px!important}
  .software-price,.software-theos-map{padding-top:9px;border-top:1px solid var(--edge2)}
  .software-source{width:100%;justify-content:center}
  .included-extra-grid{grid-template-columns:1fr}
  .final-config--simple{grid-template-columns:1fr 1fr!important}
}
@media(prefers-reduced-motion:reduce){.software-breakdown-row{animation:none!important}}
html.motion-paused .software-breakdown-row{animation:none!important}


/* V92 premium feedback */
button,.btn,a.btn,.option,.category-tab,.wizard-choice,.guide-story-step,summary,.software-source{
  -webkit-tap-highlight-color:transparent;
}
button:active,.btn:active,a.btn:active,.category-tab:active,.guide-story-step:active,summary:active,.software-source:active{
  transform:translateY(1px) scale(.985)!important;
  transition-duration:.07s!important;
}
.option:active,.wizard-choice:active{
  transform:scale(.992)!important;
  transition-duration:.07s!important;
}
button:focus-visible,.btn:focus-visible,.option:focus-visible,.category-tab:focus-visible,.wizard-choice:focus-visible,summary:focus-visible{
  outline:2px solid color-mix(in srgb,var(--aqua) 64%,transparent)!important;
  outline-offset:3px!important;
}
#sound.is-on,#haptic.is-on{
  border-color:color-mix(in srgb,var(--aqua) 34%,var(--edge))!important;
  background:color-mix(in srgb,var(--aqua) 6%,var(--glass2))!important;
}
input[type="range"]::-webkit-slider-thumb{
  transition:transform .16s var(--spring),box-shadow .18s var(--e)!important;
}
input[type="range"]:active::-webkit-slider-thumb{transform:scale(1.16)!important}
input[type="range"]::-moz-range-thumb{
  transition:transform .16s var(--spring),box-shadow .18s var(--e)!important;
}
input[type="range"]:active::-moz-range-thumb{transform:scale(1.16)!important}
@media(prefers-reduced-motion:reduce){
  button:active,.btn:active,a.btn:active,.category-tab:active,.guide-story-step:active,summary:active,.software-source:active,.option:active,.wizard-choice:active{
    transform:none!important;
  }
}
html.motion-paused button:active,
html.motion-paused .btn:active,
html.motion-paused .option:active,
html.motion-paused .wizard-choice:active{transform:none!important}


/* =====================================================================
   V93 STRONG FEEDBACK
   Stronger sound, stronger Android vibration, visible iOS fallback.
   ===================================================================== */

@keyframes vhTap{
  0%{transform:translateZ(0)}
  38%{transform:translateY(1px)}
  100%{transform:none}
}
@keyframes vhConfirm{
  0%{filter:none}
  35%{filter:brightness(1.06)}
  100%{filter:none}
}

/* Visual haptic fallback for browsers without vibration APIs. */
html.vh-tap .topbar__in,
html.vh-select .topbar__in,
html.vh-nav .topbar__in,
html.vh-close .topbar__in,
html.vh-soft .topbar__in,
html.vh-tick .topbar__in{
  animation:vhTap .12s var(--spring);
}
html.vh-confirm .topbar__in{
  animation:vhConfirm .20s var(--spring);
}

/* Presses now feel firmer. */
button:active,
.btn:active,
a.btn:active,
.category-tab:active,
.guide-story-step:active,
summary:active,
.software-source:active{
  transform:translateY(2px) scale(.972)!important;
  transition-duration:.055s!important;
}
.option:active,
.wizard-choice:active{
  transform:scale(.982)!important;
  transition-duration:.055s!important;
}

/* Stronger slider detent impression */
input[type="range"]:active::-webkit-slider-thumb{
  transform:scale(1.24)!important;
  box-shadow:0 0 0 7px color-mix(in srgb,var(--aqua) 12%,transparent)!important;
}
input[type="range"]:active::-moz-range-thumb{
  transform:scale(1.24)!important;
  box-shadow:0 0 0 7px color-mix(in srgb,var(--aqua) 12%,transparent)!important;
}

/* Keep feedback tasteful in reduced-motion mode. */
@media(prefers-reduced-motion:reduce){
  html.vh-tap .topbar__in,
  html.vh-select .topbar__in,
  html.vh-nav .topbar__in,
  html.vh-close .topbar__in,
  html.vh-soft .topbar__in,
  html.vh-tick .topbar__in,
  html.vh-confirm .topbar__in{
    animation:none!important;
  }
}


/* =====================================================================
   V95 · FINAL-CHAPTER VALUE THESIS
   Keep the hero clean. Reveal the $9 positioning only at Chapter 5.
   ===================================================================== */
.final-value-thesis{
  margin-top:24px;
  max-width:620px;
}
.final-value-thesis strong{
  display:block;
  font-family:var(--ff-d);
  font-size:clamp(1.55rem,2.5vw,2.2rem);
  line-height:1.05;
  letter-spacing:-.04em;
  font-weight:720;
  background:linear-gradient(100deg,var(--peri),var(--aqua) 46%,var(--coral));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.final-value-thesis span{
  display:block;
  margin-top:8px;
  max-width:48ch;
  font-family:var(--ff-d);
  font-size:clamp(1rem,1.45vw,1.16rem);
  line-height:1.4;
  letter-spacing:-.02em;
  color:var(--fg2);
}
.final-value-thesis p{
  margin-top:10px;
  max-width:55ch;
  color:var(--fg3);
  font-size:.9rem;
  line-height:1.55;
}
[data-theme="light"] .final-value-thesis span{color:#434B64}
[data-theme="light"] .final-value-thesis p{color:#68708A}

@media(max-width:760px){
  .final-value-thesis{
    margin-top:20px;
  }
  .final-value-thesis strong{
    font-size:1.7rem;
  }
  .final-value-thesis span{
    font-size:1rem;
  }
  .final-value-thesis p{
    font-size:.84rem;
  }
}


/* =====================================================================
   V96 CLEAN FINAL REVEAL
   One value line, then price. Number cards share one visual baseline.
   ===================================================================== */

/* Retire the longer V95 thesis treatment. */
.final-value-thesis{display:none!important}

.final-value-line{
  max-width:54ch;
  margin:18px 0 28px;
  color:var(--fg2);
  font-family:var(--ff);
  font-size:clamp(.98rem,1.45vw,1.12rem);
  line-height:1.55;
}
.final-value-line strong{
  color:var(--fg);
  font-weight:750;
}
[data-theme="light"] .final-value-line{color:#555D72}
[data-theme="light"] .final-value-line strong{color:#151922}

/* Price comes before savings exploration. */
.calc-launch--after-price{
  margin-top:20px;
  width:max-content;
  max-width:100%;
}

/* Exactly aligned configuration cards. */
.final-config--simple{
  align-items:stretch!important;
}
.final-config--simple .reveal-count{
  min-height:178px!important;
  padding:24px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:space-between!important;
  align-items:flex-start!important;
}
.final-config--simple .reveal-count strong{
  margin:0!important;
  line-height:.82!important;
  min-height:1em;
  display:block!important;
}
.final-config--simple .reveal-count>span{
  margin:0!important;
  min-height:3.1em;
  display:flex!important;
  align-items:flex-end!important;
  font-size:.84rem!important;
  line-height:1.35!important;
}

/* Keep the plan card clearly separate. */
.final-config--simple .reveal-plan{
  margin-top:0!important;
}

@media(max-width:760px){
  .final-value-line{
    margin:14px 0 22px;
    font-size:.93rem;
    line-height:1.5;
  }
  .calc-launch--after-price{
    width:100%;
    justify-content:center;
  }
  .final-config--simple .reveal-count{
    min-height:168px!important;
    padding:22px!important;
  }
  .final-config--simple .reveal-count strong{
    font-size:3rem!important;
  }
  .final-config--simple .reveal-count>span{
    min-height:4.15em;
    font-size:.82rem!important;
  }
}


/* =====================================================================
   V98 · CLEAN $9 PRICING
   The per-person story follows the actual selected commitment:
   $9 annual / $14 monthly.
   ===================================================================== */

.final-value-line{
  margin:16px 0 24px!important;
  color:var(--fg3)!important;
  font-size:.92rem!important;
}

/* Main post-price value story */
.price-value-story{
  margin-top:20px;
  padding:clamp(24px,3.5vw,36px);
  border:1px solid var(--edge);
  border-radius:22px;
  background:
    radial-gradient(70% 120% at 0% 0%,color-mix(in srgb,var(--peri) 10%,transparent),transparent 65%),
    radial-gradient(65% 110% at 100% 0%,color-mix(in srgb,var(--aqua) 9%,transparent),transparent 66%),
    var(--glass2);
  backdrop-filter:blur(16px) saturate(1.25);
  -webkit-backdrop-filter:blur(16px) saturate(1.25);
}

.price-value-intro small{
  display:block;
  font-family:var(--ff-m);
  font-size:.62rem;
  letter-spacing:.11em;
  text-transform:uppercase;
  color:var(--fg3);
}
.price-value-intro h3{
  margin-top:10px;
  max-width:17ch;
  font-family:var(--ff-d);
  font-size:clamp(2rem,4vw,3.4rem);
  line-height:.98;
  letter-spacing:-.055em;
}
.price-value-intro h3 #dynamicUnitPrice{
  color:var(--aqua);
}
.price-value-intro>p{
  margin-top:9px;
  color:var(--fg3);
  font-size:.78rem;
}

.value-pillars{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:8px;
  margin-top:24px;
}
.value-pillars article{
  min-height:176px;
  padding:17px;
  border:1px solid var(--edge2);
  border-radius:15px;
  background:var(--glass2);
}
.value-pillar-no{
  display:block;
  font-family:var(--ff-m);
  font-size:.58rem;
  letter-spacing:.09em;
  color:var(--aqua);
}
.value-pillars h4{
  margin-top:28px;
  font-family:var(--ff-d);
  font-size:1.06rem;
  letter-spacing:-.03em;
}
.value-pillars p{
  margin-top:7px;
  color:var(--fg3);
  font-size:.72rem;
  line-height:1.45;
}

.value-action-rail{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  margin-top:16px;
  padding:13px 15px;
  border:1px solid var(--edge2);
  border-radius:14px;
  background:var(--glass2);
  color:var(--fg2);
  font-size:.72rem;
  font-weight:700;
}
.value-action-rail i{
  width:4px;
  height:4px;
  border-radius:50%;
  background:linear-gradient(135deg,var(--peri),var(--aqua));
  opacity:.75;
  flex:0 0 auto;
}

.value-principle{
  display:flex;
  align-items:baseline;
  gap:8px 14px;
  flex-wrap:wrap;
  margin-top:16px;
  padding-top:16px;
  border-top:1px solid var(--edge2);
}
.value-principle strong{
  font-family:var(--ff-d);
  font-size:1rem;
  letter-spacing:-.025em;
  color:var(--fg);
}
.value-principle span{
  color:var(--fg3);
  font-size:.78rem;
}

/* Savings now follows the value story. */
.calc-launch--after-price{
  margin-top:14px!important;
}

[data-theme="light"] .price-value-story{
  background:
    radial-gradient(70% 120% at 0% 0%,rgba(124,124,255,.07),transparent 65%),
    radial-gradient(65% 110% at 100% 0%,rgba(63,224,200,.07),transparent 66%),
    rgba(255,255,255,.68);
}
[data-theme="light"] .value-pillars article,
[data-theme="light"] .value-action-rail{
  background:rgba(255,255,255,.55);
}

@media(max-width:900px){
  .value-pillars{grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
  .price-value-story{
    padding:20px;
    margin-top:16px;
  }
  .price-value-intro h3{
    font-size:2.35rem;
    max-width:12ch;
  }
  .value-pillars{
    grid-template-columns:1fr 1fr;
    gap:7px;
  }
  .value-pillars article{
    min-height:154px;
    padding:14px;
  }
  .value-pillars h4{
    margin-top:20px;
    font-size:1rem;
  }
  .value-pillars p{
    font-size:.68rem;
  }
  .value-action-rail{
    gap:6px;
    padding:12px;
    font-size:.67rem;
  }
  .value-principle{
    display:grid;
    gap:4px;
  }
  .value-principle span{
    font-size:.72rem;
    line-height:1.45;
  }
}
@media(max-width:420px){
  .value-pillars{
    grid-template-columns:1fr 1fr;
  }
  .value-pillars article{
    min-height:148px;
  }
}


/* =====================================================================
   V99 · LIVE USER COUNT
   All seat-count surfaces track one source of truth.
   ===================================================================== */
@keyframes seatCountPop{
  0%{transform:translateY(0) scale(1)}
  42%{transform:translateY(-2px) scale(1.045)}
  100%{transform:translateY(0) scale(1)}
}
.seat-count-pop{
  animation:seatCountPop .22s var(--spring)!important;
  transform-origin:left center;
}
#wizardSeatInput.seat-count-pop{
  color:var(--aqua)!important;
}
#finalConfigUsers.seat-count-pop,
#guideSeats.seat-count-pop,
#seatBig.seat-count-pop{
  color:var(--aqua);
}
@media(prefers-reduced-motion:reduce){
  .seat-count-pop{animation:none!important}
}
html.motion-paused .seat-count-pop{animation:none!important}


/* =====================================================================
   V100 · VALUE CARDS
   Make $9/$14 feel like unusually strong value without looking cheap.
   ===================================================================== */

.price-value-story--buy{
  padding:clamp(24px,3.6vw,38px)!important;
}

.price-value-intro--buy h3{
  max-width:none!important;
  font-size:clamp(2.4rem,5vw,4.4rem)!important;
}
.price-value-intro--buy h3 #dynamicUnitPrice{
  background:linear-gradient(100deg,var(--peri),var(--aqua) 48%,var(--coral));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent!important;
}
.price-value-intro--buy>p{
  margin-top:8px!important;
  font-size:.8rem!important;
}

/* Immediate "wow, all this?" line */
.value-promise{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
  margin-top:22px;
}
.value-promise>*{
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:7px 11px;
  border:1px solid var(--edge2);
  border-radius:999px;
  background:var(--glass2);
  color:var(--fg2);
  font-family:var(--ff);
  font-size:.72rem;
  font-weight:700;
}
.value-promise strong{
  color:var(--aqua);
  border-color:color-mix(in srgb,var(--aqua) 30%,var(--edge));
  background:color-mix(in srgb,var(--aqua) 6%,var(--glass2));
}
.value-promise sup{
  margin-left:1px;
  font-size:.58em;
  line-height:1;
}

/* Compact one-word proof cards */
.value-card-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  margin-top:18px;
}
.value-card{
  min-height:150px;
  padding:17px;
  border:1px solid var(--edge2);
  border-radius:15px;
  background:var(--glass2);
  position:relative;
  overflow:hidden;
  transition:transform .28s var(--spring),border-color .28s var(--e),background .28s var(--e);
}
.value-card::after{
  content:"";
  position:absolute;
  width:100px;
  height:100px;
  right:-38px;
  top:-44px;
  border-radius:50%;
  background:radial-gradient(circle,color-mix(in srgb,var(--aqua) 11%,transparent),transparent 68%);
  pointer-events:none;
}
.value-card:hover{
  transform:translateY(-3px);
  border-color:color-mix(in srgb,var(--aqua) 22%,var(--edge));
}
.value-card-no{
  display:block;
  font-family:var(--ff-m);
  font-size:.56rem;
  letter-spacing:.09em;
  color:var(--aqua);
}
.value-card h4{
  margin-top:22px;
  font-family:var(--ff-d);
  font-size:1.22rem;
  line-height:1;
  letter-spacing:-.04em;
}
.value-card h4 sup{
  font-size:.48em;
  vertical-align:top;
  color:var(--aqua);
}
.value-card p{
  margin-top:8px;
  color:var(--fg3);
  font-size:.70rem;
  line-height:1.42;
  max-width:25ch;
}

/* Strong closing thought, still short. */
.value-action-rail--buy{
  margin-top:14px!important;
}
.value-principle--buy{
  margin-top:14px!important;
}
.value-principle--buy strong{
  font-size:1.05rem!important;
}

.unlimited-ai-note{
  margin-top:14px;
  padding-top:12px;
  border-top:1px solid var(--edge2);
  color:var(--fg3);
  font-family:var(--ff);
  font-size:.64rem;
  line-height:1.45;
  max-width:76ch;
}
.unlimited-ai-note sup{
  color:var(--aqua);
  font-weight:800;
}

[data-theme="light"] .value-promise>*,
[data-theme="light"] .value-card{
  background:rgba(255,255,255,.58);
}
[data-theme="light"] .value-promise strong{
  color:#159D8B;
}

@media(max-width:900px){
  .value-card-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media(max-width:760px){
  .price-value-story--buy{
    padding:20px!important;
  }
  .price-value-intro--buy h3{
    font-size:2.75rem!important;
  }
  .value-promise{
    gap:6px;
    margin-top:18px;
  }
  .value-promise>*{
    min-height:30px;
    padding:6px 9px;
    font-size:.66rem;
  }
  .value-card-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px;
    margin-top:14px;
  }
  .value-card{
    min-height:142px;
    padding:14px;
  }
  .value-card h4{
    margin-top:18px;
    font-size:1.08rem;
  }
  .value-card p{
    font-size:.66rem;
    line-height:1.4;
  }
  .unlimited-ai-note{
    font-size:.60rem;
  }
}
@media(max-width:390px){
  .value-card-grid{
    grid-template-columns:1fr 1fr;
  }
  .value-card{
    min-height:146px;
  }
}


/* =====================================================================
   V101 · SAVINGS + BOQ RUNTIME FIX
   ===================================================================== */
.boq-shell.open .boq-toggle{
  background:color-mix(in srgb,var(--aqua) 4%,var(--glass2));
}
.boq-shell.open .boq-toggle-icon{
  color:var(--aqua);
  border-color:color-mix(in srgb,var(--aqua) 34%,var(--edge));
}
.boq-shell.open .boq-panel-inner{
  overflow:visible;
}
.software-breakdown-row{
  position:relative;
}
.software-breakdown-row .software-source{
  font-weight:700;
}



.rv,.rv.in{opacity:1!important;transform:none!important;visibility:visible!important}
.local-js-warning{
  display:block!important;
  position:fixed;
  left:16px;right:16px;bottom:16px;
  z-index:9999;
  padding:16px 18px;
  border-radius:16px;
  background:#fffdf8;
  color:#171713;
  border:1px solid rgba(58,55,45,.14);
  box-shadow:0 22px 60px -30px rgba(0,0,0,.45);
  font:600 15px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
.local-js-warning strong{display:block;font-size:17px;margin-bottom:4px}
.local-js-warning span{display:block;color:#66685f;font-weight:500}

.pricing-inline-0{font-size:.68rem;margin-top:12px}