/* ==========================================================================
   smart-iptv.nl design tokens
   Derived strictly from brand.json (extracted from the original site) +
   Elementor data-settings hints recovered from the Wayback captures.
   Light scheme, orange accent, Catamaran body / Outfit headings.
   ========================================================================== */
:root {
  /* ---- Brand colors (brand.json) ---- */
  /* Original theme vars: --wdtPrimaryColor:#f96614, --wdtSecondaryColor:#f68749,
     --wdtTertiaryColor:#fff7ee, --wdtLinkHoverColor:#ed5f10, --wdtBorderColor:#e3e3e3 */
  --c-primary: #F68749;        /* primary buttons, accents (wdtSecondary) */
  --c-accent: #F96614;         /* links, strong accent (wdtPrimary) */
  --c-hover: #FF7528;          /* pricing button hover (Elementor data-settings) */
  --c-link-hover: #ED5F10;     /* link hover (wdtLinkHoverColor) */
  --c-featured: #FFF7EE;       /* featured pricing card / cream sections (wdtTertiary) */
  --c-bg: #FFFFFF;
  --c-text: #000000;
  --c-text-2: #363636;         /* secondary copy / body text */
  --c-text-3: #6B6B6B;         /* muted */
  --c-line: #E3E3E3;           /* hairlines (wdtBorderColor) */
  --c-dark: #131313;           /* dark sections / footer */
  --c-dark-2: #1D1D1D;
  --c-on-dark: #FFFFFF;
  --c-on-dark-2: #C9C9C9;

  /* Soft tints derived from primary for chips/badges/icons */
  --c-tint-1: #FFF3EA;
  --c-tint-2: #FFE5D3;

  /* Status */
  --c-success: #28A745;

  /* ---- Typography (brand.json: Outfit headings, Catamaran body) ---- */
  --font-heading: "Outfit", "Catamaran", sans-serif;
  --font-body: "Catamaran", sans-serif;

  /* brand.json: h1 60px, h2 50px, body 16px; fluid below desktop */
  --fz-h1: clamp(2.375rem, 1.6rem + 3.2vw, 3.75rem);     /* 38 -> 60px */
  --fz-h2: clamp(2rem, 1.45rem + 2.6vw, 3.125rem);       /* 32 -> 50px */
  --fz-h3: clamp(1.5rem, 1.25rem + 1.2vw, 2rem);         /* 24 -> 32px */
  --fz-h4: clamp(1.25rem, 1.1rem + 0.7vw, 1.5rem);       /* 20 -> 24px */
  --fz-h5: 1.125rem;                                     /* 18px */
  --fz-lg: 1.125rem;
  --fz-body: 1rem;                                       /* 16px */
  --fz-sm: 0.875rem;
  --fz-xs: 0.75rem;

  --lh-tight: 1.15;
  --lh-heading: 1.25;
  --lh-body: 1.7;

  /* ---- Spacing (brand.json baseUnit 12) ---- */
  --sp-1: 6px;
  --sp-2: 12px;
  --sp-3: 18px;
  --sp-4: 24px;
  --sp-5: 36px;
  --sp-6: 48px;
  --sp-7: 60px;
  --sp-8: 84px;
  --sp-9: 108px;
  --section-pad: clamp(60px, 5vw + 36px, 108px);

  /* ---- Radius (brand.json: buttons 7px; cards follow Elementor look) ---- */
  --r-btn: 7px;
  --r-sm: 7px;
  --r-md: 12px;
  --r-lg: 18px;
  --r-pill: 999px;

  /* ---- Shadows (light theme, warm + soft) ---- */
  --shadow-1: 0 6px 18px rgba(19, 19, 19, 0.06);
  --shadow-2: 0 14px 38px rgba(19, 19, 19, 0.10);
  --shadow-cta: 0 10px 24px rgba(249, 102, 20, 0.28);

  /* ---- Motion ---- */
  --t-fast: 160ms;
  --t-base: 280ms;
  --t-slow: 480ms;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);

  /* ---- Layout ---- */
  --container: 1200px;
  --container-pad: clamp(16px, 4vw, 28px);

  /* ---- Z layers ---- */
  --z-progress: 90;
  --z-header: 80;
  --z-banner: 70;
}