/* ===== COMPONENTES LANDING PAGES HZONE ===== */

/* Hero compacto */
.lhero{position:relative;min-height:58vh;display:flex;align-items:flex-end;background:var(--bk);overflow:hidden;padding:130px 60px 60px}
.lhero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.3)}
.lhero-ov{position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,98,0,.15) 0%,transparent 50%,rgba(0,0,0,.65) 100%)}
.lhero-cnt{position:relative;max-width:780px}
.lhero h1{font-family:var(--fh);font-size:clamp(2.4rem,5vw,4.2rem);font-weight:800;color:var(--wh);line-height:1;text-transform:uppercase;letter-spacing:-1px;margin-bottom:18px}
.lhero h1 em{color:var(--or);font-style:normal}
.lhero-sub{font-family:var(--fb);font-size:1rem;font-weight:300;color:rgba(255,255,255,.72);max-width:560px;line-height:1.75;margin-bottom:28px}

/* Breadcrumb */
.bcrumb{position:relative;font-family:var(--fb);font-size:.75rem;letter-spacing:1px;text-transform:uppercase;color:rgba(255,255,255,.45);margin-bottom:18px}
.bcrumb a{color:var(--or);text-decoration:none}
.bcrumb a:hover{text-decoration:underline}

/* Grilla de tarjetas blancas (fondo claro) */
.lcards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:44px}
.lcard{background:var(--wh);border-bottom:3px solid var(--or);padding:28px}
.lcard h3{font-family:var(--fh);font-size:1.7rem;font-weight:800;color:var(--bk);text-transform:uppercase;letter-spacing:-.5px}
.lcard .lcard-sub{font-family:var(--fb);font-size:.75rem;color:#aaa;text-transform:uppercase;letter-spacing:2px;margin:4px 0 18px}
.lcard ul{list-style:none;display:flex;flex-direction:column;gap:9px}
.lcard li{display:flex;align-items:flex-start;gap:10px;font-family:var(--fb);font-size:.88rem;color:#444}
.lcard li::before{content:'►';color:var(--or);font-size:.7rem;line-height:1.7}

/* Grilla oscura de servicios */
.dgrid{display:grid;grid-template-columns:1fr 1fr;gap:2px;margin-top:36px}
.dcell{background:#141414;padding:18px 20px;border-bottom:1px solid rgba(255,255,255,.05)}
.dcell h3{font-family:var(--fh);font-size:1rem;font-weight:700;color:#fff;text-transform:uppercase}
.dcell p{font-family:var(--fb);font-size:.82rem;color:rgba(255,255,255,.6);margin-top:4px}

/* Chips de modelos */
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{background:#0a0a0a;border:1px solid rgba(255,255,255,.1);color:rgba(255,255,255,.6);font-family:var(--fb);font-size:.8rem;padding:6px 14px}

/* Pasos numerados */
.lsteps{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:44px}
.lstep{background:var(--wh);padding:26px 22px;border-bottom:3px solid var(--or)}
.lstep-num{font-family:var(--fh);font-size:2.4rem;font-weight:800;color:var(--or);line-height:1;margin-bottom:10px}
.lstep h3{font-family:var(--fh);font-size:1.15rem;font-weight:700;text-transform:uppercase;margin-bottom:8px}
.lstep p{font-family:var(--fb);font-size:.85rem;color:#666;line-height:1.65}

/* FAQ acordeón nativo */
.faq{max-width:860px;margin-top:40px}
.faq details{background:var(--wh);border-bottom:2px solid #eee;padding:0}
.faq details[open]{border-bottom-color:var(--or)}
.faq summary{font-family:var(--fh);font-size:1.15rem;font-weight:700;text-transform:uppercase;padding:20px 24px;cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:'+';font-size:1.5rem;color:var(--or);flex-shrink:0}
.faq details[open] summary::after{content:'–'}
.faq .faq-a{font-family:var(--fb);font-size:.92rem;color:#555;line-height:1.75;padding:0 24px 22px}

/* CTA banda dentro de sección */
.lcta{margin-top:40px;padding:26px 32px;background:var(--bk);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:20px}
.lcta-txt{font-family:var(--fh);font-size:1.3rem;font-weight:700;color:#fff;text-transform:uppercase}
.lcta-sub{font-family:var(--fb);font-size:.88rem;color:rgba(255,255,255,.65);margin-top:4px}
.lcta .bwa-cta{display:inline-flex;align-items:center;gap:8px;background:#25D366;color:#fff;font-family:var(--fh);font-size:1rem;font-weight:700;letter-spacing:1px;text-transform:uppercase;padding:12px 24px;text-decoration:none;border-radius:4px}

/* Responsive */
@media(max-width:1024px){
  .lhero{padding:110px 28px 48px}
  .lcards{grid-template-columns:1fr 1fr}
  .lsteps{grid-template-columns:1fr 1fr}
}
@media(max-width:640px){
  .lhero{padding:100px 20px 40px;min-height:48vh}
  .lcards,.lsteps,.dgrid{grid-template-columns:1fr}
}

@media(max-width:1024px){.lcards-2col{grid-template-columns:1fr!important}}
