@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500;600&family=Noto+Sans+JP:wght@300;400;500&display=swap');

:root { --ink:#302a26; --green:#1f5664; --deep:#1f5664; --cream:#f2eee5; --paper:#f9f6ef; --sand:#d8cfc0; --line:#d9d3c8; --white:#fffdf8; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:"Noto Sans JP",sans-serif; font-weight:300; line-height:2; }
a { color:inherit; text-decoration:none; }
button { font:inherit; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.site-header { position:sticky; top:0; z-index:20; background:rgba(252,250,245,.94); border-bottom:1px solid rgba(72,97,76,.12); backdrop-filter:blur(10px); }
.header-inner { max-width:1180px; height:82px; margin:auto; padding:0 28px; display:flex; align-items:center; justify-content:space-between; }
.logo { display:flex; align-items:center; gap:11px; font-size:.83rem; font-weight:600; letter-spacing:.13em; line-height:1.15; }
.logo small { display:block; font-size:.62rem; letter-spacing:.28em; margin-top:4px; }
.logo-mark { width:38px; height:38px; display:grid; place-items:center; color:var(--paper); background:var(--deep); border-radius:50% 50% 46% 54%; font-family:"Shippori Mincho",serif; font-size:1.2rem; }
.site-nav { display:flex; gap:38px; align-items:center; }
.site-nav a { position:relative; padding:28px 0 24px; font-size:.88rem; }
.site-nav a::after { content:""; position:absolute; left:50%; bottom:17px; width:0; height:1px; background:var(--green); transition:.25s; transform:translateX(-50%); }
.site-nav a:hover::after,.site-nav a.is-current::after { width:100%; }
.menu-toggle { display:none; padding:8px; border:0; background:none; cursor:pointer; }
.menu-toggle > span:not(.sr-only) { display:block; width:25px; height:1px; margin:6px; background:var(--ink); transition:.25s; }
.hero { max-width:1400px; min-height:680px; margin:auto; display:grid; grid-template-columns:48% 52%; }
.hero-content { padding:110px 7vw 80px max(7vw,40px); display:flex; flex-direction:column; justify-content:center; }
.eyebrow { margin:0 0 16px; color:var(--green); font-size:.72rem; font-weight:600; text-transform:uppercase; letter-spacing:.24em; }
h1,h2,blockquote { font-family:"Cormorant Garamond","Shippori Mincho",serif; font-weight:400; letter-spacing:-.015em; }
.hero h1 { margin:0 0 28px; font-size:clamp(2.7rem,4.7vw,5rem); line-height:1.35; }
.hero-content > p:not(.eyebrow) { color:#5e665f; font-size:.97rem; }
.button-row { display:flex; gap:28px; align-items:center; margin-top:28px; }
.button { display:inline-flex; align-items:center; justify-content:center; min-width:170px; padding:14px 24px; color:var(--white); background:var(--deep); border:1px solid var(--deep); font-size:.88rem; letter-spacing:.08em; transition:.25s; }
.button:hover { color:var(--deep); background:transparent; }
.text-link { display:inline-block; padding-bottom:2px; border-bottom:1px solid currentColor; font-size:.86rem; }
.text-link span { margin-left:8px; transition:.2s; }.text-link:hover span { margin-left:14px; }
.hero-visual { position:relative; overflow:hidden; min-height:600px; background:radial-gradient(circle at 24% 22%,rgba(255,248,217,.9) 0 5%,transparent 26%),linear-gradient(145deg,#9ba990 0%,#657b67 48%,#334d3d 100%); }
.hero-visual::before,.hero-visual::after { content:""; position:absolute; background:rgba(247,239,210,.28); filter:blur(8px); transform:rotate(-28deg); }
.hero-visual::before { width:80px; height:110%; left:20%; top:-10%; }.hero-visual::after { width:150px; height:110%; left:56%; top:-8%; }
.cup { position:absolute; left:50%; top:52%; width:190px; height:145px; background:#e8dfcf; border-radius:8px 8px 80px 80px; transform:translate(-50%,-50%); box-shadow:0 34px 45px rgba(24,36,28,.34); z-index:2; }
.cup::before { content:""; position:absolute; width:70px; height:78px; border:18px solid #e8dfcf; border-left:0; right:-62px; top:22px; border-radius:0 48px 48px 0; }
.cup::after { content:""; position:absolute; inset:-8px 5px auto; height:25px; background:#684c35; border:7px solid #f1e9da; border-radius:50%; }
.cup span::before,.cup span::after { content:""; position:absolute; bottom:160px; width:3px; height:65px; background:rgba(255,255,255,.4); border-radius:50%; filter:blur(2px); }.cup span::before { left:70px; transform:rotate(-8deg); }.cup span::after { left:110px; height:85px; transform:rotate(9deg); }
.section { max-width:1180px; margin:auto; padding:110px 28px; }
.intro-section { display:grid; grid-template-columns:1fr 1fr; gap:10%; align-items:end; }
.section h2 { margin:0; font-size:clamp(2rem,3.2vw,3.3rem); line-height:1.5; }
.intro-copy { color:#606861; }.intro-copy p { margin:0 0 28px; }
.featured-section { max-width:1240px; }.section-title-row { display:flex; justify-content:space-between; align-items:end; margin-bottom:42px; }
.card-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.menu-card { background:var(--white); }.card-image { aspect-ratio:4/3; display:grid; place-items:center; overflow:hidden; }
.card-image span { padding:10px 14px; color:rgba(255,255,255,.85); border:1px solid rgba(255,255,255,.55); font-family:"Shippori Mincho"; letter-spacing:.22em; }
.coffee-image { background:radial-gradient(circle at 38% 38%,#c7b79d 0 8%,transparent 8.5%),linear-gradient(135deg,#4d5948,#9e8a6d); }.toast-image { background:linear-gradient(25deg,rgba(91,62,39,.15),transparent),#bd9871; }.cake-image { background:linear-gradient(150deg,#d7ccad,#8e765b); }
.card-body { padding:25px; }.card-body h3 { margin:0 0 8px; font-family:"Shippori Mincho"; font-size:1.2rem; }.card-body p { min-height:58px; margin:0 0 14px; color:#6d716d; font-size:.86rem; }.card-body strong { color:var(--green); font-size:.9rem; }
.visit-banner { max-width:1180px; margin:0 auto 110px; padding:65px 70px; color:#f8f4ea; background:var(--deep); display:flex; justify-content:space-between; align-items:center; }.visit-banner .eyebrow { color:#bdc9ba; }.visit-banner h2 { margin:0 0 8px; font-size:clamp(1.7rem,3vw,2.8rem); }.visit-banner p:last-child { margin:0;color:#d3dbd2; }.button-light { color:var(--deep); background:var(--cream); border-color:var(--cream); }.button-light:hover { color:var(--cream); }
.site-footer { max-width:1180px; margin:auto; padding:65px 28px 35px; border-top:1px solid var(--line); display:grid; grid-template-columns:1fr auto; gap:30px; font-size:.79rem; color:#656b66; }.footer-logo { color:var(--ink); font-weight:600; letter-spacing:.15em; }.site-footer nav { display:flex; gap:25px; }.site-footer nav a:hover { color:var(--green); }.copyright { grid-column:1/-1; margin:20px 0 0; padding-top:20px; border-top:1px solid var(--line); font-size:.7rem; }
.page-hero { padding:105px 28px 95px; text-align:center; background:var(--cream); }.page-hero h1 { margin:0 0 12px; font-size:clamp(2.8rem,5vw,4.8rem); }.page-hero > p:last-child { margin:0;color:#636b64; }
.menu-sections { max-width:1050px; }.menu-category { display:grid; grid-template-columns:240px 1fr; gap:50px; padding:62px 0; border-bottom:1px solid var(--line); }.category-heading { display:flex; gap:22px; align-items:start; }.category-heading > span { color:#9ba194; font-family:"Shippori Mincho"; font-size:.8rem; }.category-heading h2 { font-size:2rem; }.menu-list { display:grid; gap:0; }.menu-item { display:flex; justify-content:space-between; gap:20px; padding:0 0 22px; margin-bottom:22px; border-bottom:1px dotted #c3bfb6; }.menu-item:last-child { border:0;margin:0; }.menu-item h3 { margin:0 0 4px; font-family:"Shippori Mincho"; font-size:1.08rem; }.menu-item p { margin:0;color:#777b77;font-size:.82rem; }.menu-item strong { white-space:nowrap;color:var(--green);font-size:.88rem; }.menu-note { color:#777b77;font-size:.76rem; }
.story-section { display:grid; grid-template-columns:1fr 1fr; gap:9%; align-items:center; }.story-visual { min-height:540px; display:grid; place-items:center; color:white; background:radial-gradient(circle at 70% 30%,rgba(239,227,190,.35),transparent 25%),linear-gradient(140deg,#75816e,#344d3c); }.story-visual span { padding:28px;border:1px solid rgba(255,255,255,.55);border-radius:50%;font-family:"Shippori Mincho";font-size:1.3rem;text-align:center; }.story-copy p:not(.eyebrow) { color:#626963; }.values-section { max-width:1240px; }.section-title-center { text-align:center;margin-bottom:50px; }.value-grid { display:grid;grid-template-columns:repeat(3,1fr); }.value-grid article { padding:40px;border-left:1px solid var(--line); }.value-grid article:last-child { border-right:1px solid var(--line); }.value-number { color:#99a294;font-family:"Shippori Mincho"; }.value-grid h3 { margin:25px 0 10px;font-family:"Shippori Mincho";font-size:1.3rem; }.value-grid p { color:#6d736d;font-size:.88rem; }.message-section { padding:110px 28px;text-align:center;background:var(--cream); }.message-section blockquote { margin:15px auto 38px;font-size:clamp(1.8rem,3.5vw,3.1rem);line-height:1.7; }
.access-section { display:grid;grid-template-columns:1.2fr .8fr;gap:8%; }.map-placeholder { position:relative;min-height:540px;overflow:hidden;background:#e7e2d5; }.map-road { position:absolute;background:#faf8f1;border:1px solid #d3cebf; }.road-one { width:130%;height:55px;left:-15%;top:40%;transform:rotate(-15deg); }.road-two { width:55px;height:120%;left:62%;top:-10%;transform:rotate(8deg); }.road-three { width:90%;height:34px;left:20%;top:78%;transform:rotate(25deg); }.map-pin { position:absolute;z-index:2;left:48%;top:43%;display:flex;align-items:center;gap:8px;color:var(--deep);font-size:.64rem;font-weight:600; }.map-pin > span { width:48px;height:48px;display:grid;place-items:center;color:white;background:var(--deep);border-radius:50% 50% 50% 0;transform:rotate(-45deg);font-family:"Shippori Mincho";font-size:1.1rem; }.map-pin > span::first-letter { transform:rotate(45deg); }.station,.park { position:absolute;z-index:1;padding:4px 8px;background:rgba(255,255,255,.65);font-size:.7rem; }.station { left:14%;bottom:14%; }.park { right:9%;top:14%;color:var(--green); }.access-info h2 { font-size:2.5rem; }.access-info dl { margin-top:35px; }.access-info dl div { display:grid;grid-template-columns:90px 1fr;padding:20px 0;border-bottom:1px solid var(--line);font-size:.88rem; }.access-info dt { font-weight:600; }.access-info dd { margin:0;color:#5e655f; }.access-info small { color:#858985; }.access-info a { border-bottom:1px solid; }.access-notes { padding-top:30px; }.access-notes h2 { margin-bottom:35px;font-size:2rem; }.note-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:20px; }.note-grid article { padding:28px;background:var(--cream); }.note-grid h3 { margin:0 0 12px;font-family:"Shippori Mincho";font-size:1.05rem; }.note-grid p { margin:0;color:#686e69;font-size:.83rem; }
@media (max-width:800px) {
  .header-inner { height:68px;padding:0 20px; }.menu-toggle { display:block;z-index:3; }.site-nav { position:absolute;left:0;right:0;top:68px;display:flex;flex-direction:column;gap:0;padding:12px 24px 24px;background:var(--paper);border-bottom:1px solid var(--line);transform:translateY(-130%);opacity:0;visibility:hidden;transition:.3s; }.site-nav.is-open { transform:translateY(0);opacity:1;visibility:visible; }.site-nav a { width:100%;padding:15px 0;border-bottom:1px solid #e7e2d8; }.site-nav a::after { display:none; }.menu-toggle.is-open > span:nth-child(1) { transform:translateY(7px) rotate(45deg); }.menu-toggle.is-open > span:nth-child(2) { opacity:0; }.menu-toggle.is-open > span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }
  .hero { grid-template-columns:1fr; }.hero-content { padding:75px 24px; }.hero-visual { min-height:420px;grid-row:1; }.cup { transform:translate(-50%,-50%) scale(.75); }.intro-section,.story-section,.access-section { grid-template-columns:1fr;gap:45px; }.section { padding:75px 22px; }.card-grid,.value-grid,.note-grid { grid-template-columns:1fr; }.section-title-row { align-items:start;gap:20px; }.section-title-row > .text-link { margin-top:15px; }.card-body p { min-height:auto; }.visit-banner { margin:0 20px 75px;padding:48px 25px;flex-direction:column;align-items:start;gap:25px; }.site-footer { grid-template-columns:1fr; }.site-footer nav { flex-wrap:wrap; }.copyright { grid-column:1; }.menu-category { grid-template-columns:1fr;gap:30px;padding:48px 0; }.story-visual { min-height:400px; }.value-grid article,.value-grid article:last-child { border:0;border-top:1px solid var(--line); }.map-placeholder { min-height:420px; }
}
@media (max-width:480px) { .hero h1 { font-size:2.35rem; }.button-row { align-items:flex-start;flex-direction:column; }.page-hero { padding:75px 20px 70px; }.menu-item { align-items:start; }.access-info dl div { grid-template-columns:1fr;gap:5px; } }

/* NAGI COFFEE — coastal editorial redesign */
.site-header { background:rgba(249,246,239,.92); border-color:rgba(48,42,38,.1); }
.header-inner { max-width:1320px; height:96px; padding:0 48px; }
.logo { gap:14px; font-family:"Cormorant Garamond",serif; font-size:1.1rem; letter-spacing:.2em; }
.logo small { font-family:"Noto Sans JP",sans-serif; font-size:.52rem; font-weight:400; letter-spacing:.35em; }
.logo-mark { width:42px; height:42px; color:var(--paper); background:var(--deep); border-radius:50%; font-family:"Cormorant Garamond",serif; font-size:1.45rem; font-weight:500; }
.site-nav { gap:44px; }
.site-nav a { padding:34px 0 28px; font-size:.67rem; font-weight:500; letter-spacing:.2em; }
.site-nav a::after { bottom:24px; background:var(--deep); }
.eyebrow { margin-bottom:22px; color:var(--deep); font-size:.62rem; font-weight:500; letter-spacing:.34em; }
.hero { max-width:none; min-height:calc(100vh - 96px); grid-template-columns:44% 56%; }
.hero-content { padding:110px 6vw 100px 8vw; }
.hero h1 { margin-bottom:34px; font-size:clamp(4.7rem,7.1vw,8.4rem); line-height:.92; }
.hero-content > p:not(.eyebrow) { max-width:540px; color:#706963; font-size:.9rem; line-height:2.15; }
.button-row { margin-top:42px; }
.button { min-width:184px; padding:17px 28px; font-size:.68rem; font-weight:500; letter-spacing:.18em; }
.text-link { font-size:.7rem; font-weight:500; letter-spacing:.12em; }
.hero-visual { min-height:680px; background:linear-gradient(to bottom,#7f9ca3 0%,#a9bdbe 43%,#e6ded0 43.3%,#dad0bf 58%,#8a7666 100%); }
.hero-visual::before { width:100%; height:1px; left:0; top:43%; background:rgba(255,255,255,.85); filter:none; transform:none; box-shadow:0 12px 25px rgba(255,255,255,.45); }
.hero-visual::after { width:150%; height:45%; left:-25%; top:41%; background:repeating-radial-gradient(ellipse at center,transparent 0 15px,rgba(255,255,255,.18) 16px 17px); filter:none; transform:none; opacity:.65; }
.cup { left:63%; top:72%; width:165px; height:120px; background:#eae1d3; border-radius:6px 6px 70px 70px; box-shadow:0 28px 42px rgba(43,35,29,.28); }
.cup::before { border-color:#eae1d3; }.cup::after { background:#4b382d; border-color:#f2eadd; }
.section { max-width:1240px; padding:160px 40px; }
.section h2 { font-size:clamp(3.6rem,6vw,6.8rem); line-height:.95; }
.intro-section { gap:14%; align-items:center; }
.intro-copy { max-width:470px; line-height:2.25; }
.featured-section { max-width:1320px; padding-top:140px; }
.section-title-row { margin-bottom:70px; }
.card-grid { gap:30px; }
.menu-card { background:transparent; }
.card-image { aspect-ratio:3/4; position:relative; }
.card-image::after { content:""; position:absolute; inset:0; background:linear-gradient(to top,rgba(31,46,48,.24),transparent 48%); }
.card-image span { position:relative; z-index:1; font-family:"Cormorant Garamond",serif; font-size:1.05rem; letter-spacing:.3em; }
.coffee-image { background:linear-gradient(145deg,#506f75,#a6b8b4 52%,#c9b8a1); }
.toast-image { background:linear-gradient(145deg,#a69680,#d6c8b1 50%,#718e91); }
.cake-image { background:linear-gradient(145deg,#82999a,#d4c8b5 55%,#887665); }
.card-body { padding:28px 4px; }
.card-body h3,.menu-item h3,.value-grid h3,.note-grid h3 { font-family:"Cormorant Garamond","Noto Sans JP",serif; font-weight:500; }
.card-body h3 { font-size:1.25rem; letter-spacing:.03em; }.card-body p { color:#77706a; line-height:1.9; }.card-body strong { color:var(--deep); font-weight:500; }
.visit-banner { max-width:1240px; margin-bottom:150px; padding:92px 80px; background:var(--deep); }.visit-banner h2 { font-family:"Cormorant Garamond",serif; font-size:clamp(3.2rem,5vw,5.4rem); line-height:1; }.visit-banner .eyebrow { color:#b9ced1; }
.page-hero { padding:155px 28px 145px; background:var(--cream); }.page-hero h1 { margin-bottom:22px; font-size:clamp(5rem,10vw,10rem); line-height:.82; }.page-hero > p:last-child { font-size:.86rem; }
.menu-sections { max-width:1100px; }.menu-category { grid-template-columns:270px 1fr; gap:80px; padding:90px 0; }.category-heading h2 { font-family:"Cormorant Garamond",serif; font-size:3.3rem; }.category-heading > span { color:var(--deep); font-family:"Cormorant Garamond",serif; }.menu-item { padding-bottom:28px; margin-bottom:28px; }.menu-item h3 { font-size:1.16rem; }.menu-item p { color:#7c756f; }.menu-item strong { color:var(--deep); }
.story-section { gap:12%; }.story-visual { min-height:690px; background:linear-gradient(to bottom,#768f96 0 45%,#d5d8d2 45.3% 54%,#8b8171 54.3%); }.story-visual span { width:105px; height:105px; display:grid; place-items:center; padding:0; font-family:"Cormorant Garamond",serif; font-size:1.2rem; }.story-copy p:not(.eyebrow) { color:#6f6963; line-height:2.2; }
.values-section { max-width:1320px; }.section-title-center { margin-bottom:90px; }.value-grid article { padding:55px; }.value-number { color:var(--deep); font-family:"Cormorant Garamond",serif; }.value-grid h3 { margin-top:38px; font-size:1.35rem; }.value-grid p { line-height:2; }
.message-section { padding:150px 28px; }.message-section blockquote { font-family:"Cormorant Garamond","Shippori Mincho",serif; font-size:clamp(3rem,6vw,6.2rem); line-height:1.1; }
.access-section { grid-template-columns:1.15fr .85fr; gap:10%; }.map-placeholder { min-height:660px; background:#ded8cb; }.map-placeholder::after { content:"SEA"; position:absolute; right:8%; bottom:7%; color:rgba(31,86,100,.52); font-family:"Cormorant Garamond",serif; font-size:2rem; letter-spacing:.3em; }.map-pin > span { background:var(--deep); }.access-info h2 { font-family:"Cormorant Garamond",serif; font-size:4.8rem; }.access-info dl div { padding:25px 0; }.access-info dt { font-size:.72rem; letter-spacing:.1em; }.access-info dd { line-height:1.9; }
.access-notes h2 { font-family:"Cormorant Garamond",serif; font-size:4rem; }.note-grid { gap:2px; }.note-grid article { padding:40px; }.note-grid h3 { font-size:1.2rem; }
.site-footer { max-width:none; padding:85px max(5vw,32px) 35px; border-top:0; color:#d7dee0; background:#263d43; grid-template-columns:1.5fr 1fr auto; gap:70px; }.footer-logo { color:#fffdf8; font-family:"Cormorant Garamond",serif; font-size:2rem; letter-spacing:.15em; }.footer-brand p { color:#aebdc0; font-family:"Cormorant Garamond",serif; font-size:1.05rem; letter-spacing:.08em; }.footer-hours span { color:#9db1b5; font-size:.58rem; letter-spacing:.25em; }.footer-hours p { line-height:1.8; }.site-footer nav { align-items:flex-start; gap:22px; }.site-footer nav a { padding-bottom:3px; border-bottom:1px solid rgba(255,255,255,.35); font-size:.68rem; letter-spacing:.08em; }.copyright { border-color:rgba(255,255,255,.12); color:#84999d; }
@media (max-width:800px) {
  .header-inner { height:76px; padding:0 22px; }.logo-mark { width:36px; height:36px; }.site-nav { top:76px; }.site-nav a { padding:17px 0; }
  .hero { grid-template-columns:1fr; min-height:auto; }.hero-visual { min-height:52vh; grid-row:1; }.hero-content { padding:85px 24px 100px; }.hero h1 { font-size:clamp(3.8rem,16vw,5.8rem); }.cup { transform:translate(-50%,-50%) scale(.68); }
  .section { padding:105px 24px; }.intro-section,.story-section,.access-section { gap:65px; }.section h2 { font-size:clamp(3.2rem,14vw,5rem); }.section-title-row { margin-bottom:45px; }.card-grid { gap:55px; }.card-image { aspect-ratio:4/3; }
  .visit-banner { margin:0 20px 100px; padding:65px 28px; }.page-hero { padding:105px 20px 100px; }.page-hero h1 { font-size:clamp(4.3rem,20vw,7rem); }.menu-category { gap:38px; padding:65px 0; }
  .story-visual { min-height:500px; }.value-grid article { padding:42px 10px; }.message-section { padding:100px 24px; }.map-placeholder { min-height:480px; }.access-info h2,.access-notes h2 { font-size:3.8rem; }
  .site-footer { grid-template-columns:1fr; gap:38px; padding-top:65px; }.site-footer nav { flex-wrap:wrap; }.copyright { grid-column:1; }
}
@media (prefers-reduced-motion:no-preference) { .menu-card,.story-visual,.map-placeholder { transition:transform .6s ease; }.menu-card:hover { transform:translateY(-8px); } }

/* Home hero — generated project image */
.home-page .site-header { position:absolute; inset:0 0 auto; color:var(--ink); background:linear-gradient(to bottom,rgba(249,246,239,.86),rgba(249,246,239,0)); border:0; backdrop-filter:none; }
.home-page .hero { position:relative; min-height:100svh; display:flex; align-items:center; max-width:none; padding-top:96px; overflow:hidden; background:url("images/nagi-cafe-hero.png") center center / cover no-repeat; }
.home-page .hero::before { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(244,239,229,.96) 0%,rgba(244,239,229,.83) 28%,rgba(244,239,229,.25) 52%,rgba(244,239,229,0) 70%),linear-gradient(to top,rgba(47,41,35,.08),transparent 30%); }
.home-page .hero-content { position:relative; z-index:1; width:100%; max-width:760px; padding:110px 4vw 90px 8vw; }
.home-page .hero h1 { max-width:740px; color:#2f2925; text-wrap:balance; }
.home-page .hero-content > p:not(.eyebrow) { color:#574f49; }
.home-page .hero .button { box-shadow:0 8px 24px rgba(31,86,100,.15); }
.home-page .intro-section { padding-top:180px; padding-bottom:180px; }
.home-page .intro-section { max-width:1320px; grid-template-columns:minmax(0,1.12fr) minmax(320px,.88fr); gap:10%; align-items:center; }
.home-page .intro-image { position:relative; margin:0; overflow:hidden; aspect-ratio:3/2; background:var(--cream); }
.home-page .intro-image::after { content:""; position:absolute; inset:0; box-shadow:inset 0 0 0 1px rgba(48,42,38,.05); pointer-events:none; }
.home-page .intro-image img { display:block; width:100%; height:100%; object-fit:cover; object-position:center; }
.home-page .intro-content { display:flex; flex-direction:column; gap:48px; }
.home-page .intro-copy { max-width:440px; }
.home-page .featured-section { padding-top:150px; padding-bottom:180px; }
.home-page .menu-card { overflow:hidden; border-bottom:1px solid var(--line); }
.home-page .card-image { transition:filter .5s ease,transform .6s ease; }
.home-page .card-image img { display:block; width:100%; height:100%; object-fit:cover; object-position:center; transition:transform .8s cubic-bezier(.2,.7,.2,1); }
.home-page .menu-card:hover .card-image img { transform:scale(1.025); }
.home-page .menu-card:hover .card-image { filter:contrast(1.04); }
.home-page .visit-banner { position:relative; overflow:hidden; }
.home-page .visit-banner::after { content:"NAGI"; position:absolute; right:-18px; bottom:-70px; color:rgba(255,255,255,.045); font-family:"Cormorant Garamond",serif; font-size:13rem; line-height:1; letter-spacing:.04em; pointer-events:none; }
.home-page .visit-banner > * { position:relative; z-index:1; }
@media (max-width:800px) {
  .home-page .site-header { position:absolute; }.home-page .site-nav { background:rgba(249,246,239,.98); }
  .home-page .hero { min-height:92svh; padding-top:76px; background-position:62% center; }
  .home-page .hero::before { background:linear-gradient(90deg,rgba(244,239,229,.9),rgba(244,239,229,.48) 70%,rgba(244,239,229,.15)),linear-gradient(to top,rgba(244,239,229,.72),transparent 50%); }
  .home-page .hero-content { padding:100px 24px 70px; }.home-page .hero h1 { font-size:clamp(3.7rem,17vw,5.7rem); }
  .home-page .hero-content > p:not(.eyebrow) { max-width:360px; color:#443d37; }
  .home-page .intro-section { padding-top:115px; padding-bottom:115px; grid-template-columns:1fr; gap:58px; }.home-page .intro-content { gap:36px; }.home-page .featured-section { padding-top:100px; padding-bottom:120px; }
  .home-page .card-image { aspect-ratio:1/1; }
}

/* Menu filtering */
.menu-filter { position:sticky; top:96px; z-index:10; display:flex; justify-content:center; gap:8px; max-width:620px; margin:0 auto 45px; padding:10px; background:rgba(249,246,239,.94); border:1px solid var(--line); backdrop-filter:blur(10px); }
.filter-button { flex:1; min-height:44px; padding:10px 18px; color:#6d6660; background:transparent; border:0; cursor:pointer; font-family:"Noto Sans JP",sans-serif; font-size:.62rem; font-weight:500; letter-spacing:.2em; transition:color .25s,background .25s; }
.filter-button:hover { color:var(--deep); }.filter-button:focus-visible { outline:2px solid var(--deep); outline-offset:2px; }
.filter-button.is-active { color:var(--white); background:var(--deep); }
.menu-category[hidden] { display:none !important; }
.menu-category { animation:menuReveal .4s ease both; }
@keyframes menuReveal { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:none; } }

/* About — shop details */
.shop-details-section { color:#f7f2e9; background:var(--deep); }
.shop-details-inner { max-width:1320px; display:grid; grid-template-columns:minmax(280px,.8fr) minmax(0,1.2fr); gap:10%; }
.details-heading .eyebrow { color:#a9c4c9; }.details-heading h2 { color:#fffdf8; }
.details-heading > p:last-child { max-width:450px; margin-top:38px; color:#c2d0d2; font-size:.88rem; line-height:2.2; }
.details-grid { display:grid; grid-template-columns:1fr 1fr; margin:0; border-top:1px solid rgba(255,255,255,.18); }
.details-grid > div { padding:42px 36px; border-right:1px solid rgba(255,255,255,.18); border-bottom:1px solid rgba(255,255,255,.18); }
.details-grid > div:nth-child(even) { border-right:0; }
.details-grid dt { margin-bottom:22px; color:#9bb9be; font-size:.58rem; letter-spacing:.28em; }
.details-grid dd { margin:0; }.details-grid dd strong { display:block; margin-bottom:17px; color:#fffdf8; font-family:"Cormorant Garamond",serif; font-size:2.7rem; font-weight:400; line-height:1; }
.details-grid dd span { color:#c4d0d1; font-size:.76rem; line-height:1.9; }

/* Access — live OpenStreetMap */
.map-embed { position:relative; min-height:660px; overflow:hidden; background:#ded8cb; }
.map-embed iframe { display:block; width:100%; height:660px; border:0; filter:grayscale(.3) sepia(.08) saturate(.7) contrast(.94); }
.map-link { position:absolute; right:18px; bottom:18px; padding:12px 18px; color:var(--white); background:var(--deep); box-shadow:0 8px 25px rgba(31,45,49,.18); font-size:.68rem; font-weight:500; letter-spacing:.08em; }
.map-link span { margin-left:7px; }.fiction-note { margin:55px 0 0; padding:22px 25px; color:#756e68; background:var(--cream); border-left:3px solid var(--deep); font-size:.72rem; line-height:1.9; }

@media (max-width:800px) {
  .menu-filter { top:76px; justify-content:flex-start; max-width:100%; margin-bottom:30px; overflow-x:auto; }.filter-button { flex:0 0 auto; min-width:86px; padding-inline:14px; }
  .shop-details-inner { grid-template-columns:1fr; gap:70px; }.details-grid > div { padding:34px 22px; }.details-grid dd strong { font-size:2.2rem; }
  .map-embed { min-height:460px; }.map-embed iframe { height:460px; }.map-link { right:12px; bottom:12px; }.fiction-note { margin-top:40px; }
}
@media (max-width:480px) {
  .details-grid { grid-template-columns:1fr; }.details-grid > div,.details-grid > div:nth-child(even) { border-right:0; }.map-embed,.map-embed iframe { min-height:420px; height:420px; }
}

/* Progressive motion: content stays visible when JavaScript is unavailable */
.reveal-enabled .reveal-item { opacity:0; transform:translateY(28px); transition:opacity .8s cubic-bezier(.22,1,.36,1) var(--reveal-delay,0ms),transform .8s cubic-bezier(.22,1,.36,1) var(--reveal-delay,0ms); }
.reveal-enabled .reveal-item.is-visible { opacity:1; transform:none; }

/* Shared interaction feedback */
.button,.filter-button,.map-link,.text-link,.site-nav a,.site-footer a,.back-to-top { transition:color .25s ease,background-color .25s ease,border-color .25s ease,transform .25s ease,box-shadow .25s ease,opacity .25s ease; }
.button:hover { transform:translateY(-3px); box-shadow:0 12px 28px rgba(31,86,100,.18); }
.button:active,.filter-button:active,.back-to-top:active { transform:translateY(0) scale(.97); }
.menu-card { transition:transform .45s cubic-bezier(.22,1,.36,1),box-shadow .45s ease; }
.menu-card:hover { transform:translateY(-9px); box-shadow:0 22px 45px rgba(48,42,38,.09); }
.value-grid article,.note-grid article,.details-grid > div { transition:background-color .35s ease,transform .35s ease; }
.value-grid article:hover,.note-grid article:hover { background:#f1ebdf; transform:translateY(-4px); }
.details-grid > div:hover { background:rgba(255,255,255,.045); }

.back-to-top { position:fixed; right:28px; bottom:28px; z-index:30; width:52px; height:52px; display:grid; place-items:center; color:var(--white); background:var(--deep); border:1px solid rgba(255,255,255,.22); border-radius:50%; box-shadow:0 12px 30px rgba(31,44,48,.18); opacity:0; visibility:hidden; transform:translateY(14px); cursor:pointer; pointer-events:none; }
.back-to-top span { font-size:1.05rem; line-height:1; }.back-to-top.is-visible { opacity:1; visibility:visible; transform:none; pointer-events:auto; }.back-to-top:hover { transform:translateY(-4px); box-shadow:0 16px 34px rgba(31,44,48,.26); }
.back-to-top:focus-visible,.button:focus-visible,.text-link:focus-visible,.site-nav a:focus-visible { outline:2px solid var(--deep); outline-offset:4px; }

@media (max-width:800px) {
  body.nav-is-open { overflow:hidden; }.back-to-top { right:18px; bottom:18px; width:46px; height:46px; }
}
@media (hover:none) { .menu-card:hover,.value-grid article:hover,.note-grid article:hover,.button:hover { transform:none; box-shadow:none; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; }.reveal-enabled .reveal-item { opacity:1; transform:none; transition:none; } *,*::before,*::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; } }