:root{
  --negro:#000;
  --tinta:#111;
  --hueso:#f5f3f0;
  --gris:#7d7d7d;
  --linea:rgba(255,255,255,.18);
  --linea-osc:rgba(0,0,0,.14);
  --wa:#25d366;
  --estrella:#c8a04a;
  --track:.22em;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:'Jost',-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;
  font-weight:300;color:var(--tinta);background:var(--hueso);
  line-height:1.7;-webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;height:auto}
a{color:inherit;text-decoration:none}
.wrap{width:min(1120px,90vw);margin-inline:auto}
section{padding:clamp(72px,11vw,140px) 0;scroll-margin-top:72px}

/* ---------- tipografía ---------- */
h1,h2,h3{font-weight:300;line-height:1.15;letter-spacing:.02em}
h1{font-size:clamp(2.1rem,6.2vw,4.4rem);text-transform:uppercase}
h2{font-size:clamp(1.6rem,3.6vw,2.6rem);text-transform:uppercase}
h3{font-size:1.05rem;text-transform:uppercase;letter-spacing:var(--track);font-weight:400}
.eyebrow{
  font-size:.72rem;letter-spacing:.38em;text-transform:uppercase;
  color:var(--gris);margin-bottom:1.4rem
}
.lead{font-size:clamp(1rem,1.7vw,1.15rem);max-width:62ch;color:#3a3a3a}

/* ---------- header ---------- */
header{
  position:fixed;inset:0 0 auto 0;z-index:60;
  background:rgba(0,0,0,.92);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--linea);
}
.nav{display:flex;align-items:center;justify-content:space-between;gap:1.2rem;height:72px}
.nav__logo img{height:26px;width:auto}
.nav__links{display:flex;gap:1.5rem;align-items:center}
.nav__links a{
  color:#fff;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;
  opacity:.8;transition:opacity .25s;white-space:nowrap
}
.nav__links a:hover{opacity:1}
.nav__cta{
  display:inline-flex;align-items:center;gap:.5rem;
  border:1px solid #fff;color:#fff;padding:.6rem 1.15rem;
  font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;
  transition:background .25s,color .25s
}
.nav__cta:hover{background:#fff;color:#000}
.nav__ig{display:inline-flex;align-items:center;gap:.55rem;opacity:.8;transition:opacity .25s}
.nav__ig:hover{opacity:1}
.nav__ig svg{width:19px;height:19px;fill:#fff;flex:none}
.nav__ig span{display:none}
.burger{display:none;background:none;border:0;cursor:pointer;padding:.4rem}
.burger span{display:block;width:24px;height:1px;background:#fff;margin:6px 0;transition:.3s}

/* ---------- hero ---------- */
.hero{
  position:relative;min-height:100svh;background:var(--negro);color:#fff;
  display:flex;align-items:center;text-align:center;padding-top:72px;overflow:hidden
}
.hero__bg{
  position:absolute;inset:0;z-index:0;
  background:url('/assets/img/hero-fachada.jpg') center/cover no-repeat;
  opacity:.42;filter:grayscale(.35) contrast(1.05)
}
.hero__bg::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,.75) 0%,rgba(0,0,0,.45) 45%,rgba(0,0,0,.85) 100%)
}
.hero .wrap{position:relative;z-index:1}
.hero__logo{width:min(520px,72vw);margin:0 auto clamp(1.8rem,4.5vw,2.8rem)}
.hero .eyebrow{color:rgba(255,255,255,.65)}
.hero h1{
  color:#fff;font-size:clamp(1.35rem,3.1vw,2.15rem);letter-spacing:.14em;
  max-width:22ch;margin-inline:auto
}
.hero__sub{
  max-width:52ch;margin:1.6rem auto 0;color:rgba(255,255,255,.78);
  font-size:clamp(.95rem,1.6vw,1.12rem);font-weight:200;letter-spacing:.03em
}
.hero__actions{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;margin-top:2.6rem}
.hero__scroll{
  position:absolute;bottom:26px;left:50%;transform:translateX(-50%);z-index:1;
  font-size:.65rem;letter-spacing:.3em;text-transform:uppercase;color:rgba(255,255,255,.45)
}

/* ---------- botones ---------- */
.btn{
  display:inline-flex;align-items:center;gap:.6rem;
  padding:1rem 2rem;font-size:.75rem;letter-spacing:var(--track);
  text-transform:uppercase;border:1px solid currentColor;transition:.3s
}
.btn--wa{background:#fff;color:#000;border-color:#fff}
.btn--wa:hover{background:transparent;color:#fff}
.btn--ghost{color:#fff}
.btn--ghost:hover{background:#fff;color:#000}
.btn--dark{background:#000;color:#fff;border-color:#000}
.btn--dark:hover{background:transparent;color:#000}
.btn svg{width:17px;height:17px;fill:currentColor;flex:none}
.ico--wa{fill:var(--wa)!important}

/* ---------- concepto ---------- */
.concepto__txt p + p{margin-top:1.2rem}
.concepto__fotos{display:grid;gap:1px;background:var(--linea-osc);margin-top:3.5rem}
@media(min-width:760px){
  .concepto__fotos{grid-template-columns:repeat(2,1fr)}
  /* las dos verticales van en pareja arriba; la horizontal ocupa las dos columnas debajo,
     así cada foto conserva su proporción real y no queda hueco sin cubrir */
  .concepto__fotos img:nth-of-type(3){grid-column:1 / -1}
}
.concepto__fotos img{width:100%;height:auto;display:block;filter:grayscale(.15)}

/* ---------- equipo (dentro de "el concepto") ---------- */
.equipo{display:flex;gap:1.4rem;margin-top:2.6rem}
.equipo__persona{width:104px;flex:none;text-align:center}
.equipo__persona img{
  width:104px;height:104px;border-radius:50%;object-fit:cover;
  filter:grayscale(.2);margin:0 auto
}
.equipo__persona span{
  display:block;margin-top:.6rem;font-size:.72rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--gris)
}

/* ---------- servicios ---------- */
.grid{display:grid;gap:1px;background:var(--linea-osc);margin-top:3.5rem;border-top:1px solid var(--linea-osc)}
@media(min-width:640px){.grid{grid-template-columns:repeat(2,1fr)}}
.card{background:var(--hueso);padding:2.6rem 2rem;display:flex;flex-direction:column;gap:.75rem}
.card__n{font-size:.7rem;letter-spacing:.3em;color:var(--gris)}
.card__sub{font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gris)}
.card p{font-size:.94rem;color:#4a4a4a}
.card__marca{
  margin-top:auto;padding-top:1rem;font-size:.72rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--gris);border-top:1px solid var(--linea-osc)
}
.dark .grid{background:var(--linea);border-top-color:var(--linea)}
.dark .card{background:var(--negro);color:#fff}
.dark .card p{color:rgba(255,255,255,.72)}
.dark .card__marca{border-top-color:var(--linea);color:rgba(255,255,255,.5)}
.card__foto{
  width:calc(100% + 4rem);margin:-2.6rem -2rem .4rem;
  max-width:none;aspect-ratio:16/10;object-fit:cover;filter:grayscale(.85) contrast(1.05)
}

/* ---------- franja oscura ---------- */
.dark{background:var(--negro);color:#fff}
.dark h2,.dark h3{color:#fff}
.dark .eyebrow{color:rgba(255,255,255,.55)}
.dark .lead{color:rgba(255,255,255,.72)}
.split{display:grid;gap:clamp(2.5rem,6vw,5rem);align-items:start}
@media(min-width:900px){.split{grid-template-columns:.9fr 1.1fr}}

/* ---------- marcas ---------- */
.marcas{display:grid;gap:1px;background:var(--linea);margin-top:3.5rem}
@media(min-width:560px){.marcas{grid-template-columns:repeat(2,1fr)}}
@media(min-width:960px){.marcas{grid-template-columns:repeat(4,1fr)}}
.marca{
  background:var(--negro);padding:2.4rem 1.4rem;text-align:center;
  display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:1rem;min-height:190px
}
.marca__logo{width:100%;height:38px;display:flex;align-items:center;justify-content:center}
.marca__logo img{max-width:100%;max-height:38px;width:auto;height:auto;object-fit:contain;opacity:.92}
.marca__word{
  font-size:1.5rem;letter-spacing:.05em;font-weight:400;color:#fff;line-height:1
}
.marca span{font-size:.8rem;color:rgba(255,255,255,.55);max-width:24ch}

/* ---------- galería ---------- */
.galeria{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--linea-osc);margin-top:3.5rem}
@media(min-width:700px){.galeria{grid-template-columns:repeat(4,1fr)}}
@media(min-width:1000px){.galeria{grid-template-columns:repeat(5,1fr)}}
.galeria button{
  border:0;padding:0;background:none;cursor:zoom-in;display:block;overflow:hidden
}
.galeria img{width:100%;aspect-ratio:3/4;object-fit:cover;transition:transform .5s,filter .5s;filter:grayscale(.12)}
.galeria button:hover img{transform:scale(1.04);filter:grayscale(0)}

/* lightbox */
.lb{
  position:fixed;inset:0;z-index:100;background:rgba(0,0,0,.94);
  display:none;place-items:center;padding:4vw
}
.lb.open{display:grid}
.lb img{max-width:min(92vw,720px);max-height:88svh;width:auto}
.lb__close,.lb__nav{
  position:absolute;background:none;border:0;color:#fff;cursor:pointer;
  font-size:2rem;line-height:1;padding:.6rem 1rem;opacity:.7;transition:opacity .2s
}
.lb__close:hover,.lb__nav:hover{opacity:1}
.lb__close{top:10px;right:12px}
.lb__prev{left:4px;top:50%;transform:translateY(-50%)}
.lb__next{right:4px;top:50%;transform:translateY(-50%)}

/* ---------- visita ---------- */
.info{display:grid;gap:2.2rem;margin-top:3rem}
@media(min-width:760px){.info{grid-template-columns:repeat(3,1fr)}}
.info h3{margin-bottom:.8rem}
.info p,.info a{font-size:.95rem;color:#4a4a4a}
.info a:hover{color:#000;text-decoration:underline}
.horario{display:grid;gap:.25rem;font-size:.95rem;color:#4a4a4a}
.horario span{display:flex;justify-content:space-between;gap:1rem;max-width:26rem;border-bottom:1px dotted var(--linea-osc);padding-bottom:.25rem}
.map{margin-top:3.5rem;border:1px solid var(--linea-osc);filter:grayscale(1) contrast(1.05)}
.map iframe{display:block;width:100%;height:380px;border:0}
.todo{
  display:inline-block;background:#ffe9a8;color:#5c4600;
  font-size:.78rem;padding:.1rem .45rem;letter-spacing:.04em
}

/* ---------- reseñas ---------- */
.stars{display:inline-flex;gap:2px;line-height:0}
.stars svg{width:15px;height:15px;fill:var(--estrella)}
.resenas__nota{
  display:flex;align-items:center;gap:1.1rem;flex-wrap:wrap;margin-top:1.6rem
}
.resenas__g{height:19px;width:auto;display:block}
.resenas__num{font-size:1.7rem;font-weight:300;line-height:1;letter-spacing:.02em}
.resenas__meta{font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gris)}
.resenas{
  display:grid;gap:1px;background:var(--linea-osc);
  margin-top:3.5rem;border-top:1px solid var(--linea-osc)
}
@media(min-width:640px){.resenas{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1040px){.resenas{grid-template-columns:repeat(4,1fr)}}
.resena{background:var(--hueso);padding:2.4rem 1.8rem;display:flex;flex-direction:column;gap:.9rem}
.resena__cab{display:flex;align-items:baseline;justify-content:space-between;gap:.8rem}
.resena__nombre{font-size:.74rem;letter-spacing:.16em;text-transform:uppercase}
a.resena__nombre{color:inherit;text-decoration:none;transition:color .25s}
a.resena__nombre:hover{color:#000;text-decoration:underline}
.resena__fecha{font-size:.68rem;color:var(--gris);white-space:nowrap}
.resena p{
  font-size:.92rem;color:#4a4a4a;
  display:-webkit-box;-webkit-line-clamp:9;-webkit-box-orient:vertical;overflow:hidden
}
.resena.abierta p{-webkit-line-clamp:unset}
.resena__mas{
  align-self:flex-start;margin-top:auto;background:none;border:0;padding:.5rem 0 0;
  cursor:pointer;font:inherit;font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--gris);border-bottom:1px solid var(--linea-osc);transition:color .25s
}
.resena__mas:hover{color:#000}
.resena__mas[hidden]{display:none}

/* ---------- cta final ---------- */
.cta{background:var(--negro);color:#fff;text-align:center}
.cta h2{color:#fff}
.cta p{max-width:52ch;margin:1.4rem auto 2.6rem;color:rgba(255,255,255,.7)}

/* ---------- footer ---------- */
footer{background:#000;color:rgba(255,255,255,.6);border-top:1px solid var(--linea);padding:3.5rem 0 2.5rem;font-size:.82rem}
.foot{display:grid;gap:2rem;align-items:start}
@media(min-width:760px){.foot{grid-template-columns:1.3fr 1fr 1fr 1fr}}
.foot img{height:30px;width:auto;margin-bottom:1rem}
.foot a:hover{color:#fff}
.foot h4{font-size:.7rem;letter-spacing:.26em;text-transform:uppercase;color:#fff;font-weight:400;margin-bottom:.9rem}
.foot ul{list-style:none;display:grid;gap:.4rem}
.legal{border-top:1px solid var(--linea);margin-top:2.5rem;padding-top:1.5rem;font-size:.75rem;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}

/* ---------- whatsapp flotante ---------- */
.fab{
  position:fixed;right:18px;bottom:18px;z-index:70;
  width:56px;height:56px;border-radius:50%;background:var(--wa);
  display:grid;place-items:center;box-shadow:0 6px 22px rgba(0,0,0,.28);
  transition:transform .25s
}
.fab:hover{transform:scale(1.07)}
.fab svg{width:29px;height:29px;fill:#fff}

@media(max-width:980px){
  .nav__links{
    position:fixed;inset:72px 0 auto 0;background:rgba(0,0,0,.98);
    flex-direction:column;gap:0;padding:1rem 0 2rem;
    border-bottom:1px solid var(--linea);
    max-height:calc(100svh - 72px);overflow-y:auto;
    display:none
  }
  .nav__links.open{display:flex}
  .nav__links a{padding:.85rem 0;font-size:.85rem}
  .nav__ig{justify-content:center}
  .nav__ig span{display:inline;font-size:.85rem;letter-spacing:.2em;text-transform:uppercase}
  .burger{display:block}
  .fab{bottom:16px;right:16px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{transition:none!important}
}

/* ===== landings de tratamiento ===== */
.lp-hero{padding:calc(72px + clamp(56px,9vw,110px)) 0 clamp(56px,8vw,96px)}
.lp-hero h1{font-size:clamp(1.9rem,5vw,3.4rem);max-width:20ch}
.lp-hero .lead{margin-top:1.6rem}
.lp-hero .hero__actions{justify-content:flex-start}
.migas{font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.5);margin-bottom:2rem}
.migas a:hover{color:#fff}
.migas span{margin:0 .6rem}
.lp-body{display:grid;gap:clamp(2.5rem,6vw,4.5rem);align-items:start}
@media(min-width:900px){.lp-body{grid-template-columns:1.25fr .75fr}}
.lp-text h2{margin-bottom:1.8rem}
.lp-text h3{margin:2.6rem 0 1rem}
.lp-text p{max-width:66ch;color:#3a3a3a}
.lp-text p + p{margin-top:1.1rem}
.quote{margin:2.4rem 0;padding:.4rem 0 .4rem 1.6rem;border-left:1px solid var(--tinta);font-size:clamp(1.05rem,1.8vw,1.25rem);font-weight:200;line-height:1.6;color:var(--tinta)}
.lp-fotos{display:grid;gap:1px}
@media(min-width:900px){.lp-fotos{position:sticky;top:96px}}
.lp-fotos img{width:100%;height:auto}
.pasos{display:grid;gap:1px;background:var(--linea);margin-top:3rem;border-top:1px solid var(--linea)}
@media(min-width:640px){.pasos{grid-template-columns:repeat(2,1fr)}}
@media(min-width:980px){.pasos{grid-template-columns:repeat(3,1fr)}}
.paso{background:var(--negro);padding:2rem 1.8rem;color:rgba(255,255,255,.72);font-size:.94rem}
.paso strong{display:block;color:#fff;font-weight:400;font-size:.8rem;letter-spacing:.18em;text-transform:uppercase;margin-bottom:.8rem}
.cuidados{list-style:none;margin-top:2.4rem;display:grid;gap:0;border-top:1px solid var(--linea-osc);max-width:820px}
.cuidados li{padding:1.1rem 0 1.1rem 2.2rem;border-bottom:1px solid var(--linea-osc);position:relative;color:#3a3a3a}
.cuidados li::before{content:"—";position:absolute;left:0;color:var(--gris)}
@media(min-width:900px){.grid--3{grid-template-columns:repeat(3,1fr)}}
.card__link{margin-top:auto;padding-top:1rem;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;border-top:1px solid var(--linea-osc)}
.card__link a{text-decoration:underline;text-underline-offset:3px}
a.card:hover h3{text-decoration:underline;text-underline-offset:4px}