/* ============================================================
   CAPRIO INTERIORS — DESIGN TOKENS
   Every colour, font, size, radius, shadow and spacing value the
   site uses lives here. A restyle should mostly be edits to this file.
   Fonts: if you change a family here, also change the Google Fonts
   <link> in the <head> of index.html and privacy-policy.html.
   ============================================================ */
:root {
  /* ---- surfaces (warm, low-saturation) ---- */
  --cream:   oklch(0.972 0.011 80);   /* page background */
  --paper:   oklch(0.991 0.005 85);   /* cards, inputs */
  --sand:    oklch(0.935 0.016 78);   /* alternate section band */
  --ink:     oklch(0.255 0.018 55);   /* headings, body text */
  --ink-2:   oklch(0.40 0.020 55);    /* secondary text */
  --ink-3:   oklch(0.56 0.018 60);    /* muted text, labels */
  --line:    oklch(0.875 0.012 75);   /* hairlines, card borders */
  --line-2:  oklch(0.80 0.014 72);    /* input borders */

  /* ---- brand accents ---- */
  --accent:      #b85534;             /* buttons, links, highlights */
  --accent-deep: #9c4327;             /* hover state of --accent */
  --accent-soft: oklch(0.525 0.128 38 / 0.12);  /* focus ring */
  --accent-glow: oklch(0.5 0.13 38 / 0.28);     /* primary button shadow */
  --gold:        oklch(0.745 0.098 78);          /* stars, kickers on dark */
  --on-accent:   var(--paper);                   /* text on accent */
  --warn:        #b3261e;                        /* form errors */
  --wa:          #25d366;                        /* WhatsApp brand green */
  --wa-deep:     #1ebe5a;
  --on-wa:       #ffffff;
  --ok:          oklch(0.55 0.072 128);          /* form success tick */
  --accent-tint: oklch(0.525 0.128 38 / 0.07);   /* highlighted column / soft fills */
  --tbc-bg:      #fff3b0;                        /* [to confirm] marker */
  --tbc-ink:     #6b5400;

  /* ---- dark surfaces (CTA band, overlays) ---- */
  --dark:          oklch(0.2 0.02 55);
  --on-dark:       var(--cream);
  --on-dark-2:     oklch(0.86 0.012 80);
  --on-dark-3:     oklch(0.78 0.01 80);
  --dark-overlay:  linear-gradient(120deg, oklch(0.2 0.02 55 / .93), oklch(0.22 0.02 55 / .8));
  --photo-overlay: linear-gradient(180deg, oklch(0.30 0.03 55 / 0.15), oklch(0.22 0.03 50 / 0.78));
  --glass:         oklch(1 0 0 / 0.08);
  --glass-line:    oklch(1 0 0 / 0.14);
  --scrim:         oklch(0.2 0.02 55 / 0.55);
  --head-bg:       oklch(0.972 0.011 80 / 0.82);   /* translucent sticky header */
  --placeholder-a: oklch(0.90 0.018 78);           /* striped image placeholder */
  --placeholder-b: oklch(0.93 0.015 80);

  /* ---- type ---- */
  --display: "Cormorant Garamond", Georgia, serif;   /* headings */
  --body:    "Manrope", system-ui, sans-serif;       /* text, UI */
  --mono:    "DM Mono", ui-monospace, monospace;     /* eyebrows, labels */
  --fs-body:  17px;
  --fs-h1:    clamp(44px, 6vw, 84px);
  --fs-h2:    clamp(34px, 4.4vw, 58px);
  --fs-h3:    34px;
  --fs-lead:  19px;
  --fs-small: 13px;
  --lh-body:  1.5;
  --lh-display: 1.02;

  /* ---- layout + spacing ---- */
  --maxw:          1240px;   /* content width */
  --gutter:        32px;     /* side padding (desktop) */
  --gutter-mobile: 20px;     /* side padding (≤600px) */
  --head-h:        76px;     /* header height */
  --section-y:     96px;     /* vertical padding of a section band */
  --section-y-mobile: 64px;
  --gap:           22px;     /* default grid gap */
  --gap-lg:        56px;

  /* ---- radii ---- */
  --r:      14px;    /* cards, images */
  --r-sm:   10px;    /* inputs, chips */
  --r-lg:   20px;    /* lead card */
  --r-xl:   24px;    /* CTA band, modal */
  --r-pill: 999px;

  /* ---- shadows ---- */
  --shadow:    0 1px 2px oklch(0.3 0.02 55 / 0.04), 0 10px 30px oklch(0.3 0.04 55 / 0.07);
  --shadow-lg: 0 2px 8px oklch(0.3 0.02 55 / 0.06), 0 30px 70px oklch(0.3 0.05 55 / 0.16);
  --shadow-dark: 0 10px 30px oklch(0 0 0 / 0.35);
}