/* Prosperus · v3 theme system. One seamless surface, two themes.
   Light (default): clear ground, frosted glass, soft light. Dark: ink ground, smoked glass, brighter light.
   Section bands are gone: every section is transparent over the page ground; stone and light are feathered overlays. */

/* ---------- shared: seamless surfaces ---------- */
.sec, .state4, .hero4, .workhero, .casehero, .casefile, .cta-band, .footwrap, .dk, .state4.dk, .sec.dk{background:transparent}
.casefile.tint{background:transparent}
.stone{background:transparent}
.stone::before{content:""; position:absolute; inset:0; z-index:-2; pointer-events:none; opacity:var(--stone-a,1);
  background:var(--lime) var(--stone) center/1100px 1100px;
  -webkit-mask-image:linear-gradient(to bottom, transparent, #000 14%, #000 86%, transparent); mask-image:linear-gradient(to bottom, transparent, #000 14%, #000 86%, transparent)}
.field{-webkit-mask-image:linear-gradient(to bottom, transparent, #000 18%, #000 82%, transparent); mask-image:linear-gradient(to bottom, transparent, #000 18%, #000 82%, transparent)}
html.theming, html.theming *{transition:background-color .6s var(--ease), color .6s var(--ease), border-color .6s var(--ease), box-shadow .6s var(--ease)!important}

/* ---------- light theme ---------- */
:root:not([data-theme="dark"]){
  --stone-a:.6;
}
:root:not([data-theme="dark"]) body{background:
  radial-gradient(60% 40% at 80% 0%, rgba(127,180,255,.10), transparent 60%),
  radial-gradient(50% 36% at 10% 30%, rgba(246,200,224,.12), transparent 60%),
  var(--clear)}
:root:not([data-theme="dark"]) .dk, :root:not([data-theme="dark"]) .state4.dk{color:var(--ink)}
:root:not([data-theme="dark"]) .dk p{color:var(--slate)}
:root:not([data-theme="dark"]) .dk .lbl{color:var(--mute)}
:root:not([data-theme="dark"]) .dk .lbl b{color:var(--ink)}
:root:not([data-theme="dark"]) .dk .sec-head h2, :root:not([data-theme="dark"]) .dk h2, :root:not([data-theme="dark"]) .dk h3, :root:not([data-theme="dark"]) .state4 p.big{color:var(--ink)}
:root:not([data-theme="dark"]) .glass-dark{background:linear-gradient(180deg, rgba(255,255,255,.62), rgba(255,255,255,.34)); border:1px solid rgba(255,255,255,.9);
  box-shadow:inset 0 1px 0 #fff, inset 0 -10px 24px -16px rgba(127,180,255,.35), 0 34px 70px -40px rgba(25,50,90,.45); -webkit-backdrop-filter:blur(22px) saturate(150%); backdrop-filter:blur(22px) saturate(150%)}
:root:not([data-theme="dark"]) .pane4{color:var(--ink)}
:root:not([data-theme="dark"]) .layers4 li{border-bottom-color:rgba(15,23,32,.1)}
:root:not([data-theme="dark"]) .layers4 li .n{color:var(--mute)}
:root:not([data-theme="dark"]) .layers4 li h3{color:var(--ink)}
:root:not([data-theme="dark"]) .specs4 th{color:var(--mute)}
:root:not([data-theme="dark"]) .specs4 th, :root:not([data-theme="dark"]) .specs4 td{border-bottom-color:rgba(15,23,32,.08); color:var(--slate)}
:root:not([data-theme="dark"]) .specs4 td:first-child{color:var(--ink)}
:root:not([data-theme="dark"]) .specs4 td.m{color:var(--mute)}
:root:not([data-theme="dark"]) .story3 .st p{color:var(--slate)}
:root:not([data-theme="dark"]) .dk .tier.glass{background:linear-gradient(180deg, rgba(255,255,255,.62), rgba(255,255,255,.34)); border-color:rgba(255,255,255,.9); color:var(--ink)}
:root:not([data-theme="dark"]) .dk .tier.glass ul{color:var(--slate)}
:root:not([data-theme="dark"]) .dk .tier .btn-line{color:var(--ink); border-color:rgba(15,23,32,.2)}
:root:not([data-theme="dark"]) .dk .tier.feature{background:rgba(255,255,255,.92); color:var(--ink)}
:root:not([data-theme="dark"]) .dk .tier.feature .lbl{color:var(--mute)}
:root:not([data-theme="dark"]) .tier.feature .btn-glass{background:var(--ink); color:#fff}
:root:not([data-theme="dark"]) .status.ok{background:rgba(199,240,230,.5); color:var(--ink); border-color:rgba(127,180,255,.3)}
:root:not([data-theme="dark"]) .status.err{background:rgba(246,200,224,.45); color:var(--ink); border-color:rgba(246,200,224,.8)}
:root:not([data-theme="dark"]) .glass-dark .field-w input, :root:not([data-theme="dark"]) .glass-dark .field-w select, :root:not([data-theme="dark"]) .glass-dark .field-w textarea{background:rgba(255,255,255,.75); border-color:rgba(15,23,32,.14); color:var(--ink)}
:root:not([data-theme="dark"]) .glass-dark .field-w textarea::placeholder{color:var(--mute)}
:root:not([data-theme="dark"]) .glass-dark .field-w label{color:var(--slate)}
:root:not([data-theme="dark"]) .door{color:var(--ink)}
:root:not([data-theme="dark"]) .door:hover{background:linear-gradient(180deg, rgba(255,255,255,.8), rgba(255,255,255,.5))}
:root:not([data-theme="dark"]) .door span{color:var(--slate)}
:root:not([data-theme="dark"]) .next3 .lbl{color:var(--mute)}
:root:not([data-theme="dark"]) .next3 .lbl i{color:var(--ink)}
:root:not([data-theme="dark"]) .dk .contact-grid p a{color:var(--ink)}
:root:not([data-theme="dark"]) .dk .sec-head h2{color:var(--ink)}
:root:not([data-theme="dark"]) .sec.dk{background:transparent}
.tier.feature{position:relative; overflow:hidden}
.tier.feature::before{content:""; position:absolute; left:0; right:0; top:0; height:3px; background:var(--prism); box-shadow:0 0 14px rgba(127,180,255,.6)}

/* ---------- dark theme ---------- */
:root[data-theme="dark"]{
  color-scheme:dark;
  --ink:#F3F6F9; --slate:#B8C4D0; --mute:#8FA0B2; --clear:#0B1118; --mist:#1B2733; --lime:#121B25; --stone-a:.35;
  --sky:#2C5FC4; --mint:#1E7A70; --blush:#9A4A78; --amber:#B06E22;
}
.ground{display:none}
:root[data-theme="dark"] .ground{display:block; position:fixed; inset:0; z-index:-5; pointer-events:none; background:
  radial-gradient(60% 55% at 88% -5%, rgba(127,180,255,.62), transparent 62%),
  radial-gradient(50% 45% at -8% 78%, rgba(245,194,122,.5), transparent 62%),
  radial-gradient(42% 38% at 58% 52%, rgba(246,200,224,.3), transparent 62%),
  radial-gradient(36% 36% at 100% 100%, rgba(199,240,230,.3), transparent 62%),
  radial-gradient(30% 30% at 20% 20%, rgba(199,240,230,.2), transparent 62%),
  linear-gradient(180deg,#223040,#1A2531 50%,#1F2B38)}
:root[data-theme="dark"] .ground::after{content:""; position:absolute; inset:0; background:var(--stone) center/1100px 1100px; filter:invert(1) hue-rotate(180deg) brightness(.5); mix-blend-mode:screen; opacity:.75}
:root[data-theme="dark"] body{color:var(--ink); background:#1C2836}
:root[data-theme="dark"] .stone::before{display:none}
:root[data-theme="dark"] .field{filter:blur(70px) saturate(150%)}
:root[data-theme="dark"] .field{opacity:.95!important}
:root[data-theme="dark"] .sweep{mix-blend-mode:screen; opacity:.35}
:root[data-theme="dark"] .glass, :root[data-theme="dark"] .glass-dark, :root[data-theme="dark"] .dk .tier.glass, :root[data-theme="dark"] .case, :root[data-theme="dark"] .faq details, :root[data-theme="dark"] .door{
  background:linear-gradient(155deg, rgba(255,255,255,.17), rgba(255,255,255,.06) 42%, rgba(255,255,255,.04) 70%, rgba(127,180,255,.10)); border:1px solid rgba(255,255,255,.26);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.4), inset 1px 0 0 rgba(255,255,255,.12), inset 0 -14px 30px -18px rgba(127,180,255,.35), inset 0 0 0 1px rgba(255,255,255,.04), 0 40px 80px -40px rgba(0,0,0,.7);
  -webkit-backdrop-filter:blur(24px) saturate(170%); backdrop-filter:blur(24px) saturate(170%)}
:root[data-theme="dark"] .btn-ink{color:#0F1720; background:linear-gradient(180deg, #fff, #E4ECF4 60%, #D6E2EE); border-color:rgba(255,255,255,.95);
  box-shadow:inset 0 1px 0 #fff, inset 0 -1px 0 rgba(127,180,255,.3), 0 18px 36px -16px rgba(0,0,0,.7)}
:root[data-theme="dark"] .btn-ink:hover{box-shadow:inset 0 1px 0 #fff, 0 24px 44px -18px rgba(0,0,0,.8)}
:root[data-theme="dark"] .btn-ink:hover::after{opacity:1}
:root[data-theme="dark"] .btn-glass{color:#fff; background:linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.06)); border-color:rgba(255,255,255,.28);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35), inset 0 -8px 16px -10px rgba(127,180,255,.35), 0 14px 30px -18px rgba(0,0,0,.7)}
:root[data-theme="dark"] .btn-glass:hover{background:linear-gradient(180deg, rgba(255,255,255,.22), rgba(255,255,255,.1))}
:root[data-theme="dark"] .btn-line{color:#fff; border-color:rgba(255,255,255,.28); background:rgba(255,255,255,.05)}
:root[data-theme="dark"] .btn-line:hover{border-color:#fff}
:root[data-theme="dark"] .chip{background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.18); color:var(--slate)}
:root[data-theme="dark"] .dd-p, :root[data-theme="dark"] .mnav{background:linear-gradient(155deg, rgba(40,52,66,.9), rgba(20,29,39,.92))}
:root[data-theme="dark"] .dd-t:hover, :root[data-theme="dark"] .dd-link:hover, :root[data-theme="dark"] .dd.open .dd-t{background:rgba(255,255,255,.1)}
:root[data-theme="dark"] .dd-t::after{background:rgba(255,255,255,.3)}
:root[data-theme="dark"] .dd-list a:hover, :root[data-theme="dark"] .dd-cases a:hover, :root[data-theme="dark"] .index a:hover{background:rgba(255,255,255,.08)}
:root[data-theme="dark"] .mlist a, :root[data-theme="dark"] .mall{border-bottom-color:rgba(255,255,255,.1)}

:root[data-theme="dark"] .case .ph{background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02))}
:root[data-theme="dark"] .case .site{border-color:rgba(255,255,255,.3)}

:root[data-theme="dark"] .field-w input, :root[data-theme="dark"] .field-w select, :root[data-theme="dark"] .field-w textarea, :root[data-theme="dark"] .glass-dark .field-w input, :root[data-theme="dark"] .glass-dark .field-w select, :root[data-theme="dark"] .glass-dark .field-w textarea{background:rgba(255,255,255,.07); border-color:rgba(255,255,255,.18); color:#fff}
:root[data-theme="dark"] .field-w label, :root[data-theme="dark"] .glass-dark .field-w label{color:var(--slate)}
:root[data-theme="dark"] .field-w select option{color:#0F1720}
:root[data-theme="dark"] .tier.feature, :root[data-theme="dark"] .dk .tier.feature{background:linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,.08)); color:#fff; border:1px solid rgba(255,255,255,.22)}
:root[data-theme="dark"] .tier.feature p, :root[data-theme="dark"] .tier.feature ul, :root[data-theme="dark"] .dk .tier.feature p, :root[data-theme="dark"] .dk .tier.feature ul{color:var(--slate)}
:root[data-theme="dark"] .tier.feature .lbl{color:var(--mute)}
:root[data-theme="dark"] .dk .tier.feature .btn-glass{background:#fff; color:#0F1720}
:root[data-theme="dark"] .specs4 th, :root[data-theme="dark"] .specs4 td{border-bottom-color:rgba(255,255,255,.1)}
:root[data-theme="dark"] .layers4 li{border-bottom-color:rgba(255,255,255,.12)}
:root[data-theme="dark"] .cf-ph, :root[data-theme="dark"] .cf-ph.contain, :root[data-theme="dark"] .cf-ph.typo{background:rgba(255,255,255,.06)}
:root[data-theme="dark"] .cf-spec, :root[data-theme="dark"] .cf-story, :root[data-theme="dark"] .svc-grid, :root[data-theme="dark"] .founder .name{border-top-color:rgba(255,255,255,.12)}
:root[data-theme="dark"] .legal{border-top-color:rgba(255,255,255,.1)}
:root[data-theme="dark"] .tl4::before{background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.3)}
:root[data-theme="dark"] .skip{background:#fff; color:#0F1720}
:root[data-theme="dark"] .status.ok{background:rgba(199,240,230,.18); color:#DFF7F0}
:root[data-theme="dark"] .status.err{background:rgba(246,200,224,.16); color:#FBE3EF}
/* dark glass objects: smoked, nearly black glass; light lives on the rims, in thin reflections and in colour pooled deep inside */
:root[data-theme="dark"] .stage4 .sphere{
  background:radial-gradient(circle at 34% 28%, rgba(255,255,255,.55) 0, rgba(255,255,255,.14) 9%, rgba(20,30,44,.55) 28%, rgba(10,16,26,.8) 60%, rgba(44,95,196,.35) 84%, rgba(176,110,34,.3) 100%);
  border-color:rgba(255,255,255,.55);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.14), inset -14px -18px 40px rgba(0,0,0,.65), inset 10px 12px 26px rgba(255,255,255,.08), inset -3px -3px 0 rgba(44,95,196,.7), inset 3px 3px 0 rgba(176,110,34,.55), 0 50px 60px -30px rgba(0,0,0,.9)}
:root[data-theme="dark"] .stage4 .sphere::before{background:radial-gradient(circle at 60% 70%, rgba(176,110,34,.55), rgba(154,74,120,.4) 30%, rgba(30,122,112,.35) 55%, rgba(44,95,196,.45) 75%, transparent 90%); opacity:.9}
:root[data-theme="dark"] .stage4 .sphere::after{background:radial-gradient(ellipse at center, rgba(255,255,255,.9), rgba(255,255,255,.35) 40%, transparent 72%); height:14%; width:30%}
:root[data-theme="dark"] .stage4 .arch{
  background:linear-gradient(105deg, rgba(255,255,255,.22), rgba(20,30,44,.55) 28%, rgba(10,16,26,.75) 55%, rgba(44,95,196,.22) 78%, rgba(10,16,26,.7));
  border-color:rgba(255,255,255,.5);
  box-shadow:inset 6px 0 14px rgba(255,255,255,.22), inset -12px 0 28px rgba(0,0,0,.7), inset 0 -2px 0 rgba(176,110,34,.7), inset 0 2px 0 rgba(255,255,255,.8), 0 54px 66px -32px rgba(0,0,0,.9)}
:root[data-theme="dark"] .stage4 .arch::before{background:linear-gradient(180deg, rgba(255,255,255,0), rgba(255,255,255,.7) 20%, rgba(255,255,255,.7) 60%, rgba(255,255,255,0)); opacity:.6; width:8%}
:root[data-theme="dark"] .stage4 .arch::after{background:linear-gradient(180deg, rgba(44,95,196,.9), rgba(30,122,112,.8), rgba(154,74,120,.9), rgba(176,110,34,.9)); opacity:.9; width:3%}
:root[data-theme="dark"] .stage4 .vial{
  background:linear-gradient(90deg, rgba(255,255,255,.1), rgba(255,255,255,.45) 28%, rgba(10,16,26,.7) 52%, rgba(255,255,255,.14) 80%, rgba(10,16,26,.7));
  border-color:rgba(255,255,255,.5); box-shadow:inset 0 1px 0 rgba(255,255,255,.8), inset 2px 0 0 rgba(255,255,255,.4), inset -2px 0 0 rgba(44,95,196,.6), 0 40px 50px -28px rgba(0,0,0,.9)}
:root[data-theme="dark"] .stage4 .vial::before{background:linear-gradient(180deg, rgba(176,110,34,.7), rgba(150,90,30,.95) 30%, rgba(90,52,16,1)); box-shadow:inset 0 3px 0 rgba(255,220,170,.55), 0 0 24px rgba(176,110,34,.55)}
:root[data-theme="dark"] .stage4 .caustic{mix-blend-mode:screen; opacity:.5; filter:blur(22px)}
:root[data-theme="dark"] .stage4 .caustic.sharp{opacity:.7; background:linear-gradient(90deg, #2C5FC4, #1E7A70, #9A4A78, #B06E22)}
:root[data-theme="dark"] .stage4 .floor{background:rgba(0,0,0,.7); filter:blur(18px)}
:root[data-theme="dark"] .gp .rod, :root[data-theme="dark"] .gp .disc{background:rgba(10,16,26,.55); border-color:rgba(255,255,255,.55);
  box-shadow:inset 0 .02em 0 rgba(255,255,255,.75), inset -.02em -.02em 0 rgba(44,95,196,.75), inset .02em .02em 0 rgba(176,110,34,.55), inset -.1em -.14em .3em rgba(0,0,0,.6), 0 .4em .7em -.3em rgba(0,0,0,.9)}
:root[data-theme="dark"] .gp .rod{background:linear-gradient(180deg, rgba(255,255,255,.14), rgba(10,16,26,.55) 30%, rgba(44,95,196,.3))}
:root[data-theme="dark"] .gp .disc{background:radial-gradient(circle at 34% 28%, rgba(255,255,255,.3), rgba(10,16,26,.5) 30%, rgba(10,16,26,.75) 60%, rgba(154,74,120,.4) 85%, rgba(176,110,34,.4))}
:root[data-theme="dark"] .gp .rod::after{background:rgba(255,255,255,.65)}
:root[data-theme="dark"] .gp .disc::after{border-top-color:rgba(255,255,255,.75); border-left-color:rgba(255,255,255,.3)}
:root[data-theme="dark"] .stage4 .gp .disc::before{background:radial-gradient(ellipse, rgba(255,255,255,.7), transparent 70%)}
:root[data-theme="dark"] .stage4 .gp{filter:drop-shadow(0 .6em 1em rgba(0,0,0,.7))}
:root[data-theme="dark"] .sweep{mix-blend-mode:screen; opacity:.18}
/* dark ground: deeper, moodier light */
:root[data-theme="dark"] .ground{background:
  radial-gradient(60% 55% at 88% -5%, rgba(44,95,196,.55), transparent 62%),
  radial-gradient(50% 45% at -8% 78%, rgba(176,110,34,.42), transparent 62%),
  radial-gradient(42% 38% at 58% 52%, rgba(154,74,120,.26), transparent 62%),
  radial-gradient(36% 36% at 100% 100%, rgba(30,122,112,.3), transparent 62%),
  linear-gradient(180deg,#151E2A,#0F161F 50%,#141C27)}
:root[data-theme="dark"] body{background:#111923}
:root[data-theme="dark"] .field{filter:blur(70px) saturate(120%)}
:root[data-theme="dark"] .founder .seal{background:rgba(255,255,255,.05)}
:root[data-theme="dark"] .spec{box-shadow:0 0 14px rgba(127,180,255,.8)}
:root[data-theme="dark"] .nav .links{color:var(--slate)}
:root[data-theme="dark"] .foot .brand, :root[data-theme="dark"] .foot .who b{color:var(--ink)}
:root[data-theme="dark"] :focus-visible{outline-color:#fff}

/* ---------- theme toggle icon ---------- */
.theme-t{position:relative; width:40px; height:40px; padding:0; border-radius:50%; border:1px solid rgba(255,255,255,.9); cursor:pointer; display:inline-grid; place-items:center; color:var(--ink);
  background:linear-gradient(180deg, rgba(255,255,255,.7), rgba(255,255,255,.35)); -webkit-backdrop-filter:blur(16px) saturate(160%); backdrop-filter:blur(16px) saturate(160%);
  box-shadow:inset 0 1px 0 #fff, inset 0 -6px 12px -8px rgba(127,180,255,.4), 0 10px 24px -14px rgba(25,50,90,.5); transition:transform var(--t1) var(--ease), box-shadow var(--t1), background var(--t2)}
.theme-t:hover{transform:translateY(-1px)}
.theme-t .ic{position:relative; width:20px; height:20px; display:block}
.theme-t svg{position:absolute; inset:0; width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; transition:transform .6s var(--ease), opacity .4s var(--ease)}
.theme-t .ic-sun{opacity:1; transform:rotate(0) scale(1)}
.theme-t .ic-sun .rays{transform-origin:12px 12px; animation:rays 24s linear infinite}
@keyframes rays{to{transform:rotate(360deg)}}
.theme-t .ic-moon{opacity:0; transform:rotate(-90deg) scale(.6); fill:currentColor; stroke:none}
:root[data-theme="dark"] .theme-t{color:#fff; border-color:rgba(255,255,255,.3); background:linear-gradient(155deg, rgba(255,255,255,.16), rgba(255,255,255,.05)); box-shadow:inset 0 1px 0 rgba(255,255,255,.4), inset -1px 0 0 rgba(44,95,196,.5), inset 1px 0 0 rgba(176,110,34,.4), 0 12px 28px -14px rgba(0,0,0,.8)}
:root[data-theme="dark"] .theme-t .ic-sun{opacity:0; transform:rotate(90deg) scale(.6)}
:root[data-theme="dark"] .theme-t .ic-moon{opacity:1; transform:rotate(0) scale(1)}
.mfoot .theme-t{justify-self:center}
@media (max-width:560px){ .nav .theme-t{display:inline-grid; width:38px; height:38px} }