:root {
  --mold-version: 9;
  --ink: #342d24;
  --paper: #f6efe3;
  --gold: #8a6f4c;
  --muted: #8e806e;
  --olive: #344622;
  --terracotta: #9b5d45;
  --line: rgba(52,45,36,.18);
  --white: #fffdf8;
  --lh-body: 1.95;
  --lh-display: 1.35;
  --ls-en: .10em;
  --ls-body: .02em;
  --ls-display: .04em;
  --fw-strong: 700;
  --fw-body: 400;
  --fw-display: 500;
  --font-en: "Cormorant Garamond", serif;
  --font-body: "Noto Sans JP", sans-serif;
  --font-display: "Zen Old Mincho", serif;
}

html { scroll-behavior: smooth; }
body { color: var(--ink); background: var(--paper); font-family: var(--font-body); font-weight: var(--fw-body); letter-spacing: var(--ls-body); }
p { line-height: 1.9; }
img { display: block; max-width: 100%; }
h1,h2,h3,.brand__text { font-family: var(--font-display); font-weight: var(--fw-display); }
.section__head h2,.quality__body h2,.first-visit__body h2,.access-section__body h2,.contact h2 { font-family: var(--font-display); font-weight: var(--fw-display); letter-spacing: var(--ls-display); line-height: var(--lh-display); }
.eyebrow { font-family: var(--font-en); letter-spacing: .18em; text-transform: uppercase; color: #715737; }
.proof-band .eyebrow,.contact .eyebrow { color:#d9c7aa; }
.btn { min-height: 64px; padding: 0 30px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; gap: 24px; font-weight: 500; letter-spacing: .08em; transition: background-color .3s ease,color .3s ease,transform .3s ease,border-color .3s ease; }
.btn:hover { transform: translateY(-2px); }
.btn:focus-visible,a:focus-visible,button:focus-visible { outline: 2px solid var(--terracotta); outline-offset: 4px; }
.btn--primary { background: var(--olive); color: var(--white); border: 1px solid var(--olive); }
.btn--primary:hover { background: #4b5e35; color: #fff; }
.btn--ghost { border: 1px solid var(--olive); color: var(--olive); background: transparent; }
.btn--ghost:hover { background: var(--olive); color: var(--white); }

.site-header { position: absolute; z-index: 30; inset: 0 0 auto; height: 100px; padding: 24px 4.8%; display: flex; align-items: flex-start; justify-content: space-between; background: transparent; color: var(--ink); }
.brand { color: inherit; text-decoration: none; }
.brand__text { display: grid; line-height: 1; }
.brand__text b { font-family: var(--font-en); font-size: clamp(30px,2.15vw,38px); font-weight: 500; letter-spacing: .24em; }
.brand__text small { margin-top: 9px; font-family: var(--font-en); font-size: 14px; letter-spacing: .24em; }
.nav { display: flex; align-items: center; gap: clamp(28px,3.1vw,52px); padding-top: 9px; }
.nav a { color: inherit; font-family: var(--font-en); font-size: 19px; text-decoration: none; letter-spacing: .02em; position: relative; }
.nav a::after { content:""; position:absolute; left:0; right:100%; bottom:-6px; height:1px; background:currentColor; transition:right .3s ease; }
.nav a:hover::after { right:0; }
.nav-toggle { display:none; }

.hero { position: relative; aspect-ratio: 1672 / 941; min-height: 650px; padding-top:0; background: url('assets/fv-bg.jpg') center / cover no-repeat; overflow: hidden; container-type: inline-size; }
.hero__ambient { position:absolute; inset:0; pointer-events:none; opacity:.14; }
.hero__copy { position:absolute; left:4.8%; top:42.6%; bottom:auto; width:29.5%; z-index:2; padding:0; justify-content:flex-start; }
.hero h1 { margin:0; color:#24211d; font-size:clamp(42px,4.05vw,68px); line-height:1.5; letter-spacing:.015em; }
.hero h1 .l { display:block; overflow:hidden; }
.hero h1 .l span { display:block; }
.hero__lead { margin:clamp(16px,1.45vw,24px) 0 0; font-size:clamp(14px,1.12vw,19px); white-space:nowrap; letter-spacing:.04em; }
.hero__cta { margin-top:clamp(18px,1.8vw,30px); width:min(420px,86%); min-height:clamp(54px,4.15vw,70px); font-size:clamp(16px,1.22vw,21px); }
.hero__vertical { position:absolute; z-index:2; left:84.2%; top:28.7%; height:36%; display:flex; flex-direction:row-reverse; align-items:flex-start; gap:18px; font-family:var(--font-display); font-size:clamp(24px,2.25vw,38px); line-height:1.45; letter-spacing:.12em; }
.hero__vertical span { display:block; writing-mode:vertical-rl; }
.hero__proof { position:absolute; z-index:2; left:4.8%; bottom:5.8%; width:40%; display:grid; grid-template-columns:repeat(3,max-content); align-items:center; gap:0; list-style:none; margin:0; padding:0; }
.hero__proof li { display:flex; align-items:center; gap:12px; min-height:48px; padding:0 28px; border-right:1px solid var(--line); font-size:clamp(14px,1.12vw,19px); white-space:nowrap; }
.hero__proof li:first-child { padding-left:0; }
.hero__proof li:last-child { border-right:0; }
.proof-icon { color:var(--olive); font-size:27px; }
.hero__mobile-photo { display:none; }

.ghost { position:absolute; z-index:0; top:0; left:2vw; font-family:var(--font-en); font-size:clamp(90px,14vw,220px); color:rgba(113,87,55,.06); letter-spacing:.02em; pointer-events:none; }
.ghost--light { color:rgba(255,255,255,.07); }
.section__head { position:relative; z-index:1; }
.section__head h2 { margin:.2em 0 0; font-size:clamp(38px,5vw,76px); }
.section__lead { max-width:760px; line-height:2.1; color:#5c5347; }

.concept { position:relative; padding:150px 6vw 0; overflow:hidden; }
.concept__inner { max-width:1200px; margin:auto; display:grid; grid-template-columns:110px minmax(340px,.8fr) 1fr; gap:54px; align-items:start; }
.concept__vertical { writing-mode:vertical-rl; font-family:var(--font-display); font-size:19px; letter-spacing:.16em; border-left:1px solid var(--line); padding-left:25px; }
.concept__copy { padding-top:52px; max-width:560px; }
.concept__copy p { margin:0 0 1.6em; line-height:2.2; }
.concept__fullbleed { margin:110px auto 0; max-width:1320px; position:relative; }
.concept__fullbleed img { width:100%; aspect-ratio:16/8; object-fit:cover; }
.concept__fullbleed figcaption { margin-top:14px; color:var(--muted); font-family:var(--font-en); letter-spacing:.1em; }

.marquee { margin-top:90px; padding:20px 0; overflow:hidden; border-top:1px solid var(--line); border-bottom:1px solid var(--line); display:flex; }
.marquee__inner { display:flex; flex:none; gap:70px; padding-right:70px; animation:marquee-scroll 38s linear infinite; font-family:var(--font-en); font-size:27px; color:var(--gold); }
.marquee__inner span::after { content:"✦"; margin-left:70px; font-size:12px; }
@keyframes marquee-scroll { to { transform:translateX(-100%); } }

.proof-band { position:relative; overflow:hidden; margin-top:0; padding:140px 6vw; background:#2f3927; color:#f8f3ea; }
.proof-band>.section__head { max-width:1200px; margin:0 auto 70px; }
.proof-band .section__head h2 { color:#fff; }
.reason-grid { max-width:1200px; margin:auto; display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:rgba(255,255,255,.18); }
.reason-card { min-height:330px; padding:52px 42px; background:#34412d; }
.reason-card>span { font-family:var(--font-en); font-size:19px; color:#c8b49b; }
.reason-card h3 { margin:45px 0 20px; font-size:28px; color:#fff; }
.reason-card p { color:rgba(255,255,255,.78); line-height:2; }

.service { position:relative; overflow:hidden; padding:150px 6vw; }
.service>.section__head,.service>.section__lead,.service-grid,.menu-note { max-width:1200px; margin-left:auto; margin-right:auto; }
.service>.section__lead { margin-top:32px; }
.service-grid { margin-top:70px; display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.service-card { color:inherit; text-decoration:none; }
.service-card figure { overflow:hidden; background:#e7ded0; }
.service-card img { width:100%; aspect-ratio:4/3; object-fit:cover; transition:transform .8s cubic-bezier(.2,.7,.2,1); }
.service-card:hover img { transform:scale(1.035); }
.service-card>span { display:block; margin-top:25px; color:var(--gold); font-family:var(--font-en); letter-spacing:.12em; }
.service-card h3 { margin:8px 0 14px; font-size:27px; }
.service-card p { min-height:5.8em; line-height:1.9; color:#62584c; }
.service-card strong { display:block; padding-top:15px; border-top:1px solid var(--line); font-size:20px; font-weight:500; }
.menu-note { margin-top:60px; padding:24px 0; display:flex; justify-content:space-between; gap:30px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.menu-note p { margin:0; }
.menu-note a { color:var(--olive); font-weight:500; }

.first-visit { display:grid; grid-template-columns:1.15fr .85fr; min-height:760px; padding-block:60px; background:#ece2d4; }
.first-visit__visual img { width:100%; height:100%; min-height:760px; object-fit:cover; }
.first-visit__body { padding:100px 7vw 80px 70px; }
.first-visit__body h2 { margin:10px 0 45px; font-size:clamp(40px,4.5vw,68px); }
.visit-steps { list-style:none; padding:0; margin:0; }
.visit-steps li { display:grid; grid-template-columns:48px 1fr; gap:22px; padding:20px 0; border-top:1px solid var(--line); }
.visit-steps li:last-child { border-bottom:1px solid var(--line); }
.visit-steps b { font-family:var(--font-en); color:var(--gold); font-size:18px; }
.visit-steps h3 { margin:0 0 6px; font-size:20px; }
.visit-steps p { margin:0; color:#64594d; line-height:1.8; }

.quality { position:relative; display:grid; grid-template-columns:1.08fr .92fr; align-items:center; padding:140px 6vw; gap:7vw; overflow:hidden; }
.quality__photo-wrap { position:relative; margin:0; }
.quality__photo { width:100%; aspect-ratio:4/3; object-fit:cover; }
.quality__badge { position:absolute; right:-28px; bottom:-30px; padding:25px 30px; background:var(--olive); color:#fff; display:grid; gap:4px; }
.quality__badge strong { font-family:var(--font-display); font-size:20px; }
.quality__badge span { font-size:12px; opacity:.8; }
.quality__body h2 { margin:15px 0 32px; font-size:clamp(40px,4.5vw,68px); }
.quality__body p { line-height:2.05; color:#5d5347; }
.quality-track { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:30px; max-width:470px; }
.quality-track span { padding:10px 16px; border:1px solid var(--line); border-radius:999px; font-size:13px; }

.voice { position:relative; overflow:hidden; padding:130px 6vw; display:grid; grid-template-columns:.9fr 1.1fr; gap:7vw; align-items:center; background:#fffaf2; }
.voice__visual img { width:100%; aspect-ratio:4/3; object-fit:cover; }
.voice__body .section__head h2 { font-size:clamp(40px,4vw,62px); }
.voice__grid { margin-top:35px; }
.voice__grid figure { margin:0; padding:23px 0; border-top:1px solid var(--line); }
.voice__grid figure:last-child { border-bottom:1px solid var(--line); }
.voice__grid blockquote { margin:0 0 12px; font-family:var(--font-display); font-size:20px; line-height:1.8; }
.voice__grid figcaption { color:var(--muted); font-size:13px; }

.access-section { display:grid; grid-template-columns:1.08fr .92fr; min-height:720px; padding-block:60px; background:#e8ddcd; }
.access-section__photo img { width:100%; height:100%; min-height:720px; object-fit:cover; }
.access-section__body { padding:90px 7vw; background:#e8ddcd; }
.access-section__body h2 { margin:10px 0 35px; font-size:clamp(38px,4vw,62px); }
.access { margin:0 0 34px; }
.access>div { display:grid; grid-template-columns:110px 1fr; gap:20px; padding:15px 0; border-top:1px solid var(--line); }
.access>div:last-child { border-bottom:1px solid var(--line); }
.access dt { color:var(--muted); }
.access dd { margin:0; }
.access-section dd { color:var(--ink)!important; }
.provisional { font-size:15px; line-height:1.8; color:#655a4d; margin-top:20px; }

.contact { position:relative; overflow:hidden; padding:130px 6vw; display:grid; grid-template-columns:.9fr 1.1fr; gap:7vw; background:#2f3927; color:#fff; }
.contact__bg { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.12; mix-blend-mode:screen; }
.contact>div,.contact-form { position:relative; z-index:1; }
.contact h2 { margin:10px 0 30px; font-size:clamp(34px,3.6vw,56px); color:#fff; }
.contact h2 span { display:block; white-space:nowrap; }
.contact p { color:rgba(255,255,255,.75); line-height:2; }
.contact .access { margin-top:30px; }
.contact .access>div { border-color:rgba(255,255,255,.18); }
.contact .access dt { color:rgba(255,255,255,.55); }
.contact-form { padding:50px; background:#f9f3e9; color:var(--ink); display:grid; gap:18px; }
.contact-form h3 { margin:0 0 8px; font-size:27px; }
.contact-form label { display:grid; gap:7px; font-size:13px; color:#6c6052; }
.contact-form input,.contact-form textarea,.contact-form select { width:100%; border:0; border-bottom:1px solid #b9aa97; background:transparent; padding:11px 4px; color:var(--ink); font:inherit; }
.contact-form textarea { border:1px solid #c8baa8; padding:12px; resize:vertical; }
.contact-form .btn { margin-top:8px; border:0; }
.form-note { margin:0!important; color:#6e6254!important; font-size:15px; line-height:1.8!important; }
.contact>.ghost { display:none; }

.footer { padding:70px 6vw 35px; background:#1f251c; color:#fff; display:grid; grid-template-columns:1.5fr 1fr .6fr; gap:40px; }
.footer__brand { display:grid; gap:6px; }
.footer__brand strong { font-family:var(--font-en); font-size:36px; letter-spacing:.2em; font-weight:500; }
.footer__brand>span { font-family:var(--font-en); letter-spacing:.18em; }
.footer__brand p { color:rgba(255,255,255,.6); line-height:1.8; }
.footer__nav { display:grid; grid-template-columns:1fr 1fr; gap:12px 25px; }
.footer a { color:#fff; text-decoration:none; }
.footer__sns { display:flex; gap:10px; align-items:start; flex-wrap:wrap; }
.footer__sns a { width:auto!important; height:auto!important; min-width:72px; padding:9px 13px; border:1px solid rgba(255,255,255,.25); }
.footer small { grid-column:1/-1; padding-top:30px; border-top:1px solid rgba(255,255,255,.14); color:rgba(255,255,255,.45); }
.sticky-cta { display:none; }

@media (max-width:1040px) {
  .site-header { position:fixed; height:74px; padding:14px 20px; align-items:center; background:rgba(246,239,227,.92); backdrop-filter:blur(12px); border-bottom:1px solid rgba(52,45,36,.1); }
  .brand__text b { font-size:26px; }
  .brand__text small { margin-top:4px; font-size:10px; }
  .nav { display:none; }
  .nav-toggle { display:grid; gap:6px; width:44px; height:44px; place-content:center; border:0; background:transparent; }
  .nav-toggle span { display:block; width:24px; height:1px; background:currentColor; }
  .hero { min-height:92svh; aspect-ratio:auto; background:none; padding:116px 20px 58px; display:flex; flex-direction:column; }
  .hero__copy { position:static; width:auto; order:1; }
  .hero h1 { font-size:clamp(40px,11vw,58px); line-height:1.45; }
  .hero__lead { white-space:normal; font-size:14px; margin-top:18px; }
  .hero__cta { width:100%; max-width:380px; margin-top:24px; }
  .hero__mobile-photo { display:block; order:2; margin:36px 0 0; width:100%; overflow:hidden; }
  .hero__mobile-photo img { width:100%; aspect-ratio:685/720; object-fit:cover; }
  .hero__vertical { display:none; }
  .hero__proof { position:static; width:auto; order:3; margin-top:25px; display:grid; grid-template-columns:1fr; gap:0; }
  .hero__proof li { min-height:44px; padding:0; border-right:0; border-bottom:1px solid var(--line); font-size:14px; }
  .concept__inner { grid-template-columns:1fr; gap:25px; }
  .concept__vertical { writing-mode:horizontal-tb; border-left:0; border-bottom:1px solid var(--line); padding:0 0 18px; }
  .concept__copy { padding-top:0; }
  .reason-grid,.service-grid { grid-template-columns:1fr; }
  .reason-card { min-height:260px; }
  .service-card p { min-height:auto; }
  .first-visit,.quality,.voice,.access-section,.contact { grid-template-columns:1fr; }
  .first-visit__visual img,.access-section__photo img { min-height:0; aspect-ratio:4/3; }
  .first-visit__body,.access-section__body { padding:70px 6vw; }
  .quality { padding:100px 6vw; }
  .quality__badge { right:15px; bottom:15px; }
  .voice { padding:100px 6vw; }
  .contact { padding:100px 6vw; }
  .footer { grid-template-columns:1fr 1fr; }
}

@media (max-width:640px) {
  .concept,.service,.proof-band { padding-left:20px; padding-right:20px; }
  .concept { padding-top:95px; }
  .concept__fullbleed { margin-top:60px; }
  .concept__fullbleed img { aspect-ratio:4/3; }
  .section__head h2 { font-size:39px; }
  .proof-band { padding-top:95px; padding-bottom:95px; }
  .reason-card { padding:38px 26px; }
  .service { padding-top:95px; padding-bottom:95px; }
  .menu-note { display:block; }
  .menu-note a { display:inline-block; margin-top:15px; }
  .first-visit__body,.access-section__body { padding:65px 20px; }
  .quality,.voice,.contact { padding:90px 20px; }
  .quality__body h2,.first-visit__body h2,.access-section__body h2 { font-size:38px; }
  .contact h2 { font-size:clamp(32px,8.7vw,36px); }
  .voice__grid blockquote { font-size:17px; }
  .access>div { grid-template-columns:84px 1fr; font-size:14px; }
  .contact-form { padding:30px 22px; }
  .footer { grid-template-columns:1fr; padding:60px 20px 100px; }
  .footer small { grid-column:auto; }
  .sticky-cta { position:fixed; z-index:50; left:12px; right:12px; bottom:12px; min-height:54px; border-radius:999px; display:grid; place-items:center; background:var(--olive); color:#fff; text-decoration:none; box-shadow:0 12px 30px rgba(0,0,0,.18); }
}

@media (prefers-reduced-motion: reduce) {
  .hero__ambient { display:none; }
  .marquee__inner { animation-duration:55s; }
}

/* FVのリードとボタンが重ならないように（2026-10-07）
   styles.css の「.hero__copy [data-reveal] { translateY(42px) }」がリードとボタンにも効き、
   下からせり上がる途中のリードがボタンの裏に隠れていた。モーション設計どおりに戻す：
   リード＝その場でフェードだけ／ボタン＝その場で少し拡大しながらフェード。どちらも上下には動かさない */
.hero__copy .hero__lead[data-reveal] { transform: none; }
.hero__copy .hero__cta[data-reveal] { transform: scale(.96); }
.hero__copy .hero__lead[data-reveal].is-visible,
.hero__copy .hero__cta[data-reveal].is-visible,
body.no-motion .hero__copy .hero__cta[data-reveal] { transform: none; }
