#wf-home{--wh-logo:url("/marketing-home/693999997cd18de5.png");--wh-wgrande:url("/marketing-home/913f75f888e8e667.png");--wh-wtarjeta:url("/marketing-home/f794b758e2bba4a6.png")} #wf-home .wh-brand__logo{display:block;width:34px;height:34px;flex:none;background:var(--wh-logo) center/contain no-repeat} /* ---------- Ancho completo dentro de Kajabi ---------- Kajabi mete el bloque Custom Code en un contenedor angosto. Esto hace que la página ocupe todo el ancho de la ventana. */ #wf-home{ width:100vw!important;max-width:100vw!important; position:relative;left:50%;right:50%; margin-left:-50vw!important;margin-right:-50vw!important; } #wf-home.wh-libre{width:100%!important;max-width:none!important;left:auto;right:auto;margin-left:0!important;margin-right:0!important} /* El tema de Kajabi pinta sus propios colores y fuentes en títulos: se fijan aquí */ #wf-home h1,#wf-home h2,#wf-home h3,#wf-home p,#wf-home li,#wf-home dt,#wf-home dd,#wf-home a,#wf-home button,#wf-home blockquote{font-family:'Poppins',system-ui,-apple-system,'Segoe UI',sans-serif} #wf-home .wh-hero__h1{color:#fff!important} #wf-home .wh-hero__h1 span,#wf-home .wh-h2 span{color:var(--azul)!important} #wf-home .wh-h2{color:var(--navy)!important} #wf-home .wh-h2.wh-blanco{color:#fff!important} #wf-home .wh-prod h3,#wf-home .wh-pilares h3{color:var(--navy)!important} #wf-home .wh-prod--oscuro h3{color:#fff!important} #wf-home{ --navy:#001F2D; --petroleo:#004563; --azul:#66B3E8; --azul-f:#2599D2; --texto:#1A2E37; --suave:#5B6F79; --linea:rgba(0,31,45,.12); --tenue:#F2F7FB; --r:18px; font-family:'Poppins',system-ui,-apple-system,'Segoe UI',sans-serif; color:var(--texto); background:#fff; line-height:1.6; font-size:16px; -webkit-font-smoothing:antialiased; overflow-x:hidden; } #wf-home *,#wf-home *::before,#wf-home *::after{box-sizing:border-box} #wf-home img{max-width:100%;display:block} #wf-home a{color:inherit} #wf-home h1,#wf-home h2,#wf-home h3,#wf-home p,#wf-home ul,#wf-home ol,#wf-home dl,#wf-home dd,#wf-home figure,#wf-home blockquote{margin:0;padding:0} #wf-home .wh-wrap{width:100%;max-width:1180px;margin:0 auto;padding:0 24px} /* Botones */ #wf-home .wh-btn{display:inline-block;background:var(--azul);color:#fff;font-weight:600;font-size:16px; padding:15px 28px;border-radius:14px;text-decoration:none;border:2px solid var(--azul); transition:background .2s,border-color .2s,transform .2s} #wf-home .wh-btn:hover{background:var(--azul-f);border-color:var(--azul-f);transform:translateY(-1px)} #wf-home .wh-btn--ghost{background:transparent;border-color:rgba(255,255,255,.45)} #wf-home .wh-btn--ghost:hover{background:rgba(255,255,255,.1);border-color:#fff} #wf-home .wh-btn--sm{padding:10px 20px;font-size:14px;border-radius:12px} /* Header */ #wf-home .wh-header{position:fixed;top:0;left:0;right:0;z-index:50;padding-top:env(safe-area-inset-top,0px); transition:background .3s,box-shadow .3s} #wf-home .wh-header.is-solido{background:rgba(0,31,45,.94);backdrop-filter:blur(10px);box-shadow:0 6px 24px rgba(0,0,0,.18)} #wf-home .wh-header__in{display:flex;align-items:center;justify-content:space-between;height:76px} #wf-home .wh-brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:#fff;font-size:18px;font-weight:500;letter-spacing:.01em} #wf-home .wh-brand b{font-weight:700} #wf-home .wh-nav{display:flex;align-items:center;gap:30px} #wf-home .wh-nav a{color:#fff;text-decoration:none;font-size:15px;font-weight:500} #wf-home .wh-nav a:not(.wh-btn):hover{color:var(--azul)} #wf-home .wh-menu{display:none;background:none;border:0;width:44px;height:44px;cursor:pointer;position:relative} #wf-home .wh-menu span{position:absolute;left:10px;right:10px;height:2px;background:#fff;transition:transform .25s} #wf-home .wh-menu span:first-child{top:17px} #wf-home .wh-menu span:last-child{top:25px} #wf-home .wh-menu[aria-expanded="true"] span:first-child{transform:translateY(4px) rotate(45deg)} #wf-home .wh-menu[aria-expanded="true"] span:last-child{transform:translateY(-4px) rotate(-45deg)} /* Hero */ #wf-home .wh-hero{position:relative;color:#fff;overflow:hidden; background:radial-gradient(120% 90% at 85% 10%,#0C4F77 0%,rgba(12,79,119,0) 55%), linear-gradient(160deg,var(--navy) 0%,var(--petroleo) 100%); padding:170px 0 0} #wf-home .wh-hero__marca{position:absolute;right:-8%;top:8%;width:62vw;max-width:820px;aspect-ratio:1; background:var(--wh-logo) center/contain no-repeat;opacity:.06;pointer-events:none} #wf-home .wh-hero__in{position:relative;max-width:1180px} #wf-home .wh-hero__pre{font-size:15px;font-weight:500;color:var(--azul);margin-bottom:22px} #wf-home .wh-hero__h1{font-size:clamp(40px,6.4vw,84px);line-height:1.02;font-weight:700;letter-spacing:-.025em;max-width:15ch} #wf-home .wh-hero__h1 span{color:var(--azul);display:block} #wf-home .wh-hero__lead{margin-top:28px;max-width:56ch;font-size:clamp(16px,1.4vw,19px);color:rgba(255,255,255,.82)} #wf-home .wh-hero__ctas{display:flex;flex-wrap:wrap;gap:14px;margin-top:36px} #wf-home .wh-pulso{display:block;width:100%;height:120px;margin-top:56px} #wf-home .wh-pulso path{fill:none;stroke:var(--azul);stroke-width:2.2;stroke-linejoin:round;stroke-linecap:round; stroke-dasharray:2600;stroke-dashoffset:2600;animation:wh-trazo 2.6s ease-out .3s forwards} @keyframes wh-trazo{to{stroke-dashoffset:0}} #wf-home .wh-datos{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid rgba(255,255,255,.18);margin-top:-8px} #wf-home .wh-datos div{padding:26px 24px 34px 0} #wf-home .wh-datos div+div{padding-left:24px;border-left:1px solid rgba(255,255,255,.18)} #wf-home .wh-datos dt{font-size:clamp(18px,1.7vw,22px);font-weight:700;line-height:1.25} #wf-home .wh-datos dd{font-size:14px;color:rgba(255,255,255,.7);margin-top:4px} /* Secciones */ #wf-home .wh-sec{padding:112px 0} #wf-home .wh-sec--tenue{background:var(--tenue)} #wf-home .wh-cabeza{text-align:center;max-width:720px;margin:0 auto 56px} #wf-home .wh-h2{font-size:clamp(30px,3.6vw,46px);line-height:1.12;font-weight:700;letter-spacing:-.015em;color:var(--navy)} #wf-home .wh-h2 span{color:var(--azul)} #wf-home .wh-sub{margin-top:18px;font-size:clamp(16px,1.3vw,18px);color:var(--suave)} #wf-home .wh-izq{text-align:left} #wf-home .wh-blanco{color:#fff} /* Productos */ #wf-home .wh-productos{display:grid;grid-template-columns:repeat(3,1fr);gap:22px} #wf-home .wh-prod{display:flex;flex-direction:column;background:#fff;border:1px solid var(--linea);border-radius:var(--r); padding:34px 30px 30px;transition:transform .25s,box-shadow .25s} #wf-home .wh-prod:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(0,31,45,.1)} #wf-home .wh-prod__para{font-size:14px;font-weight:600;color:var(--azul-f)} #wf-home .wh-prod h3{font-size:26px;line-height:1.2;font-weight:700;color:var(--navy);margin-top:6px} #wf-home .wh-prod__desc{margin-top:14px;color:var(--suave);font-size:15.5px} #wf-home .wh-prod ul{list-style:none;margin:22px 0 28px;border-top:1px solid var(--linea)} #wf-home .wh-prod li{position:relative;padding:12px 0 12px 22px;border-bottom:1px solid var(--linea);font-size:15px} #wf-home .wh-prod li::before{content:"";position:absolute;left:2px;top:21px;width:8px;height:8px;border-radius:50%;background:var(--azul)} #wf-home .wh-prod__link{margin-top:auto;display:inline-flex;align-items:center;gap:10px;font-weight:600;color:var(--navy);text-decoration:none} #wf-home .wh-prod__link::after{content:"→";transition:transform .2s} #wf-home .wh-prod__link:hover::after{transform:translateX(4px)} #wf-home .wh-prod--oscuro{background:linear-gradient(160deg,var(--navy),var(--petroleo));border-color:transparent;color:#fff} #wf-home .wh-prod--oscuro h3,#wf-home .wh-prod--oscuro .wh-prod__link{color:#fff} #wf-home .wh-prod--oscuro .wh-prod__para{color:var(--azul)} #wf-home .wh-prod--oscuro .wh-prod__desc{color:rgba(255,255,255,.75)} #wf-home .wh-prod--oscuro ul,#wf-home .wh-prod--oscuro li{border-color:rgba(255,255,255,.16)} #wf-home .wh-nota{text-align:center;margin-top:36px;color:var(--suave)} #wf-home .wh-nota strong{color:var(--navy)} /* Proyecto */ #wf-home .wh-proyecto{display:grid;grid-template-columns:5fr 7fr;gap:72px;align-items:start} #wf-home .wh-proyecto__intro{position:sticky;top:110px} #wf-home .wh-proyecto__intro .wh-sub{margin-bottom:30px;max-width:44ch} #wf-home .wh-ficha{border-top:2px solid var(--navy)} #wf-home .wh-ficha__fila{display:grid;grid-template-columns:2fr 3fr;gap:28px;padding:24px 0;border-bottom:1px solid var(--linea)} #wf-home .wh-ficha dt{font-size:19px;font-weight:600;line-height:1.3;color:var(--navy)} #wf-home .wh-ficha dd{font-size:15.5px;color:var(--suave)} /* Galería */ #wf-home .wh-galeria{margin-top:88px} #wf-home .wh-galeria__pista{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none; padding:0 max(24px,calc((100vw - 1132px)/2))} #wf-home .wh-galeria__pista::-webkit-scrollbar{display:none} #wf-home .wh-galeria__pista img{flex:0 0 auto;width:min(78vw,420px);aspect-ratio:4/5;object-fit:cover;border-radius:var(--r); scroll-snap-align:center;background:#dfe9f1} #wf-home .wh-galeria__ctl{display:flex;justify-content:flex-end;gap:10px;margin-top:22px} #wf-home .wh-flecha{width:48px;height:48px;border-radius:50%;border:1px solid var(--linea);background:#fff;color:var(--navy); font-size:20px;cursor:pointer;transition:background .2s,color .2s} #wf-home .wh-flecha:hover{background:var(--navy);color:#fff} /* Visión */ #wf-home .wh-vision{background:var(--navy);color:#fff;padding:120px 0} #wf-home .wh-vision__in{display:grid;grid-template-columns:7fr 5fr;gap:64px;align-items:end} #wf-home .wh-vision__frase{font-size:clamp(30px,3.8vw,50px);line-height:1.15;font-weight:700;letter-spacing:-.015em} #wf-home .wh-vision__frase span{color:var(--azul)} #wf-home .wh-vision__txt{color:rgba(255,255,255,.75);font-size:17px} /* Testimonios */ #wf-home .wh-videos{display:grid;grid-template-columns:repeat(4,1fr);gap:18px} #wf-home .wh-video{border-radius:var(--r);overflow:hidden;background:#0b2a3a} #wf-home .wistia_responsive_padding{padding:177.78% 0 0 0;position:relative} #wf-home .wistia_responsive_wrapper{position:absolute;inset:0} #wf-home .wistia_embed{width:100%;height:100%} #wf-home figcaption{margin-top:12px;font-weight:600;color:var(--navy);text-align:center} #wf-home .wh-citas{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:56px} #wf-home .wh-citas blockquote{background:var(--tenue);border-radius:var(--r);padding:28px 26px;display:flex;flex-direction:column;justify-content:space-between;gap:22px} #wf-home .wh-citas p{font-size:15.5px} #wf-home .wh-citas footer{font-size:14px;color:var(--suave)} #wf-home .wh-citas footer b{display:block;color:var(--navy);font-size:15px} /* Pasos */ #wf-home .wh-pasos{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:22px;counter-reset:paso} #wf-home .wh-pasos li{counter-increment:paso;background:#fff;border-radius:var(--r);padding:32px 28px;border:1px solid var(--linea)} #wf-home .wh-pasos li::before{content:counter(paso);display:grid;place-items:center;width:44px;height:44px;border-radius:50%; background:var(--navy);color:#fff;font-weight:700;margin-bottom:20px} #wf-home .wh-pasos h3{font-size:20px;font-weight:700;color:var(--navy);margin-bottom:8px} #wf-home .wh-pasos p{color:var(--suave);font-size:15.5px} /* Contacto */ #wf-home .wh-contacto{position:relative;overflow:hidden;color:#fff;padding:120px 0; background:linear-gradient(150deg,var(--navy) 0%,var(--petroleo) 70%,#0C4F77 100%)} #wf-home .wh-contacto .wh-hero__marca{left:-12%;right:auto;top:-10%} #wf-home .wh-contacto__in{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center} #wf-home .wh-contacto__txt>p{margin-top:20px;color:rgba(255,255,255,.8);font-size:17px;max-width:46ch} #wf-home .wh-garantias{list-style:none;margin-top:28px;display:grid;gap:10px} #wf-home .wh-garantias li{position:relative;padding-left:30px;font-size:15px} #wf-home .wh-garantias li::before{content:"";position:absolute;left:0;top:5px;width:18px;height:18px;border-radius:50%; background:var(--azul) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E") center/11px no-repeat} #wf-home .wh-form{background:#fff;color:var(--texto);border-radius:22px;padding:38px 34px;box-shadow:0 30px 70px rgba(0,0,0,.25)} #wf-home .wh-form__titulo{font-size:22px;font-weight:700;color:var(--navy);margin-bottom:22px} #wf-home .wh-form .form-group{margin:0 0 14px} #wf-home .wh-form .form-control{width:100%;font:inherit;font-size:15px;color:var(--texto);background:#fff; border:1px solid rgba(0,31,45,.2);border-radius:12px;padding:14px 16px;margin:0;appearance:none;-webkit-appearance:none} #wf-home .wh-form select.form-control{background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23001F2D' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") right 14px center/18px no-repeat;padding-right:44px} #wf-home .wh-form .form-control:focus{outline:none;border-color:var(--azul);box-shadow:0 0 0 4px rgba(102,179,232,.2)} #wf-home .wh-form button[type="submit"]{width:100%;margin-top:6px;background:var(--azul);color:#fff;border:0;border-radius:14px; padding:16px;font:inherit;font-weight:600;font-size:16px;cursor:pointer;transition:background .2s} #wf-home .wh-form button[type="submit"]:hover{background:var(--azul-f)} /* Footer */ #wf-home .wh-footer{background:#00141e;color:rgba(255,255,255,.7);padding:64px 0 calc(40px + env(safe-area-inset-bottom,0px));font-size:14px} #wf-home .wh-footer__in{display:grid;grid-template-columns:auto 1fr auto;gap:48px;align-items:center;padding-bottom:36px;border-bottom:1px solid rgba(255,255,255,.1)} #wf-home .wh-footer__links{display:flex;gap:24px} #wf-home .wh-footer a{text-decoration:none} #wf-home .wh-footer a:hover{color:#fff} #wf-home .wh-legal{margin-top:22px;font-size:12px;color:rgba(255,255,255,.45);max-width:90ch} /* Aparición suave */ #wf-home .wh-rev{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease} #wf-home .wh-rev.is-visto{opacity:1;transform:none} @media (prefers-reduced-motion:reduce){ #wf-home .wh-rev{opacity:1;transform:none} #wf-home .wh-pulso path{animation:none;stroke-dashoffset:0} } /* Responsive */ @media (max-width:1024px){ #wf-home .wh-productos,#wf-home .wh-citas{grid-template-columns:1fr 1fr} #wf-home .wh-prod--oscuro{grid-column:1/-1} #wf-home .wh-videos{grid-template-columns:1fr 1fr} #wf-home .wh-proyecto,#wf-home .wh-vision__in,#wf-home .wh-contacto__in{grid-template-columns:1fr;gap:44px} #wf-home .wh-proyecto__intro{position:static} } @media (max-width:820px){ #wf-home .wh-menu{display:block} #wf-home .wh-nav{position:fixed;inset:76px 0 auto 0;flex-direction:column;align-items:stretch;gap:0; background:var(--navy);padding:8px 24px 24px;transform:translateY(-12px);opacity:0;pointer-events:none;transition:opacity .25s,transform .25s} #wf-home .wh-nav.is-abierto{opacity:1;transform:none;pointer-events:auto} #wf-home .wh-nav a{padding:14px 0;border-bottom:1px solid rgba(255,255,255,.1);font-size:16px} #wf-home .wh-nav .wh-btn{margin-top:16px;text-align:center;border-bottom:0} #wf-home .wh-header{background:rgba(0,31,45,.94)} #wf-home .wh-hero{padding-top:130px} #wf-home .wh-datos{grid-template-columns:1fr 1fr} #wf-home .wh-datos div,#wf-home .wh-datos div+div{padding:20px 14px 22px 0;border-left:0} #wf-home .wh-datos div:nth-child(even){padding-left:16px;border-left:1px solid rgba(255,255,255,.18)} #wf-home .wh-datos div:nth-child(n+3){border-top:1px solid rgba(255,255,255,.18)} #wf-home .wh-pulso{height:70px;margin-top:40px} #wf-home .wh-sec{padding:80px 0} #wf-home .wh-vision,#wf-home .wh-contacto{padding:88px 0} #wf-home .wh-productos,#wf-home .wh-citas,#wf-home .wh-pasos{grid-template-columns:1fr} #wf-home .wh-ficha__fila{grid-template-columns:1fr;gap:6px;padding:18px 0} #wf-home .wh-form{padding:30px 22px} #wf-home .wh-footer__in{grid-template-columns:1fr;gap:24px} #wf-home .wh-footer__links{flex-wrap:wrap} #wf-home .wh-hero__ctas .wh-btn{width:100%;text-align:center} } /* ---------- v2: secciones por tema ---------- */ /* Video de fondo del hero */ #wf-home .wh-hero__video{position:absolute;inset:0;z-index:0;pointer-events:none; background:#001F2D url("https://embed-ssl.wistia.com/deliveries/d113f27859a0856e0881f5126c9a5dad01a3f9b7.jpg") center/cover no-repeat} #wf-home .wh-hero__video .wistia_embed{position:absolute!important;inset:0;width:100%!important;height:100%!important} #wf-home .wh-hero__video video,#wf-home .wh-hero__video iframe{width:100%!important;height:100%!important;object-fit:cover} #wf-home .wh-hero__velo{position:absolute;inset:0;z-index:1;pointer-events:none; background:linear-gradient(90deg,rgba(0,31,45,.92) 0%,rgba(0,31,45,.75) 45%,rgba(0,31,45,.35) 100%), linear-gradient(0deg,rgba(0,31,45,.85) 0%,rgba(0,31,45,0) 35%)} #wf-home .wh-hero__in,#wf-home .wh-hero .wh-pulso{position:relative;z-index:2} #wf-home .wh-hero>.wh-hero__marca{display:none} @media (max-width:820px){ #wf-home .wh-hero__velo{background:linear-gradient(180deg,rgba(0,31,45,.7) 0%,rgba(0,31,45,.88) 60%,rgba(0,31,45,.95) 100%)} } #wf-home .wh-hero{padding-bottom:0} #wf-home .wh-pulso{margin-top:72px;margin-bottom:-2px} #wf-home .wh-sub + .wh-sub{margin-top:14px} #wf-home .wh-sub--claro{color:rgba(255,255,255,.75)} #wf-home .wh-sec--navy{position:relative;overflow:hidden;color:#fff; background:linear-gradient(160deg,var(--navy) 0%,var(--petroleo) 100%)} #wf-home .wh-sec--navy .wh-hero__marca{left:-14%;right:auto;top:-6%} #wf-home .wh-sec--navy .wh-btn{margin-top:30px} #wf-home .wh-split{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,6vw,80px);align-items:center} #wf-home .wh-split--media{align-items:start} /* Ubicación */ #wf-home .wh-mapa-g{border-radius:22px;overflow:hidden;aspect-ratio:4/3;background:#dfe9f1;box-shadow:0 24px 50px -30px rgba(0,31,45,.5)} #wf-home .wh-mapa-g iframe{width:100%;height:100%;border:0;display:block} /* Infraestructura */ #wf-home .wh-linea{list-style:none;margin-top:36px;border-left:2px solid var(--azul);padding-left:0} #wf-home .wh-linea li{position:relative;padding:0 0 22px 26px} #wf-home .wh-linea li:last-child{padding-bottom:0} #wf-home .wh-linea li::before{content:"";position:absolute;left:-7px;top:6px;width:12px;height:12px;border-radius:50%;background:#fff;border:2px solid var(--azul)} #wf-home .wh-linea li:last-child::before{background:var(--azul)} #wf-home .wh-linea b{display:block;color:var(--navy);font-size:17px} #wf-home .wh-linea span{color:var(--suave);font-size:15px} #wf-home .wh-infra{position:relative;min-height:260px} #wf-home .wh-infra img{width:100%;height:auto} #wf-home .wh-infra__vacio{display:none;position:absolute;inset:0;place-items:center;color:var(--suave);font-size:14px; border:2px dashed rgba(0,31,45,.18);border-radius:22px} #wf-home .wh-infra.sin-imagen img{display:none} #wf-home .wh-infra.sin-imagen .wh-infra__vacio{display:grid} /* Galería horizontal */ #wf-home .wh-galeria__pista img{width:min(86vw,720px);height:auto;aspect-ratio:16/9;object-fit:contain} /* Médicos */ #wf-home .wh-citas-med{display:grid;gap:18px} #wf-home .wh-citas-med blockquote{background:rgba(255,255,255,.06);border:1px solid rgba(102,179,232,.25);border-radius:var(--r);padding:30px 28px} #wf-home .wh-citas-med p{font-size:17px;line-height:1.6} #wf-home .wh-citas-med footer{margin-top:18px;font-size:14px;color:rgba(255,255,255,.6)} #wf-home .wh-citas-med footer b{display:block;color:#fff;font-size:15px} /* Ecuación de la acción */ #wf-home .wh-ecuacion{display:grid;grid-template-columns:auto auto 1fr auto 1fr;gap:18px;align-items:stretch;max-width:980px;margin:0 auto} #wf-home .wh-ecuacion__uno{display:grid;place-items:center;background:var(--navy);color:#fff;border-radius:var(--r);padding:28px 32px} #wf-home .wh-ecuacion__uno b{font-size:24px;white-space:nowrap} #wf-home .wh-ecuacion__op{display:grid;place-items:center;font-size:30px;font-weight:600;color:var(--azul)} #wf-home .wh-ecuacion__parte{border:1px solid var(--linea);border-radius:var(--r);padding:26px 26px;background:#fff} #wf-home .wh-ecuacion__parte b{display:block;font-size:34px;line-height:1;color:var(--navy);margin-bottom:10px} #wf-home .wh-ecuacion__parte span{display:block;font-weight:600;color:var(--navy)} #wf-home .wh-ecuacion__parte small{display:block;color:var(--suave);font-size:14px;margin-top:4px} /* Expansión */ #wf-home .wh-split--mapa{grid-template-columns:.9fr 1.1fr} #wf-home .wh-marcas{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:30px} #wf-home .wh-marca{display:flex;gap:12px;align-items:flex-start;background:#fff;border:1px solid #E1EAF0;border-radius:14px;padding:16px} #wf-home .wh-marca svg{width:24px;height:24px;flex:none;color:var(--petroleo)} #wf-home .wh-marca span{font-size:14px;font-weight:500;line-height:1.45;color:var(--navy)} #wf-home .wh-mapa{position:relative} #wf-home .wh-mapa img{width:100%;height:auto} #wf-home .wh-mapa__pins{position:absolute;inset:0;pointer-events:none} #wf-home .wh-pin{position:absolute;left:var(--x);top:var(--y);width:0;height:0;pointer-events:auto} #wf-home .wh-pin::after{content:"";position:absolute;left:50%;top:50%;width:11px;height:11px;margin:-5.5px 0 0 -5.5px;border-radius:50%; background:var(--azul-f);box-shadow:0 0 0 3px rgba(255,255,255,.9),0 0 18px 4px rgba(37,153,210,.65); animation:whPinOn 6s ease-in-out infinite;animation-delay:var(--d,0s)} #wf-home .wh-pin::before{content:"";position:absolute;left:50%;top:50%;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%; border:2px solid var(--azul-f);animation:whPinWave 6s ease-out infinite;animation-delay:var(--d,0s)} @keyframes whPinOn{0%,12%{opacity:.18;transform:scale(.7)}22%{opacity:1;transform:scale(1.15)}45%{opacity:1;transform:scale(1)}70%,100%{opacity:.18;transform:scale(.7)}} @keyframes whPinWave{0%,12%{opacity:0;transform:scale(.6)}22%{opacity:.75;transform:scale(1)}60%,100%{opacity:0;transform:scale(3.6)}} #wf-home .wh-pin--sede::after{width:15px;height:15px;margin:-7.5px 0 0 -7.5px;background:var(--navy);animation:none;opacity:1; box-shadow:0 0 0 3px rgba(255,255,255,.95),0 0 22px 6px rgba(0,31,45,.35)} #wf-home .wh-pin--sede::before{border-color:var(--navy);animation-duration:3.2s;animation-delay:0s} #wf-home .wh-pin i{position:absolute;left:50%;bottom:14px;transform:translateX(-50%) translateY(4px);font-style:normal;font-size:11px; font-weight:600;white-space:nowrap;padding:5px 10px;border-radius:999px;background:var(--navy);color:#fff;opacity:0; transition:opacity .3s,transform .3s;pointer-events:none} #wf-home .wh-pin--sede i{opacity:1;transform:translateX(-50%);bottom:20px} #wf-home .wh-pin:hover i{opacity:1;transform:translateX(-50%)} #wf-home .wh-citas--4{grid-template-columns:repeat(4,1fr)} @media (max-width:1024px){ #wf-home .wh-split,#wf-home .wh-split--mapa{grid-template-columns:1fr} #wf-home .wh-citas--4{grid-template-columns:1fr 1fr} #wf-home .wh-ecuacion{grid-template-columns:1fr;max-width:460px} #wf-home .wh-ecuacion__op{font-size:26px} } @media (max-width:820px){ #wf-home .wh-citas--4,#wf-home .wh-marcas{grid-template-columns:1fr} #wf-home .wh-pin i{display:none} #wf-home .wh-pin--sede i{display:block} } @media (prefers-reduced-motion:reduce){#wf-home .wh-pin::after,#wf-home .wh-pin::before{animation:none}} /* ---------- v3: paquetes, membresías ---------- */ #wf-home .wh-split--paq{align-items:start} #wf-home .wh-paq{background:rgba(255,255,255,.05);border:1px solid rgba(102,179,232,.3);border-radius:22px;padding:10px} #wf-home .wh-paq__tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:6px} #wf-home .wh-paq__tabs button{font:inherit;font-size:14px;font-weight:600;color:rgba(255,255,255,.75);background:transparent; border:0;border-radius:14px;padding:12px 6px;cursor:pointer;transition:background .2s,color .2s} #wf-home .wh-paq__tabs button:hover{color:#fff;background:rgba(255,255,255,.06)} #wf-home .wh-paq__tabs button[aria-selected="true"]{background:var(--azul);color:#fff} #wf-home .wh-paq__cuerpo{padding:30px 26px 24px} #wf-home .wh-paq__etq{font-size:14px;color:rgba(255,255,255,.6)} #wf-home .wh-paq__total{font-size:clamp(36px,4.4vw,54px);font-weight:700;line-height:1.05;letter-spacing:-.02em;color:#fff;margin-top:4px} #wf-home .wh-paq__total small{font-size:16px;font-weight:500;color:rgba(255,255,255,.5)} #wf-home .wh-paq__badge{display:inline-block;margin-top:14px;font-size:13px;font-weight:600;color:var(--navy);background:var(--azul); border-radius:99px;padding:5px 12px;min-height:28px} #wf-home .wh-paq__badge:empty{visibility:hidden} #wf-home .wh-paq__datos{display:grid;grid-template-columns:1fr 1fr;margin-top:22px;border-top:1px solid rgba(255,255,255,.14)} #wf-home .wh-paq__datos div{padding:16px 0;border-bottom:1px solid rgba(255,255,255,.14)} #wf-home .wh-paq__datos div:nth-child(odd){padding-right:16px} #wf-home .wh-paq__datos div:nth-child(even){padding-left:16px;border-left:1px solid rgba(255,255,255,.14)} #wf-home .wh-paq__datos dt{font-size:13px;color:rgba(255,255,255,.6)} #wf-home .wh-paq__datos dd{font-size:20px;font-weight:700;color:#fff;margin-top:2px} #wf-home .wh-paq__nota{margin-top:18px;font-size:12.5px;line-height:1.55;color:rgba(255,255,255,.5)} #wf-home .wh-split--memb{align-items:center} #wf-home .wh-dato{background:var(--navy);color:#fff;border-radius:22px;padding:40px 36px} #wf-home .wh-dato b{display:block;font-size:clamp(56px,7vw,88px);line-height:1;letter-spacing:-.03em;color:var(--azul)} #wf-home .wh-dato span{display:block;font-size:20px;font-weight:600;margin-top:10px} #wf-home .wh-dato small{display:block;margin-top:10px;font-size:14.5px;color:rgba(255,255,255,.65)} #wf-home .wh-pilares{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:56px} #wf-home .wh-pilares article{background:#fff;border-radius:var(--r);padding:30px 28px;box-shadow:inset 0 4px 0 var(--azul)} #wf-home .wh-pilares h3{font-size:22px;font-weight:700;color:var(--navy);margin-bottom:10px} #wf-home .wh-pilares p{color:var(--suave);font-size:15.5px} #wf-home .wh-memb-cta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px;margin-top:40px; padding-top:30px;border-top:1px solid var(--linea)} #wf-home .wh-memb-cta p{color:var(--suave)} @media (max-width:820px){ #wf-home .wh-pilares{grid-template-columns:1fr} #wf-home .wh-paq__tabs{grid-template-columns:1fr 1fr} #wf-home .wh-paq__cuerpo{padding:24px 16px 18px} #wf-home .wh-memb-cta .wh-btn{width:100%;text-align:center} } /* Sección del hospital en navy para que se vea el edificio (PNG sin fondo) */ #wf-home .wh-sec--hospital .wh-h2{color:#fff!important} #wf-home .wh-sec--hospital .wh-sub{color:rgba(255,255,255,.75)} #wf-home .wh-sec--hospital .wh-linea b{color:#fff} #wf-home .wh-sec--hospital .wh-linea span{color:rgba(255,255,255,.65)} #wf-home .wh-sec--hospital .wh-linea li::before{background:var(--navy)} #wf-home .wh-sec--hospital .wh-linea li:last-child::before{background:var(--azul)} #wf-home .wh-sec--hospital .wh-flecha{background:transparent;color:#fff;border-color:rgba(255,255,255,.3)} #wf-home .wh-sec--hospital .wh-flecha:hover{background:#fff;color:var(--navy)} #wf-home .wh-sec--hospital .wh-galeria__pista img{background:rgba(255,255,255,.06)} #wf-home .wh-sec--hospital .wh-infra__vacio{color:rgba(255,255,255,.6);border-color:rgba(255,255,255,.2)} /* Médicos en fondo claro (va después de la sección navy del hospital) */ #wf-home #medicos .wh-btn{margin-top:30px} #wf-home #medicos .wh-citas-med blockquote{background:var(--tenue);border-color:transparent} #wf-home #medicos .wh-citas-med footer{color:var(--suave)} #wf-home #medicos .wh-citas-med footer b{color:var(--navy)} /* ===================================================================== DISEÑO VISUAL · branding 3.0 (línea de los decks 2026) ===================================================================== */ /* Kicker: mayúsculas, SemiBold, tracking amplio */ #wf-home .wh-kicker{font-size:13px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--azul);margin-bottom:14px} #wf-home .wh-cabeza .wh-kicker{text-align:center} #wf-home .wh-sec--navy .wh-kicker,#wf-home .wh-contacto .wh-kicker{color:var(--azul)} /* W en marca de agua sobre el borde derecho de las secciones claras */ #wf-home .wh-sec:not(.wh-sec--navy){position:relative;overflow:hidden} #wf-home .wh-sec:not(.wh-sec--navy)::before{content:"";position:absolute;right:-9%;top:50%;transform:translateY(-50%); width:min(58vw,760px);aspect-ratio:3240/1998;pointer-events:none;opacity:.55; background:var(--wh-wgrande) center/contain no-repeat} #wf-home .wh-sec:not(.wh-sec--navy)>.wh-wrap,#wf-home .wh-sec:not(.wh-sec--navy)>.wh-galeria{position:relative;z-index:1} #wf-home #participa::before,#wf-home #testimonios::before{top:64%} /* Tarjeta azul de marca: degradado azul + W blanca translúcida */ #wf-home .wh-azulw{position:relative;overflow:hidden;isolation:isolate; background:linear-gradient(145deg,#7CC0EE 0%,#66B3E8 38%,#2599D2 100%)!important;color:#fff;border:0!important} #wf-home .wh-azulw::after{content:"";position:absolute;right:-18%;bottom:-22%;width:78%;aspect-ratio:1;z-index:-1;opacity:.16; background:var(--wh-wtarjeta) center/contain no-repeat;pointer-events:none} #wf-home .wh-prod.wh-azulw .wh-prod__para{color:var(--navy)} #wf-home .wh-prod.wh-azulw .wh-prod__desc{color:rgba(255,255,255,.9)} #wf-home .wh-prod.wh-azulw ul,#wf-home .wh-prod.wh-azulw li{border-color:rgba(255,255,255,.3)} #wf-home .wh-prod.wh-azulw li::before{background:#fff} #wf-home .wh-prod.wh-azulw .wh-prod__link{color:#fff} #wf-home .wh-prod.wh-azulw .wh-ico{background:rgba(255,255,255,.2);color:#fff} #wf-home .wh-dato.wh-azulw b{color:#fff} #wf-home .wh-dato.wh-azulw small{color:rgba(255,255,255,.85)} #wf-home .wh-ecuacion__uno.wh-azulw b{color:#fff} /* Tarjetas blancas: sombra suave, sin borde */ #wf-home .wh-prod:not(.wh-azulw),#wf-home .wh-ecuacion__parte,#wf-home .wh-pilares article,#wf-home .wh-marca{ border:0!important;box-shadow:0 18px 44px -24px rgba(0,31,45,.28),0 2px 6px rgba(0,31,45,.04)} #wf-home .wh-prod{border-radius:24px} #wf-home .wh-prod:hover{box-shadow:0 28px 60px -26px rgba(0,31,45,.38)} #wf-home .wh-pilares article{box-shadow:0 18px 44px -24px rgba(0,31,45,.28)!important} /* Iconos lineales */ #wf-home .wh-ico{display:grid;place-items:center;width:52px;height:52px;border-radius:16px;margin-bottom:20px; background:rgba(102,179,232,.14);color:var(--azul-f)} #wf-home .wh-ico svg{width:26px;height:26px} #wf-home .wh-pilares .wh-ico{margin-bottom:18px} /* Cifras grandes azules (cuerpo médico) */ #wf-home .wh-cifras{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:30px;max-width:440px} #wf-home .wh-cifra{border-radius:20px;padding:22px 22px 20px} #wf-home .wh-cifra b{display:block;font-size:clamp(40px,4vw,52px);line-height:1;font-weight:700;letter-spacing:-.02em;color:#fff} #wf-home .wh-cifra span{display:block;margin-top:8px;font-size:14px;font-weight:600;color:#fff} /* Frase de cierre: itálica bold navy (firma de la línea visual) */ #wf-home .wh-cierre{font-style:italic;font-weight:700;color:var(--navy)!important;font-size:17px} /* Pulso cruzando la sección de visión */ #wf-home .wh-vision{position:relative;overflow:hidden} #wf-home .wh-pulso--vision{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);height:160px;margin:0;opacity:.35;pointer-events:none} #wf-home .wh-pulso--vision path{animation:none;stroke-dashoffset:0;stroke-width:1.6} #wf-home .wh-vision__in{position:relative;z-index:1} /* Titulares: un poco más de peso visual */ #wf-home .wh-h2{letter-spacing:-.02em} #wf-home .wh-cabeza{margin-bottom:60px} /* Paquetes: badge como etiqueta de deck */ #wf-home .wh-paq__badge{text-transform:uppercase;letter-spacing:.08em;font-size:11.5px} @media (max-width:820px){ #wf-home .wh-sec:not(.wh-sec--navy)::before{width:120vw;right:-50%;opacity:.35} #wf-home .wh-cifras{max-width:none} } /* Ajustes finos de la W en tarjetas pequeñas y contraste del kicker */ #wf-home .wh-kicker{color:var(--azul-f);font-size:13.5px} #wf-home .wh-sec--navy .wh-kicker,#wf-home .wh-contacto .wh-kicker{color:var(--azul)} #wf-home .wh-azulw::after{opacity:.13} #wf-home .wh-dato.wh-azulw::after{width:55%;right:-10%;bottom:-30%} #wf-home .wh-cifra.wh-azulw::after,#wf-home .wh-ecuacion__uno.wh-azulw::after{width:70%;right:-32%;bottom:-48%;opacity:.14} /* ===================================================================== v4 · DINAMISMO: fondos vivos, botones, apariciones, vitrina, edificio ===================================================================== */ #wf-home{overflow-x:clip!important;overflow-y:visible!important;--e-out:cubic-bezier(.16,1,.3,1)} /* Barra de progreso de lectura (línea de vida) */ #wf-home .wh-progreso{position:fixed;top:0;left:0;right:0;height:3px;z-index:60;pointer-events:none} #wf-home .wh-progreso span{display:block;height:100%;width:100%;transform-origin:0 50%;transform:scaleX(0); background:linear-gradient(90deg,#4DAAB4,var(--azul),#fff);box-shadow:0 0 12px rgba(102,179,232,.8)} /* ---------- Hero: línea de vida en movimiento ---------- */ #wf-home .wh-pulso--vivo{height:160px;margin-top:56px;overflow:visible} #wf-home .wh-pulso--vivo path{fill:none;stroke-linecap:round;stroke-linejoin:round;animation:none!important; stroke-dasharray:none!important;vector-effect:non-scaling-stroke} #wf-home .wh-pulso__main{stroke:var(--azul);stroke-width:2.4;filter:drop-shadow(0 0 6px rgba(102,179,232,.75))} #wf-home .wh-pulso__eco{stroke:rgba(102,179,232,.35);stroke-width:1.4} #wf-home .wh-pulso__eco2{stroke:rgba(255,255,255,.14);stroke-width:1.2} @media (max-width:820px){#wf-home .wh-pulso--vivo{height:110px;margin-top:40px}} /* ---------- Ondas de fondo (línea de vida que fluye) ---------- */ #wf-home .wh-onda{position:absolute;left:0;right:0;bottom:0;height:clamp(180px,24vw,300px);z-index:0;pointer-events:none; -webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent); mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)} #wf-home .wh-onda svg{display:block;width:100%;height:100%;overflow:visible} #wf-home .wh-onda path{fill:none;stroke-width:1.5;stroke-linecap:round;vector-effect:non-scaling-stroke} #wf-home .wh-onda[data-onda="claro"] path{stroke:rgba(102,179,232,.9)} #wf-home .wh-onda[data-onda="azul"] path{stroke:var(--azul)} #wf-home .wh-onda__flujo{animation:whFlujo linear infinite} #wf-home .wh-onda__respira{animation:whRespira ease-in-out infinite alternate;transform-origin:0 100px} @keyframes whFlujo{from{transform:translateX(0)}to{transform:translateX(-1200px)}} @keyframes whRespira{from{transform:scaleY(.72)}to{transform:scaleY(1.3)}} #wf-home .wh-vision .wh-onda{top:50%;bottom:auto;transform:translateY(-50%);opacity:.55} #wf-home .wh-sec--navy>.wh-wrap,#wf-home .wh-contacto>.wh-wrap,#wf-home .wh-vision>.wh-wrap{position:relative;z-index:1} /* ---------- W de marca que brilla con el cursor ---------- */ #wf-home .wh-sec:not(.wh-sec--navy)::before{display:none} #wf-home .wh-wmark{position:absolute;right:-8%;top:50%;width:min(58vw,760px);aspect-ratio:3240/1998;pointer-events:none;z-index:0; transform:translateY(-50%);opacity:.5;transition:opacity .25s linear,filter .25s linear; background:var(--wh-wgrande) center/contain no-repeat;will-change:opacity,filter} #wf-home .wh-hero__marca,#wf-home .wh-sec--navy .wh-hero__marca,#wf-home .wh-contacto .wh-hero__marca{transition:opacity .25s linear,filter .25s linear} #wf-home .wh-hero>.wh-hero__marca{display:block!important;z-index:1;opacity:.07} /* ---------- Manchas de luz que flotan (como Membresías) ---------- */ #wf-home .wh-blob{position:absolute;border-radius:50%;filter:blur(80px);pointer-events:none;z-index:0;will-change:transform} #wf-home .wh-blob i{display:block;width:100%;height:100%;border-radius:50%;animation:whFlota 22s ease-in-out infinite} #wf-home .wh-blob--a{width:620px;height:620px;top:-220px;right:-200px} #wf-home .wh-blob--a i{background:radial-gradient(circle,rgba(102,179,232,.22),transparent 70%)} #wf-home .wh-blob--b{width:460px;height:460px;bottom:-180px;left:-160px} #wf-home .wh-blob--b i{background:radial-gradient(circle,rgba(77,170,180,.14),transparent 70%);animation-duration:27s;animation-direction:reverse} @keyframes whFlota{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(40px,-30px) scale(1.08)}66%{transform:translate(-30px,24px) scale(.95)}} @media (max-width:767px){#wf-home .wh-blob{display:none}} /* ---------- Botones vivos ---------- */ #wf-home .wh-btn,#wf-home .wh-vit__btn,#wf-home .wh-form button[type="submit"]{position:relative;overflow:hidden;isolation:isolate; transition:transform .35s var(--e-out),box-shadow .35s var(--e-out),background .25s,border-color .25s} #wf-home .wh-btn::after,#wf-home .wh-vit__btn::after,#wf-home .wh-form button[type="submit"]::after{content:"";position:absolute;inset:0;z-index:-1; background:radial-gradient(circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.45),transparent 55%);opacity:0;transition:opacity .35s} #wf-home .wh-btn::before{content:"";position:absolute;top:0;bottom:0;left:-60%;width:40%;z-index:-1; background:linear-gradient(100deg,transparent,rgba(255,255,255,.35),transparent);transform:skewX(-18deg);transition:left .7s var(--e-out)} #wf-home .wh-btn:hover::before{left:130%} #wf-home .wh-btn:hover::after,#wf-home .wh-vit__btn:hover::after,#wf-home .wh-form button[type="submit"]:hover::after{opacity:1} #wf-home .wh-btn:hover{transform:translateY(-3px);box-shadow:0 18px 36px -14px rgba(102,179,232,.85)} #wf-home .wh-btn--ghost:hover{box-shadow:0 18px 36px -18px rgba(0,0,0,.6)} #wf-home .wh-btn:active{transform:translateY(0) scale(.98)} #wf-home .wh-prod__link{position:relative} #wf-home .wh-prod__link span.subr{position:absolute;left:0;bottom:-4px;height:2px;width:100%;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .45s var(--e-out)} #wf-home .wh-prod__link:hover span.subr{transform:scaleX(1)} /* ---------- Apariciones variadas ---------- */ #wf-home [data-rv]{opacity:0;transition:opacity .9s var(--e-out),transform .9s var(--e-out),filter .9s var(--e-out);transition-delay:calc(var(--d,0)*1ms)} #wf-home [data-rv="sube"]{transform:translateY(34px)} #wf-home [data-rv="escala"]{transform:scale(.94);filter:blur(6px)} #wf-home [data-rv="izq"]{transform:translateX(-40px)} #wf-home [data-rv="der"]{transform:translateX(40px)} #wf-home [data-rv].is-visto{opacity:1;transform:none;filter:none} #wf-home .wh-rev{opacity:1!important;transform:none!important} @media (prefers-reduced-motion:reduce){#wf-home [data-rv]{opacity:1!important;transform:none!important;filter:none!important}} /* ---------- Tarjetas de producto: tres colores + inclinación 3D ---------- */ #wf-home .wh-productos{perspective:1200px} #wf-home .wh-prod{transform-style:preserve-3d;transition:transform .5s var(--e-out),box-shadow .5s var(--e-out)!important;position:relative;overflow:hidden;isolation:isolate} #wf-home .wh-prod::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:0;transition:opacity .4s; background:radial-gradient(circle at var(--gx,50%) var(--gy,0%),rgba(255,255,255,.28),transparent 55%)} #wf-home .wh-prod:hover::before{opacity:1} #wf-home .wh-prod--cielo{background:linear-gradient(160deg,#F4FAFE 0%,#DCEEFB 100%)!important;box-shadow:0 18px 44px -24px rgba(37,153,210,.45)!important} #wf-home .wh-prod--cielo .wh-ico{background:#fff} #wf-home .wh-prod--cielo ul,#wf-home .wh-prod--cielo li{border-color:rgba(37,153,210,.18)} #wf-home .wh-prod--navy{background:linear-gradient(160deg,#00324A 0%,var(--navy) 100%)!important;color:#fff} #wf-home .wh-prod--navy h3{color:#fff!important} #wf-home .wh-prod--navy .wh-prod__para{color:var(--azul)} #wf-home .wh-prod--navy .wh-prod__desc{color:rgba(255,255,255,.72)} #wf-home .wh-prod--navy ul,#wf-home .wh-prod--navy li{border-color:rgba(255,255,255,.14)} #wf-home .wh-prod--navy .wh-prod__link{color:#fff} #wf-home .wh-prod--navy .wh-ico{background:rgba(102,179,232,.16);color:var(--azul)} #wf-home .wh-prod--navy::after{content:"";position:absolute;right:-22%;bottom:-18%;width:75%;aspect-ratio:1;z-index:-1;opacity:.1;pointer-events:none; background:var(--wh-wtarjeta) center/contain no-repeat} #wf-home .wh-prod--cielo::after{content:"";position:absolute;right:-22%;bottom:-18%;width:75%;aspect-ratio:1;z-index:-1;opacity:.5;pointer-events:none; background:var(--wh-wgrande) center/contain no-repeat} /* ---------- Vitrina estilo Apple ---------- */ #wf-home .wh-vitrina{--p:0;position:relative;padding:100px 0 70px;overflow:hidden; background:color-mix(in srgb,var(--navy) calc(var(--p)*100%),#fff);transition:background .1s linear} #wf-home .wh-vitrina .wh-h2{color:color-mix(in srgb,#fff calc(var(--p)*100%),var(--navy))!important} #wf-home .wh-vitrina .wh-cabeza{margin-bottom:44px} #wf-home .wh-vit{position:relative;overflow:hidden} #wf-home .wh-vit__track{display:flex;gap:14px;will-change:transform} #wf-home .wh-vit__slide{position:relative;flex:0 0 min(78vw,1180px);aspect-ratio:16/8.5;border-radius:26px;overflow:hidden;cursor:pointer; background:#0b2a3a var(--img) center/cover no-repeat;opacity:.45;transform:scale(.96); transition:opacity .7s var(--e-out),transform .7s var(--e-out)} #wf-home .wh-vit__slide::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,31,45,.45) 0%,rgba(0,31,45,0) 38%,rgba(0,31,45,0) 55%,rgba(0,31,45,.78) 100%)} #wf-home .wh-vit__slide.is-activo{opacity:1;transform:none;cursor:default} #wf-home .wh-vit__slide>*{position:relative} #wf-home .wh-vit__top{position:absolute;top:34px;left:40px;right:40px;display:flex;justify-content:space-between} #wf-home .wh-vit__marca{font-size:clamp(22px,2.6vw,36px);font-weight:500;color:#fff;letter-spacing:-.01em} #wf-home .wh-vit__marca b{font-weight:700;color:var(--azul)} #wf-home .wh-vit__pie{position:absolute;left:40px;right:40px;bottom:34px;display:flex;align-items:center;gap:22px;flex-wrap:wrap; opacity:0;transform:translateY(12px);transition:opacity .6s .2s var(--e-out),transform .6s .2s var(--e-out)} #wf-home .wh-vit__slide.is-activo .wh-vit__pie{opacity:1;transform:none} #wf-home .wh-vit__btn{background:#fff;color:var(--navy)!important;text-decoration:none;font-weight:600;font-size:16px;padding:12px 24px;border-radius:999px} #wf-home .wh-vit__btn:hover{transform:translateY(-2px);box-shadow:0 14px 30px -12px rgba(0,0,0,.6)} #wf-home .wh-vit__pie p{color:#fff;font-size:clamp(15px,1.6vw,20px);font-weight:500;margin:0} #wf-home .wh-vit__pie p b{font-weight:700} #wf-home .wh-vit__ctl{display:flex;justify-content:center;align-items:center;gap:18px;margin-top:26px} #wf-home .wh-vit__dots{display:flex;gap:10px;align-items:center;background:color-mix(in srgb,rgba(255,255,255,.12) calc(var(--p)*100%),rgba(0,31,45,.07));padding:10px 14px;border-radius:999px} #wf-home .wh-vit__dot{position:relative;width:9px;height:9px;border-radius:999px;border:0;padding:0;cursor:pointer;overflow:hidden; background:color-mix(in srgb,rgba(255,255,255,.45) calc(var(--p)*100%),rgba(0,31,45,.3));transition:width .5s var(--e-out)} #wf-home .wh-vit__dot.is-activo{width:44px} #wf-home .wh-vit__dot i{position:absolute;inset:0;transform-origin:0 50%;transform:scaleX(0);background:color-mix(in srgb,#fff calc(var(--p)*100%),var(--navy))} #wf-home .wh-vit__pausa{width:36px;height:36px;border-radius:50%;border:0;cursor:pointer;display:grid;place-items:center; background:color-mix(in srgb,rgba(255,255,255,.12) calc(var(--p)*100%),rgba(0,31,45,.07))} #wf-home .wh-vit__pausa span{width:10px;height:12px;border-left:3px solid;border-right:3px solid;color:color-mix(in srgb,#fff calc(var(--p)*100%),var(--navy))} #wf-home .wh-vit__pausa.is-pausa span{width:0;height:0;border-right:0;border-left:11px solid;border-top:7px solid transparent;border-bottom:7px solid transparent;margin-left:3px} @media (max-width:820px){ #wf-home .wh-vit__slide{flex-basis:86vw;aspect-ratio:4/5;border-radius:20px} #wf-home .wh-vit__top{top:22px;left:22px} #wf-home .wh-vit__pie{left:22px;right:22px;bottom:22px;flex-direction:column;align-items:flex-start;gap:14px} } /* ---------- Hospital: timeline + edificio en código ---------- */ #wf-home .wh-split--hosp{align-items:end} #wf-home .wh-sec--hospital .wh-linea{margin-top:0} #wf-home .wh-edificio{position:relative;margin-top:64px;border-radius:32px;overflow:hidden;isolation:isolate;padding:clamp(34px,5vw,64px) clamp(20px,4vw,56px); background:radial-gradient(120% 90% at 85% 5%,#7CC0EE 0%,rgba(124,192,238,0) 55%),linear-gradient(160deg,#4FA7E4 0%,#2A8FD6 45%,#1B78C2 100%); box-shadow:0 50px 100px -50px rgba(0,0,0,.8)} #wf-home .wh-edificio::before{content:"";position:absolute;inset:0;z-index:-1;opacity:.35;mix-blend-mode:soft-light; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='220' height='220' filter='url(%23n)' opacity='.6'/%3E%3C/svg%3E")} #wf-home .wh-edificio::after{content:"";position:absolute;z-index:-1;left:var(--lx,50%);top:var(--ly,40%);width:520px;height:520px;margin:-260px 0 0 -260px; background:radial-gradient(circle,rgba(255,255,255,.22),transparent 65%);opacity:0;transition:opacity .4s;pointer-events:none} #wf-home .wh-edificio:hover::after{opacity:1} #wf-home .wh-edificio__total{text-align:center;color:#fff;margin-bottom:clamp(20px,3vw,36px)} #wf-home .wh-edificio__total b{display:block;font-size:clamp(48px,7.4vw,108px);font-weight:700;line-height:1;letter-spacing:-.02em} #wf-home .wh-edificio__total>span{display:block;font-size:clamp(20px,2.6vw,38px);font-weight:600;margin-top:6px} #wf-home .wh-edificio__grid{display:grid;grid-template-columns:1fr minmax(260px,1.1fr) 1fr;gap:clamp(12px,2vw,28px);align-items:center} #wf-home .wh-edificio__col{list-style:none;margin:0;padding:0;display:grid;gap:clamp(16px,2.4vw,30px)} #wf-home .wh-dato-e{position:relative;color:#fff;cursor:default;opacity:0;transform:translateX(-18px); transition:opacity .7s var(--e-out),transform .7s var(--e-out);transition-delay:calc(900ms + var(--i)*130ms)} #wf-home .wh-dato-e--der{transform:translateX(18px);padding-left:clamp(70px,7vw,110px)} #wf-home .wh-dato-e--izq{padding-right:clamp(70px,7vw,110px)} #wf-home .wh-edificio.is-visto .wh-dato-e{opacity:1;transform:none} #wf-home .wh-dato-e b{display:block;font-size:clamp(20px,2vw,30px);font-weight:700;line-height:1.1} #wf-home .wh-dato-e b span{font-size:1.25em} #wf-home .wh-dato-e small{display:block;font-size:clamp(13px,1vw,15px);font-weight:500;opacity:.92;margin-top:4px;line-height:1.35} #wf-home .wh-dato-e::after{content:"";position:absolute;top:1.1em;height:1px;width:clamp(50px,5.5vw,90px);background:rgba(255,255,255,.85); transform:scaleX(0);transition:transform .6s var(--e-out);transition-delay:calc(1100ms + var(--i)*130ms)} #wf-home .wh-dato-e--izq::after{right:0;transform-origin:right} #wf-home .wh-dato-e--der::after{left:0;transform-origin:left} #wf-home .wh-dato-e::before{content:"";position:absolute;top:calc(1.1em - 3px);width:7px;height:7px;border-radius:50%;background:#fff;opacity:0;transition:opacity .4s;transition-delay:calc(1300ms + var(--i)*130ms)} #wf-home .wh-dato-e--izq::before{right:clamp(50px,5.5vw,90px)} #wf-home .wh-dato-e--der::before{left:clamp(50px,5.5vw,90px)} #wf-home .wh-edificio.is-visto .wh-dato-e::after{transform:scaleX(1)} #wf-home .wh-edificio.is-visto .wh-dato-e::before{opacity:1} #wf-home .wh-dato-e:hover b{text-shadow:0 0 18px rgba(255,255,255,.7)} #wf-home .wh-edificio__dibujo svg{display:block;width:100%;height:auto;overflow:visible} #wf-home .wh-edificio__dibujo path{fill:none;stroke:#fff;stroke-width:2;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke; stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 2.2s var(--e-out)} #wf-home .wh-edificio__dibujo .wb-slat{stroke-width:1.1;opacity:.85;transition-duration:2.6s;transition-delay:.5s} #wf-home .wh-edificio.is-visto .wh-edificio__dibujo path{stroke-dashoffset:0} #wf-home .wh-edificio__dibujo svg{transition:filter .4s} #wf-home .wh-edificio:hover .wh-edificio__dibujo svg{filter:drop-shadow(0 0 8px rgba(255,255,255,.55))} @media (max-width:900px){ #wf-home .wh-edificio__grid{grid-template-columns:1fr 1fr} #wf-home .wh-edificio__dibujo{grid-column:1/-1;grid-row:1;max-width:360px;margin:0 auto 10px} #wf-home .wh-dato-e--izq,#wf-home .wh-dato-e--der{padding:0;transform:translateY(12px)} #wf-home .wh-dato-e::after,#wf-home .wh-dato-e::before{display:none} #wf-home .wh-dato-e b{font-size:19px} } /* ---------- Recorrido: video fijo + imágenes que bajan ---------- */ #wf-home .wh-recorrido{position:relative;background:var(--navy)} #wf-home .wh-recorrido__grid{display:grid;grid-template-columns:1fr 1fr} #wf-home .wh-recorrido__fijo{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden} #wf-home .wh-recorrido__video{position:absolute;inset:0;background:#001F2D url("https://embed-ssl.wistia.com/deliveries/0c5908f1608b1e68f4b313efc9eb73428cf40883.jpg") center/cover no-repeat} #wf-home .wh-recorrido__video .wistia_embed{position:absolute!important;inset:0;width:100%!important;height:100%!important} #wf-home .wh-recorrido__video video,#wf-home .wh-recorrido__video iframe{width:100%!important;height:100%!important;object-fit:cover} #wf-home .wh-recorrido__fijo::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(0deg,rgba(0,31,45,.85) 0%,rgba(0,31,45,0) 45%)} #wf-home .wh-recorrido__txt{position:absolute;left:clamp(24px,4vw,60px);right:24px;bottom:clamp(30px,5vw,64px);z-index:1} #wf-home .wh-recorrido__nota{color:rgba(255,255,255,.6);font-size:13px;margin-top:10px} #wf-home .wh-recorrido__fotos{display:grid;gap:clamp(14px,1.6vw,22px);padding:clamp(14px,1.6vw,22px)} #wf-home .wh-recorrido__fotos figure{position:relative;margin:0;border-radius:22px;overflow:hidden;aspect-ratio:4/3;background:#0b2a3a} #wf-home .wh-recorrido__fotos img{width:100%;height:100%;object-fit:cover;transform:scale(1.12);transition:transform 1.4s var(--e-out)} #wf-home .wh-recorrido__fotos figure.is-visto img{transform:scale(1)} #wf-home .wh-recorrido__fotos figure:hover img{transform:scale(1.04)} #wf-home .wh-recorrido__fotos figcaption{position:absolute;left:18px;bottom:16px;color:#fff;font-weight:600;font-size:14px; background:rgba(0,31,45,.55);backdrop-filter:blur(8px);padding:7px 14px;border-radius:999px} @media (max-width:820px){ #wf-home .wh-recorrido__grid{grid-template-columns:1fr} #wf-home .wh-recorrido__fijo{position:relative;height:72svh} } #wf-home .wh-recorrido .wh-kicker,#wf-home .wh-sec--hospital .wh-kicker{color:var(--azul)} /* Tarjetas con número que cuenta */ #wf-home [data-count]{font-variant-numeric:tabular-nums} /* ================= v5 ================= */ /* Hero: una onda protagonista; los ecos quedan atrás, delgados y tenues */ #wf-home .wh-pulso__eco{stroke:rgba(102,179,232,.16);stroke-width:1.1;filter:none} #wf-home .wh-pulso__eco2{stroke:rgba(255,255,255,.07);stroke-width:1} #wf-home .wh-pulso__main{stroke-width:2.6;filter:drop-shadow(0 0 8px rgba(102,179,232,.9))} /* Vitrina: segunda línea del título */ #wf-home .wh-bloque{display:block} #wf-home .wh-vit__slide.is-activo{cursor:pointer} /* Ubicación + Infraestructura como un solo bloque navy */ #wf-home #ubicacion{background:linear-gradient(180deg,#001F2D 0%,#00263A 100%)!important;padding-bottom:40px} #wf-home #hospital{background:linear-gradient(180deg,#00263A 0%,#003650 100%)!important;padding-top:72px} #wf-home #ubicacion .wh-h2{color:#fff!important} #wf-home #ubicacion .wh-sub{color:rgba(255,255,255,.75)!important} #wf-home #ubicacion .wh-mapa-g{box-shadow:0 40px 80px -40px rgba(0,0,0,.8);border:1px solid rgba(102,179,232,.25)} #wf-home #hospital .wh-split--hosp{padding-top:56px;border-top:1px solid rgba(102,179,232,.18)} /* Recorrido: el video se queda fijo mientras bajan las imágenes (controlado por JS) */ #wf-home .wh-recorrido__grid{position:relative;display:block} #wf-home .wh-recorrido__lado{position:absolute;top:0;left:0;bottom:0;width:50%;z-index:1} #wf-home .wh-recorrido__fijo{position:absolute!important;top:0;left:0;width:100%;height:100vh;height:100svh} #wf-home .wh-recorrido__fijo.is-fijo{position:fixed!important} #wf-home .wh-recorrido__fijo.is-abajo{top:auto;bottom:0} #wf-home .wh-recorrido__fotos{margin-left:50%;position:relative;z-index:0} @media (max-width:820px){ #wf-home .wh-recorrido__lado{width:100%} #wf-home .wh-recorrido__fijo{height:46svh} #wf-home .wh-recorrido__fotos{margin-left:0;padding-top:calc(46svh + 14px)} #wf-home .wh-recorrido__txt{bottom:18px} #wf-home .wh-recorrido__txt .wh-h2{font-size:26px} } /* v6: portada con una sola onda protagonista; las de fondo son lisas y casi transparentes */ #wf-home .wh-pulso__eco{stroke:rgba(102,179,232,.3)!important;stroke-width:1.2!important;filter:none!important} #wf-home .wh-pulso__eco2{stroke:rgba(255,255,255,.18)!important;stroke-width:1!important;filter:none!important} #wf-home .wh-pulso__main{stroke:#7CC0EE!important;stroke-width:2.8!important;filter:drop-shadow(0 0 10px rgba(102,179,232,.95))!important} /* v7: monitor de la línea de vida */ #wf-home .wh-monitor{position:relative;z-index:2;width:100%;height:160px;margin-top:56px} #wf-home .wh-monitor canvas{position:absolute;inset:0;width:100%;height:100%;display:block} #wf-home .wh-monitor__traza{filter:drop-shadow(0 0 5px rgba(102,179,232,.75))} @media (max-width:820px){#wf-home .wh-monitor{height:120px;margin-top:40px}} /* ================= v8 ================= */ /* Vitrina más grande */ #wf-home .wh-vit__slide{flex-basis:min(90vw / var(--zk,1),1480px,calc((100svh / var(--zk,1) - 330px) * 2))!important;aspect-ratio:16/8!important;border-radius:30px} #wf-home .wh-vit__marca{font-size:clamp(26px,3.2vw,46px)} #wf-home .wh-vit__pie p{font-size:clamp(16px,1.8vw,22px)} #wf-home .wh-vit__btn{font-size:17px;padding:14px 28px} @media (max-width:820px){#wf-home .wh-vit__slide{flex-basis:90vw!important;aspect-ratio:4/5.2!important}} /* Médicos: beneficios del médico socio */ #wf-home .wh-medben{position:relative;z-index:1;margin-top:clamp(64px,8vw,110px)} #wf-home .wh-medben__cabeza{margin-bottom:34px} #wf-home .wh-h3{font-size:clamp(26px,3vw,38px);line-height:1.15;font-weight:700;letter-spacing:-.015em;color:var(--navy)} #wf-home .wh-h3 span{color:var(--azul)} #wf-home .wh-medben__grid{display:grid;grid-template-columns:1.05fr 1fr;gap:22px;align-items:stretch} #wf-home .wh-consul{position:relative;margin:0;border-radius:26px;overflow:hidden;min-height:420px;isolation:isolate; background:linear-gradient(160deg,#00324A,var(--navy));transition:transform .5s var(--e-out)} #wf-home .wh-consul img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transform:scale(1.04);transition:transform 1.2s var(--e-out)} #wf-home .wh-consul:hover img{transform:scale(1.1)} #wf-home .wh-consul::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgba(0,31,45,.9) 0%,rgba(0,31,45,.15) 55%,rgba(0,31,45,0) 100%)} #wf-home .wh-consul__vacio{display:none;position:absolute;inset:0;z-index:-1;place-items:center;color:rgba(102,179,232,.35)} #wf-home .wh-consul__vacio svg{width:120px;height:120px} #wf-home .wh-consul.sin-imagen img{display:none} #wf-home .wh-consul.sin-imagen .wh-consul__vacio{display:grid} #wf-home .wh-consul figcaption{position:absolute;left:30px;right:30px;bottom:28px;color:#fff;text-align:left;margin:0;font-weight:400} #wf-home .wh-consul__badge{display:inline-block;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase; background:var(--azul);color:var(--navy);padding:6px 12px;border-radius:999px;margin-bottom:14px} #wf-home .wh-consul figcaption b{display:block;font-size:clamp(24px,2.6vw,34px);line-height:1.15;font-weight:700} #wf-home .wh-consul figcaption>span:last-child{display:block;margin-top:8px;color:rgba(255,255,255,.78);font-size:15.5px} #wf-home .wh-medben__lista{display:grid;grid-template-columns:1fr 1fr;gap:16px} #wf-home .wh-ben{background:#fff;border-radius:22px;padding:26px 24px;box-shadow:0 18px 44px -24px rgba(0,31,45,.28); transition:transform .45s var(--e-out),box-shadow .45s var(--e-out)} #wf-home .wh-ben:hover{transform:translateY(-5px);box-shadow:0 26px 54px -26px rgba(0,31,45,.38)} #wf-home .wh-ben .wh-ico{margin-bottom:16px} #wf-home .wh-ben h4{font-size:18px;font-weight:700;color:var(--navy);margin:0 0 6px;line-height:1.25} #wf-home .wh-ben p{font-size:14.5px;color:var(--suave);margin:0;line-height:1.55} @media (max-width:900px){ #wf-home .wh-medben__grid{grid-template-columns:1fr} #wf-home .wh-consul{min-height:340px} } @media (max-width:520px){#wf-home .wh-medben__lista{grid-template-columns:1fr}} /* Certeza jurídica + Equity: un solo bloque navy */ #wf-home #socios{background:linear-gradient(180deg,#001F2D 0%,#00263A 100%)!important;padding-bottom:56px} #wf-home #participacion{background:linear-gradient(180deg,#00263A 0%,#003650 100%)!important;padding-top:56px} #wf-home #participacion>.wh-wrap{padding-top:56px;border-top:1px solid rgba(102,179,232,.18)} #wf-home #socios .wh-h2{color:#fff!important} #wf-home #socios .wh-sub{color:rgba(255,255,255,.78)!important} #wf-home #socios .wh-kicker{color:var(--azul)} #wf-home #socios .wh-ecuacion__parte{background:rgba(255,255,255,.06)!important;box-shadow:none!important;border:1px solid rgba(102,179,232,.28)!important} #wf-home #socios .wh-ecuacion__parte b,#wf-home #socios .wh-ecuacion__parte span{color:#fff} #wf-home #socios .wh-ecuacion__parte small{color:rgba(255,255,255,.65)} /* Expansión: marcador con edificio */ #wf-home .wh-mapa__pins--edif .wh-pin::after{width:34px;height:34px;margin:-30px 0 0 -17px;border-radius:0;box-shadow:none; background:url("https://kajabi-storefronts-production.kajabi-cdn.com/kajabi-storefronts-production/file-uploads/themes/2167662706/settings_images/26af2dc-bec3-16aa-27a-d1b412d27fca_edificio_a.png") center bottom/contain no-repeat; filter:drop-shadow(0 6px 10px rgba(0,31,45,.35));animation:whEdifOn 6s ease-in-out infinite;animation-delay:var(--d,0s)} #wf-home .wh-mapa__pins--edif .wh-pin::before{width:26px;height:10px;margin:-5px 0 0 -13px;border-radius:50%;border:0; background:radial-gradient(ellipse,rgba(37,153,210,.55),transparent 70%);animation:whPinWave 6s ease-out infinite;animation-delay:var(--d,0s)} #wf-home .wh-mapa__pins--edif .wh-pin--sede::after{width:48px;height:48px;margin:-44px 0 0 -24px;animation:none;opacity:1; filter:drop-shadow(0 8px 14px rgba(0,31,45,.45))} #wf-home .wh-mapa__pins--edif .wh-pin i{bottom:36px} #wf-home .wh-mapa__pins--edif .wh-pin--sede i{bottom:50px} @keyframes whEdifOn{0%,12%{opacity:.35;transform:translateY(4px) scale(.85)}22%{opacity:1;transform:translateY(-3px) scale(1.08)}45%{opacity:1;transform:none}70%,100%{opacity:.35;transform:translateY(4px) scale(.85)}} /* Testimonios: controles propios, minimalistas */ #wf-home .wh-video{position:relative;border-radius:22px;background:#0b2a3a} #wf-home .wh-video .wistia_embed{position:absolute!important;inset:0;width:100%!important;height:100%!important} #wf-home .wh-video::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit; background:linear-gradient(0deg,rgba(0,31,45,.65) 0%,rgba(0,31,45,0) 38%);transition:opacity .4s} #wf-home .wh-video.is-play::after{opacity:0} #wf-home .wh-vplay{position:absolute;inset:0;z-index:3;margin:auto;width:64px;height:64px;border-radius:50%;border:1px solid rgba(255,255,255,.45); display:grid;place-items:center;cursor:pointer;color:#fff; background:rgba(255,255,255,.14);backdrop-filter:blur(14px) saturate(1.4);-webkit-backdrop-filter:blur(14px) saturate(1.4); box-shadow:0 12px 30px -12px rgba(0,0,0,.6);transition:transform .35s var(--e-out),opacity .35s,background .3s} #wf-home .wh-vplay svg{width:24px;height:24px;fill:currentColor} #wf-home .wh-vplay .i-pausa{display:none} #wf-home .wh-video:hover .wh-vplay{transform:scale(1.08);background:rgba(102,179,232,.35)} #wf-home .wh-video.is-play .wh-vplay{opacity:0} #wf-home .wh-video.is-play:hover .wh-vplay{opacity:1} #wf-home .wh-video.is-play .wh-vplay .i-play{display:none} #wf-home .wh-video.is-play .wh-vplay .i-pausa{display:inline} #wf-home .wh-vctl{position:absolute;left:14px;right:14px;bottom:14px;z-index:4;display:flex;align-items:center;gap:10px; opacity:.9;transition:opacity .3s} #wf-home .wh-vtime{font-size:11.5px;font-weight:600;color:#fff;font-variant-numeric:tabular-nums;min-width:30px;text-shadow:0 1px 4px rgba(0,0,0,.5)} #wf-home .wh-vbar{position:relative;flex:1;height:3px;border-radius:99px;background:rgba(255,255,255,.28);cursor:pointer;transition:height .25s} #wf-home .wh-vbar::before{content:"";position:absolute;left:0;right:0;top:-10px;bottom:-10px} #wf-home .wh-vbar i{position:absolute;left:0;top:0;bottom:0;width:100%;border-radius:inherit;background:#fff;transform-origin:0 50%;transform:scaleX(0)} #wf-home .wh-video:hover .wh-vbar{height:5px} /* v9: alturas de pantalla completas compensan la escala de laptops */ #wf-home .wh-recorrido__fijo{height:calc(100vh / var(--zk,1));height:calc(100svh / var(--zk,1))} @media (max-width:820px){#wf-home .wh-recorrido__fijo{height:46svh}} /* ================= v10 ================= */ /* Hero a pantalla completa: lo blanco aparece solo al hacer scroll */ #wf-home .wh-hero{display:flex;flex-direction:column;min-height:calc(100vh / var(--zk,1));min-height:calc(100svh / var(--zk,1))} #wf-home .wh-hero__in{margin-top:auto;margin-bottom:auto;width:100%} #wf-home .wh-monitor{margin-top:40px;flex:none} /* Cómo participar: solo cambio de color con el scroll */ #wf-home #participa{--p:0;background:color-mix(in srgb,#D6EBFA calc(var(--p)*100%),#fff)!important} /* Vitrina: la miniatura de membresías se ve completa, con fondo difuminado */ #wf-home .wh-vit__slide--contain{background:#8a959d!important} #wf-home .wh-vit__slide>.wh-vit__fondo,#wf-home .wh-vit__slide>.wh-vit__foto{position:absolute!important;inset:0;z-index:0;pointer-events:none} #wf-home .wh-vit__fondo{background:var(--img) center/cover no-repeat;filter:blur(28px) saturate(1.1);transform:scale(1.2);opacity:.9} #wf-home .wh-vit__foto{background:var(--img) center/contain no-repeat} #wf-home .wh-vit__slide::before{z-index:1} #wf-home .wh-vit__top,#wf-home .wh-vit__pie{z-index:2} #wf-home .wh-cifra b span{display:inline!important;font-size:inherit!important;font-weight:inherit!important;margin:0!important;color:inherit!important} /* Médicos: líneas de vida que reaccionan al cursor */ #wf-home #medicos{position:relative;overflow:hidden} #wf-home .wh-lineas{position:absolute;left:0;right:0;top:0;height:100%;width:100%;z-index:0;pointer-events:none;overflow:visible; -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)} #wf-home .wh-lineas path{fill:none;stroke-linecap:round;vector-effect:non-scaling-stroke} #wf-home #medicos>.wh-wrap{position:relative;z-index:1} #wf-home #medicos{cursor:pointer} #wf-home #medicos p,#wf-home #medicos blockquote{cursor:auto} #wf-home .wh-medben__cta{display:flex;justify-content:center;margin-top:40px} #wf-home .wh-consul::after{background:linear-gradient(0deg,rgba(0,31,45,.92) 0%,rgba(0,31,45,.35) 50%,rgba(0,31,45,.05) 100%)} /* Títulos en dos renglones */ @media (min-width:821px){ #wf-home .wh-2l>span{display:block;white-space:nowrap} #wf-home #socios .wh-cabeza{max-width:1000px} #wf-home #socios .wh-sub{max-width:760px;margin-left:auto;margin-right:auto} #wf-home .wh-2l--sm{font-size:clamp(28px,3vw,40px)} } #wf-home .wh-2l .wh-l1{color:inherit!important} #wf-home .wh-sinw::after{display:none!important} /* Expansión: los edificios caen, desaparecen y vuelven a caer */ #wf-home .wh-mapa__pins--edif .wh-pin:not(.wh-pin--sede)::after{transform-origin:50% 100%;animation:whCae 6s cubic-bezier(.3,.7,.4,1) infinite;animation-delay:var(--d,0s)} #wf-home .wh-mapa__pins--edif .wh-pin:not(.wh-pin--sede)::before{animation:whSombra 6s ease-out infinite;animation-delay:var(--d,0s)} @keyframes whCae{ 0%{opacity:0;transform:translateY(-90px)} 8%{opacity:1} 14%{opacity:1;transform:translateY(0) scale(1,1)} 17%{transform:translateY(0) scale(1.14,.84)} 21%{transform:translateY(-8px) scale(.96,1.05)} 25%,64%{opacity:1;transform:none} 74%{opacity:0;transform:scale(.8)} 100%{opacity:0;transform:translateY(-90px)} } @keyframes whSombra{0%,10%{opacity:0;transform:scale(.3)}15%{opacity:.9;transform:scale(1.4)}30%,64%{opacity:.5;transform:scale(1)}74%,100%{opacity:0;transform:scale(.6)}} /* Testimonios con fondo blanco-W de marca */ #wf-home #testimonios{background:#fff url("https://kajabi-storefronts-production.kajabi-cdn.com/kajabi-storefronts-production/file-uploads/themes/2167662706/settings_images/ea4adcb-3b3-6b73-efa-eca1138b703_Blanco-w.png") center/cover no-repeat!important} /* ---------- Membresías: más vida ---------- */ #wf-home .wh-sec--memb{position:relative;overflow:hidden;background:linear-gradient(180deg,#F4F9FD 0%,#EAF4FB 100%)} #wf-home .wh-memb-halo{position:absolute;inset:0;pointer-events:none;z-index:0} #wf-home .wh-memb-halo i{position:absolute;border-radius:50%;filter:blur(90px);opacity:.55;animation:whFlota 24s ease-in-out infinite} #wf-home .wh-memb-halo i:nth-child(1){width:520px;height:520px;right:-120px;top:-160px;background:rgba(43,154,201,.35)} #wf-home .wh-memb-halo i:nth-child(2){width:420px;height:420px;right:18%;top:120px;background:rgba(147,206,94,.28);animation-duration:30s;animation-direction:reverse} #wf-home .wh-memb-halo i:nth-child(3){width:460px;height:460px;left:-160px;bottom:-120px;background:rgba(92,192,227,.25);animation-duration:27s} #wf-home .wh-sec--memb>.wh-wrap{position:relative;z-index:1} #wf-home .wh-memb-acciones{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:30px} #wf-home .wh-memb-nota{font-size:14px;font-weight:600;color:var(--azul-f)} /* Logo de membresías recreado: tres círculos vivos */ #wf-home .wh-circulos{position:relative;--cx:0;--cy:0;padding:30px 0 50px} #wf-home .wh-circulos svg{display:block;width:100%;height:auto;overflow:visible} #wf-home .wh-c{transform-box:fill-box;transform-origin:center;transition:transform .9s var(--e-out),filter .6s} #wf-home .wh-c--1{animation:whC1 7s ease-in-out infinite} #wf-home .wh-c--2{animation:whC2 8s ease-in-out infinite} #wf-home .wh-c--3{animation:whC3 6.5s ease-in-out infinite} @keyframes whC1{0%,100%{translate:0 0}50%{translate:0 -10px}} @keyframes whC2{0%,100%{translate:0 -4px;rotate:0deg}50%{translate:0 8px;rotate:180deg}} @keyframes whC3{0%,100%{translate:0 6px}50%{translate:0 -8px}} #wf-home .wh-circulos .wh-c--1{transform:translate(calc(var(--cx)*-18px),calc(var(--cy)*-10px))} #wf-home .wh-circulos .wh-c--2{transform:translate(calc(var(--cx)*10px),calc(var(--cy)*12px))} #wf-home .wh-circulos .wh-c--3{transform:translate(calc(var(--cx)*24px),calc(var(--cy)*-14px))} #wf-home .wh-circulos:hover .wh-c--1{transform:translate(calc(var(--cx)*-18px - 18px),calc(var(--cy)*-10px)) scale(1.06)} #wf-home .wh-circulos:hover .wh-c--3{transform:translate(calc(var(--cx)*24px + 18px),calc(var(--cy)*-14px)) scale(1.06)} #wf-home .wh-circulos:hover .wh-c{filter:drop-shadow(0 14px 22px rgba(0,69,99,.3))} #wf-home .wh-circulos__piso{position:absolute;left:10%;right:10%;bottom:18px;height:26px;border-radius:50%; background:radial-gradient(ellipse,rgba(0,69,99,.22),transparent 70%);filter:blur(4px);animation:whPiso 7s ease-in-out infinite} @keyframes whPiso{0%,100%{transform:scaleX(1);opacity:.8}50%{transform:scaleX(.9);opacity:.55}} /* Familia */ #wf-home .wh-familia{margin-top:clamp(60px,7vw,100px);text-align:center} #wf-home .wh-familia__grid{display:grid;grid-template-columns:1fr minmax(240px,340px) 1fr;gap:clamp(18px,3vw,44px);align-items:center;margin-top:40px} #wf-home .wh-fam-lista{list-style:none;margin:0;padding:0;display:grid;gap:14px;text-align:left} #wf-home .wh-fam-lista__tit{font-size:13px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;padding:0 0 4px 4px} #wf-home .wh-fam-lista--salud .wh-fam-lista__tit{color:var(--azul-f)} #wf-home .wh-fam-lista--pat .wh-fam-lista__tit{color:#3E9A4E} #wf-home .wh-fam-lista li:not(.wh-fam-lista__tit){position:relative;background:#fff;border-radius:18px;padding:18px 20px 18px 56px; box-shadow:0 16px 36px -24px rgba(0,31,45,.35);transition:transform .4s var(--e-out),box-shadow .4s} #wf-home .wh-fam-lista li:not(.wh-fam-lista__tit)::before{content:"";position:absolute;left:20px;top:22px;width:20px;height:20px;border-radius:50%; background:var(--azul) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E") center/12px no-repeat} #wf-home .wh-fam-lista--pat li:not(.wh-fam-lista__tit)::before{background-color:#5BAF4E} #wf-home .wh-fam-lista li:hover{transform:translateY(-3px);box-shadow:0 22px 44px -24px rgba(0,31,45,.45)} #wf-home .wh-fam-lista b{display:block;color:var(--navy);font-size:16px} #wf-home .wh-fam-lista span{display:block;color:var(--suave);font-size:14px;margin-top:2px;line-height:1.45} #wf-home .wh-fam-dibujo{position:relative;aspect-ratio:1;border-radius:50%;display:grid;place-items:center; background:radial-gradient(circle at 35% 30%,#2E86C0 0%,#00456A 60%,#001F2D 100%);box-shadow:0 40px 80px -40px rgba(0,31,45,.7)} #wf-home .wh-fam-dibujo svg{width:72%;height:auto;overflow:visible} #wf-home .wh-fam-p circle,#wf-home .wh-fam-p path,#wf-home .wh-fam-suelo{fill:none;stroke:#fff;stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round; transition:stroke .4s,filter .4s} #wf-home .wh-fam-suelo{stroke:rgba(255,255,255,.35);stroke-width:2} #wf-home .wh-fam-p{animation:whRespiraP 4s ease-in-out infinite;transform-box:fill-box;transform-origin:50% 100%} #wf-home .wh-fam-p--2{animation-delay:-1s}#wf-home .wh-fam-p--3{animation-delay:-2s}#wf-home .wh-fam-p--4{animation-delay:-3s} @keyframes whRespiraP{0%,100%{transform:scaleY(1)}50%{transform:scaleY(1.03)}} #wf-home .wh-fam-dibujo.is-salud .wh-fam-p circle,#wf-home .wh-fam-dibujo.is-salud .wh-fam-p path{stroke:#8CCBF2;filter:drop-shadow(0 0 6px rgba(102,179,232,.9))} #wf-home .wh-fam-dibujo.is-pat .wh-fam-p circle,#wf-home .wh-fam-dibujo.is-pat .wh-fam-p path{stroke:#A6DB77;filter:drop-shadow(0 0 6px rgba(147,206,94,.9))} #wf-home .wh-fam-onda{position:absolute;inset:0;border-radius:50%;border:2px solid rgba(102,179,232,.5);animation:whOndaF 3.6s ease-out infinite;pointer-events:none} #wf-home .wh-fam-onda+.wh-fam-onda{animation-delay:1.8s;border-color:rgba(147,206,94,.45)} @keyframes whOndaF{0%{transform:scale(1);opacity:.9}100%{transform:scale(1.35);opacity:0}} #wf-home .wh-fam-nota{margin-top:22px;font-size:13px;color:var(--suave)} /* Datos: 900+ que cambia de color y 30 años */ #wf-home .wh-memb-datos{display:grid;grid-template-columns:1fr 1.25fr;gap:22px;margin-top:clamp(50px,6vw,80px)} #wf-home .wh-dato--vivo{position:relative;overflow:hidden;color:#fff;border-radius:26px;padding:40px 38px; background:linear-gradient(120deg,#001F2D,#0C4F77,#2599D2,#4DAAB4,#0C4F77,#001F2D);background-size:400% 400%;animation:whColor 14s ease-in-out infinite} @keyframes whColor{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}} #wf-home .wh-dato--vivo b{display:block;font-size:clamp(76px,9vw,132px);line-height:.95;font-weight:800;letter-spacing:.02em;color:#fff} #wf-home .wh-dato--vivo b span{display:inline!important;font-size:inherit!important;font-weight:inherit!important;margin:0!important;letter-spacing:.03em} #wf-home .wh-dato--vivo>span{display:block;font-size:21px;font-weight:600;margin-top:14px} #wf-home .wh-dato--vivo small{display:block;margin-top:10px;font-size:15px;color:rgba(255,255,255,.8)} #wf-home .wh-treinta{background:#fff;border-radius:26px;padding:36px 38px;box-shadow:0 20px 50px -28px rgba(0,31,45,.35)} #wf-home .wh-treinta__num{display:flex;align-items:baseline;gap:12px} #wf-home .wh-treinta__num b{font-size:clamp(64px,7vw,104px);font-weight:800;line-height:.95;letter-spacing:.01em; background:linear-gradient(120deg,#2B9AC9,#5CC0E3 45%,#6DBB54);-webkit-background-clip:text;background-clip:text;color:transparent} #wf-home .wh-treinta__num>span{font-size:26px;font-weight:700;color:var(--navy)} #wf-home .wh-treinta>p{margin-top:8px;color:var(--suave);font-size:16px;max-width:44ch} #wf-home .wh-treinta__linea{list-style:none;padding:0;margin:26px 0 0;display:grid;grid-template-columns:repeat(3,1fr);position:relative} #wf-home .wh-treinta__linea::before{content:"";position:absolute;left:8px;right:8px;top:8px;height:3px;border-radius:3px; background:linear-gradient(90deg,#2B9AC9,#5CC0E3,#6DBB54);transform-origin:left;transform:scaleX(0);transition:transform 1.6s var(--e-out) .3s} #wf-home .wh-treinta.is-visto .wh-treinta__linea::before{transform:scaleX(1)} #wf-home .wh-treinta__linea li{position:relative;padding-top:28px;padding-right:10px} #wf-home .wh-treinta__linea i{position:absolute;left:0;top:0;width:19px;height:19px;border-radius:50%;background:#fff;border:3px solid #2B9AC9} #wf-home .wh-treinta__linea li:nth-child(2) i{border-color:#5CC0E3} #wf-home .wh-treinta__linea li:nth-child(3) i{border-color:#6DBB54;background:#6DBB54} #wf-home .wh-treinta__linea b{display:block;font-size:15px;color:var(--navy)} #wf-home .wh-treinta__linea span{display:block;font-size:13.5px;color:var(--suave);line-height:1.4;margin-top:2px} @media (max-width:900px){ #wf-home .wh-familia__grid{grid-template-columns:1fr} #wf-home .wh-fam-dibujo{max-width:260px;margin:0 auto;grid-row:1} #wf-home .wh-memb-datos{grid-template-columns:1fr} } @media (max-width:520px){#wf-home .wh-treinta__linea{grid-template-columns:1fr;gap:14px}#wf-home .wh-treinta__linea::before{display:none}} /* ================= v11: texto de la vitrina ================= */ #wf-home .wh-vit__slide::before{background: linear-gradient(90deg,rgba(0,20,30,.88) 0%,rgba(0,20,30,.6) 34%,rgba(0,20,30,.12) 62%,rgba(0,20,30,0) 78%), linear-gradient(0deg,rgba(0,20,30,.55) 0%,rgba(0,20,30,0) 45%)!important} #wf-home .wh-vit__txt{position:absolute!important;z-index:2;left:clamp(26px,4vw,64px);bottom:clamp(26px,4vw,56px);max-width:min(58%,640px);color:#fff} #wf-home .wh-vit__eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;font-weight:600;letter-spacing:.18em;text-transform:uppercase; padding:8px 14px;border-radius:999px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.28); backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)} #wf-home .wh-vit__eyebrow::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--azul);box-shadow:0 0 10px var(--azul)} #wf-home .wh-vit__tit{margin:18px 0 0;font-size:clamp(44px,5.6vw,92px);font-weight:800;line-height:.92;letter-spacing:-.035em;color:#fff!important; text-shadow:0 6px 30px rgba(0,0,0,.35)} #wf-home .wh-vit__tit span{display:block} #wf-home .wh-vit__tit span+span{font-weight:300;font-style:italic;letter-spacing:-.02em; background:linear-gradient(90deg,#8CCBF2,#66B3E8 55%,#B6E0F7);-webkit-background-clip:text;background-clip:text;color:transparent!important; padding-right:.08em} #wf-home .wh-vit__lema{margin:18px 0 0;font-size:clamp(17px,1.6vw,23px);font-weight:500;line-height:1.35;color:rgba(255,255,255,.92);max-width:28ch} #wf-home .wh-vit__acc{display:flex;align-items:center;gap:22px;margin-top:26px;flex-wrap:wrap} #wf-home .wh-vit__mas{font-size:15px;font-weight:600;color:#fff;opacity:.85} #wf-home .wh-vit__mas i{font-style:normal;display:inline-block;transition:transform .35s var(--e-out)} #wf-home .wh-vit__slide.is-activo:hover .wh-vit__mas i{transform:translateX(6px)} /* entrada escalonada cuando la tarjeta queda al frente */ #wf-home .wh-vit__txt>*{opacity:0;transform:translateY(22px);transition:opacity .7s var(--e-out),transform .7s var(--e-out)} #wf-home .wh-vit__slide.is-activo .wh-vit__txt>*{opacity:1;transform:none} #wf-home .wh-vit__slide.is-activo .wh-vit__tit{transition-delay:.12s} #wf-home .wh-vit__slide.is-activo .wh-vit__lema{transition-delay:.24s} #wf-home .wh-vit__slide.is-activo .wh-vit__acc{transition-delay:.34s} /* el fondo se acerca un poco al pasar el cursor */ #wf-home .wh-vit__slide{background-size:cover;transition:opacity .7s var(--e-out),transform .7s var(--e-out),background-size 1.2s var(--e-out)} @media (max-width:820px){ #wf-home .wh-vit__slide::before{background:linear-gradient(0deg,rgba(0,20,30,.9) 0%,rgba(0,20,30,.55) 45%,rgba(0,20,30,0) 75%)!important} #wf-home .wh-vit__txt{left:22px;right:22px;bottom:24px;max-width:none} #wf-home .wh-vit__tit{font-size:clamp(38px,11vw,52px)} #wf-home .wh-vit__eyebrow{font-size:11px;padding:7px 12px} } /* ================= v12 ================= */ /* Cómo participar: el fondo se oscurece de verdad al llegar al centro */ #wf-home #participa{background:color-mix(in srgb,#0E3B58 calc(var(--p)*100%),#fff)!important} #wf-home #participa .wh-h2{color:color-mix(in srgb,#fff calc(var(--p)*100%),var(--navy))!important} #wf-home #participa .wh-sub{color:color-mix(in srgb,rgba(255,255,255,.8) calc(var(--p)*100%),var(--suave))!important} #wf-home #participa .wh-kicker{color:color-mix(in srgb,var(--azul) calc(var(--p)*100%),var(--azul-f))} #wf-home #participa .wh-prod--navy{box-shadow:0 0 0 1px rgba(102,179,232,.28),0 24px 50px -26px rgba(0,0,0,.6)!important} /* sin logo en las tarjetas */ #wf-home .wh-prod::after{display:none!important} /* Vitrina: la tarjeta de membresías llena todo el recuadro, sin franjas grises */ #wf-home .wh-vit__slide--contain .wh-vit__fondo{display:none} #wf-home .wh-vit__slide--contain .wh-vit__foto{background-size:cover;background-position:center} /* 30 años: círculos al inicio, en medio y al final de la línea */ #wf-home .wh-treinta__linea::before{left:9px;right:9px} #wf-home .wh-treinta__linea li:nth-child(2){text-align:center;padding-right:0} #wf-home .wh-treinta__linea li:nth-child(2) i{left:50%;transform:translateX(-50%)} #wf-home .wh-treinta__linea li:nth-child(3){text-align:right;padding-right:0} #wf-home .wh-treinta__linea li:nth-child(3) i{left:auto;right:0} @media (max-width:520px){ #wf-home .wh-treinta__linea li:nth-child(n){text-align:left} #wf-home .wh-treinta__linea li:nth-child(n) i{left:0;right:auto;transform:none} } /* ================= v14: línea de vida del hero (trazo de marca) ================= */ #wf-home .wh-vida{position:relative;z-index:1;pointer-events:none;display:block;width:100%;height:320px;margin-top:-70px;flex:none;overflow:visible; -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 5%,#000 95%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0%,#000 5%,#000 95%,transparent 100%)} #wf-home .wh-vida path{fill:none;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke} #wf-home .wh-vida__main{stroke-width:4.2px;filter:drop-shadow(0 0 8px rgba(102,179,232,.55))} #wf-home .wh-hero{cursor:default} @media (max-width:820px){#wf-home .wh-vida{height:220px;margin-top:-30px}#wf-home .wh-vida__main{stroke-width:3.2px}} /* ================= v16 ================= */ /* Cómo participar: mismo color fijo que la portada */ #wf-home #participa.wh-sec--fija{background:#001F2D!important} #wf-home #participa .wh-h2{color:#fff!important} #wf-home #participa .wh-sub{color:rgba(255,255,255,.78)!important} #wf-home #participa .wh-kicker{color:var(--azul)!important} /* Vitrina: flechas minimalistas a los costados */ #wf-home .wh-vit__slide,#wf-home .wh-vit__slide.is-activo{cursor:default} #wf-home .wh-vit__flecha{position:absolute;top:50%;z-index:5;width:56px;height:56px;margin-top:-28px;border-radius:50%;cursor:pointer; display:grid;place-items:center;color:#fff;border:1px solid rgba(255,255,255,.35); background:rgba(255,255,255,.12);backdrop-filter:blur(16px) saturate(1.4);-webkit-backdrop-filter:blur(16px) saturate(1.4); box-shadow:0 14px 34px -14px rgba(0,0,0,.55);transition:transform .35s var(--e-out),background .3s,border-color .3s,opacity .3s} #wf-home .wh-vit__flecha svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .35s var(--e-out)} #wf-home .wh-vit__flecha--prev{left:calc((100% - min(90vw / var(--zk,1),1480px,calc((100svh / var(--zk,1) - 330px) * 2))) / 2 - 28px)} #wf-home .wh-vit__flecha--sig{right:calc((100% - min(90vw / var(--zk,1),1480px,calc((100svh / var(--zk,1) - 330px) * 2))) / 2 - 28px)} #wf-home .wh-vit__flecha:hover{background:rgba(255,255,255,.95);color:var(--navy);border-color:#fff;transform:scale(1.06)} #wf-home .wh-vit__flecha--prev:hover svg{transform:translateX(-2px)} #wf-home .wh-vit__flecha--sig:hover svg{transform:translateX(2px)} #wf-home .wh-vit__flecha:active{transform:scale(.96)} @media (max-width:820px){ #wf-home .wh-vit__flecha{width:42px;height:42px;margin-top:-21px} #wf-home .wh-vit__flecha--prev{left:10px}#wf-home .wh-vit__flecha--sig{right:10px} } /* Edificio: conectores que llegan hasta el contorno del hospital */ @media (min-width:901px){ #wf-home .wh-dato-e--izq{padding-right:0!important} #wf-home .wh-dato-e--der{padding-left:0!important} #wf-home .wh-dato-e--izq::after{right:auto!important;left:calc(100% + 14px);width:var(--largo,60px)!important;transform-origin:left!important} #wf-home .wh-dato-e--der::after{left:auto!important;right:calc(100% + 14px);width:var(--largo,60px)!important;transform-origin:right!important} #wf-home .wh-dato-e--izq::before{right:auto!important;left:calc(100% + 11px)} #wf-home .wh-dato-e--der::before{left:auto!important;right:calc(100% + 11px)} #wf-home .wh-edificio__grid{grid-template-columns:minmax(0,.8fr) minmax(300px,1.2fr) minmax(0,.8fr)} } /* Cuerpo médico: línea de vida de marca con aire arriba y abajo */ #wf-home .wh-vida-med{position:relative;z-index:1;margin:-10px 0 clamp(10px,2vw,30px)} #wf-home .wh-vida--claro{margin-top:0!important} #wf-home .wh-vida--claro .wh-vida__main{filter:drop-shadow(0 0 6px rgba(102,179,232,.35))} #wf-home .wh-medben{margin-top:clamp(20px,3vw,40px)!important} /* ================= v17: Testimonios, W que se revela con el cursor ================= */ #wf-home #testimonios{background:#fff!important;position:relative;overflow:hidden} #wf-home .wh-revela{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;display:block} #wf-home #testimonios>.wh-wrap{position:relative;z-index:1} /* ================= v18 ================= */ /* Vitrina: tarjetas laterales clicables y flechas separadas de los bordes */ #wf-home .wh-vit__slide:not(.is-activo){cursor:pointer} #wf-home .wh-vit__slide:not(.is-activo):hover{opacity:.62} @media (min-width:821px){ #wf-home .wh-vit__flecha--prev{left:calc((100% - min(90vw / var(--zk,1),1480px,calc((100svh / var(--zk,1) - 330px) * 2))) / 4 - 28px)!important} #wf-home .wh-vit__flecha--sig{right:calc((100% - min(90vw / var(--zk,1),1480px,calc((100svh / var(--zk,1) - 330px) * 2))) / 4 - 28px)!important} } /* Expansión: mapa más grande */ @media (min-width:1025px){ #wf-home .wh-split--mapa{grid-template-columns:.72fr 1.28fr!important;gap:clamp(28px,4vw,56px)} #wf-home .wh-mapa{margin-right:clamp(-120px,-6vw,-40px);transform-origin:left center} #wf-home #expansion .wh-marcas{grid-template-columns:1fr;max-width:420px} } #wf-home .wh-mapa__pins--edif .wh-pin:not(.wh-pin--sede)::after{width:46px!important;height:46px!important;margin:-41px 0 0 -23px!important} #wf-home .wh-mapa__pins--edif .wh-pin--sede::after{width:64px!important;height:64px!important;margin:-58px 0 0 -32px!important} #wf-home .wh-mapa__pins--edif .wh-pin::before{width:34px;height:12px;margin:-6px 0 0 -17px} #wf-home .wh-mapa__pins--edif .wh-pin i{bottom:48px!important;font-size:12.5px;padding:6px 12px} #wf-home .wh-mapa__pins--edif .wh-pin--sede i{bottom:66px!important} @media (max-width:820px){ #wf-home .wh-mapa__pins--edif .wh-pin:not(.wh-pin--sede)::after{width:30px!important;height:30px!important;margin:-27px 0 0 -15px!important} #wf-home .wh-mapa__pins--edif .wh-pin--sede::after{width:42px!important;height:42px!important;margin:-38px 0 0 -21px!important} #wf-home .wh-mapa__pins--edif .wh-pin--sede i{bottom:44px!important} } /* v19: transición portada → Cómo participar sin cortes */ #wf-home .wh-hero .wh-vida{ -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 5%,#000 95%,transparent 100%),linear-gradient(180deg,#000 0%,#000 82%,transparent 100%); -webkit-mask-composite:source-in; mask-image:linear-gradient(90deg,transparent 0%,#000 5%,#000 95%,transparent 100%),linear-gradient(180deg,#000 0%,#000 82%,transparent 100%); mask-composite:intersect} #wf-home .wh-hero__velo{background: linear-gradient(90deg,rgba(0,31,45,.92) 0%,rgba(0,31,45,.75) 45%,rgba(0,31,45,.35) 100%), linear-gradient(0deg,#001F2D 0%,rgba(0,31,45,.85) 12%,rgba(0,31,45,0) 40%)!important} @media (max-width:820px){#wf-home .wh-hero__velo{background:linear-gradient(180deg,rgba(0,31,45,.7) 0%,rgba(0,31,45,.88) 60%,#001F2D 100%)!important}} /* ================= v21: beneficios de Membresías Médicas en tarjetas con foto deslizantes ================= */ #wf-home .wh-medslider{position:relative;margin-top:6px} #wf-home .wh-medslider__pista{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none; padding:10px 24px 34px;margin:0 -24px;cursor:grab;scroll-behavior:smooth;-webkit-overflow-scrolling:touch; /* la pista llega hasta el borde derecho de la pantalla: las tarjetas asoman en vez de cortarse */ margin-right:calc((100% - 100vw / var(--zk,1)) / 2 - 24px);padding-right:calc((100vw / var(--zk,1) - 100%) / 2 + 24px)} #wf-home .wh-medslider__pista::-webkit-scrollbar{display:none} #wf-home .wh-medslider__pista.is-arrastre{cursor:grabbing;scroll-snap-type:none;scroll-behavior:auto} #wf-home .wh-medcard{position:relative;flex:0 0 clamp(270px,26vw,340px);height:clamp(380px,34vw,460px);margin:0;border-radius:26px;overflow:hidden; scroll-snap-align:start;isolation:isolate;background:linear-gradient(160deg,#00324A,var(--navy)); box-shadow:0 24px 50px -30px rgba(0,31,45,.6);transition:transform .5s var(--e-out),box-shadow .5s var(--e-out)} #wf-home .wh-medcard--destacada{flex-basis:clamp(320px,34vw,470px)} #wf-home .wh-medcard img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transform:scale(1.05);transition:transform 1.2s var(--e-out);user-select:none} #wf-home .wh-medcard::after{content:"";position:absolute;inset:0;z-index:-1; background:linear-gradient(0deg,rgba(0,31,45,.95) 0%,rgba(0,31,45,.55) 45%,rgba(0,31,45,.08) 75%,rgba(0,31,45,0) 100%)} #wf-home .wh-medcard:hover{transform:translateY(-6px);box-shadow:0 34px 64px -30px rgba(0,31,45,.75)} #wf-home .wh-medcard:hover img{transform:scale(1.12)} #wf-home .wh-medcard figcaption{position:absolute;left:26px;right:26px;bottom:26px;color:#fff;text-align:left;margin:0;font-weight:400} #wf-home .wh-medcard .wh-ico{width:46px;height:46px;border-radius:14px;margin-bottom:16px;color:#fff; background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.25);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)} #wf-home .wh-medcard .wh-ico svg{width:22px;height:22px} #wf-home .wh-medcard__badge{display:inline-block;font-size:11.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase; background:var(--azul);color:var(--navy);padding:5px 11px;border-radius:999px;margin-bottom:12px} #wf-home .wh-medcard figcaption b{display:block;font-size:clamp(21px,2vw,27px);line-height:1.15;font-weight:700;color:#fff} #wf-home .wh-medcard--destacada figcaption b{font-size:clamp(24px,2.5vw,32px)} #wf-home .wh-medcard__txt{display:block;margin-top:8px;font-size:14.5px;line-height:1.5;color:rgba(255,255,255,.8)} #wf-home .wh-medslider__ctl{display:flex;align-items:center;gap:12px;margin-top:6px} #wf-home .wh-medslider__barra{flex:1;height:3px;border-radius:3px;background:rgba(0,31,45,.1);overflow:hidden;margin-right:10px} #wf-home .wh-medslider__barra i{display:block;height:100%;width:30%;border-radius:3px;background:linear-gradient(90deg,var(--azul-f),var(--azul)); transform-origin:left;transition:transform .2s linear} #wf-home .wh-medslider__btn{width:48px;height:48px;border-radius:50%;border:1px solid rgba(0,31,45,.14);background:#fff;color:var(--navy); cursor:pointer;display:grid;place-items:center;box-shadow:0 10px 24px -14px rgba(0,31,45,.45);transition:background .3s,color .3s,transform .3s var(--e-out)} #wf-home .wh-medslider__btn svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round} #wf-home .wh-medslider__btn:hover{background:var(--navy);color:#fff;transform:scale(1.06)} #wf-home .wh-medslider__btn:disabled{opacity:.35;cursor:default;transform:none;background:#fff;color:var(--navy)} @media (max-width:820px){ #wf-home .wh-medcard,#wf-home .wh-medcard--destacada{flex-basis:78vw;height:420px} #wf-home .wh-medslider__btn{display:none} } /* ================= v22: tarjetas de médico socio en ciclo infinito ================= */ #wf-home .wh-medrueda{position:relative;overflow:hidden;margin-top:10px;padding:26px 0 8px; margin-left:calc((100% - 100vw / var(--zk,1)) / 2);margin-right:calc((100% - 100vw / var(--zk,1)) / 2); -webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)} #wf-home .wh-medrueda__pista{display:flex;gap:20px;align-items:center;width:max-content;will-change:transform;padding:24px 0 30px} #wf-home .wh-medrueda .wh-medcard{flex:0 0 300px;height:420px;cursor:pointer;scroll-snap-align:none; transition:transform .6s var(--e-out),opacity .5s,filter .5s,box-shadow .5s var(--e-out)} #wf-home .wh-medrueda .wh-medcard--destacada{flex-basis:440px;height:470px; box-shadow:0 0 0 2px var(--azul),0 0 40px -6px rgba(102,179,232,.75),0 30px 60px -30px rgba(0,31,45,.7)} #wf-home .wh-medrueda .wh-medcard--destacada .wh-medcard__badge{background:linear-gradient(90deg,#8CCBF2,#66B3E8);box-shadow:0 0 18px rgba(102,179,232,.8)} #wf-home .wh-medrueda .wh-medcard--destacada::before{content:"";position:absolute;inset:-40%;z-index:-1;pointer-events:none; background:conic-gradient(from 0deg,transparent 0 70%,rgba(140,203,242,.35) 80%,transparent 90%);animation:whGiro 6s linear infinite} @keyframes whGiro{to{transform:rotate(360deg)}} #wf-home .wh-medrueda .wh-medcard:hover{transform:translateY(-8px)} /* detenida: la elegida crece y las demás se atenúan */ #wf-home .wh-medrueda.is-detenida .wh-medcard:not(.is-sel){opacity:.35;filter:grayscale(.4) blur(1px);transform:scale(.94)} #wf-home .wh-medrueda .wh-medcard.is-sel{transform:scale(1.07);z-index:2;opacity:1;filter:none} #wf-home .wh-medrueda .wh-medcard.is-sel img{transform:scale(1.14)} #wf-home .wh-medrueda .wh-medcard .wh-medcard__txt{max-height:0;opacity:0;overflow:hidden;transition:max-height .5s var(--e-out),opacity .4s} #wf-home .wh-medrueda .wh-medcard:hover .wh-medcard__txt,#wf-home .wh-medrueda .wh-medcard.is-sel .wh-medcard__txt, #wf-home .wh-medrueda .wh-medcard--destacada .wh-medcard__txt{max-height:120px;opacity:1} #wf-home .wh-medrueda__tip{display:flex;align-items:center;justify-content:center;gap:10px;margin:4px 0 0;font-size:13.5px;font-weight:500;color:var(--suave)} #wf-home .wh-medrueda__dot{width:8px;height:8px;border-radius:50%;background:var(--azul);box-shadow:0 0 0 0 rgba(102,179,232,.6);animation:whLatido 1.8s ease-out infinite} @keyframes whLatido{0%{box-shadow:0 0 0 0 rgba(102,179,232,.6)}100%{box-shadow:0 0 0 12px rgba(102,179,232,0)}} @media (max-width:820px){ #wf-home .wh-medrueda .wh-medcard{flex-basis:240px;height:360px} #wf-home .wh-medrueda .wh-medcard--destacada{flex-basis:300px;height:400px} #wf-home .wh-medrueda .wh-medcard__txt{max-height:120px!important;opacity:1!important} } /* ================= v23: las tarjetas giran en círculo ================= */ #wf-home .wh-medrueda{-webkit-mask-image:none!important;mask-image:none!important;overflow:hidden;padding:10px 0 0} #wf-home .wh-medrueda__pista{position:relative;display:block!important;width:auto!important;height:540px;padding:0!important; transform:none!important;perspective:1400px} #wf-home .wh-medrueda .wh-medcard,#wf-home .wh-medrueda .wh-medcard--destacada{position:absolute;left:50%;top:50%;width:330px;height:450px;flex:none; transition:transform .9s var(--e-out),opacity .7s,filter .7s,box-shadow .6s var(--e-out)!important;transform-style:preserve-3d} #wf-home .wh-medrueda .wh-medcard--destacada{width:360px;height:480px} #wf-home .wh-medrueda .wh-medcard:hover{transform:none} #wf-home .wh-medrueda .wh-medcard.is-frente{box-shadow:0 40px 80px -34px rgba(0,31,45,.75)} #wf-home .wh-medrueda .wh-medcard--destacada,#wf-home .wh-medrueda .wh-medcard--destacada.is-frente{ box-shadow:0 0 0 2px var(--azul),0 0 44px -6px rgba(102,179,232,.8),0 40px 80px -34px rgba(0,31,45,.75)} /* el texto solo se lee en la tarjeta de enfrente */ #wf-home .wh-medrueda .wh-medcard .wh-medcard__txt{max-height:0!important;opacity:0!important} #wf-home .wh-medrueda .wh-medcard.is-frente .wh-medcard__txt{max-height:120px!important;opacity:1!important} #wf-home .wh-medrueda .wh-medcard.is-frente img{transform:scale(1.1)} #wf-home .wh-medrueda.is-detenida .wh-medcard:not(.is-frente){filter:grayscale(.5) blur(2px)!important;opacity:.35!important} #wf-home .wh-medrueda.is-detenida .wh-medcard.is-sel{transform:none} @media (max-width:820px){ #wf-home .wh-medrueda__pista{height:440px} #wf-home .wh-medrueda .wh-medcard,#wf-home .wh-medrueda .wh-medcard--destacada{width:250px;height:370px} } /* v24: las esquinas se mantienen redondas durante el giro y al seleccionar */ #wf-home .wh-medrueda .wh-medcard{border-radius:26px;overflow:hidden;-webkit-backface-visibility:hidden;backface-visibility:hidden;will-change:transform,opacity} #wf-home .wh-medrueda .wh-medcard img,#wf-home .wh-medrueda .wh-medcard::after{border-radius:inherit} #wf-home .wh-medrueda .wh-medcard img,#wf-home .wh-medrueda .wh-medcard.is-frente img,#wf-home .wh-medrueda .wh-medcard:hover img{transform:none!important;transition:none!important} /* v25: acceso a consultorio más resaltado */ #wf-home .wh-medrueda .wh-medcard--destacada{width:390px!important;height:510px!important;animation:whEstrella 3.2s ease-in-out infinite} @keyframes whEstrella{ 0%,100%{box-shadow:0 0 0 2px #66B3E8,0 0 34px -4px rgba(102,179,232,.75),0 40px 80px -34px rgba(0,31,45,.75)} 50%{box-shadow:0 0 0 3px #8CCBF2,0 0 70px 6px rgba(102,179,232,.95),0 40px 80px -34px rgba(0,31,45,.75)}} #wf-home .wh-medcard__estrella{position:absolute;top:20px;right:20px;z-index:3;display:inline-flex;align-items:center;gap:7px; font-size:12px;font-weight:700;letter-spacing:.06em;color:var(--navy);padding:7px 13px 7px 10px;border-radius:999px; background:linear-gradient(120deg,#fff,#DCEFFB 45%,#fff 55%,#DCEFFB);background-size:220% 100%;animation:whBrilloEt 3.5s linear infinite; box-shadow:0 8px 20px -8px rgba(0,0,0,.5)} #wf-home .wh-medcard__estrella svg{width:15px;height:15px;fill:#2599D2} @keyframes whBrilloEt{to{background-position:-220% 0}} #wf-home .wh-medrueda .wh-medcard--destacada figcaption b{font-size:clamp(26px,2.6vw,34px)!important} #wf-home .wh-medrueda .wh-medcard--destacada .wh-medcard__txt{max-height:120px!important;opacity:1!important} #wf-home .wh-medrueda .wh-medcard--destacada:not(.is-frente){opacity:.9!important;filter:none!important} #wf-home .wh-medrueda.is-detenida .wh-medcard--destacada:not(.is-frente){opacity:.55!important;filter:grayscale(.3) blur(1px)!important} @media (max-width:820px){#wf-home .wh-medrueda .wh-medcard--destacada{width:280px!important;height:400px!important}} #wf-home .wh-medrueda__pista{height:620px!important} #wf-home .wh-medrueda{padding-top:0!important} @media (max-width:820px){#wf-home .wh-medrueda__pista{height:470px!important}} /* ================= v26: testimonios en rueda ================= */ #wf-home .wh-vrueda{position:relative;display:block!important;height:640px;perspective:1400px;margin:0 calc((100% - 100vw / var(--zk,1)) / 2);overflow:hidden} #wf-home .wh-vrueda>figure{position:absolute;left:50%;top:48%;width:300px;margin:0;cursor:pointer; transition:transform .9s var(--e-out),opacity .7s,filter .7s!important;will-change:transform,opacity} #wf-home .wh-vrueda>figure.is-frente{cursor:default} #wf-home .wh-vrueda .wh-video{border-radius:24px;overflow:hidden;-webkit-backface-visibility:hidden;backface-visibility:hidden; box-shadow:0 30px 60px -30px rgba(0,31,45,.6);transition:box-shadow .6s} #wf-home .wh-vrueda>figure.is-frente .wh-video{box-shadow:0 0 0 2px rgba(102,179,232,.7),0 0 40px -8px rgba(102,179,232,.7),0 40px 80px -34px rgba(0,31,45,.75)} #wf-home .wh-vtapa{position:absolute;inset:0;z-index:6;display:block} #wf-home .wh-vrueda>figure.is-frente .wh-vtapa{display:none} #wf-home .wh-vrueda>figure:not(.is-frente) .wh-vctl,#wf-home .wh-vrueda>figure:not(.is-frente) .wh-vplay{opacity:0!important} #wf-home .wh-vrueda figcaption{transition:opacity .5s} #wf-home .wh-vrueda>figure:not(.is-frente) figcaption{opacity:.5} #wf-home .wh-vrueda.is-detenida>figure:not(.is-frente){opacity:.25!important;filter:grayscale(.5) blur(2px)!important} #wf-home .wh-vrueda__tip{margin-top:-6px!important} @media (max-width:820px){ #wf-home .wh-vrueda{height:500px} #wf-home .wh-vrueda>figure{width:230px} } /* v28: más espacio en la vitrina para que se mantenga oscura mientras la recorres */ #wf-home .wh-vitrina{padding:clamp(140px,16vh,200px) 0 clamp(150px,18vh,220px)!important} /* ================= v29: ajustes SOLO para celular ================= */ /* En escritorio el envoltorio de las tarjetas no cambia nada */ #wf-home .wh-prod__cuerpo{display:contents} #wf-home .wh-prod__abrir{display:none} @media (max-width:820px){ /* Cómo participar: tarjetas plegables (ícono + título; al tocar se abre la información) */ #wf-home .wh-productos{gap:12px} #wf-home .wh-prod{display:grid!important;grid-template-columns:auto 1fr auto;column-gap:14px;align-items:center; padding:16px 16px 16px 18px!important;border-radius:20px!important;cursor:pointer;transform:none!important} #wf-home .wh-prod .wh-ico{grid-row:1/3;margin:0!important;width:46px;height:46px;border-radius:14px} #wf-home .wh-prod .wh-ico svg{width:22px;height:22px} #wf-home .wh-prod__para{grid-column:2;margin:0;font-size:12.5px;line-height:1.3} #wf-home .wh-prod h3{grid-column:2;margin:2px 0 0!important;font-size:19px!important;line-height:1.2} #wf-home .wh-prod__abrir{display:grid;place-items:center;grid-column:3;grid-row:1/3;width:36px;height:36px;border-radius:50%; border:0;padding:0;cursor:pointer;background:rgba(102,179,232,.18);color:inherit;transition:transform .4s var(--e-out),background .3s} #wf-home .wh-prod__abrir svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round} #wf-home .wh-prod--cielo .wh-prod__abrir{color:var(--navy)} #wf-home .wh-prod--navy .wh-prod__abrir,#wf-home .wh-prod.wh-azulw .wh-prod__abrir{color:#fff;background:rgba(255,255,255,.18)} #wf-home .wh-prod.is-abierto .wh-prod__abrir{transform:rotate(180deg)} #wf-home .wh-prod__cuerpo{display:block;grid-column:1/-1;max-height:0;overflow:hidden;opacity:0; transition:max-height .55s var(--e-out),opacity .35s,margin .4s} #wf-home .wh-prod.is-abierto .wh-prod__cuerpo{max-height:640px;opacity:1;margin-top:14px} #wf-home .wh-prod__cuerpo .wh-prod__desc{margin-top:0;font-size:15px} #wf-home .wh-prod__cuerpo ul{margin:16px 0 18px} #wf-home .wh-prod__cuerpo .wh-prod__link{display:inline-flex} /* Vitrina: la tarjeta de membresías se ve completa arriba y el texto abajo */ #wf-home .wh-vit__slide--contain .wh-vit__fondo{display:block!important;opacity:.75} #wf-home .wh-vit__slide--contain .wh-vit__foto{background-size:94% auto!important;background-position:center 7%!important} #wf-home .wh-vit__slide--contain::before{background:linear-gradient(0deg,rgba(0,20,30,.95) 0%,rgba(0,20,30,.8) 38%,rgba(0,20,30,0) 55%)!important} #wf-home .wh-vit__tit{font-size:clamp(34px,10vw,46px)!important} #wf-home .wh-vit__lema{font-size:16px;margin-top:12px} #wf-home .wh-vit__acc{margin-top:18px} #wf-home .wh-vit__flecha{top:26%} /* Protección · Patrimonio · Visión: lista compacta en una sola tarjeta */ #wf-home .wh-pilares{display:block;margin-top:36px;background:#fff;border-radius:22px;padding:4px 18px; box-shadow:0 18px 40px -26px rgba(0,31,45,.35)} #wf-home .wh-pilares article{display:grid;grid-template-columns:40px 1fr;column-gap:14px;align-items:start; padding:16px 0!important;background:none!important;box-shadow:none!important;border-radius:0!important;border-bottom:1px solid var(--linea)} #wf-home .wh-pilares article:last-child{border-bottom:0} #wf-home .wh-pilares .wh-ico{grid-row:1/3;width:40px;height:40px;border-radius:12px;margin:2px 0 0!important} #wf-home .wh-pilares .wh-ico svg{width:20px;height:20px} #wf-home .wh-pilares h3{font-size:17px!important;margin:0 0 3px!important} #wf-home .wh-pilares p{font-size:14px;line-height:1.5} /* 1 acción = 0.01% + 0.01%: ecuación compacta */ #wf-home .wh-ecuacion{grid-template-columns:1fr auto 1fr!important;gap:10px 8px!important;max-width:none!important;align-items:stretch} #wf-home .wh-ecuacion__uno{grid-column:1/-1;padding:14px 18px!important;border-radius:16px} #wf-home .wh-ecuacion__uno b{font-size:20px} #wf-home .wh-ecuacion__op:first-of-type{grid-column:1/-1;font-size:20px;line-height:1} #wf-home .wh-ecuacion__op{font-size:20px!important;align-self:center} #wf-home .wh-ecuacion__parte{padding:16px 14px!important;border-radius:16px} #wf-home .wh-ecuacion__parte b{font-size:26px;margin-bottom:6px} #wf-home .wh-ecuacion__parte span{font-size:13.5px;line-height:1.3} #wf-home .wh-ecuacion__parte small{font-size:12px;line-height:1.35} } /* v30: tarjeta de Membresías sin sombra lateral; el difuminado solo abajo */ #wf-home .wh-vit__slide--contain::before{background:linear-gradient(0deg,rgba(0,20,30,.88) 0%,rgba(0,20,30,.5) 20%,rgba(0,20,30,0) 42%)!important} #wf-home .wh-vit__slide--contain .wh-vit__txt{text-shadow:0 2px 18px rgba(0,20,30,.55)} #wf-home .wh-vit__slide--contain .wh-vit__eyebrow{background:rgba(0,31,45,.35)} @media (max-width:820px){ #wf-home .wh-vit__slide--contain::before{background:linear-gradient(0deg,rgba(0,20,30,.95) 0%,rgba(0,20,30,.7) 28%,rgba(0,20,30,0) 46%)!important} } /* ================= v31: gestos en celular y pantalla completa ================= */ #wf-home .wh-vfull{flex:none;width:28px;height:28px;border:0;padding:0;border-radius:8px;cursor:pointer;display:grid;place-items:center; background:rgba(255,255,255,.14);color:#fff;transition:background .25s} #wf-home .wh-vfull:hover{background:rgba(255,255,255,.3)} #wf-home .wh-vfull svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round} #wf-home .wh-medrueda__pista,#wf-home .wh-vrueda{touch-action:pan-y} @media (max-width:820px){ /* Explora cada programa: sin flechas, solo deslizar o tocar la tarjeta de al lado */ #wf-home .wh-vit__flecha{display:none!important} #wf-home .wh-vit{touch-action:pan-y} /* Recorrido: video más chico y la foto que ves queda centrada en el espacio libre */ #wf-home .wh-recorrido__fijo{height:32svh!important} #wf-home .wh-recorrido__fotos{padding-top:calc(32svh + 22px)!important;gap:26px!important;padding-bottom:22svh!important} #wf-home .wh-recorrido__fotos figure{scroll-snap-align:center;scroll-margin-top:calc(32svh + 76px)} #wf-home .wh-recorrido__txt{bottom:14px!important} #wf-home .wh-recorrido__txt .wh-kicker{margin-bottom:6px} #wf-home .wh-recorrido__txt .wh-h2{font-size:22px!important} #wf-home .wh-recorrido__nota{display:none} } @media (max-width:820px){html{scroll-snap-type:y proximity}} /* v32: el formulario de Kajabi trae su propio título; se oculta para no repetir "Agenda tu presentación" */ #wf-home .wh-form h1,#wf-home .wh-form h2,#wf-home .wh-form h3,#wf-home .wh-form h4, #wf-home .wh-form .kajabi-form__title,#wf-home .wh-form .kajabi-form__subtitle, #wf-home .wh-form .form-title,#wf-home .wh-form .form-subtitle{display:none!important} /* v35: tarjeta de Membresías completa en escritorio, título y nota del formulario */ @media (min-width:821px){ #wf-home .wh-vit__slide--contain .wh-vit__fondo{display:block!important} /* Tamaño de la tarjeta: sube o baja --memb-zoom (1 = cabe justo en la altura; 1.3 = 30% más grande) */ #wf-home .wh-vit__slide--contain{--memb-zoom:1.32} #wf-home .wh-vit__slide--contain .wh-vit__foto{background-size:auto calc(100% * var(--memb-zoom))!important;background-position:88% 50%!important;background-repeat:no-repeat!important} } #wf-home .wh-form .wh-form__titulo{display:block!important;font-size:22px;font-weight:700;color:var(--navy);margin:0 0 22px;text-align:left} #wf-home .wh-form__nota{margin-top:14px;font-size:13px;color:var(--suave);text-align:center} /* v36: recorrido con sticky nativo (sin JS) */ #wf-home .wh-recorrido__fijo, #wf-home .wh-recorrido__fijo.is-fijo, #wf-home .wh-recorrido__fijo.is-abajo{ position:sticky!important;top:0!important;left:auto!important; bottom:auto!important;width:100%!important} @media (max-width:820px){ #wf-home .wh-recorrido__fijo, #wf-home .wh-recorrido__fijo.is-fijo, #wf-home .wh-recorrido__fijo.is-abajo{top:76px!important} } /* Integración independiente del contenedor de Kajabi. */ html,body{margin:0;padding:0} #wf-home .wh-nav{gap:18px} #wf-home .wh-nav a{font-size:14px} @media(min-width:1025px){ #wf-home .wh-header__in{max-width:1380px;gap:24px} #wf-home .wh-brand{flex-shrink:0} #wf-home .wh-nav a{white-space:nowrap} } #wf-home .wh-footer__access{display:flex;flex-wrap:wrap;gap:16px 28px;padding:24px 0;border-top:1px solid rgba(255,255,255,.18);margin-top:24px} #wf-home .wh-footer__access a{font-size:14px;text-underline-offset:4px} #wf-home a:focus-visible,#wf-home button:focus-visible{outline:3px solid #66B3E8;outline-offset:4px} @media(max-width:1024px){#wf-home .wh-nav{gap:0;max-height:calc(100dvh - 76px);overflow-y:auto}#wf-home .wh-nav a{font-size:16px}} @media(max-width:1024px){ #wf-home .wh-menu{display:block} #wf-home .wh-header{background:rgba(0,31,45,.94)} #wf-home .wh-nav{position:fixed;inset:76px 0 auto 0;flex-direction:column;align-items:stretch;background:var(--navy);padding:8px 24px 24px;transform:translateY(-12px);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .25s,transform .25s,visibility .25s} #wf-home .wh-nav.is-abierto{opacity:1;visibility:visible;transform:none;pointer-events:auto} #wf-home .wh-nav a{padding:14px 0;border-bottom:1px solid rgba(255,255,255,.1)} #wf-home .wh-nav .wh-btn{margin-top:16px;text-align:center;border-bottom:0} }