/* Professional Development content layout from PowerPoint slide 6. */
.pd-page { --pd-teal: #007d79; --pd-dark: #005653; --pd-green: #04d179; color: #101817; }
.pd-page .training-wrap { max-width: none; padding: 0 0 30px; }
.pd-page .pd-hero { position: relative; isolation: isolate; overflow: hidden; background: var(--pd-teal); min-height: 335px; padding: 24px max(28px, calc((100vw - 1400px) / 2)); color: #fff; }
.pd-page .pd-hero-image { position: absolute; z-index: -2; inset: 0 0 0 auto; width: auto; max-width: 55%; height: 100%; object-fit: contain; object-position: right top; -webkit-mask-image: linear-gradient(to right, transparent, #000 38%); mask-image: linear-gradient(to right, transparent, #000 38%); }
.pd-page .pd-hero::after { content: ''; position: absolute; z-index: -1; inset: 0; background: linear-gradient(90deg, var(--pd-teal) 45%, rgba(0, 125, 121, .85) 56%, transparent 76%); }
.pd-page .pd-hero-copy { max-width: 620px; }
.pd-page .pd-eyebrow { color: var(--pd-green); text-transform: uppercase; font-size: .95rem; line-height: 1.1; margin: 0 0 6px; }
.pd-page .pd-hero h1 { color: #fff; font-family: var(--font-heading); font-weight: 400; font-size: clamp(2.15rem, 3.4vw, 3.05rem); line-height: 1.12; margin: 0 0 18px; max-width: 610px; }
.pd-page .pd-hero-lead { font-size: 1.08rem; line-height: 1.3; max-width: 610px; }
.pd-page .pd-hero-lead p { margin: 0 0 26px; }
.pd-page .pd-button { display: inline-flex; align-items: center; justify-content: center; width: auto; border: 0; border-radius: 5px; background: var(--pd-green); color: #071b16; padding: 8px 18px; font-family: var(--font-body); font-weight: 400; font-size: 1rem; line-height: 1.2; text-transform: none; letter-spacing: 0; text-decoration: none; cursor: pointer; box-shadow: none; }
.pd-page .pd-button:hover, .pd-page .pd-button:focus-visible { background: #00b96a; color: #071b16; }
.pd-page .pd-button-secondary { background: #05a39e; color: #fff; }
.pd-page .pd-button-secondary:hover, .pd-page .pd-button-secondary:focus-visible { background: #008c88; color: #fff; }
.pd-page .pd-edit-link { display: inline-block; margin-left: 14px; color: #fff; text-decoration: underline; }
.pd-page .pd-feature-strip { display: grid; grid-template-columns: 1fr 1.15fr 1.25fr 1fr; background: var(--pd-dark); color: #fff; padding: 0 max(12px, calc((100vw - 1420px) / 2)); }
.pd-page .pd-feature { display: flex; align-items: center; min-width: 0; gap: 7px; min-height: 56px; font-size: 1rem; line-height: 1.2; }
.pd-page .pd-feature-icons { display: flex; align-items: center; flex-shrink: 0; }
.pd-page .pd-feature-icons img { display: block; width: 54px; height: 54px; object-fit: contain; }
.pd-page .pd-feature-icons img + img { margin-left: -12px; }
.pd-page .pd-offerings { display: grid; gap: 24px; max-width: 1440px; margin: 20px auto 26px; padding: 0 20px; }
.pd-page .pd-offering { display: grid; grid-template-columns: minmax(0, 1fr); gap: 22px; position: relative; padding: 28px 24px 24px 20px; border: 0; border-radius: 26px; background: #f1f1f1; box-shadow: none; }
.pd-page .pd-offering.has-photo { grid-template-columns: minmax(0, 1fr) 260px; }
.pd-page .pd-offering-copy { min-width: 0; display: flex; flex-direction: column; }
.pd-page .pd-offering h2 { color: #080d0c; background: transparent; font-family: var(--font-display); font-weight: 400; font-size: clamp(1.45rem, 2vw, 1.9rem); line-height: 1.2; margin: 0 0 18px; padding: 0; border: 0; }
.pd-page .pd-offering-description { font-size: 1.13rem; line-height: 1.3; }
.pd-page .pd-offering-description p { margin: 0 0 12px; }
.pd-page .pd-offering-photo { align-self: center; width: 260px; height: 195px; object-fit: cover; }
.pd-page .pd-offering-bottom { display: flex; justify-content: space-between; align-items: center; gap: 14px; margin-top: auto; padding-top: 28px; padding-right: 24px; }
.pd-page .pd-duration { display: flex; align-items: center; gap: 10px; margin: 0; font-size: 1rem; line-height: 1.2; }
.pd-page .pd-duration svg { width: 32px; height: 32px; flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
.pd-page .pd-support { display: grid; grid-template-columns: minmax(0, 1.8fr) minmax(300px, 1fr); gap: 32px; max-width: 1400px; margin: 0 auto 24px; padding: 24px 28px; background: var(--pd-dark); color: #fff; border-radius: 26px; }
.pd-page .pd-support h2 { font-family: var(--font-display); font-size: clamp(1.6rem, 2.4vw, 2.2rem); font-weight: 400; line-height: 1.15; color: #fff; margin: 0 0 18px; }
.pd-page .pd-support-copy { display: flex; flex-direction: column; min-width: 0; font-size: 1.13rem; line-height: 1.3; }
.pd-page .pd-support-copy p { margin: 0 0 18px; }
.pd-page .pd-support-actions { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-top: auto; }
.pd-page .pd-support-features { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 16px; align-items: center; }
.pd-page .pd-support-features > div { display: flex; flex-direction: column; align-items: center; text-align: center; font-size: 1rem; line-height: 1.2; }
.pd-page .pd-support-icon { display: flex; justify-content: center; align-items: center; width: 160px; height: 106px; color: #fff; }
.pd-page .pd-support-icon img, .pd-page .pd-support-icon svg { display: block; width: 160px; height: 106px; object-fit: contain; }
.pd-page .pd-offering > .admin-actions { position: static; grid-column: 1 / -1; justify-content: flex-end; }
.pd-page .pd-offering > .jump-link-panel { grid-column: 1 / -1; }
.pd-page .pd-offerings + .pd-support { margin-left: max(20px, calc((100vw - 1400px) / 2)); margin-right: max(20px, calc((100vw - 1400px) / 2)); }
.pd-page .training-wrap > .d-flex { max-width: 1400px; margin: 16px auto; padding: 0 20px; flex-wrap: wrap; }
.pd-page #trainingAdminForm { max-width: 1400px; margin: 0 auto; }
.pd-page .is-inactive { opacity: .6; }
@media (max-width: 1100px) {
    .pd-page .pd-feature { font-size: .85rem; gap: 3px; }
    .pd-page .pd-feature-icons img { width: 44px; height: 44px; }
    .pd-page .pd-offering.has-photo { grid-template-columns: minmax(0, 1fr) 220px; }
    .pd-page .pd-offering-photo { width: 220px; height: 165px; }
    .pd-page .pd-offering-bottom { padding-right: 0; }
    .pd-page .pd-support { grid-template-columns: minmax(0, 1.5fr) minmax(270px, 1fr); gap: 20px; }
    .pd-page .pd-support-icon, .pd-page .pd-support-icon img, .pd-page .pd-support-icon svg { width: 130px; height: 94px; }
}
@media (max-width: 760px) {
    .pd-page .pd-hero { padding: 26px 22px; }
    .pd-page .pd-hero-copy { max-width: 74%; }
    .pd-page .pd-hero-image { max-width: 65%; }
    .pd-page .pd-hero::after { background: linear-gradient(90deg, var(--pd-teal) 25%, rgba(0, 125, 121, .9) 60%, rgba(0, 125, 121, .35)); }
    .pd-page .pd-feature-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 4px 12px; gap: 4px 8px; }
    .pd-page .pd-offerings { padding: 0 16px; gap: 18px; margin-top: 18px; }
    .pd-page .pd-offering, .pd-page .pd-offering.has-photo { grid-template-columns: minmax(0, 1fr); padding: 22px; gap: 18px; }
    .pd-page .pd-offering-photo { width: 100%; height: auto; max-height: 260px; object-fit: cover; }
    .pd-page .pd-offering-bottom { flex-wrap: wrap; padding-top: 16px; }
    .pd-page .pd-support { grid-template-columns: minmax(0, 1fr); margin: 0 16px 18px; padding: 24px; }
    .pd-page .pd-offerings + .pd-support { margin-left: 16px; margin-right: 16px; }
    .pd-page .pd-support-features { gap: 12px; }
    .pd-page .pd-support-icon, .pd-page .pd-support-icon img, .pd-page .pd-support-icon svg { width: 150px; height: 100px; }
}
@media (max-width: 480px) {
    .pd-page .pd-hero-copy { max-width: 100%; }
    .pd-page .pd-hero-image { max-width: 100%; }
    .pd-page .pd-hero::after { background: rgba(0, 100, 97, .86); }
    .pd-page .pd-hero-lead, .pd-page .pd-offering-description, .pd-page .pd-support-copy { font-size: 1rem; line-height: 1.4; }
    .pd-page .pd-feature-icons img { width: 36px; height: 36px; }
    .pd-page .pd-feature { font-size: .8rem; }
    .pd-page .pd-feature:nth-child(4) .pd-feature-icons img + img { display: none; }
    .pd-page .pd-offering-bottom { flex-direction: column; align-items: flex-start; }
    .pd-page .pd-support-actions { align-items: stretch; flex-direction: column; }
    .pd-page .pd-support-icon, .pd-page .pd-support-icon img, .pd-page .pd-support-icon svg { width: 120px; height: 90px; }
}