
:root{
  --ink:#25211e; --muted:#716a64; --paper:#f8f5f0; --card:#fff;
  --accent:#9b6f55; --deep:#493c34; --line:#ddd4ca;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);background:var(--paper);font-family:"Noto Sans SC","Noto Sans JP",Arial,sans-serif;line-height:1.7}
img{display:block;width:100%}
a{text-decoration:none;color:inherit}
.site-header{height:78px;display:flex;align-items:center;justify-content:space-between;padding:0 5vw;background:rgba(248,245,240,.92);backdrop-filter:blur(14px);position:fixed;z-index:20;top:0;left:0;right:0;border-bottom:1px solid rgba(110,90,75,.12)}
.brand{display:flex;align-items:center;gap:12px}
.brand-mark{width:42px;height:42px;border:1px solid var(--accent);border-radius:50%;display:grid;place-items:center;font-family:"Playfair Display",serif;font-size:24px;color:var(--accent)}
.brand b{display:block;letter-spacing:.18em;font-size:14px}
.brand small{display:block;font-size:9px;letter-spacing:.16em;color:var(--muted)}
nav{display:flex;gap:28px;font-size:14px}
nav a:hover{color:var(--accent)}
.lang-switch{display:flex;border:1px solid var(--line);border-radius:30px;padding:3px}
.lang-switch button{border:0;background:transparent;padding:6px 10px;border-radius:20px;cursor:pointer;color:var(--muted)}
.lang-switch button.active{background:var(--deep);color:#fff}
.hero{min-height:760px;height:92vh;position:relative;overflow:hidden;background:#cfc5ba}
.hero>img{height:100%;object-fit:cover}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(30,23,19,.68),rgba(30,23,19,.22) 58%,rgba(30,23,19,.08))}
.hero-content{position:absolute;left:8vw;top:50%;transform:translateY(-46%);max-width:700px;color:#fff}
.eyebrow,.section-kicker{text-transform:uppercase;letter-spacing:.22em;font-size:12px;font-weight:700}
.hero h1{font-family:"Playfair Display","Noto Sans SC",serif;font-size:clamp(44px,6vw,82px);line-height:1.12;margin:16px 0 22px;max-width:850px}
.hero-content>p:not(.eyebrow){font-size:18px;max-width:610px;opacity:.94}
.hero-actions{display:flex;gap:14px;margin-top:34px}
.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:3px;padding:14px 28px;font-weight:700;transition:.25s}
.btn.primary{background:#fff;color:var(--deep)}
.btn.ghost{border:1px solid rgba(255,255,255,.7);color:#fff}
.btn:hover{transform:translateY(-2px)}
.quick-facts{position:absolute;left:8vw;right:8vw;bottom:0;background:rgba(255,255,255,.94);display:grid;grid-template-columns:repeat(4,1fr);padding:22px 28px}
.quick-facts div{display:flex;align-items:baseline;justify-content:center;gap:10px;border-right:1px solid var(--line)}
.quick-facts div:last-child{border:0}
.quick-facts b{font-family:"Playfair Display",serif;font-size:36px;color:var(--accent)}
.quick-facts span{font-size:13px;color:var(--muted)}
.section{padding:110px 8vw}
.intro{text-align:center;max-width:1320px;margin:auto}
.section-kicker{color:var(--accent)}
h2{font-family:"Playfair Display","Noto Sans SC",serif;font-size:clamp(32px,4.2vw,56px);line-height:1.25;margin:14px 0 24px}
.intro>p{max-width:870px;margin:0 auto;color:var(--muted);font-size:17px}
.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:60px;text-align:left}
.feature-grid article{background:var(--card);padding:32px 28px;border:1px solid #eee8e1;min-height:220px}
.feature-grid article>span{display:grid;place-items:center;width:42px;height:42px;border:1px solid var(--line);border-radius:50%;color:var(--accent);font-weight:700}
.feature-grid h3{margin:18px 0 8px}
.feature-grid p{font-size:14px;color:var(--muted)}
.gallery-section{background:#eee8e1}
.section-heading{display:flex;align-items:end;justify-content:space-between;gap:40px}
.section-heading>p{max-width:410px;color:var(--muted)}
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:48px}
.gallery figure{margin:0;background:#fff;overflow:hidden;position:relative}
.gallery figure.wide{grid-column:span 2}
.gallery img{aspect-ratio:4/3;object-fit:cover;transition:.4s}
.gallery figure.wide img{aspect-ratio:2/1}
.gallery figure:hover img{transform:scale(1.025)}
.gallery figcaption{position:absolute;left:16px;right:16px;bottom:16px;background:rgba(255,255,255,.92);padding:12px 15px;display:flex;justify-content:space-between;gap:14px}
.gallery figcaption span{font-size:12px;color:var(--muted)}
.photo-note{font-size:12px;color:var(--muted);text-align:center;margin-top:18px}
.access-section{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}
.access-copy>p{color:var(--muted)}
.access-copy ul{list-style:none;padding:0;margin:35px 0 0}
.access-copy li{display:flex;justify-content:space-between;gap:20px;padding:16px 0;border-bottom:1px solid var(--line)}
.access-copy li span{color:var(--muted);text-align:right}
.map-card{background:#fff;padding:35px;border:1px solid #eee6de;box-shadow:0 20px 50px rgba(70,50,40,.08)}
.map-title b,.map-title span{display:block;font-weight:700}
.map-title small{color:var(--muted)}
.map-card svg{width:100%;margin-top:16px}
.map-card .line{fill:none;stroke:#b48a6e;stroke-width:8;stroke-linecap:round;opacity:.55}
.map-card .hub{fill:#493c34}
.map-card .stop{fill:#d5bba9}
.map-card text{fill:#493c34;font-size:16px;font-family:Arial,sans-serif}
.map-card .hub+text,.map-card .hub+text+text{fill:#fff;font-size:14px}
.nearby{padding:100px 8vw;background:#2f2925;color:#fff;text-align:center}
.nearby .section-kicker{color:#d4b39c}
.nearby-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:rgba(255,255,255,.16);margin-top:45px}
.nearby-grid div{background:#2f2925;padding:32px 18px}
.nearby-grid b,.nearby-grid span{display:block}
.nearby-grid span{font-size:13px;opacity:.7;margin-top:7px}
.booking{margin:0;padding:75px 8vw;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:space-between;gap:40px}
.booking h2{margin:8px 0 10px}
.booking p{margin:0;opacity:.9}
.btn.light{background:#fff;color:var(--accent);white-space:nowrap}
footer{padding:38px 5vw;display:flex;align-items:center;justify-content:space-between;gap:30px;background:#fff}
footer p,footer a{font-size:12px;color:var(--muted)}
@media(max-width:900px){
  nav{display:none}.site-header{padding:0 4vw}.hero{height:860px}
  .hero-content{left:6vw;right:6vw;top:43%}.hero h1{font-size:48px}
  .quick-facts{left:4vw;right:4vw;grid-template-columns:1fr 1fr;gap:10px;padding:18px}
  .quick-facts div{border:0;justify-content:flex-start}
  .section{padding:80px 6vw}.feature-grid{grid-template-columns:1fr 1fr}
  .gallery{grid-template-columns:1fr 1fr}.gallery figure.wide{grid-column:span 2}
  .access-section{grid-template-columns:1fr}.nearby-grid{grid-template-columns:1fr 1fr}
  .booking{align-items:flex-start;flex-direction:column}footer{flex-direction:column;text-align:center}
}
@media(max-width:560px){
  .brand small{display:none}.site-header{height:68px}.lang-switch button{padding:5px 8px}
  .hero{height:820px;min-height:720px}.hero-content{top:42%}.hero h1{font-size:39px}
  .hero-content>p:not(.eyebrow){font-size:15px}.hero-actions{flex-direction:column;align-items:stretch}
  .quick-facts b{font-size:28px}.quick-facts span{font-size:11px}
  .feature-grid,.nearby-grid{grid-template-columns:1fr}.gallery{display:block}.gallery figure{margin-bottom:14px}
  .gallery figure.wide img,.gallery img{aspect-ratio:4/3}.section-heading{display:block}
  .access-copy li{display:block}.access-copy li span{display:block;text-align:left;margin-top:4px}
  .map-card{padding:18px}.booking{padding:60px 6vw}
}
