:root {

  /* Brand — ocean (blue) + soil (earth / nude accents) */

  --color-ocean: #1a6b8a;

  --color-ocean-light: #29abe2;

  --color-ocean-pale: #5bc4ef;

  --color-charcoal: #1a2d3a;



  --color-navy: var(--color-ocean-light);

  --color-navy-light: var(--color-ocean);

  --color-teal: var(--color-ocean-light);

  --color-teal-light: var(--color-ocean-pale);



  --color-soil: #9a7352;

  --color-soil-light: #c4a574;

  --color-soil-dark: #7d5c3e;



  --color-maroon: var(--color-soil);

  --color-maroon-light: var(--color-soil-light);

  --color-gold: var(--color-soil-light);

  --color-gold-light: #dcc9a8;



  --color-cream: #faf8f5;

  --color-white: #ffffff;

  --color-off-white: #f4f6f8;

  --color-gray-100: #e8ecf0;

  --color-gray-300: #c5cdd6;

  --color-gray-500: #6b7c8f;

  --color-gray-700: #3d4f63;

  --color-success: #1a7f4b;

  --color-danger: #c0392b;

  --color-warning: #d68910;



  --font-sans: "DM Sans", system-ui, sans-serif;

  --font-display: "Cormorant Garamond", "Libre Baskerville", Georgia, serif;



  --text-xs: 0.75rem;

  --text-sm: 0.875rem;

  --text-base: 1rem;

  --text-lg: 1.125rem;

  --text-xl: 1.25rem;

  --text-2xl: 1.5rem;

  --text-3xl: 2rem;

  --text-4xl: 2.75rem;

  --text-hero: clamp(2rem, 5vw, 3.5rem);



  --space-xs: 0.25rem;

  --space-sm: 0.5rem;

  --space-md: 1rem;

  --space-lg: 1.5rem;

  --space-xl: 2rem;

  --space-2xl: 3rem;

  --space-3xl: 4rem;

  --space-4xl: 6rem;



  --radius-sm: 4px;

  --radius-md: 10px;

  --radius-lg: 16px;

  --shadow-sm: 0 2px 8px rgba(26, 45, 58, 0.06);

  --shadow-md: 0 8px 32px rgba(26, 45, 58, 0.1);

  --shadow-lg: 0 20px 50px rgba(26, 45, 58, 0.14);

  --shadow-header: 0 1px 0 rgba(0, 0, 0, 0.05);



  --top-bar-height: 40px;
  --header-height: 84px;
  --header-stack-height: calc(var(--top-bar-height) + var(--header-height));

  --container-max: 1240px;

  --transition: 0.25s ease;

  --ease-luxury: cubic-bezier(0.22, 1, 0.36, 1);

}


