
:root{
  --paper:#FAFAF8; --ink:#17171A; --mute:#5F5F5B; --line:#E3E3DE; --soft:#F0F0EC; --accent:#2F5BD3;
  --serif:'Instrument Serif', Georgia, 'Times New Roman', serif;
  --sans:'Geist', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --hand:'Caveat', 'Comic Sans MS', cursive;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){ --paper:#141416; --ink:#EDEDEA; --mute:#A3A39E; --line:#2C2C2F; --soft:#1D1D20; --accent:#7EA0FF; }
}
:root[data-theme="dark"]{ --paper:#141416; --ink:#EDEDEA; --mute:#A3A39E; --line:#2C2C2F; --soft:#1D1D20; --accent:#7EA0FF; }
html{scroll-padding-top:env(safe-area-inset-top,0px)}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:17px;line-height:1.65;-webkit-font-smoothing:antialiased}
a{color:inherit}
a:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:6px}
img,svg{max-width:100%}
.wrap{max-width:1088px;margin:0 auto;padding:0 24px}
.text{max-width:640px}

/* header */
.top{display:flex;justify-content:space-between;align-items:baseline;gap:24px;padding:40px 0 0;flex-wrap:wrap}
.top .name{font-weight:500;text-decoration:none}
.top nav{display:flex;gap:24px;flex-wrap:wrap;font-size:16px}
.top nav a{text-decoration:none;color:var(--mute)}
.top nav a[aria-current="page"],.top nav a:hover{color:var(--ink)}

main{display:flex;flex-direction:column;gap:112px;padding:72px 0 64px}
main > .intro + .work{margin-top:-40px}
.intro h1.lead{font-family:var(--serif);font-size:clamp(32px,4.4vw,46px);line-height:1.16;letter-spacing:-0.01em;margin:0 0 24px}
.intro p.sub{margin:0;color:var(--mute)}
.now{display:inline-flex;align-items:center;gap:10px;font-size:15px;color:var(--mute);margin-bottom:28px}
.now i{width:8px;height:8px;border-radius:50%;background:#3BA56B;box-shadow:0 0 0 4px rgba(59,165,107,.15)}

.shead{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding-bottom:12px;border-bottom:1px solid var(--line);margin-bottom:32px;font-size:15px;color:var(--mute)}
.shead a{color:var(--accent);text-decoration:none}
.shead a:hover{text-decoration:underline}

/* project cards */
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:56px 40px}
.card{display:flex;flex-direction:column;gap:14px;text-decoration:none}
.card .meta{display:flex;justify-content:space-between;gap:12px;align-items:baseline}
.card .t{font-weight:500;font-size:19px}
.card .tag{font-size:14px;color:var(--mute)}
.card .d{color:var(--mute);margin-top:-8px;font-size:16px}
.card:hover .t{text-decoration:underline;text-underline-offset:4px}

.mock{position:relative;aspect-ratio:16/10;border-radius:16px;overflow:hidden;isolation:isolate;color:#1A1A1F;font-family:var(--sans)}
.card .mock{transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.card:hover .mock{transform:translateY(-4px)}

/* AI Edit mock */
.m-ai{background:#ECE8FB;display:grid;grid-template-columns:1.35fr 1fr;gap:4%;padding:6%}
.ai-scene{position:relative;border-radius:10px;overflow:hidden;box-shadow:0 1px 0 rgba(0,0,0,.04),0 8px 24px -12px rgba(40,30,90,.35)}
.ai-scene .sky,.ai-scene .gold{position:absolute;inset:0}
.ai-scene .sky{background:linear-gradient(#8DB8EE,#DDEBFB)}
.ai-scene .gold{background:linear-gradient(#F4A259,#FBD9A5);opacity:0;transition:opacity 1.2s ease}
.ai-scene .sun{position:absolute;width:18%;aspect-ratio:1;border-radius:50%;left:60%;top:22%;background:#FFF6D8;transition:top 1.2s ease,background 1.2s ease}
.ai-scene svg{position:absolute;left:0;right:0;bottom:0;width:100%;height:60%}
.ai-scene .h1{fill:#7FA77F;transition:fill 1.2s ease}.ai-scene .h2{fill:#557F5E;transition:fill 1.2s ease}
.m-ai.golden .gold{opacity:1}.m-ai.golden .sun{top:44%;background:#FFE3A8}
.m-ai.golden .h1{fill:#B78452}.m-ai.golden .h2{fill:#7E5638}
.ai-scene .badge{position:absolute;left:8px;top:8px;font-size:10px;background:rgba(255,255,255,.8);padding:2px 7px;border-radius:99px}
.ai-chat{background:#fff;border-radius:10px;padding:10px;display:flex;flex-direction:column;gap:8px;font-size:11px;box-shadow:0 8px 24px -14px rgba(40,30,90,.35)}
.ai-head{font-weight:600;font-size:11px;display:flex;align-items:center;gap:6px}
.ai-head::before{content:"";width:8px;height:8px;border-radius:3px;background:#7B61FF}
.ai-msg{align-self:flex-end;background:#7B61FF;color:#fff;padding:6px 9px;border-radius:10px 10px 3px 10px;min-height:26px;max-width:95%}
.ai-msg .caret{display:inline-block;width:1px;height:11px;background:#fff;margin-left:1px;vertical-align:-1px;animation:blink 1s steps(1) infinite}
.ai-reply{background:#F2F0FA;padding:6px 9px;border-radius:10px 10px 10px 3px;opacity:0;transform:translateY(4px);transition:.4s}
.m-ai.golden .ai-reply{opacity:1;transform:none}
.ai-chips{margin-top:auto;display:flex;flex-wrap:wrap;gap:4px}
.ai-chips span{border:1px solid #E1DDF2;border-radius:99px;padding:2px 7px;font-size:10px;color:#5A5670}
@keyframes blink{50%{opacity:0}}

/* Casting mock */
.m-cast{background:#FBE9DC;padding:6%;display:flex;gap:4%}
.cast-canvas{flex:1;display:grid;grid-template-columns:repeat(2,1fr);gap:6px;align-content:start;opacity:.55}
.cast-canvas b{aspect-ratio:16/10;border-radius:6px;background:#EBCDB6}
.cast-canvas b:nth-child(2n){background:#E4C1A5}
.cast-sheet{width:52%;background:#fff;border-radius:12px;padding:10px;display:flex;flex-direction:column;gap:8px;font-size:11px;box-shadow:-10px 10px 30px -18px rgba(120,60,20,.45);transform:translateX(12%);transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.card:hover .cast-sheet{transform:none}
.cast-tabs{display:flex;gap:4px;background:#F6EFEA;border-radius:8px;padding:3px}
.cast-tabs span{flex:1;text-align:center;padding:3px 0;border-radius:6px;color:#7A6456}
.cast-tabs span:first-child{background:#fff;color:#1A1A1F;font-weight:600}
.avatars{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.avatars i{aspect-ratio:1;border-radius:10px;background:linear-gradient(160deg,var(--a),var(--b));position:relative;transition:box-shadow .3s}
.avatars i::after{content:"";position:absolute;left:32%;top:24%;width:36%;aspect-ratio:1;border-radius:50%;background:rgba(255,255,255,.55);box-shadow:0 18px 0 6px rgba(255,255,255,.35)}
.card:hover .avatars i:nth-child(2){box-shadow:0 0 0 2px #fff,0 0 0 4px #E0703A}
.sheet-btn{margin-top:auto;background:#1A1A1F;color:#fff;text-align:center;border-radius:8px;padding:5px 0;font-weight:500}

/* Save flow mock */
.m-save{background:#E2F1E8;display:flex;align-items:center;justify-content:center;padding:5%}
.save-modal{width:78%;background:#fff;border-radius:14px;padding:5%;font-size:11.5px;display:flex;flex-direction:column;gap:9px;box-shadow:0 18px 40px -22px rgba(20,80,50,.5)}
.save-q{font-weight:600;font-size:13px}
.save-opts{display:flex;flex-direction:column;gap:5px}
.save-opts span{display:flex;align-items:center;gap:8px;border:1px solid #E4ECE7;border-radius:8px;padding:5px 8px;transition:.3s}
.save-opts span::before{content:"";width:9px;height:9px;border-radius:50%;border:1.5px solid #9BB5A5;transition:.3s}
.save-opts span.on{border-color:#2F8F5B;background:#F2FAF5}
.save-opts span.on::before{border-color:#2F8F5B;background:#2F8F5B;box-shadow:inset 0 0 0 2px #fff}
.save-offer{background:#1F4D36;color:#fff;border-radius:9px;padding:8px 10px;display:flex;justify-content:space-between;align-items:center;gap:8px}
.save-offer b{font-weight:500}
.save-offer em{font-style:normal;background:#fff;color:#1F4D36;border-radius:6px;padding:2px 8px;white-space:nowrap}

/* Music mock */
.m-music{background:#E1ECF9;padding:6%;display:grid;grid-template-columns:repeat(3,1fr);gap:4%;align-items:center}
.concept{background:#fff;border-radius:12px;padding:7%;display:flex;flex-direction:column;gap:7px;font-size:11px;box-shadow:0 12px 30px -20px rgba(20,50,110,.5);transition:transform .4s cubic-bezier(.2,.8,.2,1)}
.concept:nth-child(2){transform:translateY(-8%)}
.card:hover .concept:nth-child(2){transform:translateY(-12%) scale(1.03)}
.concept .cover{aspect-ratio:1;border-radius:8px;background:var(--g)}
.concept b{font-weight:600}
.concept small{color:#6A7285;font-size:10px}
.eq{display:flex;align-items:flex-end;gap:2px;height:14px}
.eq i{flex:1;background:#9DB3D6;border-radius:1px;height:30%;animation:eq 1s ease-in-out infinite alternate;animation-play-state:paused}
.eq i:nth-child(2){animation-delay:-.3s}.eq i:nth-child(3){animation-delay:-.6s}.eq i:nth-child(4){animation-delay:-.2s}.eq i:nth-child(5){animation-delay:-.8s}
.card:hover .eq i{animation-play-state:running}
@keyframes eq{to{height:100%}}

/* simple tiles */
.m-tile{padding:7%;display:flex;flex-direction:column;justify-content:space-between;background:var(--tint)}
.m-tile .big{font-family:var(--serif);font-size:clamp(26px,2.6vw,34px);line-height:1.05;color:#1A1A1F;max-width:80%}
.m-tile svg{align-self:flex-end;width:34%;height:auto}

/* lists */
.rows a,.rows div.row{display:flex;justify-content:space-between;gap:24px;padding:18px 0;border-bottom:1px solid var(--line);text-decoration:none;align-items:center}
.rows a:hover .rn{text-decoration:underline;text-underline-offset:4px}
.rows .rn{font-weight:500}
.rows .rd{color:var(--mute)}
.rows .rr{color:var(--mute);white-space:nowrap;font-size:15px}
.rows .lhs{display:flex;align-items:center;gap:16px}
.plant{width:34px;height:34px;flex:none}
.plant .leaf{transform-origin:17px 20px;transition:transform .8s cubic-bezier(.3,1.4,.5,1),fill .8s}
.rows a:hover .plant .l1{transform:rotate(38deg);fill:#B9A660}
.rows a:hover .plant .l2{transform:rotate(-38deg);fill:#B9A660}

/* phones */
.phones{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.phone{aspect-ratio:9/18.5;border-radius:30px;background:#fff;border:1px solid var(--line);padding:9px;box-shadow:0 20px 40px -30px rgba(0,0,0,.4)}
.screen{height:100%;border-radius:22px;overflow:hidden;position:relative;font-family:var(--sans);color:#1A1A1F;font-size:11px;display:flex;flex-direction:column}
.cap{font-size:14px;color:var(--mute);margin-top:10px}
.s-radio{background:#1D1B2E;color:#fff;align-items:center;justify-content:center;gap:14px}
.s-radio .freq{font-size:40px;font-weight:600;letter-spacing:-.02em}
.s-radio .dial{width:80%;height:34px;background:repeating-linear-gradient(90deg,rgba(255,255,255,.45) 0 1px,transparent 1px 8px);border-bottom:1px solid rgba(255,255,255,.3);position:relative}
.s-radio .dial::after{content:"";position:absolute;left:52%;top:-6px;bottom:-6px;width:2px;background:#FF7A59;border-radius:2px}
.s-radio .st{color:#B8B4D6}
.s-radio .play{width:48px;height:48px;border-radius:50%;background:#FF7A59;display:grid;place-items:center}
.s-wallet{background:#F4F6FB;padding:16px 12px;gap:10px}
.s-wallet .bal{background:linear-gradient(140deg,#2B3A8C,#5263D8);color:#fff;border-radius:14px;padding:14px}
.s-wallet .bal b{display:block;font-size:20px;font-weight:600;margin-top:4px}
.s-wallet .row2{display:flex;justify-content:space-between;background:#fff;border-radius:10px;padding:9px 10px}
.s-med{background:#FFF4EC;align-items:center;justify-content:center;gap:12px}
.s-med .ring{width:62%;aspect-ratio:1;border-radius:50%;background:conic-gradient(#F08A5D 0 72%,#F8DCCB 72% 100%);display:grid;place-items:center}
.s-med .ring span{width:80%;aspect-ratio:1;border-radius:50%;background:#FFF4EC;display:grid;place-items:center;text-align:center;line-height:1.2}
.s-med .ring b{font-size:22px;display:block}
.s-med .btn{background:#1A1A1F;color:#fff;border-radius:99px;padding:8px 22px}
.s-taxi{background:#E9EEF0}
.s-taxi .map{flex:1;background:
  linear-gradient(90deg,transparent 46%,#fff 46% 54%,transparent 54%),
  linear-gradient(0deg,transparent 30%,#fff 30% 36%,transparent 36%),
  linear-gradient(0deg,transparent 68%,#fff 68% 73%,transparent 73%),#E3EAE6;position:relative}
.s-taxi .map svg{position:absolute;inset:0;width:100%;height:100%}
.s-taxi .sheet{background:#fff;border-radius:16px 16px 0 0;padding:12px;display:flex;flex-direction:column;gap:6px}
.s-taxi .sheet b{font-size:14px}
.s-taxi .go{background:#F2C94C;border-radius:10px;padding:8px;text-align:center;font-weight:600}

/* web screens */
.webs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 24px}
.browser{aspect-ratio:16/10;border-radius:12px;border:1px solid var(--line);background:#fff;overflow:hidden;display:flex;flex-direction:column;color:#1A1A1F;font-size:11px}
.browser .bar{height:24px;background:#F1F1EE;display:flex;align-items:center;gap:5px;padding:0 10px}
.browser .bar i{width:7px;height:7px;border-radius:50%;background:#D7D7D2}
.dash{flex:1;display:grid;grid-template-columns:22% 1fr;}
.dash .side{background:#F7F7F5;padding:12px;display:flex;flex-direction:column;gap:8px;color:#6B6B66}
.dash .side b{color:#1A1A1F}
.dash .body{padding:14px;display:flex;flex-direction:column;gap:10px}
.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.kpis div{border:1px solid #EDEDE9;border-radius:8px;padding:8px}
.kpis b{display:block;font-size:15px}
.bars{flex:1;display:flex;align-items:flex-end;gap:6px;border:1px solid #EDEDE9;border-radius:8px;padding:10px}
.bars i{flex:1;background:#5B7BE9;border-radius:3px 3px 0 0;opacity:.85}
.land{flex:1;background:#0F2A22;color:#EAF5EF;display:grid;grid-template-columns:1.1fr 1fr;align-items:center;gap:6%;padding:6%}
.land h4{font-family:var(--serif);font-weight:400;font-size:26px;line-height:1.05;margin:0 0 8px}
.land .cta{display:inline-block;background:#C8F0D8;color:#0F2A22;border-radius:99px;padding:4px 12px;font-weight:600}
.land .cardx{background:#1E4436;border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:6px}
.land .cardx span{height:8px;border-radius:4px;background:#2F5E4C}

/* whiteboard */
.wb{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:48px;align-items:start}
.wb .pitch{font-family:var(--serif);font-size:32px;line-height:1.2;margin:0 0 16px}
.board{background:#fff;border:1px solid var(--line);border-radius:16px;padding:6px;box-shadow:0 20px 50px -36px rgba(0,0,0,.45)}
.board svg{display:block;width:100%;height:auto}
.eps{margin-top:24px}
.eps a{display:grid;grid-template-columns:120px minmax(0,1fr) auto;gap:18px;align-items:center;padding:12px 0;border-top:1px solid var(--line);text-decoration:none}
.eps a:last-child{border-bottom:1px solid var(--line)}
.eps .th{aspect-ratio:16/9;border-radius:8px;background:#fff;border:1px solid var(--line);overflow:hidden}
.eps .th svg{width:100%;height:100%;display:block}
.eps .n{font-size:13px;color:var(--mute);display:block}
.eps .et{font-weight:500}
.eps .du{color:var(--mute);font-size:14px;font-variant-numeric:tabular-nums}
.eps a:hover .et{text-decoration:underline;text-underline-offset:4px}

/* footer */
.foot{display:flex;flex-direction:column;gap:14px}
.foot .big{font-family:var(--serif);font-size:clamp(32px,4vw,40px);line-height:1.15;margin:0}
.foot p{margin:0;color:var(--mute)}
.foot p.big{color:var(--ink)}
.foot a{color:var(--accent)}
.ridge{display:block;width:100%;height:auto;margin-top:56px;color:var(--line)}
.fine{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:14px;color:var(--mute);padding:20px 0 48px;margin-top:48px;border-top:1px solid var(--line)}
.fine nav{display:flex;gap:20px}
.fine a{color:var(--mute)}

/* subpages */
.back{font-size:15px;color:var(--mute);text-decoration:none}
.back:hover{color:var(--ink)}
.ph h1{font-family:var(--serif);font-weight:400;font-size:clamp(40px,5vw,60px);line-height:1.06;letter-spacing:-.01em;margin:16px 0 20px}
.ph p{margin:0;color:var(--mute);font-size:19px}
.filters{display:flex;gap:8px;flex-wrap:wrap;padding-bottom:20px;border-bottom:1px solid var(--line);margin-bottom:40px}
.filters button{min-height:44px;padding:0 18px;border-radius:99px;border:1px solid var(--line);background:transparent;color:var(--ink);font:inherit;font-size:15px;cursor:pointer}
.filters button[aria-pressed="true"]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:48px 28px}
.facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;padding:22px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:15px}
.facts span{display:block;color:var(--mute);font-size:13px}
.sec{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,7fr);gap:48px}
.sec>.lab{font-size:15px;color:var(--mute);padding-top:4px}
.sec p{margin:0 0 16px}
.quote{font-family:var(--serif);font-size:30px;line-height:1.3}
.heard{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
.heard div{border-top:1px solid var(--line);padding-top:14px}
.steps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 40px;counter-reset:s}
.steps div{border-top:1px solid var(--line);padding-top:14px}
.steps b{display:block;font-weight:500;margin-bottom:4px}
.steps b::before{counter-increment:s;content:counter(s) ". ";color:var(--mute);font-weight:400}
.steps p{margin:0;color:var(--mute);font-size:16px}
.decs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px 32px}
.decs div{border-top:1px solid var(--line);padding-top:14px}
.decs b{display:block;font-weight:500;margin-bottom:4px}
.decs p{margin:0;color:var(--mute);font-size:16px}
.stats{display:flex;gap:56px;flex-wrap:wrap;margin-bottom:20px}
.stats b{display:block;font-family:var(--serif);font-weight:400;font-size:52px;line-height:1}
.stats span{color:var(--mute);font-size:15px}
.pill{display:inline-block;font-size:12px;border:1px solid var(--line);border-radius:99px;padding:1px 8px;color:var(--mute);vertical-align:middle}
.next{display:flex;justify-content:space-between;padding-top:22px;border-top:1px solid var(--line)}
.next a{text-decoration:none;color:var(--mute)}
.next a.go{color:var(--accent)}
.bigmock .mock{aspect-ratio:16/9;border-radius:20px}

/* Xalts mocks */
.m-connect{background:#E7ECF7;display:grid;grid-template-columns:34% 1fr;gap:4%;padding:5%}
.x-steps{background:#fff;border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:10px;font-size:12px}
.x-steps span{display:flex;align-items:center;gap:8px;color:#7A8094}
.x-steps span::before{content:"";width:14px;height:14px;border-radius:50%;border:1.5px solid #C5CBDA;flex:none}
.x-steps span.done{color:#1A1A1F}.x-steps span.done::before{background:#3E6BE0;border-color:#3E6BE0;box-shadow:inset 0 0 0 3px #fff}
.x-steps span.cur{color:#1A1A1F;font-weight:600}.x-steps span.cur::before{border-color:#3E6BE0}
.x-form{background:#fff;border-radius:12px;padding:6%;display:flex;flex-direction:column;gap:10px;font-size:12px}
.x-form h5{margin:0;font-size:16px;font-weight:600}
.x-form .hint{color:#6B7185}
.x-form .field{border:1.5px solid #3E6BE0;border-radius:8px;padding:8px 10px;font-family:ui-monospace,Menlo,monospace;letter-spacing:.06em;box-shadow:0 0 0 4px rgba(62,107,224,.12)}
.x-form ol{margin:0;padding-left:16px;color:#4F5568;display:flex;flex-direction:column;gap:3px}
.x-form .btn{align-self:flex-start;background:#1A1A1F;color:#fff;border-radius:8px;padding:6px 14px;font-weight:500;margin-top:auto}
.m-console{background:#F1F2F6;padding:4%;display:flex;flex-direction:column;gap:10px;font-size:12px}
.c-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.c-kpis div{background:#fff;border-radius:10px;padding:10px}
.c-kpis b{display:block;font-size:18px}
.c-tabs{display:flex;gap:16px;border-bottom:1px solid #DCDEE6;color:#6B7185}
.c-tabs span{padding-bottom:6px}.c-tabs span:first-child{color:#1A1A1F;font-weight:600;border-bottom:2px solid #3E6BE0}
.c-table{background:#fff;border-radius:10px;overflow:hidden}
.c-table div{display:grid;grid-template-columns:1fr 1fr 2fr 1fr;gap:8px;padding:8px 12px;border-bottom:1px solid #EEF0F4}
.c-table div:first-child{color:#6B7185;background:#FAFAFC}
.c-table code{font-family:ui-monospace,Menlo,monospace;font-size:11px}


/* real screenshots */
.phone .shot{display:block;width:100%;height:100%;object-fit:cover;object-position:top;border-radius:22px}
.phones.three{grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 32px}
.webshot{border-radius:12px;border:1px solid var(--line);overflow:hidden;background:#fff}
.webshot .bar{height:24px;background:#F1F1EE;display:flex;align-items:center;gap:5px;padding:0 10px}
.webshot .bar i{width:7px;height:7px;border-radius:50%;background:#D7D7D2}
.webshot img{display:block;width:100%;height:auto}
.zoom{all:unset;display:block;cursor:zoom-in;width:100%}
.zoom:focus-visible{outline:2px solid var(--accent);outline-offset:4px;border-radius:30px}
dialog.lb{border:0;padding:0;background:transparent;max-width:min(92vw,1200px);max-height:92vh}
dialog.lb::backdrop{background:rgba(10,10,12,.82)}
dialog.lb img{display:block;max-width:min(92vw,1200px);max-height:86vh;width:auto;height:auto;border-radius:14px}
dialog.lb form{text-align:center;margin-top:12px}
dialog.lb button{min-height:44px;padding:0 20px;border-radius:99px;border:1px solid rgba(255,255,255,.4);background:transparent;color:#fff;font:inherit;cursor:pointer}
@media (max-width: 820px){ .phones.three{grid-template-columns:repeat(2,minmax(0,1fr))} }

/* bookshelf footer */
.bookshelf{--shelf:#D4D2CC;margin-top:24px;padding-top:56px;border-top:1px solid var(--line)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .bookshelf{--shelf:#3A3A3E}}
:root[data-theme="dark"] .bookshelf{--shelf:#3A3A3E}
.bs-head{display:flex;justify-content:space-between;align-items:baseline;gap:16px;flex-wrap:wrap;max-width:640px}
.bs-head p{margin:0}
.bs-title{font-family:var(--serif);font-size:32px;line-height:1.2}
.bs-count{font-size:15px;color:var(--mute)}
.bs-scroll{overflow-x:auto;padding-top:28px;scrollbar-width:thin}
.bs-shelf{display:flex;align-items:flex-end;gap:3px;min-height:236px;border-bottom:3px solid var(--shelf);padding-left:4px;width:max-content}
.bs-spine{all:unset;cursor:pointer;box-sizing:border-box;position:relative;border-radius:2px 2px 0 0;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:12px 0 0;overflow:hidden;
  box-shadow:inset -3px 0 0 rgba(0,0,0,.14),inset 2px 0 0 rgba(255,255,255,.18),0 0 0 1px rgba(0,0,0,.08);transition:transform .25s cubic-bezier(.2,.8,.2,1)}
.bs-spine.lift,.bs-spine.drag{transform:translateY(-14px)}
.bs-spine:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.bs-t{writing-mode:vertical-rl;transform:rotate(180deg);font-size:11px;font-weight:600;letter-spacing:.2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bs-band{width:100%;height:14px;flex:none}
.bs-end{width:12px;height:60px;background:var(--shelf);border-radius:2px 2px 0 0;margin-left:10px}
.bs-detail{display:flex;gap:18px;align-items:flex-start;min-height:112px;margin-top:24px;max-width:600px}
.bs-detail p{margin:0}
.bs-cover{width:76px;height:104px;border-radius:3px 6px 6px 3px;flex:none;display:flex;flex-direction:column;justify-content:space-between;padding:9px 8px 0;overflow:hidden;box-shadow:inset 4px 0 0 rgba(0,0,0,.12),0 10px 20px -12px rgba(0,0,0,.45),0 0 0 1px rgba(0,0,0,.08);font-size:10px;font-weight:600;line-height:1.2}
.bs-cover i{display:block;height:12px;margin:0 -8px}
.bs-bt{font-size:17px;font-weight:500}
.bs-ba{margin-top:2px;font-size:14px;color:var(--mute)}
.bs-bn{margin-top:8px;font-size:15px;line-height:1.55;color:var(--mute)}
.bs-hint{font-size:15px;color:var(--mute)}
@media (prefers-reduced-motion:reduce){.bs-spine{transition:none}}

/* bento showcase for UI screens */
.bento{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.tile{position:relative;margin:0;background:var(--bg);border-radius:24px;overflow:hidden;display:flex;align-items:center;justify-content:center;padding:64px 40px;min-height:560px}
.tile.full{grid-column:1/-1}
.tile .stage{display:flex;gap:clamp(16px,4vw,56px);align-items:center;justify-content:center;width:100%}
.tile figcaption{position:absolute;left:18px;top:18px;font-size:13px;line-height:1;padding:8px 12px;border-radius:99px;background:rgba(255,255,255,.78);color:#1A1A1F;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.device{position:relative;display:block;width:clamp(120px,19vw,250px);border:clamp(5px,.8vw,10px) solid #0E0E10;border-radius:clamp(22px,3.4vw,44px);background:#0E0E10;box-shadow:0 30px 60px -30px rgba(0,0,0,.45)}
.device img{display:block;width:100%;height:auto;border-radius:clamp(17px,2.7vw,34px)}
.device::after{content:"";position:absolute;top:clamp(5px,.9vw,11px);left:50%;transform:translateX(-50%);width:30%;height:clamp(9px,1.3vw,17px);border-radius:99px;background:#0E0E10}
.tile:not(.full) .device{width:clamp(140px,22vw,280px)}
.webcard{display:block;width:88%;border-radius:16px;overflow:hidden;background:#fff;box-shadow:0 30px 60px -30px rgba(0,0,0,.45)}
.tile:not(.full) .webcard{width:100%}
.webcard img{display:block;width:100%;height:auto}
.tile .zoom{width:auto;transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.tile .zoom.webcard{width:88%}
.tile:not(.full) .zoom.webcard{width:100%}
.tile .zoom:hover{transform:translateY(-6px)}
.tile .zoom:focus-visible{outline:3px solid #fff;outline-offset:6px;border-radius:44px}
@media (max-width: 820px){
  .bento{grid-template-columns:1fr}
  .tile{min-height:0;padding:56px 20px 32px}
  .tile .device{width:24vw}
  .tile.full .stage{gap:10px}
  .tile:not(.full) .device{width:52vw}
}

/* Atlabs work tiles (cursor-labelled) */
:root{--tile:#F2F2F0}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--tile:#1E1E21}}
:root[data-theme="dark"]{--tile:#1E1E21}
.wgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.wgrid.one{grid-template-columns:1fr}
.wtile{position:relative;display:grid;place-items:center;aspect-ratio:5/4;background:var(--tile);border-radius:24px;text-decoration:none;overflow:hidden}
.wtile .mock{width:80%;border-radius:18px;box-shadow:0 30px 60px -34px rgba(0,0,0,.4)}
.wgrid.one .wtile{aspect-ratio:16/9}
.wgrid.one .wtile .mock{width:62%}
.wtile:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.tlabel{display:none;position:absolute;left:16px;bottom:16px;color:#fff;border-radius:99px;padding:8px 14px;font-size:15px;font-weight:500;line-height:1.2}
.wtile:focus-visible .tlabel{display:block}
@media (hover:none){.tlabel{display:block}}
#cursor-label{position:fixed;left:0;top:0;z-index:60;pointer-events:none;color:#fff;border-radius:99px;padding:12px 22px;font-size:19px;font-weight:500;line-height:1.1;white-space:nowrap;opacity:0;transition:opacity .18s ease,background-color .18s ease;will-change:transform}
#cursor-label.on{opacity:1}
@media (hover:none){#cursor-label{display:none}}
.wbar{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:28px;flex-wrap:wrap}
.wtabs{display:flex;gap:28px;flex-wrap:wrap;font-family:'Geist Mono',ui-monospace,Menlo,monospace;font-size:20px}
.wtabs button,.wview button{all:unset;cursor:pointer;min-height:44px;display:inline-flex;align-items:center}
.wtabs button{color:var(--mute)}
.wtabs button[aria-pressed="true"],.wtabs button:hover{color:var(--ink)}
.wtabs button:focus-visible,.wview button:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}
.wview{display:flex;gap:6px}
.wview button{width:44px;justify-content:center;color:var(--line)}
.wview button[aria-pressed="true"]{color:var(--ink)}
@media (max-width: 820px){ .wgrid{grid-template-columns:1fr} .wgrid .wtile,.wgrid.one .wtile{aspect-ratio:5/4} .wgrid .wtile .mock{width:84%} .wview{display:none} .wtabs{font-size:17px;gap:18px} }

/* On X */
.onx h2{font-family:var(--serif);font-weight:400;font-size:clamp(44px,6vw,72px);line-height:1;letter-spacing:-.02em;margin:0 0 32px}
.onx .shead a{display:inline-flex;gap:6px;align-items:center}
.xwrap{background:var(--tile);border-radius:24px;padding:16px;position:relative}
.xtrack{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:2px}
.xtrack::-webkit-scrollbar{display:none}
.xpost{flex:0 0 min(440px,84%);scroll-snap-align:start;background:#fff;color:#0F1419;border-radius:18px;border:1px solid #E7E9EA;display:flex;flex-direction:column;overflow:hidden;text-decoration:none}
.xhead{display:flex;gap:12px;align-items:center;padding:16px 16px 0}
.xav{width:44px;height:44px;border-radius:50%;background:linear-gradient(140deg,#6A4FF0,#E0703A);color:#fff;display:grid;place-items:center;font-weight:600;flex:none}
.xname{font-weight:600;font-size:15px;line-height:1.2;display:block}
.xhandle{color:#536471;font-size:14px}
.xlogo{margin-left:auto;width:18px;height:18px;flex:none}
.xtext{padding:12px 16px 14px;font-size:16px;line-height:1.45;white-space:pre-line}
.xmedia{margin:0 16px;border-radius:14px;overflow:hidden;border:1px solid #E7E9EA}
.xmedia .mock{border-radius:0}
.xmedia .board{border:0;border-radius:0;padding:0;box-shadow:none}
.xmedia img{display:block;width:100%;height:auto}
.xfoot{display:flex;justify-content:space-between;align-items:center;padding:12px 16px 16px;color:#536471;font-size:14px;margin-top:auto}
.xfoot span{color:#1D9BF0}
.xpost:hover .xfoot span{text-decoration:underline}
.xpost:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.xnav{display:flex;gap:8px;justify-content:flex-end;margin-top:14px}
.xnav button{width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:var(--paper);color:var(--ink);cursor:pointer;display:grid;place-items:center}
.xnav button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.wordmark{aspect-ratio:1;display:grid;place-items:center;animation:wm 7.5s steps(1) infinite}
.wordmark b{font-family:var(--sans);font-weight:600;font-size:clamp(56px,9vw,96px);letter-spacing:-.04em;color:#fff;line-height:1}
.wordmark b i{display:inline-block;font-style:normal;transform:scaleX(-1)}
@keyframes wm{0%{background:#5B2A4E}20%{background:#7C86E8}40%{background:#F07A2E}60%{background:#F4DD8A}80%{background:#8A4FD8}}
.wordmark{background:#5B2A4E}
@keyframes wmink{0%,59%{color:#fff}60%{color:#3B3217}80%,100%{color:#fff}}
.wordmark b{animation:wmink 7.5s steps(1) infinite}

/* theme toggle */
.top nav{align-items:center}
.theme-btn{all:unset;box-sizing:border-box;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;cursor:pointer;color:var(--ink);margin-right:-10px;transition:background-color .2s}
.theme-btn:hover{background:var(--soft)}
.theme-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.theme-btn svg{width:22px;height:22px;overflow:visible}
.theme-btn .core{transform-box:fill-box;transform-origin:center;transition:transform .5s cubic-bezier(.34,1.56,.64,1)}
.theme-btn .bite{transform-box:fill-box;transform-origin:center;transition:transform .5s cubic-bezier(.65,0,.35,1)}
.theme-btn .rays{transform-box:fill-box;transform-origin:center;transition:transform .5s cubic-bezier(.65,0,.35,1),opacity .3s}
:root[data-theme="dark"] .theme-btn .core{transform:scale(1.55)}
:root[data-theme="dark"] .theme-btn .bite{transform:translate(-9px,7px)}
:root[data-theme="dark"] .theme-btn .rays{transform:rotate(90deg) scale(.4);opacity:0}
::view-transition-old(root),::view-transition-new(root){animation:none;mix-blend-mode:normal}
::view-transition-new(root){z-index:2;will-change:clip-path}
@media (prefers-reduced-motion: reduce){.theme-btn *{transition:none !important}}

/* On GitHub */
.ongh h2{font-family:var(--serif);font-weight:400;font-size:clamp(44px,6vw,72px);line-height:1;letter-spacing:-.02em;margin:0 0 32px}
:root{--g0:#EDEDEA;--g1:#ACE6AE;--g2:#6CC675;--g3:#3D8D4A;--g4:#2B6135}
:root[data-theme="dark"]{--g0:#232327;--g1:#1F4D2B;--g2:#2E7A3E;--g3:#48A45A;--g4:#7FD88C}
.gh-scroll{overflow-x:auto;padding-bottom:4px}
.gh{display:inline-grid;grid-template-rows:auto repeat(7,var(--cell));grid-auto-flow:column;grid-auto-columns:var(--cell);gap:6px;--cell:clamp(18px,3.6vw,40px)}
.gh .m{font-size:14px;color:var(--mute);height:24px;white-space:nowrap}
.gh i{display:block;border-radius:6px;background:var(--g0);cursor:pointer;transition:transform .15s}
.gh i[data-l="1"]{background:var(--g1)}.gh i[data-l="2"]{background:var(--g2)}.gh i[data-l="3"]{background:var(--g3)}.gh i[data-l="4"]{background:var(--g4)}
.gh i:hover,.gh i.sel{transform:scale(1.15);box-shadow:0 0 0 2px var(--paper),0 0 0 3.5px var(--ink)}
.gh i.pad{visibility:hidden}
.gh-foot{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-top:18px;font-size:15px;color:var(--mute)}
.gh-read{color:var(--ink)}
.gh-legend{display:flex;align-items:center;gap:6px}
.gh-legend b{width:14px;height:14px;border-radius:4px;display:inline-block}

/* Elsewhere cards */
.elsew{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.ecard{background:var(--tile);border-radius:24px;padding:24px;display:flex;flex-direction:column;gap:18px;min-height:320px}
.ecard .vis{flex:1;display:grid;place-items:center}
.ecard .vis svg{width:100%;max-width:260px;height:auto;overflow:visible}
.ecard b{display:block;font-weight:500}
.ecard span.sub{color:var(--mute);font-size:15px}
.ecard a{color:var(--accent)}
.lift{transition:transform .6s cubic-bezier(.34,1.56,.64,1)}
.ecard:hover .lift{transform:translateY(-34px)}
.sun{transition:transform 1.2s cubic-bezier(.2,.8,.2,1)}
.ecard:hover .sun{transform:translateY(-46px)}
.ecard .gh{--cell:14px;gap:4px}
.ecard .gh i{border-radius:3px}
.ecard .gh i[data-l="0"]{background:#E2E2DE}
:root[data-theme="dark"] .ecard .gh i[data-l="0"]{background:#2E2E33}
.ecard .gh .m{font-size:12px;height:18px}
.ecard .gh i:hover,.ecard .gh i.sel{transform:scale(1.25);box-shadow:0 0 0 1.5px var(--paper),0 0 0 3px var(--ink)}
.elsew-more{margin:20px 0 0;color:var(--mute)}
.elsew-more a{color:var(--accent)}
@media (max-width: 820px){ .elsew{grid-template-columns:1fr} .ecard{min-height:260px} }

.tile .case{position:absolute;right:18px;top:18px;font-size:13px;font-weight:600;line-height:1;padding:8px 12px;border-radius:99px;background:#fff;color:#17171A;text-decoration:none;box-shadow:0 4px 14px -6px rgba(0,0,0,.35)}
.tile .case:hover{text-decoration:underline}
.tile:not(.full):has(.webcard){min-height:420px}
.tile .case:focus-visible{outline:2px solid #fff;outline-offset:2px}
.tile figcaption b{font-weight:600}

/* composed mockups */
.tile.comp-tile{padding:72px 36px 40px}
.comp{position:relative;width:100%}
.pc{all:unset;cursor:zoom-in;position:absolute;display:block;transform:translate(var(--tx,0),var(--ty,0)) rotate(var(--r,0deg));transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.tile:hover .pc{transform:translate(var(--hx,var(--tx,0)),var(--hy,var(--ty,0))) rotate(var(--hr,var(--r,0deg)))}
.pc:focus-visible{outline:3px solid #fff;outline-offset:4px;border-radius:14px}
.pc .shot-web{display:block;width:100%;height:auto;border-radius:10px;box-shadow:0 30px 60px -28px rgba(0,0,0,.55),0 0 0 1px rgba(0,0,0,.06)}
.tile .comp .pc .device{width:100%}
.comp-x{aspect-ratio:16/10;max-width:980px}
.comp-c{aspect-ratio:1/1.06}
.comp-f{aspect-ratio:1/1}
.comp-a{aspect-ratio:16/9;max-width:980px}
.comp-p{aspect-ratio:1/1.08}
@media (max-width: 820px){ .tile.comp-tile{padding:64px 18px 28px} }
@media (max-width: 600px){ .tile figcaption .cl{display:none} }

/* polished comps */
.pc{container-type:inline-size}
.tile .comp .pc .device{width:100%;border:2.6cqw solid #0E0E10;border-radius:13cqw;background:#0E0E10;box-shadow:0 1px 0 rgba(255,255,255,.25) inset,0 40px 70px -30px rgba(0,20,60,.55)}
.tile .comp .pc .device::after{display:none}
.tile .comp .pc .device img{border-radius:10.4cqw}
.comp-c .pc.side .device{box-shadow:0 30px 50px -30px rgba(0,20,60,.45)}
.comp-c .pc.side{filter:saturate(.95)}
.pc .shot-web{border-radius:12px;box-shadow:0 1px 0 rgba(255,255,255,.4) inset,0 30px 60px -26px rgba(20,10,60,.6),0 0 0 1px rgba(0,0,0,.05)}

/* tighter save mock inside tiles */
.wtile .save-modal{font-size:10.5px;gap:6px;padding:4% 5%;width:74%}
.wtile .save-q{font-size:12px}
.wtile .save-opts{gap:4px}
.wtile .save-opts span{padding:4px 8px}
.wtile .save-offer{padding:6px 9px}


/* scroll-spy section nav */
.snav{position:relative;display:flex;gap:28px;overflow-x:auto;scrollbar-width:none;font-family:'Geist Mono',ui-monospace,Menlo,monospace;font-size:17px}
.snav::-webkit-scrollbar{display:none}
.snav a{white-space:nowrap;padding:18px 0 16px;color:var(--mute);text-decoration:none;transition:color .2s}
.snav a:hover,.snav a[aria-current="true"]{color:var(--ink)}
.snav a:focus-visible{outline:2px solid var(--accent);outline-offset:-2px;border-radius:4px}
.snav .ind{position:absolute;bottom:0;left:0;height:2px;background:var(--ink);width:0;transition:transform .45s cubic-bezier(.2,.8,.2,1),width .45s cubic-bezier(.2,.8,.2,1)}
.wsec{padding-top:40px;scroll-margin-top:60px}
.wsec + .wsec{margin-top:88px}
.wsec h2{font-family:var(--serif);font-weight:400;font-size:clamp(34px,4.6vw,52px);line-height:1.05;letter-spacing:-.01em;margin:0 0 10px}
@media (max-width: 820px){ .snav{font-size:15px;gap:20px} }
/* up next */
.upnext{all:unset;box-sizing:border-box;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:24px;width:100%;margin-top:72px;padding:28px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.upnext small{display:block;font-size:15px;color:var(--mute);margin-bottom:6px}
.upnext strong{font-family:var(--serif);font-weight:400;font-size:clamp(32px,4.4vw,48px);line-height:1.05;letter-spacing:-.01em}
.upnext .arw{flex:none;width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:var(--ink);color:var(--paper);transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.upnext:hover .arw{transform:translateX(6px)}
.upnext:hover strong{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:6px}
.upnext:focus-visible{outline:2px solid var(--accent);outline-offset:4px;border-radius:6px}

/* next-section card */
.nextcard{all:unset;box-sizing:border-box;cursor:pointer;margin-top:72px;width:100%;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:32px;padding:36px 40px;border-radius:28px;background:var(--tile);position:relative;overflow:hidden;transition:background-color .3s}
.nextcard:hover{background:var(--soft)}
:root[data-theme="light"] .nextcard:hover{background:#ECECE8}
.nextcard:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.nc-top{display:flex;align-items:center;gap:12px;font-size:14px;color:var(--mute);margin-bottom:14px}
.nc-dots{display:flex;gap:5px}
.nc-dots .d{display:block;width:6px;height:6px;flex:none;border-radius:50%;background:var(--line)}
.nc-dots .d.done{background:var(--mute)}
.nc-dots .d.cur{background:var(--ink);width:18px;border-radius:99px}
.nc-title{display:block;font-family:var(--serif);font-size:clamp(36px,5vw,60px);line-height:1;letter-spacing:-.015em;color:var(--ink)}
.nc-desc{display:block;margin-top:12px;color:var(--mute);font-size:16px;max-width:36ch}
.nc-go{display:inline-flex;align-items:center;gap:10px;margin-top:24px;padding:12px 18px 12px 20px;border-radius:99px;background:var(--ink);color:var(--paper);font-size:15px;font-weight:500}
.nc-go svg{transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.nextcard:hover .nc-go svg{transform:translateX(4px)}
.nc-prev{position:relative;height:230px}
.nc-prev .pv{position:absolute;top:50%;left:50%;width:46%;border-radius:12px;overflow:hidden;background:#fff;box-shadow:0 24px 40px -22px rgba(0,0,0,.45),0 0 0 1px rgba(0,0,0,.06);transition:transform .55s cubic-bezier(.2,.8,.2,1)}
.nc-prev .pv img{display:block;width:100%;height:auto}
.nc-prev .pv.tall{width:26%}
.nc-prev .pv:nth-child(1){transform:translate(-105%,-50%) rotate(-8deg)}
.nc-prev .pv:nth-child(2){transform:translate(-50%,-55%);z-index:2}
.nc-prev .pv:nth-child(3){transform:translate(5%,-50%) rotate(8deg)}
.nextcard:hover .nc-prev .pv:nth-child(1){transform:translate(-120%,-54%) rotate(-12deg)}
.nextcard:hover .nc-prev .pv:nth-child(2){transform:translate(-50%,-62%) scale(1.04)}
.nextcard:hover .nc-prev .pv:nth-child(3){transform:translate(20%,-54%) rotate(12deg)}
.nc-prev .solo{position:absolute;inset:0;display:grid;place-items:center}
.nc-prev .solo > *{width:70%;max-width:320px;border-radius:14px;overflow:hidden;box-shadow:0 24px 40px -22px rgba(0,0,0,.45);transition:transform .55s cubic-bezier(.2,.8,.2,1)}
.nc-prev .wordmark b{font-size:44px}
.nextcard:hover .nc-prev .solo > *{transform:translateY(-6px) rotate(-2deg)}
@media (max-width: 820px){ .nextcard{grid-template-columns:1fr;padding:28px 24px} .nc-prev{height:190px;order:-1} }

/* real Atlabs shots in tiles */
.mock.m-shot{aspect-ratio:auto;background:#fff}
.mock.m-shot img{display:block;width:100%;height:auto}
.wtile .mock.m-shot{width:84%;border-radius:12px;box-shadow:0 1px 0 rgba(255,255,255,.5) inset,0 30px 60px -30px rgba(0,0,0,.45),0 0 0 1px rgba(0,0,0,.06)}
.wtile .mock.m-shot.port{width:44%}
.wgrid .wtile.span2{grid-column:1/-1;aspect-ratio:16/8}
.wgrid .wtile.span2 .mock.m-shot{width:70%}
.bigmock .mock.m-shot{aspect-ratio:auto;border-radius:16px;box-shadow:0 30px 60px -30px rgba(0,0,0,.4),0 0 0 1px var(--line)}
.bigmock .mock.m-shot.port{max-width:440px;margin:0 auto}
@media (max-width: 820px){ .wgrid .wtile.span2{aspect-ratio:5/4} .wgrid .wtile.span2 .mock.m-shot{width:84%} }

/* combined footer */
.site-foot{margin:24px 0 40px;background:var(--tile);border-radius:28px;padding:48px 48px 24px}
.sf-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:56px;align-items:start}
.sf-big{font-family:var(--serif);font-size:clamp(34px,4vw,46px);line-height:1.08;letter-spacing:-.01em;margin:0 0 14px}
.sf-sub{margin:0 0 28px;color:var(--mute)}
.sf-btns{display:flex;gap:10px;flex-wrap:wrap}
.sf-btn{display:inline-flex;align-items:center;min-height:44px;padding:0 20px;border-radius:99px;border:1px solid var(--line);background:var(--paper);color:var(--ink);text-decoration:none;font-size:15px;font-weight:500}
.sf-btn.primary{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.sf-btn:hover{transform:translateY(-1px)}
.sf-btn:focus-visible,.sf-bottom a:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.site-foot .bookshelf{margin:0;padding:0;border:0}
.site-foot .bs-title{font-family:var(--sans);font-size:15px;font-weight:500;line-height:1.4}
.site-foot .bs-scroll{padding-top:22px}
.site-foot .bs-shelf{min-height:224px}
.site-foot .bs-detail{min-height:104px;margin-top:20px}
.sf-bottom{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-top:40px;padding-top:20px;border-top:1px solid var(--line);font-size:14px;color:var(--mute)}
.sf-bottom nav{display:flex;gap:20px}
.sf-bottom a{color:var(--mute);text-decoration:none}
.sf-bottom a:hover{color:var(--ink)}
@media (max-width: 820px){ .site-foot{padding:32px 22px 20px;border-radius:22px} .sf-grid{grid-template-columns:minmax(0,1fr);gap:40px} }
.site-foot{width:100vw;margin:48px 0 0 calc(50% - 50vw);border-radius:32px 32px 0 0;padding:64px max(24px,calc((100vw - 1040px)/2)) 28px}
.sf-grid{grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:72px;align-items:center}
.sf-grid .bookshelf{order:-1}
.sf-big{margin-bottom:28px !important}
.sf-btn{min-height:56px;padding:0 28px;font-size:17px}
@media (max-width: 820px){ .site-foot{padding:40px 24px 24px;border-radius:24px 24px 0 0} .sf-grid{grid-template-columns:minmax(0,1fr);gap:48px} .sf-grid .bookshelf{order:0} .sf-btn{flex:1 1 auto;justify-content:center} }
/* big sections below tabs */
.bigsec h2{font-family:var(--serif);font-weight:400;font-size:clamp(44px,6vw,72px);line-height:1;letter-spacing:-.02em;margin:0 0 32px}

/* about */
.ph .ab-lead{color:var(--ink);font-family:var(--serif);font-size:clamp(28px,3.4vw,38px);line-height:1.22;letter-spacing:-.005em;margin:0;max-width:760px}
.ab-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:36px 48px}
.ab-grid div{border-top:1px solid var(--line);padding-top:16px}
.ab-grid b{display:block;font-weight:500;font-size:19px;margin-bottom:6px}
.ab-grid p{margin:0;color:var(--mute);font-size:16px}
.ab-list{max-width:760px}
.ab-list div{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,5fr);gap:24px;padding:16px 0;border-bottom:1px solid var(--line)}
.ab-list div:first-child{border-top:1px solid var(--line)}
.ab-list span{color:var(--mute)}
.ab-pills{display:flex;flex-wrap:wrap;gap:10px}
.ab-pills span{border:1px solid var(--line);border-radius:99px;padding:8px 16px;font-size:15px}
.ab-quote{font-family:var(--serif);font-size:clamp(26px,3vw,34px);line-height:1.25;margin:0 0 10px}
@media (max-width: 820px){ .ab-grid{grid-template-columns:1fr} .ab-list div{grid-template-columns:1fr;gap:2px} }
/* about photos */
:root{--frame:#FFFFFF}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--frame:#26262A}}
:root[data-theme="dark"]{--frame:#26262A}
.ab-open{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,260px);gap:56px;align-items:center}
.ab-open .ab-lead{max-width:none}
.ab-portrait{margin:0}
.ab-portrait img,.ab-award img{display:block;width:100%;height:auto;border-radius:18px;box-shadow:0 24px 48px -28px rgba(0,0,0,.45);transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.ab-portrait img{aspect-ratio:579/700;object-fit:cover;transform:rotate(2.5deg)}
.ab-portrait .zoom:hover img{transform:rotate(0deg) translateY(-4px)}
.ab-portrait figcaption,.snap figcaption,.ab-award figcaption{font-family:var(--hand);font-size:22px;line-height:1.15;color:var(--mute)}
.ab-portrait figcaption{text-align:center;margin-top:14px}
.ab-strip{display:flex;align-items:flex-start;padding:28px 24px 20px;margin:-28px -24px -20px;overflow-x:auto;scrollbar-width:none;scroll-snap-type:x proximity}
.ab-strip::-webkit-scrollbar{display:none}
.snap{flex:0 0 clamp(210px,26%,280px);margin:0 -6px;scroll-snap-align:center;position:relative;z-index:1;transform:rotate(var(--r)) translateY(var(--y,0));transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.snap:hover,.snap:focus-within{transform:rotate(0deg) translateY(-8px);z-index:2}
.snap .zoom{box-sizing:border-box;background:var(--frame);padding:10px 10px 0;border-radius:6px;box-shadow:0 1px 0 rgba(0,0,0,.04),0 22px 44px -26px rgba(0,0,0,.5)}
.snap img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:2px}
.snap figcaption{padding:8px 4px 10px;text-align:center}
.ab-rec{display:grid;grid-template-columns:minmax(0,200px) minmax(0,1fr);gap:40px;align-items:center}
.ab-award{margin:0}
.ab-award img{aspect-ratio:4/5;object-fit:cover;object-position:50% 58%;transform:rotate(-2.5deg)}
.ab-award .zoom:hover img{transform:rotate(0deg) translateY(-4px)}
.ab-award figcaption{margin-top:14px;text-align:center;white-space:nowrap}
.ab-rec .ab-pills span:first-child{border-color:var(--ink)}
@media (max-width: 820px){
  .ab-open{grid-template-columns:1fr;gap:40px}
  .ab-portrait{max-width:240px}
  .snap{flex-basis:220px}
  .ab-rec{grid-template-columns:1fr;gap:32px}
  .ab-award{max-width:200px}
}
img{transition:filter .3s}
img[src*='#']{filter:blur(8px)}
/* footer v3: big hover CTAs, reorderable shelf */
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.bs-reset{all:unset;cursor:pointer;font-size:14px;color:var(--accent)}
.bs-reset[hidden]{display:none}
.bs-reset:hover{text-decoration:underline}
.bs-reset:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}
.bs-spine{touch-action:pan-x;-webkit-user-select:none;user-select:none}
.bs-shelf.dragging .bs-spine{cursor:grabbing}
.bs-spine.drag{z-index:3;transition:none !important;box-shadow:0 18px 30px -12px rgba(0,0,0,.45);cursor:grabbing}
@media (hover:hover){.bs-spine{cursor:grab}}
.bs-cover{width:88px;height:122px;padding:10px 9px 0;font-size:11px}
.bs-cover .cv-t{display:block}
.bs-cover .cv-a{display:block;margin-top:auto;padding-bottom:8px;font-size:9px;font-weight:500;opacity:.8;letter-spacing:.02em}
.bs-cover i{margin:0 -9px}
.bs-bn{margin-top:2px !important;font-size:16px}
:root{--on-accent:#fff}
:root[data-theme="dark"]{--on-accent:#0E1530}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--on-accent:#0E1530}}
.sf-btn.alt{background:var(--paper)}
.sf-fill{display:none}
@media (hover:hover) and (min-width: 821px){
  .site-foot{position:relative;isolation:isolate}
  .sf-btn{position:relative;z-index:3;transition:background-color .2s,color .2s,border-color .2s,box-shadow .2s}
  .sf-btn:hover{transform:none}
  .sf-fill{display:flex;flex-direction:column;justify-content:center;gap:16px;position:absolute;inset:0;z-index:2;
    padding:64px max(24px,calc((100vw - 1040px)/2)) 96px;border-radius:32px 32px 0 0;text-decoration:none;
    clip-path:inset(var(--ft,40%) var(--fr,40%) var(--fb,40%) var(--fl,40%) round 99px);opacity:0;pointer-events:none;
    transition:clip-path .6s cubic-bezier(.65,0,.35,1),opacity .15s ease .45s}
  .sf-fill.fe{background:var(--ink);color:var(--paper)}
  .sf-fill.fs{background:var(--accent);color:var(--on-accent)}
  .site-foot[data-fill="fe"] .fe,.site-foot[data-fill="fs"] .fs{clip-path:inset(0 0 0 0 round 32px 32px 0 0);opacity:1;pointer-events:auto;z-index:2;transition:clip-path .6s cubic-bezier(.65,0,.35,1),opacity .12s ease}
  .site-foot[data-fill] .fe:not(.on),.site-foot[data-fill] .fs:not(.on){z-index:1}
  .site-foot[data-fill="fe"] .sf-btn.primary,.site-foot[data-fill="fs"] .sf-btn.alt{background:transparent;color:transparent;border-color:transparent}
  .site-foot[data-fill="fe"] .sf-btn.alt,.site-foot[data-fill="fs"] .sf-btn.primary{opacity:0;pointer-events:none;transition:opacity .15s}
  .sf-btn{transition:background-color .2s,color .2s,border-color .2s,opacity .25s .15s}
  .sf-fill b{font-family:var(--serif);font-weight:400;font-size:clamp(56px,7vw,104px);line-height:.95;letter-spacing:-.02em;white-space:nowrap;display:flex;align-items:center;gap:18px;opacity:0;transform:translateY(16px);transition:opacity .2s,transform .5s cubic-bezier(.2,.8,.2,1)}
  .sf-fill svg{width:.55em;height:.55em;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
  .sf-fill small{font-size:18px;opacity:0;transition:opacity .2s}
  .site-foot[data-fill="fe"] .fe b,.site-foot[data-fill="fs"] .fs b{opacity:1;transform:none;transition-delay:.18s}
  .site-foot[data-fill="fe"] .fe small,.site-foot[data-fill="fs"] .fs small{opacity:.75;transition:opacity .3s .26s}
  .sf-fill:hover svg{transform:translate(6px,-6px)}
}
@media (prefers-reduced-motion: reduce){ .sf-fill,.sf-fill b{transition:none !important} }
/* theme switch: freeze CSS transitions while the circle reveals */
:root.theming *:not(.theme-btn):not(.theme-btn *),:root.theming *::before,:root.theming *::after{transition:none !important}
::view-transition-group(root){animation:none}
/* hero hover: soft light, no line reveal */
.hero-fx{background:radial-gradient(circle 380px at var(--mx,-999px) var(--my,-999px),var(--glow),transparent 72%) !important;-webkit-mask-image:none !important;mask-image:none !important;transform:none !important}
.intro.lit .hero-fx{opacity:1 !important}
.intro::after{transform:none !important}
:root{--glow:rgba(255,236,208,.75)}
:root[data-theme="dark"]{--glow:rgba(126,160,255,.09)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--glow:rgba(126,160,255,.09)}}
/* want to know more */
.more h2{font-family:var(--serif);font-weight:400;font-size:clamp(40px,5vw,60px);line-height:1;letter-spacing:-.02em;margin:0 0 32px}
.more-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.more-card{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 150px;gap:24px;align-items:center;min-height:240px;padding:32px;border-radius:24px;background:var(--tile);text-decoration:none;color:var(--ink);overflow:hidden;transition:background-color .25s}
.more-card:hover{background:var(--soft)}
:root[data-theme="light"] .more-card:hover{background:#ECECE8}
.more-card:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.more-txt{display:flex;flex-direction:column;gap:8px;align-self:stretch}
.more-t{font-family:var(--serif);font-size:34px;line-height:1.05}
.more-d{color:var(--mute);font-size:16px;line-height:1.5;max-width:300px}
.more-go{margin-top:auto;padding-top:16px;display:inline-flex;align-items:center;gap:8px;font-size:15px;font-weight:500}
.more-go svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.more-card:hover .more-go svg{transform:translateX(4px)}
.more-vis{display:grid;place-items:center;height:100%}
.more-ph{width:128px;height:auto;aspect-ratio:579/700;object-fit:cover;border-radius:12px;border:5px solid var(--frame,#fff);box-shadow:0 18px 36px -18px rgba(0,0,0,.45);transform:rotate(4deg);transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.more-card:hover .more-ph{transform:rotate(0deg) translateY(-6px) scale(1.04)}
.more-doc{width:118px;aspect-ratio:1/1.35;background:var(--frame,#fff);border-radius:8px;padding:14px 12px;display:flex;flex-direction:column;gap:6px;box-shadow:0 18px 36px -18px rgba(0,0,0,.45),0 0 0 1px var(--line);transform:rotate(-4deg);transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.more-doc b{display:block;height:9px;width:62%;border-radius:3px;background:var(--ink);margin-bottom:4px}
.more-doc i{display:block;height:4px;border-radius:2px;background:var(--line)}
.more-doc i.s{width:64%}
.more-doc em{display:block;height:5px;width:40%;border-radius:2px;background:var(--accent);opacity:.7;margin-top:5px}
.more-card:hover .more-doc{transform:rotate(0deg) translateY(-6px) scale(1.04)}
@media (max-width: 820px){ .more-grid{grid-template-columns:minmax(0,1fr)} .more-card{grid-template-columns:minmax(0,1fr) 110px;min-height:0;padding:24px} .more-ph{width:96px} .more-doc{width:90px} .more-t{font-size:28px} }
/* floating glass contact */
.glass{position:relative;isolation:isolate;
  background:linear-gradient(135deg,rgba(255,255,255,.86),rgba(255,255,255,.62));
  -webkit-backdrop-filter:blur(20px) saturate(1.8);backdrop-filter:blur(20px) saturate(1.8);
  border:1px solid rgba(255,255,255,.7);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9),inset 0 -1px 0 rgba(0,0,0,.04),0 16px 40px -16px rgba(0,0,0,.35),0 0 0 .5px rgba(0,0,0,.08)}
.glass::before{content:"";position:absolute;inset:0;border-radius:inherit;z-index:-1;pointer-events:none;opacity:.22;mix-blend-mode:overlay;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E")}
:root[data-theme="dark"] .glass{background:linear-gradient(135deg,rgba(60,60,68,.82),rgba(30,30,34,.66));border-color:rgba(255,255,255,.12);box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 16px 40px -16px rgba(0,0,0,.7)}
.fab{position:fixed;right:max(20px,env(safe-area-inset-right,0px));bottom:calc(20px + env(safe-area-inset-bottom,0px));z-index:40;display:flex;flex-direction:column;align-items:flex-end;gap:10px;transition:opacity .3s,transform .4s cubic-bezier(.2,.8,.2,1)}
.fab.away{opacity:0;transform:translateY(16px);pointer-events:none}
.fab-btn{all:unset;box-sizing:border-box;cursor:pointer;display:inline-flex;align-items:center;gap:10px;height:52px;padding:0 22px 0 18px;border-radius:99px;color:var(--ink);font:500 15px/1 var(--sans);transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s}
.fab-btn.glass{position:relative}
.fab-btn:hover{transform:translateY(-2px)}
.fab-btn:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.fab-dot{width:8px;height:8px;border-radius:50%;background:#3BA56B;box-shadow:0 0 0 4px rgba(59,165,107,.18)}
.fab-menu{display:flex;flex-direction:column;min-width:250px;padding:6px;border-radius:20px;transform-origin:100% 100%;animation:fabIn .28s cubic-bezier(.2,.8,.2,1)}
.fab-menu[hidden]{display:none}
@keyframes fabIn{from{opacity:0;transform:translateY(8px) scale(.96)}to{opacity:1;transform:none}}
.fab-menu a,.fab-menu button{all:unset;box-sizing:border-box;cursor:pointer;display:flex;flex-direction:column;gap:2px;padding:12px 14px;border-radius:14px;color:var(--ink)}
.fab-menu a:hover,.fab-menu button:hover{background:rgba(255,255,255,.55)}
:root[data-theme="dark"] .fab-menu a:hover,:root[data-theme="dark"] .fab-menu button:hover{background:rgba(255,255,255,.08)}
.fab-menu a:focus-visible,.fab-menu button:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.fab-menu span{font-size:15px;font-weight:500}
.fab-menu small{font-size:13px;color:var(--mute)}
@media (max-width: 520px){ .fab-btn{height:48px;padding:0 18px 0 16px} }
/* about polish: softer shadows, back arrow, awards list */
.ab-strip{padding:28px 24px 44px !important;margin:-28px -24px -44px !important}
.snap .zoom{box-shadow:0 0 0 1px rgba(0,0,0,.04),0 1px 2px rgba(0,0,0,.06),0 6px 14px -6px rgba(0,0,0,.14) !important}
.snap:hover .zoom{box-shadow:0 0 0 1px rgba(0,0,0,.04),0 2px 4px rgba(0,0,0,.06),0 14px 28px -10px rgba(0,0,0,.2) !important}
.ab-portrait img,.ab-award img,.more-ph{box-shadow:0 0 0 1px rgba(0,0,0,.05),0 1px 2px rgba(0,0,0,.06),0 8px 18px -8px rgba(0,0,0,.18) !important}
.more-doc{box-shadow:0 0 0 1px var(--line),0 1px 2px rgba(0,0,0,.05),0 8px 18px -8px rgba(0,0,0,.16) !important}
:root[data-theme="dark"] .snap .zoom,:root[data-theme="dark"] .ab-portrait img,:root[data-theme="dark"] .ab-award img{box-shadow:0 0 0 1px rgba(255,255,255,.06),0 8px 18px -8px rgba(0,0,0,.6) !important}
.back{display:inline-flex;align-items:center;gap:8px}
.back::before{content:"";width:16px;height:16px;flex:none;background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 10H4M9 5l-5 5 5 5'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 10H4M9 5l-5 5 5 5'/%3E%3C/svg%3E") center/contain no-repeat;
  transition:transform .25s cubic-bezier(.2,.8,.2,1)}
.back:hover::before{transform:translateX(-3px)}
.ab-awards{list-style:none;margin:0;padding:0;align-self:center}
.ab-awards li{display:grid;grid-template-columns:minmax(0,1fr);gap:2px;padding:14px 0;border-bottom:1px solid var(--line)}
.ab-awards li:first-child{border-top:1px solid var(--line)}
.ab-awards b{font-weight:500;font-size:17px}
.ab-awards span{color:var(--mute);font-size:15px}
/* work tabs */
.tabs-wrap{position:sticky;top:0;z-index:20;background:var(--paper);margin:0 -24px;padding:0 24px;border-bottom:1px solid var(--line)}
.tabs{display:flex;gap:28px;overflow-x:auto;scrollbar-width:none;font-family:'Geist Mono',ui-monospace,Menlo,monospace;font-size:17px}
.tabs::-webkit-scrollbar{display:none}
.tabs button{all:unset;cursor:pointer;white-space:nowrap;padding:18px 0 16px;color:var(--mute);border-bottom:2px solid transparent;margin-bottom:-1px}
.tabs button:hover{color:var(--ink)}
.tabs button[aria-current="true"]{color:var(--ink);border-bottom-color:var(--ink)}
.tabs button:focus-visible{outline:2px solid var(--accent);outline-offset:-2px;border-radius:4px}
.work{display:flex;flex-direction:column}
.panel{padding-top:32px;scroll-margin-top:64px}
.panel.enter{animation:panelIn .35s cubic-bezier(.2,.8,.2,1)}
@keyframes panelIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.plead{display:flex;justify-content:space-between;align-items:baseline;gap:16px;flex-wrap:wrap;margin:0 0 28px;color:var(--mute);font-size:16px}
.plead a{color:var(--accent);text-decoration:none}
.plead a:hover{text-decoration:underline}
@media (max-width: 820px){ .tabs{font-size:15px;gap:20px} }
@media (max-width: 820px){
  main{gap:88px;padding-top:64px}
  .grid2,.wb,.sec,.heard,.steps{grid-template-columns:1fr}
  .grid3,.decs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .phones{grid-template-columns:repeat(2,minmax(0,1fr))}
  .webs{grid-template-columns:1fr}
  .facts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sec{gap:12px}
}
@media (max-width: 520px){
  .grid3,.decs{grid-template-columns:1fr}
  .top nav{gap:16px}
  .mock{font-size:10px}
  .rows .rd{display:none}
  .ai-chips,.x-form ol{display:none}
  .ai-chat,.cast-sheet,.save-modal,.concept,.x-form,.x-steps,.m-console{font-size:9.5px}
  .ai-msg,.ai-reply{padding:4px 7px}
  .cast-tabs span{font-size:8.5px}
}
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation:none !important;transition:none !important}
}

/* tighter first fold */
.intro .now{margin-bottom:18px}
.intro h1.lead{font-size:clamp(24px,2.6vw,30px) !important;line-height:1.25 !important;max-width:720px;margin:0 0 32px !important}
.proof{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:18px;overflow:hidden}
.proof li{background:var(--paper);padding:16px 18px;display:flex;flex-direction:column;gap:3px}
.proof b{font-family:var(--sans);font-weight:500;font-size:15px;line-height:1.3;color:var(--ink)}
.proof span{font-size:14px;line-height:1.4;color:var(--mute)}
@media (max-width: 820px){ .proof{grid-template-columns:repeat(2,minmax(0,1fr))} .proof li{padding:14px;min-height:0} .proof li:last-child{grid-column:1/-1} .proof b{font-size:15px} .proof span{font-size:13px} }
/* focused tabs */
.tabs-wrap{border-bottom:0 !important;padding-top:12px !important;padding-bottom:12px !important}
.tabs-head{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin-bottom:12px}
.tabs-head h2{font-family:var(--serif);font-weight:400;font-size:clamp(30px,3.6vw,40px);line-height:1;margin:0;letter-spacing:-.01em}
.tabs-head span{font-size:14px;color:var(--mute)}
.tabs{display:inline-flex !important;gap:4px !important;padding:5px;background:var(--tile);border-radius:99px;font-family:var(--sans) !important;font-size:15px !important;max-width:100%}
.tabs button{padding:11px 18px !important;border-radius:99px;border-bottom:0 !important;margin:0 !important;color:var(--mute);font-weight:500;display:inline-flex;align-items:center;gap:8px;transition:background-color .25s,color .25s,box-shadow .25s}
.tabs button[aria-current="true"]{background:var(--paper);color:var(--ink);box-shadow:0 1px 2px rgba(0,0,0,.08),0 6px 16px -8px rgba(0,0,0,.25)}
.tabs button .ct{font-size:12px;min-width:22px;height:20px;padding:0 6px;border-radius:99px;display:inline-grid;place-items:center;background:var(--line);color:var(--mute);font-variant-numeric:tabular-nums}
.tabs button[aria-current="true"] .ct{background:var(--ink);color:var(--paper)}
@media (max-width: 820px){ .tabs{display:flex !important;overflow-x:auto} .tabs button{padding:10px 14px !important;white-space:nowrap} }

/* hero band */
html{overflow-x:clip}
.intro{position:relative;isolation:isolate}
.top{position:relative;z-index:2}
.intro::before,.intro::after{content:"";pointer-events:none;position:absolute;z-index:-1;top:-190px;bottom:-64px;left:calc(50% - 50vw);right:calc(50% - 50vw)}
.intro::before{background:linear-gradient(180deg,var(--paper) 0%,var(--hero) 38%,var(--hero) 100%);border-bottom:1px solid var(--line)}
.intro::after{background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%201400%20760%22%20fill%3D%22none%22%20stroke%3D%22%23E0DCD2%22%20stroke-width%3D%221%22%3E%3Cpath%20d%3D%22M984%20300%20L989%20306%20L991%20312%20L991%20318%20L989%20323%20L984%20329%20L978%20334%20L971%20338%20L963%20341%20L954%20344%20L945%20346%20L935%20347%20L926%20347%20L917%20346%20L908%20346%20L901%20347%20L894%20348%20L888%20351%20L880%20354%20L871%20358%20L862%20360%20L852%20361%20L843%20360%20L835%20358%20L828%20354%20L821%20350%20L815%20346%20L809%20342%20L801%20339%20L793%20336%20L785%20332%20L778%20328%20L773%20323%20L772%20317%20L774%20311%20L778%20305%20L784%20300%20L790%20295%20L795%20291%20L798%20287%20L801%20283%20L803%20279%20L805%20274%20L807%20270%20L810%20265%20L813%20260%20L816%20255%20L821%20250%20L826%20244%20L832%20239%20L840%20235%20L849%20232%20L860%20232%20L870%20233%20L880%20236%20L889%20240%20L897%20244%20L904%20247%20L911%20249%20L919%20250%20L927%20251%20L936%20253%20L944%20255%20L950%20258%20L955%20263%20L957%20268%20L958%20273%20L959%20278%20L961%20282%20L965%20287%20L970%20291%20L977%20295%20L984%20300Z%22/%3E%3Cpath%20d%3D%22M1036%20300%20L1035%20308%20L1032%20316%20L1029%20324%20L1026%20331%20L1022%20339%20L1018%20347%20L1012%20355%20L1003%20361%20L990%20365%20L976%20368%20L960%20368%20L944%20366%20L930%20364%20L919%20363%20L909%20365%20L900%20368%20L891%20374%20L880%20381%20L867%20387%20L853%20392%20L838%20393%20L823%20392%20L810%20389%20L799%20384%20L788%20378%20L779%20371%20L770%20365%20L762%20359%20L755%20352%20L749%20345%20L745%20337%20L744%20329%20L743%20322%20L744%20314%20L744%20307%20L744%20300%20L744%20293%20L745%20286%20L747%20279%20L752%20272%20L758%20266%20L765%20261%20L773%20256%20L779%20250%20L784%20243%20L788%20235%20L793%20226%20L799%20216%20L807%20208%20L819%20201%20L834%20198%20L850%20198%20L866%20202%20L880%20208%20L893%20215%20L903%20221%20L913%20226%20L923%20230%20L933%20232%20L944%20234%20L956%20236%20L966%20239%20L976%20243%20L985%20248%20L993%20253%20L1002%20258%20L1010%20264%20L1018%20270%20L1025%20277%20L1031%20284%20L1035%20292%20L1036%20300Z%22/%3E%3Cpath%20d%3D%22M1090%20300%20L1080%20310%20L1070%20320%20L1062%20329%20L1057%20338%20L1053%20348%20L1049%20358%20L1043%20367%20L1032%20376%20L1018%20382%20L1001%20386%20L983%20387%20L965%20387%20L949%20388%20L935%20390%20L922%20393%20L909%20398%20L895%20404%20L880%20410%20L863%20415%20L845%20418%20L826%20419%20L807%20419%20L788%20417%20L770%20413%20L752%20408%20L737%20401%20L726%20391%20L719%20380%20L716%20368%20L718%20355%20L722%20344%20L725%20333%20L726%20324%20L723%20316%20L716%20309%20L707%20300%20L698%20291%20L692%20280%20L692%20270%20L696%20260%20L705%20252%20L717%20244%20L728%20237%20L739%20230%20L747%20221%20L755%20211%20L763%20201%20L773%20191%20L787%20182%20L804%20176%20L823%20174%20L843%20174%20L862%20178%20L880%20183%20L896%20188%20L912%20194%20L925%20200%20L938%20205%20L950%20211%20L961%20217%20L972%20222%20L984%20227%20L997%20231%20L1012%20234%20L1030%20238%20L1050%20242%20L1069%20248%20L1086%20256%20L1096%20266%20L1100%20277%20L1098%20289%20L1090%20300Z%22/%3E%3Cpath%20d%3D%22M1144%20300%20L1130%20313%20L1115%20325%20L1103%20335%20L1092%20346%20L1082%20356%20L1072%20366%20L1060%20375%20L1047%20383%20L1032%20390%20L1018%20397%20L1004%20405%20L990%20413%20L975%20421%20L959%20429%20L941%20435%20L922%20440%20L901%20442%20L880%20443%20L859%20442%20L838%20441%20L817%20440%20L794%20440%20L770%20440%20L745%20439%20L721%20435%20L701%20427%20L687%20414%20L681%20399%20L682%20382%20L688%20366%20L695%20351%20L700%20339%20L700%20329%20L693%20320%20L682%20310%20L668%20300%20L656%20288%20L648%20276%20L644%20263%20L646%20249%20L651%20237%20L660%20225%20L671%20213%20L683%20202%20L696%20191%20L713%20182%20L731%20174%20L752%20169%20L774%20165%20L796%20164%20L818%20163%20L839%20163%20L860%20162%20L880%20161%20L900%20161%20L921%20163%20L940%20168%20L956%20176%20L970%20185%20L982%20195%20L993%20204%20L1006%20211%20L1023%20215%20L1045%20218%20L1071%20221%20L1100%20225%20L1126%20232%20L1147%20242%20L1159%20256%20L1161%20271%20L1155%20286%20L1144%20300Z%22/%3E%3Cpath%20d%3D%22M1192%20300%20L1184%20316%20L1172%20330%20L1156%20344%20L1137%20355%20L1115%20365%20L1092%20373%20L1072%20380%20L1055%20387%20L1042%20396%20L1033%20408%20L1026%20423%20L1017%20441%20L1004%20458%20L986%20472%20L962%20482%20L935%20486%20L907%20485%20L880%20480%20L854%20474%20L830%20468%20L806%20465%20L780%20463%20L754%20461%20L727%20457%20L702%20450%20L682%20440%20L667%20426%20L659%20410%20L656%20393%20L655%20377%20L654%20362%20L652%20349%20L647%20337%20L640%20325%20L633%20313%20L625%20300%20L619%20286%20L613%20272%20L608%20257%20L604%20240%20L601%20223%20L601%20205%20L607%20187%20L620%20171%20L641%20158%20L669%20151%20L701%20148%20L733%20150%20L764%20153%20L792%20156%20L815%20157%20L837%20155%20L858%20150%20L880%20144%20L904%20139%20L928%20137%20L952%20140%20L974%20147%20L993%20156%20L1010%20166%20L1028%20175%20L1046%20183%20L1068%20188%20L1093%20194%20L1120%20200%20L1146%20209%20L1168%20220%20L1185%20234%20L1195%20250%20L1199%20267%20L1198%20284%20L1192%20300Z%22/%3E%3Cpath%20d%3D%22M1229%20300%20L1230%20318%20L1223%20336%20L1206%20352%20L1181%20365%20L1152%20375%20L1122%20383%20L1096%20390%20L1078%20398%20L1066%20410%20L1060%20427%20L1054%20447%20L1045%20469%20L1029%20490%20L1007%20507%20L979%20518%20L946%20523%20L913%20523%20L880%20520%20L848%20514%20L819%20507%20L790%20499%20L763%20490%20L739%20479%20L717%20467%20L698%20454%20L682%20440%20L667%20426%20L652%20414%20L635%20402%20L617%20390%20L599%20378%20L583%20364%20L572%20349%20L567%20333%20L567%20316%20L570%20300%20L574%20284%20L574%20268%20L570%20251%20L562%20231%20L554%20210%20L551%20187%20L556%20166%20L573%20147%20L600%20134%20L636%20128%20L676%20127%20L715%20131%20L751%20136%20L782%20140%20L808%20141%20L832%20139%20L856%20134%20L880%20129%20L906%20125%20L933%20122%20L961%20122%20L989%20123%20L1017%20126%20L1046%20129%20L1076%20134%20L1105%20141%20L1133%20150%20L1156%20163%20L1175%20178%20L1188%20195%20L1196%20213%20L1203%20230%20L1209%20248%20L1216%20265%20L1223%20282%20L1229%20300Z%22/%3E%3Cpath%20d%3D%22M1249%20300%20L1253%20319%20L1249%20339%20L1235%20356%20L1215%20372%20L1191%20386%20L1168%20399%20L1148%20411%20L1132%20425%20L1119%20441%20L1106%20459%20L1091%20478%20L1071%20496%20L1048%20513%20L1019%20527%20L988%20538%20L953%20547%20L917%20553%20L880%20556%20L842%20555%20L806%20549%20L773%20537%20L745%20519%20L724%20498%20L709%20475%20L697%20455%20L685%20438%20L668%20426%20L644%20418%20L613%20411%20L578%20403%20L544%20393%20L516%20378%20L498%20361%20L490%20341%20L492%20320%20L498%20300%20L505%20281%20L509%20261%20L510%20241%20L510%20220%20L511%20198%20L518%20176%20L533%20156%20L557%20139%20L588%20127%20L623%20119%20L660%20114%20L696%20111%20L730%20110%20L763%20109%20L793%20109%20L823%20109%20L852%20110%20L880%20111%20L908%20112%20L936%20111%20L967%20107%20L1002%20101%20L1042%2095%20L1084%2090%20L1128%2090%20L1167%2097%20L1198%20111%20L1219%20132%20L1228%20156%20L1228%20181%20L1224%20205%20L1221%20226%20L1223%20246%20L1230%20263%20L1240%20281%20L1249%20300Z%22/%3E%3Cpath%20d%3D%22M1256%20300%20L1253%20319%20L1248%20338%20L1243%20358%20L1238%20377%20L1234%20398%20L1230%20420%20L1223%20442%20L1212%20465%20L1193%20485%20L1167%20502%20L1135%20515%20L1099%20525%20L1063%20533%20L1028%20541%20L993%20550%20L958%20561%20L920%20573%20L880%20581%20L838%20584%20L797%20578%20L761%20563%20L732%20541%20L711%20515%20L696%20489%20L683%20467%20L667%20450%20L646%20439%20L616%20431%20L579%20425%20L540%20416%20L502%20404%20L470%20388%20L445%20369%20L428%20347%20L418%20324%20L414%20300%20L414%20276%20L418%20252%20L429%20228%20L446%20206%20L471%20187%20L500%20170%20L533%20156%20L566%20144%20L597%20132%20L625%20120%20L651%20106%20L678%2093%20L707%2080%20L740%2072%20L775%2068%20L811%2070%20L847%2075%20L880%2082%20L912%2087%20L944%2087%20L979%2081%20L1020%2072%20L1067%2063%20L1117%2057%20L1166%2058%20L1209%2068%20L1241%2086%20L1261%20110%20L1270%20138%20L1270%20167%20L1266%20193%20L1261%20218%20L1259%20240%20L1258%20261%20L1258%20280%20L1256%20300Z%22/%3E%3Cpath%20d%3D%22M1268%20300%20L1254%20319%20L1248%20338%20L1253%20359%20L1266%20383%20L1282%20411%20L1296%20442%20L1300%20474%20L1290%20504%20L1264%20528%20L1226%20544%20L1179%20553%20L1131%20558%20L1085%20560%20L1042%20563%20L1002%20569%20L962%20577%20L922%20584%20L880%20589%20L837%20589%20L796%20581%20L759%20568%20L726%20551%20L698%20532%20L672%20514%20L646%20498%20L619%20484%20L590%20472%20L560%20459%20L529%20445%20L500%20430%20L471%20413%20L442%20394%20L413%20374%20L383%20352%20L356%20327%20L334%20300%20L323%20271%20L328%20242%20L350%20216%20L388%20194%20L436%20177%20L487%20166%20L535%20157%20L574%20148%20L603%20136%20L625%20120%20L644%20100%20L664%2078%20L690%2058%20L722%2043%20L760%2034%20L800%2031%20L841%2033%20L880%2036%20L919%2037%20L958%2036%20L1001%2033%20L1046%2030%20L1092%2030%20L1139%2034%20L1182%2044%20L1220%2060%20L1251%2080%20L1276%20103%20L1295%20128%20L1309%20153%20L1318%20179%20L1320%20205%20L1315%20231%20L1303%20256%20L1286%20279%20L1268%20300Z%22/%3E%3Cpath%20d%3D%22M1308%20300%20L1293%20321%20L1290%20343%20L1300%20367%20L1318%20395%20L1338%20427%20L1352%20462%20L1353%20496%20L1338%20528%20L1308%20553%20L1266%20573%20L1218%20586%20L1166%20594%20L1115%20599%20L1065%20601%20L1016%20601%20L969%20598%20L923%20593%20L880%20584%20L839%20575%20L801%20565%20L764%20557%20L725%20552%20L684%20549%20L640%20547%20L595%20541%20L552%20532%20L515%20516%20L486%20496%20L464%20473%20L447%20448%20L429%20425%20L407%20402%20L378%20380%20L343%20356%20L309%20330%20L282%20300%20L271%20268%20L279%20237%20L309%20209%20L354%20187%20L409%20170%20L464%20158%20L512%20148%20L552%20137%20L582%20124%20L607%20107%20L629%2088%20L653%2067%20L681%2048%20L714%2030%20L751%2014%20L791%20-0%20L834%20-13%20L880%20-24%20L929%20-31%20L979%20-34%20L1029%20-30%20L1076%20-19%20L1117%20-2%20L1153%2020%20L1183%2043%20L1212%2066%20L1240%2086%20L1272%20105%20L1304%20124%20L1335%20144%20L1359%20168%20L1371%20194%20L1369%20222%20L1354%20250%20L1331%20277%20L1308%20300Z%22/%3E%3Cpath%20d%3D%22M1387%20300%20L1387%20326%20L1391%20353%20L1398%20382%20L1403%20413%20L1402%20444%20L1393%20476%20L1376%20506%20L1351%20534%20L1320%20561%20L1284%20585%20L1243%20607%20L1197%20625%20L1146%20638%20L1090%20642%20L1032%20637%20L976%20623%20L925%20603%20L880%20582%20L841%20565%20L804%20555%20L765%20554%20L720%20561%20L667%20571%20L608%20579%20L548%20581%20L493%20574%20L447%20556%20L414%20532%20L390%20503%20L373%20473%20L357%20444%20L339%20417%20L318%20389%20L296%20361%20L278%20331%20L269%20300%20L273%20269%20L290%20238%20L318%20211%20L352%20186%20L389%20164%20L425%20144%20L460%20126%20L495%20108%20L529%2092%20L565%2078%20L602%2065%20L638%2052%20L673%2037%20L708%2020%20L743%20-3%20L782%20-29%20L827%20-56%20L880%20-80%20L938%20-95%20L998%20-97%20L1054%20-86%20L1102%20-62%20L1139%20-29%20L1167%206%20L1189%2038%20L1211%2066%20L1238%2088%20L1270%20106%20L1306%20123%20L1341%20142%20L1371%20164%20L1390%20190%20L1398%20218%20L1397%20246%20L1391%20273%20L1387%20300Z%22/%3E%3Cpath%20d%3D%22M368%20620%20L373%20626%20L376%20633%20L377%20640%20L374%20647%20L368%20653%20L361%20658%20L353%20663%20L344%20667%20L334%20670%20L324%20672%20L313%20673%20L302%20673%20L291%20673%20L282%20672%20L274%20673%20L266%20675%20L259%20678%20L250%20682%20L240%20685%20L230%20688%20L219%20689%20L208%20688%20L199%20685%20L191%20681%20L183%20676%20L177%20672%20L169%20668%20L161%20664%20L151%20661%20L142%20657%20L134%20652%20L129%20646%20L127%20639%20L129%20633%20L134%20626%20L141%20620%20L147%20615%20L153%20610%20L157%20605%20L161%20601%20L163%20596%20L165%20591%20L167%20586%20L170%20580%20L174%20575%20L178%20569%20L183%20563%20L188%20557%20L196%20551%20L205%20546%20L215%20543%20L227%20542%20L239%20544%20L250%20547%20L260%20552%20L269%20556%20L277%20560%20L286%20562%20L294%20564%20L304%20565%20L314%20566%20L322%20569%20L330%20573%20L335%20578%20L337%20584%20L339%20590%20L340%20595%20L342%20600%20L346%20605%20L353%20609%20L360%20614%20L368%20620Z%22/%3E%3Cpath%20d%3D%22M420%20620%20L419%20629%20L416%20637%20L413%20646%20L409%20654%20L406%20663%20L401%20672%20L394%20680%20L384%20687%20L371%20692%20L355%20694%20L337%20694%20L320%20692%20L305%20690%20L292%20689%20L282%20691%20L272%20695%20L262%20701%20L250%20708%20L236%20715%20L220%20720%20L204%20722%20L188%20721%20L174%20717%20L161%20711%20L150%20705%20L140%20698%20L130%20691%20L121%20684%20L113%20677%20L107%20669%20L103%20661%20L101%20652%20L101%20644%20L101%20636%20L102%20628%20L102%20620%20L102%20612%20L103%20605%20L105%20597%20L110%20590%20L117%20583%20L125%20577%20L133%20571%20L140%20565%20L145%20558%20L150%20549%20L155%20539%20L161%20529%20L171%20519%20L184%20512%20L199%20508%20L217%20509%20L234%20513%20L250%20520%20L264%20527%20L276%20534%20L286%20540%20L297%20543%20L308%20546%20L320%20548%20L333%20550%20L344%20553%20L355%20558%20L365%20563%20L374%20569%20L383%20575%20L392%20581%20L400%20588%20L408%20595%20L415%20603%20L419%20611%20L420%20620Z%22/%3E%3Cpath%20d%3D%22M475%20620%20L464%20631%20L453%20641%20L445%20651%20L439%20661%20L435%20671%20L431%20682%20L424%20692%20L413%20701%20L398%20708%20L380%20712%20L360%20713%20L341%20714%20L324%20714%20L309%20716%20L295%20720%20L281%20725%20L266%20731%20L250%20738%20L232%20743%20L212%20746%20L192%20748%20L172%20747%20L152%20745%20L132%20741%20L113%20736%20L97%20728%20L85%20718%20L77%20706%20L75%20693%20L77%20679%20L81%20667%20L84%20656%20L85%20646%20L82%20638%20L74%20629%20L64%20620%20L55%20610%20L49%20599%20L48%20588%20L53%20578%20L63%20568%20L75%20560%20L88%20553%20L99%20545%20L108%20536%20L116%20525%20L125%20514%20L136%20503%20L151%20494%20L169%20487%20L189%20485%20L210%20486%20L231%20489%20L250%20494%20L268%20501%20L284%20507%20L299%20513%20L312%20519%20L325%20525%20L337%20531%20L349%20536%20L361%20542%20L375%20546%20L392%20550%20L411%20553%20L432%20558%20L453%20564%20L470%20573%20L482%20583%20L486%20595%20L483%20608%20L475%20620Z%22/%3E%3Cpath%20d%3D%22M529%20620%20L514%20634%20L499%20646%20L486%20657%20L474%20668%20L464%20679%20L452%20689%20L440%20699%20L426%20708%20L411%20715%20L396%20723%20L381%20731%20L366%20739%20L350%20748%20L333%20756%20L315%20763%20L294%20768%20L272%20770%20L250%20771%20L228%20770%20L206%20769%20L183%20768%20L159%20768%20L133%20768%20L107%20767%20L82%20762%20L61%20754%20L46%20741%20L40%20725%20L41%20707%20L47%20689%20L55%20674%20L60%20661%20L59%20650%20L53%20641%20L41%20631%20L26%20620%20L13%20608%20L4%20594%20L1%20580%20L2%20567%20L8%20553%20L18%20540%20L29%20528%20L41%20516%20L56%20505%20L73%20495%20L93%20487%20L115%20481%20L138%20478%20L162%20476%20L185%20475%20L207%20475%20L228%20474%20L250%20473%20L272%20473%20L293%20476%20L313%20481%20L331%20489%20L345%20499%20L358%20509%20L370%20519%20L383%20526%20L401%20530%20L424%20533%20L452%20536%20L482%20541%20L510%20548%20L532%20559%20L544%20573%20L547%20589%20L541%20605%20L529%20620Z%22/%3E%3Cpath%20d%3D%22M577%20620%20L568%20636%20L555%20652%20L539%20666%20L519%20678%20L496%20688%20L472%20696%20L451%20703%20L433%20711%20L420%20721%20L410%20733%20L403%20749%20L393%20767%20L380%20785%20L361%20800%20L336%20810%20L308%20815%20L279%20813%20L250%20808%20L223%20802%20L198%20796%20L172%20793%20L145%20790%20L118%20788%20L90%20785%20L64%20778%20L42%20767%20L27%20752%20L19%20735%20L15%20718%20L14%20701%20L14%20685%20L11%20672%20L6%20659%20L-1%20646%20L-9%20633%20L-17%20620%20L-24%20606%20L-30%20591%20L-35%20575%20L-39%20558%20L-42%20539%20L-42%20520%20L-36%20501%20L-22%20485%20L-0%20472%20L29%20464%20L62%20461%20L96%20462%20L129%20466%20L157%20469%20L182%20470%20L205%20468%20L227%20463%20L250%20456%20L275%20451%20L301%20450%20L326%20453%20L349%20459%20L369%20469%20L387%20480%20L405%20489%20L424%20497%20L447%20503%20L474%20509%20L502%20516%20L529%20525%20L552%20537%20L569%20551%20L580%20568%20L584%20585%20L583%20603%20L577%20620Z%22/%3E%3Cpath%20d%3D%22M613%20620%20L614%20639%20L607%20657%20L589%20674%20L564%20688%20L533%20698%20L502%20706%20L475%20713%20L456%20722%20L444%20735%20L437%20752%20L431%20773%20L421%20796%20L405%20818%20L382%20835%20L353%20847%20L319%20852%20L284%20852%20L250%20849%20L217%20842%20L186%20835%20L156%20827%20L129%20818%20L103%20807%20L80%20794%20L61%20780%20L44%20766%20L28%20752%20L12%20738%20L-5%20726%20L-24%20714%20L-42%20701%20L-59%20687%20L-70%20671%20L-76%20654%20L-76%20637%20L-72%20620%20L-69%20603%20L-69%20587%20L-73%20569%20L-81%20549%20L-89%20526%20L-92%20503%20L-87%20480%20L-70%20461%20L-41%20447%20L-4%20441%20L37%20440%20L78%20444%20L116%20449%20L148%20453%20L175%20454%20L200%20452%20L225%20448%20L250%20442%20L277%20438%20L305%20435%20L334%20434%20L363%20436%20L393%20439%20L423%20442%20L454%20447%20L484%20454%20L513%20464%20L538%20477%20L557%20493%20L570%20510%20L579%20529%20L586%20548%20L592%20566%20L599%20583%20L607%20601%20L613%20620Z%22/%3E%3C/svg%3E") right -120px center/min(1400px,110vw) auto no-repeat;-webkit-mask-image:linear-gradient(90deg,transparent 12%,#000 55%);mask-image:linear-gradient(90deg,transparent 12%,#000 55%);bottom:-63px}
:root{--hero:#F2F0EA}
:root[data-theme="dark"]{--hero:#18181B}
:root[data-theme="dark"] .intro::after{background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%201400%20760%22%20fill%3D%22none%22%20stroke%3D%22%232E2E33%22%20stroke-width%3D%221%22%3E%3Cpath%20d%3D%22M984%20300%20L989%20306%20L991%20312%20L991%20318%20L989%20323%20L984%20329%20L978%20334%20L971%20338%20L963%20341%20L954%20344%20L945%20346%20L935%20347%20L926%20347%20L917%20346%20L908%20346%20L901%20347%20L894%20348%20L888%20351%20L880%20354%20L871%20358%20L862%20360%20L852%20361%20L843%20360%20L835%20358%20L828%20354%20L821%20350%20L815%20346%20L809%20342%20L801%20339%20L793%20336%20L785%20332%20L778%20328%20L773%20323%20L772%20317%20L774%20311%20L778%20305%20L784%20300%20L790%20295%20L795%20291%20L798%20287%20L801%20283%20L803%20279%20L805%20274%20L807%20270%20L810%20265%20L813%20260%20L816%20255%20L821%20250%20L826%20244%20L832%20239%20L840%20235%20L849%20232%20L860%20232%20L870%20233%20L880%20236%20L889%20240%20L897%20244%20L904%20247%20L911%20249%20L919%20250%20L927%20251%20L936%20253%20L944%20255%20L950%20258%20L955%20263%20L957%20268%20L958%20273%20L959%20278%20L961%20282%20L965%20287%20L970%20291%20L977%20295%20L984%20300Z%22/%3E%3Cpath%20d%3D%22M1036%20300%20L1035%20308%20L1032%20316%20L1029%20324%20L1026%20331%20L1022%20339%20L1018%20347%20L1012%20355%20L1003%20361%20L990%20365%20L976%20368%20L960%20368%20L944%20366%20L930%20364%20L919%20363%20L909%20365%20L900%20368%20L891%20374%20L880%20381%20L867%20387%20L853%20392%20L838%20393%20L823%20392%20L810%20389%20L799%20384%20L788%20378%20L779%20371%20L770%20365%20L762%20359%20L755%20352%20L749%20345%20L745%20337%20L744%20329%20L743%20322%20L744%20314%20L744%20307%20L744%20300%20L744%20293%20L745%20286%20L747%20279%20L752%20272%20L758%20266%20L765%20261%20L773%20256%20L779%20250%20L784%20243%20L788%20235%20L793%20226%20L799%20216%20L807%20208%20L819%20201%20L834%20198%20L850%20198%20L866%20202%20L880%20208%20L893%20215%20L903%20221%20L913%20226%20L923%20230%20L933%20232%20L944%20234%20L956%20236%20L966%20239%20L976%20243%20L985%20248%20L993%20253%20L1002%20258%20L1010%20264%20L1018%20270%20L1025%20277%20L1031%20284%20L1035%20292%20L1036%20300Z%22/%3E%3Cpath%20d%3D%22M1090%20300%20L1080%20310%20L1070%20320%20L1062%20329%20L1057%20338%20L1053%20348%20L1049%20358%20L1043%20367%20L1032%20376%20L1018%20382%20L1001%20386%20L983%20387%20L965%20387%20L949%20388%20L935%20390%20L922%20393%20L909%20398%20L895%20404%20L880%20410%20L863%20415%20L845%20418%20L826%20419%20L807%20419%20L788%20417%20L770%20413%20L752%20408%20L737%20401%20L726%20391%20L719%20380%20L716%20368%20L718%20355%20L722%20344%20L725%20333%20L726%20324%20L723%20316%20L716%20309%20L707%20300%20L698%20291%20L692%20280%20L692%20270%20L696%20260%20L705%20252%20L717%20244%20L728%20237%20L739%20230%20L747%20221%20L755%20211%20L763%20201%20L773%20191%20L787%20182%20L804%20176%20L823%20174%20L843%20174%20L862%20178%20L880%20183%20L896%20188%20L912%20194%20L925%20200%20L938%20205%20L950%20211%20L961%20217%20L972%20222%20L984%20227%20L997%20231%20L1012%20234%20L1030%20238%20L1050%20242%20L1069%20248%20L1086%20256%20L1096%20266%20L1100%20277%20L1098%20289%20L1090%20300Z%22/%3E%3Cpath%20d%3D%22M1144%20300%20L1130%20313%20L1115%20325%20L1103%20335%20L1092%20346%20L1082%20356%20L1072%20366%20L1060%20375%20L1047%20383%20L1032%20390%20L1018%20397%20L1004%20405%20L990%20413%20L975%20421%20L959%20429%20L941%20435%20L922%20440%20L901%20442%20L880%20443%20L859%20442%20L838%20441%20L817%20440%20L794%20440%20L770%20440%20L745%20439%20L721%20435%20L701%20427%20L687%20414%20L681%20399%20L682%20382%20L688%20366%20L695%20351%20L700%20339%20L700%20329%20L693%20320%20L682%20310%20L668%20300%20L656%20288%20L648%20276%20L644%20263%20L646%20249%20L651%20237%20L660%20225%20L671%20213%20L683%20202%20L696%20191%20L713%20182%20L731%20174%20L752%20169%20L774%20165%20L796%20164%20L818%20163%20L839%20163%20L860%20162%20L880%20161%20L900%20161%20L921%20163%20L940%20168%20L956%20176%20L970%20185%20L982%20195%20L993%20204%20L1006%20211%20L1023%20215%20L1045%20218%20L1071%20221%20L1100%20225%20L1126%20232%20L1147%20242%20L1159%20256%20L1161%20271%20L1155%20286%20L1144%20300Z%22/%3E%3Cpath%20d%3D%22M1192%20300%20L1184%20316%20L1172%20330%20L1156%20344%20L1137%20355%20L1115%20365%20L1092%20373%20L1072%20380%20L1055%20387%20L1042%20396%20L1033%20408%20L1026%20423%20L1017%20441%20L1004%20458%20L986%20472%20L962%20482%20L935%20486%20L907%20485%20L880%20480%20L854%20474%20L830%20468%20L806%20465%20L780%20463%20L754%20461%20L727%20457%20L702%20450%20L682%20440%20L667%20426%20L659%20410%20L656%20393%20L655%20377%20L654%20362%20L652%20349%20L647%20337%20L640%20325%20L633%20313%20L625%20300%20L619%20286%20L613%20272%20L608%20257%20L604%20240%20L601%20223%20L601%20205%20L607%20187%20L620%20171%20L641%20158%20L669%20151%20L701%20148%20L733%20150%20L764%20153%20L792%20156%20L815%20157%20L837%20155%20L858%20150%20L880%20144%20L904%20139%20L928%20137%20L952%20140%20L974%20147%20L993%20156%20L1010%20166%20L1028%20175%20L1046%20183%20L1068%20188%20L1093%20194%20L1120%20200%20L1146%20209%20L1168%20220%20L1185%20234%20L1195%20250%20L1199%20267%20L1198%20284%20L1192%20300Z%22/%3E%3Cpath%20d%3D%22M1229%20300%20L1230%20318%20L1223%20336%20L1206%20352%20L1181%20365%20L1152%20375%20L1122%20383%20L1096%20390%20L1078%20398%20L1066%20410%20L1060%20427%20L1054%20447%20L1045%20469%20L1029%20490%20L1007%20507%20L979%20518%20L946%20523%20L913%20523%20L880%20520%20L848%20514%20L819%20507%20L790%20499%20L763%20490%20L739%20479%20L717%20467%20L698%20454%20L682%20440%20L667%20426%20L652%20414%20L635%20402%20L617%20390%20L599%20378%20L583%20364%20L572%20349%20L567%20333%20L567%20316%20L570%20300%20L574%20284%20L574%20268%20L570%20251%20L562%20231%20L554%20210%20L551%20187%20L556%20166%20L573%20147%20L600%20134%20L636%20128%20L676%20127%20L715%20131%20L751%20136%20L782%20140%20L808%20141%20L832%20139%20L856%20134%20L880%20129%20L906%20125%20L933%20122%20L961%20122%20L989%20123%20L1017%20126%20L1046%20129%20L1076%20134%20L1105%20141%20L1133%20150%20L1156%20163%20L1175%20178%20L1188%20195%20L1196%20213%20L1203%20230%20L1209%20248%20L1216%20265%20L1223%20282%20L1229%20300Z%22/%3E%3Cpath%20d%3D%22M1249%20300%20L1253%20319%20L1249%20339%20L1235%20356%20L1215%20372%20L1191%20386%20L1168%20399%20L1148%20411%20L1132%20425%20L1119%20441%20L1106%20459%20L1091%20478%20L1071%20496%20L1048%20513%20L1019%20527%20L988%20538%20L953%20547%20L917%20553%20L880%20556%20L842%20555%20L806%20549%20L773%20537%20L745%20519%20L724%20498%20L709%20475%20L697%20455%20L685%20438%20L668%20426%20L644%20418%20L613%20411%20L578%20403%20L544%20393%20L516%20378%20L498%20361%20L490%20341%20L492%20320%20L498%20300%20L505%20281%20L509%20261%20L510%20241%20L510%20220%20L511%20198%20L518%20176%20L533%20156%20L557%20139%20L588%20127%20L623%20119%20L660%20114%20L696%20111%20L730%20110%20L763%20109%20L793%20109%20L823%20109%20L852%20110%20L880%20111%20L908%20112%20L936%20111%20L967%20107%20L1002%20101%20L1042%2095%20L1084%2090%20L1128%2090%20L1167%2097%20L1198%20111%20L1219%20132%20L1228%20156%20L1228%20181%20L1224%20205%20L1221%20226%20L1223%20246%20L1230%20263%20L1240%20281%20L1249%20300Z%22/%3E%3Cpath%20d%3D%22M1256%20300%20L1253%20319%20L1248%20338%20L1243%20358%20L1238%20377%20L1234%20398%20L1230%20420%20L1223%20442%20L1212%20465%20L1193%20485%20L1167%20502%20L1135%20515%20L1099%20525%20L1063%20533%20L1028%20541%20L993%20550%20L958%20561%20L920%20573%20L880%20581%20L838%20584%20L797%20578%20L761%20563%20L732%20541%20L711%20515%20L696%20489%20L683%20467%20L667%20450%20L646%20439%20L616%20431%20L579%20425%20L540%20416%20L502%20404%20L470%20388%20L445%20369%20L428%20347%20L418%20324%20L414%20300%20L414%20276%20L418%20252%20L429%20228%20L446%20206%20L471%20187%20L500%20170%20L533%20156%20L566%20144%20L597%20132%20L625%20120%20L651%20106%20L678%2093%20L707%2080%20L740%2072%20L775%2068%20L811%2070%20L847%2075%20L880%2082%20L912%2087%20L944%2087%20L979%2081%20L1020%2072%20L1067%2063%20L1117%2057%20L1166%2058%20L1209%2068%20L1241%2086%20L1261%20110%20L1270%20138%20L1270%20167%20L1266%20193%20L1261%20218%20L1259%20240%20L1258%20261%20L1258%20280%20L1256%20300Z%22/%3E%3Cpath%20d%3D%22M1268%20300%20L1254%20319%20L1248%20338%20L1253%20359%20L1266%20383%20L1282%20411%20L1296%20442%20L1300%20474%20L1290%20504%20L1264%20528%20L1226%20544%20L1179%20553%20L1131%20558%20L1085%20560%20L1042%20563%20L1002%20569%20L962%20577%20L922%20584%20L880%20589%20L837%20589%20L796%20581%20L759%20568%20L726%20551%20L698%20532%20L672%20514%20L646%20498%20L619%20484%20L590%20472%20L560%20459%20L529%20445%20L500%20430%20L471%20413%20L442%20394%20L413%20374%20L383%20352%20L356%20327%20L334%20300%20L323%20271%20L328%20242%20L350%20216%20L388%20194%20L436%20177%20L487%20166%20L535%20157%20L574%20148%20L603%20136%20L625%20120%20L644%20100%20L664%2078%20L690%2058%20L722%2043%20L760%2034%20L800%2031%20L841%2033%20L880%2036%20L919%2037%20L958%2036%20L1001%2033%20L1046%2030%20L1092%2030%20L1139%2034%20L1182%2044%20L1220%2060%20L1251%2080%20L1276%20103%20L1295%20128%20L1309%20153%20L1318%20179%20L1320%20205%20L1315%20231%20L1303%20256%20L1286%20279%20L1268%20300Z%22/%3E%3Cpath%20d%3D%22M1308%20300%20L1293%20321%20L1290%20343%20L1300%20367%20L1318%20395%20L1338%20427%20L1352%20462%20L1353%20496%20L1338%20528%20L1308%20553%20L1266%20573%20L1218%20586%20L1166%20594%20L1115%20599%20L1065%20601%20L1016%20601%20L969%20598%20L923%20593%20L880%20584%20L839%20575%20L801%20565%20L764%20557%20L725%20552%20L684%20549%20L640%20547%20L595%20541%20L552%20532%20L515%20516%20L486%20496%20L464%20473%20L447%20448%20L429%20425%20L407%20402%20L378%20380%20L343%20356%20L309%20330%20L282%20300%20L271%20268%20L279%20237%20L309%20209%20L354%20187%20L409%20170%20L464%20158%20L512%20148%20L552%20137%20L582%20124%20L607%20107%20L629%2088%20L653%2067%20L681%2048%20L714%2030%20L751%2014%20L791%20-0%20L834%20-13%20L880%20-24%20L929%20-31%20L979%20-34%20L1029%20-30%20L1076%20-19%20L1117%20-2%20L1153%2020%20L1183%2043%20L1212%2066%20L1240%2086%20L1272%20105%20L1304%20124%20L1335%20144%20L1359%20168%20L1371%20194%20L1369%20222%20L1354%20250%20L1331%20277%20L1308%20300Z%22/%3E%3Cpath%20d%3D%22M1387%20300%20L1387%20326%20L1391%20353%20L1398%20382%20L1403%20413%20L1402%20444%20L1393%20476%20L1376%20506%20L1351%20534%20L1320%20561%20L1284%20585%20L1243%20607%20L1197%20625%20L1146%20638%20L1090%20642%20L1032%20637%20L976%20623%20L925%20603%20L880%20582%20L841%20565%20L804%20555%20L765%20554%20L720%20561%20L667%20571%20L608%20579%20L548%20581%20L493%20574%20L447%20556%20L414%20532%20L390%20503%20L373%20473%20L357%20444%20L339%20417%20L318%20389%20L296%20361%20L278%20331%20L269%20300%20L273%20269%20L290%20238%20L318%20211%20L352%20186%20L389%20164%20L425%20144%20L460%20126%20L495%20108%20L529%2092%20L565%2078%20L602%2065%20L638%2052%20L673%2037%20L708%2020%20L743%20-3%20L782%20-29%20L827%20-56%20L880%20-80%20L938%20-95%20L998%20-97%20L1054%20-86%20L1102%20-62%20L1139%20-29%20L1167%206%20L1189%2038%20L1211%2066%20L1238%2088%20L1270%20106%20L1306%20123%20L1341%20142%20L1371%20164%20L1390%20190%20L1398%20218%20L1397%20246%20L1391%20273%20L1387%20300Z%22/%3E%3Cpath%20d%3D%22M368%20620%20L373%20626%20L376%20633%20L377%20640%20L374%20647%20L368%20653%20L361%20658%20L353%20663%20L344%20667%20L334%20670%20L324%20672%20L313%20673%20L302%20673%20L291%20673%20L282%20672%20L274%20673%20L266%20675%20L259%20678%20L250%20682%20L240%20685%20L230%20688%20L219%20689%20L208%20688%20L199%20685%20L191%20681%20L183%20676%20L177%20672%20L169%20668%20L161%20664%20L151%20661%20L142%20657%20L134%20652%20L129%20646%20L127%20639%20L129%20633%20L134%20626%20L141%20620%20L147%20615%20L153%20610%20L157%20605%20L161%20601%20L163%20596%20L165%20591%20L167%20586%20L170%20580%20L174%20575%20L178%20569%20L183%20563%20L188%20557%20L196%20551%20L205%20546%20L215%20543%20L227%20542%20L239%20544%20L250%20547%20L260%20552%20L269%20556%20L277%20560%20L286%20562%20L294%20564%20L304%20565%20L314%20566%20L322%20569%20L330%20573%20L335%20578%20L337%20584%20L339%20590%20L340%20595%20L342%20600%20L346%20605%20L353%20609%20L360%20614%20L368%20620Z%22/%3E%3Cpath%20d%3D%22M420%20620%20L419%20629%20L416%20637%20L413%20646%20L409%20654%20L406%20663%20L401%20672%20L394%20680%20L384%20687%20L371%20692%20L355%20694%20L337%20694%20L320%20692%20L305%20690%20L292%20689%20L282%20691%20L272%20695%20L262%20701%20L250%20708%20L236%20715%20L220%20720%20L204%20722%20L188%20721%20L174%20717%20L161%20711%20L150%20705%20L140%20698%20L130%20691%20L121%20684%20L113%20677%20L107%20669%20L103%20661%20L101%20652%20L101%20644%20L101%20636%20L102%20628%20L102%20620%20L102%20612%20L103%20605%20L105%20597%20L110%20590%20L117%20583%20L125%20577%20L133%20571%20L140%20565%20L145%20558%20L150%20549%20L155%20539%20L161%20529%20L171%20519%20L184%20512%20L199%20508%20L217%20509%20L234%20513%20L250%20520%20L264%20527%20L276%20534%20L286%20540%20L297%20543%20L308%20546%20L320%20548%20L333%20550%20L344%20553%20L355%20558%20L365%20563%20L374%20569%20L383%20575%20L392%20581%20L400%20588%20L408%20595%20L415%20603%20L419%20611%20L420%20620Z%22/%3E%3Cpath%20d%3D%22M475%20620%20L464%20631%20L453%20641%20L445%20651%20L439%20661%20L435%20671%20L431%20682%20L424%20692%20L413%20701%20L398%20708%20L380%20712%20L360%20713%20L341%20714%20L324%20714%20L309%20716%20L295%20720%20L281%20725%20L266%20731%20L250%20738%20L232%20743%20L212%20746%20L192%20748%20L172%20747%20L152%20745%20L132%20741%20L113%20736%20L97%20728%20L85%20718%20L77%20706%20L75%20693%20L77%20679%20L81%20667%20L84%20656%20L85%20646%20L82%20638%20L74%20629%20L64%20620%20L55%20610%20L49%20599%20L48%20588%20L53%20578%20L63%20568%20L75%20560%20L88%20553%20L99%20545%20L108%20536%20L116%20525%20L125%20514%20L136%20503%20L151%20494%20L169%20487%20L189%20485%20L210%20486%20L231%20489%20L250%20494%20L268%20501%20L284%20507%20L299%20513%20L312%20519%20L325%20525%20L337%20531%20L349%20536%20L361%20542%20L375%20546%20L392%20550%20L411%20553%20L432%20558%20L453%20564%20L470%20573%20L482%20583%20L486%20595%20L483%20608%20L475%20620Z%22/%3E%3Cpath%20d%3D%22M529%20620%20L514%20634%20L499%20646%20L486%20657%20L474%20668%20L464%20679%20L452%20689%20L440%20699%20L426%20708%20L411%20715%20L396%20723%20L381%20731%20L366%20739%20L350%20748%20L333%20756%20L315%20763%20L294%20768%20L272%20770%20L250%20771%20L228%20770%20L206%20769%20L183%20768%20L159%20768%20L133%20768%20L107%20767%20L82%20762%20L61%20754%20L46%20741%20L40%20725%20L41%20707%20L47%20689%20L55%20674%20L60%20661%20L59%20650%20L53%20641%20L41%20631%20L26%20620%20L13%20608%20L4%20594%20L1%20580%20L2%20567%20L8%20553%20L18%20540%20L29%20528%20L41%20516%20L56%20505%20L73%20495%20L93%20487%20L115%20481%20L138%20478%20L162%20476%20L185%20475%20L207%20475%20L228%20474%20L250%20473%20L272%20473%20L293%20476%20L313%20481%20L331%20489%20L345%20499%20L358%20509%20L370%20519%20L383%20526%20L401%20530%20L424%20533%20L452%20536%20L482%20541%20L510%20548%20L532%20559%20L544%20573%20L547%20589%20L541%20605%20L529%20620Z%22/%3E%3Cpath%20d%3D%22M577%20620%20L568%20636%20L555%20652%20L539%20666%20L519%20678%20L496%20688%20L472%20696%20L451%20703%20L433%20711%20L420%20721%20L410%20733%20L403%20749%20L393%20767%20L380%20785%20L361%20800%20L336%20810%20L308%20815%20L279%20813%20L250%20808%20L223%20802%20L198%20796%20L172%20793%20L145%20790%20L118%20788%20L90%20785%20L64%20778%20L42%20767%20L27%20752%20L19%20735%20L15%20718%20L14%20701%20L14%20685%20L11%20672%20L6%20659%20L-1%20646%20L-9%20633%20L-17%20620%20L-24%20606%20L-30%20591%20L-35%20575%20L-39%20558%20L-42%20539%20L-42%20520%20L-36%20501%20L-22%20485%20L-0%20472%20L29%20464%20L62%20461%20L96%20462%20L129%20466%20L157%20469%20L182%20470%20L205%20468%20L227%20463%20L250%20456%20L275%20451%20L301%20450%20L326%20453%20L349%20459%20L369%20469%20L387%20480%20L405%20489%20L424%20497%20L447%20503%20L474%20509%20L502%20516%20L529%20525%20L552%20537%20L569%20551%20L580%20568%20L584%20585%20L583%20603%20L577%20620Z%22/%3E%3Cpath%20d%3D%22M613%20620%20L614%20639%20L607%20657%20L589%20674%20L564%20688%20L533%20698%20L502%20706%20L475%20713%20L456%20722%20L444%20735%20L437%20752%20L431%20773%20L421%20796%20L405%20818%20L382%20835%20L353%20847%20L319%20852%20L284%20852%20L250%20849%20L217%20842%20L186%20835%20L156%20827%20L129%20818%20L103%20807%20L80%20794%20L61%20780%20L44%20766%20L28%20752%20L12%20738%20L-5%20726%20L-24%20714%20L-42%20701%20L-59%20687%20L-70%20671%20L-76%20654%20L-76%20637%20L-72%20620%20L-69%20603%20L-69%20587%20L-73%20569%20L-81%20549%20L-89%20526%20L-92%20503%20L-87%20480%20L-70%20461%20L-41%20447%20L-4%20441%20L37%20440%20L78%20444%20L116%20449%20L148%20453%20L175%20454%20L200%20452%20L225%20448%20L250%20442%20L277%20438%20L305%20435%20L334%20434%20L363%20436%20L393%20439%20L423%20442%20L454%20447%20L484%20454%20L513%20464%20L538%20477%20L557%20493%20L570%20510%20L579%20529%20L586%20548%20L592%20566%20L599%20583%20L607%20601%20L613%20620Z%22/%3E%3C/svg%3E") right -120px center/min(1400px,110vw) auto no-repeat}
.intro .proof{box-shadow:0 1px 0 rgba(255,255,255,.6) inset,0 20px 40px -32px rgba(0,0,0,.25)}
main > .intro + .work{margin-top:0 !important}
@media (max-width: 820px){ .intro::before,.intro::after{top:-170px;bottom:-48px} .intro::after{background-position:left 40% center;-webkit-mask-image:none;mask-image:none;opacity:.7} }

/* subtle highlights: no card */
.intro .proof{background:none;border:0;border-radius:0;box-shadow:none;gap:0;overflow:visible;border-top:1px solid var(--line);padding-top:18px}
.intro .proof li{background:none;padding:0 20px;border-left:1px solid var(--line)}
.intro .proof li:first-child{padding-left:0;border-left:0}
.intro .proof b{font-size:14px}
.intro .proof span{font-size:13px}
@media (max-width: 820px){ .intro .proof{row-gap:16px} .intro .proof li{padding:0 12px} .intro .proof li:nth-child(odd){padding-left:0;border-left:0} .intro .proof li:last-child{border-left:0;padding-left:0} }

/* keep contour lines away from text */
.intro::after{-webkit-mask-image:radial-gradient(ellipse 38% 70% at 92% 35%,#000 20%,transparent 72%) !important;mask-image:radial-gradient(ellipse 38% 70% at 92% 35%,#000 20%,transparent 72%) !important;opacity:.85}
@media (max-width: 820px){ .intro::after{opacity:.35 !important;-webkit-mask-image:radial-gradient(ellipse 70% 40% at 90% 12%,#000 20%,transparent 75%) !important;mask-image:radial-gradient(ellipse 70% 40% at 90% 12%,#000 20%,transparent 75%) !important} }
/* prominent centered tabs */
.tabs-wrap{display:flex;justify-content:center;padding-top:14px !important;padding-bottom:14px !important}
.tabs{padding:6px !important;gap:6px !important;border:1px solid var(--line);font-size:16px !important;box-shadow:0 10px 30px -18px rgba(0,0,0,.25)}
.tabs button{padding:13px 22px !important;color:var(--ink) !important;opacity:.72}
.tabs button:hover{opacity:1;background:var(--paper)}
.tabs button[aria-current="true"]{opacity:1;background:var(--ink) !important;color:var(--paper) !important;box-shadow:0 6px 16px -8px rgba(0,0,0,.45) !important}
.tabs button[aria-current="true"] .ct{background:var(--paper) !important;color:var(--ink) !important}
.tabs button .ct{background:var(--line)}
.panel{padding-top:40px;scroll-margin-top:92px}
.panel + .panel{margin-top:72px;padding-top:72px;border-top:1px solid var(--line)}
.tabs button{scroll-margin-inline:24px}
@media (max-width: 820px){ .tabs-wrap{justify-content:flex-start} .tabs{font-size:15px !important} .tabs button{padding:11px 16px !important} }
.panel > .plead{justify-content:center;text-align:center}

/* glass sticky tabs */
.tabs-wrap{background:transparent !important;top:16px !important;pointer-events:none;border:0 !important}
.tabs{pointer-events:auto;background:rgba(242,242,240,.62) !important;-webkit-backdrop-filter:blur(18px) saturate(1.6);backdrop-filter:blur(18px) saturate(1.6);border:1px solid rgba(255,255,255,.7) !important;box-shadow:0 1px 0 rgba(255,255,255,.8) inset,0 12px 32px -16px rgba(0,0,0,.28),0 0 0 1px rgba(0,0,0,.05) !important}
:root[data-theme="dark"] .tabs{background:rgba(30,30,34,.55) !important;border-color:rgba(255,255,255,.08) !important;box-shadow:0 1px 0 rgba(255,255,255,.06) inset,0 12px 32px -16px rgba(0,0,0,.6) !important}
.tabs button:hover{background:rgba(255,255,255,.55)}
:root[data-theme="dark"] .tabs button:hover{background:rgba(255,255,255,.06)}
/* interactive hero: map light follows cursor */
.hero-fx{position:absolute;z-index:-1;pointer-events:none;top:-190px;bottom:-63px;left:calc(50% - 50vw);right:calc(50% - 50vw);
  background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%201400%20760%22%20fill%3D%22none%22%20stroke%3D%22%23A89F8E%22%20stroke-width%3D%221.3%22%3E%3Cpath%20d%3D%22M984%20300%20L989%20306%20L991%20312%20L991%20318%20L989%20323%20L984%20329%20L978%20334%20L971%20338%20L963%20341%20L954%20344%20L945%20346%20L935%20347%20L926%20347%20L917%20346%20L908%20346%20L901%20347%20L894%20348%20L888%20351%20L880%20354%20L871%20358%20L862%20360%20L852%20361%20L843%20360%20L835%20358%20L828%20354%20L821%20350%20L815%20346%20L809%20342%20L801%20339%20L793%20336%20L785%20332%20L778%20328%20L773%20323%20L772%20317%20L774%20311%20L778%20305%20L784%20300%20L790%20295%20L795%20291%20L798%20287%20L801%20283%20L803%20279%20L805%20274%20L807%20270%20L810%20265%20L813%20260%20L816%20255%20L821%20250%20L826%20244%20L832%20239%20L840%20235%20L849%20232%20L860%20232%20L870%20233%20L880%20236%20L889%20240%20L897%20244%20L904%20247%20L911%20249%20L919%20250%20L927%20251%20L936%20253%20L944%20255%20L950%20258%20L955%20263%20L957%20268%20L958%20273%20L959%20278%20L961%20282%20L965%20287%20L970%20291%20L977%20295%20L984%20300Z%22/%3E%3Cpath%20d%3D%22M1036%20300%20L1035%20308%20L1032%20316%20L1029%20324%20L1026%20331%20L1022%20339%20L1018%20347%20L1012%20355%20L1003%20361%20L990%20365%20L976%20368%20L960%20368%20L944%20366%20L930%20364%20L919%20363%20L909%20365%20L900%20368%20L891%20374%20L880%20381%20L867%20387%20L853%20392%20L838%20393%20L823%20392%20L810%20389%20L799%20384%20L788%20378%20L779%20371%20L770%20365%20L762%20359%20L755%20352%20L749%20345%20L745%20337%20L744%20329%20L743%20322%20L744%20314%20L744%20307%20L744%20300%20L744%20293%20L745%20286%20L747%20279%20L752%20272%20L758%20266%20L765%20261%20L773%20256%20L779%20250%20L784%20243%20L788%20235%20L793%20226%20L799%20216%20L807%20208%20L819%20201%20L834%20198%20L850%20198%20L866%20202%20L880%20208%20L893%20215%20L903%20221%20L913%20226%20L923%20230%20L933%20232%20L944%20234%20L956%20236%20L966%20239%20L976%20243%20L985%20248%20L993%20253%20L1002%20258%20L1010%20264%20L1018%20270%20L1025%20277%20L1031%20284%20L1035%20292%20L1036%20300Z%22/%3E%3Cpath%20d%3D%22M1090%20300%20L1080%20310%20L1070%20320%20L1062%20329%20L1057%20338%20L1053%20348%20L1049%20358%20L1043%20367%20L1032%20376%20L1018%20382%20L1001%20386%20L983%20387%20L965%20387%20L949%20388%20L935%20390%20L922%20393%20L909%20398%20L895%20404%20L880%20410%20L863%20415%20L845%20418%20L826%20419%20L807%20419%20L788%20417%20L770%20413%20L752%20408%20L737%20401%20L726%20391%20L719%20380%20L716%20368%20L718%20355%20L722%20344%20L725%20333%20L726%20324%20L723%20316%20L716%20309%20L707%20300%20L698%20291%20L692%20280%20L692%20270%20L696%20260%20L705%20252%20L717%20244%20L728%20237%20L739%20230%20L747%20221%20L755%20211%20L763%20201%20L773%20191%20L787%20182%20L804%20176%20L823%20174%20L843%20174%20L862%20178%20L880%20183%20L896%20188%20L912%20194%20L925%20200%20L938%20205%20L950%20211%20L961%20217%20L972%20222%20L984%20227%20L997%20231%20L1012%20234%20L1030%20238%20L1050%20242%20L1069%20248%20L1086%20256%20L1096%20266%20L1100%20277%20L1098%20289%20L1090%20300Z%22/%3E%3Cpath%20d%3D%22M1144%20300%20L1130%20313%20L1115%20325%20L1103%20335%20L1092%20346%20L1082%20356%20L1072%20366%20L1060%20375%20L1047%20383%20L1032%20390%20L1018%20397%20L1004%20405%20L990%20413%20L975%20421%20L959%20429%20L941%20435%20L922%20440%20L901%20442%20L880%20443%20L859%20442%20L838%20441%20L817%20440%20L794%20440%20L770%20440%20L745%20439%20L721%20435%20L701%20427%20L687%20414%20L681%20399%20L682%20382%20L688%20366%20L695%20351%20L700%20339%20L700%20329%20L693%20320%20L682%20310%20L668%20300%20L656%20288%20L648%20276%20L644%20263%20L646%20249%20L651%20237%20L660%20225%20L671%20213%20L683%20202%20L696%20191%20L713%20182%20L731%20174%20L752%20169%20L774%20165%20L796%20164%20L818%20163%20L839%20163%20L860%20162%20L880%20161%20L900%20161%20L921%20163%20L940%20168%20L956%20176%20L970%20185%20L982%20195%20L993%20204%20L1006%20211%20L1023%20215%20L1045%20218%20L1071%20221%20L1100%20225%20L1126%20232%20L1147%20242%20L1159%20256%20L1161%20271%20L1155%20286%20L1144%20300Z%22/%3E%3Cpath%20d%3D%22M1192%20300%20L1184%20316%20L1172%20330%20L1156%20344%20L1137%20355%20L1115%20365%20L1092%20373%20L1072%20380%20L1055%20387%20L1042%20396%20L1033%20408%20L1026%20423%20L1017%20441%20L1004%20458%20L986%20472%20L962%20482%20L935%20486%20L907%20485%20L880%20480%20L854%20474%20L830%20468%20L806%20465%20L780%20463%20L754%20461%20L727%20457%20L702%20450%20L682%20440%20L667%20426%20L659%20410%20L656%20393%20L655%20377%20L654%20362%20L652%20349%20L647%20337%20L640%20325%20L633%20313%20L625%20300%20L619%20286%20L613%20272%20L608%20257%20L604%20240%20L601%20223%20L601%20205%20L607%20187%20L620%20171%20L641%20158%20L669%20151%20L701%20148%20L733%20150%20L764%20153%20L792%20156%20L815%20157%20L837%20155%20L858%20150%20L880%20144%20L904%20139%20L928%20137%20L952%20140%20L974%20147%20L993%20156%20L1010%20166%20L1028%20175%20L1046%20183%20L1068%20188%20L1093%20194%20L1120%20200%20L1146%20209%20L1168%20220%20L1185%20234%20L1195%20250%20L1199%20267%20L1198%20284%20L1192%20300Z%22/%3E%3Cpath%20d%3D%22M1229%20300%20L1230%20318%20L1223%20336%20L1206%20352%20L1181%20365%20L1152%20375%20L1122%20383%20L1096%20390%20L1078%20398%20L1066%20410%20L1060%20427%20L1054%20447%20L1045%20469%20L1029%20490%20L1007%20507%20L979%20518%20L946%20523%20L913%20523%20L880%20520%20L848%20514%20L819%20507%20L790%20499%20L763%20490%20L739%20479%20L717%20467%20L698%20454%20L682%20440%20L667%20426%20L652%20414%20L635%20402%20L617%20390%20L599%20378%20L583%20364%20L572%20349%20L567%20333%20L567%20316%20L570%20300%20L574%20284%20L574%20268%20L570%20251%20L562%20231%20L554%20210%20L551%20187%20L556%20166%20L573%20147%20L600%20134%20L636%20128%20L676%20127%20L715%20131%20L751%20136%20L782%20140%20L808%20141%20L832%20139%20L856%20134%20L880%20129%20L906%20125%20L933%20122%20L961%20122%20L989%20123%20L1017%20126%20L1046%20129%20L1076%20134%20L1105%20141%20L1133%20150%20L1156%20163%20L1175%20178%20L1188%20195%20L1196%20213%20L1203%20230%20L1209%20248%20L1216%20265%20L1223%20282%20L1229%20300Z%22/%3E%3Cpath%20d%3D%22M1249%20300%20L1253%20319%20L1249%20339%20L1235%20356%20L1215%20372%20L1191%20386%20L1168%20399%20L1148%20411%20L1132%20425%20L1119%20441%20L1106%20459%20L1091%20478%20L1071%20496%20L1048%20513%20L1019%20527%20L988%20538%20L953%20547%20L917%20553%20L880%20556%20L842%20555%20L806%20549%20L773%20537%20L745%20519%20L724%20498%20L709%20475%20L697%20455%20L685%20438%20L668%20426%20L644%20418%20L613%20411%20L578%20403%20L544%20393%20L516%20378%20L498%20361%20L490%20341%20L492%20320%20L498%20300%20L505%20281%20L509%20261%20L510%20241%20L510%20220%20L511%20198%20L518%20176%20L533%20156%20L557%20139%20L588%20127%20L623%20119%20L660%20114%20L696%20111%20L730%20110%20L763%20109%20L793%20109%20L823%20109%20L852%20110%20L880%20111%20L908%20112%20L936%20111%20L967%20107%20L1002%20101%20L1042%2095%20L1084%2090%20L1128%2090%20L1167%2097%20L1198%20111%20L1219%20132%20L1228%20156%20L1228%20181%20L1224%20205%20L1221%20226%20L1223%20246%20L1230%20263%20L1240%20281%20L1249%20300Z%22/%3E%3Cpath%20d%3D%22M1256%20300%20L1253%20319%20L1248%20338%20L1243%20358%20L1238%20377%20L1234%20398%20L1230%20420%20L1223%20442%20L1212%20465%20L1193%20485%20L1167%20502%20L1135%20515%20L1099%20525%20L1063%20533%20L1028%20541%20L993%20550%20L958%20561%20L920%20573%20L880%20581%20L838%20584%20L797%20578%20L761%20563%20L732%20541%20L711%20515%20L696%20489%20L683%20467%20L667%20450%20L646%20439%20L616%20431%20L579%20425%20L540%20416%20L502%20404%20L470%20388%20L445%20369%20L428%20347%20L418%20324%20L414%20300%20L414%20276%20L418%20252%20L429%20228%20L446%20206%20L471%20187%20L500%20170%20L533%20156%20L566%20144%20L597%20132%20L625%20120%20L651%20106%20L678%2093%20L707%2080%20L740%2072%20L775%2068%20L811%2070%20L847%2075%20L880%2082%20L912%2087%20L944%2087%20L979%2081%20L1020%2072%20L1067%2063%20L1117%2057%20L1166%2058%20L1209%2068%20L1241%2086%20L1261%20110%20L1270%20138%20L1270%20167%20L1266%20193%20L1261%20218%20L1259%20240%20L1258%20261%20L1258%20280%20L1256%20300Z%22/%3E%3Cpath%20d%3D%22M1268%20300%20L1254%20319%20L1248%20338%20L1253%20359%20L1266%20383%20L1282%20411%20L1296%20442%20L1300%20474%20L1290%20504%20L1264%20528%20L1226%20544%20L1179%20553%20L1131%20558%20L1085%20560%20L1042%20563%20L1002%20569%20L962%20577%20L922%20584%20L880%20589%20L837%20589%20L796%20581%20L759%20568%20L726%20551%20L698%20532%20L672%20514%20L646%20498%20L619%20484%20L590%20472%20L560%20459%20L529%20445%20L500%20430%20L471%20413%20L442%20394%20L413%20374%20L383%20352%20L356%20327%20L334%20300%20L323%20271%20L328%20242%20L350%20216%20L388%20194%20L436%20177%20L487%20166%20L535%20157%20L574%20148%20L603%20136%20L625%20120%20L644%20100%20L664%2078%20L690%2058%20L722%2043%20L760%2034%20L800%2031%20L841%2033%20L880%2036%20L919%2037%20L958%2036%20L1001%2033%20L1046%2030%20L1092%2030%20L1139%2034%20L1182%2044%20L1220%2060%20L1251%2080%20L1276%20103%20L1295%20128%20L1309%20153%20L1318%20179%20L1320%20205%20L1315%20231%20L1303%20256%20L1286%20279%20L1268%20300Z%22/%3E%3Cpath%20d%3D%22M1308%20300%20L1293%20321%20L1290%20343%20L1300%20367%20L1318%20395%20L1338%20427%20L1352%20462%20L1353%20496%20L1338%20528%20L1308%20553%20L1266%20573%20L1218%20586%20L1166%20594%20L1115%20599%20L1065%20601%20L1016%20601%20L969%20598%20L923%20593%20L880%20584%20L839%20575%20L801%20565%20L764%20557%20L725%20552%20L684%20549%20L640%20547%20L595%20541%20L552%20532%20L515%20516%20L486%20496%20L464%20473%20L447%20448%20L429%20425%20L407%20402%20L378%20380%20L343%20356%20L309%20330%20L282%20300%20L271%20268%20L279%20237%20L309%20209%20L354%20187%20L409%20170%20L464%20158%20L512%20148%20L552%20137%20L582%20124%20L607%20107%20L629%2088%20L653%2067%20L681%2048%20L714%2030%20L751%2014%20L791%20-0%20L834%20-13%20L880%20-24%20L929%20-31%20L979%20-34%20L1029%20-30%20L1076%20-19%20L1117%20-2%20L1153%2020%20L1183%2043%20L1212%2066%20L1240%2086%20L1272%20105%20L1304%20124%20L1335%20144%20L1359%20168%20L1371%20194%20L1369%20222%20L1354%20250%20L1331%20277%20L1308%20300Z%22/%3E%3Cpath%20d%3D%22M1387%20300%20L1387%20326%20L1391%20353%20L1398%20382%20L1403%20413%20L1402%20444%20L1393%20476%20L1376%20506%20L1351%20534%20L1320%20561%20L1284%20585%20L1243%20607%20L1197%20625%20L1146%20638%20L1090%20642%20L1032%20637%20L976%20623%20L925%20603%20L880%20582%20L841%20565%20L804%20555%20L765%20554%20L720%20561%20L667%20571%20L608%20579%20L548%20581%20L493%20574%20L447%20556%20L414%20532%20L390%20503%20L373%20473%20L357%20444%20L339%20417%20L318%20389%20L296%20361%20L278%20331%20L269%20300%20L273%20269%20L290%20238%20L318%20211%20L352%20186%20L389%20164%20L425%20144%20L460%20126%20L495%20108%20L529%2092%20L565%2078%20L602%2065%20L638%2052%20L673%2037%20L708%2020%20L743%20-3%20L782%20-29%20L827%20-56%20L880%20-80%20L938%20-95%20L998%20-97%20L1054%20-86%20L1102%20-62%20L1139%20-29%20L1167%206%20L1189%2038%20L1211%2066%20L1238%2088%20L1270%20106%20L1306%20123%20L1341%20142%20L1371%20164%20L1390%20190%20L1398%20218%20L1397%20246%20L1391%20273%20L1387%20300Z%22/%3E%3Cpath%20d%3D%22M368%20620%20L373%20626%20L376%20633%20L377%20640%20L374%20647%20L368%20653%20L361%20658%20L353%20663%20L344%20667%20L334%20670%20L324%20672%20L313%20673%20L302%20673%20L291%20673%20L282%20672%20L274%20673%20L266%20675%20L259%20678%20L250%20682%20L240%20685%20L230%20688%20L219%20689%20L208%20688%20L199%20685%20L191%20681%20L183%20676%20L177%20672%20L169%20668%20L161%20664%20L151%20661%20L142%20657%20L134%20652%20L129%20646%20L127%20639%20L129%20633%20L134%20626%20L141%20620%20L147%20615%20L153%20610%20L157%20605%20L161%20601%20L163%20596%20L165%20591%20L167%20586%20L170%20580%20L174%20575%20L178%20569%20L183%20563%20L188%20557%20L196%20551%20L205%20546%20L215%20543%20L227%20542%20L239%20544%20L250%20547%20L260%20552%20L269%20556%20L277%20560%20L286%20562%20L294%20564%20L304%20565%20L314%20566%20L322%20569%20L330%20573%20L335%20578%20L337%20584%20L339%20590%20L340%20595%20L342%20600%20L346%20605%20L353%20609%20L360%20614%20L368%20620Z%22/%3E%3Cpath%20d%3D%22M420%20620%20L419%20629%20L416%20637%20L413%20646%20L409%20654%20L406%20663%20L401%20672%20L394%20680%20L384%20687%20L371%20692%20L355%20694%20L337%20694%20L320%20692%20L305%20690%20L292%20689%20L282%20691%20L272%20695%20L262%20701%20L250%20708%20L236%20715%20L220%20720%20L204%20722%20L188%20721%20L174%20717%20L161%20711%20L150%20705%20L140%20698%20L130%20691%20L121%20684%20L113%20677%20L107%20669%20L103%20661%20L101%20652%20L101%20644%20L101%20636%20L102%20628%20L102%20620%20L102%20612%20L103%20605%20L105%20597%20L110%20590%20L117%20583%20L125%20577%20L133%20571%20L140%20565%20L145%20558%20L150%20549%20L155%20539%20L161%20529%20L171%20519%20L184%20512%20L199%20508%20L217%20509%20L234%20513%20L250%20520%20L264%20527%20L276%20534%20L286%20540%20L297%20543%20L308%20546%20L320%20548%20L333%20550%20L344%20553%20L355%20558%20L365%20563%20L374%20569%20L383%20575%20L392%20581%20L400%20588%20L408%20595%20L415%20603%20L419%20611%20L420%20620Z%22/%3E%3Cpath%20d%3D%22M475%20620%20L464%20631%20L453%20641%20L445%20651%20L439%20661%20L435%20671%20L431%20682%20L424%20692%20L413%20701%20L398%20708%20L380%20712%20L360%20713%20L341%20714%20L324%20714%20L309%20716%20L295%20720%20L281%20725%20L266%20731%20L250%20738%20L232%20743%20L212%20746%20L192%20748%20L172%20747%20L152%20745%20L132%20741%20L113%20736%20L97%20728%20L85%20718%20L77%20706%20L75%20693%20L77%20679%20L81%20667%20L84%20656%20L85%20646%20L82%20638%20L74%20629%20L64%20620%20L55%20610%20L49%20599%20L48%20588%20L53%20578%20L63%20568%20L75%20560%20L88%20553%20L99%20545%20L108%20536%20L116%20525%20L125%20514%20L136%20503%20L151%20494%20L169%20487%20L189%20485%20L210%20486%20L231%20489%20L250%20494%20L268%20501%20L284%20507%20L299%20513%20L312%20519%20L325%20525%20L337%20531%20L349%20536%20L361%20542%20L375%20546%20L392%20550%20L411%20553%20L432%20558%20L453%20564%20L470%20573%20L482%20583%20L486%20595%20L483%20608%20L475%20620Z%22/%3E%3Cpath%20d%3D%22M529%20620%20L514%20634%20L499%20646%20L486%20657%20L474%20668%20L464%20679%20L452%20689%20L440%20699%20L426%20708%20L411%20715%20L396%20723%20L381%20731%20L366%20739%20L350%20748%20L333%20756%20L315%20763%20L294%20768%20L272%20770%20L250%20771%20L228%20770%20L206%20769%20L183%20768%20L159%20768%20L133%20768%20L107%20767%20L82%20762%20L61%20754%20L46%20741%20L40%20725%20L41%20707%20L47%20689%20L55%20674%20L60%20661%20L59%20650%20L53%20641%20L41%20631%20L26%20620%20L13%20608%20L4%20594%20L1%20580%20L2%20567%20L8%20553%20L18%20540%20L29%20528%20L41%20516%20L56%20505%20L73%20495%20L93%20487%20L115%20481%20L138%20478%20L162%20476%20L185%20475%20L207%20475%20L228%20474%20L250%20473%20L272%20473%20L293%20476%20L313%20481%20L331%20489%20L345%20499%20L358%20509%20L370%20519%20L383%20526%20L401%20530%20L424%20533%20L452%20536%20L482%20541%20L510%20548%20L532%20559%20L544%20573%20L547%20589%20L541%20605%20L529%20620Z%22/%3E%3Cpath%20d%3D%22M577%20620%20L568%20636%20L555%20652%20L539%20666%20L519%20678%20L496%20688%20L472%20696%20L451%20703%20L433%20711%20L420%20721%20L410%20733%20L403%20749%20L393%20767%20L380%20785%20L361%20800%20L336%20810%20L308%20815%20L279%20813%20L250%20808%20L223%20802%20L198%20796%20L172%20793%20L145%20790%20L118%20788%20L90%20785%20L64%20778%20L42%20767%20L27%20752%20L19%20735%20L15%20718%20L14%20701%20L14%20685%20L11%20672%20L6%20659%20L-1%20646%20L-9%20633%20L-17%20620%20L-24%20606%20L-30%20591%20L-35%20575%20L-39%20558%20L-42%20539%20L-42%20520%20L-36%20501%20L-22%20485%20L-0%20472%20L29%20464%20L62%20461%20L96%20462%20L129%20466%20L157%20469%20L182%20470%20L205%20468%20L227%20463%20L250%20456%20L275%20451%20L301%20450%20L326%20453%20L349%20459%20L369%20469%20L387%20480%20L405%20489%20L424%20497%20L447%20503%20L474%20509%20L502%20516%20L529%20525%20L552%20537%20L569%20551%20L580%20568%20L584%20585%20L583%20603%20L577%20620Z%22/%3E%3Cpath%20d%3D%22M613%20620%20L614%20639%20L607%20657%20L589%20674%20L564%20688%20L533%20698%20L502%20706%20L475%20713%20L456%20722%20L444%20735%20L437%20752%20L431%20773%20L421%20796%20L405%20818%20L382%20835%20L353%20847%20L319%20852%20L284%20852%20L250%20849%20L217%20842%20L186%20835%20L156%20827%20L129%20818%20L103%20807%20L80%20794%20L61%20780%20L44%20766%20L28%20752%20L12%20738%20L-5%20726%20L-24%20714%20L-42%20701%20L-59%20687%20L-70%20671%20L-76%20654%20L-76%20637%20L-72%20620%20L-69%20603%20L-69%20587%20L-73%20569%20L-81%20549%20L-89%20526%20L-92%20503%20L-87%20480%20L-70%20461%20L-41%20447%20L-4%20441%20L37%20440%20L78%20444%20L116%20449%20L148%20453%20L175%20454%20L200%20452%20L225%20448%20L250%20442%20L277%20438%20L305%20435%20L334%20434%20L363%20436%20L393%20439%20L423%20442%20L454%20447%20L484%20454%20L513%20464%20L538%20477%20L557%20493%20L570%20510%20L579%20529%20L586%20548%20L592%20566%20L599%20583%20L607%20601%20L613%20620Z%22/%3E%3C/svg%3E") right -120px center/min(1400px,110vw) auto no-repeat;
  -webkit-mask-image:radial-gradient(circle 260px at var(--mx,-999px) var(--my,-999px),#000 0%,rgba(0,0,0,.5) 45%,transparent 75%);
  mask-image:radial-gradient(circle 260px at var(--mx,-999px) var(--my,-999px),#000 0%,rgba(0,0,0,.5) 45%,transparent 75%);
  opacity:0;transition:opacity .4s ease}
.intro.lit .hero-fx{opacity:.7}
:root[data-theme="dark"] .hero-fx{background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%201400%20760%22%20fill%3D%22none%22%20stroke%3D%22%235C5C66%22%20stroke-width%3D%221.3%22%3E%3Cpath%20d%3D%22M984%20300%20L989%20306%20L991%20312%20L991%20318%20L989%20323%20L984%20329%20L978%20334%20L971%20338%20L963%20341%20L954%20344%20L945%20346%20L935%20347%20L926%20347%20L917%20346%20L908%20346%20L901%20347%20L894%20348%20L888%20351%20L880%20354%20L871%20358%20L862%20360%20L852%20361%20L843%20360%20L835%20358%20L828%20354%20L821%20350%20L815%20346%20L809%20342%20L801%20339%20L793%20336%20L785%20332%20L778%20328%20L773%20323%20L772%20317%20L774%20311%20L778%20305%20L784%20300%20L790%20295%20L795%20291%20L798%20287%20L801%20283%20L803%20279%20L805%20274%20L807%20270%20L810%20265%20L813%20260%20L816%20255%20L821%20250%20L826%20244%20L832%20239%20L840%20235%20L849%20232%20L860%20232%20L870%20233%20L880%20236%20L889%20240%20L897%20244%20L904%20247%20L911%20249%20L919%20250%20L927%20251%20L936%20253%20L944%20255%20L950%20258%20L955%20263%20L957%20268%20L958%20273%20L959%20278%20L961%20282%20L965%20287%20L970%20291%20L977%20295%20L984%20300Z%22/%3E%3Cpath%20d%3D%22M1036%20300%20L1035%20308%20L1032%20316%20L1029%20324%20L1026%20331%20L1022%20339%20L1018%20347%20L1012%20355%20L1003%20361%20L990%20365%20L976%20368%20L960%20368%20L944%20366%20L930%20364%20L919%20363%20L909%20365%20L900%20368%20L891%20374%20L880%20381%20L867%20387%20L853%20392%20L838%20393%20L823%20392%20L810%20389%20L799%20384%20L788%20378%20L779%20371%20L770%20365%20L762%20359%20L755%20352%20L749%20345%20L745%20337%20L744%20329%20L743%20322%20L744%20314%20L744%20307%20L744%20300%20L744%20293%20L745%20286%20L747%20279%20L752%20272%20L758%20266%20L765%20261%20L773%20256%20L779%20250%20L784%20243%20L788%20235%20L793%20226%20L799%20216%20L807%20208%20L819%20201%20L834%20198%20L850%20198%20L866%20202%20L880%20208%20L893%20215%20L903%20221%20L913%20226%20L923%20230%20L933%20232%20L944%20234%20L956%20236%20L966%20239%20L976%20243%20L985%20248%20L993%20253%20L1002%20258%20L1010%20264%20L1018%20270%20L1025%20277%20L1031%20284%20L1035%20292%20L1036%20300Z%22/%3E%3Cpath%20d%3D%22M1090%20300%20L1080%20310%20L1070%20320%20L1062%20329%20L1057%20338%20L1053%20348%20L1049%20358%20L1043%20367%20L1032%20376%20L1018%20382%20L1001%20386%20L983%20387%20L965%20387%20L949%20388%20L935%20390%20L922%20393%20L909%20398%20L895%20404%20L880%20410%20L863%20415%20L845%20418%20L826%20419%20L807%20419%20L788%20417%20L770%20413%20L752%20408%20L737%20401%20L726%20391%20L719%20380%20L716%20368%20L718%20355%20L722%20344%20L725%20333%20L726%20324%20L723%20316%20L716%20309%20L707%20300%20L698%20291%20L692%20280%20L692%20270%20L696%20260%20L705%20252%20L717%20244%20L728%20237%20L739%20230%20L747%20221%20L755%20211%20L763%20201%20L773%20191%20L787%20182%20L804%20176%20L823%20174%20L843%20174%20L862%20178%20L880%20183%20L896%20188%20L912%20194%20L925%20200%20L938%20205%20L950%20211%20L961%20217%20L972%20222%20L984%20227%20L997%20231%20L1012%20234%20L1030%20238%20L1050%20242%20L1069%20248%20L1086%20256%20L1096%20266%20L1100%20277%20L1098%20289%20L1090%20300Z%22/%3E%3Cpath%20d%3D%22M1144%20300%20L1130%20313%20L1115%20325%20L1103%20335%20L1092%20346%20L1082%20356%20L1072%20366%20L1060%20375%20L1047%20383%20L1032%20390%20L1018%20397%20L1004%20405%20L990%20413%20L975%20421%20L959%20429%20L941%20435%20L922%20440%20L901%20442%20L880%20443%20L859%20442%20L838%20441%20L817%20440%20L794%20440%20L770%20440%20L745%20439%20L721%20435%20L701%20427%20L687%20414%20L681%20399%20L682%20382%20L688%20366%20L695%20351%20L700%20339%20L700%20329%20L693%20320%20L682%20310%20L668%20300%20L656%20288%20L648%20276%20L644%20263%20L646%20249%20L651%20237%20L660%20225%20L671%20213%20L683%20202%20L696%20191%20L713%20182%20L731%20174%20L752%20169%20L774%20165%20L796%20164%20L818%20163%20L839%20163%20L860%20162%20L880%20161%20L900%20161%20L921%20163%20L940%20168%20L956%20176%20L970%20185%20L982%20195%20L993%20204%20L1006%20211%20L1023%20215%20L1045%20218%20L1071%20221%20L1100%20225%20L1126%20232%20L1147%20242%20L1159%20256%20L1161%20271%20L1155%20286%20L1144%20300Z%22/%3E%3Cpath%20d%3D%22M1192%20300%20L1184%20316%20L1172%20330%20L1156%20344%20L1137%20355%20L1115%20365%20L1092%20373%20L1072%20380%20L1055%20387%20L1042%20396%20L1033%20408%20L1026%20423%20L1017%20441%20L1004%20458%20L986%20472%20L962%20482%20L935%20486%20L907%20485%20L880%20480%20L854%20474%20L830%20468%20L806%20465%20L780%20463%20L754%20461%20L727%20457%20L702%20450%20L682%20440%20L667%20426%20L659%20410%20L656%20393%20L655%20377%20L654%20362%20L652%20349%20L647%20337%20L640%20325%20L633%20313%20L625%20300%20L619%20286%20L613%20272%20L608%20257%20L604%20240%20L601%20223%20L601%20205%20L607%20187%20L620%20171%20L641%20158%20L669%20151%20L701%20148%20L733%20150%20L764%20153%20L792%20156%20L815%20157%20L837%20155%20L858%20150%20L880%20144%20L904%20139%20L928%20137%20L952%20140%20L974%20147%20L993%20156%20L1010%20166%20L1028%20175%20L1046%20183%20L1068%20188%20L1093%20194%20L1120%20200%20L1146%20209%20L1168%20220%20L1185%20234%20L1195%20250%20L1199%20267%20L1198%20284%20L1192%20300Z%22/%3E%3Cpath%20d%3D%22M1229%20300%20L1230%20318%20L1223%20336%20L1206%20352%20L1181%20365%20L1152%20375%20L1122%20383%20L1096%20390%20L1078%20398%20L1066%20410%20L1060%20427%20L1054%20447%20L1045%20469%20L1029%20490%20L1007%20507%20L979%20518%20L946%20523%20L913%20523%20L880%20520%20L848%20514%20L819%20507%20L790%20499%20L763%20490%20L739%20479%20L717%20467%20L698%20454%20L682%20440%20L667%20426%20L652%20414%20L635%20402%20L617%20390%20L599%20378%20L583%20364%20L572%20349%20L567%20333%20L567%20316%20L570%20300%20L574%20284%20L574%20268%20L570%20251%20L562%20231%20L554%20210%20L551%20187%20L556%20166%20L573%20147%20L600%20134%20L636%20128%20L676%20127%20L715%20131%20L751%20136%20L782%20140%20L808%20141%20L832%20139%20L856%20134%20L880%20129%20L906%20125%20L933%20122%20L961%20122%20L989%20123%20L1017%20126%20L1046%20129%20L1076%20134%20L1105%20141%20L1133%20150%20L1156%20163%20L1175%20178%20L1188%20195%20L1196%20213%20L1203%20230%20L1209%20248%20L1216%20265%20L1223%20282%20L1229%20300Z%22/%3E%3Cpath%20d%3D%22M1249%20300%20L1253%20319%20L1249%20339%20L1235%20356%20L1215%20372%20L1191%20386%20L1168%20399%20L1148%20411%20L1132%20425%20L1119%20441%20L1106%20459%20L1091%20478%20L1071%20496%20L1048%20513%20L1019%20527%20L988%20538%20L953%20547%20L917%20553%20L880%20556%20L842%20555%20L806%20549%20L773%20537%20L745%20519%20L724%20498%20L709%20475%20L697%20455%20L685%20438%20L668%20426%20L644%20418%20L613%20411%20L578%20403%20L544%20393%20L516%20378%20L498%20361%20L490%20341%20L492%20320%20L498%20300%20L505%20281%20L509%20261%20L510%20241%20L510%20220%20L511%20198%20L518%20176%20L533%20156%20L557%20139%20L588%20127%20L623%20119%20L660%20114%20L696%20111%20L730%20110%20L763%20109%20L793%20109%20L823%20109%20L852%20110%20L880%20111%20L908%20112%20L936%20111%20L967%20107%20L1002%20101%20L1042%2095%20L1084%2090%20L1128%2090%20L1167%2097%20L1198%20111%20L1219%20132%20L1228%20156%20L1228%20181%20L1224%20205%20L1221%20226%20L1223%20246%20L1230%20263%20L1240%20281%20L1249%20300Z%22/%3E%3Cpath%20d%3D%22M1256%20300%20L1253%20319%20L1248%20338%20L1243%20358%20L1238%20377%20L1234%20398%20L1230%20420%20L1223%20442%20L1212%20465%20L1193%20485%20L1167%20502%20L1135%20515%20L1099%20525%20L1063%20533%20L1028%20541%20L993%20550%20L958%20561%20L920%20573%20L880%20581%20L838%20584%20L797%20578%20L761%20563%20L732%20541%20L711%20515%20L696%20489%20L683%20467%20L667%20450%20L646%20439%20L616%20431%20L579%20425%20L540%20416%20L502%20404%20L470%20388%20L445%20369%20L428%20347%20L418%20324%20L414%20300%20L414%20276%20L418%20252%20L429%20228%20L446%20206%20L471%20187%20L500%20170%20L533%20156%20L566%20144%20L597%20132%20L625%20120%20L651%20106%20L678%2093%20L707%2080%20L740%2072%20L775%2068%20L811%2070%20L847%2075%20L880%2082%20L912%2087%20L944%2087%20L979%2081%20L1020%2072%20L1067%2063%20L1117%2057%20L1166%2058%20L1209%2068%20L1241%2086%20L1261%20110%20L1270%20138%20L1270%20167%20L1266%20193%20L1261%20218%20L1259%20240%20L1258%20261%20L1258%20280%20L1256%20300Z%22/%3E%3Cpath%20d%3D%22M1268%20300%20L1254%20319%20L1248%20338%20L1253%20359%20L1266%20383%20L1282%20411%20L1296%20442%20L1300%20474%20L1290%20504%20L1264%20528%20L1226%20544%20L1179%20553%20L1131%20558%20L1085%20560%20L1042%20563%20L1002%20569%20L962%20577%20L922%20584%20L880%20589%20L837%20589%20L796%20581%20L759%20568%20L726%20551%20L698%20532%20L672%20514%20L646%20498%20L619%20484%20L590%20472%20L560%20459%20L529%20445%20L500%20430%20L471%20413%20L442%20394%20L413%20374%20L383%20352%20L356%20327%20L334%20300%20L323%20271%20L328%20242%20L350%20216%20L388%20194%20L436%20177%20L487%20166%20L535%20157%20L574%20148%20L603%20136%20L625%20120%20L644%20100%20L664%2078%20L690%2058%20L722%2043%20L760%2034%20L800%2031%20L841%2033%20L880%2036%20L919%2037%20L958%2036%20L1001%2033%20L1046%2030%20L1092%2030%20L1139%2034%20L1182%2044%20L1220%2060%20L1251%2080%20L1276%20103%20L1295%20128%20L1309%20153%20L1318%20179%20L1320%20205%20L1315%20231%20L1303%20256%20L1286%20279%20L1268%20300Z%22/%3E%3Cpath%20d%3D%22M1308%20300%20L1293%20321%20L1290%20343%20L1300%20367%20L1318%20395%20L1338%20427%20L1352%20462%20L1353%20496%20L1338%20528%20L1308%20553%20L1266%20573%20L1218%20586%20L1166%20594%20L1115%20599%20L1065%20601%20L1016%20601%20L969%20598%20L923%20593%20L880%20584%20L839%20575%20L801%20565%20L764%20557%20L725%20552%20L684%20549%20L640%20547%20L595%20541%20L552%20532%20L515%20516%20L486%20496%20L464%20473%20L447%20448%20L429%20425%20L407%20402%20L378%20380%20L343%20356%20L309%20330%20L282%20300%20L271%20268%20L279%20237%20L309%20209%20L354%20187%20L409%20170%20L464%20158%20L512%20148%20L552%20137%20L582%20124%20L607%20107%20L629%2088%20L653%2067%20L681%2048%20L714%2030%20L751%2014%20L791%20-0%20L834%20-13%20L880%20-24%20L929%20-31%20L979%20-34%20L1029%20-30%20L1076%20-19%20L1117%20-2%20L1153%2020%20L1183%2043%20L1212%2066%20L1240%2086%20L1272%20105%20L1304%20124%20L1335%20144%20L1359%20168%20L1371%20194%20L1369%20222%20L1354%20250%20L1331%20277%20L1308%20300Z%22/%3E%3Cpath%20d%3D%22M1387%20300%20L1387%20326%20L1391%20353%20L1398%20382%20L1403%20413%20L1402%20444%20L1393%20476%20L1376%20506%20L1351%20534%20L1320%20561%20L1284%20585%20L1243%20607%20L1197%20625%20L1146%20638%20L1090%20642%20L1032%20637%20L976%20623%20L925%20603%20L880%20582%20L841%20565%20L804%20555%20L765%20554%20L720%20561%20L667%20571%20L608%20579%20L548%20581%20L493%20574%20L447%20556%20L414%20532%20L390%20503%20L373%20473%20L357%20444%20L339%20417%20L318%20389%20L296%20361%20L278%20331%20L269%20300%20L273%20269%20L290%20238%20L318%20211%20L352%20186%20L389%20164%20L425%20144%20L460%20126%20L495%20108%20L529%2092%20L565%2078%20L602%2065%20L638%2052%20L673%2037%20L708%2020%20L743%20-3%20L782%20-29%20L827%20-56%20L880%20-80%20L938%20-95%20L998%20-97%20L1054%20-86%20L1102%20-62%20L1139%20-29%20L1167%206%20L1189%2038%20L1211%2066%20L1238%2088%20L1270%20106%20L1306%20123%20L1341%20142%20L1371%20164%20L1390%20190%20L1398%20218%20L1397%20246%20L1391%20273%20L1387%20300Z%22/%3E%3Cpath%20d%3D%22M368%20620%20L373%20626%20L376%20633%20L377%20640%20L374%20647%20L368%20653%20L361%20658%20L353%20663%20L344%20667%20L334%20670%20L324%20672%20L313%20673%20L302%20673%20L291%20673%20L282%20672%20L274%20673%20L266%20675%20L259%20678%20L250%20682%20L240%20685%20L230%20688%20L219%20689%20L208%20688%20L199%20685%20L191%20681%20L183%20676%20L177%20672%20L169%20668%20L161%20664%20L151%20661%20L142%20657%20L134%20652%20L129%20646%20L127%20639%20L129%20633%20L134%20626%20L141%20620%20L147%20615%20L153%20610%20L157%20605%20L161%20601%20L163%20596%20L165%20591%20L167%20586%20L170%20580%20L174%20575%20L178%20569%20L183%20563%20L188%20557%20L196%20551%20L205%20546%20L215%20543%20L227%20542%20L239%20544%20L250%20547%20L260%20552%20L269%20556%20L277%20560%20L286%20562%20L294%20564%20L304%20565%20L314%20566%20L322%20569%20L330%20573%20L335%20578%20L337%20584%20L339%20590%20L340%20595%20L342%20600%20L346%20605%20L353%20609%20L360%20614%20L368%20620Z%22/%3E%3Cpath%20d%3D%22M420%20620%20L419%20629%20L416%20637%20L413%20646%20L409%20654%20L406%20663%20L401%20672%20L394%20680%20L384%20687%20L371%20692%20L355%20694%20L337%20694%20L320%20692%20L305%20690%20L292%20689%20L282%20691%20L272%20695%20L262%20701%20L250%20708%20L236%20715%20L220%20720%20L204%20722%20L188%20721%20L174%20717%20L161%20711%20L150%20705%20L140%20698%20L130%20691%20L121%20684%20L113%20677%20L107%20669%20L103%20661%20L101%20652%20L101%20644%20L101%20636%20L102%20628%20L102%20620%20L102%20612%20L103%20605%20L105%20597%20L110%20590%20L117%20583%20L125%20577%20L133%20571%20L140%20565%20L145%20558%20L150%20549%20L155%20539%20L161%20529%20L171%20519%20L184%20512%20L199%20508%20L217%20509%20L234%20513%20L250%20520%20L264%20527%20L276%20534%20L286%20540%20L297%20543%20L308%20546%20L320%20548%20L333%20550%20L344%20553%20L355%20558%20L365%20563%20L374%20569%20L383%20575%20L392%20581%20L400%20588%20L408%20595%20L415%20603%20L419%20611%20L420%20620Z%22/%3E%3Cpath%20d%3D%22M475%20620%20L464%20631%20L453%20641%20L445%20651%20L439%20661%20L435%20671%20L431%20682%20L424%20692%20L413%20701%20L398%20708%20L380%20712%20L360%20713%20L341%20714%20L324%20714%20L309%20716%20L295%20720%20L281%20725%20L266%20731%20L250%20738%20L232%20743%20L212%20746%20L192%20748%20L172%20747%20L152%20745%20L132%20741%20L113%20736%20L97%20728%20L85%20718%20L77%20706%20L75%20693%20L77%20679%20L81%20667%20L84%20656%20L85%20646%20L82%20638%20L74%20629%20L64%20620%20L55%20610%20L49%20599%20L48%20588%20L53%20578%20L63%20568%20L75%20560%20L88%20553%20L99%20545%20L108%20536%20L116%20525%20L125%20514%20L136%20503%20L151%20494%20L169%20487%20L189%20485%20L210%20486%20L231%20489%20L250%20494%20L268%20501%20L284%20507%20L299%20513%20L312%20519%20L325%20525%20L337%20531%20L349%20536%20L361%20542%20L375%20546%20L392%20550%20L411%20553%20L432%20558%20L453%20564%20L470%20573%20L482%20583%20L486%20595%20L483%20608%20L475%20620Z%22/%3E%3Cpath%20d%3D%22M529%20620%20L514%20634%20L499%20646%20L486%20657%20L474%20668%20L464%20679%20L452%20689%20L440%20699%20L426%20708%20L411%20715%20L396%20723%20L381%20731%20L366%20739%20L350%20748%20L333%20756%20L315%20763%20L294%20768%20L272%20770%20L250%20771%20L228%20770%20L206%20769%20L183%20768%20L159%20768%20L133%20768%20L107%20767%20L82%20762%20L61%20754%20L46%20741%20L40%20725%20L41%20707%20L47%20689%20L55%20674%20L60%20661%20L59%20650%20L53%20641%20L41%20631%20L26%20620%20L13%20608%20L4%20594%20L1%20580%20L2%20567%20L8%20553%20L18%20540%20L29%20528%20L41%20516%20L56%20505%20L73%20495%20L93%20487%20L115%20481%20L138%20478%20L162%20476%20L185%20475%20L207%20475%20L228%20474%20L250%20473%20L272%20473%20L293%20476%20L313%20481%20L331%20489%20L345%20499%20L358%20509%20L370%20519%20L383%20526%20L401%20530%20L424%20533%20L452%20536%20L482%20541%20L510%20548%20L532%20559%20L544%20573%20L547%20589%20L541%20605%20L529%20620Z%22/%3E%3Cpath%20d%3D%22M577%20620%20L568%20636%20L555%20652%20L539%20666%20L519%20678%20L496%20688%20L472%20696%20L451%20703%20L433%20711%20L420%20721%20L410%20733%20L403%20749%20L393%20767%20L380%20785%20L361%20800%20L336%20810%20L308%20815%20L279%20813%20L250%20808%20L223%20802%20L198%20796%20L172%20793%20L145%20790%20L118%20788%20L90%20785%20L64%20778%20L42%20767%20L27%20752%20L19%20735%20L15%20718%20L14%20701%20L14%20685%20L11%20672%20L6%20659%20L-1%20646%20L-9%20633%20L-17%20620%20L-24%20606%20L-30%20591%20L-35%20575%20L-39%20558%20L-42%20539%20L-42%20520%20L-36%20501%20L-22%20485%20L-0%20472%20L29%20464%20L62%20461%20L96%20462%20L129%20466%20L157%20469%20L182%20470%20L205%20468%20L227%20463%20L250%20456%20L275%20451%20L301%20450%20L326%20453%20L349%20459%20L369%20469%20L387%20480%20L405%20489%20L424%20497%20L447%20503%20L474%20509%20L502%20516%20L529%20525%20L552%20537%20L569%20551%20L580%20568%20L584%20585%20L583%20603%20L577%20620Z%22/%3E%3Cpath%20d%3D%22M613%20620%20L614%20639%20L607%20657%20L589%20674%20L564%20688%20L533%20698%20L502%20706%20L475%20713%20L456%20722%20L444%20735%20L437%20752%20L431%20773%20L421%20796%20L405%20818%20L382%20835%20L353%20847%20L319%20852%20L284%20852%20L250%20849%20L217%20842%20L186%20835%20L156%20827%20L129%20818%20L103%20807%20L80%20794%20L61%20780%20L44%20766%20L28%20752%20L12%20738%20L-5%20726%20L-24%20714%20L-42%20701%20L-59%20687%20L-70%20671%20L-76%20654%20L-76%20637%20L-72%20620%20L-69%20603%20L-69%20587%20L-73%20569%20L-81%20549%20L-89%20526%20L-92%20503%20L-87%20480%20L-70%20461%20L-41%20447%20L-4%20441%20L37%20440%20L78%20444%20L116%20449%20L148%20453%20L175%20454%20L200%20452%20L225%20448%20L250%20442%20L277%20438%20L305%20435%20L334%20434%20L363%20436%20L393%20439%20L423%20442%20L454%20447%20L484%20454%20L513%20464%20L538%20477%20L557%20493%20L570%20510%20L579%20529%20L586%20548%20L592%20566%20L599%20583%20L607%20601%20L613%20620Z%22/%3E%3C/svg%3E") right -120px center/min(1400px,110vw) auto no-repeat}
.intro::after{transform:translate(calc(var(--px,0) * -14px),calc(var(--py,0) * -10px));transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.hero-fx{transform:translate(calc(var(--px,0) * -14px),calc(var(--py,0) * -10px));transition:opacity .4s ease,transform .8s cubic-bezier(.2,.8,.2,1)}
@media (hover:none){ .hero-fx{display:none} }
@media (max-width: 820px){ .hero-fx{top:-170px;bottom:-48px;background-position:left 40% center} }
/* compact tabs */
.tabs{padding:4px !important;gap:2px !important;font-size:14px !important}
.tabs button{padding:7px 14px !important;gap:6px !important;min-height:36px;box-sizing:border-box}
.tabs button .ct{font-size:11px;min-width:18px;height:17px;padding:0 5px}
.tabs-wrap{padding-top:10px !important;padding-bottom:10px !important}
.panel{scroll-margin-top:72px}
@media (max-width: 820px){ .tabs{font-size:13px !important} .tabs button{padding:7px 12px !important} }
/* recognition: compact rows beside a top-aligned photo */
.ab-rec{grid-template-columns:minmax(0,180px) minmax(0,1fr) !important;gap:40px !important;align-items:start !important}
.ab-award{max-width:180px}
.ab-award img{transform:rotate(-2deg)}
.ab-awards{align-self:start}
.ab-awards li{display:flex !important;justify-content:space-between;align-items:baseline;gap:16px;padding:12px 0 !important}
.ab-awards b{font-size:16px !important;font-weight:500}
.ab-awards span{font-size:15px !important;text-align:right;white-space:nowrap}
@media (max-width: 820px){ .ab-rec{grid-template-columns:minmax(0,1fr) !important;gap:28px !important} .ab-award{max-width:180px} }
@media (max-width: 520px){ .ab-awards li{flex-direction:column;align-items:flex-start;gap:2px} .ab-awards span{text-align:left;white-space:normal} }
/* resume page */
.rv-head .rv-meta{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap}
.rv-head .rv-meta p{max-width:520px}
.rv-actions{display:flex;gap:10px;flex-wrap:wrap}
.rv-actions .sf-btn{min-height:48px;font-size:15px;padding:0 22px}
.rv{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:72px;align-items:start}
.rv h2{font-size:13px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--mute);margin:0 0 8px;font-family:var(--sans)}
.rv-gap{margin-top:48px !important}
.rv-job{padding:22px 0;border-top:1px solid var(--line)}
.rv-job header{display:flex;justify-content:space-between;align-items:baseline;gap:16px}
.rv-job h3{margin:0;font-family:var(--serif);font-weight:400;font-size:28px;line-height:1.1}
.rv-when{font-size:14px;color:var(--mute);white-space:nowrap;font-variant-numeric:tabular-nums}
.rv-role{margin:4px 0 12px;color:var(--mute);font-size:15px}
.rv-job ul{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:8px}
.rv-job li{font-size:16px;line-height:1.6;color:var(--mute)}
.rv-job li b{font-weight:500;color:var(--ink)}
.rv-side{display:flex;flex-direction:column;gap:40px}
.rv-block h2{padding-bottom:10px;border-bottom:1px solid var(--line);margin-bottom:4px}
.rv-item{padding:12px 0;border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:2px}
.rv-item b{font-weight:500;font-size:15px}
.rv-item span{font-size:14px;color:var(--mute)}
.rv-tags{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 0}
.rv-tags span{font-size:14px;border:1px solid var(--line);border-radius:99px;padding:5px 12px}
@media (max-width: 820px){ .rv{grid-template-columns:minmax(0,1fr);gap:56px} .rv-side{position:static} .rv-job header{flex-direction:column;gap:2px} .rv-job h3{font-size:24px} }
/* hero proof: 4 items */
.intro .proof{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width: 820px){ .intro .proof{grid-template-columns:repeat(2,minmax(0,1fr))} .proof li:last-child{grid-column:auto !important} .intro .proof li:nth-child(even){border-left:1px solid var(--line) !important;padding-left:12px !important} }
/* floating contact icon */
.fab-btn{all:unset;box-sizing:border-box;cursor:pointer;position:relative;display:inline-flex;align-items:center;height:56px;min-width:56px;padding:0 16px;border-radius:99px;
  color:#fff;background:rgba(23,23,26,.8);-webkit-backdrop-filter:blur(16px) saturate(1.6);backdrop-filter:blur(16px) saturate(1.6);
  border:1px solid rgba(255,255,255,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 10px 28px -8px rgba(0,0,0,.45),0 2px 6px rgba(0,0,0,.15);
  font:500 15px/1 var(--sans);transition:transform .3s cubic-bezier(.2,.8,.2,1),background-color .2s}
.fab-btn::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(160deg,rgba(255,255,255,.22),rgba(255,255,255,0) 45%)}
.fab-btn svg{width:24px;height:24px;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.fab-lbl{max-width:0;overflow:hidden;white-space:nowrap;opacity:0;margin-left:0;transition:max-width .35s cubic-bezier(.2,.8,.2,1),opacity .2s,margin-left .35s cubic-bezier(.2,.8,.2,1)}
.fab-btn:hover .fab-lbl,.fab-btn:focus-visible .fab-lbl,.fab.open .fab-lbl{max-width:120px;opacity:1;margin-left:10px}
.fab-btn:hover{transform:translateY(-2px)}
.fab-dot{position:absolute;top:10px;left:34px;width:9px;height:9px;border-radius:50%;background:#3BA56B;box-shadow:0 0 0 2px rgba(23,23,26,.9)}
:root[data-theme="dark"] .fab-btn{color:#17171A;background:rgba(250,250,248,.86);border-color:rgba(255,255,255,.5)}
:root[data-theme="dark"] .fab-dot{box-shadow:0 0 0 2px rgba(250,250,248,.95)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .fab-btn{color:#17171A;background:rgba(250,250,248,.86)}}
@media (max-width: 520px){ .fab-btn{height:52px;min-width:52px;padding:0 14px} .fab-dot{left:31px;top:9px} }
/* resume dialog */
dialog.rvd{border:0;padding:0;margin:auto;width:min(880px,94vw);height:min(92vh,1200px);max-height:92vh;border-radius:20px;background:var(--paper);color:var(--ink);box-shadow:0 30px 80px -20px rgba(0,0,0,.5);overflow:hidden}
dialog.rvd[open]{display:flex;flex-direction:column;animation:rvdIn .3s cubic-bezier(.2,.8,.2,1)}
dialog.rvd::backdrop{background:rgba(10,10,12,.55);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
@keyframes rvdIn{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}
.rvd-bar{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:14px 16px 14px 24px;border-bottom:1px solid var(--line)}
.rvd-bar p{margin:0;font-family:var(--serif);font-size:26px;line-height:1}
.rvd-acts{display:flex;align-items:center;gap:8px}
.rvd-acts .sf-btn{min-height:44px;padding:0 18px;font-size:15px;gap:8px;cursor:pointer;font-family:inherit}
.rvd-acts .sf-btn svg,.rvd-x svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.rvd-x{all:unset;cursor:pointer;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;color:var(--ink)}
.rvd-x:hover{background:var(--soft)}
.rvd-x:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.rvd-body{flex:1;overflow:auto;padding:24px;background:var(--tile)}
.rvd-body img{display:block;width:100%;max-width:800px;height:auto;margin:0 auto;border-radius:6px;box-shadow:0 0 0 1px rgba(0,0,0,.06),0 10px 30px -12px rgba(0,0,0,.3);background:#fff}
.rvd-note{position:absolute;right:24px;bottom:16px;margin:0;font-size:14px;color:var(--mute)}
.rvd-note:empty{display:none}
@media (max-width: 520px){ dialog.rvd{width:100vw;height:100%;max-height:100%;border-radius:0} .rvd-body{padding:12px} .rvd-acts .sf-btn span{display:none} .rvd-acts .sf-btn{padding:0 14px} .rvd-bar{padding-top:calc(14px + env(safe-area-inset-top,0px))} }
/* small cursor label */
#cursor-label{padding:6px 11px !important;font-size:13px !important;line-height:1.2 !important;font-weight:500 !important;border-radius:99px;box-shadow:0 4px 12px -4px rgba(0,0,0,.3)}
/* hero: inline icons + hover */
.intro .lead .hw{white-space:nowrap;border-radius:.2em;padding:0 .06em;margin:0 -.06em;background:linear-gradient(var(--mk),var(--mk)) no-repeat 0 88%/0% 42%;transition:background-size .5s cubic-bezier(.2,.8,.2,1);-webkit-box-decoration-break:clone;box-decoration-break:clone}
.intro .lead .hw:hover{background-size:100% 42%}
.ico{display:inline-grid;place-items:center;width:1.02em;height:1.02em;vertical-align:-.13em;margin-left:.06em;border-radius:.26em;background:var(--paper);border:1px solid var(--line);box-shadow:0 1px 0 rgba(0,0,0,.03),0 3px 8px -4px rgba(0,0,0,.18);transform:rotate(var(--rt,-4deg));transition:transform .45s cubic-bezier(.34,1.56,.64,1),border-color .3s}
.ico svg{width:62%;height:62%;fill:none;stroke:var(--mute);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;overflow:visible;transition:stroke .3s}
.i-code{--rt:3deg}.i-sq{--rt:-3deg}.i-cur{--rt:5deg}
.hw:hover .ico{transform:rotate(0deg) scale(1.14) translateY(-.05em)}
.hw:hover .i-pen svg{stroke:#7B61FF}.hw:hover .i-code svg{stroke:#2F5BD3}.hw:hover .i-sq svg{stroke:#E0703A}.hw:hover .i-cur svg{stroke:#2F8F5B}
:root[data-theme="dark"] .hw:hover .i-code svg{stroke:#7EA0FF}
.i-pen .ink{stroke-dasharray:9;stroke-dashoffset:9;transition:stroke-dashoffset .5s ease .15s}
.hw:hover .i-pen .ink{stroke-dashoffset:0}
.i-pen svg path:not(.ink){transform-origin:20% 80%;transition:transform .4s cubic-bezier(.34,1.56,.64,1)}
.hw:hover .i-pen svg path:not(.ink){transform:rotate(-8deg)}
.i-code .l,.i-code .r,.i-code .s{transition:transform .4s cubic-bezier(.34,1.56,.64,1)}
.hw:hover .i-code .l{transform:translateX(-2px)}.hw:hover .i-code .r{transform:translateX(2px)}
.hw:hover .i-code .s{transform:rotate(12deg);transform-origin:center;transform-box:fill-box}
.i-sq .sq{stroke-dasharray:32;stroke-dashoffset:0}
.hw:hover .i-sq .sq{animation:sqDraw .7s ease both}
@keyframes sqDraw{from{stroke-dashoffset:32}to{stroke-dashoffset:0}}
.i-cur .rip{opacity:0;transform-origin:7px 6px;transform-box:view-box}
.hw:hover .i-cur .rip{animation:ripple .7s ease-out .2s}
.hw:hover .i-cur .ptr{animation:tap .45s ease .05s;transform-origin:7px 6px;transform-box:view-box}
@keyframes ripple{0%{opacity:.8;transform:scale(.3)}100%{opacity:0;transform:scale(1.6)}}
@keyframes tap{50%{transform:scale(.82)}}
/* hero: dot-grid spotlight follows the cursor */
.hero-fx{background:radial-gradient(circle,var(--dot) 1.1px,transparent 1.6px) 0 0/22px 22px !important;
  -webkit-mask-image:radial-gradient(circle 240px at var(--mx,-999px) var(--my,-999px),#000 0%,rgba(0,0,0,.35) 55%,transparent 80%) !important;
  mask-image:radial-gradient(circle 240px at var(--mx,-999px) var(--my,-999px),#000 0%,rgba(0,0,0,.35) 55%,transparent 80%) !important}
:root{--dot:rgba(23,23,26,.28)}
:root[data-theme="dark"]{--dot:rgba(237,237,234,.22)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--dot:rgba(237,237,234,.22)}}
@media (prefers-reduced-motion: reduce){ .ico,.ico *{transition:none !important;animation:none !important} }
/* about: operating principle */
.ab-motto{position:relative;padding:8px 0}
.ab-motto blockquote{margin:0}
.ab-motto .q{font-family:var(--serif);font-size:clamp(34px,4.6vw,58px);line-height:1.1;letter-spacing:-.015em;margin:0 0 18px;max-width:900px}
.ab-motto footer{font-size:15px;color:var(--mute)}
.ab-motto footer a{color:inherit;text-underline-offset:3px}
.ab-motto .ring{position:relative;white-space:nowrap}
.ab-motto .ring svg{position:absolute;left:-7%;top:-22%;width:114%;height:144%;overflow:visible;pointer-events:none}
.ab-motto .ring path{fill:none;stroke:var(--accent);stroke-width:2.4;stroke-linecap:round;stroke-dasharray:640;stroke-dashoffset:640;vector-effect:non-scaling-stroke;transition:stroke-dashoffset 1.1s cubic-bezier(.65,0,.35,1) .2s}
.ab-motto.drawn .ring path{stroke-dashoffset:0}
.ab-motto .note{position:absolute;left:58%;top:132%;display:flex;align-items:flex-end;gap:6px;font-family:var(--hand);font-size:clamp(22px,2.2vw,30px);line-height:1;letter-spacing:0;color:var(--accent);transform:rotate(-5deg);opacity:0;transition:opacity .4s ease 1.1s;white-space:nowrap}
.ab-motto.drawn .note{opacity:1}
.ab-motto .note svg{width:48px;height:36px;margin-bottom:12px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ab-motto .me{max-width:560px;margin:44px 0 0;color:var(--mute);font-size:18px}
@media (max-width: 820px){ .ab-motto .note{left:calc(100% + 26px);top:-6%;transform:rotate(-4deg)} .ab-motto .note svg{width:34px;height:26px;margin-bottom:8px} }
.ph .ab-short{margin:24px 0 0;max-width:620px;font-size:19px;line-height:1.6;color:var(--mute)}
.ph .ab-short b{font-weight:500;color:var(--ink)}
.ab-motto .me.strength{font-size:20px;color:var(--ink);margin-top:44px}
.ab-motto .me.strength + .me{margin-top:10px}
/* case study images */
.cs-img{margin:0}
.cs-img .zoom{border-radius:16px;overflow:hidden;background:var(--tile);box-shadow:0 0 0 1px var(--line)}
.cs-img img{display:block;width:100%;height:auto}
.cs-img figcaption{margin-top:10px;font-size:14px;color:var(--mute)}
.cs-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-items:start}
.cs-scroll{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:8px;scrollbar-width:thin}
.cs-scroll .cs-img{flex:0 0 min(78%,640px);scroll-snap-align:start}
.cs-scroll:focus-visible{outline:2px solid var(--accent);outline-offset:4px;border-radius:12px}
@media (max-width: 820px){ .cs-two{grid-template-columns:minmax(0,1fr)} .cs-scroll .cs-img{flex-basis:88%} }
/* case study native components */
.cs-quote{margin:0;padding:28px 32px;border-left:3px solid var(--accent);background:var(--tile);border-radius:4px 20px 20px 4px}
.cs-quote p{margin:0;font-family:var(--serif);font-size:clamp(24px,2.6vw,32px);line-height:1.3;letter-spacing:-.005em}
.cs-insights{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;counter-reset:ins}
.cs-insights li{position:relative;display:flex;gap:16px;align-items:flex-start;padding:22px 64px 22px 20px;border-radius:18px;background:var(--tile);overflow:hidden;counter-increment:ins}
.cs-insights li::after{content:counter(ins);position:absolute;right:18px;top:6px;font-family:var(--serif);font-size:64px;line-height:1;color:var(--ink);opacity:.06}
.cs-insights li:last-child:nth-child(odd){grid-column:1/-1}
.cs-insights p{margin:0;font-size:17px;line-height:1.55;position:relative;z-index:1}
.cs-insights mark{background:linear-gradient(transparent 55%,rgba(123,97,255,.22) 55%);color:inherit;padding:0 1px}
:root[data-theme="dark"] .cs-insights mark{background:linear-gradient(transparent 55%,rgba(126,160,255,.28) 55%)}
.cs-ic{flex:none;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:var(--paper);color:#6A4FF0;box-shadow:0 0 0 1px var(--line)}
:root[data-theme="dark"] .cs-ic{color:#A99BFF}
.cs-ic svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.cs-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:12px;border-radius:24px;background:var(--tile)}
.cs-step{background:var(--paper);border-radius:16px;padding:24px;display:flex;flex-direction:column;gap:10px;box-shadow:0 0 0 1px var(--line)}
.cs-step b{font-weight:500;font-size:19px;margin-top:8px}
.cs-step p{margin:0;color:var(--mute);font-size:16px;line-height:1.55}
@media (max-width: 820px){ .cs-insights,.cs-steps{grid-template-columns:minmax(0,1fr)} .cs-quote{padding:22px} }
/* clearfeed native diagrams */
.cs-split{border-radius:24px;background:var(--tile);padding:40px 32px 48px;text-align:center}
.cs-split-h{margin:0 0 28px;font-size:17px;color:var(--mute)}
.cs-split-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;max-width:760px;margin:0 auto}
.cs-part{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;min-height:190px;padding:28px 24px 36px;border-radius:18px;background:#7B6BF5;color:#fff}
.cs-part .n{font-size:40px;font-weight:600;letter-spacing:.02em;opacity:.28;line-height:1}
.cs-part b{font-weight:500;font-size:19px;line-height:1.35;max-width:260px}
.cs-part .who{position:absolute;left:46%;bottom:-26px;display:flex;align-items:flex-start;pointer-events:none;animation:curFloat 5s ease-in-out infinite}
.cs-part:nth-child(2) .who{animation-delay:-2.5s}
.cs-cur{width:26px;height:26px;margin-right:-4px;filter:drop-shadow(0 2px 3px rgba(0,0,0,.2))}
.cs-part .who i{font-style:normal;margin-top:20px;padding:5px 10px;border-radius:4px 10px 10px 10px;background:var(--c);color:var(--t);font-size:14px;font-weight:500;white-space:nowrap;box-shadow:0 4px 12px -4px rgba(0,0,0,.25)}
@keyframes curFloat{0%,100%{transform:translate(0,0)}50%{transform:translate(10px,-6px)}}
.cs-eq{align-items:stretch}
.cs-eq>figure{margin:0;display:flex;flex-direction:column}
.cs-eq figcaption,.cs-img figcaption{margin-top:10px;font-size:14px;color:var(--mute)}
.cs-slack .cs-msg,.cs-fields-in,.cs-tree-in{flex:1;border-radius:16px;box-shadow:0 0 0 1px var(--line);background:var(--paper)}
.cs-msg{display:flex;gap:12px;padding:22px;font-family:-apple-system,'Segoe UI',Lato,var(--sans);font-size:15px;line-height:1.5;color:var(--ink)}
.cs-msg .av{width:36px;height:36px;border-radius:6px;object-fit:cover;flex:none}
.cs-msg p{margin:0}
.cs-msg .meta{display:flex;gap:8px;align-items:baseline;margin-bottom:2px}
.cs-msg .meta span{font-size:12px;color:var(--mute)}
.cs-msg ol{margin:6px 0 0;padding-left:22px}
.cs-fields-in{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:14px;background:var(--tile)}
.cs-fields-in>div{border-radius:12px;background:#7B6BF5;color:#fff;padding:18px}
.cs-fields-in b{display:block;font-weight:500;font-size:15px;margin-bottom:8px}
.cs-fields-in ul{margin:0;padding-left:18px;font-size:14px;line-height:1.6;opacity:.92}
.cs-tree-in{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:28px 16px;background:var(--tile)}
.cs-tree-in span{display:grid;place-items:center;text-align:center;border-radius:12px;background:#6A4FF0;color:#fff;font-weight:500;font-size:15px;padding:14px 12px;line-height:1.3}
.cs-tree-in small{display:block;font-weight:400;font-size:12px;opacity:.85;margin-top:2px}
.cs-tree-in .root{min-width:130px;padding:20px}
.cs-tree-in .kids{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;width:100%;margin-top:44px}
.cs-tree-in .kids::before{content:"";position:absolute;left:16.6%;right:16.6%;top:-22px;height:22px;border:1.5px solid var(--mute);border-bottom:0;border-radius:10px 10px 0 0;opacity:.5}
.cs-tree-in .kids::after{content:"";position:absolute;left:50%;top:-44px;height:44px;border-left:1.5px solid var(--mute);opacity:.5}
.cs-flow{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;border-radius:24px;background:var(--tile);padding:44px 24px}
.cs-flow .st{display:grid;place-items:center;text-align:center;min-width:170px;min-height:96px;padding:16px 20px;border-radius:14px;background:#6A4FF0;color:#fff;font-weight:500;font-size:17px;line-height:1.3}
.cs-flow .st.sm{min-height:0;min-width:210px;padding:14px 18px;font-size:16px}
.cs-flow .st small{display:block;font-weight:400;font-size:13px;opacity:.85;margin-top:3px}
.cs-flow .opts{display:flex;flex-direction:column;gap:12px}
.cs-flow svg{fill:none;stroke:var(--mute);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.cs-flow .ar{width:40px;height:12px}
.cs-flow .fork{width:40px;height:80px;margin-right:-8px}
.cs-testi{margin:0;border-radius:24px;background:var(--tile);padding:40px}
.cs-testi .lab{margin:0 0 18px;font-size:14px;color:var(--mute);letter-spacing:.02em}
.cs-testi blockquote{margin:0}
.cs-testi blockquote p{margin:0;font-family:var(--serif);font-size:clamp(22px,2.3vw,28px);line-height:1.4;max-width:900px}
.cs-testi figcaption{display:flex;align-items:center;gap:14px;margin-top:26px}
.cs-testi figcaption img{width:48px;height:48px;border-radius:50%;object-fit:cover}
.cs-testi figcaption span{display:flex;flex-direction:column;font-size:15px;color:var(--mute)}
.cs-testi figcaption b{font-weight:500;color:var(--ink)}
@media (max-width: 820px){ .cs-split-row,.cs-fields-in{grid-template-columns:minmax(0,1fr)} .cs-split-row{gap:44px} .cs-flow{flex-direction:column} .cs-flow .ar{transform:rotate(90deg)} .cs-flow .fork{display:none} .cs-tree-in .kids{grid-template-columns:minmax(0,1fr)} .cs-tree-in .kids::before{display:none} .cs-tree-in .kids::after{top:-44px} .cs-testi{padding:26px} }
@media (prefers-reduced-motion: reduce){ .cs-part .who{animation:none} }
/* clearfeed mockups */
.cs-mock{margin:0;border-radius:24px;padding:clamp(20px,5vw,64px);background:radial-gradient(120% 90% at 0% 0%,#F1EEFF 0%,#E4DEFD 55%,#D9D2FB 100%)}
:root[data-theme="dark"] .cs-mock{background:radial-gradient(120% 90% at 0% 0%,#2A2640 0%,#221F35 60%,#1C1A2C 100%)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .cs-mock{background:radial-gradient(120% 90% at 0% 0%,#2A2640 0%,#221F35 60%,#1C1A2C 100%)}}
.cs-win{border-radius:12px;overflow:hidden;background:#fff;box-shadow:0 0 0 1px rgba(40,30,90,.08),0 2px 4px rgba(40,30,90,.06),0 24px 48px -20px rgba(40,30,90,.35)}
.cs-win .bar{display:flex;align-items:center;gap:6px;height:34px;padding:0 14px;background:#F6F5FA;border-bottom:1px solid #ECEAF3}
.cs-win .bar i{width:10px;height:10px;border-radius:50%;background:#E3E1EA}
.cs-win .bar i:nth-child(1){background:#FF6159}.cs-win .bar i:nth-child(2){background:#FFBD2E}.cs-win .bar i:nth-child(3){background:#28C941}
.cs-win .bar span{margin:0 auto;transform:translateX(-24px);font-size:12px;color:#8A879A;background:#fff;border:1px solid #ECEAF3;border-radius:6px;padding:3px 40px}
.cs-win img,.cs-mock.bare img{display:block;width:100%;height:auto}
.cs-mock .zoom{display:block}
.cs-mock.bare img{border-radius:12px;box-shadow:0 0 0 1px rgba(40,30,90,.06),0 24px 48px -20px rgba(40,30,90,.35)}
.cs-mock figcaption{margin-top:18px;text-align:center;font-size:14px;color:#5E5A74}
:root[data-theme="dark"] .cs-mock figcaption{color:var(--mute)}
@media (max-width: 520px){ .cs-win .bar{height:24px;padding:0 10px} .cs-win .bar i{width:7px;height:7px} .cs-win .bar span{display:none} }
/* neater test tree */
.cs-tree2{margin:0;border-radius:24px;background:var(--tile);padding:40px 28px 28px;display:flex;flex-direction:column;align-items:center}
.cs-tree2 .root{display:inline-flex;align-items:center;gap:10px;padding:12px 22px;border-radius:99px;background:#6A4FF0;color:#fff;font-weight:500;font-size:16px;box-shadow:0 8px 20px -10px rgba(106,79,240,.7)}
.cs-tree2 .root .dot{width:8px;height:8px;border-radius:50%;background:#fff;opacity:.85}
.cs-tree2 .links{width:calc(66.6% + 8px);max-width:620px;height:36px;border:1.5px solid var(--line);border-bottom:0;border-radius:14px 14px 0 0;margin-top:22px;position:relative}
.cs-tree2 .links::before{content:"";position:absolute;left:50%;top:-23px;height:59px;border-left:1.5px solid var(--line)}
.cs-tree2 .kids{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;width:100%;max-width:940px}
.cs-tree2 .kids>div{background:var(--paper);border-radius:16px;padding:18px;display:flex;flex-direction:column;gap:6px;box-shadow:0 0 0 1px var(--line)}
.cs-tree2 .kids b{font-weight:500;font-size:16px;margin-top:6px}
.cs-tree2 .kids span:not(.cs-ic){font-size:14px;color:var(--mute);line-height:1.5}
.cs-tree2 figcaption,.cs-flow2 figcaption{margin-top:20px;font-size:14px;color:var(--mute);text-align:center;width:100%}
/* neater activation flow */
.cs-flow2{margin:0;border-radius:24px;background:var(--tile);padding:40px 28px 28px;display:grid;grid-template-columns:minmax(0,1fr) 48px minmax(0,1.35fr);align-items:center;gap:16px}
.cs-flow2 .stp{background:var(--paper);border-radius:18px;padding:22px;box-shadow:0 0 0 1px var(--line);display:flex;flex-direction:column;gap:6px;align-self:stretch}
.cs-flow2 .stp>b{font-weight:500;font-size:17px}
.cs-flow2 .stp:first-child{align-self:center}
.cs-flow2 .stp>span:not(.num){font-size:14px;color:var(--mute)}
.cs-flow2 .num{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:#EEEAFE;color:#6A4FF0;font-size:13px;font-weight:600;margin-bottom:6px}
.cs-flow2 .arr{width:48px;height:12px;fill:none;stroke:var(--mute);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.cs-flow2 .opt{display:flex;gap:12px;align-items:flex-start;margin-top:8px;padding:14px;border-radius:12px;border:1px solid var(--line)}
.cs-flow2 .opt.on{border-color:#6A4FF0;background:rgba(106,79,240,.06)}
.cs-flow2 .opt>i{flex:none;width:16px;height:16px;margin-top:3px;border-radius:50%;border:1.5px solid var(--mute)}
.cs-flow2 .opt.on>i{border:5px solid #6A4FF0}
.cs-flow2 .opt b{font-weight:500;font-size:15px;display:flex;align-items:center;gap:8px}
.cs-flow2 .opt em{font-style:normal;font-size:12px;font-weight:500;color:#6A4FF0;border:1px solid rgba(106,79,240,.35);border-radius:99px;padding:1px 8px}
.cs-flow2 .opt span{display:block;font-size:14px;color:var(--mute);margin-top:2px}
.cs-flow2 figcaption{grid-column:1/-1}
:root[data-theme="dark"] .cs-flow2 .num{background:rgba(126,160,255,.15);color:#A99BFF}
@media (max-width: 820px){ .cs-tree2 .kids{grid-template-columns:minmax(0,1fr)} .cs-tree2 .links{display:none} .cs-tree2 .root{margin-bottom:18px} .cs-flow2{grid-template-columns:minmax(0,1fr)} .cs-flow2 .arr{transform:rotate(90deg);justify-self:center} }
/* two parts, cleaner */
.cs-parts{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:stretch;gap:14px;padding:14px;border-radius:24px;background:var(--tile)}
.cs-part2{background:var(--paper);border-radius:16px;padding:22px 22px 18px;box-shadow:0 0 0 1px var(--line);display:flex;flex-direction:column;gap:10px}
.cs-part2 .n{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--mute)}
.cs-part2 b{font-weight:500;font-size:19px;line-height:1.35;flex:1}
.cs-part2 .who{display:inline-flex;align-items:flex-start;margin-top:10px}
.cs-part2 .who svg{width:20px;height:20px;margin-right:-2px;filter:drop-shadow(0 1px 2px rgba(0,0,0,.2))}
.cs-part2 .who i{font-style:normal;margin-top:12px;padding:4px 9px;border-radius:3px 8px 8px 8px;background:var(--c);color:var(--t);font-size:13px;font-weight:500}
.cs-parts .plus{align-self:center;font-size:22px;color:var(--mute);width:28px;text-align:center}
/* iterations, one section */
.cs-iters{border-radius:24px;background:radial-gradient(120% 90% at 0% 0%,#F1EEFF 0%,#E4DEFD 60%,#DDD6FC 100%);padding:clamp(20px,4vw,44px)}
:root[data-theme="dark"] .cs-iters{background:radial-gradient(120% 90% at 0% 0%,#2A2640 0%,#221F35 60%,#1C1A2C 100%)}
.it-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;margin-bottom:28px}
.it-k{margin:0 0 6px;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:#6A4FF0}
.it-head h3{margin:0;font-family:var(--serif);font-weight:400;font-size:clamp(26px,3vw,34px);line-height:1.1}
.it-tabs{display:inline-flex;gap:4px;padding:4px;border-radius:99px;background:rgba(255,255,255,.6);box-shadow:0 0 0 1px rgba(40,30,90,.08)}
:root[data-theme="dark"] .it-tabs{background:rgba(255,255,255,.06)}
.it-tab{all:unset;cursor:pointer;padding:8px 14px;border-radius:99px;font-size:14px;font-weight:500;color:var(--mute);white-space:nowrap}
.it-tab[aria-pressed="true"]{background:var(--ink);color:var(--paper)}
.it-tab:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.it-panel{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;animation:panelIn .35s cubic-bezier(.2,.8,.2,1)}
.it-panel[hidden]{display:none}
.it-v{margin:0 0 10px;font-size:14px;font-weight:500;display:flex;align-items:center;gap:8px}
.it-v em{font-style:normal;font-size:12px;padding:2px 8px;border-radius:99px;background:#2F8F5B;color:#fff}
.cs-win.sm .bar{height:24px;padding:0 10px}
.cs-win.sm .bar i{width:7px;height:7px}
.cs-win.sm img{display:block;width:100%;height:auto}
.it-notes{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-direction:column;gap:8px}
.it-notes li{position:relative;padding-left:26px;font-size:15px;line-height:1.5}
.it-notes li::before{position:absolute;left:0;top:2px;width:18px;height:18px;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:700;color:#fff}
.it-notes li.g::before{content:"✓";background:#2F8F5B}
.it-notes li.b::before{content:"✕";background:#D14B3B}
@media (max-width: 820px){ .cs-parts{grid-template-columns:minmax(0,1fr)} .cs-parts .plus{justify-self:center} .it-panel{grid-template-columns:minmax(0,1fr)} .it-tabs{overflow-x:auto;max-width:100%} }
/* xalts case study */
.cs-mock.xa,.cs-iters.xa{background:radial-gradient(120% 90% at 0% 0%,#EEF3FA 0%,#DDE7F4 60%,#CFDDEF 100%)}
:root[data-theme="dark"] .cs-mock.xa,:root[data-theme="dark"] .cs-iters.xa{background:radial-gradient(120% 90% at 0% 0%,#1F2836 0%,#1A2230 60%,#161C27 100%)}
.cs-mock.xa figcaption{color:#4E5E74}
.cs-iters.xa .it-k{color:#1E5AA8}
.xa-what{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:12px;border-radius:24px;background:var(--tile)}
.xa-what>div{background:var(--paper);border-radius:16px;padding:22px;box-shadow:0 0 0 1px var(--line)}
.xa-what .k{margin:12px 0 4px;font-weight:500;font-size:17px}
.xa-what p:not(.k){margin:0;color:var(--mute);font-size:15px;line-height:1.55}
.xa-what .cs-ic,.xa-stories .cs-ic{color:#1E5AA8}
.xa-persona{border-radius:24px;background:var(--tile);padding:28px;display:grid;grid-template-columns:minmax(0,280px) minmax(0,1fr);gap:28px;align-items:center}
.xa-persona .who{display:flex;gap:14px;align-items:center}
.xa-persona .av{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:#1E3A5F;color:#fff;font-family:var(--serif);font-size:26px}
.xa-persona b{display:block;font-weight:500;font-size:18px}
.xa-persona .who span:not(.av){font-size:14px;color:var(--mute)}
.xa-persona p{margin:0;font-size:17px;line-height:1.6}
.xa-stories{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.xa-stories .st{border-radius:16px;padding:20px 22px;background:var(--paper);box-shadow:0 0 0 1px var(--line)}
.xa-stories .st.me{box-shadow:0 0 0 1.5px #1E5AA8}
.xa-stories .t{margin:0 0 8px;font-size:13px;letter-spacing:.04em;text-transform:uppercase;color:var(--mute);display:flex;align-items:center;gap:8px}
.xa-stories em{font-style:normal;text-transform:none;letter-spacing:0;font-size:12px;font-weight:500;padding:2px 8px;border-radius:99px;background:#1E5AA8;color:#fff}
.xa-stories em.o{background:var(--tile);color:var(--mute);box-shadow:0 0 0 1px var(--line)}
.xa-stories .st p:not(.t){margin:0;font-size:17px;line-height:1.5}
.xa-onb{margin:0;border-radius:24px;background:var(--tile);padding:32px 24px 24px}
.xa-onb ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.xa-onb .main li{border-radius:14px;padding:16px;text-align:center;background:var(--paper);color:var(--mute);box-shadow:0 0 0 1px var(--line);font-size:15px}
.xa-onb .main li span{display:block;font-size:12px;letter-spacing:.06em;text-transform:uppercase;margin-bottom:4px;opacity:.8}
.xa-onb .main li.on{background:#1E3A5F;color:#fff;box-shadow:0 10px 24px -12px rgba(30,58,95,.8)}
.xa-onb .drop{position:relative;height:40px;margin:0 12.5%;border:1.5px solid var(--line);border-top:0;border-radius:0 0 14px 14px;width:auto}
.xa-onb .drop::before{content:"";position:absolute;left:calc(66.6% + 0px);top:-2px;height:22px;border-left:1.5px solid var(--line)}
.xa-onb .drop{border:0;height:32px}
.xa-onb .drop::before{left:62.5%;height:32px}
.xa-onb .sub li{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;padding:18px 14px;border-radius:16px;background:var(--paper);box-shadow:0 0 0 1px var(--line);font-size:15px;line-height:1.35}
.xa-onb .sub i{font-style:normal;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#E6EEF8;color:#1E5AA8;font-size:13px;font-weight:600}
.xa-onb .sub{position:relative;padding-top:18px}
.xa-onb .sub::before{content:"";position:absolute;left:12.5%;right:12.5%;top:0;height:18px;border:1.5px solid var(--line);border-bottom:0;border-radius:12px 12px 0 0}
.xa-onb figcaption{margin-top:18px;text-align:center;font-size:14px;color:var(--mute)}
.xa-wmap{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:12px;border-radius:24px;background:var(--tile)}
.xa-wmap .w{background:var(--paper);border-radius:16px;padding:20px 22px;box-shadow:0 0 0 1px var(--line)}
.xa-wmap .h{margin:0 0 10px;font-weight:500;font-size:17px;display:flex;align-items:center;gap:8px}
.xa-wmap .h::before{content:"";width:10px;height:10px;border-radius:3px;background:#1E5AA8}
.xa-wmap ul{list-style:none;margin:0;padding:0}
.xa-wmap li{display:grid;grid-template-columns:minmax(0,150px) minmax(0,1fr);gap:12px;padding:10px 0;border-top:1px solid var(--line);font-size:15px;line-height:1.45}
.xa-wmap li b{font-weight:500}
.xa-wmap li span{color:var(--mute)}
.xa-ia{border-radius:24px;background:var(--tile);padding:28px}
.xa-ia .root{margin:0 auto 22px;width:max-content;padding:10px 20px;border-radius:99px;background:#1E3A5F;color:#fff;font-weight:500}
.xa-ia .cols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.xa-ia .cols>div{background:var(--paper);border-radius:16px;padding:18px;box-shadow:0 0 0 1px var(--line)}
.xa-ia b{display:block;font-weight:500;margin-bottom:8px}
.xa-ia ul{list-style:none;margin:0;padding:0;font-size:14px;line-height:1.5;color:var(--ink)}
.xa-ia li{padding:5px 0 5px 14px;position:relative}
.xa-ia li::before{content:"";position:absolute;left:0;top:13px;width:6px;height:1.5px;background:var(--mute)}
.xa-ia ul ul{margin-top:2px;padding-left:8px;border-left:1.5px solid var(--line);color:var(--mute)}
@media (max-width: 820px){ .xa-what,.xa-stories,.xa-wmap,.xa-ia .cols,.xa-persona{grid-template-columns:minmax(0,1fr)} .xa-onb ol{grid-template-columns:repeat(2,minmax(0,1fr))} .xa-onb .drop{display:none} .xa-onb .sub{margin-top:14px} .xa-wmap li{grid-template-columns:minmax(0,1fr);gap:2px} }
/* curelink case study */
.cs-mock.cl,.cs-iters.cl{background:radial-gradient(120% 90% at 0% 0%,#EDF5FF 0%,#DCEBFD 60%,#CFE2FB 100%)}
:root[data-theme="dark"] .cs-mock.cl,:root[data-theme="dark"] .cs-iters.cl{background:radial-gradient(120% 90% at 0% 0%,#1B2636 0%,#172131 60%,#141C29 100%)}
.cs-mock.cl figcaption{color:#475A73}
.cs-iters.cl .it-k{color:#1F7AE8}
.cl-shot{display:flex;justify-content:center;align-items:flex-start;min-height:0}
.cl-shot .zoom{width:auto;max-width:100%}
.cl-shot img{display:block;max-height:520px;width:auto;max-width:100%;height:auto;border-radius:18px;box-shadow:0 0 0 1px rgba(20,40,80,.06),0 20px 40px -20px rgba(20,40,80,.35)}
.cl-care{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;padding:12px;border-radius:24px;background:var(--tile)}
.cl-care>div{background:var(--paper);border-radius:16px;padding:24px;box-shadow:0 0 0 1px var(--line)}
.cl-care .h{margin:0 0 14px;font-weight:500;font-size:17px}
.cl-care .chips{display:flex;flex-wrap:wrap;gap:8px}
.cl-care .chips span{padding:7px 12px;border-radius:99px;background:#EDF5FF;color:#185FB5;font-size:14px}
:root[data-theme="dark"] .cl-care .chips span{background:rgba(31,122,232,.18);color:#9CC6FA}
.cl-care .wa{display:flex;align-items:center;gap:8px;margin:16px 0 0;font-size:14px;color:var(--mute)}
.cl-care .wa i{width:10px;height:10px;border-radius:50%;background:#25D366}
.cl-care ol{list-style:none;margin:0;padding:0;counter-reset:lp;display:flex;flex-direction:column;gap:8px}
.cl-care ol li{counter-increment:lp;display:flex;align-items:center;gap:12px;font-size:16px}
.cl-care ol li::before{content:counter(lp);flex:none;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:#1F7AE8;color:#fff;font-size:12px;font-weight:600}
.cl-care ol li:not(:last-child)::after{content:"";}
.cl-care .again{margin:12px 0 0 38px;font-size:14px;color:#1F7AE8}
.cl-defs,.cl-vs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.cl-defs>div,.cl-vs>div{border-radius:16px;padding:22px;background:var(--paper);box-shadow:0 0 0 1px var(--line)}
.cl-defs .k,.cl-vs .k{margin:0 0 6px;font-weight:500;font-size:17px;display:flex;align-items:center;gap:8px}
.cl-defs p:not(.k){margin:0;color:var(--mute);font-size:16px;line-height:1.55}
.cl-vs .on{box-shadow:0 0 0 1.5px #1F7AE8}
.cl-vs em{font-style:normal;font-size:12px;padding:2px 8px;border-radius:99px;background:#1F7AE8;color:#fff;font-weight:500}
.cl-vs .it-notes{margin-top:10px}
.cl-data{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:12px;border-radius:24px;background:var(--tile)}
.cl-data>div{background:var(--paper);border-radius:16px;padding:22px;box-shadow:0 0 0 1px var(--line)}
.cl-data .st b{display:block;font-family:var(--serif);font-weight:400;font-size:44px;line-height:1}
.cl-data .st.g b{color:#2F8F5B}.cl-data .st.b b{color:#D14B3B}
.cl-data .st p{margin:8px 0 0;font-size:16px;color:var(--mute)}
.cl-data .split{grid-column:1/-1}
.cl-data .split .h{margin:0 0 12px;font-weight:500}
.cl-data .bar{display:flex;height:44px;border-radius:12px;overflow:hidden;gap:3px}
.cl-data .bar span{flex:0 0 var(--w);background:var(--c);color:#fff;display:flex;align-items:center;padding:0 12px;font-size:14px;font-weight:500;white-space:nowrap;overflow:hidden}
.cl-data .note{margin:12px 0 0;font-size:15px;color:var(--mute)}
.cl-personas{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.cl-personas .pcard{border-radius:20px;padding:24px;background:var(--paper);box-shadow:0 0 0 1px var(--line)}
.cl-personas .pcard.hi{box-shadow:0 0 0 1.5px #F2994A}
.cl-personas .who{display:flex;gap:14px;align-items:center;margin-bottom:14px}
.cl-personas .av{width:52px;height:52px;flex:none;border-radius:50%;display:grid;place-items:center;background:var(--c);color:#fff;font-weight:600;font-size:16px}
.cl-personas b{display:block;font-weight:500;font-size:18px}
.cl-personas .who span:not(.av){font-size:14px;color:var(--mute)}
.cl-personas .pcard>p{margin:0 0 14px;font-size:16px}
.cl-personas dl{margin:0;display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px 16px;font-size:15px}
.cl-personas dt{color:var(--mute)}
.cl-personas dd{margin:0}
.cl-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:12px;border-radius:24px;background:var(--tile)}
.cl-card{border-radius:18px;padding:22px;background:var(--paper);box-shadow:0 0 0 1px var(--line)}
.cl-card .face{width:72px;height:92px;border-radius:12px;display:grid;place-items:center;margin-bottom:16px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.06),0 10px 20px -10px rgba(0,0,0,.35)}
.cl-card .face svg{width:34px;height:34px;fill:none;stroke:rgba(255,255,255,.9);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.cl-card.gold .face{background:linear-gradient(145deg,#FFE37A,#F2B705)}
.cl-card.silver .face{background:linear-gradient(145deg,#E9ECEF,#A7AFB8)}
.cl-card.bronze .face{background:linear-gradient(145deg,#E8B07A,#B8733A)}
.cl-card b{font-weight:500;font-size:17px}
.cl-card .amt{margin:4px 0 6px;font-family:var(--serif);font-size:28px;line-height:1.1}
.cl-card p:last-child{margin:0;color:var(--mute);font-size:15px}
.cl-flow{margin:0;border-radius:24px;background:var(--tile);padding:24px;display:flex;flex-direction:column;gap:18px}
.cl-flow .h{margin:0 0 10px;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--mute)}
.cl-flow .row{display:flex;align-items:stretch;gap:8px;flex-wrap:wrap}
.cl-flow .n{flex:1 1 150px;display:flex;align-items:center;justify-content:center;text-align:center;padding:14px;border-radius:14px;background:var(--paper);box-shadow:0 0 0 1px var(--line);font-size:15px;line-height:1.45}
.cl-flow .n.two{flex-direction:column;gap:4px}
.cl-flow .n b{font-weight:500}
.cl-flow .n.gold{box-shadow:0 0 0 1.5px #F2B705}
.cl-flow .a{align-self:center;color:var(--mute);font-size:18px}
.cl-vids{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;padding:clamp(20px,4vw,40px);border-radius:24px;background:radial-gradient(120% 90% at 0% 0%,#EDF5FF 0%,#DCEBFD 60%,#CFE2FB 100%)}
:root[data-theme="dark"] .cl-vids{background:radial-gradient(120% 90% at 0% 0%,#1B2636 0%,#172131 60%,#141C29 100%)}
.cl-vid{margin:0;display:flex;flex-direction:column;align-items:center}
.cl-vid video{display:block;width:100%;max-width:260px;height:auto;aspect-ratio:622/1378;border-radius:22px;background:#fff;box-shadow:0 0 0 1px rgba(20,40,80,.06),0 20px 40px -20px rgba(20,40,80,.4)}
.cl-vid.wide video{max-width:100%;aspect-ratio:2308/1378;border-radius:12px;background:transparent;box-shadow:none}
.cl-vid figcaption,.cs-mock.cl .cl-vid figcaption{margin-top:14px;text-align:center;font-size:14px;color:#475A73}
:root[data-theme="dark"] .cl-vid figcaption{color:var(--mute)}
.cs-quote .by{margin-top:14px;font-size:15px;color:var(--mute)}
@media (max-width: 820px){ .cl-care,.cl-defs,.cl-vs,.cl-data,.cl-personas,.cl-cards,.cl-vids{grid-template-columns:minmax(0,1fr)} .cl-data .bar span{font-size:12px;padding:0 8px} .cl-flow .a{transform:rotate(90deg)} .cl-flow .row{flex-direction:column} .cl-shot img{max-height:420px} }
.comp-tile:has(a.case){cursor:pointer}
.comp-tile:has(a.case) .pc{cursor:pointer}
.comp-tile:has(a.case):hover .case{text-decoration:underline;transform:translateY(-1px)}
.tile .case{transition:transform .2s}
/* alphy */
.al-svg{display:block;line-height:0}
.al-svg svg{display:block;width:100%;height:auto}
.al-hero{margin:0;border-radius:24px;padding:clamp(20px,4vw,48px);background:linear-gradient(160deg,#2B2344,#4C3A66 60%,#8A6484)}
.al-hero .mac{border-radius:12px;overflow:hidden;box-shadow:0 30px 60px -24px rgba(0,0,0,.6),0 0 0 1px rgba(255,255,255,.08);background:#1f1a2e}
.al-hero .bar{display:flex;gap:6px;align-items:center;height:28px;padding:0 12px;background:#2a2438}
.al-hero .bar i{width:10px;height:10px;border-radius:50%;background:#FF6159}.al-hero .bar i:nth-child(2){background:#FFBD2E}.al-hero .bar i:nth-child(3){background:#28C941}
.al-hero video{display:block;width:100%;height:auto;aspect-ratio:1440/900;background:#2B2344}
.al-hero figcaption{margin-top:16px;text-align:center;font-size:14px;color:rgba(255,255,255,.75)}
.al-rule{border-radius:20px;padding:24px 28px;background:#2B2344;color:#fff;display:grid;grid-template-columns:auto minmax(0,1fr);gap:20px;align-items:baseline}
.al-rule b{font-weight:500;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:#C9B6F2}
.al-rule p{margin:0;font-family:var(--serif);font-size:clamp(22px,2.4vw,28px);line-height:1.3}
.al-states{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;padding:16px;border-radius:24px;background:#F6F3FB}
.al-states figure{margin:0;background:#fff;border-radius:16px;padding:14px 10px 12px;text-align:center;box-shadow:0 0 0 1px rgba(60,40,100,.06)}
.al-states .al-svg{max-width:110px;margin:0 auto}
.al-states figcaption{margin-top:8px;font-size:14px;color:#4A3F66;font-family:var(--hand);font-size:20px}
.al-states .cap{grid-column:1/-1;margin:6px 0 0;text-align:center;font-size:14px;color:#6B6187}
.al-tiers{list-style:none;margin:0;padding:16px;border-radius:24px;background:#F6F3FB;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;position:relative}
.al-tiers li{background:#fff;border-radius:16px;padding:16px;box-shadow:0 0 0 1px rgba(60,40,100,.06);color:#2A2340}
.al-tiers .pic{position:relative;height:118px;margin:0 auto 10px;display:flex;justify-content:center}
.al-tiers .pic .al-svg svg{height:118px;width:auto}
.al-tiers .bub{position:absolute;right:-6px;top:34%;background:#fff;border-radius:12px;padding:4px 10px;font-size:13px;box-shadow:0 4px 12px -4px rgba(60,40,100,.35);color:#4A3F66}
.al-tiers .t{margin:0;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#8A7FA8}
.al-tiers b{display:block;font-weight:500;font-size:17px;margin:2px 0 4px}
.al-tiers li p:last-child{margin:0;font-size:14px;color:#5E557A;line-height:1.5}
.al-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:16px;border-radius:24px;background:#F6F3FB}
.al-steps figure{margin:0;background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 0 0 1px rgba(60,40,100,.06);display:flex;flex-direction:column}
.al-steps .zoom{display:grid;place-items:center;aspect-ratio:4/3;background:#F6F3FB}
.al-steps img{max-width:86%;max-height:86%;width:auto;height:auto;object-fit:contain}
.al-steps figcaption{padding:14px 16px;font-size:14px;color:#5E557A;line-height:1.45}
.al-steps figcaption b{display:block;font-weight:500;font-size:16px;color:#2A2340}
.al-craft{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.al-craft .c{border-radius:20px;padding:22px;background:var(--tile)}
.al-craft .c.wide{grid-column:1/-1}
.al-craft .h{margin:0 0 6px;font-weight:500;font-size:18px}
.al-craft p{margin:0 0 12px;color:var(--mute);font-size:16px;line-height:1.55}
.al-stages{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.al-stages figure{margin:0;background:#F6F3FB;border-radius:14px;padding:14px;text-align:center}
.al-stages .al-svg{max-width:170px;margin:0 auto}
.al-stages figcaption{margin-top:6px;font-size:13px;color:#6B6187}
.al-stages figcaption b{display:block;font-weight:500;color:#2A2340;font-size:14px}
.al-craft .lines,.al-craft .freeze{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px;align-items:center}
.al-craft .lines span{font-family:var(--hand);font-size:21px;line-height:1;padding:8px 12px;border-radius:14px;background:var(--paper);box-shadow:0 0 0 1px var(--line)}
.al-craft .freeze span:not(.arr){padding:6px 12px;border-radius:99px;background:var(--paper);box-shadow:0 0 0 1px var(--line);font-size:14px}
.al-craft .freeze .arr{color:var(--mute)}
.al-craft .freeze b{font-weight:500;font-size:14px;padding:6px 12px;border-radius:99px;background:#2B2344;color:#fff}
.al-stats{grid-template-columns:repeat(4,minmax(0,1fr)) !important}
.al-bye{display:flex;flex-direction:column;align-items:center;gap:6px;padding:28px;border-radius:24px;background:#F6F3FB}
.al-bye .al-svg{width:120px}
.al-bye p{margin:0;font-family:var(--hand);font-size:26px;color:#4A3F66}
/* night schedule */
.ns-stage{margin:0;display:flex;justify-content:center;gap:clamp(16px,4vw,48px);padding:clamp(24px,5vw,56px) 16px;border-radius:24px;background:radial-gradient(120% 100% at 50% 0%,#FBF3E7 0%,#F3E4CF 70%,#EAD6BA 100%)}
:root[data-theme="dark"] .ns-stage,:root[data-theme="dark"] .ns-two,:root[data-theme="dark"] .ns-strip{background:radial-gradient(120% 100% at 50% 0%,#2B2620 0%,#241F1A 70%,#1D1915 100%)}
.ns-phone{display:block;width:min(260px,40vw);border-radius:34px;padding:8px;background:#1C1B1A;box-shadow:0 30px 60px -28px rgba(80,40,0,.55),0 0 0 1px rgba(0,0,0,.2)}
.ns-phone img{display:block;width:100%;height:auto;border-radius:27px}
.ns-stage .ns-phone:nth-child(2){transform:translateY(28px)}
.ns-guess{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.ns-guess>div{border-radius:18px;padding:22px;background:var(--paper);box-shadow:0 0 0 1px var(--line)}
.ns-guess .v{margin:0 0 10px;display:inline-block;font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;padding:3px 10px;border-radius:99px;color:#fff}
.ns-guess .g .v{background:#2F8F5B}.ns-guess .b .v{background:#D14B3B}
.ns-guess b{display:block;font-weight:500;font-size:18px;line-height:1.35;margin-bottom:6px}
.ns-guess>div>p:last-child{margin:0;color:var(--mute);font-size:15px;line-height:1.55}
.ns-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;padding:clamp(24px,4vw,48px);border-radius:24px;background:radial-gradient(120% 100% at 50% 0%,#FBF3E7 0%,#F3E4CF 70%,#EAD6BA 100%)}
.ns-two figure{margin:0;display:flex;flex-direction:column;align-items:center;gap:18px}
.ns-two figcaption{max-width:320px;text-align:center;font-size:15px;line-height:1.5;color:#6A5A48}
.ns-two figcaption b{display:block;font-weight:500;color:#2A2118;font-size:17px;margin-bottom:2px}
:root[data-theme="dark"] .ns-two figcaption{color:var(--mute)} :root[data-theme="dark"] .ns-two figcaption b{color:var(--ink)}
.ns-art{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.ns-art figure{margin:0;background:#FBF6EE;border-radius:16px;padding:10px 10px 12px;box-shadow:0 0 0 1px var(--line)}
.ns-art img{display:block;width:100%;height:auto;aspect-ratio:7/5;object-fit:cover;border-radius:10px}
.ns-art figcaption{margin-top:8px;text-align:center;font-family:var(--hand);font-size:20px;color:#6A5A48}
.ns-try{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 26px;border-radius:20px;background:#E8590C;color:#fff;text-decoration:none}
.ns-try b{display:block;font-weight:500;font-size:19px;margin-bottom:2px}
.ns-try span{font-size:15px;opacity:.95}
.ns-try .go{flex:none;padding:10px 16px;border-radius:99px;background:#fff;color:#1A1A1F;font-weight:500;opacity:1}
.ns-try:hover .go{transform:translateY(-1px)}
.ns-cut{margin:0;border-radius:24px;padding:clamp(24px,4vw,48px);background:var(--tile);display:flex;flex-direction:column;align-items:center}
.ns-cut .frame{position:relative;max-width:560px;width:100%}
.ns-cut img{display:block;width:100%;height:auto;border-radius:14px;box-shadow:0 0 0 1px var(--line),0 20px 40px -24px rgba(0,0,0,.35);filter:grayscale(.2)}
.ns-cut .stamp{position:absolute;right:-8px;top:-14px;transform:rotate(8deg);padding:6px 14px;border:2px solid #D14B3B;border-radius:8px;color:#D14B3B;font-weight:700;letter-spacing:.1em;text-transform:uppercase;font-size:14px;background:var(--paper)}
.ns-cut figcaption{margin-top:18px;max-width:560px;text-align:center;font-size:15px;color:var(--mute)}
.ns-strip{display:flex;gap:18px;overflow-x:auto;padding:clamp(24px,4vw,40px);border-radius:24px;background:radial-gradient(120% 100% at 50% 0%,#FBF3E7 0%,#F3E4CF 70%,#EAD6BA 100%);scroll-snap-type:x mandatory}
.ns-strip figure{margin:0;flex:0 0 auto;scroll-snap-align:center;display:flex;flex-direction:column;align-items:center;gap:12px}
.ns-strip .ns-phone{width:190px;border-radius:28px;padding:6px}
.ns-strip .ns-phone img{border-radius:23px}
.ns-strip figcaption{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#6A5A48}
@media (max-width: 820px){ .al-states{grid-template-columns:repeat(3,minmax(0,1fr))} .al-tiers,.al-steps,.al-craft,.ns-guess,.ns-art{grid-template-columns:repeat(2,minmax(0,1fr))} .al-craft .c.wide{grid-column:1/-1} .al-stats{grid-template-columns:repeat(2,minmax(0,1fr)) !important} .al-rule{grid-template-columns:minmax(0,1fr);gap:8px} .ns-try{flex-direction:column;align-items:flex-start} .ns-two{grid-template-columns:minmax(0,1fr)} .ns-stage .ns-phone:nth-child(2){transform:none} }
@media (max-width: 520px){ .al-tiers,.al-steps,.al-craft,.ns-guess{grid-template-columns:minmax(0,1fr)} }
/* case nav */
.case-nav{margin-top:24px;padding-top:40px;border-top:1px solid var(--line)}
.cn-head{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:20px}
.cn-head p{margin:0;color:var(--mute);font-size:15px}
.cn-head p b{font-weight:500;color:var(--ink)}
.cn-dots{display:flex;align-items:center;gap:8px}
.cn-dot{width:10px;height:10px;border-radius:50%;background:var(--line);transition:transform .2s,background .2s}
.cn-dot.on{background:var(--cc);transform:scale(1.35)}
.cn-dot:hover{background:var(--cc)}
.cn-dots span{margin-left:6px;font-size:13px;color:var(--mute);font-variant-numeric:tabular-nums}
.cn-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:14px}
.cn-grid.solo{grid-template-columns:minmax(0,1fr)}
.cn-card{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 42%;min-height:220px;border-radius:24px;overflow:hidden;text-decoration:none;color:var(--ink);background:var(--tile);isolation:isolate;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}
.cn-card.next{background:var(--cc);color:#fff}
.cn-card:hover{transform:translateY(-4px);box-shadow:0 24px 48px -28px rgba(0,0,0,.45)}
.cn-card:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.cn-txt{display:flex;flex-direction:column;gap:6px;padding:26px}
.cn-k{font-size:13px;letter-spacing:.04em;opacity:.75}
.cn-card b{font-family:var(--serif);font-weight:400;font-size:clamp(28px,3vw,40px);line-height:1.05;margin-top:6px}
.cn-l{font-size:16px;line-height:1.45;opacity:.85}
.cn-m{margin-top:auto;padding-top:14px;font-size:13px;opacity:.65}
.cn-img{position:relative;overflow:hidden}
.cn-img img{position:absolute;left:10%;top:14%;width:118%;height:auto;max-width:none;border-radius:10px;box-shadow:0 20px 40px -18px rgba(0,0,0,.5);transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.cn-card.prev .cn-img img{opacity:.9}

.cn-img img[width]{}
.cn-card:hover .cn-img img{transform:translate(-8px,-8px) rotate(-1.5deg)}
.cn-foot{display:flex;gap:22px;margin-top:18px;font-size:15px}
.cn-foot a{color:var(--mute);text-decoration:none}
.cn-foot a:hover{color:var(--ink)}
@media (max-width: 820px){ .cn-grid{grid-template-columns:minmax(0,1fr)} .cn-card{grid-template-columns:minmax(0,1fr) 38%;min-height:180px} .cn-card.prev{min-height:0;grid-template-columns:minmax(0,1fr)} .cn-card.prev .cn-img{display:none} .cn-txt{padding:20px} }
/* reading progress */
.rprog{position:fixed;left:0;right:0;top:0;height:3px;z-index:80;background:var(--case,var(--accent));transform-origin:0 50%;transform:scaleX(0);transition:transform .12s linear;pointer-events:none;padding-top:env(safe-area-inset-top,0px)}
body:not(.is-case) .rprog{opacity:0}
.rchip{all:unset;box-sizing:border-box;cursor:pointer;position:fixed;left:max(20px,env(safe-area-inset-left,0px));bottom:calc(20px + env(safe-area-inset-bottom,0px));z-index:40;display:flex;align-items:center;gap:12px;height:52px;padding:0 16px 0 10px;border-radius:99px;color:var(--ink);font-family:var(--sans);
  background:rgba(250,250,248,.86);-webkit-backdrop-filter:blur(16px) saturate(1.6);backdrop-filter:blur(16px) saturate(1.6);box-shadow:0 0 0 1px var(--line),0 10px 28px -10px rgba(0,0,0,.3);transition:opacity .3s,transform .35s cubic-bezier(.2,.8,.2,1)}
:root[data-theme="dark"] .rchip{background:rgba(30,30,34,.86)}
.rchip[hidden]{display:none}
.rchip.away{opacity:0;transform:translateY(12px);pointer-events:none}
.rchip .ring{--p:0;width:32px;height:32px;border-radius:50%;background:conic-gradient(var(--case,var(--accent)) calc(var(--p)*360deg),var(--line) 0);-webkit-mask:radial-gradient(circle,transparent 11px,#000 11.5px);mask:radial-gradient(circle,transparent 11px,#000 11.5px)}
.rchip .t{display:flex;flex-direction:column;line-height:1.2;max-width:200px}
.rchip .t b{font-weight:500;font-size:14px}
.rchip .sec-name{font-size:12px;color:var(--mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rchip .left{font-size:12px;color:var(--mute);padding-left:10px;border-left:1px solid var(--line);white-space:nowrap}
.rchip:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
@media (max-width: 520px){ .rchip{height:48px;padding:0 12px 0 8px;gap:8px} .rchip .t{max-width:120px} .rchip .ring{width:28px;height:28px} }
.cn-foot{display:flex;justify-content:center;align-items:center;gap:12px;flex-wrap:wrap;margin-top:22px !important}
.cn-foot .cn-home,.cn-foot .cn-all{display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:0 24px;border-radius:99px;font-size:16px;font-weight:500;text-decoration:none;transition:transform .2s,background-color .2s}
.cn-foot .cn-home{background:var(--ink);color:var(--paper)}
.cn-foot .cn-all{border:1px solid var(--line);color:var(--ink);background:var(--paper)}
.cn-foot .cn-home:hover,.cn-foot .cn-all:hover{transform:translateY(-2px);color:inherit}
.cn-foot .cn-home:hover{color:var(--paper)}
.cn-foot svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s}
.cn-foot .cn-home:hover svg{transform:translateX(-3px)}
/* stronger back link at the top of subpages */
.ph .back,.dq-hero .back{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 16px 0 12px;border-radius:99px;border:1px solid var(--line);background:var(--paper);color:var(--ink);font-size:15px;font-weight:500;transition:background-color .2s,transform .2s}
.ph .back:hover,.dq-hero .back:hover{background:var(--tile);color:var(--ink)}
.ph .back::before,.dq-hero .back::before{width:16px;height:16px}
.cn-grid.solo .cn-card{grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:280px}
.cn-grid.solo .cn-txt{padding:36px 40px}
.cn-grid.solo .cn-card b{font-size:clamp(36px,4.4vw,56px)}
.cn-grid.solo .cn-l{font-size:18px}
@media (max-width: 820px){ .cn-grid.solo .cn-card{grid-template-columns:minmax(0,1fr) 38%;min-height:200px} .cn-grid.solo .cn-txt{padding:22px} }
.cn-grid.solo .cn-img img{width:min(118%,620px)}
.cn-img img.tall{width:min(52%,240px) !important;left:24%;top:12%;border-radius:18px}
/* hero v2: headline size, centred icons, readable highlights */
.intro h1.lead{font-size:clamp(40px,5vw,60px) !important;line-height:1.08 !important;letter-spacing:-.015em !important;max-width:920px !important;margin:0 0 40px !important}
.intro .lead .hw{white-space:normal}
.ico{vertical-align:middle !important;width:.92em;height:.92em;border-radius:.24em;margin-left:.08em;position:relative;top:-.06em}
.ico svg{width:58%;height:58%}
.i-eye{--rt:3deg}.i-bolt{--rt:-3deg}.i-team{--rt:4deg}
.hw:hover .i-eye svg{stroke:#2F5BD3}.hw:hover .i-bolt svg{stroke:#E0703A}.hw:hover .i-team svg{stroke:#2F8F5B}
:root[data-theme="dark"] .hw:hover .i-eye svg{stroke:#7EA0FF}
.i-eye .lid{transform-origin:12px 12px;transform-box:view-box}
.hw:hover .i-eye .lid{animation:blink .6s ease .1s}
@keyframes blink{40%{transform:scaleY(.1)}}
.hw:hover .i-bolt svg path{animation:zap .5s ease .05s}
@keyframes zap{30%{transform:translate(-1px,1px)}60%{transform:translate(1px,-1px)}}
.i-team .ppl,.i-team .go{transition:transform .4s cubic-bezier(.34,1.56,.64,1)}
.hw:hover .i-team .go{transform:translateX(2px)}
.hw:hover .i-team .ppl{transform:translateX(1px)}
.hero-fx{display:none !important}
.intro .proof{border-top:1px solid var(--line);padding-top:24px !important;gap:0 !important}
.intro .proof li{padding:0 24px !important;gap:6px !important}
.intro .proof li:first-child{padding-left:0 !important}
.intro .proof b{font-size:19px !important;font-weight:500 !important;color:var(--ink) !important;line-height:1.25 !important}
.intro .proof span{font-size:15px !important;line-height:1.45 !important;color:var(--ink) !important;opacity:.72}
@media (max-width: 820px){ .intro h1.lead{font-size:clamp(34px,9vw,44px) !important} .intro .proof{row-gap:22px !important} .intro .proof li{padding:0 14px !important} .intro .proof li:nth-child(odd){padding-left:0 !important} .intro .proof b{font-size:17px !important} .intro .proof span{font-size:14px !important} }
@media (prefers-reduced-motion: reduce){ .ico *{animation:none !important} }
.intro .lead .nw{white-space:nowrap}
/* desktop mockup frame for web screens in tiles */
.pc .webframe{display:block;border-radius:clamp(8px,1.4cqw,14px);overflow:hidden;background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.08),0 1px 0 rgba(255,255,255,.5) inset,0 30px 60px -26px rgba(20,10,60,.6)}
.pc .bbar{display:flex;align-items:center;gap:max(3px,.7cqw);height:max(14px,3.2cqw);padding:0 max(6px,1.4cqw);background:#F3F2F7;border-bottom:1px solid #E6E4EE}
.pc .bbar i{width:max(5px,1.1cqw);height:max(5px,1.1cqw);border-radius:50%;background:#FF6159;flex:none}
.pc .bbar i:nth-child(2){background:#FFBD2E}.pc .bbar i:nth-child(3){background:#28C941}
.pc .bbar em{flex:0 1 38%;height:max(6px,1.5cqw);margin:0 auto;border-radius:99px;background:#fff;box-shadow:0 0 0 1px #E6E4EE;transform:translateX(-10%)}
.pc .webframe .shot-web{border-radius:0 !important;box-shadow:none !important}
.ab-motto .note{gap:14px !important}
.ab-motto .note span{position:relative;top:4px}
.ab-motto .ring .note svg{position:static !important;left:auto;top:auto;width:48px !important;height:36px !important;flex:none;overflow:visible}
@media (max-width: 820px){ .ab-motto .ring .note svg{width:34px !important;height:26px !important} }
/* recognition: photo matches the list height */
@media (min-width: 821px){
  .ab-rec{grid-template-columns:minmax(0,230px) minmax(0,1fr) !important;align-items:stretch !important}
  .ab-award{max-width:none !important;display:flex;flex-direction:column;align-self:stretch}
  .ab-award .zoom{flex:1;display:block;min-height:0;position:relative}
  .ab-award img{position:absolute;inset:0;width:100% !important;height:100% !important;aspect-ratio:auto !important;object-fit:cover;object-position:50% 45%}
  .ab-award figcaption{margin-top:14px}
}
/* desk section (pick something up) */
.desk-sec{--dk-bg:var(--paper);--dk-card:#fff;--dk-blue:#3D5DB8;--dk-yel:#EEC643;--dk-red:#B8432F;--dk-tape:rgba(238,198,67,.55)}
:root[data-theme="dark"] .desk-sec{--dk-card:#262624}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .desk-sec{--dk-card:#262624}}
.desk-sec a.dk-obj{color:var(--ink)}
.desk-sec .dk-note .dk-body{color:#1a1a1a}


.desk-sec{display:grid;grid-template-columns:1fr 1.25fr;gap:40px;align-items:center}
.desk-sec h2{font:400 clamp(44px,5.5vw,64px)/1 var(--serif);margin:0 0 18px;letter-spacing:-.01em}
.desk-sec .dk-copy p{color:var(--mute);max-width:34ch;margin:0}
.desk-sec .dk-hint{display:flex;align-items:flex-start;gap:6px;font:italic 400 22px/1.1 var(--serif);color:var(--mute);margin-top:28px}
.desk-sec .dk-hint svg{margin-top:10px;flex:none}

/* Desk canvas. Objects overlap each other on purpose, but never cover another object's label. */
.dk-desk{position:relative;height:570px}
.dk-obj{position:absolute;display:block;text-decoration:none;color:var(--ink);--x:0;--y:0;--lift:0;--s:1;
 transform:translate(calc(var(--x)*1px),calc((var(--y) - var(--lift))*1px)) rotate(var(--r)) scale(var(--s));
 transition:transform .45s cubic-bezier(.2,.8,.2,1),opacity .5s;cursor:grab;user-select:none;-webkit-user-drag:none;outline:none}
.dk-obj.dk-pre{opacity:0;--y:-140}
.dk-obj.dk-drag{transition:none;cursor:grabbing;--s:1.04}
.dk-obj:hover,.dk-obj:focus-visible{--lift:12}
.dk-obj:focus-visible .dk-body{outline:2px solid var(--dk-blue);outline-offset:6px}
.dk-inner{position:relative}
.dk-body{position:relative;box-shadow:0 1px 2px rgba(0,0,0,.06),0 18px 40px -14px rgba(0,0,0,.25);transition:box-shadow .35s}
.dk-obj:hover .dk-body{box-shadow:0 2px 4px rgba(0,0,0,.08),0 34px 60px -18px rgba(0,0,0,.35)}
.dk-inner.dk-nudge{animation:dknudge .9s cubic-bezier(.3,.7,.3,1)}
@keyframes dknudge{0%,100%{transform:none}25%{transform:rotate(-3deg) translateY(-6px)}55%{transform:rotate(2deg) translateY(-3px)}}

/* Labels: left-aligned under each object, on a bg-coloured pill so they stay legible */
.dk-lbl{position:absolute;left:0;top:calc(100% + 16px);white-space:nowrap;font-size:13px;font-weight:500;display:flex;gap:6px;align-items:center;background:var(--dk-bg);padding:2px 8px 2px 0;border-radius:6px;transform:rotate(calc(var(--r) * -1));transform-origin:left center}
.dk-lbl i{font-style:normal;color:var(--mute);font-weight:400}

/* "Opened" tick — lives on .dk-inner (not .dk-body) so it's never clipped */
.dk-seen{position:absolute;top:-12px;right:-12px;width:30px;height:30px;border-radius:50%;background:var(--ink);color:var(--dk-bg);display:grid;place-items:center;font-size:14px;transform:scale(0);transition:transform .35s cubic-bezier(.2,1.4,.4,1);z-index:4}
.dk-obj.dk-opened .dk-seen{transform:scale(1)}

/* 1 · Polaroid (flips to a teaser on hover) */
.dk-pol{left:0;top:40px;--r:-7deg;width:220px}
.dk-pol .dk-body{box-shadow:none}
.dk-flip{position:relative;transform-style:preserve-3d;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
@media (hover:hover){.dk-pol:hover .dk-flip{transform:rotateY(180deg)}}
.dk-face{background:var(--dk-card);padding:10px 10px 46px;backface-visibility:hidden;-webkit-backface-visibility:hidden;box-shadow:0 1px 2px rgba(0,0,0,.06),0 18px 40px -14px rgba(0,0,0,.25)}
.dk-face .dk-ph{aspect-ratio:4/5;overflow:hidden}.dk-face img{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}
.dk-face em{position:absolute;bottom:13px;left:0;right:0;text-align:center;font:italic 400 21px/1 var(--serif)}
.dk-back{position:absolute;inset:0;transform:rotateY(180deg);padding:26px 22px;display:flex;flex-direction:column;justify-content:space-between}
.dk-back p{font:italic 400 24px/1.15 var(--serif);margin:0}
.dk-back span{font-size:13px;font-weight:500}
.dk-tape{position:absolute;width:86px;height:24px;background:var(--dk-tape);top:-10px;left:50%;transform:translateX(-50%) rotate(-4deg);z-index:2}

/* 2 · Résumé sheet (paperclip, "1 page" stamp, Open PDF on hover) */
.dk-sheet{left:41%;top:18px;--r:4deg;width:240px}
.dk-sheet .dk-body{background:var(--dk-card);height:316px;padding:24px}
.dk-sheet h4{font:400 26px/1 var(--serif);margin:0 0 4px}.dk-sheet .dk-r{font-size:11px;color:var(--mute);margin-bottom:16px}
.dk-sheet .dk-row{font-size:11.5px;display:flex;justify-content:space-between;border-top:1px solid var(--line);padding:8px 0}
.dk-sheet .dk-row span:last-child{color:var(--mute)}
.dk-bars{margin-top:12px}.dk-bars div{height:5px;border-radius:3px;background:var(--line);margin:7px 0}
.dk-stamp{position:absolute;right:16px;top:22px;border:1.5px solid var(--dk-red);color:var(--dk-red);font-size:10px;font-weight:500;padding:4px 7px;border-radius:4px;transform:rotate(-8deg)}
.dk-clip{position:absolute;top:-16px;left:28px;z-index:2}
.dk-dl{position:absolute;inset:0;display:grid;place-items:center;transition:background .3s}
.dk-dl b{background:var(--ink);color:var(--dk-bg);font-weight:500;font-size:13px;padding:10px 16px;border-radius:999px;opacity:0;transform:translateY(8px);transition:.3s}
@media (hover:hover){.dk-sheet:hover .dk-dl{background:color-mix(in srgb,var(--dk-card) 55%,transparent)}.dk-sheet:hover .dk-dl b{opacity:1;transform:none}}

/* 3 · Sticky note (corner peels on hover). Placed low-right so it clears the résumé label. */
.dk-note{right:0;top:306px;--r:-3deg;width:206px}
.dk-note .dk-body{background:var(--dk-yel);height:206px;padding:18px 20px;color:#1a1a1a;overflow:hidden}
.dk-note svg.dk-sq{display:block;margin-bottom:12px}
.dk-note p{font:italic 400 23px/1.15 var(--serif);margin:0}
.dk-note small{position:absolute;left:20px;bottom:16px;font-size:12px;font-weight:500}
.dk-peel{position:absolute;right:0;bottom:0;width:0;height:0;background:linear-gradient(135deg,#d9ad2c 50%,var(--dk-bg) 50%);transition:width .35s,height .35s;box-shadow:-2px -2px 6px rgba(0,0,0,.12)}
.dk-note:hover .dk-peel{width:40px;height:40px}


@media (max-width:900px){.desk-sec{grid-template-columns:1fr;gap:32px}}
@media (max-width:560px){
 .dk-desk{height:640px}
 .dk-pol{left:0;top:8px;width:168px}
 .dk-sheet{left:auto;right:0;top:48px;width:178px}.dk-sheet .dk-body{height:250px;padding:18px}.dk-sheet h4{font-size:22px}.dk-sheet .dk-row{font-size:10.5px;padding:6px 0}.dk-bars{display:none}.dk-stamp{top:auto;bottom:14px}
 .dk-note{right:auto;left:8%;top:392px;width:190px}.dk-note .dk-body{height:190px}.dk-note p{font-size:20px}}
@media (prefers-reduced-motion:reduce){.dk-obj,.dk-flip,.dk-inner{transition:none!important;animation:none!important}.dk-obj.dk-pre{opacity:1;--y:0}}

.desk-sec{padding:8px 0}
.desk-sec h2{color:var(--ink)}
@media (max-width:900px){.desk-sec{grid-template-columns:minmax(0,1fr)}}
/* desk: two objects, grouped */
.desk-sec .dk-desk{height:440px;max-width:560px;margin-left:auto;margin-right:auto;width:100%}
.desk-sec .dk-pol{left:4%;top:56px;--r:-6deg;width:230px}
.desk-sec .dk-sheet{left:auto;right:4%;top:24px;--r:5deg;width:250px}
.desk-sec .dk-sheet .dk-body{height:330px}
@media (max-width:560px){
  .desk-sec .dk-desk{height:370px;max-width:none}
  .desk-sec .dk-pol{left:0;top:40px;width:168px}
  .desk-sec .dk-sheet{right:0;top:16px;width:184px}
  .desk-sec .dk-sheet .dk-body{height:258px}
}
/* desk v3: equal heights, clean labels */
.desk-sec .dk-pol{top:48px !important;width:230px !important}
.desk-sec .dk-sheet{top:48px !important;width:238px !important}
.desk-sec .dk-sheet .dk-body{height:318px !important}
.desk-sec .dk-lbl{left:50% !important;top:calc(100% + 22px) !important;transform:translateX(-50%) rotate(calc(var(--r) * -1)) !important;transform-origin:center !important;background:none !important;padding:0 !important;border-radius:0 !important;font-size:14px !important;gap:8px !important}
.desk-sec .dk-lbl i{font-style:normal;color:var(--mute);font-weight:400}
.desk-sec .dk-lbl::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.35}
@media (max-width:560px){
  .desk-sec .dk-pol{top:28px !important;width:164px !important}
  .desk-sec .dk-sheet{top:28px !important;width:172px !important}
  .desk-sec .dk-sheet .dk-body{height:233px !important;padding:16px !important}
  .desk-sec .dk-lbl{font-size:13px !important;top:calc(100% + 18px) !important}
  .desk-sec .dk-desk{height:360px !important}
  .desk-sec .dk-stamp{display:none}
}
/* ================= responsive pass: tablet + large monitors ================= */
@media (min-width: 601px) and (max-width: 820px){
  .wgrid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:16px !important}
  .wgrid .wtile,.wgrid.one .wtile{aspect-ratio:4/3 !important}
  .wgrid .wtile .mock{width:88% !important}
  .bento{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
  .tile{padding:56px 18px 28px}
  .tile:not(.full) .device{width:clamp(110px,26vw,210px) !important}
  .intro .proof{grid-template-columns:repeat(4,minmax(0,1fr)) !important}
  .intro .proof li{padding:0 14px !important;border-left:1px solid var(--line) !important}
  .intro .proof li:first-child{padding-left:0 !important;border-left:0 !important}
  .ab-open{grid-template-columns:minmax(0,1fr) minmax(0,210px) !important;gap:36px !important}
  .ab-rec{grid-template-columns:minmax(0,200px) minmax(0,1fr) !important;align-items:start !important}
  .xa-stories,.xa-wmap,.cl-defs,.cl-vs,.cl-personas,.cl-data,.cs-insights,.al-craft,.it-panel,.ns-two{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
  .cl-data .split{grid-column:1/-1}
  .al-craft .c.wide{grid-column:1/-1}
  .xa-what,.cs-steps,.cl-cards,.al-steps,.ns-guess,.cl-vids{grid-template-columns:repeat(3,minmax(0,1fr)) !important}
  .xa-ia .cols,.al-tiers{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
  .ns-art{grid-template-columns:repeat(4,minmax(0,1fr)) !important}
  .xa-persona{grid-template-columns:minmax(0,220px) minmax(0,1fr) !important}
  .cs-parts{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) !important}
  .cs-parts .plus{justify-self:center}
  .xa-onb ol{grid-template-columns:repeat(4,minmax(0,1fr)) !important}
  .xa-onb .drop{display:block}
  .cs-flow2{grid-template-columns:minmax(0,1fr) 40px minmax(0,1.35fr) !important}
  .cs-flow2 .arr{transform:none !important}
  .cs-tree2 .kids{grid-template-columns:repeat(3,minmax(0,1fr)) !important}
  .cs-tree2 .links{display:block !important}
  .al-states{grid-template-columns:repeat(6,minmax(0,1fr)) !important}
  .rv{grid-template-columns:1fr}
  .desk-sec{grid-template-columns:minmax(0,1fr) !important}
  .comp-tile:not(.full) figcaption .cl{display:none}
  .comp-tile figcaption{max-width:calc(100% - 130px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}
@media (min-width: 821px) and (max-width: 1100px){
  .wrap{padding:0 32px}
  .cn-grid.solo .cn-card{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}
  .xa-ia .cols{grid-template-columns:repeat(2,minmax(0,1fr))}
  .al-states{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (min-width: 1600px){
  .wrap{max-width:1260px}
  .site-foot{padding-left:max(24px,calc((100vw - 1212px)/2)) !important;padding-right:max(24px,calc((100vw - 1212px)/2)) !important}
  .intro h1.lead{max-width:1060px !important}
  .tabs-wrap{margin:0 -24px}
}
@media (min-width: 2000px){
  html{font-size:112.5%}
  body{font-size:18px}
  .wrap{max-width:1440px}
  .site-foot{padding-left:max(24px,calc((100vw - 1392px)/2)) !important;padding-right:max(24px,calc((100vw - 1392px)/2)) !important}
  .intro h1.lead{font-size:68px !important;max-width:1200px !important}
  .ph h1{font-size:68px}
  .intro .proof b{font-size:21px !important}.intro .proof span{font-size:16px !important}
  .text{max-width:720px}
  .fab-btn{height:60px;min-width:60px}
}
.desk-sec .dk-hint{align-items:center !important;gap:12px !important}
.desk-sec .dk-hint svg{margin-top:6px !important}

/* footer v5: CTA first, lived-in shelf at the very bottom */
.site-foot .sf-cta{display:flex;justify-content:space-between;align-items:flex-end;gap:28px;flex-wrap:wrap}
.site-foot .sf-cta .sf-big{margin:0 !important;font-size:clamp(40px,5vw,64px);line-height:1}
.site-foot .bsc{margin:96px 0 0;padding:0;border:0}
.bsc-head{display:flex;justify-content:space-between;align-items:baseline;gap:16px;flex-wrap:wrap}
.bsc-head p{margin:0}
.site-foot .bsc .bs-title{font-family:var(--sans);font-size:15px;font-weight:500;line-height:1.4}
.bsc-count{font-size:14px;color:var(--mute)}
.bsc-scroll{overflow-x:auto;overflow-y:hidden;scrollbar-width:none;margin-top:12px}
.bsc-scroll::-webkit-scrollbar{display:none}
.bsc-rack{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;padding:28px 32px 0;min-width:max-content}
.bsc-up{display:flex;align-items:flex-end;gap:2px}
.bsc-end{display:flex;align-items:flex-end}
.bsc-spine,.bsc-flat{all:unset;box-sizing:border-box;position:relative;cursor:pointer;flex:none;overflow:hidden;
  background-image:linear-gradient(90deg,rgba(0,0,0,.16),rgba(255,255,255,.14) 20%,rgba(255,255,255,0) 48%,rgba(0,0,0,.12));
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.08);transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.bsc-spine{display:flex;align-items:center;justify-content:center;border-radius:3px 3px 2px 2px}
/* printed rules instead of a flat colour block at the base */
.bsc-spine::before,.bsc-spine::after{content:"";position:absolute;left:7px;right:7px;height:1.5px;background:var(--acc);opacity:.9;
  box-shadow:0 4px 0 var(--acc)}
.bsc-spine::before{top:12px}
.bsc-spine::after{bottom:18px}
.bsc-spine span{writing-mode:vertical-rl;transform:rotate(180deg);font-size:12px;font-weight:600;letter-spacing:.15px;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bsc-spine:hover,.bsc-spine:focus-visible,.bsc-spine.on{transform:translateY(-14px)}
/* leaning book pivots on its bottom-left corner so it rests on the plank */
.bsc-spine.lean{transform-origin:0 100%;transform:rotate(-8deg);margin-left:34px}
.bsc-spine.lean:hover,.bsc-spine.lean:focus-visible,.bsc-spine.lean.on{transform:rotate(-8deg) translateY(-10px)}
.bsc-stack{display:flex;flex-direction:column;align-items:center;gap:1px}
.bsc-flat{height:30px;display:flex;align-items:center;padding:0 16px;border-radius:2px 3px 3px 2px;font-size:11px;font-weight:600;white-space:nowrap;
  background-image:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,0) 45%,rgba(0,0,0,.12))}
.bsc-flat::before,.bsc-flat::after{content:"";position:absolute;top:7px;bottom:7px;width:1.5px;background:var(--acc);opacity:.9}
.bsc-flat::before{left:7px}.bsc-flat::after{right:7px}
.bsc-flat:hover,.bsc-flat:focus-visible,.bsc-flat.on{transform:translateX(-10px)}
.bsc-spine:focus-visible,.bsc-flat:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.bsc-plant{width:70px;height:110px;margin-left:28px;flex:none}
.bsc-plank{height:14px;border-radius:3px;background:var(--shelf);
  box-shadow:inset 0 2px 0 rgba(255,255,255,.3),inset 0 -3px 0 rgba(0,0,0,.1),0 22px 28px -20px rgba(0,0,0,.4)}
.bsc-line{margin:22px 0 0;min-height:26px;font-size:16px;color:var(--mute)}
.bsc-line b{color:var(--ink);font-weight:500}
.site-foot .bsc + .sf-bottom{margin-top:56px}
@media (max-width: 820px){
  .site-foot .bsc{margin-top:72px}
  .bsc-rack{padding:24px 12px 0;gap:24px}
  .bsc-plant{display:none}
}
@media (prefers-reduced-motion:reduce){.bsc-spine,.bsc-flat{transition:none}}
/* desk: résumé slightly overlaps the story card */
.desk-sec .dk-desk{max-width:470px !important}
.desk-sec .dk-pol{left:0 !important}
.desk-sec .dk-sheet{right:0 !important;left:auto !important}
@media (max-width:560px){
  .desk-sec .dk-desk{max-width:330px !important}
  .desk-sec .dk-lbl i{display:none}
}
/* physics bookshelf at the very bottom */
.site-foot .bsp-wrap{margin:56px 0 0;padding:0;border:0}
.site-foot .sf-bottom{margin-top:40px}
.bsp-head{display:flex;justify-content:space-between;align-items:center;gap:16px}
.bsp-head p{margin:0}
.bsp-tidy{all:unset;cursor:pointer;font-size:14px;padding:6px 14px;border-radius:99px;border:1px solid var(--line);color:var(--ink)}
.bsp-tidy:hover{background:var(--paper)}
.bsp-tidy[hidden]{display:none}
.bsp-tidy:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.bsp{position:relative;margin-top:8px;user-select:none;-webkit-user-select:none;overflow:hidden}
.bsp-plank{position:absolute;height:14px;border-radius:3px;background:var(--shelf,#D4D2CC);box-shadow:inset 0 2px 0 rgba(255,255,255,.3),inset 0 -3px 0 rgba(0,0,0,.1),0 22px 28px -20px rgba(0,0,0,.4);z-index:1}
.bsp-bracket{position:absolute;width:14px;height:34px;border-radius:0 0 10px 0;border-right:3px solid var(--shelf,#D4D2CC);border-bottom:3px solid var(--shelf,#D4D2CC);opacity:.8}
.bsp-floor{position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--line)}
.bsp .bsp-body{position:absolute !important;left:0;top:0;transition:none !important;cursor:grab;touch-action:none;will-change:transform;z-index:2;margin:0 !important}
.bsp .bsp-body.grab{cursor:grabbing;z-index:5;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08),0 18px 30px -12px rgba(0,0,0,.35)}
.bsp .bsc-spine:hover,.bsp .bsc-flat:hover{transform:none}
.bsp.dragging{cursor:grabbing}
.bsp-plant{background:none;overflow:visible !important;z-index:3}
.bsp-plant svg{position:absolute;left:50%;bottom:0;width:var(--vw);height:var(--vh);transform:translateX(-50%);pointer-events:none;filter:drop-shadow(0 8px 10px rgba(0,0,0,.18))}
.bsp-plant::after{content:"";position:absolute;inset:-70% -10% 0 -10%}
/* bookshelf sits flush with the bottom of the page */
:root{padding-bottom:0 !important}
.site-foot{padding-bottom:env(safe-area-inset-bottom,0px) !important;margin-bottom:0 !important;border-radius:32px 32px 0 0}
.site-foot .bsp-floor{display:none}
@media (max-width: 820px){ .site-foot{padding-bottom:env(safe-area-inset-bottom,0px) !important} }
.site-foot .bsp-wrap{margin-top:48px !important}
.bsp{margin-top:0 !important}
.bsp-plank{border-radius:3px 3px 0 0 !important;left:0 !important;width:100% !important}
/* footer v4: lead + socials, buttons, then shelf */
.site-foot .sf-cta{align-items:center !important}
.sf-lead{display:flex;flex-direction:column;gap:16px}
.sf-social{display:flex;gap:10px;flex-wrap:wrap}
.sf-social a{display:inline-flex;align-items:center;gap:6px;padding:7px 12px 7px 14px;border-radius:99px;border:1px solid var(--line);background:var(--paper);color:var(--ink);text-decoration:none;font-size:14px;font-weight:500;transition:transform .2s,border-color .2s}
.sf-social a:hover{transform:translateY(-1px);border-color:var(--ink)}
.sf-social a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.sf-social svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;opacity:.6}
.site-foot .bsp-wrap{margin-top:64px !important}
.site-foot[data-fill] .sf-social{opacity:0;pointer-events:none;transition:opacity .15s}
@media (max-width: 820px){ .site-foot .sf-cta{flex-direction:column;align-items:flex-start !important} .site-foot .bsp-wrap{margin-top:48px !important} }
.bsp-plant svg{max-width:none !important}
.bsp .bsp-plant,.bsp .bsp-plant.grab{box-shadow:none !important;background:none !important;border:0 !important;outline:none}
.bsp .bsp-plant.grab svg{filter:drop-shadow(0 16px 14px rgba(0,0,0,.22))}
/* reserve Tidy up space so the first drag doesn't shift the page */
.bsp-tidy[hidden]{display:inline-block !important;visibility:hidden;opacity:0}
.bsp-tidy{transition:opacity .2s}
.bsp-head{min-height:36px}
.bsp{overflow-anchor:none}
/* books stay beneath the CTA fill */
.site-foot .bsp-wrap{position:relative;z-index:1}
.site-foot .bsp{z-index:1}
/* UI explorations: horizontal scroll driven by vertical scroll */
.ui-note{max-width:720px;margin:0 auto 56px;padding:0 24px;text-align:center}
.ui-note .tag{display:inline-block;font-size:13px;color:var(--mute);border:1px solid var(--line);border-radius:99px;padding:5px 12px;margin-bottom:14px}
.ui-note p{margin:0 0 8px;font-size:16px;color:var(--mute)}
.ui-note p strong{color:var(--ink);font-weight:500}
.hs{position:relative}
.hs-sticky{position:sticky;top:max(104px,calc(50vh - 300px));display:flex;flex-direction:column}
.hs-view{overflow:hidden}
.hs-track{display:flex;gap:16px;will-change:transform;padding:0 calc((100vw - min(100vw,1088px))/2 + 24px)}
.hs.free .hs-sticky{position:relative;top:0}
.hs.free .hs-view{scroll-padding-left:24px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:0 24px}
.hs.free .hs-view::-webkit-scrollbar{display:none}
.hs.free .hs-track{padding:0}
.hs.free .uicard{scroll-snap-align:start}
.hs-wrap{margin:0 calc(50% - 50vw)}
.uicard{flex:none;display:flex;flex-direction:column;gap:10px;width:min-content}
.uitile{height:396px;border-radius:20px;background:var(--bg);display:flex;align-items:center;justify-content:center;padding:28px;box-sizing:border-box}
.uitile.p{width:285px;padding:28px}
.uitile.w{width:568px}
.uitile .zoom{display:block;height:100%;width:auto;transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.uitile .zoom:hover{transform:translateY(-4px)}
.uitile .device{width:auto !important;height:100%;display:block;border:5px solid #0E0E10;border-radius:24px;background:#0E0E10;box-shadow:0 24px 40px -24px rgba(0,0,0,.5)}
.uitile .device::after{display:none}
.uitile .device img{height:100%;width:auto;border-radius:19px;display:block}
.uitile.w .zoom{height:100%;width:100%;display:flex;align-items:center;justify-content:center}
.uitile.w img{display:block;max-width:100%;max-height:100%;width:auto;height:auto;border-radius:8px;box-shadow:0 24px 40px -24px rgba(0,0,0,.5)}
.uicap{font-size:13px;max-width:100%;line-height:1.35;padding:0 4px}
.uicap b{font-weight:500;display:block}
.uicap span{color:var(--mute)}
.uicap a{color:var(--mute);text-decoration:underline;text-underline-offset:3px}
.uicap a:hover{color:var(--ink)}
.uicap .todo{color:#B4541A}
.hs-hint{display:flex;justify-content:center;gap:8px;align-items:center;font-size:13px;color:var(--mute);margin-top:14px}
.hs-bar{width:120px;height:3px;border-radius:3px;background:var(--line);overflow:hidden}
.hs-bar i{display:block;height:100%;width:0;background:var(--ink)}

@media (max-width: 820px){ .uitile{height:343px} .uitile.p{width:249px} .uitile.w{width:min(422px,86vw)} }

/* Create Image case study */
.ci-eye{font-size:14px !important;color:var(--mute);margin:18px 0 -6px !important;letter-spacing:.01em}
.ci-facts{grid-template-columns:repeat(4,minmax(0,1fr))}
.ci-facts div{line-height:1.5}
.ci-fig{margin:0}
.ci-fig figcaption{margin-top:12px;font-size:15px;color:var(--mute);line-height:1.5}
.ci-shot{position:relative}
.ci-zone{position:absolute;top:6.4%;bottom:0;pointer-events:none;border:1px solid var(--ink);display:flex;align-items:flex-start}
.ci-zone.in{left:0;width:29.2%;background:rgba(194,65,12,.07)}
.ci-zone.out{left:29.2%;right:0;background:rgba(23,23,26,.03)}
.ci-zone i{font-style:normal;font-size:12px;font-weight:500;background:var(--ink);color:var(--paper);padding:3px 8px;border-radius:0 0 6px 0}
.ci-ph-box{border-radius:16px;background:#F1EFEA;border:1px dashed #CFCAC0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:24px;text-align:center}
:root[data-theme="dark"] .ci-ph-box{background:#1E1E21;border-color:#3A3A3E}
.ci-ph-k{font-size:12px;font-weight:500;letter-spacing:.02em;color:#B4541A}
.ci-ph-w{font-size:14px;color:var(--mute);max-width:46ch;line-height:1.45}
.ci-nums{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.ci-nums div{padding:26px 22px;border-left:1px solid var(--line);display:flex;flex-direction:column;gap:8px}
.ci-nums div:first-child{border-left:0;padding-left:0}
.ci-nums b{font-family:var(--serif);font-weight:400;font-size:clamp(40px,4.4vw,56px);line-height:1;letter-spacing:-.02em}
.ci-nums sup{font-family:var(--sans);font-size:13px;vertical-align:top;margin-left:2px}
.ci-nums sup a{color:var(--mute);text-decoration:none}
.ci-nums span{font-size:15px;color:var(--mute);line-height:1.4}
.ci-ol,.ci-ul{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:12px}
.ci-ol li::marker{color:var(--mute)}
.ci-pr{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
.ci-decs{display:flex;flex-direction:column;gap:96px}
.ci-dec{max-width:820px;margin:0 auto;width:100%;display:flex;flex-direction:column;gap:14px}
.ci-dec .ci-dk{margin:0;font-size:14px;color:var(--mute)}
.ci-dec .ci-fig,.ci-dec .ci-tri{margin:6px 0 14px}
.ci-dec h3{margin:0;font-size:24px;font-weight:500;line-height:1.3;letter-spacing:-.01em}
.ci-dec p{margin:0}
.ci-dec code{font-family:'Geist Mono',ui-monospace,monospace;font-size:.9em;background:var(--soft);padding:1px 6px;border-radius:5px}
.ci-saw{display:flex;flex-direction:column;gap:4px;padding:14px 16px;border-radius:12px;background:var(--soft);color:var(--mute);font-size:15px;line-height:1.55}
.ci-saw span{font-size:12px;font-weight:500;color:var(--ink);letter-spacing:.02em}
.ci-tri{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:0 !important}
.ci-tri .ci-ph-box{padding:16px}
.ci-tri-cap{font-size:15px;color:var(--mute);margin:-4px 0 14px !important}
.ci-chart{margin:20px 0 6px;padding:24px;border:1px solid var(--line);border-radius:16px}
.ci-ch-t{margin:0 0 20px;font-size:15px;font-weight:500}
.ci-ch-t span{font-weight:400;color:var(--mute);margin-left:8px;font-size:14px}
.ci-bars{display:grid;grid-template-columns:repeat(14,minmax(0,1fr));gap:6px;height:220px;align-items:end;border-bottom:1px solid var(--line)}
.ci-col{height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:6px;position:relative}
.ci-col .b{width:100%;max-width:34px;background:var(--ink);border-radius:4px 4px 0 0;opacity:.82}
.ci-col.key .b{opacity:1}
.ci-col .v{font-size:11px;color:var(--mute);font-variant-numeric:tabular-nums}
.ci-col .m{position:absolute;top:100%;margin-top:8px;font-size:11px;color:var(--mute);text-align:center;line-height:1.2}
.ci-col .m em{display:block;font-style:normal;opacity:.75}
.ci-ch-notes{display:flex;justify-content:space-between;margin-top:42px;font-size:12px;color:var(--mute)}
.ci-chart figcaption{margin-top:12px;font-size:13px;color:var(--mute)}
.ci-hbars{display:flex;flex-direction:column;gap:12px}
.ci-hrow{display:grid;grid-template-columns:minmax(0,190px) minmax(0,1fr) 54px;gap:14px;align-items:center;font-size:14px}
.ci-hrow .tr{height:10px;border-radius:5px;background:var(--soft);overflow:hidden}
.ci-hrow .b{display:block;height:100%;background:var(--ink);border-radius:5px;min-width:3px}
.ci-hrow .v{text-align:right;font-variant-numeric:tabular-nums;color:var(--mute)}
.ci-hard .quote{color:var(--ink)}
.ci-fn ol{margin:0;padding-left:18px;font-size:13px;color:var(--mute);display:flex;flex-direction:column;gap:6px}
.ci-fn li:target{color:var(--ink)}
@media (max-width: 820px){
  .ci-facts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ci-nums{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ci-nums div:nth-child(3){border-left:0;padding-left:0}
  .ci-nums div:nth-child(n+3){border-top:1px solid var(--line)}
  .ci-pr{grid-template-columns:1fr !important}
  .ci-tri{grid-template-columns:1fr}
  .ci-tri .ci-ph-box{aspect-ratio:16/9 !important}
  .ci-decs{gap:72px}
}
@media (max-width: 520px){
  .ci-chart{padding:18px 14px}
  .ci-bars{gap:3px;height:180px}
  .ci-col .v{display:none}
  .ci-col.key .v{display:block}
  .ci-col .m{font-size:10px}
  .ci-hrow{grid-template-columns:1fr 48px;gap:6px 10px}
  .ci-hrow .l{grid-column:1/-1}
  .ci-hrow .tr{grid-column:1}
  .ci-facts{grid-template-columns:1fr}
}

/* CI images */
.ci-frame{background:#F1EFEA;border-radius:16px;padding:clamp(12px,2.4vw,28px)}
:root[data-theme="dark"] .ci-frame{background:#1E1E21}
.ci-frame .ci-shot{border-radius:8px;overflow:visible;box-shadow:0 0 0 1px rgba(0,0,0,.06)}
.ci-z{all:unset;display:block;cursor:zoom-in;width:100%;border-radius:8px;overflow:hidden}
.ci-z img{display:block;width:100%;height:auto}
.ci-z:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.ci-60{width:60%;margin-left:auto !important;margin-right:auto !important}
.ci-50{width:50%;margin-left:auto !important;margin-right:auto !important}
.ci-full{width:100%}
.ci-dot{position:absolute;transform:translate(-50%,-50%);width:22px;height:22px;border-radius:50%;background:var(--paper);border:1px solid var(--ink);color:var(--ink);font-size:12px;font-weight:500;display:grid;place-items:center;pointer-events:none;font-variant-numeric:tabular-nums}
.ci-dot.s{position:static;transform:none;flex:none;width:20px;height:20px;font-size:11px}
.ci-leg{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px 20px;font-size:14px;color:var(--mute)}
.ci-leg li{display:flex;align-items:center;gap:8px}
.ci-cols{position:relative;height:22px;margin-bottom:8px;margin-left:clamp(12px,2.4vw,28px);margin-right:clamp(12px,2.4vw,28px)}
.ci-cols span{position:absolute;top:0;font-size:12px;font-weight:500;color:var(--ink);padding-top:6px;border-top:1px solid var(--ink);width:20%}
.ci-zone.in{width:29.4% !important}
.ci-zone.out{left:29.4% !important}
.ci-zone{top:7.2% !important;border-width:1px !important}
.ci-zone i{display:none}
.ci-tri .ci-fig figcaption{font-size:14px}
.ci-tri .ci-frame{padding:10px}
@media (max-width:820px){.ci-60,.ci-50{width:100%}}
.ci-mob{display:none}
@media (max-width:520px){.ci-desk{display:none}.ci-mob{display:flex;flex-direction:column;gap:20px}}
@media (max-width:520px){.ci-dot{width:18px;height:18px;font-size:10px}.ci-cols span{font-size:11px}}

/* ===== Create Image v2 ===== */
#ci-root{display:flex;flex-direction:column;gap:inherit}
#ci-root{gap:88px}
.ci-skimrow{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:8px}
.ci-skim{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:10px;font-size:14px;font-weight:500;padding:8px 14px 8px 8px;border-radius:99px;border:1px solid var(--line);background:var(--paper);transition:border-color .2s}
.ci-skim:hover{border-color:var(--ink)}
.ci-skim:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.ci-skim .sw{width:30px;height:18px;border-radius:99px;background:var(--line);position:relative;transition:background .2s}
.ci-skim .sw::after{content:"";position:absolute;left:2px;top:2px;width:14px;height:14px;border-radius:50%;background:var(--paper);box-shadow:0 1px 2px rgba(0,0,0,.25);transition:transform .2s}
.ci-skim[aria-pressed="true"] .sw{background:#C2410C}
.ci-skim[aria-pressed="true"] .sw::after{transform:translateX(12px)}
.ci-skimhint{font-size:13px;color:var(--mute)}
#ci-root.skim [data-long]{display:none !important}
#ci-root.skim [data-long-sec]{display:none}
#ci-root.skim .ci-dgrid{align-items:start}

.ci-numwrap{display:flex;flex-direction:column;gap:10px}
.ci-asof{margin:0;font-size:13px;color:var(--mute);letter-spacing:.01em}
.ci-asof2{color:var(--mute);margin-bottom:12px !important}
.ci-fnref{all:unset;cursor:pointer;color:var(--mute);font-family:var(--sans);font-size:13px;vertical-align:top}
.ci-fnref:hover{color:var(--ink)}
.ci-nums b{display:flex;align-items:flex-start}

/* problem */
.ci-prob{display:flex;flex-direction:column;gap:28px}
.ci-sh{display:flex;flex-direction:column;gap:8px}
.ci-kick{font-size:14px;color:var(--mute)}
.ci-sh h2{margin:0;font-family:var(--serif);font-weight:400;font-size:clamp(30px,3.4vw,42px);line-height:1.1;letter-spacing:-.01em}
.ci-tens{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.ci-tens article{border:1px solid var(--line);border-radius:16px;padding:22px;display:flex;flex-direction:column;gap:10px;background:var(--paper)}
.ci-tens .n{font-family:var(--serif);font-size:36px;line-height:1;color:#C2410C}
.ci-tens h3{margin:0;font-size:18px;font-weight:500;line-height:1.35}
.ci-tens p{margin:0;font-size:15px;color:var(--mute);line-height:1.55}
.ci-tens .to{margin-top:auto;padding-top:6px;display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:13px}
.ci-jump{all:unset;cursor:pointer;font-size:12px;font-weight:500;padding:3px 9px;border-radius:99px;border:1px solid var(--line);color:var(--ink);font-variant-numeric:tabular-nums}
.ci-jump:hover{border-color:var(--ink)}
.ci-jump:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.ci-rules{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,7fr);gap:48px;padding-top:8px}
.ci-rules ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 32px}
.ci-rules li{font-size:15px;color:var(--mute);line-height:1.5;padding-left:16px;border-left:2px solid var(--line)}
.ci-rules b{display:block;color:var(--ink);font-weight:500}

/* decisions */
.ci-decs2{display:flex;flex-direction:column;gap:120px}
.ci-dec2{display:flex;flex-direction:column;gap:36px;scroll-margin-top:96px;border-radius:20px;transition:box-shadow .6s}
.ci-dgrid{display:grid;gap:28px 56px;align-items:start}
.ci-l-stack .ci-dgrid{grid-template-columns:1fr}
.ci-l-stack .ci-dtext{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:14px 56px;align-items:start}
.ci-l-stack .ci-dk,.ci-l-stack h3{grid-column:1}
.ci-l-stack .ci-body,.ci-l-stack .ci-saw2{grid-column:2}
.ci-l-stack .ci-body{grid-row:1/span 2}
.ci-l-stack .ci-saw2{grid-row:3}
.ci-l-stack h3{grid-row:2}
.ci-l-split .ci-dgrid{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
.ci-l-split.r .ci-dgrid{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
.ci-l-split.r .ci-dtext{order:2}
.ci-l-split .ci-dtext{position:sticky;top:110px}
.ci-dtext{display:flex;flex-direction:column;gap:14px}
.ci-dk{margin:0;font-size:13px;color:var(--mute);display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-variant-numeric:tabular-nums}
.ci-dk span{font-size:12px;padding:3px 9px;border-radius:99px;background:var(--soft);color:var(--ink)}
.ci-dec2 h3{margin:0;font-family:var(--serif);font-weight:400;font-size:clamp(28px,3vw,38px);line-height:1.12;letter-spacing:-.01em}
.ci-body p{margin:0 0 12px}
.ci-body p:last-child{margin:0}
.ci-saw2{border-top:1px solid var(--line);padding-top:16px;display:flex;flex-direction:column;gap:8px}
.ci-saw2 .k{font-size:12px;font-weight:500;letter-spacing:.04em;text-transform:uppercase;color:var(--mute)}
.ci-saw2 .row{display:flex;gap:16px;align-items:baseline}
.ci-saw2 b{font-family:var(--serif);font-weight:400;font-size:48px;line-height:.9;color:#C2410C;flex:none;font-variant-numeric:tabular-nums;min-width:2ch}
.ci-saw2 p{margin:0;font-size:15px;line-height:1.5;color:var(--mute)}
.ci-flash{box-shadow:0 0 0 12px rgba(194,65,12,.08)}
.ci-cap{margin:12px 0 0;font-size:15px;color:var(--mute);line-height:1.5}
.ci-wide{margin:0}
.ci-pair{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:28px;align-items:start}

/* tabs */
.ci-switch{display:flex;flex-direction:column}
.ci-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px}
.ci-tabs [role=tab]{all:unset;cursor:pointer;font-size:14px;padding:8px 14px;border-radius:99px;border:1px solid var(--line);color:var(--mute);transition:all .2s}
.ci-tabs [role=tab] b{font-weight:500;color:var(--ink)}
.ci-tabs [role=tab]:hover{border-color:var(--ink);color:var(--ink)}
.ci-tabs [role=tab][aria-selected="true"]{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.ci-tabs [role=tab][aria-selected="true"] b{color:var(--paper)}
.ci-tabs [role=tab]:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.ci-stack .ci-pane{animation:ciFade .35s ease}
@keyframes ciFade{from{opacity:.2}to{opacity:1}}
.ci-switch .ci-zone{top:0 !important;bottom:0}
.ci-switch .ci-zone.in{width:38.7% !important;left:0}
.ci-switch .ci-zone.out{left:38.7% !important}

/* pins */
.ci-pin{all:unset;position:absolute;transform:translate(-50%,-50%);width:24px;height:24px;border-radius:50%;background:var(--paper);border:1px solid var(--ink);color:var(--ink);font-size:12px;font-weight:500;display:grid;place-items:center;cursor:help;z-index:2;font-variant-numeric:tabular-nums;transition:transform .2s,background .2s}
.ci-pin::before{content:"";position:absolute;inset:-6px;border-radius:50%;border:1px solid rgba(194,65,12,.5);animation:ciPulse 2.4s ease-out infinite}
@keyframes ciPulse{0%{transform:scale(.7);opacity:1}100%{transform:scale(1.5);opacity:0}}
.ci-pin em{position:absolute;left:50%;bottom:calc(100% + 10px);transform:translateX(-50%) translateY(4px);white-space:nowrap;font-style:normal;font-size:13px;font-weight:400;background:var(--ink);color:var(--paper);padding:6px 10px;border-radius:8px;opacity:0;pointer-events:none;transition:opacity .18s,transform .18s}
.ci-pin:hover,.ci-pin:focus-visible,.ci-pin.on{background:var(--ink);color:var(--paper);transform:translate(-50%,-50%) scale(1.08)}
.ci-pin:hover em,.ci-pin:focus-visible em,.ci-pin.on em{opacity:1;transform:translateX(-50%) translateY(0)}
.ci-pin:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.ci-leg li{cursor:default;transition:color .15s}
.ci-leg li:hover{color:var(--ink)}

/* demos */
.ci-demo{border:1px solid var(--line);border-radius:16px;background:#F1EFEA;padding:18px;display:flex;flex-direction:column;gap:16px}
:root[data-theme="dark"] .ci-demo{background:#1E1E21}
.ci-demo-h{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;font-size:13px;color:var(--mute)}
.ci-live{display:inline-flex;align-items:center;gap:6px;font-weight:500;color:#C2410C}
.ci-live::before{content:"";width:7px;height:7px;border-radius:50%;background:#C2410C;animation:ciBlink 1.6s ease-in-out infinite}
@keyframes ciBlink{50%{opacity:.25}}
.ci-gp{background:var(--paper);border-radius:12px;padding:18px;display:flex;flex-direction:column;gap:14px;box-shadow:0 0 0 1px var(--line)}
.ci-f{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--mute)}
.ci-f select{font:inherit;font-size:15px;color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:8px;padding:10px 12px;min-height:44px}
.ci-seg{display:flex;flex-wrap:wrap;gap:6px}
.ci-seg button{all:unset;cursor:pointer;font-size:14px;color:var(--ink);padding:8px 12px;min-height:20px;border-radius:8px;border:1px solid var(--line);background:var(--paper);transition:all .15s}
.ci-seg button:hover{border-color:var(--ink)}
.ci-seg button[aria-checked="true"]{background:rgba(194,65,12,.1);border-color:#C2410C;color:#9A3412}
:root[data-theme="dark"] .ci-seg button[aria-checked="true"]{color:#FDBA74}
.ci-seg button:focus-visible,.ci-step button:focus-visible,.ci-gbtn:focus-visible,.ci-rbtn:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.ci-step{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:8px;width:max-content}
.ci-step button{all:unset;cursor:pointer;width:40px;height:40px;display:grid;place-items:center;font-size:18px;color:var(--ink)}
.ci-step button:disabled{opacity:.3;cursor:not-allowed}
.ci-step output{min-width:28px;text-align:center;font-size:15px;color:var(--ink);font-variant-numeric:tabular-nums}
.ci-gbtn{all:unset;cursor:pointer;display:flex;justify-content:center;align-items:center;gap:12px;min-height:48px;border-radius:10px;background:var(--ink);color:var(--paper);font-size:14px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;transition:transform .15s}
.ci-gbtn:active{transform:scale(.98)}
.ci-gbtn .c{display:inline-flex;align-items:center;gap:4px;letter-spacing:.04em}
.ci-gbtn .c b{display:inline-block;font-weight:500;font-variant-numeric:tabular-nums}
.ci-gbtn.bump .c b{animation:ciBump .45s cubic-bezier(.2,.8,.2,1)}
@keyframes ciBump{0%{transform:translateY(6px);opacity:0}100%{transform:none;opacity:1}}
.ci-gmeta{margin:0;font-size:13px;color:var(--mute);display:flex;gap:6px;flex-wrap:wrap}
.ci-gnote{color:#9A3412}
:root[data-theme="dark"] .ci-gnote{color:#FDBA74}

.ci-rgrid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px;align-items:stretch}
.ci-rcard{background:var(--paper);border-radius:12px;overflow:hidden;box-shadow:0 0 0 1px var(--line);display:flex;flex-direction:column}
.ci-rcard img{display:block;width:100%;height:auto}
.ci-rp{margin:12px 14px 8px;font-size:14px;line-height:1.4}
.ci-chips{display:flex;flex-wrap:wrap;gap:6px;margin:0 14px}
.ci-chips span{font-size:12px;padding:3px 8px;border-radius:6px;border:1px solid var(--line);color:var(--mute)}
.ci-rfoot{display:flex;justify-content:space-between;align-items:center;gap:8px;margin:auto 14px 14px;padding-top:12px;font-size:12px;color:var(--mute)}
.ci-rbtn{all:unset;cursor:pointer;font-size:12px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:#fff;background:#C2410C;padding:9px 12px;border-radius:8px;transition:transform .15s}
.ci-rbtn:hover{transform:translateY(-1px)}
.ci-rpanel{background:var(--paper);border-radius:12px;padding:14px;box-shadow:0 0 0 1px var(--line);display:flex;flex-direction:column;gap:10px}
.ci-rsteps{list-style:none;margin:0 0 4px;padding:0;display:flex;gap:6px;flex-wrap:wrap;counter-reset:s}
.ci-rsteps li{counter-increment:s;font-size:12px;color:var(--mute);padding:3px 9px;border-radius:99px;border:1px solid var(--line);transition:all .25s}
.ci-rsteps li::before{content:counter(s) " ";font-variant-numeric:tabular-nums}
.ci-rsteps li.on{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.ci-rf{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--mute)}
.ci-rf b{font-weight:400;font-size:14px;color:var(--ink);border:1px solid var(--line);border-radius:8px;padding:8px 10px;min-height:20px;transition:background .35s,border-color .35s}
.ci-rf b.fill{background:rgba(194,65,12,.08);border-color:#C2410C}
.ci-rf-p b{min-height:40px}
.ci-rf2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ci-rgen{display:flex;justify-content:center;gap:10px;margin-top:auto;padding:12px;border-radius:8px;background:var(--soft);color:var(--mute);font-size:12px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;transition:all .3s}
.ci-rgen b{font-weight:500;font-variant-numeric:tabular-nums}
.ci-rgen.ready{background:var(--ink);color:var(--paper)}
.ci-rgen.go{animation:ciGo .9s ease}
@keyframes ciGo{30%{transform:scale(.97)}60%{transform:scale(1.02)}}

/* charts animate */
.ci-anim .ci-col .b{height:0;transition:height .9s cubic-bezier(.2,.8,.2,1)}
.ci-anim.in .ci-col .b{height:var(--h)}
.ci-anim .ci-col:nth-child(n) .b{transition-delay:calc(var(--i,0) * 40ms)}
.ci-anim .ci-hrow .b{width:0;transition:width 1s cubic-bezier(.2,.8,.2,1)}
.ci-anim.in .ci-hrow .b{width:var(--w)}
.ci-ch-notes{gap:12px;flex-wrap:wrap}
.ci-ch-notes span:nth-child(2){color:var(--ink);font-weight:500}

/* rail */
.ci-rail{display:none}
@media (min-width:1360px){
  .ci-rail{display:block;position:fixed;left:max(20px,calc(50vw - 690px));top:120px;width:150px;z-index:5;opacity:0;transform:translateX(-6px);transition:opacity .3s,transform .3s;pointer-events:none}
  .ci-rail.show{opacity:1;transform:none;pointer-events:auto}
  .ci-rail p{margin:0 0 10px;font-size:12px;color:var(--mute)}
  .ci-rail ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px;border-left:1px solid var(--line)}
  .ci-rail button{all:unset;cursor:pointer;display:block;font-size:12.5px;line-height:1.35;color:var(--mute);padding:4px 0 4px 12px;margin-left:-1px;border-left:1px solid transparent;transition:color .2s,border-color .2s}
  .ci-rail button:hover{color:var(--ink)}
  .ci-rail button[aria-current="true"]{color:var(--ink);border-left-color:#C2410C;font-weight:500}
  .ci-rail button:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
}

@media (max-width:980px){
  .ci-tens{grid-template-columns:1fr}
  .ci-rules{grid-template-columns:1fr;gap:12px}
  .ci-l-stack .ci-dtext{grid-template-columns:1fr}
  .ci-l-stack .ci-dk,.ci-l-stack h3,.ci-l-stack .ci-body,.ci-l-stack .ci-saw2{grid-column:1;grid-row:auto}
  .ci-l-split .ci-dgrid,.ci-l-split.r .ci-dgrid{grid-template-columns:1fr}
  .ci-l-split.r .ci-dtext{order:0}
  .ci-l-split .ci-dtext{position:static}
  .ci-pair{grid-template-columns:1fr}
  .ci-decs2{gap:88px}
}
@media (max-width:620px){
  .ci-rules ul{grid-template-columns:1fr}
  .ci-rgrid{grid-template-columns:1fr}
  .ci-saw2 b{font-size:40px}
  .ci-pin em{white-space:normal;width:160px;text-align:center}
  .ci-dec2{gap:24px}
}
@media (prefers-reduced-motion:reduce){
  .ci-pin::before,.ci-live::before{animation:none}
  .ci-anim .ci-col .b,.ci-anim .ci-hrow .b{transition:none}
  .ci-stack .ci-pane{animation:none}
}

.ci-dnav{display:flex;flex-wrap:wrap;gap:8px;margin-top:-56px}
.ci-dnav button{all:unset;cursor:pointer;display:inline-flex;gap:8px;align-items:center;font-size:14px;padding:8px 14px;border-radius:99px;border:1px solid var(--line);transition:border-color .2s}
.ci-dnav button span{color:#C2410C;font-variant-numeric:tabular-nums;font-size:13px}
.ci-dnav button:hover{border-color:var(--ink)}
.ci-dnav button:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
@media (max-width:980px){.ci-dnav{margin-top:-48px}}

.ci-ol + p{margin-top:16px !important}

/* ===== Designing in production ===== */
.dp .ci-tens .n,.dp .ci-saw2 b,.dp .ci-dnav button span,.dp .ci-live{color:#2F5BD3}
.dp .ci-live::before{background:#2F5BD3}
.dp .ci-skim[aria-pressed="true"] .sw{background:#2F5BD3}
.dp .ci-rail button[aria-current="true"]{border-left-color:#2F5BD3}
.dp-todo{color:#B4541A;background:rgba(194,65,12,.08);padding:1px 6px;border-radius:5px}
.dp code{font-family:'Geist Mono',ui-monospace,monospace;font-size:.88em;background:var(--soft);padding:1px 6px;border-radius:5px}
.dp-loop{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;counter-reset:l}
.dp-loop li{position:relative;border:1px solid var(--line);border-radius:16px;padding:20px;display:flex;flex-direction:column;gap:6px;background:var(--paper);transition:border-color .2s,transform .2s}
.dp-loop li:hover{border-color:var(--ink);transform:translateY(-2px)}
.dp-loop li:not(:last-child)::after{content:"→";position:absolute;right:-12px;top:50%;transform:translate(50%,-50%);color:var(--mute);font-size:14px;z-index:1;background:var(--paper);line-height:1;padding:2px 0}
.dp-loop .n{font-family:var(--serif);font-size:32px;line-height:1;color:#2F5BD3}
.dp-loop b{font-size:17px;font-weight:500}
.dp-loop p{margin:0;font-size:14px;color:var(--mute);line-height:1.5}
.dp-gp{margin:0 0 14px;font-size:15px;color:var(--mute);line-height:1.55;max-width:640px}
.dp-guards{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.dp-guards li{font-size:13px;padding:6px 12px;border-radius:99px;border:1px solid var(--line);display:inline-flex;align-items:center;gap:6px}
.dp-guards li::before{content:"✓";color:#2F5BD3;font-size:12px}
.dp-who{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.dp-who>div{border-radius:16px;background:var(--soft);padding:18px 20px;display:flex;flex-direction:column;gap:6px}
.dp-who p{margin:0;font-size:15px;line-height:1.5}
.dp-why p{color:var(--mute);font-size:15px;line-height:1.55;margin:0}
.dp-recr{font-size:12px;color:var(--mute)}
.dp-ph{display:flex;flex-direction:column;gap:8px}
.dp-ba{font-size:12px;font-weight:500;letter-spacing:.04em;text-transform:uppercase;color:var(--mute)}
.dp-pair{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.dp-pair-fig{margin:0}
.dp-one{margin:0;max-width:720px}

/* validation demo */
.dp-ba-tabs{margin:0}
.dp-vbox{background:var(--paper);border-radius:12px;padding:18px;box-shadow:0 0 0 1px var(--line);display:flex;flex-direction:column;gap:10px}
.dp-vbox.shake{animation:dpShake .4s}
@keyframes dpShake{20%{transform:translateX(-5px)}40%{transform:translateX(5px)}60%{transform:translateX(-3px)}80%{transform:translateX(2px)}}
.dp-vlab{font-size:14px;font-weight:500}
.dp-vbox textarea{font:inherit;font-size:15px;color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:12px;resize:none}
.dp-vbox textarea:focus{outline:2px solid #2F5BD3;outline-offset:0;border-color:transparent}
.dp-vbox textarea[aria-invalid="true"]{border-color:#C2410C}
.dp-verr{margin:-2px 0 0;font-size:14px;color:#B4341A;display:flex;align-items:center;gap:6px}
.dp-verr::before{content:"!";width:16px;height:16px;border-radius:50%;background:#B4341A;color:#fff;font-size:11px;font-weight:600;display:grid;place-items:center}
:root[data-theme="dark"] .dp-verr{color:#FCA5A5}
.dp-vfoot{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.dp-vhint{font-size:13px;color:var(--mute)}
.dp-vbtn{all:unset;cursor:pointer;font-size:14px;font-weight:500;padding:11px 22px;border-radius:10px;background:var(--ink);color:var(--paper);transition:opacity .2s}
.dp-vbtn:disabled{opacity:.28;cursor:not-allowed}
.dp-vbtn:focus-visible{outline:2px solid var(--ink);outline-offset:2px}

/* rail demo */
.dp-rwrap{display:grid;grid-template-columns:120px 1fr;gap:12px}
.dp-rtabs{background:var(--paper);border-radius:12px;box-shadow:0 0 0 1px var(--line);padding:8px;display:flex;flex-direction:column;gap:4px}
.dp-rt{all:unset;cursor:pointer;position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 6px;border-radius:8px;font-size:12px;color:var(--mute);transition:background .15s,color .15s}
.dp-rt .ico{font-size:18px;line-height:1;color:var(--ink)}
.dp-rt:hover,.dp-rt.on{background:var(--soft);color:var(--ink)}
.dp-rt:focus-visible{outline:2px solid var(--ink);outline-offset:1px}
.dp-rt .bd{position:absolute;top:6px;right:18px;width:12px;height:12px;border-radius:50%}
.dp-rt .bd.spin{border:2px solid rgba(47,91,211,.25);border-top-color:#2F5BD3;animation:dpSpin .9s linear infinite;width:9px;height:9px}
.dp-rt .bd.done{background:#16A34A;color:#fff;font-size:8px;display:grid;place-items:center;font-weight:700}
@keyframes dpSpin{to{transform:rotate(360deg)}}
.dp-rscene{background:var(--paper);border-radius:12px;box-shadow:0 0 0 1px var(--line);padding:14px;display:flex;flex-direction:column;gap:12px}
.dp-rtip{margin:0;font-size:13px;color:var(--paper);background:var(--ink);padding:8px 12px;border-radius:8px;align-self:flex-start;min-height:18px}
.dp-rgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.dp-rgrid span{aspect-ratio:16/10;border-radius:8px;background:var(--soft);display:flex;align-items:flex-end;padding:6px 8px;font-size:12px;color:var(--mute);position:relative;overflow:hidden;transition:box-shadow .2s}
.dp-rgrid span.busy::after{content:"";position:absolute;left:0;bottom:0;height:3px;width:40%;background:#2F5BD3;animation:dpBar 1.6s ease-in-out infinite}
@keyframes dpBar{0%{left:-40%}100%{left:100%}}
.dp-rgrid span.hl{box-shadow:0 0 0 2px #2F5BD3;color:var(--ink)}

/* timeline */
.dp-tl{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;position:relative}
.dp-tl li{border:1px solid var(--line);border-radius:16px;padding:20px;display:flex;flex-direction:column;gap:8px;opacity:.15;transform:translateY(10px);transition:opacity .5s,transform .5s}
.dp-tl.in li{opacity:1;transform:none}
.dp-tl.in li:nth-child(2){transition-delay:.35s}
.dp-tl.in li:nth-child(3){transition-delay:.7s}
.dp-tl .dot{width:12px;height:12px;border-radius:50%}
.dp-tl .ship{background:#2F5BD3}.dp-tl .rev{background:#C2410C}.dp-tl .fix{background:#16A34A}
.dp-tl b{font-size:17px;font-weight:500}
.dp-tl .pr{font-family:'Geist Mono',ui-monospace,monospace;font-size:12px;color:var(--mute)}
.dp-tl p{margin:0;font-size:14px;line-height:1.5;color:var(--mute)}

/* range + chart */
.dp-rp{border:1px solid var(--line);border-radius:16px;padding:20px 22px;animation:ciFade .3s ease}
.dp-rp p{margin:0;line-height:1.6}
.dp-bars{grid-template-columns:repeat(8,minmax(0,1fr)) !important}
.dp-chart .ci-col .v{display:block !important}
.dp-chart .ci-col.key .b{background:#2F5BD3;opacity:1}

@media (max-width:980px){
  .dp-loop{grid-template-columns:1fr 1fr}
  .dp-loop li:nth-child(2)::after{display:none}
  .dp-tl{grid-template-columns:1fr}
}
@media (max-width:620px){
  .dp-loop{grid-template-columns:1fr}
  .dp-loop li::after{display:none}
  .dp-who,.dp-pair{grid-template-columns:1fr}
  .dp-rwrap{grid-template-columns:84px 1fr}
  .dp-rgrid{grid-template-columns:repeat(2,1fr)}
}
@media (prefers-reduced-motion:reduce){
  .dp-rt .bd.spin,.dp-rgrid span.busy::after{animation:none}
  .dp-tl li{opacity:1;transform:none;transition:none}
}

.ci-nums b .ci-cnt{font:inherit;color:inherit;font-size:inherit;line-height:inherit}
.ci-rules ul.dp-guards{display:flex;flex-wrap:wrap;gap:8px}
.ci-rules .dp-guards li{border:1px solid var(--line);padding:6px 12px;color:var(--ink);font-size:13px;line-height:1.3}
.dp-pair .ci-ph-box{aspect-ratio:16/10 !important}
.dp-one .ci-ph-box{aspect-ratio:16/8 !important}

.dp-wide{margin:0;max-width:820px}
.dp-tall{max-width:520px;margin-left:auto !important}
.ci-l-split.r .dp-tall{margin-left:0 !important;margin-right:auto !important}

/* ===== Case study system v3: one column edge, one type scale, one spacing scale ===== */
#ci-root{
  --cs-text:680px; --cs-gap-section:120px; --cs-gap-block:40px; --cs-gap-tight:16px;
  --cs-h2:clamp(30px,3.2vw,40px); --cs-h3:clamp(26px,2.6vw,32px);
  --cs-body:18px; --cs-small:15px; --cs-micro:13px;
  --cs-radius:16px; --cs-card-pad:24px;
  max-width:1040px; width:100%; margin:0 auto; gap:var(--cs-gap-section) !important;
}
#ci-root p{font-size:var(--cs-body);line-height:1.65}
/* header */
#ci-root .ph{max-width:var(--cs-text)}
#ci-root .ph p{font-size:19px}
#ci-root .ci-eye{font-size:var(--cs-micro) !important;margin:24px 0 0 !important}
#ci-root .ph h1{margin:8px 0 16px}
#ci-root .ci-skimrow{margin-top:24px}
#ci-root .ci-skimrow p,#ci-root .ci-skimhint{font-size:var(--cs-micro)}
/* every section: heading on top, single column, same left edge */
#ci-root .sec{display:block !important}
#ci-root .sec>.lab{display:block;font-family:var(--serif);font-weight:400;font-size:var(--cs-h2);line-height:1.1;letter-spacing:-.01em;color:var(--ink);padding:0;margin:0 0 20px;max-width:var(--cs-text)}
#ci-root .sec>.text,#ci-root .sec>div>.text,#ci-root .sec .text{max-width:var(--cs-text)}
#ci-root .sec p{margin:0 0 var(--cs-gap-tight)}
#ci-root .ci-fn>.lab{font-family:var(--sans);font-size:var(--cs-small);color:var(--mute);margin-bottom:12px}
#ci-root .ci-fn ol{font-size:var(--cs-micro)}
#ci-root .ci-fn li{font-size:var(--cs-micro);line-height:1.6}
#ci-root .ci-hard .quote{font-family:var(--serif);font-size:var(--cs-h3);line-height:1.2;margin-bottom:20px !important}
#ci-root .ci-ul,#ci-root .ci-ol{gap:var(--cs-gap-tight);font-size:var(--cs-body)}
#ci-root .ci-ul li,#ci-root .ci-ol li{line-height:1.6}
#ci-root .sec .ci-chart,#ci-root .sec .ci-fig,#ci-root .sec .dp-range{margin-top:var(--cs-gap-block)}
/* section headings that had a kicker: drop the kicker, keep one h2 */
#ci-root .ci-sh .ci-kick{display:none}
#ci-root .ci-sh h2{font-size:var(--cs-h2);margin:0}
#ci-root .ci-prob{gap:var(--cs-gap-block)}
/* sub-headings inside a section: one style */
#ci-root .ci-rules{display:block;padding:0}
#ci-root .ci-rules>.ci-kick,#ci-root .dp-who .ci-kick{display:block;font-size:var(--cs-small);font-weight:500;color:var(--ink);margin:0 0 var(--cs-gap-tight)}
#ci-root .dp-gp{font-size:var(--cs-body);color:var(--ink);max-width:var(--cs-text);margin:0 0 var(--cs-gap-tight)}
/* one card style */
#ci-root .ci-tens article,#ci-root .dp-loop li,#ci-root .dp-who>div,#ci-root .dp-tl li,#ci-root .dp-rp{border:1px solid var(--line);border-radius:var(--cs-radius);padding:var(--cs-card-pad);background:transparent;gap:8px;box-shadow:none}
#ci-root .dp-loop li:hover{transform:none;border-color:var(--line)}
#ci-root .dp-loop li::after{display:none}
#ci-root .ci-tens .n,#ci-root .dp-loop .n{font-family:var(--sans);font-size:var(--cs-micro);line-height:1;color:var(--mute);font-variant-numeric:tabular-nums}
#ci-root .ci-tens .n::before,#ci-root .dp-loop .n::before{content:"0"}
#ci-root .ci-tens h3,#ci-root .dp-loop b,#ci-root .dp-tl b{font-family:var(--sans);font-size:var(--cs-body);font-weight:500;line-height:1.35;margin:0}
#ci-root .ci-tens p,#ci-root .dp-loop p,#ci-root .dp-who p,#ci-root .dp-tl p,#ci-root .dp-rp p{font-size:var(--cs-small);line-height:1.55;color:var(--mute);margin:0}
#ci-root .dp-who p{color:var(--ink)}
#ci-root .dp-tl .pr{font-family:var(--sans);font-size:var(--cs-micro)}
#ci-root .dp-who{gap:var(--cs-gap-tight)}
/* rules list: plain two-column list, same type as cards */
#ci-root .ci-rules ul:not(.dp-guards){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--cs-gap-tight) 40px;max-width:none}
#ci-root .ci-rules li{border:0;padding:0;font-size:var(--cs-small);color:var(--mute);line-height:1.55}
#ci-root .ci-rules li b{font-size:var(--cs-body);font-weight:500;color:var(--ink);margin-bottom:2px}
/* one pill style: guardrails, jump links, tabs, skim switch */
#ci-root .dp-guards li,#ci-root .ci-dnav button,#ci-root .ci-tabs [role=tab],#ci-root .ci-jump{font-size:14px;line-height:1.2;padding:8px 14px;border-radius:99px;border:1px solid var(--line);color:var(--ink)}
#ci-root .ci-rules .dp-guards li{color:var(--ink);font-size:14px;padding:8px 14px}
#ci-root .ci-jump{padding:4px 10px;font-size:var(--cs-micro)}
#ci-root .ci-dnav{margin-top:calc(var(--cs-gap-tight) - var(--cs-gap-section)) !important;gap:8px}
#ci-root .ci-dnav button span,#ci-root .dp .ci-dnav button span{font-size:var(--cs-micro);color:var(--mute)}
#ci-root .ci-tabs{margin-bottom:var(--cs-gap-tight)}
#ci-root .ci-dintro p{color:var(--mute) !important;max-width:var(--cs-text)}
/* decisions and stories: text column first, then media; one split ratio, never reversed */
#ci-root .ci-decs2{gap:var(--cs-gap-section)}
#ci-root .ci-dec2{gap:var(--cs-gap-block)}
#ci-root .ci-dgrid{gap:var(--cs-gap-block) 56px}
#ci-root .ci-l-stack .ci-dtext{display:flex !important;flex-direction:column;max-width:var(--cs-text)}
#ci-root .ci-l-split .ci-dgrid,#ci-root .ci-l-split.r .ci-dgrid{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
#ci-root .ci-l-split.r .ci-dtext{order:0}
#ci-root .ci-dtext{gap:var(--cs-gap-tight)}
#ci-root .ci-dk{font-size:var(--cs-micro);gap:0}
#ci-root .ci-dk span{background:none;padding:0;font-size:var(--cs-micro);color:var(--mute)}
#ci-root .ci-dk span::before{content:"·";margin:0 8px}
#ci-root .ci-dec2 h3{font-size:var(--cs-h3);line-height:1.15}
#ci-root .ci-body p{font-size:var(--cs-body)}
/* evidence: sentence-case label, number in the same serif as the strip */
#ci-root .ci-saw2{padding-top:var(--cs-gap-tight);gap:8px}
#ci-root .ci-saw2 .k{font-size:var(--cs-micro);font-weight:400;letter-spacing:0;text-transform:none;color:var(--mute)}
#ci-root .ci-saw2 p{font-size:var(--cs-small)}
#ci-root .ci-saw2 b{font-size:44px}
/* figures, demos, charts */
#ci-root .ci-fig figcaption,#ci-root .ci-cap{font-size:var(--cs-small);margin-top:12px;color:var(--mute);line-height:1.5}
#ci-root .ci-leg{font-size:var(--cs-small)}
#ci-root .ci-demo{border-radius:var(--cs-radius);padding:var(--cs-card-pad)}
#ci-root .ci-demo-h{font-size:var(--cs-micro)}
#ci-root .dp-recr{font-size:var(--cs-micro)}
#ci-root .ci-chart{padding:var(--cs-card-pad);border-radius:var(--cs-radius)}
#ci-root .ci-ch-t{font-size:var(--cs-small)}
#ci-root .ci-pair{gap:var(--cs-gap-block)}
#ci-root .dp-pair{gap:var(--cs-gap-tight)}
#ci-root .dp-tall{margin:0 !important;max-width:none}
#ci-root .dp-wide{max-width:none}
#ci-root .ci-numwrap{gap:12px}
#ci-root .ci-asof{font-size:var(--cs-micro)}
#ci-root .ci-nums span{font-size:var(--cs-small)}
#ci-root .ci-facts{font-size:var(--cs-small)}
#ci-root code{font-size:.85em}
@media (max-width:980px){
  #ci-root{--cs-gap-section:88px;--cs-gap-block:32px}
  #ci-root .ci-l-split .ci-dgrid,#ci-root .ci-l-split.r .ci-dgrid{grid-template-columns:1fr}
  #ci-root .ci-rules ul:not(.dp-guards){grid-template-columns:1fr}
}
@media (max-width:620px){
  #ci-root{--cs-gap-section:72px;--cs-gap-block:28px;--cs-body:17px;--cs-card-pad:20px}
  #ci-root .ci-saw2 b{font-size:38px}
}

#ci-root [data-short]{display:none}
#ci-root.skim [data-short]{display:block}
#ci-root .ci-short{font-size:var(--cs-body,18px);line-height:1.6;margin:0;color:var(--ink)}

/* ===== Case study 02 · technical treatment ===== */
.dq{--acc:#2F5BD3;--tw:#131316;--tw-2:#1C1C20;--tw-line:#2A2A30;--tw-ink:#E9E7E2;--tw-mute:#8C8A93;--ok:#4ADE80;--bad:#F87171;--info:#8AB4FF;
  --mono:'Geist Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  max-width:1080px;width:100%;margin:0 auto;display:flex;flex-direction:column;gap:128px}
.dq p{margin:0}
.dq-k{font-family:var(--mono);font-size:12px;letter-spacing:.02em;color:var(--mute);text-transform:lowercase}
.dq-k span{color:var(--acc)}
.dq-k span::before{content:"· ";color:var(--mute)}
.dq h1{font-family:var(--sans);font-weight:600;font-size:clamp(40px,5vw,64px);line-height:1;letter-spacing:-.035em;margin:14px 0 18px}
.dq h2{font-family:var(--sans);font-weight:600;font-size:clamp(28px,3vw,38px);line-height:1.08;letter-spacing:-.025em;margin:10px 0 0}
.dq h3{font-family:var(--sans);font-weight:600;font-size:clamp(24px,2.4vw,30px);line-height:1.12;letter-spacing:-.02em;margin:10px 0 0}
.dq-sub{font-size:19px;line-height:1.55;color:var(--mute);max-width:520px}
.dq-lead{font-size:18px;line-height:1.6;color:var(--mute);max-width:640px;margin-top:16px !important}
.dq-cap{font-size:13px;color:var(--mute);margin-top:12px !important;line-height:1.5}
.dq .ci-skimrow{margin-top:28px}
.dq .ci-skim[aria-pressed="true"] .sw{background:var(--acc)}
.dq .ci-rail button[aria-current="true"]{border-left-color:var(--acc)}
.dq .ci-rail button{font-family:var(--mono);font-size:12px}

/* hero */
.dq-hero{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:56px;align-items:center}
.dq-hero .back{margin-bottom:28px}

/* terminal window */
.tw{background:var(--tw);border-radius:14px;overflow:hidden;box-shadow:0 0 0 1px rgba(0,0,0,.06),0 24px 48px -28px rgba(0,0,0,.55);color:var(--tw-ink)}
:root[data-theme="dark"] .tw{box-shadow:0 0 0 1px var(--tw-line)}
.tw-bar{display:flex;align-items:center;gap:6px;height:36px;padding:0 14px;background:var(--tw-2);border-bottom:1px solid var(--tw-line)}
.tw-bar i{width:9px;height:9px;border-radius:50%;background:#3A3A42}
.tw-bar span{font-family:var(--mono);font-size:12px;color:var(--tw-mute);margin-left:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tw-bar .tw-tag,.tw-btn{margin-left:auto}
.tw-tag{font-family:var(--mono);font-size:11px;color:var(--tw-mute);border:1px solid var(--tw-line);border-radius:99px;padding:2px 8px}
.tw-btn{all:unset;cursor:pointer;margin-left:auto;font-family:var(--mono);font-size:12px;color:var(--tw-mute);padding:4px 8px;border-radius:6px}
.tw-btn:hover{color:var(--tw-ink);background:var(--tw-line)}
.tw-btn:focus-visible{outline:2px solid var(--info);outline-offset:2px}
.tw-body{padding:18px 20px}
.term{list-style:none;margin:0;padding:0;font-family:var(--mono);font-size:13.5px;line-height:1.7;min-height:290px}
.term li{display:flex;gap:10px;opacity:0;transform:translateY(4px);transition:opacity .25s,transform .25s}
.term li.on{opacity:1;transform:none}
.term .u{color:#fff;margin-bottom:8px;padding:10px 12px;background:var(--tw-2);border-radius:8px;border:1px solid var(--tw-line)}
.term .p{color:var(--info);flex:none}
.term .d{color:var(--tw-mute);flex:none;width:12px}
.term .ok .d{color:var(--ok)}
.term .ok{color:var(--tw-ink)}
.term .mg{color:var(--ok);font-weight:500;margin-top:6px}
.term .m{color:#F5C46B}
.term li.typing::after{content:"▍";color:var(--info);animation:ciBlink 1s steps(1) infinite;margin-left:2px}

/* stats + heat */
.dq-stats{display:flex;flex-direction:column;gap:20px}
.dq-nums{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.dq-nums div{border:1px solid var(--line);border-radius:14px;padding:20px 22px;display:flex;flex-direction:column;gap:6px}
.dq-nums b{font-family:var(--mono);font-weight:500;font-size:clamp(34px,3.6vw,48px);line-height:1;letter-spacing:-.04em}
.dq-nums span{font-family:var(--mono);font-size:12px;color:var(--mute)}
.dq-heat{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:8px}
.hc{aspect-ratio:1.6/1;border-radius:10px;position:relative;overflow:hidden;border:1px solid var(--line);display:flex;flex-direction:column;justify-content:space-between;padding:10px 12px}
.hc::before{content:"";position:absolute;inset:0;background:var(--acc);opacity:calc(var(--a) * .9 + .04)}
.hc b,.hc span{position:relative;font-family:var(--mono);font-size:12px}
.hc b{font-size:18px;font-weight:500}
.hc.hi b,.hc.hi span{color:#fff}

/* sections */
.dq-sec{display:flex;flex-direction:column}
.dq-sec .ci-dnav{margin-top:24px !important;display:flex;flex-wrap:wrap;gap:8px}
.dq .ci-dnav button{font-size:14px;padding:8px 14px;border-radius:99px;border:1px solid var(--line)}
.dq .ci-dnav button span{font-family:var(--mono);font-size:12px;color:var(--acc)}

/* pipeline */
.dq-pipe{list-style:none;margin:36px 0 0;padding:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:0;position:relative}
.dq-pipe::before{content:"";position:absolute;left:8%;right:8%;top:22px;height:2px;background:repeating-linear-gradient(90deg,var(--line) 0 6px,transparent 6px 12px)}
.dq-pipe::after{content:"";position:absolute;top:18px;left:8%;width:10px;height:10px;border-radius:50%;background:var(--acc);box-shadow:0 0 0 4px rgba(47,91,211,.18);animation:dqRun 5s cubic-bezier(.6,0,.4,1) infinite}
@keyframes dqRun{0%{left:8%}85%,100%{left:calc(92% - 10px)}}
.dq-pipe li{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;padding:0 8px;outline:none}
.dq-pipe .pn{position:relative;z-index:1;width:44px;height:44px;border-radius:12px;display:grid;place-items:center;font-family:var(--mono);font-size:12px;background:var(--paper);border:1px solid var(--line);transition:border-color .2s,background .2s,color .2s}
.dq-pipe b{font-size:15px;font-weight:500}
.dq-pipe em{font-style:normal;font-size:13px;line-height:1.45;color:var(--mute);max-width:16ch}
.dq-pipe li:hover .pn,.dq-pipe li:focus-visible .pn{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.dq-pipe li:last-child .pn{background:var(--acc);border-color:var(--acc);color:#fff}

.dq-two{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:20px;margin-top:48px;align-items:stretch}
.code{margin:0;font-family:var(--mono);font-size:13px;line-height:1.75;white-space:pre-wrap;color:var(--tw-ink)}
.code .c{color:var(--tw-mute)}
.code .ln{color:var(--info)}
.code .hl{color:#fff;background:rgba(74,222,128,.12);border-radius:4px;padding:1px 4px}
.code.diff .add{color:var(--ok);display:block;background:rgba(74,222,128,.08);margin:0 -20px;padding:0 20px}
.code.diff .del{color:var(--bad);display:block;background:rgba(248,113,113,.08);margin:0 -20px;padding:0 20px}
.dq-who{display:flex;flex-direction:column;gap:12px}
.dq-who>div{flex:1;border:1px solid var(--line);border-radius:14px;padding:20px 22px;display:flex;flex-direction:column;gap:8px}
.dq-who p:not(.dq-k){font-size:16px;line-height:1.55}

/* stories */
.dq-story{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,6fr);gap:56px;align-items:start;scroll-margin-top:96px;margin-top:-48px}
.dq-st-text{position:sticky;top:110px;display:flex;flex-direction:column;gap:20px}
.dq-pc{margin:0;display:flex;flex-direction:column;border-top:1px solid var(--line)}
.dq-pc>div{display:grid;grid-template-columns:110px 1fr;gap:16px;padding:14px 0;border-bottom:1px solid var(--line)}
.dq-pc dt{font-family:var(--mono);font-size:12px;color:var(--mute);padding-top:3px}
.dq-pc dd{margin:0;font-size:16px;line-height:1.5}
.dq-pc .why dd{color:var(--acc)}
:root[data-theme="dark"] .dq-pc .why dd{color:var(--info)}
.dq-more summary{cursor:pointer;font-family:var(--mono);font-size:12px;color:var(--mute);list-style:none;display:inline-flex;gap:6px;align-items:center}
.dq-more summary::-webkit-details-marker{display:none}
.dq-more summary::before{content:"+";display:inline-grid;place-items:center;width:16px;height:16px;border:1px solid var(--line);border-radius:4px}
.dq-more[open] summary::before{content:"−"}
.dq-more summary:hover{color:var(--ink)}
.dq-more div{margin-top:12px;font-size:15px;line-height:1.6;color:var(--mute)}
.dq-more code,.dq-pc code{font-family:var(--mono);font-size:.88em;background:var(--soft);padding:1px 5px;border-radius:4px}
.dq-st-media{display:flex;flex-direction:column;gap:16px}
.dq-shot{margin:0;background:#F1EFEA;border-radius:14px;padding:14px}
:root[data-theme="dark"] .dq-shot{background:#1E1E21}
.dq-shot .ci-z{border-radius:8px;overflow:hidden;box-shadow:0 0 0 1px rgba(0,0,0,.06)}
.dq-shot figcaption{font-family:var(--mono);font-size:12px;color:var(--mute);margin-top:10px}
.dq-demo{border:1px solid var(--line);border-radius:14px;padding:16px;background:#F1EFEA;display:flex;flex-direction:column;gap:12px}
:root[data-theme="dark"] .dq-demo{background:#1E1E21}
.dq-demo-h{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.dq-note{font-family:var(--mono);font-size:11px;color:var(--mute)}
.dq .dp-ba-tabs{margin:0}
.dq .ci-tabs [role=tab]{font-size:13px;padding:6px 12px}

/* architecture */
.dq-arch{display:grid;grid-template-columns:1fr auto 1fr;gap:14px;align-items:center;border:1px solid var(--line);border-radius:14px;padding:20px}
.dq-arch .col{display:flex;flex-direction:column;gap:10px}
.dq-arch .box{border:1px solid var(--line);border-radius:10px;padding:12px;font-family:var(--mono);font-size:12px;background:var(--paper)}
.dq-arch .main{color:var(--ink)}
.dq-arch .float{border-style:dashed;transform:rotate(-1.2deg);box-shadow:0 10px 20px -14px rgba(0,0,0,.4)}
.dq-arch ul{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;gap:4px}
.dq-arch .x{color:var(--bad);text-decoration:line-through}
:root:not([data-theme="dark"]) .dq-arch .x{color:#C2410C}
.dq-arch .arrow{font-family:var(--mono);color:var(--mute)}
.dq-arch .panels{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.dq-arch .panels span{border:1px solid var(--line);border-radius:6px;padding:3px 7px;color:var(--mute)}
.dq-arch .panels .on{border-color:var(--acc);color:var(--acc)}
.dq-arch .dq-cap{margin-top:2px !important}

/* git graph */
.dq-git{background:var(--tw);border-radius:14px;padding:20px 18px 18px;color:var(--tw-ink)}
.dq-git svg{width:100%;height:auto;display:block;font-family:var(--mono);font-size:12px}
.dq-git path{fill:none;stroke-width:3;stroke-linecap:round}
.dq-git .g-main{stroke:#3A3A42}
.dq-git .g-br{stroke:var(--info);stroke-dasharray:400;stroke-dashoffset:400;transition:stroke-dashoffset 1.2s ease}
.dq-git .g-br2{stroke:var(--ok);stroke-dasharray:400;stroke-dashoffset:400;transition:stroke-dashoffset 1.2s ease 1.4s}
.dq-git.in .g-br,.dq-git.in .g-br2{stroke-dashoffset:0}
.dq-git circle{stroke:var(--tw);stroke-width:3;opacity:0;transition:opacity .3s}
.dq-git .c1{fill:var(--info);transition-delay:.6s}.dq-git .c2{fill:var(--bad);transition-delay:1.1s}.dq-git .c3{fill:var(--ok);transition-delay:2s}.dq-git .c4{fill:var(--ok);transition-delay:2.6s}
.dq-git.in circle{opacity:1}
.dq-git text{fill:var(--tw-ink);opacity:0;transition:opacity .4s}
.dq-git.in text{opacity:1}
.dq-git text.tr{fill:var(--bad)}.dq-git text.tg{fill:var(--ok)}
.dq-gl{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-direction:column;gap:6px;font-family:var(--mono);font-size:12px;color:var(--tw-mute)}
.dq-gl li{display:flex;gap:8px;align-items:center}
.dq-gl .k{width:8px;height:8px;border-radius:50%;flex:none}
.dq-gl .b{background:var(--info)}.dq-gl .r{background:var(--bad)}.dq-gl .g{background:var(--ok)}

/* learning + glossary */
.dq-learn{list-style:none;margin:24px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.dq-learn li{font-size:15px;line-height:1.55;padding-left:14px;border-left:2px solid var(--acc)}
.dq-gloss{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:32px}
.gc{all:unset;cursor:pointer;position:relative;min-height:150px;border-radius:14px;perspective:900px;display:block}
.gc .f,.gc .b{position:absolute;inset:0;border-radius:14px;padding:18px;display:flex;flex-direction:column;justify-content:space-between;backface-visibility:hidden;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.gc .f{background:var(--tw);color:var(--tw-ink)}
.gc .f code{font-family:var(--mono);font-size:16px;color:#fff}
.gc .f i,.gc .b i{font-style:normal;font-family:var(--mono);font-size:11px;color:var(--tw-mute)}
.gc .b{background:var(--paper);border:1px solid var(--line);transform:rotateY(180deg)}
.gc .b b{font-weight:400;font-size:14px;line-height:1.5}
.gc .b i{color:var(--acc)}
.gc[aria-pressed="true"] .f,.gc:hover .f{transform:rotateY(-180deg)}
.gc[aria-pressed="true"] .b,.gc:hover .b{transform:rotateY(0)}
.gc:focus-visible{outline:2px solid var(--ink);outline-offset:3px}

/* changelog */
.dq-log{margin-top:28px}
.dq-tabs{margin:0 0 16px}
.dq-tabs [role=tab]{font-family:var(--mono) !important;color:var(--tw-mute) !important;border-color:var(--tw-line) !important;background:transparent !important}
.dq-tabs [role=tab][aria-selected="true"]{color:var(--tw) !important;background:var(--tw-ink) !important;border-color:var(--tw-ink) !important}
.dq-lines{list-style:none;margin:0;padding:0;font-family:var(--mono);font-size:13.5px;line-height:1.9}
.dq-lines li{display:flex;gap:12px}
.dq-lines span{color:var(--ok)}

.dq-fn ol{margin:0;padding-left:18px;font-size:13px;line-height:1.6;color:var(--mute);display:flex;flex-direction:column;gap:6px;max-width:760px}

/* 2-minute version */
#dp-root.skim [data-long]{display:none !important}
#dp-root.skim .dq-shot{display:none}

@media (max-width:980px){
  .dq{gap:96px}
  .dq-hero,.dq-story,.dq-two{grid-template-columns:1fr;gap:28px}
  .dq-story{margin-top:0}
  .dq-st-text{position:static}
  .dq-pipe{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:28px}
  .dq-pipe::before,.dq-pipe::after{display:none}
  .dq-gloss{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dq-learn{grid-template-columns:1fr}
}
@media (max-width:620px){
  .dq{gap:80px}
  .dq-nums{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dq-heat{grid-template-columns:repeat(4,minmax(0,1fr))}
  .dq-pipe{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dq-arch{grid-template-columns:1fr}
  .dq-arch .arrow{transform:rotate(90deg);justify-self:center}
  .dq-pc>div{grid-template-columns:1fr;gap:4px}
  .term{font-size:12.5px;min-height:330px}
}
@media (prefers-reduced-motion:reduce){
  .dq-pipe::after{animation:none;display:none}
  .term li{opacity:1;transform:none}
  .dq-git path{stroke-dashoffset:0 !important;transition:none}
  .dq-git circle,.dq-git text{opacity:1;transition:none}
  .gc .f,.gc .b{transition:none}
}

.code.diff{white-space:normal}
.code.diff .l{display:block;white-space:pre;margin:0 -20px;padding:0 20px;overflow:hidden;text-overflow:ellipsis}
.code.diff .l.add{color:var(--ok);background:rgba(74,222,128,.08)}
.code.diff .l.del{color:var(--bad);background:rgba(248,113,113,.08)}
.term li{display:block !important;position:relative;padding-left:22px}
.term li .d{position:absolute;left:0;top:0}
.term .u{padding:10px 12px 10px 12px !important}
.term .u .p{margin-right:10px}
@media (max-width:620px){.code.diff .l{white-space:pre-wrap}}

.tw-bar span{flex:1;min-width:0}
.tw-btn{white-space:nowrap}
@media (max-width:620px){.hc{aspect-ratio:auto;min-height:68px;padding:8px 10px}.hc b{font-size:16px}}

#ci-root .ci-rail p,#dp-root .ci-rail p{font-size:12px !important;line-height:1.4}

/* Corner Florist tile */
.fl-stage{max-width:980px;margin:0 auto}
.fl-frame{display:block;position:relative;aspect-ratio:16/9;border-radius:14px;overflow:hidden;background:#FBF6EE;box-shadow:0 0 0 1px rgba(0,0,0,.08),0 30px 60px -26px rgba(80,40,20,.55)}
.fl-bar{position:absolute;left:0;right:0;top:0;z-index:1;display:flex;align-items:center;gap:6px;height:28px;padding:0 12px;background:rgba(243,236,226,.92);border-bottom:1px solid rgba(0,0,0,.06)}
.fl-bar i{width:9px;height:9px;border-radius:50%;background:#D9CBB8}
.fl-vid{position:absolute;inset:28px 0 0 0;width:100%;height:calc(100% - 28px);object-fit:cover;display:block}
.fl-empty{position:absolute;inset:28px 0 0 0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center;color:#6B4A3A;padding:24px;background:repeating-linear-gradient(135deg,#FBF6EE 0 14px,#F6EEE2 14px 28px)}
.fl-empty .fl-bunch{font-size:40px;line-height:1;color:#C0566B}
.fl-empty b{font-size:17px;font-weight:600;color:#3D2A20}
.fl-empty span:last-child{font-size:14px;color:#7A5A48}
.fl-cta{background:#7A3E2B !important;color:#fff !important}
.fl-cta:focus-visible{outline:2px solid #fff;outline-offset:2px}
@media (max-width:620px){.fl-frame{aspect-ratio:4/3}.fl-empty b{font-size:15px}}

.rw-avatar img{width:100%;height:100%;border-radius:50%;object-fit:cover;display:block}
/* ---------- tab cat ---------- */
.tcat{position:absolute;left:0;top:0;width:32px;height:24px;z-index:3;pointer-events:auto;cursor:pointer;color:var(--ink);will-change:transform;transition:none;-webkit-tap-highlight-color:transparent}
.tcat.go{transition:transform var(--tcat-d,1s) linear}
.tcat .tc-in{position:absolute;inset:0;transform-origin:50% 100%;transition:transform .18s ease}
.tcat.left .tc-in{transform:scaleX(-1)}
.tcat .tc-in{filter:drop-shadow(0 1px 0 var(--paper))}
.tcat svg{display:block;width:32px;height:24px;overflow:visible}
.tcat .eye{fill:var(--paper);transform-box:fill-box;transform-origin:center}
.tcat .nose{fill:#E8899A}
.tcat .walk{display:none}
.tcat.walking .walk{display:inline}
.tcat.walking .sit{display:none}
/* walking: legs + bob */
.tcat.walking .lg{transform-box:fill-box;transform-origin:50% 0;animation:tcLeg .32s ease-in-out infinite alternate}
.tcat.walking .lg.b{animation-delay:-.16s}
.tcat.walking .wbody{animation:tcBob .16s ease-in-out infinite alternate}
.tcat.walking .wtail{transform-box:fill-box;transform-origin:100% 100%;animation:tcWtail .64s ease-in-out infinite alternate}
@keyframes tcLeg{from{transform:rotate(-22deg)}to{transform:rotate(22deg)}}
@keyframes tcBob{from{transform:translateY(0)}to{transform:translateY(-.8px)}}
@keyframes tcWtail{from{transform:rotate(-8deg)}to{transform:rotate(10deg)}}
/* idle */
.tcat .stail{transform-box:fill-box;transform-origin:100% 0;animation:tcSwish 2.6s ease-in-out infinite}
@keyframes tcSwish{0%,100%{transform:rotate(0)}45%{transform:rotate(-14deg)}60%{transform:rotate(6deg)}}
.tcat.blink .eye{animation:tcBlink .22s ease}
@keyframes tcBlink{50%{transform:scaleY(.1)}}
.tcat .ear{transform-box:fill-box;transform-origin:50% 100%}
.tcat.twitch .ear.r{animation:tcEar .4s ease}
@keyframes tcEar{30%{transform:rotate(-16deg)}60%{transform:rotate(6deg)}}
.tcat:hover .stail{animation-duration:1.1s}
/* love */
.tcat .tc-pop{position:absolute;left:100%;top:-2px;margin-left:2px;transform:translate(0,4px);font:500 11px/1 var(--sans);color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:99px;padding:3px 7px;white-space:nowrap;opacity:0;pointer-events:none;box-shadow:0 4px 12px -6px rgba(0,0,0,.3)}
.tcat .tc-pop.on{animation:tcPop 1.4s ease forwards}
.tcat .tc-pop i{font-style:normal;color:#E5484D}
@keyframes tcPop{0%{opacity:0;transform:translate(-4px,4px) scale(.8)}15%{opacity:1;transform:translate(0,0) scale(1)}75%{opacity:1;transform:translate(2px,-3px)}100%{opacity:0;transform:translate(4px,-8px)}}
@media (max-width:520px){.tcat{display:none}}
@media (prefers-reduced-motion:reduce){.tcat .stail,.tcat.walking .lg,.tcat.walking .wbody,.tcat.walking .wtail{animation:none}.tcat.go{transition:none}}

/* calmer cat */
.tcat{color:var(--mute);opacity:.6;width:24px;height:18px;transition:opacity .3s}
.tcat:hover{opacity:1}
.tcat svg{width:24px;height:18px}
.tcat .tc-in{filter:none}
.tcat .stail{animation-duration:7s}
.tcat .nose{fill:currentColor}

/* then vs now */
.tn{display:flex;flex-direction:column;gap:18px;margin:8px 0 56px}
.tn-head{display:flex;flex-direction:column;gap:6px}
.tn-k{margin:0;font-family:'Geist Mono',ui-monospace,monospace;font-size:12px;color:var(--mute)}
.tn h3{margin:0;font-family:var(--serif);font-weight:400;font-size:clamp(26px,2.8vw,34px);line-height:1.15;letter-spacing:-.01em}
.tn-tabs{display:flex;gap:6px;flex-wrap:wrap}
.tn-tabs button{all:unset;cursor:pointer;font-size:14px;padding:7px 14px;border-radius:99px;border:1px solid var(--line);color:var(--mute);transition:all .2s}
.tn-tabs button:hover{color:var(--ink);border-color:var(--ink)}
.tn-tabs button[aria-selected="true"]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.tn-tabs button:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.tn-cmp{position:relative;border-radius:16px;overflow:hidden;background:#F1EFEA;box-shadow:0 0 0 1px var(--line),0 24px 50px -30px rgba(0,0,0,.4);aspect-ratio:1512/728;user-select:none;touch-action:pan-y}
.tn-cmp img{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:cover;object-position:top}
.tn-oldwrap{position:absolute;inset:0;clip-path:inset(0 calc(100% - var(--p)) 0 0)}
.tn-handle{position:absolute;top:0;bottom:0;left:var(--p);width:2px;margin-left:-1px;background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.12);pointer-events:none}
.tn-handle i{position:absolute;top:50%;left:50%;width:40px;height:40px;margin:-20px 0 0 -20px;border-radius:50%;background:#fff;box-shadow:0 4px 14px rgba(0,0,0,.25)}
.tn-handle i::before,.tn-handle i::after{content:"";position:absolute;top:50%;width:0;height:0;border:5px solid transparent;margin-top:-5px}
.tn-handle i::before{left:9px;border-right-color:#17171A}
.tn-handle i::after{right:9px;border-left-color:#17171A}
.tn-range{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize}
.tn-range:focus-visible + *,.tn-cmp:focus-within .tn-handle i{outline:2px solid var(--ink);outline-offset:2px}
.tn-lab{position:absolute;bottom:14px;font-family:'Geist Mono',ui-monospace,monospace;font-size:12px;padding:5px 10px;border-radius:99px;background:rgba(23,23,26,.78);color:#fff;pointer-events:none}
.tn-lab.l{left:14px}.tn-lab.r{right:14px}
.tn-nums{margin:4px 0 0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.tn-nums div{border:1px solid var(--line);border-radius:14px;padding:16px 18px;display:flex;flex-direction:column;gap:8px}
.tn-nums dt{font-size:13px;color:var(--mute)}
.tn-nums dd{margin:0;display:flex;align-items:baseline;gap:10px;font-family:'Geist Mono',ui-monospace,monospace}
.tn-nums s{font-size:18px;color:var(--mute);text-decoration-thickness:1px}
.tn-nums s::after{content:" →";text-decoration:none;display:inline-block;margin-left:6px}
.tn-nums b{font-size:34px;font-weight:500;letter-spacing:-.03em;color:var(--ink)}
.tn-note{margin:0;font-size:13px;color:var(--mute);line-height:1.55;max-width:760px}
@media (max-width:620px){.tn-nums{grid-template-columns:repeat(2,minmax(0,1fr))}.tn-lab{bottom:8px;font-size:11px}.tn-handle i{width:32px;height:32px;margin:-16px 0 0 -16px}}

.tn{margin:96px 0 0 !important}
.tn-nums{grid-template-columns:repeat(2,minmax(0,1fr)) !important;max-width:520px}
.tn-nums div{padding:14px 16px}
.tn-nums b{font-size:28px}
/* hero icon click effects */
.intro .lead .ico.fx-btn{cursor:pointer;pointer-events:auto}
.intro .lead .ico.fx-btn:hover{transform:translateY(-2px) !important;box-shadow:0 6px 14px -6px rgba(0,0,0,.28),0 0 0 1px var(--line)}
.intro .lead .ico.fx-btn:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.hfx{position:fixed;left:0;top:0;width:0;height:0;pointer-events:none;z-index:60}
.hfx svg{position:absolute;left:0;top:0;overflow:visible}
.hfx-veil{position:fixed;inset:0;background:color-mix(in srgb,var(--paper) 55%,transparent);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.hfx-ring{position:fixed;width:40px;height:40px;border:2px solid;border-radius:50%}
.hw.hfx-focus{position:relative;z-index:61;color:var(--fc);text-shadow:0 0 18px color-mix(in srgb,var(--fc) 35%,transparent)}
.hfx-flash{position:fixed;width:90px;height:90px;border-radius:50%}
.hfx-spark{position:fixed;width:14px;height:3px;border-radius:2px;transform-origin:0 50%}
.hfx-streak{position:fixed;height:3px;border-radius:3px}
.hfx-person{position:fixed;width:14px;height:22px;margin:-22px 0 0 -7px}
.hfx-person b{position:absolute;left:3px;top:0;width:8px;height:8px;border-radius:50%;background:var(--t)}
.hfx-person s{position:absolute;left:0;top:9px;width:14px;height:12px;border-radius:7px 7px 3px 3px;background:var(--t);opacity:.85}

.dk-seen,.dk-stamp{display:none !important}
.dk-tape{width:56px !important;height:16px !important;top:-7px !important}
.dk-clip{width:14px !important;height:34px !important;top:-11px !important}

.tn h3{margin:0 0 8px}
.tn-k{display:none}
.tn-grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:40px;align-items:end}
.tn-left{display:flex;flex-direction:column;gap:16px;min-width:0}
.tn-right{display:flex;flex-direction:column;gap:20px;padding-bottom:4px}
.tn-notes{margin:0;display:flex;flex-direction:column;gap:18px}
.tn-n{display:flex;flex-direction:column;gap:4px;padding-left:14px;border-left:2px solid var(--line);animation:ciFade .35s ease}
.tn-n dt{font-family:'Geist Mono',ui-monospace,monospace;font-size:12px;color:var(--mute)}
.tn-n dd{margin:0;font-size:15px;line-height:1.5;color:var(--ink)}
.tn-n.hl{border-left-color:#C2410C}
.tn-n.hl dt{color:#C2410C}
.tn-nums{grid-template-columns:1fr 1fr !important;max-width:none !important;margin:0 !important}
.tn-nums div{padding:12px 14px !important}
.tn-nums b{font-size:26px !important}
.tn-nums dt{font-size:12px}
@media (max-width:980px){.tn-grid{grid-template-columns:1fr;gap:24px}}

.tn-grid{align-items:start !important}
.tn-right{padding-top:58px}
@media (max-width:980px){.tn-right{padding-top:0}}

/* hero thought card */
.hthought{position:absolute;z-index:60;padding:16px 18px 18px;border-radius:14px;background:var(--paper);color:var(--ink);box-shadow:0 0 0 1px var(--line),0 24px 48px -20px rgba(0,0,0,.35);opacity:0;transform:translateY(-6px) scale(.98);transform-origin:var(--ax) 0;transition:opacity .25s ease,transform .3s cubic-bezier(.2,.8,.2,1);pointer-events:auto}
.hthought.on{opacity:1;transform:none}
.hthought::before{display:none;content:"";position:absolute;top:-6px;left:calc(var(--ax) - 6px);width:12px;height:12px;background:var(--paper);transform:rotate(45deg);box-shadow:-1px -1px 0 0 var(--line)}
.hthought::after{content:"";position:absolute;left:0;top:14px;bottom:14px;width:3px;border-radius:0 3px 3px 0;background:var(--tc)}
.ht-k{display:flex;align-items:center;gap:8px;font-family:'Geist Mono',ui-monospace,monospace;font-size:11.5px;color:var(--mute);margin-bottom:8px}
.ht-k i{width:7px;height:7px;border-radius:50%;background:var(--tc);box-shadow:0 0 0 4px color-mix(in srgb,var(--tc) 20%,transparent)}
.hthought p{margin:0;font-family:var(--serif);font-size:21px;line-height:1.3;letter-spacing:-.005em}
.hthought p span{display:inline-block;opacity:0;filter:blur(4px);transform:translateY(4px);transition:opacity .35s ease var(--d),filter .35s ease var(--d),transform .35s ease var(--d)}
.hthought.on p span{opacity:1;filter:none;transform:none}
@media (prefers-reduced-motion:reduce){.hthought,.hthought p span{transition:none}}

/* then vs now: scroll-driven horizontal carousel */
.tn{margin:96px 0 0 !important}
.tn-grid,.tn-right{display:none}
.tn-pin.x{}
.tn.pinned .tn-pin{height:calc(var(--n) * 85vh + 100vh)}
.tn-stick{display:flex;flex-direction:column;gap:18px}
.tn.pinned .tn-stick{position:sticky;top:96px;height:calc(100vh - 120px);justify-content:center}
.tn-top{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap}
.tn-top h3{margin:0 !important}
.tn-tabs button{display:inline-flex;gap:8px;align-items:center}
.tn-tn{font-family:'Geist Mono',ui-monospace,monospace;font-size:11px;opacity:.6}
.tn-view{overflow:hidden;border-radius:16px}
.tn-track{display:flex;will-change:transform}
.tn.free .tn-track{transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.tn-slide{flex:0 0 100%;display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:36px;align-items:center;padding:2px}
.tn.pinned .tn-slide .tn-cmp{max-height:calc(100vh - 290px);aspect-ratio:1512/728;width:auto;margin:0}
.tn-notes{margin:0;display:flex;flex-direction:column;gap:18px}
.tn-prog{height:2px;background:var(--line);border-radius:2px;overflow:hidden}
.tn-prog i{display:block;height:100%;background:var(--ink);transform:scaleX(0);transform-origin:0 50%}
.tn.free .tn-prog{display:none}
@media (max-width:820px){.tn-slide{grid-template-columns:1fr;gap:18px}.tn-top{flex-direction:column;align-items:flex-start}}

.tn.pinned .tn-slide .tn-cmp{max-height:none;width:100%}
.tn.pinned .tn-stick{top:110px;height:calc(100vh - 130px)}

.fl-cta,.fl-cta:hover{background:#fff !important;color:#17171A !important;text-decoration:none !important}

.hpill{position:absolute;z-index:60;white-space:nowrap;font-size:14px;font-weight:500;line-height:1;padding:9px 13px;border-radius:99px;background:var(--tc);color:#fff;box-shadow:0 10px 24px -10px var(--tc);opacity:0;transform:translateY(6px) scale(.9);transform-origin:var(--ax) 100%;transition:opacity .2s ease,transform .35s cubic-bezier(.2,1.4,.4,1);pointer-events:none}
.hpill.on{opacity:1;transform:none}
.hpill::after{content:"";position:absolute;bottom:-4px;left:calc(var(--ax) - 5px);width:10px;height:10px;background:var(--tc);transform:rotate(45deg);border-radius:2px}

.hpill.dn{transform-origin:var(--ax) 0;transform:translateY(-6px) scale(.9)}
.hpill.dn.on{transform:none}
.hpill.dn::after{bottom:auto;top:-4px}

/* ===== Video teaser case study ===== */
.vt{--acc:#C2410C}
.vt .vt-arr{color:var(--acc);font-weight:500}
.vt-demo{display:flex;flex-direction:column;gap:14px;background:#F1EFEA;border-radius:20px;padding:20px}
:root[data-theme="dark"] .vt-demo{background:#1E1E21}
.vt-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.vt-seg{display:inline-flex;padding:3px;border-radius:99px;background:var(--paper);box-shadow:0 0 0 1px var(--line)}
.vt-seg button{all:unset;cursor:pointer;font-size:14px;padding:7px 14px;border-radius:99px;color:var(--mute);transition:all .2s}
.vt-seg button[aria-checked="true"]{background:var(--ink);color:var(--paper)}
.vt-seg button:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.vt-tag{font-family:'Geist Mono',ui-monospace,monospace;font-size:11.5px;color:var(--mute)}
.vt-stage{display:grid;grid-template-columns:minmax(0,1fr) 230px;gap:14px}
.vt-player{position:relative;aspect-ratio:16/10;border-radius:14px;overflow:hidden;background:#111}
.vt-frame{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .5s ease;transform:scale(1.02)}
.vt-frame.on{opacity:1}
.vt-demo.playing .vt-frame.on{animation:vtKen 2.6s linear forwards}
@keyframes vtKen{from{transform:scale(1.02) translate(0,0)}to{transform:scale(1.12) translate(-2%,-1.5%)}}
.vt-sub{position:absolute;left:50%;bottom:58px;transform:translateX(-50%);margin:0;max-width:86%;text-align:center;font-size:15px;line-height:1.35;color:#fff;background:rgba(0,0,0,.55);padding:6px 12px;border-radius:8px;opacity:0;transition:opacity .3s}
.vt-demo.playing .vt-sub{opacity:1}
.vt-ui{position:absolute;left:12px;right:12px;bottom:12px;display:flex;align-items:center;gap:12px;color:#fff}
.vt-play{all:unset;cursor:pointer;width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.95);color:#111;display:grid;place-items:center;font-size:13px;flex:none}
.vt-play:focus-visible{outline:2px solid #fff;outline-offset:2px}
.vt-prog{position:relative;flex:1;height:4px;border-radius:2px;background:rgba(255,255,255,.3)}
.vt-prog i{position:absolute;left:0;top:0;bottom:0;width:0;border-radius:2px;background:#fff}
.vt-cap{position:absolute;left:40%;top:-5px;bottom:-5px;width:2px;background:var(--acc);border-radius:1px}
.vt-cap::after{content:"";position:absolute;left:2px;right:-400%;top:5px;height:4px}
.vt-time{font-family:'Geist Mono',ui-monospace,monospace;font-size:12px;opacity:.9}
.vt-end{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;background:rgba(17,17,17,.62);backdrop-filter:blur(6px);color:#fff;padding:20px;animation:ciFade .4s ease}
.vt-end-k{margin:0;font-family:'Geist Mono',ui-monospace,monospace;font-size:12px;opacity:.8}
.vt-end-h{margin:0;font-family:var(--serif);font-size:clamp(22px,2.4vw,30px);line-height:1.15}
.vt-end-b{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:6px}
.vt-cta{all:unset;cursor:pointer;font-size:14px;font-weight:500;padding:10px 16px;border-radius:10px;background:var(--acc);color:#fff;text-align:center;transition:transform .15s}
.vt-cta:hover{transform:translateY(-1px)}
.vt-ghost{all:unset;cursor:pointer;font-size:14px;padding:10px 14px;border-radius:10px;border:1px solid currentColor;opacity:.9;text-align:center}
.vt-cta.sm,.vt-ghost.sm{font-size:13px;padding:9px 12px}
.vt-cta:focus-visible,.vt-ghost:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.vt-side{background:var(--paper);border-radius:14px;box-shadow:0 0 0 1px var(--line);padding:16px;display:flex;flex-direction:column;gap:12px}
.vt-side-k{margin:0;font-size:13px;color:var(--acc);background:rgba(194,65,12,.08);padding:8px 10px;border-radius:8px}
.vt-btns{display:flex;flex-direction:column;gap:8px}
.vt-side .vt-ghost{color:var(--ink);border-color:var(--line)}
.vt-side-n{margin:auto 0 0 !important;font-size:13px !important;line-height:1.5 !important;color:var(--mute)}
.vt-demo[data-mode="free"] [data-paid],.vt-demo[data-mode="paid"] [data-free]{display:none !important}
.vt-strip{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:8px}
.vt-sc{all:unset;cursor:pointer;position:relative;aspect-ratio:16/10;border-radius:8px;overflow:hidden;background:#222;box-shadow:0 0 0 2px transparent;transition:box-shadow .2s}
.vt-sc img{width:100%;height:100%;object-fit:cover;display:block}
.vt-sc>span{position:absolute;left:5px;top:4px;font-family:'Geist Mono',ui-monospace,monospace;font-size:10px;color:#fff;background:rgba(0,0,0,.55);padding:1px 5px;border-radius:4px}
.vt-sc.cur{box-shadow:0 0 0 2px var(--acc)}
.vt-sc.lock{cursor:pointer}
.vt-sc.lock img{transform:scaleX(var(--sx)) rotate(var(--r)) scale(1.35);filter:blur(7px) saturate(.9)}
.vt-sc.lock i{position:absolute;inset:0;display:grid;place-items:center;font-style:normal;font-size:13px}
.vt-demo[data-mode="paid"] .vt-sc.lock i{display:none}
.vt-note{margin:0 !important;font-size:13px !important;color:var(--mute);text-align:center}

.vt-flow{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;counter-reset:f}
.vt-flow li{position:relative;border:1px solid var(--line);border-radius:14px;padding:18px;display:flex;flex-direction:column;gap:6px}
.vt-flow li:not(:last-child)::after{content:"→";position:absolute;right:-12px;top:50%;transform:translate(50%,-50%);color:var(--mute);background:var(--paper);font-size:14px;z-index:1;padding:2px 0}
.vt-flow .n{font-family:'Geist Mono',ui-monospace,monospace;font-size:12px;color:var(--mute)}
.vt-flow b{font-size:17px;font-weight:500}
.vt-flow em{font-style:normal;font-size:14px;color:var(--mute);line-height:1.45}
.vt-flow.old li:last-child{border-style:dashed}
.vt-flow.new li:nth-child(3),.vt-flow.new li:nth-child(4){border-color:var(--acc);background:rgba(194,65,12,.05)}
.vt-flow.new li:nth-child(3) b,.vt-flow.new li:nth-child(4) b{color:var(--acc)}
.vt-goal{display:flex;gap:16px;align-items:baseline;border-radius:14px;background:var(--soft);padding:18px 22px}
.vt-goal span{font-family:'Geist Mono',ui-monospace,monospace;font-size:12px;color:var(--acc);flex:none}
.vt-goal p{margin:0 !important;font-family:var(--serif);font-size:24px !important;line-height:1.25 !important}
.vt-ic{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:8px;background:rgba(194,65,12,.1);margin-right:10px}
.vt-ic svg{width:15px;height:15px;fill:none;stroke:var(--acc);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.vt .ci-dk span.vt-ic::before{content:none}
.vt .ci-dk{display:flex;align-items:center}

.vt-cost{margin:0;border:1px solid var(--line);border-radius:16px;padding:22px;display:flex;flex-direction:column;gap:14px}
.vt-cost .r{display:grid;grid-template-columns:170px 1fr 60px;gap:12px;align-items:center;font-size:14px}
.vt-cost .t{height:12px;border-radius:6px;background:var(--soft);overflow:hidden}
.vt-cost .t i{display:block;height:100%;width:var(--w);background:var(--ink);border-radius:6px}
.vt-cost .r:nth-child(2) .t i{background:var(--acc)}
.vt-cost .v{font-family:'Geist Mono',ui-monospace,monospace;font-size:12px;color:var(--mute);text-align:right}
.vt-cost figcaption{font-size:13px;color:var(--mute);line-height:1.5}
.vt-blur{display:flex;flex-direction:column;gap:14px;background:#F1EFEA;border-radius:16px;padding:16px}
:root[data-theme="dark"] .vt-blur{background:#1E1E21}
.vt-blur-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.vt-blur .bt{position:relative;aspect-ratio:16/10;border-radius:8px;overflow:hidden;background:#222}
.vt-blur .bt img{width:100%;height:100%;object-fit:cover;display:block;transform:scaleX(var(--sx)) rotate(var(--r)) scale(1.35);filter:blur(8px);transition:filter .5s ease}
.vt-blur .bt span{position:absolute;left:6px;right:6px;bottom:5px;font-family:'Geist Mono',ui-monospace,monospace;font-size:10px;color:#fff;background:rgba(0,0,0,.6);padding:2px 6px;border-radius:4px;opacity:0;transition:opacity .3s}
.vt-blur.peek .bt img{filter:none}
.vt-blur.peek .bt span{opacity:1}
.vt-sw{display:inline-flex;align-items:center;gap:8px;font-size:14px;cursor:pointer;align-self:flex-start}
.vt-sw input{accent-color:var(--acc);width:16px;height:16px}
.vt-ph{border-radius:16px;background:#F1EFEA;border:1px dashed #CFCAC0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:20px;text-align:center}
:root[data-theme="dark"] .vt-ph{background:#1E1E21;border-color:#3A3A3E}
.vt-ph span{font-family:'Geist Mono',ui-monospace,monospace;font-size:11px;color:#B4541A}
.vt-ph b{font-weight:400;font-size:14px;color:var(--mute);max-width:36ch}
.vt-impact{display:flex;flex-direction:column;gap:6px;margin-bottom:20px}
.vt-arr-big{margin:0 !important;display:flex;align-items:baseline;gap:18px;font-family:var(--serif);line-height:1}
.vt-arr-big span{font-size:clamp(40px,5vw,64px);color:var(--mute)}
.vt-arr-big i{font-style:normal;font-size:32px;color:var(--mute)}
.vt-arr-big b{font-weight:400;font-size:clamp(64px,8vw,104px);color:var(--acc);letter-spacing:-.02em}
.vt-arr-cap{margin:0 !important;font-size:15px !important;color:var(--mute)}
.vt-nums b{display:flex;align-items:baseline;gap:6px}
@media (max-width:820px){
 .vt-stage{grid-template-columns:1fr}
 .vt-strip{grid-template-columns:repeat(5,minmax(0,1fr))}
 .vt-flow{grid-template-columns:1fr 1fr}
 .vt-flow li:nth-child(2)::after{display:none}
 .vt-cost .r{grid-template-columns:1fr 50px}.vt-cost .l{grid-column:1/-1}
}
@media (max-width:520px){.vt-flow{grid-template-columns:1fr}.vt-flow li::after{display:none}.vt-blur-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.vt-sub{font-size:12px;bottom:52px}}
@media (prefers-reduced-motion:reduce){.vt-demo.playing .vt-frame.on{animation:none}}

.vt-end[hidden]{display:none !important}
#ci-root.vt .ci-dk .vt-ic{display:inline-grid;place-items:center;width:26px;height:26px;padding:0;border-radius:8px;background:rgba(194,65,12,.1);margin-right:10px}
#ci-root.vt .ci-dk .vt-ic::before{content:none}
#ci-root.vt .vt-side-k{font-size:13px;line-height:1.4;margin:0}
#ci-root.vt .vt-end-h{font-size:clamp(22px,2.4vw,30px);line-height:1.15}
#ci-root.vt .vt-end-k{font-size:12px}
#ci-root.vt .vt-sub{font-size:15px;line-height:1.35}
#ci-root.vt .vt-goal p{font-size:24px;line-height:1.25}
@media (max-width:520px){#ci-root.vt .vt-sub{font-size:12px}}

/* portrait teaser */
.vt-stage{grid-template-columns:minmax(0,1fr) 250px !important}
.vt-player{aspect-ratio:auto !important;height:min(560px,70vh);display:flex;justify-content:center;background:#151515}
.vt-player::before{content:"";position:absolute;inset:-20px;background:var(--bgimg) center/cover;filter:blur(24px) brightness(.55)}
.vt-frame{left:50% !important;width:auto !important;aspect-ratio:9/16;height:100%;transform:translateX(-50%) !important;object-fit:cover}
.vt-demo.playing .vt-frame.on{animation:vtKen2 2.4s linear forwards}
@keyframes vtKen2{from{transform:translateX(-50%) scale(1)}to{transform:translateX(-50%) scale(1.06)}}
.vt-cap{left:47% !important}
.vt-strip{grid-template-columns:repeat(11,minmax(0,1fr)) !important}
.vt-sc{aspect-ratio:9/14 !important}
.vt-blur .bt{aspect-ratio:9/12 !important}
.vt-blur-grid{grid-template-columns:repeat(6,minmax(0,1fr)) !important}
.vt-pair{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start}
.vt-pair .ci-fig{margin:0}
.vt-cost-t{margin:0 0 4px !important;font-size:15px !important;font-weight:500}
.vt-cost .r{grid-template-columns:150px 1fr 54px !important}
.vt-cost .l{display:flex;flex-direction:column;gap:2px}
.vt-cost .l b{font-weight:500;font-size:14px}
.vt-cost .l em{font-style:normal;font-size:12px;color:var(--mute)}
.vt-cost .v{font-size:14px !important;color:var(--ink) !important}
.vt-bars{grid-template-columns:repeat(9,minmax(0,1fr)) !important}
.vt-subs .ci-col .v{display:block !important}
.vt-subs .ci-col.key .b{background:#C2410C;opacity:1}
.vt-subs .ci-col.mark::before{content:"";position:absolute;left:-4px;top:0;bottom:0;border-left:1px dashed var(--mute)}
.vt-tl{list-style:none;margin:0;padding:0 0 0 20px;border-left:2px solid var(--line);display:flex;flex-direction:column;gap:22px;max-width:680px}
.vt-tl li{position:relative}
.vt-tl li::before{content:"";position:absolute;left:-27px;top:6px;width:12px;height:12px;border-radius:50%;background:var(--paper);border:2px solid #C2410C}
.vt-tl li:last-child::before{background:#C2410C}
.vt-tl b{font-family:'Geist Mono',ui-monospace,monospace;font-size:12px;font-weight:500;color:#C2410C}
#ci-root.vt .vt-tl p{margin:4px 0 0;font-size:16px;line-height:1.55}
#ci-root.vt .vt-honest{font-size:15px;color:var(--mute);margin-top:16px}
@media (max-width:820px){.vt-stage{grid-template-columns:1fr !important}.vt-strip{grid-template-columns:repeat(6,minmax(0,1fr)) !important}.vt-pair{grid-template-columns:1fr}.vt-blur-grid{grid-template-columns:repeat(3,minmax(0,1fr)) !important}}

.vt-cost .r .t i{background:var(--ink) !important}
.vt-cost .r:nth-of-type(2) .t i{background:#C2410C !important}

.vt-d1m{display:grid;grid-template-columns:180px minmax(0,1fr);gap:16px;align-items:start}
.vt-clip{margin:0}
.vt-clip video{display:block;width:100%;aspect-ratio:9/16;object-fit:cover;border-radius:12px;background:#111}
.vt-clip figcaption{font-size:13px;color:var(--mute);margin-top:8px;line-height:1.4}
@media (max-width:520px){.vt-d1m{grid-template-columns:1fr}.vt-clip{max-width:220px}}

.vt-mk{border:1px solid var(--line);border-radius:16px;padding:18px;display:flex;flex-direction:column;gap:14px}
.vt-mk .row{display:grid;grid-template-columns:1.3fr repeat(3,1fr);gap:8px;align-items:center}
.vt-mk .k{font-size:14px;font-weight:500;line-height:1.3}
.vt-mk .s{display:flex;flex-direction:column;gap:2px;padding:10px;border-radius:10px;background:var(--soft);text-align:center}
.vt-mk .s i{font-style:normal;font-size:12px;color:var(--mute)}
.vt-mk .s b{font-weight:500;font-size:14px}
.vt-mk .s.hl{background:rgba(194,65,12,.1)}
.vt-mk .s.hl b{color:#C2410C}
@media (max-width:520px){.vt-mk .row{grid-template-columns:repeat(3,1fr)}.vt-mk .k{grid-column:1/-1}}

.vt-vid{position:absolute;top:0;left:50%;height:100%;aspect-ratio:9/16;transform:translateX(-50%);object-fit:cover;background:#111}
.vt-modal{position:absolute;inset:0;z-index:20;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(17,17,17,.55);backdrop-filter:blur(4px);border-radius:20px;animation:ciFade .25s ease}
.vt-modal[hidden]{display:none !important}
.vt-demo{position:relative}
.vt-mbox{position:relative;max-width:min(860px,100%);max-height:100%;overflow:auto;background:var(--paper);border-radius:14px;padding:10px;box-shadow:0 30px 60px -20px rgba(0,0,0,.5);animation:vtPop .3s cubic-bezier(.2,1.2,.4,1)}
@keyframes vtPop{from{transform:scale(.94);opacity:0}to{transform:none;opacity:1}}
.vt-mbox img{display:block;width:100%;height:auto;border-radius:8px}
#ci-root.vt .vt-mcap{margin:8px 4px 2px;font-size:13px;color:var(--mute)}
.vt-mx{all:unset;cursor:pointer;position:absolute;top:14px;right:14px;width:32px;height:32px;border-radius:50%;background:rgba(17,17,17,.75);color:#fff;display:grid;place-items:center;font-size:20px;line-height:1;z-index:2}
.vt-mx:focus-visible{outline:2px solid #fff;outline-offset:2px}

#ci-root .ci-nums b span{font-size:inherit !important;color:inherit !important;line-height:inherit;font-family:inherit}
#ci-root .vt-nums b{gap:10px;white-space:nowrap}

#ci-root .vt-nums b{font-size:clamp(30px,3vw,42px) !important;gap:8px}
#ci-root .vt-nums div{padding-right:16px}

#ci-root.vt .vt-sub{display:none}
.vt-snd{all:unset;cursor:pointer;width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,.18);display:grid;place-items:center;font-size:14px;flex:none}
.vt-snd:focus-visible{outline:2px solid #fff;outline-offset:2px}
.vt-demo.in-lock .vt-sc.lock{box-shadow:0 0 0 2px #C2410C}
/* ===== Editing experience ===== */
.ed{--acc:#23734A}
#ci-root.ed .vt-ic{background:rgba(35,115,74,.1)}
#ci-root.ed .vt-ic svg{stroke:var(--acc)}
#ci-root.ed .vt-tl li::before{border-color:var(--acc)}
#ci-root.ed .vt-tl li:last-child::before{background:var(--acc)}
#ci-root.ed .vt-tl b{color:var(--acc)}
#ci-root.ed .vt-tl p{margin:4px 0 0;font-size:16px;line-height:1.55}
.ed-map{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:16px;background:#EDF0EB;border-radius:20px;padding:18px;align-items:start}
:root[data-theme="dark"] .ed-map{background:#1B201D}
.ed-stage{position:relative;border-radius:12px;overflow:hidden;box-shadow:0 0 0 1px var(--line);background:#fff}
.ed-stage img{display:block;width:100%;height:auto}
.ed-pin{all:unset;box-sizing:border-box;cursor:pointer;position:absolute;left:var(--x);top:var(--y);width:28px;height:28px;margin:-14px 0 0 -14px;border-radius:50%;background:var(--acc);color:#fff;font:600 12px/28px 'Geist Mono',ui-monospace,monospace;text-align:center;box-shadow:0 0 0 3px rgba(255,255,255,.95),0 6px 16px rgba(0,0,0,.25);transition:transform .2s ease,background .2s}
.ed-pin::before{content:"";position:absolute;inset:-7px;border-radius:50%;border:2px solid var(--acc);opacity:0;animation:edPulse 2.6s ease-out infinite}
.ed-pin:nth-of-type(2)::before{animation-delay:.4s}.ed-pin:nth-of-type(3)::before{animation-delay:.8s}.ed-pin:nth-of-type(4)::before{animation-delay:1.2s}.ed-pin:nth-of-type(5)::before{animation-delay:1.6s}.ed-pin:nth-of-type(6)::before{animation-delay:2s}
.ed-pin:hover{transform:scale(1.12)}
.ed-pin[aria-pressed="true"]{background:#111;transform:scale(1.15)}
.ed-pin[aria-pressed="true"]::before{animation:none;opacity:1;border-color:#111;inset:-6px}
.ed-pin:focus-visible{outline:2px solid #111;outline-offset:4px}
@keyframes edPulse{0%{opacity:.8;transform:scale(.75)}100%{opacity:0;transform:scale(1.7)}}
.ed-card{background:var(--paper);border-radius:14px;box-shadow:0 0 0 1px var(--line);padding:18px;display:flex;flex-direction:column;gap:12px;min-height:100%}
.ed-cardin{display:flex;flex-direction:column;gap:8px;animation:ciFade .35s ease}
.ed-k{margin:0 !important;font-family:'Geist Mono',ui-monospace,monospace;font-size:11.5px !important;color:var(--acc)}
.ed-card h3{margin:0;font-size:22px;font-weight:500;letter-spacing:-.01em}
.ed-d{margin:0 !important;font-size:15px !important;line-height:1.5 !important;color:var(--mute)}
.ed-ths{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:6px}
.ed-th{all:unset;cursor:zoom-in;display:flex;flex-direction:column;gap:4px}
.ed-th .im{display:block;aspect-ratio:16/10;border-radius:8px;overflow:hidden;box-shadow:0 0 0 1px var(--line);background:#f4f4f2}
.ed-th img{width:100%;height:100%;object-fit:cover;object-position:top left;display:block;transition:transform .4s ease}
.ed-th:hover img{transform:scale(1.05)}
.ed-th b{font-size:13.5px;font-weight:500}
.ed-th em{font-style:normal;font-size:12.5px;line-height:1.4;color:var(--mute)}
.ed-th:focus-visible .im{outline:2px solid var(--acc);outline-offset:2px}
.ed-hint{margin:auto 0 0 !important;font-family:'Geist Mono',ui-monospace,monospace;font-size:11px !important;color:var(--mute)}
.ed-nums b{display:flex;align-items:baseline}
.ed-pair{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start}
.ed-pair .ci-fig{margin:0}
.ed-pair.ed-pr{grid-template-columns:.62fr 1fr}
/* depth */
.ed-depth{display:flex;flex-direction:column;gap:14px;background:#EDF0EB;border-radius:20px;padding:18px}
:root[data-theme="dark"] .ed-depth{background:#1B201D}
.ed-dtabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.ed-dtabs button{all:unset;box-sizing:border-box;cursor:pointer;display:flex;gap:12px;align-items:center;padding:12px 14px;border-radius:12px;background:var(--paper);box-shadow:0 0 0 1px var(--line);transition:box-shadow .2s,transform .2s}
.ed-dtabs button:hover{transform:translateY(-1px)}
.ed-dtabs button[aria-selected="true"]{box-shadow:0 0 0 2px var(--acc)}
.ed-dtabs button:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.ed-dtabs .lv{display:flex;flex-direction:column;gap:3px;width:18px;flex:none}
.ed-dtabs .lv i{display:block;height:3px;border-radius:2px;background:var(--acc)}
.ed-dtabs .lv i:nth-child(2){width:75%;margin-left:12.5%}.ed-dtabs .lv i:nth-child(3){width:50%;margin-left:25%}
.ed-dtabs b{display:block;font-size:15px;font-weight:500}
.ed-dtabs em{display:block;font-style:normal;font-size:13px;color:var(--mute)}
.ed-dview{position:relative;aspect-ratio:1800/1025;border-radius:12px;overflow:hidden;box-shadow:0 0 0 1px var(--line);background:#fff}
.ed-dimg{all:unset;cursor:zoom-in;position:absolute;inset:0;opacity:0;transform:scale(1.08);transition:opacity .5s ease,transform .7s cubic-bezier(.2,.7,.2,1);pointer-events:none}
.ed-dimg.on{opacity:1;transform:none;pointer-events:auto}
.ed-dimg.out{opacity:0;transform:scale(.94)}
.ed-dimg img{width:100%;height:100%;object-fit:cover;object-position:top;display:block}
.ed-dimg:focus-visible{outline:2px solid var(--acc);outline-offset:-4px}
.ed-dcap{margin:0 !important;font-size:15px !important;color:var(--mute);text-align:center;min-height:1.5em}
/* tools */
.ed-tools{display:grid;grid-template-columns:150px minmax(0,1fr);gap:16px;background:#EDF0EB;border-radius:20px;padding:18px}
:root[data-theme="dark"] .ed-tools{background:#1B201D}
.ed-rail{display:flex;flex-direction:column;gap:2px;background:var(--paper);border-radius:14px;box-shadow:0 0 0 1px var(--line);padding:10px 8px;align-self:start}
.ed-g{margin:8px 8px 4px !important;font-family:'Geist Mono',ui-monospace,monospace;font-size:10.5px !important;letter-spacing:.06em;text-transform:uppercase;color:var(--mute)}
.ed-g:first-child{margin-top:2px !important}
.ed-rail button{all:unset;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:9px;font-size:14px;color:var(--ink);transition:background .15s}
.ed-rail button:hover{background:var(--soft)}
.ed-rail button[aria-selected="true"]{background:rgba(35,115,74,.12);color:var(--acc)}
.ed-rail button:focus-visible{outline:2px solid var(--acc);outline-offset:1px}
.ed-rail .ic svg,.ed-tp h4 .ic svg,.ed-tmock svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;display:block}
.ed-tp{display:flex;flex-direction:column;gap:8px;animation:ciFade .35s ease}
.ed-tp h4{margin:0;display:flex;align-items:center;gap:10px;font-size:22px;font-weight:500}
.ed-tp h4 .ic{color:var(--acc)}
.ed-tp>p:not(.ed-k){margin:0 !important;font-size:15.5px !important;line-height:1.55 !important;color:var(--mute);max-width:56ch}
.ed-tshot{all:unset;cursor:zoom-in;display:block;margin-top:8px;border-radius:12px;overflow:hidden;box-shadow:0 0 0 1px var(--line);background:#fff;max-height:440px}
.ed-tshot img{display:block;width:100%;height:auto}
.ed-tshot:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.ed-tmock{margin-top:8px;height:220px;border-radius:12px;background:var(--paper);box-shadow:0 0 0 1px var(--line);display:grid;place-items:center;color:var(--acc)}
.ed-tmock .big svg{width:64px;height:64px;stroke-width:1.2;opacity:.85}
/* levels */
.ed-lv{display:flex;flex-direction:column;gap:10px;border:1px solid var(--line);border-radius:16px;padding:16px}
.ed-lv .row{display:grid;grid-template-columns:130px 1fr;gap:14px;align-items:center;padding:12px;border-radius:12px;background:var(--soft)}
.ed-lv .row.top{background:rgba(35,115,74,.08)}
.ed-lv .k{font-size:15px;font-weight:500}
.ed-lv .k em{display:block;font-style:normal;font-size:12.5px;font-weight:400;color:var(--mute)}
.ed-lv .chips{display:flex;flex-wrap:wrap;gap:6px}
.ed-lv .chips i{font-style:normal;font-family:'Geist Mono',ui-monospace,monospace;font-size:11.5px;letter-spacing:.04em;text-transform:uppercase;padding:6px 9px;border-radius:7px;background:var(--paper);box-shadow:0 0 0 1px var(--line)}
.ed-lv .row.top .chips i{color:var(--acc)}
@media (max-width:900px){.ed-map{grid-template-columns:1fr}.ed-card{min-height:0}}
@media (max-width:820px){.ed-pair,.ed-pair.ed-pr{grid-template-columns:1fr}.ed-tools{grid-template-columns:1fr}.ed-rail{flex-direction:row;flex-wrap:wrap;gap:4px}.ed-g{display:none}.ed-rail button{padding:7px 9px;font-size:13px}}
@media (max-width:620px){.ed-dtabs{grid-template-columns:1fr}.ed-dtabs button{padding:10px 12px}.ed-lv .row{grid-template-columns:1fr}.ed-pin{width:24px;height:24px;margin:-12px 0 0 -12px;line-height:24px;font-size:11px}.ed-map,.ed-depth,.ed-tools{padding:12px}}
@media (prefers-reduced-motion:reduce){.ed-pin::before{animation:none}.ed-dimg{transition:opacity .2s}}

.ed-cardin[hidden],.ed-tp[hidden]{display:none !important}
.ed .ci-dk span.vt-ic::before{content:none}
#ci-root.ed .ci-dk .vt-ic{display:inline-grid;place-items:center;width:26px;height:26px;padding:0;border-radius:8px;background:rgba(35,115,74,.12);margin-right:10px;flex:none}
#ci-root.ed .ci-dk .vt-ic::before{content:none}
#ci-root.ed .ci-dk .vt-ic svg{width:15px;height:15px;display:block;fill:none;stroke:var(--acc);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
:root[data-theme="dark"] #ci-root.ed .ci-dk .vt-ic{background:rgba(74,180,120,.16)}
:root[data-theme="dark"] #ci-root.ed .ci-dk .vt-ic svg{stroke:#6FCF97}
.ed .ci-dk{display:flex;align-items:center}

.ed-left{display:flex;flex-direction:column;gap:14px;min-width:0}
.ed-leg{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.ed-leg button{all:unset;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:12px;background:var(--paper);box-shadow:0 0 0 1px var(--line);font-size:15px;transition:box-shadow .2s,transform .2s}
.ed-leg button:hover{transform:translateY(-1px)}
.ed-leg button span{width:24px;height:24px;border-radius:50%;background:var(--acc);color:#fff;display:grid;place-items:center;font:600 11px 'Geist Mono',ui-monospace,monospace;flex:none}
.ed-leg button[aria-pressed="true"]{box-shadow:0 0 0 2px var(--acc)}
.ed-leg button[aria-pressed="true"] span{background:#111}
.ed-leg button:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.ed-card{min-height:0}
@media (max-width:620px){.ed-leg{grid-template-columns:1fr 1fr}.ed-leg button{padding:9px 10px;font-size:13.5px}.ed-pin{width:20px;height:20px;margin:-10px 0 0 -10px;line-height:20px;font-size:10px;box-shadow:0 0 0 2px #fff}}

/* editor scroll tour */
.ed-scr{position:relative;height:calc(var(--n) * 48vh + 100vh)}
.ed-stick{position:sticky;top:12px;height:calc(100vh - 24px);box-sizing:border-box;display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:16px;background:#EDF0EB;border-radius:20px;padding:16px}
:root[data-theme="dark"] .ed-stick{background:#1B201D}
.ed-view{position:relative;border-radius:14px;overflow:hidden;background:#E2E7E0;min-height:0}
:root[data-theme="dark"] .ed-view{background:#121614}
.ed-vimg{all:unset;cursor:zoom-in;position:absolute;inset:0;opacity:0;transform:translateY(40px) scale(.97);transition:opacity .45s ease,transform .6s cubic-bezier(.2,.7,.2,1);pointer-events:none}
.ed-vimg.past{transform:translateY(-40px) scale(.97)}
.ed-vimg.on{opacity:1;transform:none;pointer-events:auto}
.ed-vimg img{width:100%;height:100%;object-fit:contain;padding:18px;box-sizing:border-box;display:block;filter:drop-shadow(0 10px 28px rgba(0,0,0,.14))}
.ed-vimg:focus-visible{outline:2px solid var(--acc);outline-offset:-4px}
.ed-count{position:absolute;right:12px;top:10px;font-family:'Geist Mono',ui-monospace,monospace;font-size:11px;color:var(--mute);background:var(--paper);padding:3px 8px;border-radius:99px;box-shadow:0 0 0 1px var(--line)}
.ed-side{background:var(--paper);border-radius:14px;box-shadow:0 0 0 1px var(--line);padding:16px;display:flex;flex-direction:column;gap:14px;min-height:0;overflow:hidden}
.ed-mini{position:relative;border-radius:8px;overflow:hidden;box-shadow:0 0 0 1px var(--line);flex:none}
.ed-mini img{display:block;width:100%;height:auto}
.ed-mini .ed-pin{width:20px;height:20px;margin:-10px 0 0 -10px;font-size:10px;line-height:20px;box-shadow:0 0 0 2px #fff,0 3px 8px rgba(0,0,0,.25)}
.ed-mini .ed-pin::before{inset:-5px}
.ed-mini .ed-pin[aria-pressed="false"]{opacity:.55}
.ed-mini .ed-pin[aria-pressed="false"]::before{animation:none}
.ed-stxt{display:flex;flex-direction:column;gap:6px}
.ed-stxt h3{margin:0;font-size:24px;font-weight:500;letter-spacing:-.01em}
.ed-sn{margin:0 !important;font-size:15.5px !important;line-height:1.45 !important}
.ed-stxt .ed-d{font-size:14px !important;border-top:1px solid var(--line);padding-top:10px;margin-top:4px !important}
.ed-prog{display:flex;gap:3px;margin-top:auto}
.ed-prog button{all:unset;cursor:pointer;flex:1;height:5px;border-radius:3px;background:var(--line);transition:background .3s}
.ed-prog button.zs{margin-left:7px}
.ed-prog button.done{background:rgba(35,115,74,.45)}
.ed-prog button.on{background:var(--acc)}
.ed-prog button:focus-visible{outline:2px solid var(--acc);outline-offset:3px}
.ed-side .ed-hint{margin:0 !important}
@media (max-width:900px){
 .ed-stick{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto;height:calc(100svh - 24px);padding:10px;gap:10px}
 .ed-side{padding:12px;gap:8px}
 .ed-mini,.ed-stxt .ed-d,.ed-side .ed-hint{display:none}
 .ed-stxt h3{font-size:19px}.ed-sn{font-size:14px !important}
 .ed-vimg img{padding:10px}
}
@media (prefers-reduced-motion:reduce){.ed-vimg,.ed-vimg.past{transform:none;transition:opacity .2s}}

@media (max-width:900px){.ed-stick{height:auto;top:56px;grid-template-rows:auto auto}.ed-view{height:min(58svh,520px)}}
/* tour variants */
[data-edvar][hidden]{display:none !important}
.ed-vsw{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:-28px;position:relative;z-index:2}
.ed-vsw>span{font-family:'Geist Mono',ui-monospace,monospace;font-size:11.5px;color:var(--mute)}
.ed-vsw div{display:inline-flex;flex-wrap:wrap;padding:3px;border-radius:99px;background:var(--paper);box-shadow:0 0 0 1px var(--line)}
.ed-vsw button{all:unset;cursor:pointer;font-size:13.5px;padding:7px 13px;border-radius:99px;color:var(--mute)}
.ed-vsw button[aria-checked="true"]{background:var(--ink);color:var(--paper)}
.ed-vsw button:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
/* A: click-through */
.edA{position:relative;height:calc(var(--n) * 70vh + 100vh)}
.edA-stick{position:sticky;top:12px;height:calc(100vh - 24px);box-sizing:border-box;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:12px;background:#EDF0EB;border-radius:20px;padding:16px}
:root[data-theme="dark"] .edA-stick{background:#1B201D}
.edA-top{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.edA-n{font-family:'Geist Mono',ui-monospace,monospace;font-size:11.5px;color:var(--mute);background:var(--paper);padding:4px 9px;border-radius:99px;box-shadow:0 0 0 1px var(--line)}
.edA-act{margin:0 !important;display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:17px !important;line-height:1.3 !important}
.edA-from{font-family:'Geist Mono',ui-monospace,monospace;font-size:11.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--mute)}
.edA-step{display:inline-flex;align-items:center;gap:8px;padding:7px 12px;border-radius:10px;background:var(--paper);box-shadow:0 0 0 1px var(--line);transition:box-shadow .3s,background .3s,opacity .3s}
.edA-step b{font-weight:600}
.edA-step .ci svg{width:16px;height:16px;display:block}
.edA-arr{color:var(--mute);transition:color .3s}
.edA[data-ph="0"] .edA-step.s1{box-shadow:0 0 0 2px var(--acc)}
.edA[data-ph="0"] .edA-step.s2{opacity:.45}
.edA[data-ph="1"] .edA-step.s2{box-shadow:0 0 0 2px var(--acc);background:rgba(35,115,74,.1)}
.edA[data-ph="1"] .edA-arr{color:var(--acc)}
.edA-stage{position:relative;container-type:size;border-radius:14px;overflow:hidden;background:#E2E7E0;display:grid;place-items:center}
:root[data-theme="dark"] .edA-stage{background:#121614}
.edA-frame{grid-area:1/1;position:relative;width:min(100cqw,calc(100cqh * var(--ar)));height:min(100cqh,calc(100cqw / var(--ar)));opacity:0;transition:opacity .4s ease,transform .7s cubic-bezier(.2,.7,.2,1),filter .4s;transform-origin:var(--ox,50%) var(--oy,50%)}
.edA-frame.on{opacity:1}
.edA-frame img{display:block;width:100%;height:100%}
.edA[data-ph="0"] .edA-frame.on{transform:scale(var(--zs,1.3))}
.edA[data-ph="1"] .edA-frame.on{filter:brightness(.55) blur(1.5px)}
.edA-ring{position:absolute;border-radius:8px;box-shadow:0 0 0 3px var(--acc),0 0 0 9999px rgba(10,20,14,.38);opacity:0;transition:opacity .3s,left .4s,top .4s,width .4s,height .4s;pointer-events:none}
.edA[data-ph="0"] .edA-ring{opacity:1;animation:edRing 1.6s ease-in-out infinite}
@keyframes edRing{50%{box-shadow:0 0 0 6px rgba(35,115,74,.55),0 0 0 9999px rgba(10,20,14,.38)}}
.edA-cur{position:absolute;width:26px;height:26px;margin:-4px 0 0 -4px;opacity:0;transition:opacity .3s,left .45s,top .45s;pointer-events:none;filter:drop-shadow(0 2px 4px rgba(0,0,0,.35))}
.edA-cur svg{width:100%;height:100%;display:block}
.edA[data-ph="0"] .edA-cur{opacity:1;animation:edClick 1.6s ease-in-out infinite}
@keyframes edClick{0%,60%,100%{transform:scale(1)}70%{transform:scale(.82)}}
.edA-res{all:unset;cursor:zoom-in;position:absolute;inset:0;display:grid;place-items:center;padding:20px;box-sizing:border-box;opacity:0;transform:scale(.15);transition:opacity .35s ease,transform .55s cubic-bezier(.2,.8,.2,1);pointer-events:none}
.edA-res.on{opacity:1;transform:none;pointer-events:auto}
.edA-res img{max-width:100%;max-height:100%;border-radius:10px;box-shadow:0 20px 60px rgba(0,0,0,.35)}
.edA-res:focus-visible{outline:2px solid var(--acc);outline-offset:-4px}
.edA-foot{display:flex;align-items:center;gap:16px;justify-content:space-between}
.edA-d{margin:0 !important;font-size:15px !important;color:var(--mute);max-width:70ch}
.edA-prog{display:flex;gap:3px;flex:0 0 220px}
.edA-prog button{all:unset;cursor:pointer;flex:1;height:5px;border-radius:3px;background:var(--line)}
.edA-prog button.done{background:rgba(35,115,74,.45)}.edA-prog button.on{background:var(--acc)}
@media (max-width:820px){.edA-stick{top:56px;height:calc(100svh - 72px);padding:10px}.edA-act{font-size:14.5px !important;gap:6px}.edA-from{display:none}.edA-foot{flex-direction:column;align-items:stretch;gap:8px}.edA-prog{flex:none}.edA-res{padding:8px}}
/* B: click -> opens */
.edB{display:flex;flex-direction:column;gap:14px}
.edB-z{margin:18px 0 0 !important;font-family:'Geist Mono',ui-monospace,monospace;font-size:12px !important;text-transform:uppercase;letter-spacing:.06em;color:var(--acc)}
.edB-z:first-child{margin-top:0 !important}
.edB-row{display:grid;grid-template-columns:minmax(0,.85fr) 70px minmax(0,1.15fr);gap:12px;align-items:center;background:#EDF0EB;border-radius:18px;padding:16px}
:root[data-theme="dark"] .edB-row{background:#1B201D}
.edB-from,.edB-to{display:flex;flex-direction:column;gap:10px;min-width:0}
.edB-crop{position:relative;aspect-ratio:10/6;border-radius:12px;overflow:hidden;box-shadow:0 0 0 1px var(--line);background:#fff}
.edB-crop img{position:absolute;max-width:none;height:auto;display:block}
.edB-ring{position:absolute;border-radius:7px;box-shadow:0 0 0 3px var(--acc),0 0 0 9999px rgba(10,20,14,.3)}
.edB-cur{position:absolute;width:24px;height:24px;filter:drop-shadow(0 2px 4px rgba(0,0,0,.35))}
.edB-cur svg{width:100%;height:100%;display:block}
.edB-from p,.edB-to p{margin:0 !important;font-size:14.5px !important;line-height:1.45 !important}
.edB-from p span{display:block;font-family:'Geist Mono',ui-monospace,monospace;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--mute);margin-bottom:2px}
.edB-to p{color:var(--mute)}.edB-to p b{color:var(--ink);font-weight:500;margin-right:4px}
.edB-arr{display:flex;flex-direction:column;align-items:center;gap:6px;font-family:'Geist Mono',ui-monospace,monospace;font-size:11px;color:var(--acc)}
.edB-arr i{display:block;width:100%;height:2px;background:var(--acc);position:relative}
.edB-arr i::after{content:"";position:absolute;right:-1px;top:-5px;border:6px solid transparent;border-left:9px solid var(--acc);border-right:0}
.edB-shot{all:unset;cursor:zoom-in;display:grid;place-items:center;height:340px;border-radius:12px;background:#E2E7E0;padding:12px;box-sizing:border-box;overflow:hidden}
:root[data-theme="dark"] .edB-shot{background:#121614}
.edB-shot img{width:100%;height:100%;object-fit:contain;display:block;filter:drop-shadow(0 8px 20px rgba(0,0,0,.16))}
.edB-shot:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
@media (max-width:820px){.edB-row{grid-template-columns:1fr;padding:12px}.edB-arr{flex-direction:row;justify-content:center}.edB-arr i{width:2px;height:22px;order:-1}.edB-arr i::after{right:-5px;top:auto;bottom:-6px;border:6px solid transparent;border-top:9px solid var(--acc);border-bottom:0}.edB-shot{height:280px}.ed-vsw{margin-bottom:0}}
@media (prefers-reduced-motion:reduce){.edA-frame,.edA-res{transition:opacity .2s}.edA[data-ph="0"] .edA-frame.on{transform:none}.edA-ring,.edA-cur{animation:none !important}}

/* D: walkthrough */
.edD{position:relative;height:calc(var(--n) * 75vh + 100vh)}
.edD-stick{position:sticky;top:12px;height:calc(100vh - 24px);box-sizing:border-box;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:12px;background:#EDF0EB;border-radius:20px;padding:16px}
:root[data-theme="dark"] .edD-stick{background:#1B201D}
.edD-top{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.edD[data-ph="0"] .edA-step.s1{box-shadow:0 0 0 2px var(--acc)}
.edD[data-ph="0"] .edA-step.s2{opacity:.45}
.edD[data-ph="1"] .edA-step.s2{box-shadow:0 0 0 2px var(--acc);background:rgba(35,115,74,.1)}
.edD[data-ph="1"] .edA-arr{color:var(--acc)}
.edD-stage{container-type:size;display:grid;place-items:center;min-height:0}
.edD-frame{position:relative;width:min(100cqw,calc(100cqh * 1.7561));height:min(100cqh,calc(100cqw / 1.7561));border-radius:12px;overflow:hidden;box-shadow:0 0 0 1px var(--line),0 18px 50px rgba(0,0,0,.14);background:#fff}
.edD-img{all:unset;cursor:zoom-in;position:absolute;inset:0;opacity:0;transition:opacity .45s ease;pointer-events:none}
.edD-img.on{opacity:1;pointer-events:auto;z-index:1}
.edD-img img{display:block;width:100%;height:100%}
.edD-ring{position:absolute;z-index:3;border-radius:7px;box-shadow:0 0 0 3px var(--acc),0 0 0 9999px rgba(10,20,14,.22);opacity:0;transition:opacity .3s,left .5s,top .5s,width .5s,height .5s;pointer-events:none}
.edD[data-ph="0"] .edD-ring{opacity:1;animation:edRing 1.6s ease-in-out infinite}
.edD-cur{position:absolute;z-index:4;width:28px;height:28px;margin:-3px 0 0 -3px;transition:left .7s cubic-bezier(.4,.1,.2,1),top .7s cubic-bezier(.4,.1,.2,1);pointer-events:none;filter:drop-shadow(0 2px 5px rgba(0,0,0,.4))}
.edD-cur svg{width:100%;height:100%;display:block}
.edD[data-ph="0"] .edD-cur{animation:edClick 1.6s ease-in-out infinite}
.edD-cur::after{content:"";position:absolute;left:-8px;top:-8px;width:20px;height:20px;border-radius:50%;border:2px solid var(--acc);opacity:0}
.edD[data-ph="1"] .edD-cur::after{animation:edTap .5s ease-out}
@keyframes edTap{0%{opacity:.9;transform:scale(.4)}100%{opacity:0;transform:scale(1.8)}}
.edD-foot{display:flex;align-items:center;gap:16px;justify-content:space-between}
@media (max-width:820px){.edD-stick{top:56px;height:calc(100svh - 72px);padding:10px}.edD-foot{flex-direction:column;align-items:stretch;gap:8px}.edD-cur{width:18px;height:18px}}
@media (prefers-reduced-motion:reduce){.edD-ring,.edD-cur{animation:none !important}.edD-cur{transition:none}}

.edD-mid{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;min-height:0}
.edD-img{pointer-events:none !important;cursor:default}
.edD-hit{all:unset;position:absolute;inset:0;z-index:2;cursor:pointer}
.edD-ring{all:unset;box-sizing:border-box;cursor:pointer;position:absolute;z-index:3;border-radius:7px;box-shadow:0 0 0 3px var(--acc),0 0 0 9999px rgba(10,20,14,.22);opacity:0;transition:opacity .3s,left .5s,top .5s,width .5s,height .5s;pointer-events:none}
.edD[data-ph="0"] .edD-ring{pointer-events:auto}
.edD-ring:hover{background:rgba(35,115,74,.12)}
.edD-ring:focus-visible{outline:2px solid #fff;outline-offset:3px}
.edD-zoom{all:unset;cursor:zoom-in;position:absolute;z-index:5;right:10px;top:10px;width:32px;height:32px;border-radius:9px;background:rgba(17,17,17,.75);display:grid;place-items:center;opacity:.8;transition:opacity .2s}
.edD-zoom:hover,.edD-zoom:focus-visible{opacity:1}
.edD-zoom svg{width:16px;height:16px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.edD-dots{display:flex;flex-direction:column;justify-content:center;gap:12px;padding:0 4px}
.edD-dots button{all:unset;cursor:pointer;position:relative;width:12px;height:12px;border-radius:50%;background:var(--line);box-shadow:0 0 0 2px transparent;transition:background .2s,box-shadow .2s,transform .2s}
.edD-dots button:hover{transform:scale(1.2)}
.edD-dots button.done{background:rgba(35,115,74,.45)}
.edD-dots button.on{background:var(--acc);box-shadow:0 0 0 3px rgba(35,115,74,.25)}
.edD-dots button:focus-visible{outline:2px solid var(--acc);outline-offset:3px}
.edD-dots span{position:absolute;right:22px;top:50%;transform:translateY(-50%);white-space:nowrap;font-size:12.5px;padding:4px 9px;border-radius:7px;background:var(--ink);color:var(--paper);opacity:0;pointer-events:none;transition:opacity .2s}
.edD-dots button:hover span,.edD-dots button:focus-visible span{opacity:1}
.edD-tip{margin:0 !important;font-family:'Geist Mono',ui-monospace,monospace;font-size:11.5px !important;color:var(--mute);white-space:nowrap}
@media (max-width:820px){.edD-dots{gap:8px;padding:0}.edD-dots button{width:9px;height:9px}.edD-dots span{display:none}.edD-tip{white-space:normal}}

.xmwrap{position:relative}
.xmwrap img{display:block;width:100%;max-height:440px;object-fit:cover;object-position:top}
.xplay{position:absolute;left:50%;top:50%;width:54px;height:54px;margin:-27px 0 0 -27px;border-radius:50%;background:rgba(15,20,25,.72);display:grid;place-items:center;box-shadow:0 0 0 3px rgba(255,255,255,.85);transition:transform .2s}
.xplay svg{width:24px;height:24px;margin-left:3px}
.xpost:hover .xplay{transform:scale(1.08)}
.xlink{display:flex;flex-direction:column;gap:4px;padding:14px 16px;border:1px solid #E7E9EA;border-radius:14px;background:#F7F9F9}
.xlink span{font-size:13px;color:#536471}.xlink b{font-size:15px;font-weight:600;color:#0F1419}.xlink em{font-style:normal;font-size:14px;color:#536471;line-height:1.4}
.xquote{padding:12px 14px;border:1px solid #E7E9EA;border-radius:14px;font-size:14.5px;line-height:1.45;color:#0F1419}
.xquote p{margin:0 0 6px}.xquote p:last-child{margin:0}.xquote span{color:#536471;font-size:13.5px}
.xfoot{display:flex;justify-content:space-between;align-items:center;gap:10px}
.xfoot time{font-size:13px;color:#536471}
.xmedia:has(.xlink),.xmedia:has(.xquote){border:0;border-radius:0;overflow:visible}
.ed-note{margin:12px 0 0 !important;font-family:'Geist Mono',ui-monospace,monospace;font-size:12px !important;color:#B4541A}

#ci-root.vt .vt-up-big{margin:0 !important;font-family:var(--serif);font-size:clamp(40px,5vw,68px) !important;line-height:1.02 !important;letter-spacing:-.02em;color:var(--mute)}
#ci-root.vt .vt-up-big b{font-weight:400;color:var(--acc)}

.ed-sy{position:relative;height:calc(var(--n) * 42vh + 92vh)}
.ed-sys{position:sticky;top:16px}
.ed-tshot{max-height:none}
@media (max-width:820px){.ed-sy{height:auto}.ed-sys{position:static}}

.xtrack{align-items:flex-start}
.xcol{flex:0 0 min(440px,84%);scroll-snap-align:start;display:flex;flex-direction:column;gap:16px}
.xcol .xpost{flex:none}
.xcol .xfoot{margin-top:0}
.ab-motto .me.strength{margin-top:104px}
@media (max-width:820px){.ab-motto .me.strength{margin-top:44px}}

.xf{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:16px;background:var(--tile);border-radius:24px;padding:16px;align-items:stretch}
.xfeat{display:grid;min-height:0}
.xfp{display:flex;min-height:0}.xfp[hidden]{display:none}
.xfp .xpost{flex:1;width:100%;animation:ciFade .3s ease}
.xfp .xmedia{flex:1;min-height:0;display:flex}
.xfp .xmwrap{flex:1;display:flex}
.xfp .xmwrap img{max-height:none;height:100%;min-height:220px;max-height:420px}
.xlist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.xlist button{all:unset;box-sizing:border-box;cursor:pointer;width:100%;display:flex;gap:12px;align-items:center;padding:8px;border-radius:14px;transition:background .15s}
.xlist button:hover{background:rgba(255,255,255,.6)}
.xlist button[aria-pressed="true"]{background:#fff;box-shadow:0 0 0 1px #E7E9EA}
.xlist button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.xth{flex:none;width:64px;height:48px;border-radius:9px;overflow:hidden;background:#fff;box-shadow:0 0 0 1px #E7E9EA;display:grid;place-items:center}
.xth img{width:100%;height:100%;object-fit:cover}
.xthx .xlogo{width:16px;height:16px}
.xtx{min-width:0;display:flex;flex-direction:column;gap:2px}
.xtt{font-size:14px;line-height:1.35;color:var(--ink);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.xtx time{font-size:12px;color:var(--mute)}
.onx .xnav{display:none}
@media (max-width:820px){.xf{grid-template-columns:1fr}.xfp .xmwrap img{max-height:320px}}
.fl-snd{all:unset;cursor:pointer;position:absolute;right:14px;bottom:14px;z-index:2;width:40px;height:40px;border-radius:50%;background:rgba(30,20,15,.7);display:grid;place-items:center;transition:transform .15s,background .15s}
.fl-snd:hover{transform:scale(1.06);background:rgba(30,20,15,.85)}
.fl-snd:focus-visible{outline:2px solid #fff;outline-offset:2px}
.fl-snd svg{width:20px;height:20px;fill:none;stroke:#fff;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.fl-snd svg path:first-child{fill:#fff}
.fl-snd .on{display:none}.fl-snd.is-on .on{display:inline}.fl-snd.is-on .off{display:none}
.xhd{display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:24px}
.xhd h2{margin:0}
.xhd a{font-size:16px;color:var(--accent);text-decoration:none;white-space:nowrap}
.xhd a:hover{text-decoration:underline}
h1.lead{font-weight:400}
h2.lab{font-weight:400;margin:0;line-height:inherit}

/* page loader */
.rw-ld{position:fixed;inset:0;z-index:2147483600;display:grid;place-items:center;background:var(--paper);opacity:0;animation:rwLdIn .3s ease .35s forwards, rwLdOut .5s ease 9s forwards;pointer-events:none}
.rw-ld.done{animation:none;opacity:0;transition:opacity .45s ease;visibility:hidden;transition:opacity .45s ease,visibility 0s .45s}
.rw-ld-in{display:flex;flex-direction:column;align-items:center;gap:22px}
.rw-ld-tile{position:relative;width:76px;height:76px;border-radius:19px;background:#17171A;display:grid;place-items:center;box-shadow:0 1px 2px rgba(0,0,0,.08),0 12px 32px -12px rgba(0,0,0,.35),inset 0 0 0 1px rgba(255,255,255,.07);animation:rwLdTile 1.6s cubic-bezier(.45,0,.2,1) infinite}
.rw-ld-tile b{font-family:var(--serif);font-weight:400;font-size:66px;line-height:1;color:#FAFAF8;transform:translate(1px,-6px)}
.rw-ld-tile i{position:absolute;right:13px;bottom:15px;width:9px;height:9px;border-radius:50%;background:#2F5BD3;animation:rwLdDot 1.6s cubic-bezier(.3,0,.2,1) infinite}
.rw-ld-bar{position:relative;width:96px;height:2px;border-radius:2px;background:var(--line);overflow:hidden}
.rw-ld-bar i{position:absolute;top:0;bottom:0;width:40%;border-radius:2px;background:var(--ink);animation:rwLdBar 1.1s ease-in-out infinite}
@keyframes rwLdIn{to{opacity:1;pointer-events:auto}}
@keyframes rwLdOut{to{opacity:0;visibility:hidden}}
@keyframes rwLdTile{0%,100%{transform:scale(1)}50%{transform:scale(.96)}}
@keyframes rwLdDot{0%{transform:translateY(0) scale(1)}30%{transform:translateY(-26px) scale(.9)}55%{transform:translateY(0) scale(1.25,.75)}70%{transform:scale(1)}100%{transform:scale(1)}}
@keyframes rwLdBar{0%{left:-40%}100%{left:100%}}
@media (prefers-reduced-motion:reduce){.rw-ld-tile,.rw-ld-tile i{animation:none}.rw-ld-bar i{animation:none;left:30%}}

/* X: horizontal strip driven by vertical scroll */
.xh{position:relative}
.xh-stick{position:sticky;top:64px}
.xh-view{overflow:hidden;width:100vw;margin-left:calc(50% - 50vw);padding:8px 0;box-sizing:border-box}
.xh-track{display:flex;gap:16px;align-items:flex-start;will-change:transform}
.xh-track .xpost{flex:0 0 clamp(268px,78vw,380px);width:auto;animation:none}
.xh-track .xmedia img,.xh-track .xmedia video{max-height:240px;object-fit:cover}
.xh-prog{height:2px;background:var(--line);border-radius:2px;margin-top:20px;overflow:hidden}
.xh-prog i{display:block;height:100%;background:var(--ink);transform:scaleX(0);transform-origin:left}
.xh.free{height:auto!important}.xh.free .xh-stick{position:static}.xh.free .xh-view{overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-left:var(--xp,16px)}.xh.free .xh-prog{display:none}
.onx .xhd{display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:24px}
.onx .xhd h2{margin:0}
@media (max-width:620px){.onx .xhd h2{font-size:40px}.xh-track{gap:12px}}
/* smaller project labels on phones */
@media (max-width:620px){.tlabel{font-size:12.5px;padding:5px 11px;left:12px;bottom:12px}}
/* then/now: drag anywhere on the image */
.tn-cmp{cursor:ew-resize;-webkit-user-select:none}.tn-cmp img{-webkit-user-drag:none;user-drag:none;pointer-events:none}.tn-cmp .tn-range{pointer-events:none}.tn-cmp.drag .tn-handle i{transform:scale(1.08)}

/* motto ring: let the ellipse be wider than the words */
.ab-motto .ring>svg{max-width:none}
@media (max-width:620px){
 .ab-strip{display:grid!important;grid-template-columns:1fr 1fr;gap:18px 12px;overflow:visible;padding:8px 4px 8px!important;margin:0!important;scroll-snap-type:none}
 .ab-strip .snap{flex:none;margin:0;width:auto}
 .ab-strip .snap:nth-child(even){transform:rotate(var(--r)) translateY(18px)}
 .ab-strip .snap figcaption{font-size:17px;padding:6px 2px 8px}
 .ab-strip .snap .zoom{padding:7px 7px 0}
 .vt-goal{flex-direction:column;gap:6px;padding:16px 18px}
 .vt-goal p{font-size:21px!important}
 .ci-saw2 .row{flex-direction:column;gap:4px}
}
