/* PAX Family Solutions — Shared base styles
 * Tokens, reusable atoms, and shared UI components.
 * Loaded on all PAX page templates via functions.php.
 *
 * Fonts required (loaded by functions.php when on a PAX template):
 *   Cormorant Garamond — headings / display
 *   DM Sans            — body copy / UI
 *   Space Mono         — labels / metadata
 * ------------------------------------------------------------------ */

/* ---- Smooth scroll ---- */
html { scroll-behavior: smooth; }

/* ---- Global tokens ---- */
:root {
  --pax-teal-deep:   #0D3B44;
  --pax-teal-mid:    #1B5E6E;
  --pax-teal-accent: #3A9CAD;
  --pax-orange:      #ED7E36;
  --pax-orange-dark: #d96e28;
  --pax-red:         #C75023;
  --pax-cream:       #F7F4F0;
  --pax-fg:          #e2eeef;
  --pax-fg-bright:   #f0f8f9;
}

/* ====== Section atoms ====== */
.pax-section-label {
  font-family: 'Space Mono', monospace;
  font-size: 11px; letter-spacing: 0.25em; text-transform: uppercase;
  color: var(--pax-teal-accent); margin-bottom: 16px;
}

.pax-section-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(40px, 5vw, 60px);
  font-weight: 300; line-height: 1.05;
  color: var(--pax-fg-bright); margin-bottom: 16px;
}
.pax-section-title em { font-style: italic; color: var(--pax-orange); }

.pax-section-body {
  font-size: 17px; line-height: 1.8;
  color: rgba(226,238,239,0.65);
  max-width: 560px; margin-bottom: 64px;
}

@media (max-width: 768px) {
  .pax-section-body { font-size: 16px; }
}
@media (max-width: 480px) {
  .pax-section-body { font-size: 15px; }
}

/* ====== Buttons ====== */
.pax-btn-primary {
  background: var(--pax-orange); color: #fff;
  font-size: 15px; font-weight: 600;
  letter-spacing: 0.08em; text-transform: uppercase;
  padding: 16px 36px;
  text-decoration: none; display: inline-block;
  transition: background 0.2s;
}
.pax-btn-primary:hover { background: var(--pax-orange-dark); color: #fff; }

.pax-btn-green {
  background: #27AE60; color: #fff;
  font-size: 15px; font-weight: 600;
  letter-spacing: 0.08em; text-transform: uppercase;
  padding: 16px 36px;
  text-decoration: none; display: inline-block;
  transition: background 0.2s;
}
.pax-btn-green:hover { background: #1E8449; color: #fff; }

.pax-btn-ghost {
  background: transparent;
  color: rgba(226,238,239,0.7);
  font-size: 15px; font-weight: 400; letter-spacing: 0.06em;
  padding: 16px 28px;
  border: 1px solid rgba(58,156,173,0.35);
  text-decoration: none; display: inline-block;
  transition: all 0.2s;
}
.pax-btn-ghost:hover { border-color: var(--pax-teal-accent); color: var(--pax-fg-bright); }

.pax-btn-orange-outline {
  background: transparent; color: var(--pax-orange);
  font-size: 14px; font-weight: 600;
  letter-spacing: 0.1em; text-transform: uppercase;
  padding: 16px 32px;
  border: 1px solid var(--pax-orange);
  white-space: nowrap; text-decoration: none; display: inline-block;
  transition: all 0.2s;
}
.pax-btn-orange-outline:hover { background: var(--pax-orange); color: #fff; }