/*
Theme Name:  SAT Colorado
Theme URI:   https://colorado.satsoccer.com
Author:      SAT Colorado
Author URI:  https://colorado.satsoccer.com
Description: Minimal Elementor container theme for SAT Colorado. Full-width blank canvas — all design is handled via Elementor HTML widgets. Dark background, gold accents.
Version:     1.0.0
License:     GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: sat-colorado
Tags:        elementor, full-width, blank, membership, dark

This theme is a clean container. It loads global fonts and CSS variables
so all Elementor HTML widgets share a consistent design system.
Do NOT add layout styles here — keep all design in the widgets.
*/

/* ─────────────────────────────────────────────────────
   GLOBAL DESIGN TOKENS — shared across ALL widgets
   ───────────────────────────────────────────────────── */
:root {
  --gold:         #CDA655;
  --gold-light:   #E8C87A;
  --gold-dim:     rgba(205, 166, 85, 0.12);
  --gold-border:  rgba(205, 166, 85, 0.28);
  --bg:           #080808;
  --bg-card:      #0f0f0f;
  --bg-elevated:  #141414;
  --bg-input:     #111111;
  --text:         #f2f2f2;
  --text-muted:   #888888;
  --text-dim:     #444444;
  --white:        #ffffff;
  --error:        #c0392b;
  --success:      #27ae60;

  /* Typography scale */
  --font-display: 'Bebas Neue', sans-serif;
  --font-heading: 'Oswald', sans-serif;
  --font-body:    'Barlow Condensed', sans-serif;
}

/* ─────────────────────────────────────────────────────
   BASE RESET
   ───────────────────────────────────────────────────── */
*, *::before, *::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  padding: 0;
  background: var(--bg);
  color: var(--text);
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

/* Remove default Elementor/WordPress margins */
.elementor-section,
.elementor-container,
.elementor-widget-wrap {
  padding: 0 !important;
}

/* Full-width sections */
.elementor-section.elementor-section-full_width .elementor-container {
  max-width: 100%;
}

a {
  color: var(--gold);
  text-decoration: none;
}

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

/* Utility: hide on mobile */
@media (max-width: 768px) {
  .hide-mobile { display: none !important; }
}

/* Utility: hide on desktop */
@media (min-width: 769px) {
  .hide-desktop { display: none !important; }
}