/* Shared: Theme
 * Central color, surface, gradient, shadow, radius, and layout tokens.
 */

:root {
  color-scheme: dark;

  /* Colors */
  --color-bg: #000000;
  --color-text: #ffffff;
  --color-text-90: rgba(255, 255, 255, 0.9);
  --color-text-80: rgba(255, 255, 255, 0.8);
  --color-text-68: rgba(255, 255, 255, 0.68);
  --color-text-62: rgba(255, 255, 255, 0.62);
  --color-text-60: rgba(255, 255, 255, 0.6);
  --color-accent: #fb5106;
  --color-accent-dark: #f4581c;
  --color-copper: #f1a575;
  --color-copper-muted: #c99b79;
  --color-yellow: #ff9903;
  --color-panel: #100806;
  --color-panel-strong: #1a0c08;
  --color-border-card: rgba(255, 255, 255, 0.07);
  --color-border-content: rgba(255, 255, 255, 0.09);
  --color-border-pill: rgba(255, 255, 255, 0.11);
  --color-overlay-dark: rgba(0, 0, 0, 0.6);
  --color-side-vignette: #120707;
  --color-btn-dark: #150a07;
  --color-footer-bottom: #272727;
  --color-header-bg: rgba(16, 16, 16, 0.5);
  --color-header-menu-bg: rgba(16, 10, 8, 0.96);

  /* Gradients */
  --gradient-hero-1: linear-gradient(
    -89.25302287325405deg,
    rgb(255, 228, 212) 2.676%,
    rgb(241, 165, 117) 26.355%,
    rgb(90, 30, 20) 55.661%,
    rgb(241, 165, 117) 98.527%
  );
  --gradient-hero-2: linear-gradient(
    -89.13174480668818deg,
    rgb(255, 228, 212) 2.676%,
    rgb(241, 165, 117) 19.86%,
    rgb(241, 165, 117) 98.527%
  );
  --gradient-section: linear-gradient(
    -89deg,
    rgb(255, 178, 131) 2.676%,
    rgb(241, 165, 117) 19.86%,
    rgb(241, 165, 117) 98.527%
  );
  --gradient-display-outline: linear-gradient(
    to bottom,
    #f1a575 0%,
    #5a1e14 65.385%,
    #000000 81.25%
  );
  --gradient-orange-cta: linear-gradient(
    234.98531004967762deg,
    rgb(255, 153, 3) 29.402%,
    rgb(249, 62, 4) 105.55%
  );
  --gradient-email-pill: linear-gradient(
    113.2988165467372deg,
    rgba(134, 43, 3, 0.3) 7.66%,
    rgba(93, 38, 26, 0.3) 60.937%,
    rgba(158, 37, 14, 0.3) 112.3%
  );
  --gradient-features-title-bg: linear-gradient(
    126.85982920749058deg,
    rgba(0, 0, 0, 0.3) 7.66%,
    rgba(93, 38, 26, 0.3) 60.937%,
    rgba(56, 19, 12, 0.3) 112.3%
  );
  --gradient-feature-2: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0.5) 0%,
    rgba(93, 38, 26, 0.5) 50%,
    rgba(56, 19, 12, 0.5) 100%
  );
  --gradient-contact-2: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0.6) 0%,
    rgba(93, 38, 26, 0.6) 100%
  );
  --gradient-card: linear-gradient(
    145deg,
    rgba(93, 38, 26, 0.42),
    rgba(10, 4, 3, 0.96)
  );
  --background-content-hero:
    radial-gradient(circle at 85% 10%, rgba(251, 81, 6, 0.18), transparent 38%),
    linear-gradient(180deg, #0b0302 0%, #000000 100%);

  /* Shadows */
  --shadow-btn: 0 0 2px rgba(0, 0, 0, 0.1), 0 1px 8px rgba(0, 0, 0, 0.12);
  --shadow-card-glow: inset 0 0 12px rgba(255, 221, 205, 0.2);
  --shadow-card-subtle: inset 0 0 12px rgba(255, 221, 205, 0.06);
  --shadow-header: 0 0 4px rgba(1, 27, 53, 0.1);

  /* Radii */
  --radius-card: 30px;
  --radius-btn: 100px;
  --radius-pill: 30px;

  /* Layout */
  --gutter: clamp(16px, 4vw, 40px);
  --container-max: 1240px;
  --container-content: 1160px;
  --section-gap: clamp(48px, 8vw, 96px);

}