:root { --ink:#25352d; --cream:#f4f0e5; --paper:#fffdf7; --orange:#d9673c; --sage:#9aaa88; --line:rgba(37,53,45,.18); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif; line-height:1.8; }
a { color:inherit; }
.site-header { height:86px; display:flex; align-items:center; justify-content:space-between; padding:0 clamp(24px,5vw,76px); border-bottom:1px solid var(--line); background:rgba(255,253,247,.94); position:relative; z-index:20; }
.logo { display:flex; align-items:center; gap:12px; font-weight:700; text-decoration:none; letter-spacing:.08em; }
.logo-mark { width:38px; height:38px; display:grid; place-items:center; color:var(--paper); background:var(--ink); border-radius:50%; font-family:"DM Serif Display",serif; font-size:22px; }
.global-nav { display:flex; gap:34px; }
.global-nav a { text-decoration:none; font-size:14px; padding:30px 0 26px; border-bottom:3px solid transparent; }
.global-nav a:hover,.global-nav a[aria-current="page"] { color:var(--orange); border-color:var(--orange); }
.menu-toggle { display:none; border:1px solid var(--ink); border-radius:999px; background:none; padding:8px 14px; color:var(--ink); }
.hero { min-height:650px; display:grid; grid-template-columns:1.05fr .95fr; background:var(--cream); }
.hero-copy { align-self:center; padding:90px clamp(30px,8vw,130px); }
.eyebrow { margin:0 0 16px; color:var(--orange); font-size:12px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; }
h1,h2 { font-family:Georgia,"Yu Mincho",serif; font-weight:400; line-height:1.35; letter-spacing:.02em; }
h1 { font-size:clamp(42px,5vw,72px); margin:0 0 28px; }
h2 { font-size:clamp(30px,3.2vw,48px); margin:0; }
h3 { margin:14px 0 4px; font-size:18px; }
p { margin-top:0; }
.hero-copy>p:not(.eyebrow),.page-hero>p:not(.eyebrow) { max-width:590px; }
.button-row { display:flex; align-items:center; gap:28px; margin-top:36px; }
.button { background:var(--ink); color:white; text-decoration:none; padding:13px 26px; border-radius:2px; transition:.2s; }
.button:hover { background:var(--orange); transform:translateY(-2px); }
.text-link { text-decoration:none; font-weight:700; font-size:14px; border-bottom:1px solid currentColor; }
.hero-visual { position:relative; overflow:hidden; display:grid; place-items:center; background:var(--sage); min-height:500px; }
.hero-visual .sun { position:absolute; width:330px; height:330px; border-radius:50%; background:#e8ad64; top:12%; right:-8%; }
.cup { width:230px; height:165px; border-radius:10px 10px 80px 80px; background:var(--paper); position:relative; z-index:1; box-shadow:0 24px 0 -10px rgba(37,53,45,.18); }
.cup:after { content:""; position:absolute; right:-70px; top:24px; width:80px; height:80px; border:20px solid var(--paper); border-left:0; border-radius:0 60px 60px 0; }
.cup span,.cup span:before { position:absolute; width:3px; height:75px; background:rgba(255,255,255,.6); top:-92px; left:90px; border-radius:50%; transform:rotate(-8deg); content:""; }
.cup span:before { top:8px; left:36px; }
.hero-visual>p { position:absolute; bottom:30px; left:36px; color:var(--paper); font-weight:700; letter-spacing:.14em; }
.section { padding:100px clamp(24px,8vw,130px); }
.section-heading { display:flex; align-items:end; justify-content:space-between; margin-bottom:42px; }
.card-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:26px; }
.menu-card { border-top:1px solid var(--line); padding-top:18px; }
.menu-card p { color:#667169; font-size:14px; min-height:50px; }
.menu-card strong { color:var(--orange); }
.card-art { height:230px; display:flex; align-items:flex-end; padding:16px; font-family:"DM Serif Display",serif; font-size:26px; overflow:hidden; position:relative; }
.card-art:before { content:""; position:absolute; border-radius:50%; }
.card-art span { position:relative; z-index:1; }
.art-coffee { background:#d9c3a4; }.art-coffee:before { width:140px;height:140px;background:#704838;left:25%;top:20%;box-shadow:0 0 0 18px var(--paper); }
.art-toast { background:#e9b764; }.art-toast:before { width:160px;height:130px;background:#f6deb0;right:-25px;top:35px;border-radius:45% 45% 12px 12px; }
.art-cake { background:#b5c5a6; }.art-cake:before { width:190px;height:100px;background:#f7e1b4;right:15%;bottom:20px;border-radius:50% 10px 10px 50%; }
.story-band { display:grid; grid-template-columns:1fr 1fr; gap:10vw; background:var(--ink); color:var(--paper); }
.story-band>div:last-child { align-self:end; max-width:520px; }.light { color:#f0bf80; }
.site-footer { padding:48px clamp(24px,5vw,76px); display:flex; justify-content:space-between; gap:30px; background:#18231e; color:#dce0d7; font-size:13px; }
.site-footer p { margin:4px 0; }.site-footer>div:last-child { text-align:right; }.footer-logo { font-size:18px; font-weight:700; letter-spacing:.1em; color:white; }
.page-hero { padding:110px clamp(24px,12vw,190px); background:var(--cream); border-bottom:1px solid var(--line); }
.page-hero h1 { max-width:800px; }
.menu-section { display:grid; grid-template-columns:1fr 2fr; gap:8vw; border-bottom:1px solid var(--line); }
.menu-category { display:flex; gap:22px; }.category-number { color:var(--orange); font-family:"DM Serif Display",serif; font-size:26px; }
.menu-list { display:grid; grid-template-columns:1fr 1fr; gap:0 40px; }
.menu-item { display:flex; justify-content:space-between; gap:20px; padding:20px 0; border-top:1px solid var(--line); }
.menu-item h3 { margin:0 0 4px; }.menu-item p { color:#737d76; font-size:13px; }.menu-item strong { white-space:nowrap; color:var(--orange); }
.note { max-width:900px; margin:70px auto; padding:30px; background:var(--cream); display:flex; gap:25px; }.note span { color:var(--orange); font-family:"DM Serif Display",serif; font-size:22px; }.note p { margin:0; }
.split-story { display:grid; grid-template-columns:1fr 1fr; gap:9vw; align-items:center; }
.abstract-art { min-height:480px; background:#d6a063; position:relative; overflow:hidden; display:grid; place-items:center; }.abstract-art .arch { width:55%; height:72%; background:var(--ink); border-radius:140px 140px 0 0; position:absolute; bottom:0; }.abstract-art:before { content:""; width:160px;height:160px;background:var(--paper);border-radius:50%;position:absolute;top:12%;left:10%; }.abstract-art span { color:white; z-index:1; font:46px/1.1 "DM Serif Display",serif;text-align:center; }
.story-copy p:not(.eyebrow) { color:#59665e; margin-top:26px; }
.values { background:var(--cream); }.values>h2 { margin-bottom:45px; }.value-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:40px; }.value-grid article { border-top:1px solid var(--ink); padding-top:20px; }.value-grid span { color:var(--orange); font-family:"DM Serif Display",serif; }.value-grid p { color:#667169; }
.access-layout { display:grid;grid-template-columns:1.15fr .85fr;gap:8vw;align-items:center; }.map { min-height:500px;background:#e8e3d4;position:relative;overflow:hidden; }.road { position:absolute;background:var(--paper);border:1px solid #d0c9b8; }.road-h { height:75px;width:120%;top:42%;left:-10%;transform:rotate(-8deg); }.road-v { width:70px;height:120%;left:42%;top:-10%;transform:rotate(12deg); }.station,.park,.shop-pin { position:absolute;z-index:2;font-weight:700;font-size:13px; }.station { bottom:12%;left:11%;background:var(--ink);color:white;padding:8px 14px; }.park { top:12%;right:10%;padding:32px;background:#afbf9d;border-radius:50%; }.shop-pin { top:39%;left:51%;width:52px;height:52px;display:grid;place-items:center;background:var(--orange);color:white;border-radius:50%;font:26px "DM Serif Display",serif; }.shop-pin small { position:absolute;top:60px;color:var(--ink);white-space:nowrap;font:700 12px "Noto Sans JP",sans-serif; }.access-info dl { margin-top:30px;border-top:1px solid var(--line); }.access-info dl div { display:grid;grid-template-columns:110px 1fr;padding:17px 0;border-bottom:1px solid var(--line); }.access-info dt { font-weight:700;font-size:13px; }.access-info dd { margin:0; }.access-note { background:var(--cream);display:grid;grid-template-columns:1fr 2fr;gap:8vw; }.access-note>div { border-top:1px solid var(--line);padding-top:22px; }
.reveal { opacity:0; transform:translateY(14px); transition:opacity .7s ease,transform .7s ease; }.reveal.is-visible { opacity:1;transform:none; }
@media (max-width:760px) {
  .site-header { height:70px;padding:0 20px; }.menu-toggle { display:block; }.global-nav { display:none;position:absolute;top:70px;left:0;right:0;background:var(--paper);padding:10px 24px 24px;box-shadow:0 10px 20px rgba(0,0,0,.08);flex-direction:column;gap:0; }.global-nav.is-open { display:flex; }.global-nav a { padding:14px 0;border-bottom:1px solid var(--line); }
  .hero { grid-template-columns:1fr; }.hero-copy { padding:70px 24px; }.hero-visual { min-height:400px; }.cup { transform:scale(.75); }
  .section { padding:70px 24px; }.section-heading,.site-footer { align-items:flex-start;flex-direction:column; }.site-footer>div:last-child { text-align:left; }
  .card-grid,.story-band,.split-story,.value-grid,.access-layout,.access-note,.menu-section { grid-template-columns:1fr; }.card-grid { gap:48px; }.story-band { gap:40px; }.menu-list { grid-template-columns:1fr; }.page-hero { padding:75px 24px; }.abstract-art,.map { min-height:380px; }.note { margin:40px 24px;flex-direction:column; }.access-info dl div { grid-template-columns:90px 1fr; }
}
@media (prefers-reduced-motion:reduce) { html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none} }