/* ==========================================================================
   CSS-NEW.CSS
   Second template skin — new palette, type, radii, shadows on top of
   variables.css / style.css. Load after responsive.css.
   ========================================================================== */

:root {
  --color-deep-forest: #0F1B33;
  --color-stone: #C9D2E0;
  --color-cream: #F5F7FA;
  --color-graphite: #1B2436;
  --color-accent-green: #2E5AAC;

  --color-bg: #F8FAFC;
  --color-bg-alt: #EEF4F8;
  --color-surface: #FFFFFF;
  --color-text: #17212B;
  --color-text-muted: #65717E;
  --color-text-on-dark: #F8FAFC;
  --color-text-on-dark-muted: rgba(248, 250, 252, 0.74);
  --color-border: #E3E9EF;
  --color-border-on-dark: rgba(248, 250, 252, 0.18);
  --color-accent: #A7D3E8;
  --color-overlay-dark: rgba(23, 33, 43, 0.55);

  --font-heading: 'Manrope', -apple-system, 'Segoe UI', sans-serif;
  --font-body: 'Manrope', -apple-system, 'Segoe UI', Helvetica, Arial, sans-serif;

  --shadow-sm: 0 2px 6px rgba(23, 33, 43, 0.06);
  --shadow-md: 0 16px 40px -18px rgba(47, 93, 140, 0.28);

  --radius-sm: 10px;
  --radius-md: 16px;
}

.btn-primary:hover,
.btn-dark:hover {
  background-color: #234A72;
}

.card-grid > *,
.service-card,
.condition-card,
.testimonial-card,
.team-card {
  box-shadow: var(--shadow-md);
  border: 1px solid var(--color-border);
}

.site-header.is-scrolled,
.site-header.is-solid {
  box-shadow: var(--shadow-sm);
}

section:nth-of-type(even) {
  background-color: var(--color-bg-alt);
}

section.cta-band {
  background-color: #0F1B33;
}