/* Content pages: how it works, pay, FAQ, about */
.pg-top{position:relative;padding:clamp(48px,7vw,104px) 0 clamp(56px,7vw,96px);background:radial-gradient(ellipse 60% 70% at 90% 0%,rgba(200,245,90,.07),transparent 70%)}
.pg-h1{max-width:15em;text-wrap:balance}
.pg-top .st-lede{max-width:40em}
.pg-top .st-lede a,.st-prose a{color:var(--acc)}

/* Numbered steps */
.pg-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:40px 0 0;padding:0;list-style:none;counter-reset:none}
.pg-steps--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.pg-steps li{position:relative;padding:26px 24px 28px;background:var(--panel);clip-path:polygon(0 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%)}
.pg-num{display:block;font-size:56px;line-height:.9;color:var(--acc)}
.pg-steps h3{margin:16px 0 10px;font-size:21px;line-height:1.25;font-weight:800}
.pg-steps p{margin:0;font-size:16px;line-height:1.6;color:var(--mute)}

/* Four ways to train */
.pg-ways{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2px;margin:40px 0 0;padding:0;list-style:none;background:var(--line);box-shadow:0 0 0 1px var(--line)}
.pg-ways li{display:flex;flex-direction:column;gap:12px;padding:26px 24px 30px;background:var(--bg)}
.pg-ways li:nth-child(1) .pg-rank{--o:.35}.pg-ways li:nth-child(2) .pg-rank{--o:.55}.pg-ways li:nth-child(3) .pg-rank{--o:.75}.pg-ways li:nth-child(4) .pg-rank{--o:1}
.pg-rank{align-self:flex-start;padding:6px 10px;font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--acc);box-shadow:inset 0 0 0 1px rgba(200,245,90,var(--o,1))}
.pg-ways h3{margin:6px 0 0;font-size:52px;line-height:.9}
.pg-ways p{margin:0;font-size:16px;line-height:1.6;color:var(--mute)}

/* Rank ladder */
.pg-ladder{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));align-items:end;gap:6px;height:150px;margin:0 0 28px;padding:0;list-style:none}
.pg-ladder li{display:flex;align-items:flex-end;padding:10px 12px;box-sizing:border-box;background:#1B1E24;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--soft);clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,0 100%)}
.pg-ladder li:nth-child(1){height:28%}.pg-ladder li:nth-child(2){height:44%}.pg-ladder li:nth-child(3){height:60%}.pg-ladder li:nth-child(4){height:78%}
.pg-ladder .is-top{height:100%;background:var(--acc);color:#0C0D10}

/* Pay */
.pg-drops table{max-width:760px}
.pg-drops td{font-size:18px}
.pg-drops td:last-child{font-family:'Archivo',system-ui,sans-serif;font-style:italic;font-weight:900;font-stretch:72%;font-size:26px;line-height:1}
.pg-drops .is-top td{color:var(--acc)}
.pg-only{display:inline-block;margin-left:10px;padding:4px 8px;font-family:'JetBrains Mono',ui-monospace,monospace;font-style:normal;font-weight:700;font-size:11px;letter-spacing:.12em;text-transform:uppercase;vertical-align:middle;background:var(--acc);color:#0C0D10}
.pg-note{margin:22px 0 0;padding-left:14px;max-width:40em;font-size:16px;line-height:1.55;color:var(--soft);box-shadow:inset 2px 0 0 var(--acc)}
.pg-grow{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1fr);gap:40px 72px;align-items:end}
.pg-genius-sec{padding-top:0;border-top:0}
.pg-genius{position:relative;padding:clamp(28px,4vw,48px);background:linear-gradient(100deg,rgba(200,245,90,.14),var(--panel) 65%);box-shadow:inset 0 0 0 1px rgba(200,245,90,.5);clip-path:polygon(22px 0,100% 0,100% calc(100% - 22px),calc(100% - 22px) 100%,0 100%,0 22px)}
.pg-genius p{margin:0;max-width:40em;font-size:17px;line-height:1.6;color:var(--soft)}
.pg-genius-tag{font-size:12px!important;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--acc)!important}
.pg-genius .pg-genius-h{margin:10px 0 14px;font-size:clamp(44px,6vw,88px);line-height:.9;color:var(--ink)}
.pg-genius-h span{color:var(--acc)}
.pg-genius .st-more{margin-top:14px}
.pg-rules{display:grid;gap:2px;margin:0;padding:0;list-style:none;background:var(--line2)}
.pg-rules li{padding:18px 20px 18px 52px;position:relative;background:var(--bg);font-size:16px;line-height:1.6;color:var(--mute)}
.pg-rules li::before{content:"";position:absolute;left:20px;top:24px;width:12px;height:12px;background:var(--acc);clip-path:polygon(4px 0,100% 0,100% calc(100% - 4px),calc(100% - 4px) 100%,0 100%,0 4px)}
.pg-rules b{display:block;margin-bottom:2px;color:var(--ink);font-size:17px}

/* FAQ page */
.pg-faq-sec{padding-top:clamp(40px,5vw,72px)}
.pg-faq-sec .st-faq{margin-top:0}
.st-qa{scroll-margin-top:96px}
.st-qa:target{padding:20px;margin:-20px;background:rgba(200,245,90,.06);border-top-color:var(--acc)}

/* About */
.pg-brands{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px;margin:26px 0 0;padding:0;list-style:none;background:var(--line2);box-shadow:0 0 0 1px var(--line2)}
.pg-brands a{display:flex;flex-direction:column;gap:4px;height:100%;padding:18px 20px;box-sizing:border-box;background:var(--bg);text-decoration:none}
.pg-brands b{font-family:'Archivo',system-ui,sans-serif;font-style:italic;font-weight:900;font-stretch:76%;font-size:24px;line-height:1;text-transform:uppercase;color:var(--ink)}
.pg-brands span{font-size:14px;color:var(--mute)}
.pg-brands a:hover b{color:var(--acc)}
.pg-brands li:last-child:nth-child(odd){grid-column:1/-1}

/* Skill tracks */
.pg-tracks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2px;margin:36px 0 0;padding:0;list-style:none;background:var(--line);box-shadow:0 0 0 1px var(--line)}
.pg-tracks>li{display:flex;flex-direction:column;gap:10px;padding:26px 24px 28px;background:var(--bg)}
.pg-tn{font-size:12px;font-weight:700;letter-spacing:.14em;color:var(--acc)}
.pg-tracks h3{margin:0;font-size:44px;line-height:.9}
.pg-q{margin:0;font-size:17px;color:var(--soft)}
.pg-drills{margin:4px 0 0;padding:0;list-style:none;font-size:15px;line-height:1.7;color:var(--mute)}
.pg-drills li::before{content:"\25C6";margin-right:8px;font-size:10px;color:var(--acc);vertical-align:2px}
.pg-trains{margin:auto 0 0;padding-top:8px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim)}
.pg-go{display:inline-flex;align-items:center;gap:10px;min-height:44px;font-weight:800;color:var(--acc);text-decoration:none}
.pg-go:hover{color:#FFFFFF}
.pg-soon{display:inline-flex;align-items:center;min-height:44px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim)}
.pg-tracks .is-soon .pg-tn,.pg-tracks .is-soon .pg-drills li::before{color:var(--dim)}

/* Industry cards */
.pg-inds{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:36px 0 0;padding:0;list-style:none}
.pg-ind{display:flex;flex-direction:column;gap:16px;padding:26px 24px 26px;background:var(--panel);scroll-margin-top:96px;clip-path:polygon(0 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%)}
.pg-ind:target{box-shadow:inset 0 0 0 2px var(--acc)}
.pg-ind h3{margin:0;font-size:38px;line-height:.9}
.pg-ind dl{display:grid;gap:12px;margin:0}
.pg-ind dt{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim)}
.pg-ind dd{margin:3px 0 0;font-size:16px;line-height:1.5;color:var(--soft)}
.pg-ind .mg-btn{align-self:flex-start;margin-top:auto;min-height:48px;font-size:17px}

/* Genre pages: genre cards, game lists and notes */
.pg-genres{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:36px}
.pg-genre{display:flex;flex-direction:column;gap:8px;padding:22px;background:var(--panel);color:var(--ink);text-decoration:none;clip-path:polygon(14px 0,100% 0,100% calc(100% - 14px),calc(100% - 14px) 100%,0 100%,0 14px)}
.pg-genre span{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--acc)}
.pg-genre b{font-size:34px;line-height:.95}
.pg-genre small{font-size:15px;color:var(--mute)}
.pg-genre:hover b{color:var(--acc)}
.pg-chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 1.2em;padding:0;list-style:none}
.pg-chips li{padding:8px 14px;background:var(--panel);font-size:15px;font-weight:700;color:var(--soft);box-shadow:inset 0 0 0 1px #3A3F4A}
.pg-note{max-width:760px;margin:18px 0 0;font-size:15px;line-height:1.6;color:var(--mute)}
.pg-note a{color:var(--acc)}
.st-prose .pg-legal{font-size:14px;color:var(--dim)}

@media (max-width:1100px){
.pg-steps--4,.pg-ways{grid-template-columns:repeat(2,minmax(0,1fr))}
.pg-tracks{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:900px){
.pg-steps,.pg-steps--4{grid-template-columns:1fr}
.pg-genres{grid-template-columns:repeat(2,minmax(0,1fr))}
.pg-grow{grid-template-columns:1fr}
}
@media (max-width:640px){
.pg-ways{grid-template-columns:1fr}
.pg-genres{grid-template-columns:1fr}
.pg-tracks,.pg-inds{grid-template-columns:1fr}
.pg-ind .mg-btn{align-self:stretch}
.pg-ways h3{font-size:44px}
.pg-ladder{height:120px;gap:4px}
.pg-ladder li{padding:8px 6px;font-size:10px;letter-spacing:.04em}
.pg-brands{grid-template-columns:1fr}
.pg-num{font-size:44px}
.pg-drops td:last-child{font-size:22px}
.pg-only{display:block;width:max-content;margin:8px 0 0}
}