/* Catálogo público — layout da referência. */

html,
body {
    max-width: 100%;
    overflow-x: hidden;
}

html:not(.dark) body {
    background: #f3f7fc !important;
}

html:not(.dark) body:has(.catalog-page) header button.bg-emerald-600 {
    border-color: #e3a008 !important;
    background: #f5b400 !important;
    color: #102a4c !important;
    box-shadow: 0 10px 24px -14px rgba(227, 160, 8, .7) !important;
}

html:not(.dark) body:has(.catalog-page) header button.bg-emerald-600:hover {
    background: #e3a008 !important;
}

html:not(.dark) .catalog-page-hero {
    display: flex;
    align-items: center;
    min-height: 37rem;
    padding-top: 5rem !important;
    padding-bottom: 7rem !important;
    background: #052f63 !important;
}

html:not(.dark) .catalog-page-hero > .absolute:not(.catalog-hero-background):not(.catalog-hero-overlay) {
    display: none !important;
}

html:not(.dark) .catalog-page-hero .catalog-hero-background {
    display: block !important;
    z-index: 0;
    filter: saturate(.82) contrast(1.08);
}

html:not(.dark) .catalog-page-hero .catalog-hero-overlay {
    display: block !important;
    z-index: 1;
    background: linear-gradient(90deg, rgba(1, 22, 49, .9) 0%, rgba(3, 47, 99, .78) 50%, rgba(1, 22, 49, .72) 100%);
}

html:not(.dark) .catalog-page-hero > .relative {
    width: 100%;
    max-width: 80rem !important;
}

html:not(.dark) .catalog-page-hero > div > span {
    padding: .45rem 1.35rem !important;
    border: 0 !important;
    background: #f5b400 !important;
    color: #102a4c !important;
}

html:not(.dark) .catalog-page-hero h1 {
    max-width: 58rem !important;
    font-size: clamp(3.7rem, 4.3vw, 4.4rem) !important;
    font-weight: 500 !important;
    letter-spacing: -.045em !important;
    line-height: 1.04 !important;
}

html:not(.dark) .catalog-page-hero p {
    max-width: 48rem !important;
    color: #dbe8f5 !important;
    font-size: .95rem !important;
    line-height: 1.65 !important;
}

html:not(.dark) .catalog-page-hero a {
    padding: .85rem 1.45rem !important;
    border-radius: 1rem !important;
}

html:not(.dark) .catalog-value-strip {
    margin-top: -5.2rem !important;
}

html:not(.dark) .catalog-value-strip > div {
    max-width: 80rem !important;
}

html:not(.dark) .catalog-value-card {
    min-height: 12rem;
    padding: 1.8rem !important;
    border-color: #f5dfae !important;
    border-radius: 1.25rem !important;
    background: #fff9e8 !important;
    box-shadow: 0 16px 34px -30px rgba(3, 39, 86, .38) !important;
}

html:not(.dark) .catalog-value-card h2 {
    font-size: 1.25rem !important;
}

html:not(.dark) .catalog-value-card p {
    font-size: .78rem !important;
    line-height: 1.55 !important;
}

html:not(.dark) .catalog-page {
    width: 100%;
    max-width: 80rem !important;
    padding-top: 2.5rem !important;
    padding-bottom: 7rem !important;
}

html:not(.dark) .catalog-filter-panel {
    top: .75rem;
    margin-bottom: 2.5rem !important;
    padding: 1rem !important;
    border-color: #dfe7f0 !important;
    border-radius: 1rem !important;
    background: rgba(248, 250, 252, .96) !important;
    box-shadow: 0 12px 26px -24px rgba(3, 39, 86, .36) !important;
}

html:not(.dark) .catalog-filter-panel > .flex {
    margin-bottom: 0 !important;
}

html:not(.dark) .catalog-filter-panel button,
html:not(.dark) .catalog-filter-panel > .flex > a {
    padding: .7rem 1.25rem !important;
    border-radius: 1rem !important;
    font-size: .78rem !important;
}

html:not(.dark) .catalog-showcase-head {
    margin-bottom: 3.25rem !important;
    padding: 2.4rem !important;
    border-color: #dfe7f0 !important;
    border-radius: 1.25rem !important;
    box-shadow: 0 14px 30px -28px rgba(3, 39, 86, .36) !important;
}

html:not(.dark) .catalog-showcase-head h2 {
    color: #052f63 !important;
    font-size: 2.5rem !important;
    font-weight: 500 !important;
}

html:not(.dark) .catalog-showcase-head p {
    font-size: .85rem !important;
    line-height: 1.55 !important;
}

html:not(.dark) .catalog-showcase-head input,
html:not(.dark) .catalog-showcase-head a {
    border-radius: 1rem !important;
}

html:not(.dark) .catalog-page #public-courses-grid {
    gap: 2rem 1.5rem !important;
}

html:not(.dark) .catalog-course-card {
    border: 1px solid #dce5ef !important;
    border-top: 0 !important;
    border-radius: 1.15rem !important;
    box-shadow: 0 15px 34px -30px rgba(3, 39, 86, .44) !important;
}

html:not(.dark) .catalog-course-card > a:first-child {
    height: 14rem !important;
}

html:not(.dark) .catalog-course-card > div {
    padding: 1.5rem !important;
}

html:not(.dark) .catalog-course-card h3 {
    font-size: 1.1rem !important;
    line-height: 1.2 !important;
}

html:not(.dark) .catalog-course-card > div > p {
    font-size: .78rem !important;
    line-height: 1.55 !important;
}

html:not(.dark) .catalog-course-card > div > .-mx-7 {
    margin-right: -1.5rem !important;
    margin-bottom: -1.5rem !important;
    margin-left: -1.5rem !important;
    padding: 1rem 1.5rem !important;
    background: #052f63 !important;
}

html:not(.dark) .catalog-course-card > div > .-mx-7 span.text-base,
html:not(.dark) .catalog-course-card > div > .-mx-7 span.mt-1 {
    color: #fff !important;
}

html:not(.dark) .catalog-course-card > div > .-mx-7 a {
    background: #f5b400 !important;
    border-color: #f5b400 !important;
    color: #102a4c !important;
}

html:not(.dark) .catalog-journey,
html:not(.dark) .catalog-editorial,
html:not(.dark) .catalog-faq {
    width: 100vw;
    max-width: none;
    margin-left: calc(50% - 50vw) !important;
    border-right: 0 !important;
    border-left: 0 !important;
    border-radius: 0 !important;
    padding-right: max(2rem, calc((100vw - 80rem) / 2)) !important;
    padding-left: max(2rem, calc((100vw - 80rem) / 2)) !important;
}

html:not(.dark) .catalog-journey {
    margin-top: 7rem !important;
    padding-top: 5.5rem !important;
    padding-bottom: 5.5rem !important;
    border: 0 !important;
    background: #052f63 !important;
    box-shadow: none !important;
}

html:not(.dark) .catalog-journey > .mb-6 {
    max-width: 58rem;
    margin-right: auto;
    margin-left: auto;
    text-align: center;
}

html:not(.dark) .catalog-journey > .grid {
    max-width: 70rem;
    margin-right: auto;
    margin-left: auto;
}

html:not(.dark) .catalog-journey article {
    background: #111d32 !important;
}

html:not(.dark) .catalog-editorial {
    margin-top: 0 !important;
    padding-top: 5.5rem !important;
    padding-bottom: 5.5rem !important;
    border: 0 !important;
    background: #f8f5ef !important;
    box-shadow: none !important;
}

html:not(.dark) .catalog-editorial > .mb-6,
html:not(.dark) .catalog-editorial > .grid {
    max-width: 72rem;
    margin-right: auto;
    margin-left: auto;
}

html:not(.dark) .catalog-editorial > .mb-6 {
    display: block !important;
    text-align: center;
}

html:not(.dark) .catalog-editorial > .mb-6 > div {
    max-width: 58rem;
    margin: 0 auto;
}

html:not(.dark) .catalog-editorial > .mb-6 > a {
    margin-top: 1rem;
}

html:not(.dark) .catalog-faq {
    margin-top: 0 !important;
    padding-top: 4rem !important;
    padding-bottom: 6rem !important;
    background: #f8f5ef !important;
}

html:not(.dark) .catalog-faq > .mb-5,
html:not(.dark) .catalog-faq > .grid {
    max-width: 72rem;
    margin-right: auto;
    margin-left: auto;
}

html:not(.dark) .catalog-faq > .mb-5 {
    text-align: center;
}

html:not(.dark) .catalog-journey h2,
html:not(.dark) .catalog-editorial h2,
html:not(.dark) .catalog-faq h2 {
    color: #052f63 !important;
}

html:not(.dark) .catalog-journey h2 {
    color: #fff !important;
}

@media (max-width: 767px) {
    html:not(.dark) .catalog-page-hero {
        min-height: 32rem;
        padding: 4rem 1rem 7rem !important;
    }

    html:not(.dark) .catalog-page-hero h1 {
        max-width: 23rem !important;
        font-size: clamp(2.3rem, 10vw, 3rem) !important;
    }

    html:not(.dark) .catalog-page-hero p {
        max-width: 22rem !important;
        font-size: .8rem !important;
    }

    html:not(.dark) .catalog-page-hero a {
        width: 100%;
    }

    html:not(.dark) .catalog-value-strip {
        margin-top: -4.5rem !important;
    }

    html:not(.dark) .catalog-value-strip > div {
        gap: .75rem !important;
    }

    html:not(.dark) .catalog-value-card {
        min-height: 0;
        padding: 1.25rem !important;
    }

    html:not(.dark) .catalog-page {
        padding-right: 1rem !important;
        padding-left: 1rem !important;
    }

    html:not(.dark) .catalog-filter-panel {
        position: static !important;
    }

    html:not(.dark) .catalog-filter-panel > .flex {
        flex-wrap: wrap;
    }

    html:not(.dark) .catalog-filter-panel button {
        width: 100%;
        justify-content: center;
    }

    html:not(.dark) .catalog-showcase-head {
        padding: 1.5rem !important;
    }

    html:not(.dark) .catalog-showcase-head h2 {
        font-size: 1.9rem !important;
    }

    html:not(.dark) .catalog-page #public-courses-grid {
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 1rem !important;
    }

    html:not(.dark) .catalog-course-card,
    html:not(.dark) #public-courses-grid .catalog-course-card {
        width: 100% !important;
    }

    html:not(.dark) .catalog-course-card > a:first-child {
        height: 12.5rem !important;
    }

    html:not(.dark) .catalog-journey,
    html:not(.dark) .catalog-editorial,
    html:not(.dark) .catalog-faq {
        padding: 3.5rem 1rem !important;
    }

    html:not(.dark) .catalog-journey > .mb-6,
    html:not(.dark) .catalog-editorial > .mb-6,
    html:not(.dark) .catalog-faq > .mb-5 {
        text-align: left;
    }
}
