/* Short, silent location titles using the hotel's unchanged exterior photographs. */
.nagi-opening{position:fixed;inset:0;z-index:10000;background:#101619;color:#fff;isolation:isolate;opacity:1;transition:opacity .7s ease;direction:ltr}
.nagi-opening.leaving{opacity:0;pointer-events:none}
.opening-visuals,.opening-photo,.opening-shade{position:absolute;inset:0;width:100%;height:100%}
.opening-photo{object-fit:cover;object-position:center;filter:grayscale(1);opacity:0;transition:opacity .65s ease,filter 1.65s ease}
.opening-photo.active{opacity:1}.nagi-opening[data-step=brand] .opening-photo{filter:grayscale(0)}
.opening-shade{background:linear-gradient(180deg,#07111b33,#07111b33 50%,#07111b88)}
.opening-titles{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:0 6%;transform:translateY(-3%)}
.opening-city{display:flex;justify-content:center;color:#ff0000;font:600 clamp(36px,11.2vw,180px)/1.15 Arial,sans-serif;letter-spacing:.045em;white-space:nowrap;text-shadow:0 2px 20px #0005}
.opening-city span{display:inline-block;opacity:0;animation:opening-letter .85s cubic-bezier(.2,.7,.2,1) forwards;animation-delay:calc(.15s + var(--letter)*.11s)}
.opening-rule{width:min(78vw,1160px);height:2px;background:#ff0000;transform:scaleX(0);transform-origin:left;animation:opening-rule 1.2s .7s ease forwards;margin-top:22px}
.opening-country{color:#ff0000;font:600 clamp(11px,1.8vw,24px)/1.5 Arial,sans-serif;letter-spacing:.2em;opacity:0;animation:opening-letter .8s 1.35s ease forwards;margin-top:18px}
.opening-nagi{font:400 clamp(100px,24vw,380px)/.9 Georgia,serif;letter-spacing:.035em;animation:opening-letter 1.1s cubic-bezier(.2,.7,.2,1) both;text-shadow:0 2px 24px #0003}
.opening-brandline{font:500 clamp(10px,1.3vw,18px)/1.5 Arial,sans-serif;letter-spacing:.34em;margin:32px 0 0;animation:opening-letter .8s .15s ease both}
.opening-skip{position:absolute;bottom:max(24px,env(safe-area-inset-bottom));right:6%;min-height:44px;padding:12px 18px;border:1px solid #ffffff80;background:#07111b55;color:#fff;font:13px Arial,Tahoma,sans-serif;cursor:pointer}
.opening-replay-row{display:flex;justify-content:flex-end;background:#f5f3ed;padding:0 5%;position:relative;z-index:2}
.opening-replay{min-height:44px;border:0;background:transparent;font:12px Arial,Tahoma,sans-serif;color:#1d3d5d;cursor:pointer}
.opening-replay:focus-visible,.opening-skip:focus-visible{outline:2px solid currentColor;outline-offset:3px}
@keyframes opening-letter{from{opacity:0;transform:translateY(12px);filter:blur(3px)}to{opacity:1;transform:translateY(0);filter:blur(0)}}
@keyframes opening-rule{to{transform:scaleX(1)}}
@media(max-width:760px){.opening-city{font-size:10.7vw;letter-spacing:.025em}.opening-rule{width:85vw;margin-top:16px}.opening-country{margin-top:14px}.opening-nagi{font-size:27vw}.opening-brandline{margin-top:24px;letter-spacing:.28em}.opening-titles{transform:translateY(-7%)}.opening-skip{font-size:12px}.opening-photo{object-position:50% 50%}}
@media(prefers-reduced-motion:reduce){.nagi-opening,.opening-replay-row{display:none}}

.nagi-intro-playing .hero-brand{visibility:hidden}

.opening-titles{transition:opacity .45s ease,filter .45s ease}.opening-titles.is-exiting{opacity:0;filter:blur(4px)}

.opening-visuals{isolation:isolate}
.opening-sign{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;filter:url(#nagi-sign-red) drop-shadow(0 0 1px #ff0000b3) drop-shadow(0 0 3px #ff000066);opacity:0;transition:opacity .65s ease;z-index:2;pointer-events:none}
.opening-sign.active{opacity:1}.opening-shade{z-index:1}
.nagi-opening[data-step=brand] .opening-sign{opacity:0;transition-duration:1.65s}
.nagi-opening[data-context=brand][data-step=brand] .opening-sign{transition-duration:.65s}

.opening-selective{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;opacity:0;transition:opacity .3s ease;pointer-events:none}
.opening-selective.active{opacity:1}
.nagi-opening[data-step=property] .opening-sign{opacity:0;transition-duration:.3s}
.nagi-opening[data-step=brand] .opening-selective{transition-duration:1s}
@media(max-width:760px){.opening-photo[data-city=hiroshima],.opening-sign[data-city=hiroshima],.opening-selective[data-city=hiroshima]{object-position:58% 50%!important}}