/* CISFA landing page. All visual changes stay within the site home page. */
#page-site-index {
    --cisfa-plum: #34104f;
    --cisfa-purple: #5a2580;
    --cisfa-teal: #8fe1df;
    --cisfa-ink: #282135;
    --cisfa-muted: #6b6375;
    --cisfa-line: #e9e2ef;
    background: #f8f6fb;
    color: var(--cisfa-ink);
}
#page-site-index #page,
#page-site-index #region-main,
#page-site-index #page.drawers .main-inner {
    background: #f8f6fb;
}
#page-site-index .cisfa-hero {
    background: radial-gradient(ellipse at 95% 0%, #3d5470 0%, transparent 45%), linear-gradient(120deg, #28113e, #4f246a);
    color: #fff;
    overflow: hidden;
}
#page-site-index .cisfa-hero-inner {
    display: grid;
    grid-template-columns: .85fr 1.25fr;
    align-items: center;
    gap: clamp(24px, 4vw, 64px);
    max-width: 1360px;
    margin: 0 auto;
    padding: 72px 40px 56px;
}
#page-site-index .cisfa-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: var(--cisfa-purple);
    font-size: 11px;
    font-weight: 750;
    letter-spacing: 2px;
    line-height: 1.6;
}
#page-site-index .cisfa-hero .cisfa-eyebrow { color: var(--cisfa-teal); }
#page-site-index .cisfa-live-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--cisfa-teal);
    box-shadow: 0 0 0 5px rgba(143, 225, 223, .12);
}
#page-site-index .cisfa-hero h1 {
    max-width: 520px;
    margin: 22px 0;
    color: #fff;
    font-size: clamp(34px, 3.7vw, 53px);
    line-height: 1.12;
    letter-spacing: -1.8px;
    font-weight: 750;
}
#page-site-index .cisfa-hero h1 span { color: var(--cisfa-teal); }
#page-site-index .cisfa-hero-copy > p {
    max-width: 440px;
    color: #e4daed;
    line-height: 1.85;
    font-size: 15px;
    margin-bottom: 28px;
}
#page-site-index .cisfa-hero-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 20px;
}
#page-site-index .cisfa-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    min-height: 48px;
    padding: 13px 23px;
    border: 1px solid transparent;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    transition: transform .2s ease, box-shadow .2s ease;
}
#page-site-index .cisfa-button-light {
    background: #fff;
    color: var(--cisfa-plum);
    box-shadow: 0 5px 20px #17082526;
}
#page-site-index .cisfa-button:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 28px #17082540;
}
#page-site-index .cisfa-hero-about {
    color: #fff;
    font-size: 13px;
    text-underline-offset: 5px;
}
#page-site-index .cisfa-hero-about i { margin-left: 6px; font-size: 10px; }
#page-site-index .cisfa-hero-note {
    margin-top: 30px;
    font-size: 12px;
    color: #d4c5df;
}
#page-site-index .cisfa-hero-note i { margin-right: 7px; color: var(--cisfa-teal); }
#page-site-index .cisfa-hero-video {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    background: #251735;
    border: 1px solid #ffffff30;
    border-radius: 20px;
    box-shadow: 0 24px 70px #13051c66, 0 0 0 8px #ffffff06;
    overflow: hidden;
}
#page-site-index .cisfa-hero-video video {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}
#page-site-index .cisfa-video-controls:not([hidden]) {
    position: absolute;
    right: 10px;
    bottom: 10px;
    display: flex;
    gap: 7px;
}
#page-site-index .cisfa-video-controls button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border: 1px solid #ffffffa0;
    border-radius: 50%;
    background: #1b0b2bcf;
    color: #fff;
    cursor: pointer;
}
#page-site-index .cisfa-video-controls button:hover { background: var(--cisfa-purple); }
#page-site-index .cisfa-topics {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 18px 40px;
    padding: 22px 24px;
    background: #1f0b3338;
    border-top: 1px solid #ffffff15;
    color: #e4daed;
    font-size: 12px;
}
#page-site-index .cisfa-topics > span:first-child { color: #c3b1d1; }
#page-site-index .cisfa-topics i { margin-right: 8px; color: var(--cisfa-teal); }
#page-site-index .cisfa-courses,
#page-site-index #frontpage-available-course-list > h2 {
    width: calc(100% - 80px);
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}
#page-site-index .cisfa-featured { padding: 76px 0 60px; }
#page-site-index .cisfa-section-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 30px;
}
#page-site-index .cisfa-section-heading h2,
#page-site-index #frontpage-available-course-list > h2 {
    color: var(--cisfa-ink);
    font-weight: 750;
    letter-spacing: -.8px;
    font-size: clamp(26px, 3vw, 34px);
    line-height: 1.2;
}
#page-site-index .cisfa-section-heading h2 { margin: 9px 0 12px; }
#page-site-index .cisfa-section-heading p {
    max-width: 620px;
    color: var(--cisfa-muted);
    font-size: 14px;
    line-height: 1.8;
    margin: 0;
}
#page-site-index .cisfa-text-link {
    white-space: nowrap;
    color: var(--cisfa-purple);
    font-size: 13px;
    font-weight: 700;
    padding: 10px 0;
}
#page-site-index .cisfa-text-link i { margin-left: 8px; }
#page-site-index .cisfa-course-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 28px;
}
#page-site-index .cisfa-course-card {
    position: relative;
    min-width: 0;
    background: #fff;
    border: 1px solid var(--cisfa-line);
    border-radius: 20px;
    box-shadow: 0 8px 24px #34104f08, 0 2px 5px #34104f04;
    overflow: hidden;
    transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}
#page-site-index .cisfa-course-card:hover,
#page-site-index .cisfa-course-card:focus-within {
    transform: translateY(-4px);
    border-color: #cdb9dd;
    box-shadow: 0 22px 45px #34104f19, 0 6px 12px #34104f08;
}
#page-site-index .cisfa-card-link {
    display: flex;
    flex-direction: column;
    height: 100%;
    color: var(--cisfa-ink);
    text-decoration: none;
}
#page-site-index .cisfa-card-media {
    position: relative;
    aspect-ratio: 16 / 10;
    background: #eeeaf3;
    overflow: hidden;
}
#page-site-index .cisfa-card-media img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    transition: transform .5s ease;
}
#page-site-index .cisfa-course-card:hover .cisfa-card-media img { transform: scale(1.035); }
#page-site-index .cisfa-course-badge {
    position: absolute;
    top: 16px;
    left: 16px;
    padding: 6px 12px;
    border: 1px solid #ffffffcc;
    border-radius: 999px;
    background: #fffffff2;
    color: var(--cisfa-plum);
    font-size: 10px;
    font-weight: 750;
    box-shadow: 0 2px 10px #34104f10;
}
#page-site-index .cisfa-course-badge i { color: #946207; margin-right: 4px; }
#page-site-index .cisfa-card-body {
    display: flex;
    flex-direction: column;
    flex: 1;
    align-items: flex-start;
    padding: 26px;
}
#page-site-index .cisfa-card-meta {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: var(--cisfa-purple);
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: .8px;
    font-weight: 750;
    margin-bottom: 14px;
}
#page-site-index .cisfa-card-body h3 {
    color: var(--cisfa-ink);
    font-size: 19px;
    font-weight: 700;
    line-height: 1.45;
    letter-spacing: -.35px;
    margin: 0 0 14px;
    overflow-wrap: anywhere;
}
#page-site-index .cisfa-card-body p {
    color: var(--cisfa-muted);
    font-size: 13px;
    line-height: 1.8;
    margin: 0 0 25px;
}
#page-site-index .cisfa-card-cta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    align-self: stretch;
    margin-top: auto;
    padding-top: 17px;
    border-top: 1px solid var(--cisfa-line);
    color: var(--cisfa-purple);
    font-weight: 700;
    font-size: 13px;
}
#page-site-index .cisfa-card-cta i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #f2edf7;
    transition: background .2s ease, color .2s ease;
}
#page-site-index .cisfa-course-card:hover .cisfa-card-cta i { background: var(--cisfa-purple); color: #fff; }
#page-site-index .cisfa-featured .cisfa-course-grid[data-course-count="1"] { grid-template-columns: 1fr; }
#page-site-index .cisfa-featured .cisfa-course-grid[data-course-count="1"] .cisfa-card-link {
    display: grid;
    grid-template-columns: 1.05fr 1fr;
}
#page-site-index .cisfa-featured .cisfa-course-grid[data-course-count="1"] .cisfa-card-media { aspect-ratio: auto; min-height: 340px; }
#page-site-index .cisfa-featured .cisfa-course-grid[data-course-count="1"] .cisfa-card-body { padding: 40px; }
#page-site-index .cisfa-featured .cisfa-course-grid[data-course-count="1"] h3 { font-size: clamp(22px, 2.1vw, 29px); line-height: 1.35; }
#page-site-index #frontpage-available-course-list { padding: 0 0 24px; }
#page-site-index #frontpage-available-course-list > h2 { margin-bottom: 26px; }
#page-site-index .cisfa-catalog { padding: 0 0 16px; }
#page-site-index #page #page-content .box { max-width: 1200px; width: calc(100% - 80px); }
#page-site-index #page #page-content .box form {
    background: #fff;
    padding: 8px;
    border: 1px solid var(--cisfa-line);
    border-radius: 14px;
}
#page-site-index .simplesearchform .form-control { border: 0; background: transparent; box-shadow: none; }
#page-site-index .simplesearchform .search-icon { border-radius: 9px; }
#page-site-index .cisfa-contact-banner {
    max-width: 1200px;
    width: calc(100% - 80px);
    margin: 48px auto 72px;
    padding: 42px 48px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
    border-radius: 24px;
    background: radial-gradient(ellipse at 100% 0%, #73538b, transparent 70%), #34104f;
    color: #fff;
}
#page-site-index .cisfa-contact-banner .cisfa-eyebrow { color: var(--cisfa-teal); }
#page-site-index .cisfa-contact-banner h2 { margin: 10px 0; color: #fff; font-size: 28px; letter-spacing: -.7px; }
#page-site-index .cisfa-contact-banner p { margin: 0; color: #e4daed; font-size: 14px; }
#page-site-index .cisfa-contact-banner .cisfa-button { flex-shrink: 0; }
#page-site-index #footer { background: #241232; }
#page-site-index #footer .footer-main { background: transparent; padding: 38px 24px; }
#page-site-index #footer .footer-bottom { background: #1b0d26; }
#page-site-index #footer .footer-main h2 { color: #fff; font-size: 14px; font-weight: 700; }
#page-site-index #footer .footer-main p,
#page-site-index #footer .footer-main a { color: #ded3e7; font-size: 13px; line-height: 1.8; }
#page-site-index #footer .footer-main .row { max-width: 1248px; margin: 0 auto; }
#page-site-index .cisfa-button:focus-visible,
#page-site-index .cisfa-card-link:focus-visible,
#page-site-index .cisfa-video-controls button:focus-visible { outline: 3px solid #24a8b1; outline-offset: 4px; }
@media (max-width: 1000px) {
    #page-site-index .cisfa-hero-inner { grid-template-columns: 1fr 1.15fr; gap: 28px; padding: 48px 28px; }
    #page-site-index .cisfa-hero h1 { font-size: 36px; letter-spacing: -1px; }
    #page-site-index .cisfa-course-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    #page-site-index .cisfa-featured .cisfa-course-grid[data-course-count="1"] .cisfa-card-body { padding: 28px; }
    #page-site-index .cisfa-contact-banner { padding: 32px; }
}
@media (max-width: 767px) {
    #page-site-index .cisfa-hero-inner { grid-template-columns: 1fr; padding: 40px 24px 32px; gap: 32px; }
    #page-site-index .cisfa-hero h1 { max-width: 520px; font-size: clamp(34px, 7vw, 46px); }
    #page-site-index .cisfa-hero-copy > p { max-width: 560px; }
    #page-site-index .cisfa-hero-note { margin-top: 24px; }
    #page-site-index .cisfa-topics { gap: 14px 24px; padding: 22px; font-size: 11px; }
    #page-site-index .cisfa-topics > span:first-child { flex-basis: 100%; text-align: center; }
    #page-site-index .cisfa-courses,
    #page-site-index #frontpage-available-course-list > h2,
    #page-site-index #page #page-content .box,
    #page-site-index .cisfa-contact-banner { width: calc(100% - 40px); }
    #page-site-index .cisfa-featured { padding: 48px 0 40px; }
    #page-site-index .cisfa-section-heading { flex-direction: column; align-items: flex-start; gap: 8px; }
    #page-site-index .cisfa-course-grid { gap: 20px; }
    #page-site-index .cisfa-featured .cisfa-course-grid[data-course-count="1"] .cisfa-card-link { display: flex; }
    #page-site-index .cisfa-featured .cisfa-course-grid[data-course-count="1"] .cisfa-card-media { aspect-ratio: 16 / 10; min-height: 0; }
    #page-site-index .cisfa-featured .cisfa-course-grid[data-course-count="1"] h3 { font-size: 22px; }
    #page-site-index .cisfa-contact-banner { flex-direction: column; align-items: flex-start; margin-top: 32px; margin-bottom: 48px; padding: 30px 26px; }
    #page-site-index .cisfa-contact-banner h2 { font-size: 25px; }
}
@media (max-width: 540px) {
    #page-site-index .cisfa-course-grid { grid-template-columns: minmax(0, 1fr); }
    #page-site-index .cisfa-hero-video { border-radius: 14px; }
    #page-site-index .cisfa-video-controls button { width: 40px; height: 40px; }
}
@media (prefers-reduced-motion: reduce) {
    #page-site-index .cisfa-course-card,
    #page-site-index .cisfa-card-media img,
    #page-site-index .cisfa-card-cta i,
    #page-site-index .cisfa-button { transition: none; }
    #page-site-index .cisfa-course-card:hover,
    #page-site-index .cisfa-course-card:focus-within,
    #page-site-index .cisfa-course-card:hover .cisfa-card-media img,
    #page-site-index .cisfa-button:hover { transform: none; }
}
/* Match utility controls and footer details to the home page palette. */
#page-site-index .drawer-toggler .btn,
#page-site-index #footer button.btn-footer-popover {
    background: var(--cisfa-purple) !important;
    color: #fff;
    border-color: var(--cisfa-purple);
}
#page-site-index #footer .footer-bottom,
#page-site-index #footer .footer-bottom p {
    color: #d5c8df;
    font-size: 12px;
}
#page-site-index #footer .footer-main .social-media ul li {
    width: 44px;
    height: 44px;
    line-height: 44px;
    margin: 0;
    border-radius: 12px;
}
#page-site-index #footer .footer-main .social-media ul li::after { display: none; }
#page-site-index #footer .footer-main .social-media ul li a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    font-size: 17px;
    line-height: 1;
    color: #fff;
    border-radius: 12px;
}
#page-site-index #footer .footer-content-popover {
    background: #fff;
    color: var(--cisfa-ink);
    border-radius: 14px;
}

/* Editorial course imagery and restrained movement. */
#page-site-index .cisfa-card-media > img { object-fit: cover; }
#page-site-index .cisfa-card-media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, #23133212 40%, #23133270); pointer-events: none; }
#page-site-index .cisfa-cover-signature { position: absolute; z-index: 1; right: 20px; bottom: 18px; width: 84px; opacity: .92; }
#page-site-index .cisfa-cover-signature img { display: block; width: 100%; height: auto; object-fit: contain; transform: none !important; }
#page-site-index .cisfa-course-badge { z-index: 1; backdrop-filter: blur(10px); }
#page-site-index .cisfa-card-meta { font-size: 10px; line-height: 1.6; letter-spacing: 1px; }
#page-site-index .cisfa-card-body h3 { font-weight: 650; }
#page-site-index .cisfa-card-link:focus-visible { outline-offset: -4px; border-radius: 20px; }
