). El aire de 32px lo pone el CONTENIDO (ver el right del .hero__scroll). Los dos márgenes negativos van SIEMPRE de a pares: la sección es flex con align-items:center y con uno solo el bleed queda descentrado (medido: -16px). */ .elementor-14641 .elementor-element.elementor-element-55896e0{position:sticky;top:0;height:100vh;overflow:hidden;width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw)}/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-1a6d8c77 */.elementor-14641 .elementor-element.elementor-element-1a6d8c77{position:relative;overflow:visible}/* End custom CSS */ /* Start custom CSS for heading, class: .elementor-element-4f7db4da */.elementor-14641 .elementor-element.elementor-element-4f7db4da{width:100%} .elementor-14641 .elementor-element.elementor-element-4f7db4da .elementor-widget-container{display:flex;flex-direction:column;align-items:center} .elementor-14641 .elementor-element.elementor-element-4f7db4da .elementor-heading-title{font-size:clamp(21.5px,3.33vw,40.7px);width:100%;max-width:min(calc((100vw - 128px) * 0.4737),792px);text-align:center;text-wrap:balance;overflow-wrap:break-word} .elementor-14641 .elementor-element.elementor-element-4f7db4da .elementor-heading-title span{display:inline !important} .elementor-14641 .elementor-element.elementor-element-4f7db4da .accent{color:#CCCAC8;font-weight:300} @media(max-width:991px){.elementor-14641 .elementor-element.elementor-element-4f7db4da .elementor-heading-title{max-width:min(900px,92vw)}}/* End custom CSS */ /* Start custom CSS for heading, class: .elementor-element-6746d301 */.elementor-14641 .elementor-element.elementor-element-6746d301{width:100%} .elementor-14641 .elementor-element.elementor-element-6746d301 .elementor-heading-title{display:flex;align-items:center;gap:24px;justify-content:center;text-align:center} .elementor-14641 .elementor-element.elementor-element-6746d301 .elementor-heading-title::before,.elementor-14641 .elementor-element.elementor-element-6746d301 .elementor-heading-title::after{content:"";flex:1;height:1px;background:rgba(16,16,18,.08)}/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-5ee033bb *//* Tira de marcas — replica styles.css:565-572. OJO: estas reglas son las que le dan tamano a los logos. Si se pisan, las quedan en 0x0 y el track colapsa (paso: se midio 1780px con 56 marcas). */ .elementor-14641 .elementor-element.elementor-element-5ee033bb{display:flex;align-items:center;width:max-content;flex-wrap:nowrap;gap:clamp(56px,9vw,150px);will-change:transform} .elementor-14641 .elementor-element.elementor-element-5ee033bb .brand-strip__mark{flex:none;opacity:.7;transition:opacity .3s} .elementor-14641 .elementor-element.elementor-element-5ee033bb .brand-strip__mark:hover{opacity:1} .elementor-14641 .elementor-element.elementor-element-5ee033bb img{height:80px;width:auto;display:block}/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-3f01d952 */.elementor-14641 .elementor-element.elementor-element-3f01d952{overflow:hidden;width:100%}/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-4d6293f7 */.elementor-14641 .elementor-element.elementor-element-4d6293f7{flex:1 1 auto} .elementor-14641 .elementor-element.elementor-element-4d6293f7 > .e-con-inner{flex:1 1 auto;width:100%} .elementor-14641 .elementor-element.elementor-element-4d6293f7 > .e-con-inner > :first-child{margin-top:auto} .elementor-14641 .elementor-element.elementor-element-4d6293f7 > .e-con-inner > :last-child{margin-top:auto;padding-top:64px}/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-b140c05 */.elementor-14641 .elementor-element.elementor-element-b140c05{min-height:100dvh;position:sticky;top:0}/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-265add4 */.elementor-14641 .elementor-element.elementor-element-265add4{width:100%;pointer-events:none;background:none!important} @media(max-width:991px){.elementor-14641 .elementor-element.elementor-element-265add4{display:none}}/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-738775fe */.elementor-14641 .elementor-element.elementor-element-738775fe .elementor-button:hover{border-color:#00ADBB}/* End custom CSS */ /* Start custom CSS for loop-grid, class: .elementor-element-3135825c */.elementor-14641 .elementor-element.elementor-element-3135825c .elementor-loop-container{gap:32px;align-items:center} .elementor-14641 .elementor-element.elementor-element-3135825c .e-loop-item>.e-con{width:auto} .elementor-14641 .elementor-element.elementor-element-3135825c .e-loop-item>.e-con>.e-con{width:auto} .elementor-14641 .elementor-element.elementor-element-3135825c .pj-figure img{height:58vh;aspect-ratio:4/3;width:auto;max-width:none;object-fit:cover;display:block;transition:filter .5s,scale .9s cubic-bezier(.645,.045,.355,1)} .elementor-14641 .elementor-element.elementor-element-3135825c .e-loop-item:hover .pj-figure img{filter:brightness(1.06)} .elementor-14641 .elementor-element.elementor-element-3135825c .e-loop-item .case__name .elementor-heading-title{transition:color .35s ease} .elementor-14641 .elementor-element.elementor-element-3135825c .e-loop-item:hover .case__name .elementor-heading-title{color:#00ADBB} /* --- Hover de card (styles.css:628-646). Dos conflictos que obligan a esquivar: 1) el transform del .e-loop-item lo maneja ar-hscroll (scale .86 del blur / 1 del foco), asi que la elevacion va en el INTERNO, no en el item, o se pisa el foco. 2) ar-mask (gsap) deja `scale:none` INLINE en la al terminar su entrada, y el inline gana a cualquier regla CSS. Se usa la propiedad `scale` (compone con el transform del mask, no lo reemplaza) con !important para superar ese inline. */ .elementor-14641 .elementor-element.elementor-element-3135825c .e-loop-item>.e-con{transition:transform .5s cubic-bezier(.645,.045,.355,1)} .elementor-14641 .elementor-element.elementor-element-3135825c .e-loop-item:hover>.e-con{transform:translateY(-6px)} .elementor-14641 .elementor-element.elementor-element-3135825c .pj-figure{transition:box-shadow .5s ease} .elementor-14641 .elementor-element.elementor-element-3135825c .e-loop-item:hover .pj-figure{box-shadow:0 28px 52px -28px rgba(0,0,0,.72),0 10px 60px -22px rgba(248,247,243,.07)} .elementor-14641 .elementor-element.elementor-element-3135825c .e-loop-item:hover .pj-figure img{scale:1.04!important} /* La plantilla del loop item la comparte /casos/, donde el nombre va clamp(16,1.5vw,22) con tracking -0.3px (cases.css:75) — y ahi esta BIEN. En la home la maqueta usa otra escala: .work__name (styles.css:653) con el tracking positivo que impone el bloque final de :1163. Se corrige solo aca, sin tocar el template compartido. */ .elementor-14641 .elementor-element.elementor-element-3135825c .case__name .elementor-heading-title{font-size:clamp(22px,2.2vw,28px);letter-spacing:0.012em} .elementor-14641 .elementor-element.elementor-element-3135825c .case__tag .elementor-heading-title{font-size:12px;letter-spacing:2px} @media(max-width:991px){.elementor-14641 .elementor-element.elementor-element-3135825c .elementor-loop-container{gap:64px} .elementor-14641 .elementor-element.elementor-element-3135825c .e-loop-item>.e-con,.elementor-14641 .elementor-element.elementor-element-3135825c .e-loop-item>.e-con>.e-con{width:100%} .elementor-14641 .elementor-element.elementor-element-3135825c .pj-figure img{width:100%;height:auto;aspect-ratio:16/10}}/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-64b1390a */.elementor-14641 .elementor-element.elementor-element-64b1390a{position:relative;--ar-hs-vignette:rgba(16,16,18,.55);--ar-hs-vignette-end:#101012;--ar-hs-bg-opacity:.55} /* La barra de progreso NO existe en la maqueta: si va en el flujo se come el aire vertical (la maqueta centra head + carrusel dentro de 100dvh). Con el sticky encendido la sacamos del flujo y la anclamos al pie de la pantalla clavada. */ .elementor-14641 .elementor-element.elementor-element-64b1390a .work-bar{width:100%;height:2px;margin-top:56px;background:rgba(248,247,243,.16)} .elementor-14641 .elementor-element.elementor-element-64b1390a.ar-hs--sticky .work-bar{position:absolute;left:0;right:0;bottom:32px;width:auto;margin-top:0} .elementor-14641 .elementor-element.elementor-element-64b1390a .work-bar .elementor-widget-container{height:100%} .elementor-14641 .elementor-element.elementor-element-64b1390a .work-bar span{display:block;height:100%;width:0%;background:#00ADBB} @media(max-width:560px){.elementor-14641 .elementor-element.elementor-element-64b1390a .work-bar{margin-top:32px}.elementor-14641 .elementor-element.elementor-element-64b1390a.ar-hs--sticky .work-bar{bottom:20px}} /* ---- Apilado en mobile ---------------------------------------------------- El CSS de stack del snippet ar-hscroll esta cableado a 900px; la maqueta rompe en 991. Replicamos sus reglas para ESTA seccion hasta 991 (el motor ya se apaga ahi por data-hs-bp|991) en vez de tocar el snippet global, que lo comparte Nosotros. */ @media(max-width:991px){ .elementor-14641 .elementor-element.elementor-element-64b1390a .ar-hs__track{display:flex!important;flex-direction:column;overflow:visible;scroll-snap-type:none;width:100%;margin-left:0;padding-left:0!important;padding-right:0!important} .elementor-14641 .elementor-element.elementor-element-64b1390a .ar-hs__card{width:100%;filter:none!important;transform:none!important} .elementor-14641 .elementor-element.elementor-element-64b1390a.ar-hs--sticky{height:auto!important} .elementor-14641 .elementor-element.elementor-element-64b1390a.ar-hs--sticky .ar-hs__stage{position:static;min-height:0;overflow:visible} .elementor-14641 .elementor-element.elementor-element-64b1390a .work-bar{display:none} }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-26256fe */.elementor-14641 .elementor-element.elementor-element-26256fe{isolation:isolate}/* End custom CSS */ /* Start custom CSS for heading, class: .elementor-element-72083645 *//* El control _margin de widget NO compila en esta version de Elementor (4.1.4): medido, todos los widgets de la pagina dan margin 0 aunque tengan valor cargado. Ademas .e-con .elementor-widget.elementor-widget{margin-block-end:0} lo pisaria. Por eso el aire va por custom_css. Maqueta: .services__head{margin-bottom:48} */ .elementor-14641 .elementor-element.elementor-element-72083645{margin-bottom:48px}/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-23778e26 */.elementor-14641 .elementor-element.elementor-element-23778e26 .elementor-button:hover{border-color:#00ADBB}/* End custom CSS */ /* Start custom CSS for text-editor, class: .elementor-element-6bac8319 */.elementor-14641 .elementor-element.elementor-element-6bac8319 p{margin:0}/* End custom CSS */ /* Start custom CSS for text-editor, class: .elementor-element-5afb1267 */.elementor-14641 .elementor-element.elementor-element-5afb1267 p{margin:0}/* End custom CSS */ /* Start custom CSS for text-editor, class: .elementor-element-34084f9f */.elementor-14641 .elementor-element.elementor-element-34084f9f p{margin:0}/* End custom CSS */ /* Start custom CSS for text-editor, class: .elementor-element-61142e44 */.elementor-14641 .elementor-element.elementor-element-61142e44 p{margin:0}/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-7f6aa6b9 */.elementor-14641 .elementor-element.elementor-element-7f6aa6b9{position:relative;z-index:2}/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-377fb072 */.elementor-14641 .elementor-element.elementor-element-377fb072{position:relative;transition:background-color .6s cubic-bezier(.645,.045,.355,1);overflow:hidden} .elementor-14641 .elementor-element.elementor-element-377fb072[data-active="true"]{background:#101012} .elementor-14641 .elementor-element.elementor-element-377fb072 .services-bg{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;background:#101012;opacity:0;transition:opacity .6s cubic-bezier(.645,.045,.355,1)} .elementor-14641 .elementor-element.elementor-element-377fb072[data-active="true"] .services-bg{opacity:1} .elementor-14641 .elementor-element.elementor-element-377fb072 .services-bg .services__bg-img{position:absolute;inset:0;opacity:0;transition:opacity .7s cubic-bezier(.645,.045,.355,1)} .elementor-14641 .elementor-element.elementor-element-377fb072 .services-bg .services__bg-img img{width:100%;height:100%;object-fit:cover;filter:blur(45px) saturate(1.1) brightness(.6);transform:scale(1.18)} .elementor-14641 .elementor-element.elementor-element-377fb072 .services-bg .services__bg-img.is-active{opacity:.8} .elementor-14641 .elementor-element.elementor-element-377fb072 .services-bg::after{content:"";position:absolute;inset:0;z-index:1;background:radial-gradient(120% 90% at 50% 45%,transparent 0%,rgba(16,16,18,.64) 65%,#101012 100%)} /* El eyebrow y el titulo cruzan a claro EN SINCRONIA con el fondo (styles.css:738 y :750). Sin esta transicion saltaban de golpe mientras todo lo demas fundia: se leia como un parpadeo arriba de la seccion. Medido: computaban transition:all (0s). */ .elementor-14641 .elementor-element.elementor-element-377fb072 .eyebrow .elementor-heading-title{transition:color .5s} .elementor-14641 .elementor-element.elementor-element-377fb072 .services__title .elementor-heading-title{font-size:max(26px,3.2vw);line-height:1;transition:color .5s} .elementor-14641 .elementor-element.elementor-element-377fb072[data-active="true"] .eyebrow .elementor-heading-title{color:rgba(248,247,243,.64)} .elementor-14641 .elementor-element.elementor-element-377fb072[data-active="true"] .services__title .elementor-heading-title{color:#f8f7f3} .elementor-14641 .elementor-element.elementor-element-377fb072[data-active="true"] .btn-ghost-dark:not(:hover) .elementor-button{color:#f8f7f3;border-color:rgba(248,247,243,.32)} .elementor-14641 .elementor-element.elementor-element-377fb072 .services__list{position:relative;border-top:1px solid rgba(16,16,18,.08);transition:border-color .5s} .elementor-14641 .elementor-element.elementor-element-377fb072[data-active="true"] .services__list{border-top-color:rgba(248,247,243,.08)} .elementor-14641 .elementor-element.elementor-element-377fb072 .service{position:relative;display:grid;grid-template-columns:64px minmax(0,1.1fr) minmax(0,1.3fr) minmax(0,1fr);gap:32px;align-items:center;padding-block:48px;border-bottom:1px solid rgba(16,16,18,.08);transition:opacity .45s cubic-bezier(.645,.045,.355,1),border-color .5s} .elementor-14641 .elementor-element.elementor-element-377fb072[data-active="true"] .service{border-bottom-color:rgba(248,247,243,.08)} .elementor-14641 .elementor-element.elementor-element-377fb072[data-active="true"] .service:not(.is-active){opacity:.3} .elementor-14641 .elementor-element.elementor-element-377fb072 .service__num .elementor-heading-title{font-size:12px;font-weight:300;transition:color .5s} .elementor-14641 .elementor-element.elementor-element-377fb072 .service__title .elementor-heading-title{font-size:clamp(28px,4vw,56px);line-height:1;transition:color .5s} .elementor-14641 .elementor-element.elementor-element-377fb072 .service__desc{grid-column:4;max-width:34ch} .elementor-14641 .elementor-element.elementor-element-377fb072 .service__desc p{transition:color .5s} .elementor-14641 .elementor-element.elementor-element-377fb072[data-active="true"] .service__title .elementor-heading-title{color:#f8f7f3} .elementor-14641 .elementor-element.elementor-element-377fb072[data-active="true"] .service__desc p{color:rgba(248,247,243,.64)} .elementor-14641 .elementor-element.elementor-element-377fb072[data-active="true"] .service.is-active .service__num .elementor-heading-title{color:#00ADBB} .elementor-14641 .elementor-element.elementor-element-377fb072[data-active="true"] .service.is-active .service__desc p{color:#f8f7f3} .elementor-14641 .elementor-element.elementor-element-377fb072 .service__thumb{position:absolute;left:57%;top:50%;transform:translate(-50%,-50%) scale(.92);width:clamp(280px,24vw,440px);aspect-ratio:1/1.05;opacity:0;pointer-events:none;transition:opacity .55s cubic-bezier(.645,.045,.355,1),transform .55s cubic-bezier(.645,.045,.355,1);z-index:3} .elementor-14641 .elementor-element.elementor-element-377fb072 .service__thumb img{width:100%;height:100%;object-fit:cover;display:block} .elementor-14641 .elementor-element.elementor-element-377fb072 .service.is-active .service__thumb{opacity:1;transform:translate(-50%,-50%) scale(1)} @media(max-width:991px){.elementor-14641 .elementor-element.elementor-element-377fb072 .service{grid-template-columns:48px 1fr;gap:16px;padding-block:32px}.elementor-14641 .elementor-element.elementor-element-377fb072 .service__desc{grid-column:2}.elementor-14641 .elementor-element.elementor-element-377fb072 .service__thumb{display:none}} @media(max-width:640px){.elementor-14641 .elementor-element.elementor-element-377fb072 .services__title-row{flex-direction:column;align-items:flex-start}}/* End custom CSS */ /* Start custom CSS for image, class: .elementor-element-7c8911f9 */.elementor-14641 .elementor-element.elementor-element-7c8911f9{overflow:hidden;aspect-ratio:4/5} .elementor-14641 .elementor-element.elementor-element-7c8911f9 img{width:100%;height:100%;object-fit:cover;display:block}/* End custom CSS */ /* Start custom CSS for button, class: .elementor-element-6137063d */.elementor-14641 .elementor-element.elementor-element-6137063d .elementor-button:hover{border-color:#00ADBB}/* End custom CSS */ /* Start custom CSS for heading, class: .elementor-element-320986c0 */.elementor-14641 .elementor-element.elementor-element-320986c0 .elementor-heading-title{font-size:max(26px,3.2vw)}/* End custom CSS */ /* Start custom CSS for text-editor, class: .elementor-element-24443772 *//* El max-width va en el CONTENIDO, no en el wrapper: Elementor trae .elementor.elementor .e-con>.elementor-widget{max-width:100%} con 4 clases y le gana al custom_css del widget (3). Medido antes del fix: computaba 100%. */ .elementor-14641 .elementor-element.elementor-element-24443772 .elementor-widget-container{display:grid;gap:20px} .elementor-14641 .elementor-element.elementor-element-24443772 p{margin:0;max-width:50ch}/* End custom CSS */ /* Start custom CSS for counter, class: .elementor-element-42873aa0 */.elementor-14641 .elementor-element.elementor-element-42873aa0{display:flex;flex-direction:column;padding:clamp(26px,2.4vw,40px) clamp(22px,2vw,34px);background:#f8f7f345;border:1px solid rgba(16,16,18,.08);transition:transform .55s cubic-bezier(.645,.045,.355,1),border-color .45s,box-shadow .55s} .elementor-14641 .elementor-element.elementor-element-42873aa0::before{content:"";width:26px;height:2px;background:#00ADBB;margin-bottom:24px;transition:width .5s cubic-bezier(.645,.045,.355,1)} .elementor-14641 .elementor-element.elementor-element-42873aa0:hover{transform:translateY(-6px);border-color:color-mix(in srgb,#00ADBB 38%,rgba(16,16,18,.08));box-shadow:0 24px 48px -32px rgba(16,16,18,.3)} .elementor-14641 .elementor-element.elementor-element-42873aa0:hover::before{width:52px} /* peso 400: styles.css no declara font-weight en .nstat__num, hereda de body. El bloque uppercase-light de :1159 no lo incluye. */ .elementor-14641 .elementor-element.elementor-element-42873aa0 .elementor-counter-number-wrapper{display:flex;align-items:baseline;justify-content:flex-start;font-family:'Clash Grotesk';font-weight:400;font-size:clamp(40px,4.4vw,64px);line-height:1;letter-spacing:-2px;color:#101012} .elementor-14641 .elementor-element.elementor-element-42873aa0 .elementor-counter-number-prefix,.elementor-14641 .elementor-element.elementor-element-42873aa0 .elementor-counter-number-suffix{flex-grow:0;flex-basis:auto;text-align:left} .elementor-14641 .elementor-element.elementor-element-42873aa0 .elementor-counter-title{font-family:'Clash Grotesk';font-weight:300;font-size:12px;text-transform:uppercase;letter-spacing:1px;color:#808288;margin-top:20px;max-width:18ch;line-height:1.35;text-align:left}/* End custom CSS */ /* Start custom CSS for counter, class: .elementor-element-197f6e82 */.elementor-14641 .elementor-element.elementor-element-197f6e82{display:flex;flex-direction:column;padding:clamp(26px,2.4vw,40px) clamp(22px,2vw,34px);background:#f8f7f345;border:1px solid rgba(16,16,18,.08);transition:transform .55s cubic-bezier(.645,.045,.355,1),border-color .45s,box-shadow .55s} .elementor-14641 .elementor-element.elementor-element-197f6e82::before{content:"";width:26px;height:2px;background:#00ADBB;margin-bottom:24px;transition:width .5s cubic-bezier(.645,.045,.355,1)} .elementor-14641 .elementor-element.elementor-element-197f6e82:hover{transform:translateY(-6px);border-color:color-mix(in srgb,#00ADBB 38%,rgba(16,16,18,.08));box-shadow:0 24px 48px -32px rgba(16,16,18,.3)} .elementor-14641 .elementor-element.elementor-element-197f6e82:hover::before{width:52px} /* peso 400: styles.css no declara font-weight en .nstat__num, hereda de body. */ .elementor-14641 .elementor-element.elementor-element-197f6e82 .elementor-counter-number-wrapper{display:flex;align-items:baseline;justify-content:flex-start;font-family:'Clash Grotesk';font-weight:400;font-size:clamp(40px,4.4vw,64px);line-height:1;letter-spacing:-2px;color:#101012} .elementor-14641 .elementor-element.elementor-element-197f6e82 .elementor-counter-number-prefix,.elementor-14641 .elementor-element.elementor-element-197f6e82 .elementor-counter-number-suffix{flex-grow:0;flex-basis:auto;text-align:left} .elementor-14641 .elementor-element.elementor-element-197f6e82 .elementor-counter-number-prefix{font-size:clamp(26px,3vw,44px);color:#00ADBB;margin-right:2px} .elementor-14641 .elementor-element.elementor-element-197f6e82 .elementor-counter-title{font-family:'Clash Grotesk';font-weight:300;font-size:12px;text-transform:uppercase;letter-spacing:1px;color:#808288;margin-top:20px;max-width:18ch;line-height:1.35;text-align:left}/* End custom CSS */ /* Start custom CSS for counter, class: .elementor-element-48e408dd */.elementor-14641 .elementor-element.elementor-element-48e408dd{display:flex;flex-direction:column;padding:clamp(26px,2.4vw,40px) clamp(22px,2vw,34px);background:#f8f7f345;border:1px solid rgba(16,16,18,.08);transition:transform .55s cubic-bezier(.645,.045,.355,1),border-color .45s,box-shadow .55s} .elementor-14641 .elementor-element.elementor-element-48e408dd::before{content:"";width:26px;height:2px;background:#00ADBB;margin-bottom:24px;transition:width .5s cubic-bezier(.645,.045,.355,1)} .elementor-14641 .elementor-element.elementor-element-48e408dd:hover{transform:translateY(-6px);border-color:color-mix(in srgb,#00ADBB 38%,rgba(16,16,18,.08));box-shadow:0 24px 48px -32px rgba(16,16,18,.3)} .elementor-14641 .elementor-element.elementor-element-48e408dd:hover::before{width:52px} /* peso 400: styles.css no declara font-weight en .nstat__num, hereda de body. */ .elementor-14641 .elementor-element.elementor-element-48e408dd .elementor-counter-number-wrapper{display:flex;align-items:baseline;justify-content:flex-start;font-family:'Clash Grotesk';font-weight:400;font-size:clamp(40px,4.4vw,64px);line-height:1;letter-spacing:-2px;color:#101012} .elementor-14641 .elementor-element.elementor-element-48e408dd .elementor-counter-number-prefix,.elementor-14641 .elementor-element.elementor-element-48e408dd .elementor-counter-number-suffix{flex-grow:0;flex-basis:auto;text-align:left} .elementor-14641 .elementor-element.elementor-element-48e408dd .elementor-counter-title{font-family:'Clash Grotesk';font-weight:300;font-size:12px;text-transform:uppercase;letter-spacing:1px;color:#808288;margin-top:20px;max-width:18ch;line-height:1.35;text-align:left}/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-3143598e */.elementor-14641 .elementor-element.elementor-element-3143598e{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,1.6vw,24px)} @media(max-width:640px){.elementor-14641 .elementor-element.elementor-element-3143598e{grid-template-columns:1fr}}/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-352e449 */.elementor-14641 .elementor-element.elementor-element-352e449 > .e-con-inner{display:grid;grid-template-columns:0.95fr 1.05fr;gap:clamp(40px,6vw,110px);align-items:center} @media(max-width:991px){.elementor-14641 .elementor-element.elementor-element-352e449 > .e-con-inner{grid-template-columns:1fr}}/* End custom CSS */ /* Start custom CSS for heading, class: .elementor-element-7ed47495 */.elementor-14641 .elementor-element.elementor-element-7ed47495 .elementor-heading-title{font-size:max(26px,3.2vw)}/* End custom CSS */ /* Start custom CSS for testimonial-carousel, class: .elementor-element-3b4e9528 */.elementor-14641 .elementor-element.elementor-element-3b4e9528 .swiper{width:100%;margin-left:0;margin-right:0;padding-block:70px} .elementor-14641 .elementor-element.elementor-element-3b4e9528 .swiper-slide{padding:0;height:auto;overflow:visible} .elementor-14641 .elementor-element.elementor-element-3b4e9528 .swiper-wrapper{align-items:stretch} .elementor-14641 .elementor-element.elementor-element-3b4e9528 .swiper-pagination{display:none} .elementor-14641 .elementor-element.elementor-element-3b4e9528 .elementor-testimonial__image{display:none} .elementor-14641 .elementor-element.elementor-element-3b4e9528 .elementor-testimonial{display:flex;flex-direction:column;gap:24px;height:100%;text-align:left;background:#F8F7F3;padding:clamp(34px,3.2vw,50px) clamp(30px,3vw,44px) clamp(28px,2.8vw,40px);box-shadow:0 2px 6px -2px rgba(16,16,18,.06),0 26px 50px -30px rgba(16,16,18,.3);transition:box-shadow .5s ease,transform .5s ease} .elementor-14641 .elementor-element.elementor-element-3b4e9528 .elementor-testimonial:hover{transform:translateY(-4px);box-shadow:0 4px 10px -3px rgba(16,16,18,.08),0 36px 60px -28px rgba(16,16,18,.34)} .elementor-14641 .elementor-element.elementor-element-3b4e9528 .elementor-testimonial::before{content:"\201C";font-family:'Clash Grotesk';font-size:86px;line-height:.55;color:#00ADBB;opacity:.18;margin-bottom:-8px} .elementor-14641 .elementor-element.elementor-element-3b4e9528 .elementor-testimonial__content{flex:1;background:none;padding:0;margin:0;box-shadow:none} .elementor-14641 .elementor-element.elementor-element-3b4e9528 .elementor-testimonial__content::after{display:none} .elementor-14641 .elementor-element.elementor-element-3b4e9528 .elementor-testimonial__text{font-family:'Clash Grotesk';font-weight:400;font-style:normal;font-size:clamp(19px,1.8vw,24px);line-height:1.45;letter-spacing:-.4px;color:#101012;text-align:left;margin:0} .elementor-14641 .elementor-element.elementor-element-3b4e9528 .elementor-testimonial__footer{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:16px;margin:8px 0 0;padding-top:24px;border-top:1px solid rgba(16,16,18,.08)} .elementor-14641 .elementor-element.elementor-element-3b4e9528 .elementor-testimonial__footer::before{content:"";flex:none;width:46px;height:46px;display:grid;place-items:center;border:1px solid #00ADBB;color:#00ADBB;font-family:'Clash Grotesk';font-weight:300;font-size:14px;letter-spacing:1px} /* Iniciales por POSICION, no por data-swiper-slide-index: ese atributo lo escribe Swiper SOLO en modo loop, y el loop se apago para replicar la maqueta (tira finita con flechas que se deshabilitan). nth-of-type y no nth-child: si algun dia se inyecta un