*{margin:0;padding:0;box-sizing:border-box}
:root{--rice:#F6F3EC;--ink:#161614;--shio:#5E93A8;--wood:#8A6A48;--line:#DDD5C4;--mut:#6f6a5e}
html{scroll-behavior:smooth}
body{background:var(--rice);color:var(--ink);font-family:'Space Grotesk','Noto Serif JP',sans-serif;overflow-x:hidden}
img{display:block;max-width:100%}
::selection{background:var(--ink);color:var(--rice)}
.jp{font-family:'Noto Serif JP',serif}
.en{font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--mut)}
/* NOREN — tenda d'ingresso, non loader: si alza da sola e sparisce */
#noren{position:fixed;inset:0;z-index:2000;display:flex;pointer-events:none}
#noren i{flex:1;background:#101010;display:flex;align-items:flex-start;justify-content:center;padding-top:12vh;transition:transform 1s cubic-bezier(.7,0,.3,1)}
#noren span{color:var(--rice);font-family:'Noto Serif JP',serif;font-size:clamp(28px,5vw,54px);writing-mode:vertical-rl;letter-spacing:.3em}
#noren.open i:nth-child(1){transform:translateY(-101%)}
#noren.open i:nth-child(2){transform:translateY(-101%);transition-delay:.08s}
#noren.open i:nth-child(3){transform:translateY(-101%);transition-delay:.16s}
/* HEADER minimo da kissaten */
.head{position:sticky;top:0;z-index:50;background:rgba(246,243,236,.9);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);padding:14px 22px;display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}
.brand{font-family:'Noto Serif JP',serif;font-weight:700;font-size:20px}
.brand small{font-family:'Space Grotesk';font-size:10px;letter-spacing:.25em;border:1px solid var(--line);border-radius:100px;padding:5px 10px;margin-left:10px;vertical-align:middle}
.head nav{display:flex;gap:18px;font-size:11px;letter-spacing:.2em}
.head nav a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--shio)}
/* HERO quieto: testo + foto, niente canvas */
.hero{max-width:1220px;margin:0 auto;padding:56px 24px 20px;display:grid;grid-template-columns:.95fr 1.05fr;gap:40px;align-items:start}
@media(max-width:920px){.hero{grid-template-columns:1fr}}
.hero h1{font-family:'Noto Serif JP',serif;font-weight:700;font-size:clamp(44px,6vw,88px);line-height:1.08}
.hero h1 .thin{color:transparent;-webkit-text-stroke:1.5px var(--ink)}
.hero .rule{width:64px;height:2px;background:var(--shio);margin:20px 0}
.lead{line-height:2;color:#3d3a32;max-width:520px}
.lead .en{display:block;margin-top:10px;line-height:1.7}
.facts{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}
.facts span{font-size:11px;letter-spacing:.14em;border:1px solid var(--line);background:#fff;border-radius:100px;padding:8px 13px;color:#4a463c}
/* foto ramen con vapore CSS */
.bowl{position:relative;border:1px solid var(--line);border-radius:18px;overflow:hidden;background:#e9e2d2}
.bowl img{width:100%;height:min(560px,62vw);object-fit:cover;filter:saturate(1.05)}
.steam{position:absolute;top:8%;left:0;right:0;display:flex;justify-content:center;gap:26px;pointer-events:none}
.steam i{width:14px;height:110px;border-radius:10px;background:linear-gradient(rgba(255,255,255,0),rgba(255,255,255,.85),rgba(255,255,255,0));filter:blur(7px);opacity:.7;animation:rise 3.4s ease-in-out infinite}
.steam i:nth-child(2){animation-delay:.7s;height:140px}
.steam i:nth-child(3){animation-delay:1.3s}
.steam i:nth-child(4){animation-delay:1.9s;height:90px}
@keyframes rise{0%{transform:translateY(14px) scaleX(1);opacity:0}35%{opacity:.75}100%{transform:translateY(-46px) scaleX(1.6);opacity:0}}
.bowl figcaption{display:flex;justify-content:space-between;gap:10px;padding:13px 16px;font-size:12px;letter-spacing:.12em;background:var(--rice)}
.side-note{position:fixed;right:10px;top:50%;transform:translateY(-50%);writing-mode:vertical-rl;font-family:'Noto Serif JP',serif;letter-spacing:.4em;font-size:12px;color:var(--mut);z-index:5}
@media(max-width:920px){.side-note{display:none}}
/* SEZIONI numerate */
section{max-width:1220px;margin:0 auto;padding:64px 24px}
.num{font-family:'Noto Serif JP',serif;color:var(--shio);font-size:15px;letter-spacing:.3em}
h2{font-family:'Noto Serif JP',serif;font-size:clamp(32px,4.6vw,60px);line-height:1.15;margin:10px 0 6px}
/* TICKET MACHINE */
.machine{margin-top:26px;display:grid;grid-template-columns:340px 1fr;gap:20px;align-items:start}
@media(max-width:920px){.machine{grid-template-columns:1fr}}
.panel{background:#1b1b1a;color:#f2efe6;border-radius:16px;padding:20px;border:1px solid #333}
.panel h3{font-size:12px;letter-spacing:.25em;color:#b9b2a2}
.tkeys{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}
.tkeys button{background:#262624;color:#fff;border:1px solid #444;border-radius:10px;padding:16px 10px;text-align:left}
.tkeys button b{display:block;font-size:16px}
.tkeys button span{font-size:12px;color:#c9c2b2}
.tkeys button.on{outline:2px solid var(--shio);background:#2e3336}
.detail{background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;display:grid;grid-template-columns:1fr 1fr;min-height:340px}
@media(max-width:700px){.detail{grid-template-columns:1fr}}
.detail img{width:100%;height:100%;min-height:260px;object-fit:cover}
.detail .tx{padding:26px}
.detail .tx b{font-family:'Noto Serif JP',serif;font-size:26px}
.howto{margin-top:14px;font-size:14px;line-height:2;color:#4a463c}
/* POSTI + ETIQUETTE */
.seats{display:flex;gap:8px;margin:18px 0 6px}
.seats i{width:34px;height:34px;border-radius:50%;border:1.5px solid var(--ink);display:flex;align-items:center;justify-content:center;font-style:normal;font-size:12px;background:#fff}
.seats i.taken{background:var(--ink);color:#fff}
.rules{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:20px}
@media(max-width:920px){.rules{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.rules{grid-template-columns:1fr}}
.rule{background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px}
.rule b{font-family:'Noto Serif JP',serif;font-size:18px;display:block;margin-bottom:6px}
.rule p{font-size:13.5px;line-height:1.8;color:#55514a}
/* SOUP METER poetico */
.soup{margin-top:22px;background:#101010;color:#f2efe6;border-radius:16px;padding:24px;display:grid;grid-template-columns:1fr auto;gap:18px;align-items:center}
@media(max-width:700px){.soup{grid-template-columns:1fr}}
.bar{height:10px;background:#2c2c2a;border-radius:10px;overflow:hidden;margin-top:12px}
.bar i{display:block;height:100%;width:72%;background:linear-gradient(90deg,var(--shio),#cfe6ef);transition:width .6s}
#soupbtn{background:var(--rice);border:0;border-radius:10px;padding:16px 22px;font-weight:800}
footer{border-top:1px solid var(--line);padding:44px 24px;text-align:center}
footer .big{font-family:'Noto Serif JP',serif;font-size:clamp(30px,5vw,64px)}
.note{margin-top:12px;font-size:11px;letter-spacing:.18em;color:#8a8474}
.rv{opacity:0;transform:translateY(20px);transition:opacity .7s,transform .7s}
.rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none}.steam i{animation:none;opacity:0}#noren{display:none}}