/* CPH Design System — generated */
:root {
  --ds-primary:      #2D3E35;
  --ds-secondary:    #5C7A6E;
  --ds-accent:       #E8C5B0;
  --ds-bg:           #FAF6F1;
  --ds-surface:      #F0EBE3;
  --ds-text:         #2D3E35;
  --ds-muted:        #8B7355;
  --ds-font-heading: 'Cormorant Garamond', serif;
  --ds-font-body:    'DM Sans', sans-serif;
  /* Spacing scale */
  --sp-tight:    8px;
  --sp-snug:     12px;
  --sp-standard: 16px;
  --sp-relaxed:  24px;
  --sp-generous: 40px;
  --sp-section:  64px;
}

body { font-family: var(--ds-font-body); color: var(--ds-text); background: var(--ds-bg); }
h1,h2,h3,h4,h5,h6 { font-family: var(--ds-font-heading); }

/* ── Spacing scale — widget breathing room ──────────────────────────
   Margin-bottom on cph- classes creates intelligent rhythm without
   uniform flex_gap fighting with spacers. */
.cph-label         { margin-bottom: var(--sp-tight) !important; }
.cph-heading       { margin-bottom: var(--sp-snug)  !important; }
.cph-subheading    { margin-bottom: var(--sp-standard) !important; }
.cph-text          { margin-bottom: 0 !important; }
.cph-btn,
.cph-btn-outline   { margin-top: var(--sp-relaxed) !important; }
.cph-list          { margin-bottom: var(--sp-standard) !important; }
.cph-divider       { margin-top: var(--sp-snug) !important; margin-bottom: var(--sp-snug) !important; }

/* ── Type scale — clamp-based fluid sizing ──────────────────────────
   Clamps ensure headings never break on any screen size. */
.elementor-widget-heading h1.elementor-heading-title { font-size: clamp(2.5rem, 5.5vw, 4.5rem); }
.elementor-widget-heading h2.elementor-heading-title { font-size: clamp(1.85rem, 3.5vw, 2.75rem); }
.elementor-widget-heading h3.elementor-heading-title { font-size: clamp(1.5rem, 2.8vw, 2.25rem); }
.elementor-widget-heading h4.elementor-heading-title { font-size: clamp(1.1rem, 1.8vw, 1.5rem); }
.elementor-widget-heading h5.elementor-heading-title { font-size: clamp(1rem,   1.4vw, 1.2rem); }
.elementor-widget-heading h6.elementor-heading-title { font-size: clamp(0.875rem, 1.2vw, 1rem); }

/* ── Responsive layout overrides ────────────────────────────────────
   Reduce inter-column gap and section padding at smaller breakpoints.
   These complement Elementor's own responsive settings. */
@media (max-width: 1024px) {
  .elementor-section-boxed > .elementor-container,
  .e-con-inner { padding-left: 32px !important; padding-right: 32px !important; }
  .e-con { gap: 24px !important; }
}
@media (max-width: 767px) {
  .elementor-section-boxed > .elementor-container,
  .e-con-inner { padding-left: 20px !important; padding-right: 20px !important; }
  .e-con { gap: 16px !important; flex-direction: column !important; }
  .e-con > .e-con { width: 100% !important; }
  .cph-btn, .cph-btn-outline { width: 100%; text-align: center; }
  .cph-label { margin-bottom: var(--sp-tight) !important; }
}

