.temple-intro{position:fixed;inset:0;width:100%;max-width:none;height:100%;max-height:none;margin:0;padding:0;border:0;background:#090b10;color:#fff2d3;overflow:hidden}
.temple-intro::backdrop{background:#090b10}
.temple-intro video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#090b10}
.temple-intro-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.35),rgba(0,0,0,.12) 45%,rgba(0,0,0,.75));pointer-events:none}
.temple-intro-welcome{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:24px 20px 110px;background:rgba(0,0,0,.3);text-shadow:0 2px 14px #000}
.temple-intro-mantra{font-size:14px;letter-spacing:.08em;color:#eacb8b;margin:0 0 16px}
.temple-intro h2{font-size:clamp(30px,5vw,52px);line-height:1.3;margin:0 0 24px;color:#fff2d3}
.temple-intro-bell{display:grid;place-items:center;width:146px;height:146px;border:1px solid #d5aa5f;border-radius:50%;background:radial-gradient(circle,rgba(214,174,90,.25),rgba(12,12,12,.7));box-shadow:0 0 0 10px #d6ae5a12,0 0 65px #e9a73530;cursor:pointer;color:inherit}
.temple-intro-bell:hover{background:#61472180}.temple-intro-bell:focus-visible,.temple-intro-skip:focus-visible{outline:3px solid #fff;outline-offset:6px}
.temple-intro-hint{font-size:18px;margin:26px 0 8px}.temple-intro-note{font-size:13px;color:#dbcdb1;margin:0}
.temple-intro-skip{position:absolute;bottom:max(32px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);border:1px solid #d6ae5a99;border-radius:40px;padding:13px 24px;background:#121b29e8;color:#fff2d3;font:inherit;font-size:15px;white-space:nowrap;cursor:pointer}
.temple-intro progress{position:absolute;bottom:0;left:0;width:100%;height:3px;border:0;appearance:none;background:#222}
.temple-intro progress::-webkit-progress-bar{background:#222}.temple-intro progress::-webkit-progress-value{background:#d6ae5a}
.temple-intro.playing .temple-intro-welcome{display:none}.temple-intro.playing .temple-intro-shade{background:linear-gradient(0deg,#0009,transparent 22%)}
.temple-intro-status{position:absolute;bottom:100px;width:100%;text-align:center;padding:0 20px;font-size:14px;pointer-events:none}
html.temple-intro-open{overflow:hidden;scrollbar-gutter:stable}
@media(max-width:600px){.temple-intro h2{margin-bottom:20px}.temple-intro-mantra{font-size:12px}.temple-intro-hint{font-size:16px}.temple-intro-skip{font-size:14px}}

/* Reveal over the supplied Shiva scene, then dissolve that scene to navy. */
.temple-logo-reveal{position:absolute;inset:0;pointer-events:none;visibility:hidden;isolation:isolate}
.temple-logo-scene{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#090b10}
.temple-logo-backdrop{position:absolute;inset:0;background:#101827;opacity:0;transition:opacity 1.35s ease-in-out}
.temple-logo-lockup{transform-origin:0 0;--logo-size:clamp(21px,min(5.8vw,12vh),76px);position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:24px;gap:0}
.temple-logo-name{flex:0 0 auto;font-family:inherit;font-size:var(--logo-size);font-weight:700;line-height:1.65;letter-spacing:.02em;padding:.18em 0 .22em;white-space:nowrap;background:linear-gradient(180deg,#fff3cc 0%,#f5dba0 38%,#ddb872 62%,#b7883c 100%);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 1px 0 #6e460fb3) drop-shadow(0 3px 9px #0005);opacity:0}
.temple-logo-trishul{flex:0 0 auto;position:relative;z-index:1;display:block;height:calc(var(--logo-size)*2.8);width:auto;margin:0 calc(var(--logo-size)*-.3) 0 calc(var(--logo-size)*-.22);object-fit:contain;opacity:0;transform:scale(3.1);transform-origin:42% 50%;filter:drop-shadow(0 5px 16px #0006)}
.temple-intro.revealing .temple-logo-reveal{visibility:visible}
.temple-intro.revealing.logo-on-blue .temple-logo-backdrop{opacity:1}
.temple-intro.revealing .temple-logo-trishul{animation:temple-trishul-settle 2.65s cubic-bezier(.16,1,.3,1) both}
.temple-intro.revealing .temple-logo-name{animation:temple-name-appear 1.5s cubic-bezier(.22,1,.36,1) .9s both}
.temple-intro.revealing .temple-logo-name-right{animation-delay:1.05s}
.temple-intro.revealing .temple-intro-shade{opacity:0;transition:opacity 1s}
.temple-intro.revealing .temple-intro-status{width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.temple-intro.revealing progress{opacity:0;transition:opacity .5s}
.temple-intro.revealing .temple-intro-skip{z-index:2;opacity:.7;transition:opacity .3s,background .3s}
.temple-intro.revealing .temple-intro-skip:hover,.temple-intro.revealing .temple-intro-skip:focus-visible{opacity:1}
.temple-intro.docking{background:transparent;transition:background .8s ease-in-out}
.temple-intro.docking::backdrop{background:transparent;transition:background .8s ease-in-out}
.temple-intro.docking video,.temple-intro.docking .temple-logo-scene,.temple-intro.docking .temple-logo-backdrop,.temple-intro.docking .temple-intro-shade{opacity:0;transition:opacity .8s ease-in-out}
.temple-intro.docking video,.temple-intro.docking .temple-logo-scene{visibility:hidden}
.temple-intro.docking .temple-logo-lockup{will-change:transform}
.temple-intro.docking .temple-intro-skip{opacity:0;pointer-events:none;transition:opacity .25s}
.temple-intro.revealing.docking .temple-logo-backdrop{opacity:0}
@keyframes temple-trishul-settle{0%{opacity:0;transform:scale(3.1)}18%{opacity:1}100%{opacity:1;transform:scale(1)}}
@keyframes temple-name-appear{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){
 .temple-intro.revealing .temple-logo-name,.temple-intro.revealing .temple-logo-trishul{animation:none;opacity:1;transform:none}
 .temple-logo-backdrop,.temple-intro.revealing .temple-intro-shade,.temple-intro.revealing progress,.temple-intro.docking,.temple-intro.docking::backdrop{transition:none}
}