/* =========================================================
   Manifestação de Vontade — landing + ferramenta de simulação
   Escopo: .mv (página) — mobile first
   ========================================================= */

.mv {
    --mv-red: #BF202D;
    --mv-wine: #911B23;
    --mv-wine-deep: #78171D;
    --mv-ink: #3E3E3E;
    --mv-slate: #6B6B6B;
    --mv-mist: #ECF2F7;
    --mv-paper: #F9FBFC;
    --mv-rose: #FBEDEE;
    --mv-green: #1B7F43;
    --mv-focus: #1A5FB4;
    --mv-radius: 8px;
    --mv-shadow: 0 10px 30px rgba(54, 61, 77, .08);

    /* Escala de espaçamento (390px → 1440px) */
    --mv-space-section: clamp(64px, 46px + 5vw, 120px);   /* padding vertical das seções: 66 → 118 */
    --mv-space-head: clamp(36px, 26px + 2.4vw, 64px);     /* título/apoio → conteúdo: 35 → 60 */
    --mv-space-cta: clamp(36px, 28px + 2vw, 56px);        /* conteúdo → CTA / fecho: 36 → 57 */
    --mv-space-title: clamp(14px, 10px + .9vw, 22px);     /* título → texto de apoio */
    --mv-gap-cards: clamp(16px, 10px + 1.4vw, 28px);      /* entre cards */
    --mv-pad-card: clamp(22px, 16px + 1.4vw, 36px);       /* padding interno dos cards */
    --mv-measure: 62ch;                                   /* largura de leitura (texto em coluna) */
    --mv-measure-center: 92ch;                            /* textos de apoio centralizados */
    color: var(--mv-ink);
    overflow-x: clip;
}

.mv *:focus-visible {
    outline: 3px solid var(--mv-focus);
    outline-offset: 2px;
}

.mv .visually-hidden {
    position: absolute !important;
    width: 1px;
    height: 1px;
    margin: -1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}

/* Placeholder de conteúdo pendente */
.is-pending {
    background: #FFF4C2;
    color: #6B4E00 !important;
    outline: 1px dashed #B58100;
    border-radius: 3px;
    padding: 0 3px;
    font-weight: 500;
}

.is-pending--short {
    white-space: nowrap;
}

/* ---------- Tipografia ---------- */
.mv-h1 {
    font-size: 2rem;
    line-height: 1.15;
    font-weight: 700;
    color: var(--mv-ink);
    margin: 0 0 16px;
    letter-spacing: -.01em;
}

.mv-h2 {
    font-size: 1.75rem;
    line-height: 1.2;
    font-weight: 700;
    color: var(--mv-ink);
    margin: 0 0 var(--mv-space-title);
    text-wrap: balance;
}

.mv-text,
.mv p {
    font-size: 1rem;
    line-height: 1.65;
    color: var(--mv-slate);
}

.mv-text + .mv-text {
    margin-top: 1em;
}

.mv-lead {
    font-size: .9375rem !important;
    line-height: 1.55 !important;
    margin-bottom: 24px;
}

.mv-seal {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: 'questa-slab', Georgia, serif;
    font-weight: 900;
    font-size: .8125rem;
    line-height: 1.3;
    letter-spacing: .02em;
    text-transform: uppercase;
    color: var(--mv-red);
    background: var(--mv-rose);
    border-radius: 999px;
    padding: 6px 14px;
    margin-bottom: clamp(16px, 12px + .8vw, 22px);
}

.mv-center {
    text-align: center;
    max-width: 960px;
    margin: 0 auto var(--mv-space-head);
}

.mv-center .mv-text {
    text-wrap: balance;
    max-width: var(--mv-measure-center);
    margin-left: auto;
    margin-right: auto;
}

.mv-center--light .mv-h2,
.mv-center--light .mv-text {
    color: #FFF;
}

.mv-center--light .mv-text {
    opacity: .92;
}

/* ---------- Botões ---------- */
.mv .mv-btn {
    width: 100%;
    max-width: 360px;
    min-height: 52px;
    height: auto;
    padding: 14px 24px;
    gap: 10px;
    text-transform: uppercase;
    font-weight: 600;
    font-size: .9375rem;
    letter-spacing: .01em;
    text-align: center;
}

.mv-btn-wa {
    background: #FFF;
    color: var(--mv-ink);
    border: 1px solid #D5DEE6;
}

.mv-btn-wa i {
    color: #00AA4E;
    font-size: 1.25rem;
}

.mv-btn-wa:hover {
    color: var(--mv-ink);
    border-color: #00AA4E;
    background: #F2FBF6;
}

.mv-btn-light {
    background: #FFF;
    color: var(--mv-wine);
    border: 1px solid #FFF;
}

.mv-btn-light:hover {
    background: var(--mv-rose);
    color: var(--mv-wine);
}

.mv-btn-ghost {
    background: transparent;
    color: #FFF;
    border: 1px solid rgba(255, 255, 255, .7);
    box-shadow: none;
}

.mv-btn-ghost:hover {
    background: rgba(255, 255, 255, .1);
    color: #FFF;
    border-color: #FFF;
}

.mv-cta {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
}

.mv-cta--center {
    align-items: center;
    text-align: center;
    gap: 14px;
    margin-top: var(--mv-space-cta);
}

.mv .mv-micro {
    font-size: .875rem;
    line-height: 1.5;
    color: var(--mv-slate);
    margin: 0;
}

/* ---------- Seções ---------- */
.mv-section,
.mv-sim,
.mv-final {
    padding: var(--mv-space-section) 0;
}

/* Gutters do Bootstrap seguem a escala */
.mv .row.g-4 {
    --bs-gutter-x: var(--mv-gap-cards);
    --bs-gutter-y: var(--mv-gap-cards);
}

/* ---------- 1. Header ---------- */
.mv-hero {
    padding: 16px 0 var(--mv-space-section);
    background: linear-gradient(180deg, #FFF 0%, var(--mv-paper) 100%);
}

.mv-hero__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "top" "video" "bottom";
    gap: 32px;
}

.mv-hero__top { grid-area: top; }

.mv-cta__row {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    width: 100%;
}

/* WhatsApp do header: um por breakpoint (o oculto sai da árvore de acessibilidade) */
.mv-hero__wa--desktop {
    display: none !important;
}
.mv-hero__video { grid-area: video; }
.mv-hero__cta--desktop {
    display: none;
}
.mv-hero__bottom {
    grid-area: bottom;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* Vídeo */
.mv-video {
    position: relative;
    aspect-ratio: 16 / 9;
    border-radius: var(--mv-radius);
    overflow: hidden;
    background: #1F2328;
    box-shadow: 0 10px 28px rgba(54, 61, 77, .14);
}

.mv-video__thumb {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    padding: 0;
    background: none;
    cursor: pointer;
}

.mv-video__thumb[aria-disabled="true"] {
    cursor: default;
}

.mv-video__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.mv-video__thumb::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 45%, rgba(0, 0, 0, .45) 100%);
}

.mv-video__play {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 72px;
    height: 72px;
    margin: -36px 0 0 -36px;
    border-radius: 50%;
    background: var(--mv-red);
    color: #FFF;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    padding-left: 4px;
    box-shadow: 0 0 0 10px rgba(191, 32, 45, .25);
    transition: transform .2s ease;
    z-index: 1;
}

.mv-video__thumb:hover .mv-video__play {
    transform: scale(1.06);
}

.mv-video__duration {
    position: absolute;
    right: 12px;
    bottom: 12px;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(0, 0, 0, .7);
    color: #FFF;
    font-size: .8125rem;
    font-weight: 600;
    border-radius: 4px;
    padding: 4px 8px;
}

.mv-video__soon {
    position: absolute;
    left: 12px;
    top: 12px;
    z-index: 1;
    font-size: .75rem;
}

.mv-video__frame,
.mv-video__frame iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

.mv-video__frame:empty {
    display: none;
}

/* Linha de credibilidade do hero (logo abaixo dos botões, discreta) */
.mv-hero .mv-cta {
    gap: 14px;
}

.mv-trust {
    list-style: none;
    display: flex;
    flex-direction: column; /* mobile: um item por linha */
    gap: 4px;
    margin: 0;
    padding: 0;
    font-size: .8125rem;
    line-height: 1.4;
    color: var(--mv-slate);
}

.mv-trust li {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.mv-trust i {
    color: var(--mv-red);
    font-size: .6875rem;
}

/* ---------- 2. O que mudou: Antes × Agora ---------- */
.mv-changed {
    background: var(--mv-mist);
}

.mv-shift {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    justify-items: center;
    gap: 12px;
    max-width: 1040px;
    margin: 0 auto;
}

.mv-shift__card {
    width: 100%;
    height: 100%;
    border-radius: 12px;
    padding: var(--mv-pad-card);
}

/* Antes: regra que deixou de valer, recuada mas legível */
.mv-shift__card--before {
    background: rgba(255, 255, 255, .55);
    border: 1px solid #D5DEE6;
}

/* Agora: a regra vigente, com o acento da marca */
.mv-shift__card--now {
    background: #FFF;
    border: 1px solid #F1C5C9;
    border-top: 4px solid var(--mv-red);
    box-shadow: var(--mv-shadow);
}

.mv .mv-shift__label {
    font-family: 'questa-slab', Georgia, serif;
    font-weight: 900;
    font-size: .875rem;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--mv-slate);
    margin: 0 0 8px;
}

.mv-shift__card--now .mv-shift__label {
    color: var(--mv-red);
}

.mv .mv-shift__date {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 20px;
    padding: 5px 12px;
    border-radius: 999px;
    background: var(--mv-mist);
    color: var(--mv-ink);
    font-size: .9375rem;
    font-weight: 700;
    line-height: 1.3;
}

.mv-shift__card--now .mv-shift__date {
    background: var(--mv-rose);
    color: var(--mv-wine);
}

.mv .mv-shift__big {
    font-size: clamp(1.625rem, 1.2rem + 1.3vw, 2.25rem);
    line-height: 1.12;
    letter-spacing: -.01em;
    color: var(--mv-slate);
    margin: 0 0 12px;
    text-wrap: balance;
}

.mv-shift__card--now .mv-shift__big {
    color: var(--mv-ink);
}

.mv-shift__big strong {
    font-weight: 700;
}

.mv .mv-shift__text {
    margin: 0;
}

/* Virada entre os dois cards: seta (↓ no mobile, → no desktop) + data do decreto */
.mv-shift__turn {
    display: flex;
    align-items: center;
    gap: 12px;
}

.mv-shift__arrow {
    width: 44px;
    height: 44px;
    flex: none;
    border-radius: 50%;
    background: var(--mv-red);
    color: #FFF;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 6px 18px rgba(145, 27, 35, .25);
}

.mv-shift__arrow i {
    transform: rotate(90deg);
}

.mv-shift__decree {
    font-family: 'questa-slab', Georgia, serif;
    font-weight: 700;
    font-size: .8125rem;
    line-height: 1.35;
    letter-spacing: .02em;
    text-transform: uppercase;
    color: var(--mv-wine);
}

.mv-shift__decree time {
    display: block;
    font-family: 'Fira Sans', sans-serif;
    font-size: .9375rem;
    letter-spacing: 0;
}

/* Quem foi preservado: o gancho para a manifestação */
.mv .mv-shift__note {
    max-width: 760px;
    margin: clamp(28px, 22px + 1.2vw, 40px) auto 0;
    text-align: center;
    text-wrap: balance;
    font-size: 1.0625rem;
    color: var(--mv-ink);
}

/* Status: Hoje → Próximo passo */
.mv-status {
    list-style: none;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    max-width: 1040px;
    margin: clamp(28px, 22px + 1.2vw, 40px) auto 0;
    padding: 0;
    background: #FFF;
    border: 1px solid #D5DEE6;
    border-radius: 12px;
    overflow: hidden;
}

.mv-status__item {
    position: relative;
    padding: 18px 22px;
}

.mv-status__item--next {
    background: #FDF6F6;
    border-top: 1px solid #D5DEE6;
}

.mv-status__label {
    display: block;
    font-family: 'questa-slab', Georgia, serif;
    font-weight: 900;
    font-size: .8125rem;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--mv-slate);
    margin-bottom: 4px;
}

.mv-status__item--next .mv-status__label {
    color: var(--mv-red);
}

.mv .mv-status__item p {
    margin: 0;
    color: var(--mv-ink);
}

/* Frase que leva ao bloco 3 */
.mv .mv-transition {
    margin: var(--mv-space-cta) 0 0;
    text-align: center;
}

.mv-transition a {
    display: inline;
    font-weight: 600;
    font-size: 1.0625rem;
    line-height: 1.6;
    color: var(--mv-red);
    text-decoration: underline;
    text-decoration-color: rgba(191, 32, 45, .45);
    text-decoration-thickness: 1px;
    text-underline-offset: 5px;
}

.mv-transition a:hover {
    color: var(--mv-wine);
    text-decoration-color: currentColor;
}

.mv-transition i {
    color: var(--mv-red);
    margin-left: 8px;
}

/* ---------- 3. O que é: mostrar a prova ---------- */
.mv-what__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "head" "visual" "body";
    row-gap: 8px;
}

.mv-what__head { grid-area: head; }
.mv-what__visual {
    grid-area: visual;
    padding: 20px 0 36px;
    container-type: inline-size;
}
.mv-what__body { grid-area: body; }

.mv-what__head .mv-h2 {
    margin-bottom: 0;
}

.mv .mv-what__lead {
    font-size: 1.25rem;
    line-height: 1.4;
    color: var(--mv-ink);
    margin: 0 0 16px;
    text-wrap: pretty;
}

.mv-what__lead strong {
    font-weight: 700;
    background: linear-gradient(transparent 60%, var(--mv-rose) 60%);
}

.mv-what__body .mv-text {
    max-width: var(--mv-measure);
}

/* Benefícios: lista simples com check, sem cards */
.mv-benefits {
    max-width: var(--mv-measure);
    list-style: none;
    margin: 28px 0 0;
    padding: 0;
    display: grid;
    gap: 18px;
}

.mv-benefits li {
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr);
    column-gap: 14px;
}

.mv-benefits i {
    color: var(--mv-red);
    font-size: 1.25rem;
    margin-top: 2px;
}

.mv .mv-benefits p {
    margin: 0;
}

.mv-benefits strong {
    display: block;
    font-size: 1.0625rem;
    color: var(--mv-ink);
    margin-bottom: 2px;
}

.mv-what__cta {
    margin-top: 32px;
}

.mv-what .mv-btn {
    max-width: none;
}

/* Documento protocolado (ilustração decorativa em CSS). Tudo é em em:
   o font-size acompanha a largura (desenho base = 26.25em de largura). */
.mv-doc {
    --mv-doc-w: min(300px, 100cqw);
    position: relative;
    width: var(--mv-doc-w);
    margin: 0 auto;
    font-size: calc(var(--mv-doc-w) / 26.25);
}

/* folhas de baixo */
.mv-doc::before,
.mv-doc::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 6px;
    border: 1px solid #D5DEE6;
}

.mv-doc::before {
    background: #E6EDF3;
    transform: rotate(5deg) translate(4%, 2%);
}

.mv-doc::after {
    background: #F4F7FA;
    transform: rotate(2deg) translate(2%, 1%);
}

.mv-doc__sheet {
    position: relative;
    z-index: 1;
    background: #FFF;
    border: 1px solid #DCE4EB;
    border-radius: 6px;
    padding: 2.25em 2em 2em;
    box-shadow: 0 24px 50px rgba(54, 61, 77, .14);
    transform: rotate(-2deg);
}

.mv .mv-doc__title {
    font-family: 'questa-slab', Georgia, serif;
    font-weight: 900;
    font-size: 1.25em;
    line-height: 1.2;
    color: var(--mv-ink);
    margin: 0 0 1.25em;
    padding-bottom: .7em;
    border-bottom: 2px solid var(--mv-red);
}

.mv-doc__line {
    display: block;
    height: .55em;
    margin-bottom: .75em;
    border-radius: 4px;
    background: #E3EAF0;
}

.mv-doc__line--short { width: 58%; }
.mv-doc__line--mid { width: 80%; }

.mv-doc__fields {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .9em;
    margin: 1.5em 0;
}

.mv-doc__field {
    border: 1px dashed #B9C8D4;
    border-radius: 6px;
    padding: .6em .75em;
}

.mv-doc__label {
    display: block;
    font-size: .75em;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--mv-slate);
    line-height: 1.3;
}

.mv-doc__value {
    display: block;
    margin-top: .25em;
    font-weight: 700;
    font-size: 1.0625em;
    letter-spacing: .08em;
    color: var(--mv-ink);
}

.mv-doc__sign {
    width: 52%;
    margin-top: 1.75em;
}

.mv-doc__sign svg {
    display: block;
    width: 100%;
    height: 2.6em;
    color: #3E5872;
    border-bottom: 1px solid var(--mv-ink);
    margin-bottom: .4em;
}

.mv-doc__stamp {
    position: absolute;
    right: 1.4em;
    bottom: 1.6em;
    width: 7.8em;
    height: 7.8em;
    border-radius: 50%;
    border: .22em solid var(--mv-red);
    box-shadow: inset 0 0 0 .32em #FFF, inset 0 0 0 .45em var(--mv-red);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--mv-red);
    font-family: 'questa-slab', Georgia, serif;
    font-weight: 900;
    font-size: 1em;
    letter-spacing: .05em;
    text-transform: uppercase;
    opacity: .88;
    mix-blend-mode: multiply;
    transform: rotate(-14deg);
}

.mv-doc__stamp span {
    font-size: .68em;
    padding: .3em 0;
    border-top: 1px solid currentColor;
    border-bottom: 1px solid currentColor;
}

.mv-doc__stamp small {
    display: block;
    text-align: center;
    font-size: .72em;
    letter-spacing: .12em;
    margin-top: .15em;
}

/* Entrada do carimbo (o JS só arma se não houver prefers-reduced-motion) */
.mv-doc.is-armed .mv-doc__stamp {
    opacity: 0;
    transform: rotate(-14deg) scale(1.8);
}

.mv-doc.is-stamped .mv-doc__stamp {
    opacity: .88;
    transform: rotate(-14deg) scale(1);
    transition: transform .45s cubic-bezier(.2, 1.4, .4, 1), opacity .2s ease;
}

.mv-steps h3,
.mv-person h3 {
    font-size: 1.1875rem;
    line-height: 1.3;
    font-weight: 700;
    margin: 0 0 10px;
}

/* ---------- 4. Como funciona ---------- */
.mv-how {
    background: var(--mv-paper);
    border-top: 1px solid var(--mv-mist);
}

.mv-steps {
    margin: 0 auto;
    padding: 0;
    max-width: 760px;
    counter-reset: none;
}

.mv .mv-steps__body p {
    text-wrap: pretty;
}

.mv-steps__item {
    position: relative;
    display: flex;
    gap: 16px;
    padding-bottom: var(--mv-gap-cards);
}

.mv-steps__item::before {
    content: "";
    position: absolute;
    left: 21px;
    top: 44px;
    bottom: 0;
    width: 2px;
    background: #D5DEE6;
}

.mv-steps__item:last-child {
    padding-bottom: 0;
}

.mv-steps__item:last-child::before {
    display: none;
}

.mv-steps__num {
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: #FFF;
    border: 2px solid var(--mv-red);
    color: var(--mv-red);
    font-family: 'questa-slab', Georgia, serif;
    font-weight: 900;
    font-size: 1.125rem;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 1;
}

.mv-steps__body {
    background: #FFF;
    border: 1px solid var(--mv-mist);
    border-radius: var(--mv-radius);
    padding: clamp(20px, 14px + 1vw, 28px) 20px;
    flex: 1;
    min-width: 0;
}

.mv-steps__body i {
    font-size: 1.5rem;
    color: var(--mv-red);
    margin-bottom: 14px;
    display: block;
}

.mv .mv-steps__body p {
    margin: 0;
    font-size: .9375rem;
}

/* ---------- 6. Simulação ---------- */
.mv-sim {
    background: var(--mv-wine);
    background-image: radial-gradient(1200px 400px at 50% -10%, rgba(255, 255, 255, .08), transparent 60%);
    scroll-margin-top: 0;
}

.mv-sim:focus {
    outline: none;
}

.mv-sim *:focus-visible {
    outline-color: #FFF;
}

.mv-sim .mv-tool *:focus-visible {
    outline-color: var(--mv-focus);
}

/* Card da ferramenta: tela de aplicativo (barra + etapas + formulário + resumo) */
.mv-tool {
    --mv-tool-pad: 20px;
    background: #FFF;
    border-radius: 12px;
    max-width: 720px;
    margin: 0 auto;
    box-shadow: 0 20px 50px rgba(0, 0, 0, .25);
    color: var(--mv-ink);
}

/* Etapas: 1 Árvore · 2 Seus dados · 3 Perguntas · 4 Orçamento */
.mv-stepper {
    list-style: none;
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    padding: 14px var(--mv-tool-pad);
    border-bottom: 1px solid var(--mv-mist);
    counter-reset: none;
}

.mv-stepper__item {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    font-size: .875rem;
    font-weight: 500;
    line-height: 1.2;
    color: var(--mv-slate);
}

/* linha entre as etapas */
.mv-stepper__item:not(:last-child)::after {
    content: "";
    flex: 1 1 auto;
    min-width: 10px;
    height: 2px;
    border-radius: 2px;
    background: #D5DEE6;
}

.mv-stepper__item:not(:last-child) {
    flex: 1 1 auto;
}

.mv-stepper__item.is-done::after {
    background: var(--mv-red);
}

.mv-stepper__dot {
    display: inline-grid;
    place-items: center;
    flex: none;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    border: 1.5px solid #C9D5DF;
    background: #FFF;
    font-size: .75rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.mv-stepper__dot i {
    display: none;
    font-size: .6875rem;
}

.mv-stepper__label {
    white-space: nowrap;
}

.mv-stepper__item.is-current {
    color: var(--mv-ink);
    font-weight: 700;
}

.mv-stepper__item.is-current .mv-stepper__dot {
    border-color: var(--mv-red);
    color: var(--mv-red);
    box-shadow: 0 0 0 3px var(--mv-rose);
}

.mv-stepper__item.is-done {
    color: var(--mv-ink);
}

.mv-stepper__item.is-done .mv-stepper__dot {
    background: var(--mv-red);
    border-color: var(--mv-red);
    color: #FFF;
}

.mv-stepper__item.is-done .mv-stepper__dot span {
    display: none;
}

.mv-stepper__item.is-done .mv-stepper__dot i {
    display: block;
}

/* Mobile estreito: só números, com o rótulo da etapa atual */
@media (max-width: 575px) {
    .mv-stepper__item:not(.is-current) .mv-stepper__label {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0 0 0 0);
        white-space: nowrap;
    }
}

/* Corpo: formulário + resumo (lado a lado a partir de 992px) */
.mv-tool__main {
    display: flex;
    flex-direction: column;
    padding: 24px var(--mv-tool-pad) var(--mv-tool-pad);
    min-width: 0;
}

.mv-tool__main > .mv-step {
    flex: 1 0 auto;
    display: flex;
    flex-direction: column;
}

/* Resumo ao vivo: fica oculto na pergunta inicial e entra quando a pessoa escolhe um caminho.
   Reaparecer de display:none reinicia a animação, então ela roda a cada entrada. */
.mv-summary {
    background: var(--mv-paper);
    border-top: 1px solid var(--mv-mist);
    border-radius: 0 0 12px 12px;
    animation: mv-summary-fade .3s ease-out both;
}

.mv-tool.is-entry .mv-summary {
    display: none;
}

/* Abertura direta na árvore (um caminho só): o resumo já está na tela, sem animação de entrada */
.mv-tool.is-direct .mv-summary {
    animation: none;
}

@keyframes mv-summary-fade {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes mv-summary-slide {
    from { opacity: 0; transform: translateX(24px); }
    to { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
    .mv-tool .mv-summary {
        animation: none;
    }
}

.mv-summary__toggle {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-height: 56px;
    padding: 8px var(--mv-tool-pad);
    background: none;
    border: 0;
    border-radius: inherit;
    text-align: left;
    font-size: .9375rem;
    font-weight: 600;
    color: var(--mv-ink);
    cursor: pointer;
}

.mv-summary__toggle > i:first-child {
    color: var(--mv-red);
    font-size: 1.125rem;
}

.mv-summary__toggle-text {
    flex: 1 1 auto;
    min-width: 0;
}

.mv-summary__chev {
    flex: none;
    transition: transform .2s;
}

.mv-summary.is-open .mv-summary__chev {
    transform: rotate(180deg);
}

.mv-summary__body {
    display: none;
    padding: 0 var(--mv-tool-pad) var(--mv-tool-pad);
}

.mv-summary.is-open .mv-summary__body {
    display: block;
}

.mv .mv-summary__title {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    margin: 0;
}

.mv-summary__list {
    margin: 0 0 16px;
}

.mv-summary__row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 16px;
    padding: 10px 0;
    border-bottom: 1px dashed #D5DEE6;
    font-size: .875rem;
    line-height: 1.4;
}

.mv-summary__row[hidden] {
    display: none;
}

.mv-summary__row dt {
    font-weight: 500;
    color: var(--mv-slate);
}

.mv-summary__row dd {
    margin: 0;
    font-weight: 600;
    color: var(--mv-ink);
    text-align: right;
    overflow-wrap: anywhere;
}

.mv-summary__row dd.is-empty {
    font-weight: 400;
    font-style: italic;
    color: #8A949C;
}

.mv-summary__sub {
    display: block;
    font-weight: 400;
    font-size: .8125rem;
    color: var(--mv-slate);
}

/* Valor: "carimbo" pendente até o servidor responder */
.mv-summary__locked {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    column-gap: 12px;
    align-items: center;
    padding: 14px 16px;
    border: 1.5px dashed #C9D5DF;
    border-radius: var(--mv-radius);
    background: #FFF;
}

.mv-summary__locked i {
    grid-row: span 2;
    font-size: 1.375rem;
    color: #8A949C;
}

.mv .mv-summary__label {
    margin: 0 0 2px;
    font-size: .75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: var(--mv-slate);
    line-height: 1.3;
}

.mv .mv-summary__pending {
    margin: 0;
    font-size: .875rem;
    line-height: 1.4;
    color: var(--mv-slate);
}

.mv-summary__price {
    padding: 14px 16px;
    border: 1.5px solid var(--mv-red);
    border-radius: var(--mv-radius);
    background: #FFF;
}

.mv-summary__price[hidden],
.mv-summary__locked[hidden] {
    display: none;
}

.mv .mv-summary__eur {
    margin: 0;
    font-family: 'questa-slab', Georgia, serif;
    font-weight: 900;
    font-size: 1.75rem;
    line-height: 1.15;
    color: var(--mv-ink);
    font-variant-numeric: tabular-nums;
}

.mv .mv-summary__brl {
    margin: 4px 0 0;
    font-size: .875rem;
    line-height: 1.4;
    color: var(--mv-ink);
}

.mv-summary.has-price .mv-summary__price {
    animation: mv-price-in .45s ease-out both;
}

@keyframes mv-price-in {
    from { opacity: 0; transform: scale(.96); }
    to { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
    .mv-summary.has-price .mv-summary__price {
        animation: none;
    }
}

.mv-step[hidden] {
    display: none !important;
}

.mv-step__title {
    font-size: 1.375rem;
    line-height: 1.3;
    font-weight: 700;
    margin: 0 0 8px;
    color: var(--mv-ink);
}

.mv-step__title:focus {
    outline: none;
}

.mv .mv-step__desc {
    margin: 0 0 20px;
    font-size: .9375rem;
}

.mv-choices {
    display: grid;
    gap: 12px;
    margin-top: 20px;
}

.mv-choice {
    display: flex;
    align-items: center;
    gap: 14px;
    width: 100%;
    min-height: 64px;
    padding: 14px 18px;
    background: #FFF;
    border: 1px solid #D5DEE6;
    border-radius: var(--mv-radius);
    text-align: left;
    font-size: 1.0625rem;
    font-weight: 500;
    color: var(--mv-ink);
    cursor: pointer;
    transition: border-color .2s, background .2s;
}

.mv-choice i {
    font-size: 1.375rem;
    color: var(--mv-red);
    width: 28px;
    text-align: center;
}

.mv-choice:hover,
.mv-choice.is-selected {
    border-color: var(--mv-red);
    background: #FFFBFB;
}

/* Indicador de seleção (bolinha que vira check) */
.mv-choice {
    position: relative;
}

.mv-choice span {
    flex: 1 1 auto;
}

.mv-choice::after {
    content: "";
    flex: none;
    display: grid;
    place-items: center;
    width: 22px;
    height: 22px;
    border: 1.5px solid #C9D5DF;
    border-radius: 50%;
    background: #FFF;
    font-family: "Font Awesome 6 Pro";
    font-weight: 900;
    font-size: .6875rem;
    color: #FFF;
    transition: border-color .2s, background .2s;
}

.mv-choice:hover::after {
    border-color: var(--mv-red);
}

.mv-choice.is-selected {
    box-shadow: inset 0 0 0 1px var(--mv-red);
}

.mv-choice.is-selected::after {
    content: "\f00c";
    background: var(--mv-red);
    border-color: var(--mv-red);
}

.mv .mv-hint {
    margin: 16px 0 0;
    font-size: .9375rem;
}

/* Campos */
.mv-field {
    margin: 0 0 18px;
    min-width: 0;
    border: 0;
    padding: 0;
}

.mv-field label,
.mv-label {
    display: block;
    font-size: .9375rem;
    font-weight: 500;
    line-height: 1.4;
    color: var(--mv-ink);
    margin: 0 0 6px;
    padding: 0;
    float: none;
    width: auto;
}

.mv-opt {
    font-weight: 400;
    color: var(--mv-slate);
}

.mv-field input[type="text"],
.mv-field input[type="email"],
.mv-field input[type="tel"],
.mv-field select {
    display: block;
    width: 100%;
    height: 52px;
    padding: 0 16px;
    font-size: 1rem;
    font-family: inherit;
    color: var(--mv-ink);
    background: #FFF;
    border: 1px solid #C9D5DF;
    border-radius: 6px;
    -webkit-appearance: none;
    appearance: none;
}

.mv-field input::placeholder {
    color: #9AA5AE;
}

.mv-field input:focus,
.mv-field select:focus {
    border-color: var(--mv-focus);
    box-shadow: 0 0 0 3px rgba(26, 95, 180, .2);
    outline: none;
}

.mv-select {
    position: relative;
}

.mv-select::after {
    content: "\f107";
    font-family: "Font Awesome 6 Pro";
    font-weight: 300;
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    color: var(--mv-ink);
}

.mv-select select {
    padding-right: 40px;
    cursor: pointer;
}

.mv-field.has-error input,
.mv-field.has-error select {
    border-color: var(--mv-red);
}

.mv .mv-field__error {
    display: flex;
    gap: 6px;
    align-items: flex-start;
    color: #A61B27;
    font-size: .875rem;
    line-height: 1.4;
    margin: 6px 0 0;
    font-weight: 500;
}

.mv .mv-field__hint {
    font-size: .8125rem;
    line-height: 1.4;
    margin: 6px 0 0;
}

.mv-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0 16px;
}

.mv-field .iti {
    width: 100%;
    display: block;
}

.mv-field .iti input[type="tel"] {
    padding-left: 92px !important;
}

/* Segmentado (radios e checkboxes como botões) */
.mv-seg {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.mv-seg label {
    position: relative;
    margin: 0;
    flex: 1 1 auto;
}

.mv-seg input {
    position: absolute;
    opacity: 0;
    width: 1px;
    height: 1px;
}

.mv-seg span {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    min-height: 48px;
    padding: 10px 16px;
    border: 1px solid #C9D5DF;
    border-radius: 6px;
    background: #FFF;
    font-weight: 500;
    font-size: .9375rem;
    line-height: 1.3;
    text-align: left;
    cursor: pointer;
    transition: border-color .2s, background .2s;
}

/* Indicador: círculo para escolha única, quadrado para múltipla */
.mv-seg span::before {
    content: "";
    flex: none;
    display: grid;
    place-items: center;
    width: 18px;
    height: 18px;
    border: 1.5px solid #AEBBC6;
    border-radius: 50%;
    background: #FFF;
    font-family: "Font Awesome 6 Pro";
    font-weight: 900;
    font-size: .625rem;
    color: #FFF;
}

.mv-seg input[type="checkbox"] + span::before {
    border-radius: 4px;
}

.mv-seg input[type="radio"]:checked + span::before {
    border-color: var(--mv-red);
    box-shadow: inset 0 0 0 4px #FFF;
    background: var(--mv-red);
}

.mv-seg input[type="checkbox"]:checked + span::before {
    content: "\f00c";
    border-color: var(--mv-red);
    background: var(--mv-red);
}

.mv-seg label:hover span {
    border-color: var(--mv-red);
}

.mv-seg input:checked + span {
    border-color: var(--mv-red);
    background: var(--mv-rose);
    color: var(--mv-wine);
    box-shadow: inset 0 0 0 1px var(--mv-red);
}

.mv-seg input:focus-visible + span {
    outline: 3px solid var(--mv-focus);
    outline-offset: 2px;
}

.mv-seg--wrap {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}

.mv-seg--stack {
    flex-direction: column;
}

.mv-field.has-error .mv-seg span {
    border-color: var(--mv-red);
}

/* Checkbox LGPD */
.mv-check {
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr);
    column-gap: 12px;
    align-items: start;
}

.mv-check input {
    width: 22px;
    height: 22px;
    margin-top: 1px;
    accent-color: var(--mv-red);
    cursor: pointer;
}

.mv-check label {
    font-weight: 400;
    font-size: .875rem;
    line-height: 1.5;
    color: var(--mv-slate);
    margin: 0;
    cursor: pointer;
}

.mv-check label a {
    color: var(--mv-ink);
    text-decoration: underline;
    font-weight: 500;
}

.mv-check .mv-field__error {
    grid-column: 2;
}

/* Honeypot */
.mv-hp {
    position: absolute !important;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

/* Avisos */
.mv .mv-notice {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    background: var(--mv-paper);
    border: 1px solid var(--mv-mist);
    border-radius: 6px;
    padding: 12px 14px;
    font-size: .9375rem;
    line-height: 1.5;
    color: var(--mv-ink);
    margin: 0 0 18px;
}

.mv-notice i {
    color: var(--mv-focus);
    margin-top: 3px;
}

.mv .mv-notice--warn {
    background: #FFF8E6;
    border-color: #F2D48A;
}

.mv-notice--warn i {
    color: #9A6700;
}

.mv .mv-form-error {
    background: #FDECEE;
    border: 1px solid #F1C5C9;
    color: #A61B27;
    border-radius: 6px;
    padding: 12px 14px;
    font-size: .9375rem;
    line-height: 1.5;
    margin: 0 0 18px;
}

.mv .mv-form-error a {
    color: #A61B27;
    text-decoration: underline;
    font-weight: 600;
}

/* Ações do wizard */
/* Rodapé do card: sempre no fim da coluna do formulário, de borda a borda */
.mv-actions {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: auto calc(-1 * var(--mv-tool-pad)) calc(-1 * var(--mv-tool-pad));
    padding: 40px var(--mv-tool-pad) 16px;
}

/* a borda fica a 24px do conteúdo mesmo quando o rodapé é empurrado para baixo */
.mv-actions::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 24px;
    border-top: 1px solid var(--mv-mist);
}

.mv-actions .mv-btn {
    flex: 1 1 180px;
    max-width: none;
}

.mv-back,
.mv-skip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 48px;
    padding: 0 8px;
    background: none;
    border: 0;
    color: var(--mv-slate);
    font-weight: 600;
    font-size: .9375rem;
    cursor: pointer;
    border-radius: 4px;
}

.mv-back:hover,
.mv-skip:hover {
    color: var(--mv-red);
}

.mv-skip {
    text-decoration: underline;
    text-underline-offset: 3px;
    color: var(--mv-ink);
}

.mv-actions--skip .mv-btn {
    order: 3;
    flex-basis: 100%;
}

.mv-btn.is-loading {
    pointer-events: none;
    opacity: .75;
}

.mv-btn.is-loading::before {
    content: "";
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255, 255, 255, .5);
    border-top-color: #FFF;
    border-radius: 50%;
    animation: mv-spin .8s linear infinite;
}

@keyframes mv-spin {
    to { transform: rotate(360deg); }
}

/* Árvore (caminho completo) */
.mv-tree {
    position: relative;
}

.mv-tree__node {
    position: relative;
    margin: 0 0 14px;
    padding: 16px 16px 2px 16px;
    border: 1px solid var(--mv-mist);
    border-radius: var(--mv-radius);
    background: var(--mv-paper);
    min-width: 0;
}

.mv-tree__node + .mv-tree__node::before,
.mv-tree__gens .mv-tree__node::before,
.mv-tree__node--you::before {
    content: "";
    position: absolute;
    left: 28px;
    top: -15px;
    height: 14px;
    border-left: 2px solid #C9D5DF;
}

/* só o título do nó (os campos dentro do nó "Você" têm legend própria) */
.mv-tree__node > legend,
.mv-tree__child > legend {
    float: left;
    width: 100%;
    font-size: .8125rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--mv-slate);
    margin: 0 0 10px;
    padding: 0;
    line-height: 1.3;
}

.mv-tree__node > legend + *,
.mv-tree__child > legend + * {
    clear: both;
}

.mv-tree__node--root {
    background: #FFF;
    border-color: #F1C5C9;
    border-left: 4px solid var(--mv-red);
}

.mv-tree__node--root > legend {
    color: var(--mv-red);
}

.mv .mv-tree__link {
    font-size: .875rem;
    line-height: 1.4;
    margin: -4px 0 10px;
    clear: both;
}

.mv-tree__node--you {
    background: #FFF;
}

.mv-tree__node > legend.mv-tree__you {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 1rem;
    font-weight: 700;
    text-transform: none;
    letter-spacing: 0;
    color: var(--mv-ink);
    margin-bottom: 14px;
}

/* escolhas na mesma altura dos inputs ao lado */
.mv-tree__node--you .mv-seg span {
    min-height: 52px;
}

/* Filhos: um bloco por filho, pendurado em "Você" */
.mv-tree__children {
    display: grid;
    gap: 12px;
}

.mv-tree__children:not(:empty) {
    margin-bottom: 16px;
}

.mv-tree__child {
    min-width: 0;
    margin: 0;
    padding: 14px 14px 0;
    border: 1px solid var(--mv-mist);
    border-left: 3px solid #C9D5DF;
    border-radius: 6px;
    background: var(--mv-paper);
}

/* blocos aninhados (filhos de irmão, netos) alternam o fundo para a hierarquia ficar legível */
.mv-tree__child .mv-tree__child {
    background: #FFF;
}

.mv-tree__child .mv-tree__child .mv-tree__child {
    background: var(--mv-paper);
}

/* Quantidade (1 a 5): só o número, sem bolinha */
.mv-seg--num {
    flex-wrap: nowrap;
}

.mv-seg--num label {
    flex: 1 1 0;
    min-width: 0;
}

.mv-seg--num span {
    justify-content: center;
    padding: 10px 4px;
    font-variant-numeric: tabular-nums;
}

.mv-seg--num span::before {
    display: none;
}

@media (min-width: 576px) {
    .mv-seg--num {
        max-width: 340px;
    }
}

.mv-tree__you i {
    color: var(--mv-red);
}

/* Aberturas condicionais (perguntas e blocos que aparecem conforme a resposta).
   Reaparecer de display:none reinicia a animação; o reduced-motion global da página zera. */
.mv-reveal:not([hidden]) {
    animation: mv-reveal .25s ease-out backwards; /* backwards: depois de abrir, a opacidade volta a ser do CSS (ex.: bloco desmarcado) */
}

@keyframes mv-reveal {
    from { opacity: 0; transform: translateY(-6px); }
    to { opacity: 1; transform: none; }
}

/* Bootstrap 5.3 pinta o foco do .btn com --bs-btn-hover-bg, que o .btn-red do site não define (botão ficava transparente) */
.mv .btn-red:focus-visible {
    background: var(--mv-wine);
    border-color: var(--mv-wine);
    color: #FFF;
}

/* Confirmação dos dados das pessoas (dialog nativo, na camada do topo) */
.mv-confirm {
    width: min(440px, calc(100vw - 32px));
    max-width: none;
    padding: 28px 24px 24px;
    border: 0;
    border-radius: 12px;
    background: #FFF;
    color: var(--mv-ink);
    box-shadow: 0 24px 60px rgba(0, 0, 0, .3);
    text-align: center;
}

.mv-confirm::backdrop {
    background: rgba(30, 12, 14, .6);
}

.mv-confirm[open] {
    animation: mv-reveal .2s ease-out both;
}

.mv-confirm__icon {
    display: block;
    margin: 0 auto 14px;
    font-size: 2rem;
    color: var(--mv-red);
}

.mv .mv-confirm__text {
    margin: 0 0 24px;
    font-size: 1rem;
    line-height: 1.55;
    color: var(--mv-ink);
    text-wrap: pretty;
}

.mv-confirm__actions {
    display: flex;
    flex-wrap: wrap-reverse;
    gap: 12px;
}

.mv-confirm__actions > * {
    flex: 1 1 150px;
}

.mv .mv-confirm .mv-btn {
    max-width: none;
}

.mv-confirm__review {
    min-height: 52px;
    padding: 0 20px;
    border: 1px solid #C9D5DF;
    border-radius: 6px;
    background: #FFF;
    font-weight: 600;
    font-size: .9375rem;
    text-transform: uppercase;
    color: var(--mv-ink);
    cursor: pointer;
}

.mv-confirm__review:hover {
    border-color: var(--mv-red);
    color: var(--mv-red);
}

@media (prefers-reduced-motion: reduce) {
    .mv-confirm[open] {
        animation: none;
    }
}

/* "Não sei" em "Quem nasceu na Itália?": bloco de mensagem (cabe texto e, no futuro, um botão) */
.mv-unknown {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    margin: -4px 0 16px;
    padding: 14px 16px;
    border: 1px solid #F1D5D8;
    border-left: 4px solid var(--mv-red);
    border-radius: 6px;
    background: #FDF4F5;
}

.mv-unknown[hidden] {
    display: none;
}

.mv-unknown__icon {
    flex: none;
    margin-top: 3px;
    font-size: 1.125rem;
    color: var(--mv-red);
}

.mv-unknown__body {
    min-width: 0;
}

.mv .mv-unknown__text {
    margin: 0;
    font-size: .9375rem;
    line-height: 1.5;
    color: var(--mv-ink);
}

/* Agradecimento do "Quero contratar" (mesmo dialog da confirmação, com fechar em ×) */
/* sem position aqui: o dialog modal já é fixed (e serve de referência para o ×) */
.mv-thanks {
    padding: 32px 28px 28px;
}

.mv-thanks__close {
    position: absolute;
    top: 10px;
    right: 10px;
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    padding: 0;
    border: 0;
    border-radius: 8px;
    background: none;
    color: var(--mv-slate);
    font-size: 1.25rem;
    cursor: pointer;
}

.mv-thanks__close:hover {
    background: var(--mv-mist);
    color: var(--mv-ink);
}

.mv .mv-thanks__title {
    margin: 4px 24px 10px;
    font-size: 1.375rem;
    font-weight: 700;
    line-height: 1.3;
    color: var(--mv-ink);
}

.mv-thanks .mv-confirm__text {
    margin-bottom: 0;
}

/* Tela "Participantes": árvore montada, só leitura */
.mv-lineage {
    list-style: none;
    margin: 8px 0 24px;
    padding: 0;
}

.mv-lineage__item {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 16px;
    padding: 10px 14px;
    border: 1px solid var(--mv-mist);
    border-radius: var(--mv-radius);
    background: var(--mv-paper);
}

.mv-lineage__item + .mv-lineage__item {
    margin-top: 10px;
}

/* linha da árvore entre os nós */
.mv-lineage__item + .mv-lineage__item::before {
    content: "";
    position: absolute;
    left: 24px;
    top: -11px;
    height: 10px;
    border-left: 2px solid #C9D5DF;
}

.mv-lineage__text {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1 1 160px;
}

.mv-lineage__kin {
    font-size: .75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    line-height: 1.3;
    color: var(--mv-slate);
}

.mv-lineage__name {
    font-weight: 600;
    color: var(--mv-ink);
    line-height: 1.35;
    overflow-wrap: anywhere;
}

/* você e seus filhos: participantes fixos */
.mv-lineage__item.is-fixed {
    background: #FFF;
    border-color: #CFE6D8;
}


.mv-lineage__item.is-child {
    margin-left: 24px;
}

.mv-lineage__item.is-child::before {
    left: 0;
}

/* netos: um nível abaixo do filho */
.mv-lineage__item.is-grandchild {
    margin-left: 48px;
}

/* pai ou mãe: a pergunta "Participante?" fica no próprio nó */
.mv-lineage__item.has-ask {
    background: #FFF;
    border-color: #F1C5C9;
    border-left: 4px solid var(--mv-red);
}

.mv-lineage__item.has-ask::before {
    left: 21px;
}

.mv-lineage__ask {
    flex: 1 1 220px;
    margin: 0;
}

.mv-lineage__ask .mv-label {
    font-size: .875rem;
    margin-bottom: 4px;
}

.mv-lineage__ask .mv-seg span {
    min-height: 44px;
}

/* Lápis: editar o nome no lugar (grava no campo original da árvore) */
.mv-lineage__row {
    display: flex;
    align-items: center;
    gap: 4px;
    min-width: 0;
}

.mv-lineage__edit {
    flex: none;
    display: inline-grid;
    place-items: center;
    width: 32px;
    height: 32px;
    margin: -6px 0;
    padding: 0;
    border: 0;
    border-radius: 6px;
    background: none;
    color: var(--mv-slate);
    font-size: .875rem;
    cursor: pointer;
}

.mv-lineage__edit:hover {
    background: var(--mv-mist);
    color: var(--mv-red);
}

.mv-lineage__edit[hidden],
.mv-lineage__name[hidden] {
    display: none;
}

.mv-lineage__input {
    width: 100%;
    min-width: 0;
    height: 36px;
    margin: 2px 0;
    padding: 0 10px;
    border: 1px solid var(--mv-focus);
    border-radius: 6px;
    box-shadow: 0 0 0 3px rgba(26, 95, 180, .2);
    font: inherit;
    font-weight: 600;
    color: var(--mv-ink);
}

.mv-lineage__input:focus {
    outline: none;
}

/* Toggle de participação: "Participa" + caixa (o controle inteiro é clicável) */
.mv-part {
    flex: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
    padding: 6px 8px;
    border: 0;
    border-radius: 6px;
    background: none;
    font-size: .8125rem;
    font-weight: 600;
    line-height: 1;
    color: var(--mv-slate);
    cursor: pointer;
    transition: background .15s, color .15s;
}

.mv-part:hover {
    background: var(--mv-mist);
}

.mv-part__box {
    display: inline-grid;
    place-items: center;
    width: 20px;
    height: 20px;
    border: 1.5px solid #AEBBC6;
    border-radius: 5px;
    background: #FFF;
    color: transparent;
    font-size: .6875rem;
    transition: background .15s, border-color .15s;
}

.mv-part:hover .mv-part__box {
    border-color: var(--mv-green);
}

.mv-part[aria-checked="true"] {
    color: var(--mv-ink);
}

.mv-part[aria-checked="true"] .mv-part__box,
.mv-part--fixed .mv-part__box {
    background: var(--mv-green);
    border-color: var(--mv-green);
    color: #FFF;
}

/* "Você": só a caixa marcada, sem clique, na mesma posição das outras */
.mv-part--fixed {
    cursor: default;
}

.mv-part--fixed:hover {
    background: none;
}

/* nó desmarcado na árvore: cinza, como avós e antenato */
.mv-lineage__item.is-out {
    background: var(--mv-paper);
    border-color: var(--mv-mist);
}

.mv-lineage__item.is-out .mv-lineage__name {
    color: var(--mv-slate);
    font-weight: 500;
}

/* toggle no cabeçalho dos blocos de irmão, sobrinho e sobrinho-neto */
.mv-tree__child {
    position: relative;
}

.mv-part--block {
    position: absolute;
    top: 6px;
    right: 6px;
}

/* o toggle fica entre a legend (float) e os campos: quem vem depois dele limpa o float */
.mv-tree__child > .mv-part--block + * {
    clear: both;
}

/* bloco desmarcado: esmaecido, mas editável (os campos continuam obrigatórios); blocos internos seguem o próprio estado */
.mv .mv-tree__child[data-participa="0"] {
    border-style: dashed;
    background: #F1F3F5;
}

.mv-tree__child[data-participa="0"] > legend,
.mv-tree__child[data-participa="0"] > .mv-row,
.mv-tree__child[data-participa="0"] > .mv-field,
.mv-tree__child[data-participa="0"] > [data-kid="more"] > .mv-field {
    opacity: .55;
}

/* Convite discreto para compartilhar com outros parentes */
.mv-share {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px 16px;
    margin: 8px 0 0;
    padding: 12px 16px;
    border: 1px dashed #C9D5DF;
    border-radius: var(--mv-radius);
}

.mv .mv-share__text {
    margin: 0;
    font-size: .9375rem;
    line-height: 1.4;
    color: var(--mv-slate);
}

.mv-share__btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 44px;
    padding: 0 16px;
    border: 1px solid #C9D5DF;
    border-radius: 6px;
    background: #FFF;
    font-weight: 600;
    font-size: .9375rem;
    color: var(--mv-ink);
    cursor: pointer;
    transition: border-color .2s, color .2s;
}

.mv-share__btn i {
    color: var(--mv-red);
}

.mv-share__btn:hover {
    border-color: var(--mv-red);
    color: var(--mv-red);
}

@media (min-width: 768px) {
    .mv-lineage__ask {
        flex: 0 1 280px;
        margin-left: auto;
    }
}

/* Resultado — comprovante */
.mv-receipt__special {
    padding: 8px 0 4px;
}

.mv .mv-receipt__special-text {
    margin: 0;
    font-size: 1.0625rem;
    line-height: 1.55;
    color: var(--mv-ink);
}

.mv-summary__value[hidden] {
    display: none;
}

.mv-receipt {
    position: relative;
}

.mv .mv-receipt__stamp {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--mv-red);
    border: 1.5px dashed var(--mv-red);
    border-radius: 4px;
    padding: 2px 4px 2px 10px;
    margin: 0 0 16px;
    line-height: 1.4;
}

.mv .mv-receipt__stamp[hidden] {
    display: none;
}

/* número da simulação: monoespaçado, fácil de ler e de selecionar */
.mv-receipt__code {
    font-family: SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
    font-weight: 700;
    font-size: .875rem;
    letter-spacing: .03em;
    user-select: all;
}

.mv-receipt__copy {
    display: inline-grid;
    place-items: center;
    width: 30px;
    height: 30px;
    padding: 0;
    border: 0;
    border-radius: 4px;
    background: none;
    color: var(--mv-red);
    font-size: .875rem;
    cursor: pointer;
}

.mv-receipt__copy:hover {
    background: var(--mv-rose);
}

.mv .mv-receipt__summary {
    margin: 0 0 20px;
    color: var(--mv-ink);
}

.mv-receipt__total {
    background: var(--mv-paper);
    border: 1px solid var(--mv-mist);
    border-radius: var(--mv-radius);
    padding: 20px;
    margin-bottom: 20px;
    position: relative;
}

.mv .mv-receipt__label {
    font-size: .8125rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--mv-slate);
    margin: 0 0 6px;
    line-height: 1.3;
}

.mv .mv-receipt__eur {
    font-family: 'questa-slab', Georgia, serif;
    font-weight: 900;
    font-size: 2.5rem;
    line-height: 1.1;
    color: var(--mv-ink);
    margin: 0 0 6px;
    font-variant-numeric: tabular-nums;
}

.mv .mv-receipt__brl {
    margin: 0 0 8px;
    color: var(--mv-ink);
}

.mv .mv-receipt__note {
    font-size: .8125rem;
    line-height: 1.5;
    margin: 0;
}

.mv-receipt__include ul {
    list-style: none;
    padding: 0;
    margin: 0 0 20px;
}

.mv-receipt__include li {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    font-size: .9375rem;
    line-height: 1.5;
    padding: 5px 0;
}

.mv-receipt__include i {
    color: var(--mv-green);
    margin-top: 4px;
}

.mv-receipt__include li.is-excluded i {
    color: var(--mv-red);
}

.mv-receipt__offer {
    background: var(--mv-paper);
    border: 1px solid var(--mv-mist);
    border-left: 4px solid var(--mv-focus);
    border-radius: 6px;
    padding: 14px 16px;
    margin: 0 0 18px;
}

.mv .mv-receipt__offer p:last-child {
    margin: 0;
    font-size: .9375rem;
}

.mv-receipt__actions {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.mv-receipt__actions .mv-btn {
    max-width: none;
}

.mv-receipt__actions .is-primary {
    background: var(--mv-red);
    color: #FFF;
    border: 1px solid var(--mv-red);
}

.mv-receipt__actions .is-primary:hover {
    background: var(--mv-wine);
    color: #FFF;
}

.mv-receipt__actions .is-secondary {
    background: #FFF;
    color: var(--mv-ink);
    border: 1px solid #D5DEE6;
}

.mv-receipt__actions .is-secondary:hover {
    border-color: #00AA4E;
    color: var(--mv-ink);
}

.mv-receipt__actions .is-primary i,
.mv-receipt__actions .is-secondary i {
    font-size: 1.25rem;
}

.mv-receipt__actions .is-secondary i {
    color: #00AA4E;
}

/* ---------- 5. Quem está por trás ---------- */
/* vem logo após "Como funciona" (paper, quase branco): a borda separa as duas */
.mv-who {
    background: #FFF;
    border-top: 1px solid var(--mv-mist);
}

.mv-duo {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--mv-gap-cards);
    max-width: 1040px;
    margin: 0 auto;
    container-type: inline-size;
}

.mv-person {
    display: flex;
    flex-direction: column;
    background: #FFF;
    border: 1px solid var(--mv-mist);
    border-radius: 12px;
    overflow: hidden;
    box-shadow: var(--mv-shadow);
}

.mv-person__media {
    position: relative;
    aspect-ratio: 3 / 2;
    background: var(--mv-paper);
    overflow: hidden;
}

.mv-person__media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Ferrara: painel de marca (vinho + foto do escritório como textura + logo branco) */
.mv-person__media--brand {
    background: var(--mv-wine);
    display: flex;
    align-items: center;
    justify-content: center;
}

.mv-person__media--brand picture {
    position: absolute;
    inset: 0;
}

.mv-person__media--brand .mv-person__texture {
    filter: grayscale(1) contrast(1.1);
    mix-blend-mode: luminosity;
    opacity: .5;
}

.mv-person__media--brand::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(160deg, rgba(145, 27, 35, .45) 0%, rgba(120, 23, 29, .85) 100%);
}

.mv-person__media--brand .mv-person__logo {
    position: relative;
    z-index: 1;
    width: 62%;
    max-width: 300px;
    height: auto;
    object-fit: contain;
    filter: brightness(0) invert(1);
}

/* Riccardo: mesma ideia do painel da Ferrara (foto + overlay + logo branco),
   mas o rosto fica no alto da foto: o degradê escurece só a base e a logo assenta ali */
.mv-person__media--portrait::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(43, 31, 25, .2) 0%, rgba(43, 31, 25, .32) 42%, rgba(43, 31, 25, .9) 100%);
}

.mv-person__media--portrait .mv-person__logo {
    position: absolute;
    z-index: 1;
    left: 50%;
    top: 69%;
    transform: translate(-50%, -50%);
    width: 70%;
    max-width: 340px;
    height: auto;
    filter: brightness(0) invert(1) drop-shadow(0 2px 10px rgba(0, 0, 0, .35));
}

.mv-person__place {
    position: absolute;
    left: 16px;
    bottom: 16px;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(255, 255, 255, .94);
    color: var(--mv-ink);
    font-size: .8125rem;
    font-weight: 600;
    border-radius: 999px;
    padding: 5px 12px;
    line-height: 1.3;
}

.mv-person__place i {
    color: var(--mv-red);
}

.mv-person__body {
    padding: var(--mv-pad-card);
    flex: 1;
}

.mv .mv-person__role {
    font-family: 'questa-slab', Georgia, serif;
    font-weight: 700;
    font-size: .875rem;
    text-transform: uppercase;
    letter-spacing: .03em;
    color: var(--mv-red);
    margin: 0 0 12px;
    line-height: 1.4;
}

.mv .mv-person__body p:last-child {
    margin-bottom: 0;
}

.mv .mv-person__body p + p {
    margin-top: 12px;
}

/* Conector "+" entre os dois */
.mv-duo__plus {
    position: relative;
    z-index: 2;
    width: 52px;
    height: 52px;
    margin: calc(-26px - var(--mv-gap-cards) / 2) auto;
    border-radius: 50%;
    background: var(--mv-red);
    color: #FFF;
    border: 4px solid #FFF;
    box-shadow: 0 6px 18px rgba(145, 27, 35, .3);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.125rem;
}

/* ---------- 7. O que não é ---------- */
.mv-clear {
    background: var(--mv-mist);
}

.mv-isnt {
    list-style: none;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
    max-width: 920px;
    margin: 0 auto;
    padding: 0;
}

.mv-isnt li {
    display: flex;
    align-items: center;
    gap: 14px;
    background: #FFF;
    border: 1px solid #D5DEE6;
    border-radius: 12px;
    padding: 18px 20px;
    font-size: 1rem;
    line-height: 1.5;
    color: var(--mv-ink);
}

.mv-isnt li i {
    flex: none;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #FDF4F5;
    color: var(--mv-red);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
}

.mv .mv-accent {
    color: var(--mv-red);
}

.mv-clear .mv-cta--center {
    margin-top: var(--mv-space-cta);
}

/* ---------- 8. FAQ ---------- */
.mv-faq {
    background: #FFF;
}

.mv-faq__group {
    font-family: 'questa-slab', Georgia, serif;
    font-weight: 900;
    font-size: .9375rem;
    letter-spacing: .03em;
    text-transform: uppercase;
    color: var(--mv-red);
    margin: clamp(36px, 28px + 1.6vw, 52px) 0 16px;
}

.mv-faq .mv-h2 + .mv-faq__group {
    margin-top: 0;
}

.mv-accordion .accordion-item {
    border: 1px solid var(--mv-mist);
    border-radius: 6px !important;
    margin-bottom: 10px;
    overflow: hidden;
}

.mv-accordion .accordion-header {
    margin: 0;
}

.mv-accordion .accordion-button {
    font-size: 1rem;
    line-height: 1.4;
    padding: clamp(16px, 13px + .6vw, 22px) clamp(18px, 14px + .8vw, 26px);
    font-weight: 500;
    color: var(--mv-ink);
    background: var(--mv-paper);
    box-shadow: none;
}

.mv-accordion .accordion-button:not(.collapsed) {
    color: var(--mv-wine);
    background: #FFF;
}

.mv-accordion .accordion-button:focus-visible {
    outline: 3px solid var(--mv-focus);
    outline-offset: -3px;
    box-shadow: none;
}

.mv-accordion .accordion-body {
    padding: 4px clamp(18px, 14px + .8vw, 26px) clamp(18px, 14px + .8vw, 26px);
}

.mv-accordion .accordion-body p {
    max-width: 70ch;
}

.mv-accordion .accordion-body p {
    margin: 0;
    font-size: .9375rem;
    line-height: 1.65;
}

/* respostas com mais de um parágrafo e o botão de compartilhar */
.mv-accordion .accordion-body p + p,
.mv-accordion .accordion-body p + .mv-share__btn {
    margin-top: 12px;
}

/* ---------- 9. CTA final ---------- */
.mv-final {
    background: var(--mv-wine);
    background-image: radial-gradient(900px 300px at 50% 120%, rgba(255, 255, 255, .08), transparent 60%);
}

.mv-final .mv-center {
    margin-bottom: 0;
}

.mv-final__actions {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    margin-top: var(--mv-space-cta);
}

/* ---------- CTA fixo (mobile) ---------- */
.mv-sticky {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 999;
    display: flex;
    gap: 10px;
    padding: 10px 16px calc(10px + env(safe-area-inset-bottom));
    background: rgba(255, 255, 255, .97);
    border-top: 1px solid var(--mv-mist);
    box-shadow: 0 -6px 20px rgba(54, 61, 77, .1);
    transform: translateY(0);
    opacity: 1;
    transition: transform .3s ease, opacity .3s ease, visibility 0s linear 0s;
}

.mv-sticky.is-hidden {
    transform: translateY(110%);
    opacity: 0;
    visibility: hidden;
    transition: transform .3s ease, opacity .3s ease, visibility 0s linear .3s;
}

.mv-sticky__main {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 50px;
    background: var(--mv-red);
    color: #FFF;
    font-weight: 600;
    text-transform: uppercase;
    font-size: .9375rem;
    border-radius: 6px;
}

.mv-sticky__main:hover,
.mv-sticky__main:focus {
    color: #FFF;
    background: var(--mv-wine);
}

.mv-sticky__wa {
    flex: 0 0 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #00AA4E;
    color: #FFF;
    border-radius: 6px;
    font-size: 1.625rem;
}

.mv-sticky__wa:hover,
.mv-sticky__wa:focus {
    color: #FFF;
    background: #039344;
}

/* Na página, o botão flutuante do site dá lugar ao CTA fixo no mobile */
@media (max-width: 991px) {
    body:has(.mv) #whatsapp {
        display: none;
    }

    body.mv-sticky-on {
        padding-bottom: calc(72px + env(safe-area-inset-bottom));
    }

    body.mv-sticky-on .cookies_alert {
        bottom: 84px;
    }

    /* Botões do header ocupam a coluna toda, alinhados às bordas do vídeo */
    .mv-hero .mv-btn {
        width: 100%;
        max-width: none;
    }
}

/* =========================================================
   >= 576px
   ========================================================= */
@media (min-width: 576px) {
    .mv-cta--center .mv-btn {
        width: auto;
        min-width: 360px;
        max-width: 100%;
    }

    .mv-tool {
        --mv-tool-pad: 32px;
    }

    .mv-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .mv-field--year {
        max-width: none;
    }

    .mv-receipt__actions {
        flex-direction: row;
    }

    .mv-receipt__actions .mv-btn {
        flex: 1;
    }

    .mv-final__actions {
        flex-direction: row;
        justify-content: center;
    }

    .mv-final__actions .mv-btn {
        width: auto;
        min-width: 260px;
    }
}

/* =========================================================
   >= 768px
   ========================================================= */
@media (min-width: 768px) {
    .mv-isnt {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 16px;
    }

    .mv-shift {
        grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
        align-items: stretch;
        gap: clamp(12px, 4px + 1.2vw, 20px);
    }

    .mv-shift__turn {
        flex-direction: column;
        align-self: center;
        text-align: center;
    }

    .mv-shift__arrow {
        width: 52px;
        height: 52px;
    }

    .mv-shift__arrow i {
        transform: none;
    }

    .mv-status {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    }

    .mv-status__item {
        padding: 20px 28px;
    }

    .mv-status__item--next {
        border-top: 0;
        border-left: 1px solid #D5DEE6;
    }

    /* chevron entre os dois passos */
    .mv-status__item--next::before {
        content: "";
        position: absolute;
        left: -8px;
        top: 50%;
        width: 14px;
        height: 14px;
        margin-top: -7px;
        background: #FFF;
        border-top: 1px solid #D5DEE6;
        border-right: 1px solid #D5DEE6;
        transform: rotate(45deg);
    }

    .mv-h1 {
        font-size: 2.75rem;
    }

    .mv-lead {
        font-size: 1.0625rem !important;
        line-height: 1.6 !important;
    }

    .mv-h2 {
        font-size: 2.25rem;
    }

    /* uma coluna por opção (3 com "Não sei", 2 sem ela) */
    .mv-choices {
        grid-auto-flow: column;
        grid-auto-columns: minmax(0, 1fr);
    }

    .mv-choice {
        flex-direction: column;
        justify-content: center;
        text-align: center;
        min-height: 140px;
        padding: 20px 16px;
    }

    .mv-choice i {
        font-size: 1.75rem;
        width: auto;
    }

    .mv-choice span {
        flex: none;
    }

    .mv-choice::after {
        position: absolute;
        top: 12px;
        right: 12px;
    }

    /* Rodapé: Voltar à esquerda, ação principal à direita, com a mesma largura em todas as etapas */
    .mv-actions .mv-btn {
        flex: 0 0 auto;
        width: auto;
        min-width: 240px;
        margin-left: auto;
    }

    .mv-actions--skip .mv-btn {
        order: 0;
        margin-left: 0;
    }

    .mv-actions--skip .mv-skip {
        margin-left: auto;
    }

    .mv-duo {
        grid-template-columns: minmax(0, 1fr) 24px minmax(0, 1fr);
        gap: 0;
    }

    /* "+" na altura do meio das imagens (3:2) */
    .mv-duo__plus {
        margin: calc((100cqw - 24px) / 2 * 2 / 3 / 2 - 26px) -14px 0;
        align-self: start;
    }

    .mv-tool {
        --mv-tool-pad: 40px;
    }

    .mv-stepper {
        padding-left: 32px;
        padding-right: 32px;
    }
}

/* =========================================================
   >= 992px
   ========================================================= */
@media (min-width: 992px) {
    /* Simulador: formulário à esquerda, resumo à direita */
    .mv-tool {
        max-width: 1080px;
    }

    .mv-tool__body {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 320px;
        overflow-x: clip; /* o painel entra deslizando sem passar da borda do card (clip não quebra o sticky) */
    }

    .mv-summary {
        border-top: 0;
        border-left: 1px solid var(--mv-mist);
        border-radius: 0 0 12px 0;
        animation-name: mv-summary-slide;
        animation-duration: .4s;
    }

    /* Pergunta inicial: o formulário ocupa o card inteiro (a largura do card não muda) */
    .mv-tool.is-entry .mv-tool__body {
        grid-template-columns: minmax(0, 1fr);
    }

    .mv-summary__toggle {
        display: none;
    }

    /* acompanha a rolagem nas etapas longas (árvore completa) */
    .mv-summary__body,
    .mv-summary.is-open .mv-summary__body {
        display: block;
        position: sticky;
        top: 24px;
        padding: 24px 28px 28px;
    }

    .mv .mv-summary__title {
        position: static;
        width: auto;
        height: auto;
        overflow: visible;
        clip: auto;
        white-space: normal;
        margin: 0 0 4px;
        font-family: 'questa-slab', Georgia, serif;
        font-weight: 900;
        font-size: 1.25rem;
        line-height: 1.25;
        color: var(--mv-ink);
    }

    .mv-hero .mv-trust {
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        gap: 6px 18px;
    }

    .mv-what__grid {
        grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); /* 1fr/1fr a partir de 1200 */
        grid-template-rows: auto 1fr;
        grid-template-areas: "visual head" "visual body";
        column-gap: clamp(48px, 5vw, 88px);
        row-gap: 20px;
    }

    .mv-what__head {
        align-self: end;
    }

    .mv-what__visual {
        align-self: center;
        padding: 24px 0;
    }

    /* ~80% da coluna, até 430px (altura fica abaixo da coluna de texto) */
    .mv-doc {
        --mv-doc-w: min(88cqw, 500px);
    }

    .mv .mv-what__lead {
        font-size: 1.5rem;
        margin-bottom: 20px;
    }

    .mv-what .mv-btn {
        width: auto;
        padding-inline: 40px;
    }

    /* Ritmo interno do hero no desktop (mobile aprovado, não usa estes tokens) */
    .mv-hero {
        --mv-hero-h1-lead: 24px;      /* H1 → subheadline */
        --mv-hero-stack: 24px;        /* subheadline → vídeo → botões (+16px do anel de sombra) */
        --mv-hero-cta-trust: 18px;    /* botões → linha de credibilidade */
        padding: clamp(32px, 1vw + 20px, 40px) 0 var(--mv-space-section);
    }

    /* Desktop: coluna única centralizada (selo → H1 → lead → vídeo → botões) */
    .mv-hero__grid {
        grid-template-areas: "top" "video" "cta";
        justify-items: center;
        row-gap: var(--mv-hero-stack);
        text-align: center;
    }

    /* no desktop o bloco de baixo só tem o WhatsApp mobile, que fica oculto */
    .mv-hero__bottom,
    .mv-hero__cta--mobile {
        display: none;
    }

    .mv-hero__cta--desktop {
        display: flex;
        grid-area: cta;
    }

    .mv-hero .mv-h1 {
        font-size: 3.125rem; /* 50px no desktop */
        max-width: 38ch;
        margin-inline: auto;
        line-height: 1.1;
        text-wrap: balance;
        margin-bottom: var(--mv-hero-h1-lead);
    }

    .mv-hero .mv-lead {
        max-width: 1100px; /* 2 linhas em 1366/1440 */
        font-size: 1.125rem !important;
        margin-inline: auto;
        text-wrap: balance;
        margin-bottom: 0;
    }

    .mv-hero .mv-cta {
        align-items: center;
        gap: var(--mv-hero-cta-trust);
    }

    .mv-hero .mv-cta__row {
        justify-content: center;
    }

    /* degraus da sombra centrados: o padding reserva o espaço do anel externo */
    .mv-hero__video {
        width: 100%;
        max-width: 792px; /* vídeo de 760px + anel de 16px: em 1440×900 cabe inteiro na 1ª tela */
        padding: 16px;
    }

    .mv-video {
        box-shadow: 0 0 0 8px rgba(106, 142, 153, .11), 0 0 0 16px rgba(106, 142, 153, .08);
    }

    .mv-hero__wa--desktop {
        display: flex !important;
    }

    .mv-hero__wa--mobile {
        display: none !important;
    }

    /* Botões lado a lado, mesma altura; se não couberem, o segundo desce inteiro */
    .mv-cta__row .mv-btn {
        width: auto;
        min-width: 0;
        max-width: none;
        white-space: nowrap;
    }

    .mv-cta__row {
        gap: 14px;
    }

    .mv-h1 {
        font-size: 3.25rem;
        line-height: 1.1;
    }

    .mv-lead {
        font-size: 1.1875rem !important;
    }

    .mv-cta:not(.mv-cta--center) .mv-btn.btn-red {
        min-width: 260px;
    }

    .mv-h2 {
        font-size: 2.5rem;
    }

    .mv-text,
    .mv p.mv-text {
        font-size: 1.0625rem;
    }

    .mv-sticky {
        display: none;
    }
}

/* Etapas na horizontal só a partir de 1200px: abaixo disso as 4 colunas ficam estreitas
   (≈174px em 1024) e o texto quebra em 6 linhas com palavras sozinhas */
@media (min-width: 1200px) {
    .mv-what__grid {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    }

    .mv-steps {
        max-width: none;
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: var(--mv-gap-cards);
        position: relative;
    }

    .mv-steps::before {
        content: "";
        position: absolute;
        top: 21px;
        left: 12.5%;
        right: 12.5%;
        height: 2px;
        background: #D5DEE6;
    }

    .mv-steps__item {
        flex-direction: column;
        align-items: center;
        padding-bottom: 0;
        gap: 24px;
    }

    .mv-steps__item::before {
        display: none;
    }

    .mv-steps__body {
        width: 100%;
        text-align: center;
    }

}

@media (prefers-reduced-motion: reduce) {
    .mv *,
    .mv *::before,
    .mv *::after {
        transition: none !important;
        animation: none !important;
    }
}

/* Bandeira da Itália no fim do H1 do hero */
.mv-nowrap {
    white-space: nowrap;
}

.mv-flag-it {
    display: inline-block;
    width: .9em;
    height: .6em;
    margin-left: .3em;
    vertical-align: .05em;
    border-radius: 2px;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, .08);
}

/* Segunda linha do H1 do hero: chamada em destaque */
.mv-h1__accent {
    display: block;
    margin-top: .2em;
    color: var(--mv-red);
}

/* Quebra de linha só no desktop (H1 do hero quebra depois da vírgula) */
@media (max-width: 991.98px) {
    .mv-br-lg {
        display: none;
    }
}

/* Tooltip "!" (aviso de dados reais na etapa da árvore). A caixa ancora no parágrafo para nunca vazar da tela. */
.mv .mv-step__desc--tip {
    position: relative;
}

.mv-tip__btn {
    display: inline-flex;
    vertical-align: -2px;
    margin-left: 6px;
    padding: 2px;
    border: 0;
    background: none;
    color: var(--mv-red);
    font-size: 1.0625rem;
    line-height: 1;
    cursor: pointer;
}

.mv-tip__box {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(100% + 8px);
    z-index: 5;
    padding: 10px 14px;
    border-radius: 8px;
    background: #2B2F33;
    color: #FFF;
    font-size: .875rem;
    line-height: 1.5;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .18);
    opacity: 0;
    visibility: hidden;
    transition: opacity .15s ease, visibility .15s ease;
}

.mv-tip:hover .mv-tip__box,
.mv-tip__btn:focus-visible + .mv-tip__box,
.mv-tip.is-open .mv-tip__box {
    opacity: 1;
    visibility: visible;
}