/**
 * Motion Clinic — paletă finală (bleumarin + albastru medical, gradiente clare).
 * Text alb pe toate suprafețele cu gradient CTA.
 */
:root {
  --color-primary: #050b33;
  --color-primary-hover: #0a2b58;

  --color-secondary: #05267b;
  --color-secondary-hover: #0c3166;

  --color-white: #ffffff;

  /* Gradient principal + hover (trecere clară de ton) */
  --gradient-primary: linear-gradient(135deg, #050b33 0%, #05267b 100%);
  --gradient-primary-hover: linear-gradient(135deg, #050b33 0%, #0c3166 100%);

  /* Gradient secundar (footer / CTA premium pe fundal închis) */
  --gradient-secondary: linear-gradient(135deg, #0a2b58 0%, #05267b 100%);
  --gradient-secondary-hover: linear-gradient(135deg, #05267b 0%, #0c3166 100%);

  /* Gradient foarte dark / sobru */
  --gradient-dark: linear-gradient(135deg, #050b33 0%, #0a2b58 100%);
  --gradient-dark-hover: linear-gradient(135deg, #050b33 0%, #0c3166 100%);

  /* Gradient „medical” (mai puțin black-navy) — carduri accent / icon bg */
  --gradient-alt: linear-gradient(135deg, #0a2b58 0%, #05267b 100%);

  /* Text: titluri #050b33; paragrafe — neutru ușor de citit */
  --color-text: #243040;
  --color-text-secondary: #0a2b58;
  --color-text-light: rgba(10, 43, 88, 0.55);

  --color-surface-soft: #f4f8ff;
  --color-border: #e5eaf3;
  --color-border-input: #cfd8e8;

  --color-footer-link: #ffffff;
  --color-footer-link-hover: #d7e4ff;
  --color-footer-divider: rgba(255, 255, 255, 0.15);
  --color-footer-muted: rgba(255, 255, 255, 0.82);

  --shadow-card: 0 8px 24px rgba(5, 11, 51, 0.08);
  --shadow-card-hover: 0 12px 32px rgba(5, 11, 51, 0.12);
  --shadow-cta: 0 10px 28px rgba(5, 11, 51, 0.22);

  --ring-focus: rgba(5, 38, 123, 0.15);

  /* Alias legacy */
  --color-accent: var(--color-secondary);
  --color-accent-soft: var(--color-surface-soft);
  --color-accent-dark: var(--color-primary-hover);
  --color-accent-alt: var(--color-secondary-hover);
  --gradient-soft: var(--color-white);
  --gradient-hero: var(--color-white);

  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --space-xs: 0.5rem;
  --space-sm: 0.75rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2rem;
  --space-2xl: 3rem;
  --font-sans: system-ui, -apple-system, "Segoe UI", Roboto, Ubuntu, "Helvetica Neue", sans-serif;

  /* Tipografie fluidă: mobil → tablet → desktop → 4K (fără salturi bruște). */
  --text-fluid-hero: clamp(1.55rem, 2.4vw + 1rem, 3.75rem);
  --text-fluid-h2: clamp(1.2rem, 1.35vw + 0.82rem, 2.35rem);
  --text-fluid-h3: clamp(1.05rem, 0.65vw + 0.88rem, 1.45rem);
  /* Corp + paragrafe: interval mai larg ca pe ecrane mari să nu rămână „mic”. */
  --text-fluid-body: clamp(0.9375rem, 0.22vw + 0.86rem, 1.1875rem);
  --text-fluid-lead: clamp(1rem, 0.42vw + 0.88rem, 1.28rem);
  --text-fluid-nav: clamp(0.8125rem, 0.2vw + 0.74rem, 1rem);
  --text-fluid-sm: clamp(0.8125rem, 0.16vw + 0.76rem, 0.9375rem);
  --text-fluid-xs: clamp(0.6875rem, 0.1vw + 0.66rem, 0.8125rem);
  /* Alias folosite în fișiere mai vechi */
  --text-sm: var(--text-fluid-sm);
  --text-xs: var(--text-fluid-xs);

  /* Layout: îngust pe telefon, scalează până la 4K fără „bandă” prea îngustă */
  --layout-max-width: 70rem;
  --layout-gutter-x: clamp(0.75rem, 2.5vw + 0.35rem, 2.75rem);
  /* Lățimi „proză” / blocuri centrate — aceeași coloană vizuală pe tot site-ul */
  --layout-prose: 42rem;
  --layout-prose-wide: 44rem;
  /* Hartă, tabele late, embed-uri */
  --layout-media: 48rem;
  /* Card pe o singură coloană (înainte de breakpoint-uri multi-col) */
  --home-card-single-max: min(22rem, 100%);
  --header-sticky-offset: 3.5rem;
}

/* QHD / ultrawide / 4K — conținut rămâne lizibil, nu bloc îngust pe mijloc */
@media (min-width: 90rem) {
  :root {
    --layout-max-width: 78rem;
  }
}

@media (min-width: 120rem) {
  :root {
    --layout-max-width: 88rem;
  }
}

@media (min-width: 160rem) {
  :root {
    --layout-max-width: min(96rem, 92vw);
  }
}

/* Ultra-wide / 4K+: limite superioare ușor mai mari (titluri + corp). */
@media (min-width: 100rem) {
  :root {
    --text-fluid-hero: clamp(1.85rem, 2.2vw + 1.05rem, 4.25rem);
    --text-fluid-h2: clamp(1.28rem, 1.1vw + 0.95rem, 2.6rem);
    --text-fluid-body: clamp(0.95rem, 0.18vw + 0.88rem, 1.22rem);
    --text-fluid-lead: clamp(1.02rem, 0.35vw + 0.9rem, 1.32rem);
  }
}

