/* Capa de movimiento y estructura inspirada en covasem.com (08/10/2026).
   Mismas mecánicas (palabras que suben, títulos que se revelan, filas que se rellenan,
   carrusel fijado con el scroll, cifras que cuentan, escenas, paralaje), con la paleta MBS:
   crema, tinta verde muy oscura y marrón madera. Se carga después de style.css y architecture.css. */
:root{
  --m-wood:#785438;
  --m-wood-2:#5c3d26;
  --m-ink:#1d1a16;
  --m-text:#4a4239;
  --m-cream:#f4f0e8;
  --m-serif:Georgia,"Times New Roman",serif;
  --m-ease:cubic-bezier(.16,.75,.18,1);
}

/* ── Tipografía coherente: todos los titulares en serif, como la portada ── */
main h2,main h2 *{font-family:var(--m-serif)!important;font-weight:400!important}
main h2{letter-spacing:-.035em!important}
/* Texto de lectura más grande y con más contraste (pacientes de todas las edades) */
main section:not(.hero) p:not(.section-label):not(.photo-band-quote):not(.callback-note):not(.route-note):not(.clinical-note){font-size:clamp(15.5px,1.05vw,17px);line-height:1.68;color:var(--m-text)}
main .home-coordination p:not(.section-label){color:rgba(255,248,238,.82)!important}

/* ── Revelados genéricos ── */
.m-reveal{opacity:0;transform:translate3d(0,38px,0);transition:opacity .9s ease var(--m-d,0ms),transform 1.05s var(--m-ease) var(--m-d,0ms)}
.m-reveal.is-visible{opacity:1;transform:none}
/* Rendimiento (08/10): sin desenfoque animado en los titulares */
.m-title{opacity:0;clip-path:inset(0 0 22% 0);transform:translate3d(0,38px,0) skewY(1.5deg);transition:opacity .85s ease,clip-path .95s cubic-bezier(.2,.7,.2,1),transform .95s var(--m-ease)}
.m-title.is-visible{opacity:1;clip-path:inset(-10% 0 -20% 0);filter:none;transform:none}
.m-media{overflow:hidden;clip-path:inset(10% 6% 10% 6% round 6px);transition:clip-path 1.35s var(--m-ease)}
.m-media.is-visible{clip-path:inset(0 0 0 0 round 0)}
.m-media img{transform:scale(1.14) translate3d(0,var(--m-py,0px),0);transition:transform 1.6s var(--m-ease)}
.m-media.is-visible img{transform:scale(1.06) translate3d(0,var(--m-py,0px),0)}

/* ── Portada: el titular llega palabra a palabra ── */
h1 .m-word-mask,h1 .m-word{color:inherit!important;font-style:inherit!important;font-weight:inherit;white-space:normal}
.m-word-mask{display:inline-block;overflow:hidden;padding:.07em 0 .14em;margin:-.07em 0 -.14em;vertical-align:-.11em}
.m-word{display:inline-block;opacity:0;transform:translate3d(0,115%,0) rotateX(17deg);transform-origin:50% 100%;animation:m-word .95s var(--m-ease) calc(120ms + var(--i,0) * 70ms) both}
@keyframes m-word{0%{opacity:.01;transform:translate3d(0,115%,0) rotateX(17deg)}100%{opacity:1;transform:none}}
.hero .eyebrow,.hero .hero-lead,.hero .hero-request,.hero .hero-fact,.hero .appointment-panel{opacity:0;transform:translate3d(0,22px,0);animation:m-up 1s var(--m-ease) both}
.hero .eyebrow{animation-delay:.05s}.hero .hero-lead{animation-delay:.55s}.hero .hero-request{animation-delay:.7s}.hero .appointment-panel{animation-delay:.6s}
.hero .hero-fact:nth-child(1){animation-delay:.85s}.hero .hero-fact:nth-child(2){animation-delay:.95s}.hero .hero-fact:nth-child(3){animation-delay:1.05s}.hero .hero-fact:nth-child(4){animation-delay:1.15s}
@keyframes m-up{to{opacity:1;transform:none}}
.hero .hero-image img{animation:m-hero-in 2.4s var(--m-ease) both}
@keyframes m-hero-in{from{transform:scale(1.08)}to{transform:scale(1)}}
.hero{--mx:50%;--my:40%}
.hero::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:1;background:radial-gradient(520px circle at var(--mx) var(--my),rgba(255,226,180,.10),transparent 60%);transition:background .2s}

/* ── Especialidades: filas que se rellenan de madera al bajar ── */
.specialties-x{padding:clamp(80px,10vw,150px) var(--gutter) clamp(70px,8vw,120px);background:var(--paper,#f7f5f0)}
.specialties-x-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(30px,6vw,110px);align-items:end;margin-bottom:clamp(40px,5vw,70px)}
.specialties-x-head .section-label{grid-column:1/-1;margin:0}
.specialties-x-head h2{margin:0}
.specialties-x-head p{margin:0;max-width:52ch}
.srows{border-top:1px solid rgba(29,26,22,.16)}
.srow{position:relative;isolation:isolate;display:grid;grid-template-columns:64px minmax(0,1.1fr) minmax(0,1fr) 48px;align-items:center;gap:24px;padding:clamp(22px,2.6vw,34px) clamp(14px,2vw,28px);border-bottom:1px solid rgba(29,26,22,.16);color:var(--m-ink);text-decoration:none;overflow:hidden}
.srow::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(110deg,var(--m-wood),var(--m-wood-2));transform:scaleX(var(--fill,0));transform-origin:left;transition:transform .12s linear}
.srow-num{font-size:12px;letter-spacing:.14em;color:var(--m-wood);transition:color .35s}
.srow-name{font-family:var(--m-serif);font-size:clamp(28px,3.3vw,50px);line-height:1.05;letter-spacing:-.035em;transition:color .35s,transform .5s var(--m-ease)}
.srow-desc{font-size:15px;line-height:1.55;color:var(--m-text);transition:color .35s}
.srow-arrow{justify-self:end;display:grid;place-items:center;width:46px;height:46px;border:1px solid rgba(29,26,22,.22);border-radius:50%;font-size:18px;transition:transform .45s var(--m-ease),border-color .35s,color .35s,background .35s}
.srow.is-filled :is(.srow-num,.srow-name,.srow-desc,.srow-arrow){color:#fff}
.srow.is-filled .srow-arrow{border-color:rgba(255,255,255,.5)}
.srow:hover .srow-name{transform:translateX(10px)}
.srow:hover .srow-arrow{transform:rotate(45deg);background:#fff;color:var(--m-wood)!important;border-color:#fff}

/* ── Carruseles fijados: avanzan en horizontal mientras bajas ── */
.m-reel{position:relative;height:calc(var(--m-distance,0px) + 100vh)}
.m-reel-sticky{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;justify-content:center;overflow:hidden}
.m-reel .m-track{overflow:visible!important;scroll-snap-type:none!important;will-change:transform}
.m-reel .gallery-navigation{display:none!important}
.m-hud{display:flex;align-items:center;gap:18px;margin-top:28px;font-size:12px;letter-spacing:.14em;color:var(--m-wood)}
.m-hud-bar{position:relative;flex:0 0 min(320px,40vw);height:2px;background:rgba(120,84,56,.2);overflow:hidden}
.m-hud-bar span{position:absolute;inset:0;background:var(--m-wood);transform:scaleX(var(--p,0));transform-origin:left}
.m-reel .m-track>*{transition:transform .8s var(--m-ease),filter .8s ease,opacity .8s ease}
.m-reel .m-track>*:not(.is-current){filter:saturate(.75);opacity:.82}
.m-reel .m-track>.is-current{transform:translateY(-8px)}

/* ── Cinta de especialidades: se mueve sola y acelera con el scroll ── */
.marquee{overflow:hidden;padding:clamp(26px,3vw,40px) 0;border-block:1px solid rgba(29,26,22,.12);background:var(--m-cream)}
.marquee-track{display:flex;align-items:center;gap:clamp(26px,3vw,46px);width:max-content;transform:translate3d(var(--mq,0px),0,0);will-change:transform}
.marquee-track span{font-family:var(--m-serif);font-size:clamp(34px,5vw,78px);letter-spacing:-.04em;color:transparent;-webkit-text-stroke:1px rgba(120,84,56,.55);white-space:nowrap;transition:color .4s,-webkit-text-stroke-color .4s}
.marquee-track span:hover{color:var(--m-wood);-webkit-text-stroke-color:var(--m-wood)}
.marquee-track i{font-style:normal;font-size:clamp(16px,1.6vw,24px);color:var(--m-wood)}

/* ── Otorrino: escenas fijadas que se relevan con el scroll ── */
.home-orl.m-story{display:block!important;max-width:none!important;margin:0!important;height:calc(var(--scenes,3) * 85vh + 30vh);padding:0!important}
.home-orl.m-story .story-pin{position:sticky;width:100%;top:0;min-height:100vh;display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:clamp(40px,6vw,110px);align-items:center;padding:110px var(--gutter) 60px;box-sizing:border-box}
.home-orl.m-story .clinical-list{position:relative;min-height:360px;display:block}
.home-orl.m-story [data-scene]{position:absolute;inset:0 0 auto 0;padding:0 0 0 clamp(24px,3vw,48px);border:0!important;opacity:var(--o,0);transform:translate3d(var(--x,0px),var(--y,0px),0) rotate(var(--r,0deg)) scale(var(--s,1));transform-origin:0 50%;will-change:transform,opacity}
.home-orl.m-story [data-scene] span{display:block;font-size:12px;letter-spacing:.16em;color:var(--m-wood);margin-bottom:22px}
.home-orl.m-story [data-scene] h3{font-family:var(--m-serif);font-weight:400;font-size:clamp(34px,3.8vw,60px);line-height:1.05;letter-spacing:-.035em;margin:0 0 22px;color:var(--m-ink)}
.home-orl.m-story [data-scene] p{max-width:40ch}
.home-orl.m-story .clinical-note{position:absolute;left:clamp(24px,3vw,48px);right:0;top:300px;font-size:13px;color:#7a6f63;max-width:56ch}
.story-progress{display:none}
.story-dots{display:none}
.home-orl.m-story .story-dots{display:flex}
.home-orl.m-story .story-progress{display:block;position:absolute;left:0;top:0;width:2px;height:270px;background:rgba(120,84,56,.18)}
.home-orl.m-story .story-progress span{position:absolute;inset:0;background:var(--m-wood);transform:scaleY(var(--sp,0));transform-origin:top}
.home-orl.m-story .story-dots{position:absolute;left:clamp(24px,3vw,48px);top:-56px;display:flex;gap:10px}
.story-dots b{font-weight:400;font-size:12px;letter-spacing:.12em;color:rgba(120,84,56,.45);transition:color .3s}
.story-dots b.is-on{color:var(--m-wood)}

/* ── Franja de foto a todo el ancho con paralaje ── */
.photo-band{position:relative;height:min(78vh,720px);overflow:hidden;display:grid;align-items:end}
.photo-band img{position:absolute;inset:-12% 0;width:100%;height:124%;object-fit:cover;transform:translate3d(0,var(--m-py,0px),0) scale(1.04)}
.photo-band::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(20,16,12,.72),rgba(20,16,12,.08) 55%)}
.photo-band-copy{position:relative;z-index:1;padding:0 var(--gutter) clamp(44px,6vw,80px);color:#fff}
.photo-band-copy .section-label{color:rgba(255,240,220,.8)!important}
.photo-band-quote{margin:0;font-family:var(--m-serif);font-size:clamp(40px,6vw,92px);line-height:1.02;letter-spacing:-.04em}
.photo-band-quote em{color:#e8c99a}

/* ── Primera consulta, proceso y rutas: líneas que se dibujan ── */
.home-first ul{position:relative}
.home-first ul li{opacity:.25;transition:opacity .6s ease}
.home-first ul li.is-on{opacity:1}
.process-steps{position:relative}
.process-steps::before{content:"";position:absolute;left:19px;top:10px;bottom:10px;width:2px;background:rgba(120,84,56,.16)}
.process-steps::after{content:"";position:absolute;left:19px;top:10px;bottom:10px;width:2px;background:var(--m-wood);transform:scaleY(var(--pp,0));transform-origin:top}
.process-steps li{position:relative;z-index:1;opacity:.35;transition:opacity .6s ease}
.process-steps li.is-on{opacity:1}
.process-steps li>span{background:var(--paper,#f7f5f0);transition:background .4s,color .4s}
.process-steps li.is-on>span{color:var(--m-wood)}
.care-routes ol{position:relative}
.care-routes li{opacity:.3;transform:translateX(-10px);transition:opacity .6s ease,transform .6s var(--m-ease)}
.care-routes li.is-on{opacity:1;transform:none}
.care-routes article{position:relative}
.care-routes article::after{content:"";position:absolute;left:0;bottom:-1px;height:2px;width:100%;background:#e8c99a;transform:scaleX(var(--rp,0));transform-origin:left}
.home-coordination{--mx:50%;--my:50%;position:relative;isolation:isolate}
.home-coordination::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(600px circle at var(--mx) var(--my),rgba(232,201,154,.14),transparent 62%)}

/* ── Cifras ── */
.review-figures strong{font-variant-numeric:tabular-nums}
.review-figures{grid-template-columns:repeat(4,minmax(0,1fr))!important}

/* ── Equipo ── */
.team-photo-rail article img{transition:transform .9s var(--m-ease),filter .6s ease;filter:saturate(.85)}
.team-photo-rail article:hover img{transform:scale(1.04);filter:none}

/* ── Móvil y tablet: sin fijados, revelados suaves ── */
@media (max-width:900px){
  .specialties-x-head{grid-template-columns:1fr;gap:18px}
  .srow{grid-template-columns:40px minmax(0,1fr) 40px;gap:14px}
  .srow-name{font-size:clamp(24px,7vw,34px);overflow-wrap:anywhere;hyphens:auto}
  .srow-desc{grid-column:2/3;grid-row:2;font-size:14px}
  .srow-arrow{grid-row:1/3;grid-column:3;width:38px;height:38px}
  .review-figures{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .photo-band{height:60vh}
}
@media (prefers-reduced-motion:reduce){
  .m-reveal,.m-title,.m-media,.m-media img,.m-word,.hero *{opacity:1!important;transform:none!important;filter:none!important;clip-path:none!important;animation:none!important;transition:none!important}
}