/* LUTAYRA STUDIOS v1.4 — scoped navigation and studio brand refresh */
:root { --violet:#a66bff; --lavender:#c9aaff; --navy:#070b18; }
body { background:radial-gradient(circle at 75% 4%,#24154a 0,transparent 39%),radial-gradient(circle at 12% 28%,#111d39 0,transparent 45%),#070b16; }
/* Reset legacy navigation layout decisively, including the 800px mobile rules. */
.nav.studio-nav { height:auto;min-height:76px;overflow:visible;background:rgba(6,9,20,.97);border-bottom:1px solid #62518b60;z-index:100; }
.nav.studio-nav .shell.nav-inner {display:grid;grid-template-columns:max-content minmax(0,1fr) max-content;align-items:center;gap:clamp(16px,2vw,35px);min-height:76px;height:auto;max-width:1380px;padding-block:10px;}
.nav.studio-nav .brand{min-width:0;font-size:14px;letter-spacing:.1em;gap:10px;line-height:1.15;}
.nav.studio-nav .brand-label span{color:#c19bff;}
.nav.studio-nav .mark{background:linear-gradient(145deg,#7cd6ff,#b66cff);box-shadow:0 3px 20px #9851fd4a;}
.nav.studio-nav .navlinks{min-width:0;display:flex;align-items:center;justify-content:center;gap:clamp(9px,1.25vw,24px);flex-wrap:nowrap;}
.nav.studio-nav .navlinks a{display:inline-flex;align-items:center;justify-content:center;font-size:13px;white-space:nowrap;padding:10px 7px;text-decoration:none;line-height:1.2;color:#c8cbe3;border-bottom:2px solid transparent;}
.nav.studio-nav .navlinks a:hover,.nav.studio-nav .navlinks a[aria-current]{color:white;border-bottom-color:#b57bff;}
.nav.studio-nav .nav-actions{display:flex;flex-wrap:nowrap;gap:12px;align-items:center;justify-content:flex-end;min-width:0;}
.nav.studio-nav .nav-actions a{white-space:nowrap;text-decoration:none;flex-shrink:0;}
.nav.studio-nav .nav-signin,.nav.studio-nav .nav-account-link{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:10px 18px;background:#14152e;border:1px solid #696285;border-radius:12px;color:#f5efff;font-weight:750;font-size:13px;}
.nav.studio-nav .nav-signin:hover,.nav.studio-nav .nav-account-link:hover{border-color:#bb8bff;background:#242042;}
.nav.studio-nav .nav-signup{display:inline-flex;align-items:center;gap:12px;min-height:43px;padding:10px 18px!important;background:linear-gradient(120deg,#a156ff,#7958ff)!important;border-color:#bf86ff!important;color:white!important;box-shadow:0 5px 20px #8038fb52!important;font-size:13px!important;border-radius:12px!important;}
.nav.studio-nav [hidden]{display:none!important;}
.mobile-nav-toggle{display:none;align-items:center;justify-content:center;border-radius:12px;width:45px;height:43px;padding:9px;border:1px solid #635a89;background:#1b1a37;color:#fff;cursor:pointer;}
.mobile-nav-toggle img{width:22px;height:22px;filter:brightness(0) invert(1);}
.mobile-nav-panel[hidden]{display:none!important;}
.mobile-nav-panel{position:absolute;left:14px;right:14px;top:calc(100% + 3px);display:grid;gap:3px;padding:16px;background:#11152a;border:1px solid #66528a;border-radius:18px;box-shadow:0 24px 55px #000d;z-index:110;}
.mobile-nav-panel>a,.mobile-auth-links>a{display:block;padding:11px 15px;text-decoration:none;border-radius:10px;color:#e3daf6;font-weight:700;font-size:14px;}
.mobile-nav-panel a:hover,.mobile-nav-panel>a[aria-current]{background:#30214f;}
.mobile-auth-links{display:flex;gap:10px;border-top:1px solid #64508250;margin-top:8px;padding-top:10px;}
.mobile-auth-links>a{flex:1;text-align:center;background:#282047;}
.mobile-auth-links>a:last-child{background:#744ad2;color:white;}
/* Hero and dimensional mascot display */
.studio-hero{padding:70px 0 48px;background:radial-gradient(ellipse at 87% 44%,#57227e61,transparent 45%);}
.studio-hero .studio-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(340px,.96fr);align-items:center;gap:clamp(25px,4vw,66px);max-width:1360px;}
.studio-hero .hero-content{max-width:660px;position:relative;z-index:2;}
.hero-studio-identity{font-family:'Space Grotesk',sans-serif;font-weight:900;font-size:clamp(29px,4.3vw,62px);line-height:1.05;letter-spacing:-.04em;color:#fff;margin-top:18px;text-shadow:0 5px 30px #a37fff24;}
.hero-studio-identity span{display:block;background:linear-gradient(90deg,#b678fa,#cbabff,#8dcaff);-webkit-background-clip:text;background-clip:text;color:transparent;}
.studio-hero h1{font-size:clamp(34px,3.1vw,48px);letter-spacing:-.045em;line-height:1.12;margin:22px 0 14px;}
.studio-hero h1 em{background:linear-gradient(100deg,#ba83ff,#dbb5ff);background-clip:text;-webkit-background-clip:text;}
.studio-hero .lead{font-size:16px;max-width:570px;line-height:1.72;}
.studio-hero .eyebrow{color:#c9a6ff;}
.mascot-stage{position:relative;height:clamp(360px,32vw,540px);border-radius:27px;overflow:hidden;border:1px solid #7858b573;box-shadow:0 25px 80px #0008,0 0 52px #9c5bff1d;isolation:isolate;background:radial-gradient(circle at center,#342260,#0c0e24);}
.mascot-image{position:absolute;width:100%;height:100%;object-fit:cover;object-position:51% center;filter:saturate(1.14);}
.mascot-stage:after{content:'';inset:0;position:absolute;background:linear-gradient(0deg,#080b21bb,transparent 32%);pointer-events:none;}
.mascot-orbit{position:absolute;z-index:1;top:8%;left:8%;width:82%;height:75%;border:1px solid #c18cff8a;transform:rotate(-23deg);border-radius:50%;box-shadow:0 0 35px #b071ff42;pointer-events:none;animation:mascot-float 8s ease-in-out infinite alternate;}
.mascot-nameplate{position:absolute;bottom:18px;left:22px;right:22px;z-index:3;display:flex;align-items:center;gap:10px;font-size:10px;letter-spacing:.14em;font-weight:800;color:#e3d8ff;}
.nameplate-dot{display:block;width:8px;height:8px;border-radius:50%;background:#aa74ff;box-shadow:0 0 12px #ad70ff;}
@keyframes mascot-float{to{transform:translateY(-10px) rotate(-19deg);}}
.studio-hero .actions{display:flex;align-items:center;gap:15px;flex-wrap:wrap;margin-top:30px;}
.studio-hero .actions .btn{min-height:53px;padding:13px 24px;border-radius:14px;font-weight:800;white-space:nowrap;}
.studio-hero .actions .btn:first-child{color:white;background:linear-gradient(115deg,#a249ff,#663dec);border-color:#c18eff;box-shadow:0 8px 25px #7547f04a;}
.studio-hero .actions .btn.ghost{color:#f2eaff;background:#201a39;border-color:#8760bb;}
.studio-hero .actions .btn:first-child .lt-icon{filter:brightness(0) invert(1);}
.studio-hero + .section{padding-top:44px;}
.section-head h2{letter-spacing:-.045em;}
.game{border-color:#4f3e6c;transition:transform .2s,border-color .2s,box-shadow .2s;}
.game:hover{border-color:#ad79f4;box-shadow:0 20px 45px #0006;}
.gamebody .btn{background:#292042;border:1px solid #9465db;color:#f4eaff;}
.gamebody .btn:hover{background:#38285d;}
.btn:focus-visible,.mobile-nav-toggle:focus-visible{outline:3px solid #b983ff;outline-offset:3px;}
@media(max-width:1140px){.nav.studio-nav .navlinks{gap:6px}.nav.studio-nav .navlinks a{font-size:12px;padding-inline:5px}.nav.studio-nav .nav-inner{gap:12px}.nav.studio-nav .brand{font-size:12px}.nav.studio-nav .nav-actions{gap:7px}.nav.studio-nav .nav-signin,.nav.studio-nav .nav-signup{padding-inline:13px!important}}
@media(max-width:990px){.nav.studio-nav .navlinks{display:none!important}.nav.studio-nav .nav-inner{display:flex;justify-content:space-between;gap:16px}.mobile-nav-toggle{display:inline-flex}.studio-hero .studio-hero-grid{grid-template-columns:minmax(0,1fr) minmax(280px,.8fr)}}
@media(max-width:740px){.studio-hero .studio-hero-grid{grid-template-columns:1fr;gap:27px}.studio-hero{padding:48px 0 26px}.studio-hero .hero-content{max-width:unset}.mascot-stage{height:350px;max-width:650px;width:100%;margin-inline:auto}.hero-studio-identity{font-size:clamp(40px,10vw,65px)}.studio-hero + .section{padding-top:30px}}
@media(max-width:520px){.nav.studio-nav .nav-inner{padding-inline:14px}.nav.studio-nav .brand{font-size:11px}.nav.studio-nav .nav-actions :is(.nav-signin,.nav-account-link){display:none!important}.nav.studio-nav .nav-signup{min-height:40px;padding:8px 11px!important}.nav.studio-nav .nav-actions{gap:7px}.nav.studio-nav .mark{width:35px;height:35px}.studio-hero .actions .btn{width:100%;min-width:0}.mascot-stage{height:290px}}
@media(prefers-reduced-motion:reduce){.mascot-orbit{animation:none}}
