:root {
  --color-accent: #F25520;
  --color-bg: #FFF4E8;
  --color-bg-alt: #FFF;
  --color-heading: #1F2A44;
  --color-text: #2D3E5E;
  --color-text-secondary: #5A6A80;
  --color-warm: #FFE8D6;
  --color-warm-deep: #FFD9B3;
  --color-dark: #1F2A44;
  --color-btn: #C7440D;
  --color-btn-hover: #B53A0A;
  --color-btn-active: #1F2A44;
  --color-teal: #1A6B5A;
  --color-accent-text: #B53A0A;
  --color-sky: #4F95D6;
  --color-sky-soft: #EAF3FB;
  --color-border: #EAEEF4;
  --color-footer: var(--color-warm-deep);
  --font-family: 'Poppins', sans-serif;
  --section-gap: clamp(40px, 5vw, 56px);
  --container-width: 1100px;
  --radius-btn: 14px;
  --radius-card: 16px;
  --space-1: .25rem;
  --space-2: .5rem;
  --space-3: .75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-9: 2.25rem;
  --space-10: 2.5rem;
  --space-11: 2.75rem;
  --space-12: 3rem;
  --gutter-left: max(var(--space-4), env(safe-area-inset-left));
  --gutter-right: max(var(--space-4), env(safe-area-inset-right));
  --gutter-top: max(var(--space-4), env(safe-area-inset-top));
  --gutter-bottom: max(var(--space-4), env(safe-area-inset-bottom));
  --control-min: 3rem;
  --control-comfort: 3.5rem;
  --header-height: 4.5rem;
  --logo-small: 4rem;
  --logo-medium: 5rem;
  --logo-large: 7rem;
  --badge-size: 1.25rem;
  --radius-panel: 1.5rem;
  --radius-pill: 999px;
  --text-body: 1rem;
  --text-small: .875rem;
  --text-tiny: .75rem;
  --text-title: 1.25rem;
  --text-display: 3rem;
  --color-error: #B53A0A;
  --color-overlay: rgb(31 42 68 / 45%);
  --color-product: #FBEEDC;
  --color-shipping: rgb(26 107 90 / 10%);
  --shadow-panel: 0 8px 30px rgb(31 42 68 / 18%);
  --cart-width: 26.25rem;
  --z-header: 100;
  --z-overlay: 200;
  --z-dialog: 210;
}