/* ═══════════════════════════════════════════════════════════════
   GnosticWay — base.css
   Variables, reset, typography
═══════════════════════════════════════════════════════════════ */

/* ─── DESIGN TOKENS ─────────────────────────────────────────── */
:root {
  /* Core palette */
  --gw-bg:           #f8f6f1;    /* warm off-white — parchment feel */
  --gw-bg-alt:       #f0ece3;    /* slightly darker — section dividers */
  --gw-bg-dark:      #1a1a2e;    /* deep navy — header / hero */
  --gw-bg-mid:       #2d2b55;    /* mid purple — sub-headers, accents */
  --gw-bg-card:      #ffffff;    /* card backgrounds */

  --gw-gold:         #c9a84c;    /* ancient gold — primary accent */
  --gw-gold-light:   #e8d5a3;    /* pale gold — borders, dividers */
  --gw-gold-dark:    #a07830;    /* deep gold — hover states */

  --gw-text:         #2c2c2c;    /* near-black body text */
  --gw-text-light:   #f0ece0;    /* light text on dark backgrounds */
  --gw-text-muted:   #6b6b6b;    /* secondary/caption text */
  --gw-text-mid:     #4a4866;    /* mid purple-grey — lead paragraphs */

  --gw-link:         #5c3d8f;    /* purple links */
  --gw-link-hover:   #c9a84c;    /* gold on hover */
  --gw-link-visited: #7a5aaa;

  --gw-border:       #e0d8c8;    /* warm border */
  --gw-border-dark:  #3d3b6e;    /* dark border (on dark bg) */

  --gw-green:        #2d7a2d;    /* success / easy */
  --gw-yellow:       #856404;    /* warning / medium */
  --gw-red:          #721c24;    /* error / hard */

  /* Typography */
  --font-heading: 'Playfair Display', 'Georgia', serif;
  --font-body:    'Source Serif 4', 'Georgia', 'Times New Roman', serif;
  --font-ui:      'Inter', 'Segoe UI', system-ui, sans-serif;
  --font-mono:    'Courier New', 'Courier', monospace;

  /* Scale */
  --text-xs:   0.75rem;
  --text-sm:   0.875rem;
  --text-base: 1rem;
  --text-lg:   1.125rem;
  --text-xl:   1.25rem;
  --text-2xl:  1.5rem;
  --text-3xl:  1.875rem;
  --text-4xl:  2.25rem;
  --text-5xl:  3rem;

  /* Spacing */
  --sp-1:  4px;
  --sp-2:  8px;
  --sp-3:  12px;
  --sp-4:  16px;
  --sp-5:  20px;
  --sp-6:  24px;
  --sp-8:  32px;
  --sp-10: 40px;
  --sp-12: 48px;
  --sp-16: 64px;
  --sp-20: 80px;

  /* Layout */
  --max-w:         1200px;
  --content-w:     720px;
  --sidebar-w:     300px;
  --article-gap:   56px;
  --radius:        4px;
  --radius-lg:     8px;

  /* Shadows */
  --shadow-sm:  0 1px 3px rgba(26,26,46,.08);
  --shadow-md:  0 4px 16px rgba(26,26,46,.10);
  --shadow-lg:  0 8px 32px rgba(26,26,46,.14);

  /* Transitions */
  --transition: 0.18s ease;
}

/* ─── RESET ─────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { min-height: 100vh; }
img, video, svg { display: block; max-width: 100%; height: auto; }
input, button, textarea, select { font: inherit; }
p, h1, h2, h3, h4, h5, h6 { overflow-wrap: break-word; }
a { color: inherit; text-decoration: none; }
ul, ol { list-style: none; }

/* ─── BASE TYPOGRAPHY ────────────────────────────────────────── */
body {
  font-family:    var(--font-body);
  font-size:      var(--text-lg);
  line-height:    1.75;
  color:          var(--gw-text);
  background:     var(--gw-bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Headings */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
  color:       var(--gw-bg-dark);
  line-height: 1.2;
  font-weight: 700;
}

h1 { font-size: clamp(1.75rem, 4vw, 2.75rem); }
h2 { font-size: clamp(1.35rem, 3vw, 1.875rem); }
h3 { font-size: clamp(1.1rem,  2.5vw, 1.375rem); }
h4 { font-size: 1.1rem; }
h5 { font-size: 1rem; }
h6 { font-size: var(--text-sm); text-transform: uppercase; letter-spacing: .06em; }

/* Paragraphs */
p { margin-bottom: 1.25rem; }
p:last-child { margin-bottom: 0; }

/* Lead */
.gw-lead {
  font-size:   var(--text-xl);
  line-height: 1.65;
  color:       var(--gw-text-mid);
  font-weight: 400;
}

/* Links */
a {
  color:           var(--gw-link);
  text-decoration: underline;
  text-underline-offset: 2px;
  transition:      color var(--transition);
}
a:hover   { color: var(--gw-link-hover); text-decoration: none; }
a:visited { color: var(--gw-link-visited); }

/* Strong / em */
strong, b { font-weight: 700; }
em, i     { font-style: italic; }

/* Small / caption */
small, .gw-small {
  font-size:   var(--text-sm);
  font-family: var(--font-ui);
  color:       var(--gw-text-muted);
}

/* Inline code */
code {
  font-family:      var(--font-mono);
  font-size:        .9em;
  background:       rgba(45,43,85,.07);
  padding:          2px 6px;
  border-radius:    var(--radius);
}

/* Blockquote (generic — gw-passage is for Gnostic texts) */
blockquote {
  border-left:  4px solid var(--gw-gold-light);
  padding:      var(--sp-4) var(--sp-6);
  margin:       var(--sp-6) 0;
  font-style:   italic;
  color:        var(--gw-text-mid);
  background:   var(--gw-bg-alt);
  border-radius: 0 var(--radius) var(--radius) 0;
}

/* HR */
hr {
  border:        none;
  border-top:    1px solid var(--gw-border);
  margin:        var(--sp-8) 0;
}

/* ─── UTILITY CLASSES ────────────────────────────────────────── */
.gw-sr-only {
  position: absolute; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}
.gw-text-center { text-align: center; }
.gw-text-muted  { color: var(--gw-text-muted); }
.gw-gold        { color: var(--gw-gold); }
.gw-mt-0        { margin-top: 0 !important; }

/* ─── GOOGLE FONTS (loaded via functions.php wp_head) ────────── */
/* Fonts are loaded via @import in layout.css for performance */