/* School of Gains site theme. Loaded last on every page; maps the legacy GHL
   page styles onto the design-system tokens (assets/design/sog-tokens.css). */
:root{
  --bg:var(--sog-bg);--bg-card:var(--sog-surface);--bg-card-hover:var(--sog-surface-2);--bg-elevated:var(--sog-elevated);
  --card:var(--sog-surface);--card-2:var(--sog-surface-2);--border:var(--sog-border);
  --green:var(--sog-green-500);--green-bright:var(--sog-green-400);--green-dark:var(--sog-green-500);--green-dim:var(--sog-green-tint);
  --text:var(--sog-text);--white:var(--sog-white);--muted:var(--sog-text-muted);--gray-light:var(--sog-text-muted);--gray:var(--sog-text-subtle);
  --school:var(--sog-green-400);
}
/* Typography: no serif fallback anywhere (fixes Times New Roman flashes). */
html body{background:var(--sog-bg) radial-gradient(ellipse 80% 50% at 50% -10%,var(--sog-green-glow),transparent 70%) no-repeat!important;color:var(--sog-text);font-family:var(--sog-font-body)!important}
body :where(p,li,span,a,label,input,textarea,select,button,td,th,div,small,strong,em,blockquote){font-family:var(--sog-font-body)}
body :where(h1,h2,h3,h4,h5,h6,.hero-title,.section-title){font-family:var(--sog-font-display)!important;letter-spacing:var(--sog-letter-spacing-display)}
body [style*="font-family:unset"],body [style*="font-family: unset"]{font-family:var(--sog-font-body)!important}
/* Buttons: portal style, flat action green, dark text, 12px radius, sentence case. */
.btn,.btn-primary,.btn-green,.btn-school,a.cta,button.cta,.btn-pulse,.bg-primary{border-radius:var(--sog-radius-md)!important;text-transform:none!important;letter-spacing:0!important;font-family:var(--sog-font-body)!important;font-weight:800!important}
.btn-primary,.btn-green,.btn-school,.btn-pulse.bg-primary,a.bg-primary{background:var(--sog-green-400)!important;color:var(--sog-on-green)!important;box-shadow:none!important;border-color:transparent!important}
.btn-primary:hover,.btn-green:hover,.btn-school:hover,a.bg-primary:hover{background:#19D65C!important;box-shadow:0 0 0 4px var(--sog-green-tint)!important}
.btn-secondary,.btn-outline,.btn-ghost{border-radius:var(--sog-radius-md)!important;text-transform:none!important;letter-spacing:0!important}
.btn-outline,.btn-secondary{border:1px solid var(--sog-border-strong)!important;color:var(--sog-text)!important;background:transparent!important}
/* Flat charcoal cards. */
:where(.card,.feature-card,.pricing-card,.testimonial-card,.school-card,.faq-item,.members-card,.lesson-card){background:var(--sog-surface)!important;border:1px solid var(--sog-border)!important;border-radius:var(--sog-radius-lg)!important;box-shadow:none!important}
/* Tiny uppercase colour labels. */
:where(.eyebrow,.section-label,.section-tag,.badge,.hero-badge,.school-badge,.label){font-family:var(--sog-font-body)!important;font-size:11px!important;font-weight:700!important;letter-spacing:var(--sog-letter-spacing-eyebrow)!important;text-transform:uppercase!important;color:var(--sog-green-400)}
/* Two-tone headlines: the highlighted span uses the action green. */
:where(.hero-title,h1,h2) :where(.highlight,.green,.accent,.text-green,.school-highlight,span[class*=green]){color:var(--sog-green-400)!important;-webkit-text-fill-color:currentColor}
/* Headline shouting -> sentence case for display headings set in caps by CSS. */
.hero-title,h1,h2{text-transform:none!important}
/* Old Free School brand glyphs / avatars are hidden (no third-party branding). */
.event-platform-icon--school,svg:has(use[href="#icon-school"]),.school-icon,[class*="bi:school"],iconify-icon[icon="bi:school"]{display:none!important}
.school-dot{background:var(--sog-green-400)!important}
.glow-orb--school{background:radial-gradient(circle,var(--sog-green-glow),transparent 70%)!important}
/* 2026 logo: transparent horizontal artwork, no crop box.
   Desktop ~150px (best-practice header mark); mobile stays readable. */
.sog-brand{width:150px!important;height:auto!important;overflow:visible!important;mix-blend-mode:normal!important}
.sog-brand .sog-logo{width:150px!important}
@media(max-width:680px){.sog-brand,.sog-brand .sog-logo{width:160px!important}}
.nav:has(.sog-brand),#sog-header{background:rgba(10,15,12,.92)!important;backdrop-filter:blur(10px);border-bottom:1px solid var(--sog-border)}
/* Cookie banner: compact bottom-right card so it never covers the hero CTA. */
.analytics-consent{left:auto!important;right:16px!important;bottom:16px!important;transform:none!important;width:min(380px,calc(100% - 32px))!important;flex-direction:column!important;align-items:stretch!important;gap:12px!important;padding:16px!important;background:var(--sog-surface)!important;border:1px solid var(--sog-border-strong)!important;border-radius:var(--sog-radius-lg)!important}
.analytics-consent .consent-buttons{display:grid!important;grid-template-columns:1fr 1fr}
.analytics-consent button{border-radius:var(--sog-radius-md)!important;font-family:var(--sog-font-body)!important;font-weight:700!important}
.analytics-consent button:last-child{background:var(--sog-green-400)!important;color:var(--sog-on-green)!important;border-color:transparent!important}
@media(max-width:760px){.analytics-consent{right:8px!important;left:8px!important;bottom:8px!important;width:auto!important;padding:12px!important}.analytics-consent p{font-size:11px!important}}
.analytics-settings-floating{border-radius:var(--sog-radius-md)!important}
/* Focus */
a:focus-visible,button:focus-visible{outline:2px solid var(--sog-green-400)!important;outline-offset:3px}
/* Newsletter popup waits until the visitor scrolls past the hero and the
   cookie choice is made, so neither overlay covers the hero CTA. */
html.sog-near-top .sog-popup,html.sog-consent-open .sog-popup{opacity:0!important;pointer-events:none!important;visibility:hidden!important}
.sog-popup{border-radius:var(--sog-radius-lg)!important}
/* Third-party glyph inside legacy join buttons. */
svg:has(path[d^="M20.317 4.37"]){display:none!important}

/* Free School feed: portal-style Headlines / Live sessions (not Free School). */
.school-cards-grid,.school-cards-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.school-card,.school-card{background:var(--sog-surface)!important;border:1px solid var(--sog-border)!important;border-radius:var(--sog-radius-lg)!important;box-shadow:none!important;padding:18px!important}
.school-card-header,.school-card-header{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.school-avatar,.school-avatar{width:36px;height:36px;border-radius:10px;background:var(--sog-green-dark);color:var(--sog-green-400);display:grid;place-items:center;font:800 12px/1 var(--sog-font-display)!important}
.school-username,.school-username{font:700 14px/1.2 var(--sog-font-body)!important;color:var(--sog-text)!important}
.school-timestamp,.school-timestamp{font:600 11px/1.2 var(--sog-font-body)!important;color:var(--sog-text-subtle)!important;letter-spacing:.04em;text-transform:uppercase}
.school-message,.school-message{font:400 14px/1.5 var(--sog-font-body)!important;color:var(--sog-text-muted)!important}
.school-section .section-title,.school-section .section-title{text-transform:none!important}
/* Hide leftover Free School glyph paths that schoolize didn't remove from SVG. */
.btn svg[viewBox="0 0 24 24"]:has(path[d^="M20.317"]),
.btn-school svg:first-child:has(path[d*="19.791"]){display:none!important}
/* Acquisition pages inherit tokens. */
body:has(.application),.wrap{background:var(--sog-bg)!important;color:var(--sog-text);font-family:var(--sog-font-body)}
.button,.button-primary{background:var(--sog-green-400)!important;color:var(--sog-on-green)!important;border-radius:var(--sog-radius-md)!important;text-transform:none!important;font-weight:800!important}
.button-secondary{background:transparent!important;border:1px solid var(--sog-border-strong)!important;color:var(--sog-text)!important;border-radius:var(--sog-radius-md)!important}
.quiz-card,.card{background:var(--sog-surface)!important;border:1px solid var(--sog-border)!important;border-radius:var(--sog-radius-lg)!important}
/* Kill Times / serif fallbacks globally. */
html,body,button,input,select,textarea{font-family:var(--sog-font-body),system-ui,sans-serif!important}
h1,h2,h3,h4,h5,h6{font-family:var(--sog-font-display),system-ui,sans-serif!important}