/* tokens.css — REBEAUTY renewal design tokens (loaded BEFORE style.css; additive only).
   White canvas + REBEAUTY purple accent + near-black text + tall 2:3 cards.
   Closed spacing/type scales satisfy the project Spacing Contract (no raw px>=16 on layout). */
:root {
  /* spacing primitives (closed scale) */
  --space-0:0; --space-1:.25rem; --space-2:.5rem; --space-3:.75rem; --space-4:1rem;
  --space-5:1.25rem; --space-6:1.5rem; --space-8:2rem; --space-10:2.5rem; --space-12:3rem;
  --space-16:4rem; --space-20:5rem;

  /* semantic layout tokens */
  --gutter: var(--space-6);
  --container: 1320px;
  --container-narrow: 1040px;
  --section-pad-block: clamp(2rem, 4vw, 3.5rem);
  --section-gap: var(--space-10);
  --grid-gap: var(--space-5);
  --grid-gap-tight: var(--space-4);
  --card-pad: var(--space-3);
  --stack-gap: var(--space-4);
  --cluster-gap: var(--space-2);
  --peek-gutter: var(--space-4);

  /* type scale (clamp ends = measured min/max) */
  --fs-caption: clamp(.6875rem,.66rem + .15vw,.75rem);
  --fs-meta:    clamp(.75rem,.72rem + .2vw,.8125rem);
  --fs-body:    clamp(.875rem,.85rem + .2vw,.9375rem);
  --fs-card-title: clamp(.8125rem,.78rem + .25vw,.9375rem);
  --fs-h3: clamp(1rem,.95rem + .4vw,1.125rem);
  --fs-h2: clamp(1.125rem,1rem + .8vw,1.5rem);
  --fs-h1: clamp(1.375rem,1.2rem + 1.2vw,2rem);
  --lh-tight:1.3; --lh-snug:1.4; --lh-body:1.6;

  /* BREAKPOINTS (frozen, for all new code): xl 1180 · lg 1024 · md 768 · sm 480 */

  /* card system */
  --card-radius:.5rem;
  --card-aspect: 330/489;            /* cafe24 tall portrait ~2:3 */
  --card-shadow: 0 1px 3px rgb(0 0 0 / .06);
  --card-shadow-hover: 0 8px 24px rgb(0 0 0 / .10);

  /* motion tokens */
  --dur-fast:.12s; --dur:.2s; --dur-slow:.4s; --ease:cubic-bezier(.4,0,.2,1);
  --reveal-y:8px;

  /* new layout constant (palette refinements live in components.css, which loads AFTER style.css) */
  --gnb-h: 60px;
}

@media (prefers-reduced-motion: reduce) {
  :root { --reveal-y:0; --dur-fast:.001ms; --dur:.001ms; --dur-slow:.001ms; }
  *,*::before,*::after { animation-duration:.001ms !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
}