/* Home principal — identidade visual aprovada. */

/* Painéis full-bleed usam 100vw; impede que a largura da barra vertical gere rolagem lateral. */
html,
body {
    max-width: 100%;
    overflow-x: hidden;
}

@supports (overflow: clip) {
    html,
    body {
        overflow-x: clip;
    }
}

html:not(.dark) .home-v2 {
    position: relative;
    background:
        radial-gradient(circle at 5% 10%, rgba(14, 116, 144, .10), transparent 22rem),
        radial-gradient(circle at 96% 30%, rgba(245, 158, 11, .10), transparent 24rem),
        #f4f7fb !important;
}

html:not(.dark) .home-v2-hero {
    width: 100%;
    margin: 0;
    border-right: 0;
    border-left: 0;
    border-radius: 0;
    box-shadow: none;
}

html:not(.dark) .home-v2-hero > .relative {
    height: clamp(29rem, 58vw, 37rem) !important;
}

html:not(.dark) .home-v2-hero img {
    filter: saturate(.82) contrast(1.08);
}

html:not(.dark) .home-v2-hero .absolute.inset-0.bg-gradient-to-t {
    background: linear-gradient(90deg, rgba(1, 22, 49, .94) 0%, rgba(1, 39, 86, .76) 42%, rgba(1, 22, 49, .20) 100%) !important;
}

html:not(.dark) .home-v2-hero h1,
html:not(.dark) .home-v2-hero h2 {
    max-width: 50rem;
    font-size: clamp(2.65rem, 5.4vw, 5.5rem) !important;
    font-weight: 900 !important;
    letter-spacing: -.065em !important;
    line-height: .96 !important;
}

html:not(.dark) .home-v2-hero p {
    max-width: 39rem;
    font-size: 1.12rem !important;
    font-weight: 500 !important;
}

html:not(.dark) .home-v2-hero a {
    border-radius: 1rem !important;
    padding: 1rem 1.4rem !important;
    font-weight: 800 !important;
}

html:not(.dark) .home-v2-search > div.absolute {
    background: #f4f7fb !important;
}

html:not(.dark) .home-v2-search form {
    max-width: 66rem;
    margin-inline: auto;
    border: 1px solid #cbd9e8 !important;
    border-radius: 1.35rem !important;
    padding: .55rem !important;
    box-shadow: 0 18px 42px -26px rgba(15, 43, 75, .38) !important;
}

html:not(.dark) .home-v2-search input {
    font-weight: 600 !important;
    font-size: 1rem !important;
}

html:not(.dark) .home-v2-search button {
    border-radius: .95rem !important;
    font-weight: 800 !important;
}

html:not(.dark) .home-v2 #catalogo {
    max-width: 1280px;
    padding-top: 3.75rem !important;
}

html:not(.dark) .home-v2 #catalogo > .mb-10 {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 2rem;
    align-items: end;
    margin-bottom: 2.2rem !important;
    padding-bottom: 1.4rem !important;
    border-bottom: 2px solid #d8e4ee !important;
}

html:not(.dark) .home-v2 #catalogo h2 {
    color: #08264b !important;
    font-size: clamp(2.15rem, 3.5vw, 3.35rem) !important;
    font-weight: 900 !important;
    letter-spacing: -.05em !important;
}

html:not(.dark) .home-v2 #catalogo p {
    color: #415873 !important;
    font-size: 1rem !important;
}

html:not(.dark) .home-v2 #catalogo > .mb-10 span {
    border-color: #b9d1e9 !important;
    background: #e9f4ff !important;
    color: #075985 !important;
}

html:not(.dark) .home-v2 #catalogo > .mb-10 > a {
    border-color: #a8c4df !important;
    border-radius: 999px !important;
    background: #fff !important;
    color: #08264b !important;
    font-weight: 800 !important;
}

html:not(.dark) .home-v2 #public-courses-grid {
    gap: 1.25rem !important;
}

html:not(.dark) .home-v2 .course-card {
    border: 1px solid #d7e3ee !important;
    border-radius: 1.1rem !important;
    background: #fff !important;
    box-shadow: 0 18px 40px -32px rgba(15, 43, 75, .42) !important;
}

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

html:not(.dark) .home-v2 .course-card > div {
    padding: 1rem !important;
}

html:not(.dark) .home-v2 .course-card h3 {
    color: #0b294d !important;
    font-size: .95rem !important;
    font-weight: 900 !important;
}

html:not(.dark) .home-v2 .course-card p {
    color: #52657a !important;
    font-size: .73rem !important;
    line-height: 1.55 !important;
}

html:not(.dark) .home-v2 .course-card .course-card-footer {
    margin-inline: -1rem !important;
    margin-bottom: -1rem !important;
    padding: .75rem 1rem !important;
    background: #f4f8fb !important;
    border-color: #dce7f0 !important;
}

html:not(.dark) .home-v2 .course-card .course-card-footer a {
    border-radius: .85rem !important;
    font-weight: 800 !important;
}


html:not(.dark) .home-v2 > section.mb-16.overflow-hidden {
    margin-top: 5.5rem !important;
    margin-bottom: 0 !important;
    border-block-color: #f1d5a4 !important;
    background: linear-gradient(100deg, #fff7e8 0%, #fff8f4 48%, #edf7ff 100%) !important;
}

html:not(.dark) .home-v2 > section.mb-16.overflow-hidden h2 {
    color: #08264b !important;
    font-size: 2rem !important;
    font-weight: 900 !important;
}

html:not(.dark) .home-v2 .home-v2-dark-panel {
    border-color: rgba(96, 165, 250, .62) !important;
    border-radius: 1.75rem !important;
    box-shadow: 0 24px 48px -34px rgba(2, 35, 72, .74) !important;
}

html:not(.dark) .home-v2 .home-v2-dark-panel h2,
html:not(.dark) .home-v2 .home-v2-dark-panel h3 {
    color: #fff !important;
    font-weight: 900 !important;
}

html:not(.dark) .home-v2 .home-v2-dark-panel p {
    color: #dbeafe !important;
    font-weight: 500 !important;
}

html:not(.dark) .home-v2-benefits {
    max-width: 1120px !important;
    margin-top: 5.5rem !important;
    margin-bottom: 5.5rem !important;
}

html:not(.dark) .home-v2-benefits h2 {
    color: #08264b !important;
    font-size: 2.2rem !important;
    font-weight: 900 !important;
    letter-spacing: -.045em !important;
}

html:not(.dark) .home-v2-benefits .grid > div {
    min-height: 17rem;
    border: 1px solid #d8e5ef !important;
    border-radius: 1.4rem !important;
    background: rgba(255,255,255,.90) !important;
    box-shadow: 0 18px 40px -34px rgba(15, 43, 75, .35) !important;
}

html:not(.dark) .home-v2-benefits .grid > div h3 {
    color: #102a4c !important;
    font-weight: 900 !important;
}

html:not(.dark) .home-v2-benefits .grid > div p {
    color: #52657a !important;
    font-weight: 500 !important;
}

html:not(.dark) .home-v2-journey {
    max-width: 1120px !important;
    border: 1px solid #cce1eb !important;
    border-radius: 1.75rem !important;
    background: linear-gradient(135deg, #eaf7ff 0%, #f4fbff 55%, #eafaf4 100%) !important;
    box-shadow: 0 20px 45px -36px rgba(15, 43, 75, .45) !important;
}

html:not(.dark) .home-v2-journey h2,
html:not(.dark) .home-v2-journey h3 {
    color: #08264b !important;
    font-weight: 900 !important;
}

html:not(.dark) .home-v2-journey p {
    color: #52657a !important;
    font-weight: 500 !important;
}

html:not(.dark) .home-v2-notice {
    background: #f4f7fb !important;
    border-color: transparent !important;
}

/*
 * Direção visual da Home 2: contraste alto no hero e cor forte apenas em
 * decisões. Este bloco é exclusivo da rota /home2 e não afeta a home atual.
 */
html:not(.dark) .home-v2-hero {
    border-color: #0a315d !important;
    background: #03152e !important;
}

html:not(.dark) .home-v2-hero .absolute.inset-0.bg-gradient-to-t {
    background:
        radial-gradient(circle at 82% 18%, rgba(235, 166, 8, .38), transparent 26%),
        linear-gradient(90deg, rgba(0, 12, 35, .96) 0%, rgba(3, 39, 86, .84) 52%, rgba(0, 12, 35, .38) 100%) !important;
}

html:not(.dark) .home-v2-hero span.inline-flex {
    border-color: rgba(251, 191, 36, .55) !important;
    background: #fbbf24 !important;
    color: #10233f !important;
    box-shadow: 0 12px 28px rgba(251, 191, 36, .28) !important;
}

html:not(.dark) .home-v2-hero span.inline-flex > span {
    background: #10233f !important;
}

html:not(.dark) .home-v2-hero h1,
html:not(.dark) .home-v2-hero h2 {
    max-width: 54rem !important;
    text-wrap: balance;
}

html:not(.dark) .home-v2-hero a.bg-amber-400 {
    background: #fbbf24 !important;
    color: #10233f !important;
    box-shadow: 0 15px 32px rgba(251, 191, 36, .35) !important;
}

html:not(.dark) .home-v2-hero a.bg-white\/10 {
    background: rgba(15, 31, 56, .72) !important;
    border-color: rgba(255, 255, 255, .26) !important;
}

html:not(.dark) .home-v2-search form {
    border-color: #b8cce0 !important;
    box-shadow: 0 20px 42px -24px rgba(3, 39, 86, .38) !important;
}

html:not(.dark) .home-v2-search button {
    background: #032756 !important;
    color: #fff !important;
}

html:not(.dark) .home-v2 #catalogo > .mb-10 {
    border-bottom-color: #bed1e4 !important;
}

html:not(.dark) .home-v2 #catalogo > .mb-10 span {
    border-color: #f3cf6a !important;
    background: #fff8dc !important;
    color: #a65e00 !important;
}

html:not(.dark) .home-v2 .course-card {
    border-color: #cbdbea !important;
    border-top: 4px solid #032756 !important;
    box-shadow: 0 22px 46px -34px rgba(3, 39, 86, .48) !important;
}

html:not(.dark) .home-v2 .course-card:nth-child(3n + 2) {
    border-top-color: #e3a008 !important;
}

html:not(.dark) .home-v2 .course-card:nth-child(3n) {
    border-top-color: #0f9a81 !important;
}

html:not(.dark) .home-v2 .course-card .course-card-footer {
    background: #f5f8fc !important;
}

html:not(.dark) .home-v2 .course-card .course-card-footer a {
    background: #032756 !important;
    border-color: #032756 !important;
    color: #fff !important;
}

html:not(.dark) .home-v2 .course-card .course-card-footer a:hover {
    background: #e3a008 !important;
    border-color: #e3a008 !important;
    color: #10233f !important;
}

/* Tipografia dos cards: leitura mais leve, sem perder a hierarquia. */
html:not(.dark) .home-v2 .course-card h3 {
    font-weight: 700 !important;
}

html:not(.dark) .home-v2 .course-card .course-card-summary,
html:not(.dark) .home-v2 .course-card .course-card-cta-note {
    font-weight: 300 !important;
}

html:not(.dark) .home-v2 .course-card .course-card-pill,
html:not(.dark) .home-v2 .course-card .course-card-cta-copy,
html:not(.dark) .home-v2 .course-card .course-card-cta-title,
html:not(.dark) .home-v2 .course-card .course-card-footer a {
    font-weight: 700 !important;
}

html:not(.dark) .home-v2 > section.mb-16.overflow-hidden {
    border-block-color: #f5d36f !important;
    background: linear-gradient(100deg, #fff8e7 0%, #fff5dd 46%, #edf7ff 100%) !important;
}

html:not(.dark) .home-v2 #recent-courses-section {
    margin-top: 4rem !important;
    margin-bottom: 4rem !important;
}

html:not(.dark) .home-v2 .home-v2-dark-panel {
    border-color: #0d4a83 !important;
    background:
        radial-gradient(circle at 88% 12%, rgba(251, 191, 36, .42), transparent 23%),
        linear-gradient(125deg, #032756 0%, #07528d 58%, #021a3b 100%) !important;
}

html:not(.dark) .home-v2-benefits .grid > div:first-child {
    border-top: 4px solid #032756 !important;
}

html:not(.dark) .home-v2-benefits .grid > div:nth-child(2) {
    border-top: 4px solid #0f9a81 !important;
}

html:not(.dark) .home-v2-benefits .grid > div:nth-child(3) {
    border-top: 4px solid #e3a008 !important;
}

/* Home 2 usa o mesmo padrão visual dos cards de /cursos-online. */
html:not(.dark) .home-v2 #public-courses-grid {
    gap: 2rem !important;
}

html:not(.dark) .home-v2 .course-card {
    border: 1px solid #e2e8f0 !important;
    border-top-width: 4px !important;
    border-top-color: var(--course-category-accent, #032756) !important;
    border-radius: 1.75rem !important;
    box-shadow: 0 18px 55px -35px rgba(15, 23, 42, .55) !important;
}

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

html:not(.dark) .home-v2 .course-card > a:first-child > .bg-gradient-to-t {
    background: linear-gradient(to top, rgba(2, 6, 23, .45), rgba(2, 6, 23, .05), transparent) !important;
    opacity: .9 !important;
}

html:not(.dark) .home-v2 .course-card .course-type-badge {
    top: 1rem !important;
    left: 1rem !important;
    border-radius: .75rem !important;
    padding: .5rem .875rem !important;
    font-size: 11px !important;
}

html:not(.dark) .home-v2 .course-card .course-hours-badge {
    top: 1rem !important;
    right: 1rem !important;
    border-radius: .75rem !important;
    padding: .5rem 1rem !important;
    font-size: .75rem !important;
}

html:not(.dark) .home-v2 .home-v2-featured-badge {
    top: 1rem;
    left: 8.5rem;
    padding: .25rem .75rem;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .14em;
    text-transform: uppercase;
}

html:not(.dark) .home-v2 .course-card > div {
    padding: 1.75rem !important;
}

html:not(.dark) .home-v2 .course-card .card-content > a {
    display: block;
    margin-bottom: 1rem;
}

html:not(.dark) .home-v2 .course-card h3 {
    font-size: 1.25rem !important;
    font-weight: 900 !important;
    line-height: 1.25 !important;
}

html:not(.dark) .home-v2 .course-card .course-card-summary {
    margin-top: 0 !important;
    margin-bottom: 1.5rem !important;
    font-size: .875rem !important;
    font-weight: 1 !important;
    line-height: 1.625 !important;
}

html:not(.dark) .home-v2 .course-card .course-card-pill {
    padding: .375rem .75rem !important;
    font-size: 11px !important;
    font-weight: 900 !important;
}

html:not(.dark) .home-v2 .course-card .course-card-footer {
    margin-inline: -1.75rem !important;
    margin-bottom: -1.75rem !important;
    padding: 1.25rem 1.75rem !important;
    background: #f1f5f9 !important;
}

html:not(.dark) .home-v2 .course-card .course-card-cta-copy {
    color: #eba608 !important;
    font-size: .75rem !important;
    font-weight: 900 !important;
}

html:not(.dark) .home-v2 .course-card .course-card-cta-title {
    font-size: 1rem !important;
    font-weight: 900 !important;
}

html:not(.dark) .home-v2 .course-card .course-card-cta-note {
    font-size: .75rem !important;
    font-weight: 400 !important;
}

html:not(.dark) .home-v2 .course-card .course-card-footer a {
    padding: .75rem 1.25rem !important;
    border-radius: .75rem !important;
    font-size: .875rem !important;
    font-weight: 700 !important;
}

@media (min-width: 1024px) {
    html:not(.dark) .home-v2 #public-courses-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
}

/* Faixas de área em largura total, com a mesma margem editorial do catálogo. */
@media (min-width: 768px) {
    html:not(.dark) .home-v2 .home-v2-dark-panel {
        width: 100vw !important;
        max-width: none !important;
        margin-left: calc(50% - 50vw) !important;
        border-right: 0 !important;
        border-left: 0 !important;
        border-radius: 0 !important;
        padding-right: max(2rem, calc((100vw - 1280px) / 2)) !important;
        padding-left: max(2rem, calc((100vw - 1280px) / 2)) !important;
    }

    html:not(.dark) .home-v2 .home-v2-guide-panel {
        padding-top: 3.5rem !important;
        padding-bottom: 3.5rem !important;
    }

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

html:not(.dark) .home-v2 .home-v2-guide-section,
html:not(.dark) .home-v2 .home-v2-category-section {
    margin-bottom: 0 !important;
}

html:not(.dark) .home-v2 .home-v2-guide-panel,
html:not(.dark) .home-v2 .home-v2-category-panel {
    background: #063a63 !important;
    box-shadow: none !important;
}

html:not(.dark) .home-v2 .home-v2-guide-panel > .pointer-events-none,
html:not(.dark) .home-v2 .home-v2-category-panel > .pointer-events-none {
    display: none !important;
}

html:not(.dark) .home-v2 .home-v2-guide-panel {
    border-bottom: 1px solid rgba(255, 255, 255, .16) !important;
}

html:not(.dark) .home-v2 .home-v2-category-panel {
    border-top: 0 !important;
    background: #5c7a9b !important;
}

html:not(.dark) .home-v2 .home-v2-guide-panel a.bg-white {
    border-color: #fbbf24 !important;
    background: #fbbf24 !important;
    color: #10233f !important;
}

html:not(.dark) .home-v2 .home-v2-guide-panel .home-v2-guide-link:hover {
    border-color: rgba(255, 255, 255, .5) !important;
    background: #28628c !important;
}

html:not(.dark) .home-v2 .home-v2-guide-panel .home-v2-guide-link:hover span {
    color: #fff !important;
}

@media (max-width: 767px) {
    html:not(.dark) .home-v2-hero { width: 100%; margin-top: 0; border-radius: 0; }
    html:not(.dark) .home-v2-hero > .relative { height: 31rem !important; }
    html:not(.dark) .home-v2-hero h1,
    html:not(.dark) .home-v2-hero h2 { font-size: 2.55rem !important; }
    html:not(.dark) .home-v2 #catalogo > .mb-10 { display: flex; gap: 1rem; }
    html:not(.dark) .home-v2 #catalogo > .mb-10 > a { width: 100%; }
}

/*
 * Ritmo vertical da home
 * Uma única escala evita espaços acidentais entre sessões, sem eliminar a
 * continuidade intencional entre os dois painéis de áreas.
 */
html:not(.dark) .home-v2 {
    --home-v2-section-space: clamp(3.5rem, 5vw, 5rem);
}

html:not(.dark) .home-v2 > section.max-w-7xl.mx-auto.mb-16,
html:not(.dark) .home-v2 #catalogo,
html:not(.dark) .home-v2 #recent-courses-section,
html:not(.dark) .home-v2 .home-v2-benefits,
html:not(.dark) .home-v2 .home-v2-journey {
    margin-top: 0 !important;
    margin-bottom: var(--home-v2-section-space) !important;
}

html:not(.dark) .home-v2 > section.mb-16.overflow-hidden {
    margin-top: 0 !important;
    margin-bottom: var(--home-v2-section-space) !important;
}

/* Estes painéis formam uma única seção editorial, não dois blocos isolados. */
html:not(.dark) .home-v2 .home-v2-guide-section {
    margin-bottom: 0 !important;
}

html:not(.dark) .home-v2 .home-v2-category-section {
    margin-bottom: var(--home-v2-section-space) !important;
}

html:not(.dark) .home-v2-notice {
    padding-top: var(--home-v2-section-space) !important;
    padding-bottom: var(--home-v2-section-space) !important;
}
