@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&family=Noto+Serif+SC:wght@600;700&display=swap');

/* ---------- guide page (install-guide.html) ---------- */
.guide{max-width:980px!important;padding-top:45px!important;padding-bottom:60px!important}
.guide h1{font-size:50px}
.guide h2{margin:32px 0 15px}
.guide p,.guide li{font-size:14px;line-height:1.8;margin-bottom:12px}
.guide a{color:var(--gold);text-decoration:underline}
.guide pre{white-space:pre-wrap;overflow-wrap:anywhere;padding:20px;background:var(--panel);line-height:1.7;border:1px solid var(--line)}
.guide code{overflow-wrap:anywhere}
.guide table{border-collapse:collapse;width:100%;font-size:13px;line-height:1.7}
.guide th,.guide td{padding:12px;border:1px solid var(--line);text-align:left;vertical-align:top}
.guide li{padding-left:8px}

/* ---------- tokens ---------- */
:root{
  color-scheme:dark;
  --bg:#140f0b;
  --bg-deep:#0c0908;
  --panel:#1d150f;
  --panel-alt:#241a12;
  --gold:#cd9f5a;
  --gold-bright:#f1cf8e;
  --gold-dim:#7f6338;
  --ember:#c15a3b;
  --jade:#5c9075;
  --text:#f2e9d8;
  --muted:#a7967c;
  --line:#3c2c1c;
  --line-soft:#2a2015;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:100px}
body{margin:0;background:var(--bg);color:var(--text);font:13px Manrope,Arial,sans-serif;background-image:radial-gradient(ellipse 900px 500px at 82% -8%,#3a241340,transparent 60%)}
button,a{-webkit-tap-highlight-color:transparent}
button{font:inherit;color:inherit;cursor:pointer;background:none;border:0}
a{color:inherit;text-decoration:none}
button,a{transition:color .2s,background .2s,border-color .2s}
button:hover,a:hover{color:var(--gold-bright)}
button:focus-visible,a:focus-visible{outline:2px solid var(--gold);outline-offset:5px}
h1,h2,h3,p{margin:0}
h2,h3{font-family:'Cinzel',Georgia,serif;font-weight:600;text-wrap:balance}
h2{font-size:32px}
h3{font-size:22px}
p{line-height:1.8;color:var(--muted)}

/* seal-stamp corner framing: two gold brackets, echoing the emblem's chop frame.
   (class-card uses its own top-accent + glow treatment instead, see .classes below,
   since it already needs ::after for the radial glow.) */
.featured,.community,dialog,.frame{position:relative}
.featured::before,.featured::after,
.community::before,.community::after,
.frame::before,.frame::after,
dialog::before,dialog::after{content:'';position:absolute;width:14px;height:14px;border:1.5px solid var(--gold-dim);pointer-events:none;z-index:1}
.featured::before,.community::before,.frame::before,dialog::before{top:-1px;left:-1px;border-right:0;border-bottom:0}
.featured::after,.community::after,.frame::after,dialog::after{bottom:-1px;right:-1px;border-left:0;border-top:0}

/* ---------- header ---------- */
.topbar{height:90px;display:flex;align-items:center;justify-content:space-between;padding:0 5%;position:sticky;top:0;z-index:10;background:#140f0bf5;backdrop-filter:blur(6px);border-bottom:1px solid var(--line);gap:25px}
.brand{display:flex;align-items:center;gap:13px;font-family:'Cinzel',Georgia,serif;font-size:23px;letter-spacing:1px}
.brand span:first-of-type{
  font-weight:700;
  background:linear-gradient(180deg,#f8e6b4 0%,#e0b877 30%,#cd9f5a 55%,#8a5a2c 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  -webkit-text-stroke:.4px #4a2a12;
  filter:drop-shadow(0 2px 0 #2c180a) drop-shadow(0 0 16px #c15a3b35);
}
.brand small{display:block;font:8px Manrope,Arial,sans-serif;letter-spacing:4px;margin-top:7px;color:var(--gold);-webkit-text-stroke:0}
.seal{height:44px;width:44px;flex-shrink:0;filter:drop-shadow(0 0 6px #cd9f5a30)}
.seal-lg{height:76px;width:76px}
/* Use the supplied Legends Reborn lockup in the header; the original child
   content remains visually hidden so the home link keeps its accessible name. */
.topbar .brand{width:188px;height:70px;gap:0;background:url(img/rebrand/legends-reborn-gold-lockup.png) center/contain no-repeat;flex-shrink:0}
.topbar .brand>*{opacity:0;pointer-events:none}
.topbar nav,.auth{display:flex;align-items:center;gap:27px}
.topbar nav a,.topbar nav button{padding:35px 0;color:#b7a98e;font-size:12px}
.topbar nav .active{border-bottom:2px solid var(--gold);color:var(--gold-bright)}
.auth{gap:23px}
.outline{border:1px solid var(--gold-dim);padding:13px 20px;color:var(--gold)}
.outline:hover{background:#cd9f5a15;border-color:var(--gold)}

/* ---------- hero ---------- */
.hero{min-height:560px;position:relative;overflow:hidden;
  background:
    linear-gradient(90deg,#0c0908 6%,#0c0908cc 30%,#0c090866 55%,#0c090833 75%,transparent 95%),
    linear-gradient(0deg,#0c0908 0%,transparent 30%,transparent 75%,#0c090899 100%),
    url(img/hero-bg.jpg) center 30%/cover no-repeat,
    linear-gradient(180deg,#1c130d,#100b08);
}
#ember-canvas{position:absolute;inset:0;z-index:1;pointer-events:none}
.hero-inner{position:relative;z-index:2;max-width:1240px;padding:66px 30px 85px;margin:auto}
.eyebrow{font-size:9px;letter-spacing:2.1px;font-weight:700;color:var(--gold)}
.eyebrow>span{display:inline-block;width:5px;height:5px;background:var(--gold);margin:0 7px 2px 0}
.hero-kicker{font:italic 500 18px/1.4 'Cinzel',Georgia,serif;margin-top:29px;color:#cbb896;font-style:normal;letter-spacing:.5px}
h1{font:600 clamp(46px,5vw,72px)/1.08 'Cinzel',Georgia,serif;letter-spacing:-.5px;margin:14px 0 20px;text-wrap:balance}
h1 em{font-style:normal;font-weight:600;color:var(--gold-bright)}
.intro{font-size:13px;max-width:46ch}
.hero-actions{display:flex;align-items:center;gap:28px;margin-top:30px}
.gold{
  clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px);
  background:linear-gradient(180deg,var(--gold-bright),var(--gold) 55%,#8a5a2c);
  padding:16px 26px;color:#241708;font-weight:800;font-size:11px;letter-spacing:.4px;
  border:1px solid #6b4322;
  box-shadow:inset 0 1px 0 #fff6d980,0 8px 24px -8px #cd9f5a70;
}
.gold:hover{background:linear-gradient(180deg,#fbe1ac,#dcb06e 55%,#a06f3a);color:#241708}
.gold span{margin-left:26px}
.hero-actions .gold{width:286px;height:58px;padding:0;border:0;clip-path:none;background:url(img/rebrand/play-ornament.png) center/contain no-repeat;color:transparent;box-shadow:none}
.hero-actions .gold:hover{background:url(img/rebrand/play-ornament.png) center/contain no-repeat;color:transparent;filter:brightness(1.12) drop-shadow(0 0 10px #c15a3b66)}
.hero-actions .gold span{display:none}
.outline{
  clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px);
}
.text-button{font-size:11px}
.play{display:inline-grid;place-items:center;border:1px solid var(--gold-dim);border-radius:50%;width:28px;height:28px;margin-right:8px;color:var(--gold)}
.hero-details{display:flex;gap:27px;margin-top:38px;color:#8a7a60;font-size:9px}
.hero-details b{font-weight:600;color:var(--muted);margin-left:9px}

.vertical{position:absolute;right:6%;top:60px;writing-mode:vertical-rl;letter-spacing:20px;z-index:1;
  font:34px 'Noto Serif SC','Songti SC',serif;color:#f1cf8e85;text-shadow:0 0 20px #000,0 0 40px #c15a3b40}

/* ---------- content shell ---------- */
.content{max-width:1240px;margin:auto;padding:0 30px}
.status-strip{position:relative;margin-top:-27px;background:var(--panel);border:1px solid var(--line);min-height:59px;display:flex;align-items:center;justify-content:space-between;padding:16px 23px;font-size:10px;gap:20px}
.status-strip>div{display:flex;align-items:center;gap:13px}
.status-dot{background:var(--gold);width:6px;height:6px;border-radius:50%;box-shadow:0 0 0 4px #cd9f5a1f;animation:pulse 2.6s ease-in-out infinite}
@keyframes pulse{0%,100%{box-shadow:0 0 0 4px #cd9f5a1f}50%{box-shadow:0 0 0 7px #cd9f5a0a}}
.muted{color:var(--muted)}
.tag{font-size:8px;letter-spacing:1px;border:1px solid var(--line);padding:5px 7px;color:var(--muted)}
.status-strip button{color:var(--gold);font-size:10px}
.status-strip button span{margin-left:20px}
.online-count{gap:8px!important}
#online-count{font:700 18px 'Cinzel',Georgia,serif;color:var(--gold-bright)}

.dashboard{display:grid;grid-template-columns:1.65fr 1fr;gap:40px;padding-top:43px}
.section-heading{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:23px}
.section-heading h2{margin-top:7px}
.issue{font-size:8px;letter-spacing:1.5px;color:#7a6a52}

.featured{display:grid;grid-template-columns:43% 1fr;border:1px solid var(--line);background:var(--panel);min-height:243px}
.news-art{position:relative;overflow:hidden;display:flex;align-items:end;padding:23px;background:linear-gradient(90deg,#160f0af2 0%,#160f0a99 55%,#160f0a33 100%),url(img/rebrand/realm-news-banner.png) center/cover no-repeat,#160f0a}
.news-art>span{position:absolute;right:0;top:-28px;font:230px 'Noto Serif SC',serif;color:#e3c08c14}
.news-art>div{position:relative;font:29px/1.1 'Cinzel',Georgia,serif;color:#ece0c9;letter-spacing:.5px}
.news-art em{font-style:normal;color:var(--gold-bright);font-size:25px}
.featured-copy{padding:25px}
.meta{display:flex;gap:18px;font-size:8px;letter-spacing:1px;color:var(--gold)}
.meta time{color:var(--muted)}
.featured h3{margin:16px 0 10px;font-size:27px;line-height:1.15}
.featured p{font-size:10px}
.link{color:var(--gold);font-size:10px;padding:0;margin-top:17px}
.link span{margin-left:20px}
.news-row{display:flex;align-items:center;gap:20px;padding:22px 0;border-bottom:1px solid var(--line)}
.date-block{font:28px 'Cinzel',Georgia,serif;color:var(--gold);text-align:center;border-right:1px solid var(--line);padding-right:20px}
.date-block small{display:block;font:8px Manrope;margin-top:5px;letter-spacing:1px}
.news-row h3{font-size:20px;margin:5px 0}
.news-row p{font-size:10px}
.news-row button,.news-row a{margin-left:auto;font-size:20px;color:var(--gold);text-decoration:none}
.news-row-guide{position:relative;overflow:hidden;isolation:isolate}
.news-row-guide::before{content:'';position:absolute;inset:0;z-index:-1;opacity:.2;background:linear-gradient(90deg,var(--bg) 0%,transparent 75%),url(img/rebrand/rebirth-guide-banner.png) right center/cover no-repeat}

.events .section-heading{margin-bottom:12px}
.events-note{font-size:9px;margin-bottom:13px}
.event{display:flex;gap:13px;align-items:center;padding:15px 0;border-top:1px solid var(--line)}
a.event{color:inherit;text-decoration:none}
.event-icon{width:37px;height:37px;display:grid;place-items:center;border:1px solid var(--line);background:var(--panel-alt);font-size:20px;color:var(--jade)}
.event-icon.ice{color:#8db9d6}
.event-icon.fire{background:#2c1b12;color:var(--ember)}
.event-icon.war{background:#241a12;color:var(--gold)}
.event-icon.quiz{background:#12211c;color:var(--jade)}
.event h3{font:600 11px Manrope,Arial}
.event p{font-size:9px;margin-top:4px}
.event time{margin-left:auto;color:var(--gold);font:13px monospace;white-space:nowrap}
.events>a.event{position:relative;overflow:hidden;isolation:isolate}
.events>a.event::before{content:'';position:absolute;inset:0;z-index:-1;opacity:.28;background:linear-gradient(90deg,var(--bg) 0%,#140f0bcc 55%,transparent 100%),url(img/rebrand/snow-banshee-event.png) center/cover no-repeat}
.schedule{display:flex;justify-content:space-between;width:100%;border:1px solid var(--line);padding:12px 15px;font-size:10px;color:var(--muted)}
.community{margin-top:19px;background:linear-gradient(90deg,#241a12f5 0%,#241a12ba 55%,#241a1244 100%),url(img/rebrand/guild-community-banner.png) center/cover no-repeat;border:1px solid var(--line);padding:22px}
.community h3{margin-top:7px}
.community p{font-size:10px}
.community button{font-size:10px;margin-top:13px;padding:0;color:var(--gold)}
.community button span{margin-left:40px}

/* ---------- classes ---------- */
.classes{margin-top:48px}
.classes .section-heading p{font-size:10px}
.class-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.class-card{text-align:left;background:var(--panel);border:1px solid var(--line);border-top:2px solid var(--accent,var(--gold-dim));padding:19px 18px 22px;position:relative;overflow:hidden}
.class-card::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 50% 0%,var(--accent,var(--gold))22,transparent 60%);opacity:.5;pointer-events:none}
.class-card:hover{border-color:var(--accent,var(--gold));background:var(--panel-alt)}
.class-card[data-class="Trojan"]{--accent:#b5482f}
.class-card[data-class="Warrior"]{--accent:#cd9f5a}
.class-card[data-class="Archer"]{--accent:#5c9075}
.class-card[data-class="Taoist"]{--accent:#8fa8cf}
.class-card small{color:var(--muted);font-size:8px;letter-spacing:1px}
.class-symbol{display:block;text-align:center;font-size:44px;padding:26px 0 22px;color:var(--accent,var(--gold));text-shadow:0 0 30px var(--accent,#cd9f5a)40;position:relative}
.class-card h3{font-size:23px;margin-bottom:8px;font-family:'Cinzel',Georgia,serif;position:relative}
.class-card>span:last-child{font-size:9px;color:var(--muted);display:flex;justify-content:space-between;position:relative}
.class-card b{color:var(--accent,var(--gold));font-weight:600}

.rankings{margin-top:48px;background:linear-gradient(90deg,#1d150ff5 0%,#1d150fe8 58%,#1d150faa 100%),url(img/rebrand/rankings-archive-background.png) center/cover no-repeat;border:1px solid var(--line);padding:28px 30px 8px}
.rankings-note{font-size:10px;margin-bottom:6px}
.rank-list{list-style:none;margin:14px 0 0;padding:0}
.rank-list li{display:flex;align-items:center;gap:16px;padding:13px 0;border-top:1px solid var(--line-soft)}
.rank-empty{color:var(--muted);font-size:11px;border-top:0!important}
.rank-num{width:28px;height:28px;flex-shrink:0;display:grid;place-items:center;font:700 12px 'Cinzel',Georgia,serif;color:var(--muted);border:1px solid var(--line)}
.rank-list li:nth-child(1) .rank-num{background:linear-gradient(180deg,#f8e6b4,#cd9f5a);color:#241708;border-color:#8a5a2c}
.rank-list li:nth-child(2) .rank-num{background:linear-gradient(180deg,#e7e7e7,#a8a8a8);color:#232323;border-color:#7a7a7a}
.rank-list li:nth-child(3) .rank-num{background:linear-gradient(180deg,#e3ab7c,#a9683c);color:#2a1608;border-color:#7a4a26}
.rank-name{font:600 13px Manrope;flex:1}
.rank-class{font-size:9px;color:var(--muted);letter-spacing:.5px;text-transform:uppercase}
.rank-level{font:700 15px 'Cinzel',Georgia,serif;color:var(--gold);white-space:nowrap}
.vip-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;margin:20px 0}
.vip-card{background:var(--panel);border:1px solid var(--line);padding:20px 18px;display:flex;flex-direction:column;gap:10px}
.vip-card h3{margin:0;font:700 15px 'Cinzel',Georgia,serif;color:var(--gold-bright)}
.vip-price{margin:0;font:700 24px 'Cinzel',Georgia,serif;color:var(--gold)}
.vip-card ul{list-style:none;margin:0;padding:0;flex:1;font-size:11px;line-height:1.9}
.vip-card ul li{padding-left:14px;position:relative}
.vip-card ul li::before{content:'✦';position:absolute;left:0;color:var(--gold-dim);font-size:9px;top:3px}
.vip-buy{width:100%;justify-content:center;text-align:center}
.vip-checkout{background:var(--panel-alt);border:1px solid var(--line);padding:18px 20px;display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-bottom:20px}
.vip-checkout label{font-size:10px;letter-spacing:.5px;color:var(--muted)}
.vip-checkout input{background:var(--bg-deep);border:1px solid var(--line);color:var(--text);padding:10px 12px;font:13px Manrope,Arial,sans-serif;min-width:200px}
.vip-checkout input:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
#vip-status{margin:0;width:100%;font-size:11px}
.rank-level small{font:8px Manrope;color:var(--muted);letter-spacing:1px;margin-right:4px}

.class-card.active{border-color:var(--accent,var(--gold));background:var(--panel-alt)}
.class-spotlight{margin-top:18px;background:var(--panel);border:1px solid var(--line);padding:0;display:grid;grid-template-columns:270px 1fr;align-items:stretch;min-height:400px;overflow:hidden}
.spotlight-portrait{position:relative;overflow:hidden;background:radial-gradient(circle at 50% 30%,var(--accent,var(--gold))22,transparent 70%)}
.spotlight-portrait img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block;
  -webkit-mask-image:linear-gradient(100deg,#000 55%,transparent 92%);
  mask-image:linear-gradient(100deg,#000 55%,transparent 92%)}
.spotlight-copy{padding:28px 32px 28px 8px}
.spotlight-symbol{display:inline-block;font-size:20px;color:var(--accent,var(--gold));margin-right:8px;vertical-align:middle}
.spotlight-copy h3{font-size:26px;margin:6px 0 10px}
.spotlight-copy p{font-size:11px;max-width:60ch}
.spotlight-skills{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}
.spotlight-skills span{font:600 9px Manrope;letter-spacing:.5px;text-transform:uppercase;color:var(--gold-bright);border:1px solid var(--line);background:var(--panel-alt);padding:6px 10px}
.spotlight-stats{display:grid;grid-template-columns:1fr;gap:9px;width:100%;max-width:360px}
.spotlight-stats div{display:grid;grid-template-columns:100px 1fr;align-items:center;gap:10px;font-size:9px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}
.spotlight-stats i{display:block;height:5px;background:var(--line);position:relative;font-style:normal}
.spotlight-stats i::before{content:'';position:absolute;top:0;left:0;bottom:0;background:linear-gradient(90deg,var(--gold-dim),var(--accent,var(--gold)))}
/* CSP on this site forbids inline styles, so bar widths and per-class accents are
   plain stylesheet rules rather than JS-set custom properties. */
.bar-50::before{width:50%}.bar-55::before{width:55%}.bar-60::before{width:60%}.bar-65::before{width:65%}
.bar-70::before{width:70%}.bar-75::before{width:75%}.bar-80::before{width:80%}.bar-85::before{width:85%}
.bar-90::before{width:90%}.bar-95::before{width:95%}
.class-spotlight.trojan{--accent:#b5482f}
.class-spotlight.warrior{--accent:#cd9f5a}
.class-spotlight.archer{--accent:#5c9075}
.class-spotlight.taoist{--accent:#8fa8cf}
@media(max-width:760px){.class-spotlight{grid-template-columns:1fr;min-height:0;text-align:center}.spotlight-portrait{height:220px}.spotlight-portrait img{-webkit-mask-image:linear-gradient(0deg,#000 55%,transparent 96%);mask-image:linear-gradient(0deg,#000 55%,transparent 96%)}.spotlight-copy{padding:22px}.spotlight-skills,.spotlight-stats{justify-content:center;margin-left:auto;margin-right:auto}}

.closing{display:flex;align-items:center;gap:26px;margin-top:45px;padding:34px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background-color:var(--bg);background-image:linear-gradient(90deg,#140f0bf5 0%,#140f0be8 38%,#140f0b88 100%),url(img/rebrand/legends-reborn-duel-hero.png);background-position:center;background-size:cover;background-repeat:no-repeat}
.closing h2{font-size:26px}
.closing p{font-size:10px;margin-top:5px}
.closing button{margin-left:auto;font-size:10px}

footer{max-width:1240px;margin:auto;padding:31px 30px;display:flex;align-items:center;justify-content:space-between;gap:25px;border-top:1px solid var(--line-soft)}
footer .brand{font-size:14px;display:flex}
footer .seal{height:30px;width:30px}
footer .brand small{font-size:6px;letter-spacing:2.5px}
footer p,footer button,footer a{font-size:9px;color:var(--muted)}
footer button:hover,footer a:hover{color:var(--gold-bright)}
footer>div{display:flex;gap:18px;align-items:center}
.vote-badge{display:flex;line-height:0}
.vote-badge img{height:30px;width:auto}
.admin-link{border:1px solid var(--line);padding:4px 9px;color:var(--gold)!important}

dialog{max-width:530px;width:calc(100% - 32px);background:var(--panel);color:var(--text);border:1px solid var(--gold-dim);padding:35px;box-shadow:0 20px 100px #0009}
dialog::backdrop{background:#08050366;backdrop-filter:blur(5px)}
dialog h2{margin:15px 0}
dialog p,dialog li{font-size:13px;line-height:1.9;color:var(--muted)}
dialog ol{padding-left:20px}
dialog .dismiss{margin-top:25px}
.close{position:absolute;top:10px;right:13px;font-size:25px}
.skip{position:fixed;top:-80px;left:10px;z-index:20;background:var(--gold);color:#1a1006;padding:12px}
.skip:focus{top:10px}

@media(min-width:1500px){.hero-inner{padding-top:85px;padding-bottom:100px}}
@media(max-width:1050px){
  .topbar{padding:0 25px}.topbar nav{gap:18px}.auth{gap:12px}.auth>button:first-child{display:none}
  .dashboard{gap:25px}.featured{grid-template-columns:1fr}.news-art{min-height:150px}
  .class-card{padding:15px 11px}.class-card>span:last-child{font-size:8px}
}
@media(max-width:760px){
  .topbar{height:auto;min-height:80px;flex-wrap:wrap;padding:18px 20px 0;gap:12px}
  .brand{font-size:17px}.seal{height:36px;width:36px}.topbar .brand{width:148px;height:52px}
  .auth .outline{padding:10px;font-size:10px}
  .topbar nav{order:3;width:100%;justify-content:space-between}
  .topbar nav a,.topbar nav button{padding:12px 0;font-size:10px}
  .hero-inner{padding:45px 22px 65px}.hero{min-height:540px}
  .vertical{display:none}
  .hero-details{gap:14px;font-size:8px}.hero-details b{margin-left:4px}
  .content{padding:0 20px}
  .status-strip{flex-wrap:wrap;padding:15px;gap:15px}.status-strip>div{gap:8px;font-size:9px}.status-strip button{display:none}
  .dashboard{grid-template-columns:1fr;padding-top:32px;gap:35px}
  .featured{grid-template-columns:40% 1fr}.featured-copy{padding:19px}.news-art{padding:15px}.news-art>div{font-size:22px}.news-art em{font-size:19px}.meta{flex-wrap:wrap;gap:6px}
  .class-grid{grid-template-columns:repeat(2,1fr)}
  .classes .section-heading{display:block}.classes .section-heading p{margin-top:10px}
  .closing{flex-wrap:wrap;gap:16px}.closing .seal{height:44px;width:44px}.closing button{margin-left:0}
  footer{flex-wrap:wrap;padding:25px 20px;gap:20px}footer p{order:3;width:100%}
  .hero-actions{gap:14px}.gold{padding:15px 17px}.hero-actions .gold span{margin-left:10px}.hero-actions .text-button{font-size:10px}
  .section-heading h2{font-size:27px}.issue{display:none}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}.status-dot{animation:none}}