/* Video de servicios integrado al lienzo, con texto más ligero. */
@media (min-width:761px){
  .service-theater{width:80%!important;margin-left:auto!important;margin-right:auto!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
  .service-film{border-radius:0!important}
  .service-theater::after{background:linear-gradient(90deg,rgba(248,248,246,.70) 0%,rgba(248,248,246,.38) 24%,rgba(248,248,246,.06) 47%,transparent 66%)!important}
  .service-theater-copy{left:clamp(20px,3.6vw,54px)!important;bottom:clamp(20px,4vw,48px)!important;max-width:min(34%,360px)!important}
  .service-theater-copy span{margin-bottom:9px!important;font-size:11px!important}
  .service-theater-copy h3{font-size:clamp(2.3rem,3.7vw,4.15rem)!important;line-height:.91!important}
  .service-theater-copy p{margin-top:13px!important;font-size:clamp(13px,1vw,16px)!important}
  .service-stepper{right:clamp(18px,3vw,42px)!important;bottom:clamp(18px,3vw,38px)!important}
}

/* En escritorio, el teatro ocupa menos pantalla sin deformar el video. */
@media(min-width:761px){.service-theater{width:80%!important;margin-left:auto!important;margin-right:auto!important}}

/* En celular: el video horizontal se ve completo; la copia vive debajo. */
@media(max-width:760px){
  .service-theater{width:100vw!important;min-height:calc(56.25vw + 250px)!important;padding-top:56.25vw!important;margin-left:calc(50% - 50vw)!important;margin-right:calc(50% - 50vw)!important;border-radius:0!important;background:#f8f8f6!important;box-shadow:none!important}
  .service-film{inset:0 auto auto 0!important;width:100vw!important;height:56.25vw!important;object-fit:cover!important;object-position:center!important}
  .service-theater::after{inset:0 0 auto 0!important;height:56.25vw!important;background:linear-gradient(180deg,transparent 62%,rgba(248,248,246,.28))!important}
  .service-theater-copy{top:calc(56.25vw + 20px)!important;bottom:auto!important;left:24px!important;right:24px!important;max-width:none!important}
  .service-theater-copy h3{font-size:clamp(2.4rem,12vw,3.25rem)!important;max-width:none!important}
  .service-theater-copy p{max-width:31ch!important}
  .service-stepper{bottom:24px!important}
}

/* Encabezado de servicios: una sola idea, sin texto auxiliar. */
.services{background:linear-gradient(90deg,#f8f8f6 0%,#f2f3f1 42%,#e7e9e7 72%,#d8dbd9 100%)!important;}
.friovesa-stage{background-size:cover!important;background-position:center!important;}
.services-head{display:block!important;padding-bottom:24px!important}
.services-head .eyebrow,.services-head p{display:none!important}
.services h2{font-size:clamp(2.5rem,5vw,4.9rem)!important;line-height:.9!important;letter-spacing:-.07em!important;text-align:left!important}
@media(max-width:760px){.services-head{padding-bottom:18px!important}.services h2{font-size:clamp(2.45rem,12vw,3.65rem)!important}}

/* Sistema editorial para los tres títulos de sección. */
.services-head h2,.work .workin>h2,.other .otherin>h2{
  position:relative!important;
  display:inline-block!important;
  isolation:isolate!important;
  padding:0 0 16px!important;
  letter-spacing:-.075em!important;
}
.services-head h2::before,.work .workin>h2::before,.other .otherin>h2::before{
  display:block;
  margin:0 0 12px;
  font-family:Arial,sans-serif;
  font-size:10px;
  font-weight:900;
  line-height:1;
  letter-spacing:.18em;
}
.services-head h2::after,.work .workin>h2::after,.other .otherin>h2::after{
  content:"";
  position:absolute;
  z-index:-1;
  left:0;
  bottom:0;
  width:100%;
  height:5px;
  border-radius:999px;
}
.services-head h2::before{content:"01 / LO QUE HACEMOS";color:#0b6b9c}
.services-head h2::after{background:linear-gradient(90deg,#0b6b9c 0%,#46bdd3 62%,transparent 100%)}
.work .workin>h2::before{content:"02 / CASOS DESDE CERO";color:#1679c4}
.work .workin>h2::after{background:linear-gradient(90deg,#1679c4 0%,#8acced 62%,transparent 100%)}
.other .otherin>h2::before{content:"03 / OTROS CAMINOS";color:#ae7044}
.other .otherin>h2::after{background:linear-gradient(90deg,#ae7044 0%,#e6bd82 62%,transparent 100%)}
.other .otherin>.eyebrow{display:none!important}
@media(max-width:760px){
  .services-head h2,.work .workin>h2,.other .otherin>h2{padding-bottom:12px!important;letter-spacing:-.065em!important}
  .services-head h2::before,.work .workin>h2::before,.other .otherin>h2::before{margin-bottom:9px;font-size:9px}
  .services-head h2::after,.work .workin>h2::after,.other .otherin>h2::after{height:4px}
}

/* Hero más limpio: sin ubicación truncada y con retrato con más aire. */
.hero .place{display:none!important}
@media(min-width:1001px){
  .hero .portrait{left:22%!important;right:auto!important;height:68%!important;max-width:32vw!important}
  .hero .name,.hero .intro{right:17%!important}
}

/* Casos: presentación editorial con dos piezas visuales equilibradas. */
.work{background:radial-gradient(circle at 15% 18%,rgba(255,255,255,.92),transparent 33%),linear-gradient(135deg,#e9f5ff 0%,#f7fbff 52%,#e5f1f8 100%)!important}
@media(min-width:761px){
  .work{padding:76px 24px 84px!important}
  .workin{column-gap:40px!important;row-gap:34px!important}
  .work .workin>h2{margin:0 0 8px!important;font-size:clamp(2.45rem,3.65vw,3.8rem)!important}
  .friovesa,.runpetz{padding:0!important;overflow:hidden!important;border:1px solid rgba(45,106,151,.14)!important;border-radius:22px!important;background:rgba(255,255,255,.54)!important;box-shadow:0 18px 42px rgba(31,88,130,.10)!important}
  .friovesa-stage,.runpetz>img{margin:0!important;aspect-ratio:1.714!important;border-radius:0!important;box-shadow:none!important}
  .friovesa>div:first-child,.runpetz>div{padding:24px 28px 28px!important}
  .friovesa h3,.runpetz h3{font-family:Georgia,serif!important;font-weight:400!important;font-size:clamp(2.15rem,2.8vw,3.2rem)!important;line-height:.9!important;letter-spacing:-.065em!important}
  .friovesa p,.runpetz p{font-size:14px!important;line-height:1.52!important}
  .friovesa .eyebrow,.runpetz .eyebrow{font-size:10px!important;letter-spacing:.14em!important}
  .cta,.stores a{border-radius:6px!important;padding:10px 13px!important;font-size:11px!important;letter-spacing:.02em!important}
}
@media(max-width:760px){
  .work{background:linear-gradient(155deg,#edf7ff 0%,#f7fbff 60%,#e8f2f7 100%)!important}
  .friovesa,.runpetz{border:1px solid rgba(45,106,151,.13)!important;border-radius:18px!important;overflow:hidden!important;background:rgba(255,255,255,.52)!important;box-shadow:0 14px 30px rgba(31,88,130,.08)!important}
  .friovesa>div:first-child,.runpetz>div{padding:22px!important}
}

/* Laboratorio: misma composición, con 30 % menos presencia vertical. */
@media (min-width:761px){.motion-lab{min-height:407px!important;padding-top:41px!important;padding-bottom:41px!important}.motion-lab .lab-copy{padding-top:50px!important;padding-bottom:50px!important}.motion-lab .lab-copy h1{font-size:clamp(2.6rem,4.6vw,4.65rem)!important;margin:13px 0!important}.motion-lab .lab-copy p{font-size:15px!important;max-width:350px!important}}
@media (max-width:760px){
  .motion-lab{min-height:270px!important;height:270px!important;background-size:auto 100%!important}
  .motion-lab .lab-video{object-position:62% center!important}
  .motion-lab .lab-copy{height:100%!important;padding:0 22px!important;display:flex!important;align-items:center!important}
  .motion-lab .lab-copy span,.motion-lab .lab-copy p{display:none!important}
  .motion-lab .lab-copy h1{font-size:clamp(1.9rem,8.6vw,2.65rem)!important;margin:0!important}
}

/* La pieza audiovisual se reduce como una sola tarjeta: video y encuadre conservan proporción. */
@media (min-width:761px){
  .motion-lab{
    width:80%!important;
    min-height:300px!important;
    margin-left:auto!important;
    margin-right:auto!important;
    background-size:auto 112%!important;
  }
  .motion-lab .lab-copy h1{font-size:clamp(2.15rem,3.8vw,3.8rem)!important}
  .motion-lab .lab-copy p{font-size:14px!important;max-width:300px!important}
}

/* Continuous four-part services film */
.services .service-list{display:none!important}
.service-theater{position:relative;isolation:isolate;overflow:hidden;width:100%;aspect-ratio:16/9;border-radius:30px;background:#f8f8f6;box-shadow:0 24px 60px rgba(9,30,61,.13)}
.service-film{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#f8f8f6;opacity:0;transition:opacity .28s ease;z-index:0}
.service-film.is-active{opacity:1}
.service-theater::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(248,248,246,.97) 0%,rgba(248,248,246,.80) 25%,rgba(248,248,246,.16) 49%,transparent 68%);z-index:1}
.service-theater-copy{position:absolute;z-index:2;left:clamp(24px,5vw,78px);bottom:clamp(26px,6vw,82px);max-width:min(43%,500px);color:#092342;pointer-events:none}
.service-theater-copy span{display:block;margin-bottom:13px;color:var(--accent,#0758a3);font-size:12px;letter-spacing:.15em;font-weight:800}
.service-theater-copy h3{margin:0;font-family:Georgia,serif;font-size:clamp(42px,5.2vw,88px);line-height:.9;letter-spacing:-.065em}
.service-theater-copy p{margin:21px 0 0;max-width:330px;font-size:clamp(14px,1.25vw,18px);line-height:1.43;color:#315473}
.service-stepper{position:absolute;z-index:3;display:flex;gap:8px;right:clamp(24px,4vw,62px);bottom:clamp(24px,4vw,56px)}
.service-stepper i{width:34px;height:4px;border-radius:99px;background:rgba(9,35,66,.22);transition:background .25s,width .25s}
.service-stepper i.is-current{width:58px;background:var(--accent,#0758a3)}
.service-theater[data-phase="strategy"]{--accent:#e21a1a}.service-theater[data-phase="direction"]{--accent:#1257d9}.service-theater[data-phase="product"]{--accent:#087f9c}.service-theater[data-phase="growth"]{--accent:#129c6a}
.service-theater-copy.is-changing>*{animation:service-copy-in .52s cubic-bezier(.22,1,.36,1) both}.service-theater-copy.is-changing h3{animation-delay:.04s}.service-theater-copy.is-changing p{animation-delay:.11s}
@keyframes service-copy-in{from{opacity:0;transform:translateY(18px);filter:blur(4px)}to{opacity:1;transform:translateY(0);filter:blur(0)}}
@media (max-width:760px){.service-theater{min-height:510px;aspect-ratio:auto;border-radius:22px}.service-film{object-position:58% center}.service-theater::after{background:linear-gradient(180deg,rgba(248,248,246,.16) 0%,rgba(248,248,246,.3) 31%,rgba(248,248,246,.96) 62%,#f8f8f6 100%)}.service-theater-copy{left:24px;right:24px;bottom:35px;max-width:none}.service-theater-copy h3{font-size:52px;max-width:300px}.service-theater-copy p{margin-top:16px;max-width:315px;font-size:15px}.service-stepper{right:24px;bottom:24px}.service-stepper i{width:18px}.service-stepper i.is-current{width:34px}}@media (prefers-reduced-motion:reduce){.service-film:not(.is-active){display:none}.service-theater-copy.is-changing>*{animation:none}}
