/* Design tokens — single source of truth for the DataDemy design system.
   Mirrors theme.json (Elementor/editor-facing) so both layers read one set of values. */
:root{
  /* Color */
  --dd-ink:#15120F;
  --dd-ink-soft:#3A342E;
  --dd-paper:#FBF8F4;
  --dd-paper-warm:#F3ECE2;
  --dd-paper-warm-2:#EFE7DB;
  --dd-slate:#15171F;
  --dd-slate-2:#1F2330;
  --dd-slate-deep:#0E0D0B;
  --dd-slate-deep-2:#181613;
  --dd-white:#FFFFFF;
  --dd-signal-1:#FF8A00;
  --dd-signal-2:#FF6A00;
  --dd-signal-3:#FF5B00;
  --dd-signal-4:#FF4400;
  --dd-gradient:linear-gradient(135deg,var(--dd-signal-1),var(--dd-signal-4));
  --dd-gradient-text:linear-gradient(115deg,var(--dd-signal-1),var(--dd-signal-2),var(--dd-signal-4),var(--dd-signal-1));

  /* Borders (light bg) */
  --dd-border:rgba(21,18,15,.1);
  --dd-border-strong:rgba(21,18,15,.14);
  --dd-border-input:rgba(21,18,15,.14);
  /* Borders (dark bg) */
  --dd-border-dark:rgba(251,248,244,.12);
  --dd-border-dark-strong:rgba(251,248,244,.18);

  /* Typography */
  --dd-font-display:'Clash Display', sans-serif;
  --dd-font-grotesk:'Clash Grotesk', 'Manrope', sans-serif;
  --dd-font-ui:'IBM Plex Sans', sans-serif;
  --dd-font-body:'Inter', sans-serif;

  /* Most h1s across the site share this value; Careers (46/5.4vw/80), Professional
     Learning (48/5.6vw/88), Contact (44/4.6vw/68), and the Home hero (42/4.9vw/76) are
     deliberately different in the approved design and are set inline per-instance,
     overriding this default. */
  --dd-h1: clamp(46px,5vw,76px);
  --dd-h1-hero: clamp(42px,4.9vw,76px);
  --dd-h1-dark: clamp(48px,5.6vw,88px);
  /* h2 has NO single shared value in the approved design — nearly every section's
     heading was individually tuned. This is a sensible generic fallback for any *new*
     h2 a future page adds; every existing h2 in the theme sets its own exact inline
     font-size (see each template) rather than relying on this default. */
  --dd-h2: clamp(38px,4.2vw,62px);
  --dd-h2-sm: clamp(34px,3.4vw,50px);
  --dd-h2-md: clamp(30px,3.2vw,44px);
  --dd-h3: 24px;

  /* Radius */
  --dd-radius-card:18px;
  --dd-radius-card-lg:24px;
  --dd-radius-card-xl:28px;
  --dd-radius-card-xxl:34px;
  --dd-radius-pill:999px;

  /* Shadow */
  --dd-shadow-card-hover: 0 20px 44px rgba(21,18,15,.09);
  --dd-shadow-card-hover-dark: 0 22px 44px rgba(21,18,15,.16);
  --dd-shadow-dropdown: 0 22px 44px rgba(21,18,15,.14);
  --dd-shadow-button: 0 8px 22px rgba(255,68,0,.24);
  --dd-shadow-button-hover: 0 16px 38px rgba(255,68,0,.34);
  --dd-shadow-back-top: 0 12px 30px rgba(255,68,0,.32);

  /* Layout */
  --dd-container-max:1320px;
  --dd-container-pad:48px;
  --dd-container-pad-mobile:20px;
  --dd-header-height:76px;

  /* Breakpoints (reference only — used in @media comments, cannot be var()'d) */
  --dd-bp-small-mobile:560px;
  --dd-bp-mobile:900px;
  --dd-bp-desktop:1024px;
  --dd-bp-wide:1260px;

  /* Easing */
  --dd-ease: cubic-bezier(.2,.7,.3,1);
}