/* Scape Burguer · base
   Fonts, design tokens, reset, typography, buttons and the scroll-reveal helper. */

/* ============================= FONTS (self-hosted) ============================= */
@font-face{
  font-family:'Luckiest Guy';src:url('../assets/fonts/luckiestguy.woff2') format('woff2');
  font-weight:400;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Poppins';src:url('../assets/fonts/poppins-300.woff2') format('woff2');
  font-weight:300;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Poppins';src:url('../assets/fonts/poppins-400.woff2') format('woff2');
  font-weight:400;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Poppins';src:url('../assets/fonts/poppins-500.woff2') format('woff2');
  font-weight:500;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Poppins';src:url('../assets/fonts/poppins-600.woff2') format('woff2');
  font-weight:600;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Poppins';src:url('../assets/fonts/poppins-700.woff2') format('woff2');
  font-weight:700;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Poppins';src:url('../assets/fonts/poppins-800.woff2') format('woff2');
  font-weight:800;font-style:normal;font-display:swap;
}

/* ============================= RESET / BASE ============================= */
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto !important}
.lenis.lenis-stopped{overflow:hidden}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
ul{list-style:none;margin:0;padding:0}
h1,h2,h3,p{margin:0}

:root{
  --void:#0b0a08;
  --void-soft:#151210;
  --panel:#1b1613;
  --panel-2:#201a16;
  --bone:#f4ecdc;
  --bone-dim:#c6bba7;
  --smoke:#8b8074;
  --orange:#f26a1b;
  --orange-2:#ff9548;
  --blood:#a8121f;
  --blood-dim:#6e0c15;
  --ecto:#8fd13f;
  --line:rgba(244,236,220,.12);
  --line-soft:rgba(244,236,220,.07);
  --shadow-lg:0 30px 80px rgba(0,0,0,.55);
  --shadow-md:0 16px 40px rgba(0,0,0,.4);
  --radius:18px;
  --radius-sm:10px;
  --container:1200px;
  --pad:clamp(20px,5vw,64px);
  --font-display:'Luckiest Guy','Bungee',system-ui,sans-serif;
  --font-body:'Poppins',system-ui,-apple-system,sans-serif;
}

body{
  background:var(--void);
  color:var(--bone);
  font-family:var(--font-body);
  font-weight:400;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:clip;
}

.container{max-width:var(--container);margin-inline:auto;padding-inline:var(--pad)}

/* film grain, fixed over everything */
body::after{
  content:"";
  position:fixed; inset:0; z-index:1002; pointer-events:none;
  background-image: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='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.05 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  mix-blend-mode:overlay;
  opacity:.3;
}

::selection{background:var(--orange);color:var(--void)}
:focus-visible{outline:2px solid var(--orange);outline-offset:3px;border-radius:6px}
section[id]{scroll-margin-top:72px}

h2.h-display,h1.h-display{
  font-family:var(--font-display);
  font-weight:400;
  letter-spacing:.015em;
  line-height:.98;
  text-wrap:balance;
}

.eyebrow-tag{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--font-body);font-weight:600;font-size:.78rem;
  letter-spacing:.04em;color:var(--orange-2);
  padding:7px 16px;border:1px solid rgba(242,106,27,.4);
  border-radius:99px;background:rgba(242,106,27,.08);
}
.eyebrow-tag i{width:6px;height:6px;border-radius:50%;background:var(--orange);box-shadow:0 0 10px var(--orange)}

.section{padding-block:clamp(52px,6.5vw,92px);position:relative}
.section-head{max-width:640px;margin-bottom:clamp(28px,4vw,44px)}
.section-head p{color:var(--bone-dim);font-size:1.05rem;margin-top:14px}
.section-head.center{margin-inline:auto;text-align:center}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  font-family:var(--font-body);font-weight:600;font-size:.98rem;
  padding:15px 30px;border-radius:99px;white-space:nowrap;
  transition:transform .25s cubic-bezier(.2,.9,.3,1.3),box-shadow .25s,background .25s,border-color .25s;
  border:1px solid transparent;
}
.btn-primary{background:var(--orange);color:#160c04;box-shadow:0 10px 30px rgba(242,106,27,.35)}
.btn-primary:hover{transform:translateY(-3px);box-shadow:0 16px 36px rgba(242,106,27,.5)}
.btn-ghost{border-color:rgba(244,236,220,.35);color:var(--bone)}
.btn-ghost:hover{border-color:var(--bone);background:rgba(244,236,220,.07);transform:translateY(-3px)}
.btn-blood{background:var(--blood);color:var(--bone);box-shadow:0 10px 26px rgba(168,18,31,.4)}
.btn-blood:hover{transform:translateY(-3px);box-shadow:0 16px 32px rgba(168,18,31,.55)}
.btn-sm{padding:11px 22px;font-size:.88rem}

/* reveal-on-scroll */
[data-reveal]{opacity:0;transform:translateY(20px);transition:opacity .8s cubic-bezier(.16,.8,.24,1),transform .8s cubic-bezier(.16,.8,.24,1);transition-delay:var(--d,0ms)}
[data-reveal].in{opacity:1;transform:translateY(0)}
[data-reveal="left"]{transform:translateX(-34px)}
[data-reveal="left"].in{transform:translateX(0)}
[data-reveal="right"]{transform:translateX(34px)}
[data-reveal="right"].in{transform:translateX(0)}
[data-reveal="scale"]{transform:scale(.92)}
[data-reveal="scale"].in{transform:scale(1)}
@media (prefers-reduced-motion:reduce){
  [data-reveal]{opacity:1 !important;transform:none !important;transition:none !important}
}

/* jagged torn-paper divider */
.jagged{position:relative;height:34px;margin-top:-1px}
.jagged svg{position:absolute;inset:0;width:100%;height:100%;display:block}