/* osha-hub.css — /osha OSHA-30 prep-games hub (2026-06-30).
   Replaces the coming-soon waitlist with a games hub + free-Beta CTA. External
   stylesheet (CSP-safe, cachebusted via page.njk) so the markup needs no inline
   style attributes. Self-contained `oh-` namespace; fonts come from page.njk. */
.oh-page{margin:0;font-family:Barlow,system-ui,sans-serif;color:#1f2a37;background:#f6f8fb;line-height:1.5;}
.oh-page h1,.oh-page h2,.oh-page h3{font-family:"Barlow Condensed",sans-serif;margin:0;}
.oh-page a{color:inherit;text-decoration:none;}
.oh-wrap{max-width:960px;margin:0 auto;padding:0 18px;}

/* announce bar */
.oh-announce{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;background:linear-gradient(90deg,#0d1b2a,#16314f);color:#fff;padding:9px 16px;font-size:.85rem;text-align:center;border-bottom:2px solid #f0a500;}
.oh-announce .oh-pill{background:#f0a500;color:#0d1b2a;font-weight:800;font-size:.7rem;letter-spacing:1px;padding:2px 9px;border-radius:10px;}
.oh-announce strong{color:#f0a500;}
.oh-announce .oh-cta{font-weight:800;color:#f0a500;white-space:nowrap;}

/* nav */
.oh-nav{position:sticky;top:0;z-index:10;background:rgba(13,27,42,.97);backdrop-filter:blur(8px);border-bottom:2px solid #f0a500;}
.oh-navin{max-width:960px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:12px 18px;}
.oh-logo{font-family:"Barlow Condensed",sans-serif;font-weight:900;font-size:1.4rem;color:#fff;letter-spacing:2px;text-transform:uppercase;}
.oh-logo span{color:#f0a500;}
.oh-navlinks{display:flex;gap:16px;align-items:center;}
.oh-navlinks a{color:rgba(255,255,255,.78);font-weight:600;font-size:.85rem;}
.oh-navlinks a:hover{color:#fff;}
.oh-navcta{background:#f0a500;color:#0d1b2a !important;font-weight:800;font-size:.78rem;letter-spacing:.5px;text-transform:uppercase;padding:8px 14px;border-radius:8px;}

/* hero */
.oh-hero{background:radial-gradient(1200px 400px at 50% -120px,rgba(46,139,87,.18),transparent),#0d1b2a;color:#fff;text-align:center;padding:54px 18px 46px;}
.oh-kicker{display:inline-block;background:rgba(46,139,87,.18);border:1px solid rgba(46,139,87,.5);color:#7be5a6;font-weight:700;font-size:.74rem;letter-spacing:2px;text-transform:uppercase;padding:6px 14px;border-radius:20px;margin-bottom:18px;}
.oh-hero h1{font-size:clamp(2rem,6vw,3rem);margin:0 0 12px;font-weight:900;letter-spacing:.5px;}
.oh-hero h1 .oh-em{color:#f0a500;}
.oh-hero p{max-width:620px;margin:0 auto;color:#cfd8e3;font-size:1.02rem;}
.oh-pts{display:inline-flex;gap:8px;align-items:center;margin-top:20px;background:rgba(240,165,0,.12);border:1px solid rgba(240,165,0,.35);color:#f0a500;font-weight:700;font-size:.82rem;padding:8px 16px;border-radius:24px;}

/* disclaimer */
.oh-disc{display:flex;gap:12px;align-items:flex-start;max-width:880px;margin:22px auto 0;background:#fff7ec;border:1px solid rgba(226,112,14,.35);border-left:4px solid #e2700e;border-radius:10px;padding:14px 16px;color:#6b4a1d;font-size:.86rem;text-align:left;}
.oh-disc .oh-ic{font-size:1.2rem;line-height:1.2;}
.oh-disc strong{color:#a4530a;}

.oh-section{padding:34px 0;}
.oh-sech{text-align:center;margin-bottom:22px;}
.oh-sech h2{font-size:1.7rem;color:#0d1b2a;margin:0 0 6px;font-weight:900;letter-spacing:.5px;}
.oh-sech p{margin:0;color:#64748b;font-size:.95rem;}

/* game cards */
.oh-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.oh-card{background:#fff;border:1px solid #e2e8f0;border-top:4px solid #2e8b57;border-radius:14px;padding:20px 18px;display:flex;flex-direction:column;box-shadow:0 2px 10px rgba(13,27,42,.05);transition:transform .15s,box-shadow .15s;}
.oh-card:hover{transform:translateY(-3px);box-shadow:0 8px 22px rgba(13,27,42,.12);}
.oh-emoji{font-size:2.2rem;line-height:1;margin-bottom:10px;}
.oh-card h3{font-size:1.25rem;color:#0d1b2a;margin:0 0 4px;font-weight:900;}
.oh-tag{font-size:.7rem;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:#2e8b57;margin-bottom:10px;}
.oh-tag.oh-betatag{color:#e2700e;}
.oh-desc{font-size:.9rem;color:#475569;flex:1;}
.oh-topics{margin:12px 0 14px;display:flex;flex-wrap:wrap;gap:6px;}
.oh-chip{background:#eef2f7;color:#475569;font-size:.7rem;font-weight:600;padding:3px 9px;border-radius:20px;}
.oh-play{margin-top:auto;display:inline-flex;align-items:center;justify-content:center;gap:6px;background:#0d1b2a;color:#fff;font-family:"Barlow Condensed",sans-serif;font-weight:800;font-size:.92rem;letter-spacing:1px;text-transform:uppercase;padding:10px 14px;border-radius:9px;}
.oh-play:hover{background:#16314f;}
.oh-play.oh-betaplay{background:#e2700e;}
.oh-play.oh-betaplay:hover{background:#c2410c;}

/* beta CTA */
.oh-betacta{background:linear-gradient(135deg,#0d1b2a,#16314f);color:#fff;border-radius:18px;padding:30px 24px;text-align:center;}
.oh-new{display:inline-block;background:#f0a500;color:#0d1b2a;font-weight:900;font-size:.72rem;letter-spacing:1.5px;padding:4px 12px;border-radius:14px;margin-bottom:14px;}
.oh-betacta h2{font-size:1.7rem;margin:0 0 10px;font-weight:900;}
.oh-betacta h2 .oh-em{color:#f0a500;}
.oh-betacta p{max-width:560px;margin:0 auto 18px;color:#cfd8e3;font-size:.98rem;}
.oh-betabtn{display:inline-block;background:#f0a500;color:#0d1b2a;font-family:"Barlow Condensed",sans-serif;font-weight:900;font-size:1.05rem;letter-spacing:1px;text-transform:uppercase;padding:13px 30px;border-radius:10px;}
.oh-betasub{margin-top:12px;font-size:.8rem;color:#90a4bd;}

/* footer */
.oh-footer{background:#0d1b2a;color:#90a4bd;font-size:.78rem;text-align:center;padding:26px 18px;margin-top:30px;}
.oh-fl{font-family:"Barlow Condensed",sans-serif;font-weight:900;color:#fff;font-size:1.2rem;letter-spacing:2px;text-transform:uppercase;margin-bottom:8px;}
.oh-fl span{color:#f0a500;}
.oh-footer p{max-width:680px;margin:6px auto;}
.oh-footer a{color:#90a4bd;text-decoration:underline;margin:0 6px;}

@media(max-width:720px){.oh-cards{grid-template-columns:1fr;}.oh-navlinks a:not(.oh-navcta){display:none;}}