/* ============================================================================
   SimYak — Design Tokens (single source of truth)
   Ported verbatim from theme/assets/simyak-theme.css :root (build brief §2).
   Loaded on EVERY page, before any component CSS. Do not fork these values;
   every component must consume these variables.
   ============================================================================ */

:root{
  /* Brand palette (orange = CTAs only; purple secondary; teal tertiary/focus) */
  --smyk-orange:#ff6500; --smyk-orange-hover:#e05800;
  --smyk-purple:#6b2fb0; --smyk-purple-hover:#571f93;
  --smyk-teal:#8dd9d2;
  --smyk-dark:#141414; --smyk-navy:#101828;
  --smyk-gray:#808080; --smyk-gray-light:#f5f5f5; --smyk-border:#e5e5e5; --smyk-white:#ffffff;
  --smyk-hero-bg:rgba(230,251,255,1);
  --smyk-red-badge:#e11c0a;
  --smyk-success:#30cf72;                 /* trust green */
  --smyk-trustpilot:#00b67a;              /* rating stars */

  /* Type */
  --smyk-font:'Poppins',sans-serif;
  --fs-h1:clamp(36px,5vw,64px); --fs-h2:clamp(24px,3.4vw,40px); --fs-h3:clamp(24px,3vw,32px);
  --fs-h4:20px; --fs-h5:18px; --fs-h6:16px;
  --fs-body-lg:18px; --fs-body:16px; --fs-body-sm:14px; --fs-body-xs:12px;
  --fw-regular:400; --fw-medium:500; --fw-semibold:600; --fw-bold:700; --fw-extrabold:800;
  --lh-tight:1.08; --lh-normal:1.2; --lh-relaxed:1.45;

  /* Layout */
  --smyk-container:1320px; --smyk-gap:30px; --smyk-section-py:48px; --smyk-container-pad:30px;

  /* Radius */
  --smyk-radius-sm:8px; --smyk-radius-md:10px; --smyk-radius-lg:16px; --smyk-radius-pill:100px;

  /* Shadow */
  --smyk-shadow-sm:0 2px 8px rgba(0,0,0,.10);
  --smyk-shadow-md:0 2px 14px rgba(0,0,0,.16);
  --smyk-shadow-card:0 2px 8px rgba(0,0,0,.14);
}

/* Mobile type down-shift */
@media (max-width:749px){:root{
  --fs-h1:clamp(28px,7vw,40px); --fs-h2:clamp(20px,4.4vw,28px); --fs-h3:clamp(20px,4vw,24px);
  --fs-h4:18px; --fs-body-lg:16px; --fs-body:15px;
}}
