/* /css2 */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(bad5f68b18b9.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(11e1d80f42f9.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(e9191f0db3ed.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(1be3d765b0bd.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(20d13496d089.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter Tight';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(e7cf9b4d4d12.ttf) format('truetype');
}
@font-face {
  font-family: 'Inter Tight';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(e8fc387cf9f6.ttf) format('truetype');
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(153fca58df8b.ttf) format('truetype');
}


    .sc-placeholder{background:color-mix(in srgb,currentColor 8%,transparent);
      border:1px solid color-mix(in srgb,currentColor 50%,transparent);
      border-radius:2px;box-sizing:border-box;overflow:hidden}
    @keyframes sc-shine{0%{background-position:100% 50%}100%{background-position:0% 50%}}
    html.sc-dc-streaming .sc-placeholder,
    html.sc-dc-streaming .sc-interp.sc-missing{position:relative;
      background:color-mix(in srgb,currentColor 5%,transparent);
      border-color:transparent}
    html.sc-dc-streaming .sc-placeholder::before,
    html.sc-dc-streaming .sc-interp.sc-missing::before{content:'';
      position:absolute;inset:0;pointer-events:none;
      background:linear-gradient(90deg,rgba(217,119,87,0) 25%,rgba(247,225,211,.95) 37%,rgba(217,119,87,0) 63%);
      background-size:400% 100%;animation:sc-shine 1.4s ease infinite}
    html.sc-dc-streaming .sc-placeholder:nth-child(n+9 of .sc-placeholder)::before,
    html.sc-dc-streaming .sc-interp.sc-missing:nth-child(n+9 of .sc-interp.sc-missing)::before{animation:none;
      background:color-mix(in srgb,currentColor 8%,transparent)}
    .sc-placeholder-error{padding:4px 8px;font:11px/1.4 ui-monospace,monospace;
      color:color-mix(in srgb,currentColor 70%,transparent);word-break:break-word}
    .sc-interp.sc-missing{display:inline-block;width:2em;height:1em;overflow:hidden;
      vertical-align:text-bottom;background:rgba(255,255,255,.3);border:1px solid rgba(0,0,0,.5);
      border-radius:2px;box-sizing:border-box;color:transparent;
      user-select:none}
    .sc-interp.sc-unresolved{font-family:ui-monospace,monospace;font-size:.85em;
      color:color-mix(in srgb,currentColor 50%,transparent);
      background:color-mix(in srgb,currentColor 10%,transparent);border-radius:3px;
      padding:0 3px}
    .sc-host.sc-has-error{position:relative}
    .sc-logic-error{position:absolute;top:8px;left:8px;z-index:2147483647;max-width:60ch;
      padding:6px 10px;background:#b00020;color:#fff;font:12px/1.4 ui-monospace,monospace;
      border-radius:4px;white-space:pre-wrap;pointer-events:none}
    /* Mirrors PRINT_BASELINE_CSS in apps/web deck-stage-export.ts — keep both
       in sync until dc-runtime regains a build step. */
    @media print {
      @page { margin: 0.5cm; }
      figure, table { break-inside: avoid; }
      #dc-root, #dc-root > .sc-host { height: auto; }
      *, *::before, *::after {
        print-color-adjust: exact; -webkit-print-color-adjust: exact;
        backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
        animation-delay: -99s !important; animation-duration: .001s !important;
        animation-iteration-count: 1 !important; animation-fill-mode: both !important;
        animation-play-state: running !important; transition-duration: 0s !important;
      }
    }
  
x-dc{display:none!important}

body{margin:0;background:#0B0F16}
.cs{--red:#EC0000;--ink:#0E1520;--ink2:#0B0F16;--ivory:#F4F1EA;--paper:#FBFAF5;--muted:#5A6473;--gut:clamp(20px,5vw,72px);width:100%;overflow:hidden;font-family:"Inter",system-ui,sans-serif;color:var(--ink);background:var(--ivory);-webkit-font-smoothing:antialiased}
.cs *{box-sizing:border-box}
.cs img{display:block;max-width:none}
.wrap{max-width:1320px;margin:0 auto;padding:0 var(--gut)}
.mono{font-family:"JetBrains Mono",ui-monospace,monospace;font-size:13px;letter-spacing:.08em;text-transform:uppercase}
.disp{font-family:"Inter Tight","Inter",sans-serif;font-weight:800;letter-spacing:-.045em;line-height:.9}
.dot{color:var(--red)}
.lock{display:inline-flex;flex-direction:column;font-family:"Inter",sans-serif;font-weight:800;letter-spacing:-.045em;line-height:.9;white-space:nowrap}
.lock>span{white-space:nowrap}
.sec{padding:clamp(80px,11vw,160px) 0;position:relative}
.dark{background:var(--ink2);color:var(--paper)}
.redbg{background:var(--red);color:#fff}
.kick{display:flex;align-items:center;gap:14px;margin-bottom:28px}
.kick .n{color:var(--red)}
.dark .kick,.redbg .kick{color:rgba(251,250,245,.72)}
.redbg .kick .n{color:#fff}
.h2{font-family:"Inter Tight","Inter",sans-serif;font-weight:800;letter-spacing:-.04em;line-height:.95;font-size:clamp(40px,6.4vw,96px);margin:0;text-wrap:balance}
.lead{font-size:clamp(18px,1.6vw,22px);line-height:1.5;color:var(--muted);max-width:620px;margin:28px 0 0;text-wrap:pretty}
.dark .lead{color:rgba(251,250,245,.7)}
.redbg .lead{color:rgba(255,255,255,.88)}
/* reveal */
.js .rv{opacity:0;transform:translateY(40px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1);transition-delay:var(--dl,0s)}
.js .rv.in{opacity:1;transform:none}
/* nav */
.nav{position:absolute;z-index:20;left:0;right:0;top:0;padding:26px var(--gut);display:flex;justify-content:space-between;align-items:center;color:#fff}
.nav .brand{display:flex;gap:14px;align-items:baseline;font-weight:800;font-size:20px;letter-spacing:-.02em}
.nav .crumbs{opacity:.6;font-weight:500;font-size:14px}
.nav a{color:#fff;text-decoration:none}
.pill{display:inline-flex;align-items:center;gap:10px;padding:12px 20px;border-radius:999px;border:1.5px solid rgba(255,255,255,.4);font-weight:600;font-size:15px;transition:background .3s,border-color .3s,color .3s}
.pill:hover{background:#fff;color:var(--ink);border-color:#fff}
/* hero */
.hero{position:relative;min-height:max(calc(var(--sx-vh, 1vh) * 100),760px);color:#fff;overflow:hidden;background:#1a2230}
.ly{position:absolute;inset:-5%;width:110%;height:110%;object-fit:cover;object-position:62% 50%;transform:translate3d(calc(var(--px,0)*var(--d)*-34px),calc(var(--py,0)*var(--d)*-22px + var(--sy,0)*var(--d)*.35px),0);will-change:transform;transition:transform .25s ease-out}
.hero .shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(11,15,22,.92) 0%,rgba(11,15,22,.7) 38%,rgba(11,15,22,.05) 72%),linear-gradient(0deg,rgba(11,15,22,.85) 0%,rgba(11,15,22,0) 38%)}
.hero .inner{position:relative;z-index:5;min-height:max(calc(var(--sx-vh, 1vh) * 100),760px);display:flex;flex-direction:column;justify-content:flex-end;padding:96px var(--gut) 56px;max-width:1320px;margin:0 auto}
.hero h1{margin:18px 0 0;font-size:min(12.2vw,196px);max-width:100%}
.hero h1 .lock{line-height:.86}
.hero .sub{font-size:clamp(18px,1.8vw,24px);line-height:1.45;max-width:640px;margin:30px 0 0;color:rgba(255,255,255,.86)}
.meta{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;margin-top:56px;padding-top:26px;border-top:1px solid rgba(255,255,255,.2)}
.meta dt{opacity:.55;margin-bottom:8px}
.meta dd{margin:0;font-weight:600;font-size:16px;line-height:1.4}
.tag{display:inline-flex;align-items:center;gap:10px;padding:8px 16px;border-radius:999px;background:var(--red);color:#fff}
.hero .tag .blink{width:8px;height:8px;border-radius:50%;background:#fff;animation:blink 1.6s infinite}
@keyframes blink{50%{opacity:.2}}
.hero .intro{animation:heroIn 1.4s cubic-bezier(.2,.7,.2,1) both}
@keyframes heroIn{from{opacity:0;transform:translateY(60px)}}
/* stats */
@property --n{syntax:'<integer>';initial-value:0;inherits:false}
.stats{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-top:1.5px solid var(--ink)}
.stat{padding:34px 24px 10px 0;border-right:1px solid rgba(14,21,32,.15);margin-right:24px}
.stat:last-child{border-right:0}
.stat b{display:block;font-family:"Inter Tight",sans-serif;font-weight:800;letter-spacing:-.05em;font-size:clamp(56px,7vw,104px);line-height:1;counter-reset:n var(--n);transition:--n 2.2s cubic-bezier(.2,.7,.2,1)}
.stat b::after{content:counter(n)}
.stat b{--n:var(--to)}
.js .stat:not(.in) b{--n:0}
.stat b i{font-style:normal;color:var(--red)}
.stat p{margin:14px 0 0;font-size:15px;line-height:1.4;color:var(--muted)}
/* two col */
.two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,6vw,96px);align-items:start}
.qa h3{margin:0 0 14px;font-size:22px;letter-spacing:-.01em}
.qa p{margin:0 0 30px;font-size:18px;line-height:1.6;color:var(--muted)}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px}
.chip{padding:10px 16px;border-radius:999px;border:1.5px solid rgba(14,21,32,.2);font-weight:600;font-size:15px}
/* brand */
.brandgrid{display:grid;grid-template-columns:1.25fr 1fr;gap:24px;margin-top:64px}
.card{border-radius:28px;padding:clamp(24px,3vw,44px);position:relative;overflow:hidden}
.dark .card{background:#131a25;border:1px solid rgba(255,255,255,.07)}
.bigmark{min-height:440px;display:flex;flex-direction:column;justify-content:space-between;background:radial-gradient(120% 90% at 100% 100%,rgba(236,0,0,.35),rgba(236,0,0,0) 60%),#131a25 !important}
.bigmark .lock{font-size:clamp(40px,7vw,116px)}
.bigmark .dot{display:inline-block;animation:pulse 2.4s ease-in-out infinite}
@keyframes pulse{50%{transform:scale(1.35);text-shadow:0 0 30px rgba(236,0,0,.9)}}
.sw{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.swc{border-radius:20px;padding:18px;min-height:150px;display:flex;flex-direction:column;justify-content:space-between;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.swc:hover{transform:translateY(-6px) rotate(-1.5deg)}
.swc b{font-size:18px}
.type{grid-column:1/-1;display:grid;grid-template-columns:auto 1fr;gap:clamp(24px,4vw,64px);align-items:center}
.type .aa{font-family:"Inter",sans-serif;font-weight:800;font-size:clamp(80px,14vw,220px);letter-spacing:-.06em;line-height:.8}
.type .alph{font-size:clamp(18px,2vw,28px);line-height:1.5;opacity:.8;font-weight:500}
.route{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.route .st{padding:14px 22px;border-radius:999px;border:1.5px solid rgba(255,255,255,.2);font-weight:700;letter-spacing:.12em;text-transform:uppercase;font-size:14px;animation:routeOn 9s infinite;animation-delay:calc(var(--i)*1.5s)}
.route .ar{width:26px;height:1.5px;background:rgba(255,255,255,.3)}
@keyframes routeOn{0%,14%{background:var(--red);border-color:var(--red);color:#fff}18%,100%{background:transparent}}
/* site */
.browser{border-radius:18px;background:#fff;box-shadow:0 60px 120px -30px rgba(14,21,32,.45);overflow:hidden;border:1px solid rgba(14,21,32,.08)}
.browser .bar{height:44px;display:flex;align-items:center;gap:8px;padding:0 18px;background:#EEF0F3}
.browser .bar i{width:11px;height:11px;border-radius:50%;background:#D5D9DF}
.browser .bar i:nth-child(1){background:#FF5F57}.browser .bar i:nth-child(2){background:#FEBC2E}.browser .bar i:nth-child(3){background:#28C840}
.browser .url{margin-left:18px;flex:1;max-width:420px;height:26px;border-radius:8px;background:#fff;font-size:12px;display:flex;align-items:center;padding:0 12px;color:#5A6473}
.browser img{width:100%;height:auto}
.sitewrap{position:relative;margin-top:64px}
.modal{position:absolute;right:-2%;bottom:-12%;width:34%;border-radius:18px;overflow:hidden;box-shadow:0 40px 80px -20px rgba(14,21,32,.55);transform:rotate(3deg);transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.modal:hover{transform:rotate(0) scale(1.03)}
.modal img{width:100%;height:auto}
.feat{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:rgba(14,21,32,.14);border:1px solid rgba(14,21,32,.14);border-radius:28px;overflow:hidden;margin-top:clamp(90px,10vw,150px)}
.feat .fc{background:var(--ivory);padding:38px 34px 40px;min-height:290px;display:flex;flex-direction:column;position:relative;transition:background .45s}
.feat .fc::before{content:"";position:absolute;left:0;top:0;height:3px;width:0;background:var(--red);transition:width .55s cubic-bezier(.2,.7,.2,1)}
.feat .fc:hover{background:#fff}
.feat .fc:hover::before{width:100%}
.feat .fhead{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:26px}
.feat .fnum{font-family:"JetBrains Mono",ui-monospace,monospace;font-size:12px;letter-spacing:.1em;color:rgba(14,21,32,.35)}
.feat .ic{transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.feat .fc:hover .ic{transform:translateY(-3px)}
.feat b{display:block;font-size:21px;margin:0 0 12px;letter-spacing:-.015em;line-height:1.2;text-wrap:balance}
.feat p{margin:0 0 auto;color:var(--muted);line-height:1.6;font-size:15.5px;text-wrap:pretty}
.feat .fline{margin-top:26px;height:1px;background:linear-gradient(90deg,rgba(236,0,0,.5),rgba(14,21,32,0))}
.feat .ic{color:var(--red);display:block}
.feat .ic svg{display:block}
/* exploded parallax */
.explode{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(32px,5vw,80px);align-items:center;margin-top:clamp(90px,10vw,150px)}
.stage{position:relative;aspect-ratio:1.2;perspective:1800px}
.stack{position:absolute;inset:8% 4%;transform-style:preserve-3d;transform:rotateX(0) rotateZ(0);transition:transform 1.4s cubic-bezier(.2,.7,.2,1)}
.stack img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:14px;transition:transform 1.4s cubic-bezier(.2,.7,.2,1),box-shadow 1.4s;transform:translate3d(calc(var(--px,0)*var(--d)*-22px),calc(var(--py,0)*var(--d)*-14px),0)}
.stage.in .stack{transform:rotateX(58deg) rotateZ(-32deg)}
.stage.in .stack img{transform:translateZ(calc(var(--i)*38px));box-shadow:0 0 0 1px rgba(14,21,32,.08)}
.stage.in:hover .stack{transform:rotateX(0) rotateZ(0)}
.stage.in:hover .stack{transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.stage.in:hover .stack img{transition:transform .25s ease-out;transform:translate3d(calc(var(--px,0)*var(--d)*-26px),calc(var(--py,0)*var(--d)*-17px),0)}
.lnames{list-style:none;padding:0;margin:28px 0 0;display:grid;gap:8px}
.lnames li{display:flex;justify-content:space-between;border-bottom:1px solid rgba(14,21,32,.12);padding:10px 0;font-size:15px}
.lnames li span:last-child{color:var(--muted)}
/* slides marquee */
.mq{display:flex;gap:24px;width:max-content;animation:mq 60s linear infinite}
.mq.rev{animation-direction:reverse;animation-duration:70s}
.mqwrap{overflow:hidden;margin-top:28px;-webkit-mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.mqwrap:hover .mq{animation-play-state:paused}
@keyframes mq{to{transform:translateX(-50%)}}
.sl{width:480px;height:270px;border-radius:16px;position:relative;overflow:hidden;flex:none;background:#0E1520;color:#FBFAF5;box-shadow:0 30px 60px -20px rgba(0,0,0,.6)}
.sl .bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.sl .blur{filter:blur(4px) brightness(.8);transform:scale(1.08)}
.sl .sh{position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,16,26,.95),rgba(10,16,26,.55))}
.sl .c{position:absolute;inset:22px 24px;display:flex;flex-direction:column;justify-content:space-between}
.sl .lock{font-size:15px}
.sl .t{font-family:"Inter Tight",sans-serif;font-weight:800;letter-spacing:-.04em;line-height:.92}
.sl .chp{align-self:flex-start;padding:4px 10px;border-radius:999px;background:var(--red);color:#fff;font-size:9px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.sl .ph{position:absolute;border-radius:10px;overflow:hidden;background:#e9e9ea}
.sl .ph img{width:100%;height:100%;object-fit:cover}
.sl .rt{display:flex;gap:6px;font-size:7px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:rgba(251,250,245,.5)}
.sl .rt .on{color:#fff;background:var(--red);padding:2px 6px;border-radius:9px}
/* badges */
.badges{display:flex;justify-content:center;gap:clamp(20px,4vw,64px);margin-top:40px;flex-wrap:wrap}
.bdg{position:relative;padding-top:210px;transform-origin:50% 0;animation:swing 5s ease-in-out infinite;animation-delay:var(--dl,0s)}
@keyframes swing{0%,100%{transform:rotate(-3deg)}50%{transform:rotate(3deg)}}
.strap{position:absolute;top:0;left:50%;width:34px;height:214px;margin-left:-17px;background:repeating-linear-gradient(0deg,#0E1520 0 60px,#0E1520 60px);border-radius:3px;overflow:hidden}
.strap span{position:absolute;left:50%;top:0;writing-mode:vertical-rl;transform:translateX(-50%);white-space:nowrap;color:#fff;font-weight:800;font-size:11px;letter-spacing:.12em;line-height:34px}
.clip{position:absolute;top:196px;left:50%;width:44px;height:26px;margin-left:-22px;border-radius:6px;background:linear-gradient(180deg,#d9dde3,#8e96a3);box-shadow:inset 0 -2px 0 rgba(0,0,0,.2)}
.badge{width:260px;height:364px;border-radius:18px;background:#fff;overflow:hidden;position:relative;box-shadow:0 40px 70px -20px rgba(0,0,0,.45);color:var(--ink)}
.badge .top{height:158px;position:relative;overflow:hidden;background:#0E1520}
.badge .top img{position:absolute;left:-230px;top:-30px;width:540px;height:329px;object-fit:cover}
.badge .top .g{position:absolute;inset:0;background:linear-gradient(90deg,rgba(14,21,32,.9),rgba(14,21,32,.3))}
.badge .top .lock{position:absolute;left:18px;bottom:22px;color:#fff;font-size:30px}
.badge .hole{position:absolute;top:10px;left:50%;width:46px;height:8px;margin-left:-23px;border-radius:4px;background:#0B0F16;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.5)}
.badge .role{height:34px;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:800;letter-spacing:.3em;font-size:12px;text-transform:uppercase}
.badge .nm{padding:20px 18px 0;font-family:"Inter Tight",sans-serif;font-weight:800;font-size:25px;letter-spacing:-.02em;line-height:1.02}
.badge .rl{padding:10px 18px 0;font-size:11px;line-height:1.4;color:#4a5566}
.badge .ft{position:absolute;left:18px;right:18px;bottom:16px;display:flex;justify-content:space-between;align-items:flex-end;font-size:9px;font-weight:700}
.badge .ft img{height:22px;width:auto}
/* merch bento */
.bento{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:20px;margin-top:64px}
.tile{border-radius:28px;background:#fff;position:relative;overflow:hidden;min-height:420px;display:flex;align-items:center;justify-content:center;padding:36px}
.tile .cap{position:absolute;left:28px;bottom:24px;right:28px;display:flex;justify-content:space-between;align-items:flex-end;gap:12px}
.tile .cap b{font-size:20px;letter-spacing:-.01em}
.tile .cap span{color:var(--muted);font-size:14px;text-align:right}
.t1{grid-column:span 5;background:#E7E2D7}.t2{grid-column:span 7;background:#0E1520;color:#fff}.t2 .cap span{color:rgba(255,255,255,.6)}
.t3{grid-column:span 7;background:#fff}.t4{grid-column:span 5;background:var(--red);color:#fff}.t4 .cap span{color:rgba(255,255,255,.8)}
.t5{grid-column:span 4;background:#DCE3EA}.t6{grid-column:span 8;background:#E7E2D7}
/* notebook */
.nb{width:250px;height:340px;position:relative;transform:rotate(-6deg);transition:transform .8s cubic-bezier(.2,.7,.2,1);margin-bottom:40px;perspective:1200px}
.tile:hover .nb{transform:rotate(-2deg) translateY(-10px)}
.nb .pg{position:absolute;inset:6px -6px -6px 6px;border-radius:6px 16px 16px 6px;background:#fbfaf5;box-shadow:0 30px 50px -20px rgba(0,0,0,.4)}
.nb .cv{position:absolute;inset:0;border-radius:6px 16px 16px 6px;overflow:hidden;background:#0E1520;transform-origin:left center;transition:transform 1s cubic-bezier(.2,.7,.2,1)}
.tile:hover .nb .cv{transform:rotateY(-24deg)}
.nb .cv img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:78% 50%;opacity:.85}
.nb .cv .g{position:absolute;inset:0;background:linear-gradient(0deg,rgba(14,21,32,.9),rgba(14,21,32,.1) 60%)}
.nb .cv .lock{position:absolute;left:20px;bottom:24px;color:#fff;font-size:34px}
.nb .band{position:absolute;top:0;bottom:0;right:26px;width:10px;background:var(--red);box-shadow:-2px 0 4px rgba(0,0,0,.25)}
.nb .spine{position:absolute;left:0;top:0;bottom:0;width:10px;background:rgba(0,0,0,.35)}
/* calendar */
.cal{width:min(420px,90%);position:relative;margin-bottom:50px;transform:rotate(2deg);transition:transform .8s}
.tile:hover .cal{transform:rotate(0) translateY(-8px)}
.cal .rings{position:absolute;top:-10px;left:12%;right:12%;display:flex;justify-content:space-between;z-index:3}
.cal .rings i{width:8px;height:26px;border-radius:4px;background:linear-gradient(90deg,#9aa3ae,#e8ebef,#9aa3ae)}
.cal .face{background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 30px 60px -20px rgba(0,0,0,.5);color:var(--ink)}
.cal .ph{height:130px;position:relative;overflow:hidden}
.cal .ph img{width:100%;height:100%;object-fit:cover;object-position:60% 40%}
.cal .ph .lock{position:absolute;left:16px;bottom:14px;color:#fff;font-size:22px;text-shadow:0 2px 12px rgba(0,0,0,.4)}
.cal .mh{display:flex;justify-content:space-between;align-items:baseline;padding:14px 18px 6px}
.cal .mh b{font-family:"Inter Tight",sans-serif;font-size:26px;letter-spacing:-.03em}
.cal .gr{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;padding:6px 14px 18px;text-align:center;font-size:12px;font-weight:600}
.cal .gr .h{color:#8a93a0;font-size:10px;letter-spacing:.08em}
.cal .gr span{padding:6px 0;border-radius:8px}
.cal .gr .we{color:#b3b9c2}
.cal .gr .ev{background:var(--red);color:#fff;animation:evp 2.2s ease-in-out infinite}
@keyframes evp{50%{box-shadow:0 0 0 6px rgba(236,0,0,.18)}}
/* pen */
.pens{position:relative;width:100%;height:220px;margin-bottom:50px}
.pen{position:absolute;left:50%;top:50%;width:min(520px,92%);height:30px;transform:translate(-50%,-50%) rotate(-14deg);animation:flt 6s ease-in-out infinite}
.pen.b{transform:translate(-50%,-50%) rotate(-14deg) translate(30px,60px);animation-delay:-3s}
@keyframes flt{50%{margin-top:-12px}}
.pen .bd{position:absolute;inset:0 40px 0 0;border-radius:15px 6px 6px 15px;background:linear-gradient(180deg,#2a3444,#0E1520 55%,#05080d);box-shadow:0 20px 30px -10px rgba(0,0,0,.5)}
.pen.b .bd{background:linear-gradient(180deg,#ff4d4d,#EC0000 55%,#a80000)}
.pen .tip{position:absolute;right:0;top:3px;width:48px;height:24px;background:linear-gradient(180deg,#f2f4f7,#9aa3ae);clip-path:polygon(0 0,100% 45%,100% 55%,0 100%)}
.pen .clp{position:absolute;left:44px;top:-8px;width:150px;height:9px;border-radius:5px;background:linear-gradient(180deg,#e8ebef,#9aa3ae)}
.pen .txt{position:absolute;left:230px;top:0;height:30px;display:flex;align-items:center;color:#fff;font-weight:800;font-size:13px;letter-spacing:-.02em;white-space:nowrap}
.pen.b .txt .dot{color:#0E1520}
/* tote */
.tote{position:relative;width:230px;height:290px;margin-top:40px;margin-bottom:40px;transition:transform .8s}
.tile:hover .tote{transform:rotate(-3deg) translateY(-8px)}
.tote .hd{position:absolute;left:50%;top:-70px;width:120px;height:110px;margin-left:-60px;border:12px solid #f4f1ea;border-bottom:0;border-radius:60px 60px 0 0}
.tote .bg2{position:absolute;inset:0;background:#f4f1ea;border-radius:6px;box-shadow:0 30px 50px -20px rgba(0,0,0,.45)}
.tote .lock{position:absolute;left:24px;bottom:30px;font-size:36px;color:var(--ink)}
.tote .mk{position:absolute;right:22px;top:22px;width:34px;height:auto}
/* lanyard + stickers */
.stk{display:flex;gap:26px;flex-wrap:wrap;justify-content:center;align-items:center;margin-bottom:50px}
.s1{width:150px;height:150px;border-radius:50%;background:var(--red);color:#fff;display:flex;align-items:center;justify-content:center;animation:spin 18s linear infinite;box-shadow:0 20px 40px -14px rgba(0,0,0,.45)}
.s1 .lock{font-size:26px}
@keyframes spin{to{transform:rotate(360deg)}}
.s2{padding:22px 26px;border-radius:22px;background:#0E1520;color:#fff;transform:rotate(-8deg);box-shadow:0 20px 40px -14px rgba(0,0,0,.45)}
.s2 .lock{font-size:30px}
.s3{padding:14px 20px;border-radius:999px;background:#fff;color:var(--ink);font-weight:800;letter-spacing:.14em;font-size:13px;text-transform:uppercase;transform:rotate(6deg);box-shadow:0 20px 40px -14px rgba(0,0,0,.35)}
.s4{width:130px;height:130px;border-radius:26px;background:#fff;display:flex;align-items:center;justify-content:center;transform:rotate(10deg);box-shadow:0 20px 40px -14px rgba(0,0,0,.35)}
.s4 img{width:58px;height:auto}
/* onsite */
.photos{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-auto-rows:clamp(140px,18vw,250px);gap:16px;margin-top:64px}
.photos figure{margin:0;border-radius:22px;overflow:hidden;position:relative}
.photos img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.photos figure:hover img{transform:scale(1.06)}
.photos figcaption{position:absolute;left:16px;bottom:14px;padding:6px 12px;border-radius:999px;background:rgba(11,15,22,.7);color:#fff;font-size:12px;backdrop-filter:blur(6px)}
.p1{grid-column:span 7;grid-row:span 2}.p2{grid-column:span 5;grid-row:span 1}.p3{grid-column:span 5}.p4{grid-column:span 4}.p5{grid-column:span 4}.p6{grid-column:span 4}
/* process */
.steps{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:0;margin-top:64px;border-top:1.5px solid var(--ink);counter-reset:s}
.step{padding:26px 18px 0 0;position:relative}
.step::before{content:"";position:absolute;top:-6px;left:0;width:10px;height:10px;border-radius:50%;background:var(--ink)}
.step.hot::before{background:var(--red);box-shadow:0 0 0 6px rgba(236,0,0,.18)}
.step b{display:block;font-size:18px;margin:14px 0 8px;letter-spacing:-.01em}
.step p{margin:0;font-size:14px;line-height:1.5;color:var(--muted)}
/* screens photo */
.speakers{display:flex;gap:14px;margin-top:40px;flex-wrap:wrap}
.speakers .av{width:74px;height:74px;border-radius:50%;overflow:hidden;border:3px solid var(--ink2);margin-left:-26px;transition:transform .4s}
.speakers .av:first-child{margin-left:0}
.speakers .av:hover{transform:translateY(-8px)}
.speakers .av img{width:100%;height:100%;object-fit:cover}
/* cta */
.cta{text-align:left}
.cta .h2{font-size:clamp(48px,9vw,150px)}
.btn{display:inline-flex;align-items:center;gap:14px;margin-top:44px;padding:22px 34px;border-radius:999px;background:#fff;color:var(--ink);font-weight:800;font-size:18px;text-decoration:none;transition:transform .4s,box-shadow .4s}
.btn:hover{transform:translateY(-4px);box-shadow:0 20px 40px -10px rgba(0,0,0,.35)}
.btn svg{transition:transform .4s}.btn:hover svg{transform:translateX(6px)}
.stlock{margin-top:clamp(64px,8vw,120px)}
.stlock svg{display:block;width:100%;height:auto}
.foot{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:120px;padding-top:26px;border-top:1px solid rgba(255,255,255,.35)}
.bigword{font-family:"Inter Tight",sans-serif;font-weight:800;letter-spacing:-.06em;line-height:.8;font-size:clamp(56px,16vw,300px);color:rgba(255,255,255,.14);margin-top:40px;white-space:nowrap}
@media (max-width:980px){
 .meta{grid-template-columns:repeat(2,minmax(0,1fr))}
 .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
 .stat{border-right:0;border-bottom:1px solid rgba(14,21,32,.15);margin-right:0}
 .two,.brandgrid,.explode{grid-template-columns:minmax(0,1fr)}
 .feat{grid-template-columns:minmax(0,1fr)}
 .feat .fc{min-height:0;padding:30px 26px 32px}
 .modal{position:relative;right:auto;bottom:auto;width:70%;margin:-18% 0 0 auto}
 .t1,.t2,.t3,.t4,.t5,.t6{grid-column:1/-1}
 .p1,.p2,.p3,.p4,.p5,.p6{grid-column:1/-1;grid-row:span 1}
 .steps{grid-template-columns:minmax(0,1fr);border-top:0;border-left:1.5px solid var(--ink);padding-left:24px}
 .step{padding:0 0 30px}
 .step::before{left:-30px;top:4px}
 .type{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:560px){
 .nav .crumbs{display:none}
 .ly{object-position:72% 50%}
 .sl{width:320px;height:180px}
 .sl .c{inset:14px 16px}
 .badge{width:220px;height:308px}
 .badge .top{height:130px}
 .badge .nm{font-size:21px}
 .tile{min-height:360px;padding:24px}
 .sw{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
}
@media (prefers-reduced-motion:reduce){
 .cs *{animation:none !important;transition:none !important}
 .js .rv{opacity:1;transform:none}
}

/* sx overrides */
/*
 * Исправления известных дефектов исходных лендингов (они есть и в React-оригиналах).
 * Дописывается генератором снимков / доводкой в конец assets/site.css каждого бандла.
 */

/* Финальный CTA «Разработки»: правило `…> section:nth-of-type(…)` с полупрозрачным фоном перебивает
   тёмный фон `#0f1826`, и белый текст оказывается на светлом. */
.startapus-ds-service-shell [data-testid="studio-cta"] {
  background: #0f1826 !important;
}

/* «Реформус» и «Витринус»: тема продукта задаёт `--primary` как компоненты HSL (`168 68% 38%`), а утилита `bg-primary`
   берёт его как готовый цвет — значение невалидно, фон ссылок/плашек пропадает, остаётся светлый текст на светлом.
   Делаем их такими же, как кнопки на остальных страницах (`!bg-foreground !text-background`). */
.startapus-ds-product-shell[data-product="reformus"] :is(a, span).bg-primary.text-primary-foreground,
.startapus-ds-product-shell[data-product="vitrinus"] :is(a, span).bg-primary.text-primary-foreground {
  background-color: var(--foreground) !important;
  color: var(--background) !important;
}