/* elivance.eu - design tokens v1 (18.10.2026)
   Brand: "professional and alive" (brandbook v1.0, approved 16-17.10.2026).
   Source of brand values: lydya-visual-prompt/modules/guidelines.md.
   Contrast ratios (WCAG 2.x) computed, see design-system.md. */

/* Self-hosted Plus Jakarta Sans, variable 400-800 (SIL OFL 1.1, fonts/OFL.txt).
   No runtime request to Google Fonts. */
@font-face {
  font-family: "Plus Jakarta Sans";
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url("fonts/plus-jakarta-sans-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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Plus Jakarta Sans";
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url("fonts/plus-jakarta-sans-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 {
  /* ---------- Color: base (>= 85% of any screen) ---------- */
  --c-bg: #F7F6EF;            /* warm light base */
  --c-paper: #FFFFFF;         /* cards, form fields, sheets */
  --c-bg-sunk: #EFEEE6;       /* quiet band behind a section (muted text 5.14:1 on it) */
  --c-text: #142420;          /* 14.88:1 on bg, 16.12:1 on paper */
  --c-muted: #5A6661;         /* 5.53:1 on bg, 5.99:1 on paper - AA for any size */
  --c-line: #DEDDD2;          /* decorative dividers and card frames only (1.26:1) */
  --c-line-strong: #7C847F;   /* input borders, UI boundaries - 3.55:1 on bg (1.4.11) */

  /* ---------- Color: emerald (data + action, <= 10%) ---------- */
  --c-emerald: #0F9D76;        /* brand value: dots, icons, large numbers, frames. 3.18:1 on bg - never small text */
  --c-emerald-strong: #0B7A5C; /* buttons, links, small emerald text. white on it 5.31:1; on bg 4.90:1 */
  --c-emerald-deep: #0A6B51;   /* hover/pressed of strong. white on it 6.49:1 */
  --c-emerald-tint: #E6F3EE;   /* notice banner, step badges. text 14.14:1, strong 4.66:1 */
  --c-on-emerald: #FFFFFF;     /* text on emerald-strong / deep only */

  /* ---------- Color: coral (one meaningful word, <= 5%) ---------- */
  --c-coral: #E8603C;          /* large text >= 24px or >= 19px bold, icons. 3.14:1 on bg */
  --c-coral-strong: #B5432A;   /* small coral-family text: form errors. 5.10:1 on bg */
  --c-on-coral: #142420;       /* if coral is ever a surface: dark text 4.74:1, never white (3.40:1) */
  /* Never: coral on emerald (1:1), white on #0F9D76 (3.44:1), white on #E8603C (3.40:1). */

  /* ---------- Color: dark surface (footer) ---------- */
  --c-dark: #142420;
  --c-on-dark: #FFFFFF;        /* 16.12:1 */
  --c-on-dark-muted: #9AA6A0;  /* 6.40:1 */
  --c-on-dark-line: #2E3E39;

  /* ---------- Semantic ---------- */
  --c-link: var(--c-emerald-strong);
  --c-link-hover: var(--c-emerald-deep);
  --c-error: var(--c-coral-strong);
  --c-success: var(--c-emerald-strong);
  --c-focus: #0B7A5C;          /* 4.90:1 on bg - focus ring */
  --c-focus-on-dark: #FFFFFF;

  /* ---------- Type ---------- */
  --font-sans: "Plus Jakarta Sans", Inter, Arial, system-ui, sans-serif;

  /* fluid between 375px and 1440px viewports */
  --fs-display: clamp(2.25rem, 1.43rem + 3.5vw, 4rem);      /* 36 -> 64  H1 */
  --fs-h2: clamp(1.75rem, 1.36rem + 1.67vw, 2.75rem);       /* 28 -> 44  section titles */
  --fs-h3: clamp(1.25rem, 1.16rem + 0.38vw, 1.5rem);        /* 20 -> 24  card titles */
  --fs-lead: clamp(1.125rem, 1.08rem + 0.19vw, 1.25rem);    /* 18 -> 20  hero subline */
  --fs-body: clamp(1.0625rem, 1.04rem + 0.09vw, 1.125rem);  /* 17 -> 18  body */
  --fs-small: 1rem;                                          /* 16  captions, meta */
  --fs-label: 0.875rem;                                      /* 14  caps labels only */
  --fs-number: clamp(2.5rem, 2rem + 2.1vw, 3.5rem);         /* 40 -> 56  prices */

  --lh-tight: 1.08;
  --lh-heading: 1.18;
  --lh-body: 1.6;

  --fw-body: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  --fw-heading: 800;

  --tracking-display: -0.035em;
  --tracking-heading: -0.025em;
  --tracking-label: 0.08em;

  --measure: 66ch;   /* max line length for running text */

  /* ---------- Space (4px base; brand steps 8/12/16/24/32/40/48/56/72 + 96/128 for sections) ---------- */
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-5: 24px;
  --s-6: 32px;
  --s-7: 40px;
  --s-8: 48px;
  --s-9: 56px;
  --s-10: 72px;
  --s-11: 96px;
  --s-12: 128px;

  --section-y: clamp(72px, 4.6rem + 3.2vw, 128px);
  --gutter: clamp(20px, 0.6rem + 2.4vw, 40px);
  --container: 1200px;
  --grid-gap: clamp(16px, 0.6rem + 1.2vw, 32px);

  /* ---------- Shape ---------- */
  --r-sm: 8px;      /* buttons, inputs, chips */
  --r-md: 16px;     /* cards, blocks, photo */
  --r-pill: 999px;  /* chat launcher, step dots */
  --border: 2px;    /* brand frame width */
  --border-hair: 1px;

  /* ---------- Elevation ----------
     Brand: no decorative shadows. Shadow only separates UI that floats
     over content (sticky bar, chat launcher, open dropdown). */
  --shadow-none: none;
  --shadow-float: 0 6px 20px rgba(20, 36, 32, 0.14);

  /* ---------- Focus ring ---------- */
  --focus-width: 3px;
  --focus-offset: 3px;
  --focus-ring: var(--focus-width) solid var(--c-focus);

  /* ---------- Motion ---------- */
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --dur-fast: 120ms;
  --dur: 200ms;

  /* ---------- Layers ---------- */
  --z-header: 50;
  --z-sticky-cta: 60;
  --z-launcher: 70;

  /* ---------- Component sizes ---------- */
  --tap: 48px;           /* min target (WCAG 2.5.8 asks 24px, we keep 48) */
  --header-h: 72px;
  --sticky-cta-h: 72px;
}

@media (max-width: 767px) {
  :root { --header-h: 64px; }
}

@media (prefers-reduced-motion: reduce) {
  :root { --dur-fast: 0ms; --dur: 0ms; }
}