.training-detail-page { background: #fff; }
.training-detail-hero { padding-block: 2.5rem 5.5rem; overflow: hidden; background: #eef4f7; }
.training-detail-back { display: inline-flex; min-height: 44px; align-items: center; gap: .45rem; color: var(--civic-muted); font-size: .78rem; font-weight: 750; text-decoration: none; }
.training-detail-hero__grid { display: grid; align-items: center; gap: 4rem; grid-template-columns: 1.05fr .95fr; margin-top: 2rem; }
.training-detail-kicker { display: flex; flex-wrap: wrap; align-items: center; gap: .7rem; }
.training-detail-category { color: var(--civic-blue); font-size: .7rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.training-detail-status { display: inline-flex; min-height: 30px; align-items: center; padding: .35rem .75rem; border-radius: 999px; background: #fff; color: var(--civic-ink-soft); font-size: .68rem; font-weight: 800; }
.training-detail-hero h1 { margin-top: 1.3rem; font-family: "Plus Jakarta Sans",sans-serif; font-size: clamp(2.5rem,5.5vw,5.2rem); font-weight: 800; letter-spacing: -.06em; line-height: 1.02; }
.training-detail-intro { margin-top: 1.4rem; max-width: 680px; color: var(--civic-muted); font-size: 1.02rem; line-height: 1.8; }
.training-detail-hero__media { position: relative; min-height: 500px; overflow: hidden; border-radius: 2rem 2rem 7rem 2rem; background: linear-gradient(135deg,#d5e7f1,#bdd6e4); box-shadow: var(--civic-shadow); }
.training-detail-hero__media img { width: 100%; height: 100%; object-fit: cover; }
.training-detail-hero__media > .material-symbols-outlined { width: 100%; height: 100%; display: grid; place-items: center; color: rgba(0,103,167,.28); font-size: 7rem; }
.training-detail-hero__mark { position: absolute; right: 1.3rem; bottom: 1.3rem; width: 82px; height: 82px; display: grid; place-items: center; border-radius: 50%; background: var(--civic-gold); color: var(--civic-ink); font-size: 2rem; }

.training-detail-content { padding-block: 5.5rem 7rem; }
.training-detail-layout { display: grid; align-items: start; gap: 4rem; grid-template-columns: minmax(0,1fr) 310px; }
.training-detail-article { min-width: 0; }
.training-detail-section-label { color: var(--civic-blue); font-size: .7rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.training-detail-article h2 { margin-top: .7rem; font-family: "Plus Jakarta Sans",sans-serif; font-size: clamp(1.8rem,3.5vw,3rem); font-weight: 800; letter-spacing: -.045em; }
.training-detail-description { margin-top: 1.4rem; color: var(--civic-muted); font-size: 1rem; line-height: 1.9; }
.training-detail-facts { display: grid; gap: 1px; margin-top: 2.7rem; background: var(--civic-line); grid-template-columns: repeat(2,1fr); }
.training-detail-fact { min-height: 110px; padding: 1.25rem; background: #fff; }
.training-detail-fact span { display: block; color: var(--civic-muted); font-size: .7rem; font-weight: 700; }
.training-detail-fact strong { display: block; margin-top: .45rem; color: var(--civic-ink); font-size: .94rem; line-height: 1.5; }
.training-gallery { margin-top: 4rem; padding-top: 3rem; border-top: 1px solid var(--civic-line); }
.training-gallery__grid { display: grid; gap: .8rem; grid-template-columns: repeat(2,minmax(0,1fr)); margin-top: 1.5rem; }
.training-gallery figure { overflow: hidden; margin: 0; border-radius: 12px; background: #edf3f5; }
.training-gallery figure:first-child:nth-last-child(n+3) { grid-column: 1/-1; }
.training-gallery img,.training-gallery video { width: 100%; aspect-ratio: 16/10; display: block; object-fit: cover; }
.training-gallery figcaption { padding: .6rem .75rem; color: var(--civic-muted); font-size: .7rem; }

.training-detail-aside { position: sticky; top: 132px; padding: 1.6rem; border: 1px solid var(--civic-line); border-radius: var(--civic-radius-md); background: #f7f9fa; }
.training-detail-aside__icon { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 50%; background: #dff2ff; color: var(--civic-blue); }
.training-detail-aside h2 { margin-top: 1.2rem; font-family: "Plus Jakarta Sans",sans-serif; font-size: 1.2rem; font-weight: 800; letter-spacing: -.03em; }
.training-detail-aside p { margin-top: .6rem; color: var(--civic-muted); font-size: .8rem; line-height: 1.65; }
.training-detail-aside a { width: 100%; min-height: 46px; display: inline-flex; align-items: center; justify-content: center; gap: .45rem; margin-top: 1.2rem; border-radius: 999px; background: var(--civic-blue); color: #fff; font-size: .8rem; font-weight: 800; text-decoration: none; }

.training-registration { margin-top: 4.5rem !important; padding-top: 3rem !important; border-top: 1px solid var(--civic-line) !important; }
.training-registration > h2 { margin: 0 !important; }
.training-registration > p { margin-top: .65rem !important; }
#mainForm { margin-top: 2rem; }
#mainForm input:not([type="hidden"]):not([type="checkbox"]),
#mainForm select,
#mainForm button { min-height: 46px; }
#mainForm input:not([type="hidden"]):not([type="checkbox"]),
#mainForm select { border-color: #ccd6dd !important; background: #f8fafb !important; }
#mainForm label { color: var(--civic-ink-soft) !important; font-size: .74rem !important; }
#mainForm button[type="submit"] { border-radius: 999px !important; }

@media (max-width: 960px) {
    .training-detail-hero__grid { grid-template-columns: 1fr; }
    .training-detail-hero__media { min-height: 440px; }
    .training-detail-layout { grid-template-columns: 1fr; }
    .training-detail-aside { position: static; }
}

@media (max-width: 640px) {
    .training-detail-hero { padding-block: 1.5rem 4rem; }
    .training-detail-hero__grid { gap: 2.5rem; }
    .training-detail-hero__media { min-height: 320px; border-radius: 1.4rem 1.4rem 4rem 1.4rem; }
    .training-detail-content { padding-block: 4rem 5rem; }
    .training-detail-facts { grid-template-columns: 1fr; }
    .training-gallery__grid { grid-template-columns: 1fr; }
}