/* 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-7:1.75rem; --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;
  /* 카드 호버 프리뷰 롤링 시간 — ⚠️ 반드시 리터럴 유지, --dur* 별칭 금지.
     (아래 reduce 블록이 --dur* 를 .001ms 로 죽이는데, 별칭으로 걸면 components.css 의
     reduced-motion !important 가드까지 .001ms 로 자멸해 "롤링 즉시점프" 사고가 재발한다)
     모바일(세로뷰·폰셸)은 캡처가 훨씬 길어 같은 4s면 체감 속도가 과함 → 2배(8s)로 절반 감속 */
  --preview-scroll-dur:8s;
  --preview-scroll-dur-m:16s;

  /* 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; }
}