/* ════════════════════════════════════════════════
   THRYD — base.css
   Reset · Palette · Typography · Cursor · Animations · Responsive globals
   ════════════════════════════════════════════════ */

/* ── RESET ─────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:#EDE8E0;
  color:#1A1714;
  font-family:'DM Mono',monospace;
  overflow-x:hidden;
  cursor:none;
}

/* ── PALETTE ────────────────────────────────── */
:root{
  --bg:        #EDE8E0;
  --bg2:       #E4DED5;
  --ink:       #1A1714;
  --ink2:      #3D3830;
  --muted:     #8C8479;
  --rust:      #C45C2E;
  --rust-dim:  rgba(196,92,46,0.12);
  --border:    rgba(26,23,20,0.10);
  --cream:     #F5F1EB;
  --mono:      'DM Mono',monospace;
  --display:   'Anton',sans-serif;
  --serif:     'Fraunces',serif;
}

/* ── CURSOR ─────────────────────────────────── */
#cur{
  position:fixed;width:9px;height:9px;
  background:var(--rust);border-radius:50%;
  pointer-events:none;z-index:99999;
  transform:translate(-50%,-50%);
  transition:width .2s,height .2s;
}
#cur-ring{
  position:fixed;width:32px;height:32px;
  border:1px solid rgba(196,92,46,0.3);border-radius:50%;
  pointer-events:none;z-index:99998;
  transform:translate(-50%,-50%);
  transition:width .25s,height .25s;
}

/* ── REVEAL ANIMATIONS ───────────────────────── */
.reveal{
  opacity:0;transform:translateY(24px);
  transition:opacity .9s ease,transform .9s ease;
}
.reveal.up{opacity:1;transform:translateY(0)}
.reveal-d1{transition-delay:.1s}
.reveal-d2{transition-delay:.2s}
.reveal-d3{transition-delay:.3s}

.feat{
  opacity:0;transform:translateY(32px);
  transition:opacity .8s ease,transform .8s ease,background .3s;
}
.feat.up{opacity:1;transform:translateY(0)}
.feat:nth-child(1){transition-delay:0s}
.feat:nth-child(2){transition-delay:.12s}
.feat:nth-child(3){transition-delay:.24s}

@keyframes fadeUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}

/* ── SHARED COMPONENTS ───────────────────────── */
/* Marquee */
.marquee-wrap{
  overflow:hidden;
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
  padding:16px 0;
  background:var(--bg2);
}
.marquee-track{
  display:flex;width:max-content;
  animation:marquee 28s linear infinite;
}
.marquee-unit{
  display:flex;align-items:center;
  gap:36px;padding-right:36px;
}
.m-w{
  font-family:var(--display);font-size:12px;
  letter-spacing:.22em;text-transform:uppercase;
  color:var(--muted);
}
.m-sep{
  width:4px;height:4px;border-radius:50%;
  background:var(--rust);opacity:.6;flex-shrink:0;
}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* Footer */
footer{
  padding:48px 52px;
  border-top:1px solid var(--border);
  display:flex;justify-content:space-between;align-items:center;
  flex-wrap:wrap;gap:20px;
}
.foot-logo{height:26px;width:auto;opacity:.55}
.foot-links{display:flex;gap:32px}
.foot-links a{
  font-family:var(--mono);font-size:10px;
  letter-spacing:.14em;text-transform:uppercase;
  color:var(--muted);text-decoration:none;
  transition:color .2s;
}
.foot-links a:hover{color:var(--rust)}
.foot-copy{
  font-family:var(--mono);font-size:9px;
  letter-spacing:.08em;color:var(--muted);opacity:.6;
}

/* ── RESPONSIVE GLOBALS ──────────────────────── */
@media(hover:none) and (pointer:coarse){
  body{ cursor:auto; }
}
@media(max-width:900px){
  footer{padding:36px 24px}
}
