/* Дизайн-токены v2 «Парящие карточки» (источник: design/v2/design-system.md) */
:root {
  /* Палитра: Lactic / Sand / Terracotta / Brown */
  --c-bg: #EFE5D3;
  --c-card: #F8F2E8;
  --c-card-hi: #FCF8F1;
  --c-sand: #D1BEAF;
  --c-sand-hi: #DBCBBE;
  --c-terra: #7D3722;
  --c-terra-hi: #94452D;
  --c-brown: #442318;
  --c-brown-hi: #5A3122;
  --c-text: #442318;
  --c-text-2: #6E4A3B;
  --c-on-dark: #FBF6EE;
  --c-on-dark-2: #D1BEAF;
  --c-glow: #F2A25C;
  --c-line: rgba(68, 35, 24, 0.12);
  --c-line-dark: rgba(251, 246, 238, 0.16);

  /* Поверхности */
  --surface-card: linear-gradient(180deg, var(--c-card-hi) 0%, var(--c-card) 100%);
  --surface-sand: linear-gradient(180deg, var(--c-sand-hi) 0%, var(--c-sand) 100%);
  --surface-terra: linear-gradient(160deg, var(--c-terra-hi) 0%, var(--c-terra) 70%);
  --surface-brown: linear-gradient(160deg, var(--c-brown-hi) 0%, var(--c-brown) 70%);

  /* Шрифты */
  --font-serif: "Cormorant Garamond", "Times New Roman", serif;
  --font-sans: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;

  /* Типографика (мобильный → десктоп) */
  --fs-h1: clamp(2.75rem, 1.2rem + 5.2vw, 5.5rem);
  --fs-h2: clamp(2.25rem, 1.6rem + 2.4vw, 3.5rem);
  --fs-h3: clamp(1.75rem, 1.6rem + 0.6vw, 2rem);
  --fs-quote: clamp(2rem, 1.4rem + 2vw, 3rem);
  --fs-price: clamp(3rem, 2.4rem + 2.2vw, 4.5rem);
  --fs-body: clamp(1rem, 0.95rem + 0.25vw, 1.125rem);
  --lh-body: 1.67;
  --fs-small: 0.9375rem;
  --fs-caption: 0.8125rem;
  --fs-button: 1rem;
  --fs-eyebrow: 0.75rem;

  /* Отступы */
  --container: 1312px;
  --gutter: 24px;
  --section-y: clamp(64px, 3rem + 2.8vw, 96px);
  --card-pad: clamp(24px, 1rem + 2.2vw, 48px);
  --header-h: 88px;

  /* Форма */
  --r-xl: 32px;
  --r-lg: 24px;
  --r-pill: 999px;

  /* Глубина: карточки парят над фоном */
  --shadow-float:
    0 1px 1px rgba(68, 35, 24, 0.05),
    0 6px 12px -6px rgba(68, 35, 24, 0.14),
    0 16px 30px -14px rgba(68, 35, 24, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.8);
  --shadow-float-lg:
    0 2px 2px rgba(68, 35, 24, 0.05),
    0 12px 24px -12px rgba(68, 35, 24, 0.22),
    0 30px 56px -28px rgba(68, 35, 24, 0.30),
    inset 0 1px 0 rgba(255, 255, 255, 0.85);
  --shadow-dark:
    0 2px 2px rgba(68, 35, 24, 0.10),
    0 14px 28px -12px rgba(68, 35, 24, 0.32),
    0 32px 60px -28px rgba(68, 35, 24, 0.42),
    inset 0 1px 0 rgba(255, 255, 255, 0.12);
  --shadow-press:
    0 1px 2px rgba(68, 35, 24, 0.12),
    0 4px 10px -4px rgba(68, 35, 24, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.5);
  --glow-dot: 0 0 0 3px rgba(242, 162, 92, 0.18), 0 0 14px 3px rgba(242, 162, 92, 0.55);
  --focus-ring: 0 0 0 3px var(--c-bg), 0 0 0 5px var(--c-terra);

  /* Движение: только нажатие */
  --t-press: 120ms cubic-bezier(0.2, 0.7, 0.3, 1);
  /* Раскрытие блоков: движение распределено ровно, без рывка в первых кадрах */
  --t-expand: 420ms;
  --ease-expand: cubic-bezier(0.3, 0.15, 0.2, 1);
}

@media (max-width: 767px) {
  :root {
    --gutter: 16px;
    --r-xl: 24px;
    --r-lg: 20px;
    --header-h: 76px;
  }
}
