/* ============================================================
   HitTheSurf.com — Custom CSS
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@300;400;500;600;700&family=Raleway:wght@300;400;500;600&display=swap');

:root {
  --navy:      #0B1626;
  --navy-mid:  #132035;
  --navy-deep: #070F1A;
  --gold:      #C49A3C;
  --gold-light:#D4AE5A;
  --white:     #FFFFFF;
  --off-white: #D8D8D8;
}

/* ---- GLOBAL ---- */
body { font-family: 'Raleway', sans-serif; }
h1, h2, h3, h4, h5, h6 { font-family: 'Oswald', sans-serif; text-transform: uppercase; letter-spacing: 0.05em; }

/* ---- NAV ---- */
.elementor-nav-menu--main .elementor-item {
  font-family: 'Oswald', sans-serif !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
  color: rgba(255,255,255,0.85) !important;
}
.elementor-nav-menu--main .elementor-item:hover,
.elementor-nav-menu--main .elementor-item-active {
  color: #C49A3C !important;
}

/* ---- HERO SECTION ---- */
/* "LEADERSHIP THROUGH" — small eyebrow */
.hero-eyebrow,
.elementor-widget-heading h2.hero-eyebrow,
h2.hero-eyebrow {
  font-family: 'Oswald', sans-serif !important;
  font-size: clamp(13px, 1.4vw, 20px) !important;
  font-weight: 300 !important;
  letter-spacing: 0.35em !important;
  text-transform: uppercase !important;
  color: rgba(255,255,255,0.9) !important;
  margin-bottom: 2px !important;
}

/* "ADVERSITY" — dominant gold headline */
.hero-headline,
.elementor-widget-heading h1.hero-headline,
h1.hero-headline {
  font-family: 'Oswald', sans-serif !important;
  font-size: clamp(80px, 11.5vw, 160px) !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  color: #C49A3C !important;
  line-height: 1 !important;
  margin-bottom: 28px !important;
}

/* Subtext */
.hero-sub,
.elementor-widget-heading p.hero-sub {
  font-family: 'Oswald', sans-serif !important;
  font-size: clamp(10px, 1vw, 13px) !important;
  font-weight: 400 !important;
  letter-spacing: 0.28em !important;
  text-transform: uppercase !important;
  color: rgba(255,255,255,0.82) !important;
  line-height: 2.2 !important;
  margin-bottom: 44px !important;
}

/* ---- GOLD BUTTON ---- */
.elementor-button,
.elementor-button-wrapper .elementor-button {
  font-family: 'Oswald', sans-serif !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.32em !important;
  text-transform: uppercase !important;
}

/* ---- MEDIA BAR ---- */
.media-bar-logo img {
  filter: grayscale(100%) brightness(1.8);
  opacity: 0.55;
  transition: all 0.3s ease;
}
.media-bar-logo img:hover {
  filter: grayscale(0%) brightness(1);
  opacity: 1;
}

/* ---- SECTION LABELS ---- */
.section-label {
  font-family: 'Oswald', sans-serif;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.35em;
  text-transform: uppercase;
  color: #C49A3C;
}

/* ---- FOOTER NAV ---- */
.site-footer a, footer a {
  font-family: 'Oswald', sans-serif;
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.5);
  transition: color 0.2s;
}
.site-footer a:hover, footer a:hover { color: #C49A3C; }