:root {
  --dd-white:          #FFFFFF;
  --dd-lilac-50:       #F8F4FB;
  --dd-lilac-100:      #EFE4F4;
  --dd-lilac-200:      #D9C4E3;
  --dd-sand-300:       #DABA7F;

  --dd-ink-900:        #1B0B22;
  --dd-ink-800:        #2A1233;
  --dd-ink-600:        #5A3E68;

  --dd-plum-900:       #2E1136;
  --dd-plum-800:       #431A4E;
  --dd-plum-700:       #5C2367;
  --dd-plum-500:       #7A3D88;
  --dd-plum-soft:      #F3E9F7;

  --dd-sunny:          #F5B731;
  --dd-sunny-300:      #FAD98C;
  --dd-sunny-soft:     #FEF6E3;
  --dd-sunny-ink:      #7A5600;

  --dd-tangerine:      #EC502A;
  --dd-tangerine-ink:  #C13309;
  --dd-tangerine-soft: #FDEDE7;

  --dd-magenta:        #C2185B;
  --dd-magenta-soft:   #FDEAF1;

  --dd-petrol-900:     #0A3A3C;
  --dd-petrol-700:     #115B5E;
  --dd-petrol-500:     #1A8085;
  --dd-petrol-soft:    #E8F3F3;

  --dd-cocoa:          #602C16;
  --dd-cocoa-deep:     #3A1F12;

  --dsp-blue:          #0056A3;

  --dd-bg:             var(--dd-lilac-50);
  --dd-bg-alt:         var(--dd-lilac-100);
  --dd-surface:        var(--dd-white);
  --dd-text:           var(--dd-ink-800);
  --dd-text-strong:    var(--dd-ink-900);
  --dd-text-muted:     var(--dd-ink-600);
  --dd-border:         var(--dd-lilac-200);
  --dd-rule:           var(--dd-ink-900);
  --dd-brand:          var(--dd-plum-700);

  --dd-dark-bg:        var(--dd-plum-900);
  --dd-dark-surface:   var(--dd-plum-800);
  --dd-on-dark:        var(--dd-lilac-50);
  --dd-on-dark-muted:  var(--dd-lilac-200);
  --dd-on-dark-accent: var(--dd-sunny);

  --dd-accent:         var(--dd-plum-700);
  --dd-accent-soft:    var(--dd-plum-soft);
  --dd-accent-strong:  var(--dd-sunny);
  --dd-solid:          var(--dd-plum-700);
  --dd-solid-hover:    var(--dd-plum-800);
  --dd-on-solid:       var(--dd-white);
  --dd-danger:         var(--dd-magenta);
  --dd-danger-soft:    var(--dd-magenta-soft);
  --dd-success:        var(--dd-petrol-700);
  --dd-success-soft:   var(--dd-petrol-soft);
  --dd-warning:        var(--dd-tangerine-ink);
  --dd-warning-soft:   var(--dd-sunny-soft);
  --dd-info:           var(--dd-plum-700);
  --dd-info-soft:      var(--dd-plum-soft);

  --dd-font-display: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  --dd-font-body:    'Rubik', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
  --dd-stretch-wide:  112%;
  --dd-stretch-poster: 125%;

  --dd-text-display: clamp(2.30rem, 1.45rem + 3.6vw, 4.30rem);
  --dd-text-h1:      clamp(1.95rem, 1.45rem + 2.2vw, 3.00rem);
  --dd-text-pagetitle: clamp(1.45rem, 1.05rem + 1.9vw, 2.70rem);
  --dd-text-h2:      clamp(1.60rem, 1.32rem + 1.3vw, 2.25rem);
  --dd-text-h3:      clamp(1.30rem, 1.14rem + 0.7vw, 1.72rem);
  --dd-text-h4:      clamp(1.08rem, 1.01rem + 0.3vw, 1.28rem);
  --dd-text-lead:    clamp(1.10rem, 1.02rem + 0.4vw, 1.32rem);
  --dd-text-base:    1.0625rem;
  --dd-text-sm:      0.9375rem;
  --dd-text-xs:      0.8125rem;

  --dd-leading-tight: 1.02;
  --dd-leading-snug:  1.28;
  --dd-leading-body:  1.68;

  --dd-tracking-tight:  -0.025em;
  --dd-tracking-normal:  0;
  --dd-tracking-wide:    0.10em;
  --dd-tracking-caps:    0.18em;

  --dd-space-1:  0.25rem;
  --dd-space-2:  0.5rem;
  --dd-space-3:  0.75rem;
  --dd-space-4:  1rem;
  --dd-space-5:  1.5rem;
  --dd-space-6:  2rem;
  --dd-space-7:  3rem;
  --dd-space-8:  4rem;
  --dd-space-9:  6rem;
  --dd-space-10: 8rem;
  --dd-sticky-offset: 6.5rem;
  --dd-section-y: clamp(3.5rem, 2rem + 6vw, 7rem);

  --dd-radius-sm:   2px;
  --dd-radius-md:   3px;
  --dd-radius-lg:   4px;
  --dd-radius-xl:   6px;
  --dd-radius-pill: 4px;

  --dd-edge:        2px;
  --dd-edge-bold:   3px;

  --dd-shadow-xs: 1px 1px 0 rgba(28, 15, 34, 0.16);
  --dd-shadow-sm: 2px 2px 0 rgba(28, 15, 34, 0.18);
  --dd-shadow-md: 4px 4px 0 rgba(28, 15, 34, 0.16);
  --dd-shadow-lg: 6px 6px 0 rgba(28, 15, 34, 0.18);
  --dd-shadow-xl: 10px 10px 0 rgba(28, 15, 34, 0.20);
  --dd-shadow-pop:      4px 4px 0 var(--dd-ink-900);
  --dd-shadow-pop-lift: 7px 7px 0 var(--dd-ink-900);

  --dd-halftone-dot:  rgba(122, 61, 136, 0.30);
  --dd-halftone-size: 14px;
  --dd-halftone-r:    3.1px;
  --dd-diagonal:      2.6deg;
  --dd-diagonal-drop: 3.5vw;

  --dd-ease:       cubic-bezier(0.4, 0, 0.2, 1);
  --dd-ease-out:   cubic-bezier(0.16, 1, 0.3, 1);
  --dd-ease-sweet: cubic-bezier(0.34, 1.56, 0.64, 1);
  --dd-dur-fast:   140ms;
  --dd-dur-base:   240ms;
  --dd-dur-slow:   420ms;
  --dd-dur-slower: 700ms;

  --dd-container:        1220px;
  --dd-container-narrow: 760px;
  --dd-header-h:         82px;
  --dd-focus-ring:       3px;
  --dd-z-header:         1030;
  --dd-z-overlay:        1040;
  --dd-z-modal:          1050;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --dd-dur-fast: 1ms;
    --dd-dur-base: 1ms;
    --dd-dur-slow: 1ms;
    --dd-dur-slower: 1ms;
  }
}