/* Chalk Talk site finish: the homepage look on every page. Loaded after each page's own styles. Visual only. */
:root{--goldg:linear-gradient(180deg,#FFF0A0 0%,#FDDB25 45%,#EDAE17 100%);--fxe:cubic-bezier(.2,.8,.2,1);--mono:ui-monospace,'SF Mono',Menlo,Consolas,monospace}
body{background:#08090D!important}
main{position:relative;isolation:isolate}

/* scroll progress */
.sx-prog{position:fixed;left:0;right:0;top:0;height:2px;z-index:60;background:linear-gradient(90deg,#EAA815,#FDDB25,#FFF3B0);transform-origin:0 50%;transform:scaleX(0);pointer-events:none}

/* nav: glass, gold underline, gold button */
.nav{background:rgba(8,9,13,.72)!important;backdrop-filter:saturate(1.5) blur(18px)!important;-webkit-backdrop-filter:saturate(1.5) blur(18px)!important;border-bottom:1px solid rgba(255,255,255,.07)!important}
.nav .links a{position:relative}
.nav .links a::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;border-radius:2px;background:#FDDB25;transform:scaleX(0);transition:transform .25s var(--fxe)}
.nav .links a:hover::after,.nav .links a[aria-current]::after{transform:scaleX(1)}
.nav .links a[aria-current]{color:#fff!important}

/* buttons */
.btn.p,.btn.accent,body:not(:has(.btn.p)) .btn:not(.ghost){position:relative;overflow:hidden;background:var(--goldg)!important;border:0!important;color:#141006!important;font-weight:700!important;box-shadow:0 12px 34px -12px rgba(253,219,37,.7),inset 0 1px 0 rgba(255,255,255,.55);transition:transform .2s var(--fxe),box-shadow .2s}
.btn.p:hover,.btn.accent:hover,body:not(:has(.btn.p)) .btn:not(.ghost):hover{transform:translateY(-2px);box-shadow:0 18px 44px -12px rgba(253,219,37,.85),inset 0 1px 0 rgba(255,255,255,.55)}
.btn.ghost,body:has(.btn.p) .btn:not(.p):not(.accent){background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.18)!important;backdrop-filter:blur(8px);transition:transform .2s var(--fxe),background .2s,border-color .2s}
.btn.ghost:hover,body:has(.btn.p) .btn:not(.p):not(.accent):hover{transform:translateY(-2px);background:rgba(255,255,255,.09)!important;border-color:rgba(255,255,255,.35)!important}
.sx-shine{position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.6) 50%,transparent 65%);transform:translateX(-120%);animation:sxShine 4.8s 1.5s infinite;pointer-events:none}
@keyframes sxShine{0%,70%{transform:translateX(-120%)}100%{transform:translateX(120%)}}

/* hero backdrop: glow, rays, a receding board grid, gold light streaks */
.sx-bg{position:absolute;left:0;right:0;top:0;z-index:-1;pointer-events:none;overflow:hidden;background:#06070A}
.sx-bg .g{position:absolute;inset:0;background:radial-gradient(640px 420px at 74% 42%,rgba(253,219,37,.17),transparent 65%),radial-gradient(900px 300px at 50% 100%,rgba(253,219,37,.10),transparent 70%),radial-gradient(520px 380px at 6% 12%,rgba(127,178,255,.08),transparent 70%)}
.sx-bg .r{position:absolute;width:1500px;height:1500px;left:74%;top:42%;translate:-50% -50%;background:repeating-conic-gradient(from 0deg,rgba(253,219,37,.05) 0deg 3deg,transparent 3deg 13deg);-webkit-mask:radial-gradient(closest-side,#000 8%,rgba(0,0,0,.5) 40%,transparent 75%);mask:radial-gradient(closest-side,#000 8%,rgba(0,0,0,.5) 40%,transparent 75%);animation:sxSpin 140s linear infinite}
@keyframes sxSpin{to{rotate:360deg}}
.sx-bg .f{position:absolute;left:-30%;right:-30%;bottom:0;height:46%;background-image:linear-gradient(rgba(253,219,37,.24) 1px,transparent 1px),linear-gradient(90deg,rgba(253,219,37,.18) 1px,transparent 1px);background-size:72px 72px;transform:perspective(560px) rotateX(64deg);transform-origin:50% 100%;-webkit-mask:linear-gradient(to top,#000 0%,rgba(0,0,0,.55) 35%,transparent 80%);mask:linear-gradient(to top,#000 0%,rgba(0,0,0,.55) 35%,transparent 80%);animation:sxFloor 2.6s linear infinite}
@keyframes sxFloor{to{background-position:0 72px,0 0}}
.sx-bg canvas{position:absolute;inset:0;width:100%;height:100%}
.sx-bg::after{content:"";position:absolute;left:0;right:0;bottom:0;height:120px;background:linear-gradient(transparent,#08090D)}

main .hero,main .top{background:transparent!important;position:relative}
main .hero::before,main .hero::after{opacity:.5}
.cta{position:relative;overflow:hidden;isolation:isolate}
.cta .sx-f{position:absolute;left:-30%;right:-30%;bottom:0;height:75%;z-index:-1;background-image:linear-gradient(rgba(253,219,37,.24) 1px,transparent 1px),linear-gradient(90deg,rgba(253,219,37,.18) 1px,transparent 1px);background-size:72px 72px;transform:perspective(560px) rotateX(64deg);transform-origin:50% 100%;-webkit-mask:linear-gradient(to top,#000,transparent 85%);mask:linear-gradient(to top,#000,transparent 85%);animation:sxFloor 2.6s linear infinite}
.cta .sx-g{position:absolute;inset:0;z-index:-1;background:radial-gradient(700px 360px at 50% 100%,rgba(253,219,37,.26),transparent 70%)}
/* hero type */
.hero .k,.top .k{display:inline-flex;align-items:center;gap:9px;color:#FDDB25!important;font-weight:800!important;letter-spacing:.16em!important}
.hero .k::before,.top .k::before{content:"";width:8px;height:8px;border-radius:50%;background:#50E3A4;animation:sxLive 2s infinite}
@keyframes sxLive{0%{box-shadow:0 0 0 0 rgba(80,227,164,.6)}70%{box-shadow:0 0 0 8px rgba(80,227,164,0)}100%{box-shadow:0 0 0 0 rgba(80,227,164,0)}}
.hero h1{font-size:clamp(42px,5.4vw,78px)!important;line-height:.93!important;letter-spacing:-.05em!important;text-transform:uppercase;font-weight:800!important;text-shadow:0 2px 30px rgba(0,0,0,.4)}
.hero h1 em,.top h1 em{font-style:normal;background:var(--goldg);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent!important;filter:drop-shadow(0 0 28px rgba(253,219,37,.35))}
.sx-w{display:inline-block;opacity:0;transform:translateY(.4em) rotate(2deg);filter:blur(8px);animation:sxWord .9s var(--fxe) forwards}
@keyframes sxWord{to{opacity:1;transform:none;filter:none}}
.hero .lead{color:#B7BAC2!important}
.crumb{position:relative;z-index:1}

/* the visual next to the headline floats in 3D */
.sx-stage{perspective:1600px}
.sx-stage>.vis,.sx-stage>.sx-v{transform-style:preserve-3d;transform:rotateY(var(--ry,-10deg)) rotateX(var(--rx,4deg));transition:transform .6s var(--fxe);animation:sxIn 1.1s .2s var(--fxe) backwards;
  box-shadow:0 0 0 1px rgba(253,219,37,.14),0 60px 120px -40px rgba(0,0,0,.95),0 0 120px -30px rgba(253,219,37,.3)!important;border-color:rgba(255,255,255,.12)!important}
@keyframes sxIn{from{opacity:0;transform:rotateY(-26deg) rotateX(12deg) translateY(40px) scale(.94)}}
@media (max-width:900px){.sx-stage>.vis,.sx-stage>.sx-v{--ry:0deg!important;--rx:5deg!important}}

/* numbered section kickers and gold last word */
.sx-num{display:flex;align-items:center;gap:12px;font:700 12.5px 'Geist',system-ui,sans-serif;letter-spacing:.2em;text-transform:uppercase;color:#C9CBD0;margin-bottom:14px}
.sx-num b{font:800 13px var(--mono);color:#141006;background:var(--goldg);padding:4px 8px;border-radius:7px;letter-spacing:.04em}
.sx-num::after{content:"";width:46px;height:1px;background:linear-gradient(90deg,rgba(253,219,37,.7),transparent)}
.sec h2 em,.final h2 em,.g h2 em,main h2 .sx-gold{font-style:normal;background:var(--goldg);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.sec h2{font-size:clamp(32px,4vw,52px)!important;letter-spacing:-.04em!important;line-height:1.02!important}
.sec{border-top:0!important;position:relative}
.sec::before{content:"";position:absolute;left:50%;top:0;width:min(900px,80%);height:1px;translate:-50% 0;background:linear-gradient(90deg,transparent,rgba(253,219,37,.28),transparent)}

/* cards */
.feat{border-top:0!important;gap:14px!important}
.feat>div{position:relative;border:1px solid rgba(255,255,255,.09)!important;border-radius:20px;padding:26px 26px!important;background:linear-gradient(160deg,rgba(255,255,255,.05),rgba(255,255,255,.015));transition:transform .3s var(--fxe),border-color .3s,box-shadow .3s}
.feat>div::before{content:"";position:absolute;left:26px;top:0;width:40px;height:3px;border-radius:0 0 3px 3px;background:var(--goldg);box-shadow:0 0 14px rgba(253,219,37,.6)}
.feat>div:hover{border-color:rgba(253,219,37,.4)!important;box-shadow:0 30px 70px -34px rgba(0,0,0,.95)}
.steps li,.rel a,.gcard{position:relative;border-color:rgba(255,255,255,.1)!important;background:linear-gradient(160deg,rgba(255,255,255,.055),rgba(255,255,255,.015))!important;transition:transform .3s var(--fxe),border-color .3s,box-shadow .3s}
.steps li:hover,.rel a:hover,.gcard:hover{border-color:rgba(253,219,37,.45)!important;box-shadow:0 30px 70px -34px rgba(0,0,0,.95),0 0 0 1px rgba(253,219,37,.12)}
.steps li::before{background:var(--goldg)!important;border:0!important;color:#141006!important;font-weight:800!important;box-shadow:0 8px 22px -8px rgba(253,219,37,.7)}
.rel i{color:#FDDB25!important;transition:transform .25s var(--fxe)}.rel a:hover i{transform:translateX(4px)}
.vis{border-radius:22px!important}
.sx-glare{position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .3s;background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.18),transparent 45%);mix-blend-mode:overlay;z-index:3}
.sx-tilt:hover .sx-glare{opacity:1}
.sx-tilt.sx-on{transition:transform .08s linear,border-color .3s,box-shadow .3s!important}

/* questions */
.faq details{border-bottom:1px solid rgba(255,255,255,.08)!important;transition:background .2s}
.faq summary{transition:color .2s}
.faq summary:hover{color:#FDDB25}
.faq summary::after{color:#FDDB25!important;transition:transform .3s var(--fxe)}
.faq details[open] summary::after{transform:rotate(180deg)}
.faq details[open] p{animation:sxUp .45s var(--fxe)}

/* tilted bands */
.sx-bands{position:relative;overflow:hidden;padding-block:60px;background:#08090D}
.sx-band{display:flex;white-space:nowrap;transform:rotate(-2.2deg);margin-inline:-40px;background:var(--goldg);color:#141006;box-shadow:0 20px 60px -20px rgba(253,219,37,.5);position:relative;z-index:2}
.sx-band.dark{transform:rotate(1.8deg);background:#111219;color:#fff;box-shadow:none;border-block:1px solid #262838;margin-top:-6px;z-index:1}
.sx-track{display:flex;animation:sxMarq 48s linear infinite;will-change:transform}
.sx-band.dark .sx-track{animation-direction:reverse;animation-duration:70s}
.sx-track>span{display:inline-flex;align-items:center;gap:34px;padding:17px 17px;font:800 clamp(19px,2.3vw,28px)/1 'Bricolage Grotesque',system-ui,sans-serif;letter-spacing:-.02em;text-transform:uppercase}
.sx-track>span::after{content:"✦";font-size:.7em}
.sx-band.dark .sx-track>span{font:400 clamp(21px,2.5vw,30px)/1 'Gochi Hand',cursive;text-transform:none;color:#C9CBD0}
.sx-band.dark .sx-track>span::after{color:#FDDB25}
@keyframes sxMarq{to{transform:translateX(-50%)}}

/* final call to action */
.final{position:relative;overflow:hidden;isolation:isolate;border-top:0!important;background:#06070A}
.final h2{text-transform:uppercase;letter-spacing:-.05em!important;line-height:.95!important;font-size:clamp(34px,5.4vw,72px)!important}
.final .sx-f{position:absolute;left:-30%;right:-30%;bottom:0;height:75%;z-index:-1;background-image:linear-gradient(rgba(253,219,37,.24) 1px,transparent 1px),linear-gradient(90deg,rgba(253,219,37,.18) 1px,transparent 1px);background-size:72px 72px;transform:perspective(560px) rotateX(64deg);transform-origin:50% 100%;-webkit-mask:linear-gradient(to top,#000,transparent 85%);mask:linear-gradient(to top,#000,transparent 85%);animation:sxFloor 2.6s linear infinite}
.final .sx-g{position:absolute;inset:0;z-index:-1;background:radial-gradient(700px 360px at 50% 100%,rgba(253,219,37,.26),transparent 70%)}

/* reveal on scroll */
.sx-r{opacity:0;transform:translateY(30px) scale(.985);filter:blur(7px);transition:opacity .85s var(--fxe),transform .85s var(--fxe),filter .85s var(--fxe)}
.sx-r.in{opacity:1;transform:none;filter:none}
@keyframes sxUp{from{opacity:0;transform:translateY(10px)}}

footer{position:relative;border-top:0!important}
footer::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,transparent,rgba(253,219,37,.35),transparent)}

@media (prefers-reduced-motion:reduce){
  .sx-bg .r,.sx-bg .f,.final .sx-f,.sx-track,.sx-shine,.hero .k::before{animation:none!important}
  .sx-r{opacity:1!important;transform:none!important;filter:none!important}
  .sx-w{animation:none;opacity:1;transform:none;filter:none}
  .sx-stage>.vis,.sx-stage>.sx-v{animation:none}
}

/* legal pages */
main.legal{max-width:760px!important;margin:0 auto;padding:48px max(20px,env(safe-area-inset-left,0px)) 80px!important;color:#C9CBD0!important;font:400 16.5px/1.7 Geist,system-ui,sans-serif}
main.legal .lg-k{display:inline-flex;align-items:center;gap:9px;font:800 12px Geist,system-ui,sans-serif;letter-spacing:.18em;text-transform:uppercase;color:#FDDB25}
main.legal .lg-k::before{content:"";width:8px;height:8px;border-radius:50%;background:#50E3A4}
main.legal h1{font:800 clamp(38px,6vw,64px)/.95 'Bricolage Grotesque',system-ui,sans-serif!important;letter-spacing:-.05em;text-transform:uppercase;color:#fff;margin:14px 0 6px}
main.legal h2{font:700 21px 'Bricolage Grotesque',system-ui,sans-serif!important;color:#fff;margin-top:36px!important;padding-top:20px;border-top:1px solid rgba(255,255,255,.08)}
main.legal strong{color:#fff}main.legal a{color:#FDDB25}
main.legal ul{padding-left:20px}main.legal li{margin:6px 0}
main.legal li::marker{color:#FDDB25}
