/* ===================================================================== HG Realty · Recuperación visual (2026-09-28) Respaldo del CSS anterior: borrador WP 14139. 1) Tipografía de marca recuperada: archivos originales del sitio (uploads 2025/10), servidos como WOFF comprimido (uploads/fonts, Biblioteca de fuentes de WP) con TTF de respaldo. ===================================================================== */ /* Reconstrucción: varios estilos Pro originales piden "Garamond"; se asigna la misma familia de marca. */ @keyframes scroll-left { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } } /* ===================================================================== 3) Formularios CF7 de Home (48c65de) y Contact (49d12600). Reconstrucción del widget Formulario Pro original (plantillas Home/Contact 2025-10): campos blancos sin borde con sombra, Garamond 18/24, etiquetas ocultas a la vista (siguen disponibles para lectores de pantalla), 2 columnas con 40 px, botón dorado centrado. ===================================================================== */ :is(.elementor-element-48c65de, .elementor-element-49d12600) .wpcf7 form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 40px; row-gap: 40px; } :is(.elementor-element-48c65de, .elementor-element-49d12600) .wpcf7 form > p { margin: 0; } :is(.elementor-element-48c65de, .elementor-element-49d12600) .wpcf7 form > p:has(textarea), :is(.elementor-element-48c65de, .elementor-element-49d12600) .wpcf7 form > p:has(.wpcf7-submit), :is(.elementor-element-48c65de, .elementor-element-49d12600) .wpcf7 form > .wpcf7-response-output { grid-column: 1 / -1; } :is(.elementor-element-48c65de, .elementor-element-49d12600) .wpcf7 label { display: block; margin: 0; font-size: 0; line-height: 0; color: transparent; } :is(.elementor-element-48c65de, .elementor-element-49d12600) .wpcf7 label br { display: none; } :is(.elementor-element-48c65de, .elementor-element-49d12600) .wpcf7 .wpcf7-form-control-wrap { display: block; } :is(.elementor-element-48c65de, .elementor-element-49d12600) .wpcf7 input:is([type="text"], [type="email"], [type="tel"], [type="number"], [type="url"]), :is(.elementor-element-48c65de, .elementor-element-49d12600) .wpcf7 textarea { display: block; width: 100%; box-sizing: border-box; min-height: 47px; margin: 0; padding: 6px 16px; background-color: #fff; color: #333; border: 0; border-radius: 0; box-shadow: 0 0 4px 0 rgba(0, 0, 0, .5); font-family: "Garamond Premier Pro", Garamond, serif; font-size: 18px; font-weight: 400; line-height: 24px; letter-spacing: .54px; transition: box-shadow .2s; } :is(.elementor-element-48c65de, .elementor-element-49d12600) .wpcf7 textarea { height: 120px; min-height: 108px; padding-top: 12px; padding-bottom: 12px; resize: vertical; } :is(.elementor-element-48c65de, .elementor-element-49d12600) .wpcf7 :is(input, textarea)::placeholder { color: #6f6f6f; opacity: 1; } :is(.elementor-element-48c65de, .elementor-element-49d12600) .wpcf7 :is(input, textarea):focus { outline: 2px solid #C8A76B; outline-offset: 2px; box-shadow: 0 0 6px 0 rgba(0, 0, 0, .55); } :is(.elementor-element-48c65de, .elementor-element-49d12600) .wpcf7 form > p:has(.wpcf7-submit) { position: relative; text-align: center; } :is(.elementor-element-48c65de, .elementor-element-49d12600) .wpcf7 .wpcf7-submit { display: inline-block; min-height: 47px; margin: 0; padding: 11px 44px; background-color: #C8A76B; color: #fff; border: 0; border-radius: 0; font-family: "Garamond Premier Pro", Garamond, serif; font-size: 18px; font-weight: 400; line-height: 24px; letter-spacing: 2px; cursor: pointer; transition: background-color .3s, color .3s; } :is(.elementor-element-48c65de, .elementor-element-49d12600) .wpcf7 .wpcf7-submit:is(:hover, :focus-visible) { background-color: #000; color: #fff; } :is(.elementor-element-48c65de, .elementor-element-49d12600) .wpcf7 .wpcf7-submit:focus-visible { outline: 2px solid #C8A76B; outline-offset: 3px; } :is(.elementor-element-48c65de, .elementor-element-49d12600) .wpcf7 .wpcf7-spinner { position: absolute; top: calc(50% - 12px); margin: 0 0 0 12px; } :is(.elementor-element-48c65de, .elementor-element-49d12600) .wpcf7 .wpcf7-not-valid-tip { margin-top: 6px; font-family: "Garamond Premier Pro", Garamond, serif; font-size: 15px; line-height: 1.4; letter-spacing: 0; color: #b3261e; } :is(.elementor-element-48c65de, .elementor-element-49d12600) .wpcf7 form .wpcf7-response-output { margin: 0; padding: 12px 16px; font-family: "Garamond Premier Pro", Garamond, serif; font-size: 17px; line-height: 1.4; } @media (max-width: 767px) { :is(.elementor-element-48c65de, .elementor-element-49d12600) .wpcf7 form { grid-template-columns: minmax(0, 1fr); row-gap: 24px; } } /* ===================================================================== 4) Logo existente: proporción y escala del header. ===================================================================== */ .site-header .custom-logo, .site-footer .custom-logo { width: 145px; max-width: 145px; height: auto; } /* ===================================================================== 2) CSS personalizado original de Elementor Pro, recompilado por página. Fuente: ajustes "Custom CSS" guardados en cada página/elemento. Selectores "selector" = los mismos que generaba Pro; reglas sueltas acotadas con :where(.elementor-ID) para no cambiar su especificidad. Reglas BWD omitidas. ===================================================================== */ /* residential-projects (12486) page CSS */ :where(.elementor-12486) .img-hover-animation-set.elementor-widget.elementor-widget-image { overflow: hidden; } :where(.elementor-12486) .img-hover-animation-set.elementor-widget.elementor-widget-image img { transition: transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94); } :where(.elementor-12486) .img-hover-animation-set.elementor-widget.elementor-widget-image:hover img { transform: scale(1.02); } /* altai (11790) page CSS */ @media screen and (min-width: 1440px) { :where(.elementor-11790) .big-screen-img-set img { height: 340px !important; object-fit: cover !important; width: 100% !important; } } @media screen and (min-width: 2500px) { :where(.elementor-11790) .big-screen-img-set img { height: 500px !important; object-fit: cover !important; width: 100% !important; } :where(.elementor-11790) .big-screen-img-height-set img { height: 500px !important; object-fit: cover !important; width: 100% !important; } :where(.elementor-11790) .big-screen-img-height-set1 img { height: 500px !important; object-fit: cover !important; width: 100% !important; } } @media screen and (min-width: 2560px) { :where(.elementor-11790) .big-screen-img-set img { height: 500px !important; object-fit: cover !important; width: 100% !important; } :where(.elementor-11790) .big-screen-img-height-set img { height: 500px !important; object-fit: cover !important; width: 100% !important; } :where(.elementor-11790) .big-screen-img-height-set1 img { height: 500px !important; object-fit: cover !important; width: 100% !important; } } @media screen and (min-width: 3000px) { :where(.elementor-11790) .big-screen-img-set img { height: 650px !important; object-fit: cover !important; width: 100% !important; } :where(.elementor-11790) .big-screen-img-height-set img { height: 600px !important; object-fit: cover !important; width: 100% !important; } :where(.elementor-11790) .big-screen-img-height-set1 img { height: 600px !important; object-fit: cover !important; width: 100% !important; } :where(.elementor-11790) .big-screen-padding-set.e-flex.e-con.e-child { padding-top: 200px; padding-bottom: 200px; } } /* cosmos (9347) page CSS */ @media screen and (min-width: 2500px) { :where(.elementor-9347) .big-screen-font-set h2.elementor-heading-title.elementor-size-default { font-size: 55px !important; } :where(.elementor-9347) .big-screen-font-set .elementor-widget-text-editor.animated.slideInUp { width: 80%; } :where(.elementor-9347) .big-screen-font-set p { font-size: 50px; line-height: 48px; } } /* cetram (8492) page CSS */ @media screen and (min-width: 2500px) { :where(.elementor-8492) .big-screen-font-set h2.elementor-heading-title.elementor-size-default { font-size: 55px !important; } :where(.elementor-8492) .big-screen-font-set .elementor-widget-text-editor.animated.slideInUp { width: 80%; } :where(.elementor-8492) .big-screen-font-set p { font-size: 50px; line-height: 48px; } } /* serenity (7912) page CSS */ @media screen and (min-width: 2500px) { :where(.elementor-7912) .big-screen-font-set h2.elementor-heading-title.elementor-size-default { font-size: 50px !important; line-height: 60px !important; } :where(.elementor-7912) .big-screen-font-set .elementor-widget-text-editor.animated.slideInUp { font-size: 34px !important; line-height: 42px !important; } } /* los-cabos (7442) elements c31f389, 8da64ce, b64b661, 4bcbb8e + page CSS */ :where(.elementor-7442) h2 { font-family: Garamond !important; } :where(.elementor-7442) .emphasis-garamond { font-family: Garamond !important; font-style: italic; } @media screen and (min-width: 2560px) { :where(.elementor-7442) .big-screen-fix h2.elementor-heading-title.elementor-size-default { font-size: 80px !important; line-height: 75px !important; } :where(.elementor-7442) .big-screen-fix .elementor-widget.elementor-widget-heading.animated.slideInUp { width: 50% !important; } :where(.elementor-7442) .big-screen-fix2 h2.elementor-heading-title.elementor-size-default { font-style: italic; font-size: 80px !important; line-height: 90px !important; } :where(.elementor-7442) .big-screen-fix2 p { font-size: 34px; line-height: 1.3em; } :where(.elementor-7442) .big-screen-fix2.e-flex.e-con.e-child { width: 60%; } } @media screen and (min-width: 3000px) { :where(.elementor-7442) .big-screen-fix h2.elementor-heading-title.elementor-size-default { font-size: 100px !important; line-height: 90px !important; } :where(.elementor-7442) .big-screen-fix2 h2.elementor-heading-title.elementor-size-default { font-style: italic; font-size: 100px !important; line-height: 90px !important; } :where(.elementor-7442) .big-screen-fix2 p { font-size: 42px; line-height: 1.3em; } :where(.elementor-7442) .big-screen-fix2.e-flex.e-con.e-child { width: 70%; } } /* our-legacy (4440) elements 1126bcd2, 3f2336c1 + page CSS */ .elementor-4440 .elementor-element.elementor-element-3f2336c1 { min-width: max-content; animation: scroll-left 20s linear infinite; } :where(.elementor-4440) #show-less.hide { display: none; } :where(.elementor-4440) #show-less { padding: 10px 20px; border: none; color: #fff; font-weight: bold; cursor: pointer; border-radius: 5px; display: inline-block; margin-top: 20px; } :where(.elementor-4440) .hidden-service { display: none; } :where(.elementor-4440) .btn-wrap { text-align: center; margin-top: 20px; } :where(.elementor-4440) button { padding: 10px 20px; border: none; background: #c5a15e; color: #fff; font-weight: bold; cursor: pointer; border-radius: 5px; } :where(.elementor-4440) button:hover { background: #a88a4e; } :where(.elementor-4440) .hide { display: none; } :where(.elementor-4440) .municipal-park-slider-height-set img.swiper-slide-image, :where(.elementor-4440) .port-veracruz-img-set img.swiper-slide-image, :where(.elementor-4440) .Tecnopolo-img-set1 img.swiper-slide-image, :where(.elementor-4440) .tuxpan-slider-height-set img.swiper-slide-image, :where(.elementor-4440) .sala-slider-height-set img.swiper-slide-image, :where(.elementor-4440) .park-slider-height-set img.swiper-slide-image, :where(.elementor-4440) .ecological-slider-height-set img.swiper-slide-image, :where(.elementor-4440) .sport-center-img-set img.swiper-slide-image, :where(.elementor-4440) .reforma-veracruz-img-set1 img.swiper-slide-image, :where(.elementor-4440) .port-veracruz-img-set1 img.swiper-slide-image, :where(.elementor-4440) .garden-slider-height-set2 img.swiper-slide-image { height: 700px; width: 100%; object-fit: cover; } :where(.elementor-4440) .distribution-img-set img.swiper-slide-image, :where(.elementor-4440) .colima-bridge-img-set img.swiper-slide-image, :where(.elementor-4440) .rio-slider-height-set img.swiper-slide-image { height: 700px; object-fit: cover; } :where(.elementor-4440) .Tecnopolo-img-set img.swiper-slide-image { height: 700px; } :where(.elementor-4440) .ciudad-slider-set img.swiper-slide-image { height: 400px; width: 100%; object-fit: cover; } :where(.elementor-4440) .ciudad-slider-set1 img.swiper-slide-image { width: 100%; object-fit: contain; } :where(.elementor-4440) .garden-slider-height-set img.swiper-slide-image { height: 840px; width: 100%; object-fit: cover; } :where(.elementor-4440) .tunnels-img-set img.swiper-slide-image { height: 650px; width: 100%; object-fit: cover; } @media (max-width: 767.98px) { :where(.elementor-4440) .garden-slider-height-set2 img.swiper-slide-image, :where(.elementor-4440) .port-veracruz-img-set1 img.swiper-slide-image, :where(.elementor-4440) .tuxpan-slider-height-set img.swiper-slide-image, :where(.elementor-4440) .sala-slider-height-set img.swiper-slide-image, :where(.elementor-4440) .park-slider-height-set img.swiper-slide-image, :where(.elementor-4440) .ecological-slider-height-set img.swiper-slide-image, :where(.elementor-4440) .sport-center-img-set img.swiper-slide-image, :where(.elementor-4440) .reforma-veracruz-img-set1 img.swiper-slide-image, :where(.elementor-4440) .garden-slider-height-set img.swiper-slide-image, :where(.elementor-4440) .tunnels-img-set img.swiper-slide-image, :where(.elementor-4440) .municipal-park-slider-height-set img.swiper-slide-image { height: 250px; width: 100%; object-fit: cover; } :where(.elementor-4440) .ciudad-slider-set img.swiper-slide-image { height: 250px; width: 100%; } :where(.elementor-4440) .rio-slider-height-set img.swiper-slide-image, :where(.elementor-4440) .Tecnopolo-img-set1 img.swiper-slide-image, :where(.elementor-4440) .distribution-img-set img.swiper-slide-image, :where(.elementor-4440) .colima-bridge-img-set img.swiper-slide-image { height: 250px; object-fit: cover; } } /* compartido: Home 7c310fa, Our Legacy 1126bcd2, Financial Services e024dc7, Why Invest 42a6395b */ @media (max-width: 767px) { :where(.elementor-13, .elementor-4440, .elementor-1739, .elementor-93) .mobile-video { color: black !important; } } /* compartido: Home 393c3a3d, Financial Services 011b0c0 */ :where(.elementor-13, .elementor-1739) .heading span { font-family: "Garamond Premier Pro"; font-weight: 400; } /* why-invest (93) page CSS (reglas de BWD Timeline omitidas: plugin ausente) */ :where(.elementor-93) .time-line-set .twae-arrow { display: none; } :where(.elementor-93) .how-it-work-set .twae-content { box-shadow: none !important; border: 2px solid #c8a76b !important; } :where(.elementor-93) .how-it-work-set .twae-arrow { display: none; } :where(.elementor-93) .how-it-work-set p { margin: 0 !important; } :where(.elementor-93) .how-it-work-set .twae-description { margin-bottom: 0; } :where(.elementor-93) .time-line-set span { font-family: "Garamond Premier Pro" !important; font-size: 18px; } /* services (81) element ac00033 */ .elementor-81 .elementor-element.elementor-element-ac00033 { min-width: max-content; animation: scroll-left 10s linear infinite; } /* about-us (51) elements 2d33ce59, 7695c566, 5e80357a, 63c4776c + page CSS */ .elementor-51 .elementor-element.elementor-element-2d33ce59, .elementor-51 .elementor-element.elementor-element-7695c566, .elementor-51 .elementor-element.elementor-element-5e80357a, .elementor-51 .elementor-element.elementor-element-63c4776c { flex-shrink: 0; } :where(.elementor-51) .about-counter .elementor-counter-title { text-align: center; } /* current-project (38) page CSS */ :where(.elementor-38) .text-hide-hover-set h2 { display: none; } :where(.elementor-38) .full-box-hover-set:hover .text-hide-hover-set h2 { display: block; } :where(.elementor-38) #skyline-box-set, :where(.elementor-38) #eco-box-set, :where(.elementor-38) #coastal-box-set, :where(.elementor-38) #cabos-box-set, :where(.elementor-38) #altai-box-set { display: none; opacity: 0; transform: translateX(40px); transition: opacity 0.4s, transform 0.4s; } :where(.elementor-38) #current-box-set { display: block; opacity: 1; transition: opacity 0.4s; } /* ===================================================================== 5) Header y footer reconstruidos desde las plantillas Theme Builder 105/107 y el popup de menú 505 (Elementor Pro retirado). Cabecera y pie van dentro de cada página comercial; el header/footer genérico de Hello queda como respaldo en páginas sin esta reconstrucción. Si Elementor Pro vuelve a activarse con Theme Builder, estas copias se ocultan solas. ===================================================================== */ body:has(.hg-site-header) #site-header, body:has(.hg-site-footer) #site-footer { display: none !important; } body:has(.elementor-location-header) .hg-site-header, body:has(.elementor-location-footer) .hg-site-footer { display: none !important; } html.hg-menu-open { overflow: hidden; } .hg-header { width: 100%; } .hg-site-header .hg-header-widget { width: 100%; max-width: 100%; flex: 1 1 100%; } .hg-header__bar { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; column-gap: 20px; } .hg-header__left { display: flex; align-items: center; } .hg-header .hg-header__toggle, .hg-header .hg-header__toggle:hover, .hg-header .hg-header__toggle:focus { display: inline-flex; align-items: center; gap: 28px; margin: 0; padding: 6px 0; background: none; border: 0; border-radius: 0; color: #211F20; cursor: pointer; font-family: "Garamond Premier Pro", Garamond, serif; font-size: 20px; font-weight: 400; line-height: 24px; letter-spacing: 2px; } .hg-header .hg-header__toggle:focus-visible { outline: 2px solid #C8A76B; outline-offset: 4px; } .hg-header__toggle img, .hg-header__toggle .hg-header__icon { display: block; flex: none; width: 28px; height: 24px; fill: #000; } .hg-header__logo { display: block; justify-self: center; line-height: 0; } .hg-header__logo img { display: block; width: 145px; max-width: none; height: auto; } .hg-header__right { display: flex; justify-content: flex-end; align-items: center; } .hg-header .hg-header__cta { display: inline-block; padding: 15px 30px; background-color: #C8A76B; color: #fff; font-family: "Garamond Premier Pro", Garamond, serif; font-size: 18px; font-weight: 400; line-height: 24px; letter-spacing: 2px; text-decoration: none; transition: background-color .3s, color .3s; } .hg-header .hg-header__cta:hover, .hg-header .hg-header__cta:focus-visible { background-color: #000; color: #fff; } @media (max-width: 1024px) { .hg-header__cta { display: none !important; } } @media (max-width: 767px) { .hg-header__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; } .hg-header__logo img { width: 115px; } } .hg-flyout[hidden] { display: none !important; } .hg-flyout { position: fixed; inset: 0; z-index: 99999; } .hg-flyout__backdrop { position: absolute; inset: 0; background: rgba(0, 0, 0, .35); } .hg-flyout__panel { position: absolute; top: 0; bottom: 0; left: 0; width: 500px; max-width: 100%; box-sizing: border-box; overflow-y: auto; padding: 60px 30px 40px; background: #211F20; animation: hg-slide-in .8s ease both; } @keyframes hg-slide-in { from { transform: translateX(-100%); } to { transform: translateX(0); } } @media (prefers-reduced-motion: reduce) { .hg-flyout__panel { animation: none; } } .hg-flyout .hg-flyout__close, .hg-flyout .hg-flyout__close:hover, .hg-flyout .hg-flyout__close:focus { position: absolute; top: 18px; right: 18px; width: 44px; height: 44px; margin: 0; padding: 0; background: none; border: 0; border-radius: 0; color: #fff; font-size: 34px; line-height: 44px; text-align: center; cursor: pointer; } .hg-flyout .hg-flyout__close:focus-visible { outline: 2px solid #C8A76B; outline-offset: 2px; } .hg-flyout__logo { display: block; padding-left: 50px; line-height: 0; } .hg-flyout__logo img { width: 150px; height: auto; } .hg-flyout__menu { list-style: none; margin: 0; padding: 50px 0 0 50px; } .hg-flyout__menu li { margin: 0; padding: 12px 0; } .hg-flyout a.hg-flyout__fs, .hg-flyout__menu a { color: #fff; font-family: "Garamond Premier Pro", Garamond, serif; font-size: 24px; font-weight: 400; line-height: 24px; letter-spacing: 2px; text-decoration: none; transition: color .3s; } .hg-flyout__menu a:hover, .hg-flyout__menu a:focus-visible, .hg-flyout__menu a[aria-current="page"], .hg-flyout a.hg-flyout__fs:hover, .hg-flyout a.hg-flyout__fs:focus-visible { color: #C8A76B; } .hg-flyout a.hg-flyout__fs { display: inline-block; margin: 50px 0 0 50px; } @media (max-width: 991px) { .hg-flyout__panel { width: 400px; } } @media (max-width: 767px) { .hg-flyout__panel { width: 350px; padding: 50px 15px 30px; } .hg-flyout__logo, .hg-flyout__menu { padding-left: 15px; } .hg-flyout a.hg-flyout__fs { margin-left: 15px; } } /* Footer (plantilla 107): enlaces de contacto en blanco, como el original. */ .hg-site-footer .footer-contact-set a { color: #fff !important; } .hg-site-footer .footer-contact-set a:hover { color: #C8A76B !important; } .hg-site-footer .footer-contact-set p { margin: 0 0 6px; } /* ===================================================================== 6) Carruseles Pro (nested-carousel) de Financial Services, Why Invest y Services reconstruidos como contenedores con desplazamiento horizontal (scroll-snap) y flechas accesibles. Misma cantidad de tarjetas visibles que el original: 3 o 4 en escritorio, 2 en tablet, 1 en móvil. ===================================================================== */ .e-con.hg-carousel { --hg-per: 3; --hg-gap: 25px; display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important; gap: var(--hg-gap) !important; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; scroll-behavior: smooth; -webkit-overflow-scrolling: touch; scrollbar-width: thin; scrollbar-color: #C8A76B rgba(0, 0, 0, .08); padding-bottom: 14px !important; } .e-con.hg-carousel { width: 100% !important; max-width: 100% !important; min-width: 0; flex: 1 1 100% !important; align-self: stretch; } .e-con.hg-carousel--d4 { --hg-per: 4; } .e-con.hg-carousel--g10 { --hg-gap: 10px; } .e-con.hg-carousel--g35 { --hg-gap: 35px; } .e-con.hg-carousel > .e-con { flex: 0 0 calc((100% - (var(--hg-per) - 1) * var(--hg-gap)) / var(--hg-per)) !important; width: auto !important; max-width: none !important; scroll-snap-align: start; } @media (max-width: 1024px) { .e-con.hg-carousel { --hg-per: 2; } } @media (max-width: 767px) { .e-con.hg-carousel { --hg-per: 1.15; --hg-gap: 16px; } } .hg-carousel::-webkit-scrollbar { height: 6px; } .hg-carousel::-webkit-scrollbar-thumb { background: #C8A76B; border-radius: 3px; } .hg-carousel::-webkit-scrollbar-track { background: rgba(0, 0, 0, .08); } .hg-carousel-nav { display: flex; justify-content: center; gap: 16px; margin-top: 10px; } .hg-carousel-nav[hidden] { display: none; } .hg-carousel-nav .hg-carousel-nav__btn, .hg-carousel-nav .hg-carousel-nav__btn:focus { width: 48px; height: 48px; margin: 0; padding: 0; border: 1px solid #C8A76B; border-radius: 50%; background: transparent; color: #211F20; font-size: 28px; line-height: 44px; text-align: center; cursor: pointer; transition: background-color .3s, color .3s; } .hg-carousel-nav .hg-carousel-nav__btn:hover { background: #C8A76B; color: #fff; } .hg-carousel-nav .hg-carousel-nav__btn:focus-visible { outline: 2px solid #C8A76B; outline-offset: 3px; } .hg-carousel-nav .hg-carousel-nav__btn[disabled] { opacity: .35; cursor: default; background: transparent; color: #211F20; } /* Why Invest: etiquetas del timeline (TWAE) con la tipografía de marca. */ :where(.elementor-93) .time-line-set .twae-labels, :where(.elementor-93) .time-line-set .twae-label-big { font-family: "Garamond Premier Pro", Garamond, serif; font-size: 20px; font-weight: 400; letter-spacing: 1px; color: #211F20; } /* ===================================================================== 7) Imágenes sin deformación (2026-09-28). Elementor solo aplica "object-fit" en los breakpoints donde también hay altura propia; en el resto la foto se estiraba. Se aplica cover (el ajuste que el diseño ya indicaba) y, para el diagrama de Cetram en escritorio, contain apoyado sobre el panel inferior. ===================================================================== */ :where(.elementor-13) .elementor-element-6787708e img, :where(.elementor-9347) :is(.elementor-element-06c63dd, .elementor-element-829c87f, .elementor-element-71334bd) img, :where(.elementor-11790) :is(.elementor-element-71334bd, .elementor-element-3d0e048) img, :where(.elementor-4440) :is(.elementor-element-e49f808, .elementor-element-6c33a6e6) img, :where(.elementor-8492) :is(.elementor-element-465d75c, .elementor-element-967b39f) img, :where(.elementor-1739) .elementor-element-864d994 img, :where(.elementor-93) :is(.elementor-element-04183b1, .elementor-element-29380c4, .elementor-element-8d2c18d, .elementor-element-12cc2dca) img { object-fit: cover; } @media (min-width: 1025px) { :where(.elementor-8492) .elementor-element-967b39f img { object-fit: contain; object-position: 50% 100%; } } /* ===================================================================== 8) Titulares largos en anchos intermedios (2026-09-28). Con la tipografía de marca restaurada, algunas palabras largas no cabían en su columna entre 768 y 1599 px (en Serenity provocaba desplazamiento horizontal). Se reduce el tamaño solo en esos rangos; móvil y escritorio amplio quedan iguales. ===================================================================== */ @media (min-width: 768px) and (max-width: 991px) { .elementor-11790 .elementor-element.elementor-element-970d2aa .elementor-heading-title { font-size: 28px !important; } .elementor-7912 .elementor-element.elementor-element-4b777dd .elementor-heading-title { font-size: 29px !important; } .elementor-7912 .elementor-element.elementor-element-cec97f8 .elementor-heading-title { font-size: 22px !important; } .elementor-7912 .elementor-element.elementor-element-728cc8d .elementor-heading-title { font-size: 19px !important; } .elementor-13 .elementor-element.elementor-element-74dc6f65, .elementor-13 .elementor-element.elementor-element-74dc6f65 p { font-size: 16px !important; } } @media (min-width: 992px) and (max-width: 1024px) { .elementor-11790 .elementor-element.elementor-element-970d2aa .elementor-heading-title { font-size: 27px !important; } .elementor-7912 .elementor-element.elementor-element-4b777dd .elementor-heading-title { font-size: 41px !important; } .elementor-7912 .elementor-element.elementor-element-cec97f8 .elementor-heading-title { font-size: 29px !important; } .elementor-9347 .elementor-element.elementor-element-6d9e9ce, .elementor-9347 .elementor-element.elementor-element-6d9e9ce p { font-size: 19px !important; } .elementor-8492 :is(.elementor-element-02a4508, .elementor-element-c0b7d75, .elementor-element-e3086dc, .elementor-element-85016af) .elementor-heading-title { font-size: 14px !important; } } @media (min-width: 1025px) and (max-width: 1200px) { .elementor-11790 .elementor-element.elementor-element-970d2aa .elementor-heading-title { font-size: 29px !important; } .elementor-7912 .elementor-element.elementor-element-cec97f8 .elementor-heading-title { font-size: 30px !important; } .elementor-9347 .elementor-element.elementor-element-6d9e9ce, .elementor-9347 .elementor-element.elementor-element-6d9e9ce p { font-size: 20px !important; } .elementor-8492 :is(.elementor-element-02a4508, .elementor-element-c0b7d75, .elementor-element-e3086dc, .elementor-element-85016af) .elementor-heading-title { font-size: 15px !important; } } @media (min-width: 1201px) and (max-width: 1366px) { .elementor-8492 :is(.elementor-element-02a4508, .elementor-element-c0b7d75, .elementor-element-e3086dc, .elementor-element-85016af) .elementor-heading-title { font-size: 18px !important; } .elementor-13 .elementor-element.elementor-element-74dc6f65, .elementor-13 .elementor-element.elementor-element-74dc6f65 p { font-size: 16px !important; } } @media (min-width: 1367px) and (max-width: 1599px) { .elementor-11790 .elementor-element.elementor-element-970d2aa .elementor-heading-title { font-size: 30px !important; } .elementor-8492 :is(.elementor-element-02a4508, .elementor-element-c0b7d75, .elementor-element-e3086dc, .elementor-element-85016af) .elementor-heading-title { font-size: 20px !important; } } /* ===================================================================== 9) Footer: contacto limpio y formulario modal "Contact Us" (2026-09-28). El bloque .hg-cmodal vive dentro del footer de cada página; un script lo mueve al final del documento y lo abre como diálogo accesible. Sin script, los enlaces Contact Us llevan a /contact/. ===================================================================== */ .hg-site-footer .footer-contact-set .hg-fc-line { display: flex; flex-wrap: wrap; align-items: center; column-gap: 10px; row-gap: 4px; } .hg-site-footer .footer-contact-set a.hg-fc-wa { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 50%; line-height: 0; } .hg-site-footer .footer-contact-set a.hg-fc-wa:focus-visible { outline: 2px solid #C8A76B; outline-offset: 2px; } .hg-site-footer .elementor-heading-title a { color: inherit; } .hg-site-footer .hg-cmodal { display: none !important; } html.hg-cmodal-open { overflow: hidden; } .hg-cmodal-wrap[hidden] { display: none !important; } .hg-cmodal-wrap { position: fixed; inset: 0; z-index: 100000; display: flex; align-items: center; justify-content: center; padding: 24px 16px; } .hg-cmodal-backdrop { position: absolute; inset: 0; background: rgba(33, 31, 32, .6); } .hg-cmodal-wrap .hg-cmodal.e-con { position: relative; display: block !important; width: min(620px, 100%) !important; max-width: 100% !important; max-height: calc(100vh - 48px); max-height: calc(100dvh - 48px); overflow-y: auto; margin: 0; padding: 44px 40px 36px; background: #F4F0E9; box-shadow: 0 20px 60px rgba(0, 0, 0, .35); color: #211F20; animation: hg-cmodal-in .35s ease both; } @keyframes hg-cmodal-in { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } } @media (prefers-reduced-motion: reduce) { .hg-cmodal-wrap .hg-cmodal.e-con { animation: none; } } .hg-cmodal:focus { outline: none; } .hg-cmodal .elementor-widget { width: 100%; } .hg-cmodal__head { position: relative; margin: 0 0 24px; padding-right: 40px; } .hg-cmodal__eyebrow { margin: 0 0 6px; font-family: "Garamond Premier Pro", Garamond, serif; font-size: 14px; line-height: 1.4; letter-spacing: 3px; text-transform: uppercase; color: #6B5A38; } .hg-cmodal__title { margin: 0 0 8px; font-family: "Garamond Premier Pro", Garamond, serif; font-size: 34px; font-weight: 400; line-height: 1.15; letter-spacing: 1px; color: #211F20; } .hg-cmodal__intro { margin: 0; font-family: "Garamond Premier Pro", Garamond, serif; font-size: 18px; line-height: 1.45; color: #3A3634; } .hg-cmodal .hg-cmodal__close, .hg-cmodal .hg-cmodal__close:hover, .hg-cmodal .hg-cmodal__close:focus { position: absolute; top: -28px; right: -24px; width: 44px; height: 44px; margin: 0; padding: 0; background: none; border: 0; border-radius: 0; color: #211F20; font-size: 34px; line-height: 44px; text-align: center; cursor: pointer; } .hg-cmodal .hg-cmodal__close:focus-visible { outline: 2px solid #C8A76B; outline-offset: 2px; } .hg-cmodal .wpcf7 form { display: grid; grid-template-columns: minmax(0, 1fr); row-gap: 18px; } .hg-cmodal .wpcf7 form > p { margin: 0; } .hg-cmodal .wpcf7 label { display: block; margin: 0; font-family: "Garamond Premier Pro", Garamond, serif; font-size: 16px; line-height: 1.3; letter-spacing: 1px; text-transform: uppercase; color: #211F20; } .hg-cmodal .wpcf7 label br { display: none; } .hg-cmodal .wpcf7 .hg-req { color: #6B5A38; } .hg-cmodal .wpcf7 .hg-opt { text-transform: none; letter-spacing: 0; color: #5C5652; } .hg-cmodal .wpcf7 .wpcf7-form-control-wrap { display: block; margin-top: 6px; } .hg-cmodal .wpcf7 input:is([type="text"], [type="email"], [type="tel"]), .hg-cmodal .wpcf7 textarea { display: block; width: 100%; box-sizing: border-box; min-height: 47px; margin: 0; padding: 8px 14px; background: #fff; color: #211F20; border: 0; border-radius: 0; box-shadow: 0 0 4px 0 rgba(0, 0, 0, .45); font-family: "Garamond Premier Pro", Garamond, serif; font-size: 18px; line-height: 24px; letter-spacing: .3px; text-transform: none; } .hg-cmodal .wpcf7 textarea { height: 140px; min-height: 110px; resize: vertical; } .hg-cmodal .wpcf7 :is(input, textarea)::placeholder { color: #6f6f6f; opacity: 1; } .hg-cmodal .wpcf7 :is(input, textarea):focus { outline: 2px solid #C8A76B; outline-offset: 2px; } .hg-cmodal .wpcf7 form > p:has(.wpcf7-submit) { position: relative; text-align: left; } .hg-cmodal .wpcf7 .wpcf7-submit { display: inline-block; min-height: 47px; margin: 4px 0 0; padding: 11px 44px; background: #C8A76B; color: #211F20; border: 0; border-radius: 0; font-family: "Garamond Premier Pro", Garamond, serif; font-size: 18px; line-height: 24px; letter-spacing: 2px; cursor: pointer; transition: background-color .3s, color .3s; } .hg-cmodal .wpcf7 .wpcf7-submit:is(:hover, :focus-visible) { background: #000; color: #fff; } .hg-cmodal .wpcf7 .wpcf7-submit:focus-visible { outline: 2px solid #C8A76B; outline-offset: 3px; } .hg-cmodal .wpcf7 .wpcf7-spinner { position: absolute; top: calc(50% - 10px); margin: 0 0 0 12px; } .hg-cmodal .wpcf7 .wpcf7-not-valid-tip { margin-top: 6px; font-family: "Garamond Premier Pro", Garamond, serif; font-size: 15px; line-height: 1.4; letter-spacing: 0; text-transform: none; color: #9E1C14; } .hg-cmodal .wpcf7 form .wpcf7-response-output { margin: 0; padding: 12px 16px; font-family: "Garamond Premier Pro", Garamond, serif; font-size: 17px; line-height: 1.4; } @media (max-width: 767px) { .hg-cmodal-wrap { align-items: flex-end; padding: 12px 8px 0; } .hg-cmodal-wrap .hg-cmodal.e-con { padding: 36px 20px 28px; max-height: calc(100vh - 12px); max-height: calc(100dvh - 12px); } .hg-cmodal .hg-cmodal__close, .hg-cmodal .hg-cmodal__close:hover, .hg-cmodal .hg-cmodal__close:focus { top: -24px; right: -8px; } .hg-cmodal__title { font-size: 28px; } } /* ===================================================================== 10) Contraste AA en botones dorados y LCP móvil de Home (2026-09-28). El dorado de marca se conserva; el texto pasa a #211F20 (7.1:1). En hover y foco sigue el negro con texto blanco. En móvil, la imagen principal de Home (6ebb705f) se muestra sin esperar la animación de entrada. ===================================================================== */ .hg-header .hg-header__cta { color: #211F20; } :is(.elementor-element-48c65de, .elementor-element-49d12600) .wpcf7 .wpcf7-submit { color: #211F20; } .hg-carousel-nav .hg-carousel-nav__btn:hover { color: #211F20; } @media (max-width: 767px) { .elementor-13 .elementor-element.elementor-element-6ebb705f.elementor-invisible, .elementor-13 .elementor-element.elementor-element-6ebb705f.animated { visibility: visible !important; opacity: 1 !important; animation: none !important; } } /* ===================================================================== 11) Contraste AA sin cambiar la paleta (2026-09-28): texto oscuro sobre el recuadro dorado de años de experiencia (Home) y gris de párrafos de Residential Projects ligeramente más oscuro (4.0 a 5.2:1). ===================================================================== */ .elementor-13 .elementor-element-57a5ec5a :is(.elementor-counter-title, .elementor-counter-number-wrapper, .elementor-counter-number-prefix, .elementor-counter-number-suffix) { color: #211F20; } .elementor-12486 :is(.elementor-element-381ce2b, .elementor-element-be367a4, .elementor-element-c2be2aa, .elementor-element-95362f1) .elementor-widget-container { color: #6A655E; } /* ===================================================================== 12) Portafolio residencial (2026-09-28): sección "Signature Residential Projects" en Current Projects, enlazada a /residential-projects/ (página publicada que había quedado sin enlaces internos). ===================================================================== */ .hg-portfolio { max-width: 1680px; margin: 0 auto; padding: 30px 0 90px; text-align: center; font-family: "Garamond Premier Pro", Garamond, serif; color: #211F20; } .hg-portfolio__eyebrow { margin: 0 0 10px; font-size: 14px; line-height: 1.4; letter-spacing: 3px; text-transform: uppercase; color: #6B5A38; } .hg-portfolio__title { margin: 0 0 12px; font-family: inherit; font-size: 48px; font-weight: 400; line-height: 1.15; letter-spacing: 1px; color: #211F20; text-wrap: balance; } .hg-portfolio__intro { max-width: 640px; margin: 0 auto 44px; font-size: 20px; line-height: 1.5; color: #3A3634; } .hg-portfolio__grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 20px; margin: 0; padding: 0; list-style: none; text-align: left; } .hg-portfolio__item { margin: 0; padding: 0; } .hg-portfolio__card { display: flex; flex-direction: column; height: 100%; background: #fff; color: inherit; text-decoration: none; } .hg-portfolio__card:focus-visible { outline: 2px solid #C8A76B; outline-offset: 3px; } .hg-portfolio__media { display: block; aspect-ratio: 4 / 5; overflow: hidden; } .hg-portfolio__media img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .8s cubic-bezier(.25, .46, .45, .94); } .hg-portfolio__card:hover .hg-portfolio__media img { transform: scale(1.03); } .hg-portfolio__body { display: block; padding: 20px 20px 24px; } .hg-portfolio__name { display: block; font-size: 24px; line-height: 1.2; color: #211F20; } .hg-portfolio__loc { display: block; margin-top: 8px; font-size: 14px; line-height: 1.4; letter-spacing: 1.5px; text-transform: uppercase; color: #6B5A38; } .hg-portfolio__cta { margin: 44px 0 0; } .hg-portfolio .hg-portfolio__btn { display: inline-block; padding: 15px 36px; background: #C8A76B; color: #211F20; font-size: 18px; line-height: 24px; letter-spacing: 2px; text-decoration: none; transition: background-color .3s, color .3s; } .hg-portfolio .hg-portfolio__btn:hover, .hg-portfolio .hg-portfolio__btn:focus-visible { background: #000; color: #fff; } @media (prefers-reduced-motion: reduce) { .hg-portfolio__media img { transition: none; } .hg-portfolio__card:hover .hg-portfolio__media img { transform: none; } } @media (max-width: 1024px) { .hg-portfolio__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } .hg-portfolio__title { font-size: 40px; } } @media (max-width: 767px) { .hg-portfolio { padding: 10px 0 60px; } .hg-portfolio__title { font-size: 32px; } .hg-portfolio__intro { margin-bottom: 30px; font-size: 18px; } .hg-portfolio__grid { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 78%; gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 12px; scrollbar-width: thin; scrollbar-color: #C8A76B rgba(0, 0, 0, .08); } .hg-portfolio__item { scroll-snap-align: start; } .hg-portfolio__name { font-size: 22px; } } /* ===================================================================== 13) Contraste AA con la paleta de marca (2026-09-28). Sustituye en la práctica a la sección 11 donde Elementor tenía más especificidad. - Texto oscuro #211F20 sobre dorado (Home: años de experiencia, pasos 1-4). - Cifras doradas grandes en un dorado más profundo #A6813E (3.2:1). - Etiquetas doradas pequeñas en #6B5A38 (5.9:1), como el resto del sitio. - Cetram y Cosmos: se conservan los paneles tostados; su texto pasa a #211F20. - Serenity: fondo taupe apenas más profundo (#86715F) para 4.6:1 con blanco. ===================================================================== */ .hg-portfolio .hg-portfolio__eyebrow { margin: 0 0 10px; } .hg-portfolio .hg-portfolio__title { margin: 0 0 12px; } .hg-portfolio .hg-portfolio__intro { margin: 0 auto 44px; } .hg-portfolio .hg-portfolio__cta { margin: 44px 0 0; } @media (max-width: 767px) { .hg-portfolio .hg-portfolio__intro { margin-bottom: 30px; } } .elementor-13 .elementor-element.elementor-element-7881bb96 :is(.elementor-counter-title, .elementor-counter-number-wrapper, .elementor-counter-number-prefix, .elementor-counter-number-suffix), .elementor-13 .elementor-element:is(.elementor-element-19d2fb66, .elementor-element-2f5565d8, .elementor-element-3e284a4b, .elementor-element-3952759a) :is(.elementor-heading-title, .elementor-counter-number-wrapper, .elementor-counter-title), .elementor-13 .elementor-element:is(.elementor-element-19d2fb66, .elementor-element-2f5565d8, .elementor-element-3e284a4b, .elementor-element-3952759a) { color: #211F20; } .elementor-13 .elementor-element:is(.elementor-element-60fc426, .elementor-element-38ef5eae, .elementor-element-8accc) :is(.elementor-counter-number-wrapper, .elementor-counter-number-prefix, .elementor-counter-number-suffix, .elementor-heading-title), .elementor-51 .elementor-element:is(.elementor-element-714c6aa4, .elementor-element-ff8d977, .elementor-element-7ba993b2, .elementor-element-7fa392f) :is(.elementor-counter-number-wrapper, .elementor-counter-number-prefix, .elementor-counter-number-suffix, .elementor-heading-title) { color: #A6813E; } .elementor-12486 .elementor-element:is(.elementor-element-6e0eedd, .elementor-element-f54de27, .elementor-element-52b8d12, .elementor-element-ae52eab, .elementor-element-c4c9b6c, .elementor-element-12b474e) .elementor-heading-title, .elementor-12486 .elementor-element:is(.elementor-element-3a3ef4d, .elementor-element-cb6980a, .elementor-element-a428f70, .elementor-element-c77ab1e, .elementor-element-766af7a) .elementor-divider__text { color: #6B5A38; } .elementor-12486 .elementor-element:is(.elementor-element-381ce2b, .elementor-element-be367a4, .elementor-element-c2be2aa, .elementor-element-95362f1), .elementor-12486 .elementor-element:is(.elementor-element-381ce2b, .elementor-element-be367a4, .elementor-element-c2be2aa, .elementor-element-95362f1) :is(p, span) { color: #6A655E; } .elementor-8492 .elementor-element:is(.elementor-element-2b79f19, .elementor-element-ba35bbd, .elementor-element-656bbf0) :is(.elementor-heading-title, .elementor-widget-text-editor, .elementor-icon-list-text), .elementor-8492 .elementor-element:is(.elementor-element-2b79f19, .elementor-element-ba35bbd, .elementor-element-656bbf0) .elementor-widget-text-editor :is(p, span, strong, li, h1, h2, h3, h4, h5, h6), .elementor-9347 .elementor-element.elementor-element-1eae5eb :is(.elementor-heading-title, .elementor-widget-text-editor, .elementor-icon-list-text), .elementor-9347 .elementor-element.elementor-element-1eae5eb .elementor-widget-text-editor :is(p, span, strong, li, h1, h2, h3, h4, h5, h6) { color: #211F20 !important; } .elementor-7912 .elementor-element.elementor-element-17cb019.e-con:not(.elementor-motion-effects-element-type-background) { background-color: #86715F; } /* 13b) Complemento: cifras de Home en icon-box y paneles tostados restantes de Cetram y Cosmos. */ .elementor-13 .elementor-element:is(.elementor-element-60fc426, .elementor-element-38ef5eae, .elementor-element-8accc) :is(.elementor-icon-box-title, .elementor-icon-box-title span, .elementor-icon-box-title a) { color: #A6813E; } .elementor-8492 .elementor-element:is(.elementor-element-9d34fd0, .elementor-element-3ec22ee) :is(.elementor-heading-title, .elementor-widget-text-editor, .elementor-icon-list-text), .elementor-8492 .elementor-element:is(.elementor-element-9d34fd0, .elementor-element-3ec22ee) .elementor-widget-text-editor :is(p, span, strong, li, h1, h2, h3, h4, h5, h6), .elementor-9347 .elementor-element.elementor-element-db00723 :is(.elementor-heading-title, .elementor-widget-text-editor, .elementor-icon-list-text), .elementor-9347 .elementor-element.elementor-element-db00723 .elementor-widget-text-editor :is(p, span, strong, li, h1, h2, h3, h4, h5, h6) { color: #211F20 !important; } /* ===================================================================== 14) Vídeo de portada de Home (2026-09-28): reproductor propio con portada inmediata, bucle silenciado, pausa accesible y respeto a reducir movimiento. Hoy usa la copia web provisional (1080p/720p); con data-vimeo-id pasa a Vimeo sin descargar el mp4 local. ===================================================================== */ .hg-hero-video { position: relative; width: 100%; aspect-ratio: 21 / 9; overflow: hidden; background: #211F20; } .hg-hero-video .hg-hero-video__poster, .hg-hero-video video.hg-hero-video__media { position: absolute; inset: 0; display: block; width: 100%; height: 100%; max-width: none; margin: 0; object-fit: cover; } .hg-hero-video iframe.hg-hero-video__media { position: absolute; top: 50%; left: 50%; width: 100%; height: auto; aspect-ratio: 16 / 9; border: 0; transform: translate(-50%, -50%); pointer-events: none; } .hg-hero-video .hg-hero-video__poster { z-index: 1; transition: opacity .6s ease; } .hg-hero-video.is-ready .hg-hero-video__poster { opacity: 0; } .hg-hero-video .hg-hero-video__toggle, .hg-hero-video .hg-hero-video__toggle:hover, .hg-hero-video .hg-hero-video__toggle:focus { position: absolute; right: 16px; bottom: 16px; z-index: 2; display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; margin: 0; padding: 0; border: 1px solid rgba(255, 255, 255, .7); border-radius: 50%; background: rgba(33, 31, 32, .55); color: #fff; line-height: 0; cursor: pointer; transition: background-color .3s; } .hg-hero-video .hg-hero-video__toggle:hover { background: rgba(33, 31, 32, .85); } .hg-hero-video .hg-hero-video__toggle:focus-visible { outline: 2px solid #C8A76B; outline-offset: 3px; } .hg-hero-video .hg-hero-video__toggle[hidden] { display: none; } .hg-hero-video .hg-hero-video__icon--play { display: none; } .hg-hero-video:not(.is-playing) .hg-hero-video__icon--play { display: block; } .hg-hero-video:not(.is-playing) .hg-hero-video__icon--pause { display: none; } @media (prefers-reduced-motion: reduce) { .hg-hero-video .hg-hero-video__poster { transition: none; } } @media (max-width: 767px) { .hg-hero-video .hg-hero-video__toggle, .hg-hero-video .hg-hero-video__toggle:hover, .hg-hero-video .hg-hero-video__toggle:focus { right: 10px; bottom: 10px; width: 36px; height: 36px; } } /* 14b) Portada de Home en móvil (2026-09-28): el contenedor de Elementor es columna con wrap y colapsaba el widget a 0 px. El widget ocupa todo el ancho y la portada reserva su espacio 21:9 aunque el vídeo no haya cargado, esté en pausa o falle. */ .elementor-widget.hg-hero-video-widget { width: 100%; max-width: 100%; flex-shrink: 0; } @supports not (aspect-ratio: 1 / 1) { .hg-hero-video { height: 0; padding-top: 42.857%; } }