/* ============================================
   GRAND VISION — MASTER DESIGN TOKENS
   ============================================ */

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

body {
  font-family: 'Montserrat', sans-serif;
  -webkit-font-smoothing: antialiased;
}

a {
  text-decoration: none;
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

:root {
  /* --- Colors --- */
  --gv-navy:          #1a2744;
  --gv-navy-deep:     #152035;
  --gv-navy-dark:     #0f1c35;
  --gv-gold:          #c9a84c;
  --gv-gold-hover:    #d4b45e;
  --gv-gold-muted:    rgba(201, 168, 76, 0.25);
  --gv-gold-rule:     rgba(201, 168, 76, 0.35);
  --gv-white:         #ffffff;
  --gv-cream:         #f8f5f0;
  --gv-text-bright:   rgba(255, 255, 255, 0.92);
  --gv-text-body:     rgba(255, 255, 255, 0.78);
  --gv-text-muted:    rgba(255, 255, 255, 0.52);

  /* --- Wealth Fund Colors --- */
  --wf-navy:          #253551;
  --wf-gold:          #BD9C1C;
  --wf-gold-hover:    #E4BC23;

  /* --- Cash Flow Colors --- */
  --cf-gold:          #C9A84C;
  --cf-gold-hover:    #d4b45e;

  /* --- Typography --- */
  --gv-serif:         'Cormorant Garamond', serif;
  --gv-sans:          'Montserrat', sans-serif;
  --gv-inter:         'Inter', sans-serif;
  --gv-merri:         'Merriweather', serif;

  /* --- Font Sizes --- */
  --gv-eyebrow:       11px;
  --gv-h1:            80px;
  --gv-h2:            52px;
  --gv-h3:            28px;
  --gv-body:          15px;
  --gv-small:         13px;
  --gv-cta:           11px;

  /* --- Font Weights --- */
  --gv-light:         300;
  --gv-regular:       400;
  --gv-medium:        500;
  --gv-bold:          600;

  /* --- Spacing --- */
  --gv-section-v:     80px;
  --gv-section-h:     40px;
  --gv-max-width:     1100px;
  --gv-col-gap:       64px;

  /* --- Radii --- */
  --gv-radius:        3px;
  --gv-radius-card:   6px;
  --gv-rule-gold:     1px solid rgba(201, 168, 76, 0.35);
  --gv-rule-white:    1px solid rgba(255, 255, 255, 0.10);
}

/* --- Mobile Overrides --- */
@media (max-width: 768px) {
  :root {
    --gv-h1:          52px;
    --gv-h2:          38px;
    --gv-section-v:   56px;
    --gv-section-h:   24px;
    --gv-col-gap:     32px;
  }
}

@media (max-width: 480px) {
  :root {
    --gv-h1:          40px;
    --gv-h2:          30px;
  }
}