:root{--navy:#002650;--blue:#315bc2;--coral:#FF5A00;--peach:#ff7a1a;--paper:#fffaf5;--green:#06c653;--sans:'Montserrat',Arial,sans-serif;--serif:'Bodoni Moda',Georgia,serif;color:var(--navy);font-family:var(--sans);font-synthesis:none}
*{box-sizing:border-box}html,body{overflow-anchor:none}body{margin:0;background:var(--paper)}button,input,textarea,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #2967d6;outline-offset:5px}button{color:inherit}a{color:inherit}button, a{touch-action:manipulation}[hidden]{display:none!important}.mobile-only{display:none!important}.whatsapp-banner{display:none!important}.experience-mobile{display:none!important}.location-mobile{display:none!important}.carousel-dots{display:none!important}
.hero{position:relative;isolation:isolate;min-height:650px;height:max(47.17vw,100svh);overflow:hidden;background:radial-gradient(ellipse at 9% 0%,#fff0df 0,transparent 32%),linear-gradient(110deg,#fffaf5 0%,#fdfcfb 35%,#f0eeeb 60%,#edece6 100%)}
.atmosphere{position:absolute;inset:0 40.9% 0 0;z-index:-1;pointer-events:none;transform:translate3d(var(--mx,0px),var(--my,0px),0);transition:transform 1.2s cubic-bezier(.2,.8,.2,1)}.glow{position:absolute;border-radius:50%;filter:blur(48px);animation:float 11s ease-in-out infinite alternate}.glow-one{width:35%;height:20%;background:#ffd9b56b;top:-10%;left:0}.glow-two{width:50%;height:40%;background:#ffdbbd24;left:30%;top:65%;animation-delay:-5s}.facet{position:absolute;inset:0 0 0 83.5%;background:linear-gradient(150deg,#fff1,#ddd7cf29);clip-path:polygon(0 0,100% 0,100% 64%,0 100%)}.arc{position:absolute;width:480px;height:480px;border:3.5px dashed #efb794a6;border-radius:50%;bottom:-240px;left:-240px;transform-origin:center center;animation:spin-slow-reverse 45s linear infinite}.arc-two{width:380px;height:380px;border:3.5px dashed #efb794a6;border-radius:50%;left:-190px;bottom:-190px;transform-origin:center center;animation:spin-slow 35s linear infinite}
.header{position:absolute;inset:0 0 auto;height:20%;z-index:5}.brand{position:absolute;top:.85vw;left:2.05%;width:12.8%;transition:transform .25s}.brand:hover{transform:translateY(-3px)}.brand img{display:block;width:100%;height:auto}.navigation{position:absolute;left:16.2%;top:3.1vw;display:flex;align-items:center;justify-content:space-between;width:auto;min-width:540px;max-width:650px;height:2.4vw;min-height:42px;padding:0 20px;gap:8px;border:1.5px solid #ffdaba;border-radius:100px;background:rgba(255,255,255,0.92);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-sizing:border-box;white-space:nowrap;z-index:5}.navigation button{padding:4px 10px;border:0;background:none;font-size:clamp(13px,0.96vw,17px);font-weight:600;white-space:nowrap;flex-shrink:0;color:var(--navy);transition:color .2s,transform .2s}.navigation button:hover{color:var(--coral);transform:translateY(-2px)}.whatsapp{position:absolute;right:4.1%;top:2.05vw;display:flex;align-items:center;justify-content:center;gap:.95vw;border:0;border-radius:100px;width:16.5%;padding:.6vw 1.1vw;background:linear-gradient(110deg,#04c950,#06bf55);color:white;font-weight:800;font-size:clamp(20px,1.63vw,38px);min-height:3.88vw;box-shadow:0 8px 26px #00772b0a;transition:transform .2s,box-shadow .2s;text-decoration:none}.whatsapp svg{width:2.65vw;height:2.65vw;min-width:30px;min-height:30px}.whatsapp:hover{transform:translateY(-3px);box-shadow:0 12px 32px #08763830}.whatsapp:active,.submit-button:active{transform:scale(.98)}.menu-toggle{display:none}
.eyebrow{position:absolute;top:22.5%;left:6.7%;width:fit-content;max-width:calc(100% - 40px);height:38px;min-height:38px;padding:0 22px 0 16px;display:inline-flex;align-items:center;gap:10px;white-space:nowrap;border:2px solid #FF5A00;border-radius:100px;font-size:clamp(13px,.92vw,17px);font-weight:700;z-index:3;box-sizing:border-box}.eyebrow>span{height:11px;width:11px;min-height:11px;min-width:11px;border-radius:50%;background:#FF5A00;flex-shrink:0}.eyebrow-dot{height:11px;width:11px;min-height:11px;min-width:11px;border-radius:50%;background:#FF5A00;flex-shrink:0}
h1{font-family:Montserrat,'Arial Black',Arial,sans-serif;margin:0;position:absolute;top:31.1%;left:4.3%;z-index:3;letter-spacing:-.19vw;font-weight:900;font-size:4.46vw;line-height:1.13;pointer-events:none}h1>span{display:block}.title-first{white-space:nowrap}.blue-gradient{background:linear-gradient(180deg,#1e3f84 0,#4d75db 100%);background-clip:text;-webkit-background-clip:text;color:transparent}.title-serif{margin-top:.5vw;margin-left:.75vw;font-family:var(--serif);font-style:italic;font-weight:800;font-size:4.88vw;letter-spacing:-.11vw;line-height:1.22;background:linear-gradient(90deg,#FF5A00,#ff7a1a 76%);background-clip:text;-webkit-background-clip:text;color:transparent}.title-last{position:relative;margin-top:.6vw;margin-left:.65vw;width:max-content}.title-last:before{content:'';position:absolute;z-index:-1;left:24%;right:1%;bottom:-.3vw;height:1.8vw;background:#ffb865ad;filter:blur(15px);border-radius:50%;animation:highlight 7s ease-in-out infinite alternate}
.description{position:absolute;z-index:3;top:68.4%;left:7.05%;letter-spacing:-.04vw;font-weight:500;padding-left:3px;padding-right:8px;padding-top:3px;padding-bottom:3px;margin-left:0px;margin-right:0px;margin-top:0px;margin-bottom:0.672px;font-size:16.172px;line-height:21.0934px;font-family:Montserrat}.experience{position:absolute;z-index:3;left:6.25%;bottom:1.9%;width:280px;margin-left:-2px;height:90.2625px;border:5px solid #FF5A00;border-right-color:#ff7a1a;border-radius:100px;background:#ffffff69;display:grid;grid-template-columns:40% 60%;grid-template-rows:27% 73%;padding:.25vw 1.8vw .55vw 2.1vw}.experience-intro{grid-column:1/3;font-size:12.504px;font-weight:500;padding-left:6px;padding-top:-2px;margin-top:5px;margin-left:0px;margin-right:2px;margin-bottom:-10px}.experience strong{font-size:4.1vw;line-height:1.07;letter-spacing:-.16vw;color:#213e6d;font-weight:800;margin-top:-7px}.experience-caption{align-self:center;font-size:1.35vw;line-height:1.2;font-weight:800;letter-spacing:-.04vw;margin-right:-15px;margin-left:5px;margin-top:-21px}
.carousel{position:absolute;inset:0 0 0 52%;z-index:1;overflow:hidden;background:#ebeae1}.slide{position:absolute;inset:0;opacity:0;transition:opacity .8s ease;pointer-events:none}.slide.is-active{opacity:1}.slide img{width:100%;height:100%;object-fit:cover;object-position:50% 55%;transform:scale(1);transition:transform 4.8s linear}.slide.is-active img{transform:scale(1.035)}.slide.founders img{object-position:49% 50%}.carousel-location{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);z-index:6;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:8px 20px;border-radius:100px;background:rgba(0,38,80,0.65);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1.5px solid rgba(255,255,255,0.4);box-shadow:0 8px 24px rgba(0,20,50,0.35);color:#ffffff!important;font-family:var(--sans);font-size:clamp(12px,1.05vw,14px);font-weight:700;letter-spacing:0.04em;text-transform:uppercase;white-space:nowrap;pointer-events:none;user-select:none}.carousel-location-pin{width:16px;height:16px;min-width:16px;min-height:16px;fill:#ffffff!important;flex-shrink:0}.carousel-location span{color:#ffffff!important;font-weight:700}
dialog{border:1px solid #e6e4e1;padding:36px;border-radius:24px;color:var(--navy);box-shadow:0 30px 120px #00265040;max-height:90svh;width:min(540px,calc(100% - 32px));background:#fffdfa}dialog::backdrop{background:#071c36a3;backdrop-filter:blur(6px)}dialog[open]{animation:dialog-in .25s ease-out}.dialog-close{position:absolute;right:16px;top:12px;display:grid;place-items:center;width:40px;height:40px;border:0;border-radius:50%;font-size:30px;background:#ffffffd9;z-index:1}.dialog-close:hover{background:#ffeddf}.dialog-kicker{font-size:12px;font-weight:800;letter-spacing:1.5px;color:#FF5A00;margin:8px 0 12px}dialog h2{font-size:30px;margin:0 0 14px;letter-spacing:-1px}dialog p{line-height:1.6}.dialog-description{font-size:15px}form{display:grid;gap:14px}label{display:grid;gap:7px;font-size:14px;font-weight:600}input,select,textarea{width:100%;padding:12px;border:1px solid #cad2da;border-radius:10px;background:white;color:var(--navy);font-size:16px;font-weight:500}textarea{resize:vertical}.submit-button{border:0;background:var(--navy);color:white;padding:15px 20px;border-radius:12px;font-weight:700;transition:transform .2s,background .2s}.submit-button:hover{background:#164682;transform:translateY(-2px)}#message-result{margin-top:18px;display:grid;gap:12px}.form-status{font-size:14px;margin:0}.about-dialog{padding:0;width:min(650px,calc(100% - 32px))}.about-dialog>img{display:block;width:100%;height:280px;object-fit:cover;object-position:center 30%}.about-content{padding:28px 32px}.about-content .submit-button{margin-top:8px}
@keyframes float{to{transform:translate(12px,10px)}}@keyframes highlight{to{opacity:.6;transform:scaleX(.95)}}@keyframes dialog-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@keyframes entry{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes spin-slow{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}@keyframes spin-slow-reverse{from{transform:rotate(360deg)}to{transform:rotate(0deg)}}@keyframes whatsapp-jump{0%,26%,100%{transform:translate3d(0,0,0) scale(1);box-shadow:0 6px 20px rgba(37,211,102,.35)}4%{transform:translate3d(0,2px,0) scale(.97)}8%{transform:translate3d(0,-8px,0) scale(1.07);box-shadow:0 16px 32px rgba(37,211,102,.55)}12%{transform:translate3d(0,-3px,0) scale(1.03);box-shadow:0 10px 24px rgba(37,211,102,.42)}16%{transform:translate3d(0,-5px,0) scale(1.05);box-shadow:0 14px 28px rgba(37,211,102,.48)}20%{transform:translate3d(0,-1px,0) scale(1.01);box-shadow:0 8px 20px rgba(37,211,102,.38)}}@keyframes whatsapp-logo-vibrate{0%,26%,100%{transform:translate3d(0,0,0) rotate(0deg) scale(1)}4%{transform:translate3d(-3px,0,0) rotate(-16deg) scale(1.15)}7%{transform:translate3d(4px,0,0) rotate(18deg) scale(1.22)}10%{transform:translate3d(-4px,0,0) rotate(-16deg) scale(1.22)}13%{transform:translate3d(3px,0,0) rotate(14deg) scale(1.18)}16%{transform:translate3d(-2px,0,0) rotate(-10deg) scale(1.12)}19%{transform:translate3d(2px,0,0) rotate(6deg) scale(1.06)}22%{transform:translate3d(0,0,0) rotate(-2deg) scale(1.02)}}@keyframes whatsapp-text-sway{0%,26%,100%{transform:translate3d(0,0,0) scale(1)}4%{transform:translate3d(1px,0,0) scale(1.01)}8%{transform:translate3d(-3px,-1px,0) scale(1.03)}12%{transform:translate3d(3px,0,0) scale(1.02)}16%{transform:translate3d(-2px,0,0) scale(1.02)}20%{transform:translate3d(1px,0,0) scale(1.01)}}.header{animation:entry .45s ease-out}.eyebrow{animation:entry .65s ease-out}.title-first{animation:entry .65s .08s both}.title-serif{animation:entry .65s .17s both}.title-last{animation:entry .65s .26s both}.description{animation:entry .65s .35s both}
@media(min-width:769px) and (max-aspect-ratio:16/11){.hero{height:760px;min-height:760px}.eyebrow{top:24%}h1{top:34%}.description{top:66%;font-size:20px}.experience{bottom:7%;height:105px;width:210px}.experience-intro{font-size:16px}.experience strong{font-size:56px}.experience-caption{font-size:17px}}
@media(max-width:768px){
  .desktop-only{display:none!important}
  .mobile-only{display:flex!important}
  .hero{
    height:auto;
    min-height:100svh;
    padding:20px 20px 34px;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    background:radial-gradient(ellipse at 85% 0%,#fff2e3 0,transparent 45%),radial-gradient(ellipse at 0% 100%,#fff0df 0,transparent 40%),linear-gradient(180deg,#fffdfa 0%,#fcfaf6 100%);
  }
  .atmosphere{inset:0;pointer-events:none}
  .arc-mobile-top{display:block!important;position:absolute;width:290px;height:290px;border:2px dashed rgba(255, 90, 0, 0.45);border-radius:50%;right:-90px;top:-75px;transform-origin:center center;animation:spin-slow 30s linear infinite;pointer-events:none}
  .arc{position:absolute;width:260px;height:260px;border:2px dashed rgba(255, 90, 0, 0.45);border-radius:50%;left:-110px;bottom:-20px;transform-origin:center center;animation:spin-slow-reverse 36s linear infinite;pointer-events:none}
  .arc-two{display:none}
  .facet{display:none}
  .header{
    position:relative;
    inset:auto;
    height:auto;
    display:flex;
    align-items:center;
    justify-content:space-between;
    width:100%;
    margin-bottom:18px;
    z-index:10;
  }
  .brand{
    position:static;
    width:130px;
    margin:0;
  }
  .brand img{
    width:100%;
    height:auto;
    display:block;
  }
  .menu-toggle{
    position:static;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    gap:4.5px;
    width:46px;
    height:46px;
    border:1.5px solid #FF5A00;
    border-radius:50%;
    background:#ffffff;
    box-shadow:0 4px 14px rgba(255, 90, 0, 0.25);
    z-index:8;
    padding:0;
    cursor:pointer;
  }
  .menu-toggle span{
    display:block;
    height:2.2px;
    width:20px;
    background:var(--navy);
    border-radius:2px;
    margin:0 auto;
    transition:transform .2s,opacity .2s;
  }
  .menu-toggle[aria-expanded=true] span:nth-child(1){transform:translateY(6.7px) rotate(45deg)}
  .menu-toggle[aria-expanded=true] span:nth-child(2){opacity:0}
  .menu-toggle[aria-expanded=true] span:nth-child(3){transform:translateY(-6.7px) rotate(-45deg)}
  .navigation{
    display:none;
    position:absolute;
    top:56px;
    left:0;
    right:0;
    width:auto;
    height:auto;
    border-radius:18px;
    padding:12px;
    background:#fffdfa;
    box-shadow:0 15px 35px #0026501a;
    border:1.5px solid rgba(255, 90, 0, 0.45);
    z-index:20;
    flex-direction:column;
    gap:8px;
  }
  .navigation.is-open{display:flex}
  .navigation button{font-size:15px;font-weight:600;padding:12px 14px;text-align:left;border-radius:10px}
  .navigation button:hover{background:#fff0e4}
  .eyebrow{
    position:relative;
    inset:auto;
    height:auto;
    min-height:0;
    width:fit-content;
    max-width:100%;
    border:2px solid #FF5A00;
    border-radius:100px;
    background:#ffffff;
    padding:6px 14px 6px 10px;
    display:inline-flex;
    align-items:center;
    gap:8px;
    margin-bottom:14px;
    white-space:nowrap;
    font-size:clamp(9.5px, 2.75vw, 12.5px);
    font-weight:700;
    color:var(--navy);
    line-height:1.1;
    box-shadow:0 2px 8px rgba(255, 90, 0, 0.15);
    box-sizing:border-box;
  }
  .eyebrow-dot{
    width:9px;
    height:9px;
    min-width:9px;
    min-height:9px;
    border-radius:50%;
    background:#FF5A00;
    flex-shrink:0;
    display:inline-block;
  }
  h1{
    position:relative;
    inset:auto;
    margin:0 0 14px 0;
    font-family:Montserrat,'Arial Black',sans-serif;
    font-weight:900;
    letter-spacing:-.5px;
    line-height:1.14;
    font-size:clamp(27px, 7.4vw, 36px);
    color:var(--navy);
    pointer-events:none;
  }
  .title-first{
    white-space:normal;
    max-width:100%;
    display:block;
    font-weight:900;
  }
  .title-first .blue-gradient{
    display:block;
    background:linear-gradient(180deg,#1e3f84 0%,#4d75db 100%);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
  }
  .title-serif{
    display:block;
    font-family:var(--serif);
    font-style:italic;
    font-weight:800;
    font-size:clamp(28px, 8vw, 38px);
    margin:4px 0 2px;
    letter-spacing:-.3px;
    line-height:1.18;
    white-space:nowrap;
    background:linear-gradient(90deg,#FF5A00 0%,#ff7a1a 80%);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
  }
  .title-last{
    display:block;
    position:relative;
    margin:0;
    white-space:nowrap;
    font-weight:900;
  }
  .title-last:before{
    content:'';
    position:absolute;
    z-index:-1;
    left:24%;
    right:1%;
    bottom:2px;
    height:18px;
    background:#ffb86580;
    filter:blur(12px);
    border-radius:50%;
  }
  .description{
    position:relative;
    inset:auto;
    font-size:15px;
    line-height:1.45;
    letter-spacing:-.2px;
    font-weight:500;
    color:var(--navy);
    margin:0 0 16px 0;
    padding:0;
  }
  .desktop-break{display:none}
  .whatsapp-banner{
    display:flex!important;
    flex-direction:row!important;
    align-items:center;
    justify-content:center;
    gap:10px;
    width:100%;
    min-height:50px;
    padding:10px 18px;
    border-radius:100px;
    background:linear-gradient(110deg,#25d366,#1eb855);
    color:white;
    text-decoration:none;
    font-weight:700;
    font-size:clamp(14px, 4.1vw, 17px);
    white-space:nowrap!important;
    flex-wrap:nowrap!important;
    box-shadow:0 6px 20px rgba(37,211,102,0.35);
    margin:0 0 20px 0;
    transition:box-shadow .2s;
    animation:whatsapp-jump 4s cubic-bezier(0.25,1,0.5,1) infinite;
    transform-origin:center center;
  }
  .whatsapp-banner:active{transform:scale(.96)!important}
  .whatsapp-banner svg{
    width:24px;
    height:24px;
    fill:white;
    flex-shrink:0;
    transform-origin:center center;
    animation:whatsapp-logo-vibrate 4s ease-in-out infinite;
  }
  .whatsapp-banner span{
    color:white;
    font-weight:700;
    white-space:nowrap;
    display:inline-block;
    transform-origin:center center;
    animation:whatsapp-text-sway 4s ease-in-out infinite;
  }
  .carousel{
    position:relative;
    inset:auto;
    margin:0;
    width:calc(100% + 40px);
    margin-left:-20px;
    margin-right:-20px;
    height:clamp(420px,124vw,560px);
    max-height:580px;
    min-height:400px;
    border-radius:0;
    overflow:hidden;
    box-shadow:0 10px 32px #00265014;
    background:#ebeae1;
  }
  .slide img{object-position:50% 55%}
  .slide.founders img{object-position:48% 50%}
  .experience-mobile{
    display:flex!important;
    align-items:center;
    justify-content:center;
    gap:10px;
    position:absolute;
    bottom:68px;
    left:50%;
    transform:translateX(-50%);
    z-index:5;
    background:#ffffffed;
    border:2.5px solid #FF5A00;
    border-radius:100px;
    padding:6px 20px 6px 16px;
    box-shadow:0 8px 24px rgba(0,38,80,0.22);
    backdrop-filter:blur(8px);
    white-space:nowrap;
    margin:0;
  }
  .exp-left{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    justify-content:center;
    line-height:1;
  }
  .exp-intro{
    font-size:11.5px;
    font-weight:700;
    color:var(--navy);
    margin-bottom:1px;
  }
  .exp-number{
    font-size:36px;
    font-weight:900;
    color:var(--navy);
    line-height:.9;
    letter-spacing:-1.5px;
  }
  .exp-right{
    display:flex;
    flex-direction:column;
    justify-content:center;
    font-size:13.5px;
    font-weight:800;
    color:var(--navy);
    line-height:1.15;
  }
  .carousel-location{
    bottom:18px;
    padding:7px 18px;
    font-size:12.5px;
    letter-spacing:0.02em;
  }
  dialog{padding:28px 22px}
  .about-dialog{padding:0}
  .about-content{padding:24px}
  .about-dialog>img{height:220px}
}

/* ==========================================================
   MOMENTO DE MARCA: FRASE PROTAGONISTA EN HERO (GSAP SCROLL)
   ========================================================== */
.carousel-white-overlay {
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, 0.74);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  opacity: 0;
  pointer-events: none;
  z-index: 3;
}

.hero-brand-statement {
  display: none;
}

.hero.hero-transition-ready .hero-brand-statement {
  display: flex;
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
  z-index: 7;
  pointer-events: none;
  box-sizing: border-box;
  padding: clamp(24px, 4vw, 56px);
  opacity: 0;
  visibility: hidden;
}

.hero-statement-container {
  max-width: 1080px;
  width: 100%;
  margin: 0 auto;
  text-align: center;
  padding: 0 clamp(16px, 4vw, 36px);
  box-sizing: border-box;
}

.hero-statement-phrase {
  margin: 0;
  font-family: var(--sans);
  font-size: clamp(38px, 5.4vw, 76px);
  font-weight: 800;
  color: #002650;
  line-height: 1.18;
  letter-spacing: -0.025em;
  text-wrap: balance;
}

.statement-line {
  display: inline;
}

.statement-line-1 {
  margin-right: 0.28em;
}

.statement-highlight {
  font-family: var(--serif);
  font-style: italic;
  font-weight: 800;
  background: linear-gradient(90deg, #FF5A00 0%, #ff7a1a 85%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  display: inline-block;
  padding-right: 0.06em;
  letter-spacing: -0.01em;
}

.hero-statement-accent {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: clamp(16px, 2.5vh, 26px);
}

.statement-bar {
  width: clamp(48px, 6vw, 76px);
  height: 3.5px;
  border-radius: 100px;
  background: linear-gradient(90deg, #FF5A00, #ff7a1a);
  box-shadow: 0 3px 12px rgba(255, 90, 0, 0.45);
  transform-origin: center center;
}

@media (max-width: 1023px) {
  .hero.hero-transition-ready {
    position: relative;
    height: 100svh;
    min-height: 100svh;
    max-height: 100svh;
    padding: 16px 20px 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    margin-bottom: 0 !important;
  }

  .hero.hero-transition-ready .eyebrow,
  .hero.hero-transition-ready h1,
  .hero.hero-transition-ready .description,
  .hero.hero-transition-ready .hero-disorders-tags,
  .hero.hero-transition-ready .whatsapp-banner {
    position: relative;
    z-index: 2;
    animation: none !important;
  }

  .hero.hero-transition-ready .carousel {
    flex: 1;
    min-height: 0;
    height: auto;
    max-height: none;
    z-index: 5;
    margin-bottom: 0 !important;
    box-shadow: none;
  }

  .hero.hero-transition-ready .hero-brand-statement {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100svh;
    max-height: 100svh;
    padding: clamp(20px, 5vw, 32px);
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    z-index: 8;
    pointer-events: none;
    transform: translateY(-3svh);
  }

  .hero-statement-phrase {
    font-size: clamp(34px, 8.8vw, 50px);
    line-height: 1.22;
  }

  .statement-line-1,
  .statement-line-2 {
    display: block;
    margin-right: 0;
  }

  .statement-line-2 {
    margin-top: 6px;
  }

  .evaluaciones-section {
    margin-top: 0 !important;
    padding-top: 24px;
  }
}

/* ==========================================================
   SECCIÓN EVALUACIONES - SHOWCASE CARD (IMAGEN 1)
   ========================================================== */
.evaluaciones-section {
  position: relative;
  width: 100%;
  max-width: 1320px;
  margin: 40px auto 80px;
  padding: 0 24px;
  box-sizing: border-box;
  perspective: 1200px;
}

.eval-card-container {
  width: 100%;
}

.eval-hero-card {
  position: relative;
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  background: #ffffff;
  border: 1.5px solid #fedec9;
  border-radius: 32px;
  box-shadow: 0 20px 48px rgba(0, 38, 80, 0.06), 0 4px 16px rgba(242, 83, 69, 0.04);
  overflow: hidden;
  cursor: pointer;
  outline: none;
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.4s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.3s ease;
  will-change: transform;
}

.eval-hero-card::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 50%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.5), transparent);
  transform: translateX(-150%) skewX(-20deg);
  animation: eval-shimmer-sweep 7.5s ease-in-out infinite;
  pointer-events: none;
  z-index: 5;
}

.eval-hero-card:focus-visible {
  outline: 3px solid #FF5A00;
  outline-offset: 4px;
}

.eval-hero-card:hover {
  border-color: #FF5A00;
  box-shadow: 0 28px 64px rgba(255, 90, 0, 0.18), 0 8px 24px rgba(0, 38, 80, 0.08);
}

.eval-card-shine {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(circle 420px at var(--mouse-x, 50%) var(--mouse-y, 50%), rgba(255, 90, 0, 0.12), transparent 70%);
  opacity: 0;
  transition: opacity 0.3s ease;
  z-index: 2;
}

.eval-hero-card:hover .eval-card-shine {
  opacity: 1;
}

.eval-card-content {
  padding: clamp(32px, 3.8vw, 56px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  z-index: 3;
}

.eval-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  border: 2px solid #FF5A00;
  border-radius: 100px;
  padding: 6px 16px 6px 12px;
  width: fit-content;
  font-size: 11.5px;
  font-weight: 800;
  letter-spacing: 0.6px;
  color: var(--navy);
  margin-bottom: 22px;
  background: #ffffff;
  box-shadow: 0 2px 10px rgba(255, 90, 0, 0.15);
}

.eval-eyebrow .eyebrow-dot,
.eval-subpage-badge .eyebrow-dot {
  animation: eval-radar-pulse 2.2s infinite ease-out;
}

.eval-title {
  margin: 0 0 20px;
  font-family: Montserrat, 'Arial Black', sans-serif;
  font-size: clamp(30px, 2.75vw, 44px);
  line-height: 1.12;
  letter-spacing: -0.8px;
  color: var(--navy);
}

.eval-title-main {
  display: block;
  font-weight: 800;
}

.eval-title-italic {
  display: block;
  font-family: var(--serif);
  font-style: italic;
  font-weight: 700;
  color: var(--navy);
  letter-spacing: -0.4px;
  font-size: 0.98em;
}

.eval-desc {
  font-size: clamp(15px, 1.1vw, 17px);
  line-height: 1.6;
  color: #405872;
  margin: 0 0 32px;
  max-width: 530px;
  font-weight: 500;
}

.eval-meta-bar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px 16px;
  font-size: 13.5px;
  font-weight: 600;
  color: #516a85;
  padding-top: 20px;
  border-top: 1px solid #fce8db;
}

.eval-meta-item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.eval-meta-icon {
  width: 19px;
  height: 19px;
  color: #FF5A00;
  flex-shrink: 0;
}

.eval-meta-pin {
  color: #FF5A00;
}

.eval-meta-divider {
  color: #ff9d66;
  opacity: 0.6;
  user-select: none;
}

.eval-card-media {
  position: relative;
  overflow: hidden;
  min-height: 380px;
  background: #fbf5ee;
}

.eval-banner-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 35%;
  display: block;
  transition: transform 0.75s cubic-bezier(0.16, 1, 0.3, 1), filter 0.5s ease;
  will-change: transform;
  animation: eval-img-float 8s ease-in-out infinite alternate;
}

.eval-hero-card:hover .eval-banner-img {
  transform: scale(1.055);
}

.eval-media-fade {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(to right, #ffffff 0%, rgba(255, 255, 255, 0.6) 12%, rgba(255, 255, 255, 0) 38%);
  z-index: 1;
}

.eval-more-btn {
  position: absolute;
  right: 28px;
  bottom: 28px;
  z-index: 4;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  background: linear-gradient(110deg, #FF5A00 0%, #ff731d 100%);
  color: #ffffff;
  border: 0;
  border-radius: 100px;
  padding: 13px 28px 13px 24px;
  font-size: 19px;
  font-weight: 800;
  box-shadow: 0 8px 24px rgba(255, 90, 0, 0.42);
  cursor: pointer;
  transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.28s cubic-bezier(0.16, 1, 0.3, 1), filter 0.2s ease;
  letter-spacing: -0.2px;
  animation: eval-btn-pulse 3.8s ease-in-out infinite;
}

.eval-more-btn:hover {
  transform: scale(1.06) translateY(-2px);
  box-shadow: 0 14px 34px rgba(255, 90, 0, 0.55);
}

.eval-more-btn:active {
  transform: scale(0.97);
}

.eval-more-arrow {
  width: 22px;
  height: 22px;
  transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1);
  animation: eval-arrow-nudge 3.8s ease-in-out infinite;
}

.eval-hero-card:hover .eval-more-arrow,
.eval-more-btn:hover .eval-more-arrow {
  transform: translateX(5px);
}

/* ==========================================================
   SUBPÁGINA MODAL / EXPANDED VIEW (IMÁGENES 2, 3, 4)
   ========================================================== */
.eval-subpage-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 24px 16px 60px;
  box-sizing: border-box;
  -webkit-overflow-scrolling: touch;
}

.eval-subpage-backdrop[hidden] {
  display: none !important;
}

.eval-subpage-overlay-bg {
  position: fixed;
  inset: 0;
  background: rgba(0, 24, 52, 0.65);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  animation: eval-fade-in 0.35s ease-out both;
}

.eval-subpage-sheet {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 1180px;
  background: #fffcf8;
  border-radius: 36px;
  box-shadow: 0 32px 100px rgba(0, 20, 50, 0.38);
  border: 1.5px solid #fedec9;
  overflow: hidden;
  margin: auto;
  animation: eval-sheet-enter 0.45s cubic-bezier(0.16, 1, 0.3, 1) both;
}

@keyframes eval-fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes eval-sheet-enter {
  from {
    opacity: 0;
    transform: translateY(32px) scale(0.98);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

.eval-subpage-header {
  position: sticky;
  top: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 32px;
  background: rgba(255, 252, 248, 0.94);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid #fce8db;
}

.eval-back-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  border: 0;
  background: #fff0e4;
  color: #FF5A00;
  font-weight: 700;
  font-size: 14.5px;
  padding: 10px 20px;
  border-radius: 100px;
  cursor: pointer;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}

.eval-back-arrow {
  width: 18px;
  height: 18px;
  transition: transform 0.25s;
}

.eval-back-btn:hover {
  background: #FF5A00;
  color: #ffffff;
  transform: translateX(-4px);
  box-shadow: 0 6px 18px rgba(255, 90, 0, 0.35);
}

.eval-back-btn:hover .eval-back-arrow {
  transform: translateX(-3px);
}

.eval-subpage-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.8px;
  color: var(--navy);
  padding: 6px 16px;
  border-radius: 100px;
  background: #ffffff;
  border: 2px solid #FF5A00;
}

.eval-close-x {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: 0;
  background: #f1ede8;
  color: var(--navy);
  cursor: pointer;
  transition: transform 0.25s ease, background 0.25s, color 0.25s;
}

.eval-close-x svg {
  width: 20px;
  height: 20px;
}

.eval-close-x:hover {
  background: #ffe3d1;
  color: #FF5A00;
  transform: rotate(90deg);
}

.eval-subpage-content {
  padding: clamp(28px, 4vw, 56px);
  display: flex;
  flex-direction: column;
  gap: 52px;
}

/* 1. Las dos tarjetas (Imagen de Referencia) */
.eval-subpage-cards-grid {
  display: flex;
  flex-direction: column;
  gap: 24px;
  width: 100%;
  max-width: 960px;
  margin: 0 auto;
  box-sizing: border-box;
}

.eval-service-card {
  display: flex;
  flex-direction: column;
  border-radius: 28px;
  padding: clamp(24px, 3.2vw, 36px);
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  overflow: hidden;
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.35s ease, border-color 0.3s ease;
}

.eval-service-card:hover {
  transform: translateY(-4px);
}

.eval-card-peach {
  background: #fff5ed;
  border: 1.5px solid #fedfce;
  box-shadow: 0 10px 32px rgba(234, 88, 58, 0.05);
}

.eval-card-peach:hover {
  box-shadow: 0 20px 48px rgba(234, 88, 58, 0.11);
  border-color: #fcba99;
}

.eval-card-blue {
  background: #f0f7fe;
  border: 1.5px solid #d8e9fb;
  box-shadow: 0 10px 32px rgba(28, 84, 184, 0.05);
}

.eval-card-blue:hover {
  box-shadow: 0 20px 48px rgba(28, 84, 184, 0.11);
  border-color: #b2d5fc;
}

.eval-service-card-top {
  display: flex;
  align-items: center;
  gap: 20px;
  margin-bottom: 18px;
}

.eval-icon-circle {
  width: 68px;
  height: 68px;
  min-width: 68px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  flex-shrink: 0;
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
  animation: icon-gentle-breathe 4.5s ease-in-out infinite;
}

.eval-service-card:hover .eval-icon-circle {
  transform: scale(1.06);
}

.eval-icon-peach {
  background: #ffede0;
  color: #f04d38;
}

.eval-icon-peach svg {
  width: 36px;
  height: 36px;
}

.eval-icon-blue {
  background: #e0eeff;
  color: #1c54b8;
  animation-delay: -2.25s;
}

.eval-icon-blue svg {
  width: 36px;
  height: 36px;
}

.eval-service-header-text {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}

.eval-age-kicker {
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.9px;
  line-height: 1;
}

.eval-kicker-peach {
  color: #FF5A00;
}

.eval-kicker-blue {
  color: #1b54b8;
}

.eval-service-title {
  margin: 0;
  font-family: Montserrat, 'Arial Black', sans-serif;
  font-size: clamp(22px, 2.3vw, 29px);
  font-weight: 800;
  line-height: 1.18;
  letter-spacing: -0.5px;
  color: var(--navy);
  word-break: break-word;
}

.eval-service-desc {
  font-size: clamp(15px, 1.15vw, 17px);
  line-height: 1.55;
  color: #1a3858;
  margin: 0 0 22px;
  font-weight: 500;
  max-width: 100%;
}

.eval-tags-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  width: 100%;
  box-sizing: border-box;
}

.eval-tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 9px 22px;
  border-radius: 100px;
  font-size: clamp(13px, 1.05vw, 15px);
  font-weight: 700;
  line-height: 1.1;
  text-align: center;
  white-space: nowrap;
  box-sizing: border-box;
  transition: transform 0.2s ease;
}

.eval-tag:hover {
  transform: translateY(-2px);
}

.eval-tag-peach {
  background: #fff0e5;
  color: #FF5A00;
  border: 1.5px solid rgba(255, 90, 0, 0.45);
}

.eval-tag-blue {
  background: #e0eeff;
  color: #1c54b8;
  border: 1px solid #cbe1fb;
}

/* 2. ¿Cuándo considerar una evaluación? (Imagen 3) */
.eval-when-section {
  display: flex;
  flex-direction: column;
  gap: 28px;
  padding: 44px 38px;
  background: #ffffff;
  border-radius: 28px;
  border: 1.5px solid #fedec9;
  box-shadow: 0 12px 32px rgba(0, 38, 80, 0.04);
}

.eval-section-heading {
  margin: 0;
  font-family: Montserrat, sans-serif;
  font-size: clamp(26px, 2.2vw, 34px);
  font-weight: 900;
  letter-spacing: -0.6px;
  color: var(--navy);
}

.eval-when-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px 36px;
}

.eval-when-item {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 12px 14px;
  border-radius: 16px;
  transition: background 0.25s, transform 0.25s;
}

.eval-when-item:hover {
  background: #fff8f4;
  transform: translateX(4px);
}

.eval-check-icon {
  width: 32px;
  height: 32px;
  min-width: 32px;
  display: grid;
  place-items: center;
  transition: transform 0.25s;
}

.eval-when-item:hover .eval-check-icon {
  transform: scale(1.12);
}

.eval-check-icon svg {
  width: 32px;
  height: 32px;
}

.eval-when-item p {
  margin: 0;
  font-size: 16px;
  line-height: 1.55;
  color: #26415f;
  font-weight: 600;
  padding-top: 3px;
}

.eval-reassurance-note {
  margin: 12px 0 0;
  text-align: center;
  font-family: var(--serif);
  font-style: italic;
  font-size: clamp(17px, 1.35vw, 20px);
  font-weight: 700;
  color: #e85435;
  letter-spacing: -0.2px;
}

/* 3. Así te acompañamos en el proceso (Imagen 4) */
.eval-process-section {
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.eval-process-steps {
  display: grid;
  grid-template-columns: 1fr auto 1fr auto 1fr;
  align-items: flex-start;
  gap: 16px;
}

.eval-step-item {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 24px 20px;
  background: #ffffff;
  border-radius: 22px;
  border: 1.5px solid #ffe1ce;
  box-shadow: 0 8px 24px rgba(0, 38, 80, 0.03);
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s;
}

.eval-step-item:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 36px rgba(242, 83, 69, 0.08);
  border-color: #fca67e;
}

.eval-step-number {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  border: 2.5px solid #FF5A00;
  display: grid;
  place-items: center;
  font-family: Montserrat, sans-serif;
  font-weight: 800;
  font-size: 20px;
  color: #FF5A00;
  background: #ffffff;
  transition: all 0.25s ease;
}

.eval-step-item:hover .eval-step-number {
  background: #FF5A00;
  color: #ffffff;
  transform: scale(1.08);
}

.eval-step-body {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.eval-step-title {
  margin: 0;
  font-family: Montserrat, sans-serif;
  font-size: 18.5px;
  font-weight: 800;
  color: var(--navy);
  letter-spacing: -0.3px;
}

.eval-step-desc {
  margin: 0;
  font-size: 14.5px;
  line-height: 1.55;
  color: #4b647f;
  font-weight: 500;
}

.eval-step-divider {
  width: 32px;
  height: 2px;
  border-top: 2px dashed rgba(255, 90, 0, 0.45);
  margin-top: 50px;
  opacity: 0.7;
}

/* 4. Banner Final Azul Marino (Imagen 4) */
.eval-cta-card {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: 1.25fr auto 0.75fr;
  align-items: center;
  gap: 36px;
  background: linear-gradient(135deg, #001938 0%, #002650 100%);
  border-radius: 30px;
  padding: 44px 48px;
  color: #ffffff;
  box-shadow: 0 24px 60px rgba(0, 24, 52, 0.35);
}

.eval-cta-decor-circle {
  position: absolute;
  border-radius: 50%;
  border: 2px dashed rgba(245, 173, 134, 0.25);
  pointer-events: none;
}

.eval-cta-circle-1 {
  width: 340px;
  height: 340px;
  right: -80px;
  bottom: -140px;
}

.eval-cta-circle-2 {
  width: 240px;
  height: 240px;
  right: 120px;
  top: -120px;
}

.eval-cta-left {
  display: flex;
  flex-direction: column;
  gap: 12px;
  position: relative;
  z-index: 2;
}

.eval-cta-title {
  margin: 0;
  font-family: Montserrat, sans-serif;
  font-size: clamp(26px, 2.3vw, 34px);
  font-weight: 900;
  letter-spacing: -0.5px;
  color: #ffffff;
}

.eval-cta-subtitle {
  margin: 0 0 16px;
  font-size: 18px;
  color: rgba(255, 255, 255, 0.88);
  font-weight: 500;
}

.eval-cta-whatsapp-btn {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  background: linear-gradient(110deg, #25d366 0%, #1eb855 100%);
  color: #ffffff;
  text-decoration: none;
  font-weight: 800;
  font-size: 16.5px;
  padding: 14px 28px;
  border-radius: 100px;
  width: fit-content;
  box-shadow: 0 10px 28px rgba(37, 211, 102, 0.38);
  transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.28s;
  animation: whatsapp-jump 4s cubic-bezier(0.25, 1, 0.5, 1) infinite;
}

.eval-cta-whatsapp-btn:hover {
  transform: translateY(-3px) scale(1.02);
  box-shadow: 0 16px 36px rgba(37, 211, 102, 0.52);
}

.eval-cta-wa-icon {
  width: 24px;
  height: 24px;
  fill: currentColor;
  flex-shrink: 0;
  animation: whatsapp-logo-vibrate 4s ease-in-out infinite;
}

.eval-cta-chevron {
  font-size: 20px;
  line-height: 1;
  margin-left: 2px;
  transition: transform 0.25s;
}

.eval-cta-whatsapp-btn:hover .eval-cta-chevron {
  transform: translateX(4px);
}

.eval-cta-divider {
  width: 1px;
  height: 80px;
  background: rgba(255, 255, 255, 0.18);
  position: relative;
  z-index: 2;
}

.eval-cta-right {
  display: flex;
  flex-direction: column;
  gap: 18px;
  position: relative;
  z-index: 2;
}

.eval-cta-info-item {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-size: 16.5px;
  color: #ffffff;
  font-weight: 600;
}

.eval-cta-pin-icon {
  width: 24px;
  height: 24px;
  flex-shrink: 0;
}

.eval-cta-phone-link {
  color: #ffffff;
  text-decoration: none;
  font-size: 20px;
  font-weight: 800;
  letter-spacing: 0.5px;
  transition: color 0.2s, transform 0.2s;
}

.eval-cta-phone-link:hover {
  color: #ffd299;
  transform: translateX(3px);
}

.eval-cta-phone-badge {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.15);
  display: grid;
  place-items: center;
  color: #ffffff;
  animation: phone-ring 4.5s ease-in-out infinite;
}

.eval-cta-phone-badge svg {
  width: 18px;
  height: 18px;
}

/* ==========================================================
   SECCIÓN TERAPIAS - SHOWCASE CARD (MISMO TAMAÑO Y FLUIDEZ)
   ========================================================== */
.terapias-section {
  position: relative;
  width: 100%;
  max-width: 1320px;
  margin: 30px auto 80px;
  padding: 0 24px;
  box-sizing: border-box;
  perspective: 1200px;
}

.terapias-card-container {
  width: 100%;
}

.terapias-hero-card {
  position: relative;
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  background: #ffffff;
  border: 1.5px solid #d4e8fb;
  border-radius: 32px;
  box-shadow: 0 20px 48px rgba(0, 38, 80, 0.06), 0 4px 16px rgba(28, 84, 184, 0.04);
  overflow: hidden;
  cursor: pointer;
  outline: none;
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.4s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.3s ease;
  will-change: transform;
}

.terapias-hero-card::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 50%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.5), transparent);
  transform: translateX(-150%) skewX(-20deg);
  animation: eval-shimmer-sweep 8s ease-in-out infinite 2s;
  pointer-events: none;
  z-index: 5;
}

.terapias-hero-card:focus-visible {
  outline: 3px solid #1c54b8;
  outline-offset: 4px;
}

.terapias-hero-card:hover {
  border-color: #8fc2f9;
  box-shadow: 0 28px 64px rgba(28, 84, 184, 0.12), 0 8px 24px rgba(0, 38, 80, 0.08);
}

.terapias-card-shine {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(circle 420px at var(--mouse-x, 50%) var(--mouse-y, 50%), rgba(28, 84, 184, 0.08), transparent 70%);
  opacity: 0;
  transition: opacity 0.3s ease;
  z-index: 2;
}

.terapias-hero-card:hover .terapias-card-shine {
  opacity: 1;
}

.terapias-card-content {
  padding: clamp(32px, 3.8vw, 56px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  z-index: 3;
}

.terapias-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  border: 1.8px solid #286bd4;
  border-radius: 100px;
  padding: 6px 16px 6px 12px;
  width: fit-content;
  font-size: 11.5px;
  font-weight: 800;
  letter-spacing: 0.6px;
  color: var(--navy);
  margin-bottom: 22px;
  background: #ffffff;
  box-shadow: 0 2px 10px rgba(28, 84, 184, 0.08);
}

.terapias-eyebrow .eyebrow-dot {
  background: #1c54b8;
  animation: eval-radar-pulse 2.2s infinite ease-out;
}

.terapias-subpage-badge .eyebrow-dot {
  background: #1c54b8;
  animation: eval-radar-pulse 2.2s infinite ease-out;
}

.terapias-title {
  margin: 0 0 18px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.terapias-title-main {
  font-family: Montserrat, 'Arial Black', Arial, sans-serif;
  font-size: clamp(34px, 3.6vw, 54px);
  font-weight: 900;
  letter-spacing: -1.2px;
  line-height: 1.05;
  color: var(--navy);
}

.terapias-title-italic {
  font-family: 'Bodoni Moda', Georgia, serif;
  font-style: italic;
  font-weight: 800;
  font-size: clamp(28px, 3.2vw, 48px);
  line-height: 1.15;
  letter-spacing: -0.8px;
  background: linear-gradient(90deg, #1c54b8 0%, #FF5A00 100%);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
}

.terapias-desc {
  font-size: clamp(16px, 1.25vw, 19px);
  line-height: 1.55;
  color: #1a3858;
  margin: 0 0 32px;
  font-weight: 500;
  max-width: 540px;
}

.terapias-meta-bar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px;
  font-size: clamp(13px, 1.05vw, 15px);
  font-weight: 600;
  color: var(--navy);
}

.terapias-meta-item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.terapias-meta-icon {
  width: 19px;
  height: 19px;
  color: #1c54b8;
  flex-shrink: 0;
}

.terapias-meta-pin {
  color: #FF5A00;
}

.terapias-meta-divider {
  color: #8bb7f6;
  opacity: 0.6;
  user-select: none;
}

.terapias-card-media {
  position: relative;
  overflow: hidden;
  min-height: 380px;
  background: #f0f6fc;
}

.terapias-banner-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 35%;
  display: block;
  transition: transform 0.75s cubic-bezier(0.16, 1, 0.3, 1), filter 0.5s ease;
  will-change: transform;
  transform: scale(var(--scroll-zoom, 1));
}

.terapias-hero-card:hover .terapias-banner-img {
  transform: scale(calc(var(--scroll-zoom, 1) * 1.055));
}

.terapias-media-fade {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(to right, #ffffff 0%, rgba(255, 255, 255, 0.6) 12%, rgba(255, 255, 255, 0) 38%);
  z-index: 1;
}

.terapias-more-btn {
  position: absolute;
  right: 28px;
  bottom: 28px;
  z-index: 4;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  background: linear-gradient(110deg, #1c54b8 0%, #2f75ea 100%);
  color: #ffffff;
  border: 0;
  border-radius: 100px;
  padding: 13px 28px 13px 24px;
  font-size: 19px;
  font-weight: 800;
  box-shadow: 0 8px 24px rgba(28, 84, 184, 0.42);
  cursor: pointer;
  transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.28s cubic-bezier(0.16, 1, 0.3, 1), filter 0.2s ease;
  letter-spacing: -0.2px;
  animation: terapias-btn-pulse 3.8s ease-in-out infinite 0.8s;
}

@keyframes terapias-btn-pulse {
  0%, 32%, 100% {
    transform: scale(1) translateY(0);
    box-shadow: 0 8px 24px rgba(28, 84, 184, 0.42);
  }
  6% {
    transform: scale(1.06) translateY(-4px);
    box-shadow: 0 14px 32px rgba(28, 84, 184, 0.6);
  }
  12% {
    transform: scale(1.02) translateY(-2px);
    box-shadow: 0 10px 26px rgba(28, 84, 184, 0.48);
  }
  18% {
    transform: scale(1.05) translateY(-3px);
    box-shadow: 0 12px 28px rgba(28, 84, 184, 0.54);
  }
  24% {
    transform: scale(1) translateY(0);
    box-shadow: 0 8px 24px rgba(28, 84, 184, 0.42);
  }
}

.terapias-more-btn:hover {
  transform: translateY(-3px) scale(1.04);
  box-shadow: 0 14px 32px rgba(28, 84, 184, 0.55);
  filter: brightness(1.05);
}

.terapias-more-btn:active {
  transform: translateY(0) scale(0.97);
}

.terapias-more-arrow {
  width: 20px;
  height: 20px;
  transition: transform 0.25s ease;
}

.terapias-more-btn:hover .terapias-more-arrow {
  transform: translateX(4px);
}

/* SUBPÁGINA MODAL DE TERAPIAS */
.terapias-subpage-backdrop {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 24px 16px 60px;
  box-sizing: border-box;
  -webkit-overflow-scrolling: touch;
  scroll-behavior: smooth;
  scrollbar-width: thin;
  scrollbar-color: #8bc0fa #f4f8fc;
}

.terapias-subpage-backdrop[hidden] {
  display: none !important;
}

.terapias-subpage-backdrop::-webkit-scrollbar {
  width: 6px;
}
.terapias-subpage-backdrop::-webkit-scrollbar-track {
  background: #f4f8fc;
}
.terapias-subpage-backdrop::-webkit-scrollbar-thumb {
  background: #8bc0fa;
  border-radius: 10px;
}

.terapias-subpage-overlay-bg {
  position: fixed;
  inset: 0;
  background: rgba(0, 24, 52, 0.65);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  animation: eval-fade-in 0.35s ease-out both;
}

.terapias-subpage-sheet {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 1180px;
  background: #fffcf8;
  border-radius: 36px;
  box-shadow: 0 32px 100px rgba(0, 20, 50, 0.38);
  border: 1.5px solid #cce3fb;
  overflow: hidden;
  margin: auto;
  animation: eval-sheet-enter 0.45s cubic-bezier(0.16, 1, 0.3, 1) both;
}

.terapias-subpage-header {
  position: sticky;
  top: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 32px;
  background: rgba(255, 252, 248, 0.94);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid #d9ebfc;
}

.terapias-back-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  border: 0;
  background: #e3effd;
  color: #1c54b8;
  font-weight: 700;
  font-size: 14.5px;
  padding: 10px 20px;
  border-radius: 100px;
  cursor: pointer;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}

.terapias-back-arrow {
  width: 18px;
  height: 18px;
  transition: transform 0.25s;
}

.terapias-back-btn:hover {
  background: #1c54b8;
  color: #ffffff;
  transform: translateX(-4px);
  box-shadow: 0 6px 18px rgba(28, 84, 184, 0.25);
}

.terapias-back-btn:hover .terapias-back-arrow {
  transform: translateX(-3px);
}

.terapias-subpage-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.8px;
  color: var(--navy);
  padding: 6px 16px;
  border-radius: 100px;
  background: #ffffff;
  border: 1.5px solid #bedbfd;
}

.terapias-close-x {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: 0;
  background: #f1ede8;
  color: var(--navy);
  cursor: pointer;
  transition: transform 0.25s ease, background 0.25s, color 0.25s;
}

.terapias-close-x svg {
  width: 20px;
  height: 20px;
}

.terapias-close-x:hover {
  background: #e1effe;
  color: #1c54b8;
  transform: rotate(90deg);
}

.terapias-subpage-content {
  padding: clamp(28px, 4vw, 56px);
  display: flex;
  flex-direction: column;
  gap: 52px;
}

/* RECUADROS DE TERAPIA */
.terapias-subpage-cards-grid {
  display: flex;
  flex-direction: column;
  gap: 24px;
  width: 100%;
  max-width: 960px;
  margin: 0 auto;
  box-sizing: border-box;
}

.terapia-service-card {
  display: flex;
  flex-direction: column;
  border-radius: 28px;
  padding: clamp(24px, 3.2vw, 36px);
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  overflow: hidden;
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.35s ease, border-color 0.3s ease;
}

.terapia-service-card:hover {
  transform: translateY(-4px);
}

.terapia-card-peach {
  background: #fff5ed;
  border: 1.5px solid #fedfce;
  box-shadow: 0 10px 32px rgba(234, 88, 58, 0.05);
}
.terapia-card-peach:hover {
  box-shadow: 0 20px 48px rgba(234, 88, 58, 0.11);
  border-color: #fcba99;
}

.terapia-card-blue {
  background: #f0f7fe;
  border: 1.5px solid #d8e9fb;
  box-shadow: 0 10px 32px rgba(28, 84, 184, 0.05);
}
.terapia-card-blue:hover {
  box-shadow: 0 20px 48px rgba(28, 84, 184, 0.11);
  border-color: #b2d5fc;
}

.terapia-card-green {
  background: #f0faf5;
  border: 1.5px solid #c8edd9;
  box-shadow: 0 10px 32px rgba(6, 198, 83, 0.05);
}
.terapia-card-green:hover {
  box-shadow: 0 20px 48px rgba(6, 198, 83, 0.12);
  border-color: #8be1b1;
}

.terapia-card-warm {
  background: #fff6f2;
  border: 1.5px solid #fedbd0;
  box-shadow: 0 10px 32px rgba(242, 83, 69, 0.05);
}
.terapia-card-warm:hover {
  box-shadow: 0 20px 48px rgba(242, 83, 69, 0.12);
  border-color: #fcae9b;
}

.terapia-service-card-top {
  display: flex;
  align-items: center;
  gap: 20px;
  margin-bottom: 18px;
}

.terapia-icon-circle {
  width: 68px;
  height: 68px;
  min-width: 68px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  flex-shrink: 0;
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
  animation: icon-gentle-breathe 4.5s ease-in-out infinite;
}

.terapia-service-card:hover .terapia-icon-circle {
  transform: scale(1.06);
}

.terapia-icon-peach {
  background: #ffede0;
  color: #f04d38;
}
.terapia-icon-peach svg {
  width: 36px;
  height: 36px;
}

.terapia-icon-blue {
  background: #e0eeff;
  color: #1c54b8;
  animation-delay: -1.5s;
}
.terapia-icon-blue svg {
  width: 36px;
  height: 36px;
}

.terapia-icon-green {
  background: #d8f5e6;
  color: #059b41;
  animation-delay: -3s;
}
.terapia-icon-green svg {
  width: 36px;
  height: 36px;
}

.terapia-icon-warm {
  background: #ffe3d9;
  color: #df4432;
  animation-delay: -2.25s;
}
.terapia-icon-warm svg {
  width: 36px;
  height: 36px;
}

.terapia-service-header-text {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}

.terapia-age-kicker {
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.9px;
  line-height: 1;
}

.terapia-kicker-peach {
  color: #FF5A00;
}
.terapia-kicker-blue {
  color: #1b54b8;
}
.terapia-kicker-green {
  color: #089342;
}
.terapia-kicker-warm {
  color: #df4432;
}

.terapia-service-title {
  margin: 0;
  font-family: Montserrat, 'Arial Black', sans-serif;
  font-size: clamp(22px, 2.3vw, 29px);
  font-weight: 800;
  line-height: 1.18;
  letter-spacing: -0.5px;
  color: var(--navy);
  word-break: break-word;
}

.terapia-service-desc {
  font-size: clamp(15px, 1.15vw, 17px);
  line-height: 1.55;
  color: #1a3858;
  margin: 0 0 22px;
  font-weight: 500;
  max-width: 100%;
}

.terapia-tags-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  width: 100%;
  box-sizing: border-box;
}

.terapia-tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 9px 22px;
  border-radius: 100px;
  font-size: clamp(13px, 1.05vw, 15px);
  font-weight: 700;
  line-height: 1.1;
  text-align: center;
  white-space: nowrap;
  box-sizing: border-box;
  transition: transform 0.2s ease;
}

.terapia-tag:hover {
  transform: translateY(-2px);
}

.terapia-tag-peach {
  background: #fff0e5;
  color: #FF5A00;
  border: 1.5px solid rgba(255, 90, 0, 0.45);
}

.terapia-tag-blue {
  background: #e0eeff;
  color: #1c54b8;
  border: 1px solid #cbe1fb;
}

.terapia-tag-green {
  background: #d8f5e6;
  color: #078b3e;
  border: 1px solid #bcecd3;
}

.terapia-tag-warm {
  background: #ffe4da;
  color: #db3f2d;
  border: 1px solid #fec7b8;
}

.terapia-when-section {
  display: flex;
  flex-direction: column;
  gap: 28px;
  padding: 44px 38px;
  background: #ffffff;
  border-radius: 28px;
  border: 1.5px solid #d1e7fc;
  box-shadow: 0 12px 32px rgba(0, 38, 80, 0.04);
}

/* ==========================================================
   SECCIÓN TALLERES - SHOWCASE CARD (DISEÑO FIEL A LA IMAGEN)
   ========================================================== */
.talleres-section {
  position: relative;
  width: 100%;
  max-width: 1320px;
  margin: 30px auto 80px;
  padding: 0 24px;
  box-sizing: border-box;
  perspective: 1200px;
}

.talleres-card-container {
  width: 100%;
}

.talleres-hero-card {
  position: relative;
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  background: #fffcf8;
  border: 1.5px solid #fedec9;
  border-radius: 32px;
  box-shadow: 0 20px 48px rgba(0, 38, 80, 0.06), 0 4px 16px rgba(242, 83, 69, 0.04);
  overflow: hidden;
  cursor: pointer;
  outline: none;
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.4s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.3s ease;
  will-change: transform;
}

.talleres-hero-card::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 50%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.5), transparent);
  transform: translateX(-150%) skewX(-20deg);
  animation: eval-shimmer-sweep 8s ease-in-out infinite 3.5s;
  pointer-events: none;
  z-index: 5;
}

.talleres-hero-card:focus-visible {
  outline: 3px solid #FF5A00;
  outline-offset: 4px;
}

.talleres-hero-card:hover {
  border-color: #FF5A00;
  box-shadow: 0 28px 64px rgba(255, 90, 0, 0.18), 0 8px 24px rgba(0, 38, 80, 0.08);
}

.talleres-card-shine {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(circle 420px at var(--mouse-x, 50%) var(--mouse-y, 50%), rgba(255, 90, 0, 0.12), transparent 70%);
  opacity: 0;
  transition: opacity 0.3s ease;
  z-index: 2;
}

.talleres-hero-card:hover .talleres-card-shine {
  opacity: 1;
}

/* Doodles decorativos fieles a la imagen */
.talleres-doodle-rays {
  position: absolute;
  top: 18%;
  left: 48%;
  width: 28px;
  height: 28px;
  pointer-events: none;
  z-index: 4;
}

.talleres-doodle-rays .ray {
  position: absolute;
  width: 14px;
  height: 3px;
  border-radius: 4px;
}

.talleres-doodle-rays .ray-1 {
  background: #FF5A00;
  transform: rotate(-35deg);
  top: 6px;
  left: 0;
}

.talleres-doodle-rays .ray-2 {
  background: #FF5A00;
  transform: rotate(-50deg);
  top: 14px;
  left: 6px;
}

.talleres-doodle-star {
  position: absolute;
  top: 23%;
  left: 54%;
  width: 28px;
  height: 28px;
  pointer-events: none;
  z-index: 4;
  animation: doodle-spin-slow 24s linear infinite;
}

@keyframes doodle-spin-slow {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

.talleres-dashed-wave {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 50px;
  border-bottom: 2px dashed rgba(255, 90, 0, 0.45);
  border-radius: 0 0 50% 50% / 0 0 100% 100%;
  pointer-events: none;
  z-index: 2;
}

.talleres-card-content {
  padding: clamp(32px, 3.8vw, 56px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  z-index: 3;
}

.talleres-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  border: 2px solid #FF5A00;
  border-radius: 100px;
  padding: 6px 18px 6px 12px;
  width: fit-content;
  font-size: 11.5px;
  font-weight: 800;
  letter-spacing: 0.9px;
  color: var(--navy);
  margin-bottom: 22px;
  background: #ffffff;
  box-shadow: 0 2px 10px rgba(255, 90, 0, 0.15);
}

.talleres-eyebrow .eyebrow-dot {
  background: #FF5A00;
  animation: eval-radar-pulse 2.2s infinite ease-out;
}

.talleres-subpage-badge .eyebrow-dot {
  background: #FF5A00;
  animation: eval-radar-pulse 2.2s infinite ease-out;
}

.talleres-title {
  margin: 0 0 18px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.talleres-title-main {
  font-family: Montserrat, 'Arial Black', Arial, sans-serif;
  font-size: clamp(34px, 3.6vw, 54px);
  font-weight: 900;
  letter-spacing: -1.2px;
  line-height: 1.05;
  color: var(--navy);
}

.talleres-title-italic {
  font-family: 'Bodoni Moda', Georgia, serif;
  font-style: italic;
  font-weight: 800;
  font-size: clamp(28px, 3.2vw, 48px);
  line-height: 1.15;
  letter-spacing: -0.8px;
  background: linear-gradient(90deg, #FF5A00 0%, #ff7a1a 100%);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
}

.talleres-desc {
  font-size: clamp(16px, 1.25vw, 19px);
  line-height: 1.55;
  color: #1a3858;
  margin: 0 0 28px;
  font-weight: 500;
  max-width: 520px;
}

/* Las dos cajitas destacadas fieles a la imagen */
.talleres-feature-row {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 24px;
  flex-wrap: wrap;
}

.talleres-feature-box {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  padding: 12px 20px 12px 14px;
  border-radius: 20px;
  font-size: 15px;
  font-weight: 700;
  color: var(--navy);
  font-family: inherit;
  cursor: pointer;
  outline: none;
  border: 1.5px solid transparent;
  transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.28s ease, border-color 0.2s ease, background 0.2s ease;
  user-select: none;
  text-decoration: none;
}

.talleres-feature-box:hover {
  transform: translateY(-3px) scale(1.02);
  box-shadow: 0 10px 24px rgba(0, 38, 80, 0.12);
}

.talleres-feature-box:active {
  transform: translateY(0) scale(0.98);
}

.talleres-feature-box:focus-visible {
  outline: 3px solid #ff5e3a;
  outline-offset: 3px;
}

.talleres-feature-box.box-study {
  background: #e8f2fe;
  border: 1.5px solid #d0e4fc;
}

.talleres-feature-box.box-study:hover {
  border-color: #a4ccfc;
  background: #deedfd;
}

.talleres-feature-box.box-emotional {
  background: #fff1e8;
  border: 1.5px solid #fcded0;
}

.talleres-feature-box.box-emotional:hover {
  border-color: #fba984;
  background: #ffe8dc;
}

.talleres-feature-arrow {
  width: 18px;
  height: 18px;
  margin-left: 2px;
  opacity: 0.55;
  transition: transform 0.25s ease, opacity 0.25s ease;
}

.talleres-feature-box:hover .talleres-feature-arrow {
  transform: translateX(4px);
  opacity: 1;
}

.talleres-feature-icon-circle {
  width: 44px;
  height: 44px;
  min-width: 44px;
  border-radius: 50%;
  background: #ffffff;
  display: grid;
  place-items: center;
  box-shadow: 0 4px 12px rgba(0, 38, 80, 0.06);
}

.talleres-feature-icon-circle svg {
  width: 24px;
  height: 24px;
}

.talleres-actions-row {
  display: flex;
  align-items: center;
  gap: 16px;
}

.talleres-cta-btn {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  background: var(--navy);
  color: #ffffff;
  border: 0;
  border-radius: 100px;
  padding: 15px 32px 15px 28px;
  font-size: 18px;
  font-weight: 800;
  cursor: pointer;
  box-shadow: 0 8px 24px rgba(0, 38, 80, 0.24);
  transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.28s ease, background 0.2s;
  letter-spacing: -0.2px;
}

.talleres-cta-btn:hover {
  transform: translateY(-3px) scale(1.03);
  box-shadow: 0 14px 32px rgba(0, 38, 80, 0.35);
  background: #0f3c70;
}

.talleres-cta-btn:active {
  transform: translateY(0) scale(0.97);
}

.talleres-cta-arrow {
  width: 20px;
  height: 20px;
  transition: transform 0.25s ease;
}

.talleres-cta-btn:hover .talleres-cta-arrow {
  transform: translate(3px, -3px);
}

.talleres-meta-bar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px;
  font-size: clamp(13px, 1.05vw, 15px);
  font-weight: 600;
  color: var(--navy);
  margin-top: 8px;
  padding-top: 18px;
  border-top: 1px dashed #fedec9;
}

.talleres-meta-item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.talleres-meta-icon {
  width: 19px;
  height: 19px;
  color: #FF5A00;
  flex-shrink: 0;
}

.talleres-meta-pin {
  color: #FF5A00;
}

.talleres-meta-divider {
  color: #ff9d66;
  opacity: 0.6;
  user-select: none;
}

.talleres-card-media {
  position: relative;
  overflow: hidden;
  min-height: 380px;
  background: #faf4ed;
}

.talleres-banner-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 30%;
  display: block;
  transition: transform 0.75s cubic-bezier(0.16, 1, 0.3, 1), filter 0.5s ease;
  will-change: transform;
  transform: scale(var(--scroll-zoom, 1));
}

.talleres-hero-card:hover .talleres-banner-img {
  transform: scale(calc(var(--scroll-zoom, 1) * 1.055));
}

.talleres-media-fade {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(to right, #ffffff 0%, rgba(255, 255, 255, 0.5) 15%, rgba(255, 255, 255, 0) 40%);
  z-index: 1;
}

.talleres-more-btn {
  position: absolute;
  right: 28px;
  bottom: 28px;
  z-index: 4;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  background: linear-gradient(110deg, #FF5A00 0%, #ff731d 100%);
  color: #ffffff;
  border: 0;
  border-radius: 100px;
  padding: 13px 28px 13px 24px;
  font-size: 19px;
  font-weight: 800;
  box-shadow: 0 8px 24px rgba(255, 90, 0, 0.42);
  cursor: pointer;
  transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.28s cubic-bezier(0.16, 1, 0.3, 1), filter 0.2s ease;
  letter-spacing: -0.2px;
  animation: eval-btn-pulse 3.8s ease-in-out infinite 1.2s;
}

.talleres-more-btn:hover {
  transform: translateY(-3px) scale(1.04);
  box-shadow: 0 14px 32px rgba(255, 90, 0, 0.55);
}

.talleres-more-arrow {
  width: 20px;
  height: 20px;
  transition: transform 0.25s ease;
}

.talleres-more-btn:hover .talleres-more-arrow {
  transform: translateX(4px);
}

/* SUBPÁGINA MODAL DE TALLERES */
.talleres-subpage-backdrop {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 24px 16px 60px;
  box-sizing: border-box;
  -webkit-overflow-scrolling: touch;
  scroll-behavior: smooth;
  scrollbar-width: thin;
  scrollbar-color: #fca67e #fcfaf6;
}

.talleres-subpage-backdrop[hidden] {
  display: none !important;
}

.talleres-subpage-backdrop::-webkit-scrollbar {
  width: 6px;
}
.talleres-subpage-backdrop::-webkit-scrollbar-track {
  background: #fcfaf6;
}
.talleres-subpage-backdrop::-webkit-scrollbar-thumb {
  background: #fca67e;
  border-radius: 10px;
}

.talleres-subpage-overlay-bg {
  position: fixed;
  inset: 0;
  background: rgba(0, 24, 52, 0.65);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  animation: eval-fade-in 0.35s ease-out both;
}

.talleres-subpage-sheet {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 1180px;
  background: #fffcf8;
  border-radius: 36px;
  box-shadow: 0 32px 100px rgba(0, 20, 50, 0.38);
  border: 1.5px solid #fedec9;
  overflow: hidden;
  margin: auto;
  animation: eval-sheet-enter 0.45s cubic-bezier(0.16, 1, 0.3, 1) both;
}

.talleres-subpage-header {
  position: sticky;
  top: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 32px;
  background: rgba(255, 252, 248, 0.94);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid #fce8db;
}

.talleres-back-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  border: 0;
  background: #fff0e4;
  color: #FF5A00;
  font-weight: 700;
  font-size: 14.5px;
  padding: 10px 20px;
  border-radius: 100px;
  cursor: pointer;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}

.talleres-back-arrow {
  width: 18px;
  height: 18px;
  transition: transform 0.25s;
}

.talleres-back-btn:hover {
  background: #FF5A00;
  color: #ffffff;
  transform: translateX(-4px);
  box-shadow: 0 6px 18px rgba(255, 90, 0, 0.25);
}

.talleres-back-btn:hover .talleres-back-arrow {
  transform: translateX(-3px);
}

.talleres-subpage-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.8px;
  color: var(--navy);
  padding: 6px 16px;
  border-radius: 100px;
  background: #ffffff;
  border: 1.5px solid #fedec9;
}

.talleres-close-x {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: 0;
  background: #f1ede8;
  color: var(--navy);
  cursor: pointer;
  transition: transform 0.25s ease, background 0.25s, color 0.25s;
}

.talleres-close-x svg {
  width: 20px;
  height: 20px;
}

.talleres-close-x:hover {
  background: #ffe3d1;
  color: #FF5A00;
  transform: rotate(90deg);
}

.talleres-subpage-content {
  padding: clamp(28px, 4vw, 56px);
  display: flex;
  flex-direction: column;
  gap: 52px;
}

/* RECUADROS DE TALLER */
.talleres-subpage-cards-grid {
  display: flex;
  flex-direction: column;
  gap: 24px;
  width: 100%;
  max-width: 960px;
  margin: 0 auto;
  box-sizing: border-box;
}

.taller-service-card {
  display: flex;
  flex-direction: column;
  border-radius: 28px;
  padding: clamp(24px, 3.2vw, 36px);
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  overflow: hidden;
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.35s ease, border-color 0.3s ease;
}

.taller-service-card:hover {
  transform: translateY(-4px);
}

.taller-highlighted-card {
  animation: taller-card-focus-pop 1.2s cubic-bezier(0.16, 1, 0.3, 1) both;
}

@keyframes taller-card-focus-pop {
  0% {
    transform: scale(0.97);
  }
  35% {
    transform: scale(1.025);
    box-shadow: 0 20px 48px rgba(255, 90, 0, 0.2), 0 0 0 3px #FF5A00;
  }
  100% {
    transform: scale(1);
  }
}

.taller-card-peach {
  background: #fff5ed;
  border: 1.5px solid #fedfce;
  box-shadow: 0 10px 32px rgba(234, 88, 58, 0.05);
}
.taller-card-peach:hover {
  box-shadow: 0 20px 48px rgba(234, 88, 58, 0.11);
  border-color: #fcba99;
}

.taller-card-blue {
  background: #f0f7fe;
  border: 1.5px solid #d8e9fb;
  box-shadow: 0 10px 32px rgba(28, 84, 184, 0.05);
}
.taller-card-blue:hover {
  box-shadow: 0 20px 48px rgba(28, 84, 184, 0.11);
  border-color: #b2d5fc;
}

.taller-card-green {
  background: #f0faf5;
  border: 1.5px solid #c8edd9;
  box-shadow: 0 10px 32px rgba(6, 198, 83, 0.05);
}
.taller-card-green:hover {
  box-shadow: 0 20px 48px rgba(6, 198, 83, 0.12);
  border-color: #8be1b1;
}

.taller-card-warm {
  background: #fff6f2;
  border: 1.5px solid #fedbd0;
  box-shadow: 0 10px 32px rgba(242, 83, 69, 0.05);
}
.taller-card-warm:hover {
  box-shadow: 0 20px 48px rgba(242, 83, 69, 0.12);
  border-color: #fcae9b;
}

.taller-service-card-top {
  display: flex;
  align-items: center;
  gap: 20px;
  margin-bottom: 18px;
}

.taller-icon-circle {
  width: 68px;
  height: 68px;
  min-width: 68px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  flex-shrink: 0;
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
  animation: icon-gentle-breathe 4.5s ease-in-out infinite;
}

.taller-service-card:hover .taller-icon-circle {
  transform: scale(1.06);
}

.taller-icon-peach {
  background: #ffede0;
  color: #f04d38;
}
.taller-icon-peach svg {
  width: 36px;
  height: 36px;
}

.taller-icon-blue {
  background: #e0eeff;
  color: #1c54b8;
  animation-delay: -1.5s;
}
.taller-icon-blue svg {
  width: 36px;
  height: 36px;
}

.taller-icon-green {
  background: #d8f5e6;
  color: #059b41;
  animation-delay: -3s;
}
.taller-icon-green svg {
  width: 36px;
  height: 36px;
}

.taller-icon-warm {
  background: #ffe3d9;
  color: #df4432;
  animation-delay: -2.25s;
}
.taller-icon-warm svg {
  width: 36px;
  height: 36px;
}

.taller-service-header-text {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}

.taller-age-kicker {
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.9px;
  line-height: 1;
}

.taller-kicker-peach {
  color: #FF5A00;
}
.taller-kicker-blue {
  color: #1b54b8;
}
.taller-kicker-green {
  color: #089342;
}
.taller-kicker-warm {
  color: #df4432;
}

.taller-service-title {
  margin: 0;
  font-family: Montserrat, 'Arial Black', sans-serif;
  font-size: clamp(22px, 2.3vw, 29px);
  font-weight: 800;
  line-height: 1.18;
  letter-spacing: -0.5px;
  color: var(--navy);
  word-break: break-word;
}

.taller-service-desc {
  font-size: clamp(15px, 1.15vw, 17px);
  line-height: 1.55;
  color: #1a3858;
  margin: 0 0 22px;
  font-weight: 500;
  max-width: 100%;
}

.taller-tags-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  width: 100%;
  box-sizing: border-box;
}

.taller-tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 9px 22px;
  border-radius: 100px;
  font-size: clamp(13px, 1.05vw, 15px);
  font-weight: 700;
  line-height: 1.1;
  text-align: center;
  white-space: nowrap;
  box-sizing: border-box;
  transition: transform 0.2s ease;
}

.taller-tag:hover {
  transform: translateY(-2px);
}

.taller-tag-peach {
  background: #ffede0;
  color: #FF5A00;
  border: 1px solid #ffd8c4;
}

.taller-tag-blue {
  background: #e0eeff;
  color: #1c54b8;
  border: 1px solid #cbe1fb;
}

.taller-tag-green {
  background: #d8f5e6;
  color: #078b3e;
  border: 1px solid #bcecd3;
}

.taller-tag-warm {
  background: #ffe4da;
  color: #db3f2d;
  border: 1px solid #fec7b8;
}

.taller-why-section {
  display: flex;
  flex-direction: column;
  gap: 28px;
  padding: 44px 38px;
  background: #ffffff;
  border-radius: 28px;
  border: 1.5px solid #fedec9;
  box-shadow: 0 12px 32px rgba(0, 38, 80, 0.04);
}

/* ==========================================================
   RESPONSIVE MOBILE RULES
   ========================================================== */
@media (max-width: 900px) {
  .eval-hero-card,
  .terapias-hero-card,
  .talleres-hero-card {
    grid-template-columns: 1fr;
  }
  .eval-card-media,
  .terapias-card-media,
  .talleres-card-media {
    min-height: 280px;
    order: -1;
  }
  .eval-media-fade,
  .terapias-media-fade,
  .talleres-media-fade {
    background: linear-gradient(to bottom, transparent 60%, #ffffff 100%);
  }
  .eval-subpage-cards-grid,
  .terapias-subpage-cards-grid,
  .talleres-subpage-cards-grid {
    grid-template-columns: 1fr;
  }
  .eval-when-grid {
    grid-template-columns: 1fr;
  }
  .eval-process-steps {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .eval-step-divider {
    display: none;
  }
  .eval-cta-card {
    grid-template-columns: 1fr;
    gap: 28px;
    padding: 34px 28px;
  }
  .eval-cta-divider {
    display: none;
  }
  .talleres-doodle-rays,
  .talleres-doodle-star {
    display: none;
  }
}

@media (max-width: 600px) {
  .evaluaciones-section,
  .terapias-section,
  .talleres-section {
    padding: 0 16px;
    margin: 24px auto 50px;
  }
  .eval-hero-card,
  .terapias-hero-card,
  .talleres-hero-card {
    border-radius: 26px;
  }
  .eval-card-content,
  .terapias-card-content,
  .talleres-card-content {
    padding: 26px 20px 30px;
  }
  .eval-card-media,
  .terapias-card-media,
  .talleres-card-media {
    min-height: 240px;
  }
  .eval-more-btn,
  .terapias-more-btn,
  .talleres-more-btn {
    right: 18px;
    bottom: 18px;
    padding: 10px 22px 10px 18px;
    font-size: 16px;
  }
  .talleres-feature-row {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }
  .talleres-feature-box {
    width: 100%;
    box-sizing: border-box;
  }
  .talleres-cta-btn {
    width: 100%;
    justify-content: center;
    font-size: 16px;
    padding: 14px 20px;
  }
  .eval-subpage-header,
  .terapias-subpage-header,
  .talleres-subpage-header {
    padding: 14px 18px;
  }
  .eval-subpage-content,
  .terapias-subpage-content,
  .talleres-subpage-content {
    padding: 24px 16px;
    gap: 36px;
  }
  .eval-service-card,
  .terapia-service-card,
  .taller-service-card {
    padding: 22px 18px 24px;
    border-radius: 22px;
  }
  .eval-service-card-top,
  .terapia-service-card-top,
  .taller-service-card-top {
    gap: 14px;
    margin-bottom: 14px;
  }
  .eval-icon-circle,
  .terapia-icon-circle,
  .taller-icon-circle {
    width: 54px;
    height: 54px;
    min-width: 54px;
  }
  .eval-icon-circle svg,
  .terapia-icon-circle svg,
  .taller-icon-circle svg {
    width: 28px;
    height: 28px;
  }
  .eval-service-title,
  .terapia-service-title,
  .taller-service-title {
    font-size: 20px;
  }
  .eval-service-desc,
  .terapia-service-desc,
  .taller-service-desc {
    font-size: 14.5px;
    margin-bottom: 18px;
    line-height: 1.5;
  }
  .eval-tags-row,
  .terapia-tags-row,
  .taller-tags-row {
    gap: 8px;
  }
  .eval-tag,
  .terapia-tag,
  .taller-tag {
    padding: 7px 14px;
    font-size: 13px;
  }
  .eval-when-section,
  .terapia-when-section,
  .taller-why-section {
    padding: 28px 18px;
    border-radius: 22px;
  }
  .eval-cta-card {
    border-radius: 24px;
    padding: 28px 20px;
  }
  .eval-cta-whatsapp-btn {
    width: 100%;
    justify-content: center;
    font-size: 15px;
    padding: 13px 20px;
  }
}

/* ==========================================================
   SCROLL REVEAL Y EFECTOS AUTÓNOMOS PARA TELÉFONOS
   ========================================================== */
.eval-reveal-ready,
.terapia-reveal-ready,
.taller-reveal-ready {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity 0.65s cubic-bezier(0.16, 1, 0.3, 1), transform 0.65s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: opacity, transform;
}

.eval-reveal-ready.is-revealed,
.terapia-reveal-ready.is-revealed,
.taller-reveal-ready.is-revealed {
  opacity: 1;
  transform: translateY(0);
}

.eval-when-grid .eval-when-item:nth-child(1).is-revealed,
.terapia-when-section .eval-when-item:nth-child(1).is-revealed,
.taller-why-section .eval-when-item:nth-child(1).is-revealed { transition-delay: 0.05s; }
.eval-when-grid .eval-when-item:nth-child(2).is-revealed,
.terapia-when-section .eval-when-item:nth-child(2).is-revealed,
.taller-why-section .eval-when-item:nth-child(2).is-revealed { transition-delay: 0.12s; }
.eval-when-grid .eval-when-item:nth-child(3).is-revealed,
.terapia-when-section .eval-when-item:nth-child(3).is-revealed,
.taller-why-section .eval-when-item:nth-child(3).is-revealed { transition-delay: 0.19s; }
.eval-when-grid .eval-when-item:nth-child(4).is-revealed,
.terapia-when-section .eval-when-item:nth-child(4).is-revealed,
.taller-why-section .eval-when-item:nth-child(4).is-revealed { transition-delay: 0.26s; }

.eval-process-steps .eval-step-item:nth-child(1).is-revealed { transition-delay: 0.06s; }
.eval-process-steps .eval-step-item:nth-child(3).is-revealed { transition-delay: 0.16s; }
.eval-process-steps .eval-step-item:nth-child(5).is-revealed { transition-delay: 0.26s; }

.eval-subpage-cards-grid .eval-service-card:nth-child(1).is-revealed { transition-delay: 0.04s; }
.eval-subpage-cards-grid .eval-service-card:nth-child(2).is-revealed { transition-delay: 0.14s; }

.terapias-subpage-cards-grid .terapia-service-card:nth-child(1).is-revealed { transition-delay: 0.04s; }
.terapias-subpage-cards-grid .terapia-service-card:nth-child(2).is-revealed { transition-delay: 0.12s; }
.terapias-subpage-cards-grid .terapia-service-card:nth-child(3).is-revealed { transition-delay: 0.20s; }
.terapias-subpage-cards-grid .terapia-service-card:nth-child(4).is-revealed { transition-delay: 0.28s; }

.talleres-subpage-cards-grid .taller-service-card:nth-child(1).is-revealed { transition-delay: 0.04s; }
.talleres-subpage-cards-grid .taller-service-card:nth-child(2).is-revealed { transition-delay: 0.12s; }
.talleres-subpage-cards-grid .taller-service-card:nth-child(3).is-revealed { transition-delay: 0.20s; }
.talleres-subpage-cards-grid .taller-service-card:nth-child(4).is-revealed { transition-delay: 0.28s; }

.eval-when-item.is-revealed .eval-check-icon svg {
  animation: check-spring 0.6s cubic-bezier(0.16, 1, 0.3, 1) both;
}

.eval-step-item.is-revealed .eval-step-number {
  animation: step-number-pop 0.55s cubic-bezier(0.16, 1, 0.3, 1) both;
}

.eval-subpage-backdrop {
  scroll-behavior: smooth;
  scrollbar-width: thin;
  scrollbar-color: #fca67e #fcfaf6;
}

.eval-subpage-backdrop::-webkit-scrollbar {
  width: 6px;
}
.eval-subpage-backdrop::-webkit-scrollbar-track {
  background: #fcfaf6;
}
.eval-subpage-backdrop::-webkit-scrollbar-thumb {
  background: #fca67e;
  border-radius: 10px;
}

@keyframes eval-btn-pulse {
  0%, 32%, 100% {
    transform: scale(1) translateY(0);
    box-shadow: 0 8px 24px rgba(234, 88, 58, 0.42);
  }
  6% {
    transform: scale(1.06) translateY(-4px);
    box-shadow: 0 14px 32px rgba(234, 88, 58, 0.6);
  }
  12% {
    transform: scale(1.02) translateY(-2px);
    box-shadow: 0 10px 26px rgba(234, 88, 58, 0.48);
  }
  18% {
    transform: scale(1.05) translateY(-3px);
    box-shadow: 0 12px 28px rgba(234, 88, 58, 0.54);
  }
  24% {
    transform: scale(1) translateY(0);
    box-shadow: 0 8px 24px rgba(234, 88, 58, 0.42);
  }
}

@keyframes eval-arrow-nudge {
  0%, 32%, 100% {
    transform: translateX(0);
  }
  6%, 18% {
    transform: translateX(5px);
  }
  12% {
    transform: translateX(2px);
  }
  24% {
    transform: translateX(0);
  }
}

@keyframes eval-shimmer-sweep {
  0%, 75%, 100% {
    transform: translateX(-150%) skewX(-20deg);
    opacity: 0;
  }
  10% {
    opacity: 0.55;
  }
  28% {
    transform: translateX(250%) skewX(-20deg);
    opacity: 0;
  }
}

@keyframes eval-img-float {
  0%, 100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.038);
  }
}

@keyframes icon-gentle-breathe {
  0%, 100% {
    transform: translateY(0) scale(1);
  }
  50% {
    transform: translateY(-3.5px) scale(1.03);
  }
}

@keyframes eval-radar-pulse {
  0%, 100% {
    box-shadow: 0 0 0 0 rgba(255, 101, 16, 0.55);
  }
  50% {
    box-shadow: 0 0 0 7px rgba(255, 101, 16, 0);
  }
}

@keyframes check-spring {
  0% {
    transform: scale(0.5);
    opacity: 0;
  }
  65% {
    transform: scale(1.2);
    opacity: 1;
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}

@keyframes step-number-pop {
  0% {
    transform: scale(0.7);
    background: #ffffff;
    color: #FF5A00;
  }
  50% {
    transform: scale(1.15);
    background: #FF5A00;
    color: #ffffff;
  }
  100% {
    transform: scale(1);
  }
}

@keyframes phone-ring {
  0%, 28%, 100% {
    transform: rotate(0deg) scale(1);
  }
  4% {
    transform: rotate(-14deg) scale(1.1);
  }
  8% {
    transform: rotate(14deg) scale(1.12);
  }
  12% {
    transform: rotate(-12deg) scale(1.08);
  }
  16% {
    transform: rotate(8deg) scale(1.04);
  }
  20% {
    transform: rotate(0deg) scale(1);
  }
}

/* ==========================================================================
   SECCIÓN COMPLETA DE SERVICIOS (SCROLL HORIZONTAL NATIVO STICKY FLUIDO)
   ========================================================================== */
.servicios-section {
  position: relative;
  width: 100%;
  background: linear-gradient(180deg, #fdf8f3 0%, #fffcf8 40%, #fdf7f0 100%);
  border-top: 1.5px solid #fce6d8;
  box-sizing: border-box;
}

.servicios-sticky-wrap {
  position: sticky;
  top: 0;
  width: 100%;
  height: 100vh;
  height: 100svh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow: hidden;
  box-sizing: border-box;
  padding: clamp(24px, 3.5vh, 48px) 0;
}

.servicios-container {
  max-width: 1320px;
  width: 100%;
  margin: 0 auto;
  padding: 0 clamp(16px, 3.5vw, 36px);
  box-sizing: border-box;
}

/* Carrusel Lateral de Servicios */
.servicios-carousel-block {
  width: 100%;
  margin-bottom: 0;
}

.servicios-carousel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: clamp(16px, 2.2vh, 26px);
  flex-wrap: wrap;
  gap: 12px;
}

.servicios-carousel-heading-wrap {
  display: flex;
  align-items: baseline;
  gap: 14px;
}

.servicios-title-clean {
  font-size: clamp(28px, 3.4vw, 42px);
  font-weight: 800;
  color: #002650;
  margin: 0;
  letter-spacing: -0.02em;
  line-height: 1.15;
}

.servicios-carousel-hint {
  font-size: 14px;
  color: #7b92a8;
  font-weight: 600;
  user-select: none;
}

.servicios-carousel-viewport {
  position: relative;
  overflow: hidden;
  width: 100%;
  padding: 10px 4px 22px;
  box-sizing: border-box;
}

.servicios-carousel-viewport:focus-visible {
  outline: 2px solid #FF5A00;
  outline-offset: 4px;
  border-radius: 16px;
}

.servicios-carousel-track {
  display: flex;
  flex-wrap: nowrap;
  gap: clamp(18px, 2.2vw, 28px);
  width: max-content;
  padding: 4px clamp(16px, 2.5vw, 36px) 14px 4px;
  box-sizing: border-box;
  will-change: transform;
}

/* Tarjeta individual del carrusel */
.servicios-card {
  flex: 0 0 clamp(290px, 30vw, 370px);
  border-radius: 26px;
  background: #ffffff;
  border: 1.5px solid #fedec9;
  box-shadow: 0 10px 30px rgba(0, 38, 80, 0.07);
  cursor: pointer;
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.35s ease, border-color 0.3s ease;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  user-select: none;
  text-decoration: none;
  color: inherit;
  outline: none;
}

@media (max-width: 768px) {
  .servicios-card {
    flex: 0 0 clamp(270px, 78vw, 330px);
  }
}

@media (min-width: 769px) {
  .servicios-card {
    flex: 0 0 clamp(380px, 31vw, 460px);
  }
  .servicios-carousel-track {
    gap: 32px;
    padding: 6px clamp(20px, 2.5vw, 48px) 18px 4px;
  }
}

.servicios-card.is-active-card,
.servicios-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 44px rgba(0, 38, 80, 0.14);
  border-color: #FF5A00;
}

.servicios-card:focus-visible {
  outline: 3px solid #FF5A00;
  outline-offset: 3px;
}

.servicios-card-media {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background: #faf4ed;
}

.servicios-card-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.65s cubic-bezier(0.16, 1, 0.3, 1);
  display: block;
}

.servicios-card:hover .servicios-card-img {
  transform: scale(1.08);
}

.servicios-card-tag {
  position: absolute;
  top: 14px;
  left: 14px;
  background: rgba(0, 38, 80, 0.88);
  backdrop-filter: blur(8px);
  color: #ffffff;
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: 0.08em;
  padding: 5px 12px;
  border-radius: 999px;
  text-transform: uppercase;
}

.servicios-card-body {
  padding: 24px;
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}

.servicios-card-num {
  font-size: 13px;
  font-weight: 800;
  color: #FF5A00;
  margin-bottom: 8px;
  font-variant-numeric: tabular-nums;
}

.servicios-card-title {
  font-size: 20px;
  font-weight: 800;
  color: #002650;
  margin: 0 0 10px;
  line-height: 1.25;
}

.servicios-card-desc {
  font-size: 14.5px;
  color: #516a85;
  line-height: 1.55;
  margin: 0 0 20px;
  flex-grow: 1;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.servicios-card-action {
  display: inline-flex;
  align-items: center;
  color: #FF5A00;
  font-weight: 700;
  font-size: 14.5px;
  margin-top: auto;
}

.servicios-card-link {
  font-weight: 700;
  color: #FF5A00;
  transition: color 0.25s ease;
  letter-spacing: -0.01em;
}

.servicios-card:hover .servicios-card-link {
  color: #e04f00;
  text-decoration: underline;
  text-underline-offset: 4px;
}

/* Indicadores de paginación del carrusel */
.servicios-carousel-dots {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-top: 18px;
}

.carousel-dot {
  width: 12px;
  height: 12px;
  border-radius: 999px;
  background: #fedec9;
  border: 0;
  cursor: pointer;
  transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
  padding: 0;
  outline: none;
}

.carousel-dot.is-active {
  width: 32px;
  background: #FF5A00;
}

.carousel-dot:focus-visible {
  outline: 2px solid #FF5A00;
  outline-offset: 2px;
}

/* 3. Subsecciones detalladas de cada servicio */
.servicios-subsections-container {
  display: flex;
  flex-direction: column;
  gap: clamp(40px, 6vw, 70px);
}

.servicio-detail-card {
  border-radius: 32px;
  background: #ffffff;
  border: 1.5px solid #fedec9;
  box-shadow: 0 12px 36px rgba(0, 38, 80, 0.08);
  overflow: hidden;
  scroll-margin-top: 90px;
  transition: transform 0.4s ease, box-shadow 0.4s ease, border-color 0.4s ease;
}

.servicio-detail-card.servicio-target-pulse {
  animation: servicio-pulse-ring 1.4s cubic-bezier(0.16, 1, 0.3, 1) both;
}

@keyframes servicio-pulse-ring {
  0% {
    transform: scale(0.985);
    box-shadow: 0 0 0 0 rgba(255, 90, 0, 0.45);
  }
  40% {
    transform: scale(1.015);
    box-shadow: 0 20px 50px rgba(255, 90, 0, 0.28), 0 0 0 5px #FF5A00;
  }
  100% {
    transform: scale(1);
    box-shadow: 0 12px 36px rgba(0, 38, 80, 0.08);
  }
}

.servicio-detail-grid {
  display: grid;
  grid-template-columns: 1fr 1.25fr;
}

@media (max-width: 900px) {
  .servicio-detail-grid {
    grid-template-columns: 1fr;
  }
}

.servicio-detail-media {
  position: relative;
  overflow: hidden;
  min-height: 380px;
  background: #faf4ed;
}

.servicio-detail-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.servicio-badge-chip {
  position: absolute;
  bottom: 20px;
  left: 20px;
  background: rgba(0, 38, 80, 0.88);
  backdrop-filter: blur(10px);
  color: #ffffff;
  font-weight: 800;
  font-size: 12px;
  letter-spacing: 0.08em;
  padding: 7px 16px;
  border-radius: 999px;
  text-transform: uppercase;
  border: 1px solid rgba(255, 255, 255, 0.2);
}

.servicio-detail-info {
  padding: clamp(28px, 4vw, 48px);
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.servicio-detail-kicker {
  font-size: 12.5px;
  font-weight: 800;
  letter-spacing: 0.1em;
  color: #FF5A00;
  text-transform: uppercase;
  margin-bottom: 8px;
}

.servicio-detail-heading {
  font-size: clamp(24px, 2.5vw, 34px);
  font-weight: 800;
  color: #002650;
  margin: 0 0 14px;
  line-height: 1.22;
  letter-spacing: -0.015em;
}

.servicio-detail-lead {
  font-size: 16.5px;
  font-weight: 700;
  color: #002650;
  margin: 0 0 12px;
  line-height: 1.5;
}

.servicio-detail-text {
  font-size: 15px;
  color: #516a85;
  line-height: 1.65;
  margin: 0 0 24px;
}

.servicio-features-block {
  margin-bottom: 20px;
}

.servicio-features-title {
  font-size: 14.5px;
  font-weight: 700;
  color: #002650;
  margin: 0 0 10px;
}

.servicio-pills-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
}

.servicio-pill {
  background: #fdf2ea;
  border: 1px solid #fedec9;
  color: #002650;
  font-size: 13.5px;
  font-weight: 600;
  padding: 6px 14px;
  border-radius: 999px;
}

/* Grilla de aspectos (Orientación Vocacional) */
.servicio-aspects-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
  margin-bottom: 22px;
}

@media (max-width: 600px) {
  .servicio-aspects-grid {
    grid-template-columns: 1fr;
  }
}

.aspect-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  background: #fcf8f4;
  border: 1px solid #fce8db;
  border-radius: 16px;
  padding: 12px 14px;
}

.aspect-item.aspect-span-full {
  grid-column: 1 / -1;
}

.aspect-icon {
  font-size: 18px;
  flex-shrink: 0;
}

.aspect-item strong {
  display: block;
  font-size: 14px;
  color: #002650;
  margin-bottom: 2px;
}

.aspect-item p {
  margin: 0;
  font-size: 13px;
  color: #516a85;
  line-height: 1.45;
}

/* Lista de áreas (Asesoramiento familiar) */
.servicio-areas-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-bottom: 24px;
}

.area-row-item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  background: #fff9f5;
  border: 1px solid #fedec9;
  border-radius: 16px;
  padding: 14px 18px;
}

.area-bullet {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #FF5A00;
  margin-top: 6px;
  flex-shrink: 0;
}

.area-row-item strong {
  display: block;
  font-size: 14.5px;
  color: #002650;
  margin-bottom: 2px;
}

.area-row-item p {
  margin: 0;
  font-size: 13.5px;
  color: #516a85;
  line-height: 1.5;
}

/* Grupos objetivos (Capacitaciones institucionales) */
.servicio-target-groups {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
  margin-bottom: 24px;
}

@media (max-width: 600px) {
  .servicio-target-groups {
    grid-template-columns: 1fr;
  }
}

.target-group-card {
  background: #f6f9fc;
  border: 1px solid #dce8f5;
  border-radius: 18px;
  padding: 16px;
}

.target-group-badge {
  display: inline-block;
  font-size: 11px;
  font-weight: 800;
  color: #002650;
  background: #e2eefb;
  padding: 4px 10px;
  border-radius: 999px;
  margin-bottom: 8px;
}

.target-group-card strong {
  display: block;
  font-size: 14.5px;
  color: #002650;
  margin-bottom: 4px;
}

.target-group-card p {
  margin: 0;
  font-size: 13px;
  color: #516a85;
  line-height: 1.5;
}

.servicio-audience-box {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  background: #f6f9fc;
  border: 1px solid #dce8f5;
  border-radius: 18px;
  padding: 14px 18px;
  margin-bottom: 18px;
}

.audience-icon {
  width: 22px;
  height: 22px;
  color: #002650;
  flex-shrink: 0;
  margin-top: 2px;
}

.servicio-audience-box strong {
  display: block;
  font-size: 14px;
  color: #002650;
  margin-bottom: 2px;
}

.servicio-audience-box p {
  margin: 0;
  font-size: 13.5px;
  color: #516a85;
}

.servicio-guidance-note {
  background: #fffcf8;
  border-left: 3.5px solid #FF5A00;
  padding: 12px 16px;
  margin-bottom: 24px;
  border-radius: 0 14px 14px 0;
}

.servicio-guidance-note strong {
  display: block;
  font-size: 14px;
  color: #002650;
  margin-bottom: 2px;
}

.servicio-guidance-note p {
  margin: 0;
  font-size: 13.5px;
  color: #516a85;
  line-height: 1.5;
}

.servicio-detail-actions {
  display: flex;
  align-items: center;
}

.servicio-whatsapp-cta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: #002650;
  color: #ffffff;
  text-decoration: none;
  padding: 14px 28px;
  border-radius: 999px;
  font-weight: 700;
  font-size: 15px;
  box-shadow: 0 6px 20px rgba(0, 38, 80, 0.2);
  transition: transform 0.25s ease, background 0.2s ease, box-shadow 0.2s ease;
  align-self: flex-start;
}

.servicio-whatsapp-cta:hover {
  background: #FF5A00;
  box-shadow: 0 10px 28px rgba(255, 90, 0, 0.35);
  transform: translateY(-2px);
}

.servicio-whatsapp-cta:active {
  transform: translateY(0);
}

/* 4. Bloque final de orientación "¿No sabes qué servicio necesitas?" */
.servicios-help-card {
  background: linear-gradient(135deg, #002650 0%, #093b70 100%);
  border-radius: 32px;
  padding: clamp(38px, 5.5vw, 64px) clamp(24px, 4vw, 48px);
  color: #ffffff;
  text-align: center;
  box-shadow: 0 20px 50px rgba(0, 38, 80, 0.25);
  margin-top: clamp(40px, 6vw, 70px);
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.12);
}

.servicios-help-badge {
  display: inline-block;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.12em;
  color: #ffaa88;
  text-transform: uppercase;
  margin-bottom: 14px;
}

.servicios-help-title {
  font-size: clamp(24px, 3.2vw, 38px);
  font-weight: 800;
  color: #ffffff;
  margin: 0 0 14px;
  line-height: 1.2;
}

.servicios-help-desc {
  font-size: clamp(15.5px, 1.25vw, 18px);
  color: #d8e8fc;
  max-width: 680px;
  margin: 0 auto 28px;
  line-height: 1.6;
}

.servicios-help-action {
  display: flex;
  justify-content: center;
}

.servicios-help-wa-btn {
  background: #25d366;
  color: #ffffff;
  padding: 16px 36px;
  border-radius: 999px;
  font-weight: 800;
  font-size: clamp(15px, 1.1vw, 17px);
  box-shadow: 0 10px 30px rgba(37, 211, 102, 0.38);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.28s ease, background 0.2s ease;
}

.servicios-help-wa-btn:hover {
  transform: translateY(-3px) scale(1.03);
  box-shadow: 0 16px 40px rgba(37, 211, 102, 0.48);
  background: #20ba59;
}

.servicios-help-wa-btn:active {
  transform: translateY(0) scale(0.98);
}

/* ==========================================================================
   SUBPÁGINA MODAL DE SERVICIOS
   ========================================================================== */
.servicios-subpage-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1000;
  overflow-y: auto;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  padding: clamp(12px, 3vw, 40px) clamp(10px, 2.5vw, 24px);
  box-sizing: border-box;
}

.servicios-subpage-backdrop[hidden] {
  display: none !important;
}

.servicios-subpage-overlay-bg {
  position: fixed;
  inset: 0;
  background: rgba(0, 24, 52, 0.68);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  animation: eval-fade-in 0.3s ease;
}

.servicios-subpage-sheet {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 1100px;
  background: #fffcf8;
  border-radius: 36px;
  box-shadow: 0 28px 70px rgba(0, 24, 52, 0.4), 0 0 0 1px rgba(254, 222, 201, 0.7);
  overflow: hidden;
  animation: eval-sheet-up 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  margin: 0 auto;
  border: 1.5px solid #fedec9;
}

.servicios-subpage-header {
  position: sticky;
  top: 0;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 32px;
  background: rgba(255, 252, 248, 0.94);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid #fce8db;
}

.servicios-back-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  border: 0;
  background: #fff0e4;
  color: #FF5A00;
  font-weight: 700;
  font-size: 14.5px;
  padding: 10px 20px;
  border-radius: 100px;
  cursor: pointer;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}

.servicios-back-arrow {
  width: 18px;
  height: 18px;
  transition: transform 0.25s;
}

.servicios-back-btn:hover {
  background: #FF5A00;
  color: #ffffff;
  transform: translateX(-4px);
  box-shadow: 0 6px 18px rgba(255, 90, 0, 0.25);
}

.servicios-back-btn:hover .servicios-back-arrow {
  transform: translateX(-3px);
}

.servicios-subpage-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.8px;
  color: var(--navy);
  padding: 6px 16px;
  border-radius: 100px;
  background: #ffffff;
  border: 1.5px solid #fedec9;
  text-transform: uppercase;
}

.servicios-close-x {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: 0;
  background: #f1ede8;
  color: var(--navy);
  cursor: pointer;
  transition: transform 0.25s ease, background 0.25s, color 0.25s;
}

.servicios-close-x svg {
  width: 20px;
  height: 20px;
}

.servicios-close-x:hover {
  background: #FF5A00;
  color: #ffffff;
  transform: rotate(90deg);
}

.servicios-subpage-content {
  padding: clamp(24px, 4vw, 52px);
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.servicios-tabs-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  overflow-x: auto;
  padding: 4px 2px 8px;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}

.servicios-tabs-bar::-webkit-scrollbar {
  display: none;
}

.servicio-tab-pill {
  flex: 0 0 auto;
  border: 1.5px solid #fedec9;
  background: #ffffff;
  color: #002650;
  font-size: 13.5px;
  font-weight: 700;
  padding: 9px 18px;
  border-radius: 999px;
  cursor: pointer;
  font-family: inherit;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
  white-space: nowrap;
}

.servicio-tab-pill:hover {
  background: #fff0e4;
  border-color: #FF5A00;
  color: #FF5A00;
  transform: translateY(-1px);
}

.servicio-tab-pill.is-active {
  background: #FF5A00;
  border-color: #FF5A00;
  color: #ffffff;
  box-shadow: 0 4px 14px rgba(255, 90, 0, 0.28);
}

.servicio-subpage-panel[hidden] {
  display: none !important;
}

.servicio-subpage-panel.is-active-panel {
  display: block;
  animation: eval-sheet-up 0.35s cubic-bezier(0.16, 1, 0.3, 1) both;
}

/* =========================================================================
   SECCIÓN ANIMADA DE FILOSOFÍA Y LOGROS: CRADLE SECTION (GSAP SCROLL)
   ========================================================================= */
.cradle-section {
  position: relative;
  width: 100%;
  min-height: 100svh;
  height: 100svh;
  overflow: hidden;
  background: radial-gradient(circle at 50% 22%, #082449 0%, #001733 60%, #000c1c 100%);
  color: #ffffff;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  isolation: isolate;
}

.cradle-bg-atmosphere {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
  z-index: 1;
}

.cradle-ambient-glow {
  position: absolute;
  border-radius: 50%;
  filter: blur(80px);
  opacity: 0.35;
  pointer-events: none;
}

.cradle-ambient-glow.glow-1 {
  width: 480px;
  height: 480px;
  background: radial-gradient(circle, #FF5A00 0%, transparent 70%);
  top: -120px;
  left: 50%;
  transform: translateX(-50%);
}

.cradle-ambient-glow.glow-2 {
  width: 550px;
  height: 550px;
  background: radial-gradient(circle, #1e3f84 0%, transparent 70%);
  bottom: -150px;
  left: 50%;
  transform: translateX(-50%);
}

.cradle-viewport {
  position: relative;
  width: 100%;
  max-width: 1280px;
  height: 100%;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  padding: clamp(20px, 3.5vh, 44px) clamp(16px, 3vw, 40px);
  box-sizing: border-box;
  z-index: 2;
}

/* 1. ENCABEZADO Y FRASE */
.cradle-header {
  text-align: center;
  width: 100%;
  max-width: 980px;
  margin-top: clamp(6px, 1.2vh, 18px);
  z-index: 5;
  will-change: transform, opacity;
}

.cradle-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 5px 16px;
  border-radius: 100px;
  border: 1.5px solid rgba(255, 120, 69, 0.45);
  background: rgba(255, 120, 69, 0.1);
  color: #ff9d76;
  font-family: var(--sans);
  font-size: clamp(11px, 0.9vw, 13px);
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-bottom: clamp(8px, 1.4vh, 16px);
}

.cradle-eyebrow-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #FF5A00;
  box-shadow: 0 0 8px #FF5A00;
}

.cradle-phrase {
  margin: 0;
  color: #ffffff;
  font-size: clamp(34px, 5.2vw, 68px);
  line-height: 1.15;
  letter-spacing: -0.025em;
  text-wrap: balance;
}

.cradle-phrase-part {
  display: inline;
}

.cradle-phrase-part.part-1 {
  font-family: var(--serif);
  font-style: italic;
  font-weight: 700;
  margin-right: 0.22em;
  color: #ffffff;
}

.cradle-phrase-part.part-2 {
  font-family: var(--sans);
  font-weight: 800;
  margin-right: 0.25em;
  color: #e2edf8;
}

.cradle-phrase-part.part-3 {
  display: inline-block;
}

.cradle-highlight {
  font-family: var(--serif);
  font-style: italic;
  font-weight: 800;
  background: linear-gradient(90deg, #FF5A00 0%, #ff8033 85%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  filter: drop-shadow(0 2px 14px rgba(255, 90, 0, 0.35));
  letter-spacing: -0.01em;
}

/* 2 & 3. SVG CON LÍNEAS PUNTEADAS DINÁMICAS */
.cradle-svg-stage {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 2;
  animation: cradle-svg-sway 9s ease-in-out infinite alternate;
}

@keyframes cradle-svg-sway {
  0% { transform: translateY(0px) rotate(0deg); }
  50% { transform: translateY(-6px) rotate(0.35deg); }
  100% { transform: translateY(0px) rotate(0deg); }
}

.cradle-svg {
  width: 100%;
  height: 100%;
  display: block;
}

.cradle-svg-mobile {
  display: none;
}

/* Movimiento continuo de las líneas punteadas (flujo orgánico) */
#cradle-line-left,
#cradle-line-left-m {
  animation: cradle-dash-flow-left 14s linear infinite, cradle-glow-pulse 4s ease-in-out infinite alternate;
}

#cradle-line-right,
#cradle-line-right-m {
  animation: cradle-dash-flow-right 14s linear infinite, cradle-glow-pulse 4s ease-in-out infinite alternate;
}

#cradle-line-stem,
#cradle-line-stem-m {
  animation: cradle-dash-flow-stem 10s linear infinite, cradle-glow-pulse 3s ease-in-out infinite alternate;
}

#cradle-line-bowl,
#cradle-line-bowl-m {
  animation: cradle-dash-flow-bowl 22s linear infinite, cradle-glow-pulse 5s ease-in-out infinite alternate;
}

#cradle-junction,
#cradle-junction-m {
  animation: cradle-junction-pulse 3s ease-in-out infinite alternate;
}

@keyframes cradle-dash-flow-left {
  from { stroke-dashoffset: 0; }
  to { stroke-dashoffset: -64; }
}

@keyframes cradle-dash-flow-right {
  from { stroke-dashoffset: 0; }
  to { stroke-dashoffset: 64; }
}

@keyframes cradle-dash-flow-stem {
  from { stroke-dashoffset: 0; }
  to { stroke-dashoffset: -64; }
}

@keyframes cradle-dash-flow-bowl {
  from { stroke-dashoffset: 0; }
  to { stroke-dashoffset: -128; }
}

@keyframes cradle-glow-pulse {
  0%, 100% {
    filter: drop-shadow(0 0 2px rgba(255, 120, 69, 0.4));
  }
  50% {
    filter: drop-shadow(0 0 8px rgba(255, 120, 69, 0.85));
  }
}

@keyframes cradle-junction-pulse {
  0%, 100% {
    filter: drop-shadow(0 0 3px #FF5A00);
  }
  50% {
    filter: drop-shadow(0 0 10px #FF5A00);
  }
}

/* 4. CONTENEDOR DE PELOTAS */
.cradle-balls-stage {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 4;
}

.cradle-ball {
  position: absolute;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  box-sizing: border-box;
  will-change: transform, opacity;
  cursor: default;
  user-select: none;
}

.cradle-ball .ball-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  border-radius: 50%;
}

.cradle-ball .ball-title {
  font-family: var(--sans);
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: -0.02em;
  display: block;
  margin-bottom: 4px;
}

.cradle-ball .ball-subtitle {
  font-family: var(--sans);
  font-weight: 500;
  line-height: 1.3;
  display: block;
}

/* Pelota 1: +20 años · de experiencia */
.cradle-ball.ball-1 {
  width: clamp(140px, 15vw, 175px);
  height: clamp(140px, 15vw, 175px);
  left: 7%;
  top: 57%;
  z-index: 2;
  background: linear-gradient(145deg, #1b3a63 0%, #102746 100%);
  border: 1.5px solid rgba(255, 255, 255, 0.25);
  box-shadow: 0 16px 36px rgba(0, 15, 35, 0.45);
  color: #ffffff;
}
.cradle-ball.ball-1 .ball-inner {
  padding: 16px;
}
.cradle-ball.ball-1 .ball-title {
  font-size: clamp(17px, 1.8vw, 24px);
  color: #ffffff;
}
.cradle-ball.ball-1 .ball-subtitle {
  font-size: clamp(11px, 1.05vw, 13.5px);
  color: #c9dbed;
}

/* Pelota 2: +800 pacientes · satisfechos */
.cradle-ball.ball-2 {
  width: clamp(150px, 16vw, 185px);
  height: clamp(150px, 16vw, 185px);
  left: 19%;
  top: 36%;
  z-index: 1;
  background: linear-gradient(145deg, #0e2440 0%, #07172b 100%);
  border: 1.5px solid rgba(255, 120, 69, 0.35);
  box-shadow: 0 18px 40px rgba(0, 10, 25, 0.55);
  color: #ffffff;
}
.cradle-ball.ball-2 .ball-inner {
  padding: 18px 16px;
}
.cradle-ball.ball-2 .ball-title {
  font-size: clamp(18px, 1.9vw, 24px);
  color: #ffffff;
}
.cradle-ball.ball-2 .ball-subtitle {
  font-size: clamp(11.5px, 1.05vw, 14px);
  color: #cad8e8;
}

/* Pelota 3: Personas y familias · Niños, jóvenes y adultos */
.cradle-ball.ball-3 {
  width: clamp(195px, 21.5vw, 245px);
  height: clamp(195px, 21.5vw, 245px);
  left: 31%;
  top: 53%;
  z-index: 3;
  background: #fff8f0;
  border: 2px solid rgba(255, 255, 255, 0.85);
  box-shadow: 0 24px 55px rgba(0, 0, 0, 0.45);
  color: #002650;
}
.cradle-ball.ball-3 .ball-inner {
  padding: 24px 18px;
}
.cradle-ball.ball-3 .ball-title {
  font-size: clamp(19px, 2.1vw, 26px);
  color: #002650;
}
.cradle-ball.ball-3 .ball-subtitle {
  font-size: clamp(11.5px, 1.1vw, 14px);
  color: #27456c;
}

/* Pelota 4: Talleres · Técnicas de estudio e inteligencia emocional */
.cradle-ball.ball-4 {
  width: clamp(158px, 17vw, 195px);
  height: clamp(158px, 17vw, 195px);
  left: 50%;
  top: 33%;
  z-index: 2;
  background: #ffffff;
  border: 1.5px solid rgba(255, 120, 69, 0.35);
  box-shadow: 0 20px 48px rgba(0, 0, 0, 0.35);
  color: #002650;
}
.cradle-ball.ball-4 .ball-inner {
  padding: 20px 14px;
}
.cradle-ball.ball-4 .ball-title {
  font-size: clamp(20px, 2.2vw, 28px);
  color: #002650;
}
.cradle-ball.ball-4 .ball-subtitle {
  font-size: clamp(11px, 1vw, 13px);
  color: #2e4a70;
}

/* Pelota 5: En un mismo centro · Evaluación, orientación e intervención */
.cradle-ball.ball-5 {
  width: clamp(190px, 21vw, 240px);
  height: clamp(190px, 21vw, 240px);
  left: 65%;
  top: 51%;
  z-index: 3;
  background: linear-gradient(145deg, #e4ecf6 0%, #ccd8e6 100%);
  border: 1.5px solid rgba(255, 255, 255, 0.6);
  box-shadow: 0 22px 50px rgba(0, 0, 0, 0.38);
  color: #002650;
}
.cradle-ball.ball-5 .ball-inner {
  padding: 22px 16px;
}
.cradle-ball.ball-5 .ball-title {
  font-size: clamp(18px, 2vw, 25px);
  color: #002650;
}
.cradle-ball.ball-5 .ball-subtitle {
  font-size: clamp(11.5px, 1.05vw, 13.5px);
  color: #223f66;
}

/* ADAPTACIÓN MÓVIL (PANTALLAS < 1024px) */
@media (max-width: 1023px) {
  .cradle-svg-desktop {
    display: none;
  }
  .cradle-svg-mobile {
    display: block;
  }

  .cradle-viewport {
    padding: 24px 16px 20px;
  }

  .cradle-phrase {
    font-size: clamp(26px, 7vw, 38px);
    line-height: 1.2;
  }

  .cradle-phrase-part.part-1,
  .cradle-phrase-part.part-2 {
    display: inline;
  }

  .cradle-ball.ball-1 {
    width: clamp(96px, 26vw, 120px);
    height: clamp(96px, 26vw, 120px);
    left: 4%;
    top: 64%;
    z-index: 2;
  }
  .cradle-ball.ball-1 .ball-inner { padding: 10px; }
  .cradle-ball.ball-1 .ball-title { font-size: 13px; margin-bottom: 2px; }
  .cradle-ball.ball-1 .ball-subtitle { font-size: 9.5px; }

  .cradle-ball.ball-2 {
    width: clamp(102px, 27vw, 126px);
    height: clamp(102px, 27vw, 126px);
    left: 12%;
    top: 45%;
    z-index: 1;
  }
  .cradle-ball.ball-2 .ball-inner { padding: 10px; }
  .cradle-ball.ball-2 .ball-title { font-size: 13.5px; margin-bottom: 2px; }
  .cradle-ball.ball-2 .ball-subtitle { font-size: 9.5px; }

  .cradle-ball.ball-3 {
    width: clamp(132px, 36vw, 160px);
    height: clamp(132px, 36vw, 160px);
    left: 27%;
    top: 61%;
    z-index: 3;
  }
  .cradle-ball.ball-3 .ball-inner { padding: 12px; }
  .cradle-ball.ball-3 .ball-title { font-size: 14.5px; margin-bottom: 2px; }
  .cradle-ball.ball-3 .ball-subtitle { font-size: 10px; }

  .cradle-ball.ball-4 {
    width: clamp(112px, 30vw, 134px);
    height: clamp(112px, 30vw, 134px);
    left: 48%;
    top: 42%;
    z-index: 2;
  }
  .cradle-ball.ball-4 .ball-inner { padding: 10px; }
  .cradle-ball.ball-4 .ball-title { font-size: 15px; margin-bottom: 2px; }
  .cradle-ball.ball-4 .ball-subtitle { font-size: 9px; }

  .cradle-ball.ball-5 {
    width: clamp(132px, 35vw, 158px);
    height: clamp(132px, 35vw, 158px);
    left: 58%;
    top: 59%;
    z-index: 4;
  }
  .cradle-ball.ball-5 .ball-inner { padding: 12px; }
  .cradle-ball.ball-5 .ball-title { font-size: 14px; margin-bottom: 2px; }
  .cradle-ball.ball-5 .ball-subtitle { font-size: 9.5px; }
}

/* =========================================================================
   SECCIÓN «NOSOTROS» (ESTILO EDITORIAL CINEMÁTICO - SIN RECUADROS)
   ========================================================================= */
.nosotros-section {
  position: relative;
  width: 100%;
  padding: clamp(72px, 11vh, 130px) 24px clamp(80px, 12vh, 140px);
  background: radial-gradient(circle at 50% 30%, #0d1e38 0%, #061324 60%, #020812 100%);
  color: #ffffff;
  box-sizing: border-box;
  overflow: hidden;
  isolation: isolate;
}

.nosotros-atmosphere {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
  z-index: 1;
}

.nosotros-ambient-glow {
  position: absolute;
  top: 35%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: clamp(500px, 75vw, 1000px);
  height: clamp(350px, 50vw, 650px);
  background: radial-gradient(ellipse at center, rgba(30, 65, 110, 0.45) 0%, rgba(10, 30, 60, 0.15) 55%, transparent 75%);
  filter: blur(65px);
  pointer-events: none;
}

.nosotros-ambient-glow.glow-coral {
  top: 65%;
  left: 50%;
  width: clamp(380px, 55vw, 750px);
  height: clamp(240px, 35vw, 450px);
  background: radial-gradient(ellipse at center, rgba(234, 88, 58, 0.16) 0%, transparent 70%);
  filter: blur(75px);
}

.nosotros-dashed-deco {
  position: absolute;
  top: 14%;
  left: 50%;
  transform: translateX(-50%);
  width: clamp(550px, 85vw, 1150px);
  height: 240px;
  pointer-events: none;
}

.nosotros-stage-wrapper {
  position: relative;
  max-width: 1240px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  z-index: 2;
  box-sizing: border-box;
}

/* 1. TÍTULO GIGANTE DE FONDO (COMO "Team of Experts") */
.nosotros-backdrop-heading {
  text-align: center;
  margin-bottom: clamp(16px, 2.5vw, 32px);
  will-change: transform, opacity;
}

.nosotros-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 18px;
  border-radius: 100px;
  border: 1px solid rgba(255, 120, 69, 0.35);
  background: rgba(255, 120, 69, 0.08);
  color: #ff8c5d;
  font-family: var(--sans);
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  margin-bottom: 20px;
}

.nosotros-eyebrow-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #FF5A00;
  box-shadow: 0 0 8px #FF5A00;
}

.nosotros-hero-title {
  font-family: var(--serif);
  font-size: clamp(48px, 8.2vw, 108px);
  line-height: 1.02;
  letter-spacing: -0.03em;
  color: #ffffff;
  margin: 0;
  text-shadow: 0 6px 36px rgba(0, 0, 0, 0.65);
}

.nosotros-hero-title .title-word.serif {
  display: block;
  font-weight: 700;
  color: #ffffff;
}

.nosotros-hero-title .title-word.script {
  display: block;
  font-family: var(--serif);
  font-style: italic;
  font-weight: 400;
  color: #f7ede2;
  opacity: 0.95;
}

/* 2. COMPOSICIÓN EDITORIAL: FOTO RECORTADA Y TEXTOS FLOTANTES */
.nosotros-showcase {
  position: relative;
  width: 100%;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  justify-items: center;
  gap: clamp(20px, 3.5vw, 60px);
  margin-top: clamp(-20px, -2vw, -10px);
  margin-bottom: clamp(36px, 5vh, 64px);
  will-change: transform, opacity;
}

/* IMAGEN CENTRAL RECORTADA (TRANSPARENTE, SIN FONDO NI RECUADRO) */
.nosotros-cutout-container {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: flex-end;
  z-index: 2;
  max-width: 580px;
  width: 100%;
}

.nosotros-cutout-img {
  width: 100%;
  height: auto;
  max-height: clamp(420px, 56vh, 660px);
  object-fit: contain;
  display: block;
  filter: drop-shadow(0 20px 40px rgba(0, 0, 0, 0.75));
  transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1), filter 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

.nosotros-cutout-container:hover .nosotros-cutout-img {
  transform: translateY(-4px) scale(1.015);
  filter: drop-shadow(0 28px 50px rgba(0, 0, 0, 0.85));
}

/* LETRAS PEQUEÑAS FLOTANTES SIN RECUADRO */
.nosotros-floating-bio {
  max-width: 320px;
  z-index: 3;
  padding: 12px 0;
  background: transparent;
  border: none;
  box-shadow: none;
}

.nosotros-floating-bio.bio-left {
  text-align: right;
  justify-self: end;
}

.nosotros-floating-bio.bio-right {
  text-align: left;
  justify-self: start;
}

.floating-name {
  font-family: var(--sans);
  font-size: clamp(20px, 2.1vw, 26px);
  font-weight: 800;
  color: #ffffff;
  margin: 0 0 4px;
  letter-spacing: -0.015em;
  text-shadow: 0 2px 14px rgba(0, 0, 0, 0.6);
}

.floating-role {
  display: block;
  font-family: var(--sans);
  font-size: 12.5px;
  font-weight: 700;
  color: #ff9166;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin-bottom: 12px;
}

.floating-desc {
  font-family: var(--sans);
  font-size: clamp(13.5px, 1.25vw, 15px);
  line-height: 1.6;
  color: #c5d7ea;
  margin: 0;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
}

/* 3. BLOQUE INFERIOR CON FRASE DE CIERRE Y BOTÓN */
.nosotros-footer-block {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 22px;
  z-index: 3;
  will-change: transform, opacity;
}

.nosotros-closing-quote {
  font-family: var(--sans);
  font-size: clamp(16px, 1.8vw, 20px);
  color: #d1e2f5;
  margin: 0;
  letter-spacing: -0.01em;
}

.nosotros-closing-quote em {
  font-family: var(--serif);
  font-style: italic;
  font-weight: 600;
  color: #ff9166;
  margin-left: 4px;
}

.nosotros-pill-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  background: #ffffff;
  color: #002650;
  padding: 14px 34px;
  border-radius: 999px;
  font-family: var(--sans);
  font-weight: 700;
  font-size: 15.5px;
  text-decoration: none;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
  transition: all 0.28s cubic-bezier(0.16, 1, 0.3, 1);
}

.nosotros-pill-btn:hover {
  background: #FF5A00;
  color: #ffffff;
  transform: translateY(-3px);
  box-shadow: 0 14px 36px rgba(255, 90, 0, 0.4);
}

.nosotros-pill-btn:focus-visible {
  outline: 3px solid #FF5A00;
  outline-offset: 3px;
}

.nosotros-pill-btn .btn-arrow {
  transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1);
}

.nosotros-pill-btn:hover .btn-arrow,
.nosotros-pill-btn:focus-visible .btn-arrow {
  transform: translate(3px, -3px);
}

/* ADAPTACIÓN MÓVIL (< 1024px) */
@media (max-width: 1023px) {
  .nosotros-showcase {
    grid-template-columns: 1fr;
    gap: 32px;
    margin-top: 10px;
  }

  .nosotros-cutout-container {
    order: 1;
    max-width: 440px;
  }

  .nosotros-floating-bio.bio-left {
    order: 2;
    text-align: center;
    justify-self: center;
    max-width: 480px;
  }

  .nosotros-floating-bio.bio-right {
    order: 3;
    text-align: center;
    justify-self: center;
    max-width: 480px;
  }
}

@media (max-width: 768px) {
  .nosotros-section {
    padding: 60px 20px 72px;
  }

  .nosotros-hero-title {
    font-size: clamp(36px, 9vw, 54px);
  }

  .nosotros-cutout-container {
    max-width: 340px;
  }

  .floating-name {
    font-size: 21px;
  }

  .floating-desc {
    font-size: 14px;
  }
}

/* =========================================================================
   PIE DE PÁGINA (SITE FOOTER CON COLORES CLAROS Y CONTRASTE)
   ========================================================================= */
.site-footer {
  position: relative;
  width: 100%;
  box-sizing: border-box;
  overflow: hidden;
  isolation: isolate;
  background: linear-gradient(180deg, #fffcf8 0%, #fbf6ee 45%, #f4eee2 100%);
  color: #002650;
  padding: clamp(64px, 9vh, 96px) 24px clamp(32px, 5vh, 48px);
  border-top: 1.5px solid rgba(254, 222, 201, 0.85);
  box-shadow: 0 -12px 40px rgba(0, 0, 0, 0.04);
}

.footer-top-accent {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: min(800px, 80%);
  height: 2px;
  background: linear-gradient(90deg, transparent, #FF5A00, #ff8033, transparent);
  opacity: 0.8;
  pointer-events: none;
}

.footer-container {
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
  width: 100%;
  box-sizing: border-box;
}

.footer-grid {
  display: grid;
  grid-template-columns: 1.3fr 1fr 1.15fr 1.25fr;
  gap: clamp(32px, 4vw, 56px);
  align-items: start;
  margin-bottom: clamp(48px, 6vh, 64px);
}

/* COLUMNA 1: MARCA */
.footer-col-brand {
  display: flex;
  flex-direction: column;
}

.footer-brand {
  display: inline-block;
  margin-bottom: 18px;
  transition: opacity 0.2s ease;
}

.footer-brand:hover {
  opacity: 0.9;
}

.footer-logo {
  width: 145px;
  height: auto;
  max-height: 70px;
  object-fit: contain;
  display: block;
}

.footer-tagline {
  font-family: var(--sans);
  font-size: 14px;
  line-height: 1.6;
  color: #2c4a70;
  margin: 0 0 20px;
  max-width: 320px;
}

.footer-motto {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--sans);
  font-size: 13px;
  color: #FF5A00;
  font-weight: 600;
  background: rgba(254, 222, 201, 0.35);
  padding: 6px 14px;
  border-radius: 999px;
  border: 1px solid rgba(255, 90, 0, 0.2);
  width: fit-content;
}

.footer-motto-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #FF5A00;
}

/* COLUMNA 2: SERVICIOS Y ENLACES */
.footer-col-title {
  font-family: var(--sans);
  font-size: 13.5px;
  font-weight: 800;
  color: #002650;
  margin: 0 0 20px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.footer-links-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.footer-link {
  background: none;
  border: none;
  padding: 0;
  font-family: var(--sans);
  font-size: 14px;
  color: #325178;
  text-align: left;
  cursor: pointer;
  text-decoration: none;
  transition: color 0.2s ease, transform 0.2s ease;
  display: inline-block;
  line-height: 1.4;
}

.footer-link:hover {
  color: #FF5A00;
  transform: translateX(3px);
}

.footer-link:focus-visible {
  outline: 2px solid #FF5A00;
  outline-offset: 2px;
  border-radius: 2px;
}

/* COLUMNA 3: UBICACIÓN Y HORARIOS */
.footer-info-item {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  margin-bottom: 20px;
}

.footer-info-icon {
  width: 38px;
  height: 38px;
  border-radius: 12px;
  background: #ffffff;
  border: 1.5px solid #fedec9;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #FF5A00;
  flex-shrink: 0;
  box-shadow: 0 2px 8px rgba(255, 90, 0, 0.08);
}

.footer-info-text {
  display: flex;
  flex-direction: column;
}

.footer-info-strong {
  font-family: var(--sans);
  font-size: 14.5px;
  font-weight: 700;
  color: #002650;
  margin-bottom: 2px;
}

.footer-info-sub {
  font-family: var(--sans);
  font-size: 13px;
  color: #405e85;
  line-height: 1.45;
}

/* COLUMNA 4: CONTACTO DIRECTO & BOTÓN DE WHATSAPP */
.footer-contact-intro {
  font-family: var(--sans);
  font-size: 13.5px;
  line-height: 1.5;
  color: #325178;
  margin: 0 0 16px;
}

.footer-wa-card {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 13px 18px;
  border-radius: 16px;
  background: #ffffff;
  border: 1.5px solid #25D366;
  text-decoration: none;
  box-shadow: 0 4px 18px rgba(37, 211, 102, 0.15);
  transition: all 0.28s cubic-bezier(0.16, 1, 0.3, 1);
  margin-bottom: 12px;
}

.footer-wa-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(37, 211, 102, 0.25);
  border-color: #20BA5A;
}

.footer-wa-card:focus-visible {
  outline: 3px solid #25D366;
  outline-offset: 3px;
}

.footer-wa-icon-wrap {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: #25D366;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.footer-wa-svg {
  width: 22px;
  height: 22px;
  fill: #ffffff;
}

.footer-wa-content {
  display: flex;
  flex-direction: column;
  flex: 1;
}

.footer-wa-badge {
  font-family: var(--sans);
  font-size: 10.5px;
  font-weight: 700;
  color: #128C7E;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.footer-wa-num {
  font-family: var(--sans);
  font-size: 15.5px;
  font-weight: 800;
  color: #002650;
  letter-spacing: -0.01em;
}

.footer-wa-callout {
  font-size: 18px;
  color: #25D366;
  font-weight: 700;
  transition: transform 0.25s ease;
}

.footer-wa-card:hover .footer-wa-callout {
  transform: translate(3px, -3px);
}

.footer-contact-dialog-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: transparent;
  border: 1.5px solid rgba(0, 38, 80, 0.16);
  padding: 9px 18px;
  border-radius: 999px;
  font-family: var(--sans);
  font-size: 13px;
  font-weight: 600;
  color: #002650;
  cursor: pointer;
  transition: all 0.2s ease;
}

.footer-contact-dialog-btn:hover {
  background: #ffffff;
  border-color: #FF5A00;
  color: #FF5A00;
  box-shadow: 0 4px 12px rgba(255, 90, 0, 0.1);
}

.footer-contact-dialog-btn:focus-visible {
  outline: 2px solid #FF5A00;
  outline-offset: 2px;
}

/* BARRA INFERIOR / COPYRIGHT */
.footer-bottom {
  padding-top: 26px;
  border-top: 1px solid rgba(0, 38, 80, 0.1);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  font-family: var(--sans);
  font-size: 13px;
  color: #526f94;
}

.footer-bottom-copy p {
  margin: 0;
}

.footer-signature-brand {
  color: #FF5A00;
  font-family: var(--serif);
  font-style: italic;
  font-weight: 700;
}

.footer-back-to-top {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #002650;
  text-decoration: none;
  font-weight: 600;
  padding: 6px 14px;
  border-radius: 100px;
  background: #ffffff;
  border: 1px solid rgba(0, 38, 80, 0.12);
  transition: all 0.2s ease;
}

.footer-back-to-top:hover {
  border-color: #FF5A00;
  color: #FF5A00;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 38, 80, 0.08);
}

.footer-back-to-top:focus-visible {
  outline: 2px solid #FF5A00;
  outline-offset: 2px;
}

/* ADAPTACIÓN MÓVIL Y TABLET */
@media (max-width: 1023px) {
  .footer-grid {
    grid-template-columns: 1fr 1fr;
    gap: 40px;
  }
}

@media (max-width: 640px) {
  .site-footer {
    padding: 52px 20px 36px;
  }

  .footer-grid {
    grid-template-columns: 1fr;
    gap: 36px;
    margin-bottom: 40px;
  }

  .footer-bottom {
    flex-direction: column;
    text-align: center;
    gap: 16px;
  }
}

@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.atmosphere{transform:none!important}.slide img,.slide.is-active img{transform:none}}

/* =========================================================================
   ESTILOS DE TRASTORNOS (SEO), BOTONES DE REGRESO Y TERAPIA OCUPACIONAL
   ========================================================================= */
.tag-ocupacional {
  background: #0284c7 !important;
  color: #ffffff !important;
}

.hero-disorders-tags {
  position: absolute;
  top: 73.5%;
  left: 7.05%;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  max-width: 42vw;
  z-index: 3;
  will-change: transform, opacity;
}

.hero.hero-transition-ready .hero-disorders-tags {
  animation: none !important;
}

.disorder-pill {
  display: inline-flex;
  align-items: center;
  padding: 4px 12px;
  border-radius: 100px;
  background: rgba(255, 255, 255, 0.88);
  border: 1px solid rgba(255, 120, 69, 0.35);
  color: var(--navy);
  font-size: clamp(11px, 0.78vw, 13px);
  font-weight: 600;
  letter-spacing: -0.01em;
  box-shadow: 0 2px 8px rgba(0, 38, 80, 0.04);
}

@media (max-width: 1023px) {
  .hero-disorders-tags {
    position: static;
    margin-top: 14px;
    max-width: 100%;
    gap: 6px;
  }
}

.subpage-disorders-section {
  margin: 28px 0 24px;
  padding: 22px 24px;
  background: linear-gradient(135deg, #fffaf5 0%, #fff4ec 100%);
  border: 1.5px solid #ffd4bc;
  border-radius: 20px;
}

.subpage-disorders-heading {
  margin: 0 0 14px;
  font-size: 16px;
  font-weight: 700;
  color: var(--navy);
  letter-spacing: -0.02em;
}

.subpage-disorders-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 12px;
}

.disorder-card {
  background: #ffffff;
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid #ffe2d1;
  box-shadow: 0 2px 8px rgba(0, 38, 80, 0.03);
}

.disorder-card strong {
  display: block;
  color: #FF5A00;
  font-size: 13.5px;
  font-weight: 800;
  margin-bottom: 4px;
}

.disorder-card p {
  margin: 0;
  font-size: 12.5px;
  line-height: 1.45;
  color: #435b75;
}

/* BOTÓN DE REGRESAR / CERRAR AL FINAL DE CADA APARTADO */
.subpage-bottom-actions {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 36px 0 18px;
  margin-top: 20px;
  border-top: 1px dashed rgba(0, 38, 80, 0.16);
}

.subpage-return-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 13px 30px;
  background: var(--navy);
  color: #ffffff !important;
  border: none;
  border-radius: 100px;
  font-family: var(--sans);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.02em;
  box-shadow: 0 6px 20px rgba(0, 38, 80, 0.22);
  transition: transform .2s ease, background .2s ease, box-shadow .2s ease;
  cursor: pointer;
  text-decoration: none;
}

.subpage-return-btn:hover {
  background: #184684;
  transform: translateY(-2px);
  box-shadow: 0 10px 26px rgba(0, 38, 80, 0.32);
}

.subpage-return-btn:active {
  transform: translateY(0);
}

.dialog-actions-row {
  display: flex;
  gap: 12px;
  align-items: center;
  margin-top: 14px;
  flex-wrap: wrap;
}

.dialog-return-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 22px;
  background: #fff0e4;
  color: var(--navy);
  border: 1px solid #ffd4bc;
  border-radius: 12px;
  font-family: var(--sans);
  font-size: 14px;
  font-weight: 700;
  transition: background .2s, transform .2s;
  cursor: pointer;
}

.dialog-return-btn:hover {
  background: #ffd9c2;
  transform: translateY(-2px);
}




/* ==========================================================
   IDEA B · CAJAS ESTILO «FICHA / CARPETA»
   (Evaluaciones, Terapias y Talleres)
   Solo cambia el formato visual. Para volver al diseño
   anterior basta con borrar este bloque completo.
   ========================================================== */
.eval-card-container,
.terapias-card-container,
.talleres-card-container {
  padding-top: 46px;
}

.eval-hero-card,
.terapias-hero-card,
.talleres-hero-card {
  --folder-tab: var(--navy);
  --folder-shadow: #FF5A00;
  --tape: rgba(255, 90, 0, 0.28);
  --tilt: 2.5deg;
  overflow: visible;
  grid-template-columns: 1.12fr 0.88fr;
  align-items: center;
  border: 2px solid var(--navy);
  border-radius: 0 30px 30px 30px;
  background-color: #ffffff;
  background-image: radial-gradient(rgba(0, 38, 80, 0.085) 1.2px, transparent 1.3px);
  background-size: 22px 22px;
  box-shadow: 10px 10px 0 var(--folder-shadow);
}

.terapias-hero-card {
  --folder-tab: #315bc2;
  --folder-shadow: var(--navy);
  --tape: rgba(49, 91, 194, 0.26);
  --tilt: -2.5deg;
}

.talleres-hero-card {
  --folder-tab: #FF5A00;
  --folder-shadow: #315bc2;
  --tape: rgba(0, 38, 80, 0.18);
  --tilt: 2deg;
  background-color: #fffcf8;
}

.eval-hero-card:hover,
.terapias-hero-card:hover,
.talleres-hero-card:hover {
  border-color: var(--navy);
  box-shadow: 14px 14px 0 var(--folder-shadow);
}

.eval-hero-card::after,
.terapias-hero-card::after,
.talleres-hero-card::after,
.eval-media-fade,
.terapias-media-fade,
.talleres-media-fade,
.talleres-dashed-wave,
.talleres-doodle-rays {
  display: none;
}

.eval-card-shine,
.terapias-card-shine,
.talleres-card-shine {
  border-radius: inherit;
}

/* --- Pestaña de la carpeta (antes: etiqueta tipo píldora) --- */
.eval-card-content,
.terapias-card-content,
.talleres-card-content {
  position: static;
  padding: clamp(40px, 4vw, 58px) clamp(28px, 3.6vw, 54px);
}

.eval-eyebrow,
.terapias-eyebrow,
.talleres-eyebrow {
  position: absolute;
  top: -46px;
  left: -2px;
  margin: 0;
  max-width: calc(100% - 40px);
  padding: 13px 26px 20px 20px;
  border: 0;
  border-radius: 18px 18px 0 0;
  background: var(--folder-tab);
  color: #ffffff;
  box-shadow: none;
  letter-spacing: 1.1px;
  z-index: 6;
}

.eval-eyebrow .eyebrow-dot,
.terapias-eyebrow .eyebrow-dot {
  background: #FF5A00;
}

.talleres-eyebrow .eyebrow-dot {
  background: #ffffff;
}

/* --- Subrayado punteado a mano bajo el título en cursiva --- */
.eval-title-italic,
.terapias-title-italic,
.talleres-title-italic {
  position: relative;
  display: inline-block;
  width: fit-content;
  padding-bottom: 10px;
}

.eval-title-italic::after,
.terapias-title-italic::after,
.talleres-title-italic::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: -4px;
  height: 14px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 14' preserveAspectRatio='none'%3E%3Cpath d='M2 9 C 80 1, 160 15, 298 5' fill='none' stroke='%23FF5A00' stroke-width='3' stroke-dasharray='7 6' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center / 100% 100%;
  pointer-events: none;
}

.eval-title {
  margin-bottom: 26px;
}

/* --- Datos como «sellos» punteados --- */
.eval-meta-bar,
.terapias-meta-bar,
.talleres-meta-bar {
  gap: 10px;
  border-top: 0;
  padding-top: 4px;
  margin-top: 0;
}

.eval-meta-divider,
.terapias-meta-divider,
.talleres-meta-divider {
  display: none;
}

.eval-meta-item,
.terapias-meta-item,
.talleres-meta-item {
  padding: 9px 14px;
  border: 1.5px dashed var(--navy);
  border-radius: 10px;
  background: #ffffff;
  color: var(--navy);
  font-weight: 700;
  font-size: 13px;
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.eval-meta-item:nth-of-type(1),
.terapias-meta-item:nth-of-type(1),
.talleres-meta-item:nth-of-type(1) { transform: rotate(-1.5deg); }
.eval-meta-item:nth-of-type(2),
.terapias-meta-item:nth-of-type(2),
.talleres-meta-item:nth-of-type(2) { transform: rotate(1deg); }
.eval-meta-item:nth-of-type(3),
.terapias-meta-item:nth-of-type(3),
.talleres-meta-item:nth-of-type(3) { transform: rotate(-0.6deg); }

.eval-hero-card:hover .eval-meta-item,
.terapias-hero-card:hover .terapias-meta-item,
.talleres-hero-card:hover .talleres-meta-item {
  transform: rotate(0deg);
}

/* --- Foto como polaroid con cinta --- */
.eval-card-media,
.terapias-card-media,
.talleres-card-media {
  position: relative;
  overflow: visible;
  min-height: 0;
  align-self: center;
  justify-self: center;
  width: min(420px, 86%);
  margin: 40px 44px 40px 0;
  padding: 14px 14px 70px;
  background: #ffffff;
  box-shadow: 0 18px 40px rgba(0, 38, 80, 0.16), 0 2px 6px rgba(0, 38, 80, 0.08);
  transform: rotate(var(--tilt));
  transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
  z-index: 3;
}

.eval-card-media::before,
.terapias-card-media::before,
.talleres-card-media::before {
  content: '';
  position: absolute;
  top: -14px;
  left: 50%;
  width: 116px;
  height: 30px;
  margin-left: -58px;
  background: var(--tape);
  transform: rotate(-4deg);
  z-index: 2;
}

.eval-hero-card:hover .eval-card-media,
.terapias-hero-card:hover .terapias-card-media,
.talleres-hero-card:hover .talleres-card-media {
  transform: rotate(0deg) translateY(-4px);
}

.eval-banner-img,
.terapias-banner-img,
.talleres-banner-img {
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  animation: none;
  transform: none;
}

.eval-hero-card:hover .eval-banner-img,
.terapias-hero-card:hover .terapias-banner-img,
.talleres-hero-card:hover .talleres-banner-img {
  transform: none;
}

/* --- Botón «Más» en la franja blanca de la polaroid --- */
.eval-more-btn,
.terapias-more-btn,
.talleres-more-btn {
  right: 14px;
  bottom: 14px;
  padding: 10px 22px 10px 20px;
  font-size: 16px;
  background: #FF5A00;
  box-shadow: 3px 3px 0 var(--navy);
  animation: none;
}

.eval-more-btn:hover,
.terapias-more-btn:hover,
.talleres-more-btn:hover {
  transform: translate(-2px, -2px);
  box-shadow: 5px 5px 0 var(--navy);
}

.eval-more-btn:active,
.terapias-more-btn:active,
.talleres-more-btn:active {
  transform: translate(2px, 2px);
  box-shadow: 1px 1px 0 var(--navy);
}

.eval-more-arrow {
  width: 20px;
  height: 20px;
  animation: none;
}

/* --- Talleres: estrella dibujada junto a la pestaña --- */
.talleres-doodle-star {
  top: -38px;
  left: auto;
  right: 36px;
  width: 30px;
  height: 30px;
}

/* --- Tablet y teléfono --- */
@media (max-width: 900px) {
  .eval-hero-card,
  .terapias-hero-card,
  .talleres-hero-card {
    grid-template-columns: 1fr;
    box-shadow: 7px 7px 0 var(--folder-shadow);
  }
  .eval-hero-card:hover,
  .terapias-hero-card:hover,
  .talleres-hero-card:hover {
    box-shadow: 7px 7px 0 var(--folder-shadow);
  }
  .eval-card-media,
  .terapias-card-media,
  .talleres-card-media {
    order: -1;
    min-height: 0;
    width: min(400px, 84%);
    margin: 36px auto 0;
    padding: 12px 12px 64px;
  }
  .talleres-doodle-star {
    display: block;
  }
}

@media (max-width: 600px) {
  .eval-card-container,
  .terapias-card-container,
  .talleres-card-container {
    padding-top: 40px;
  }
  .eval-hero-card,
  .terapias-hero-card,
  .talleres-hero-card {
    border-radius: 0 24px 24px 24px;
    background-size: 18px 18px;
    margin-right: 7px;
  }
  .eval-eyebrow,
  .terapias-eyebrow,
  .talleres-eyebrow {
    top: -40px;
    padding: 11px 18px 18px 14px;
    font-size: 10.5px;
    letter-spacing: 0.7px;
    max-width: calc(100% - 50px);
  }
  .eval-card-content,
  .terapias-card-content,
  .talleres-card-content {
    padding: 26px 20px 30px;
  }
  .eval-card-media,
  .terapias-card-media,
  .talleres-card-media {
    width: 86%;
    margin-top: 30px;
    padding: 10px 10px 58px;
  }
  .eval-more-btn,
  .terapias-more-btn,
  .talleres-more-btn {
    right: 10px;
    bottom: 11px;
    padding: 8px 18px 8px 16px;
    font-size: 15px;
  }
  .eval-meta-item,
  .terapias-meta-item,
  .talleres-meta-item {
    font-size: 12.5px;
    padding: 8px 12px;
  }
  .talleres-doodle-star {
    top: -34px;
    right: 18px;
    width: 24px;
    height: 24px;
  }
}


/* ==========================================================
   REVISIÓN DE FORMATOS (tablet y teléfono)
   ========================================================== */
@media (max-width: 1023px) {
  /* Las etiquetas de especialidades quedaban ocultas detrás de la foto:
     heredaban «top: 73.5%» del diseño de escritorio. */
  .hero.hero-transition-ready .hero-disorders-tags {
    top: auto;
    left: auto;
    margin: 0 0 16px;
  }
}

@media (max-width: 600px) {
  /* La etiqueta superior se salía por la derecha en teléfonos */
  .hero > .eyebrow {
    white-space: normal;
    border-radius: 16px;
    line-height: 1.3;
    align-items: flex-start;
  }
  .hero > .eyebrow .eyebrow-dot {
    margin-top: 3px;
  }
  .hero-disorders-tags {
    gap: 5px;
  }
  .disorder-pill {
    font-size: 11.5px;
    padding: 4px 10px;
  }
}

/* Servicios: el texto recortado con «…» seguía asomando debajo
   porque la caja crecía (flex-grow). Ahora el recorte es limpio. */
.servicios-card-desc {
  flex-grow: 0;
  -webkit-line-clamp: 3;
  line-clamp: 3;
}

/* Nosotros: la foto de los fundadores no está recortada (tiene la
   pared blanca), así que se veía como un rectángulo pegado sobre el
   azul. Ahora es una foto enmarcada a propósito, con el contorno
   punteado naranja de la marca. */
.nosotros-cutout-container {
  max-width: 440px;
  padding: 0;
}

.nosotros-cutout-container::before {
  content: '';
  position: absolute;
  inset: 0;
  transform: translate(16px, 16px);
  border: 2px dashed rgba(255, 145, 102, 0.75);
  border-radius: 30px;
  pointer-events: none;
  z-index: -1;
  transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

.nosotros-cutout-container:hover::before {
  transform: translate(10px, 10px);
}

.nosotros-cutout-img {
  aspect-ratio: 4 / 4.4;
  max-height: none;
  object-fit: cover;
  object-position: 50% 20%;
  border-radius: 30px;
  filter: none;
  box-shadow: 0 24px 50px rgba(0, 0, 0, 0.45);
}

.nosotros-cutout-container:hover .nosotros-cutout-img {
  filter: none;
}

@media (max-width: 768px) {
  .nosotros-cutout-container {
    max-width: 300px;
    margin-right: 14px;
  }
  .nosotros-cutout-container::before {
    transform: translate(12px, 12px);
    border-radius: 24px;
  }
  .nosotros-cutout-img {
    border-radius: 24px;
  }
}

/* Servicios: en pantallas de poca altura el bloque fijo era más alto
   que la pantalla y el título «Servicios» se recortaba por arriba.
   «safe center» lo alinea arriba cuando no cabe, y en pantallas bajas
   las fotos de las tarjetas se hacen un poco más apaisadas. */
.servicios-sticky-wrap {
  justify-content: safe center;
}

@media (min-width: 769px) and (max-height: 820px) {
  .servicios-sticky-wrap {
    padding-top: 20px;
    padding-bottom: 16px;
  }
  .servicios-card-media {
    aspect-ratio: 16 / 8;
  }
  .servicios-card-body {
    padding: 18px 22px 20px;
  }
}

@media (min-width: 769px) and (max-height: 680px) {
  .servicios-card-media {
    aspect-ratio: 16 / 7;
  }
  .servicios-card-desc {
    -webkit-line-clamp: 2;
    line-clamp: 2;
    margin-bottom: 12px;
  }
}

/* Marco «Más de 20 años de experiencia» (PC): era demasiado grande y
   en algunas pantallas se salía por abajo. Más compacto y algo más alto. */
@media (min-width: 769px) {
  .experience {
    bottom: 4%;
    width: clamp(196px, 15vw, 240px);
    height: clamp(66px, 5.2vw, 80px);
    border-width: 4px;
    padding: 4px clamp(14px, 1.3vw, 22px) 6px clamp(16px, 1.5vw, 24px);
    grid-template-columns: auto 1fr;
    grid-template-rows: auto 1fr;
    column-gap: clamp(8px, 0.8vw, 14px);
    align-items: center;
  }
  .experience-intro {
    font-size: clamp(11px, 0.8vw, 13px);
    margin: 2px 0 -6px;
    padding-left: 4px;
  }
  .experience strong {
    font-size: clamp(36px, 2.9vw, 48px);
    line-height: 1;
    letter-spacing: -0.04em;
    margin-top: -2px;
  }
  .experience-caption {
    font-size: clamp(13px, 1vw, 16px);
    line-height: 1.15;
    letter-spacing: -0.01em;
    margin: -8px 0 0;
  }
}

/* Foto nueva de Rigoberto y Erika (ampliada): centrar las caras en el marco de «Nosotros». */
.nosotros-cutout-img { object-position: 56% 28%; }
/* Fotos nuevas verticales en las cajas de Evaluaciones y Talleres: encuadrar lo importante. */
.eval-banner-img { object-position: 50% 40%; }
.talleres-banner-img { object-position: 50% 30%; }