/* ============================================================
   Halenohi Tokyo — Spacing & layout tokens
   Spec Part 5-7. 余白は思い切って取る — generous whitespace.
   要素間 60–120px / セクション間 120–200px (PC).
   ============================================================ */

:root {
  /* ---- Base spacing scale (8px rhythm) ---- */
  --space-1:  0.25rem;  /* 4  */
  --space-2:  0.5rem;   /* 8  */
  --space-3:  0.75rem;  /* 12 */
  --space-4:  1rem;     /* 16 */
  --space-5:  1.5rem;   /* 24 */
  --space-6:  2rem;     /* 32 */
  --space-7:  2.5rem;   /* 40 */
  --space-8:  3.75rem;  /* 60  — min element gap */
  --space-9:  5rem;     /* 80 */
  --space-10: 7.5rem;   /* 120 — section gap (min) / element gap (max) */
  --space-11: 10rem;    /* 160 */
  --space-12: 12.5rem;  /* 200 — section gap (max) */

  /* ---- Semantic spacing ---- */
  --gap-element-min: var(--space-8);   /* 60  */
  --gap-element-max: var(--space-10);  /* 120 */
  --section-pad-y:   clamp(5rem, 12vw, 12.5rem); /* 80 → 200 */
  --content-gap:     clamp(2.5rem, 6vw, 7.5rem);

  /* ---- Layout widths ---- */
  --maxw-prose:   42rem;   /* 672 — comfortable JP reading column */
  --maxw-content: 64rem;   /* 1024 */
  --maxw-wide:    75rem;   /* 1200 */
  --page-gutter:  clamp(1.25rem, 5vw, 4rem);

  /* ---- Radii (spec 5-8: 角丸4px) ---- */
  --radius-sm: 2px;
  --radius:    4px;   /* default — buttons, cards */
  --radius-lg: 8px;
  --radius-pill: 999px;

  /* ---- Borders (spec 5-8: 1px 古紙風グレー) ---- */
  --border-width: 1px;
  --rule:       var(--border-width) solid var(--border);
  --rule-soft:  var(--border-width) solid var(--border-soft);
  --accent-bar: 3px;  /* vertical accent band width */

  /* ---- Control sizes (spec 5-8) ---- */
  --control-h:    56px; /* PC */
  --control-h-sp: 48px; /* SP */

  /* ---- Elevation — restrained;品 over drama ---- */
  --shadow-card:  0 1px 2px rgba(26, 26, 26, 0.04),
                  0 8px 24px rgba(26, 26, 26, 0.05);
  --shadow-float: 0 6px 20px rgba(26, 26, 26, 0.14);
  --shadow-image: 0 18px 50px rgba(26, 26, 26, 0.10);

  /* ---- Motion (spec 5-9) ---- */
  --ease:        cubic-bezier(0.22, 0.61, 0.36, 1); /* gentle, no spring */
  --dur-fade:    0.6s;  /* scroll fade-in */
  --dur-ui:      0.3s;  /* accordion, hover */
  --reveal-y:    20px;  /* translateY for fade-in */
  --hover-lift:  1.02;  /* photo hover scale */
}