/* Betty The Raccoon: design tokens + shared primitives. Palette sampled from the Fluff Forest poster. */
@font-face{font-family:"Titan One";src:url(../fonts/titan-one-latin.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Exo 2 Black Italic";src:url(../fonts/exo2-black-italic-latin.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Inter";src:url(../fonts/inter-latin-var.woff2) format("woff2");font-weight:400 800;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
	--night:#0f0b1c;      /* poster shadows #09060e / #15101e */
	--night-2:#1b1630;    /* raised surface */
	--indigo:#2b2560;     /* forest indigo */
	--indigo-2:#352b6a;   /* poster ferns #352b6a */
	--dusk:#383a7a;       /* dusk sky #383a7a */
	--pink:#ed008c;       /* FLUFF FOREST lettering */
	--pink-btn:#d4007d;   /* pink for white-text buttons (AA) */
	--pink-soft:#ff5cb4;  /* pink for small text on night (AA) */
	--gold:#e4a74a;       /* sunset / lettering outline */
	--ember:#e0603f;      /* fox fur */
	--lime:#b8be46;       /* baby dragon */
	--cream:#eee7c9;      /* fluff / poster type */
	--muted:#bdb6cf;
	--line:rgba(238,231,201,.14);
	--f-display:"Titan One","Arial Rounded MT Bold",system-ui,sans-serif;
	--f-metal:"Exo 2 Black Italic","Arial Black","Helvetica Neue",sans-serif;
	--f-body:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
	--r:22px;
	--r-sm:14px;
	--wrap:1200px;
	--pad:clamp(18px,4vw,40px);
	--sec:clamp(64px,10vw,128px);
	--shadow:0 18px 50px -18px rgba(0,0,0,.65);
}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--night);color:var(--cream);font-family:var(--f-body);font-size:1.0625rem;line-height:1.65;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
*,*::before,*::after{box-sizing:border-box}
img{max-width:100%;height:auto;display:block}
a{color:var(--pink-soft)}
a:hover{color:var(--cream)}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px;border-radius:6px}
::selection{background:var(--pink);color:#fff}
h1,h2,h3,h4{font-family:var(--f-display);font-weight:400;line-height:1.08;margin:0 0 .5em;letter-spacing:.01em}
p{margin:0 0 1em}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}
.screen-reader-text:focus{clip:auto;width:auto;height:auto;z-index:100;top:8px;left:8px;padding:10px 16px;background:var(--gold);color:var(--night);border-radius:8px}

.bt-wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--pad)}
.bt-kicker{font-family:var(--f-metal);color:var(--gold);font-size:clamp(.98rem,1.6vw,1.15rem);font-weight:400;line-height:1.2;text-transform:uppercase;letter-spacing:.07em;margin:0 0 .45em}
.bt-h2{font-size:clamp(2.1rem,5.4vw,3.6rem);color:var(--cream);text-shadow:.055em .065em 0 var(--pink-btn)}
.bt-h3{font-size:clamp(1.5rem,3.2vw,2.1rem);color:var(--cream)}
.bt-lead{font-size:clamp(1.05rem,1.6vw,1.2rem);color:var(--cream)}
.bt-sechead{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px 24px;margin-bottom:clamp(24px,4vw,44px)}
.bt-sechead .bt-h2{margin:0}

.bt-btn{display:inline-flex;align-items:center;gap:.5em;min-height:48px;padding:.75em 1.4em;border-radius:999px;font-family:var(--f-display);font-size:1.08rem;letter-spacing:.02em;text-decoration:none;line-height:1.1;border:2px solid transparent;transition:transform .2s ease,box-shadow .2s ease,background-color .2s ease,color .2s ease}
.bt-btn--pink{background:var(--pink-btn);color:#fff;box-shadow:0 5px 0 #7a0049,0 14px 30px -10px rgba(237,0,140,.6)}
.bt-btn--pink:hover{color:#fff;transform:translateY(-2px);box-shadow:0 7px 0 #7a0049,0 18px 34px -10px rgba(237,0,140,.7)}
.bt-btn--gold{background:var(--gold);color:var(--night);box-shadow:0 5px 0 #8a5a1c}
.bt-btn--gold:hover{color:var(--night);transform:translateY(-2px)}
.bt-btn--ghost{color:var(--cream);border-color:rgba(238,231,201,.55);background:rgba(15,11,28,.35);backdrop-filter:blur(4px)}
.bt-btn--ghost:hover{color:var(--night);background:var(--cream);border-color:var(--cream)}
.bt-btn--lg{font-size:1.25rem;padding:.85em 1.8em}
.bt-btn:active{transform:translateY(2px)}
.bt-ico{flex:none}
.bt-link{font-weight:700;color:var(--gold);text-decoration:none;border-bottom:2px solid currentColor;padding-bottom:2px}
.bt-link:hover{color:var(--cream)}
.bt-link::after{content:" \2192"}
.bt-chip{display:inline-flex;align-items:center;gap:.4em;min-height:40px;padding:.45em .9em;border-radius:999px;border:1.5px solid var(--line);color:var(--cream);background:rgba(255,255,255,.04);text-decoration:none;font-size:.92rem;font-weight:600;transition:background-color .2s,border-color .2s,color .2s}
.bt-chip:hover{background:var(--cream);color:var(--night);border-color:var(--cream)}
.bt-placeholder{display:inline-block;font-size:.85rem;font-weight:600;color:var(--lime);border:1.5px dashed var(--lime);border-radius:10px;padding:.35em .8em;margin-top:.5em}

/* Scroll reveal: content stays visible without JS or with reduced motion. */
.bt-js .bt-reveal{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s cubic-bezier(.2,.7,.2,1);transition-delay:calc(var(--d,0) * 60ms)}
.bt-js .bt-reveal.is-in{opacity:1;transform:none}

/* Floating fluff + leaves (decorative). */
.bt-fluff{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.bt-fluff__b{position:absolute;bottom:-40px;left:calc(var(--i) * 8.3% - 4%);width:calc(8px + var(--s) * 6px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 40% 40%,#fff 0,rgba(255,240,250,.85) 30%,rgba(255,92,180,.25) 60%,rgba(255,92,180,0) 72%);opacity:.8;animation:bt-float calc(14s + var(--t) * 3s) linear infinite;animation-delay:calc(var(--i) * -2.3s)}
.bt-fluff__l{position:absolute;top:-30px;left:calc(var(--i) * 22% - 6%);color:var(--lime);opacity:.55;animation:bt-leaf calc(16s + var(--i) * 3s) linear infinite;animation-delay:calc(var(--i) * -4.1s)}
.bt-fluff__l:nth-child(even){color:var(--gold)}
@keyframes bt-float{0%{transform:translate3d(0,0,0)}50%{transform:translate3d(24px,-55vh,0)}100%{transform:translate3d(-12px,-115vh,0);opacity:0}}
@keyframes bt-leaf{0%{transform:translate3d(0,0,0) rotate(0)}50%{transform:translate3d(-40px,55vh,0) rotate(160deg)}100%{transform:translate3d(30px,115vh,0) rotate(320deg);opacity:0}}
@media (prefers-reduced-motion:reduce){
	.bt-fluff__b,.bt-fluff__l{animation:none}
	.bt-fluff__b{bottom:auto;top:calc(var(--i) * 7%);opacity:.35}
	.bt-fluff__l{top:calc(var(--i) * 18%);opacity:.3}
	.bt-js .bt-reveal{opacity:1;transform:none;transition:none}
	.bt-btn,.bt-chip{transition:none}
}
