/* Four whole-page directions on the same content, switched by html[data-v]. Each changes how the page is built,
   not its colour: A Editorial (type and white space), B Panels (the page as stacked sheets), C Atmosphere
   (soft light and tonal bands), D Contrast (light page, the product on dark bands). */

/* ============ A · Editorial ============ */
html[data-v="a"] .dsec + .dsec .wrap::before{display:none}
html[data-v="a"] .dsec{padding-block:168px 0}
html[data-v="a"] .shead{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,9fr);column-gap:40px;max-width:none;margin-bottom:72px}
html[data-v="a"] .shead .kick{grid-row:1 / 3;display:flex;flex-direction:column;align-items:flex-start;gap:14px;margin:0}
html[data-v="a"] .shead .kick em{font-size:96px;font-weight:300;letter-spacing:-.06em;line-height:.8;color:rgb(17 17 17 / .14);margin:0}
html[data-v="a"] .shead .kick em::after{display:none}
html[data-v="a"] .shead h2{font-size:52px!important;line-height:1.06}
html[data-v="a"] #team .wrap,html[data-v="a"] #security .wrap{display:block}
html[data-v="a"] #team .shead,html[data-v="a"] #security .shead{position:static;margin-bottom:72px}
html[data-v="a"] #team .roster,html[data-v="a"] #security .sect2{margin-left:calc(25% + 10px)}
html[data-v="a"] #team .aside{margin-left:calc(25% + 10px)}
html[data-v="a"] .wv{margin-left:0}
html[data-v="a"] .day:not(.hstage2),html[data-v="a"] .frame,html[data-v="a"] .flow{background:transparent!important;box-shadow:none!important}
html[data-v="a"] .wv-s{padding:24px 0 24px 24px}
html[data-v="a"] .mw{background:transparent!important;box-shadow:inset 0 1px 0 var(--line),inset 0 -1px 0 var(--line)!important}
html[data-v="a"] .sec.mist{background:#fff;margin-top:0;padding-block:168px 0}
html[data-v="a"] .sec.mist .proof{border-top:1px solid var(--line)!important;padding-top:72px}
html[data-v="a"] .proof blockquote{font-size:44px!important;line-height:1.18!important}
html[data-v="a"] .cta3{background:#fff;border-top:1px solid var(--line)}
html[data-v="a"] .cta3 .day{background:#fff!important;text-align:left;padding:160px 40px 168px!important;max-width:1280px;margin:0 auto}
html[data-v="a"] .cta3 .in{max-width:none}
html[data-v="a"] .cta3 h2{color:var(--ink)!important;font-size:88px!important;line-height:1;letter-spacing:-.045em!important;max-width:11em;margin:0}
html[data-v="a"] .cta3 p{color:var(--ink-2)!important;margin-left:0;font-size:19px}
html[data-v="a"] .cta3 .acts{justify-content:flex-start}
html[data-v="a"] .cta3 .btn-p{background:var(--ink);color:#fff}
html[data-v="a"] .cta3 .btn-s{color:var(--ink);border-color:#DADADA}
html[data-v="a"] footer{background:#fff!important;border-top:1px solid var(--line)!important;color:var(--ink-2)}
html[data-v="a"] footer h6,html[data-v="a"] footer .wordmark,html[data-v="a"] footer .wordmark span{color:var(--ink)!important}
html[data-v="a"] footer a{color:var(--ink-2)}html[data-v="a"] footer a:hover{color:var(--ink)}
html[data-v="a"] footer .say{color:var(--ink-2)}html[data-v="a"] footer .bot{border-color:var(--line)!important;color:var(--ink-3)}
@media (max-width:900px){html[data-v="a"] .shead{grid-template-columns:1fr}html[data-v="a"] .shead .kick em{font-size:56px}html[data-v="a"] .shead h2{font-size:34px!important}
  html[data-v="a"] #team .roster,html[data-v="a"] #security .sect2,html[data-v="a"] #team .aside{margin-left:0}html[data-v="a"] .cta3 h2{font-size:44px!important}html[data-v="a"] .cta3 .day{padding:96px 20px!important}}

/* ============ B · Panels ============ */
html[data-v="b"] body{background:#ECECEA}
html[data-v="b"] .draft{background:#ECECEA;border:0}
html[data-v="b"] .nav,html[data-v="b"] .nav.scrolled{background:rgb(236 236 234 / .9);border-bottom:0}
html[data-v="b"] main > *{background:#fff;margin:0 12px 12px;border-radius:24px;overflow:hidden}
html[data-v="b"] main > header{margin-top:4px}
html[data-v="b"] .dsec + .dsec .wrap::before,html[data-v="b"] .sec.mist + .dsec .wrap::before{display:none}
html[data-v="b"] .dsec{padding-block:112px!important}
html[data-v="b"] .sec.tight{padding-block:56px!important}
html[data-v="b"] .dhero{padding-bottom:12px}
html[data-v="b"] .hstage2{border-radius:16px 0 0 16px!important}
html[data-v="b"] .sec.mist{margin-top:0;padding-block:112px}
html[data-v="b"] .faqs{padding-block:112px}
html[data-v="b"] .faq{padding-bottom:0}
html[data-v="b"] .cta3{border-radius:24px}
html[data-v="b"] footer{margin:0 12px 12px;border-radius:24px;border-top:0!important}
html[data-v="b"] .mw{box-shadow:none!important}
@media (max-width:760px){html[data-v="b"] main > *{margin:0 6px 6px;border-radius:18px}html[data-v="b"] footer{margin:0 6px 6px;border-radius:18px}html[data-v="b"] .dsec{padding-block:72px!important}}

/* ============ C · Atmosphere ============ */
html[data-v="c"] .dhero{background:
  radial-gradient(45% 55% at 82% 8%,rgb(228 226 240 / .75),transparent 70%),
  radial-gradient(40% 50% at 8% 0%,rgb(241 233 222 / .8),transparent 70%),#fff}
html[data-v="c"] .dsec + .dsec .wrap::before,html[data-v="c"] .sec.mist + .dsec .wrap::before{display:none}
html[data-v="c"] .dsec{padding-block:136px!important}
html[data-v="c"] #month,html[data-v="c"] #connect{background:linear-gradient(180deg,#F6F6F4,#F3F3F1)}
html[data-v="c"] #month .mw{background:transparent!important;box-shadow:none!important;margin-inline:0;padding-inline:0!important}
html[data-v="c"] #connect .flow{background:#fff!important;box-shadow:0 0 0 1px rgb(20 22 50 / .05),0 30px 60px -40px rgb(20 22 50 / .25)!important}
html[data-v="c"] .day:not(.hstage2){background:linear-gradient(180deg,#F7F6F4,#F2F2F3)!important}
html[data-v="c"] .sec.mist{margin-top:0;padding-block:136px;background:
  radial-gradient(50% 80% at 15% 30%,rgb(238 230 220 / .9),transparent 70%),
  radial-gradient(45% 80% at 90% 80%,rgb(226 228 240 / .9),transparent 70%),#F8F8F7}
html[data-v="c"] .cta3{background:#fff}
html[data-v="c"] .cta3 .day{background:
  radial-gradient(40% 70% at 30% 100%,rgb(238 228 216 / .9),transparent 70%),
  radial-gradient(40% 70% at 75% 100%,rgb(226 226 242 / .9),transparent 70%),#fff!important}
html[data-v="c"] .cta3 h2{color:var(--ink)!important;font-size:64px!important}
html[data-v="c"] .cta3 p{color:var(--ink-2)!important}
html[data-v="c"] .cta3 .btn-p{background:var(--ink);color:#fff}
html[data-v="c"] .cta3 .btn-s{color:var(--ink);border-color:#D9D9D9;background:rgb(255 255 255 / .6)!important}
html[data-v="c"] footer{background:#F6F6F4!important;border-top:0!important;color:var(--ink-2)}
html[data-v="c"] footer h6,html[data-v="c"] footer .wordmark,html[data-v="c"] footer .wordmark span{color:var(--ink)!important}
html[data-v="c"] footer a{color:var(--ink-2)}html[data-v="c"] footer a:hover{color:var(--ink)}
html[data-v="c"] footer .say{color:var(--ink-2)}html[data-v="c"] footer .bot{border-color:#E6E6E3!important;color:var(--ink-3)}
@media (max-width:760px){html[data-v="c"] .dsec{padding-block:80px!important}html[data-v="c"] .cta3 h2{font-size:38px!important}}

/* ============ D · Contrast ============ */
html[data-v="d"] .dsec + .dsec .wrap::before,html[data-v="d"] .sec.mist + .dsec .wrap::before{display:none}
html[data-v="d"] .dsec{padding-block:128px!important}
html[data-v="d"] #work,html[data-v="d"] #connect{background:#0E0F11;color:#fff}
html[data-v="d"] #work .shead h2,html[data-v="d"] #connect .shead h2{color:#fff}
html[data-v="d"] #work .soft,html[data-v="d"] #connect .soft{color:rgb(255 255 255 / .45)!important}
html[data-v="d"] #work .kick,html[data-v="d"] #connect .kick{color:rgb(255 255 255 / .5)!important}
html[data-v="d"] #work .kick em,html[data-v="d"] #connect .kick em{color:rgb(255 255 255 / .3)}
html[data-v="d"] #work .kick em::after,html[data-v="d"] #connect .kick em::after{background:rgb(255 255 255 / .2)}
html[data-v="d"] .wv-tabs{border-color:rgb(255 255 255 / .12)}
html[data-v="d"] .wvt{color:rgb(255 255 255 / .5)}html[data-v="d"] .wvt:hover,html[data-v="d"] .wvt[aria-selected="true"]{color:#fff}
html[data-v="d"] .wvt[aria-selected="true"] i{background:linear-gradient(90deg,#fff var(--k,0%),rgb(255 255 255 / .15) var(--k,0%))}
html[data-v="d"] .wv-t h3{color:#fff}
html[data-v="d"] .wv-t p{color:rgb(255 255 255 / .6)}
html[data-v="d"] .wv-t ul,html[data-v="d"] .wv-t li{border-color:rgb(255 255 255 / .1)!important;color:#fff}
html[data-v="d"] .wv-t li::before{border-color:#fff!important}
html[data-v="d"] #work .lnk{color:#fff}
html[data-v="d"] #work .day,html[data-v="d"] #connect .flow{background:radial-gradient(80% 60% at 50% 0%,rgb(255 255 255 / .06),transparent 70%),#17181B!important;box-shadow:inset 0 0 0 1px rgb(255 255 255 / .06)!important}
html[data-v="d"] #work .aw,html[data-v="d"] #connect .core{box-shadow:0 0 0 1px rgb(255 255 255 / .08),0 40px 80px -30px rgb(0 0 0 / .8)!important}
html[data-v="d"] #connect .flow svg path:not(.wire){stroke:rgb(255 255 255 / .12)}
html[data-v="d"] #connect .flow .wire{stroke:#fff;stroke-opacity:.7}
html[data-v="d"] #connect .flow .chip{box-shadow:none!important}
html[data-v="d"] .sec.mist{margin-top:0}
@media (max-width:760px){html[data-v="d"] .dsec{padding-block:80px!important}}

/* review-only switcher */
.dirsw{position:fixed;left:50%;bottom:16px;transform:translateX(-50%);z-index:80;display:flex;align-items:center;gap:2px;padding:4px;border-radius:999px;background:rgb(20 20 22 / .92);backdrop-filter:blur(8px);font-size:12.5px;box-shadow:0 10px 30px -10px rgb(0 0 0 / .5)!important}
.dirsw span{padding:0 10px 0 12px;color:rgb(255 255 255 / .5)}
.dirsw button{all:unset;cursor:pointer;padding:7px 12px;border-radius:999px;color:rgb(255 255 255 / .75);white-space:nowrap}
.dirsw button:hover{color:#fff}
.dirsw button[aria-pressed="true"]{background:#fff;color:#111}
.dirsw button:focus-visible{outline:2px solid #fff;outline-offset:2px}
@media (max-width:600px){.dirsw span{display:none}.dirsw button{padding:7px 9px}.dirsw button em{display:none}}
.dirsw button em{font-style:normal;opacity:.6;margin-left:4px}
html[data-v="d"] #connect .chip,html[data-v="d"] #connect .core,html[data-v="d"] #work .aw{color:#18181B}