/* ─── RESET ──────────────────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Inter',sans-serif;background:#000;color:#f0f0f0;overflow-x:hidden;-webkit-font-smoothing:antialiased}
img,svg{display:block;max-width:100%}
a{text-decoration:none;color:inherit}
ul{list-style:none}
button{font-family:inherit;cursor:pointer}
input,select,textarea,button{font-family:inherit}

/* ─── CSS CUSTOM PROPERTY FOR BORDER ANIMATION ───────────────────────── */
@property --angle{syntax:'<angle>';initial-value:0deg;inherits:false}

/* ─── DESIGN TOKENS ──────────────────────────────────────────────────── */
:root{
  --bg:#000000;
  --surface:#0a0a0a;
  --surface-2:#0f0f0f;
  --border:rgba(255,255,255,0.06);
  --border-hover:rgba(255,255,255,0.12);

  --gold:#d4a843;
  --gold-bright:#f0c060;
  --gold-dim:#8a6820;
  --gold-glow:rgba(212,168,67,0.5);

  --purple:#7c3aed;
  --blue:#0ea5e9;

  --text:#f0f0f0;
  --text-muted:#5a5a7a;
  --text-dim:#333345;

  --font-display:'Space Grotesk',sans-serif;
  --font-body:'Inter',sans-serif;

  --section-pad:120px;
  --container:1200px;
  --radius:16px;
  --radius-sm:10px;
  --radius-pill:100px;
}

/* ─── TYPOGRAPHY ─────────────────────────────────────────────────────── */
h1,h2,h3,h4,h5{font-family:var(--font-display);font-weight:700;line-height:1.15;color:var(--text)}
h1{font-size:clamp(3rem,8vw,7rem)}
h2{font-size:clamp(2rem,4vw,3.5rem)}
h3{font-size:1.4rem}
h4{font-size:1.05rem}
p{font-size:0.95rem;line-height:1.7;color:var(--text-muted)}

.gradient-text{
  background:linear-gradient(135deg,var(--gold),var(--gold-bright));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}

/* ─── UTILITIES ──────────────────────────────────────────────────────── */
.container{max-width:var(--container);margin:0 auto;padding:0 32px}
.section-label{
  font-family:var(--font-display);
  font-size:0.68rem;font-weight:700;letter-spacing:0.22em;text-transform:uppercase;
  color:var(--gold);margin-bottom:20px;display:block;
}
svg.defs{position:absolute;width:0;height:0;overflow:hidden}

/* ─── NOISE TEXTURE ──────────────────────────────────────────────────── */
body::after{
  content:'';position:fixed;inset:0;z-index:998;pointer-events:none;opacity:0.025;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-repeat:repeat;background-size:256px 256px;
}

/* ─── BILINGUAL SYSTEM ───────────────────────────────────────────────── */
[data-lang="en"] [data-mn]{display:none}
[data-lang="mn"] [data-en]{display:none}

/* ─── SCROLL REVEAL ──────────────────────────────────────────────────── */
.reveal{opacity:0;transform:translateY(32px);transition:opacity 0.6s ease,transform 0.6s ease}
.reveal.visible{opacity:1;transform:none}