/* PORTAL — /training (light-flipped) and /solutions (orange/dark) */

/* TRAINING PORTAL — light/cream dominant, training-first */
.portal-training{background:var(--n-50);color:var(--tpp-charcoal)}
/* Portal nav inherits site nav (always solid dark) — overrides removed for consistency */

.training-hero{background:linear-gradient(180deg,#FFF8F1 0%, var(--n-50) 100%);color:var(--tpp-charcoal);min-height:80vh;text-align:center;padding:144px 32px 96px}
.training-hero h1{color:var(--tpp-charcoal)}
.training-hero h1::after{content:".";color:var(--tpp-orange)}
.training-hero .portal-sub{color:var(--n-700)}

/* SOLUTIONS PORTAL — orange/dark dominant */
.portal-solutions{background:var(--tpp-charcoal);color:var(--tpp-white)}

.solutions-hero{background:linear-gradient(180deg,var(--tpp-orange) 0%, var(--tpp-orange-deep) 100%);color:var(--tpp-white);min-height:80vh;text-align:center;padding:144px 32px 96px}
.solutions-hero h1{color:var(--tpp-white)}
.solutions-hero h1::after{content:".";color:var(--tpp-charcoal)}
.solutions-hero .portal-sub{color:rgba(255,255,255,0.92)}

/* COMMON portal pieces */
.portal-hero{position:relative;overflow:hidden}
.portal-stamp{font-family:var(--f-mono);font-size:12px;letter-spacing:0.3em;text-transform:uppercase;color:var(--tpp-orange);margin-bottom:24px}
.portal-hero h1{font-family:var(--f-editorial);font-weight:500;font-style:normal;font-size:clamp(80px,14vw,200px);line-height:0.95;letter-spacing:-0.012em;margin:0}
.portal-hero h1::after{font-style:italic}
.portal-sub{margin:24px auto 32px;max-width:60ch;font-size:18px;line-height:1.6}
.portal-cta{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}

.btn-ghost-dark{color:var(--tpp-charcoal);border-color:var(--tpp-charcoal)}
.btn-ghost-dark:hover{background:var(--tpp-charcoal);color:var(--tpp-orange)}
.btn-ghost-light{color:var(--tpp-white);border-color:var(--tpp-white)}
.btn-ghost-light:hover{background:var(--tpp-white);color:var(--tpp-charcoal)}

.band-head{margin-bottom:48px;max-width:60ch}
.band-head .kicker{font-family:var(--f-mono);font-size:11px;letter-spacing:0.24em;text-transform:uppercase;color:var(--tpp-orange);margin-bottom:12px}
.band-head .kicker.dark{color:var(--tpp-orange)}
.band-head .band-h.light{color:var(--tpp-white)}
.band-head .band-sub.light{color:rgba(255,255,255,0.78)}

.callout-box{padding:24px;background:#fff;border:1.5px solid var(--tpp-orange);border-radius:8px;margin:32px 0}
.callout-box h4{font-family:var(--f-mono);font-size:12px;letter-spacing:0.22em;text-transform:uppercase;color:var(--tpp-orange);margin-bottom:8px}
.callout-box p{margin:0;font-size:16px;line-height:1.6}

/* PROGRAM GRID (training) */
.program-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
@media (max-width:880px){.program-grid{grid-template-columns:1fr}}
.program-card{display:block;background:#fff;border:1.5px solid var(--n-300);border-radius:8px;padding:32px;color:var(--tpp-charcoal);transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease}
.program-card:hover{transform:translateY(-4px);border-color:var(--tpp-orange);box-shadow:0 8px 32px rgba(243,111,33,0.12)}
.program-card .prog-tag{font-family:var(--f-mono);font-size:11px;letter-spacing:0.22em;text-transform:uppercase;color:var(--tpp-orange);margin-bottom:16px}
.program-card h3{font-family:var(--f-sans);font-weight:700;font-size:24px;letter-spacing:-0.005em;margin-bottom:8px}
.program-card p{font-size:15px;line-height:1.5;color:var(--n-700);margin-bottom:24px}
.program-card .prog-meta{display:flex;justify-content:space-between;font-family:var(--f-mono);font-size:11px;letter-spacing:0.16em;text-transform:uppercase;color:var(--tpp-orange);padding-top:16px;border-top:1px solid var(--n-100)}

/* SERVICE GRID (solutions) */
.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media (max-width:1100px){.service-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:680px){.service-grid{grid-template-columns:1fr}}
.service-card{display:block;background:rgba(255,255,255,0.04);border:1.5px solid rgba(255,255,255,0.18);border-radius:8px;padding:32px;color:var(--tpp-white);transition:transform .2s ease, border-color .2s ease, background .2s ease}
.service-card:hover{transform:translateY(-4px);border-color:var(--tpp-orange);background:rgba(243,111,33,0.08)}
.service-card .service-num{font-family:var(--f-display);font-size:48px;line-height:1;color:var(--tpp-orange);margin-bottom:12px}
.service-card h3{font-family:var(--f-sans);font-weight:700;font-size:22px;letter-spacing:-0.005em;margin-bottom:8px}
.service-card p{font-size:15px;line-height:1.55;color:rgba(255,255,255,0.72);margin-bottom:20px}
.service-card .service-foot{font-family:var(--f-mono);font-size:11px;letter-spacing:0.18em;text-transform:uppercase;color:var(--tpp-orange);padding-top:12px;border-top:1px solid rgba(255,255,255,0.1)}

/* WHY GRID */
.why-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:32px}
@media (max-width:680px){.why-grid{grid-template-columns:1fr}}
.why-grid h4{font-family:var(--f-mono);font-size:12px;letter-spacing:0.22em;text-transform:uppercase;color:var(--tpp-orange);margin-bottom:8px}
.why-grid p{font-size:16px;line-height:1.6;color:var(--n-700)}
