/* =========================================================
   tuvedu landing · design tokens (Palette A · Pine & Mint)
   Landing identity only. The app screens inside the phone use
   their own tokens (--app-*), taken from the real screenshots.
   ========================================================= */
:root {
  /* Palette A · Pine & Mint (approved v3.3) */
  --color-cream: #FBF7EF;        /* page ground */
  --color-ink: #13261D;          /* headlines        14.9:1 on cream */
  --color-ink-2: #26342C;        /* body text        12.2:1 on cream */
  --color-muted: #4B5A51;        /* captions          6.8:1 on cream */
  --color-pine: #1E3B2E;         /* CTA, logo        11.4:1 cream on pine */
  --color-pine-deep: #13261D;    /* dark Buddy block */
  --color-mint: #D6ECDD;         /* glow, inactive bars */
  --color-mint-label: #DDEEE3;   /* label pill, language switch */
  --color-remember: #D9ECDF;     /* REMEMBER background word only */
  --color-signal-mint: #9FD6B4;  /* accents on the dark block */
  --color-amber: #D9A441;        /* small rings only, never text */
  --color-white: #FFFFFF;
  --color-line: rgba(30, 59, 46, .14);
  --shadow-float: 0 12px 30px -14px rgba(19, 38, 29, .32);
  --shadow-cta: 0 12px 24px -12px rgba(30, 59, 46, .6);

  /* Typography (approved v3.4) */
  --font-heading: 'Geologica', 'Golos Text', system-ui, sans-serif;
  --font-body: 'Golos Text', system-ui, sans-serif;
  --font-mono: 'IBM Plex Mono', ui-monospace, monospace;
  --weight-heading: 700;
  --weight-body: 700;            /* as approved; change here only */
  --h1: clamp(42px, 5vw, 72px);  /* same size for EN and RU (measured) */
  --h2: clamp(32px, 3.6vw, 52px);
  --lead: clamp(16px, 1.4vw, 20px);
  --body: 16px;
  --label: 12px;

  /* Spacing and shape */
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px;
  --space-5: 24px; --space-6: 32px; --space-7: 48px; --space-8: 64px;
  --space-9: 96px; --space-10: 128px;
  --container: 1280px;
  --gutter: 80px;
  --radius-s: 8px; --radius-m: 14px; --radius-l: 20px; --radius-pill: 999px;

  /* Motion */
  --ease: cubic-bezier(.2, .8, .2, 1);
  --dur-press: 140ms;
  --dur-fast: 240ms;
  --dur-base: 340ms;
  --dur-slow: 600ms;
  --demo-length: 15000ms;

  /* Phone */
  --device-scale: .8;            /* 420 × 874 device, 390 × 844 screen */

  /* App tokens: real tuvedu app, from screenshots (not Palette A) */
  --app-font: -apple-system, 'SF Pro Text', 'Inter', system-ui, sans-serif;
  --app-bg: #F2F2F7;
  --app-card: #FFFFFF;
  --app-text: #000000;
  --app-text-2: #3C3C43;
  --app-grey: #8E8E93;
  --app-grey-2: #6C6C70;
  --app-fill: #E5E5EA;
  --app-green: #28473A;          /* Review, mic, avatar, four dots */
  --app-amber: #DFA032;          /* fourth dot ring */
  --app-red: #E0352B;            /* mic while recording */
  --app-ok: #2E7D4F;
  --app-bad: #C0392B;
  --app-ok-bg: #E3F0E6;
  --app-bad-bg: #F6E3E5;
  --app-subject: #3D5F9E;        /* demo subject colour (lesson accents) */
  --app-subject-deep: #33528A;
  --app-subject-tint: #EAF0F8;
}