/* A film first, followed by a quiet stage-curtain reveal. */
body.intro-pending{overflow:hidden}
body.intro-pending>.site-header,body.intro-pending>#main,body.intro-pending>.site-footer,body.intro-pending>#comparison-tray,body.intro-pending>.skip-link{visibility:hidden}
body.intro-pending.intro-opening>.site-header,body.intro-pending.intro-opening>#main,body.intro-pending.intro-opening>.site-footer,body.intro-pending.intro-opening>#comparison-tray{visibility:visible}
#intro-gate{position:fixed;inset:0;z-index:1000;background:var(--paper,#faf9f6);overflow:auto;overscroll-behavior:contain;color:var(--ink,#262a28)}
#intro-gate:fullscreen{background:var(--paper,#faf9f6)}
#intro-stage{width:min(1120px,calc(100% - 80px));min-height:100svh;margin:auto;padding:26px 0 22px;display:flex;flex-direction:column;justify-content:center;opacity:1;transition:opacity .4s ease}
.intro-masthead{display:flex;justify-content:space-between;align-items:center;gap:24px;padding-bottom:24px;border-bottom:1px solid var(--line)}
.intro-masthead img{width:150px;height:auto}.intro-masthead>span{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.intro-heading{display:flex;align-items:end;justify-content:space-between;gap:40px;padding:26px 0}
.intro-heading h1{font-size:43px;line-height:1.12}.intro-heading h1>span{display:block;font:13px/1.5 var(--sans);letter-spacing:0;color:var(--muted);margin-top:9px}
.intro-heading>p{font-size:14px;line-height:1.7;max-width:315px}
.intro-player{width:min(100%,calc((100svh - 380px)*16/9));min-width:0;margin:0 auto}
.intro-film{position:relative;aspect-ratio:16/9;background:#171d19;overflow:hidden}
#intro-video{display:block;width:100%;height:100%;object-fit:contain;background:#171d19}
#intro-video::cue{background:#141b16e6;color:#fff;font:16px/1.5 var(--sans)}
#intro-start-screen{position:absolute;inset:0;display:grid;place-items:center;background:#111b1878}
#intro-start{display:flex;align-items:center;gap:20px;min-height:68px;border:0;padding:18px 26px;background:var(--paper);color:var(--ink);text-align:left;font-size:16px;line-height:1.5;box-shadow:0 10px 34px #0002}
#intro-start:hover{background:#fff}.intro-play-disc{display:grid;place-items:center;width:45px;height:45px;border:1px solid #a6ada4;border-radius:50%}.intro-play-disc svg{width:23px;height:23px}
#intro-start small{display:block;font-size:12px;font-weight:400;color:var(--muted);margin-top:3px}
#intro-progress{appearance:none;-webkit-appearance:none;display:block;width:100%;height:3px;border:0;border-radius:0;background:#dddeda;color:var(--red);pointer-events:none}
#intro-progress::-webkit-progress-bar{background:#dddeda}#intro-progress::-webkit-progress-value{background:var(--red)}#intro-progress::-moz-progress-bar{background:var(--red)}
.intro-controls{display:flex;justify-content:space-between;gap:20px;align-items:center;min-height:58px;border-bottom:1px solid var(--line)}
.intro-controls button{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;padding:8px 4px;background:none;min-height:44px;min-width:44px;font-size:12px;font-weight:500;white-space:nowrap}
.intro-controls button:hover{color:var(--red)}.intro-controls button[aria-pressed=true]{color:var(--red)}
.intro-controls svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.intro-playback,.intro-settings{display:flex;align-items:center;gap:18px}
#intro-time{font-size:12px;font-variant-numeric:tabular-nums;color:var(--muted);white-space:nowrap}
.intro-icon-pause{display:none}#intro-gate[data-state=playing] .intro-icon-play{display:none}#intro-gate[data-state=playing] .intro-icon-pause{display:block}
.intro-foot{min-height:45px;padding-top:17px;text-align:center}.intro-foot>p{font-size:12px;line-height:1.7}.intro-foot #intro-status:not(:empty){margin-top:6px;color:var(--red)}
#intro-retry{min-height:44px;border:1px solid var(--ink);background:var(--ink);color:white;padding:10px 20px;margin-top:12px;font-size:14px}
#intro-gate[data-state=error] .intro-film{outline:1px solid #c5a49f}#intro-gate[data-state=opening] #intro-stage{opacity:0;pointer-events:none}
/* The folds belong to the curtain, not to the page behind it. */
#intro-curtains{position:fixed;inset:0;opacity:0;pointer-events:none;z-index:2;overflow:hidden;transition:opacity .42s ease}
#intro-gate[data-state=opening] #intro-curtains{opacity:1}
.intro-curtain-left,.intro-curtain-right{position:absolute;top:0;bottom:0;width:calc(50% + 2px);background-color:#55282f;background-image:repeating-linear-gradient(90deg,#180f144d 0%,#0000 5.5%,#a3675a33 8%,#2c121644 12%,#0000 16%),linear-gradient(90deg,#351b22,#64353b 45%,#48232c);box-shadow:inset 0 0 90px #190d1655;will-change:transform}
.intro-curtain-left{left:0;transform-origin:left center;border-right:1px solid #26151c;box-shadow:inset -16px 0 28px #160c1455}
.intro-curtain-right{right:0;transform-origin:right center;border-left:1px solid #774b48;background-position:100% 0;box-shadow:inset 16px 0 28px #160c1466}
.intro-curtain-left:after,.intro-curtain-right:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#0e0b1533,#0000 18%,#0000 75%,#0e0b1533);pointer-events:none}
.intro-curtain-signature{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px;color:#f5eee3;text-align:center;padding:24px;transition:opacity .35s ease}
.intro-curtain-signature>span{font-family:var(--serif);font-size:clamp(32px,4.5vw,60px);line-height:1.1;letter-spacing:-.035em}
.intro-curtain-signature>small{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:#d3c1b6}
body.intro-opening #intro-gate{background:transparent;overflow:hidden}
body.intro-opening .intro-curtain-left{animation:curtain-left 1.9s cubic-bezier(.72,0,.22,1) both}
body.intro-opening .intro-curtain-right{animation:curtain-right 1.9s cubic-bezier(.72,0,.22,1) both}
body.intro-opening .intro-curtain-signature{opacity:0}
@keyframes curtain-left{0%{transform:translateX(0) scaleX(1)}30%{transform:translateX(-12%) scaleX(.94)}100%{transform:translateX(-102%) scaleX(.78)}}
@keyframes curtain-right{0%{transform:translateX(0) scaleX(1)}30%{transform:translateX(12%) scaleX(.94)}100%{transform:translateX(102%) scaleX(.78)}}
@media(max-width:760px){#intro-stage{width:calc(100% - 40px);padding:24px 0;justify-content:center}.intro-masthead{padding-bottom:22px}.intro-masthead img{width:132px}.intro-masthead>span{font-size:11px}.intro-heading{display:block;padding:28px 0 24px}.intro-heading h1{font-size:39px}.intro-heading>p{font-size:14px;max-width:430px;margin-top:16px}.intro-player{width:100%}.intro-controls{gap:12px}.intro-settings{gap:8px}.intro-controls button>span[data-intro-label]{display:none}.intro-playback{gap:10px}.intro-settings button{padding:8px;min-width:44px}.intro-foot{padding-top:21px}.intro-foot>p{font-size:12px}#intro-start{gap:14px;padding:14px 20px;font-size:15px}.intro-play-disc{height:40px;width:40px}#intro-video::cue{font-size:12px}}
@media(max-width:380px){.intro-heading h1{font-size:35px}.intro-masthead>span{font-size:10px}.intro-playback{gap:4px}.intro-settings{gap:0}.intro-controls{gap:6px}.intro-controls button{min-width:40px}.intro-settings button{min-width:40px}.intro-playback #intro-time{font-size:11px}}
@media(max-height:600px) and (min-width:761px){#intro-stage{padding:16px 0}.intro-masthead{padding-bottom:12px}.intro-masthead img{width:120px}.intro-heading{padding:14px 0}.intro-heading h1{font-size:32px}.intro-heading h1>span{display:none}.intro-player{width:min(100%,calc((100svh - 280px)*16/9))}.intro-foot{padding-top:12px}.intro-controls{min-height:48px}}
@media(prefers-reduced-motion:reduce){#intro-stage,#intro-curtains,.intro-curtain-signature{transition:none}.intro-curtain-left,.intro-curtain-right{animation:none!important;will-change:auto}body.intro-opening #intro-curtains{opacity:0}}

/* A presentation mount: ivory mat, brass rules, and the red-white identity. */
#intro-stage{padding:20px 0 18px}
.intro-masthead{padding-bottom:16px}.intro-masthead img{width:140px}
.intro-heading{padding:20px 0}.intro-heading h1{font-size:39px}.intro-heading h1>span{margin-top:5px}
.intro-player{width:min(100%,calc((100svh - 365px)*16/9));max-width:1000px}
.intro-frame{position:relative;padding:0 14px;background:#f0eee7;border:1px solid #b8aa8b;box-shadow:0 15px 45px #28292010,0 2px 5px #28292009}
.intro-frame:before,.intro-frame:after{content:'';position:absolute;pointer-events:none;width:29px;height:29px;border-color:#8d774c;border-style:solid;z-index:2}
.intro-frame:before{top:-5px;left:-5px;border-width:1px 0 0 1px}.intro-frame:after{right:-5px;bottom:-5px;border-width:0 1px 1px 0}
.intro-frame-top{height:37px;display:flex;align-items:center;justify-content:space-between;gap:20px;position:relative;font-size:10px;letter-spacing:.11em;text-transform:uppercase;color:#5a5b51;isolation:isolate}
.intro-frame-top:before{content:'';position:absolute;inset:0;background:url('assets/danantara-master-motif-01.webp') 60% 55%/200% auto;opacity:.045;z-index:-1}
.intro-frame-top>span{display:inline-flex;align-items:center;gap:11px}.intro-frame-top b{font-weight:400;font-variant-numeric:tabular-nums;padding-left:11px;border-left:1px solid #c8c0b0;letter-spacing:.03em}
.intro-flag{display:inline-block;width:22px;height:15px;border:1px solid #d5d2c9;background:linear-gradient(#b52733 0 50%,#fff 50% 100%);box-shadow:0 1px 2px #2221}
.intro-film{border:1px solid #c3c1b8;border-bottom:0;background:#fff}
.intro-frame-bottom{min-height:51px;display:flex;align-items:center;justify-content:space-between;gap:15px}
#intro-scene-label{font-family:var(--serif);font-size:19px;line-height:1.2;color:var(--ink)}
#intro-sound-prompt{display:inline-flex;align-items:center;gap:9px;min-height:36px;border:1px solid #72796d;background:#faf9f6;color:#333c35;font-size:12px;line-height:1.2;padding:8px 11px;white-space:nowrap;transition:background .2s,border-color .2s}
#intro-sound-prompt:hover{background:#fff;border-color:#2e3d31}
#intro-audio-on{display:inline-flex;align-items:center;gap:9px;font-size:11px;color:#62685f;white-space:nowrap}
.intro-sound-bars{display:inline-flex;align-items:center;gap:2px;height:14px;width:14px}.intro-sound-bars i{display:block;width:2px;height:5px;background:currentColor;transform-origin:center}.intro-sound-bars i:nth-child(2){height:12px}.intro-sound-bars i:nth-child(3){height:8px}
#intro-gate[data-state=playing][data-sound=on] #intro-audio-on i{animation:intro-equalizer .85s ease-in-out infinite alternate}#intro-audio-on i:nth-child(2){animation-delay:-.35s!important}#intro-audio-on i:nth-child(3){animation-delay:-.6s!important}
#intro-progress{height:2px;color:#8b754c}#intro-progress::-webkit-progress-value{background:#8b754c}#intro-progress::-moz-progress-bar{background:#8b754c}
.intro-controls{min-height:52px}.intro-controls button[aria-pressed=true]{color:var(--ink)}
.intro-foot{padding-top:12px;min-height:32px}.intro-foot #intro-status:not(:empty){position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;margin:0}
#intro-gate[data-state=error] #intro-status{position:static;width:auto;height:auto;clip-path:none;white-space:normal;margin-top:8px;color:#6f4c36}
#intro-gate:focus{outline:none}#intro-gate :focus-visible{outline:2px solid #42574d;outline-offset:4px}#intro-start{box-shadow:0 8px 30px #0002}#intro-start:focus:not(:focus-visible){outline:none}
.intro-masthead{animation:intro-enter .75s cubic-bezier(.22,1,.36,1) both}.intro-heading{animation:intro-enter .85s .06s cubic-bezier(.22,1,.36,1) both}.intro-player{animation:intro-enter 1s .12s cubic-bezier(.22,1,.36,1) both}.intro-foot{animation:intro-enter .85s .3s cubic-bezier(.22,1,.36,1) both}
.intro-frame:before,.intro-frame:after{animation:intro-corner 1.2s .3s cubic-bezier(.22,1,.36,1) both}
@keyframes intro-enter{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}
@keyframes intro-corner{from{opacity:0;width:8px;height:8px}to{opacity:1;width:29px;height:29px}}
@keyframes intro-equalizer{from{transform:scaleY(.45)}to{transform:scaleY(1)}}
@media(min-width:761px) and (max-height:730px){#intro-stage{padding:16px 0}.intro-masthead img{width:125px}.intro-masthead{padding-bottom:12px}.intro-heading{padding:15px 0}.intro-heading h1{font-size:34px}.intro-heading h1>span{font-size:12px}.intro-player{width:min(100%,calc((100svh - 335px)*16/9))}.intro-frame-top{height:30px}.intro-frame-bottom{min-height:46px}.intro-foot{padding-top:9px}}
@media(max-width:760px){#intro-stage{width:calc(100% - 40px);padding:24px 0}.intro-heading{padding:23px 0}.intro-heading h1{font-size:37px}.intro-player{width:100%}.intro-frame{padding:0 9px}.intro-frame-top{height:33px;font-size:9px;gap:10px}.intro-frame-top>span{gap:8px}.intro-frame-top b{padding-left:8px}.intro-frame-bottom{min-height:52px;gap:10px}#intro-scene-label{font-size:17px}#intro-sound-prompt{font-size:11px;padding:7px 9px;gap:7px}.intro-foot{padding-top:16px}.intro-masthead img{width:132px}}
@media(max-width:380px){#intro-stage{width:calc(100% - 32px)}.intro-frame{padding:0 8px}.intro-heading h1{font-size:34px}.intro-frame-top{font-size:8px}#intro-scene-label{font-size:16px}#intro-sound-prompt{font-size:10px;gap:6px}}
@media(prefers-reduced-motion:reduce){.intro-masthead,.intro-heading,.intro-player,.intro-foot,.intro-frame:before,.intro-frame:after,#intro-audio-on i{animation:none!important}.intro-frame:before,.intro-frame:after{opacity:1}}
.intro-frame{border-top:2px solid #a52232;box-shadow:inset 0 3px 0 #fff,0 15px 45px #28292010,0 2px 5px #28292009}
