*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{--cellar:#2c1810;--oak:#5c3d2e;--cream:#f5e6d3;--wine:#722f37;--font:'Cormorant Garamond','Noto Serif JP',serif;--sans:'Noto Sans JP',sans-serif}
html{scroll-behavior:smooth}
body{font-family:var(--sans);background:var(--cream);color:var(--cellar);line-height:1.75}
img{max-width:100%;display:block;object-fit:cover}
a{color:var(--wine)}
.wine-head{display:flex;align-items:center;gap:1.5rem;padding:1rem 2rem;background:var(--cellar);color:var(--cream);position:sticky;top:0;z-index:50;flex-wrap:wrap}
.wine-head .logo{font-family:var(--font);font-size:1.6rem;text-decoration:none;color:var(--cream)}
.wine-head nav{display:flex;gap:1.25rem;flex-wrap:wrap}
.wine-head nav a{text-decoration:none;color:var(--cream);font-size:.9rem;opacity:.9}
.menu{display:none;background:none;border:none;font-size:1.3rem;color:var(--cream);cursor:pointer;margin-left:auto}
.hero-cellar{background:linear-gradient(180deg,var(--cellar) 0%,#3d2418 100%);color:var(--cream);padding:4rem 2rem 5rem;text-align:center}
.hero-cellar h1{font-family:var(--font);font-size:clamp(2.2rem,5vw,3.5rem);margin:1rem 0}
.hero-cellar .tag{letter-spacing:.25em;font-size:.8rem;opacity:.8}
.hero-cellar .cta{display:inline-block;margin-top:1.5rem;border:1px solid var(--cream);color:var(--cream);padding:.85rem 2.5rem;text-decoration:none}
.hero-cellar .cta:hover{background:var(--cream);color:var(--cellar)}
.rack-section{padding:3rem 0;background:var(--oak);overflow:hidden}
.rack-section h2{text-align:center;color:var(--cream);font-family:var(--font);font-size:1.9rem;margin-bottom:2rem;padding:0 2rem}
.rack-row{display:flex;gap:1rem;padding:1.25rem 2rem;overflow-x:auto;scroll-snap-type:x mandatory;background:repeating-linear-gradient(90deg,#4a3228 0,#4a3228 8px,#5c3d2e 8px,#5c3d2e 16px);border-top:6px solid #3d2818;border-bottom:6px solid #3d2818;margin-bottom:1.5rem}
.rack-row:last-child{margin-bottom:0}
.rack-row article{flex:0 0 200px;scroll-snap-align:start;background:var(--cellar);padding:.75rem;border-radius:4px 4px 0 0;position:relative}
.rack-slot{height:8px;background:#3d2818;margin-top:.5rem;border-radius:0 0 2px 2px}
.rack-row img{aspect-ratio:3/4;object-fit:cover;margin-bottom:.5rem}
.rack-row h3{font-size:.85rem;color:var(--cream);font-weight:500}
.rack-row .price{color:#e8c4a0;font-weight:700;font-size:.9rem;margin:.25rem 0}
.rack-row button{width:100%;background:var(--wine);border:none;color:#fff;padding:.45rem;font-size:.8rem;cursor:pointer;font-family:inherit;margin-top:.35rem}
.rack-row button:hover{filter:brightness(1.1)}
.rack-label{padding:0 2rem .5rem;color:var(--cream);font-size:.75rem;letter-spacing:.1em;opacity:.7}
.about-cellar{max-width:1000px;margin:0 auto;padding:4rem 2rem;display:grid;grid-template-columns:1fr 1.2fr;gap:2.5rem;align-items:center}
.about-cellar h2{font-family:var(--font);font-size:2rem;margin-bottom:1rem}
.about-cellar img{border:8px solid var(--oak);box-shadow:12px 12px 0 var(--wine)}
.tasting{padding:4rem 2rem;background:#fff}
.tasting h2{text-align:center;font-family:var(--font);font-size:1.85rem;margin-bottom:2rem}
.taste-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;max-width:1000px;margin:0 auto}
.taste-cards div{padding:1.5rem;border:1px solid #ddd;text-align:center}
.taste-cards strong{display:block;font-size:2rem;color:var(--wine);font-family:var(--font)}
.voices{padding:3rem 2rem;background:var(--cream)}
.voices blockquote{max-width:700px;margin:0 auto 1.5rem;padding:1.25rem 1.5rem;border-left:4px solid var(--wine);background:#fff}
.voices cite{display:block;margin-top:.75rem;font-size:.85rem;opacity:.7}
.faq{padding:3rem 2rem;max-width:720px;margin:0 auto}
.faq details{margin-bottom:1rem;border:1px solid #d4c4b0;padding:1rem;background:#fff}
.faq summary{cursor:pointer;font-weight:600}
.legal{padding:3rem 2rem;background:var(--cellar);color:var(--cream);font-size:.88rem}
.legal dl{display:grid;grid-template-columns:auto 1fr;gap:.35rem .75rem;margin:1rem 0}
.legal h3,.legal h4{color:#e8c4a0;margin:1.25rem 0 .5rem;font-family:var(--font)}
.legal a{color:#e8c4a0}
.copy{margin-top:2rem;opacity:.6}
.toast{position:fixed;bottom:1.5rem;right:1.5rem;background:var(--wine);color:#fff;padding:1rem 1.5rem;transform:translateY(150%);transition:transform .3s;z-index:99}
.toast.show{transform:translateY(0)}
@media(max-width:768px){
  .menu{display:block}
  .wine-head nav{display:none;width:100%;flex-direction:column}
  .wine-head nav.open{display:flex}
  .about-cellar,.taste-cards{grid-template-columns:1fr}
}
