/* =====================================================================
   BLACK 2026 | ISA PRA SEMPRE :: HERO (secao a8a8343) :: versao 2
   Carregado depois do post-11664.css. So mexe no fundo e no encaixe do HERO.
   Imagens usadas sem recorte, sem efeito e sem deformacao:
     hero-desktop.webp  3344x1882  -> desktop (>1024px) e tablet deitado
     hero-mobile.webp    774x2048  -> mobile (<768px) e tablet em pe
   Nunca "cover": largura 100%, altura proporcional (100% auto), ancorada no topo.
   Logo, titulo, texto, formulario e botao continuam HTML por cima da imagem.
   ===================================================================== */

.elementor-11664 .elementor-element.elementor-element-a8a8343:not(.elementor-motion-effects-element-type-background) {
    background-size: 100% auto !important;
    background-repeat: no-repeat !important;
    background-position: top center !important;
}

/* ---------- DESKTOP (acima de 1024px) ---------- */

@media (min-width: 1025px) {
    .elementor-11664 .elementor-element.elementor-element-a8a8343:not(.elementor-motion-effects-element-type-background) {
        background-image: url("hero/hero-desktop.webp") !important;
        background-color: #100a07 !important;
    }
    .elementor-11664 .elementor-element.elementor-element-a8a8343 {
        --min-height: calc(100vw * 1882 / 3344);
        /* altura = proporcao exata da arte */
        --padding-top: 2vw;
        --padding-bottom: 2vw;
    }
    .elementor-11664 .elementor-element.elementor-element-6bad79e {
        --width: 41%;
        /* texto fica na area escura da esquerda */
        --padding-top: 0px;
        --padding-bottom: 0px;
    }
    .elementor-11664 .elementor-element.elementor-element-85a83a8 {
        width: var( --container-widget-width, 61%);
        /* logo com o mesmo tamanho de antes */
        max-width: 61%;
        --container-widget-width: 61%;
    }
}

/* laptops estreitos: se o formulario passar da arte, a base funde no fundo sem corte seco */

@media (min-width: 1025px) and (max-width: 1279px) {
    .elementor-11664 .elementor-element.elementor-element-a8a8343:not(.elementor-motion-effects-element-type-background) {
        background-image: linear-gradient(to bottom, rgba(16, 10, 7, 0) calc(100vw * 1882 / 3344 - 90px), #100a07 calc(100vw * 1882 / 3344)), url("hero/hero-desktop.webp") !important;
        background-size: 100% auto, 100% auto !important;
    }
}

/* ---------- TABLET DEITADO (768 a 1024px, paisagem): arte horizontal ---------- */

@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
    .elementor-11664 .elementor-element.elementor-element-a8a8343:not(.elementor-motion-effects-element-type-background) {
        background-image: linear-gradient(to bottom, rgba(16, 10, 7, 0) calc(100vw * 1882 / 3344 - 90px), #100a07 calc(100vw * 1882 / 3344)), url("hero/hero-desktop.webp") !important;
        background-size: 100% auto, 100% auto !important;
        background-color: #100a07 !important;
    }
    .elementor-11664 .elementor-element.elementor-element-a8a8343 {
        --min-height: calc(100vw * 1882 / 3344);
        --flex-direction: row;
        --padding-top: 3vw;
        --padding-bottom: 3vw;
        --padding-left: 4vw;
        --padding-right: 4vw;
    }
    .elementor-11664 .elementor-element.elementor-element-6bad79e {
        --width: 44%;
        --gap: 18px 0px;
        --row-gap: 18px;
    }
    .elementor-11664 .elementor-element.elementor-element-85a83a8 img {
        width: 55%;
    }
}

/* ---------- TABLET EM PE e MOBILE: arte vertical ---------- */

@media (max-width: 1024px) and (orientation: portrait),
(max-width: 767px) {
    .elementor-11664 .elementor-element.elementor-element-a8a8343:not(.elementor-motion-effects-element-type-background) {
        background-image: url("hero/hero-mobile.webp") !important;
        background-color: #000000 !important;
        /* a arte termina em preto puro */
    }
    .elementor-11664 .elementor-element.elementor-element-a8a8343 {
        --min-height: 0px;
        /* a altura acompanha o conteudo, sem sobra preta */
    }
}

@media (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {
    .elementor-11664 .elementor-element.elementor-element-a8a8343 {
        --padding-top: 52vw;
        /* conteudo comeca abaixo do queixo, sobre o vestido */
        --padding-bottom: 6vw;
    }
}

/* ---------- MOBILE: tudo na primeira dobra ---------- */

@media (max-width: 767px) {
    .elementor-11664 .elementor-element.elementor-element-a8a8343 {
        --padding-top: 50vw;
        /* rosto e cabeca da Isa ficam livres */
        --padding-bottom: 8vw;
    }
    .elementor-11664 .elementor-element.elementor-element-6bad79e {
        --gap: 10px 0px;
        --row-gap: 10px;
    }
    .elementor-11664 .elementor-element.elementor-element-85a83a8 {
        margin-bottom: 0px !important;
    }
    .elementor-11664 ._form_21 ._form_element {
        margin-bottom: 8px;
    }
    .elementor-11664 ._form_21 .inputtext,
    .elementor-11664 .iti input {
        height: 46px !important;
        padding-top: 10px;
        padding-bottom: 10px;
    }
    .elementor-11664 ._form_21 .button {
        min-height: 56px;
        padding: 12px 20px;
    }
}

/* ---------- CELULARES BAIXOS (tela com ate 700px de altura, ex.: iPhone SE) ---------- */

@media (max-width: 767px) and (max-height: 700px) {
    .elementor-11664 .elementor-element.elementor-element-a8a8343 {
        --padding-top: 44vw;
        --padding-bottom: 6vw;
    }
    .elementor-11664 .elementor-element.elementor-element-a49a6a4 .elementor-heading-title {
        line-height: 1.22;
    }
    .elementor-11664 .elementor-element.elementor-element-0ab7275 p {
        line-height: 1.45;
    }
    .elementor-11664 ._form_21 .inputtext,
    .elementor-11664 .iti input {
        height: 42px !important;
    }
    .elementor-11664 ._form_21 .button {
        min-height: 50px;
        padding: 10px 20px;
    }
}

/* ---------- TABLET EM PE: mais compacto para caber na dobra ---------- */

@media (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {
    .elementor-11664 .elementor-element.elementor-element-a8a8343 {
        --padding-top: 46vw;
    }
    .elementor-11664 .elementor-element.elementor-element-6bad79e {
        --gap: 16px 0px;
        --row-gap: 16px;
    }
}