/* Hero photograph and legacy slideshow presentation. The homepage now uses one static photograph. */
body[data-food-first] .entrance:has(.shiki-hero) { min-height:660px; height:100svh; max-height:1100px; }
body[data-food-first] .entrance .inside:has(.shiki-hero) { display:block; background:#242421; }
.shiki-hero { position:absolute; inset:0; color:#fffdf4; background:#242421; isolation:isolate; --hero-progress:0; }
.shiki-hero-slides,.shiki-hero-slide { position:absolute; inset:0; margin:0; overflow:hidden; }
.shiki-hero-slide { opacity:0; transition:opacity 1500ms ease; pointer-events:none; }
.shiki-hero-slide.is-current { opacity:1; }
.shiki-hero-slide img { width:100%; height:100%; max-width:none; object-fit:cover; object-position:center; transform-origin:center; }
.shiki-hero-slide[data-scene="noodles"] img { object-position:48% 50%; }
/* The original photograph, slightly reduced in frame without extending its contents. */
.shiki-hero-slide[data-scene="dashi"] img { position:absolute; left:0; top:50%; translate:0 -50%; width:94%; height:auto; object-fit:contain; mask-image:linear-gradient(transparent,#000 12%,#000 90%,transparent),linear-gradient(90deg,#000 85%,transparent); mask-composite:intersect; -webkit-mask-image:linear-gradient(transparent,#000 12%,#000 90%,transparent),linear-gradient(90deg,#000 85%,transparent); -webkit-mask-composite:source-in; }
.shiki-hero-slide[data-scene="tenzaru"] img { object-position:45% 55%; }
.shiki-hero::after { content:""; position:absolute; z-index:1; inset:0; pointer-events:none; background:linear-gradient(180deg,#111a 0%,transparent 25%,transparent 65%,#111a 100%),linear-gradient(270deg,#10120dc2,#10120d55 28%,transparent 60%); }
.shiki-hero-message { position:absolute; z-index:2; top:26%; right:6%; display:flex; flex-direction:row-reverse; gap:24px; }
.shiki-hero-message h2,.shiki-hero-message .shiki-hero-copy { writing-mode:vertical-rl; font:500 clamp(36px,4.2vw,64px)/1.65 Shippori,serif; letter-spacing:.13em; text-shadow:0 2px 24px #14171044; margin:0; }
.shiki-hero-message h2 span,.shiki-hero-copy span { display:block; white-space:nowrap; }
.shiki-hero-message p:not(.shiki-hero-copy) { writing-mode:vertical-rl; font:400 14px/2.1 Shippori,serif; letter-spacing:.17em; margin-top:9px; }
.shiki-hero-bottom { position:absolute; z-index:2; left:6%; right:6%; bottom:82px; display:flex; align-items:end; justify-content:space-between; gap:30px; }
.shiki-hero-counter { font:400 25px/1.2 Arial,sans-serif; letter-spacing:.04em; }
.shiki-hero-counter small { font-size:11px; opacity:.7; margin-left:9px; }
.shiki-hero-pagination { display:flex; gap:9px; margin-top:12px; }
.shiki-hero-pagination button { position:relative; width:55px; height:44px; padding:0; border:0; color:inherit; background:transparent; }
.shiki-hero-pagination button::before,.shiki-hero-pagination button::after { content:""; position:absolute; left:0; right:0; top:22px; height:1px; background:#fff6; }
.shiki-hero-pagination button::after { background:#fff; transform:scaleX(0); transform-origin:left; }
.shiki-hero-pagination button[aria-pressed="true"]::after { height:2px; transform:scaleX(var(--hero-progress)); }
.shiki-hero-pagination button[aria-pressed="true"]::before { background:#fffc; }
.shiki-hero-caption { font-size:11px; letter-spacing:.12em; margin-top:0; }
.shiki-hero-links { display:flex; gap:30px; align-items:center; }
.shiki-hero-links a { display:flex; align-items:center; gap:25px; padding:12px 0; border-bottom:1px solid #fff9; font-size:13px; letter-spacing:.08em; min-height:44px; }
.shiki-hero-links a span { font-size:18px; }
.entrance[data-enhanced]:not([data-open]) .shiki-hero-message,.entrance[data-enhanced]:not([data-open]) .shiki-hero-bottom { opacity:0; }
.shiki-hero-message,.shiki-hero-bottom { transition:opacity 1s .4s; }
body[data-food-first] .entrance:has(.shiki-hero)[data-noren-ink="light"] .entrance-top { background:transparent; color:#fffdf4!important; }
body[data-food-first] .entrance:has(.shiki-hero)[data-noren-ink="light"] .small-brand img { filter:invert(1)!important; }
body[data-food-first] .entrance:has(.shiki-hero) .entrance-caption { display:none; }
body[data-food-first] .entrance:has(.shiki-hero)[data-open] .entrance-scroll { color:#fffdf4!important; }
@media(min-width:1600px) { .shiki-hero-slide[data-scene="curry"] img { object-position:50% 56%; } }
@media(min-width:761px) and (max-aspect-ratio:4/3) {
 /* Preserve the whole pot on taller displays while covering both horizontal edges. */
 .shiki-hero-slide[data-scene="curry"] img { position:absolute; top:50%; left:0; width:100%; height:auto; translate:0 -50%; mask-image:linear-gradient(transparent,#000 15%,#000 92%,transparent); -webkit-mask-image:linear-gradient(transparent,#000 15%,#000 92%,transparent); }
}
@media(max-width:760px) {
 body[data-food-first] .entrance:has(.shiki-hero) { min-height:620px; height:100svh; max-height:950px; }
 .shiki-hero-message { top:18%; right:8%; gap:14px; }
 .shiki-hero-message h2,.shiki-hero-message .shiki-hero-copy { font-size:36px; line-height:1.6; letter-spacing:.1em; }
 .shiki-hero-message p:not(.shiki-hero-copy) { font-size:12px; line-height:1.8; letter-spacing:.1em; }
 .shiki-hero-slide[data-scene="curry"] img { position:absolute; left:-3%; top:37%; width:125%; height:auto; object-fit:contain; mask-image:linear-gradient(transparent,#000 15%,#000 92%,transparent); -webkit-mask-image:linear-gradient(transparent,#000 15%,#000 92%,transparent); }
 /* Match the other mobile photographs instead of filling the entire tall viewport. */
 .shiki-hero-slide[data-scene="noodles"] img { position:absolute; left:-10%; top:35%; width:125%; height:auto; object-fit:contain; object-position:center; mask-image:linear-gradient(transparent,#000 12%,#000 90%,transparent); -webkit-mask-image:linear-gradient(transparent,#000 12%,#000 90%,transparent); }
 /* Keep the ladle, broth and pan together on portrait screens. */
 .shiki-hero-slide[data-scene="dashi"] img,.shiki-hero-slide[data-scene="tenzaru"] img { position:absolute; left:-5%; top:33%; width:125%; height:auto; object-fit:contain; mask-image:linear-gradient(transparent,#000 12%,#000 90%,transparent); -webkit-mask-image:linear-gradient(transparent,#000 12%,#000 90%,transparent); }
 .shiki-hero-slide[data-scene="dashi"] img { left:-10%; top:34%; width:135%; translate:0 0; mask-image:linear-gradient(transparent,#000 10%,#000 90%,transparent); -webkit-mask-image:linear-gradient(transparent,#000 10%,#000 90%,transparent); }
 .shiki-hero-slide[data-scene="tenzaru"] img { top:38%;left:-10%; }

 .shiki-hero::after { background:linear-gradient(180deg,#15160e85,transparent 45%,transparent 65%,#15160eb3),linear-gradient(270deg,#10120dc2,#10120d77 35%,transparent 80%); }
 .shiki-hero-bottom { bottom:60px; left:6%; right:6%; display:grid; grid-template-columns:1fr; gap:16px; }
 .shiki-hero-controls { display:grid; grid-template-columns:auto 1fr; align-items:center; gap:0 18px; }
 .shiki-hero-counter { font-size:21px; }
 .shiki-hero-pagination { margin:0; gap:8px; }
 .shiki-hero-pagination button { width:38px; }
 .shiki-hero-caption { grid-column:1/-1; font-size:10px; }
 .shiki-hero-links { gap:25px; }
 .shiki-hero-links a { font-size:12px; gap:22px; }
 body[data-food-first] .entrance:has(.shiki-hero) .entrance-scroll { bottom:22px; right:auto; left:6%; }
}
@media(max-width:360px) { .shiki-hero-message h2,.shiki-hero-message .shiki-hero-copy { font-size:31px; }.shiki-hero-message p:not(.shiki-hero-copy) { font-size:11px; }.shiki-hero-message { gap:10px; }.shiki-hero-links { gap:18px; }.shiki-hero-links a { font-size:11px;gap:13px; } }
@media(prefers-reduced-motion:reduce) { .shiki-hero-slide,.shiki-hero-message,.shiki-hero-bottom { transition:none!important; } }
html[data-motion="paused"] .shiki-hero-slide { transition:none!important; }

/* The single-photo homepage has no slide count, progress controls or image animation. */
.shiki-hero[data-hero-static] .shiki-hero-slide { transition:none; }
.shiki-hero[data-hero-static] .shiki-hero-caption { margin:0 0 14px; }
@media(max-width:760px) { .shiki-hero[data-hero-static] .shiki-hero-bottom { gap:6px; } .shiki-hero[data-hero-static] .shiki-hero-caption { margin:0; } }
