@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;650;700;750;800&display=swap");

:root {
    --horizon-blue: #0145f2;
    --horizon-blue-strong: #0138c7;
    --horizon-cyan: #4debff;
    --horizon-gold: #f59e0b;
    --horizon-gold-strong: #d97706;
    --horizon-gold-dark: #92400e;
    --horizon-gold-soft: #fffbeb;
    --horizon-gold-border: #fde68a;
    --horizon-green: #059669;
    --horizon-bg: #edf1f5;
    --horizon-surface: #ffffff;
    --horizon-surface-soft: #f8fafc;
    --horizon-text: #0f172a;
    --horizon-muted: #64748b;
    --horizon-border: #dbe3f0;
    --horizon-radius: 24px;
    --horizon-shadow: 0 24px 70px rgba(15, 23, 42, 0.08);
    --horizon-premium-fill:
        linear-gradient(
            112deg,
            #0145f2 0%,
            #2563eb 64%,
            #f59e0b 78%,
            #d97706 100%
        );
    --horizon-premium-line:
        linear-gradient(
            90deg,
            #0145f2 0%,
            #2563eb 68%,
            #f59e0b 72%,
            #d97706 100%
        );
    --horizon-premium-text:
        linear-gradient(
            105deg,
            #0145f2 0%,
            #2563eb 64%,
            #f59e0b 78%,
            #d97706 100%
        );
}

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    scroll-behavior: smooth;
}

body {
    min-width: 320px;
    overflow-x: hidden;
    background: var(--horizon-bg);
    color: var(--horizon-text);
    font-family: "Inter", sans-serif;
    -webkit-font-smoothing: antialiased;
}

a {
    color: inherit;
    text-decoration: none;
}

button,
a {
    -webkit-tap-highlight-color: transparent;
}

button,
input {
    font: inherit;
}

button {
    border: 0;
    cursor: pointer;
}

.horizon_container {
    width: min(1180px, calc(100% - 48px));
    margin-inline: auto;
}

.cabecalho {
    position: fixed;
    inset: 0 0 auto;
    z-index: 1000;
    width: 100%;
    border-bottom: 1px solid rgba(219, 227, 240, 0.86);
    background: rgba(255, 255, 255, 0.9);
    box-shadow: 0 8px 28px rgba(15, 23, 42, 0.045);
    backdrop-filter: blur(14px);
}

.cabecalho_interno {
    width: min(1240px, calc(100% - 40px));
    min-height: 70px;
    margin-inline: auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
}

.grupo_esquerda,
.grupo_direita,
.cabecalho_navegacao {
    display: flex;
    align-items: center;
}

.grupo_esquerda {
    min-width: 0;
    gap: 34px;
}

.grupo_direita {
    flex: 0 0 auto;
    gap: 8px;
}

.cabecalho_navegacao {
    gap: 6px;
}

.cabecalho_logo_click {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: var(--horizon-text);
    font-size: 15px;
    font-weight: 800;
    letter-spacing: -0.03em;
}

.cabecalho_logo {
    width: 120px;
    height: 62px;
    object-fit: contain;
}

.cabecalho_elementos,
.cabecalho_entrar {
    position: relative;
    display: inline-flex;
    min-height: 38px;
    align-items: center;
    justify-content: center;
    padding: 0 11px;
    border-radius: 10px;
    color: #475569;
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
    transition: color 0.18s ease, background 0.18s ease;
}

.cabecalho_elementos::after {
    content: "";
    position: absolute;
    right: 12px;
    bottom: 4px;
    left: 12px;
    height: 2px;
    border-radius: 99px;
    background: var(--horizon-premium-line);
    opacity: 0;
    transform: scaleX(0.5);
    transition: opacity 0.18s ease, transform 0.18s ease;
}

.cabecalho_elementos:hover,
.cabecalho_elementos:focus-visible,
.cabecalho_elementos.ativo {
    outline: none;
    background: #f1f6ff;
    color: var(--horizon-blue);
}

.cabecalho_elementos:hover::after,
.cabecalho_elementos:focus-visible::after,
.cabecalho_elementos.ativo::after {
    opacity: 1;
    transform: scaleX(1);
}

.cabecalho_entrar:hover,
.cabecalho_entrar:focus-visible {
    outline: none;
    background: #f8fafc;
    color: var(--horizon-blue);
}

.cabecalho_elemento_comecar {
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 17px;
    border: 1px solid rgba(245, 158, 11, 0.32);
    border-radius: 11px;
    background: var(--horizon-premium-fill);
    color: #ffffff;
    font-size: 13px;
    font-weight: 750;
    white-space: nowrap;
    box-shadow: 0 10px 24px rgba(1, 69, 242, 0.2);
    transition: transform 0.18s ease, box-shadow 0.18s ease, filter 0.18s ease;
}

.cabecalho_elemento_comecar:hover,
.cabecalho_elemento_comecar:focus-visible {
    outline: none;
    filter: saturate(1.06);
    transform: translateY(-1px);
    box-shadow: 0 13px 28px rgba(1, 69, 242, 0.25);
}

.horizon_hero {
    position: relative;
    min-height: 780px;
    overflow: hidden;
    padding: 154px 0 94px;
    border-bottom: 1px solid var(--horizon-border);
    background:
        linear-gradient(rgba(255, 255, 255, 0.42) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.42) 1px, transparent 1px),
        radial-gradient(circle at 12% 18%, rgba(1, 69, 242, 0.12), transparent 30%),
        radial-gradient(circle at 86% 10%, rgba(245, 158, 11, 0.14), transparent 28%),
        #edf1f5;
    background-size: 42px 42px, 42px 42px, auto, auto, auto;
}

.horizon_hero::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    height: 150px;
    background: linear-gradient(transparent, var(--horizon-bg));
    pointer-events: none;
}

.horizon_hero_glow {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
}

.horizon_hero_glow_um {
    top: 130px;
    left: -170px;
    width: 360px;
    height: 360px;
    border: 1px solid rgba(1, 69, 242, 0.1);
    box-shadow: 0 0 0 70px rgba(1, 69, 242, 0.025), 0 0 0 140px rgba(1, 69, 242, 0.018);
}

.horizon_hero_glow_dois {
    right: -100px;
    bottom: 20px;
    width: 280px;
    height: 280px;
    background: rgba(245, 158, 11, 0.08);
    box-shadow: 0 0 110px rgba(245, 158, 11, 0.18);
}

.horizon_hero_grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 1.02fr) minmax(430px, 0.98fr);
    align-items: center;
    gap: 76px;
}

.horizon_eyebrow,
.horizon_section_label {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: var(--horizon-gold-strong);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.horizon_eyebrow {
    margin-bottom: 22px;
    padding: 8px 12px;
    border: 1px solid rgba(245, 158, 11, 0.22);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.75);
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.04);
}

.horizon_eyebrow i {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--horizon-gold);
    box-shadow: 0 0 0 4px rgba(245, 158, 11, 0.14);
}

.horizon_hero_conteudo h1 {
    max-width: 720px;
    font-size: clamp(44px, 5.4vw, 72px);
    font-weight: 800;
    letter-spacing: -0.065em;
    line-height: 0.98;
}

.horizon_hero_conteudo h1 span {
    display: block;
    width: fit-content;
    max-width: 100%;
    margin-top: 8px;
    background: var(--horizon-premium-text);
    background-clip: text;
    color: transparent;
}

.horizon_hero_conteudo > p {
    max-width: 620px;
    margin-top: 28px;
    color: var(--horizon-muted);
    font-size: 18px;
    line-height: 1.7;
}

.horizon_hero_acoes {
    margin-top: 34px;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.horizon_botao_primary,
.horizon_botao_secondary {
    min-height: 52px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 11px;
    padding: 0 20px;
    border-radius: 13px;
    font-size: 14px;
    font-weight: 750;
    transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease, background 0.18s ease;
}

.horizon_botao_primary {
    border: 1px solid rgba(245, 158, 11, 0.28);
    background: var(--horizon-premium-fill);
    color: #ffffff;
    box-shadow: 0 14px 34px rgba(1, 69, 242, 0.22);
}

.horizon_botao_primary span {
    font-size: 18px;
    transition: transform 0.18s ease;
}

.horizon_botao_primary:hover,
.horizon_botao_primary:focus-visible {
    outline: none;
    transform: translateY(-2px);
    box-shadow: 0 18px 40px rgba(1, 69, 242, 0.28);
}

.horizon_botao_primary:hover span,
.horizon_botao_primary:focus-visible span {
    transform: translateX(3px);
}

.horizon_botao_secondary {
    border: 1px solid var(--horizon-border);
    background: rgba(255, 255, 255, 0.82);
    color: var(--horizon-text);
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.05);
}

.horizon_botao_secondary:hover,
.horizon_botao_secondary:focus-visible {
    outline: none;
    border-color: rgba(245, 158, 11, 0.36);
    background: #ffffff;
    color: var(--horizon-gold-dark);
    transform: translateY(-2px);
}

.horizon_botao_full {
    width: 100%;
}

.horizon_hero_sinais {
    margin-top: 30px;
    display: flex;
    flex-wrap: wrap;
    gap: 9px 18px;
}

.horizon_hero_sinais span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #475569;
    font-size: 12px;
    font-weight: 650;
}

.horizon_hero_sinais span::before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--horizon-gold);
    box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.16);
}

.horizon_preview {
    position: relative;
    display: grid;
    gap: 14px;
    padding: 18px;
    border: 1px solid rgba(255, 255, 255, 0.9);
    border-radius: 28px;
    background: rgba(255, 255, 255, 0.76);
    box-shadow: 0 30px 80px rgba(15, 23, 42, 0.12), inset 0 0 0 1px rgba(219, 227, 240, 0.65);
    backdrop-filter: blur(12px);
}

.horizon_preview_topo {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 4px 4px 14px;
    border-bottom: 1px solid rgba(219, 227, 240, 0.8);
    color: #475569;
    font-size: 11px;
    font-weight: 750;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.horizon_preview_topo i {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--horizon-gold);
    box-shadow: 0 0 0 4px rgba(245, 158, 11, 0.1);
}

.horizon_preview_card {
    position: relative;
    overflow: hidden;
    padding: 20px;
    border: 1px solid var(--horizon-border);
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.065);
}

.horizon_preview_linha_dourada {
    position: absolute;
    inset: 0 0 auto;
    height: 3px;
    background: linear-gradient(90deg, var(--horizon-gold), #facc15, transparent);
}

.horizon_preview_badges,
.horizon_preview_meta {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.horizon_badge,
.horizon_trust_badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 9px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.horizon_badge {
    border: 1px solid var(--horizon-gold-border);
    background: var(--horizon-gold-soft);
    color: var(--horizon-gold-dark);
}

.horizon_trust_badge {
    border: 1px solid rgba(1, 69, 242, 0.15);
    background: #eef4ff;
    color: var(--horizon-blue);
}

.horizon_preview_card small {
    display: block;
    margin-top: 16px;
    color: var(--horizon-blue);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.horizon_preview_vaga small {
    color: var(--horizon-green);
}

.horizon_preview_card h3 {
    margin-top: 7px;
    font-size: 22px;
    letter-spacing: -0.04em;
}

.horizon_preview_card p {
    margin-top: 10px;
    color: var(--horizon-muted);
    font-size: 13px;
    line-height: 1.65;
}

.horizon_preview_meta {
    margin-top: 16px;
}

.horizon_preview_meta span {
    padding: 6px 9px;
    border-radius: 999px;
    background: #f8fafc;
    color: #475569;
    font-size: 10px;
    font-weight: 700;
}

.horizon_preview_perfil {
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr);
    align-items: center;
    gap: 15px;
    background: linear-gradient(145deg, #f8fbff, #ffffff 68%);
}

.horizon_preview_avatar {
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(245, 158, 11, 0.28);
    border-radius: 18px;
    background: var(--horizon-premium-fill);
    color: #ffffff;
    font-size: 22px;
    font-weight: 850;
    box-shadow: 0 14px 28px rgba(1, 69, 242, 0.18);
}

.horizon_status_secao,
.horizon_beneficios,
.horizon_pagamento,
.horizon_cta {
    padding: 100px 0;
}

.horizon_status_secao {
    padding-block: 48px;
    background: #ffffff;
}

.horizon_status_card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    padding: 30px;
    border: 1px solid rgba(245, 158, 11, 0.22);
    border-radius: 24px;
    background: linear-gradient(145deg, #ffffff, var(--horizon-gold-soft));
    box-shadow: var(--horizon-shadow);
}

.horizon_status_card h2 {
    margin-top: 8px;
    font-size: 28px;
    letter-spacing: -0.04em;
}

.horizon_status_card p {
    margin-top: 8px;
    color: var(--horizon-muted);
    font-size: 14px;
    line-height: 1.65;
}

.horizon_status_pill {
    flex: 0 0 auto;
    min-width: 132px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 11px 14px;
    border-radius: 999px;
    background: #f8fafc;
    color: #475569;
    font-size: 12px;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.horizon_status_pill.ativo {
    border: 1px solid var(--horizon-gold-border);
    background: var(--horizon-gold-soft);
    color: var(--horizon-gold-dark);
}

.horizon_status_pill.pendente {
    border: 1px solid #bfdbfe;
    background: #eff6ff;
    color: var(--horizon-blue);
}

.horizon_status_pill.inativo,
.horizon_status_pill.cancelado,
.horizon_status_pill.expirado,
.horizon_status_pill.erro {
    border: 1px solid var(--horizon-border);
    background: #f8fafc;
    color: #475569;
}

.horizon_beneficios {
    background: #ffffff;
}

.horizon_section_header {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 50px;
}

.horizon_section_header_center {
    align-items: center;
    flex-direction: column;
    text-align: center;
}

.horizon_section_header h2,
.horizon_pagamento_conteudo h2,
.horizon_cta_card h2 {
    margin-top: 14px;
    max-width: 760px;
    font-size: clamp(32px, 4vw, 48px);
    font-weight: 780;
    letter-spacing: -0.055em;
    line-height: 1.08;
}

.horizon_section_header > p {
    max-width: 610px;
    color: var(--horizon-muted);
    font-size: 15px;
    line-height: 1.65;
}

.horizon_beneficios_grid {
    margin-top: 50px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.horizon_beneficios_grid article {
    min-height: 300px;
    padding: 28px;
    border: 1px solid var(--horizon-border);
    border-radius: var(--horizon-radius);
    background: linear-gradient(145deg, #ffffff, #f8fbff 68%);
    box-shadow: 0 18px 50px rgba(15, 23, 42, 0.055);
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.horizon_beneficios_grid article:hover {
    border-color: rgba(245, 158, 11, 0.28);
    box-shadow: 0 24px 60px rgba(15, 23, 42, 0.09);
    transform: translateY(-5px);
}

.horizon_beneficios_grid article > span {
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    border: 1px solid var(--horizon-gold-border);
    border-radius: 14px;
    background: var(--horizon-gold-soft);
    color: var(--horizon-gold-dark);
    font-size: 12px;
    font-weight: 850;
}

.horizon_beneficios_grid h3 {
    margin-top: 46px;
    font-size: 21px;
    letter-spacing: -0.035em;
}

.horizon_beneficios_grid p {
    margin-top: 12px;
    color: var(--horizon-muted);
    font-size: 14px;
    line-height: 1.7;
}

.horizon_pagamento {
    border-block: 1px solid var(--horizon-border);
    background:
        radial-gradient(circle at 80% 10%, rgba(245, 158, 11, 0.09), transparent 25%),
        var(--horizon-bg);
}

.horizon_pagamento_grid {
    display: grid;
    grid-template-columns: minmax(0, 0.98fr) minmax(380px, 0.72fr);
    align-items: center;
    gap: 72px;
}

.horizon_pagamento_conteudo > p {
    margin-top: 22px;
    max-width: 620px;
    color: var(--horizon-muted);
    font-size: 16px;
    line-height: 1.72;
}

.horizon_metodos {
    margin-top: 26px;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.horizon_metodos span {
    padding: 9px 12px;
    border: 1px solid var(--horizon-gold-border);
    border-radius: 999px;
    background: var(--horizon-gold-soft);
    color: var(--horizon-gold-dark);
    font-size: 12px;
    font-weight: 750;
}

.horizon_alerta {
    margin-top: 28px;
    max-width: 640px;
    padding: 18px;
    border: 1px solid rgba(1, 69, 242, 0.16);
    border-radius: 18px;
    background: #eef4ff;
    color: #334155;
    font-size: 13px;
    line-height: 1.65;
}

.horizon_alerta strong {
    color: var(--horizon-blue);
}

.horizon_checkout_card {
    padding: 26px;
    border: 1px solid rgba(245, 158, 11, 0.24);
    border-radius: 26px;
    background: rgba(255, 255, 255, 0.92);
    box-shadow: var(--horizon-shadow);
}

.horizon_checkout_topo {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    padding-bottom: 22px;
    border-bottom: 1px solid var(--horizon-border);
}

.horizon_checkout_topo span {
    display: block;
    color: var(--horizon-gold-strong);
    font-size: 11px;
    font-weight: 850;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.horizon_checkout_topo h3 {
    margin-top: 5px;
    font-size: 25px;
    letter-spacing: -0.045em;
}

.horizon_checkout_topo strong {
    padding: 10px 12px;
    border-radius: 14px;
    background: var(--horizon-gold-soft);
    color: var(--horizon-gold-dark);
    font-size: 16px;
}

.horizon_field {
    margin-top: 22px;
    display: grid;
    gap: 8px;
}

.horizon_field span,
.horizon_check span {
    color: #334155;
    font-size: 13px;
    font-weight: 750;
}

.horizon_field input {
    width: 100%;
    min-height: 48px;
    padding: 0 14px;
    border: 1px solid var(--horizon-border);
    border-radius: 13px;
    outline: none;
    background: #ffffff;
    color: var(--horizon-text);
    transition: border-color 0.18s ease, box-shadow 0.18s ease;
}

.horizon_field input:focus {
    border-color: rgba(245, 158, 11, 0.65);
    box-shadow: 0 0 0 4px rgba(245, 158, 11, 0.12);
}

.horizon_field small {
    color: var(--horizon-muted);
    font-size: 11px;
    line-height: 1.55;
}

.horizon_check {
    margin: 18px 0;
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    align-items: start;
    gap: 10px;
}

.horizon_check input {
    margin-top: 2px;
    accent-color: var(--horizon-gold);
}

.horizon_check span {
    color: var(--horizon-muted);
    font-weight: 600;
    line-height: 1.55;
}

.horizon_cancelar {
    width: 100%;
    margin-top: 10px;
    min-height: 46px;
    border-radius: 13px;
    background: transparent;
    color: #64748b;
    font-size: 13px;
    font-weight: 750;
    transition: background 0.18s ease, color 0.18s ease;
}

.horizon_cancelar:hover,
.horizon_cancelar:focus-visible {
    outline: none;
    background: #f8fafc;
    color: #dc2626;
}

.horizon_feedback {
    min-height: 20px;
    margin-top: 14px;
    color: var(--horizon-muted);
    font-size: 12px;
    line-height: 1.5;
}

.horizon_feedback.sucesso {
    color: #047857;
}

.horizon_feedback.erro {
    color: #dc2626;
}

.horizon_cta {
    background: #ffffff;
}

.horizon_cta_card {
    padding: 72px 40px;
    border: 1px solid rgba(245, 158, 11, 0.2);
    border-radius: 30px;
    background:
        linear-gradient(rgba(255, 255, 255, 0.72), rgba(255, 255, 255, 0.88)),
        radial-gradient(circle at 50% 0, rgba(245, 158, 11, 0.18), transparent 52%);
    text-align: center;
    box-shadow: var(--horizon-shadow);
}

.horizon_cta_card h2 {
    margin-inline: auto;
}

.horizon_cta_card h2 span {
    display: block;
    width: fit-content;
    max-width: 100%;
    margin-inline: auto;
    background: var(--horizon-premium-text);
    background-clip: text;
    color: transparent;
}

.horizon_cta_card > p {
    max-width: 620px;
    margin: 20px auto 0;
    color: var(--horizon-muted);
    font-size: 15px;
    line-height: 1.7;
}

@media (max-width: 980px) {
    .horizon_hero_grid,
    .horizon_pagamento_grid {
        grid-template-columns: 1fr;
    }

    .horizon_preview,
    .horizon_checkout_card {
        width: min(620px, 100%);
        margin-inline: auto;
    }

    .horizon_beneficios_grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 860px) {
    .cabecalho {
        background: rgba(255, 255, 255, 0.96);
    }

    .cabecalho_interno {
        min-height: auto;
        padding: 11px 0 9px;
        align-items: flex-start;
        flex-wrap: wrap;
        gap: 9px 18px;
    }

    .grupo_esquerda {
        width: 100%;
        justify-content: space-between;
    }

    .cabecalho_navegacao {
        max-width: calc(100% - 116px);
        overflow-x: auto;
        scrollbar-width: none;
    }

    .cabecalho_navegacao::-webkit-scrollbar {
        display: none;
    }

    .grupo_direita {
        width: 100%;
        justify-content: flex-end;
    }

    .horizon_hero {
        padding-top: 186px;
    }
}

@media (max-width: 640px) {
    .horizon_container {
        width: min(100% - 28px, 1180px);
    }

    .cabecalho_interno {
        width: calc(100% - 20px);
        padding-block: 10px;
        display: grid;
        grid-template-columns: auto minmax(0, 1fr);
        align-items: center;
        gap: 8px 12px;
    }

    .grupo_esquerda {
        display: contents;
    }

    .cabecalho_logo_click {
        grid-column: 1;
        grid-row: 1;
    }

    .cabecalho_navegacao {
        width: 100%;
        max-width: none;
        grid-column: 1 / -1;
        grid-row: 2;
        justify-content: flex-start;
    }

    .grupo_direita {
        width: auto;
        grid-column: 2;
        grid-row: 1;
        justify-self: end;
    }

    .cabecalho_elementos {
        min-height: 34px;
        padding: 0 8px;
        font-size: 11px;
    }

    .cabecalho_entrar {
        display: none;
    }

    .cabecalho_elemento_comecar {
        padding-inline: 13px;
        font-size: 12px;
    }

    .horizon_hero {
        min-height: auto;
        padding: 176px 0 72px;
        background-size: 32px 32px, 32px 32px, auto, auto, auto;
    }

    .horizon_hero_conteudo h1 {
        font-size: clamp(39px, 12vw, 54px);
    }

    .horizon_hero_conteudo > p {
        font-size: 16px;
    }

    .horizon_hero_acoes {
        display: grid;
    }

    .horizon_botao_primary,
    .horizon_botao_secondary {
        width: 100%;
    }

    .horizon_status_card {
        align-items: flex-start;
        flex-direction: column;
    }

    .horizon_preview_perfil {
        grid-template-columns: 1fr;
    }

    .horizon_status_secao,
    .horizon_beneficios,
    .horizon_pagamento,
    .horizon_cta {
        padding: 76px 0;
    }

    .horizon_checkout_card,
    .horizon_cta_card {
        padding: 26px 20px;
        border-radius: 24px;
    }
}

@view-transition {
    navigation: auto;
}

::view-transition-old(root) {
    animation: vantara-page-exit 280ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

::view-transition-new(root) {
    animation: vantara-page-enter 320ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes vantara-page-exit {
    from {
        opacity: 1;
        transform: translateX(0) scale(1);
    }

    to {
        opacity: 0;
        transform: translateX(var(--vantara-page-exit-x, -18px)) scale(0.992);
    }
}

@keyframes vantara-page-enter {
    from {
        opacity: 0;
        transform: translateX(var(--vantara-page-enter-x, 18px)) scale(0.992);
    }

    to {
        opacity: 1;
        transform: translateX(0) scale(1);
    }
}

@media (prefers-reduced-motion: reduce) {
    ::view-transition-old(root),
    ::view-transition-new(root),
    html.vantara_page_reveal body {
        animation: none !important;
    }

    * {
        scroll-behavior: auto !important;
    }
}

html.vantara_page_reveal body {
    animation: vantara-page-enter 320ms cubic-bezier(0.22, 1, 0.36, 1) both;
}


/*
    ========================================
    VANTARA MOBILE APP DENSITY — HORIZON
    ========================================
*/

@media (max-width: 768px) {
    .horizon_container {
        width: min(100% - 28px, 720px);
    }

    .horizon_hero {
        min-height: auto;
        padding-top: 118px;
        padding-bottom: 58px;
    }

    .horizon_hero_conteudo h1 {
        font-size: clamp(34px, 10vw, 48px);
        line-height: 1.04;
    }

    .horizon_hero_conteudo > p,
    .horizon_cta_card > p {
        font-size: 14px;
        line-height: 1.55;
    }

    .horizon_status_secao,
    .horizon_beneficios,
    .horizon_pagamento,
    .horizon_cta {
        padding: 54px 0;
    }

    .horizon_preview_card,
    .horizon_status_card,
    .horizon_checkout_card,
    .horizon_cta_card {
        border-radius: 20px;
        box-shadow: 0 12px 30px rgba(15, 23, 42, 0.075);
    }

    .horizon_preview_card,
    .horizon_checkout_card {
        padding: 18px;
    }

    .horizon_cta_card {
        padding: 36px 20px;
    }

    .horizon_checkout_topo {
        gap: 12px;
        padding-bottom: 16px;
    }

    .horizon_checkout_topo h3 {
        font-size: 21px;
    }

    .horizon_field {
        margin-top: 16px;
    }

    .horizon_field input,
    .horizon_botao_primary,
    .horizon_botao_secondary,
    .horizon_cancelar {
        min-height: 42px;
        border-radius: 13px;
        font-size: 13px;
    }
}

@media (max-width: 480px) {
    .horizon_container {
        width: min(100% - 24px, 480px);
    }

    .horizon_hero_conteudo h1 {
        font-size: clamp(32px, 12vw, 42px);
    }

    .horizon_checkout_topo {
        flex-direction: column;
    }

    .horizon_status_secao,
    .horizon_beneficios,
    .horizon_pagamento,
    .horizon_cta {
        padding: 42px 0;
    }
}

html.vantara_theme_dark body {
    --horizon-bg: #07111f;
    --horizon-surface: rgba(15, 23, 42, 0.94);
    --horizon-surface-soft: rgba(2, 8, 23, 0.76);
    --horizon-text: #f8fafc;
    --horizon-muted: #a8b6ca;
    --horizon-border: rgba(148, 163, 184, 0.2);
    --horizon-shadow: 0 24px 70px rgba(0, 0, 0, 0.32);
}

html.vantara_theme_dark body .horizon_hero {
    background:
        radial-gradient(circle at 14% 8%, rgba(77, 235, 255, 0.1), transparent 28%),
        radial-gradient(circle at 88% 12%, rgba(245, 158, 11, 0.13), transparent 30%),
        linear-gradient(180deg, #07111f, #0b1220) !important;
    border-bottom-color: rgba(148, 163, 184, 0.18) !important;
}

html.vantara_theme_dark body .cabecalho {
    background:
        linear-gradient(
            180deg,
            rgba(15, 23, 42, 0.96),
            rgba(2, 8, 23, 0.92)
        ) !important;
    border-bottom-color: rgba(148, 163, 184, 0.18) !important;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.24) !important;
}

html.vantara_theme_dark body .cabecalho_logo_click,
html.vantara_theme_dark body .cabecalho_elementos,
html.vantara_theme_dark body .cabecalho_entrar {
    color: #dbeafe !important;
}

html.vantara_theme_dark body .cabecalho_elementos:hover,
html.vantara_theme_dark body .cabecalho_elementos:focus-visible,
html.vantara_theme_dark body .cabecalho_entrar:hover,
html.vantara_theme_dark body .cabecalho_entrar:focus-visible {
    background: rgba(30, 41, 59, 0.84) !important;
    color: #67e8f9 !important;
}

html.vantara_theme_dark body .horizon_hero::after {
    background: linear-gradient(transparent, #07111f) !important;
}

html.vantara_theme_dark body :where(
    .horizon_preview,
    .horizon_preview_card,
    .horizon_status_card,
    .horizon_beneficios_grid article,
    .horizon_checkout_card,
    .horizon_cta_card
) {
    background:
        linear-gradient(
            145deg,
            rgba(15, 23, 42, 0.96),
            rgba(2, 8, 23, 0.88)
        ) !important;
    border-color: rgba(148, 163, 184, 0.2) !important;
    color: #e5edf7 !important;
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.32) !important;
}

html.vantara_theme_dark body :where(
    .horizon_status_secao,
    .horizon_beneficios,
    .horizon_pagamento,
    .horizon_cta
) {
    background: transparent !important;
}

html.vantara_theme_dark body .horizon_pagamento {
    border-block-color: rgba(148, 163, 184, 0.18) !important;
}

html.vantara_theme_dark body :where(
    .horizon_preview_card h3,
    .horizon_status_card h2,
    .horizon_section_header h2,
    .horizon_pagamento_conteudo h2,
    .horizon_cta_card h2,
    .horizon_beneficios_grid h3,
    .horizon_checkout_topo h3
) {
    color: #f8fafc !important;
}

html.vantara_theme_dark body :where(
    .horizon_preview_card p,
    .horizon_status_card p,
    .horizon_section_header > p,
    .horizon_pagamento_conteudo > p,
    .horizon_cta_card > p,
    .horizon_beneficios_grid p,
    .horizon_field small,
    .horizon_check span,
    .horizon_feedback
) {
    color: #a8b6ca !important;
}

html.vantara_theme_dark body :where(
    .horizon_badge,
    .horizon_status_pill,
    .horizon_metodos span,
    .horizon_beneficios_grid article > span,
    .horizon_checkout_topo strong
) {
    background: rgba(245, 158, 11, 0.16) !important;
    border-color: rgba(251, 191, 36, 0.28) !important;
    color: #fde68a !important;
}

html.vantara_theme_dark body .horizon_trust_badge {
    background: rgba(1, 69, 242, 0.16) !important;
    border-color: rgba(96, 165, 250, 0.28) !important;
    color: #bfdbfe !important;
}

html.vantara_theme_dark body .horizon_alerta {
    background: rgba(245, 158, 11, 0.12) !important;
    border-color: rgba(251, 191, 36, 0.24) !important;
    color: #fde68a !important;
}

html.vantara_theme_dark body .horizon_field input {
    background: rgba(2, 8, 23, 0.82) !important;
    border-color: rgba(148, 163, 184, 0.24) !important;
    color: #e5edf7 !important;
}

html.vantara_theme_dark body .horizon_botao_secondary,
html.vantara_theme_dark body .horizon_cancelar {
    background: rgba(15, 23, 42, 0.88) !important;
    border-color: rgba(148, 163, 184, 0.24) !important;
    color: #e5edf7 !important;
}