:root { --ink: #06111f; --ink-2: #091729; --panel: #0b1d31; --panel-2: #0e263d; --line: rgba(107, 151, 184, .24); --text: #e6eff7; --muted: #96a9bc; --cyan: #31d7f2; --cyan-soft: #44c4df; --violet: #9b6cff; --amber: #d69e57; --ease-out: cubic-bezier(.23,1,.32,1); }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--ink); touch-action: pan-x pan-y; }
body { margin: 0; min-width: 320px; color: var(--text); background: var(--ink); font-family: "Space Grotesk", sans-serif; touch-action: pan-x pan-y; }
button, input, select { font: inherit; }
button { cursor: pointer; }
a { color: inherit; text-decoration: none; }
.container { width: min(1180px, calc(100% - 48px)); margin: 0 auto; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.aura-page { position: relative; min-height: 100vh; overflow: hidden; background: radial-gradient(circle at 74% 7%, rgba(27, 72, 118, .35), transparent 27%), linear-gradient(120deg, #06111f 0%, #071729 48%, #050f1b 100%); }
.aura-page::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .42; background-image: linear-gradient(rgba(115, 158, 188, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(115, 158, 188, .045) 1px, transparent 1px); background-size: 56px 56px; mask-image: linear-gradient(to bottom, #000 0, transparent 72%); }
.ambient { position: absolute; pointer-events: none; border-radius: 999px; filter: blur(70px); opacity: .18; }
.ambient-one { width: 420px; height: 420px; top: 140px; right: -180px; background: var(--violet); }.ambient-two { width: 360px; height: 360px; top: 420px; left: -230px; background: var(--cyan); }
.topbar { position: relative; z-index: 5; height: 92px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(119, 151, 177, .16); }
.brand { display: inline-flex; align-items: center; gap: 10px; font-family: "Barlow Condensed", sans-serif; font-size: 23px; line-height: .74; letter-spacing: 1.4px; color: var(--cyan); font-weight: 800; }.brand-mark { width: 35px; height: 35px; display: grid; place-items: center; color: var(--cyan); border: 1px solid rgba(49,215,242,.8); clip-path: polygon(50% 0, 84% 16%, 100% 50%, 84% 84%, 50% 100%, 16% 84%, 0 50%, 16% 16%); box-shadow: 0 0 18px rgba(49,215,242,.25); }.brand-logo { display: block; width: 168px; height: 87px; object-fit: contain; object-position: center; }
nav { display: flex; gap: clamp(18px, 3vw, 40px); } nav a { color: #b9c6d1; font-size: 11px; letter-spacing: .05em; font-weight: 600; transition: color .18s var(--ease-out); } nav a:hover { color: var(--cyan); }
.top-actions { display: flex; align-items: center; gap: 14px; }.language-control { display: inline-flex; gap: 5px; align-items: center; color: var(--muted); position: relative; }.language-control select { appearance: none; background: transparent; color: var(--text); border: 0; font-size: 11px; padding-right: 16px; outline: none; cursor: pointer; }.language-control option { background: var(--ink); }.language-control svg:last-child { position: absolute; right: 0; pointer-events: none; }
.nav-cta { border: 1px solid var(--cyan); color: var(--text); background: rgba(7, 27, 43, .58); padding: 10px 23px; font-size: 11px; letter-spacing: .06em; clip-path: polygon(9px 0, 100% 0, 100% calc(100% - 9px), calc(100% - 9px) 100%, 0 100%, 0 9px); transition: transform .16s var(--ease-out), background .16s; }.nav-cta:hover { background: rgba(49,215,242,.16); transform: translateY(-2px); }.nav-cta:active, .primary-button:active { transform: scale(.97); }
.hero { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(280px, .82fr) minmax(480px, 1.35fr); min-height: 560px; align-items: center; padding: 62px 0 34px; gap: 32px; }.hero-copy { padding: 30px 0; }.eyebrow { display: flex; align-items: center; gap: 8px; color: var(--cyan); font-size: 10px; letter-spacing: .1em; font-weight: 700; }.eyebrow span { width: 34px; height: 2px; background: var(--cyan); }.hero h1 { margin: 23px 0 18px; max-width: 520px; color: #e8eff7; font-family: "Barlow Condensed", sans-serif; font-weight: 800; font-size: clamp(50px, 6.2vw, 82px); line-height: .87; letter-spacing: -.018em; }.hero h1 em { color: var(--cyan); font-style: normal; text-shadow: 0 0 23px rgba(49,215,242,.23); }.hero-subtitle { max-width: 310px; color: #a9bac8; font-size: 17px; line-height: 1.55; margin-bottom: 27px; }
.primary-button { display: inline-flex; justify-content: center; align-items: center; gap: 28px; min-height: 51px; padding: 0 23px; border: 0; color: #04101c; background: linear-gradient(100deg, var(--cyan-soft), var(--cyan)); font-size: 12px; letter-spacing: .035em; font-weight: 800; box-shadow: 0 9px 30px rgba(49,215,242,.16); transition: transform .16s var(--ease-out), box-shadow .2s, filter .2s; }.primary-button:hover { transform: translateY(-2px); box-shadow: 0 14px 38px rgba(49,215,242,.32); filter: brightness(1.06); }.primary-button:disabled { opacity: .6; cursor: wait; }.hero-note { display: flex; gap: 8px; align-items: center; color: var(--muted); font-size: 11px; margin-top: 16px; }
.arena-visual { isolation: isolate; height: 474px; position: relative; overflow: hidden; border: 1px solid rgba(121, 164, 193, .18); background: radial-gradient(ellipse at 50% 40%, rgba(32, 78, 120, .5), rgba(5,17,31,.2) 52%, rgba(4,12,22,.8) 100%); box-shadow: inset 0 0 75px rgba(2, 7, 15, .65), 0 30px 55px rgba(0,0,0,.22); clip-path: polygon(20px 0, 100% 0, 100% calc(100% - 20px), calc(100% - 20px) 100%, 0 100%, 0 20px); }.arena-sky { position: absolute; inset: 0 0 44% 0; background: radial-gradient(ellipse at 53% 58%, rgba(66, 137, 208,.35), transparent 23%), linear-gradient(to top, rgba(6,20,37,.2), rgba(3,9,18,.85)); }.arena-sky::before { content: ""; position: absolute; left: 50%; bottom: -24px; width: 100px; height: 210px; transform: translateX(-50%); background: linear-gradient(90deg, transparent, rgba(72,163,219,.55), transparent); clip-path: polygon(40% 0, 60% 0, 85% 100%, 15% 100%); filter: blur(.3px); }.arena-floor { position: absolute; bottom: -160px; left: -14%; width: 128%; height: 340px; border-radius: 50%; background: repeating-radial-gradient(ellipse at 50% 48%, transparent 0 22px, rgba(76,129,166,.31) 23px 25px, transparent 27px 43px), linear-gradient(#122e46, #061321); transform: perspective(420px) rotateX(56deg); box-shadow: 0 -4px 26px rgba(49,215,242,.16); }.arena-floor span { position: absolute; inset: 44% 40%; border-radius: 50%; border: 1px solid rgba(49,215,242,.45); }.arena-crowd { position: absolute; z-index: 1; top: 36%; width: 38%; height: 120px; opacity: .64; background: radial-gradient(circle at 8px 10px, #617386 0 3px, transparent 4px) 0 0/16px 22px, linear-gradient(to top, rgba(14,30,47,.95), transparent); filter: contrast(1.3); }.crowd-left { left: 0; transform: skewY(8deg); }.crowd-right { right: 0; transform: skewY(-8deg); }.scoreboard { position: absolute; z-index: 4; top: 48px; left: 50%; transform: translateX(-50%); display: grid; grid-template-columns: 90px 42px 90px; align-items: center; gap: 5px; color: var(--cyan); font-size: 10px; font-weight: 700; text-align: center; }.scoreboard span { border-bottom: 5px solid var(--cyan); padding-bottom: 6px; text-shadow: 0 0 8px var(--cyan); }.scoreboard span:last-child { border-color: var(--violet); color: #c3a7ff; text-shadow: 0 0 8px var(--violet); }.scoreboard i { height: 34px; border: 1px solid var(--violet); transform: rotate(45deg); }.energy-path { position: absolute; z-index: 3; top: 156px; width: 39%; height: 220px; border-top: 3px solid; border-radius: 50% 50% 0 0; filter: drop-shadow(0 0 7px currentColor); }.path-cyan { left: 9%; color: var(--cyan); transform: rotate(-24deg); }.path-violet { right: 9%; color: var(--violet); transform: rotate(24deg); }.orb { position: absolute; z-index: 4; width: 48px; height: 48px; border-radius: 50%; bottom: 126px; box-shadow: inset 0 0 14px #e0faff, 0 0 22px currentColor, 0 0 58px currentColor; }.orb::after { content: ""; position: absolute; inset: 7px; border-radius: inherit; background: radial-gradient(circle at 32% 27%, #fff, transparent 11%), linear-gradient(140deg, rgba(255,255,255,.56), transparent 48%); }.orb-cyan { left: 23%; color: var(--cyan); background: #077da1; }.orb-violet { right: 22%; color: var(--violet); background: #54319a; }.targets { position: absolute; z-index: 5; bottom: 23px; left: 50%; width: 76%; transform: translateX(-50%); display: flex; justify-content: space-between; }.target { width: 106px; height: 54px; border-radius: 50%; border: 9px solid #172b3d; background: radial-gradient(ellipse at 50% 45%, #22435b, #071220 64%); display: grid; place-items: center; box-shadow: 0 0 0 2px rgba(169,195,213,.15), inset 0 0 14px rgba(0,0,0,.8); }.target::before { content: ""; width: 31px; height: 12px; border-radius: 50%; border: 4px solid currentColor; box-shadow: 0 0 13px currentColor; }.target-cyan { color: var(--cyan); }.target-violet { color: var(--violet); }.target svg { position: absolute; color: #e6ddff; filter: drop-shadow(0 0 6px var(--violet)); }
.features { position: relative; z-index: 2; display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; padding: 22px 0 42px; }.feature-card { min-height: 164px; display: flex; gap: 15px; padding: 25px 20px; border: 1px solid var(--line); background: linear-gradient(145deg, rgba(16,39,58,.76), rgba(5,18,31,.75)); clip-path: polygon(16px 0, 100% 0, 100% calc(100% - 16px), calc(100% - 16px) 100%, 0 100%, 0 16px); }.feature-icon { flex: 0 0 auto; width: 49px; height: 49px; display: grid; place-items: center; border: 1px solid currentColor; border-radius: 50%; box-shadow: inset 0 0 14px currentColor; }.feature-0, .feature-2 { color: var(--cyan); }.feature-1 { color: var(--violet); }.feature-card span { color: var(--cyan); font-size: 11px; font-weight: 700; }.feature-card h2 { margin: 6px 0 7px; font-family: "Barlow Condensed", sans-serif; font-size: 26px; letter-spacing: .025em; }.feature-card p, .arena-grid p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.55; }
.arena-grid { display: grid; grid-template-columns: .9fr 1.3fr; gap: 14px; padding-bottom: 46px; }.map-card, .ranked-card { position: relative; overflow: hidden; min-height: 350px; padding: 29px; border: 1px solid var(--line); background: linear-gradient(135deg, rgba(12,33,52,.9), rgba(4,15,27,.86)); }.section-heading { display: flex; align-items: center; gap: 10px; color: var(--cyan); }.section-heading h2 { margin: 0; color: var(--text); font-family: "Barlow Condensed", sans-serif; font-size: 27px; letter-spacing: .04em; }.map-card > p { max-width: 215px; margin-top: 16px; }.tactical-map { position: absolute; inset: 90px 20px 40px; opacity: .86; background: radial-gradient(circle at 50% 50%, transparent 0 26px, rgba(51,173,213,.32) 27px 28px, transparent 29px 52px, rgba(51,173,213,.15) 53px 54px, transparent 55px), linear-gradient(45deg, transparent 48%, rgba(74,137,175,.18) 49% 51%, transparent 52%), linear-gradient(-45deg, transparent 48%, rgba(74,137,175,.18) 49% 51%, transparent 52%); clip-path: polygon(50% 0, 92% 21%, 92% 79%, 50% 100%, 8% 79%, 8% 21%); }.map-route { position: absolute; z-index: 2; height: 95px; width: 45%; bottom: 19%; border-top: 5px solid; border-radius: 50%; filter: drop-shadow(0 0 8px currentColor); }.route-cyan { left: 12%; color: var(--cyan); transform: rotate(-24deg); }.route-violet { right: 12%; color: var(--violet); transform: rotate(24deg); }.map-dot { position: absolute; z-index: 4; width: 14px; height: 14px; border-radius: 50%; box-shadow: 0 0 15px currentColor; }.cyan-dot { left: 22%; bottom: 17%; color: var(--cyan); background: var(--cyan); }.violet-dot { right: 22%; bottom: 17%; color: var(--violet); background: var(--violet); }.text-button { position: absolute; z-index: 5; left: 29px; bottom: 25px; display: inline-flex; align-items: center; gap: 20px; padding: 11px 14px; border: 1px solid rgba(49,215,242,.56); color: var(--cyan); background: rgba(6,20,34,.82); font-size: 10px; font-weight: 700; transition: .18s var(--ease-out); }.text-button:hover { background: rgba(49,215,242,.12); transform: translateX(3px); }.ranked-card > p { max-width: 400px; margin-top: 14px; }.mode-list { display: grid; grid-template-columns: repeat(4, 1fr); gap: 7px; margin-top: 29px; }.mode-list div { min-height: 65px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 7px; text-align: center; border: 1px solid rgba(96,137,168,.25); background: rgba(7,19,32,.46); }.mode-list span { width: 22px; height: 22px; display: grid; place-items: center; color: var(--cyan); border: 1px solid var(--cyan); transform: rotate(45deg); font-size: 10px; }.mode-list span::first-letter { transform: rotate(-45deg); }.mode-list strong { max-width: 75px; color: #adbdca; font-size: 8px; line-height: 1.15; }.ranked-card .text-button { bottom: 25px; }.hidden-rule { position: absolute; right: 28px; bottom: 25px; display: flex; gap: 11px; width: 208px; padding: 14px; border: 1px solid rgba(129,152,175,.22); background: rgba(13,25,37,.75); color: #68798a; }.hidden-rule strong { display: block; color: #9caebb; font-size: 10px; }.hidden-rule p { margin-top: 4px; font-size: 10px; }
.waitlist { position: relative; z-index: 2; display: grid; grid-template-columns: 67px minmax(220px,.8fr) minmax(360px, 1.1fr); align-items: center; gap: 24px; padding: 23px 29px; margin-bottom: 58px; border: 1px solid rgba(49,215,242,.32); background: linear-gradient(100deg, rgba(8,35,53,.95), rgba(10,25,39,.92)); clip-path: polygon(18px 0, 100% 0, 100% calc(100% - 18px), calc(100% - 18px) 100%, 0 100%, 0 18px); }.waitlist-icon { width: 58px; height: 58px; display: grid; place-items: center; color: var(--cyan); border: 1px solid rgba(49,215,242,.5); }.waitlist-copy h2 { margin: 0 0 7px; color: var(--cyan); font-family: "Barlow Condensed", sans-serif; font-size: 28px; letter-spacing: .025em; }.waitlist-copy p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.5; }.waitlist form { position: relative; display: grid; grid-template-columns: 1fr auto; gap: 8px; padding-bottom: 16px; }.waitlist input { width: 100%; min-height: 51px; padding: 0 16px; color: var(--text); background: rgba(3,14,25,.75); border: 1px solid rgba(103,141,167,.44); outline: none; }.waitlist input:focus { border-color: var(--cyan); box-shadow: 0 0 0 3px rgba(49,215,242,.11); }.waitlist form small { position: absolute; bottom: 0; color: #768b9d; font-size: 9px; }
.footer { display: flex; justify-content: space-between; gap: 60px; padding: 28px 0 48px; border-top: 1px solid rgba(113,150,177,.18); }.footer-brand p { margin: 17px 0 0; color: #728495; font-size: 10px; }.footer-links { display: grid; grid-template-columns: repeat(3, minmax(90px, 1fr)); gap: clamp(28px, 6vw, 72px); }.footer-links h3 { margin: 0 0 12px; color: #b8c4ce; font-size: 10px; }.footer-links a { display: block; margin: 6px 0; color: #74899a; font-size: 10px; transition: color .18s; }.footer-links a:hover { color: var(--cyan); }
@media (max-width: 960px) { .hero { grid-template-columns: 1fr; padding-top: 36px; }.hero-copy { max-width: 620px; }.arena-visual { height: 420px; }.features { grid-template-columns: 1fr; }.arena-grid { grid-template-columns: 1fr; }.waitlist { grid-template-columns: 60px 1fr; }.waitlist form { grid-column: 1 / -1; }.topbar nav { display: none; } }
@media (max-width: 620px) { .container { width: min(100% - 30px, 1180px); }.topbar { height: 76px; justify-content:flex-start; }.brand-logo { width:90px; height:72px; object-position:left center; }.top-actions { gap: 8px; margin-left:auto; }.brand { font-size: 19px; }.brand-mark { width: 31px; height: 31px; }.language-control { display: none; }.nav-cta { padding: 9px 16px; }.hero { min-height: auto; padding: 45px 0 20px; }.hero h1 { font-size: clamp(50px, 17vw, 70px); }.hero-subtitle { font-size: 15px; }.arena-visual { height: 330px; }.scoreboard { top: 29px; transform: translateX(-50%) scale(.76); }.energy-path { top: 112px; height: 155px; }.orb { bottom: 95px; transform: scale(.75); }.targets { bottom: 15px; }.target { width: 85px; height: 43px; }.feature-card { min-height: 142px; }.arena-grid { padding-bottom: 30px; }.map-card, .ranked-card { min-height: 375px; padding: 22px; }.mode-list { grid-template-columns: repeat(2,1fr); }.hidden-rule { display: none; }.waitlist { grid-template-columns: 1fr; gap: 14px; padding: 22px; }.waitlist-icon { display: none; }.waitlist form { grid-template-columns: 1fr; }.footer { flex-direction: column; gap: 32px; }.footer .brand-logo { width:90px; height:72px; }.footer-links { grid-template-columns: repeat(3,1fr); gap: 14px; } }
@media (prefers-reduced-motion: no-preference) { .orb-cyan { animation: floatCyan 2.8s var(--ease-out) infinite alternate; }.orb-violet { animation: floatViolet 3.1s var(--ease-out) infinite alternate; }.energy-path { animation: pulsePath 1.8s ease-in-out infinite alternate; } @keyframes floatCyan { to { transform: translate(18px, -15px) scale(1.07); } } @keyframes floatViolet { to { transform: translate(-15px, -13px) scale(1.06); } } @keyframes pulsePath { to { opacity: .55; } } }

/* Landing refresh — Season Zero / player acquisition */
.aura-page { background: radial-gradient(circle at 78% 0%, rgba(54, 43, 118, .42), transparent 25%), radial-gradient(circle at 10% 44%, rgba(0, 115, 142, .2), transparent 24%), #050914; }
.aura-page::before { opacity: .22; background-size: 38px 38px; mask-image: linear-gradient(to bottom, #000 0, transparent 92%); }
.topbar { height: 84px; border-bottom-color: rgba(161, 177, 207, .18); }
.brand-logo { width: 184px; height: 90px; filter: drop-shadow(0 0 16px rgba(49,215,242,.18)); }
nav a { font-size: 10px; text-transform: uppercase; letter-spacing: .12em; }
.hero { min-height: 600px; grid-template-columns: minmax(300px,.8fr) minmax(500px,1.35fr); padding: 68px 0 40px; gap: 42px; }
.hero-copy { padding: 20px 0; }
.eyebrow { text-transform: uppercase; letter-spacing: .18em; font-size: 9px; }
.hero h1 { max-width: 590px; margin: 26px 0 22px; font-size: clamp(58px, 7vw, 96px); line-height: .83; text-transform: uppercase; text-shadow: 0 5px 0 rgba(0,0,0,.18); }
.hero h1 em { color: #c2a2ff; text-shadow: 0 0 30px rgba(155,108,255,.42); }
.hero-subtitle { max-width: 400px; font-size: 15px; line-height: 1.65; color: #b8c8d8; }
.primary-button { min-height: 57px; padding: 0 26px; clip-path: polygon(0 0, calc(100% - 13px) 0, 100% 13px, 100% 100%, 13px 100%, 0 calc(100% - 13px)); }
.hero-note { text-transform: uppercase; letter-spacing: .08em; }
.arena-visual { height: 500px; border-color: rgba(49,215,242,.28); background: radial-gradient(ellipse at 50% 30%, rgba(68,100,183,.42), transparent 40%), linear-gradient(135deg, rgba(12,25,55,.88), rgba(4,8,18,.94)); box-shadow: 0 24px 70px rgba(0,0,0,.42), inset 0 0 80px rgba(54,43,118,.22); }
.arena-visual::after { content: "LIVE MATCH / 01"; position: absolute; z-index: 7; top: 18px; right: 21px; color: #89a8bc; font-size: 9px; letter-spacing: .16em; }
.scoreboard { top: 48px; }
.orb { width: 56px; height: 56px; }
.features { padding-top: 35px; gap: 18px; }
.feature-card { min-height: 178px; padding: 27px 22px; background: linear-gradient(135deg, rgba(13,38,62,.95), rgba(6,13,27,.88)); border-color: rgba(116,163,192,.26); }
.feature-card h2, .section-heading h2, .ranking-heading h2 { text-transform: uppercase; }
.feature-card p, .arena-grid p { font-size: 12px; color: #9eb4c4; }
.arena-grid { gap: 18px; padding-bottom: 62px; }
.map-card, .ranked-card, .ranking-section { border-color: rgba(116,163,192,.26); box-shadow: 0 18px 55px rgba(0,0,0,.16); }
.map-card, .ranked-card { min-height: 370px; padding: 31px; }
.mode-list div { min-height: 72px; background: rgba(3,12,27,.68); transition: transform .18s var(--ease-out), border-color .18s; }
.mode-list div:hover { transform: translateY(-3px); border-color: rgba(49,215,242,.55); }
.ranking-section { margin-bottom: 62px; background: linear-gradient(135deg, rgba(13,38,62,.96), rgba(5,10,23,.95)); }
.ranking-heading h2 { font-size: 44px; }
.aura-guide { position: relative; z-index: 2; display: grid; grid-template-columns: 1.15fr .85fr; gap: 18px; align-items: stretch; margin-bottom: 62px; padding: 28px 31px; border: 1px solid rgba(49,215,242,.28); background: linear-gradient(110deg, rgba(8,35,53,.95), rgba(10,25,39,.92)); clip-path: polygon(18px 0,100% 0,100% calc(100% - 18px),calc(100% - 18px) 100%,0 100%,0 18px); }
.aura-guide h2 { margin: 15px 0 10px; color: var(--text); font-family: "Barlow Condensed", sans-serif; font-size: 40px; text-transform: uppercase; }
.aura-guide-copy > p:not(.eyebrow), .aura-guide-card p { max-width: 610px; color: #9eb4c4; font-size: 13px; line-height: 1.6; }
.aura-guide .primary-button { margin-top: 12px; }
.aura-guide-card { align-self: center; padding: 22px; border: 1px solid rgba(155,108,255,.38); background: rgba(5,13,27,.62); }
.aura-guide-card h3 { margin: 0 0 8px; color: #c2a2ff; font-family: "Barlow Condensed", sans-serif; font-size: 25px; text-transform: uppercase; }
.aura-guide-card ul { display: grid; gap: 8px; margin: 16px 0 0; padding-left: 18px; color: #b8c8d8; font-size: 11px; line-height: 1.4; }
.footer { padding-top: 34px; }
@media (max-width: 960px) { .hero { grid-template-columns: 1fr; }.hero-copy { max-width: 680px; }.arena-visual { height: 440px; } }
@media (max-width: 620px) { .brand-logo { width: 104px; }.hero { padding-top: 48px; }.hero h1 { font-size: clamp(55px, 17vw, 78px); }.hero-subtitle { font-size: 14px; }.arena-visual { height: 340px; }.ranking-heading h2 { font-size: 36px; }.aura-guide { grid-template-columns: 1fr; padding: 24px 20px; }.aura-guide h2 { font-size: 34px; } }