html{scrollbar-gutter:stable}
.site-intro[hidden]{display:none!important}
.intro-active{overflow:hidden}
.site-intro{position:fixed;inset:0;z-index:1000;background:#0a0a0a;color:#f3f1f6;display:flex;flex-direction:column;padding:32px 40px;font-family:Kanit,Arial,sans-serif;isolation:isolate;clip-path:inset(0);transition:clip-path .6s cubic-bezier(.76,0,.24,1)}
.site-intro::before{content:"";position:absolute;left:50%;top:47%;width:min(650px,100%);height:360px;transform:translate(-50%,-50%);background:radial-gradient(ellipse,#81279d29,transparent 68%);z-index:-1;animation:intro-bloom 1.6s ease-out both}
.site-intro.is-leaving{clip-path:inset(0 0 100%)}
.intro-top,.intro-bottom{display:flex;align-items:center;justify-content:space-between;gap:20px}
.intro-brand{display:flex;align-items:center;gap:12px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;font-weight:400;line-height:1.35}
.intro-monogram{display:grid;place-items:center;width:40px;height:40px;border:1px solid #ffffff30;border-radius:50%;font-size:15px;font-weight:500;letter-spacing:-.04em}
.intro-skip{font:400 12px Kanit,Arial,sans-serif;letter-spacing:.06em;color:#b6b0bd;border:1px solid #ffffff25;border-radius:40px;background:transparent;padding:10px 18px;min-height:44px}
.intro-skip:hover{border-color:#d5a4e6;color:white}.intro-skip:focus-visible{outline:2px solid #dfb2f0;outline-offset:5px}
.intro-center{margin:auto;width:min(380px,100%);text-align:center;padding:55px 0}
.intro-dots{display:flex;justify-content:center;gap:22px;padding:0 0 44px}
.intro-dots span{width:16px;height:16px;border-radius:50%;background:#f8f4ff;box-shadow:0 0 18px #d9a7ef20;animation:intro-wave 1.1s ease-in-out 9;animation-delay:calc(var(--dot)*90ms)}
.intro-dots span:last-child{background:#d39af2}
.intro-title{font-size:clamp(25px,3vw,38px);font-weight:500;letter-spacing:-.02em;line-height:1.2;margin-bottom:10px}
.intro-subtitle{font-size:13px;color:#9e96a7;font-weight:300;letter-spacing:.025em}
.intro-meter{margin-top:40px;height:2px;width:100%;background:#ffffff18;position:relative}
.intro-meter::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#8f66d9,#e6a8d5,#ccbbff);transform:scaleX(var(--load-progress,0));transform-origin:left;box-shadow:0 0 12px #be6cce55}
.intro-meta{margin-top:14px;display:flex;justify-content:space-between;gap:12px;font-size:11px;letter-spacing:.07em;text-transform:uppercase;color:#aaa3b4}
.intro-percent{font-variant-numeric:tabular-nums;color:#e8dfef}.intro-percent span{font-size:15px;font-weight:400;letter-spacing:0}
.intro-bottom{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#8c8694;border-top:1px solid #ffffff13;padding-top:20px}
.intro-revealed .hero-heading-wrap{animation:hero-settle .8s cubic-bezier(.22,1,.36,1) both}.intro-revealed .hero-portrait img{animation:portrait-settle 1s cubic-bezier(.22,1,.36,1) both}
@keyframes intro-wave{0%,55%,100%{transform:translateY(0)}28%{transform:translateY(-19px)}}
@keyframes intro-bloom{from{opacity:0}to{opacity:1}}
@keyframes hero-settle{from{opacity:.15;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
@keyframes portrait-settle{from{opacity:.2;transform:translateY(22px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(max-width:600px){.site-intro{padding:22px 24px}.intro-brand{font-size:10px;gap:9px}.intro-monogram{width:34px;height:34px;font-size:13px}.intro-skip{padding-inline:13px;font-size:11px}.intro-center{max-width:300px}.intro-dots{gap:19px}.intro-dots span{width:14px;height:14px}.intro-bottom{font-size:9px;letter-spacing:.07em}.intro-bottom span:last-child{max-width:115px;text-align:right}}
@media(prefers-reduced-motion:reduce){.site-intro{display:none!important}.intro-active{overflow:auto}.intro-revealed .hero-heading-wrap,.intro-revealed .hero-portrait img{animation:none}}