/* reset.css — normalize + box-sizing + custom properties globales */

*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  scroll-behavior: smooth;
  font-size: 16px;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  min-height: 100vh;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

img, svg, video, canvas {
  display: block;
  max-width: 100%;
}

input, button, textarea, select {
  font: inherit;
}

a {
  text-decoration: none;
  color: inherit;
}

ul, ol {
  list-style: none;
}

button {
  cursor: pointer;
  background: none;
  border: none;
}

h1, h2, h3, h4 {
  line-height: 1.1;
}

/* ======================================================
   CUSTOM PROPERTIES — única fuente de verdad para diseño
   ====================================================== */
:root {
  /* --- Colores base --- */
  --gold:          #C9A84C;
  --gold-light:    #E2C97E;
  --gold-dim:      rgba(201, 168, 76, 0.12);
  --gold-border:   rgba(201, 168, 76, 0.28);
  --gold-glow:     rgba(201, 168, 76, 0.20);

  --white:         #F5F5F5;
  --white-dim:     rgba(245, 245, 245, 0.50);
  --white-subtle:  rgba(245, 245, 245, 0.07);
  --white-faint:   rgba(245, 245, 245, 0.03);

  --dark-bg:       #090909;
  --dark-surface:  #111111;
  --dark-card:     #161616;
  --dark-elevated: #1d1d1d;

  --border-subtle: rgba(255, 255, 255, 0.07);
  --border-mid:    rgba(255, 255, 255, 0.12);

  --error:         #E05252;
  --error-dim:     rgba(224, 82, 82, 0.12);

  /* --- Tipografía --- */
  --font-display:  'Montserrat', system-ui, sans-serif;
  --font-body:     system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono:     'JetBrains Mono', 'Courier New', monospace;

  /* --- Espaciado --- */
  --sp-xs:   0.5rem;    /*  8px */
  --sp-sm:   1rem;      /* 16px */
  --sp-md:   1.5rem;    /* 24px */
  --sp-lg:   2rem;      /* 32px */
  --sp-xl:   3rem;      /* 48px */
  --sp-2xl:  5rem;      /* 80px */
  --sp-3xl:  8rem;      /* 128px */

  /* --- Layout --- */
  --container-max: 1200px;
  --container-pad: 1.5rem;
  --nav-h:         72px;

  /* --- Radio de bordes --- */
  --r-xs:  3px;
  --r-sm:  5px;
  --r-md:  10px;
  --r-lg:  18px;
  --r-xl:  28px;

  /* --- Transiciones --- */
  --ease-out:    cubic-bezier(0.2, 0.9, 0.3, 1);
  --ease-inout:  cubic-bezier(0.4, 0, 0.2, 1);
  --t-fast:      160ms;
  --t-med:       320ms;
  --t-slow:      560ms;
  --t-xslow:     860ms;
}