/* ==========================================================
   TÚ Imagen Personal — estilos
   Colores y tipografías se cambian aquí arriba (:root y @font-face).
   ========================================================== */

@font-face{font-family:'Open Sans';font-style:normal;font-weight:300 700;font-display:swap;src:url(../fonts/open-sans-latin.woff2) format('woff2');}
@font-face{font-family:'Instrument Serif';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/instrument-serif-latin.woff2) format('woff2');}
@font-face{font-family:'Instrument Serif';font-style:italic;font-weight:400;font-display:swap;src:url(../fonts/instrument-serif-italic-latin.woff2) format('woff2');}

:root{
  --ink:#181414;
  --ink-soft:#5c5754;
  --paper:#ffffff;
  --stone:#efe9df;
  --line:rgba(24,20,20,.13);
  --accent:#a8652f;
  color-scheme:light;
}

*{box-sizing:border-box;}
html{scroll-padding-top:96px;}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth;}}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:'Open Sans',system-ui,sans-serif;
  font-weight:300;
  margin:0;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%; display:block;}
a{color:inherit;}
a:focus-visible,button:focus-visible,summary:focus-visible,.dot:focus-visible{outline:2px solid var(--accent); outline-offset:3px;}

h1,h2,h3,.display{
  font-family:'Instrument Serif',Georgia,serif;
  font-weight:400;
  font-style:italic;
  line-height:1.05;
  margin:0 0 .4em;
  text-wrap:balance;
}
.eyebrow{
  text-transform:uppercase;
  letter-spacing:.14em;
  font-size:.72rem;
  font-weight:600;
  color:var(--ink-soft);
  margin:0 0 .9em;
}
.wrap{max-width:1200px; margin:0 auto; padding-inline:24px;}
section{padding-block:clamp(48px,7vw,92px);}

.btn{
  font-family:'Open Sans',sans-serif;
  font-size:.78rem;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.1em;
  display:inline-flex;
  align-items:center;
  padding:.95em 1.7em;
  border-radius:0;
  text-decoration:none;
  border:1px solid var(--ink);
  cursor:pointer;
  background:transparent;
  color:var(--ink);
  transition:background .2s ease,color .2s ease;
}
.btn-primary{background:var(--ink); color:#fff;}
.btn-primary:hover{background:#000;}
.btn-ghost:hover{background:var(--ink); color:#fff;}

/* ---------- Cinta de texto en movimiento ---------- */
.marquee{overflow:hidden; white-space:nowrap; background:var(--paper); border-bottom:1px solid var(--line);}
.marquee.is-dark{background:var(--ink); border-bottom:0;}
.marquee__track{display:flex; width:max-content;}
.marquee__group{display:flex; flex-shrink:0;}
.marquee__item{
  padding:.65em 1.6em;
  font-size:.74rem; letter-spacing:.1em; text-transform:uppercase; font-weight:600;
  color:var(--ink-soft);
}
.marquee__item::after{content:"•"; margin-left:3.2em; opacity:.5;}
.marquee.is-dark .marquee__item{color:#fff;}
.marquee.is-ready .marquee__track{animation:marquee var(--marquee-speed,40s) linear infinite;}
.marquee.is-ready:hover .marquee__track{animation-play-state:paused;}
@keyframes marquee{to{transform:translateX(-50%);}}
.marquee:not(.is-ready){white-space:normal;}
.marquee:not(.is-ready) .marquee__track{width:auto; justify-content:center;}
.marquee:not(.is-ready) .marquee__group{flex-wrap:wrap; justify-content:center;}
.marquee:not(.is-ready) .marquee__item::after{margin-left:1.6em;}

/* ---------- Cabecera ---------- */
header{position:sticky; top:0; z-index:40; background:var(--paper); border-bottom:1px solid var(--line);}
.navwrap{
  max-width:1200px; margin:0 auto; padding-inline:24px;
  display:grid; grid-template-columns:1fr auto 1fr; align-items:center;
  min-height:78px; gap:1rem;
}
.navleft{display:flex; align-items:center;}
.brand{display:flex; justify-self:center;}
.brand img{height:54px; width:auto;}
nav.links{display:flex; gap:1.7rem; font-size:.76rem; text-transform:uppercase; letter-spacing:.09em; font-weight:600;}
nav.links a{text-decoration:none;}
nav.links a:hover{color:var(--accent);}
.navright{display:flex; align-items:center; gap:1.1rem; justify-self:end;}
.navright .tel{font-size:.82rem; text-decoration:none; display:none;}
#navtoggle{position:absolute; opacity:0; pointer-events:none;}
.burger{display:none; cursor:pointer; color:var(--ink); padding:6px;}
.burger svg{width:24px; height:24px; display:block;}
#navtoggle:focus-visible ~ .navwrap .burger{outline:2px solid var(--accent);}
@media (min-width:1100px){.navright .tel{display:inline;}}
@media (max-width:960px){
  nav.links{
    position:absolute; top:100%; left:0; right:0; background:var(--paper);
    flex-direction:column; gap:0; padding:6px 24px 18px; display:none;
    border-bottom:1px solid var(--line); max-height:calc(100vh - 130px); overflow:auto;
  }
  nav.links a{padding:.9em 0; border-bottom:1px solid var(--line);}
  #navtoggle:checked ~ .navwrap nav.links{display:flex;}
  .burger{display:block;}
  .navright .btn{padding:.8em 1.1em; font-size:.7rem;}
}

/* ---------- Portada (slider) ---------- */
.hero{background:var(--stone); padding-block:0;}
.hero-track{position:relative; display:grid;}
.hero-slide{
  grid-area:1/1; justify-self:center; width:100%; max-width:1200px;
  display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:clamp(24px,5vw,64px);
  padding:clamp(32px,5vw,56px) 24px 72px;
  opacity:0; visibility:hidden; transition:opacity .7s ease,visibility .7s;
}
.hero-slide.is-active{opacity:1; visibility:visible;}
.hero-slide h1,.hero-slide .display{font-size:clamp(2.5rem,5.4vw,4rem);}
.hero-slide .lead{font-size:1.05rem; max-width:44ch; color:var(--ink-soft); margin:0;}
.hero-ctas{margin-top:1.8rem;}
.hero-figure{height:clamp(320px,44vw,520px); overflow:hidden; border-radius:4px;}
.hero-figure img{width:100%; height:100%; object-fit:cover; filter:contrast(1.06) saturate(1.04) brightness(1.02);}
.hero-dots{position:absolute; left:50%; bottom:26px; transform:translateX(-50%); display:flex; gap:.6rem; z-index:5;}
.dot{width:9px; height:9px; border-radius:50%; border:1px solid var(--ink); background:transparent; padding:0; cursor:pointer;}
.dot.is-active{background:var(--ink);}
@media (max-width:820px){
  .hero-slide{grid-template-columns:1fr; gap:24px;}
  .hero-figure{order:-1; height:clamp(240px,60vw,320px);}
}
@media (prefers-reduced-motion:reduce){.hero-slide{transition:none;}}

/* ---------- Ventajas ---------- */
.benefits{display:grid; grid-template-columns:repeat(3,1fr); gap:2.4rem; text-align:center;}
.benefit svg{width:30px; height:30px; stroke:var(--ink); margin:0 auto 1rem; display:block;}
.benefit h3{font-family:'Open Sans',sans-serif; font-style:normal; font-weight:600; font-size:.95rem; text-transform:uppercase; letter-spacing:.05em; margin:0 0 .5rem;}
.benefit p{color:var(--ink-soft); font-size:.9rem; max-width:32ch; margin:0 auto;}
@media (max-width:760px){.benefits{grid-template-columns:1fr; gap:2rem;}}

/* ---------- Cabecera de sección ---------- */
.sec-head{display:flex; align-items:flex-end; justify-content:space-between; gap:1.5rem; flex-wrap:wrap; margin-bottom:2.4rem;}
.sec-head h2{font-size:clamp(1.9rem,3.6vw,2.8rem); margin:0;}
.sec-head p{color:var(--ink-soft); max-width:44ch; margin:.6rem 0 0; font-size:.95rem;}
.intro h2{font-size:clamp(1.9rem,3.6vw,2.8rem); max-width:22ch;}
.intro p{max-width:72ch; color:var(--ink-soft); font-size:1.02rem;}
.intro strong{font-weight:600; color:var(--ink);}

/* ---------- Tratamientos (tarjetas foto + texto + botón) ---------- */
.treat-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(18px,2.2vw,32px);}
.treat-card{display:flex; flex-direction:column;}
.treat-card__media{position:relative; aspect-ratio:4/5; overflow:hidden; background:var(--stone);}
.treat-card__media img{width:100%; height:100%; object-fit:cover; filter:contrast(1.06) saturate(1.04) brightness(1.02); transition:transform .7s ease;}
.treat-card:hover .treat-card__media img{transform:scale(1.045);}
.treat-card__zone{position:absolute; left:14px; top:14px; background:var(--paper); color:var(--ink); font-size:.68rem; text-transform:uppercase; letter-spacing:.14em; font-weight:600; padding:.5em 1em;}
.treat-card.no-photo .treat-card__media{display:flex; align-items:center; justify-content:center;}
.treat-card.no-photo .treat-card__media svg{width:54px; height:54px; stroke:var(--ink); opacity:.55;}
.treat-card__body{display:flex; flex-direction:column; flex:1; padding-top:1.5rem;}
.treat-card h3{font-size:clamp(1.45rem,1.9vw,1.75rem); margin:0 0 .45em;}
.treat-card p{color:var(--ink-soft); font-size:.95rem; margin:0 0 1.6rem; flex:1;}
.treat-card .btn{align-self:flex-start;}
@media (max-width:1000px){.treat-grid{grid-template-columns:repeat(2,1fr); gap:2.6rem clamp(18px,3vw,32px);}}
@media (max-width:600px){.treat-grid{grid-template-columns:1fr; max-width:520px; margin-inline:auto; gap:3rem;} .treat-card__media{aspect-ratio:4/3;}}
@media (prefers-reduced-motion:reduce){.treat-card__media img{transition:none;}}

/* ---------- Banner ---------- */
.banner{background:var(--ink); color:#fff;}
.banner .wrap{display:grid; grid-template-columns:1fr 1fr; gap:clamp(24px,5vw,64px); align-items:center;}
.banner-frame{aspect-ratio:6/7; overflow:hidden; width:100%; max-width:520px; justify-self:end;}
.banner-frame img{width:100%; height:100%; object-fit:cover; filter:contrast(1.08) saturate(1.05);}
.banner .eyebrow{color:rgba(255,255,255,.65);}
.banner h2{font-size:clamp(2rem,4vw,3rem); color:#fff;}
.banner p{color:rgba(255,255,255,.8); max-width:46ch;}
.banner .btn{border-color:#fff; color:#fff; margin-top:1.2rem;}
.banner .btn:hover{background:#fff; color:var(--ink);}
@media (max-width:820px){.banner .wrap{grid-template-columns:1fr;} .banner-frame{order:-1; justify-self:center; max-width:420px;}}

/* ---------- Galería ---------- */
.gallery{display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem;}
.gallery figure{margin:0;}
.gallery-frame{aspect-ratio:4/3; overflow:hidden; background:var(--stone);}
.gallery img{width:100%; height:100%; object-fit:cover; filter:contrast(1.06) saturate(1.04) brightness(1.02);}
.gallery figcaption{font-size:.76rem; text-transform:uppercase; letter-spacing:.07em; color:var(--ink-soft); margin-top:.7rem;}
@media (max-width:820px){.gallery{grid-template-columns:1fr;}}

/* ---------- Certificaciones ---------- */
.cred-band{background:var(--stone);}
.cred-eyebrow{text-align:center; margin-bottom:1.6rem;}
.cred-logos{display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(22px,3.4vw,44px) clamp(24px,4vw,56px); align-items:center; justify-items:center; max-width:920px; margin:0 auto;}
.cred-logos img{width:auto; max-width:100%; height:clamp(64px,7.4vw,96px); object-fit:contain; mix-blend-mode:multiply;}
.cred-logos img.is-amme{height:clamp(48px,5.6vw,72px);}
@media (max-width:640px){.cred-logos{grid-template-columns:repeat(2,1fr);}}
.cred-text{max-width:720px; text-align:center; color:var(--ink-soft); margin:2.8rem auto 0;}
.cred-about{display:grid; grid-template-columns:minmax(220px,300px) 1fr; gap:clamp(24px,4vw,56px); align-items:center; max-width:920px; margin:2.8rem auto 0;}
.cred-about img{width:100%; height:auto; aspect-ratio:4/5; object-fit:cover; filter:contrast(1.04) saturate(1.03);}
.cred-about .eyebrow{margin:0 0 .8rem;}
.cred-about .cred-text{text-align:left; margin:0; max-width:none;}
@media (max-width:640px){.cred-about{grid-template-columns:1fr; max-width:340px;} .cred-about .eyebrow,.cred-about .cred-text{text-align:center;}}

/* ---------- Preguntas frecuentes ---------- */
.faq{max-width:820px;}
.faq-title{font-size:clamp(1.9rem,3.6vw,2.8rem); margin-bottom:1.6rem;}
details{border-bottom:1px solid var(--line); padding:1.3rem 0;}
details:first-of-type{border-top:1px solid var(--line);}
summary{
  font-weight:600; font-size:1rem; cursor:pointer; list-style:none;
  display:flex; justify-content:space-between; align-items:center; gap:1rem;
}
summary::-webkit-details-marker{display:none;}
summary::after{content:"+"; font-size:1.4rem; color:var(--ink-soft); flex-shrink:0; font-weight:300;}
details[open] summary::after{content:"–";}
details p{color:var(--ink-soft); margin:.9rem 0 0; max-width:65ch; font-size:.95rem;}

/* ---------- Contacto ---------- */
.contact{background:var(--stone);}
.contact .wrap{display:grid; grid-template-columns:1.1fr 1fr; gap:clamp(28px,5vw,64px);}
.contact h2{font-size:clamp(1.9rem,3.6vw,2.8rem);}
.contact-list{list-style:none; margin:1.6rem 0 0; padding:0; display:flex; flex-direction:column; gap:1.1rem;}
.contact-list li{font-size:.96rem;}
.contact-list b{display:block; font-size:.68rem; text-transform:uppercase; letter-spacing:.09em; font-weight:600; color:var(--ink-soft); margin-bottom:.25rem;}
.contact-list a{text-decoration:none;}
.contact-list a:hover{color:var(--accent);}
.contact-box{background:var(--paper); padding:1.9rem; align-self:start;}
.contact-box p{color:var(--ink-soft); font-size:.92rem; margin-top:0;}
.contact-box .btn{width:100%; justify-content:center;}
.contact-box .btn + .btn{margin-top:.8rem;}
@media (max-width:820px){.contact .wrap{grid-template-columns:1fr;}}

/* ---------- Pie ---------- */
footer{background:var(--ink); color:rgba(255,255,255,.7); padding-block:3rem 1.6rem;}
.footer-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:2rem; padding-bottom:2.4rem; border-bottom:1px solid rgba(255,255,255,.14);}
.footer-grid img{height:58px; width:auto; margin-bottom:1rem;}
.footer-grid p{font-size:.86rem; max-width:32ch; margin:0;}
.footer-grid h4{font-size:.72rem; text-transform:uppercase; letter-spacing:.09em; color:#fff; margin:0 0 1rem; font-weight:600;}
.footer-grid ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.6rem; font-size:.86rem;}
.footer-grid a{text-decoration:none;}
.footer-grid a:hover{color:#fff;}
.footer-bottom{padding-top:1.4rem; font-size:.76rem;}
@media (max-width:820px){.footer-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:520px){.footer-grid{grid-template-columns:1fr;}}

/* ---------- Subpáginas ---------- */
nav.links a[aria-current="page"]{color:var(--accent);}
.page-hero{background:var(--stone); padding-block:clamp(40px,6vw,76px);}
.page-hero h1{font-size:clamp(2.2rem,5vw,3.6rem); max-width:22ch;}
.page-hero .lead{max-width:66ch; color:var(--ink-soft); font-size:1.02rem; margin:0 0 1rem;}
.cat-nav{display:flex; flex-wrap:wrap; gap:.6rem; margin-top:1.8rem;}
.cat-nav a{border:1px solid var(--ink); padding:.6em 1.1em; font-size:.7rem; text-transform:uppercase; letter-spacing:.09em; font-weight:600; text-decoration:none;}
.cat-nav a:hover{background:var(--ink); color:#fff;}
.cat-nav a.is-main{background:var(--ink); color:#fff;}
.cat-nav a.is-main:hover{background:#000;}

.svc-sec{padding-block:0; border-bottom:1px solid var(--line);}
.svc-sec.is-main{background:var(--stone);}
.svc{display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(24px,5vw,72px); align-items:start; padding-block:clamp(44px,6vw,80px);}
.svc--flip{grid-template-columns:.95fr 1.05fr;}
.svc--flip .svc__text{order:2;}
.svc h2{font-size:clamp(1.9rem,3.6vw,2.8rem);}
.svc h3{font-family:'Open Sans',sans-serif; font-style:normal; font-size:.76rem; text-transform:uppercase; letter-spacing:.13em; font-weight:600; margin:1.8rem 0 .6rem;}
.svc p{color:var(--ink-soft); max-width:62ch;}
.svc ul{list-style:none; margin:0 0 1rem; padding:0; display:grid; gap:.65rem;}
.svc li{color:var(--ink-soft); padding-left:1.2rem; position:relative; max-width:62ch;}
.svc li::before{content:"–"; position:absolute; left:0;}
.svc li b{color:var(--ink); font-weight:600;}
.svc__cta{margin:1.8rem 0 0;}
.svc__media{display:grid; gap:.8rem; align-self:start;}
.svc__media img{width:100%; height:100%; object-fit:cover; aspect-ratio:6/7; filter:contrast(1.05) saturate(1.04);}
.svc__media.m2{grid-template-columns:1fr 1fr;}
.svc__media.m3{grid-template-columns:1fr 1fr;}
.svc__media.m3 img:first-child{grid-column:1/-1; aspect-ratio:4/3;}
.svc__media.m5{grid-template-columns:1fr 1fr;}
.svc__media.m5 img{aspect-ratio:4/5;}
.svc__media.m5 img:last-child{grid-column:1/-1; aspect-ratio:4/3; object-position:50% 60%;}
.svc__media.m6{grid-template-columns:1fr 1fr;}
.svc__media.m6 img{aspect-ratio:4/5;}
.svc__media.m4{grid-template-columns:1fr 1fr;}
.svc__media.m4 img{aspect-ratio:auto; height:auto; object-fit:contain;}
.svc__media.m8{grid-template-columns:1fr 1fr;}
.svc__media.m8 img{aspect-ratio:4/5;}
.svc__media.m8 img.wide{grid-column:1/-1; aspect-ratio:3/2;}
.svc__media.m8 img.wide.nat{aspect-ratio:auto; height:auto; object-fit:contain;}
.svc__media.ba img,.svc__media.m3.ba img:first-child{aspect-ratio:auto; height:auto; object-fit:contain;}
@media (max-width:820px){
  .svc,.svc--flip{grid-template-columns:1fr;}
  .svc--flip .svc__text{order:0;}
  .svc__media{order:-1;}
  .svc__media.m1 img{aspect-ratio:4/3;}
}

.how .steps{display:grid; grid-template-columns:repeat(3,1fr); gap:2.4rem;}
.how .step .num{font-family:'Instrument Serif',serif; font-style:italic; font-size:2.6rem; line-height:1; margin:0 0 .4rem; color:var(--accent);}
.how .step h3{font-family:'Open Sans',sans-serif; font-style:normal; font-size:.95rem; text-transform:uppercase; letter-spacing:.05em; font-weight:600; margin:0 0 .5rem;}
.how .step p{color:var(--ink-soft); font-size:.94rem; margin:0;}
@media (max-width:820px){.how .steps{grid-template-columns:1fr; gap:1.8rem;}}

.legal{padding-block:clamp(40px,6vw,80px);}
.legal .wrap{max-width:860px;}
.legal h1{font-size:clamp(2rem,4.4vw,3rem); margin-bottom:1.4rem;}
.legal h2{font-size:clamp(1.4rem,2.6vw,1.8rem); margin:2.2rem 0 .6rem;}
.legal h3{font-family:'Open Sans',sans-serif; font-style:normal; font-weight:600; font-size:1rem; margin:1.6rem 0 .5rem;}
.legal p,.legal li{color:var(--ink-soft); font-size:.96rem; max-width:72ch;}
.legal ul{padding-left:1.2rem;}
.legal a{text-decoration:underline;}

/* ---------- Carrusel de fotos (servicios) ---------- */
.svc--solo{grid-template-columns:1fr; padding-bottom:2.6rem;}
.svc--solo .svc__text{max-width:860px;}
.car{padding-bottom:clamp(44px,6vw,80px);}
.car__bar{display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:1rem;}
.car__bar .eyebrow{margin:0;}
.car__btns{display:flex; gap:.5rem;}
.car__btn{width:44px; height:44px; border:1px solid var(--ink); background:transparent; color:var(--ink); font-size:1.2rem; cursor:pointer; transition:background .2s,color .2s;}
.car__btn:hover{background:var(--ink); color:#fff;}
.car__view{container-type:inline-size;}
.car__track{--car-gap:10px; --car-n:6; --car-col:calc((100cqw - (var(--car-n) - 1) * var(--car-gap)) / var(--car-n));
  list-style:none; margin:0; padding:0; display:grid; gap:var(--car-gap);
  grid-auto-flow:column dense; grid-auto-columns:var(--car-col); grid-auto-rows:calc(var(--car-col) * 1.25);
  overflow-x:auto; scroll-snap-type:x proximity; scrollbar-width:none; -webkit-overflow-scrolling:touch;}
.car__track::-webkit-scrollbar{display:none;}
.car__item{position:relative; overflow:hidden; background:var(--stone); scroll-snap-align:start;}
.car__item.is-wide{grid-column:span 3; grid-row:span 2;}
.car__item img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; filter:contrast(1.05) saturate(1.04);}
@media (max-width:900px){.car__track{--car-n:5;}}
@media (max-width:600px){.car__track{--car-n:3;}}