:root { --ink:#122f31; --green:#12665e; --mint:#e2f4ef; --cream:#e8f3f0; --orange:#e0fa86; --line:#d9e6e4; --muted:#526b6b; }
body { background:#f4f8f7; font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
.appbar { box-shadow:0 3px 20px #143e3510; gap:18px; }
.primary { box-shadow:0 3px 0 #0b433e; }
.primary:hover { background:#0d534c; }
.soft:hover { background:#cce9df; }
.brand-mark { border-radius:50%; }
.hero { margin:24px auto 0; width:min(1320px,calc(100% - 40px)); border-radius:30px; overflow:hidden; background:#143f3c; min-height:480px; }
.hero-copy { padding:52px; align-self:center; }
.hero h1 { color:#fff; font-family:inherit; font-weight:750; font-size:clamp(42px,5.5vw,76px); line-height:1.04; letter-spacing:-2.5px; }
.hero h1 em { font-style:normal; color:#e0fa86; }
.hero p { color:#d6eae5; font-family:inherit; font-size:17px; line-height:1.6; }
.hero .eyebrow { color:#b2d6ce; font-size:12px; }
.hero .primary { background:#e0fa86; color:#173e32; box-shadow:none; }
.hero .soft { background:transparent; border:1px solid #a5cdc4; color:white; }
.hero-photo:after { background:linear-gradient(90deg,#143f3c,transparent 35%); }
.hero-photo img { min-height:100%; }
.stat-card { border-radius:14px; left:20px; right:20px; }
.explore-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-top:24px; }
.explore-grid button { text-align:left; border:1px solid var(--line); border-radius:18px; padding:22px; background:white; min-height:130px; }
.explore-grid button:hover { border-color:var(--green); background:#edf7f3; }
.explore-grid span,.explore-grid b,.explore-grid small { display:block; }
.explore-grid span { font-size:12px; letter-spacing:1px; font-weight:700; color:var(--green); }
.explore-grid b { font-size:21px; margin:9px 0; }
.explore-grid small { font-size:14px; color:var(--muted); }
.section-head h2 { font-family:inherit; font-size:38px; font-weight:730; letter-spacing:-1.5px; line-height:1.15; }
.card { box-shadow:0 10px 28px #183e3508; border-radius:22px; }
.card-body h3 { font-family:inherit; font-size:23px; font-weight:700; line-height:1.2; }
.form-status { padding:10px; color:#8e2828; background:#fff0ef; border-radius:8px; font-size:14px; }
.form-status:empty { display:none; }
#profileLoadStatus { color:#815914; font-size:14px; }
#signupQuick { display:block; white-space:nowrap; }
#signupQuick[hidden] { display:none; }
.training-entry { margin-bottom:24px; }
.class-field[hidden], #contactInstructor[hidden] { display:none; }
.learning-view { width:min(820px,100%); }
#lessonPlayer iframe,#lessonPlayer video { border:0; width:100%; aspect-ratio:16/9; background:#102724; border-radius:12px; margin-top:18px; }
#lessonDescription { white-space:pre-wrap; line-height:1.6; }
@media (max-width:1100px) and (min-width:901px) { .top-actions>.soft,.top-actions>.icon-btn { display:none; } .appbar { padding-inline:12px;gap:10px; } .nav button { padding-inline:7px; } }
@media(max-width:900px) { .hero { grid-template-columns:1fr 1fr;min-height:400px; } .hero-copy { padding:30px; } .hero-photo { height:100%; } .explore-grid { gap:10px; } .explore-grid button { padding:16px; } }
@media(max-width:600px) { .hero { width:calc(100% - 24px); margin-top:14px; grid-template-columns:1fr; border-radius:24px; } .hero-copy { padding:28px 22px; } .hero h1 { font-size:44px;letter-spacing:-1.5px; } .hero-photo { height:210px; } .hero-photo:after { background:linear-gradient(180deg,#143f3c,transparent 30%); } .explore-grid { grid-template-columns:1fr; margin-top:14px; } .explore-grid button { min-height:100px;padding:16px 20px; } .explore-grid b { font-size:20px; } .section-head h2 { font-size:30px; } .appbar { padding-inline:10px;gap:6px; } .brand { font-size:15px;gap:5px; } .top-actions { gap:5px; } #signupQuick { padding:10px;font-size:14px;min-height:44px; } .top-actions #accountButton.primary { padding:10px;font-size:14px; } }