html{background:#f4f0e3}
body{width:100%;max-width:1440px;margin-inline:auto;box-shadow:0 0 48px rgba(50,98,14,.12)}
nav a.active:not(.nav-cta){color:var(--gold);font-weight:700}
.light-link{color:white}
.page-hero{padding:clamp(4rem,8vw,7rem) max(6vw,1.4rem);background:var(--green);color:white}
.page-hero h1{max-width:15ch;margin:0;font-family:var(--serif);font-size:clamp(2.7rem,5.4vw,5.8rem);font-weight:400;line-height:1}
.page-hero p:last-child{max-width:48rem;margin:1.7rem 0 0;color:rgba(255,255,255,.76);font-size:1.12rem}
.breadcrumb{margin-bottom:1rem;font-size:.78rem;color:rgba(255,255,255,.64)}
.breadcrumb a{border-bottom:1px solid rgba(255,255,255,.35)}
.page-content{padding:clamp(3.5rem,7vw,7rem) max(6vw,1.4rem);background:white}
.page-content.alt{background:#f4f0e3}
.content-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(18rem,.95fr);gap:clamp(3rem,8vw,8rem);align-items:start}
.prose{max-width:50rem}
.treatment-flow{max-width:62rem}
.treatment-flow>p,.treatment-flow>h3{max-width:50rem}
.treatment-image{width:min(100%,50rem);aspect-ratio:4/3;margin:2rem 0 3rem;overflow:hidden;background:var(--cream);border:1px solid var(--line)}
.treatment-image img{width:100%;height:100%;object-fit:cover;object-position:center 48%}
.prose h2,.page-content h2{margin:0 0 1.3rem;font-family:var(--serif);font-size:clamp(2rem,3.8vw,4rem);font-weight:400;line-height:1.08}
.prose h3{margin:2rem 0 .5rem;font-family:var(--serif);font-size:1.55rem;font-weight:400}
.prose p,.prose li{color:var(--muted)}
.info-card{padding:2rem;background:var(--cream);border-top:3px solid var(--gold)}
.info-card h2{font-size:1.75rem}
.info-card ul{padding-left:1.2rem}
.page-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:2rem}
.page-cards article{padding:1.7rem;background:var(--cream);border:1px solid var(--line)}
.page-cards h3{margin:0 0 .5rem;font-family:var(--serif);font-size:1.45rem;font-weight:400}
.page-cards p{margin:0;color:var(--muted)}
.page-cta{display:flex;align-items:center;justify-content:space-between;gap:2rem;padding:clamp(2.5rem,5vw,4.5rem) max(6vw,1.4rem);background:#eee8d8}
.page-cta h2{margin:0;font-family:var(--serif);font-size:clamp(2rem,3vw,3.3rem);font-weight:400}
.page-cta p{margin:.4rem 0 0;color:var(--muted)}
.team-profile{display:grid;grid-template-columns:minmax(15rem,.72fr) minmax(0,1.28fr);gap:clamp(3rem,8vw,8rem);align-items:center}
.team-photo{aspect-ratio:4/5;display:grid;place-items:center;background:linear-gradient(145deg,#467e1c,#244909);color:rgba(255,255,255,.62);text-align:center;font-size:.75rem;letter-spacing:.12em}
@media(max-width:1440px){body{box-shadow:none}}
@media(max-width:1050px){nav{gap:.9rem;font-size:.82rem}.page-cards{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.content-grid,.team-profile{grid-template-columns:1fr}.page-cards{grid-template-columns:1fr}.page-cta{align-items:flex-start;flex-direction:column}.page-hero h1{font-size:clamp(2.4rem,12vw,3rem)}.treatment-image{aspect-ratio:1/1;margin:1.5rem 0 2.5rem}}

.legal-content{max-width:58rem;margin:0 auto}
.legal-content h2{margin-top:2.8rem;font-size:clamp(1.55rem,2.5vw,2.2rem)}
.legal-content p,.legal-content li{color:var(--muted)}
.legal-content .legal-pending{padding:1rem 1.2rem;border-left:3px solid var(--gold);background:var(--cream);color:var(--ink)}
.cookie-table-wrap{overflow-x:auto;margin:1.5rem 0}
.cookie-table{width:100%;border-collapse:collapse;background:#fff;font-size:.94rem}
.cookie-table th,.cookie-table td{padding:.9rem 1rem;border:1px solid var(--line);text-align:left;vertical-align:top}
.cookie-table th{background:var(--green);color:#fff}
.treatment-flow .treatment-image{aspect-ratio:16/9;border:0;border-radius:16px;background:#fff}
@media(max-width:700px){.treatment-flow .treatment-image{border-radius:12px}}

.treatment-flow .treatment-image{aspect-ratio:auto;overflow:visible;display:block;margin-bottom:2.4rem}
.treatment-flow .treatment-image img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:16px}
.treatment-flow figcaption{margin-top:.45rem;color:var(--muted);font-size:.8rem;line-height:1.4}
.aesthetic-hero-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(15rem,.7fr);gap:clamp(2rem,6vw,6rem);align-items:center}
.aesthetic-hero-layout img{width:100%;height:clamp(18rem,34vw,33rem);object-fit:cover;object-position:center 35%;border-radius:12px}
.aesthetic-hero-layout p:last-child{margin-bottom:0}
@media(max-width:700px){.aesthetic-hero-layout{grid-template-columns:1fr}.aesthetic-hero-layout img{height:19rem}.treatment-flow .treatment-image{margin-bottom:2rem}}

/* v46: keep the valuation button on one line and make the map preview clickable */
.page-cta>div{min-width:0;flex:1 1 auto}
.page-cta>.button{flex:0 0 auto;white-space:nowrap;min-width:max-content}
.clinic-map-link{display:block;width:min(100%,33rem);margin-top:1.25rem;color:var(--green);font-weight:700}
.clinic-map-link img{width:100%;height:auto;border-radius:12px;border:1px solid var(--line)}
.clinic-map-link span{display:inline-block;margin-top:.4rem;text-decoration:underline;text-underline-offset:3px}
@media(max-width:700px){.page-cta>.button{max-width:100%}}

/* v51: visual treatment summaries for medicine capilar */
.capillary-intro{align-items:center}
.capillary-intro .image-panel{width:min(100%,23rem);justify-self:center}
.capillary-treatments{display:grid;gap:clamp(2.5rem,5vw,4.5rem);margin-top:clamp(3rem,7vw,6rem)}
.capillary-treatment{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2rem,5vw,5rem);align-items:center;padding-top:clamp(2rem,4vw,3rem);border-top:1px solid var(--line)}
.capillary-treatment:nth-child(even) figure{grid-column:1;grid-row:1}
.capillary-treatment:nth-child(even) .prose{grid-column:2;grid-row:1}
.capillary-treatment .prose h3{font-size:clamp(1.7rem,2.8vw,2.7rem);margin:0 0 .9rem;line-height:1.15}
.capillary-treatment figure{margin:0;min-width:0}
.capillary-treatment figure img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:16px}
.capillary-treatment figcaption{margin-top:.55rem;color:var(--muted);font-size:.8rem;line-height:1.4}
@media(max-width:700px){.capillary-treatment{grid-template-columns:1fr;gap:1.2rem}.capillary-treatment:nth-child(even) figure,.capillary-treatment:nth-child(even) .prose{grid-column:auto;grid-row:auto}.capillary-treatment figure img{border-radius:12px}}

/* v57: preserve brand palette across interior pages */
body{font-family:var(--sans)}.page-hero,.page-intro{border-radius:1.5rem}.page-content article,.content-card{border-radius:1.1rem}

/* v58 subtle depth for interior page cards */
.page-content .info-card,.page-cards article,.page-cta{border-radius:1.4rem;box-shadow:0 10px 30px rgba(43,60,37,.095)}


/* v59: estética con imágenes integradas y posters del folleto */
.section-intro{max-width:56rem;color:var(--muted);font-size:1.05rem;line-height:1.75;margin:0 0 2.2rem}
.poster-panel{background:linear-gradient(180deg,#f7f8f4,#eef1e7);padding:clamp(.8rem,1.8vw,1.2rem);border-radius:clamp(1.1rem,2vw,1.6rem);box-shadow:0 14px 34px rgba(43,60,37,.12),0 3px 12px rgba(43,60,37,.06)}
.poster-panel img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:clamp(.9rem,1.6vw,1.35rem);box-shadow:0 10px 24px rgba(43,60,37,.12)}
.aesthetic-treatments{display:grid;gap:clamp(2rem,5vw,3.6rem);margin-top:2.2rem}
.aesthetic-treatment{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:clamp(1.4rem,4vw,3.4rem);align-items:center;padding:clamp(1rem,2vw,1.4rem);background:linear-gradient(180deg,#fff,#fafbf8);border:1px solid var(--line);border-radius:1.6rem;box-shadow:0 14px 32px rgba(43,60,37,.09),0 4px 12px rgba(43,60,37,.05)}
.aesthetic-treatment.reverse .aesthetic-treatment-media{order:2}
.aesthetic-treatment.reverse .prose{order:1}
.aesthetic-treatment-media{margin:0;min-width:0;position:relative}
.aesthetic-treatment-media::after{content:"";position:absolute;inset:auto 8% -4% 8%;height:18%;background:radial-gradient(ellipse at center, rgba(144,157,118,.25), rgba(144,157,118,0));filter:blur(14px);z-index:0}
.aesthetic-treatment-media img{position:relative;z-index:1;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:center top;border-radius:1.25rem;box-shadow:0 18px 34px rgba(43,60,37,.14),0 3px 10px rgba(43,60,37,.06)}
.aesthetic-treatment .prose{max-width:none}
.aesthetic-treatment .prose h3{font-size:clamp(1.8rem,3vw,2.6rem);margin:0 0 .8rem;line-height:1.1}
.aesthetic-treatment .prose p{margin:0;color:var(--muted);font-size:1.04rem;line-height:1.78}
@media(max-width:700px){.poster-panel{padding:.75rem}.poster-panel img{aspect-ratio:16/9}.aesthetic-treatment{grid-template-columns:1fr;padding:.9rem;gap:1rem}.aesthetic-treatment.reverse .aesthetic-treatment-media,.aesthetic-treatment.reverse .prose{order:initial}.aesthetic-treatment-media img{aspect-ratio:16/9;object-position:center}.section-intro{margin-bottom:1.6rem}}

/* v63 – fotografía de cabecera, injerto FUE */
.fue-hero .fue-hero-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:clamp(1.4rem,4vw,4rem);align-items:center;margin-top:1.15rem}
.fue-hero .fue-hero-copy{min-width:0}
.fue-hero .fue-hero-copy h1{max-width:unset}
.fue-hero .fue-hero-copy p:last-child{max-width:39rem}
.fue-hero .fue-hero-visual{margin:0;min-width:0;overflow:hidden;border-radius:clamp(1rem,2vw,1.6rem);box-shadow:0 16px 38px rgba(22,39,22,.19),0 3px 10px rgba(22,39,22,.08)}
.fue-hero .fue-hero-visual img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;object-position:center center}
@media(max-width:700px){.fue-hero .fue-hero-layout{grid-template-columns:1fr;gap:1.4rem}.fue-hero .fue-hero-visual img{aspect-ratio:16/10}}

/* v64 — ampliar las dos imágenes destacadas sin alterar el contenido */
@media (min-width: 1051px) {
  #medicina-capilar.split-section {
    grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr);
    gap: clamp(1.7rem, 3.5vw, 3.5rem);
  }
  #medicina-capilar .poster-panel { width: 100%; max-width: none; }
  .fue-hero .fue-hero-layout {
    grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr);
    gap: clamp(1.4rem, 3vw, 3rem);
  }
}
@media (min-width: 701px) and (max-width: 1050px) {
  #medicina-capilar.split-section {grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:2rem;}
  .fue-hero .fue-hero-layout {grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:1.5rem;}
}
@media (max-width: 700px) {
  #medicina-capilar.split-section {grid-template-columns:1fr;}
  #medicina-capilar .poster-panel {width:100%;max-width:100%;}
  .fue-hero .fue-hero-layout {grid-template-columns:1fr;}
  .fue-hero .fue-hero-visual {width:100%;}
}


/* v65: unificación de tarjetas de tratamientos con la estética de medicina estética */
.fue-treatment-cards,.capillary-treatment-cards{margin-top:clamp(2rem,4vw,3rem)}
.fue-treatment-cards .aesthetic-treatment,.capillary-treatment-cards .aesthetic-treatment{
  display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);
  align-items:center;gap:clamp(1.4rem,4vw,3.4rem);
  padding:clamp(1rem,2vw,1.4rem);
  border:1px solid var(--line);border-radius:1.6rem;
  background:linear-gradient(180deg,#fff,#fafbf8);
  box-shadow:0 14px 32px rgba(43,60,37,.09),0 4px 12px rgba(43,60,37,.05);
}
.fue-treatment-cards .aesthetic-treatment.reverse .aesthetic-treatment-media,
.capillary-treatment-cards .aesthetic-treatment.reverse .aesthetic-treatment-media{order:2;grid-column:auto;grid-row:auto}
.fue-treatment-cards .aesthetic-treatment.reverse .prose,
.capillary-treatment-cards .aesthetic-treatment.reverse .prose{order:1;grid-column:auto;grid-row:auto}
.fue-treatment-cards .aesthetic-treatment-media,
.capillary-treatment-cards .aesthetic-treatment-media{margin:0;min-width:0;width:100%;aspect-ratio:auto;display:block;overflow:visible;background:transparent;border:0}
.fue-treatment-cards .aesthetic-treatment-media img,
.capillary-treatment-cards .aesthetic-treatment-media img{
 display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;object-position:center;
 border-radius:1.25rem;box-shadow:0 12px 26px rgba(43,60,37,.13),0 3px 10px rgba(43,60,37,.05)}
.fue-treatment-cards .prose h3,.capillary-treatment-cards .prose h3{
  margin:0 0 .8rem;font-size:clamp(1.8rem,3vw,2.6rem);line-height:1.12}
.fue-treatment-cards .prose p,.capillary-treatment-cards .prose p{margin:0;line-height:1.78;font-size:1.04rem}
.fue-treatment-cards figcaption,.capillary-treatment-cards figcaption{margin:.65rem .15rem 0;font-size:.8rem;color:var(--muted)}
@media(max-width:700px){
 .fue-treatment-cards .aesthetic-treatment,.capillary-treatment-cards .aesthetic-treatment{grid-template-columns:1fr;gap:1.25rem;padding:.9rem}
 .fue-treatment-cards .aesthetic-treatment.reverse .aesthetic-treatment-media,
 .capillary-treatment-cards .aesthetic-treatment.reverse .aesthetic-treatment-media,
 .fue-treatment-cards .aesthetic-treatment.reverse .prose,
 .capillary-treatment-cards .aesthetic-treatment.reverse .prose{order:initial}
 .fue-treatment-cards .aesthetic-treatment-media img,.capillary-treatment-cards .aesthetic-treatment-media img{aspect-ratio:16/10}
}