/* ==========================================================================
   bem.care — Design tokens
   Transcribed from the bem.care Design System (Claude Design project).
   Signature magenta + navy base. NO purple, NO duotone.
   ========================================================================== */

/* ---- Webfonts: Poppins 300/400/500/600, latin + latin-ext ---- */
@font-face{font-family:'Poppins';font-style:normal;font-weight:300;font-display:swap;
  src:url('../fonts/poppins-300-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Poppins';font-style:normal;font-weight:300;font-display:swap;
  src:url('../fonts/poppins-300-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Poppins';font-style:normal;font-weight:400;font-display:swap;
  src:url('../fonts/poppins-400-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Poppins';font-style:normal;font-weight:400;font-display:swap;
  src:url('../fonts/poppins-400-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Poppins';font-style:normal;font-weight:500;font-display:swap;
  src:url('../fonts/poppins-500-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Poppins';font-style:normal;font-weight:500;font-display:swap;
  src:url('../fonts/poppins-500-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Poppins';font-style:normal;font-weight:600;font-display:swap;
  src:url('../fonts/poppins-600-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Poppins';font-style:normal;font-weight:600;font-display:swap;
  src:url('../fonts/poppins-600-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}

:root{
  /* ---- Magenta (accent, CTA, "the dot") ---- */
  --magenta:#FC1482;
  --magenta-deep:#BE025B;
  --magenta-darker:#9B0046;
  --magenta-pink:#FD439B;
  --magenta-50:#FCE7F1;

  /* ---- Navy (structure & dark backgrounds) ---- */
  --navy:#1F295C;
  --navy-bg:#0B1632;
  --navy-panel:#0D1220;
  --navy-deep:#080D18;
  --navy-footer:#080F22;

  /* ---- Ink (text) ---- */
  --ink:#0F1530;
  --ink-2:#26304A;
  --ink-support:#3A4664;
  --ink-muted:#586079;
  --ink-faint:#8A90A3;

  /* ---- Neutrals & surfaces ---- */
  --white:#FFFFFF;
  --surface:#F4F6FB;
  --surface-soft:#FAFBFE;
  --border:#EEF0F5;
  --border-2:#E7EAF2;
  --border-3:#F3F4F9;

  /* ---- On-dark text ---- */
  --on-dark:#FFFFFF;
  --on-dark-lead:#D7DCEC;
  --on-dark-soft:#C7CEEA;
  --on-dark-muted:#AEB6D6;
  --on-dark-pink:#FF7DB8;

  /* ---- Semantic aliases ---- */
  --color-accent:var(--magenta);
  --color-accent-press:var(--magenta-deep);
  --color-accent-hover:var(--magenta-pink);
  --text-heading:var(--ink);
  --text-body:var(--ink-support);
  --text-muted:var(--ink-muted);
  --text-caption:var(--ink-faint);
  --text-eyebrow:var(--magenta-deep);
  --text-link:var(--magenta);
  --surface-page:var(--white);
  --surface-alt:var(--surface-soft);
  --surface-fill:var(--surface);
  --surface-tint:var(--magenta-50);
  --surface-card:var(--white);
  --surface-dark:var(--navy-bg);
  --surface-dark-panel:var(--navy-panel);
  --border-hairline:var(--border);
  --border-card:var(--border-2);

  /* ---- Brand gradients (magenta + navy ONLY) ---- */
  --grad-brand:linear-gradient(135deg,#FC1482 0%,#1F295C 100%);
  --grad-navy:linear-gradient(160deg,#1F295C 0%,#080D18 100%);

  /* ---- Typography ---- */
  --font-sans:'Poppins',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-mono:ui-monospace,Menlo,Consolas,'SF Mono',monospace;
  --fw-light:300;
  --fw-regular:400;
  --fw-medium:500;
  --fw-semibold:600;
  --fs-display:clamp(38px,5.6vw,62px);
  --fs-h1:clamp(34px,4.4vw,48px);
  --fs-h2:clamp(26px,3.4vw,38px);
  --fs-h3:20px;
  --fs-subtitle:22px;
  --fs-lead:clamp(17px,1.6vw,20px);
  --fs-body:18px;
  --fs-support:16px;
  --fs-small:14px;
  --fs-caption:13px;
  --fs-eyebrow:12px;
  --lh-tight:1.04;
  --lh-heading:1.15;
  --lh-body:1.55;
  --ls-display:-1.5px;
  --ls-heading:-0.8px;
  --ls-eyebrow:2px;
  --ls-normal:0;

  /* ---- Spacing ---- */
  --space-1:4px;  --space-2:8px;  --space-3:12px; --space-4:16px;
  --space-5:20px; --space-6:24px; --space-8:32px; --space-10:40px;
  --space-12:48px;--space-16:64px;--space-20:80px;
  --section-pad:clamp(46px,6.5vw,80px);
  --wrap-max:1140px;
  --wrap-pad:24px;

  /* ---- Radii ---- */
  --radius-pill:999px;
  --radius-sm:10px;
  --radius-md:14px;
  --radius-lg:16px;
  --radius-xl:18px;
  --radius-2xl:20px;
  --border-width:1px;
  --border-accent-width:4px;

  /* ---- Elevation ---- */
  --shadow-card:0 12px 28px rgba(31,41,92,.06);
  --shadow-soft:0 8px 20px rgba(31,41,92,.05);
  --shadow-pop:0 18px 40px rgba(31,41,92,.12);
  --shadow-cta:0 8px 22px rgba(252,20,130,.28);

  /* ---- Motion ---- */
  --ease-standard:cubic-bezier(.22,.61,.36,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
  --dur-fast:120ms;
  --dur-base:200ms;
  --dur-slow:320ms;
  --press-scale:.97;
  --hover-lift:-2px;
}
