:root {

  --bg:              #0d1521;
  --bg-2:            #111e2e;
  --bg-3:            #152033;

  --accent:          #FF7900;
  --accent-hover:    #e06a00;
  --accent-soft:     rgba(255, 121, 0, 0.10);
  --accent-glow:     rgba(255, 121, 0, 0.30);
  --accent-glow-lg:  rgba(255, 121, 0, 0.15);
  --yellow:          #F7BE16;

  --slate:           #304958;

  --white:           #ffffff;
  --text:            #dce6f0;
  --text-muted:      #7e99b0;
  --text-dim:        #3d566e;

  --border:          rgba(255, 121, 0, 0.14);
  --border-subtle:   rgba(255, 255, 255, 0.06);
  --border-glass:    rgba(255, 255, 255, 0.09);

  --glass-bg:        rgba(13, 21, 33, 0.55);
  --glass-bg-light:  rgba(255, 255, 255, 0.04);
  --glass-bg-card:   rgba(17, 30, 46, 0.70);
  --glass-bg-panel:  rgba(13, 21, 33, 0.80);
  --glass-blur:      blur(18px);
  --glass-blur-sm:   blur(10px);
  --glass-blur-lg:   blur(28px);
  --glass-border:    rgba(255, 255, 255, 0.08);
  --glass-border-accent: rgba(255, 121, 0, 0.20);
  --glass-shadow:    0 8px 32px rgba(0, 0, 0, 0.45), inset 0 1px 0 rgba(255,255,255,0.06);
  --glass-shadow-lg: 0 20px 60px rgba(0, 0, 0, 0.55), inset 0 1px 0 rgba(255,255,255,0.08);
  --glass-shadow-accent: 0 8px 32px rgba(255,121,0,0.20), inset 0 1px 0 rgba(255,255,255,0.06);

  --shadow-sm:    0 2px 8px rgba(0,0,0,0.30);
  --shadow-md:    0 4px 20px rgba(0,0,0,0.40);
  --shadow-lg:    0 8px 40px rgba(0,0,0,0.50);
  --shadow-xl:    0 20px 60px rgba(0,0,0,0.60);
  --shadow-accent:0 8px 32px var(--accent-glow);

  --font-head:   'Poppins', system-ui, sans-serif;
  --font-body:   'Poppins', system-ui, sans-serif;

  --fs-xs:   clamp(0.70rem, 0.65rem + 0.20vw, 0.78rem);
  --fs-sm:   clamp(0.82rem, 0.78rem + 0.20vw, 0.92rem);
  --fs-base: clamp(0.92rem, 0.88rem + 0.20vw, 1.00rem);
  --fs-md:   clamp(1.00rem, 0.95rem + 0.25vw, 1.10rem);
  --fs-lg:   clamp(1.10rem, 1.00rem + 0.50vw, 1.35rem);
  --fs-xl:   clamp(1.35rem, 1.20rem + 0.80vw, 1.75rem);
  --fs-2xl:  clamp(1.75rem, 1.50rem + 1.50vw, 2.40rem);
  --fs-3xl:  clamp(2.40rem, 2.00rem + 2.50vw, 3.50rem);
  --fs-4xl:  clamp(3.00rem, 2.50rem + 3.00vw, 5.00rem);

  --fw-regular:  400;
  --fw-medium:   500;
  --fw-semibold: 600;
  --fw-bold:     700;
  --fw-black:    900;

  --lh-tight:  1.15;
  --lh-snug:   1.30;
  --lh-normal: 1.60;
  --lh-loose:  1.80;

  --ls-tight:  -0.03em;
  --ls-normal:  0em;
  --ls-wide:    0.06em;
  --ls-wider:   0.14em;

  --sp-1:   4px;  --sp-2:   8px;  --sp-3:  12px;
  --sp-4:  16px;  --sp-5:  20px;  --sp-6:  24px;
  --sp-8:  32px;  --sp-10: 40px;  --sp-12: 48px;
  --sp-16: 64px;  --sp-20: 80px;  --sp-24: 96px;

  --container:      1440px;
  --pad:            24px;
  --section-py:     clamp(64px, 8vw, 100px);
  --header-h:       70px;
  --header-h-sm:    58px;

  --r-sm:   6px;
  --r-md:  12px;
  --r-lg:  20px;
  --r-xl:  28px;
  --r-2xl: 40px;
  --r-full:9999px;

  --ease-out:    cubic-bezier(0.22, 1, 0.36, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease-in-out: cubic-bezier(0.45, 0, 0.55, 1);

  --dur-fast:   150ms;
  --dur-normal: 280ms;
  --dur-slow:   480ms;

  --z-base:    1;
  --z-raised:  10;
  --z-overlay: 100;
  --z-modal:   200;
  --z-header:  300;
  --z-cursor:  9999;
}
@media (max-width: 768px) { :root { --pad: 12px; } }
@media (max-width: 480px) { :root { --pad: 8px; } }