/* FL5 reference-to-code opening and homepage layer. Screenshot-sourced poster is
   a temporary still only; real animated lion footage must be supplied separately. */
.fl5-intro[hidden]{display:none!important}
body.fl5-intro-open{overflow:hidden}
.fl5-intro{position:fixed;inset:0;z-index:200;display:grid;place-items:center;isolation:isolate;background:radial-gradient(ellipse 63vw 53vh at 50% 48%,#210630 0%,#09020f 50%,#000 82%);color:#f9f1ff}
.fl5-intro:before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 55% 45%,#8d2fee31,transparent 48%);pointer-events:none}
.fl5-intro-inner{position:relative;width:100%;height:100%;min-height:400px;max-height:100dvh;display:grid;grid-template-rows:auto 1fr auto;justify-items:center;align-items:center;padding:clamp(30px,5vh,66px) 18px clamp(40px,8vh,90px)}
.fl5-intro-overline{grid-row:1;color:#9e86ba;letter-spacing:.52em;text-transform:uppercase;font-size:9px;margin:0 0 8px}
.fl5-intro-brand{grid-row:1;align-self:end;transform:translateY(32px);color:#f0dfef;font-size:clamp(10px,1.3vw,16px);letter-spacing:.48em;margin:0}
.fl5-intro-image{grid-row:2;position:relative;display:grid;place-items:center;min-width:0;width:min(95vw,680px);height:min(68vh,680px);filter:drop-shadow(0 0 110px #5c159b85)}
.fl5-intro-image img{display:block;max-height:100%;width:min(100%,680px);height:auto;object-fit:contain;mix-blend-mode:screen;animation:fl5-lion-bloom 2.5s ease-out both}
.fl5-intro-bottom{grid-row:3;display:grid;justify-items:center;gap:13px;align-self:end}
.fl5-intro-skip{font-size:11px;letter-spacing:.32em;font-weight:800;cursor:pointer;color:#e9d8f5;border:1px solid #ad9ac25e;border-radius:999px;background:#09050c88;padding:15px 27px;min-width:120px}
.fl5-intro-skip:focus-visible{outline:2px solid #d0a3ff;outline-offset:4px}
.fl5-intro-caption{font-size:10px;font-weight:800;letter-spacing:.37em;color:#d2b8e1;margin:0}
.fl5-intro-dots{display:flex;gap:12px}
.fl5-intro-dots i{width:7px;height:7px;background:#a96ae5;border-radius:50%;opacity:.3;animation:fl5-dot-pulse 1.8s ease-in-out infinite}
.fl5-intro-dots i:nth-child(2){animation-delay:.25s}
.fl5-intro-dots i:nth-child(3){animation-delay:.5s}
.fl5-intro-line{height:1px;background:linear-gradient(90deg,transparent,#b875fb75,transparent);width:145px;margin-top:4px}
@keyframes fl5-lion-bloom{from{opacity:0;filter:blur(10px);transform:scale(.92)}to{opacity:1;filter:blur(0);transform:scale(1)}}
@keyframes fl5-dot-pulse{0%,100%{opacity:.25;box-shadow:0 0 0 #b16fff}50%{opacity:1;box-shadow:0 0 13px 3px #ba63ff}}
.fl5-nav-intro{font:800 10px Inter,Arial,sans-serif;white-space:nowrap;letter-spacing:.13em;border:1px solid #9d64b26c;border-radius:100px;background:#200c2d;color:#dfbbef;padding:8px 11px;cursor:pointer}
.fl5-nav-intro:hover{border-color:#dc9df9}
.site-head .main-nav{align-items:center;justify-content:center;flex-wrap:wrap;row-gap:10px}
.hero-panel .hero-art{background:radial-gradient(circle at 48% 45%,#4c107988,transparent 70%),url("./assets/lion-reference-poster.webp") center center/contain no-repeat,#08030e}
.hero-panel .hero-art:before,.hero-panel .hero-art:after{display:none}
.hero-panel .hero-monogram{font-size:0;visibility:hidden}
.hero-panel .hero-art .hero-orb{display:none}
.hero-panel .hero-copy{background:linear-gradient(90deg,#07030e04,#0a0617dd)}
.hero-panel .hero-copy h1{font-size:clamp(49px,6.6vw,106px);letter-spacing:-.055em}
.hero-head{display:flex!important}
@media(max-width:800px){
 .site-head .main-nav{justify-content:flex-start}
}
@media(max-width:600px){
 .fl5-intro-inner{padding:35px 16px max(68px,env(safe-area-inset-bottom));}
 .fl5-intro-image{width:100vw;max-height:55vh}
 .fl5-intro-brand{letter-spacing:.4em;font-size:10px}
 .fl5-intro-bottom{gap:12px}
 .head-main{grid-template-columns:1fr auto 1fr}
 .site-head .main-nav{display:none;overflow:auto;max-height:0;padding:0}
 .site-head.menu-open .main-nav{display:grid;height:auto;max-height:min(75dvh,610px);grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;overflow-y:auto;align-items:stretch;justify-content:stretch;padding:12px 18px 18px}
 .site-head.menu-open .main-nav a,.site-head.menu-open .main-nav button{min-width:0;display:flex;align-items:center;justify-content:center;text-align:center;min-height:43px;padding:11px 6px;border:1px solid #a160b35c;background:#1a1023;border-radius:12px;color:#f1dfff}
 .site-head.menu-open .main-nav .fl5-nav-intro{background:#4e1b71}
 .hero-panel .hero-art{inset:0 0 37%;background:radial-gradient(circle at 51% 45%,#4a1075aa,transparent 68%),url("./assets/lion-reference-poster.webp") center 44%/min(92vw,470px) auto no-repeat,#09030f}
 .hero-panel .hero-copy{min-height:650px;background:linear-gradient(to top,#08040e 2%,#09040de0 27%,#08040d00 78%);padding:28px 25px 38px}
 .hero-panel .hero-copy h1{font-size:clamp(57px,13vw,78px)}
 .hero-head{display:flex!important;padding:13px 18px}
}
@media(prefers-reduced-motion:reduce){.fl5-intro-image img,.fl5-intro-dots i{animation:none!important}}

/* Browser QA fix: keep the Skip control within every viewport height, including desktop. */
.fl5-intro-inner{box-sizing:border-box;min-height:0;max-height:100dvh;grid-template-rows:52px minmax(0,1fr) 126px;overflow:hidden;padding:clamp(16px,3vh,36px) 18px clamp(20px,4vh,42px)}
.fl5-intro-image{height:100%;max-height:100%;min-height:0;align-self:stretch;overflow:hidden}
.fl5-intro-image img{max-height:100%;max-width:100%;height:100%;width:100%;object-fit:contain}
.fl5-intro-bottom{align-self:center;gap:10px}
@media(max-width:600px){
 .fl5-intro-inner{grid-template-rows:48px minmax(0,1fr) 133px;padding:25px 12px max(30px,env(safe-area-inset-bottom))}
 .fl5-intro-image{max-height:100%}
}

/* The decorative still can overlap the grid track on desktop; never intercept Skip. */
.fl5-intro-image,.fl5-intro-image img{pointer-events:none}
.fl5-intro-bottom{position:relative;z-index:4}

/* The supplied lion still should become sharp before the short intro dismisses. */
.fl5-intro-image img{animation-duration:.85s}
