/* ============================================================================
   CardioPower — Design Tokens (концепт «Quiet Power»)
   Дисплейный шрифт: Benzin (кастомный, самохостинг). Body: Inter.
   ========================================================================== */

@font-face { font-family:'Benzin'; src:url('../fonts/Benzin-Medium.woff2') format('woff2'), url('../fonts/Benzin-Medium.woff') format('woff'); font-weight:500; font-style:normal; font-display:swap; }
@font-face { font-family:'Benzin'; src:url('../fonts/Benzin-Semibold.woff2') format('woff2'), url('../fonts/Benzin-Semibold.woff') format('woff'); font-weight:600; font-style:normal; font-display:swap; }
@font-face { font-family:'Benzin'; src:url('../fonts/Benzin-Bold.woff2') format('woff2'), url('../fonts/Benzin-Bold.woff') format('woff'); font-weight:700; font-style:normal; font-display:swap; }
@font-face { font-family:'Benzin'; src:url('../fonts/Benzin-ExtraBold.woff2') format('woff2'), url('../fonts/Benzin-ExtraBold.woff') format('woff'); font-weight:800; font-style:normal; font-display:swap; }
@font-face { font-family:'Benzin'; src:url('../fonts/Benzin-ExtraBold.woff2') format('woff2'), url('../fonts/Benzin-ExtraBold.woff') format('woff'); font-weight:900; font-style:normal; font-display:swap; }
@font-face { font-family:'Benzin'; src:url('../fonts/Benzin-Regular.woff2') format('woff2'), url('../fonts/Benzin-Regular.woff') format('woff'); font-weight:400; font-style:normal; font-display:swap; }

:root {
  /* ---- Brand / Ink (премиум графит) ---- */
  --ink-900: #0F1115;   /* основной тёмный фон, заголовки */
  --ink-850: #14171C;
  --ink-800: #181C22;
  --ink-700: #232830;
  --ink-600: #2E343E;
  --ink-500: #3C434F;

  /* ---- Neutrals (тёплый нейтральный рамп) ---- */
  --paper:   #F7F6F4;   /* основной светлый фон */
  --white:   #FFFFFF;
  --n-100:   #EFEDE9;
  --n-200:   #E3E0DA;
  --n-300:   #CFCBC2;
  --n-400:   #ABA69C;
  --n-500:   #837E74;
  --n-600:   #5C5851;
  --n-700:   #3D3A35;

  /* ---- Accent: фирменный красный CardioPower (из логотипа #D33731) ---- */
  --pulse-400: #E15B55;
  --pulse:     #D33731;  /* основной CTA / акцент — бренд-красный */
  --pulse-600: #B82C26;
  --pulse-700: #97211C;
  --pulse-tint: #FBEAE9;

  /* ---- Semantic ---- */
  --success: #2F9E62;
  --success-tint: #E4F4EB;
  --warning: #E08A00;
  --warning-tint: #FBF0DC;
  --info: #2D6BD8;

  /* ---- Surface roles (light) ---- */
  --bg:           var(--paper);
  --surface:      var(--white);
  --surface-2:    var(--n-100);
  --border:       var(--n-200);
  --border-strong:var(--n-300);
  --text:         #14161A;
  --text-soft:    var(--n-600);
  --text-muted:   var(--n-500);
  --on-ink:       #F4F3F1;       /* текст на тёмном */
  --on-ink-soft:  #B7B4AD;

  /* ---- Typography (дисплей: Benzin · body: Inter) ---- */
  --font-display: 'Benzin', 'Montserrat', -apple-system, 'Segoe UI', sans-serif;
  --font-body:    'Inter', -apple-system, 'Segoe UI', Roboto, sans-serif;

  /* Modular type scale (1.250 major third) */
  --t-display: clamp(2.75rem, 6vw, 5.25rem);
  --t-h1: clamp(1.65rem, 2.9vw, 2.35rem);
  --t-h2: clamp(1.6rem, 2.9vw, 2.45rem);
  --t-h3: clamp(1.35rem, 2vw, 1.75rem);
  --t-h4: 1.25rem;
  --t-lg: 1.125rem;
  --t-base: 1rem;
  --t-sm: 0.875rem;
  --t-xs: 0.75rem;

  --lh-tight: 1.05;
  --lh-snug: 1.2;
  --lh-normal: 1.55;

  --ls-display: -0.02em;
  --ls-caps: 0.14em;   /* для надписей капсом */

  /* ---- Spacing scale (4/8) ---- */
  --s-1: 0.25rem;  --s-2: 0.5rem;  --s-3: 0.75rem; --s-4: 1rem;
  --s-5: 1.5rem;   --s-6: 2rem;    --s-7: 3rem;    --s-8: 4rem;
  --s-9: 6rem;     --s-10: 8rem;

  /* ---- Radius ---- */
  --r-xs: 4px; --r-sm: 8px; --r-md: 12px; --r-lg: 18px; --r-xl: 28px; --r-pill: 999px;

  /* ---- Shadows (мягкие, премиум) ---- */
  --sh-1: 0 1px 2px rgba(15,17,21,.06), 0 1px 1px rgba(15,17,21,.04);
  --sh-2: 0 4px 14px rgba(15,17,21,.08);
  --sh-3: 0 14px 40px rgba(15,17,21,.12);
  --sh-pulse: 0 8px 24px rgba(255,68,56,.28);

  /* ---- Layout ---- */
  --maxw: 1440px;   /* как у Я.Маркета: контент 1440px */
  --gutter: clamp(1rem, 4vw, 3rem);

  /* ---- Motion ---- */
  --ease: cubic-bezier(.2,.7,.2,1);
  --ease-out: cubic-bezier(.16,1,.3,1);
  --dur-1: .16s; --dur-2: .26s; --dur-3: .5s;
}

@media (prefers-reduced-motion: reduce) {
  * { animation-duration: .001ms !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
}
