/* landing-theme.css — camada de tokens do tema das landings públicas.
 * Blocos (navbar, hero, cards…) serão migrados um a um para estas variáveis. */

:root {
    --lt-p: var(--brand-primary);
    --lt-s: var(--brand-secondary);
    --lt-p-x: color-mix(in srgb, var(--lt-p) 62%, #000);
    --lt-p-d: color-mix(in srgb, var(--lt-p) 84%, #000);
    --lt-p-s: color-mix(in srgb, var(--lt-p) 7%, #fff);
    --lt-p-t: color-mix(in srgb, var(--lt-p) 16%, #fff);
    --lt-on-p: var(--brand-on-primary, #fff);
    --lt-on-s: var(--brand-on-secondary, #10231F);
    --lt-text: #10231F;
    --lt-text-2: #44544F;
    --lt-muted: #5B6B67;
    --lt-border: #E3E9E5;
    --lt-border-strong: #CFDAD4;
    --lt-radius-sm: 12px;
    --lt-radius-md: 16px;
    --lt-radius-lg: 20px;
    --lt-radius-xl: 28px;
    --lt-shadow-float: 0 24px 60px rgba(16, 35, 31, .16);
    --lt-font-display: 'Bricolage Grotesque', 'Public Sans', sans-serif;
    --lt-font-body: 'Public Sans', system-ui, sans-serif;
}

/* =============================================================================
 * NAVBAR — #navbar-main / .nav-wrap
 * ============================================================================= */

/*
 * Contraste texto em botões com fundo cor_secundaria (dmx-style).
 * Fonte do #fff fixo: landing-base .btn-brand/.btn-wpp; guia.css
 * .apu-hero-cta/.apu-btn-sec/.apu-btn-wpp. Não mexe em .bcwpp,
 * .btn-white, nem .apu-btn-wpp fora do modal/submit com secundária.
 */
html body .btn-brand,
html body .imob-hero-video__btn,
html body .imob-hero-submit,
html body .imob-intro-cta,
html body .apu-hero-cta,
html body #whatsapp_link .btn-wpp,
html body #whatsapp_link .apu-btn-wpp,
html body #bloco3 .btn,
html body #bloco3 a.btn,
html body #bloco3 .apu-btn-sec,
html body #sobre_nos .btn,
html body #sobre_nos a.btn {
    color: var(--brand-on-secondary, #fff) !important;
}

html body .btn-brand :is(i, span, svg),
html body .imob-hero-video__btn :is(i, span, svg),
html body .imob-hero-submit :is(i, span, svg),
html body .imob-intro-cta :is(i, span, svg),
html body .apu-hero-cta :is(i, span, svg),
html body #whatsapp_link .btn-wpp :is(i, span, svg),
html body #whatsapp_link .apu-btn-wpp :is(i, span, svg),
html body #bloco3 .btn :is(i, span, svg),
html body #bloco3 a.btn :is(i, span, svg),
html body #bloco3 .apu-btn-sec :is(i, span, svg),
html body #sobre_nos .btn :is(i, span, svg),
html body #sobre_nos a.btn :is(i, span, svg) {
    color: currentColor !important;
}

html body .nav-wrap {
    background: #fff !important;
    background-color: #fff !important;
    border-bottom: 1px solid var(--lt-border) !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

html body .nav-wrap.scrolled {
    box-shadow: none !important;
}

html body .nav-inner {
    max-width: 1160px;
    margin-left: auto;
    margin-right: auto;
    padding: 16px 24px !important;
    align-items: center;
}

html body .nav-logo {
    font-family: var(--lt-font-display);
    font-weight: 700;
    font-size: 20px;
    line-height: 1.2;
    color: var(--lt-text);
    text-decoration: none;
}

html body .nav-logo img {
    height: 48px;
    max-width: 200px;
    object-fit: contain;
}

html body .nav-links {
    gap: 28px !important;
}

html body .nav-links a {
    font-family: var(--lt-font-body);
    font-size: 15px !important;
    font-weight: 500 !important;
    color: var(--lt-text-2) !important;
    text-decoration: none;
}

html body .nav-links a:hover {
    color: var(--lt-p) !important;
}

html body .nav-links a::after {
    background: var(--lt-p) !important;
}

html body .nav-wpp {
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 20px !important;
    border-radius: var(--lt-radius-sm) !important;
    font-weight: 600 !important;
    font-family: var(--lt-font-body);
    align-items: center;
    justify-content: center;
    box-shadow: none !important;
    transform: none !important;
}

html body .nav-wpp:hover {
    transform: none !important;
}

html body #navMobileMenu.nav-mobile,
html body .nav-mobile {
    background: #fff !important;
    border-top: 1px solid var(--lt-border) !important;
}

html body #navMobileMenu .nav-mobile-inner a,
html body .nav-mobile-inner a {
    font-family: var(--lt-font-body);
    font-size: 16px !important;
    font-weight: 500 !important;
    color: var(--lt-text-2) !important;
    border-bottom: 1px solid var(--lt-border);
    border-radius: 0 !important;
}

html body #navMobileMenu .nav-mobile-inner a:hover,
html body .nav-mobile-inner a:hover {
    color: var(--lt-p) !important;
    background: var(--lt-p-s) !important;
}

html body .nav-wpp.nav-wpp--mobile {
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 20px !important;
    border-radius: var(--lt-radius-sm) !important;
    font-weight: 600 !important;
    margin-top: 12px;
    border-bottom: none !important;
}

/* =============================================================================
 * HERO TOPO 1 — #hero_wrapper / #topo1
 * Nota: não há H1/subtítulo soltos no gradiente; o título real é
 * .imob-hero-form__head (dentro do cartão branco).
 * ============================================================================= */

html body #hero_wrapper.imob-hero-wrap,
html body #hero_wrapper {
    background: linear-gradient(110deg, var(--lt-p-x) 0%, var(--lt-p) 62%, var(--lt-p-d) 100%) !important;
    padding: 40px 0 48px !important;
    margin: 0;
}

html body #hero_wrapper #topo1.imob-hero,
html body #topo1.imob-hero {
    background: transparent !important;
    padding: 0 !important;
    color: var(--lt-on-p);
}

html body #hero_wrapper .imob-hero-grid {
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) !important;
    gap: 32px !important;
    align-items: center !important;
}

html body #hero_wrapper .imob-hero-media {
    position: relative;
    width: 100%;
    max-width: none !important;
    margin-inline: 0 !important;
    border-radius: var(--lt-radius-xl) !important;
    overflow: hidden;
    box-shadow: none !important;
}

html body #hero_wrapper .imob-hero-media::after {
    display: none !important;
}

html body #hero_wrapper .imob-hero-img,
html body #hero_wrapper .hero-img.imob-hero-img {
    display: block;
    width: 100%;
    height: 400px !important;
    max-height: 400px;
    aspect-ratio: auto !important;
    object-fit: cover !important;
    border-radius: var(--lt-radius-xl) !important;
    box-shadow: none !important;
}

html body #hero_wrapper .fcard.imob-hero-form,
html body #hero_wrapper .imob-hero-form {
    height: auto !important;
    background: #fff !important;
    border: 1px solid var(--lt-border) !important;
    border-radius: var(--lt-radius-lg) !important;
    box-shadow: var(--lt-shadow-float) !important;
    padding: 20px !important;
    margin: 0;
    overflow: visible;
}

html body #hero_wrapper .imob-hero-form::before,
html body #hero_wrapper .fcard.imob-hero-form::before {
    display: none !important;
    content: none !important;
}

html body #hero_wrapper .imob-hero-form__head,
html body #hero_wrapper .fcard-head.imob-hero-form__head {
    font-family: var(--lt-font-display) !important;
    font-size: 22px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    letter-spacing: -.02em !important;
    color: var(--lt-text) !important;
    padding: 0 0 12px !important;
    background: transparent !important;
}

html body #hero_wrapper .imob-hero-form__body,
html body #hero_wrapper .fcard-body.imob-hero-form__body {
    padding: 0 !important;
}

html body #hero_wrapper .imob-field-label,
html body #hero_wrapper .form-label.imob-field-label,
html body #hero_wrapper label.form-label {
    font-family: var(--lt-font-body) !important;
    font-size: 12.5px !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    color: var(--lt-text-2) !important;
    margin-bottom: 6px !important;
}

html body #hero_wrapper .imob-field-input,
html body #hero_wrapper .form-control.imob-field-input,
html body #hero_wrapper .form-select.imob-field-input,
html body #hero_wrapper .form-control,
html body #hero_wrapper .form-select {
    height: 48px !important;
    min-height: 48px !important;
    border-radius: var(--lt-radius-sm) !important;
    border: 1px solid var(--lt-border-strong) !important;
    font-family: var(--lt-font-body) !important;
    font-size: 15px !important;
    color: var(--lt-text) !important;
    background-color: #fff !important;
    box-shadow: none !important;
}

html body #hero_wrapper textarea.imob-field-input,
html body #hero_wrapper textarea.form-control {
    height: auto !important;
    min-height: 96px !important;
}

html body #hero_wrapper .imob-hero-submit,
html body #hero_wrapper .btn-brand.imob-hero-submit {
    height: 48px !important;
    min-height: 48px !important;
    padding: 0 20px !important;
    border-radius: var(--lt-radius-sm) !important;
    font-weight: 700 !important;
    font-family: var(--lt-font-body);
    box-shadow: none !important;
    transform: none !important;
    filter: none !important;
}

html body #hero_wrapper .imob-hero-submit:hover {
    transform: none !important;
    filter: none !important;
    box-shadow: none !important;
}

@media (max-width: 767.98px) {
    html body #hero_wrapper.imob-hero-wrap,
    html body #hero_wrapper {
        padding: 24px 0 32px !important;
    }

    html body #hero_wrapper .imob-hero-grid {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }

    html body #hero_wrapper .imob-hero-media {
        order: -1;
        max-width: 100% !important;
    }

    html body #hero_wrapper .imob-hero-img,
    html body #hero_wrapper .hero-img.imob-hero-img {
        height: 240px !important;
        max-height: 240px;
        border-radius: var(--lt-radius-lg) !important;
    }

    html body #hero_wrapper .imob-hero-media {
        border-radius: var(--lt-radius-lg) !important;
    }

    html body #hero_wrapper .fcard.imob-hero-form,
    html body #hero_wrapper .imob-hero-form {
        position: static !important;
        margin-top: 0 !important;
        transform: none !important;
        box-shadow: var(--lt-shadow-float) !important;
    }

    html body #hero_wrapper .imob-hero-form__head,
    html body #hero_wrapper .fcard-head.imob-hero-form__head {
        font-size: 20px !important;
    }
}

/* =============================================================================
 * BUSCA — #produtos .imob-search-* / #pesquisas_prod
 * ============================================================================= */

html body #produtos.imob-listings-section .imob-search-hero .imob-search-title {
    font-family: var(--lt-font-display) !important;
    font-size: 38px !important;
    font-weight: 700 !important;
    letter-spacing: -.02em !important;
    line-height: 1.1 !important;
    color: var(--lt-text) !important;
}

html body #produtos.imob-listings-section .imob-search-hero .imob-search-sub {
    font-family: var(--lt-font-body) !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    color: var(--lt-text-2) !important;
}

html body #produtos.imob-listings-section .imob-search-panel,
html body #produtos.imob-listings-section #pesquisas_prod.imob-search-panel {
    background: #fff !important;
    background-image: none !important;
    border: 1px solid var(--lt-border) !important;
    border-radius: var(--lt-radius-lg) !important;
    box-shadow: var(--lt-shadow-float) !important;
    padding: 20px !important;
}

html body #produtos.imob-listings-section .imob-search-label {
    font-family: var(--lt-font-body) !important;
    font-size: 12.5px !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    color: var(--lt-text-2) !important;
}

html body #produtos.imob-listings-section .imob-search-label i {
    color: var(--lt-p) !important;
}

html body #produtos.imob-listings-section .imob-search-input,
html body #produtos.imob-listings-section .form-select.imob-search-input,
html body #produtos.imob-listings-section .form-control.imob-search-input {
    height: 48px !important;
    min-height: 48px !important;
    border-radius: var(--lt-radius-sm) !important;
    border: 1px solid var(--lt-border-strong) !important;
    font-family: var(--lt-font-body) !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    color: var(--lt-text) !important;
    background: #fff !important;
    box-shadow: none !important;
}

html body #produtos.imob-listings-section .imob-search-input:focus,
html body #produtos.imob-listings-section .form-select.imob-search-input:focus,
html body #produtos.imob-listings-section .form-control.imob-search-input:focus {
    border-color: var(--lt-p) !important;
    box-shadow: 0 0 0 3px var(--lt-p-t) !important;
    outline: none !important;
}

html body #produtos.imob-listings-section .imoveis-amen-filters .form-check-input {
    accent-color: var(--lt-p);
}

html body #produtos.imob-listings-section .imoveis-amen-filters .form-check-label {
    font-family: var(--lt-font-body) !important;
    font-size: 14.5px !important;
    font-weight: 500 !important;
    color: var(--lt-text-2) !important;
}

html body #produtos.imob-listings-section .imob-search-action.imob-search-action--ghost {
    height: 48px !important;
    min-height: 48px !important;
    padding: 0 20px !important;
    border-radius: var(--lt-radius-sm) !important;
    border: 1px solid var(--lt-border-strong) !important;
    background: #fff !important;
    color: var(--lt-text) !important;
    font-weight: 700 !important;
    font-family: var(--lt-font-body);
    box-shadow: none !important;
    transform: none !important;
}

html body #produtos.imob-listings-section .imob-search-action.imob-search-action--ghost:hover {
    border-color: var(--lt-p) !important;
    color: var(--lt-p) !important;
    transform: none !important;
    box-shadow: none !important;
}

/* =============================================================================
 * CARD DE IMÓVEL — #produtos .icard.imovel-card
 * ============================================================================= */

html body #produtos.imob-listings-section :is(#repeat_produtos, #repeat_imoveis_produtos).imoveis-grid,
html body #produtos.imob-listings-section :is(#repeat_produtos, #repeat_imoveis_produtos).cgrid {
    grid-template-columns: repeat(auto-fill, minmax(310px, 1fr)) !important;
    gap: 28px !important;
    align-items: stretch;
}

html body #produtos.imob-listings-section :is(#repeat_produtos, #repeat_imoveis_produtos) .icard.imovel-card {
    background: #fff !important;
    border: 1px solid var(--lt-border) !important;
    border-radius: var(--lt-radius-lg) !important;
    overflow: hidden !important;
    box-shadow: none !important;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease !important;
}

html body #produtos.imob-listings-section :is(#repeat_produtos, #repeat_imoveis_produtos) .icard.imovel-card:hover {
    transform: translateY(-2px) !important;
    border-color: var(--lt-border-strong) !important;
    box-shadow: 0 12px 32px rgba(16, 35, 31, .1) !important;
}

html body #produtos.imob-listings-section :is(#repeat_produtos, #repeat_imoveis_produtos) .icard.imovel-card .icard-img,
html body #produtos.imob-listings-section :is(#repeat_produtos, #repeat_imoveis_produtos) .icard.imovel-card .imovel-card__media {
    height: 210px !important;
    overflow: hidden !important;
}

html body #produtos.imob-listings-section :is(#repeat_produtos, #repeat_imoveis_produtos) .icard.imovel-card .icard-img > img:not(.icard-wm),
html body #produtos.imob-listings-section :is(#repeat_produtos, #repeat_imoveis_produtos) .icard.imovel-card .icard-img img:not(.icard-wm) {
    width: 100% !important;
    height: 210px !important;
    object-fit: cover !important;
}

html body #produtos.imob-listings-section :is(#repeat_produtos, #repeat_imoveis_produtos) .icard.imovel-card .icard-badge {
    border-radius: 999px !important;
    font-weight: 700 !important;
    font-size: 12.5px !important;
}

html body #produtos.imob-listings-section :is(#repeat_produtos, #repeat_imoveis_produtos) .icard.imovel-card .icard-price,
html body #produtos.imob-listings-section :is(#repeat_produtos, #repeat_imoveis_produtos) .icard.imovel-card .imovel-card__price {
    font-family: var(--lt-font-display) !important;
    font-size: 26px !important;
    font-weight: 700 !important;
    letter-spacing: -.02em !important;
    line-height: 1.15 !important;
    color: var(--lt-p) !important;
}

html body #produtos.imob-listings-section :is(#repeat_produtos, #repeat_imoveis_produtos) .icard.imovel-card .icard-title,
html body #produtos.imob-listings-section :is(#repeat_produtos, #repeat_imoveis_produtos) .icard.imovel-card .imovel-card__title {
    font-family: var(--lt-font-body) !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    color: var(--lt-text) !important;
}

html body #produtos.imob-listings-section :is(#repeat_produtos, #repeat_imoveis_produtos) .icard.imovel-card .icard-addr,
html body #produtos.imob-listings-section :is(#repeat_produtos, #repeat_imoveis_produtos) .icard.imovel-card .imovel-card__addr {
    font-family: var(--lt-font-body) !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    color: var(--lt-muted) !important;
}

html body #produtos.imob-listings-section :is(#repeat_produtos, #repeat_imoveis_produtos) .icard.imovel-card .icard-attrs,
html body #produtos.imob-listings-section :is(#repeat_produtos, #repeat_imoveis_produtos) .icard.imovel-card .imovel-card__attrs {
    padding: 14px 0 !important;
    border-top: 1px solid var(--lt-border) !important;
    border-bottom: 1px solid var(--lt-border) !important;
    margin: 0 !important;
}

html body #produtos.imob-listings-section :is(#repeat_produtos, #repeat_imoveis_produtos) .icard.imovel-card .iattr {
    font-family: var(--lt-font-body) !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: var(--lt-text-2) !important;
}

html body #produtos.imob-listings-section :is(#repeat_produtos, #repeat_imoveis_produtos) .icard.imovel-card .iattr i {
    color: var(--lt-p) !important;
}

html body #produtos.imob-listings-section :is(#repeat_produtos, #repeat_imoveis_produtos) .icard.imovel-card .icard-actions .bcwpp,
html body #produtos.imob-listings-section :is(#repeat_produtos, #repeat_imoveis_produtos) .icard.imovel-card .icard-actions .bcview,
html body #produtos.imob-listings-section :is(#repeat_produtos, #repeat_imoveis_produtos) .icard.imovel-card .imovel-card__actions .bcwpp,
html body #produtos.imob-listings-section :is(#repeat_produtos, #repeat_imoveis_produtos) .icard.imovel-card .imovel-card__actions .bcview {
    height: 46px !important;
    min-height: 46px !important;
    padding: 0 14px !important;
    border-radius: var(--lt-radius-sm) !important;
    font-weight: 700 !important;
    font-family: var(--lt-font-body);
    box-shadow: none !important;
    transform: none !important;
}

html body #produtos.imob-listings-section :is(#repeat_produtos, #repeat_imoveis_produtos) .icard.imovel-card .icard-actions .bcwpp:hover,
html body #produtos.imob-listings-section :is(#repeat_produtos, #repeat_imoveis_produtos) .icard.imovel-card .icard-actions .bcview:hover,
html body #produtos.imob-listings-section :is(#repeat_produtos, #repeat_imoveis_produtos) .icard.imovel-card .imovel-card__actions .bcwpp:hover,
html body #produtos.imob-listings-section :is(#repeat_produtos, #repeat_imoveis_produtos) .icard.imovel-card .imovel-card__actions .bcview:hover {
    transform: none !important;
}

/* Navbar mobile — logo alinhada ao padding 24px do conteúdo */
@media (max-width: 767.98px) {
    html body #navbar-main .nav-inner {
        padding-left: 24px !important;
        padding-right: 24px !important;
    }

    html body #produtos.imob-listings-section .imob-search-hero .imob-search-title {
        font-size: 28px !important;
    }

    html body #produtos.imob-listings-section :is(#repeat_produtos, #repeat_imoveis_produtos).imoveis-grid,
    html body #produtos.imob-listings-section :is(#repeat_produtos, #repeat_imoveis_produtos).cgrid {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }
}

/* =============================================================================
 * TÍTULOS DE SEÇÃO — .sec-hd / .imob-section-head / .eyebrow / .sec-title
 * ============================================================================= */

html body .sec-hd .sec-title,
html body .imob-section-head .sec-title {
    font-family: var(--lt-font-display) !important;
    font-size: 38px !important;
    font-weight: 700 !important;
    letter-spacing: -.02em !important;
    line-height: 1.1 !important;
    color: var(--lt-text) !important;
    text-transform: none !important;
}

html body .eyebrow {
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    background: var(--lt-p-t) !important;
    color: var(--lt-p) !important;
    font-family: var(--lt-font-body) !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: .08em !important;
    border-radius: 999px !important;
    padding: 6px 14px !important;
}

html body .eyebrow::before {
    background: var(--lt-p) !important;
}

html body .eyebrow:has(> i)::before,
html body .eyebrow:has(i)::before {
    display: none !important;
}

html body .imob-listings-section,
html body .imob-ofertas-section,
html body #topo3,
html body #perguntas_frequentes,
html body #maps,
html body #galeria,
html body #video,
html body #CTA {
    /* 32+32 ≈ 64px entre fim dos cards e próximo .eyebrow (desktop) */
    padding-top: 32px !important;
    padding-bottom: 32px !important;
    /* Neutraliza mt-3 / mt-xxl-3 do markup (Bootstrap) entre seções */
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* eyebrow.mt-xxl-3 no markup (vídeo/FAQ/maps/galeria) — sem margem extra até o selo */
html body :is(.imob-listings-section, .imob-ofertas-section, #perguntas_frequentes, #maps, #galeria, #video, #CTA) .eyebrow,
html body :is(.imob-listings-section, .imob-ofertas-section, #perguntas_frequentes, #maps, #galeria, #video, #CTA) .eyebrow.mt-xxl-3,
html body :is(.imob-listings-section, .imob-ofertas-section, #perguntas_frequentes, #maps, #galeria, #video, #CTA) .sec-hd .eyebrow {
    margin-top: 0 !important;
}

/*
 * Seções dmx-if vazias (ex.: 2º #produtos entre legado e #loja) não podem
 * herdar o padding do tema. Exige painel de busca/filtro OU card para
 * manter espaço — protege #produtos (search) e #loja (filtro + cards).
 */
html body :is(.imob-listings-section, .imob-ofertas-section):not(:has(.icard, .citem, .oferta-card, .imovel-card, .imob-search-panel, .imob-oferta-filter-panel)) {
    display: none !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    min-height: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    border: none !important;
}

/* Grids — sem margem abaixo dos cards (não havia mb na base; reforço) */
html body :is(.imob-listings-section, .imob-ofertas-section) :is(.imoveis-grid, .cgrid, .cgrid-of, .ofertas-grid, .hosp-acom-grid),
html body :is(#repeat_produtos, #repeat_imoveis_produtos, #repeat_loja_produtos, #repeat_rhosp_produtos, #repeat_ofertas, #repeat_ofertas_2) {
    margin-bottom: 0 !important;
}

/*
 * landing-base .imob-listings-body { padding: 40px 24px 60px }
 * (mobile: 28px 16px 48px) — somava ~100px além do padding 32px das seções.
 * Mantém padding horizontal; zera só o vertical (seção já dá o gap 32+32≈64).
 */
html body .imob-listings-body,
html body :is(.imob-listings-section, #produtos, #loja) .imob-listings-body,
html body :is(.imob-listings-section, #produtos, #loja) .c-xl.imob-listings-body {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/* Título / selo — sem espaço acima do .eyebrow */
html body :is(.imob-listings-section, .imob-ofertas-section) .imob-section-head,
html body :is(.imob-listings-section, .imob-ofertas-section) .sec-hd {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* imob-overrides .imoveis-pager { display:flex; margin-top: 28px } */
html body #produtos .imoveis-pager,
html body .imob-listings-section .imoveis-pager {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* Pager vazio / sem controles clicáveis — não ocupa altura */
html body .imoveis-pager:not(:has(button, a, input, select, [role="button"])) {
    display: none !important;
    height: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
    border: none !important;
}

/* #sk_ofertas inline padding:var(--sp-xl) 0 (=88px) entre #loja e #ofertas */
html body #sk_ofertas {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin: 0 !important;
    min-height: 0 !important;
}

html body #sk_ofertas:not(:has(.sk-icard)) {
    display: none !important;
}

/* #bloco3.mt-xxl-3 → margin-top: 1rem entre ofertas */
html body #bloco3,
html body #bloco3.mt-xxl-3 {
    margin-top: 0 !important;
}

html body #bloco3:not(:has(*)),
html body #bloco3.mt-xxl-3:not(:has(*)) {
    display: none !important;
    margin: 0 !important;
    padding: 0 !important;
    min-height: 0 !important;
}

@media (max-width: 767.98px) {
    html body .sec-hd .sec-title,
    html body .imob-section-head .sec-title {
        font-size: 28px !important;
    }

    html body .imob-listings-section,
    html body .imob-ofertas-section,
    html body #topo3,
    html body #perguntas_frequentes,
    html body #maps,
    html body #galeria,
    html body #video,
    html body #CTA {
        /* 24+24 ≈ 48px entre blocos no mobile */
        padding-top: 24px !important;
        padding-bottom: 24px !important;
    }
}

/* =============================================================================
 * LOJA — #loja / #repeat_loja_produtos / #loja_fab_carrinho
 * ============================================================================= */

html body #loja.imob-listings-section #repeat_loja_produtos.imoveis-grid,
html body #loja.imob-listings-section #repeat_loja_produtos.cgrid {
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)) !important;
    gap: 24px !important;
    align-items: stretch;
}

html body #loja #repeat_loja_produtos .icard.imovel-card {
    background: #fff !important;
    border: 1px solid var(--lt-border) !important;
    border-radius: var(--lt-radius-lg) !important;
    overflow: hidden !important;
    box-shadow: none !important;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease !important;
}

html body #loja #repeat_loja_produtos .icard.imovel-card:hover {
    transform: translateY(-2px) !important;
    border-color: var(--lt-border-strong) !important;
    box-shadow: 0 12px 32px color-mix(in srgb, var(--lt-text) 10%, transparent) !important;
}

html body #loja #repeat_loja_produtos .icard.imovel-card .icard-img,
html body #loja #repeat_loja_produtos .icard.imovel-card .imovel-card__media {
    height: 210px !important;
    overflow: hidden !important;
}

html body #loja #repeat_loja_produtos .icard.imovel-card .icard-img img:not(.icard-wm) {
    width: 100% !important;
    height: 210px !important;
    object-fit: cover !important;
}

html body #loja #repeat_loja_produtos .icard.imovel-card .icard-price,
html body #loja #repeat_loja_produtos .icard.imovel-card .imovel-card__price {
    font-family: var(--lt-font-display) !important;
    font-size: 24px !important;
    font-weight: 700 !important;
    letter-spacing: -.02em !important;
    color: var(--lt-p) !important;
}

html body #loja #repeat_loja_produtos .icard.imovel-card .icard-title,
html body #loja #repeat_loja_produtos .icard.imovel-card .imovel-card__title {
    font-family: var(--lt-font-body) !important;
    font-size: 17px !important;
    font-weight: 600 !important;
    color: var(--lt-text) !important;
}

html body #loja #repeat_loja_produtos .icard.imovel-card .cdesc {
    font-family: var(--lt-font-body) !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    color: var(--lt-muted) !important;
}

html body #loja #repeat_loja_produtos .icard.imovel-card .icard-actions .bcview,
html body #loja #repeat_loja_produtos .icard.imovel-card .imovel-card__actions .bcview {
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 14px !important;
    border-radius: var(--lt-radius-sm) !important;
    font-weight: 700 !important;
    font-family: var(--lt-font-body);
    box-shadow: none !important;
    transform: none !important;
}

html body #loja #repeat_loja_produtos .icard.imovel-card .icard-actions .bcview:hover,
html body #loja #repeat_loja_produtos .icard.imovel-card .imovel-card__actions .bcview:hover {
    transform: none !important;
}

html body #loja .imob-oferta-filter-panel .imob-search-input,
html body #loja #select_loja_categoria.imob-search-input {
    height: 48px !important;
    min-height: 48px !important;
    border-radius: var(--lt-radius-sm) !important;
    border: 1px solid var(--lt-border-strong) !important;
    font-family: var(--lt-font-body) !important;
    font-size: 15px !important;
    background: #fff !important;
    box-shadow: none !important;
}

html body #loja_fab_carrinho.loja-fab {
    box-shadow: var(--lt-shadow-float) !important;
}

@media (max-width: 767.98px) {
    html body #loja.imob-listings-section #repeat_loja_produtos.imoveis-grid,
    html body #loja.imob-listings-section #repeat_loja_produtos.cgrid {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }
}

/* =============================================================================
 * OFERTAS — #ofertas / #ofertas2 / .oferta-card / #repeat_ofertas
 * ============================================================================= */

html body #ofertas.imob-ofertas-section,
html body #ofertas1.imob-ofertas-section {
    background: #fff !important;
}

html body #ofertas2.imob-ofertas-section,
html body #ofertas2.imob-ofertas-section--alt {
    background: var(--lt-p-s) !important;
    border-top: 1px solid var(--lt-border) !important;
}

html body #ofertas :is(#repeat_ofertas, #repeat_ofertas_2).ofertas-grid,
html body #ofertas2 :is(#repeat_ofertas, #repeat_ofertas_2).ofertas-grid,
html body :is(#repeat_ofertas, #repeat_ofertas_2).ofertas-grid {
    grid-template-columns: repeat(auto-fill, minmax(310px, 1fr)) !important;
    gap: 28px !important;
    align-items: stretch;
}

html body :is(#repeat_ofertas, #repeat_ofertas_2) .citem.oferta-card {
    background: #fff !important;
    border: 1px solid var(--lt-border) !important;
    border-radius: var(--lt-radius-lg) !important;
    overflow: hidden !important;
    box-shadow: none !important;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease !important;
}

html body :is(#repeat_ofertas, #repeat_ofertas_2) .citem.oferta-card:hover {
    transform: translateY(-2px) !important;
    border-color: var(--lt-border-strong) !important;
    box-shadow: 0 12px 32px color-mix(in srgb, var(--lt-text) 10%, transparent) !important;
}

html body :is(#repeat_ofertas, #repeat_ofertas_2) .citem.oferta-card .cimg.oferta-card__media,
html body :is(#repeat_ofertas, #repeat_ofertas_2) .citem.oferta-card .cimg {
    height: 210px !important;
    overflow: hidden !important;
    width: 100% !important;
}

html body :is(#repeat_ofertas, #repeat_ofertas_2) .citem.oferta-card .cimg img:not(.icard-wm),
html body :is(#repeat_ofertas, #repeat_ofertas_2) .citem.oferta-card .oferta-card__media img:not(.icard-wm) {
    width: 100% !important;
    height: 210px !important;
    object-fit: cover !important;
}

html body :is(#repeat_ofertas, #repeat_ofertas_2) .citem.oferta-card .ctitle,
html body :is(#repeat_ofertas, #repeat_ofertas_2) .citem.oferta-card .oferta-card__title {
    font-family: var(--lt-font-body) !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    color: var(--lt-text) !important;
}

html body :is(#repeat_ofertas, #repeat_ofertas_2) .citem.oferta-card .cprice,
html body :is(#repeat_ofertas, #repeat_ofertas_2) .citem.oferta-card .oferta-card__price {
    font-family: var(--lt-font-display) !important;
    font-size: 24px !important;
    font-weight: 700 !important;
    letter-spacing: -.02em !important;
    color: var(--lt-p) !important;
}

html body :is(#repeat_ofertas, #repeat_ofertas_2) .citem.oferta-card .cbadge,
html body :is(#repeat_ofertas, #repeat_ofertas_2) .citem.oferta-card .oferta-card__badge {
    border-radius: 999px !important;
    font-weight: 700 !important;
    font-size: 12.5px !important;
}

html body :is(#repeat_ofertas, #repeat_ofertas_2) .citem.oferta-card .bcwpp-full,
html body :is(#repeat_ofertas, #repeat_ofertas_2) .citem.oferta-card .oferta-card__btn {
    height: 46px !important;
    min-height: 46px !important;
    padding: 0 14px !important;
    border-radius: var(--lt-radius-sm) !important;
    font-weight: 700 !important;
    font-family: var(--lt-font-body);
    box-shadow: none !important;
    transform: none !important;
}

html body :is(#repeat_ofertas, #repeat_ofertas_2) .citem.oferta-card .bcwpp-full:hover,
html body :is(#repeat_ofertas, #repeat_ofertas_2) .citem.oferta-card .oferta-card__btn:hover {
    transform: none !important;
}

html body :is(#ofertas, #ofertas2) .imob-oferta-filter-panel .imob-search-input {
    height: 48px !important;
    min-height: 48px !important;
    border-radius: var(--lt-radius-sm) !important;
    border: 1px solid var(--lt-border-strong) !important;
    background: #fff !important;
    box-shadow: none !important;
}

@media (max-width: 767.98px) {
    html body :is(#repeat_ofertas, #repeat_ofertas_2).ofertas-grid {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }
}

/* =============================================================================
 * HOSP — acomodações (#produtos .hcard / barra de datas rhosp)
 * Espelha CARD DE IMÓVEL. Não toca #modal_rhosp_* / #modal_tipo_produto.
 * ============================================================================= */

/* 7) Barra de datas — zera margin-top 28px do landing-premium */
html body #produtos[data-rhosp="1"] .imob-search-hero.imob-search-hero--compact,
html body #produtos[data-rhosp="1"] .imob-search-hero.hosp-search-hero,
html body #produtos[data-rhosp="1"] .imob-search-hero.imob-search-hero--compact.hosp-search-hero {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/*
 * Alinhamento lateral painel ↔ grid:
 * - Desktop: landing-base .imob-search-panel { max-width:1100px; margin:0 auto }
 *   deixa o painel ~24px inset vs .hosp-acom-grid (largura total do .c-xl).
 * - Mobile: busca usa .c-xl { padding:0 24px }; grid usa .imob-listings-body
 *   { padding-left/right:16px } — desalinha ~8px.
 */
html body #produtos[data-rhosp="1"] .imob-search-panel.hosp-search-panel,
html body #produtos[data-rhosp="1"] .hosp-search-panel {
    max-width: none !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

@media (max-width: 767.98px) {
    html body #produtos[data-rhosp="1"] .imob-search-hero .c-xl {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }
}

/* 1) Grid */
html body #produtos :is(#repeat_rhosp_produtos, #repeat_produtos).hosp-acom-grid {
    grid-template-columns: repeat(auto-fill, minmax(310px, 1fr)) !important;
    gap: 28px !important;
    align-items: stretch !important;
    margin-bottom: 0 !important;
}

@media (max-width: 767.98px) {
    html body #produtos :is(#repeat_rhosp_produtos, #repeat_produtos).hosp-acom-grid {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }
}

/* 2) Card */
html body #produtos :is(#repeat_rhosp_produtos, #repeat_produtos) article.hcard {
    background: #fff !important;
    border: 1px solid var(--lt-border) !important;
    border-radius: var(--lt-radius-lg) !important;
    overflow: hidden !important;
    box-shadow: none !important;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease !important;
}

html body #produtos :is(#repeat_rhosp_produtos, #repeat_produtos) article.hcard:hover {
    transform: translateY(-2px) !important;
    border-color: var(--lt-border-strong) !important;
    box-shadow: 0 12px 32px rgba(16, 35, 31, .1) !important;
}

/* 3) Imagem / badge / cidade */
html body #produtos :is(#repeat_rhosp_produtos, #repeat_produtos) article.hcard .hcard-img {
    height: 210px !important;
    aspect-ratio: auto !important;
    overflow: hidden !important;
}

html body #produtos :is(#repeat_rhosp_produtos, #repeat_produtos) article.hcard .hcard-img img {
    width: 100% !important;
    height: 210px !important;
    object-fit: cover !important;
}

html body #produtos :is(#repeat_rhosp_produtos, #repeat_produtos) article.hcard .hcard-badge,
html body #produtos :is(#repeat_rhosp_produtos, #repeat_produtos) article.hcard .hcard-city {
    border-radius: 999px !important;
    font-weight: 700 !important;
    font-size: 12.5px !important;
}

/* 4) Textos / chips (só no card da listagem — não nos modais) */
html body #produtos :is(#repeat_rhosp_produtos, #repeat_produtos) article.hcard .hcard-title {
    font-family: var(--lt-font-body) !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    color: var(--lt-text) !important;
}

html body #produtos :is(#repeat_rhosp_produtos, #repeat_produtos) article.hcard .hcard-desc {
    font-size: 14px !important;
    font-weight: 400 !important;
    color: var(--lt-muted) !important;
}

html body #produtos :is(#repeat_rhosp_produtos, #repeat_produtos) article.hcard .hcard-price {
    font-family: var(--lt-font-display) !important;
    font-size: 26px !important;
    font-weight: 700 !important;
    letter-spacing: -.02em !important;
    line-height: 1.15 !important;
    color: var(--lt-p) !important;
}

html body #produtos :is(#repeat_rhosp_produtos, #repeat_produtos) article.hcard .rhosp-price-unit {
    font-size: 14px !important;
    font-weight: 500 !important;
    color: var(--lt-muted) !important;
}

html body #produtos :is(#repeat_rhosp_produtos, #repeat_produtos) article.hcard .rhosp-amen-chips .rhosp-chip,
html body #produtos :is(#repeat_rhosp_produtos, #repeat_produtos) article.hcard .rhosp-chip {
    background: var(--lt-p-s) !important;
    color: var(--lt-text-2) !important;
    border: 1px solid var(--lt-border) !important;
    border-radius: 999px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
}

html body #produtos :is(#repeat_rhosp_produtos, #repeat_produtos) article.hcard .rhosp-amen-chips .rhosp-chip i,
html body #produtos :is(#repeat_rhosp_produtos, #repeat_produtos) article.hcard .rhosp-chip i {
    color: var(--lt-p) !important;
}

/* 5) Botões — sem alterar cores de marca/WhatsApp */
html body #produtos :is(#repeat_rhosp_produtos, #repeat_produtos) article.hcard .hcard-actions .bcwpp,
html body #produtos :is(#repeat_rhosp_produtos, #repeat_produtos) article.hcard .hcard-actions .bcview {
    height: 46px !important;
    min-height: 46px !important;
    padding: 0 14px !important;
    border-radius: var(--lt-radius-sm) !important;
    font-weight: 700 !important;
    font-family: var(--lt-font-body) !important;
    box-shadow: none !important;
    transform: none !important;
}

html body #produtos :is(#repeat_rhosp_produtos, #repeat_produtos) article.hcard .hcard-actions .bcwpp:hover,
html body #produtos :is(#repeat_rhosp_produtos, #repeat_produtos) article.hcard .hcard-actions .bcview:hover {
    box-shadow: none !important;
    transform: none !important;
}

/* 6) Paginador */
html body #produtos .rhosp-pager {
    margin-top: 0 !important;
}

html body #produtos .rhosp-pager .imob-search-action.imob-search-action--ghost,
html body #produtos .rhosp-pager button {
    height: 48px !important;
    min-height: 48px !important;
    border: 1px solid var(--lt-border-strong) !important;
    border-radius: var(--lt-radius-sm) !important;
    background: #fff !important;
}

/* =============================================================================
 * LP — loja e intro (#loja .lp-prod-card / #topo3)
 * Espelha CARD DE IMÓVEL. Não toca modais, #loja_fab, js-loja-*, dmx-style.
 * ============================================================================= */

/*
 * Padding lateral: na lp, filtro (.imob-oferta-toolbar) e grid
 * (#repeat_loja_produtos) ficam no mesmo .c-xl.imob-listings-body —
 * já compartilham bordas; sem correção tipo hosp.
 */

/* 1) Grid */
html body #loja #repeat_loja_produtos.lp-prod-grid,
html body #loja #repeat_loja_produtos.cgrid.lp-prod-grid {
    grid-template-columns: repeat(auto-fill, minmax(310px, 1fr)) !important;
    gap: 28px !important;
    align-items: stretch !important;
    margin-bottom: 0 !important;
}

@media (max-width: 767.98px) {
    html body #loja #repeat_loja_produtos.lp-prod-grid,
    html body #loja #repeat_loja_produtos.cgrid.lp-prod-grid {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }
}

/* Card — neutraliza hover -6px do lp.css */
html body #loja #repeat_loja_produtos .citem.lp-prod-card {
    background: #fff !important;
    border: 1px solid var(--lt-border) !important;
    border-radius: var(--lt-radius-lg) !important;
    overflow: hidden !important;
    box-shadow: none !important;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease !important;
}

html body #loja #repeat_loja_produtos .citem.lp-prod-card:hover {
    transform: translateY(-2px) !important;
    border-color: var(--lt-border-strong) !important;
    box-shadow: 0 12px 32px rgba(16, 35, 31, .1) !important;
}

html body #loja #repeat_loja_produtos .citem.lp-prod-card .cimg.lp-prod-card__media,
html body #loja #repeat_loja_produtos .citem.lp-prod-card .lp-prod-card__media,
html body #loja #repeat_loja_produtos .citem.lp-prod-card .cimg {
    height: 210px !important;
    aspect-ratio: auto !important;
    overflow: hidden !important;
}

html body #loja #repeat_loja_produtos .citem.lp-prod-card .cimg img,
html body #loja #repeat_loja_produtos .citem.lp-prod-card .lp-prod-card__media img {
    width: 100% !important;
    height: 210px !important;
    object-fit: cover !important;
}

html body #loja #repeat_loja_produtos .citem.lp-prod-card:hover .cimg img,
html body #loja #repeat_loja_produtos .citem.lp-prod-card:hover .lp-prod-card__media img {
    transform: none !important;
}

html body #loja #repeat_loja_produtos .citem.lp-prod-card .ctitle.lp-prod-card__title,
html body #loja #repeat_loja_produtos .citem.lp-prod-card .lp-prod-card__title,
html body #loja #repeat_loja_produtos .citem.lp-prod-card .ctitle {
    font-family: var(--lt-font-body) !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    color: var(--lt-text) !important;
    text-align: left !important;
}

html body #loja #repeat_loja_produtos .citem.lp-prod-card .cdesc.lp-prod-card__desc,
html body #loja #repeat_loja_produtos .citem.lp-prod-card .lp-prod-card__desc,
html body #loja #repeat_loja_produtos .citem.lp-prod-card .cdesc {
    font-size: 14px !important;
    font-weight: 400 !important;
    color: var(--lt-muted) !important;
}

html body #loja #repeat_loja_produtos .citem.lp-prod-card .cprice.lp-prod-card__price,
html body #loja #repeat_loja_produtos .citem.lp-prod-card .lp-prod-card__price,
html body #loja #repeat_loja_produtos .citem.lp-prod-card .cprice {
    font-family: var(--lt-font-display) !important;
    font-size: 26px !important;
    font-weight: 700 !important;
    letter-spacing: -.02em !important;
    line-height: 1.15 !important;
    color: var(--lt-p) !important;
    text-align: left !important;
}

/* Botões — só geometria; não forçar background (marca/WhatsApp) */
html body #loja #repeat_loja_produtos .citem.lp-prod-card .cactions.lp-prod-card__actions .bcview,
html body #loja #repeat_loja_produtos .citem.lp-prod-card .lp-prod-card__actions .bcview,
html body #loja #repeat_loja_produtos .citem.lp-prod-card .cactions .bcwpp,
html body #loja #repeat_loja_produtos .citem.lp-prod-card .cactions .bcview {
    height: 46px !important;
    min-height: 46px !important;
    padding: 0 14px !important;
    border-radius: var(--lt-radius-sm) !important;
    font-weight: 700 !important;
    font-family: var(--lt-font-body) !important;
    box-shadow: none !important;
    transform: none !important;
}

html body #loja #repeat_loja_produtos .citem.lp-prod-card .cactions .bcview:hover,
html body #loja #repeat_loja_produtos .citem.lp-prod-card .lp-prod-card__actions .bcview:hover,
html body #loja #repeat_loja_produtos .citem.lp-prod-card .cactions .bcwpp:hover {
    box-shadow: none !important;
    transform: none !important;
}

/* 3) Intro #topo3 — tipografia; padding vem da regra global de seções.
 * Sem background nem cor de botão (dmx-style cor_secundaria). */
html body #topo3.imob-intro-section > .c-xl {
    max-width: 1160px !important;
}

html body #topo3 .imob-intro-content .eyebrow {
    margin-bottom: 12px !important;
}

html body #topo3 .imob-intro-text,
html body #topo3 .imob-intro-text.bloco-content {
    font-family: var(--lt-font-body) !important;
    font-size: 16.5px !important;
    font-weight: 400 !important;
    line-height: 1.65 !important;
    color: var(--lt-text-2) !important;
}

html body #topo3 .imob-intro-text :is(h1, h2, h3, h4, h5, strong),
html body #topo3 .imob-intro-text.bloco-content :is(h1, h2, h3, h4, h5) {
    font-family: var(--lt-font-display) !important;
    font-weight: 700 !important;
    color: var(--lt-text) !important;
    letter-spacing: -.02em !important;
}

html body #topo3 .imob-intro-cta {
    min-height: 48px !important;
    border-radius: var(--lt-radius-sm) !important;
    font-family: var(--lt-font-body) !important;
    font-weight: 700 !important;
    box-shadow: none !important;
    /* cor via dmx-style cor_secundaria — não forçar background */
}

html body #topo3 .imob-intro-cta:hover {
    transform: none !important;
    filter: none !important;
    box-shadow: none !important;
}

html body #topo3 .imob-intro-img,
html body #topo3 .bimg.imob-intro-img {
    border-radius: var(--lt-radius-lg) !important;
    box-shadow: none !important;
}

/* =============================================================================
 * GUIA — cards e painéis (#produtos / #guiacomercial / #loja)
 * Espelha CARD DE IMÓVEL. Não toca modais, js-*, dmx-style de cor.
 * ============================================================================= */

/*
 * Alinhamento lateral painel ↔ grid:
 * - Desktop: landing-base .imob-search-panel { max-width:1100px; margin:0 auto }
 *   estreita .guia-prod-search-panel / .guia-search-panel vs o grid.
 * - Mobile (#produtos): busca em .c-xl { padding:0 24px }; cards em
 *   .c-xl.imob-listings-body com padding lateral 16px (theme zera só vertical).
 * - #guiacomercial / legado: painel + grid no mesmo .c-xl — só o max-width 1100.
 * - #loja: filtro + grid no mesmo .imob-listings-body — já alinhados.
 */
html body #produtos .imob-search-panel.guia-prod-search-panel,
html body #produtos .guia-prod-search-panel,
html body #guiacomercial .imob-search-panel.guia-search-panel,
html body #guiacomercial .guia-search-panel,
html body #guiacomercial_legado .imob-search-panel.guia-search-panel,
html body #guiacomercial_legado .guia-search-panel {
    max-width: none !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

@media (max-width: 767.98px) {
    /* exclusivo guia.ejs: .guia-prod-search-hero no filtro de #produtos */
    html body #produtos .guia-prod-search-hero .c-xl {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }
}

/* 3) Grids */
html body #produtos #repeat_produtos.guia-prod-grid,
html body #loja #repeat_loja_produtos.guia-prod-grid,
html body #guiacomercial #repeat_guiacom_produtos.guia-com-grid,
html body #guiacomercial .guia-com-grid,
html body #guiacomercial_legado #repeat_guia.guia-com-grid,
html body #guiacomercial_legado .guia-com-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(310px, 1fr)) !important;
    gap: 28px !important;
    align-items: stretch !important;
    margin-bottom: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    --bs-gutter-x: 0;
    --bs-gutter-y: 0;
}

/* Bootstrap .col dentro do guia-prod-grid (row) — vira célula do CSS grid */
html body #produtos #repeat_produtos.guia-prod-grid > [class*="col"],
html body #loja #repeat_loja_produtos.guia-prod-grid > [class*="col"] {
    width: 100% !important;
    max-width: 100% !important;
    flex: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/*
 * guia.css (.guia-com-grid > .guia-card @992px):
 *   flex: 1 1 calc(33.333% - 16px); max-width: calc(33.333% - 16px);
 * pensado p/ flex-wrap. Com display:grid do theme, o % resolve na célula
 * (~365px → card ~104px). Neutraliza no card e em qualquer filho direto.
 * dmx-repeat está no próprio grid — .citem é filho direto (sem wrapper).
 */
html body #guiacomercial .guia-com-grid > *,
html body #guiacomercial_legado .guia-com-grid > *,
html body #guiacomercial .guia-com-grid .citem.guia-card,
html body #guiacomercial_legado .guia-com-grid .citem.guia-card {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    flex: none !important;
    justify-self: stretch !important;
}

@media (max-width: 767.98px) {
    html body #produtos #repeat_produtos.guia-prod-grid,
    html body #loja #repeat_loja_produtos.guia-prod-grid,
    html body #guiacomercial #repeat_guiacom_produtos.guia-com-grid,
    html body #guiacomercial .guia-com-grid,
    html body #guiacomercial_legado #repeat_guia.guia-com-grid,
    html body #guiacomercial_legado .guia-com-grid {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }
}

/* 1) Cards .apu-card — produtos / loja */
html body #produtos #repeat_produtos .apu-card,
html body #loja #repeat_loja_produtos .apu-card {
    background: #fff !important;
    border: 1px solid var(--lt-border) !important;
    border-radius: var(--lt-radius-lg) !important;
    overflow: hidden !important;
    box-shadow: none !important;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease !important;
}

html body #produtos #repeat_produtos .apu-card:hover,
html body #loja #repeat_loja_produtos .apu-card:hover {
    transform: translateY(-2px) !important;
    border-color: var(--lt-border-strong) !important;
    box-shadow: 0 12px 32px rgba(16, 35, 31, .1) !important;
}

html body #produtos #repeat_produtos .apu-card .hcard-img-wrap,
html body #loja #repeat_loja_produtos .apu-card .hcard-img-wrap {
    height: 210px !important;
    aspect-ratio: auto !important;
    overflow: hidden !important;
}

html body #produtos #repeat_produtos .apu-card .hcard-img-wrap img,
html body #loja #repeat_loja_produtos .apu-card .hcard-img-wrap img {
    width: 100% !important;
    height: 210px !important;
    object-fit: cover !important;
}

html body #produtos #repeat_produtos .apu-card:hover .hcard-img-wrap img,
html body #loja #repeat_loja_produtos .apu-card:hover .hcard-img-wrap img {
    transform: none !important;
}

html body #produtos #repeat_produtos .apu-card .gcard-badge,
html body #produtos #repeat_produtos .apu-card .gcard-badge-dest,
html body #loja #repeat_loja_produtos .apu-card .gcard-badge,
html body #loja #repeat_loja_produtos .apu-card .gcard-badge-dest {
    border-radius: 999px !important;
    font-size: 12.5px !important;
    font-weight: 700 !important;
    /* cor de fundo via dmx-style / âmbar — não forçar */
}

html body #produtos #repeat_produtos .apu-card .gcard-title,
html body #loja #repeat_loja_produtos .apu-card .gcard-title {
    font-family: var(--lt-font-body) !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    color: var(--lt-text) !important;
}

html body #produtos #repeat_produtos .apu-card .gcard-desc,
html body #loja #repeat_loja_produtos .apu-card .gcard-desc {
    font-size: 14px !important;
    font-weight: 400 !important;
    color: var(--lt-muted) !important;
}

html body #loja #repeat_loja_produtos .apu-card .gcard-price {
    font-family: var(--lt-font-display) !important;
    font-size: 26px !important;
    font-weight: 700 !important;
    letter-spacing: -.02em !important;
    line-height: 1.15 !important;
    color: var(--lt-p) !important;
}

html body #produtos #repeat_produtos .apu-card .apu-amenity,
html body #loja #repeat_loja_produtos .apu-card .apu-amenity {
    border-radius: 999px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    /* border-color via dmx-style — não forçar */
}

html body #produtos #repeat_produtos .apu-card .gcard-actions .apu-btn-wpp,
html body #produtos #repeat_produtos .apu-card .gcard-actions .apu-btn-pri,
html body #produtos #repeat_produtos .apu-card .gcard-actions .bcview,
html body #loja #repeat_loja_produtos .apu-card .gcard-actions .apu-btn-wpp,
html body #loja #repeat_loja_produtos .apu-card .gcard-actions .apu-btn-pri,
html body #loja #repeat_loja_produtos .apu-card .gcard-actions .bcview {
    height: 46px !important;
    min-height: 46px !important;
    padding: 0 14px !important;
    border-radius: var(--lt-radius-sm) !important;
    font-weight: 700 !important;
    font-family: var(--lt-font-body) !important;
    box-shadow: none !important;
    transform: none !important;
}

html body #produtos #repeat_produtos .apu-card .gcard-actions .apu-btn-wpp:hover,
html body #produtos #repeat_produtos .apu-card .gcard-actions .apu-btn-pri:hover,
html body #produtos #repeat_produtos .apu-card .gcard-actions .bcview:hover,
html body #loja #repeat_loja_produtos .apu-card .gcard-actions .apu-btn-wpp:hover,
html body #loja #repeat_loja_produtos .apu-card .gcard-actions .apu-btn-pri:hover,
html body #loja #repeat_loja_produtos .apu-card .gcard-actions .bcview:hover {
    box-shadow: none !important;
    transform: none !important;
}

/* 2) Cards .guia-card — comercial novo + legado */
html body #guiacomercial #repeat_guiacom_produtos .citem.guia-card,
html body #guiacomercial .citem.guia-card,
html body #guiacomercial_legado #repeat_guia .citem.guia-card,
html body #guiacomercial_legado .citem.guia-card {
    background: #fff !important;
    border: 1px solid var(--lt-border) !important;
    border-radius: var(--lt-radius-lg) !important;
    overflow: hidden !important;
    box-shadow: none !important;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease !important;
}

html body #guiacomercial #repeat_guiacom_produtos .citem.guia-card:hover,
html body #guiacomercial .citem.guia-card:hover,
html body #guiacomercial_legado #repeat_guia .citem.guia-card:hover,
html body #guiacomercial_legado .citem.guia-card:hover {
    transform: translateY(-2px) !important;
    border-color: var(--lt-border-strong) !important;
    box-shadow: 0 12px 32px rgba(16, 35, 31, .1) !important;
}

html body #guiacomercial .citem.guia-card .cimg.guia-card__media,
html body #guiacomercial .citem.guia-card .guia-card__media,
html body #guiacomercial_legado .citem.guia-card .cimg.guia-card__media,
html body #guiacomercial_legado .citem.guia-card .guia-card__media {
    height: 210px !important;
    aspect-ratio: auto !important;
    overflow: hidden !important;
}

html body #guiacomercial .citem.guia-card .cimg img,
html body #guiacomercial .citem.guia-card .guia-card__media img,
html body #guiacomercial_legado .citem.guia-card .cimg img,
html body #guiacomercial_legado .citem.guia-card .guia-card__media img {
    width: 100% !important;
    height: 210px !important;
    object-fit: cover !important;
}

html body #guiacomercial .citem.guia-card:hover .cimg img,
html body #guiacomercial .citem.guia-card:hover .guia-card__media img,
html body #guiacomercial_legado .citem.guia-card:hover .cimg img,
html body #guiacomercial_legado .citem.guia-card:hover .guia-card__media img {
    transform: none !important;
}

html body #guiacomercial .citem.guia-card .cbadge.guia-card__badge,
html body #guiacomercial .citem.guia-card .guia-card__badge,
html body #guiacomercial_legado .citem.guia-card .cbadge.guia-card__badge,
html body #guiacomercial_legado .citem.guia-card .guia-card__badge {
    border-radius: 999px !important;
    font-size: 12.5px !important;
    font-weight: 700 !important;
    /* cor via dmx-style — não forçar */
}

html body #guiacomercial .citem.guia-card .ctitle.guia-card__title,
html body #guiacomercial .citem.guia-card .guia-card__title,
html body #guiacomercial_legado .citem.guia-card .ctitle.guia-card__title,
html body #guiacomercial_legado .citem.guia-card .guia-card__title {
    font-family: var(--lt-font-body) !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    color: var(--lt-text) !important;
}

html body #guiacomercial .citem.guia-card .cdesc.guia-card__desc,
html body #guiacomercial .citem.guia-card .guia-card__desc,
html body #guiacomercial_legado .citem.guia-card .cdesc.guia-card__desc,
html body #guiacomercial_legado .citem.guia-card .guia-card__desc {
    font-size: 14px !important;
    font-weight: 400 !important;
    color: var(--lt-muted) !important;
}

html body #guiacomercial .citem.guia-card .cbody.guia-card__body,
html body #guiacomercial .citem.guia-card .guia-card__body,
html body #guiacomercial .citem.guia-card .guia-card__action,
html body #guiacomercial_legado .citem.guia-card .cbody.guia-card__body,
html body #guiacomercial_legado .citem.guia-card .guia-card__body,
html body #guiacomercial_legado .citem.guia-card .guia-card__action {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

html body #guiacomercial .citem.guia-card .bcwpp-full.guia-card__btn,
html body #guiacomercial .citem.guia-card .guia-card__btn,
html body #guiacomercial_legado .citem.guia-card .bcwpp-full.guia-card__btn,
html body #guiacomercial_legado .citem.guia-card .guia-card__btn {
    width: 100% !important;
    height: 46px !important;
    min-height: 46px !important;
    padding: 0 14px !important;
    border-radius: var(--lt-radius-sm) !important;
    font-weight: 700 !important;
    font-family: var(--lt-font-body) !important;
    box-shadow: none !important;
    transform: none !important;
    /* background WhatsApp — não forçar */
}

html body #guiacomercial .citem.guia-card .bcwpp-full.guia-card__btn:hover,
html body #guiacomercial .citem.guia-card .guia-card__btn:hover,
html body #guiacomercial_legado .citem.guia-card .bcwpp-full.guia-card__btn:hover,
html body #guiacomercial_legado .citem.guia-card .guia-card__btn:hover {
    box-shadow: none !important;
    transform: none !important;
}

html body #guiacomercial_legado .citem.guia-card .guia-card__socials,
html body #guiacomercial_legado .citem.guia-card .gcard-socials {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    align-items: center !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

/* =============================================================================
 * GUIA — rodapé, FAQ, mapa e galeria
 * Escopo: #footer.apu-footer, #accordionFaq/.apu-accordion, #bloco3, #maps,
 * #galeria, #banner_slider. Não forçar background de #footer/#sobre_nos
 * (dmx-style) nem cores inline dos ícones sociais.
 * ============================================================================= */

/* 1) Rodapé #footer.apu-footer
 * Markup: .container > .text-center >
 *   p:nth-child(1) "Endereço" | p:nth-child(2) endereço |
 *   p:nth-child(3) "Siga-nos" | div:nth-child(4) .d-flex sociais |
 *   hr.apu-footer-divider | p.apu-footer-copy
 */
html body #footer.apu-footer {
    padding: 64px 0 28px !important;
    margin-top: 0 !important;
}

html body #footer.apu-footer > .container {
    max-width: 1160px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 24px !important;
    padding-right: 24px !important;
}

html body #footer.apu-footer > .container > .text-center {
    text-align: left !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    grid-template-areas:
        "label-addr   label-social"
        "addr         social"
        "div          div"
        "copy         copy" !important;
    gap: 8px 40px !important;
    align-items: start !important;
    color: var(--lt-on-p) !important;
}

html body #footer.apu-footer > .container > .text-center > p:nth-child(1),
html body #footer.apu-footer > .container > .text-center > p:nth-child(3) {
    font-family: var(--lt-font-body) !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
    color: var(--lt-on-p) !important;
    opacity: .75 !important;
    margin: 0 0 8px !important;
    text-align: left !important;
}

html body #footer.apu-footer > .container > .text-center > p:nth-child(1) {
    grid-area: label-addr !important;
}

html body #footer.apu-footer > .container > .text-center > p:nth-child(3) {
    grid-area: label-social !important;
}

html body #footer.apu-footer > .container > .text-center > p:nth-child(2) {
    grid-area: addr !important;
    font-family: var(--lt-font-body) !important;
    font-size: 15px !important;
    line-height: 1.65 !important;
    color: var(--lt-on-p) !important;
    text-align: left !important;
    margin: 0 !important;
}

html body #footer.apu-footer > .container > .text-center > div:nth-child(4),
html body #footer.apu-footer > .container > .text-center > .d-flex {
    grid-area: social !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    justify-content: flex-start !important;
    margin: 0 !important;
}

html body #footer.apu-footer .apu-footer-social-btn {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    border-radius: 50% !important;
    border: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    box-shadow: none !important;
    transform: none !important;
    /* background/color inline — não forçar */
}

html body #footer.apu-footer .apu-footer-social-btn:hover {
    box-shadow: none !important;
    transform: none !important;
}

html body #footer.apu-footer .apu-footer-divider,
html body #footer.apu-footer > .container > .text-center > hr.apu-footer-divider {
    grid-area: div !important;
    width: 100% !important;
    height: 0 !important;
    margin: 12px 0 0 !important;
    padding: 0 !important;
    border: none !important;
    border-top: 1px solid color-mix(in srgb, var(--lt-on-p) 18%, transparent) !important;
    opacity: 1 !important;
    background: transparent !important;
}

html body #footer.apu-footer .apu-footer-copy {
    grid-area: copy !important;
    font-family: var(--lt-font-body) !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
    color: var(--lt-on-p) !important;
    opacity: .75 !important;
    text-align: left !important;
    padding: 20px 0 !important;
    margin: 0 !important;
}

html body #footer.apu-footer .apu-footer-copy a {
    color: var(--lt-on-p) !important;
}

@media (max-width: 767.98px) {
    html body #footer.apu-footer {
        padding: 48px 0 24px !important;
    }

    html body #footer.apu-footer > .container {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }

    html body #footer.apu-footer > .container > .text-center {
        grid-template-columns: 1fr !important;
        grid-template-areas:
            "label-addr"
            "addr"
            "label-social"
            "social"
            "div"
            "copy" !important;
        gap: 8px !important;
    }
}

/* 3) Larguras — só guia (:has #footer.apu-footer); 1160 / pad 24·16
 * #sobre_nos guia: filho direto .container (não .container.wappler-block) */
html body:has(#footer.apu-footer) #bloco3 > .container,
html body:has(#footer.apu-footer) #sobre_nos > .container,
html body:has(#footer.apu-footer) #maps > .container,
html body:has(#footer.apu-footer) #galeria > .container,
html body:has(#footer.apu-footer) #galeria > .container-fluid,
html body:has(#footer.apu-footer) #banner_slider > .c-lg {
    max-width: 1160px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 24px !important;
    padding-right: 24px !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

@media (max-width: 767.98px) {
    /*
     * Causa do desalinho: #maps/.container forçado a max-width 1160
     * (full-bleed) enquanto #perguntas_frequentes/.container mantém o
     * max-width responsivo do Bootstrap (ex. 540px @sm); #galeria usa
     * .container-fluid.px-3 (sempre 100%). Alinha padding e max-width.
     */
    html body:has(#footer.apu-footer) #bloco3 > .container,
    html body:has(#footer.apu-footer) #sobre_nos > .container,
    html body:has(#footer.apu-footer) #perguntas_frequentes > .container,
    html body:has(#footer.apu-footer) #maps > .container,
    html body:has(#footer.apu-footer) #galeria > .container,
    html body:has(#footer.apu-footer) #galeria > .container-fluid,
    html body:has(#footer.apu-footer) #banner_slider > .c-lg {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }

    html body:has(#footer.apu-footer) #maps > .container,
    html body:has(#footer.apu-footer) #galeria > .container,
    html body:has(#footer.apu-footer) #galeria > .container-fluid {
        max-width: 100% !important;
        box-sizing: border-box !important;
    }
}

/* Entre 576–767 Bootstrap .container do FAQ fica em 540px; espelha no mapa/galeria */
@media (min-width: 576px) and (max-width: 767.98px) {
    html body:has(#footer.apu-footer) #maps > .container,
    html body:has(#footer.apu-footer) #galeria > .container,
    html body:has(#footer.apu-footer) #galeria > .container-fluid {
        max-width: 540px !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
}

/* #banner_slider fora da lista global de seções — ritmo 32/24; zera mt-3 */
html body:has(#footer.apu-footer) #banner_slider {
    padding-top: 32px !important;
    padding-bottom: 32px !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

@media (max-width: 767.98px) {
    html body:has(#footer.apu-footer) #banner_slider {
        padding-top: 24px !important;
        padding-bottom: 24px !important;
    }
}

/* Mapa guia (sem .mapw — dmx-html em .d-flex.rounded-3) */
html body:has(#footer.apu-footer) #maps .d-flex.rounded-3.overflow-hidden,
html body:has(#footer.apu-footer) #maps #view1 {
    border-radius: var(--lt-radius-lg) !important;
    box-shadow: none !important;
    overflow: hidden !important;
}

html body:has(#footer.apu-footer) #maps #view1 iframe,
html body:has(#footer.apu-footer) #maps .d-flex.rounded-3.overflow-hidden iframe {
    border-radius: var(--lt-radius-lg) !important;
    box-shadow: none !important;
    display: block;
    width: 100%;
}

/* =============================================================================
 * SOBRE NÓS — #sobre_nos
 * Fundo via dmx-style cor_primaria — NÃO forçar background.
 * ============================================================================= */

html body #sobre_nos {
    padding-top: 64px !important;
    padding-bottom: 64px !important;
}

html body #sobre_nos > .container.wappler-block,
html body #sobre_nos .container.wappler-block {
    max-width: 1160px !important;
    margin-left: auto;
    margin-right: auto;
}

html body #sobre_nos .row {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    gap: 64px !important;
    align-items: center;
    --bs-gutter-x: 0;
}

html body #sobre_nos .row > [class*="col"] {
    width: 100% !important;
    max-width: 100% !important;
    flex: none !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Coluna de texto: Bootstrap text-center → esquerda */
html body #sobre_nos .row > [class*="col"].text-center {
    text-align: left !important;
}

html body #sobre_nos .row > [class*="col"].text-center > .col.align-self-center,
html body #sobre_nos .col.align-self-center:has(> h4) {
    display: flex !important;
    flex-direction: column;
    align-items: flex-start !important;
    text-align: left !important;
}

html body #sobre_nos h4 {
    font-family: var(--lt-font-body) !important;
    font-size: 22px !important;
    font-weight: 500 !important;
    line-height: 1.55 !important;
    letter-spacing: 0 !important;
    color: var(--lt-on-p) !important;
    text-transform: none !important;
}

/*
 * Conteúdo do editor (dmx-html em h4) traz style="color:…" / text-align
 * em span/p/strong — vence herança do h4. Força contraste no fundo
 * cor_primaria. Botões (.btn) são irmãos do h4 — fora destes seletores.
 */
html body #sobre_nos h4,
html body #sobre_nos h4 :is(p, span, li, strong, em, b, i, u, mark, div, h1, h2, h3, h5, h6),
html body #sobre_nos .col.align-self-center > :is(p, span, li, strong, em, div):not(.btn) {
    color: var(--lt-on-p) !important;
    text-align: left !important;
}

html body #sobre_nos h4 *,
html body #sobre_nos h4 .ql-align-center,
html body #sobre_nos h4 .ql-align-right,
html body #sobre_nos h4 .ql-align-justify,
html body #sobre_nos h4 [style*="text-align"],
html body #sobre_nos h4 [style*="color"] {
    color: var(--lt-on-p) !important;
    text-align: left !important;
}

html body #sobre_nos h4 p {
    font-size: 16.5px !important;
    line-height: 1.65 !important;
    opacity: .9;
}

html body #sobre_nos h4 p:last-child {
    margin-bottom: 0;
}

html body #sobre_nos img {
    border-radius: var(--lt-radius-xl) !important;
    width: 100%;
    height: auto;
    object-fit: cover;
}

html body #sobre_nos .btn,
html body #sobre_nos a.btn {
    height: 50px !important;
    min-height: 50px !important;
    border-radius: var(--lt-radius-sm) !important;
    display: inline-flex !important;
    align-items: center;
    align-self: flex-start !important;
    margin-left: 0 !important;
    font-weight: 700 !important;
    font-family: var(--lt-font-body);
    box-shadow: none !important;
    transform: none !important;
}

html body #sobre_nos .btn:hover,
html body #sobre_nos a.btn:hover {
    transform: none !important;
}

@media (max-width: 767.98px) {
    html body #sobre_nos .row {
        grid-template-columns: 1fr !important;
        gap: 32px !important;
    }

    html body #sobre_nos h4 {
        font-size: 18px !important;
    }
}

/* =============================================================================
 * VÍDEO — #video / .ytwrap
 * ============================================================================= */

html body #video .ytwrap {
    aspect-ratio: 16 / 9;
    border-radius: var(--lt-radius-xl) !important;
    overflow: hidden !important;
    box-shadow: var(--lt-shadow-float) !important;
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
}

html body #video .ytwrap > *,
html body #video .ytwrap iframe {
    border: 0;
    border-radius: 0 !important;
}

html body #video .yt-fallback__icon,
html body #video .ytwrap .fa-play,
html body #video .ytwrap .btn-play {
    width: 76px !important;
    height: 76px !important;
    min-width: 76px;
    min-height: 76px;
    border-radius: 50% !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    font-size: 28px !important;
}

/* =============================================================================
 * CTA — #CTA .cta
 * Sem forçar background (gradiente/cores do cliente na base).
 * ============================================================================= */

html body #CTA .cta {
    border-radius: var(--lt-radius-xl) !important;
    padding: 48px !important;
    text-align: center;
    box-shadow: none !important;
}

html body #CTA .cta-title {
    font-family: var(--lt-font-display) !important;
    font-size: 34px !important;
    font-weight: 700 !important;
    letter-spacing: -.02em !important;
    line-height: 1.2 !important;
    color: var(--lt-on-p) !important;
    text-transform: none !important;
    margin-bottom: 1.25rem !important;
}

html body #CTA .cta-title p {
    font-family: var(--lt-font-body) !important;
    font-size: 16.5px !important;
    font-weight: 400 !important;
    line-height: 1.65 !important;
    color: var(--lt-on-p) !important;
    opacity: .9;
    letter-spacing: 0 !important;
}

html body #CTA .btn-white {
    height: 54px !important;
    min-height: 54px !important;
    border-radius: var(--lt-radius-sm) !important;
    padding: 0 28px !important;
    font-weight: 700 !important;
    font-family: var(--lt-font-body);
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    box-shadow: none !important;
    transform: none !important;
}

html body #CTA .btn-white:hover {
    transform: none !important;
}

@media (max-width: 767.98px) {
    html body #CTA .cta {
        padding: 32px 24px !important;
    }

    html body #CTA .cta-title {
        font-size: 26px !important;
    }
}

/* =============================================================================
 * FAQ — #perguntas_frequentes / #accordionFAQ / #accordionFaq / .apu-accordion
 * ============================================================================= */

html body #perguntas_frequentes .accordion,
html body #accordionFAQ.accordion,
html body #accordionFaq.accordion,
html body .accordion.apu-accordion {
    display: flex !important;
    flex-direction: column;
    gap: 12px !important;
}

html body #perguntas_frequentes .accordion-item,
html body #accordionFAQ .accordion-item,
html body #accordionFaq .accordion-item,
html body .apu-accordion .accordion-item {
    border: 1px solid var(--lt-border) !important;
    border-radius: var(--lt-radius-md) !important;
    overflow: hidden;
    margin-bottom: 0 !important;
    background: #fff !important;
    box-shadow: none !important;
}

html body #perguntas_frequentes .accordion-item:has(.accordion-button:not(.collapsed)),
html body #accordionFAQ .accordion-item:has(.accordion-button:not(.collapsed)),
html body #accordionFaq .accordion-item:has(.accordion-button:not(.collapsed)),
html body .apu-accordion .accordion-item:has(.accordion-button:not(.collapsed)) {
    border-color: var(--lt-p) !important;
}

html body #perguntas_frequentes .accordion-button,
html body #accordionFAQ .accordion-button,
html body #accordionFaq .accordion-button,
html body .apu-accordion .accordion-button {
    padding: 20px 22px !important;
    font-family: var(--lt-font-body) !important;
    font-size: 17px !important;
    font-weight: 600 !important;
    color: var(--lt-text) !important;
    background: #fff !important;
    box-shadow: none !important;
    text-transform: none !important;
    border-radius: var(--lt-radius-md) !important;
}

html body #perguntas_frequentes .accordion-button:not(.collapsed),
html body #accordionFAQ .accordion-button:not(.collapsed),
html body #accordionFaq .accordion-button:not(.collapsed),
html body .apu-accordion .accordion-button:not(.collapsed) {
    color: var(--lt-text) !important;
    background: #fff !important;
    box-shadow: none !important;
}

html body #perguntas_frequentes .accordion-button:focus,
html body #accordionFAQ .accordion-button:focus,
html body #accordionFaq .accordion-button:focus,
html body .apu-accordion .accordion-button:focus {
    box-shadow: none !important;
    border-color: transparent !important;
}

html body #perguntas_frequentes .accordion-button::after,
html body #accordionFAQ .accordion-button::after,
html body #accordionFaq .accordion-button::after,
html body .apu-accordion .accordion-button::after {
    background-image: none !important;
    mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='black'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
    -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='black'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
    mask-size: 1rem;
    -webkit-mask-size: 1rem;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    mask-position: center;
    -webkit-mask-position: center;
    background-color: var(--lt-p) !important;
    width: 1rem;
    height: 1rem;
}

html body #perguntas_frequentes .accordion-button:not(.collapsed)::after,
html body #accordionFAQ .accordion-button:not(.collapsed)::after,
html body #accordionFaq .accordion-button:not(.collapsed)::after,
html body .apu-accordion .accordion-button:not(.collapsed)::after {
    transform: rotate(180deg) !important;
}

html body #perguntas_frequentes .accordion-button.collapsed::after,
html body #accordionFAQ .accordion-button.collapsed::after,
html body #accordionFaq .accordion-button.collapsed::after,
html body .apu-accordion .accordion-button.collapsed::after {
    transform: none !important;
}

html body #perguntas_frequentes .accordion-body,
html body #accordionFAQ .accordion-body,
html body #accordionFaq .accordion-body,
html body .apu-accordion .accordion-body {
    padding: 0 22px 20px !important;
    font-family: var(--lt-font-body);
    font-size: 15.5px !important;
    line-height: 1.65 !important;
    color: var(--lt-text-2) !important;
}

/* =============================================================================
 * MAPA — #maps .mapw
 * ============================================================================= */

html body #maps .mapw {
    border-radius: var(--lt-radius-xl) !important;
    overflow: hidden !important;
    border: 1px solid var(--lt-border) !important;
    box-shadow: var(--lt-shadow-float) !important;
}

html body #maps .mapw iframe,
html body #maps .mapw > * {
    border-radius: 0 !important;
    box-shadow: none !important;
    display: block;
    width: 100%;
}

/* =============================================================================
 * GALERIA — #galeria / #swiper_galeria / .gslide
 * Não alterar --swiper-* (dmx-style do cliente).
 * ============================================================================= */

html body #galeria .gslide,
html body #swiper_galeria .gslide {
    border-radius: var(--lt-radius-lg) !important;
    overflow: hidden !important;
}

html body #galeria .gslide a,
html body #swiper_galeria .gslide a {
    display: block;
    overflow: hidden;
    border-radius: var(--lt-radius-lg) !important;
    height: 280px;
}

html body #galeria .gslide img,
html body #swiper_galeria .gslide img {
    width: 100% !important;
    height: 280px !important;
    object-fit: cover !important;
    border-radius: var(--lt-radius-lg) !important;
    box-shadow: none !important;
}

/* =============================================================================
 * RODAPÉ — hosp (.foot / .foot-in) — #footer.foot:not(.foot-vivareal)
 * Markup: .foot-logo → .foot-addr → .foot-slabel → .srow → .foot-div → .foot-copy
 * (sem .foot-contact-btn). Layout via grid-template-areas; não altera HTML.
 * ============================================================================= */

html body #footer.foot:not(.foot-vivareal) {
    padding: 64px 0 28px !important;
}

html body #footer.foot:not(.foot-vivareal) .foot-in {
    max-width: 1160px !important;
    margin: 0 auto !important;
    padding: 0 24px !important;
    text-align: left !important;
    display: grid !important;
    grid-template-columns: 1fr auto !important;
    grid-template-areas:
        "logo  label"
        "addr  social"
        "div   div"
        "copy  copy" !important;
    gap: 16px 40px !important;
    align-items: start !important;
}

html body #footer.foot:not(.foot-vivareal) .foot-logo {
    grid-area: logo !important;
    border-radius: var(--lt-radius-sm) !important;
    margin: 0 0 16px !important;
    display: block !important;
}

html body #footer.foot:not(.foot-vivareal) .foot-addr {
    grid-area: addr !important;
    font-family: var(--lt-font-body);
    font-size: 15px !important;
    line-height: 1.65 !important;
    color: var(--lt-on-p) !important;
    opacity: .85 !important;
    text-align: left !important;
    margin: 0 !important;
}

html body #footer.foot:not(.foot-vivareal) .foot-slabel {
    grid-area: label !important;
    font-family: var(--lt-font-body) !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
    color: var(--lt-on-p) !important;
    opacity: .75 !important;
    margin: 0 0 14px !important;
    text-align: left !important;
}

html body #footer.foot:not(.foot-vivareal) .srow {
    grid-area: social !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    justify-content: flex-start !important;
    margin: 0 !important;
}

html body #footer.foot:not(.foot-vivareal) .sbtn {
    width: 44px !important;
    height: 44px !important;
    border-radius: 50% !important;
    background: color-mix(in srgb, var(--lt-on-p) 16%, transparent) !important;
    color: var(--lt-on-p) !important;
    box-shadow: none !important;
    transform: none !important;
}

html body #footer.foot:not(.foot-vivareal) .sbtn:hover {
    background: color-mix(in srgb, var(--lt-on-p) 26%, transparent) !important;
    color: var(--lt-on-p) !important;
    box-shadow: none !important;
    transform: none !important;
}

html body #footer.foot:not(.foot-vivareal) .foot-div {
    grid-area: div !important;
    height: 0 !important;
    margin: 8px 0 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
}

html body #footer.foot:not(.foot-vivareal) .foot-copy {
    grid-area: copy !important;
    font-family: var(--lt-font-body);
    font-size: 13px !important;
    color: var(--lt-on-p) !important;
    opacity: .75 !important;
    text-align: left !important;
    margin: 0 !important;
    border-top: 1px solid color-mix(in srgb, var(--lt-on-p) 18%, transparent) !important;
    padding: 20px 0 !important;
}

html body #footer.foot:not(.foot-vivareal) .foot-copy a {
    color: var(--lt-on-p) !important;
    opacity: .9 !important;
    text-decoration: none;
}

html body #footer.foot:not(.foot-vivareal),
html body #footer.foot:not(.foot-vivareal) .foot-in,
html body #footer.foot:not(.foot-vivareal) .foot-in p,
html body #footer.foot:not(.foot-vivareal) .foot-in a {
    color: var(--lt-on-p) !important;
}

@media (max-width: 767.98px) {
    html body #footer.foot:not(.foot-vivareal) {
        padding: 48px 0 24px !important;
    }

    html body #footer.foot:not(.foot-vivareal) .foot-in {
        grid-template-columns: 1fr !important;
        grid-template-areas:
            "logo"
            "addr"
            "label"
            "social"
            "div"
            "copy" !important;
        gap: 28px !important;
        text-align: left !important;
    }

    html body #footer.foot:not(.foot-vivareal) .foot-copy {
        padding: 20px 0 !important;
    }
}

/* =============================================================================
 * RODAPÉ — #footer.foot.foot-vivareal
 * Fundo via dmx-style cor_primaria — NÃO forçar background.
 * (Pedido truncado em "títulos das"; tipografia dos .foot-slabel + contraste --lt-on-p.)
 * ============================================================================= */

html body #footer.foot.foot-vivareal,
html body #footer.foot-vivareal {
    padding: 64px 0 28px !important;
}

html body #footer .foot-grid {
    gap: 40px !important;
    padding-bottom: 36px !important;
}

html body #footer .foot-col--brand .foot-logo,
html body #footer .foot-logo {
    border-radius: var(--lt-radius-sm) !important;
    margin: 0 0 16px !important;
}

html body #footer .foot-col--brand .foot-addr,
html body #footer .foot-addr {
    font-family: var(--lt-font-body);
    font-size: 15px !important;
    line-height: 1.65 !important;
    color: var(--lt-on-p) !important;
    opacity: .85;
    text-align: left;
}

html body #footer .foot-slabel {
    font-family: var(--lt-font-body) !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
    color: var(--lt-on-p) !important;
    opacity: .7;
    margin-bottom: 14px !important;
}

html body #footer .foot-nav {
    gap: 4px !important;
}

html body #footer .foot-nav a {
    font-family: var(--lt-font-body);
    font-size: 15px !important;
    color: var(--lt-on-p) !important;
    opacity: .88;
    min-height: 40px;
    text-decoration: none;
}

html body #footer .foot-nav a:hover {
    opacity: 1;
    color: var(--lt-on-p) !important;
}

html body #footer .foot-contact-btn {
    height: 48px !important;
    min-height: 48px !important;
    border-radius: var(--lt-radius-sm) !important;
    font-family: var(--lt-font-body);
    font-weight: 600 !important;
    color: var(--lt-on-p) !important;
    box-shadow: none !important;
    transform: none !important;
}

html body #footer .foot-contact-btn:hover {
    transform: none !important;
}

html body #footer .foot-social .sbtn,
html body #footer .sbtn {
    width: 44px !important;
    height: 44px !important;
    border-radius: 50% !important;
    color: var(--lt-on-p) !important;
    box-shadow: none !important;
    transform: none !important;
}

html body #footer .foot-social .sbtn:hover,
html body #footer .sbtn:hover {
    transform: none !important;
    color: var(--lt-on-p) !important;
}

html body #footer .foot-bottom {
    border-top: 1px solid color-mix(in srgb, var(--lt-on-p) 18%, transparent) !important;
    padding: 20px 24px !important;
}

html body #footer .foot-copy,
html body #footer .foot-bottom .foot-copy {
    font-family: var(--lt-font-body);
    font-size: 13px !important;
    color: var(--lt-on-p) !important;
    opacity: .65;
}

html body #footer .foot-copy a {
    color: var(--lt-on-p) !important;
    opacity: .9;
    text-decoration: none;
}

@media (max-width: 767.98px) {
    html body #footer.foot-vivareal {
        padding: 48px 0 24px !important;
    }

    html body #footer .foot-grid {
        gap: 28px !important;
    }
}

/* =============================================================================
 * LINKS — página /links/:slug (link na bio)
 * Escopo: html body:has(.btn-stack). Não sobrescrever body background
 * (dmx-style cor_primaria). Texto só em cartões brancos.
 *
 * Ao carregar este arquivo na links, o que atinge sem escopo:
 *   - :root (--lt-* tokens) — desejado
 *   - demais regras usam .nav-wrap, #hero_wrapper, #footer, .sec-title,
 *     .eyebrow, #whatsapp_link, etc. — não existem na links → sem efeito
 * Neutralização: nenhuma regra global indesejada a anular.
 * ============================================================================= */

/* Fundo decorativo — blobs suaves / reduced-motion */
html body:has(.btn-stack) .bg-canvas::before,
html body:has(.btn-stack) .bg-canvas::after {
    background: radial-gradient(circle, color-mix(in srgb, #fff 22%, transparent) 0%, transparent 70%) !important;
    opacity: .35 !important;
    animation-duration: 28s !important;
}

html body:has(.btn-stack) .bg-grain {
    opacity: .22 !important;
}

@media (prefers-reduced-motion: reduce) {
    html body:has(.btn-stack) .bg-canvas::before,
    html body:has(.btn-stack) .bg-canvas::after,
    html body:has(.btn-stack) .logo-ring,
    html body:has(.btn-stack) .profile-card,
    html body:has(.btn-stack) .btn-link-item {
        animation: none !important;
    }
}

html body:has(.btn-stack) .page-wrapper {
    max-width: 480px !important;
    padding: 32px 16px !important;
    gap: 0 !important;
}

/* Profile — cartão branco */
html body:has(.btn-stack) .profile-card {
    width: 100% !important;
    background: #fff !important;
    border: 1px solid var(--lt-border) !important;
    border-radius: var(--lt-radius-xl) !important;
    box-shadow: 0 12px 32px rgba(16, 35, 31, .10) !important;
    padding: 28px 24px !important;
    margin-bottom: 20px !important;
    align-items: center !important;
    text-align: center !important;
    animation-duration: .4s !important;
}

html body:has(.btn-stack) .logo-wrapper {
    margin-bottom: 16px !important;
}

html body:has(.btn-stack) .logo-ring {
    inset: -4px !important;
    background: var(--lt-border) !important;
    opacity: 1 !important;
    animation: none !important;
    /* anel discreto 2px via mask */
    -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 2px), #000 calc(100% - 2px)) !important;
    mask: radial-gradient(farthest-side, transparent calc(100% - 2px), #000 calc(100% - 2px)) !important;
}

html body:has(.btn-stack) .logo-ring-mask {
    inset: -2px !important;
    background: #fff !important;
}

html body:has(.btn-stack) .logo-img {
    width: 96px !important;
    height: 96px !important;
    border-radius: 50% !important;
    object-fit: contain !important;
    background: #fff !important;
    padding: 8px !important;
    border: 1px solid var(--lt-border) !important;
}

html body:has(.btn-stack) .profile-name {
    font-family: var(--lt-font-display) !important;
    font-size: 24px !important;
    font-weight: 700 !important;
    letter-spacing: -.02em !important;
    line-height: 1.2 !important;
    color: var(--lt-text) !important;
    margin-bottom: 8px !important;
}

html body:has(.btn-stack) .profile-desc {
    font-family: var(--lt-font-body) !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    line-height: 1.6 !important;
    color: var(--lt-text-2) !important;
    max-width: 340px !important;
}

/* Stack de links */
html body:has(.btn-stack) .btn-stack {
    width: 100% !important;
    gap: 12px !important;
}

html body:has(.btn-stack) .btn-link-item {
    min-height: 60px !important;
    padding: 0 18px !important;
    border-radius: var(--lt-radius-lg) !important;
    background: #fff !important;
    border: 1px solid var(--lt-border) !important;
    color: var(--lt-text) !important;
    font-family: var(--lt-font-body) !important;
    box-shadow: 0 2px 8px rgba(16, 35, 31, .06) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    animation-duration: .4s !important;
    transform: none !important;
}

html body:has(.btn-stack) .btn-link-item::before {
    display: none !important;
}

html body:has(.btn-stack) .btn-link-item:hover {
    background: #fff !important;
    border-color: var(--lt-border-strong) !important;
    box-shadow: 0 12px 28px rgba(16, 35, 31, .12) !important;
    transform: translateY(-2px) !important;
    color: var(--lt-text) !important;
}

html body:has(.btn-stack) .btn-link-item:active {
    transform: translateY(0) !important;
    box-shadow: 0 2px 8px rgba(16, 35, 31, .06) !important;
}

html body:has(.btn-stack) .btn-link-label {
    font-family: var(--lt-font-body) !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    color: var(--lt-text) !important;
    letter-spacing: .02em !important;
}

html body:has(.btn-stack) .btn-link-icon {
    width: 40px !important;
    height: 40px !important;
    border-radius: 12px !important;
    font-size: 1.1rem !important;
}

html body:has(.btn-stack) .btn-link-item:hover .btn-link-icon {
    transform: none !important;
}

html body:has(.btn-stack) .btn-link-arrow {
    color: var(--lt-muted) !important;
    opacity: .7 !important;
}

html body:has(.btn-stack) .btn-link-item:hover .btn-link-arrow {
    opacity: 1 !important;
    transform: translateX(3px) !important;
    color: var(--lt-muted) !important;
}

/* Footer — pílula branca */
html body:has(.btn-stack) footer.page-footer {
    position: relative !important;
    z-index: 2 !important;
    padding: 8px 16px 28px !important;
    display: flex !important;
    justify-content: center !important;
}

html body:has(.btn-stack) .footer-badge {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 8px 14px !important;
    border-radius: 999px !important;
    background: #fff !important;
    border: 1px solid var(--lt-border) !important;
    color: var(--lt-text-2) !important;
    font-family: var(--lt-font-body) !important;
    font-size: 13px !important;
    text-decoration: none !important;
    box-shadow: 0 2px 8px rgba(16, 35, 31, .06) !important;
}

html body:has(.btn-stack) .footer-badge:hover {
    background: #fff !important;
    color: var(--lt-text) !important;
    border-color: var(--lt-border-strong) !important;
}

html body:has(.btn-stack) .footer-badge #footer-year {
    color: inherit !important;
}

@media (max-width: 480px) {
    html body:has(.btn-stack) .page-wrapper {
        padding: 28px 16px !important;
    }

    html body:has(.btn-stack) .btn-link-item {
        min-height: 58px !important;
    }
}

/* =============================================================================
 * FORM — página /form/:slug (lead público)
 * Escopo: html body:has(.form-card). Não altera public-forms.css.
 *
 * Ao carregar este arquivo na form, o que atinge sem escopo:
 *   - :root (--lt-* tokens) — desejado
 *   - demais regras (.nav-wrap, #hero_wrapper, #footer, .sec-title,
 *     .eyebrow, #whatsapp_link…) — não existem na form → sem efeito
 * Neutralização: nenhuma regra global indesejada a anular.
 * ============================================================================= */

html body:has(.form-card) {
    font-family: var(--lt-font-body) !important;
    color: var(--lt-text-2) !important;
    background: #F6F8F7 !important;
    background-image: none !important;
}

html body:has(.form-card)::before,
html body:has(.form-card)::after {
    display: none !important;
    content: none !important;
}

html body:has(.form-card) .page-wrap {
    background: transparent !important;
    padding: 48px 16px 32px !important;
}

html body:has(.form-card) .form-card {
    max-width: 560px !important;
    background: #fff !important;
    border: 1px solid var(--lt-border) !important;
    border-radius: var(--lt-radius-xl) !important;
    box-shadow: 0 12px 32px rgba(16, 35, 31, .10) !important;
    overflow: hidden !important;
    animation: none !important;
}

html body:has(.form-card) .form-card::before {
    display: none !important;
    height: 0 !important;
    background: none !important;
}

html body:has(.form-card) .form-card-header {
    padding: 28px 28px 8px !important;
    text-align: center !important;
    background: #fff !important;
    border-bottom: 1px solid var(--lt-border) !important;
}

html body:has(.form-card) .form-logo {
    height: auto !important;
    max-height: 64px !important;
    width: auto !important;
    max-width: 200px !important;
    object-fit: contain !important;
    margin: 0 auto 16px !important;
    display: block !important;
}

html body:has(.form-card) .form-card-title {
    font-family: var(--lt-font-display) !important;
    font-size: 24px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    letter-spacing: -.02em !important;
    color: var(--lt-text) !important;
}

html body:has(.form-card) .form-card-body {
    padding: 20px 28px 28px !important;
}

html body:has(.form-card) .field-label {
    font-family: var(--lt-font-body) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    color: var(--lt-text-2) !important;
    margin-bottom: 8px !important;
}

html body:has(.form-card) .field-label i {
    margin-right: 6px;
    opacity: .75;
}

html body:has(.form-card) .form-control,
html body:has(.form-card) .form-select,
html body:has(.form-card) .iti input {
    height: 48px !important;
    min-height: 48px !important;
    border-radius: var(--lt-radius-sm) !important;
    border: 1px solid var(--lt-border-strong) !important;
    background-color: #fff !important; /* não usar shorthand — preserva bg-image (validação BS / seta) */
    font-family: var(--lt-font-body) !important;
    font-size: 15px !important;
    color: var(--lt-text) !important;
    box-shadow: none !important;
}

/* Seta: public-forms usa .select-wrap::after (FA \f107) — FA pode falhar (quadrado vazio).
   Substituir por chevron CSS mask (sem fonte). .select-wrap já é position:relative.
   Sem transição/rotação no original — não adicionar. */
html body:has(.form-card) .select-wrap {
    position: relative !important;
}

html body:has(.form-card) .select-wrap .form-select,
html body:has(.form-card) .form-select {
    padding-right: 40px !important;
}

html body:has(.form-card) .select-wrap::after {
    content: "" !important;
    font-family: inherit !important;
    font-weight: normal !important;
    font-size: 0 !important;
    color: transparent !important;
    width: 12px !important;
    height: 12px !important;
    position: absolute !important;
    right: 16px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    background-color: var(--lt-muted) !important;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6l5 5 5-5'/%3E%3C/svg%3E") center / contain no-repeat !important;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6l5 5 5-5'/%3E%3C/svg%3E") center / contain no-repeat !important;
    pointer-events: none !important;
}

html body:has(.form-card) .select-wrap:focus-within::after {
    background-color: var(--lt-p, #1B3A5C) !important;
}

html body:has(.form-card) textarea.form-control {
    height: auto !important;
    min-height: 110px !important;
    padding-top: 12px !important;
    padding-bottom: 12px !important;
}

html body:has(.form-card) .form-control::placeholder,
html body:has(.form-card) .iti input::placeholder {
    color: var(--lt-muted) !important;
    opacity: 1 !important;
}

html body:has(.form-card) .form-control:focus,
html body:has(.form-card) .form-select:focus,
html body:has(.form-card) .iti input:focus {
    border-color: var(--lt-p, #1B3A5C) !important;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--lt-p, #1B3A5C) 18%, transparent) !important;
    outline: none !important;
    background-color: #fff !important;
}

html body:has(.form-card) .form-control.is-valid,
html body:has(.form-card) .form-select.is-valid,
html body:has(.form-card) .iti input.is-valid {
    border-color: #1F9D55 !important;
    background-color: #fff !important;
}

html body:has(.form-card) .form-control.is-invalid,
html body:has(.form-card) .form-select.is-invalid,
html body:has(.form-card) .iti input.is-invalid {
    border-color: #D64545 !important;
    background-color: #fff !important;
}

html body:has(.form-card) .invalid-feedback {
    font-family: var(--lt-font-body) !important;
    font-size: 12.5px !important;
    color: #D64545 !important;
}

/* Seção hospedagem — grids já existem; reforço tema */
html body:has(.form-card) #hospegagem .date-row,
html body:has(.form-card) #hospegagem .people-row {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 12px !important;
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
    padding: 0 !important;
}

html body:has(.form-card) .field-section-label {
    font-family: var(--lt-font-body) !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: .06em !important;
    text-transform: uppercase !important;
    color: var(--lt-p, #1B3A5C) !important;
    background: color-mix(in srgb, var(--lt-p, #1B3A5C) 10%, #fff) !important;
    border-radius: 999px !important;
}

html body:has(.form-card) .field-section-line {
    background: var(--lt-border) !important;
}

/* LGPD */
html body:has(.form-card) .form-check-input {
    width: 20px !important;
    height: 20px !important;
    margin-top: .15em !important;
    border-radius: 6px !important;
    border: 1px solid var(--lt-border-strong) !important;
    background-color: #fff !important;
    box-shadow: none !important;
}

html body:has(.form-card) .form-check-input:checked {
    background-color: var(--lt-p, #1B3A5C) !important;
    border-color: var(--lt-p, #1B3A5C) !important;
}

html body:has(.form-card) .form-check-input:focus {
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--lt-p, #1B3A5C) 18%, transparent) !important;
    border-color: var(--lt-p, #1B3A5C) !important;
}

html body:has(.form-card) .form-check-label {
    font-family: var(--lt-font-body) !important;
    font-size: 13.5px !important;
    line-height: 1.5 !important;
    color: var(--lt-text-2) !important;
}

html body:has(.form-card) .form-check-label a {
    color: var(--lt-p, #1B3A5C) !important;
    text-decoration: underline !important;
}

/* Botão — background via dmx-style cor_secundaria */
html body:has(.form-card) .btn-submit {
    width: 100% !important;
    height: 52px !important;
    min-height: 52px !important;
    padding: 0 18px !important;
    border-radius: var(--lt-radius-sm) !important;
    border: none !important;
    font-family: var(--lt-font-body) !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    color: var(--brand-on-secondary, #fff) !important;
    box-shadow: none !important;
    transform: none !important;
    /* background — não forçar */
}

html body:has(.form-card) .btn-submit:hover {
    transform: translateY(-2px) !important;
    box-shadow: none !important;
    filter: none !important;
    color: var(--brand-on-secondary, #fff) !important;
    /* background — não forçar */
}

html body:has(.form-card) .btn-submit:active {
    transform: translateY(0) !important;
}

html body:has(.form-card) .btn-submit :is(i, span, svg),
html body:has(.form-card) .btn-submit .unir-submit-spinner {
    color: currentColor !important;
    border-color: currentColor !important;
}

/* Rodapé */
html body:has(.form-card) footer.form-footer {
    background: transparent !important;
    text-align: center !important;
    padding: 28px 16px 16px !important;
    width: 100% !important;
    max-width: 560px !important;
}

html body:has(.form-card) .form-footer .foot-slabel {
    font-family: var(--lt-font-body) !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
    color: var(--lt-muted) !important;
    margin-bottom: 12px !important;
}

html body:has(.form-card) .form-footer .srow {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    justify-content: center !important;
}

html body:has(.form-card) .form-footer .sbtn {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    border-radius: 50% !important;
    border: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    /* cores inline — não forçar */
    box-shadow: none !important;
    transform: none !important;
}

html body:has(.form-card) .form-footer .foot-copy {
    font-family: var(--lt-font-body) !important;
    font-size: 13px !important;
    color: var(--lt-muted) !important;
}

html body:has(.form-card) .form-footer .foot-copy a {
    color: var(--lt-p, #1B3A5C) !important;
    text-decoration: none !important;
}

@media (max-width: 575.98px) {
    html body:has(.form-card) .page-wrap {
        padding: 24px 16px 24px !important;
    }

    html body:has(.form-card) .form-card {
        border-radius: var(--lt-radius-lg) !important;
        margin: 0 !important;
        width: 100% !important;
    }

    html body:has(.form-card) .form-card-header,
    html body:has(.form-card) .form-card-body {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }

    html body:has(.form-card) .form-card-header {
        padding-top: 20px !important;
        padding-bottom: 8px !important;
    }

    html body:has(.form-card) .form-card-body {
        padding-top: 16px !important;
        padding-bottom: 20px !important;
    }

    html body:has(.form-card) #hospegagem .date-row,
    html body:has(.form-card) #hospegagem .people-row {
        grid-template-columns: 1fr !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    html body:has(.form-card) .form-card,
    html body:has(.form-card) .btn-submit {
        animation: none !important;
        transition: none !important;
    }

    html body:has(.form-card) .btn-submit:hover {
        transform: none !important;
    }
}

/* =============================================================================
 * CONFIRMAR AGENDA — /confirmar_agenda/:slug/:id
 * Escopo exclusivo: html body:has(.agenda-card)
 * ============================================================================= */

html body:has(.agenda-card) {
    font-family: var(--lt-font-body) !important;
    color: var(--lt-text-2) !important;
    background: #F6F8F7 !important;
    background-image: none !important;
}

html body:has(.agenda-card) .tenant-public-page {
    background: #F6F8F7 !important;
    font-family: var(--lt-font-body) !important;
}

html body:has(.agenda-card) .agenda-card {
    background: #fff !important;
    border: 1px solid var(--lt-border) !important;
    border-radius: var(--lt-radius-xl) !important;
    box-shadow: 0 12px 32px rgba(16, 35, 31, .10) !important;
    max-width: 560px !important;
    margin: 0 auto !important;
    overflow: hidden !important;
}

html body:has(.agenda-card) .agenda-intro {
    font-family: var(--lt-font-display) !important;
    font-size: 24px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
    color: var(--lt-text) !important;
    padding: 28px 28px 8px !important;
}

html body:has(.agenda-card) .agenda-body {
    padding: 20px 28px 28px !important;
}

html body:has(.agenda-card) .form-label {
    font-family: var(--lt-font-body) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    color: var(--lt-text-2) !important;
}

html body:has(.agenda-card) .form-control,
html body:has(.agenda-card) .form-select {
    height: 48px !important;
    min-height: 48px !important;
    border-radius: var(--lt-radius-sm) !important;
    border: 1px solid var(--lt-border-strong) !important;
    background-color: #fff !important;
    font-family: var(--lt-font-body) !important;
    font-size: 15px !important;
    color: var(--lt-text) !important;
    box-shadow: none !important;
}

html body:has(.agenda-card) .form-control:focus,
html body:has(.agenda-card) .form-select:focus {
    border-color: var(--lt-p, #1B3A5C) !important;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--lt-p, #1B3A5C) 18%, transparent) !important;
    outline: none !important;
    background-color: #fff !important;
}

/* botão — sem dmx-style; cor do cliente via landing-brand */
html body:has(.agenda-card) .btn-agenda {
    width: 100% !important;
    max-width: none !important;
    height: 52px !important;
    min-height: 52px !important;
    border-radius: var(--lt-radius-sm) !important;
    border: none !important;
    font-family: var(--lt-font-body) !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    background-color: var(--brand-secondary, var(--lt-p, #1B3A5C)) !important;
    color: var(--brand-on-secondary, #fff) !important;
    box-shadow: none !important;
}

html body:has(.agenda-card) .btn-agenda:hover {
    transform: translateY(-2px) !important;
    background-color: var(--brand-secondary, var(--lt-p, #1B3A5C)) !important;
    color: var(--brand-on-secondary, #fff) !important;
    filter: brightness(.96);
    box-shadow: none !important;
}

html body:has(.agenda-card) .agenda-footer {
    background: transparent !important;
    border-top: none !important;
}

html body:has(.agenda-card) .tenant-footnote {
    font-family: var(--lt-font-body) !important;
    font-size: 13px !important;
    color: var(--lt-muted) !important;
}

@media (max-width: 575.98px) {
    html body:has(.agenda-card) .agenda-card {
        margin-left: 16px !important;
        margin-right: 16px !important;
        border-radius: var(--lt-radius-lg) !important;
    }

    html body:has(.agenda-card) .agenda-intro,
    html body:has(.agenda-card) .agenda-body {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    html body:has(.agenda-card) .btn-agenda {
        transition: none !important;
    }

    html body:has(.agenda-card) .btn-agenda:hover {
        transform: none !important;
    }
}

/* =============================================================================
 * VENDA — /venda/:slug/:user
 * Escopo exclusivo: html body:has(.vendedor-badge)
 * (também tem .form-card — o bloco FORM pode coincidir; este bloco sobrescreve)
 * ============================================================================= */

html body:has(.vendedor-badge) {
    font-family: var(--lt-font-body) !important;
    color: var(--lt-text-2) !important;
    background: #F6F8F7 !important;
    background-image: none !important;
}

html body:has(.vendedor-badge)::before,
html body:has(.vendedor-badge)::after {
    display: none !important;
    content: none !important;
}

html body:has(.vendedor-badge) .page-wrap {
    background: transparent !important;
    background-image: none !important;
}

html body:has(.vendedor-badge) .vendedor-badge {
    font-family: var(--lt-font-body) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: var(--lt-text-2) !important;
    background: #fff !important;
    border: 1px solid var(--lt-border) !important;
    box-shadow: none !important;
}

html body:has(.vendedor-badge) .form-card {
    max-width: 640px !important;
    background: #fff !important;
    border: 1px solid var(--lt-border) !important;
    border-radius: var(--lt-radius-xl) !important;
    box-shadow: 0 12px 32px rgba(16, 35, 31, .10) !important;
    overflow: hidden !important;
}

html body:has(.vendedor-badge) .form-card::before {
    display: none !important;
    height: 0 !important;
    background: none !important;
}

html body:has(.vendedor-badge) .form-card-header {
    padding: 28px 28px 8px !important;
    text-align: center !important;
    background: #fff !important;
    border-bottom: 1px solid var(--lt-border) !important;
}

html body:has(.vendedor-badge) .form-logo {
    max-height: 64px !important;
    width: auto !important;
    object-fit: contain !important;
    margin: 0 auto 16px !important;
    display: block !important;
}

html body:has(.vendedor-badge) .form-card-title {
    font-family: var(--lt-font-display) !important;
    font-size: 24px !important;
    font-weight: 700 !important;
    color: var(--lt-text) !important;
}

html body:has(.vendedor-badge) .form-card-body {
    padding: 20px 28px 28px !important;
}

html body:has(.vendedor-badge) .field-label {
    font-family: var(--lt-font-body) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    color: var(--lt-text-2) !important;
}

html body:has(.vendedor-badge) .form-control,
html body:has(.vendedor-badge) .form-select {
    height: 48px !important;
    min-height: 48px !important;
    border-radius: var(--lt-radius-sm) !important;
    border: 1px solid var(--lt-border-strong) !important;
    background-color: #fff !important;
    font-family: var(--lt-font-body) !important;
    font-size: 15px !important;
    color: var(--lt-text) !important;
    box-shadow: none !important;
}

html body:has(.vendedor-badge) textarea.form-control {
    height: auto !important;
    min-height: 110px !important;
}

html body:has(.vendedor-badge) .form-control:focus,
html body:has(.vendedor-badge) .form-select:focus {
    border-color: var(--lt-p, #1B3A5C) !important;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--lt-p, #1B3A5C) 18%, transparent) !important;
    outline: none !important;
    background-color: #fff !important;
}

html body:has(.vendedor-badge) .form-control.is-valid,
html body:has(.vendedor-badge) .form-select.is-valid {
    border-color: #1F9D55 !important;
    background-color: #fff !important;
}

html body:has(.vendedor-badge) .form-control.is-invalid,
html body:has(.vendedor-badge) .form-select.is-invalid {
    border-color: #D64545 !important;
    background-color: #fff !important;
}

/* select: venda.css usa FA \f107 em .select-wrap::after — chevron CSS */
html body:has(.vendedor-badge) .select-wrap {
    position: relative !important;
}

html body:has(.vendedor-badge) .select-wrap .form-select,
html body:has(.vendedor-badge) .form-select {
    padding-right: 40px !important;
}

html body:has(.vendedor-badge) .select-wrap::after {
    content: "" !important;
    font-family: inherit !important;
    font-weight: normal !important;
    font-size: 0 !important;
    color: transparent !important;
    width: 12px !important;
    height: 12px !important;
    position: absolute !important;
    right: 16px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    background-color: var(--lt-muted) !important;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6l5 5 5-5'/%3E%3C/svg%3E") center / contain no-repeat !important;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6l5 5 5-5'/%3E%3C/svg%3E") center / contain no-repeat !important;
    pointer-events: none !important;
}

html body:has(.vendedor-badge) .select-wrap:focus-within::after {
    background-color: var(--lt-p, #1B3A5C) !important;
}

/* botão — sem dmx-style cor_secundaria; usa brand do landing-brand */
html body:has(.vendedor-badge) .btn-submit {
    width: 100% !important;
    height: 52px !important;
    min-height: 52px !important;
    border-radius: var(--lt-radius-sm) !important;
    border: none !important;
    font-family: var(--lt-font-body) !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    background-color: var(--brand-secondary, var(--lt-p, #1B3A5C)) !important;
    color: var(--brand-on-secondary, #fff) !important;
    box-shadow: none !important;
}

html body:has(.vendedor-badge) .btn-submit:hover {
    transform: translateY(-2px) !important;
    background-color: var(--brand-secondary, var(--lt-p, #1B3A5C)) !important;
    color: var(--brand-on-secondary, #fff) !important;
    box-shadow: none !important;
    filter: brightness(.96);
}

html body:has(.vendedor-badge) .btn-submit :is(i, span, svg),
html body:has(.vendedor-badge) .btn-submit .unir-submit-spinner {
    color: currentColor !important;
}

html body:has(.vendedor-badge) footer.form-footer {
    background: transparent !important;
}

html body:has(.vendedor-badge) .form-footer .foot-copy {
    font-family: var(--lt-font-body) !important;
    font-size: 13px !important;
    color: var(--lt-muted) !important;
}

@media (max-width: 575.98px) {
    html body:has(.vendedor-badge) .form-card {
        margin-left: 16px !important;
        margin-right: 16px !important;
        border-radius: var(--lt-radius-lg) !important;
        width: auto !important;
    }

    html body:has(.vendedor-badge) .form-card-header,
    html body:has(.vendedor-badge) .form-card-body {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    html body:has(.vendedor-badge) .btn-submit {
        transition: none !important;
    }

    html body:has(.vendedor-badge) .btn-submit:hover {
        transform: none !important;
    }
}
