
:root{
  --bg:#020304;--bg2:#050709;--panel:#080b0f;--panel2:#0d1117;
  --line:rgba(255,255,255,.09);--line2:rgba(255,255,255,.14);
  --text:#f5f6f7;--muted:#9da3aa;--red:#e21920;--red2:#8c080d;
  --blue:#1f82ff;--green:#33d46f;--amber:#e5b743;--purple:#a84cff;
  --max:1450px;--radius:8px;--shadow:0 28px 80px rgba(0,0,0,.55)
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,Arial,sans-serif}
body:before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(circle at 12% 0,rgba(22,76,135,.11),transparent 28rem),radial-gradient(circle at 90% 10%,rgba(166,0,0,.10),transparent 30rem)}
a{color:inherit;text-decoration:none}img{max-width:100%;display:block}button,input,textarea,select{font:inherit}.shell{width:min(var(--max),calc(100% - 38px));margin:auto}
.nav{position:sticky;top:0;z-index:80;background:rgba(0,0,0,.95);border-bottom:1px solid rgba(226,25,32,.52);backdrop-filter:blur(16px)}
.nav-inner{height:82px;display:flex;align-items:center;gap:26px}.brand{display:flex;align-items:center}.brand-logo{width:182px;height:72px;object-fit:contain;filter:drop-shadow(0 8px 20px rgba(226,25,32,.12))}
.nav-links{margin-left:auto;display:flex;align-items:center;gap:4px}.nav-links>a,.nav-more-btn{position:relative;border:0;background:none;color:#eceeef;padding:30px 10px 27px;text-transform:uppercase;font-size:.78rem;font-weight:900;letter-spacing:.045em;cursor:pointer}
.nav-links>a:hover,.nav-links>a.active,.nav-more-btn:hover{color:#fff}.nav-links>a.active:after,.nav-links>a:not(.nav-cta):hover:after{content:"";position:absolute;height:2px;background:var(--red);bottom:0;left:10px;right:10px}
.nav-cta{margin-left:10px!important;padding:13px 18px!important;border:1px solid #ed2b31!important;border-radius:5px;background:linear-gradient(180deg,#aa0e13,#6b0609)!important;box-shadow:0 0 25px rgba(226,25,32,.13)}
.nav-cta:after{display:none!important}.nav-more{position:relative}.nav-more-menu{display:none;position:absolute;right:0;top:68px;width:180px;background:#07090c;border:1px solid var(--line2);box-shadow:var(--shadow);padding:7px;border-radius:6px}
.nav-more.open .nav-more-menu{display:block}.nav-more-menu a{display:block;padding:11px 12px;border-radius:4px;color:#cdd1d5;font-size:.82rem}.nav-more-menu a:hover{background:rgba(226,25,32,.08);color:white}
.menu-btn{display:none;background:#080a0d;border:1px solid var(--line2);color:white;width:44px;height:44px;border-radius:5px}

h1,h2,h3{margin-top:0}h1,h2{font-family:Oswald,Inter,sans-serif;text-transform:uppercase}h1{font-size:clamp(3.3rem,6vw,6rem);line-height:.95;letter-spacing:-.02em}h1 span,h2 span{color:var(--red)}h2{font-size:clamp(2rem,3.8vw,3.15rem);line-height:1.02;letter-spacing:.01em}
p{line-height:1.68}.muted{color:var(--muted)}.page-eyebrow,.kicker,.hero-chip{color:var(--red);text-transform:uppercase;font-weight:900;letter-spacing:.15em;font-size:.7rem}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:14px 19px;border-radius:4px;border:1px solid transparent;text-transform:uppercase;font-size:.82rem;font-weight:900;letter-spacing:.045em;transition:.18s}
.btn:hover{transform:translateY(-2px)}.btn-primary{background:linear-gradient(180deg,#bb1016,#78070a);border-color:#f0272e;box-shadow:0 0 24px rgba(226,25,32,.14)}.btn-secondary{background:rgba(4,6,8,.78);border-color:rgba(255,255,255,.35)}.actions{display:flex;gap:12px;flex-wrap:wrap}
.panel{background:linear-gradient(145deg,#090c10,#06080b);border:1px solid var(--line);border-radius:var(--radius)}
.section{padding:64px 0}.section-head{text-align:center;margin-bottom:32px}.section-head h2{margin:6px 0}.centered-sub{margin:7px auto 0}
.page-hero{padding:72px 0 52px;border-bottom:1px solid rgba(226,25,32,.28);background:linear-gradient(90deg,rgba(0,0,0,.94),rgba(0,0,0,.7)),url('../images/police.jpg') center/cover no-repeat}.page-hero h1{margin:10px 0 15px}.page-hero p{max-width:800px;color:#c0c5ca;font-size:1.02rem}

/* Home */
.hero{border-bottom:1px solid var(--line);background:#030405}.hero-grid{display:grid;grid-template-columns:minmax(0,1fr) 370px;min-height:650px}.hero-grid>.reveal:first-child{padding:86px clamp(40px,7vw,112px);display:flex;flex-direction:column;justify-content:center;background:linear-gradient(90deg,rgba(0,0,0,.24),rgba(0,0,0,.76) 67%,rgba(0,0,0,.96)),linear-gradient(0deg,rgba(0,0,0,.78),rgba(0,0,0,.12)),url('../images/police.jpg') center/cover no-repeat}
.hero h1{max-width:790px;margin:11px 0 24px;text-shadow:0 8px 34px #000}.hero h1 span{display:block}.hero .lead{max-width:720px;color:#e2e5e8;font-size:1.06rem;text-shadow:0 2px 16px #000}.hero-mini-links{display:flex;gap:20px;margin-top:28px}.hero-mini-links a{color:#c8ccd1;font-size:.78rem;text-transform:uppercase;font-weight:800}.hero-mini-links a:hover{color:white}
.home-status-card{border-radius:0;border:0;border-left:1px solid rgba(226,25,32,.48);padding:36px 28px;display:flex;flex-direction:column;justify-content:center;background:#050608}
.status-head{display:flex;align-items:center;justify-content:space-between;color:var(--red);font-family:Oswald;font-size:1.3rem;text-transform:uppercase;padding-bottom:17px;border-bottom:1px solid rgba(226,25,32,.35)}
.online-pill{font-family:Inter;font-size:.68rem;color:#d9dcdf;display:flex;align-items:center;gap:7px}.online-pill i{width:8px;height:8px;border-radius:50%;background:#777}.online-pill.online i{background:var(--green);box-shadow:0 0 0 5px rgba(51,212,111,.1)}.online-pill.offline i{background:var(--red)}
.status-row{display:flex;align-items:end;justify-content:space-between;gap:20px;padding:20px 0;border-bottom:1px solid var(--line)}.status-row span{color:#8f969d;font-size:.7rem;text-transform:uppercase;letter-spacing:.09em}.status-row strong{font-size:1.02rem;text-align:right}.status-row .player-big{font-family:Oswald;font-size:2rem}
.status-join{margin-top:24px;width:100%}.home-status-card small{display:block;text-align:center;color:#777e85;margin-top:12px;font-size:.7rem}
.band{border-block:1px solid var(--line);background:#050708}.feature-grid{display:grid;grid-template-columns:repeat(4,1fr)}.feature{padding:23px 28px;display:flex;gap:16px;border-right:1px solid var(--line)}.feature:last-child{border-right:0}.feature strong{display:block;text-transform:uppercase;font-size:.83rem}.feature p{margin:5px 0 0;color:#8e949b;font-size:.78rem}.feature-icon{font-family:Oswald;color:#555d64;font-size:1.3rem}
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.department-image-card{position:relative;min-height:345px;overflow:hidden;border:1px solid var(--line2);border-radius:7px;display:flex;align-items:flex-end}.department-image-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:.4s}.department-image-card:before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(to top,rgba(0,0,0,.98),rgba(0,0,0,.80) 35%,rgba(0,0,0,.08) 80%)}.department-image-card:hover img{transform:scale(1.045)}.dept-card-content{position:relative;z-index:2;width:100%;padding:22px}.card-label{color:#91979e;font-size:.64rem;text-transform:uppercase;font-weight:900;letter-spacing:.1em}.dept-card-content h3{font-family:Oswald;text-transform:uppercase;font-size:1.45rem;margin:5px 0 7px}.dept-card-content p{color:#c0c5ca;font-size:.84rem;margin:0 0 13px}.tag{display:block;border:1px solid var(--line2);border-radius:4px;text-align:center;padding:11px;text-transform:uppercase;font-size:.72rem;font-weight:900}.police-card h3{color:#2b8cff}.fire-card h3{color:#f0383e}.ambulance-card h3{color:#45db79}.civilian-card h3{color:#bd69ff}.police-card .tag{border-color:#267be0}.fire-card .tag{border-color:#d71d24}.ambulance-card .tag{border-color:#33b960}.civilian-card .tag{border-color:#9141c9}
.split-feature{display:grid;grid-template-columns:1.05fr .95fr;border:1px solid var(--line);background:#07090c}.split-image{min-height:490px;background-size:cover;background-position:center}.media-fire{background-image:linear-gradient(90deg,transparent,rgba(7,9,12,.25)),url('../images/fire.jpg')}.split-copy{padding:56px;display:flex;flex-direction:column;justify-content:center}.split-copy p{color:#aeb4ba}.mini-list{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:18px 0 24px}.mini-list span{padding:11px 12px;border-left:2px solid var(--red);background:#0b0e12;color:#d0d4d8;font-size:.8rem}.text-link{color:#ff4a50;text-transform:uppercase;font-size:.78rem;font-weight:900}
.portal-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.portal-card{display:grid;grid-template-columns:54px 1fr auto;gap:18px;align-items:center;padding:24px;border:1px solid var(--line);background:#07090c}.portal-card>span{font-family:Oswald;font-size:1.5rem;color:#555c64}.portal-card h3{margin:0 0 4px;text-transform:uppercase}.portal-card p{margin:0;color:#8f969d;font-size:.83rem}.portal-card>b{color:var(--red);font-size:1.3rem}.portal-card:hover{border-color:rgba(226,25,32,.45)}
.cta{display:flex;align-items:center;justify-content:space-between;gap:28px;padding:36px;border:1px solid rgba(226,25,32,.30);background:linear-gradient(90deg,#0b0e12,#050607);border-radius:7px}.cta h2{margin:4px 0 6px}.cta p{color:#9fa5ab;margin:0}

/* Capital-style inner layout */
.capital-layout{display:grid;grid-template-columns:250px minmax(0,1fr);gap:28px;align-items:start}.section-sidebar{position:sticky;top:104px;padding:15px;background:#06080a}.sidebar-title{color:#858c93;font-size:.68rem;font-weight:900;text-transform:uppercase;letter-spacing:.12em;padding:8px 10px 12px;border-bottom:1px solid var(--line);margin-bottom:8px}.section-sidebar a{display:block;padding:11px 10px;border-left:2px solid transparent;color:#b8bec4;font-size:.84rem}.section-sidebar a:hover,.section-sidebar a.active{background:rgba(226,25,32,.075);border-left-color:var(--red);color:white}.sidebar-divider{height:1px;background:var(--line);margin:9px 0}
.capital-content{min-width:0}.content-section{padding:10px 0 40px;scroll-margin-top:120px}.content-section+.content-section{border-top:1px solid var(--line)}.content-title{display:grid;grid-template-columns:72px 1fr;gap:18px;align-items:start;padding:24px 0 18px}.content-title>span{font-family:Oswald;font-size:3.15rem;color:rgba(226,25,32,.18);line-height:1}.content-title h2{margin:4px 0}
.department-wide-grid{display:grid;gap:13px}.wide-dept{display:grid;grid-template-columns:320px 1fr;min-height:210px;border:1px solid var(--line);background:#07090c;overflow:hidden}.wide-dept img{width:100%;height:100%;object-fit:cover}.wide-dept>div{padding:27px;display:flex;flex-direction:column;justify-content:center}.wide-dept small{color:#8e959c;text-transform:uppercase;font-weight:900;letter-spacing:.1em}.wide-dept h3{font-family:Oswald;text-transform:uppercase;font-size:1.7rem;margin:6px 0}.wide-dept p{color:#9fa6ac;margin:0 0 12px}.wide-dept b{color:#ff474d;font-size:.76rem;text-transform:uppercase}.wide-dept:hover{border-color:rgba(226,25,32,.38)}
.info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.info-box{padding:23px}.info-box h3{text-transform:uppercase;font-size:.95rem}.info-box p{color:#939aa1;font-size:.84rem}.info-box a{color:#ff4b51;font-size:.75rem;text-transform:uppercase;font-weight:900}
.feature-copy{padding:30px}.feature-copy p,.feature-copy li{color:#a2a9b0}.check-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:11px}.check-list li{padding:12px 14px;background:#0b0f13;border-left:2px solid var(--red)}
.unit-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:11px}.unit-card{padding:20px}.unit-card span{font-family:Oswald;color:#5e656c}.unit-card h3{font-family:Oswald;text-transform:uppercase;margin:13px 0 0;font-size:1.2rem}
.department-capital-hero{min-height:570px!important;position:relative;background-size:cover!important;background-position:center!important}.department-capital-hero:before{display:none!important}.department-overlay{position:absolute;inset:0;display:flex;align-items:flex-end;background:linear-gradient(90deg,rgba(0,0,0,.94),rgba(0,0,0,.65) 54%,rgba(0,0,0,.16)),linear-gradient(to top,rgba(0,0,0,.78),transparent 55%)}.department-overlay .shell{padding-bottom:62px}.department-overlay h1{margin:9px 0 16px;max-width:800px}.department-overlay p{max-width:760px;color:#d5d8db;font-size:1.04rem}.police-photo{background-image:url('../images/police.jpg')!important}.fire-photo{background-image:url('../images/fire.jpg')!important}.ambulance-photo{background-image:url('../images/ambulance.jpg')!important}.civilian-photo{background-image:url('../images/civilian.jpg')!important}

/* Staff */
.people-feature-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.staff-feature{padding:25px;display:grid;grid-template-columns:74px 1fr;gap:19px;align-items:center;border-top:2px solid rgba(226,25,32,.55)}.staff-monogram{width:66px;height:66px;display:grid;place-items:center;background:linear-gradient(145deg,#a30d12,#4b0507);font-family:Oswald;font-size:1.35rem}.staff-feature small{color:#ff4b51;text-transform:uppercase;font-weight:900;letter-spacing:.1em;font-size:.63rem}.staff-feature h3{font-family:Oswald;text-transform:uppercase;margin:5px 0}.staff-feature p{color:#9299a0;margin:0;font-size:.84rem}

/* Rules */
.rulebook-hero{background:linear-gradient(90deg,rgba(0,0,0,.96),rgba(0,0,0,.72)),url('../images/police.jpg') center/cover no-repeat}.rulebook-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));max-width:780px;margin-top:26px;border:1px solid var(--line);background:rgba(0,0,0,.48)}.rulebook-stats>div{padding:18px 20px;border-right:1px solid var(--line)}.rulebook-stats>div:last-child{border-right:0}.rulebook-stats strong{display:block;text-transform:uppercase}.rulebook-stats span{color:#8d949b;text-transform:uppercase;font-size:.66rem;letter-spacing:.08em}
.rulebook-layout{display:grid;grid-template-columns:250px minmax(0,1fr);gap:28px;align-items:start}.rulebook-sidebar{position:sticky;top:104px;padding:15px}.rulebook-sidebar a{display:flex;gap:9px;padding:11px 10px;color:#b9bec4;border-left:2px solid transparent;font-size:.84rem}.rulebook-sidebar a span{width:22px;color:#656c73}.rulebook-sidebar a:hover,.rulebook-sidebar a.active{border-left-color:var(--red);background:rgba(226,25,32,.07);color:white}.rulebook-sidebar a.active span{color:var(--red)}
.rules-toolbar{position:sticky;top:82px;z-index:10;background:#020304;padding:10px 0 13px}.search{width:100%;height:48px;background:#06080a;border:1px solid var(--line2);color:white;padding:0 14px;border-radius:4px;outline:none}.rule-section{scroll-margin-top:145px;padding:12px 0 36px}.rule-section+.rule-section{border-top:1px solid var(--line)}.rule-section-head{display:grid;grid-template-columns:70px 1fr;gap:18px;padding:24px 0 17px}.section-number{font-family:Oswald;font-size:3.15rem;color:rgba(226,25,32,.18);line-height:1}.rule-section-head p{color:#8f969d;margin:0}.rulebook-rule{margin:11px 0;padding:21px 23px;border-left:3px solid rgba(226,25,32,.48)}.rulebook-rule h3{margin:7px 0 8px}.rulebook-rule p{margin:0;color:#a3aab1}.rule-meta{display:flex;gap:9px;align-items:center}.rule-id{font-family:Oswald;font-size:.8rem;letter-spacing:.08em}.rule-badge{padding:4px 7px;border:1px solid;border-radius:3px;text-transform:uppercase;font-size:.6rem;font-weight:900;letter-spacing:.07em}.rule-badge.red{color:#ff595f;border-color:#d92930;background:rgba(217,41,48,.08)}.rule-badge.blue{color:#54a1ff;border-color:#267de4;background:rgba(38,125,228,.08)}.rule-badge.amber{color:#e7be58;border-color:#b98d28;background:rgba(185,141,40,.08)}
.rulebook-footer-card{padding:30px;display:flex;justify-content:space-between;align-items:center;gap:20px}

/* News / Events */
.feed-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:18px}.feed-main{display:grid;gap:12px}.feed-card{padding:26px;border-left:2px solid rgba(226,25,32,.55)}.feed-card time{color:#ff4b51;text-transform:uppercase;font-size:.67rem;font-weight:900;letter-spacing:.09em}.feed-card h3{font-family:Oswald;text-transform:uppercase;font-size:1.45rem;margin:7px 0}.feed-card p{color:#969da4}.feed-side{padding:24px;position:sticky;top:104px}.feed-side h3{font-family:Oswald;text-transform:uppercase}.feed-side a{display:block;padding:11px 0;border-bottom:1px solid var(--line);color:#b7bdc3;font-size:.82rem}

/* Gallery */
.gallery-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:12px}.gallery-tile{position:relative;min-height:270px;overflow:hidden;border:1px solid var(--line);cursor:pointer}.gallery-tile:nth-child(1),.gallery-tile:nth-child(4){grid-column:span 7}.gallery-tile:nth-child(2),.gallery-tile:nth-child(3){grid-column:span 5}.gallery-tile img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;transition:.4s}.gallery-tile:after{content:attr(data-label);position:absolute;left:18px;bottom:17px;z-index:2;font-family:Oswald;text-transform:uppercase;font-size:1.15rem;text-shadow:0 3px 15px #000}.gallery-tile:before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(to top,rgba(0,0,0,.8),transparent 55%)}.gallery-tile:hover img{transform:scale(1.04)}
.modal{display:none;position:fixed;inset:0;z-index:120;background:rgba(0,0,0,.9);align-items:center;justify-content:center;padding:30px}.modal.open{display:flex}.modal-content{width:min(1100px,94vw);height:min(720px,82vh);background:#080a0d center/contain no-repeat;border:1px solid var(--line2);position:relative}.close-modal{position:absolute;right:14px;top:14px;width:42px;height:42px;border:1px solid var(--line2);background:#050608;color:white;cursor:pointer}

/* Join timeline */
.join-timeline{display:grid;gap:12px}.timeline-step{display:grid;grid-template-columns:70px 1fr;gap:20px;padding:24px;border:1px solid var(--line);background:#07090c}.timeline-step>span{font-family:Oswald;font-size:2.6rem;color:rgba(226,25,32,.22)}.timeline-step h3{font-family:Oswald;text-transform:uppercase;margin:0 0 5px}.timeline-step p{color:#969da4;margin:0}

/* Forms */
.application-grid{display:grid;grid-template-columns:230px minmax(0,1fr);gap:24px;align-items:start}.form-tabs{position:sticky;top:104px;padding:12px}.form-tab{width:100%;text-align:left;background:none;color:#b9bec4;border:0;border-left:2px solid transparent;padding:12px;cursor:pointer}.form-tab.active{background:rgba(226,25,32,.08);border-left-color:var(--red);color:white}.application-form{display:none;padding:30px}.application-form.active{display:block}.form-intro{padding-bottom:20px;border-bottom:1px solid var(--line);margin-bottom:20px}.form-intro p{color:#949ba2}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.field{display:grid;gap:7px}.field.full{grid-column:1/-1}.field label{font-size:.72rem;text-transform:uppercase;font-weight:900;letter-spacing:.07em;color:#b7bdc3}.field input,.field textarea,.field select{background:#05070a;border:1px solid var(--line2);color:white;border-radius:4px;padding:12px 13px;outline:none}.field textarea{min-height:130px;resize:vertical}.form-actions{display:flex;gap:12px;align-items:center;margin-top:20px}.form-message{font-size:.82rem;color:#949ba2}.form-message.success{color:#56dc82}.form-message.error{color:#ff6268}

/* footer */
footer{margin-top:70px;border-top:1px solid rgba(226,25,32,.25);background:#010202}.footer-main{display:grid;grid-template-columns:1fr 1.3fr;gap:70px;padding:48px 0}.footer-brand img{width:210px}.footer-brand p{color:#7f868d}.footer-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}.footer-cols strong{display:block;text-transform:uppercase;font-size:.76rem;margin-bottom:11px}.footer-cols a{display:block;color:#8f969d;font-size:.8rem;padding:5px 0}.footer-cols a:hover{color:white}.footer-bottom{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding:18px 0 26px;color:#686f76;font-size:.72rem}

/* transitions */
.reveal{opacity:0;transform:translateY(16px);transition:.6s ease}.reveal.show{opacity:1;transform:none}

@media(max-width:1100px){
  .nav-links>a,.nav-more-btn{padding-left:7px;padding-right:7px;font-size:.7rem}.brand-logo{width:150px}
  .hero-grid{grid-template-columns:1fr}.home-status-card{border-left:0;border-top:1px solid rgba(226,25,32,.45)}
  .cards{grid-template-columns:repeat(2,1fr)}.feature-grid{grid-template-columns:repeat(2,1fr)}.feature:nth-child(2){border-right:0}
  .capital-layout,.rulebook-layout,.application-grid{grid-template-columns:1fr}.section-sidebar,.rulebook-sidebar,.form-tabs{position:static}
  .section-sidebar{display:flex;overflow:auto;white-space:nowrap}.section-sidebar .sidebar-title,.section-sidebar .sidebar-divider{display:none}.section-sidebar a{flex:0 0 auto}
}
@media(max-width:800px){
  .menu-btn{display:grid;place-items:center;margin-left:auto}.nav-inner{height:72px}.brand-logo{width:145px;height:60px}.nav-links{display:none;position:absolute;top:71px;left:12px;right:12px;padding:10px;background:#06080a;border:1px solid var(--line2);flex-direction:column;align-items:stretch;box-shadow:var(--shadow)}.nav-links.open{display:flex}.nav-links>a,.nav-more-btn{padding:12px 13px;text-align:left}.nav-cta{margin:4px 0!important}.nav-more-menu{position:static;width:auto;margin:0 8px 8px}
  .hero-grid>.reveal:first-child{padding:66px 24px;min-height:570px}.hero-mini-links{flex-wrap:wrap}.feature-grid,.cards,.info-grid,.unit-grid,.people-feature-grid,.portal-grid,.story-grid,.form-grid{grid-template-columns:1fr}.split-feature{grid-template-columns:1fr}.split-image{min-height:320px}.split-copy{padding:34px 24px}.mini-list,.check-list{grid-template-columns:1fr}.wide-dept{grid-template-columns:1fr}.wide-dept img{height:240px}.content-title{grid-template-columns:55px 1fr}.content-title>span{font-size:2.6rem}.feed-grid{grid-template-columns:1fr}.feed-side{position:static}.gallery-grid{grid-template-columns:1fr}.gallery-tile,.gallery-tile:nth-child(n){grid-column:auto}.footer-main{grid-template-columns:1fr}.footer-cols{grid-template-columns:1fr 1fr}.footer-bottom{flex-direction:column;gap:7px}.rulebook-stats{grid-template-columns:1fr}.rulebook-stats>div{border-right:0;border-bottom:1px solid var(--line)}
}


/* Discord-authenticated applications */
.discord-auth-gate{
  margin-bottom:22px;
  padding:30px;
  border-color:rgba(88,101,242,.38);
  background:
    radial-gradient(circle at 95% 0,rgba(88,101,242,.13),transparent 24rem),
    linear-gradient(145deg,#090c10,#06080b);
}
.discord-auth-gate h2{margin:6px 0 8px}
.discord-auth-gate p{color:#9ca3aa;max-width:760px}
.auth-state{display:flex;align-items:center;justify-content:space-between;gap:25px}
.discord-user-card{display:flex;align-items:center;gap:18px}
.discord-user-card img{
  width:68px;height:68px;border-radius:50%;object-fit:cover;
  border:2px solid rgba(88,101,242,.72);
  background:#11151b;
}
.discord-user-card h2{font-size:1.65rem;text-transform:none}
@media(max-width:760px){
  .auth-state{flex-direction:column;align-items:flex-start}
  .discord-auth-gate{padding:22px}
}


/* Full Discord login/application flow */
.auth-page-shell{max-width:900px}
.auth-page-card{
  padding:42px;
  text-align:left;
  border-color:rgba(88,101,242,.38);
  background:
    radial-gradient(circle at 90% 0,rgba(88,101,242,.14),transparent 26rem),
    linear-gradient(145deg,#090c10,#06080b);
}
.auth-page-icon{
  width:58px;height:58px;display:grid;place-items:center;
  border-radius:14px;background:#5865f2;color:white;
  font-family:Oswald,Inter,sans-serif;font-size:1.55rem;font-weight:900;
  margin-bottom:24px
}
.auth-page-card>p{color:#a0a7ae;max-width:720px}
.auth-permissions{display:grid;gap:9px;margin:25px 0 28px}
.auth-permissions>div{
  padding:15px 17px;background:#070a0e;border:1px solid var(--line);
  display:grid;grid-template-columns:170px 1fr;gap:15px
}
.auth-permissions strong{text-transform:uppercase;font-size:.75rem}
.auth-permissions span{color:#8f969d;font-size:.82rem}
.auth-result-wrap{margin-top:20px}
.auth-result-banner{
  display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center;
  padding:15px 18px;border-color:rgba(88,101,242,.38)
}
.auth-result-banner strong{color:#fff}
.auth-result-banner span{color:#9ba2a9;font-size:.84rem}
.auth-result-banner button{
  background:none;border:0;color:#bbb;font-size:1.4rem;cursor:pointer
}
.nav-account-link{
  color:#b9c0ff!important;
  border-color:rgba(88,101,242,.25)!important
}
[hidden]{display:none!important}
@media(max-width:650px){
  .auth-page-card{padding:26px 20px}
  .auth-permissions>div{grid-template-columns:1fr}
  .auth-result-banner{grid-template-columns:1fr auto}
  .auth-result-banner span{grid-column:1/-1}
}


/* Homepage hero carousel */
.hero-grid>.reveal:first-child{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  background:#030405!important;
}
.hero-grid>.reveal:first-child > *:not(.hero-carousel):not(.hero-carousel-shade){
  position:relative;
  z-index:3;
}
.hero-carousel{
  position:absolute!important;
  inset:0;
  z-index:0!important;
  overflow:hidden;
  pointer-events:none;
}
.hero-carousel-slide{
  position:absolute;
  inset:0;
  opacity:0;
  transform:scale(1.025);
  background-position:center center;
  background-size:cover;
  background-repeat:no-repeat;
  transition:opacity 1s ease,transform 6.5s ease;
}
.hero-carousel-slide.active{
  opacity:1;
  transform:scale(1.06);
}
.hero-carousel-shade{
  position:absolute!important;
  inset:0;
  z-index:1!important;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(0,0,0,.34) 0%,rgba(0,0,0,.58) 54%,rgba(0,0,0,.92) 100%),
    linear-gradient(0deg,rgba(0,0,0,.76) 0%,rgba(0,0,0,.08) 62%,rgba(0,0,0,.20) 100%);
}
.hero-carousel-controls{
  display:flex;
  align-items:center;
  gap:12px;
  margin-top:24px;
}
.hero-carousel-arrow{
  width:38px;height:38px;
  display:grid;place-items:center;
  border-radius:4px;
  border:1px solid rgba(255,255,255,.25);
  background:rgba(0,0,0,.52);
  color:#fff;
  font-size:1.5rem;
  cursor:pointer;
  transition:.18s ease;
}
.hero-carousel-arrow:hover{
  border-color:rgba(226,25,32,.8);
  background:rgba(120,7,10,.76);
}
.hero-carousel-dots{
  display:flex;
  align-items:center;
  gap:7px;
}
.hero-carousel-dots button{
  width:28px;height:4px;padding:0;
  border:0;border-radius:999px;
  background:rgba(255,255,255,.32);
  cursor:pointer;
  transition:.22s ease;
}
.hero-carousel-dots button.active{
  width:42px;
  background:var(--red);
}
@media(max-width:800px){
  .hero-carousel-slide{background-position:center}
}


/* Expanded gallery categories */
.gallery-page-section{padding-top:42px}
.gallery-category{
  padding:8px 0 42px;
  margin-bottom:38px;
  border-bottom:1px solid var(--line);
  scroll-margin-top:110px;
}
.gallery-category:last-child{border-bottom:0;margin-bottom:0}
.gallery-category-head{
  display:flex;
  align-items:flex-start;
  gap:22px;
  margin-bottom:20px;
}
.gallery-category-number{
  font-family:Oswald,sans-serif;
  font-size:2.5rem;
  line-height:1;
  font-weight:700;
  color:rgba(226,25,32,.45);
}
.gallery-category-head h2{
  margin:0 0 5px;
  font-family:Oswald,sans-serif;
  font-size:2rem;
  line-height:1;
  text-transform:uppercase;
}
.gallery-category-head p{
  margin:0;
  color:#969da4;
}
.gallery-section-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}
.gallery-section-grid .gallery-tile{
  grid-column:auto!important;
  min-height:0;
  aspect-ratio:16/10;
  border-color:rgba(255,255,255,.10);
}
.gallery-section-grid .gallery-tile:nth-child(5n+1){
  grid-column:span 2!important;
  aspect-ratio:16/8;
}
.gallery-section-grid .gallery-tile:nth-child(5n+4){
  grid-column:span 2!important;
  aspect-ratio:16/8;
}
@media(max-width:900px){
  .gallery-section-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .gallery-section-grid .gallery-tile,
  .gallery-section-grid .gallery-tile:nth-child(5n+1),
  .gallery-section-grid .gallery-tile:nth-child(5n+4){
    grid-column:auto!important;
    aspect-ratio:16/10;
  }
}
@media(max-width:600px){
  .gallery-section-grid{grid-template-columns:1fr}
  .gallery-category-head{gap:14px}
  .gallery-category-number{font-size:2rem}
  .gallery-category-head h2{font-size:1.65rem}
}


/* Album-style Gallery v36 */
.gallery-album-grid-home{
  display:grid;
  grid-template-columns:repeat(12,1fr);
  gap:12px;
}
.gallery-album-grid-home .gallery-album-tile{
  appearance:none;
  padding:0;
  text-align:left;
  color:inherit;
  background:#07090c;
  border:1px solid var(--line);
}
.gallery-album-grid-home .gallery-album-tile:nth-child(1),
.gallery-album-grid-home .gallery-album-tile:nth-child(4){grid-column:span 7!important}
.gallery-album-grid-home .gallery-album-tile:nth-child(2),
.gallery-album-grid-home .gallery-album-tile:nth-child(3){grid-column:span 5!important}
.gallery-album-count{
  position:absolute;
  right:17px;
  bottom:18px;
  z-index:3;
  padding:6px 9px;
  background:rgba(0,0,0,.65);
  border:1px solid rgba(255,255,255,.18);
  font-size:.68rem;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.gallery-album-modal{
  display:none;
  position:fixed;
  inset:0;
  z-index:150;
  background:rgba(0,0,0,.94);
  backdrop-filter:blur(10px);
}
.gallery-album-modal.open{display:block}
.gallery-album-dialog{
  width:min(1280px,calc(100% - 32px));
  height:calc(100vh - 32px);
  margin:16px auto;
  background:#05070a;
  border:1px solid var(--line2);
  display:flex;
  flex-direction:column;
}
.gallery-album-topbar{
  flex:0 0 auto;
  min-height:66px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:15px;
  padding:12px 16px;
  border-bottom:1px solid var(--line);
  background:#080a0d;
}
.gallery-album-back,
.gallery-album-close{
  border:1px solid var(--line2);
  background:#050608;
  color:#fff;
  cursor:pointer;
  padding:10px 13px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.05em;
}
.gallery-album-close{
  width:42px;height:42px;padding:0;
}
.gallery-album-back:hover,
.gallery-album-close:hover{border-color:var(--red);background:rgba(226,25,32,.08)}
.gallery-album-scroll{
  flex:1;
  overflow:auto;
  padding:28px;
}
.gallery-album-heading{
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:20px;
  margin-bottom:20px;
}
.gallery-album-kicker{
  color:var(--red);
  text-transform:uppercase;
  letter-spacing:.14em;
  font-size:.7rem;
  font-weight:900;
}
.gallery-album-heading h2{
  font-family:Oswald,sans-serif;
  font-size:2.4rem;
  text-transform:uppercase;
  margin:5px 0 0;
}
.gallery-album-total{
  color:#9ca3aa;
  text-transform:uppercase;
  font-size:.72rem;
  font-weight:900;
  letter-spacing:.09em;
}
.gallery-album-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}
.gallery-album-image{
  position:relative;
  aspect-ratio:16/10;
  overflow:hidden;
  padding:0;
  border:1px solid var(--line);
  background:#090b0e;
  cursor:pointer;
}
.gallery-album-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform .35s ease,opacity .35s ease;
}
.gallery-album-image:hover img{transform:scale(1.035);opacity:.88}
.gallery-lightbox{
  display:none;
  position:fixed;
  inset:0;
  z-index:180;
  background:rgba(0,0,0,.96);
  align-items:center;
  justify-content:center;
  padding:72px;
}
.gallery-lightbox.open{display:flex}
.gallery-lightbox img{
  max-width:min(1500px,90vw);
  max-height:86vh;
  object-fit:contain;
}
.gallery-lightbox-close{
  position:absolute;
  top:20px;
  right:22px;
  width:44px;height:44px;
  border:1px solid var(--line2);
  background:#050608;
  color:#fff;
  cursor:pointer;
  font-size:1rem;
}
.gallery-lightbox-arrow{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:52px;height:70px;
  border:1px solid var(--line2);
  background:rgba(5,6,8,.8);
  color:#fff;
  cursor:pointer;
  font-size:2rem;
}
.gallery-lightbox-arrow.prev{left:18px}
.gallery-lightbox-arrow.next{right:18px}
.gallery-lightbox-arrow:hover,.gallery-lightbox-close:hover{border-color:var(--red)}
body.gallery-modal-open{overflow:hidden}
@media(max-width:900px){
  .gallery-album-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:700px){
  .gallery-album-grid-home{grid-template-columns:1fr}
  .gallery-album-grid-home .gallery-album-tile{grid-column:1!important}
  .gallery-album-dialog{width:100%;height:100vh;margin:0;border:0}
  .gallery-album-scroll{padding:18px}
  .gallery-album-grid{grid-template-columns:1fr}
  .gallery-lightbox{padding:58px 12px}
  .gallery-lightbox-arrow{width:42px;height:58px}
  .gallery-lightbox-arrow.prev{left:6px}
  .gallery-lightbox-arrow.next{right:6px}
}


/* v37 homepage announcement */
.home-announcement{
  border-bottom:1px solid rgba(226,25,32,.18);
  background:linear-gradient(90deg,rgba(226,25,32,.12),rgba(7,9,12,.96) 45%,rgba(7,9,12,.98));
}
.home-announcement-inner{
  min-height:62px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding-top:10px;
  padding-bottom:10px;
}
.home-announcement-copy{
  display:flex;
  align-items:center;
  gap:14px;
  min-width:0;
}
.home-announcement-label{
  flex:0 0 auto;
  color:#fff;
  background:var(--red);
  padding:5px 8px;
  font-size:.63rem;
  font-weight:900;
  letter-spacing:.09em;
  text-transform:uppercase;
}
.home-announcement-copy strong{font-size:.86rem}
.home-announcement-copy>span:last-child{
  color:#9ca3aa;
  font-size:.78rem;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.home-announcement-btn{flex:0 0 auto;padding:9px 13px}

/* v37 live community panel */
.live-community-section{padding:34px 0 10px}
.live-community-grid{
  display:grid;
  grid-template-columns:minmax(0,1.45fr) minmax(320px,.75fr);
  gap:14px;
}
.live-status-card,.discord-stats-card{
  border:1px solid var(--line);
  background:linear-gradient(145deg,#080b0f,#05070a);
  padding:26px;
}
.live-card-top{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:20px;
  margin-bottom:24px;
}
.live-card-top h2{
  margin:5px 0 0;
  font-family:Oswald,sans-serif;
  text-transform:uppercase;
  font-size:1.85rem;
}
.live-pill{
  border:1px solid var(--line2);
  padding:7px 10px;
  font-size:.68rem;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.live-pill.online{border-color:rgba(46,204,113,.45);color:#6ee7a0;background:rgba(46,204,113,.08)}
.live-pill.offline{border-color:rgba(226,25,32,.45);color:#ff686d;background:rgba(226,25,32,.08)}
.live-pill.checking{color:#9ca3aa}
.live-metrics,.discord-metrics{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
.live-metric,.discord-metric{
  border:1px solid var(--line);
  background:#05070a;
  padding:16px;
}
.live-metric span,.discord-metric span{
  display:block;
  color:#858d95;
  text-transform:uppercase;
  font-size:.65rem;
  font-weight:900;
  letter-spacing:.08em;
  margin-bottom:6px;
}
.live-metric strong,.discord-metric strong{
  font-family:Oswald,sans-serif;
  font-size:1.7rem;
}
.live-metric:nth-child(2) strong{font-size:1.05rem}
.capacity-wrap{margin:20px 0}
.capacity-label{
  display:flex;
  justify-content:space-between;
  color:#9ca3aa;
  text-transform:uppercase;
  font-size:.65rem;
  font-weight:900;
  letter-spacing:.08em;
  margin-bottom:8px;
}
.capacity-track{
  height:8px;
  overflow:hidden;
  background:#15191e;
  border:1px solid rgba(255,255,255,.06);
}
.capacity-track span{
  display:block;
  width:0;
  height:100%;
  background:var(--red);
  transition:width .6s ease;
}
.live-actions{display:flex;gap:10px;flex-wrap:wrap}
.discord-mark{
  color:#b9c0ff;
  border:1px solid rgba(88,101,242,.35);
  background:rgba(88,101,242,.08);
  padding:7px 9px;
  font-size:.64rem;
  font-weight:900;
  letter-spacing:.08em;
}
.discord-stats-card p{color:#969da4;font-size:.83rem;margin:18px 0}

/* application status */
.application-status-overview{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:17px 20px;
  margin-bottom:18px;
  border:1px solid var(--line);
  background:#07090c;
}
.app-status-overview-title strong{
  display:block;
  margin-top:3px;
  font-family:Oswald,sans-serif;
  text-transform:uppercase;
}
.app-status-overview-grid{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:7px;
}
.app-status-overview-grid>span{
  border:1px solid var(--line);
  padding:7px 9px;
  color:#a4abb2;
  font-size:.68rem;
  font-weight:800;
  text-transform:uppercase;
}
.app-status-overview-grid b{margin-left:5px}
.app-status-overview-grid .open b,.app-status-badge.open{color:#6ee7a0}
.app-status-overview-grid .closed b,.app-status-badge.closed{color:#ff686d}
.app-status-badge{
  float:right;
  margin-left:8px;
  font-size:.58rem;
  font-weight:900;
  letter-spacing:.08em;
}
.form-tab.app-closed{opacity:.56}
.form-tab.app-closed::after{content:""}
.application-form.app-closed{
  position:relative;
}
.application-form.app-closed::before{
  content:"Applications are currently closed.";
  display:block;
  padding:14px 16px;
  margin-bottom:16px;
  border:1px solid rgba(226,25,32,.28);
  background:rgba(226,25,32,.07);
  color:#ff8589;
  font-weight:800;
}
.application-form.app-closed button[type="submit"]{
  opacity:.45;
  pointer-events:none;
}

@media(max-width:900px){
  .live-community-grid{grid-template-columns:1fr}
  .application-status-overview{align-items:flex-start;flex-direction:column}
  .app-status-overview-grid{justify-content:flex-start}
}
@media(max-width:700px){
  .home-announcement-inner{align-items:flex-start;flex-direction:column;gap:9px;padding-top:12px;padding-bottom:12px}
  .home-announcement-copy{align-items:flex-start;flex-wrap:wrap}
  .home-announcement-copy>span:last-child{white-space:normal;width:100%}
  .home-announcement-btn{width:100%;text-align:center}
  .live-metrics,.discord-metrics{grid-template-columns:1fr}
}


/* v38 homepage status cleanup */
.hero-grid.hero-grid-single{
  grid-template-columns:1fr!important;
}
.hero-grid.hero-grid-single>.reveal:first-child{
  min-height:520px;
  border-right:1px solid var(--line);
}
.live-community-section{
  padding-top:26px;
}
.live-community-grid-balanced{
  grid-template-columns:minmax(0,1.55fr) minmax(330px,.7fr);
  align-items:stretch;
}
.live-status-card-expanded,
.discord-stats-card-expanded{
  height:100%;
  display:flex;
  flex-direction:column;
}
.live-card-intro{
  margin:7px 0 0;
  color:#8f979f;
  font-size:.78rem;
}
.live-status-primary{
  display:grid;
  grid-template-columns:minmax(180px,.45fr) minmax(0,1fr);
  align-items:center;
  gap:18px;
  padding:18px;
  border:1px solid var(--line);
  background:#05070a;
}
.live-player-block>span,
.live-capacity-block .capacity-label>span{
  display:block;
  color:#858d95;
  text-transform:uppercase;
  font-size:.64rem;
  font-weight:900;
  letter-spacing:.09em;
}
.live-player-block strong{
  display:block;
  margin-top:5px;
  font-family:Oswald,sans-serif;
  font-size:3rem;
  line-height:1;
}
.live-player-block strong small{
  font-size:1.35rem;
  color:#7d858d;
}
.live-capacity-block .capacity-label{
  margin:0 0 10px;
}
.live-capacity-block .capacity-label strong{
  color:#fff;
}
.live-server-details{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px;
  margin-top:10px;
}
.live-server-details>div{
  min-height:82px;
  padding:14px;
  border:1px solid var(--line);
  background:#06080b;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.live-server-details span{
  color:#7f8790;
  text-transform:uppercase;
  font-size:.61rem;
  font-weight:900;
  letter-spacing:.08em;
  margin-bottom:6px;
}
.live-server-details strong{
  font-size:.82rem;
}
.live-highlight-row{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  margin:14px 0 18px;
  border:1px solid var(--line);
}
.live-highlight-row>div{
  padding:13px 15px;
  border-right:1px solid var(--line);
}
.live-highlight-row>div:last-child{
  border-right:0;
}
.live-highlight-row b{
  display:block;
  font-size:.72rem;
  margin-bottom:3px;
}
.live-highlight-row span{
  display:block;
  color:#858d95;
  font-size:.67rem;
}
.live-actions{
  margin-top:auto;
}
.discord-stats-card-expanded .discord-metrics{
  margin-bottom:14px;
}
.discord-stats-card-expanded .discord-metric{
  min-height:102px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.discord-stats-card-expanded .discord-metric strong{
  font-size:2.35rem;
}
.discord-community-list{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin:0 0 18px;
}
.discord-community-list span{
  padding:10px;
  border:1px solid var(--line);
  background:#06080b;
  color:#9ca3aa;
  font-size:.69rem;
}
.discord-wide-btn{
  width:100%;
  text-align:center;
  margin-top:auto;
}
@media(max-width:1000px){
  .live-community-grid-balanced{
    grid-template-columns:1fr;
  }
  .live-server-details{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media(max-width:700px){
  .hero-grid.hero-grid-single>.reveal:first-child{
    min-height:560px;
  }
  .live-status-primary{
    grid-template-columns:1fr;
  }
  .live-server-details,
  .live-highlight-row,
  .discord-community-list{
    grid-template-columns:1fr;
  }
  .live-highlight-row>div{
    border-right:0;
    border-bottom:1px solid var(--line);
  }
  .live-highlight-row>div:last-child{
    border-bottom:0;
  }
}


/* v39 — full-width homepage hero carousel */
.hero > .shell.hero-grid.hero-grid-single{
  width:100%;
  max-width:none;
  padding-left:0;
  padding-right:0;
  margin-left:0;
  margin-right:0;
}

.hero-grid.hero-grid-single > .reveal:first-child{
  width:100%;
  max-width:none;
  border-left:0;
  border-right:0;
}

.hero-grid.hero-grid-single .hero-carousel,
.hero-grid.hero-grid-single .hero-carousel-shade{
  left:0;
  right:0;
  width:100%;
}

/* Keep the hero text comfortably aligned instead of touching the screen edge */
.hero-grid.hero-grid-single > .reveal:first-child > :not(.hero-carousel):not(.hero-carousel-shade){
  position:relative;
  z-index:2;
}

.hero-grid.hero-grid-single .hero-chip,
.hero-grid.hero-grid-single h1,
.hero-grid.hero-grid-single .lead,
.hero-grid.hero-grid-single .actions,
.hero-grid.hero-grid-single .hero-mini-links,
.hero-grid.hero-grid-single .hero-carousel-controls{
  margin-left:max(24px, calc((100vw - 1160px) / 2));
}

.hero-grid.hero-grid-single h1,
.hero-grid.hero-grid-single .lead{
  max-width:720px;
}

@media(max-width:1200px){
  .hero-grid.hero-grid-single .hero-chip,
  .hero-grid.hero-grid-single h1,
  .hero-grid.hero-grid-single .lead,
  .hero-grid.hero-grid-single .actions,
  .hero-grid.hero-grid-single .hero-mini-links,
  .hero-grid.hero-grid-single .hero-carousel-controls{
    margin-left:24px;
  }
}

@media(max-width:700px){
  .hero-grid.hero-grid-single .hero-chip,
  .hero-grid.hero-grid-single h1,
  .hero-grid.hero-grid-single .lead,
  .hero-grid.hero-grid-single .actions,
  .hero-grid.hero-grid-single .hero-mini-links,
  .hero-grid.hero-grid-single .hero-carousel-controls{
    margin-left:18px;
    margin-right:18px;
  }
}


/* v40 — Code 44 themed gallery album */
.gallery-album-modal{
  background:
    radial-gradient(circle at 15% 10%,rgba(226,25,32,.09),transparent 27%),
    rgba(1,2,3,.96)!important;
  backdrop-filter:blur(14px);
}
.gallery-album-dialog{
  width:min(1380px,calc(100% - 42px))!important;
  height:calc(100vh - 42px)!important;
  margin:21px auto!important;
  background:#05070a!important;
  border:1px solid rgba(226,25,32,.30)!important;
  box-shadow:0 24px 80px rgba(0,0,0,.55);
}
.gallery-album-topbar{
  min-height:76px!important;
  padding:12px 18px!important;
  background:
    linear-gradient(90deg,rgba(226,25,32,.08),transparent 32%),
    #07090c!important;
  border-bottom:1px solid rgba(226,25,32,.26)!important;
}
.gallery-album-brand{
  display:flex;
  align-items:center;
  gap:12px;
}
.gallery-album-brand img{
  width:58px;
  height:45px;
  object-fit:contain;
}
.gallery-album-brand span{
  display:block;
  color:var(--red);
  font-size:.61rem;
  font-weight:900;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.gallery-album-brand strong{
  display:block;
  margin-top:2px;
  font-family:Oswald,sans-serif;
  font-size:1.08rem;
  text-transform:uppercase;
  letter-spacing:.02em;
}
.gallery-album-top-actions{
  display:flex;
  align-items:center;
  gap:8px;
}
.gallery-album-back,
.gallery-album-close{
  border:1px solid rgba(255,255,255,.13)!important;
  background:#0a0d11!important;
  color:#e7e9eb!important;
  border-radius:3px;
  transition:.18s ease;
}
.gallery-album-back{
  padding:11px 14px!important;
}
.gallery-album-back:hover,
.gallery-album-close:hover{
  border-color:rgba(226,25,32,.75)!important;
  background:rgba(226,25,32,.10)!important;
  color:#fff!important;
}
.gallery-album-scroll{
  padding:30px 34px 38px!important;
  background:
    linear-gradient(rgba(255,255,255,.012),rgba(255,255,255,0)),
    #040609;
}
.gallery-album-heading{
  align-items:center!important;
  padding:0 0 22px;
  margin-bottom:18px!important;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.gallery-album-heading>div{
  position:relative;
  padding-left:15px;
}
.gallery-album-heading>div:before{
  content:"";
  position:absolute;
  left:0;
  top:4px;
  bottom:3px;
  width:3px;
  background:var(--red);
}
.gallery-album-kicker{
  color:#f04a4f!important;
  font-size:.63rem!important;
  letter-spacing:.16em!important;
}
.gallery-album-heading h2{
  margin-top:4px!important;
  font-size:2.7rem!important;
  letter-spacing:.015em;
}
.gallery-album-total{
  padding:8px 11px;
  border:1px solid rgba(226,25,32,.28);
  background:rgba(226,25,32,.06);
  color:#d8dcdf!important;
  border-radius:3px;
}
.gallery-album-grid{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:15px!important;
}
.gallery-album-image{
  aspect-ratio:16/10!important;
  border:1px solid rgba(255,255,255,.09)!important;
  border-radius:3px;
  background:#080a0d!important;
  box-shadow:0 8px 26px rgba(0,0,0,.17);
  transition:border-color .2s ease,transform .2s ease,box-shadow .2s ease;
}
.gallery-album-image:before{
  content:"VIEW IMAGE";
  position:absolute;
  left:14px;
  bottom:13px;
  z-index:3;
  padding:6px 8px;
  background:rgba(0,0,0,.73);
  border-left:2px solid var(--red);
  color:#fff;
  font-family:Oswald,sans-serif;
  font-size:.68rem;
  letter-spacing:.09em;
  opacity:0;
  transform:translateY(5px);
  transition:.2s ease;
}
.gallery-album-image:after{
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  background:linear-gradient(to top,rgba(0,0,0,.55),transparent 48%);
  opacity:.5;
  transition:.2s ease;
}
.gallery-album-image:hover{
  transform:translateY(-2px);
  border-color:rgba(226,25,32,.65)!important;
  box-shadow:0 13px 30px rgba(0,0,0,.32);
}
.gallery-album-image:hover:before{
  opacity:1;
  transform:translateY(0);
}
.gallery-album-image:hover:after{opacity:1}
.gallery-album-image:hover img{
  transform:scale(1.035)!important;
  opacity:1!important;
}

/* v40 themed single-image viewer */
.gallery-lightbox{
  padding:24px!important;
  background:rgba(0,0,0,.96)!important;
  backdrop-filter:blur(12px);
}
.gallery-lightbox-frame{
  width:min(1420px,96vw);
  height:min(900px,94vh);
  display:flex;
  flex-direction:column;
  background:#05070a;
  border:1px solid rgba(226,25,32,.34);
  box-shadow:0 30px 100px rgba(0,0,0,.65);
}
.gallery-lightbox-top{
  min-height:66px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:10px 14px 10px 18px;
  background:linear-gradient(90deg,rgba(226,25,32,.08),transparent 32%),#080a0d;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.gallery-lightbox-top span{
  display:block;
  color:var(--red);
  text-transform:uppercase;
  font-size:.58rem;
  font-weight:900;
  letter-spacing:.14em;
}
.gallery-lightbox-top strong{
  display:block;
  margin-top:3px;
  font-family:Oswald,sans-serif;
  text-transform:uppercase;
  font-size:1.05rem;
}
.gallery-lightbox-close{
  position:static!important;
  flex:0 0 auto;
  border-color:rgba(255,255,255,.13)!important;
  border-radius:3px;
}
.gallery-lightbox-stage{
  position:relative;
  flex:1;
  min-height:0;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:18px 76px;
  overflow:hidden;
  background:
    radial-gradient(circle at center,rgba(255,255,255,.035),transparent 50%),
    #020304;
}
.gallery-lightbox-stage img{
  max-width:100%!important;
  max-height:100%!important;
  object-fit:contain;
  border:1px solid rgba(255,255,255,.05);
}
.gallery-lightbox-arrow{
  top:50%!important;
  width:46px!important;
  height:64px!important;
  border:1px solid rgba(255,255,255,.14)!important;
  background:rgba(8,10,13,.88)!important;
  color:#fff!important;
  border-radius:3px;
  transition:.18s ease;
}
.gallery-lightbox-arrow.prev{left:16px!important}
.gallery-lightbox-arrow.next{right:16px!important}
.gallery-lightbox-arrow:hover{
  border-color:rgba(226,25,32,.76)!important;
  background:rgba(226,25,32,.12)!important;
}
.gallery-lightbox-bottom{
  min-height:48px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:10px 18px;
  border-top:1px solid rgba(255,255,255,.08);
  background:#080a0d;
  color:#818890;
  font-size:.69rem;
}
.gallery-lightbox-bottom strong{
  color:#fff;
  font-family:Oswald,sans-serif;
  font-size:.9rem;
  letter-spacing:.06em;
}
@media(max-width:900px){
  .gallery-album-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .gallery-album-dialog{
    width:calc(100% - 20px)!important;
    height:calc(100vh - 20px)!important;
    margin:10px auto!important;
  }
  .gallery-album-scroll{padding:22px!important}
}
@media(max-width:620px){
  .gallery-album-brand img{display:none}
  .gallery-album-brand strong{font-size:.9rem}
  .gallery-album-back{font-size:.66rem;padding:9px!important}
  .gallery-album-grid{grid-template-columns:1fr!important}
  .gallery-album-scroll{padding:16px!important}
  .gallery-album-heading h2{font-size:2rem!important}
  .gallery-lightbox{padding:0!important}
  .gallery-lightbox-frame{width:100%;height:100vh;border:0}
  .gallery-lightbox-stage{padding:12px 46px}
  .gallery-lightbox-arrow{width:36px!important;height:52px!important}
  .gallery-lightbox-arrow.prev{left:5px!important}
  .gallery-lightbox-arrow.next{right:5px!important}
}

/* v43 search-focused content */
.seo-intro-section,.seo-support-section{padding:46px 0}
.seo-intro-section{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#05070a}
.seo-intro-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(300px,.6fr);gap:38px;align-items:center}
.seo-intro-section h2,.seo-support-section h2{font-family:Oswald,sans-serif;text-transform:uppercase;font-size:2rem;margin:6px 0 14px}
.seo-intro-section p,.seo-support-section p{color:#9ca3aa;line-height:1.75;max-width:850px}
.seo-intro-section p strong{color:#e6e8ea}
.seo-intro-links{display:grid;gap:8px}
.seo-intro-links a{display:block;padding:15px 16px;border:1px solid var(--line);background:#080a0d;text-decoration:none;transition:.18s ease}
.seo-intro-links a:hover{border-color:rgba(226,25,32,.65);transform:translateX(2px)}
.seo-intro-links strong{display:block;color:#fff;font-size:.78rem;text-transform:uppercase}
.seo-intro-links span{display:block;color:#858d95;font-size:.7rem;margin-top:4px}
.seo-support-section{border-top:1px solid var(--line)}
@media(max-width:850px){.seo-intro-grid{grid-template-columns:1fr}}

/* v44 department content imagery */
.department-feature-image{position:relative;margin:8px 0 42px;border:1px solid var(--line);overflow:hidden;background:#05070a;min-height:280px}
.department-feature-image img{display:block;width:100%;height:clamp(280px,38vw,460px);object-fit:cover}
.department-feature-image:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(0,0,0,.88) 100%);pointer-events:none}
.department-feature-caption{position:absolute;z-index:2;left:22px;right:22px;bottom:18px;display:flex;flex-direction:column;gap:3px;text-transform:uppercase}
.department-feature-caption span{font-size:.62rem;letter-spacing:.16em;color:#ef3037;font-weight:800}
.department-feature-caption strong{font-family:Oswald,sans-serif;color:#fff;font-size:1.1rem}
.wide-dept img{object-fit:cover}


/* v45 — Staff hierarchy colour coding */
.staff-section:nth-of-type(1),
.staff-group.owners,
[data-staff-group="owners"] {
  --staff-accent: #d9b85c;
}
.staff-section:nth-of-type(2),
.staff-group.senior-team,
[data-staff-group="senior-team"] {
  --staff-accent: #e7a83f;
}
.staff-section:nth-of-type(3),
.staff-group.vehicle-developers,
[data-staff-group="vehicle-developers"] {
  --staff-accent: #d6b4dc;
}
.staff-section:nth-of-type(4),
.staff-group.admins,
[data-staff-group="admins"] {
  --staff-accent: #e4d5e8;
}
.staff-section:nth-of-type(5),
.staff-group.trial-admins,
[data-staff-group="trial-admins"] {
  --staff-accent: #a9d8ad;
}

/* Apply group accent to the staff page without changing the site's overall red theme. */
.staff-section .section-number,
.staff-section .content-title > span,
.staff-section .staff-role,
.staff-section .kicker,
.staff-group .section-number,
.staff-group .content-title > span,
.staff-group .staff-role,
.staff-group .kicker {
  color: var(--staff-accent, #e21920) !important;
}

.staff-section .staff-card,
.staff-group .staff-card {
  border-color: color-mix(in srgb, var(--staff-accent, #e21920) 52%, #20252b) !important;
}

.staff-section .staff-avatar,
.staff-section .staff-initial,
.staff-group .staff-avatar,
.staff-group .staff-initial {
  background: color-mix(in srgb, var(--staff-accent, #e21920) 72%, #090b0e) !important;
  border-color: var(--staff-accent, #e21920) !important;
}

/* Fallbacks for browsers without color-mix support. */
@supports not (color: color-mix(in srgb, red 50%, white)) {
  .staff-section .staff-card,.staff-group .staff-card { border-color: var(--staff-accent, #e21920) !important; }
  .staff-section .staff-avatar,.staff-section .staff-initial,
  .staff-group .staff-avatar,.staff-group .staff-initial { background:#101216 !important; border-color:var(--staff-accent,#e21920) !important; }
}

/* v46 — Katy individual staff accent */
.staff-feature-katy{
  border-color:#873568 !important;
  background:linear-gradient(135deg,rgba(105,35,82,.22),rgba(7,9,12,.97) 62%) !important;
}
.staff-feature-katy .staff-monogram{
  color:#f0c7e2 !important;
  border-color:#873568 !important;
  background:#321326 !important;
}
.staff-feature-katy small,
.staff-feature-katy p{
  color:#b84f94 !important;
}
.staff-feature-katy h3{
  color:#e8dce4 !important;
}


/* v47 — explicit staff card colours (do not depend on section order) */
.staff-feature.staff-owner{
  border-color:#caa64b !important;
  background:linear-gradient(135deg,rgba(202,166,75,.16),rgba(7,9,12,.97) 62%) !important;
}
.staff-feature.staff-owner .staff-monogram{border-color:#caa64b !important;background:#302812 !important;color:#f4dfa0 !important}
.staff-feature.staff-owner small,.staff-feature.staff-owner p{color:#d9b85c !important}

.staff-feature.staff-senior{
  border-color:#d9922f !important;
  background:linear-gradient(135deg,rgba(217,146,47,.14),rgba(7,9,12,.97) 62%) !important;
}
.staff-feature.staff-senior .staff-monogram{border-color:#d9922f !important;background:#34220d !important;color:#f3c46f !important}
.staff-feature.staff-senior small,.staff-feature.staff-senior p{color:#e7a83f !important}

.staff-feature.staff-vehicle-dev{
  border-color:#c89bcf !important;
  background:linear-gradient(135deg,rgba(200,155,207,.13),rgba(7,9,12,.97) 62%) !important;
}
.staff-feature.staff-vehicle-dev .staff-monogram{border-color:#c89bcf !important;background:#2b202e !important;color:#ebd4ef !important}
.staff-feature.staff-vehicle-dev small,.staff-feature.staff-vehicle-dev p{color:#d6b4dc !important}

.staff-feature.staff-admin{
  border-color:#ddcbe1 !important;
  background:linear-gradient(135deg,rgba(221,203,225,.12),rgba(7,9,12,.97) 62%) !important;
}
.staff-feature.staff-admin .staff-monogram{border-color:#ddcbe1 !important;background:#2c292d !important;color:#fff7ff !important}
.staff-feature.staff-admin small,.staff-feature.staff-admin p{color:#eadfec !important}

.staff-feature.staff-trial-admin{
  border-color:#8fc99a !important;
  background:linear-gradient(135deg,rgba(143,201,154,.13),rgba(7,9,12,.97) 62%) !important;
}
.staff-feature.staff-trial-admin .staff-monogram{border-color:#8fc99a !important;background:#1d2b20 !important;color:#d5f0da !important}
.staff-feature.staff-trial-admin small,.staff-feature.staff-trial-admin p{color:#a9d8ad !important}

/* Katy's individual colour must win over the Senior Team group styling. */
.staff-feature.staff-feature-katy{
  border-color:#873568 !important;
  background:linear-gradient(135deg,rgba(105,35,82,.22),rgba(7,9,12,.97) 62%) !important;
}
.staff-feature.staff-feature-katy .staff-monogram{
  color:#f0c7e2 !important;
  border-color:#873568 !important;
  background:#321326 !important;
}
.staff-feature.staff-feature-katy small,
.staff-feature.staff-feature-katy p{color:#b84f94 !important}
.staff-feature.staff-feature-katy h3{color:#e8dce4 !important}


/* v48 cleanup */
.nav-more{display:none!important}


/* v49 recruitment banners */
.department-recruitment-banner{padding:18px 0;border-bottom:1px solid var(--line);background:#06080b}
.department-recruitment-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:18px 20px;border:1px solid rgba(255,255,255,.09);background:linear-gradient(90deg,rgba(32,164,91,.09),#07090c 52%)}
.department-recruitment-banner.closed .department-recruitment-inner{background:linear-gradient(90deg,rgba(226,25,32,.08),#07090c 52%)}
.recruitment-status{display:inline-block;color:#78e6a2;font-size:.62rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase;margin-bottom:5px}
.department-recruitment-banner.closed .recruitment-status{color:#ff7378}
.department-recruitment-inner h2{font-family:Oswald,sans-serif;text-transform:uppercase;margin:0 0 4px;font-size:1.5rem}
.department-recruitment-inner p{margin:0;color:#939ba3;font-size:.78rem}
.btn.disabled,[aria-disabled="true"]{opacity:.45;pointer-events:none}

/* announcement modes */
.home-announcement[data-notice-mode="maintenance"]{background:linear-gradient(90deg,rgba(226,25,32,.20),#080a0d 46%)}
.home-announcement[data-notice-mode="restart"]{background:linear-gradient(90deg,rgba(236,153,33,.17),#080a0d 46%)}
.home-announcement[data-notice-mode="restart"] .home-announcement-label{background:#d98a20}

/* latest updates */
.latest-updates-section{padding:40px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#040609}
.latest-updates-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:18px}
.latest-updates-head h2{font-family:Oswald,sans-serif;text-transform:uppercase;font-size:2rem;margin:5px 0 0}
.latest-updates-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.latest-update-card{min-height:190px;padding:19px;border:1px solid var(--line);background:#07090c;display:flex;flex-direction:column}
.latest-update-card>span{color:#f04a4f;text-transform:uppercase;font-size:.62rem;font-weight:900;letter-spacing:.1em}
.latest-update-card h3{font-family:Oswald,sans-serif;text-transform:uppercase;font-size:1.18rem;margin:9px 0}
.latest-update-card p{color:#9199a1;font-size:.76rem;line-height:1.6;margin:0 0 14px}
.latest-update-card a{margin-top:auto;color:#fff;font-size:.7rem;font-weight:800;text-transform:uppercase}
.latest-update-card.loading{opacity:.55}

/* accessibility */
:focus-visible{outline:2px solid #ff4b51!important;outline-offset:3px!important}
.skip-link{position:fixed;left:12px;top:-80px;z-index:9999;padding:10px 14px;background:#fff;color:#000;font-weight:800}
.skip-link:focus{top:12px}
.muted,.feed-card p,.feature-copy p{color:#a6adb4}
input,textarea,select{color:#f4f5f6}
::placeholder{color:#858d95;opacity:1}

/* themed 404 */
.error-page{min-height:100vh;background:#020304}
.error-404{position:relative;min-height:100vh;display:flex;align-items:center;overflow:hidden}
.error-404-backdrop{position:absolute;inset:0;background:radial-gradient(circle at 75% 45%,rgba(226,25,32,.13),transparent 30%),linear-gradient(120deg,#020304,#07090d 60%,#030405)}
.error-404-backdrop:after{content:"";position:absolute;inset:0;background:linear-gradient(rgba(255,255,255,.015) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.015) 1px,transparent 1px);background-size:42px 42px}
.error-404-content{position:relative;z-index:2;padding-top:70px;padding-bottom:70px}
.error-404-logo{width:180px;height:auto;margin-bottom:24px}
.error-404 h1{font-family:Oswald,sans-serif;text-transform:uppercase;font-size:clamp(3.8rem,9vw,8.5rem);line-height:.9;margin:8px 0 20px;max-width:760px}
.error-404 h1 span{display:block;color:var(--red)}
.error-404 p{max-width:650px;color:#a3abb3;line-height:1.7}
.error-404-actions{margin-top:25px}
.error-404-code{position:absolute;right:2vw;bottom:-9vh;font-family:Oswald,sans-serif;font-size:32vw;line-height:1;color:rgba(226,25,32,.035);pointer-events:none;user-select:none}

@media(max-width:850px){
  .latest-updates-grid{grid-template-columns:1fr}
  .department-recruitment-inner{align-items:flex-start;flex-direction:column}
  .department-recruitment-inner .btn{width:100%;text-align:center}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}


/* v50 — live server + Discord stats above the fold */
.hero-grid.hero-grid-single>.reveal:first-child{
  min-height:610px!important;
  padding-bottom:26px!important;
}
.hero-live-strip{
  position:absolute!important;
  left:max(24px,calc((100vw - 1160px)/2))!important;
  right:max(24px,calc((100vw - 1160px)/2))!important;
  bottom:24px!important;
  z-index:5!important;
  display:grid;
  grid-template-columns:minmax(0,1.45fr) minmax(380px,.85fr);
  gap:8px;
}
.hero-live-server,
.hero-live-discord{
  min-height:82px;
  display:flex;
  align-items:center;
  gap:17px;
  padding:12px 14px;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(4,6,8,.88);
  backdrop-filter:blur(12px);
  box-shadow:0 10px 30px rgba(0,0,0,.25);
}
.hero-live-server{
  border-left:3px solid var(--red);
}
.hero-live-discord{
  border-left:3px solid #5865f2;
}
.hero-live-icon{
  display:grid;
  place-items:center;
  width:24px;
  flex:0 0 24px;
}
.live-dot{
  width:9px;
  height:9px;
  border-radius:50%;
  background:#6ee7a0;
  box-shadow:0 0 0 5px rgba(110,231,160,.08);
}
.hero-live-copy{
  min-width:100px;
}
.hero-live-copy span,
.hero-live-number>span,
.hero-discord-stat>span{
  display:block;
  color:#8e969e;
  font-size:.58rem;
  font-weight:900;
  letter-spacing:.09em;
  text-transform:uppercase;
}
.hero-live-copy strong{
  display:block;
  margin-top:3px;
  color:#fff;
  font-family:Oswald,sans-serif;
  font-size:.95rem;
  text-transform:uppercase;
}
.hero-live-number,
.hero-discord-stat{
  padding-left:14px;
  border-left:1px solid rgba(255,255,255,.09);
}
.hero-live-number strong,
.hero-discord-stat strong{
  display:block;
  font-family:Oswald,sans-serif;
  color:#fff;
  font-size:1.45rem;
  line-height:1;
}
.hero-live-number small{
  color:#8f979f;
  font-size:.8rem;
}
.hero-live-capacity{
  flex:1;
  min-width:110px;
}
.hero-live-capacity>div:first-child{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:6px;
  color:#858d95;
  font-size:.57rem;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.hero-live-capacity b{
  color:#fff;
}
.hero-live-capacity .capacity-track{
  height:5px;
}
.hero-live-action{
  flex:0 0 auto;
  padding:10px 12px;
  border:1px solid rgba(226,25,32,.55);
  background:rgba(226,25,32,.12);
  color:#fff;
  text-decoration:none;
  font-size:.63rem;
  font-weight:900;
  letter-spacing:.06em;
  text-transform:uppercase;
  transition:.18s ease;
}
.hero-live-action:hover{
  background:var(--red);
  border-color:var(--red);
}
.hero-live-action.discord{
  border-color:rgba(88,101,242,.65);
  background:rgba(88,101,242,.12);
}
.hero-live-action.discord:hover{
  background:#5865f2;
  border-color:#5865f2;
}

/* give hero text space above the fixed strip */
.hero-grid.hero-grid-single .hero-carousel-controls{
  margin-bottom:100px;
}

/* lower duplicate status panel intentionally removed */
.live-community-section{display:none!important}

@media(max-width:1100px){
  .hero-live-strip{
    grid-template-columns:1fr;
    bottom:18px!important;
  }
  .hero-grid.hero-grid-single>.reveal:first-child{
    min-height:720px!important;
  }
  .hero-grid.hero-grid-single .hero-carousel-controls{
    margin-bottom:190px;
  }
}
@media(max-width:700px){
  .hero-live-strip{
    left:14px!important;
    right:14px!important;
    bottom:14px!important;
  }
  .hero-live-server,
  .hero-live-discord{
    display:grid;
    grid-template-columns:auto 1fr auto;
    gap:10px;
    min-height:auto;
    padding:12px;
  }
  .hero-live-server .hero-live-capacity{
    grid-column:1/-1;
  }
  .hero-live-server .hero-live-action,
  .hero-live-discord .hero-live-action{
    grid-column:1/-1;
    text-align:center;
  }
  .hero-live-discord{
    grid-template-columns:1fr auto auto;
  }
  .hero-live-icon{display:none}
  .hero-grid.hero-grid-single>.reveal:first-child{
    min-height:870px!important;
  }
  .hero-grid.hero-grid-single .hero-carousel-controls{
    margin-bottom:335px;
  }
}

.hero-live-copy strong.online{color:#6ee7a0!important}
.hero-live-copy strong.offline{color:#ff686d!important}
.hero-live-copy strong.checking{color:#d7dadd!important}


/* v51 — refined hero live stats: glass cards on right */
.hero-grid.hero-grid-single>.reveal:first-child{
  min-height:640px!important;
  padding-bottom:28px!important;
}

.hero-live-strip{
  position:absolute!important;
  top:88px!important;
  right:max(28px,calc((100vw - 1500px)/2))!important;
  bottom:auto!important;
  left:auto!important;
  z-index:6!important;
  width:min(390px,32vw)!important;
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:10px!important;
  pointer-events:auto;
}

.hero-live-server,
.hero-live-discord{
  position:relative;
  overflow:hidden;
  display:grid!important;
  align-items:center;
  gap:12px!important;
  min-height:0!important;
  padding:16px 16px 15px!important;
  border:1px solid rgba(255,255,255,.13)!important;
  border-radius:8px!important;
  background:rgba(5,7,10,.72)!important;
  backdrop-filter:blur(18px) saturate(115%)!important;
  -webkit-backdrop-filter:blur(18px) saturate(115%)!important;
  box-shadow:0 18px 46px rgba(0,0,0,.26)!important;
}

.hero-live-server{
  grid-template-columns:auto 1fr auto!important;
  border-left:1px solid rgba(255,255,255,.13)!important;
}

.hero-live-server:before,
.hero-live-discord:before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:3px;
  pointer-events:none;
}

.hero-live-server:before{
  background:linear-gradient(180deg,#ff3339,#9d0f14);
  box-shadow:0 0 20px rgba(226,25,32,.30);
}

.hero-live-discord{
  grid-template-columns:1fr auto auto!important;
}

.hero-live-discord:before{
  background:linear-gradient(180deg,#8992ff,#5865f2);
  box-shadow:0 0 20px rgba(88,101,242,.28);
}

.hero-live-server:after,
.hero-live-discord:after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(135deg,rgba(255,255,255,.035),transparent 32%),
    radial-gradient(circle at 90% 0%,rgba(255,255,255,.035),transparent 24%);
}

.hero-live-icon{
  position:relative;
  z-index:2;
  width:28px!important;
  height:28px;
  display:grid!important;
  place-items:center;
  border:1px solid rgba(110,231,160,.18);
  border-radius:50%;
  background:rgba(110,231,160,.06);
}

.live-dot{
  width:8px!important;
  height:8px!important;
  box-shadow:
    0 0 0 4px rgba(110,231,160,.08),
    0 0 13px rgba(110,231,160,.42)!important;
}

.hero-live-copy,
.hero-live-number,
.hero-live-capacity,
.hero-discord-stat,
.hero-live-action{
  position:relative;
  z-index:2;
}

.hero-live-copy{
  min-width:0!important;
}

.hero-live-copy span,
.hero-live-number>span,
.hero-discord-stat>span{
  color:#9ca4ac!important;
  font-size:.56rem!important;
  letter-spacing:.11em!important;
}

.hero-live-copy strong{
  margin-top:4px!important;
  font-size:1rem!important;
  letter-spacing:.02em;
}

.hero-live-number{
  padding-left:12px!important;
  border-left:1px solid rgba(255,255,255,.09)!important;
  text-align:right;
}

.hero-live-number strong{
  font-size:1.75rem!important;
}

.hero-live-number small{
  font-size:.8rem!important;
}

.hero-live-capacity{
  grid-column:1/-1;
  min-width:0!important;
  margin-top:2px;
  padding:10px 0 0;
  border-top:1px solid rgba(255,255,255,.07);
}

.hero-live-capacity>div:first-child{
  margin-bottom:7px!important;
}

.hero-live-capacity .capacity-track{
  height:6px!important;
  border:0!important;
  border-radius:20px;
  background:rgba(255,255,255,.08)!important;
}

.hero-live-capacity .capacity-track span{
  border-radius:20px;
  background:linear-gradient(90deg,#a50d13,#e21920)!important;
}

.hero-live-server .hero-live-action{
  grid-column:1/-1;
}

.hero-live-action{
  width:100%;
  padding:10px 12px!important;
  text-align:center;
  border-radius:5px!important;
  background:linear-gradient(180deg,rgba(226,25,32,.22),rgba(170,16,21,.16))!important;
  border-color:rgba(226,25,32,.58)!important;
  font-size:.62rem!important;
}

.hero-live-action:hover{
  background:linear-gradient(180deg,#e21920,#b41015)!important;
  transform:translateY(-1px);
}

.hero-live-action.discord{
  grid-column:1/-1;
  margin-top:2px;
  background:linear-gradient(180deg,rgba(88,101,242,.18),rgba(67,78,194,.12))!important;
  border-color:rgba(124,135,255,.48)!important;
}

.hero-live-action.discord:hover{
  background:linear-gradient(180deg,#6875f5,#5260dc)!important;
}

.hero-discord-stat{
  min-width:70px;
  padding-left:11px!important;
  border-left:1px solid rgba(255,255,255,.08)!important;
  text-align:right;
}

.hero-discord-stat strong{
  font-size:1.5rem!important;
}

.hero-live-copy strong.online{
  color:#76e9a1!important;
  text-shadow:0 0 14px rgba(118,233,161,.16);
}

.hero-live-copy strong.offline{
  color:#ff6f74!important;
}

.hero-live-copy strong.checking{
  color:#d9dde1!important;
}

/* With the status cards moved to the right, carousel controls no longer need a huge bottom gap. */
.hero-grid.hero-grid-single .hero-carousel-controls{
  margin-bottom:0!important;
}

/* Keep the left hero copy clear of the cards on medium desktop widths. */
@media(min-width:1101px) and (max-width:1380px){
  .hero-live-strip{
    width:350px!important;
    right:22px!important;
  }
  .hero-grid.hero-grid-single h1,
  .hero-grid.hero-grid-single .lead{
    max-width:650px!important;
  }
}

/* Tablet: move cards below the hero copy but still inside the first screen area. */
@media(max-width:1100px){
  .hero-grid.hero-grid-single>.reveal:first-child{
    min-height:780px!important;
  }

  .hero-live-strip{
    top:auto!important;
    left:24px!important;
    right:24px!important;
    bottom:20px!important;
    width:auto!important;
    grid-template-columns:1fr 1fr!important;
  }

  .hero-live-server,
  .hero-live-discord{
    height:100%;
  }
}

/* Mobile: compact stacked cards with strong readability. */
@media(max-width:720px){
  .hero-grid.hero-grid-single>.reveal:first-child{
    min-height:980px!important;
  }

  .hero-live-strip{
    left:14px!important;
    right:14px!important;
    bottom:14px!important;
    grid-template-columns:1fr!important;
  }

  .hero-live-server{
    grid-template-columns:auto 1fr auto!important;
  }

  .hero-live-discord{
    grid-template-columns:1fr auto auto!important;
  }

  .hero-live-server,
  .hero-live-discord{
    padding:14px!important;
    border-radius:7px!important;
    background:rgba(4,6,8,.82)!important;
  }

  .hero-live-icon{
    display:grid!important;
  }
}

@media(prefers-reduced-motion:no-preference){
  .hero-live-copy strong.online{
    animation:status-soft-pulse 2.8s ease-in-out infinite;
  }
}

@keyframes status-soft-pulse{
  0%,100%{opacity:1}
  50%{opacity:.78}
}


/* v52 — integrated hero status rail */
.hero-grid.hero-grid-single>.reveal:first-child{
  min-height:665px!important;
  padding-bottom:32px!important;
}

.hero-live-strip{
  position:absolute!important;
  left:max(24px,calc((100vw - 1160px)/2))!important;
  right:auto!important;
  top:auto!important;
  bottom:26px!important;
  width:min(920px,calc(100vw - 48px))!important;
  display:grid!important;
  grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr)!important;
  gap:8px!important;
  z-index:6!important;
}

.hero-live-server,
.hero-live-discord{
  min-height:74px!important;
  border-radius:6px!important;
  background:rgba(4,6,8,.64)!important;
  border:1px solid rgba(255,255,255,.12)!important;
  backdrop-filter:blur(16px) saturate(110%)!important;
  -webkit-backdrop-filter:blur(16px) saturate(110%)!important;
  box-shadow:none!important;
}

.hero-live-server{
  display:grid!important;
  grid-template-columns:auto minmax(110px,.7fr) auto minmax(150px,1fr) auto!important;
  gap:14px!important;
  padding:12px 14px!important;
}

.hero-live-discord{
  display:grid!important;
  grid-template-columns:minmax(95px,1fr) auto auto!important;
  gap:12px!important;
  padding:12px 14px!important;
}

.hero-live-server:before,
.hero-live-discord:before{
  width:2px!important;
  opacity:.9;
}

.hero-live-server:after,
.hero-live-discord:after{
  background:linear-gradient(135deg,rgba(255,255,255,.018),transparent 40%)!important;
}

.hero-live-icon{
  width:24px!important;
  height:24px!important;
  background:rgba(110,231,160,.045)!important;
  border-color:rgba(110,231,160,.14)!important;
}

.hero-live-copy span,
.hero-live-number>span,
.hero-discord-stat>span{
  font-size:.53rem!important;
  letter-spacing:.1em!important;
}

.hero-live-copy strong{
  font-size:.9rem!important;
}

.hero-live-number{
  padding-left:12px!important;
  text-align:left!important;
}

.hero-live-number strong{
  font-size:1.45rem!important;
}

.hero-live-capacity{
  grid-column:auto!important;
  margin-top:0!important;
  padding:0!important;
  border-top:0!important;
  align-self:center;
}

.hero-live-capacity>div:first-child{
  margin-bottom:5px!important;
}

.hero-live-capacity .capacity-track{
  height:5px!important;
}

.hero-live-action{
  width:auto!important;
  min-width:92px;
  align-self:center;
  padding:9px 11px!important;
  border-radius:4px!important;
  font-size:.58rem!important;
}

.hero-live-server .hero-live-action,
.hero-live-discord .hero-live-action{
  grid-column:auto!important;
  margin-top:0!important;
}

.hero-discord-stat{
  min-width:58px!important;
  padding-left:10px!important;
}

.hero-discord-stat strong{
  font-size:1.3rem!important;
}

.hero-live-action.discord{
  min-width:112px;
}

/* keep the rail visually tied to the main hero content */
.hero-grid.hero-grid-single .hero-carousel-controls{
  margin-bottom:92px!important;
}

@media(min-width:1250px){
  .hero-live-strip{
    width:min(980px,calc(100vw - 48px))!important;
  }
}

@media(max-width:1050px){
  .hero-grid.hero-grid-single>.reveal:first-child{
    min-height:795px!important;
  }

  .hero-live-strip{
    left:24px!important;
    right:24px!important;
    bottom:20px!important;
    width:auto!important;
    grid-template-columns:1fr!important;
  }

  .hero-live-server{
    grid-template-columns:auto 1fr auto minmax(140px,.8fr) auto!important;
  }

  .hero-live-discord{
    grid-template-columns:1fr auto auto auto!important;
  }

  .hero-grid.hero-grid-single .hero-carousel-controls{
    margin-bottom:190px!important;
  }
}

@media(max-width:720px){
  .hero-grid.hero-grid-single>.reveal:first-child{
    min-height:1020px!important;
  }

  .hero-live-strip{
    left:14px!important;
    right:14px!important;
    bottom:14px!important;
    gap:7px!important;
  }

  .hero-live-server,
  .hero-live-discord{
    border-radius:5px!important;
    background:rgba(4,6,8,.78)!important;
  }

  .hero-live-server{
    grid-template-columns:auto 1fr auto!important;
  }

  .hero-live-server .hero-live-capacity{
    grid-column:1/-1!important;
  }

  .hero-live-server .hero-live-action{
    grid-column:1/-1!important;
    width:100%!important;
  }

  .hero-live-discord{
    grid-template-columns:1fr auto auto!important;
  }

  .hero-live-discord .hero-live-action{
    grid-column:1/-1!important;
    width:100%!important;
  }

  .hero-grid.hero-grid-single .hero-carousel-controls{
    margin-bottom:315px!important;
  }
}


/* v53 — balanced right-side hero stats */
.hero-grid.hero-grid-single>.reveal:first-child{
  min-height:650px!important;
  padding-bottom:30px!important;
}

/* Give the main hero copy a sensible width so the cards have their own space */
.hero-grid.hero-grid-single h1,
.hero-grid.hero-grid-single .lead{
  max-width:700px!important;
}

.hero-live-strip{
  position:absolute!important;
  top:50%!important;
  right:max(34px,calc((100vw - 1500px)/2))!important;
  left:auto!important;
  bottom:auto!important;
  transform:translateY(-42%)!important;
  width:330px!important;
  display:flex!important;
  flex-direction:column!important;
  gap:10px!important;
  z-index:6!important;
}

/* Shared card appearance */
.hero-live-server,
.hero-live-discord{
  position:relative!important;
  display:block!important;
  min-height:0!important;
  padding:16px!important;
  border-radius:7px!important;
  border:1px solid rgba(255,255,255,.12)!important;
  background:rgba(4,6,8,.72)!important;
  backdrop-filter:blur(18px) saturate(110%)!important;
  -webkit-backdrop-filter:blur(18px) saturate(110%)!important;
  box-shadow:0 14px 38px rgba(0,0,0,.24)!important;
  overflow:hidden;
}

.hero-live-server:before,
.hero-live-discord:before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:3px!important;
}

.hero-live-server:before{
  background:#e21920;
}

.hero-live-discord:before{
  background:#6976f2;
}

.hero-live-server:after,
.hero-live-discord:after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(135deg,rgba(255,255,255,.025),transparent 45%);
}

/* SERVER CARD */
.hero-live-server{
  display:grid!important;
  grid-template-columns:auto 1fr auto!important;
  grid-template-areas:
    "icon copy players"
    "capacity capacity capacity"
    "action action action"!important;
  gap:12px 12px!important;
}

.hero-live-icon{
  grid-area:icon;
  width:28px!important;
  height:28px!important;
  align-self:center;
  display:grid!important;
  place-items:center;
  border-radius:50%;
  border:1px solid rgba(110,231,160,.18)!important;
  background:rgba(110,231,160,.05)!important;
  position:relative;
  z-index:2;
}

.hero-live-copy{
  grid-area:copy;
  align-self:center;
  position:relative;
  z-index:2;
  min-width:0!important;
}

.hero-live-number{
  grid-area:players;
  align-self:center;
  text-align:right!important;
  padding-left:12px!important;
  border-left:1px solid rgba(255,255,255,.09)!important;
  position:relative;
  z-index:2;
}

.hero-live-capacity{
  grid-area:capacity!important;
  margin:0!important;
  padding:10px 0 0!important;
  border-top:1px solid rgba(255,255,255,.07)!important;
  position:relative;
  z-index:2;
}

.hero-live-server .hero-live-action{
  grid-area:action!important;
}

/* DISCORD CARD */
.hero-live-discord{
  display:grid!important;
  grid-template-columns:1fr auto auto!important;
  grid-template-areas:
    "copy members online"
    "action action action"!important;
  gap:12px!important;
}

.hero-live-discord .hero-live-copy{
  grid-area:copy!important;
}

.hero-live-discord .hero-discord-stat:nth-of-type(1){
  grid-area:members!important;
}
.hero-live-discord .hero-discord-stat:nth-of-type(2){
  grid-area:online!important;
}
.hero-live-discord .hero-live-action{
  grid-area:action!important;
}

.hero-live-copy span,
.hero-live-number>span,
.hero-discord-stat>span{
  color:#9ba3ab!important;
  font-size:.54rem!important;
  line-height:1.2;
  letter-spacing:.1em!important;
  text-transform:uppercase;
}

.hero-live-copy strong{
  margin-top:4px!important;
  font-size:.95rem!important;
  line-height:1.1;
}

.hero-live-number strong{
  font-size:1.55rem!important;
  line-height:1!important;
}

.hero-live-number small{
  font-size:.78rem!important;
  color:#8e969e!important;
}

.hero-discord-stat{
  min-width:60px!important;
  padding-left:10px!important;
  border-left:1px solid rgba(255,255,255,.08)!important;
  text-align:right!important;
  position:relative;
  z-index:2;
}

.hero-discord-stat strong{
  font-size:1.35rem!important;
  line-height:1!important;
}

.hero-live-capacity>div:first-child{
  margin-bottom:6px!important;
}

.hero-live-capacity .capacity-track{
  height:5px!important;
  border-radius:10px;
  background:rgba(255,255,255,.08)!important;
  border:0!important;
}

.hero-live-capacity .capacity-track span{
  border-radius:10px;
}

.hero-live-action{
  width:100%!important;
  min-width:0!important;
  padding:10px 12px!important;
  border-radius:4px!important;
  text-align:center!important;
  font-size:.59rem!important;
  position:relative;
  z-index:2;
}

.hero-live-server .hero-live-action{
  background:rgba(226,25,32,.12)!important;
  border-color:rgba(226,25,32,.52)!important;
}

.hero-live-server .hero-live-action:hover{
  background:#e21920!important;
}

.hero-live-discord .hero-live-action{
  background:rgba(88,101,242,.11)!important;
  border-color:rgba(105,118,242,.48)!important;
}

.hero-live-discord .hero-live-action:hover{
  background:#5865f2!important;
}

/* Cards should not force carousel controls down */
.hero-grid.hero-grid-single .hero-carousel-controls{
  margin-bottom:0!important;
}

/* Mid-size desktop: slightly smaller card so it never fights the headline */
@media(max-width:1280px) and (min-width:1001px){
  .hero-live-strip{
    width:300px!important;
    right:22px!important;
  }

  .hero-grid.hero-grid-single h1,
  .hero-grid.hero-grid-single .lead{
    max-width:620px!important;
  }
}

/* Tablet: cards move underneath copy */
@media(max-width:1000px){
  .hero-grid.hero-grid-single>.reveal:first-child{
    min-height:820px!important;
  }

  .hero-live-strip{
    top:auto!important;
    left:24px!important;
    right:24px!important;
    bottom:18px!important;
    transform:none!important;
    width:auto!important;
    flex-direction:row!important;
    align-items:stretch;
  }

  .hero-live-server,
  .hero-live-discord{
    flex:1 1 0;
  }
}

/* Mobile: stack cleanly */
@media(max-width:700px){
  .hero-grid.hero-grid-single>.reveal:first-child{
    min-height:1010px!important;
  }

  .hero-live-strip{
    left:14px!important;
    right:14px!important;
    bottom:14px!important;
    flex-direction:column!important;
  }

  .hero-live-server,
  .hero-live-discord{
    padding:14px!important;
    background:rgba(4,6,8,.82)!important;
  }
}


/* v54 — move hero stats further right + increase card height/type size */
@media(min-width:1001px){
  .hero-live-strip{
    right:18px!important;
    width:350px!important;
    transform:translateY(-40%)!important;
    gap:12px!important;
  }

  .hero-live-server,
  .hero-live-discord{
    padding:21px 20px!important;
    border-radius:8px!important;
  }

  .hero-live-server{
    min-height:185px!important;
    gap:15px 14px!important;
  }

  .hero-live-discord{
    min-height:130px!important;
    gap:15px!important;
  }

  .hero-live-icon{
    width:34px!important;
    height:34px!important;
  }

  .hero-live-copy span,
  .hero-live-number>span,
  .hero-discord-stat>span{
    font-size:.63rem!important;
    letter-spacing:.11em!important;
  }

  .hero-live-copy strong{
    font-size:1.12rem!important;
    margin-top:5px!important;
  }

  .hero-live-number strong{
    font-size:1.85rem!important;
  }

  .hero-live-number small{
    font-size:.9rem!important;
  }

  .hero-discord-stat{
    min-width:68px!important;
    padding-left:13px!important;
  }

  .hero-discord-stat strong{
    font-size:1.62rem!important;
  }

  .hero-live-capacity{
    padding-top:13px!important;
  }

  .hero-live-capacity>div:first-child{
    font-size:.64rem!important;
    margin-bottom:8px!important;
  }

  .hero-live-capacity .capacity-track{
    height:6px!important;
  }

  .hero-live-action{
    padding:12px 14px!important;
    font-size:.68rem!important;
  }
}

/* Keep a little breathing room on narrower desktop displays */
@media(max-width:1280px) and (min-width:1001px){
  .hero-live-strip{
    right:14px!important;
    width:325px!important;
  }

  .hero-live-server{
    min-height:175px!important;
  }

  .hero-live-discord{
    min-height:124px!important;
  }
}


/* v55 — balanced hero composition with dedicated right-side status column */
@media(min-width:1101px){
  .hero-grid.hero-grid-single>.reveal:first-child{
    min-height:660px!important;
    padding-bottom:28px!important;
  }

  /* Main hero copy gets a deliberate left-side content column */
  .hero-grid.hero-grid-single .hero-chip,
  .hero-grid.hero-grid-single h1,
  .hero-grid.hero-grid-single .lead,
  .hero-grid.hero-grid-single .actions,
  .hero-grid.hero-grid-single .hero-mini-links,
  .hero-grid.hero-grid-single .hero-carousel-controls{
    max-width:700px!important;
  }

  .hero-grid.hero-grid-single h1{
    width:700px!important;
    font-size:clamp(4.2rem,5.2vw,6.3rem)!important;
  }

  /* Slightly tighten only the wide red line so it doesn't push toward the cards */
  .hero-grid.hero-grid-single h1 span{
    display:block;
    max-width:650px!important;
    font-size:.93em!important;
  }

  .hero-grid.hero-grid-single .lead{
    max-width:660px!important;
  }

  /* Dedicated right-side column */
  .hero-live-strip{
    top:50%!important;
    right:max(42px,calc((100vw - 1540px)/2))!important;
    left:auto!important;
    bottom:auto!important;
    transform:translateY(-43%)!important;
    width:370px!important;
    display:flex!important;
    flex-direction:column!important;
    gap:16px!important;
  }

  .hero-live-server{
    min-height:160px!important;
    padding:20px 20px 18px!important;
  }

  .hero-live-discord{
    min-height:134px!important;
    padding:19px 20px!important;
  }

  .hero-live-server,
  .hero-live-discord{
    background:rgba(4,6,8,.68)!important;
    border-color:rgba(255,255,255,.11)!important;
    box-shadow:0 16px 42px rgba(0,0,0,.22)!important;
  }

  .hero-live-copy span,
  .hero-live-number>span,
  .hero-discord-stat>span{
    font-size:.61rem!important;
  }

  .hero-live-copy strong{
    font-size:1.08rem!important;
  }

  .hero-live-number strong{
    font-size:1.72rem!important;
  }

  .hero-discord-stat strong{
    font-size:1.5rem!important;
  }

  .hero-live-action{
    font-size:.65rem!important;
    padding:11px 13px!important;
  }

  /* Make the status cards feel like one grouped element */
  .hero-live-server{
    border-bottom-left-radius:5px!important;
    border-bottom-right-radius:5px!important;
  }

  .hero-live-discord{
    border-top-left-radius:5px!important;
    border-top-right-radius:5px!important;
  }
}

/* Medium desktop — preserve separation without forcing overlap */
@media(max-width:1450px) and (min-width:1101px){
  .hero-live-strip{
    right:24px!important;
    width:350px!important;
  }

  .hero-grid.hero-grid-single h1{
    width:650px!important;
    font-size:clamp(4rem,5vw,5.8rem)!important;
  }

  .hero-grid.hero-grid-single h1 span{
    max-width:600px!important;
  }

  .hero-grid.hero-grid-single .lead{
    max-width:610px!important;
  }
}

/* Smaller desktop — keep a visible breathing gap between hero copy and stats */
@media(max-width:1280px) and (min-width:1101px){
  .hero-live-strip{
    width:325px!important;
    right:18px!important;
  }

  .hero-grid.hero-grid-single h1{
    width:590px!important;
    font-size:clamp(3.7rem,4.7vw,5.25rem)!important;
  }

  .hero-grid.hero-grid-single h1 span{
    max-width:550px!important;
  }

  .hero-grid.hero-grid-single .lead{
    max-width:560px!important;
  }
}

/* Tablet/mobile keep the responsive stacked behaviour from earlier versions */
@media(max-width:1100px){
  .hero-grid.hero-grid-single h1,
  .hero-grid.hero-grid-single h1 span,
  .hero-grid.hero-grid-single .lead{
    width:auto!important;
    max-width:none!important;
  }
}


/* v56 — live stats moved below the hero */
.hero-live-strip{
  display:none!important;
}

.hero-grid.hero-grid-single>.reveal:first-child{
  min-height:600px!important;
  padding-bottom:28px!important;
}

/* Undo prior desktop restrictions introduced only to fit the side cards */
@media(min-width:1101px){
  .hero-grid.hero-grid-single .hero-chip,
  .hero-grid.hero-grid-single h1,
  .hero-grid.hero-grid-single .lead,
  .hero-grid.hero-grid-single .actions,
  .hero-grid.hero-grid-single .hero-mini-links,
  .hero-grid.hero-grid-single .hero-carousel-controls{
    max-width:760px!important;
  }

  .hero-grid.hero-grid-single h1{
    width:auto!important;
    font-size:clamp(4.4rem,5.6vw,6.6rem)!important;
  }

  .hero-grid.hero-grid-single h1 span{
    max-width:none!important;
    font-size:1em!important;
  }

  .hero-grid.hero-grid-single .lead{
    max-width:700px!important;
  }
}

.hero-grid.hero-grid-single .hero-carousel-controls{
  margin-bottom:0!important;
}

.home-live-overview{
  position:relative;
  z-index:8;
  padding:18px 0 24px;
  border-top:1px solid rgba(226,25,32,.20);
  border-bottom:1px solid var(--line);
  background:
    linear-gradient(180deg,rgba(9,11,14,.98),rgba(3,5,7,.99));
}

.home-live-overview-grid{
  display:grid;
  grid-template-columns:minmax(0,1.55fr) minmax(330px,.75fr);
  gap:12px;
}

.home-live-card{
  position:relative;
  overflow:hidden;
  min-height:210px;
  display:flex;
  flex-direction:column;
  padding:22px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:7px;
  background:
    linear-gradient(145deg,rgba(255,255,255,.022),transparent 42%),
    #07090c;
}

.home-live-card:before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:3px;
}

.home-live-card.server:before{
  background:linear-gradient(180deg,#ff3339,#a90e14);
}

.home-live-card.discord:before{
  background:linear-gradient(180deg,#8992ff,#5865f2);
}

.home-live-card-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:24px;
}

.home-live-eyebrow{
  display:block;
  color:#9098a0;
  font-size:.62rem;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.home-live-status-row{
  display:flex;
  align-items:center;
  gap:9px;
  margin-top:7px;
}

.home-live-status-row strong,
.home-live-community-name{
  color:#fff;
  font-family:Oswald,sans-serif;
  font-size:1.35rem;
  line-height:1;
  text-transform:uppercase;
}

.home-live-status-row strong.online{
  color:#73e6a0;
}

.home-live-status-row strong.offline{
  color:#ff6c71;
}

.home-live-dot{
  width:9px;
  height:9px;
  border-radius:50%;
  background:#6ee7a0;
  box-shadow:0 0 0 5px rgba(110,231,160,.07),0 0 14px rgba(110,231,160,.30);
}

.home-live-primary-stat{
  text-align:right;
}

.home-live-primary-stat strong{
  display:block;
  color:#fff;
  font-family:Oswald,sans-serif;
  font-size:2.8rem;
  line-height:.9;
}

.home-live-primary-stat small{
  color:#848c94;
  font-size:1.15rem;
}

.home-live-primary-stat>span{
  display:block;
  margin-top:6px;
  color:#8f979f;
  font-size:.6rem;
  font-weight:900;
  letter-spacing:.09em;
  text-transform:uppercase;
}

.home-live-capacity{
  margin-top:19px;
}

.home-live-capacity-label{
  display:flex;
  justify-content:space-between;
  margin-bottom:8px;
  color:#8e969e;
  font-size:.61rem;
  font-weight:900;
  letter-spacing:.09em;
  text-transform:uppercase;
}

.home-live-capacity-label strong{
  color:#fff;
}

.home-live-capacity .capacity-track{
  height:7px;
  border:0;
  border-radius:20px;
  background:#161a1f;
}

.home-live-capacity .capacity-track span{
  border-radius:20px;
  background:linear-gradient(90deg,#a70e14,#e21920);
}

.home-live-details{
  display:flex;
  gap:26px;
  margin:18px 0;
}

.home-live-details span{
  display:block;
  padding-right:26px;
  border-right:1px solid rgba(255,255,255,.08);
}

.home-live-details span:last-child{
  border-right:0;
}

.home-live-details b,
.home-live-details small{
  display:block;
}

.home-live-details b{
  color:#e6e8ea;
  font-size:.76rem;
}

.home-live-details small{
  margin-top:3px;
  color:#828a92;
  font-size:.66rem;
}

.home-live-button{
  display:block;
  width:100%;
  margin-top:auto;
  padding:12px 14px;
  border:1px solid;
  border-radius:4px;
  text-align:center;
  color:#fff;
  font-size:.66rem;
  font-weight:900;
  letter-spacing:.06em;
  text-decoration:none;
  text-transform:uppercase;
  transition:.18s ease;
}

.server-button{
  border-color:rgba(226,25,32,.54);
  background:rgba(226,25,32,.10);
}

.server-button:hover{
  background:#e21920;
}

.discord-button{
  border-color:rgba(105,118,242,.52);
  background:rgba(88,101,242,.10);
}

.discord-button:hover{
  background:#5865f2;
}

.home-live-discord-badge{
  padding:6px 8px;
  border:1px solid rgba(105,118,242,.35);
  color:#aeb5ff;
  background:rgba(88,101,242,.07);
  font-size:.58rem;
  font-weight:900;
  letter-spacing:.09em;
}

.home-live-discord-stats{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:9px;
  margin:20px 0 15px;
}

.home-live-discord-stats>div{
  padding:14px;
  border:1px solid rgba(255,255,255,.08);
  background:#05070a;
}

.home-live-discord-stats strong{
  display:block;
  color:#fff;
  font-family:Oswald,sans-serif;
  font-size:2rem;
  line-height:1;
}

.home-live-discord-stats span{
  display:block;
  margin-top:6px;
  color:#8b939b;
  font-size:.58rem;
  font-weight:900;
  letter-spacing:.09em;
  text-transform:uppercase;
}

.home-live-card.discord p{
  color:#9098a0;
  font-size:.73rem;
  line-height:1.6;
  margin:0 0 15px;
}

@media(max-width:900px){
  .home-live-overview-grid{
    grid-template-columns:1fr;
  }

  .home-live-card{
    min-height:0;
  }
}

@media(max-width:600px){
  .home-live-overview{
    padding:12px 0 18px;
  }

  .home-live-card{
    padding:17px;
  }

  .home-live-primary-stat strong{
    font-size:2.3rem;
  }

  .home-live-details{
    flex-direction:column;
    gap:8px;
  }

  .home-live-details span{
    padding-right:0;
    border-right:0;
  }
}


/* v57 — keep under-hero stats visible on first load */
@media(min-width:1001px){
  /* Shorten the hero without making the content feel cramped */
  .hero-grid.hero-grid-single>.reveal:first-child{
    min-height:500px!important;
    padding-top:34px!important;
    padding-bottom:22px!important;
  }

  .hero-grid.hero-grid-single h1{
    font-size:clamp(3.9rem,5vw,5.8rem)!important;
    line-height:.91!important;
    margin-top:10px!important;
    margin-bottom:15px!important;
  }

  .hero-grid.hero-grid-single .lead{
    max-width:690px!important;
    margin-bottom:14px!important;
    line-height:1.55!important;
  }

  .hero-grid.hero-grid-single .actions{
    margin-top:12px!important;
    margin-bottom:11px!important;
  }

  .hero-grid.hero-grid-single .hero-mini-links{
    margin-top:10px!important;
  }

  .hero-grid.hero-grid-single .hero-carousel-controls{
    margin-top:10px!important;
    margin-bottom:0!important;
  }

  /* Pull the stats visually closer to the carousel edge */
  .home-live-overview{
    padding:12px 0 16px!important;
  }

  .home-live-overview-grid{
    gap:10px!important;
  }

  .home-live-card{
    min-height:168px!important;
    padding:16px 18px!important;
  }

  .home-live-card-head{
    gap:18px!important;
  }

  .home-live-primary-stat strong{
    font-size:2.35rem!important;
  }

  .home-live-status-row{
    margin-top:5px!important;
  }

  .home-live-status-row strong,
  .home-live-community-name{
    font-size:1.18rem!important;
  }

  .home-live-capacity{
    margin-top:12px!important;
  }

  .home-live-details{
    margin:12px 0!important;
    gap:20px!important;
  }

  .home-live-discord-stats{
    margin:12px 0 10px!important;
  }

  .home-live-discord-stats>div{
    padding:11px 12px!important;
  }

  .home-live-discord-stats strong{
    font-size:1.65rem!important;
  }

  .home-live-card.discord p{
    margin:0 0 10px!important;
    line-height:1.45!important;
  }

  .home-live-button{
    padding:10px 13px!important;
  }
}

/* Larger desktop displays can afford a touch more hero height */
@media(min-width:1500px) and (min-height:900px){
  .hero-grid.hero-grid-single>.reveal:first-child{
    min-height:525px!important;
  }
}

/* Short laptop/browser-height displays: prioritise first-screen visibility */
@media(min-width:1001px) and (max-height:850px){
  .hero-grid.hero-grid-single>.reveal:first-child{
    min-height:455px!important;
    padding-top:24px!important;
    padding-bottom:16px!important;
  }

  .hero-grid.hero-grid-single h1{
    font-size:clamp(3.55rem,4.5vw,5.1rem)!important;
    margin-top:6px!important;
    margin-bottom:10px!important;
  }

  .hero-grid.hero-grid-single .lead{
    margin-bottom:9px!important;
  }

  .hero-grid.hero-grid-single .actions{
    margin-top:8px!important;
    margin-bottom:8px!important;
  }

  .hero-grid.hero-grid-single .hero-mini-links{
    margin-top:7px!important;
  }

  .hero-grid.hero-grid-single .hero-carousel-controls{
    margin-top:7px!important;
  }

  .home-live-overview{
    padding-top:9px!important;
    padding-bottom:12px!important;
  }

  .home-live-card{
    min-height:154px!important;
    padding:14px 16px!important;
  }

  .home-live-details{
    margin:9px 0!important;
  }

  .home-live-discord-stats{
    margin:9px 0!important;
  }

  .home-live-card.discord p{
    display:none!important;
  }
}

/* Tablet/mobile retain comfortable stacked layout */
@media(max-width:1000px){
  .hero-grid.hero-grid-single>.reveal:first-child{
    min-height:620px!important;
  }

  .home-live-overview{
    padding:14px 0 18px!important;
  }
}


/* v58 — true split hero: carousel left, stats column right */
.home-live-overview{display:none!important}

.hero.hero-split{
  background:#030405;
  border-bottom:1px solid var(--line);
}

.hero-split-wrap{
  display:grid;
  grid-template-columns:minmax(0,1fr) 390px;
  min-height:610px;
  width:100%;
  max-width:none;
  margin:0;
}

.hero-split-left{
  position:relative;
  min-width:0;
  overflow:hidden;
  border-right:1px solid rgba(226,25,32,.22);
}

.hero-split-left .hero-grid.hero-grid-single{
  width:100%!important;
  max-width:none!important;
  min-height:610px!important;
  margin:0!important;
  padding:0!important;
}

.hero-split-left .hero-grid.hero-grid-single>.reveal:first-child{
  min-height:610px!important;
  padding-top:52px!important;
  padding-bottom:34px!important;
  border-right:0!important;
}

.hero-split-left .hero-chip,
.hero-split-left h1,
.hero-split-left .lead,
.hero-split-left .actions,
.hero-split-left .hero-mini-links,
.hero-split-left .hero-carousel-controls{
  margin-left:max(34px,calc((100vw - 1500px)/2))!important;
  margin-right:40px!important;
}

.hero-split-left h1{
  width:auto!important;
  max-width:760px!important;
  font-size:clamp(4.2rem,5.4vw,6.3rem)!important;
  line-height:.9!important;
}

.hero-split-left h1 span{
  display:block;
  max-width:none!important;
  font-size:1em!important;
}

.hero-split-left .lead{
  max-width:690px!important;
}

.hero-split-left .hero-carousel-controls{
  margin-bottom:0!important;
}

.hero-split-right{
  position:relative;
  display:flex;
  flex-direction:column;
  gap:14px;
  padding:24px 22px;
  background:
    radial-gradient(circle at 100% 0%,rgba(226,25,32,.07),transparent 28%),
    linear-gradient(180deg,#07090c,#030405);
}

.hero-side-panel{
  position:relative;
  display:flex;
  flex-direction:column;
  flex:1 1 0;
  min-height:0;
  padding:22px 20px;
  border:1px solid rgba(255,255,255,.10);
  border-left:3px solid #e21920;
  border-radius:7px;
  background:rgba(8,10,13,.86);
}

.hero-side-panel.discord-panel{
  flex:.78 1 0;
  border-left-color:#6673f1;
}

.hero-side-panel-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
}

.hero-side-kicker{
  display:block;
  color:#f04b50;
  font-size:.62rem;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.hero-side-kicker.discord{
  color:#9ea6ff;
}

.hero-side-panel h2{
  margin:5px 0 0;
  font-family:Oswald,sans-serif;
  font-size:1.45rem;
  text-transform:uppercase;
}

.hero-side-online{
  display:flex;
  align-items:center;
  gap:7px;
  padding:7px 9px;
  border:1px solid rgba(110,231,160,.16);
  background:rgba(110,231,160,.045);
}

.hero-side-dot{
  width:8px;
  height:8px;
  border-radius:50%;
  background:#6ee7a0;
  box-shadow:0 0 0 4px rgba(110,231,160,.07);
}

.hero-side-online strong{
  color:#72e6a0;
  font-size:.65rem;
  text-transform:uppercase;
}

.hero-side-player-stat{
  display:grid;
  grid-template-columns:1.35fr .65fr;
  gap:9px;
  margin-top:20px;
}

.hero-side-player-stat>div,
.hero-side-details>div,
.hero-side-discord-stats>div{
  padding:13px;
  border:1px solid rgba(255,255,255,.075);
  background:#05070a;
}

.hero-side-player-stat span,
.hero-side-details span,
.hero-side-discord-stats span{
  display:block;
  color:#858d95;
  font-size:.57rem;
  font-weight:900;
  letter-spacing:.09em;
  text-transform:uppercase;
}

.hero-side-player-stat strong{
  display:block;
  margin-top:5px;
  color:#fff;
  font-family:Oswald,sans-serif;
  font-size:2.25rem;
  line-height:1;
}

.hero-side-player-stat small{
  color:#818991;
  font-size:1rem;
}

.hero-side-access strong{
  font-size:1rem!important;
  margin-top:9px!important;
}

.hero-side-capacity{
  margin-top:14px;
}

.hero-side-capacity>div:first-child{
  display:flex;
  justify-content:space-between;
  margin-bottom:7px;
  color:#858d95;
  font-size:.59rem;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.hero-side-capacity>div:first-child strong{
  color:#fff;
}

.hero-side-capacity .capacity-track{
  height:7px;
  border:0;
  border-radius:12px;
  background:#15191e;
}

.hero-side-capacity .capacity-track span{
  border-radius:12px;
  background:linear-gradient(90deg,#a60d13,#e21920);
}

.hero-side-details{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:9px;
  margin-top:14px;
}

.hero-side-details strong{
  display:block;
  margin-top:5px;
  color:#e5e7e9;
  font-size:.72rem;
}

.hero-side-button{
  display:block;
  width:100%;
  margin-top:auto;
  padding:12px 13px;
  border:1px solid;
  border-radius:4px;
  color:#fff;
  text-align:center;
  text-decoration:none;
  font-size:.65rem;
  font-weight:900;
  letter-spacing:.055em;
  text-transform:uppercase;
}

.hero-side-button.server{
  margin-top:16px;
  border-color:rgba(226,25,32,.52);
  background:rgba(226,25,32,.10);
}

.hero-side-button.server:hover{
  background:#e21920;
}

.hero-side-discord-badge{
  padding:6px 7px;
  border:1px solid rgba(102,115,241,.35);
  color:#adb3ff;
  font-size:.56rem;
  font-weight:900;
}

.hero-side-discord-stats{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:9px;
  margin:18px 0 13px;
}

.hero-side-discord-stats strong{
  display:block;
  color:#fff;
  font-family:Oswald,sans-serif;
  font-size:2rem;
  line-height:1;
}

.hero-side-panel.discord-panel p{
  color:#8e969e;
  font-size:.72rem;
  line-height:1.55;
  margin:0 0 13px;
}

.hero-side-button.discord{
  border-color:rgba(102,115,241,.48);
  background:rgba(88,101,242,.09);
}

.hero-side-button.discord:hover{
  background:#5865f2;
}

/* Laptop */
@media(max-width:1280px) and (min-width:901px){
  .hero-split-wrap{
    grid-template-columns:minmax(0,1fr) 340px;
  }

  .hero-split-right{
    padding:18px 16px;
  }

  .hero-side-panel{
    padding:18px 16px;
  }

  .hero-split-left h1{
    font-size:clamp(3.7rem,4.8vw,5.25rem)!important;
    max-width:650px!important;
  }

  .hero-split-left .hero-chip,
  .hero-split-left h1,
  .hero-split-left .lead,
  .hero-split-left .actions,
  .hero-split-left .hero-mini-links,
  .hero-split-left .hero-carousel-controls{
    margin-left:30px!important;
    margin-right:28px!important;
  }
}

/* Tablet/mobile: stack stats below image rather than overlaying */
@media(max-width:900px){
  .hero-split-wrap{
    grid-template-columns:1fr;
  }

  .hero-split-left{
    border-right:0;
  }

  .hero-split-left .hero-grid.hero-grid-single,
  .hero-split-left .hero-grid.hero-grid-single>.reveal:first-child{
    min-height:590px!important;
  }

  .hero-split-right{
    display:grid;
    grid-template-columns:1fr 1fr;
    padding:14px;
    border-top:1px solid rgba(226,25,32,.20);
  }

  .hero-side-panel,
  .hero-side-panel.discord-panel{
    min-height:260px;
  }
}

@media(max-width:620px){
  .hero-split-right{
    grid-template-columns:1fr;
  }

  .hero-side-panel,
  .hero-side-panel.discord-panel{
    min-height:0;
  }
}


/* v59 — polish the split hero stats column */
@media(min-width:901px){
  .hero-split-wrap{
    grid-template-columns:minmax(0,1fr) 380px!important;
    min-height:600px!important;
  }

  .hero-split-left .hero-grid.hero-grid-single,
  .hero-split-left .hero-grid.hero-grid-single>.reveal:first-child{
    min-height:600px!important;
  }

  .hero-split-right{
    min-height:600px!important;
    height:600px!important;
    box-sizing:border-box;
    padding:18px 18px!important;
    gap:12px!important;
    overflow:hidden!important;
  }

  /* Give both cards exact, predictable space */
  .hero-side-panel{
    flex:none!important;
    height:338px!important;
    min-height:338px!important;
    box-sizing:border-box;
    padding:18px!important;
  }

  .hero-side-panel.discord-panel{
    flex:none!important;
    height:214px!important;
    min-height:214px!important;
    padding:17px 18px!important;
  }

  /* Prevent the server button from being pushed outside the card */
  .hero-side-button.server{
    margin-top:auto!important;
    flex:0 0 auto;
  }

  /* Player number should always stay on one line */
  .hero-side-player-stat strong{
    white-space:nowrap!important;
    display:flex!important;
    align-items:baseline;
    gap:3px;
  }

  .hero-side-player-stat strong > span{
    display:inline!important;
  }

  .hero-side-player-stat small{
    display:inline!important;
    white-space:nowrap!important;
  }

  /* Cleaner player/access cards */
  .hero-side-player-stat{
    margin-top:14px!important;
    gap:8px!important;
  }

  .hero-side-player-stat>div,
  .hero-side-details>div{
    padding:11px 12px!important;
  }

  .hero-side-player-stat strong{
    font-size:1.9rem!important;
  }

  .hero-side-access strong{
    font-size:.95rem!important;
  }

  .hero-side-capacity{
    margin-top:11px!important;
  }

  .hero-side-details{
    margin-top:11px!important;
    gap:8px!important;
  }

  .hero-side-details strong{
    font-size:.69rem!important;
  }

  /* Compact Discord card so it fits comfortably */
  .hero-side-discord-stats{
    margin:12px 0 9px!important;
    gap:8px!important;
  }

  .hero-side-discord-stats>div{
    padding:10px 11px!important;
  }

  .hero-side-discord-stats strong{
    font-size:1.7rem!important;
  }

  .hero-side-panel.discord-panel p{
    margin:0 0 9px!important;
    font-size:.68rem!important;
    line-height:1.4!important;
  }

  .hero-side-button.discord{
    margin-top:auto!important;
    flex:0 0 auto;
    padding:10px 12px!important;
  }

  /* Slightly softer panel contrast so it feels integrated, not boxed-on */
  .hero-side-panel{
    background:rgba(7,9,12,.92)!important;
    border-color:rgba(255,255,255,.09)!important;
  }

  .hero-side-panel.discord-panel{
    background:rgba(7,9,12,.92)!important;
  }
}

/* Ensure medium desktop still fits without clipping */
@media(max-width:1280px) and (min-width:901px){
  .hero-split-wrap{
    grid-template-columns:minmax(0,1fr) 350px!important;
  }

  .hero-split-right{
    padding:16px 14px!important;
  }

  .hero-side-panel{
    padding:16px!important;
  }

  .hero-side-panel.discord-panel{
    padding:15px 16px!important;
  }
}





/* v67 — FINAL shared metric system. FiveM + Discord use identical value styling. */
.hero-side-metric.hero-side-metric-players,
.hero-side-discord-stats .hero-side-metric-discord{
  min-height:96px!important;
  box-sizing:border-box!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  align-items:flex-start!important;
  padding:14px!important;
  border:1px solid rgba(255,255,255,.075)!important;
  background:#05070a!important;
}

/* Primary values: 0, 1,082 and 55 are IDENTICAL */
.hero-side-metric-players > .hero-stat-value,
.hero-side-metric-discord > .hero-stat-value{
  display:block!important;
  margin:0!important;
  padding:0!important;
  color:#fff!important;
  font-family:Oswald,sans-serif!important;
  font-size:2.35rem!important;
  font-weight:700!important;
  font-style:normal!important;
  line-height:.92!important;
  letter-spacing:0!important;
  text-transform:none!important;
  white-space:nowrap!important;
  opacity:1!important;
}

/* The actual FiveM player count must inherit the large number style */
.hero-side-metric-players > .hero-stat-value > [data-enhanced-players]{
  display:inline!important;
  margin:0!important;
  padding:0!important;
  color:#fff!important;
  font-family:Oswald,sans-serif!important;
  font-size:inherit!important;
  font-weight:inherit!important;
  line-height:inherit!important;
  letter-spacing:0!important;
  text-transform:none!important;
  opacity:1!important;
}

/* / 64 remains secondary while keeping the same typeface */
.hero-side-metric-players .hero-stat-max{
  display:inline!important;
  margin-left:3px!important;
  padding:0!important;
  color:#9199a1!important;
  font-family:Oswald,sans-serif!important;
  font-size:1.1rem!important;
  font-weight:600!important;
  line-height:1!important;
  letter-spacing:0!important;
  text-transform:none!important;
  opacity:1!important;
}

.hero-side-metric-players .hero-stat-max [data-enhanced-max]{
  display:inline!important;
  margin:0!important;
  padding:0!important;
  color:inherit!important;
  font-family:inherit!important;
  font-size:inherit!important;
  font-weight:inherit!important;
  line-height:inherit!important;
  letter-spacing:0!important;
  text-transform:none!important;
  opacity:1!important;
}

/* All three metric labels match */
.hero-side-metric-players > .hero-stat-label,
.hero-side-metric-discord > .hero-stat-label{
  display:block!important;
  margin-top:8px!important;
  padding:0!important;
  color:#8f979f!important;
  font-family:Inter,sans-serif!important;
  font-size:.62rem!important;
  font-weight:800!important;
  line-height:1.2!important;
  letter-spacing:.09em!important;
  text-transform:uppercase!important;
}

/* Remove generic span typography from inside the player metric */
.hero-side-player-stat .hero-side-metric-players span{
  font-family:inherit;
}

/* Access card is deliberately text, not a numeric metric */
.hero-side-access{
  min-height:96px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
}
.hero-side-access > span{
  color:#8f979f!important;
  font-family:Inter,sans-serif!important;
  font-size:.62rem!important;
  font-weight:800!important;
  line-height:1.2!important;
  letter-spacing:.09em!important;
  text-transform:uppercase!important;
}
.hero-side-access > strong{
  margin-top:8px!important;
  color:#fff!important;
  font-family:Oswald,sans-serif!important;
  font-size:1.45rem!important;
  font-weight:700!important;
  line-height:1!important;
}

/* Keep both Discord values using exactly the shared number styling */
.hero-side-discord-stats .hero-side-metric-discord > .hero-stat-value{
  margin-bottom:0!important;
}

@media(max-width:1280px) and (min-width:901px){
  .hero-side-metric-players > .hero-stat-value,
  .hero-side-metric-discord > .hero-stat-value{
    font-size:2.15rem!important;
  }
  .hero-side-metric-players .hero-stat-max{
    font-size:1.02rem!important;
  }
}


/* v68 — fit both live cards cleanly inside the hero column */
@media(min-width:901px){

  .hero-split-right{
    height:600px!important;
    min-height:600px!important;
    box-sizing:border-box!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    gap:12px!important;
    padding:14px 16px!important;
    overflow:hidden!important;
  }

  /* FiveM card: slightly more compact */
  .hero-side-panel{
    flex:none!important;
    min-height:0!important;
    height:auto!important;
    padding:16px 18px!important;
  }

  .hero-side-panel:not(.discord-panel){
    height:318px!important;
  }

  /* Discord card: enough space for its button, without extending below hero */
  .hero-side-panel.discord-panel{
    height:230px!important;
    padding:15px 18px!important;
  }

  /* tighter FiveM internal rhythm */
  .hero-side-panel-head{
    gap:12px!important;
  }

  .hero-side-player-stat{
    margin-top:12px!important;
    gap:8px!important;
  }

  .hero-side-metric,
  .hero-side-access{
    min-height:84px!important;
    padding:11px 12px!important;
  }

  .hero-side-capacity{
    margin-top:10px!important;
  }

  .hero-side-capacity>div:first-child{
    margin-bottom:5px!important;
  }

  .hero-side-capacity .capacity-track{
    height:6px!important;
  }

  .hero-side-details{
    margin-top:10px!important;
    gap:8px!important;
  }

  .hero-side-details>div{
    min-height:54px!important;
    padding:9px 11px!important;
  }

  .hero-side-details strong{
    margin-top:4px!important;
  }

  .hero-side-button.server{
    margin-top:10px!important;
    padding:10px 12px!important;
  }

  /* compact Discord section so button stays fully visible */
  .hero-side-panel.discord-panel .hero-side-panel-head{
    margin-bottom:0!important;
  }

  .hero-side-discord-stats{
    margin:11px 0 8px!important;
    gap:8px!important;
  }

  .hero-side-discord-stats>div{
    min-height:76px!important;
    padding:10px 11px!important;
  }

  .hero-side-panel.discord-panel p{
    margin:0 0 8px!important;
    font-size:.67rem!important;
    line-height:1.35!important;
  }

  .hero-side-button.discord{
    margin-top:auto!important;
    padding:10px 12px!important;
    flex:0 0 auto!important;
  }

  /* keep whole stack away from hero border */
  .hero-split-right:after{
    display:none!important;
  }
}

@media(max-width:1280px) and (min-width:901px){
  .hero-split-right{
    padding:12px 14px!important;
    gap:10px!important;
  }

  .hero-side-panel:not(.discord-panel){
    height:310px!important;
  }

  .hero-side-panel.discord-panel{
    height:224px!important;
  }
}


/* v69 — taller split hero so the right-hand stats column can breathe */
@media(min-width:901px){

  .hero-split-wrap{
    min-height:690px!important;
  }

  .hero-split-left .hero-grid.hero-grid-single,
  .hero-split-left .hero-grid.hero-grid-single>.reveal:first-child{
    min-height:690px!important;
  }

  .hero-split-left .hero-grid.hero-grid-single>.reveal:first-child{
    padding-top:64px!important;
    padding-bottom:46px!important;
  }

  /* restore a more spacious hero composition */
  .hero-split-left h1{
    font-size:clamp(4.45rem,5.6vw,6.6rem)!important;
    line-height:.91!important;
    max-width:800px!important;
  }

  .hero-split-left .lead{
    max-width:720px!important;
    line-height:1.58!important;
    margin-top:18px!important;
  }

  .hero-split-left .actions{
    margin-top:22px!important;
  }

  .hero-split-left .hero-mini-links{
    margin-top:18px!important;
  }

  .hero-split-left .hero-carousel-controls{
    margin-top:16px!important;
  }

  /* right column now uses the full taller hero height */
  .hero-split-right{
    height:690px!important;
    min-height:690px!important;
    padding:22px 18px!important;
    gap:16px!important;
    justify-content:center!important;
    overflow:hidden!important;
  }

  /* give the FiveM card more natural vertical room */
  .hero-side-panel:not(.discord-panel){
    height:360px!important;
    padding:20px!important;
  }

  .hero-side-panel.discord-panel{
    height:250px!important;
    padding:19px 20px!important;
  }

  .hero-side-player-stat{
    margin-top:16px!important;
    gap:10px!important;
  }

  .hero-side-metric,
  .hero-side-access{
    min-height:98px!important;
    padding:14px!important;
  }

  .hero-side-capacity{
    margin-top:14px!important;
  }

  .hero-side-details{
    margin-top:14px!important;
    gap:10px!important;
  }

  .hero-side-details>div{
    min-height:62px!important;
    padding:12px 13px!important;
  }

  .hero-side-button.server{
    margin-top:14px!important;
    padding:12px 14px!important;
  }

  /* Discord card gets room for description + button without clipping */
  .hero-side-discord-stats{
    margin:16px 0 12px!important;
    gap:10px!important;
  }

  .hero-side-discord-stats>div{
    min-height:88px!important;
    padding:13px!important;
  }

  .hero-side-panel.discord-panel p{
    margin:0 0 12px!important;
    font-size:.72rem!important;
    line-height:1.45!important;
  }

  .hero-side-button.discord{
    margin-top:auto!important;
    padding:11px 13px!important;
  }
}

/* medium desktop keeps the same balance at slightly reduced scale */
@media(max-width:1280px) and (min-width:901px){
  .hero-split-wrap,
  .hero-split-left .hero-grid.hero-grid-single,
  .hero-split-left .hero-grid.hero-grid-single>.reveal:first-child,
  .hero-split-right{
    min-height:660px!important;
    height:660px!important;
  }

  .hero-side-panel:not(.discord-panel){
    height:345px!important;
  }

  .hero-side-panel.discord-panel{
    height:235px!important;
  }
}


/* v70 — right stats use available hero height instead of fixed card heights */
@media(min-width:901px){

  .hero-split-wrap{
    min-height:690px!important;
  }

  .hero-split-left .hero-grid.hero-grid-single,
  .hero-split-left .hero-grid.hero-grid-single>.reveal:first-child{
    min-height:690px!important;
  }

  /* Use the restored height better on the left side */
  .hero-split-left .hero-grid.hero-grid-single>.reveal:first-child{
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    padding-top:40px!important;
    padding-bottom:40px!important;
  }

  .hero-split-left .hero-chip,
  .hero-split-left h1,
  .hero-split-left .lead,
  .hero-split-left .actions,
  .hero-split-left .hero-mini-links,
  .hero-split-left .hero-carousel-controls{
    flex:0 0 auto;
  }

  /* Right side is a strict two-row grid inside the exact hero height */
  .hero-split-right{
    height:690px!important;
    min-height:690px!important;
    box-sizing:border-box!important;
    display:grid!important;
    grid-template-rows:minmax(0,1.08fr) minmax(0,.92fr)!important;
    gap:14px!important;
    padding:18px!important;
    overflow:hidden!important;
    align-content:stretch!important;
  }

  .hero-side-panel,
  .hero-side-panel.discord-panel{
    height:100%!important;
    min-height:0!important;
    max-height:none!important;
    box-sizing:border-box!important;
    margin:0!important;
    overflow:hidden!important;
    display:flex!important;
    flex-direction:column!important;
  }

  /* FiveM card */
  .hero-side-panel:not(.discord-panel){
    padding:18px!important;
  }

  .hero-side-player-stat{
    margin-top:14px!important;
    gap:9px!important;
  }

  .hero-side-metric,
  .hero-side-access{
    min-height:88px!important;
    padding:12px 13px!important;
  }

  .hero-side-capacity{
    margin-top:11px!important;
  }

  .hero-side-details{
    margin-top:11px!important;
    gap:9px!important;
  }

  .hero-side-details>div{
    min-height:54px!important;
    padding:10px 11px!important;
  }

  .hero-side-button.server{
    margin-top:auto!important;
    padding:11px 13px!important;
    flex:0 0 auto!important;
  }

  /* Discord card */
  .hero-side-panel.discord-panel{
    padding:17px 18px!important;
  }

  .hero-side-discord-stats{
    margin:12px 0 9px!important;
    gap:9px!important;
  }

  .hero-side-discord-stats>div{
    min-height:78px!important;
    padding:11px 12px!important;
  }

  .hero-side-panel.discord-panel p{
    margin:0 0 9px!important;
    font-size:.69rem!important;
    line-height:1.4!important;
  }

  .hero-side-button.discord{
    margin-top:auto!important;
    padding:10px 12px!important;
    flex:0 0 auto!important;
  }

  /* Ensure both cards finish inside the exact same hero boundary */
  .hero-split-right,
  .hero-split-left{
    border-bottom:0!important;
  }
}

/* Medium desktop */
@media(max-width:1280px) and (min-width:901px){
  .hero-split-wrap,
  .hero-split-left .hero-grid.hero-grid-single,
  .hero-split-left .hero-grid.hero-grid-single>.reveal:first-child,
  .hero-split-right{
    min-height:660px!important;
    height:660px!important;
  }

  .hero-split-right{
    grid-template-rows:minmax(0,1.1fr) minmax(0,.9fr)!important;
    gap:12px!important;
    padding:14px!important;
  }

  .hero-side-panel:not(.discord-panel),
  .hero-side-panel.discord-panel{
    padding:15px!important;
  }
}


/* v71 — refined Code 44 main navigation */
.nav{
  position:sticky!important;
  top:0!important;
  z-index:1000!important;
  height:auto!important;
  border-bottom:1px solid rgba(226,25,32,.28)!important;
  background:rgba(3,4,6,.92)!important;
  backdrop-filter:blur(16px) saturate(115%)!important;
  -webkit-backdrop-filter:blur(16px) saturate(115%)!important;
  box-shadow:0 8px 28px rgba(0,0,0,.18)!important;
}

.nav .nav-inner{
  min-height:74px!important;
  display:grid!important;
  grid-template-columns:120px 1fr auto!important;
  align-items:center!important;
  gap:24px!important;
  max-width:1320px!important;
  margin:0 auto!important;
  padding:0 22px!important;
}

.nav .brand.with-logo{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  width:auto!important;
  height:100%!important;
}

.nav .brand-logo{
  width:70px!important;
  height:70px!important;
  object-fit:contain!important;
  display:block!important;
  filter:drop-shadow(0 4px 12px rgba(0,0,0,.32))!important;
  transition:transform .18s ease, filter .18s ease!important;
}

.nav .brand:hover .brand-logo{
  transform:translateY(-1px) scale(1.025)!important;
  filter:drop-shadow(0 6px 16px rgba(226,25,32,.12))!important;
}

.nav .nav-links{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:4px!important;
  min-width:0!important;
}

.nav .nav-links>a{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:38px!important;
  padding:0 11px!important;
  border-radius:5px!important;
  color:#d8dce0!important;
  font-family:Inter,sans-serif!important;
  font-size:.68rem!important;
  font-weight:800!important;
  letter-spacing:.025em!important;
  text-transform:uppercase!important;
  text-decoration:none!important;
  white-space:nowrap!important;
  transition:
    color .16s ease,
    background .16s ease,
    transform .16s ease!important;
}

.nav .nav-links>a:after{
  content:""!important;
  position:absolute!important;
  left:50%!important;
  bottom:3px!important;
  width:0!important;
  height:2px!important;
  background:#e21920!important;
  border-radius:2px!important;
  transform:translateX(-50%)!important;
  transition:width .18s ease!important;
}

.nav .nav-links>a:hover{
  color:#fff!important;
  background:rgba(255,255,255,.045)!important;
  transform:translateY(-1px)!important;
}

.nav .nav-links>a:hover:after{
  width:24px!important;
}

.nav .nav-links>a.active{
  color:#fff!important;
  background:rgba(226,25,32,.07)!important;
}

.nav .nav-links>a.active:after{
  width:30px!important;
}

.nav .nav-cta{
  min-width:132px!important;
  height:42px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0 17px!important;
  border:1px solid rgba(255,60,66,.82)!important;
  border-radius:6px!important;
  background:linear-gradient(180deg,#bd0f15,#8f0a0f)!important;
  box-shadow:
    inset 0 1px rgba(255,255,255,.06),
    0 8px 20px rgba(144,10,15,.16)!important;
  color:#fff!important;
  font-family:Inter,sans-serif!important;
  font-size:.68rem!important;
  font-weight:900!important;
  letter-spacing:.025em!important;
  text-transform:uppercase!important;
  text-decoration:none!important;
  white-space:nowrap!important;
  transition:transform .16s ease, background .16s ease, box-shadow .16s ease!important;
}

.nav .nav-cta:hover{
  transform:translateY(-1px)!important;
  background:linear-gradient(180deg,#e21920,#aa0c12)!important;
  box-shadow:
    inset 0 1px rgba(255,255,255,.08),
    0 10px 24px rgba(226,25,32,.20)!important;
}

/* Keep announcement strip visually separate from the primary nav */
.home-announcement{
  border-top:0!important;
  border-bottom:1px solid rgba(226,25,32,.20)!important;
  background:linear-gradient(90deg,rgba(29,5,8,.66),rgba(5,7,9,.97) 24%,rgba(5,7,9,.97))!important;
}

/* menu button */
.nav .menu-btn{
  width:42px!important;
  height:42px!important;
  display:none!important;
  align-items:center!important;
  justify-content:center!important;
  border:1px solid rgba(255,255,255,.12)!important;
  border-radius:6px!important;
  background:#080a0d!important;
  color:#fff!important;
}

/* Medium desktop: keep everything on one line */
@media(max-width:1180px) and (min-width:861px){
  .nav .nav-inner{
    grid-template-columns:88px 1fr auto!important;
    gap:12px!important;
    padding:0 16px!important;
  }

  .nav .brand-logo{
    width:60px!important;
    height:60px!important;
  }

  .nav .nav-links{
    gap:1px!important;
  }

  .nav .nav-links>a{
    padding:0 8px!important;
    font-size:.62rem!important;
  }

  .nav .nav-cta{
    min-width:116px!important;
    padding:0 12px!important;
    font-size:.63rem!important;
  }
}

/* Mobile navigation */
@media(max-width:860px){
  .nav .nav-inner{
    min-height:68px!important;
    grid-template-columns:1fr auto!important;
    gap:12px!important;
    padding:0 14px!important;
  }

  .nav .brand.with-logo{
    grid-column:1!important;
  }

  .nav .brand-logo{
    width:58px!important;
    height:58px!important;
  }

  .nav .menu-btn{
    display:flex!important;
    grid-column:2!important;
  }

  .nav .nav-links{
    position:absolute!important;
    left:12px!important;
    right:12px!important;
    top:calc(100% + 8px)!important;
    display:none!important;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:4px!important;
    padding:10px!important;
    border:1px solid rgba(255,255,255,.11)!important;
    border-radius:8px!important;
    background:rgba(5,7,9,.98)!important;
    box-shadow:0 18px 40px rgba(0,0,0,.35)!important;
  }

  .nav .nav-links.open{
    display:flex!important;
  }

  .nav .nav-links>a{
    min-height:44px!important;
    justify-content:flex-start!important;
    padding:0 13px!important;
    font-size:.72rem!important;
  }

  .nav .nav-links>a:after{
    display:none!important;
  }

  .nav .nav-cta{
    display:none!important;
  }
}


/* v72 — restore comfortable, accessible navigation text sizing */
@media(min-width:861px){
  .nav .nav-inner{
    max-width:1380px!important;
    grid-template-columns:112px minmax(0,1fr) auto!important;
    gap:18px!important;
  }

  .nav .nav-links{
    gap:3px!important;
  }

  .nav .nav-links>a{
    font-size:.78rem!important;
    line-height:1!important;
    letter-spacing:.018em!important;
    padding:0 10px!important;
    min-height:42px!important;
  }

  .nav .nav-cta{
    font-size:.76rem!important;
    min-width:136px!important;
    height:44px!important;
    padding:0 16px!important;
  }
}

/* Preserve readable sizing on narrower desktop/laptop screens too */
@media(max-width:1180px) and (min-width:861px){
  .nav .nav-inner{
    grid-template-columns:76px minmax(0,1fr) auto!important;
    gap:8px!important;
    padding-left:12px!important;
    padding-right:12px!important;
  }

  .nav .brand-logo{
    width:58px!important;
    height:58px!important;
  }

  .nav .nav-links{
    gap:0!important;
  }

  .nav .nav-links>a{
    font-size:.70rem!important;
    padding:0 6px!important;
    letter-spacing:0!important;
  }

  .nav .nav-cta{
    min-width:118px!important;
    font-size:.70rem!important;
    padding:0 10px!important;
  }
}

@media(max-width:860px){
  .nav .nav-links>a{
    font-size:.82rem!important;
    line-height:1.2!important;
    min-height:46px!important;
  }
}
