.intro{position:fixed;inset:0;z-index:1000;background:#14252e;color:#e5d3a1;display:grid;place-items:center;overflow:hidden;animation:intro-safety 0s 6s forwards;transition:opacity .75s ease,visibility .75s;pointer-events:none}
.intro-glow{position:absolute;width:min(90vw,720px);aspect-ratio:1;border-radius:50%;background:radial-gradient(ellipse,#3a696430 0,#2f55501c 30%,transparent 67%);animation:glow-breathe 3s ease-in-out both}
.intro-content{text-align:center;position:relative;transform:translateY(-12px)}
.justice-mark{width:clamp(190px,22vw,260px);height:auto;overflow:visible;filter:drop-shadow(0 0 15px #d5b46018)}
.draw{stroke-dasharray:1;stroke-dashoffset:1;animation:draw-justice 1.15s cubic-bezier(.4,0,.2,1) forwards}
.stem{animation-delay:.08s}.finial{animation-delay:.16s}.beam-line{animation-delay:.3s}.ropes{animation-delay:.55s}.bowl{animation-delay:.75s;fill:#d7b45d00;animation-name:draw-bowl}
.justice-beam{transform-origin:150px 62px;animation:balance-justice 2.65s cubic-bezier(.37,0,.25,1) both}
.pan{transform-box:view-box}.pan-left{transform-origin:48px 84px;animation:counterbalance-left 2.65s ease both}.pan-right{transform-origin:252px 84px;animation:counterbalance-right 2.65s ease both}
.pivot{opacity:0;animation:fade-justice .5s .65s both}
.intro-name{font:500 clamp(25px,3vw,34px)/1.2 'Outfit',Arial,sans-serif;color:#f2ede1;letter-spacing:-.7px;margin-top:24px;animation:name-arrive .9s .65s both}
.intro-label{font:450 9px/1.4 'DM Sans',sans-serif;letter-spacing:5.5px;margin:12px 0 0 5px;color:#c9ac63;animation:name-arrive .9s .82s both}
.intro-rule{height:1px;width:120px;margin:31px auto 0;background:#ffffff12;overflow:hidden;animation:fade-justice .5s .7s both}.intro-rule span{display:block;width:100%;height:100%;background:linear-gradient(90deg,#927135,#e8ce8c);transform-origin:left;animation:intro-progress 2.4s ease both}
.intro.leaving{opacity:0;visibility:hidden}.intro.leaving .intro-content{transition:transform .75s cubic-bezier(.4,0,.2,1),filter .75s;transform:translateY(-30px);filter:blur(4px)}
@keyframes draw-justice{to{stroke-dashoffset:0}}
@keyframes draw-bowl{60%{fill:#d7b45d00}to{stroke-dashoffset:0;fill:#d7b45d0b}}
@keyframes balance-justice{0%,20%{transform:rotate(-10deg)}48%{transform:rotate(7deg)}68%{transform:rotate(-3deg)}85%,100%{transform:rotate(0)}}
@keyframes counterbalance-left{0%,20%{transform:rotate(10deg)}48%{transform:rotate(-7deg)}68%{transform:rotate(3deg)}85%,100%{transform:rotate(0)}}
@keyframes counterbalance-right{0%,20%{transform:rotate(10deg)}48%{transform:rotate(-7deg)}68%{transform:rotate(3deg)}85%,100%{transform:rotate(0)}}
@keyframes fade-justice{from{opacity:0}to{opacity:1}}
@keyframes name-arrive{from{opacity:0;transform:translateY(14px);filter:blur(5px)}to{opacity:1;transform:translateY(0);filter:blur(0)}}
@keyframes intro-progress{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes glow-breathe{from{opacity:0;transform:scale(.7)}to{opacity:1;transform:scale(1.1)}}
@keyframes intro-safety{to{opacity:0;visibility:hidden}}
@media(prefers-reduced-motion:reduce){.intro *{animation:none!important;filter:none!important}.intro .draw{stroke-dashoffset:0}.intro .pivot{opacity:1}.intro{animation:intro-safety 0s .5s forwards;transition:opacity .15s}.intro.leaving .intro-content{transform:none;filter:none}}
