:root {
  /* Пропорции макета 1440px */
  --design-width: 1440;
  --content-width: 1280;
  --content-ratio: calc(var(--content-width) / var(--design-width)); /* ~88.89% */
  --side-ratio: calc((var(--design-width) - var(--content-width)) / var(--design-width) / 2); /* ~5.56% */

  /* Верхняя граница контента: на 4K контент не растягивается бесконечно */
  --container-cap: 80rem; /* 1280px при 16px root */

  /* Безопасные отступы на узких экранах */
  --gutter-min: 1.25rem;

  /* Фон сайта и панелей — F7F1EA */
  --color-bg: #f7f1ea;
  --color-text: #2b2b2b;
  --color-text-muted: #6f6a66;
  --color-gold-start: #c9a96e;
  --color-gold-end: #d8c3a5;
  --color-gold-border: #d8c3a5;

  /* Типографика */
  --font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-size-base: clamp(0.9375rem, 0.875rem + 0.25vw, 1rem);
  --line-height-base: 1.5;

  /* Размеры из макета 1440px */
  --text-nav: clamp(0.875rem, calc(16 / var(--design-width) * 100vw), 1rem);
  --text-hours: clamp(0.625rem, calc(11 / var(--design-width) * 100vw), 0.6875rem);
  --text-hero-title: clamp(1.75rem, calc(40 / var(--design-width) * 100vw), 2.5rem);
  --text-hero-body: clamp(0.8125rem, calc(15 / var(--design-width) * 100vw), 0.9375rem);
  --text-hero-stat: clamp(1.75rem, calc(40 / var(--design-width) * 100vw), 2.5rem);
  --text-hero-stat-label: clamp(0.875rem, calc(16 / var(--design-width) * 100vw), 1rem);

  /* Градиент */
  --gradient-gold: linear-gradient(90deg, var(--color-gold-start), var(--color-gold-end));
  --gradient-footer: linear-gradient(180deg, #dec29c 0%, #f7debb 100%);

  /* Кнопки */
  --radius-btn: clamp(0.5rem, calc(10 / var(--design-width) * 100vw), 0.625rem);

  /* Текстура первого экрана (2880×1642) */
  --texture-width: 2880;
  --texture-height: 1642;
  --texture-ratio: calc(var(--texture-height) / var(--texture-width));
  --texture-display-height: calc(100vw * var(--texture-ratio));
  /* Второй экран: значения из Figma @1440 → calc(N / var(--design-width) * 100vw) */
  --page-sheet-gap-1440: 115;
  --page-sheet-underlap-1440: 24;
  --page-sheet-radius-1440: 80;

  --page-sheet-gap: clamp(
    1.75rem,
    calc(var(--page-sheet-gap-1440) / var(--design-width) * 100vw),
    calc(var(--page-sheet-gap-1440) * 1rem / 16)
  );
  --page-sheet-texture-underlap: clamp(
    0.625rem,
    calc(var(--page-sheet-underlap-1440) / var(--design-width) * 100vw),
    calc(var(--page-sheet-underlap-1440) * 1rem / 16)
  );
  --page-sheet-radius: clamp(
    1.25rem,
    calc(var(--page-sheet-radius-1440) / var(--design-width) * 100vw),
    calc(var(--page-sheet-radius-1440) * 1rem / 16)
  );
  --page-top-texture-extra-1440: 48;
  --page-top-texture-extra: clamp(
    1rem,
    calc(var(--page-top-texture-extra-1440) / var(--design-width) * 100vw),
    3rem
  );
  --service-detail-texture-reach-1440: 56;
  --service-detail-texture-reach: clamp(
    1.25rem,
    calc(var(--service-detail-texture-reach-1440) / var(--design-width) * 100vw),
    3.5rem
  );

  /* Шапка: отступ всей шапки от верха макета */
  --header-offset-top: clamp(1.25rem, calc(59 / var(--design-width) * 100vw), 3.6875rem);

  /* Акции */
  --text-promo-title: var(--text-hero-title);
  --text-promo-lead: clamp(0.875rem, calc(16 / var(--design-width) * 100vw), 1rem);
  --promo-card-radius: clamp(1rem, calc(24 / var(--design-width) * 100vw), 1.5rem);
  --promo-card-gap-1440: 40;
  --promo-card-gap: clamp(
    1rem,
    calc(var(--promo-card-gap-1440) / var(--design-width) * 100vw),
    calc(var(--promo-card-gap-1440) * 1rem / 16)
  );

  /* Услуги */
  --service-card-light: #c4b59a;
  --service-card-width-1440: 323;
  --service-card-height-1440: 282;
  --service-card-padding: clamp(1rem, calc(24 / var(--design-width) * 100vw), 1.5rem);
  --service-card-arrow-size: clamp(2.5rem, calc(48 / var(--design-width) * 100vw), 3rem);

  /* Страница услуги — hero */
  --service-detail-photo-aspect-w: 564;
  --service-detail-photo-aspect-h: 423;

  /* Врачи — пропорции из макета */
  --doctor-photo-aspect-w: 564;
  --doctor-photo-aspect-h: 641;
  --doctor-photo-col-ratio: calc(var(--doctor-photo-aspect-w) / var(--content-width));
  --doctor-divider-ratio: calc(100 / var(--content-width));
  --doctor-tile-aspect-w: 290;
  --doctor-tile-aspect-h: 380;

  /* Брейкпоинты (только в @media; в clamp не подставляются) */
  --bp-sm: 700px;
  --bp-md: 900px;
  --bp-lg: 1100px;
  --gallery-card-aspect-w: 319;
  --gallery-card-aspect-h: 280;
  --gallery-card-radius: clamp(0.5rem, calc(10 / var(--design-width) * 100vw), 0.625rem);
}
