/* Shorepine foundations: the one set of design tokens. The landing page loads a byte-for-byte copy from its
   assets folder (font paths resolve the same from both places): change this file, then copy it over.

   Rules: names say the job, never the element; components read these directly (no alias chains);
   a value only one component uses lives inside that component as a private --_var.
   Values marked SHIFT moved slightly when the set was simplified; every other value is unchanged. */

@font-face{font-family:"TT Neoris";src:url("./fonts/TT_Neoris_Light.woff2") format("woff2");font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:"TT Neoris";src:url("./fonts/TT_Neoris_Light_Italic.woff2") format("woff2");font-weight:300;font-style:italic;font-display:swap}
@font-face{font-family:"TT Neoris";src:url("./fonts/TT_Neoris_Medium.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}

:root{
  /* Name (content, not a design token; the one place a rename touches) */
  --brand-name:"Shorepine";
  --brand-endorsement:"by Skyrocket";

  /* ---------- Colour: 12 brand roles ---------- */
  --color-bg:#F8F2E9;            /* album paper: the page */
  --color-bg-alt:#F0E6D7;        /* cream: alternate sections */
  --color-surface:#FFFCF7;       /* cards, inputs, popovers, print borders; text on accent and on ink */
  --color-text:#1D113A;          /* Skyrocket Dark Purple: text, and the footer field */
  --color-text-muted:#5C5160;    /* secondary text; disabled text (SHIFT: disabled text was #645A66) */
  --color-line:#E3D7C7;          /* hairlines, dividers, quiet borders (SHIFT: also takes #CDBFAE line-strong) */
  --color-border:#8A7A84;        /* control boundaries (inputs, outline buttons): 3:1 on every ground */
  --color-accent:#6B1A44;        /* plum: action, links, eyebrows, the closing field */
  --color-accent-strong:#58143A; /* hover and press (SHIFT: press was #47102F) */
  --color-accent-soft:#F4E2E9;   /* tints, soft text on plum and ink (SHIFT: also takes #FAF0F3) */
  --color-accent-blush:#E8C5D3;  /* the second headline line on plum */
  --color-focus:#B03A74;         /* focus ring on light grounds (on plum and ink the ring uses --color-surface) */

  /* ---------- Colour: 5 state ---------- */
  --color-success:#2D6A4C;      /* text and dot (SHIFT: dot was #3E8A63) */
  --color-success-soft:#E2EFE6;
  --color-error:#9B2C2C;
  --color-error-soft:#F8E4E1;
  --color-disabled:#E9E0D4;

  /* ---------- Type: one family, 2 weights, 8 sizes ---------- */
  --font:"TT Neoris",Arial,sans-serif;
  --weight-light:300;            /* body */
  --weight-medium:500;           /* headings, buttons, labels */

  --fs-3xl:clamp(2.5rem, 1.62rem + 3.756vw, 5rem);       /* 40-80 display */
  --fs-2xl:clamp(2rem, 1.472rem + 2.254vw, 3.5rem);      /* 32-56 section titles */
  --fs-xl:clamp(1.5rem, 1.236rem + 1.127vw, 2.25rem);    /* 24-36 */
  --fs-lg:clamp(1.25rem, 1.118rem + .563vw, 1.625rem);   /* 20-26 */
  --fs-md:clamp(1.125rem, 1.037rem + .376vw, 1.375rem);  /* 18-22 lead */
  --fs-base:clamp(1rem, .956rem + .188vw, 1.125rem);     /* 16-18 body; large buttons (SHIFT: was 18 fixed) */
  --fs-sm:clamp(.9375rem, .916rem + .094vw, 1rem);       /* 15-16 small, captions, buttons (SHIFT: was 16 fixed) */
  --fs-xs:.875rem;                                       /* 14 labels, eyebrows (SHIFT: eyebrow was 13) */

  --leading-tight:1.04;
  --leading-heading:1.12;
  --leading-snug:1.3;
  --leading-body:1.5;

  --tracking-tight:-0.025em;
  --tracking-heading:-0.015em;
  --tracking-wide:.14em;

  /* ---------- Spacing: one 4px scale, 8 steps (same names and values as today) ---------- */
  --space-1:.25rem;  /* 4 */
  --space-2:.5rem;   /* 8 */
  --space-3:.75rem;  /* 12 */
  --space-4:1rem;    /* 16 */
  --space-5:1.25rem; /* 20 */
  --space-6:1.5rem;  /* 24 */
  --space-7:2rem;    /* 32 */
  --space-8:2.5rem;  /* 40 */

  /* ---------- Layout ---------- */
  --gutter:clamp(1rem, .296rem + 3.005vw, 3rem);
  --section-y:clamp(4rem, 2.592rem + 6.009vw, 8rem);
  --container:1240px;
  --container-narrow:760px;
  --measure:62ch;
  --sticky-offset:clamp(64px, 3.5rem + 1.5vw, 76px);  /* height of the sticky bar: anchors and the pinned stage clear it */

  /* ---------- Shape: 3 radii + pill, 2 line widths ---------- */
  --radius-sm:8px;               /* photo inside a print */
  --radius-md:16px;              /* inputs, popovers (SHIFT: was 20), prints (SHIFT: was 18) */
  --radius-lg:clamp(28px, 1.4rem + 1vw, 40px);  /* cards and panels: 28 on phones to 40 wide, the largest radius
                                                   (panels unchanged; SHIFT: the testimonial card was 28 fixed) */
  --radius-pill:999px;
  --line-width:1px;
  --line-width-strong:1.5px;     /* control boundaries */

  /* ---------- Elevation: one shadow, prints only (SHIFT: the lifted destination prints used a deeper second shadow) ---------- */
  --shadow:0 1px 1px rgba(51,9,31,.06), 0 12px 24px -12px rgba(51,9,31,.30);

  /* ---------- Focus ---------- */
  --focus-width:3px;             /* ring width and offset */

  /* ---------- Motion: 3 durations, 2 easings ---------- */
  --dur-fast:160ms;
  --dur-base:240ms;
  --dur-slow:420ms;
  --ease:cubic-bezier(.2,0,0,1);
  --ease-out:cubic-bezier(.16,1,.3,1);

  /* ---------- Layers ---------- */
  --z-sticky:50;
  --z-overlay:60;
}

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