:root {

  --cream:      #ede8e0;
  --white:      #ffffff;
  --paper:      #faf7f2;
  --butter:     #e6dfd4;
  --sand:       #ddd2c3;
  --tan:        #cdbda5;
  --gold:       #9c7c4d;
  --gold-light: #ac926a;
  --umber:      #7e6337;

  --umber-deep: #544326;
  --ink-warm:   #231c12;
  --ink:        #16130d;

  --text:       #16130d;
  --text-2:     #5f584a;
  --text-3:     #6f6759;

  --text-on-dark:   #ede8e0;
  --text-on-dark-2: #a8a192;

  --line:        rgba(126, 99, 55, 0.22);
  --line-firm:   rgba(126, 99, 55, 0.40);
  --line-dark:   rgba(255, 255, 255, 0.16);
  --shadow-card: 0 1px 0 rgba(126, 99, 55, 0.10), 0 24px 48px -28px rgba(84, 67, 38, 0.45);
  --shadow-soft: 0 1px 0 rgba(126, 99, 55, 0.08), 0 12px 32px -20px rgba(84, 67, 38, 0.35);
  --shadow-lift: 0 2px 0 rgba(126, 99, 55, 0.10), 0 32px 64px -32px rgba(84, 67, 38, 0.55);

  --font-display: 'Outfit', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-hand:    'Fraunces', 'Iowan Old Style', Georgia, 'Times New Roman', serif;
  --font-body:    'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;

  --step--1: 0.875rem;
  --step-0:  clamp(1rem, 0.95rem + 0.25vw, 1.0625rem);
  --step-1:  clamp(1.125rem, 1.04rem + 0.4vw, 1.3125rem);
  --step-2:  clamp(1.375rem, 1.2rem + 0.8vw, 1.75rem);
  --step-3:  clamp(2rem, 1.3rem + 2.9vw, 3.5rem);
  --step-4:  clamp(2.75rem, 1.5rem + 5.4vw, 5.75rem);
  --step-price: clamp(2.75rem, 2rem + 3.2vw, 4.25rem);
  --step-eyebrow: clamp(1.0625rem, 1rem + 0.3vw, 1.1875rem);

  --leading-body: 1.6;

  --measure:       38rem;
  --measure-wide:  44rem;

  --container:  1240px;
  --gutter:     clamp(1.25rem, 0.5rem + 3vw, 3rem);
  --section-y:  clamp(3.5rem, 2.2rem + 5.4vw, 7rem);

  --radius-sm:  0.625rem;
  --radius:     1rem;
  --radius-lg:  1.5rem;
  --radius-xl:  2rem;
  --pill:       999px;

  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --dur:  180ms;

  --bp-nav: 60rem;

  --fg:      var(--text);
  --fg-2:    var(--text-2);
  --fg-3:    var(--text-3);
  --accent:  var(--umber);
  --rule:    var(--line);
  --ground:  var(--cream);
  --btn-bg:  var(--umber);
  --btn-fg:  #ffffff;
  --btn-bg-hover: #6a5230;
  --ghost-border: var(--line-firm);
  --focus:   var(--umber);
}

@media (prefers-reduced-motion: reduce) {
  :root { --dur: 0ms; }
}
