/* Reference-inspired photographic treatment scenes, using Bru's own content. */
.solution-panel{height:100svh;min-height:800px;max-height:1100px;display:block;isolation:isolate;overflow:hidden;background:#17171f}
.solution-image{position:absolute;inset:0 50% 0 0;min-height:0;height:100%;order:0!important;z-index:-1}
.solution-image img{height:100%;width:100%;max-height:none;object-fit:cover;filter:grayscale(1);transition:transform 800ms cubic-bezier(.22,1,.36,1)}
.solution-image::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 25%,#17171fe6 100%)}
.solution-info{position:relative;margin-left:65%;width:31%;padding:60px 0 0;display:block}
.solution-info>p{font-size:19px;font-weight:500;line-height:1.22;letter-spacing:-.025em;color:#eeebef;margin:0 0 18px;max-width:390px}
.solution-detail{display:grid;grid-template-columns:40% 1fr;gap:22px;align-items:start}
.solution-detail img{width:100%;height:auto;aspect-ratio:2/3;object-fit:cover;filter:saturate(.4)}
.solution-detail ul{list-style:none;padding:0;margin:0;font-size:12px;line-height:1.4;color:#ddd6de}
.solution-detail li{padding:12px 0;border-bottom:1px solid #ffffff26}.solution-detail li:first-child{padding-top:0}
.solution-title{position:absolute;left:33%;right:4%;bottom:100px;font:400 clamp(78px,8.6vw,158px)/.95 var(--serif);letter-spacing:-.03em;color:#eeebef;margin:0;pointer-events:none}
.solution-title em{color:#eeebef}.solution-title br{display:block}
.solution-bottom{position:absolute;bottom:32px;left:4vw;right:4vw;display:flex;justify-content:space-between;align-items:center;gap:25px}
.solution-bottom .solution-visit{margin:0;font-size:12px;color:#ddd0d8}
.solution-discover{display:flex;align-items:center;gap:32px;min-height:48px;padding:13px 22px;border-radius:40px;background:#efeded;color:#352f33;font-size:13px;line-height:1.3;transition:background 180ms ease,transform 160ms ease}.solution-discover:active{transform:scale(.97)}
@media(hover:hover) and (pointer:fine){.solution-discover:hover{background:#e2cbd8}.solution-panel:hover .solution-image img{transform:scale(1.025)}}
@media(min-width:761px) and (max-width:1100px){.solution-info{margin-left:57%;width:39%}.solution-info>p{font-size:17px}.solution-detail{gap:16px}.solution-title{left:28%;font-size:9vw}}
@media(max-width:760px){
 .solution-panel{height:auto;min-height:0;max-height:none;display:flex;flex-direction:column;overflow:hidden;padding-bottom:28px}
 .solution-image{position:relative;inset:auto;width:100%;height:clamp(280px,85vw,360px);flex-shrink:0;z-index:0}
 .services-scroll .solution-panel .solution-image{height:clamp(280px,85vw,360px);aspect-ratio:auto}
 .solution-title{position:relative;inset:auto;order:1;font-size:clamp(59px,15vw,95px);margin:-105px 20px 0;z-index:1;line-height:1.02}
 .solution-info{order:2;margin:0;padding:32px 20px 0;width:100%}.solution-info>p{font-size:17px;max-width:370px;margin-bottom:24px}
 .solution-detail{grid-template-columns:112px 1fr;gap:24px}.solution-detail img{height:158px;aspect-ratio:auto}.solution-detail ul{font-size:13px}.solution-detail li{padding:13px 0}
 .solution-bottom{position:relative;inset:auto;order:3;margin:28px 20px 0;display:flex;flex-wrap:wrap;gap:20px}.solution-bottom .solution-visit{font-size:12px}.solution-discover{font-size:12px;gap:24px;min-height:46px}
}
@media(prefers-reduced-motion:reduce){.solution-image img,.solution-discover{transition:none}.solution-panel:hover .solution-image img{transform:none}}
.motion-paused .solution-image img{transition:none;transform:none!important}

/* A single pinned scene: incoming photographs reveal upward with natural scroll. */
.services-selector{display:none}
@media(min-width:761px) and (min-height:600px){
 .services-ready{height:340svh;position:relative}
 .services-ready .services-stage{position:sticky;top:0;height:100svh;overflow:hidden;background:#17171f;isolation:isolate}
 .services-ready .solution-panel{position:absolute;inset:0;height:100%;min-height:0;max-height:none;background:transparent;border:0;pointer-events:none}
 .services-ready .solution-panel.is-current{pointer-events:auto}
 .services-ready .solution-image{clip-path:inset(var(--image-cut,100%) 0 0);will-change:clip-path}
 .services-ready .solution-image img{transform:scale(var(--image-scale,1));transition:none;will-change:transform}
 .services-ready .solution-info,.services-ready .solution-title,.services-ready .solution-bottom{opacity:var(--service-opacity,0);transform:translateY(var(--service-y,30px));will-change:transform,opacity}
 .services-ready .solution-info{padding-top:80px}
 .services-ready .solution-info:before{content:'Nuestros tratamientos';display:block;font-size:11px;color:#eee5ec;position:absolute;top:30px;left:0}
 .services-ready .solution-title{left:33%;bottom:76px;font-size:clamp(78px,9vw,158px)}
 .services-ready .solution-visit{display:none}
 .services-ready .solution-bottom{justify-content:flex-end;bottom:28px}
 .services-ready .services-selector{position:absolute;display:flex;flex-direction:column;align-items:flex-start;bottom:28px;left:28px;z-index:10;gap:3px}
 .services-selector>span{font-size:11px;margin-bottom:14px;color:#e7dce4}
 .services-selector button{background:transparent;border:0;padding:3px 0;color:#bbb2ba;font:500 12px/1.25 var(--sans);text-align:left;cursor:pointer}
 .services-selector button[aria-pressed=true]{color:#fff}
 .services-selector button:hover{color:#fff}.services-selector button:focus-visible{outline:2px solid #e5b9d0;outline-offset:4px}
}

