/* ── Landing Page renderer ─────────────────────────────────── */

.lp-section {
    width: 100%;
    box-sizing: border-box;
}

.lp-container {
    box-sizing: border-box;
}

.lp-row {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    box-sizing: border-box;
}

.lp-col {
    box-sizing: border-box;
    min-width: 0;
}

/* Vídeo responsivo — aspect-ratio evita o problema de padding-bottom: 56.25%
   que falha quando o pai tem flex-basis:0 (altura calculada como 0 em alguns browsers) */
.lp-video-wrapper {
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    border-radius: 6px;
}

.lp-video-wrapper iframe {
    width: 100%;
    height: 100%;
    display: block;
    border: 0;
}

/* Imagens */
.lp-section img {
    max-width: 100%;
    height: auto;
}

/* ── Banner CTA widget — usa classes nativas banner-anunciar do site ── */
/* Complemento: sem foto → grid de coluna única */
.banner-anunciar--no-photo {
    grid-template-columns: 1fr;
}

/* ── Hero widget ─────────────────────────────────────────────── */
.lp-hero {
    width: 100%;
    overflow: hidden;
}

/* ── Formulário widget ───────────────────────────────────────── */
.lp-form {
    width: 100%;
}

.lp-form input:focus,
.lp-form textarea:focus,
.lp-form select:focus {
    outline: none;
    border-color: #7c6af7 !important;
    box-shadow: 0 0 0 3px rgba(124, 106, 247, .15);
}

.lp-form-btn:hover:not(:disabled) {
    opacity: .85;
}

.lp-form-status {
    padding: 12px 16px;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 16px;
    line-height: 1.4;
}

.lp-form-status--success {
    background: #d1fae5;
    color: #065f46;
    border: 1px solid #6ee7b7;
}

.lp-form-status--error {
    background: #fee2e2;
    color: #991b1b;
    border: 1px solid #fca5a5;
}

@media (max-width: 768px) {
    .lp-hero h1 { font-size: clamp(28px, 6vw, 52px) !important; }
}

/* ── Galeria widget ──────────────────────────────────────────── */
.lp-gallery__title {
    font-size: clamp(20px, 2.5vw, 26px);
    font-weight: 700;
    margin: 0 0 20px;
    color: var(--ink, #1a1a1a);
}

.lp-gallery__item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .4s cubic-bezier(0.16, 1, 0.3, 1);
}

@media (max-width: 600px) {
    .lp-gallery { grid-template-columns: repeat(2, 1fr) !important; }
}

/* ── Lightbox (mesmo estilo do detalhe de imóvel) ─────────────── */
.lightbox{position:fixed;inset:0;z-index:9999;background:rgba(0,0,0,.96);display:flex;flex-direction:column;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .3s cubic-bezier(0.22,1,.36,1)}
.lightbox.is-open{opacity:1;pointer-events:all}
.lightbox__close{position:absolute;top:20px;right:20px;width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.12);display:grid;place-items:center;color:#fff;transition:background .2s;z-index:10;cursor:pointer;border:none}
.lightbox__close:hover{background:rgba(255,255,255,.22)}
.lightbox__close svg{width:20px;height:20px}
.lightbox__counter{position:absolute;top:24px;left:50%;transform:translateX(-50%);color:rgba(255,255,255,.7);font-size:14px;font-weight:500;z-index:10;white-space:nowrap}
.lightbox__main{flex:1;width:100%;display:flex;align-items:center;justify-content:center;padding:72px 100px 16px;overflow:hidden;min-height:0}
.lightbox__main img{max-width:100%;max-height:100%;object-fit:contain;border-radius:var(--radius,8px);transition:opacity .2s}
.lightbox__main img.is-loading{opacity:0}
@media(max-width:600px){.lightbox__main{padding:64px 16px 12px}}
.lightbox__nav{position:absolute;top:50%;transform:translateY(-50%);width:52px;height:52px;border-radius:50%;background:rgba(255,255,255,.12);display:grid;place-items:center;color:#fff;transition:background .2s,transform .2s;z-index:10;cursor:pointer;border:none}
.lightbox__nav:hover{background:rgba(255,255,255,.22);transform:translateY(-50%) scale(1.08)}
.lightbox__nav:disabled{opacity:.25;cursor:default;transform:translateY(-50%)}
.lightbox__nav svg{width:22px;height:22px}
.lightbox__nav--prev{left:20px}
.lightbox__nav--next{right:20px}
@media(max-width:600px){.lightbox__nav{width:40px;height:40px}.lightbox__nav--prev{left:8px}.lightbox__nav--next{right:8px}}
.lightbox__thumbs{width:100%;display:flex;gap:6px;overflow-x:auto;padding:12px 20px 24px;scrollbar-width:none}
.lightbox__thumbs::-webkit-scrollbar{display:none}
.lightbox__thumb{flex:0 0 72px;height:52px;border-radius:6px;overflow:hidden;border:2px solid transparent;cursor:pointer;transition:border-color .2s,opacity .2s;opacity:.45}
.lightbox__thumb.is-active{border-color:#fff;opacity:1}
.lightbox__thumb:hover{opacity:.85}
.lightbox__thumb img{width:100%;height:100%;object-fit:cover}

/* ── Responsivo: colunas viram full-width e empilham verticalmente.
   Mantém flex-direction:row + flex-wrap:wrap — cada col ocupa 100% da linha
   e quebra para a próxima naturalmente (flex-direction:column quebraria o
   cálculo do flex-basis em relação à altura do container). */
@media (max-width: 768px) {
    .lp-row {
        gap: 16px;
    }

    .lp-col {
        flex: 0 0 100% !important;
        width: 100% !important;
    }
}
