/* Corporate training page (/corporate-training). Layout, type and colours come from Bootstrap
   and the theme utilities; this file only holds what they don't cover. */

.cbt section[id] { scroll-margin-top: 80px; }
.cbt-alt { background: #f5f9ff; }

/* Shared text styles */
.cbt-eyebrow { margin-bottom: 16px; font-size: 12px; line-height: 17px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--bs-primary); }
.cbt-h2 { margin: 0; font-size: 28px; line-height: 34px; font-weight: 700; letter-spacing: -.03em; color: #1c1d1f; text-wrap: balance; }
.cbt-label { font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--bs-primary); }
.cbt-pill { display: inline-flex; padding: 4px 12px; border: 1px solid #d8e6fd; border-radius: 50rem; background: #f5f9ff; color: #1c1d1f; font-size: 12px; line-height: 18px; font-weight: 600; }
.cbt-narrow { max-width: 760px; }
@media (min-width: 768px) { .cbt-h2 { font-size: 34px; line-height: 40px; } }
@media (min-width: 992px) { .cbt-h2 { font-size: 44px; line-height: 50px; } }

/* Header: sits over the hero, gains a frosted background once the page scrolls */
.cbt-header { margin-bottom: -68px; transition: background-color .2s ease-out, box-shadow .2s ease-out; }
.cbt-header.scrolled { background: rgba(255, 255, 255, .85); backdrop-filter: saturate(1.4) blur(14px); box-shadow: 0 1px 0 rgba(28, 29, 31, .08); }
.cbt-hdr { height: 68px; }
.cbt-logo { height: 32px; width: auto; }
.cbt-partner-logo { height: 30px; width: auto; }
@media (max-width: 420px) { .cbt-logo { height: 26px; } .cbt-partner-logo { height: 24px; } }
.cbt-nav a[aria-current="true"], .cbt-nav a:hover { color: var(--bs-primary) !important; }

/* Hero */
.cbt-hero { padding: 100px 0 64px; }
.cbt-hero h1 { letter-spacing: -.04em; }
.cbt-film { padding: 6px; }
.cbt-film video { width: 100%; height: 100%; }
.cbt-cta .bi { transition: transform .15s ease-out; }
.cbt-cta:hover .bi { transform: translateX(2px); }
@media (min-width: 992px) { .cbt-hero { padding: 140px 0 104px; } }

/* Faculty */
.cbt-avatar { width: 140px; height: 140px; object-fit: cover; box-shadow: 0 0 0 4px #fff, 0 0 0 5px rgba(28, 29, 31, .12); }

/* Pilot steps: numbered dots joined by a line (across on desktop, down on mobile) */
.cbt-pilot { padding-left: 12px; padding-right: 12px; }
.cbt-steps li { position: relative; }
.cbt-dot { position: relative; z-index: 1; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--bs-primary); color: #fff; font-size: 14px; font-weight: 700; }
.cbt-steps li:not(:last-child)::after { content: ""; position: absolute; background: var(--bs-primary); }
@media (min-width: 768px) {
    .cbt-steps li { text-align: center; }
    .cbt-dot { margin: 0 auto; }
    .cbt-steps li:not(:last-child)::after { top: 15px; left: calc(50% + 28px); right: calc(-50% + 28px); height: 2px; }
}
@media (max-width: 767.98px) {
    .cbt-steps li { padding-left: 52px; }
    .cbt-dot { position: absolute; left: 12px; top: 0; }
    .cbt-steps li:not(:last-child)::after { top: 44px; bottom: -12px; left: 27px; width: 2px; }
}

/* Form */
.cbt .invalid-feedback:not(:empty) { display: block; }
.cbt textarea.form-control { resize: none; }
.cbt .btn-check + .btn { --bs-btn-color: #54585b; --bs-btn-border-color: #d1d7dc; }

/* Confirmation after the enquiry is sent: what happens next */
.cbt-success:focus { outline: none; }
.cbt-timeline { list-style: none; margin: 30px 0 0; padding: 0; }
.cbt-timeline li { position: relative; padding: 0 0 28px 44px; }
.cbt-timeline li:last-child { padding-bottom: 0; }
.cbt-timeline li:not(:last-child)::before { content: ""; position: absolute; left: 11px; top: 26px; bottom: 2px; width: 2px; background: #d1d7dc; }
.cbt-timeline li:first-child::before { background: var(--bs-primary); }
.cbt-timeline .bi { position: absolute; left: 0; top: 0; font-size: 24px; line-height: 1; color: #d1d7dc; }
.cbt-timeline li:first-child .bi { color: var(--bs-primary); }

/* FAQ heading stays in view beside the questions on desktop */
@media (min-width: 992px) { .cbt-faq-head { position: sticky; top: 100px; } }

/* Mobile: a call-to-action bar slides up once the hero is out of view */
.cbt-mcta { position: fixed; left: 0; right: 0; bottom: 0; z-index: 1020; padding: 10px 16px calc(10px + env(safe-area-inset-bottom)); background: rgba(255, 255, 255, .85); backdrop-filter: blur(14px); border-top: 1px solid #e4e8eb; transform: translateY(110%); transition: transform .3s ease-out; }
.cbt-mcta.show { transform: none; }

/* Scroll reveal: a short fade-up. JS adds .motion-ready only after marking what is already in view */
.motion-ready .cbt-reveal { opacity: 0; translate: 0 10px; transition: opacity .5s ease-out, translate .5s ease-out; }
.motion-ready .cbt-reveal.in { opacity: 1; translate: none; }
@media (prefers-reduced-motion: reduce) {
    .cbt-header, .cbt-mcta, .cbt-cta .bi { transition: none; }
}
