/* Landing publico -- mismos tokens de :root que app.css (paleta de reservas-mockup.html) */
#landing-page header{
	display:flex;align-items:center;justify-content:space-between;
	padding:1.1rem 4vw;background:var(--card);border-bottom:1px solid var(--line);
	position:sticky;top:0;z-index:10;
}
#landing-page .logo{display:flex;align-items:center;gap:.5rem;font-weight:800;font-size:1.15rem;}
#landing-page .logo .mark{
	width:34px;height:34px;border-radius:10px;object-fit:cover;
}
#landing-page nav{display:flex;gap:1.6rem;font-size:.9rem;font-weight:600;color:var(--muted);}
#landing-page nav a:hover{color:var(--primary);}
#landing-page .header-cta{display:flex;gap:.6rem;}

.hero{padding:5.5rem 4vw 4rem;text-align:center;background:radial-gradient(circle at 30% 20%,#E4ECFD 0%,var(--paper) 55%);}
.hero h1{font-size:2.7rem;max-width:820px;margin:0 auto .9rem;line-height:1.15;}
.hero h1 span{color:var(--primary);}
.hero p.lead{font-size:1.1rem;max-width:600px;margin:0 auto 1.8rem;}
.hero .cta-row{display:flex;gap:.8rem;justify-content:center;margin-bottom:2.5rem;}
.hero .mock-shot{max-width:900px;margin:0 auto;border-radius:20px;overflow:hidden;box-shadow:var(--shadow);border:1px solid var(--line);background:var(--card);}
.hero .mock-shot .bar{height:34px;background:var(--ink);display:flex;align-items:center;gap:6px;padding:0 12px;}
.hero .mock-shot .bar i{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.3);}
.hero .mock-shot .body{padding:1.8rem;display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;}
.hero .mock-shot .kpi{background:var(--paper);border-radius:12px;padding:1rem;text-align:left;}
.hero .mock-shot .kpi b{display:block;font-size:1.5rem;}

section.band{padding:4rem 4vw;}
section.band h2{font-size:1.9rem;text-align:center;margin-bottom:.5rem;}
section.band p.sub{text-align:center;max-width:560px;margin:0 auto 2.6rem;}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem;}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:1.4rem;}
.feature-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:1.6rem;box-shadow:var(--shadow);}
.feature-card .ic{width:44px;height:44px;border-radius:12px;background:#E4ECFD;color:var(--primary);display:flex;align-items:center;justify-content:center;font-size:1.3rem;margin-bottom:.9rem;}
.feature-card h3{font-size:1.05rem;}

.steps{display:flex;gap:1.4rem;max-width:960px;margin:0 auto;}
.step{flex:1;text-align:center;}
.step .num{width:40px;height:40px;border-radius:50%;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;margin:0 auto .8rem;}

.pricing{background:var(--ink);color:#fff;}
.pricing h2,.pricing p.sub{color:#fff;}
.pricing p.sub{color:#B9C2D6;}
.plan-card{background:var(--navy,#1C2740);border:1px solid rgba(255,255,255,.08);border-radius:var(--radius);padding:1.8rem;color:#fff;}
.plan-card.featured{border:2px solid var(--accent);position:relative;transform:translateY(-8px);}
.plan-card.featured .tag{position:absolute;top:-13px;left:50%;transform:translateX(-50%);background:var(--accent);color:#3A2600;padding:.25rem .8rem;border-radius:999px;font-size:.72rem;font-weight:700;}
.plan-card .price{font-size:2.2rem;font-weight:800;margin:.6rem 0;}
.plan-card .price small{font-size:.9rem;font-weight:500;color:#B9C2D6;}
.plan-card ul{list-style:none;margin:1.2rem 0;padding:0;font-size:.88rem;color:#DCE3F2;}
.plan-card li{padding:.35rem 0;display:flex;gap:.5rem;align-items:flex-start;}
.plan-card li b{color:var(--accent);}
.plan-card .btn{width:100%;}

.faq{max-width:760px;margin:0 auto;}
.faq-item{border-bottom:1px solid var(--line);padding:1.1rem 0;}
.faq-item h4{font-size:.98rem;color:var(--text);}
.cta-final{background:linear-gradient(135deg,var(--primary),var(--primary-dark));color:#fff;text-align:center;padding:3.5rem 4vw;}
.cta-final h2,.cta-final p{color:#fff;}
.cta-final .btn{background:#fff;color:var(--primary-dark);}
footer.site{background:var(--ink);color:#B9C2D6;padding:2rem 4vw;display:flex;justify-content:space-between;font-size:.85rem;flex-wrap:wrap;gap:.5rem;}
footer.site b{color:#fff;}

/* Boton flotante de WhatsApp + modal de "Contáctanos" (pedido de Ytalo 2026-09-07). El numero y
   el destinatario del aviso son configurables desde el panel SUP (Configuración de la plataforma). */
.ml-wa-float{position:fixed;right:22px;bottom:22px;width:58px;height:58px;border-radius:50%;background:#25D366;border:none;box-shadow:0 6px 18px rgba(0,0,0,.25);display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:60;}
.ml-wa-float svg{width:30px;height:30px;fill:#fff;}
.ml-wa-float:hover{background:#1EBE5A;}

.ml-overlay{position:fixed;inset:0;background:rgba(20,25,40,.55);display:flex;align-items:center;justify-content:center;padding:20px;z-index:100;}
.ml-box{position:relative;background:var(--card);border-radius:16px;padding:28px;width:100%;max-width:420px;max-height:90vh;overflow-y:auto;text-align:left;}
.ml-close{position:absolute;top:14px;right:14px;background:none;border:none;font-size:1.1rem;color:var(--muted);cursor:pointer;line-height:1;}
.ml-close:hover{color:var(--text);}
.ml-eyebrow{font-size:.7rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--primary);margin:0 0 6px;}
.ml-success{text-align:center;}
.ml-ok{width:52px;height:52px;border-radius:50%;background:#DBF3E8;color:#1E8A5C;display:flex;align-items:center;justify-content:center;font-size:1.4rem;font-weight:800;margin:0 auto 16px;}
@media(max-width:480px){
	.ml-wa-float{right:16px;bottom:16px;width:52px;height:52px;}
}

@media(max-width:700px){
	#landing-page nav{display:none;}
	#landing-page header{padding:.9rem 5vw;}
	.header-cta .btn{padding:.55rem 1rem;font-size:.82rem;}
	.grid-3,.grid-4,.hero .mock-shot .body{grid-template-columns:1fr;}
	.hero{padding:3.5rem 5vw 2.5rem;}
	.cta-row{flex-direction:column;}
	footer.site{flex-direction:column;text-align:center;}
}
@media(max-width:900px){
	.grid-3,.grid-4,.hero .mock-shot .body{grid-template-columns:1fr 1fr;}
	.hero h1{font-size:2rem;}
	.plan-card.featured{transform:none;}
	.steps{flex-direction:column;}
}