/* =========================================================
   home.css — estilos propios de la Home (index.html)
   ========================================================= */

/* ---------- Hero ---------- */
.hero{padding:clamp(24px,4vw,56px) clamp(18px,4vw,56px);background:var(--cream)}
.hero__wrap{display:flex;flex-wrap:wrap;gap:26px;align-items:stretch;max-width:1200px;margin:0 auto}
.hero__media{
  flex:1.15 1 340px;position:relative;border-radius:28px;overflow:hidden;
  min-height:440px;display:flex;flex-direction:column;justify-content:flex-end;
  padding:clamp(24px,3vw,40px);
  background-image:linear-gradient(180deg,rgba(18,32,27,.68) 0%,rgba(18,32,27,.6) 42%,rgba(18,32,27,.92) 100%),url('../img/hero-cuidado.jpg');
  background-size:cover;background-position:60% 28%;
}
.hero__inner{position:relative}
.hero__badge{
  display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;
  background:rgba(255,255,255,.16);color:#fff;font-size:12.5px;font-weight:600;backdrop-filter:blur(4px);
}
.hero__title{margin-top:18px;color:#fff}
.hero__sub{margin:16px 0 24px;font-size:clamp(15px,1.6vw,18px);line-height:1.5;color:rgba(255,255,255,.9);max-width:44ch}
.hero__form{flex:1 1 330px;min-width:0}

/* ---------- Barra de confianza ---------- */
.trust{background:var(--brand);padding:22px clamp(18px,4vw,56px)}
.trust__row{max-width:var(--maxw);margin:0 auto;display:flex;flex-wrap:wrap;gap:14px 34px;justify-content:center;align-items:center}
.trust__item{display:flex;align-items:center;gap:9px;color:#1d2f28;font-size:13.5px;font-weight:600}

/* ---------- Nosotros ---------- */
.about{display:flex;flex-wrap:wrap;gap:36px;align-items:center}
.about__text{flex:1 1 320px}
.about__photo{flex:1 1 300px;min-height:340px;border-radius:26px;background-size:cover;background-position:center}
.stats{display:flex;flex-wrap:wrap;gap:24px;margin-top:28px}
.stat__n{font-weight:800;font-size:30px;color:var(--deep)}
.stat__l{font-size:13px;color:var(--muted-2)}
.stat__div{width:1px;background:rgba(34,51,46,.12)}

/* ---------- Grids de tarjetas ---------- */
.center{text-align:center;max-width:600px;margin-inline:auto}
.cards-3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:34px}
.cards-2{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-top:18px}
.card{background:#fff;border-radius:var(--radius);padding:28px;border:1px solid rgba(34,51,46,.06);transition:transform .18s,box-shadow .18s}
.card:hover{transform:translateY(-4px);box-shadow:0 18px 40px -24px rgba(34,51,46,.4)}
.card__title{margin-top:18px;font-weight:700;font-size:19px}
.card__text{margin-top:10px;font-size:14.5px;line-height:1.6;color:var(--muted)}

/* ---------- Paneles modalidades / carga ---------- */
.panel{border-radius:var(--radius);padding:26px 28px}
.panel--deep{background:var(--deep)}
.panel--white{background:#fff;border:1px solid var(--line)}
.panel__eyebrow{font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--brand-mid)}
.panel__eyebrow--sand{color:var(--sand)}
.tags{display:flex;flex-wrap:wrap;gap:9px;margin-top:16px}
.tag-dark{padding:10px 15px;border-radius:12px;background:rgba(255,255,255,.1);color:#fff;font-size:14px;font-weight:500}
.tag-hours{padding:10px 16px;border-radius:12px;background:var(--soft);color:var(--deep);font-size:15px;font-weight:700}

/* ---------- Funciones ---------- */
.funcs{display:flex;flex-wrap:wrap;gap:34px;margin-top:36px}
.func{flex:1 1 260px}
.func__head{display:flex;align-items:center;gap:11px}
.func__title{margin:0;font-weight:700;font-size:17px}
.ul{margin:16px 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:10px}
.ul li{position:relative;padding-left:18px;font-size:14.5px;color:var(--muted);line-height:1.45}
.ul li::before{content:"·";position:absolute;left:4px;top:-1px;color:var(--brand-mid);font-weight:700;font-size:18px}

/* ---------- Diferencial ---------- */
.diff{display:flex;flex-wrap:wrap;gap:36px;align-items:center;max-width:960px;margin:0 auto}
.diff__text{flex:1 1 340px}
.pill-sand{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;background:rgba(231,211,161,.18);color:var(--sand);font-size:12.5px;font-weight:600}
.diff__grid{flex:1 1 260px;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.diff__tile{padding:14px 16px;border-radius:14px;background:rgba(255,255,255,.08);color:#fff;font-size:13.5px;font-weight:500}

/* ---------- Staff ---------- */
.staff{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:34px}
.staff__card{display:flex;gap:16px;background:var(--panel);border-radius:22px;padding:18px}
.staff__photo{width:80px;height:80px;flex:none;border-radius:18px;background:#dfeae4 center/cover}
.staff__name{font-weight:700;font-size:16px}
.staff__role{font-size:12.5px;color:var(--brand-mid);font-weight:600;margin:2px 0 6px}
.staff__desc{margin:0;font-size:13px;line-height:1.5;color:var(--muted)}

/* ---------- Cómo funciona ---------- */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:34px}
.step{background:#fff;border-radius:22px;padding:26px;border:1px solid rgba(34,51,46,.06)}
.step__n{width:40px;height:40px;border-radius:12px;background:var(--brand);color:var(--ink);font-weight:700;display:flex;align-items:center;justify-content:center}
.step__title{margin:16px 0 6px;font-weight:700;font-size:16.5px}
.step__text{margin:0;font-size:13.5px;line-height:1.55;color:var(--muted)}

/* ---------- Testimonios ---------- */
.testi__head{display:flex;flex-wrap:wrap;gap:16px;align-items:flex-end;justify-content:space-between}
.testi__nav{display:flex;gap:10px}
.testi__nav button{width:46px;height:46px;border-radius:14px;border:1px solid rgba(34,51,46,.14);background:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s}
.testi__nav button:hover{background:var(--soft)}
.testi__track{display:flex;gap:18px;margin-top:28px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px;scrollbar-width:none}
.testi__track::-webkit-scrollbar{display:none}
.testi{flex:0 0 auto;width:min(340px,80vw);scroll-snap-align:start;background:var(--panel);border-radius:var(--radius);padding:26px;border:1px solid rgba(34,51,46,.05);margin:0}
.testi__stars{color:var(--sand);letter-spacing:2px}
.testi__text{margin:14px 0 20px;font-size:15px;line-height:1.6;color:#3c4a44}
.testi__by{display:flex;flex-direction:column;gap:2px}
.testi__name{display:block;font-weight:700;font-size:14.5px}
.testi__rel{display:block;font-size:12.5px;color:var(--muted-2)}

/* ---------- Cobertura (mapa + slider autoplay) ---------- */
.cov-wrap{display:flex;flex-wrap:wrap;gap:22px;align-items:stretch}
.cov-map{flex:1.3 1 380px;position:relative;border-radius:28px;overflow:hidden;background:#fff;border:1px solid rgba(34,51,46,.06);min-height:380px}
.cov-map__dots{position:absolute;inset:0;background-image:radial-gradient(rgba(47,93,78,.07) 1.5px, transparent 1.5px);background-size:22px 22px}
.cov-map__river{position:absolute;right:-12%;top:-18%;width:70%;height:85%;background:radial-gradient(circle at 30% 30%,rgba(138,188,170,.4),rgba(138,188,170,.14) 55%,transparent 72%);border-radius:50%;transform:rotate(18deg)}
.cov-map__caba-zone{position:absolute;left:50%;top:47%;width:170px;height:170px;margin-left:-85px;margin-top:-85px;border-radius:50%;background:rgba(78,140,119,.08);border:1px dashed rgba(47,93,78,.25)}
.cov-map__caba-label{position:absolute;left:50%;top:33%;transform:translate(-50%,-50%);font:600 11px ui-monospace,Menlo,monospace;letter-spacing:.1em;color:var(--brand-mid);text-transform:uppercase;pointer-events:none}
.cov-map__zone{position:absolute;font-size:11.5px;font-weight:700;color:#9aa8a1;letter-spacing:.04em;text-transform:uppercase;pointer-events:none}
.cov-pin{position:absolute;transform:translate(-50%,-50%);width:36px;height:36px;background:none;border:none;padding:0;cursor:pointer}
.cov-pin__ring{position:absolute;inset:6px;border-radius:50%;background:var(--brand-mid);display:none}
.cov-pin.is-active .cov-pin__ring{display:block;animation:pinPulse 1.8s ease-out infinite}
.cov-pin__dot{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:14px;height:14px;border-radius:50%;background:var(--brand);border:2px solid #fff;box-shadow:0 3px 8px rgba(0,0,0,.25);transition:all .25s;display:flex;align-items:center;justify-content:center}
.cov-pin.is-active .cov-pin__dot{width:30px;height:30px;background:var(--brand-mid)}
.cov-pin.is-active .cov-pin__dot::after{content:"";width:15px;height:15px;background:#fff;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s-7-5.2-7-11a7 7 0 0 1 14 0c0 5.8-7 11-7 11Z'/%3E%3Ccircle cx='12' cy='10' r='2.2'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s-7-5.2-7-11a7 7 0 0 1 14 0c0 5.8-7 11-7 11Z'/%3E%3Ccircle cx='12' cy='10' r='2.2'/%3E%3C/svg%3E") center/contain no-repeat}
@keyframes pinPulse{0%{transform:scale(.9);opacity:.6}70%{transform:scale(2.2);opacity:0}100%{transform:scale(2.2);opacity:0}}

.cov-side{flex:1 1 300px;min-width:280px;display:flex;flex-direction:column}
.cov-cards{flex:1;position:relative;min-height:210px;margin-top:18px}
.cov-card{position:absolute;inset:0;padding:28px;background:#fff;border:1px solid rgba(34,51,46,.06);border-radius:24px;display:flex;flex-direction:column;justify-content:center;opacity:0;pointer-events:none;transition:opacity .5s ease}
.cov-card.is-active{opacity:1;pointer-events:auto}
.cov-card__head{display:flex;align-items:center;gap:9px;color:var(--deep)}
.cov-card__name{font-weight:700;font-size:20px;color:var(--ink)}
.cov-card__zone{display:inline-flex;margin-top:10px;padding:5px 12px;border-radius:999px;background:var(--soft);color:var(--deep);font-size:12px;font-weight:600;width:fit-content}
.cov-card__desc{margin:14px 0 0;font-size:14.5px;line-height:1.6;color:var(--muted)}
.cov-nav{display:flex;align-items:center;justify-content:space-between;margin-top:18px}
.cov-dots{display:flex;gap:6px}
.cov-dots button{width:7px;height:7px;border-radius:4px;background:rgba(34,51,46,.15);border:none;padding:0;cursor:pointer;transition:all .3s}
.cov-dots button.is-active{width:18px;background:var(--brand-mid)}
.cov-nav > div:last-child{display:flex;gap:10px}
.cov-nav button[data-cov-prev],.cov-nav button[data-cov-next]{width:42px;height:42px;border-radius:13px;border:1px solid rgba(34,51,46,.14);background:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s}
.cov-nav button[data-cov-prev]:hover,.cov-nav button[data-cov-next]:hover{background:var(--soft)}

/* ---------- FAQ ---------- */
.faq{display:flex;flex-direction:column;gap:12px}
.faq__item{background:var(--panel);border-radius:18px;border:1px solid rgba(34,51,46,.05);overflow:hidden}
.faq__q{display:flex;align-items:center;gap:14px;padding:20px 22px;cursor:pointer;font-weight:600;font-size:16px;list-style:none}
.faq__q::-webkit-details-marker{display:none}
.faq__q svg{margin-left:auto;flex:none;transition:transform .2s}
.faq__v{transition:opacity .2s}
.faq__item[open] .faq__v{opacity:0}
.faq__a{margin:0;padding:0 22px 22px;font-size:14.5px;line-height:1.6;color:var(--muted)}

/* ---------- CTA final ---------- */
.cta{display:flex;flex-wrap:wrap;gap:30px;align-items:center}
.cta__text{flex:1 1 320px}
.cta__form{flex:1 1 320px;min-width:0}

/* ---------- Responsive ---------- */
@media (max-width:900px){
  .cards-3,.staff,.steps{grid-template-columns:repeat(2,1fr)}
  .cover{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:640px){
  .hero__media{min-height:360px}
  .cards-3,.cards-2,.staff,.steps{grid-template-columns:1fr}
  .stats{gap:16px}
  .stat__div{display:none}
  .diff__grid{grid-template-columns:1fr}
  .cov-map{min-height:260px}
}

/* ---------- Botón flotante de WhatsApp (desktop) ---------- */
/* Movido a css/base.css para compartirlo entre páginas */