/* ----------------------------
   TOKENS + GLOBAL BASE
   (Variables, reset, base elements)
----------------------------- */

:root{
  --bg: #0f0d0b;
  --bg2: #16120f;
  --text: #f3efe8;
  --muted: rgba(243,239,232,.72);

  --gold: #d2a934;
  --gold2: #b8922c;

  --brown: #6b3f2a;
  --brown2: #3a241a;

  --steel: #cfd3d6;
  --steel2: #8f959a;

  --line: rgba(255,255,255,.10);
  --shadow: 0 20px 60px rgba(0,0,0,.55);

  /* hero fine-tuning */
  --hero-shift-x: -360px;
  --hero-shift-y: 280px;
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }

body{
  margin:0;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
  background:
    radial-gradient(1200px 800px at 20% 0%, rgba(210,169,52,.10), transparent 55%),
    radial-gradient(900px 700px at 80% 10%, rgba(107,63,42,.22), transparent 60%),
    linear-gradient(180deg, var(--bg), var(--bg2));
  color: var(--text);
  overflow-x:hidden;
}

a{ color:inherit; text-decoration:none; }
a:hover{ opacity:.92; }

.skip{
  position:absolute;
  left:-999px;
  top:10px;
  background:var(--gold);
  color:#1b130e;
  padding:.6rem .9rem;
  border-radius:999px;
  z-index:9999;
}
.skip:focus{ left:12px; }

.wrap{
  width:min(1100px, calc(100% - 3rem));
  margin:0 auto;
}