/* ═══════════════════════════════════════════════════════
   和流 -ORYU- — Sub-page tokens + theme overrides
   Loaded AFTER common.css. Defines this page-set's
   design tokens (:root) and only the property values
   that differ from common.css's baseline (this page-set
   uses a quieter, icon-free treatment vs HOME's craft-tag
   aesthetic — the two page-sets are intentionally distinct
   by design, not an accidental fork).
   ═══════════════════════════════════════════════════════ */

:root {
  --ink: #0c0c0b;
  --panel: #141413;
  --bone: #f2efe9;
  --stone: #a8a39a;
  --brass: #b08d4f;
  --line: rgba(242, 239, 233, 0.1);
  --hair: rgba(242, 239, 233, 0.1);
  --hdr: 84px;
  --ease: cubic-bezier(0.19, 1, 0.22, 1);
  --ease-soft: cubic-bezier(0.4, 0, 0.2, 1);
  --font-display: 'Fraunces', 'Shippori Mincho B1', serif;
  --font-jp: 'Shippori Mincho B1', serif;
  --font-sans: 'Noto Sans JP', sans-serif;
  --neon: #1ee378;
  --hdr-bg: rgba(12, 12, 11, .92);
  --mnav-bg: var(--ink);
  --mbar-bg: rgba(12, 12, 11, .95);
  --footer-bg: var(--ink);
}

/* ── Theme deltas vs common.css baseline (quieter, no monospace tag) ──
   Scoped to desktop/tablet (769px+) ONLY. common.css's mobile block
   (≤768px) must win for header/section padding, heading sizes, and
   button sizing — these deltas are purely a desktop visual theme
   difference between this page-set and HOME, not a mobile concern. */
@media (min-width: 769px) {
  #hdr { padding: 0 3.5rem; }
  footer { padding: 6rem 3.5rem 3rem; }
  .sec { padding: 11rem 3.5rem; }
  .sec-tight { padding: 6rem 3.5rem; }
  .h2 { font-size: clamp(2.2rem, 5vw, 3.6rem); line-height: 1.25; }
  .btn { font-size: .72rem; letter-spacing: .08em; padding: 1.05rem 2.4rem; }
  .ph { padding: 8rem 3.5rem 5rem; }
  .ph-t { font-size: clamp(2.8rem, 7vw, 5.2rem); }
}
.hbg span { width: 20px; }
.mnav { clip-path: circle(0% at calc(100% - 3rem) 42px); transition: clip-path .65s var(--ease); }
.mnav.on { clip-path: circle(150% at calc(100% - 3rem) 42px); }
.mnav a { font-weight: 400; }
.mnav-cta { border-color: rgba(242, 239, 233, .25); color: var(--bone) !important; font-family: var(--font-sans) !important; }
.mbar a.pri { color: var(--bone); }
.ft-inner { max-width: 1240px; }
.ft-btm { max-width: 1240px; }
.ft-social a:hover { color: var(--bone); }
footer h4 { font-family: var(--font-sans); }
.con { max-width: 1240px; }
.con-nar { max-width: 780px; }
.eyebrow { font-family: var(--font-sans); }
.eyebrow::before { display: none; }
.h2 { font-weight: 400; }
.btn { font-family: var(--font-sans); }
.btn-o:hover { border-color: var(--bone); color: var(--bone); }
.ph { background: transparent; }
.ph::before { display: none; }
.ph-ey { font-family: var(--font-sans); }
.ph-ey::before { display: none; }
.ph-t { font-weight: 400; }
.logo-r { font-family: var(--font-sans); font-weight: 400; letter-spacing: .38em; }

@media (min-width: 769px) and (max-width: 960px) {
  body { padding-bottom: 78px; }
  .sec { padding: 6rem 1.5rem; }
}
