/* Bessa Detailing — design tokens (Gulf-at-night editorial) */
:root {
  /* palette */
  --bg:            #0B1418;  /* deep teal-charcoal, Gulf at night */
  --bg-2:          #0E1A1F;
  --surface:       #122229;
  --surface-2:     #162A32;
  --line:          rgba(242, 237, 227, 0.12);
  --line-strong:   rgba(242, 237, 227, 0.22);
  --text:          #F2EDE3;  /* warm bone */
  --muted:         #93A6AB;
  --muted-2:       #6E8186;
  --accent:        #37C9B6;  /* wet aqua — ceramic water bead */
  --accent-bright: #4FE3CE;
  --accent-ink:    #052420;  /* text on accent */
  --sand:          #D6A56A;  /* rare warm accent, marine moment */

  /* type */
  --serif: "Fraunces", Georgia, "Times New Roman", serif;
  --sans:  "Hanken Grotesk", system-ui, -apple-system, sans-serif;

  --fs-mega:  clamp(3rem, 9vw, 7rem);
  --fs-hero:  clamp(2.5rem, 6vw, 4.75rem);
  --fs-h2:    clamp(2rem, 4.5vw, 3.4rem);
  --fs-h3:    clamp(1.35rem, 2.2vw, 1.85rem);
  --fs-lead:  clamp(1.05rem, 1.5vw, 1.3rem);
  --fs-body:  1.0625rem;
  --fs-sm:    0.9375rem;
  --fs-label: 0.78rem;

  /* spacing (4px scale) */
  --s-1: 4px;  --s-2: 8px;  --s-3: 12px; --s-4: 16px;
  --s-5: 24px; --s-6: 32px; --s-7: 48px; --s-8: 64px;
  --s-9: 96px;
  --section-y: clamp(4.5rem, 10vw, 9rem);
  --gutter:    clamp(1.25rem, 5vw, 4rem);

  --radius:    14px;
  --radius-sm: 9px;
  --radius-pill: 999px;
  --maxw: 74rem;

  --shadow:    0 24px 60px -24px rgba(0, 0, 0, 0.7);
  --shadow-accent: 0 16px 40px -16px rgba(55, 201, 182, 0.45);
  --ease: cubic-bezier(0.4, 0, 0.15, 1);
}