/* Kervly — shared styles */
:root{color-scheme:dark}
html{scroll-behavior:smooth}
body{margin:0;background:#0a0907}
a{color:#f5a524}a:hover{color:#ffd28a}
.kv{--accent:#f5a524;--bg:#0a0907;--bg2:#100e0a;--card:#15120d;--card2:#1b1711;--line:#2a2419;--line2:#3a3123;--fg:#f4eee3;--muted:#ada492;--dim:#7d7565;--ember:#ff7a45;--ok:#86d39a;position:relative;background:var(--bg);color:var(--fg);font-family:"Geist",system-ui,sans-serif;font-size:17px;line-height:1.55;overflow-x:clip;-webkit-font-smoothing:antialiased}
.kv *{box-sizing:border-box}
.disp{font-family:"Bricolage Grotesque",serif;font-optical-sizing:auto;letter-spacing:-0.035em;line-height:.95}
.mono{font-family:"JetBrains Mono",ui-monospace,monospace}
.wrap{width:100%;max-width:1240px;margin:0 auto;padding:0 28px}
.skip{position:absolute;left:12px;top:-60px;z-index:100;padding:12px 16px;border-radius:10px;background:var(--accent);color:#1a1004;font-weight:600;text-decoration:none}
.skip:focus{top:12px;color:#1a1004}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:6px}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 22px;border-radius:999px;font-weight:600;font-size:16px;text-decoration:none;transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s,border-color .25s,background .25s,color .25s}
.btn-p{background:var(--accent);color:#1a1004;box-shadow:0 10px 40px -10px var(--accent)}
.btn-p:hover{color:#1a1004;transform:translateY(-2px);box-shadow:0 0 0 6px rgba(245,165,36,.15),0 18px 50px -12px var(--accent)}
.btn-g{border:1px solid var(--line2);color:var(--fg);background:rgba(255,255,255,.02)}
.btn-g:hover{color:var(--fg);border-color:var(--accent);transform:translateY(-2px)}
.btn .arr{transition:transform .25s}.btn:hover .arr{transform:translateX(4px)}
.btn-sm{min-height:44px;padding:0 18px;font-size:15px}

/* nav */
.nav{position:sticky;top:0;z-index:50;backdrop-filter:blur(14px) saturate(140%);-webkit-backdrop-filter:blur(14px) saturate(140%);background:rgba(10,9,7,.62);border-bottom:1px solid rgba(42,36,25,.7)}
.nav-in{display:flex;align-items:center;justify-content:space-between;gap:20px;height:72px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--fg)}
.brand:hover{color:var(--fg)}
.brand-mark{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;background:var(--accent);color:#1a1004}
.brand-mark svg{animation:roll 3s ease-in-out infinite}
.brand-name{font-size:25px;font-weight:700;letter-spacing:-0.03em}
.navlinks{display:flex;align-items:center;gap:26px}
.navlink{color:var(--muted);text-decoration:none;font-size:15px;padding:10px 4px;position:relative}
.navlink:hover,.navlink[aria-current="page"]{color:var(--fg)}
.navlink::after{content:"";position:absolute;left:4px;right:4px;bottom:4px;height:1px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .3s}
.navlink:hover::after,.navlink[aria-current="page"]::after{transform:scaleX(1)}
.nav-cta{display:flex;align-items:center;gap:10px}
.menu-btn{display:none;width:44px;height:44px;border-radius:12px;border:1px solid var(--line2);background:transparent;color:var(--fg);cursor:pointer;place-items:center}

/* common bits */
.eyebrow{display:inline-flex;align-items:center;gap:10px;padding:8px 14px 8px 10px;border:1px solid var(--line2);border-radius:999px;font-size:13px;color:var(--muted);background:rgba(21,18,13,.7)}
.dot{width:8px;height:8px;border-radius:50%;background:var(--accent);box-shadow:0 0 12px var(--accent);animation:pulse 2s ease-in-out infinite}
.stars{position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(1px 1px at 12% 18%,#fff8 50%,transparent 51%),radial-gradient(1px 1px at 28% 42%,#fff6 50%,transparent 51%),radial-gradient(1.5px 1.5px at 44% 12%,#fffa 50%,transparent 51%),radial-gradient(1px 1px at 63% 30%,#fff7 50%,transparent 51%),radial-gradient(1px 1px at 78% 8%,#fff9 50%,transparent 51%),radial-gradient(1.5px 1.5px at 88% 36%,#fff8 50%,transparent 51%),radial-gradient(1px 1px at 6% 52%,#fff5 50%,transparent 51%),radial-gradient(1px 1px at 52% 58%,#fff4 50%,transparent 51%),radial-gradient(1px 1px at 95% 60%,#fff6 50%,transparent 51%),radial-gradient(1px 1px at 35% 26%,#fff7 50%,transparent 51%);animation:twinkle 6s ease-in-out infinite}
.stars.s2{background-image:radial-gradient(1px 1px at 18% 30%,#fff7 50%,transparent 51%),radial-gradient(1px 1px at 38% 8%,#fff8 50%,transparent 51%),radial-gradient(1.5px 1.5px at 58% 44%,#ffd9a0 50%,transparent 51%),radial-gradient(1px 1px at 72% 20%,#fff6 50%,transparent 51%),radial-gradient(1px 1px at 84% 50%,#fff5 50%,transparent 51%),radial-gradient(1px 1px at 22% 62%,#fff4 50%,transparent 51%),radial-gradient(1px 1px at 68% 66%,#fff5 50%,transparent 51%);animation-delay:-3s;animation-duration:8s}
.glow{position:absolute;border-radius:50%;filter:blur(90px);pointer-events:none}
.gridbg{position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(245,165,36,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(245,165,36,.05) 1px,transparent 1px);background-size:64px 64px;mask-image:radial-gradient(ellipse 70% 60% at 50% 30%,#000 30%,transparent 75%);-webkit-mask-image:radial-gradient(ellipse 70% 60% at 50% 30%,#000 30%,transparent 75%);animation:gridpan 30s linear infinite}
.kicker{font-size:13px;letter-spacing:.18em;text-transform:uppercase;color:var(--accent);font-weight:600}
.h2{font-size:clamp(40px,6vw,74px);margin:18px 0 0;font-weight:700}
.lead{font-size:19px;color:var(--muted);max-width:620px;margin:22px 0 0}
.pill{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:999px;font-size:13px;font-weight:600;border:1px solid var(--line2);color:var(--muted);white-space:nowrap}
.pill i{width:7px;height:7px;border-radius:50%;background:currentColor}
.pill.hot{color:#1a1004;background:var(--accent);border-color:var(--accent)}
.pill.hot i{animation:pulse .8s infinite}

/* reveal: scroll-driven where supported, IntersectionObserver elsewhere */
.fadeup{animation:fadeup 1s cubic-bezier(.2,.8,.2,1) both}
.d1{animation-delay:.12s}.d2{animation-delay:.24s}.d3{animation-delay:.36s}.d4{animation-delay:.5s}
@supports (animation-timeline: view()){
  .rv{animation:reveal linear both;animation-timeline:view();animation-range:entry 0% cover 26%}
}
@supports not (animation-timeline: view()){
  .js .rv{opacity:0;transform:translateY(40px);transition:opacity .9s cubic-bezier(.2,.8,.2,1),transform .9s cubic-bezier(.2,.8,.2,1)}
  .js .rv.in{opacity:1;transform:none}
  .progress{display:none}
}
.progress{position:fixed;top:0;left:0;right:0;height:2px;background:var(--accent);transform-origin:left;transform:scaleX(0);z-index:60;animation:grow linear both;animation-timeline:scroll(root)}

/* footer */
.foot{border-top:1px solid var(--line);padding:56px 0 40px;color:var(--dim);font-size:14px}
.foot-in{display:flex;flex-wrap:wrap;justify-content:space-between;gap:24px;align-items:center}
.foot a{color:var(--muted);text-decoration:none}.foot a:hover{color:var(--fg)}
.foot nav{display:flex;flex-wrap:wrap;gap:22px}
.foot .legal{width:100%;margin-top:18px;font-size:13px;color:var(--dim)}

@keyframes reveal{from{opacity:0;transform:translateY(60px) scale(.97);filter:blur(8px)}to{opacity:1;transform:none;filter:none}}
@keyframes fadeup{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.8)}}
@keyframes twinkle{0%,100%{opacity:.9}50%{opacity:.35}}
@keyframes breathe{0%,100%{transform:scale(1);opacity:.85}50%{transform:scale(1.12);opacity:1}}
@keyframes gridpan{to{background-position:64px 64px}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes ring{0%{transform:scale(1);opacity:.9}100%{transform:scale(2.1);opacity:0}}
@keyframes grow{to{transform:scaleX(1)}}
@keyframes roll{0%,100%{transform:translateX(0)}50%{transform:translateX(3px)}}
@keyframes marq{to{transform:translateX(-50%)}}
@keyframes blink{50%{opacity:0}}

@media (max-width: 860px){
  .menu-btn{display:grid}
  .navlinks{display:none;position:absolute;top:72px;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;padding:8px 20px 18px;background:rgba(10,9,7,.97);border-bottom:1px solid var(--line)}
  .nav.open .navlinks{display:flex}
  .navlinks .navlink{padding:14px 4px;font-size:17px;border-bottom:1px solid var(--line)}
  .navlinks .navlink::after{display:none}
  .nav-cta .hide-sm{display:none}
}
@media (prefers-reduced-motion: reduce){
  .kv *,.kv *::before,.kv *::after{animation-duration:.001s !important;animation-iteration-count:1 !important;transition:none !important}
  .js .rv{opacity:1;transform:none}
}