.elementor-968 .elementor-element.elementor-element-868c3e6{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-968 .elementor-element.elementor-element-1b45360{width:100%;max-width:100%;}.elementor-968 .elementor-element.elementor-element-1b45360 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-968 .elementor-element.elementor-element-c5349c6{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-968 .elementor-element.elementor-element-bc06b38{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-968 .elementor-element.elementor-element-0c9611c{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-968 .elementor-element.elementor-element-e77d4cb{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-968 .elementor-element.elementor-element-2648f6f{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-968 .elementor-element.elementor-element-404269d{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-968 .elementor-element.elementor-element-c578231{width:100%;max-width:100%;}.elementor-968 .elementor-element.elementor-element-c578231 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}@media(min-width:768px){.elementor-968 .elementor-element.elementor-element-c5349c6{--width:100%;}.elementor-968 .elementor-element.elementor-element-bc06b38{--width:100%;}.elementor-968 .elementor-element.elementor-element-0c9611c{--width:100%;}.elementor-968 .elementor-element.elementor-element-e77d4cb{--width:100%;}.elementor-968 .elementor-element.elementor-element-2648f6f{--width:100%;}}/* Start custom CSS for html, class: .elementor-element-17e789d */#CEOJA_ES_ContactInfo_V4, #CEOJA_ES_ContactInfo_V4 *, #CEOJA_ES_ContactInfo_V4 *::before, #CEOJA_ES_ContactInfo_V4 *::after{ box-sizing:border-box; min-width:0; } /* ========================================================= SECTION ========================================================= */ #CEOJA_ES_ContactInfo_V4{ --es-black:#000000; --es-white:#ffffff; --es-green:#3a9b27; --es-yellow:#f1ba43; --es-lime:#95d90b; --es-dark:#0b160f; --es-dark-2:#122419; --es-dark-3:#18321f; position:relative; width:100% !important; max-width:100% !important; margin:0 !important; padding:5% !important; overflow-x:clip !important; overflow-y:visible; color:#ffffff; background: radial-gradient( circle at 12% 0%, rgba(149,217,11,.10) 0%, rgba(149,217,11,0) 29% ), radial-gradient( circle at 88% 100%, rgba(58,155,39,.10) 0%, rgba(58,155,39,0) 30% ), linear-gradient( 180deg, #f6fbf2 0%, #ffffff 17%, #ffffff 83%, #f5faf2 100% ); border-top: 1px solid rgba(58,155,39,.16); border-bottom: 1px solid rgba(58,155,39,.16); font-family: "Montserrat", sans-serif; } #CEOJA_ES_ContactInfo_V4 a{ text-decoration:none !important; } /* ========================================================= HEADER ========================================================= */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_header{ width:100%; max-width:1200px; margin: 0 auto clamp(30px,3vw,44px); text-align:center; } /* ========================================================= HEADER KICKER ========================================================= */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_kicker{ display:inline-flex; align-items:center; justify-content:center; gap:10px; margin: 0 auto 12px; color:var(--es-green); font-family: "Montserrat", sans-serif; font-size:14px; line-height:1.65; font-weight:500; letter-spacing:.08em; text-transform:uppercase; text-align:center; } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_kicker::before, #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_kicker::after{ content:""; width:24px; height:2px; flex:0 0 24px; border-radius:999px; background:var(--es-lime); } /* ========================================================= H2 ========================================================= */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_header h2{ width:100%; max-width:1200px; margin: 0 auto 16px; color:#000000; font-family: "Poppins", sans-serif !important; font-size:48px !important; line-height:1.12 !important; font-weight:700 !important; letter-spacing:-.03em !important; text-align:center; text-wrap:balance; } /* ========================================================= HEADER PARAGRAPH ========================================================= */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_header p{ width:100%; max-width:1000px; margin:0 auto; color:#5c645d; font-family: "Montserrat", sans-serif; font-size:16px !important; line-height:1.70 !important; font-weight:500 !important; text-align:center; } /* ========================================================= MAIN GRID ========================================================= */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_grid{ position:relative; width:100% !important; max-width:100% !important; min-width:0; margin:0 auto !important; display:grid; grid-template-columns: minmax(0,1.06fr) minmax(0,.94fr); align-items:stretch; overflow:hidden; border: 1px solid rgba(149,217,11,.22); border-radius:24px; background: linear-gradient( 135deg, var(--es-dark) 0%, var(--es-dark-2) 58%, var(--es-dark-3) 100% ); box-shadow: 0 18px 45px rgba(28,65,35,.08); } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_grid::before{ content:""; position:absolute; inset:0; z-index:0; pointer-events:none; background: radial-gradient( circle at 92% 7%, rgba(149,217,11,.11) 0%, rgba(149,217,11,0) 29% ); } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_map, #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_info{ position:relative; z-index:1; width:100%; min-width:0; height:100%; align-self:stretch; } /* ========================================================= MAP ========================================================= */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_map{ position:relative; min-height:0; overflow:hidden; border-right: 1px solid rgba(149,217,11,.17); background:#dfe4de; } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_map iframe{ position:absolute; inset:0; width:100% !important; max-width:100% !important; height:100% !important; display:block; border:0; } /* ========================================================= INFORMATION SIDE ========================================================= */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_info{ padding: clamp( 30px, 4vw, 52px ); display:flex; flex-direction:column; justify-content:center; overflow:hidden; } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_infoKicker{ display:block; width:100%; margin: 0 0 8px; color:#dff0d6; font-family: "Montserrat", sans-serif; font-size:14px; line-height:1.65; font-weight:500; letter-spacing:.07em; text-transform:uppercase; } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_info h3{ width:100%; max-width:700px; margin: 0 0 24px; color:#ffffff; font-family: "Montserrat", sans-serif; font-size:30px; line-height:1.20; font-weight:700; letter-spacing:-.02em; } /* ========================================================= SWIPE INDICATOR ========================================================= */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_swipe{ display:none; width:100%; margin: 0 auto 14px; align-items:center; justify-content:center; gap:8px; color:var(--es-lime); font-family: "Montserrat", sans-serif; font-size:14px; line-height:1.65; font-weight:500; text-align:center; } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_swipe svg{ width:18px; height:18px; display:block; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; } /* ========================================================= INFORMATION GRID ========================================================= */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_infoGrid{ width:100%; max-width:100%; min-width:0; display:grid; grid-template-columns: repeat( 2, minmax(0,1fr) ); gap:12px; align-items:stretch; } /* ========================================================= INFORMATION CARDS ========================================================= */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_infoCard{ width:100%; min-width:0; height:100%; min-height:175px; margin:0; padding: 20px 18px; display:flex; flex-direction:column; justify-content:center; overflow:hidden; border: 1px solid rgba(149,217,11,.20); border-radius:15px; background: linear-gradient( 145deg, rgba(255,255,255,.055), rgba(255,255,255,.025) ); box-shadow: inset 0 1px 0 rgba(255,255,255,.025); } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_infoCard > span{ display:block; width:100%; margin: 0 0 5px; color:var(--es-lime); font-family: "Montserrat", sans-serif; font-size:14px; line-height:1.65; font-weight:500; letter-spacing:.05em; text-transform:uppercase; } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_infoCard strong{ display:block; width:100%; margin: 0 0 5px; color:#ffffff; font-family: "Montserrat", sans-serif; font-size:18px; line-height:1.35; font-weight:700; } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_infoCard p{ width:100%; margin:0; color: rgba(255,255,255,.74); font-family: "Montserrat", sans-serif; font-size:16px; line-height:1.70; font-weight:500; overflow-wrap:break-word; } /* ========================================================= ACTIONS ========================================================= */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_actions{ width:100%; max-width:520px; margin-top:24px; display:flex; align-items:stretch; gap:10px; } /* ========================================================= BUTTON BASE ========================================================= */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_btn{ position:relative; min-width:0; min-height:58px; flex:1 1 0; padding:0; display:inline-flex; align-items:center; justify-content:center; overflow:hidden; border: 2px solid transparent; border-radius:16px; font-family: "Montserrat", sans-serif; font-size:14px; line-height:1.65; font-weight:700; text-align:center; transition: border-color .30s ease, background .30s ease, color .30s ease; } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_btn > span{ position:relative; z-index:3; width:100%; min-height:54px; padding: 14px 22px; display:flex; align-items:center; justify-content:center; border-radius:14px; white-space:nowrap; transition: background .30s ease, color .30s ease; } /* ========================================================= PRIMARY BUTTON ========================================================= */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_btnPrimary{ border-color:var(--es-yellow); } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_btnPrimary > span{ color:#ffffff; background: linear-gradient( 135deg, var(--es-green), var(--es-lime) ); } /* ========================================================= SECONDARY BUTTON ========================================================= */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_btnSecondary{ border-color:var(--es-green); } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_btnSecondary > span{ color:#000000; background:#ffffff; } /* ========================================================= BUTTON HOVER ========================================================= */ @media (hover:hover) and (pointer:fine){ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_btnPrimary:hover{ border-color:#ffffff; } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_btnPrimary:hover > span{ color:#ffffff; background:#000000; } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_btnSecondary:hover > span{ color:#ffffff; background: linear-gradient( 135deg, var(--es-green), var(--es-lime) ); } } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_btn:focus-visible{ outline: 3px solid var(--es-lime); outline-offset:4px; } /* ========================================================= 992px — 1229px KEEP DESKTOP COMPOSITION ========================================================= */ @media (max-width:1229px) and (min-width:992px){ #CEOJA_ES_ContactInfo_V4{ width:100% !important; max-width:100% !important; margin:0 !important; padding:5% !important; overflow-x:clip !important; } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_grid{ width:100% !important; max-width:100% !important; grid-template-columns: repeat( 2, minmax(0,1fr) ); } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_info{ padding:28px; } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_infoCard{ padding: 18px 16px; } } /* ========================================================= TABLET ========================================================= */ @media (max-width:991px){ #CEOJA_ES_ContactInfo_V4{ width:100% !important; max-width:100% !important; margin:0 !important; padding:5% !important; overflow-x:clip !important; } /* HEADER */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_header{ width:100%; max-width:1200px; } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_header h2{ width:100% !important; max-width:1200px !important; font-size:40px !important; text-align:center !important; } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_header p{ width:100% !important; max-width:1000px !important; text-align:justify !important; text-align-last:center !important; } /* GRID */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_grid{ width:100% !important; max-width:100% !important; grid-template-columns:1fr; } /* MAP */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_map{ width:100%; height:340px; min-height:340px; border-right:0; border-bottom: 1px solid rgba(149,217,11,.18); } /* INFO */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_info{ width:100%; min-width:0; height:auto; padding: 32px 5%; } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_infoKicker, #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_info h3{ width:100%; text-align:center; } /* SWIPE */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_swipe{ display:flex; } /* ======================================================= TABLET CAROUSEL 2 COMPLETE CARDS ======================================================= */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_infoGrid{ width:100% !important; max-width:100% !important; min-width:0 !important; display:flex; gap:12px; margin:0 !important; padding: 2px 2px 4px !important; overflow-x:auto !important; overflow-y:hidden !important; scroll-snap-type: x mandatory; scroll-padding-inline:2px; overscroll-behavior-x: contain; scrollbar-width:none; -webkit-overflow-scrolling: touch; } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_infoGrid::-webkit-scrollbar{ display:none; } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_infoCard{ flex: 0 0 calc(50% - 6px); width: calc(50% - 6px); max-width: calc(50% - 6px); min-width: calc(50% - 6px); min-height:190px; scroll-snap-align:start; scroll-snap-stop:always; text-align:center; } /* ACTIONS */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_actions{ max-width:560px; margin-left:auto; margin-right:auto; } } /* ========================================================= MOBILE ========================================================= */ @media (max-width:640px){ /* ======================================================= SECTION ======================================================= */ #CEOJA_ES_ContactInfo_V4{ width:100% !important; max-width:100% !important; min-width:0 !important; margin: 0 auto !important; padding:5% !important; overflow-x:clip !important; background: radial-gradient( circle at 50% 0%, rgba(149,217,11,.11) 0%, rgba(149,217,11,0) 27% ), radial-gradient( circle at 50% 100%, rgba(58,155,39,.10) 0%, rgba(58,155,39,0) 28% ), linear-gradient( 180deg, #f4faef 0%, #ffffff 16%, #ffffff 84%, #f3f9ef 100% ); } /* ======================================================= HEADER ======================================================= */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_header{ width:100% !important; max-width:100% !important; margin: 0 auto 26px !important; text-align:center !important; } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_kicker{ width:100%; justify-content:center; text-align:center; } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_header h2{ width:100% !important; max-width:100% !important; margin: 0 auto 14px !important; font-size:32px !important; line-height:1.12 !important; text-align:center !important; text-wrap:balance; } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_header p{ width:100% !important; max-width:100% !important; font-size:16px !important; line-height:1.70 !important; text-align:justify !important; text-align-last:center !important; } /* ======================================================= MAIN GRID IPHONE WIDTH SAFETY ======================================================= */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_grid{ width:100% !important; max-width:100% !important; min-width:0 !important; margin: 0 auto !important; grid-template-columns: minmax(0,1fr); overflow:hidden !important; border: 1px solid rgba(58,155,39,.24); border-radius:19px; } /* ======================================================= MAP ======================================================= */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_map{ width:100% !important; max-width:100% !important; height:280px; min-height:280px; } /* ======================================================= INFO WRAPPER ======================================================= */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_info{ width:100% !important; max-width:100% !important; min-width:0 !important; padding: 28px 20px 30px !important; overflow:hidden !important; } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_infoKicker{ width:100%; margin-bottom:7px; text-align:center; } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_info h3{ width:100%; max-width:100%; margin: 0 auto 18px; font-size:30px; line-height:1.20; text-align:center; text-wrap:balance; } /* ======================================================= SWIPE ======================================================= */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_swipe{ width:100%; margin: 0 auto 12px; justify-content:center; text-align:center; } /* ======================================================= MOBILE CAROUSEL IMPORTANT: INNER 2PX SAFE AREA PREVENTS CUT LEFT BORDER ======================================================= */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_infoGrid{ position:relative; display:flex !important; width:100% !important; max-width:100% !important; min-width:0 !important; gap:10px; margin:0 !important; padding: 2px 2px 4px !important; overflow-x:auto !important; overflow-y:hidden !important; scroll-snap-type: x mandatory; scroll-padding-inline:2px; overscroll-behavior-x: contain; scrollbar-width:none; -webkit-overflow-scrolling: touch; touch-action:pan-x; } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_infoGrid::-webkit-scrollbar{ display:none; } /* ======================================================= MOBILE CARD ONE COMPLETE CARD — NO BORDER CLIPPING ======================================================= */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_infoCard{ flex: 0 0 calc(100% - 4px) !important; width: calc(100% - 4px) !important; max-width: calc(100% - 4px) !important; min-width: calc(100% - 4px) !important; min-height:180px; margin:0 !important; padding: 20px 18px !important; scroll-snap-align:start; scroll-snap-stop:always; border: 1px solid rgba(149,217,11,.24); border-radius:15px; text-align:left; } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_infoCard > span{ font-size:14px; line-height:1.65; } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_infoCard strong{ font-size:18px; line-height:1.35; } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_infoCard p{ font-size:16px; line-height:1.70; } /* ======================================================= CTA ======================================================= */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_actions{ width:100%; max-width:100%; margin: 22px auto 0; flex-direction:column; gap:10px; } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_btn{ width:100%; flex:none; } } /* ========================================================= VERY SMALL IPHONES ========================================================= */ @media (max-width:390px){ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_info{ padding: 26px 18px 28px !important; } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_infoGrid{ width:100% !important; padding: 2px 2px 4px !important; } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_infoCard{ flex: 0 0 calc(100% - 4px) !important; width: calc(100% - 4px) !important; max-width: calc(100% - 4px) !important; min-width: calc(100% - 4px) !important; padding: 19px 17px !important; } } /* ========================================================= REDUCED MOTION ========================================================= */ @media (prefers-reduced-motion:reduce){ #CEOJA_ES_ContactInfo_V4 *, #CEOJA_ES_ContactInfo_V4 *::before, #CEOJA_ES_ContactInfo_V4 *::after{ transition:none !important; scroll-behavior:auto !important; } } /* ========================================================= E&S CONTACT INFO V4 PATCH FINAL — TABLET + MOBILE ALIGNMENT <= 1229px - KICKERS / SPANS CENTERED - H2 / H3 CENTERED - STRONG CENTERED - PARAGRAPHS JUSTIFIED - LAST LINE CENTERED - NO RESPONSIVE STRUCTURE CHANGES ========================================================= */ /* ========================================================= LARGE TABLET + TABLET + MOBILE ========================================================= */ @media (max-width:1229px){ /* ======================================================= MAIN HEADER ======================================================= */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_header{ width:100% !important; max-width:1200px !important; margin-left:auto !important; margin-right:auto !important; text-align:center !important; } /* ======================================================= HEADER KICKER ======================================================= */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_kicker{ width:100% !important; margin-left:auto !important; margin-right:auto !important; display:flex !important; align-items:center !important; justify-content:center !important; text-align:center !important; } /* ======================================================= H2 ======================================================= */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_header h2{ width:min(1200px,100%) !important; max-width:1200px !important; margin-left:auto !important; margin-right:auto !important; text-align:center !important; white-space:normal !important; word-break:normal !important; overflow-wrap:normal !important; text-wrap:wrap !important; } /* ======================================================= HEADER PARAGRAPH ======================================================= */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_header p{ width:min(1000px,100%) !important; max-width:1000px !important; margin-left:auto !important; margin-right:auto !important; text-align:justify !important; text-align-last:center !important; white-space:normal !important; word-break:normal !important; overflow-wrap:normal !important; } /* ======================================================= INFO AREA ======================================================= */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_info{ text-align:center !important; } /* ======================================================= INFO KICKER ======================================================= */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_infoKicker{ width:100% !important; margin-left:auto !important; margin-right:auto !important; text-align:center !important; } /* ======================================================= INFO H3 ======================================================= */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_info h3{ width:100% !important; max-width:700px !important; margin-left:auto !important; margin-right:auto !important; text-align:center !important; white-space:normal !important; word-break:normal !important; overflow-wrap:normal !important; text-wrap:wrap !important; } /* ======================================================= INFO CARDS ======================================================= */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_infoCard{ align-items:center !important; justify-content:center !important; text-align:center !important; } /* CARD LABEL */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_infoCard > span{ width:100% !important; margin-left:auto !important; margin-right:auto !important; text-align:center !important; } /* CARD STRONG */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_infoCard strong{ width:100% !important; margin-left:auto !important; margin-right:auto !important; text-align:center !important; } /* ======================================================= CARD PARAGRAPHS ======================================================= */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_infoCard p{ width:100% !important; margin-left:auto !important; margin-right:auto !important; text-align:justify !important; text-align-last:center !important; white-space:normal !important; word-break:normal !important; overflow-wrap:normal !important; } /* ======================================================= SWIPE INDICATOR ======================================================= */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_swipe{ justify-content:center !important; text-align:center !important; } } /* ========================================================= TABLET <= 991px ========================================================= */ @media (max-width:991px){ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_header h2{ font-size:40px !important; line-height:1.12 !important; } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_header p{ text-align:justify !important; text-align-last:center !important; } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_infoKicker, #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_info h3, #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_infoCard > span, #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_infoCard strong{ text-align:center !important; } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_infoCard p{ text-align:justify !important; text-align-last:center !important; } } /* ========================================================= MOBILE <= 640px ========================================================= */ @media (max-width:640px){ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_header, #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_kicker, #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_header h2, #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_infoKicker, #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_info h3, #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_infoCard > span, #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_infoCard strong{ text-align:center !important; } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_header h2{ width:100% !important; max-width:100% !important; font-size:32px !important; line-height:1.12 !important; } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_header p, #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_infoCard p{ width:100% !important; margin-left:auto !important; margin-right:auto !important; text-align:justify !important; text-align-last:center !important; white-space:normal !important; word-break:normal !important; overflow-wrap:normal !important; } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_infoCard{ align-items:center !important; text-align:center !important; } } /* ========================================================= E&S CONTACT INFO V4 PATCH — OFFICIAL E&S BUTTON RADIUS OUTER BUTTON = 999px INNER SPAN = 997px ========================================================= */ #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_btn, #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_btn:hover, #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_btn:focus, #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_btn:focus-visible, #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_btn:active{ border-radius:999px !important; } #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_btn > span, #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_btn:hover > span, #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_btn:focus > span, #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_btn:focus-visible > span, #CEOJA_ES_ContactInfo_V4 .CEOJA_ESCI4_btn:active > span{ border-radius:997px !important; }/* End custom CSS */ /* Start custom CSS for html, class: .elementor-element-9932da0 */#CEOJA_ES_ContactProcess_V4, #CEOJA_ES_ContactProcess_V4 *, #CEOJA_ES_ContactProcess_V4 *::before, #CEOJA_ES_ContactProcess_V4 *::after{ box-sizing:border-box; min-width:0; } #CEOJA_ES_ContactProcess_V4{ --es-black:#000000; --es-white:#ffffff; --es-green:#3a9b27; --es-yellow:#f1ba43; --es-lime:#95d90b; --es-muted:#626762; position:relative; width:100% !important; max-width:100% !important; margin:0 !important; padding:5% !important; overflow:hidden; color:#171917; background:#ffffff; font-family: "Montserrat", sans-serif; } /* ========================================================= HEADER ========================================================= */ #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_header{ width:100%; max-width:100%; margin: 0 auto clamp(28px,3vw,42px); text-align:center; } #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_kicker{ display:inline-flex; align-items:center; justify-content:center; gap:10px; margin: 0 auto 12px; color:var(--es-green); font-size:14px; line-height:1.65; font-weight:500; letter-spacing:.08em; text-transform:uppercase; } #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_kicker::before, #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_kicker::after{ content:""; width:24px; height:2px; flex:0 0 24px; border-radius:999px; background:var(--es-lime); } #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_header h2{ width:min(1200px,100%) !important; max-width:1200px !important; margin: 0 auto 16px; color:#000000; font-family: "Poppins", sans-serif; font-size:48px; line-height:1.12; font-weight:700; letter-spacing:-.03em; text-align:center; } #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_header p{ width:min(1000px,100%) !important; max-width:1000px !important; margin:0 auto; color:var(--es-muted); font-size:16px; line-height:1.70; font-weight:500; text-align:center; } /* ========================================================= SWIPE INDICATOR ========================================================= */ #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_swipe{ display:none; width:100%; margin: 0 auto 14px; align-items:center; justify-content:center; gap:8px; color:var(--es-green); font-size:14px; line-height:1.65; font-weight:500; text-align:center; } #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_swipe svg{ width:18px; height:18px; display:block; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; } /* ========================================================= PROCESS TRACK ALL PARALLEL BLOCKS STRETCH ========================================================= */ #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_track{ width:100%; max-width:100%; display:grid; grid-template-columns: repeat( 4, minmax(0,1fr) ); gap:14px; align-items:stretch; } /* ========================================================= PROCESS CARD INTERNAL VERTICAL ALIGNMENT: RING / TITLE / TEXT ========================================================= */ #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_card{ width:100%; height:100%; align-self:stretch; padding: 28px 24px 26px; display:grid; grid-template-rows: auto minmax( calc(30px * 1.20 * 2), auto ) 1fr; align-items:start; align-content:stretch; justify-items:center; border: 1px solid rgba(0,0,0,.09); border-radius:22px; background:#f7f8f5; text-align:center; box-shadow:none !important; } /* ========================================================= ANIMATED CIRCLE ========================================================= */ #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_number{ position:relative; width:78px; height:78px; margin: 0 auto 22px; display:flex; align-items:center; justify-content:center; align-self:start; color:#ffffff; border-radius:50%; background:#10200f; font-family: "Poppins", sans-serif; font-size:20px; line-height:1; font-weight:700; isolation:isolate; } /* ROTATING OUTER RING */ #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_number::before{ content:""; position:absolute; inset:-2px; z-index:-2; border-radius:50%; background: conic-gradient( from 0deg, var(--es-green), var(--es-lime), var(--es-yellow), var(--es-lime), var(--es-green) ); animation: CEOJA_ESCP4_Rotate 6s linear infinite; } /* CENTER MASK + SUBTLE PULSE */ #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_number::after{ content:""; position:absolute; inset:4px; z-index:-1; border-radius:50%; background: radial-gradient( circle, #173217 0%, #10200f 70% ); border: 1px solid rgba(149,217,11,.28); animation: CEOJA_ESCP4_Pulse 2.8s ease-in-out infinite; } @keyframes CEOJA_ESCP4_Rotate{ from{ transform:rotate(0deg); } to{ transform:rotate(360deg); } } @keyframes CEOJA_ESCP4_Pulse{ 0%, 100%{ box-shadow: 0 0 0 0 rgba(149,217,11,.08); } 50%{ box-shadow: 0 0 0 8px rgba(149,217,11,.12); } } /* ========================================================= TITLE SAME VERTICAL SLOT FOR EVERY CARD ========================================================= */ #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_card h3{ width:100%; height:100%; margin: 0 0 10px; display:flex; align-items:flex-start; justify-content:center; color:#000000; font-family: "Montserrat", sans-serif; font-size:30px; line-height:1.20; font-weight:700; letter-spacing:-.02em; text-align:center; } /* ========================================================= PARAGRAPH ========================================================= */ #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_card p{ width:100%; max-width:300px; height:100%; margin:0 auto; display:flex; align-items:flex-start; justify-content:center; color:var(--es-muted); font-size:16px; line-height:1.70; font-weight:500; text-align:center; } /* ========================================================= 992 — 1229 ========================================================= */ @media (max-width:1229px) and (min-width:992px){ #CEOJA_ES_ContactProcess_V4{ width:100% !important; max-width:100% !important; margin:0 !important; padding:5% !important; } #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_track{ align-items:stretch; } #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_card{ height:100%; padding: 26px 20px 24px; } } /* ========================================================= TABLET ========================================================= */ @media (max-width:991px){ #CEOJA_ES_ContactProcess_V4{ width:100% !important; max-width:100% !important; margin:0 !important; padding:5% !important; } #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_header h2{ width:min(1200px,100%) !important; font-size:40px; } #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_header p{ width:min(1000px,100%) !important; text-align:justify; text-align-last:center; } #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_swipe{ display:flex; } #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_track{ display:flex; width:100%; gap:14px; align-items:stretch; overflow-x:auto; overflow-y:hidden; scroll-snap-type:x mandatory; overscroll-behavior-inline:contain; scrollbar-width:none; -webkit-overflow-scrolling:touch; } #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_track::-webkit-scrollbar{ display:none; } #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_card{ flex: 0 0 calc(50% - 7px); width: calc(50% - 7px); height:auto; align-self:stretch; grid-template-rows: auto minmax( calc(30px * 1.20 * 2), auto ) 1fr; scroll-snap-align:start; scroll-snap-stop:always; } #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_card p{ text-align:justify; text-align-last:center; } } /* ========================================================= MOBILE ========================================================= */ @media (max-width:640px){ #CEOJA_ES_ContactProcess_V4{ width:100% !important; max-width:100% !important; margin:0 !important; padding:5% !important; } #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_header h2{ width:100% !important; font-size:32px; } #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_header p{ width:100% !important; text-align:justify; text-align-last:center; } #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_track{ gap:12px; } #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_card{ flex: 0 0 100%; width:100%; padding: 24px 20px; grid-template-rows: auto auto 1fr; border-radius:19px; } #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_number{ width:72px; height:72px; margin-bottom:18px; } #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_card h3{ min-height:0; font-size:30px; } } /* ========================================================= REDUCED MOTION ========================================================= */ @media (prefers-reduced-motion:reduce){ #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_number::before, #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_number::after{ animation:none !important; } } /* ========================================================= PATCH — CENTRADO VERTICAL REAL DEL CONTENIDO E&S CONTACT PROCESS V4 ========================================================= */ /* CARD COMPLETA */ #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_card{ display:flex !important; flex-direction:column !important; align-items:center !important; justify-content:center !important; height:100% !important; padding: 32px 24px !important; text-align:center !important; } /* ========================================================= NÚMERO ========================================================= */ #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_number{ flex:0 0 auto !important; align-self:center !important; margin: 0 auto 22px !important; } /* ========================================================= TÍTULO QUITAR EL HEIGHT:100% QUE DESPLAZABA EL CONTENIDO ========================================================= */ #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_card h3{ width:100% !important; height:auto !important; min-height:0 !important; flex:0 0 auto !important; display:block !important; margin: 0 auto 12px !important; text-align:center !important; } /* ========================================================= PÁRRAFO QUITAR HEIGHT:100% / 1FR ========================================================= */ #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_card p{ width:100% !important; max-width:300px !important; height:auto !important; min-height:0 !important; flex:0 0 auto !important; display:block !important; margin: 0 auto !important; text-align:center !important; } /* ========================================================= TABLET ========================================================= */ @media (max-width:991px){ #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_card{ display:flex !important; flex-direction:column !important; align-items:center !important; justify-content:center !important; height:auto !important; min-height:420px !important; padding: 30px 22px !important; } #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_card p{ text-align:center !important; text-align-last:center !important; } } /* ========================================================= MOBILE ========================================================= */ @media (max-width:640px){ #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_card{ display:flex !important; flex-direction:column !important; align-items:center !important; justify-content:center !important; min-height:430px !important; padding: 30px 22px !important; } #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_number{ margin: 0 auto 24px !important; } #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_card h3{ margin: 0 auto 14px !important; text-align:center !important; } #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_card p{ width:100% !important; max-width:300px !important; margin: 0 auto !important; text-align:center !important; text-align-last:center !important; } } /* ========================================================= E&S CONTACT PROCESS V4 PATCH FINAL — TABLET + MOBILE TYPOGRAPHY - SPAN / KICKER CENTERED - H2 CENTERED - H3 CENTERED - PARAGRAPH JUSTIFIED - LAST LINE CENTERED - NO RESPONSIVE STRUCTURE CHANGES ========================================================= */ /* ========================================================= TABLET + MOBILE <= 991px ========================================================= */ @media (max-width:991px){ /* ======================================================= HEADER ======================================================= */ #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_header{ width:100% !important; max-width:100% !important; margin-left:auto !important; margin-right:auto !important; text-align:center !important; } /* ======================================================= KICKER / SPAN ======================================================= */ #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_kicker{ width:100% !important; margin-left:auto !important; margin-right:auto !important; display:flex !important; align-items:center !important; justify-content:center !important; text-align:center !important; } /* ======================================================= H2 ======================================================= */ #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_header h2{ width:min(1200px,100%) !important; max-width:1200px !important; margin-left:auto !important; margin-right:auto !important; text-align:center !important; white-space:normal !important; word-break:normal !important; overflow-wrap:normal !important; } /* ======================================================= HEADER PARAGRAPH BLOCK CENTERED + TEXT JUSTIFIED ======================================================= */ #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_header p{ width:min(1000px,100%) !important; max-width:1000px !important; margin-left:auto !important; margin-right:auto !important; text-align:justify !important; text-align-last:center !important; white-space:normal !important; word-break:normal !important; overflow-wrap:normal !important; } /* ======================================================= CARD ======================================================= */ #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_card{ align-items:center !important; text-align:center !important; } /* ======================================================= CARD TITLE ======================================================= */ #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_card h3{ width:100% !important; margin-left:auto !important; margin-right:auto !important; text-align:center !important; } /* ======================================================= CARD PARAGRAPH IMPORTANT: OVERRIDES YOUR PREVIOUS text-align:center ======================================================= */ #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_card p{ width:100% !important; max-width:300px !important; height:auto !important; min-height:0 !important; margin-left:auto !important; margin-right:auto !important; display:block !important; text-align:justify !important; text-align-last:center !important; white-space:normal !important; word-break:normal !important; overflow-wrap:normal !important; } /* ======================================================= SWIPE INDICATOR ======================================================= */ #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_swipe{ text-align:center !important; justify-content:center !important; } } /* ========================================================= MOBILE <= 640px SAME RULES, STRONGER OVERRIDE ========================================================= */ @media (max-width:640px){ #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_header, #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_kicker, #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_header h2, #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_card h3{ text-align:center !important; } #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_header p, #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_card p{ width:100% !important; margin-left:auto !important; margin-right:auto !important; text-align:justify !important; text-align-last:center !important; white-space:normal !important; word-break:normal !important; overflow-wrap:normal !important; } #CEOJA_ES_ContactProcess_V4 .CEOJA_ESCP4_card p{ max-width:300px !important; } }/* End custom CSS */ /* Start custom CSS for html, class: .elementor-element-583f33a */#CEOJA_ES_MissionVision_V5, #CEOJA_ES_MissionVision_V5 *, #CEOJA_ES_MissionVision_V5 *::before, #CEOJA_ES_MissionVision_V5 *::after{ box-sizing:border-box; min-width:0; } /* ========================================================= SECTION ========================================================= */ #CEOJA_ES_MissionVision_V5{ --es-black:#000000; --es-white:#ffffff; --es-green:#3a9b27; --es-yellow:#f1ba43; --es-lime:#95d90b; --es-text:#171917; --es-muted:#5f675f; position:relative; width:100% !important; max-width:100% !important; margin:0 !important; padding:5% !important; overflow:hidden; color:var(--es-text); /* GREEN DOMINATES THE TOP / MIDDLE AND GRADUALLY ENDS IN WHITE */ background: radial-gradient( circle at 8% 10%, rgba(149,217,11,.17) 0%, rgba(149,217,11,0) 32% ), radial-gradient( circle at 92% 25%, rgba(58,155,39,.11) 0%, rgba(58,155,39,0) 34% ), linear-gradient( 180deg, #eaf6e4 0%, #eff8eb 28%, #f5faf2 55%, #fafcf9 74%, #ffffff 100% ); border-top: 1px solid rgba(58,155,39,.14); border-bottom: 1px solid rgba(58,155,39,.08); font-family: "Montserrat", sans-serif; } #CEOJA_ES_MissionVision_V5 a{ text-decoration:none !important; } /* ========================================================= SUBTLE DECORATIVE BACKGROUND ========================================================= */ #CEOJA_ES_MissionVision_V5::before{ content:""; position:absolute; top:-160px; right:-130px; width:420px; height:420px; pointer-events:none; border-radius:50%; background: radial-gradient( circle, rgba(149,217,11,.12) 0%, rgba(149,217,11,.045) 42%, rgba(149,217,11,0) 70% ); } /* ========================================================= HEADER ========================================================= */ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_header{ position:relative; z-index:1; width:100%; max-width:1200px; margin: 0 auto clamp(26px,3vw,38px); text-align:center; } /* ========================================================= KICKER ========================================================= */ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_kicker{ display:inline-flex; align-items:center; justify-content:center; gap:10px; margin: 0 auto 12px; color:var(--es-green); font-family: "Montserrat", sans-serif; font-size:14px; line-height:1.65; font-weight:500; letter-spacing:.08em; text-transform:uppercase; text-align:center; } #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_kicker::before, #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_kicker::after{ content:""; width:24px; height:2px; flex:0 0 24px; border-radius:999px; background:var(--es-green); } /* ========================================================= H2 ========================================================= */ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_header h2{ width:100%; max-width:1200px; margin: 0 auto 13px; color:#000000; font-family: "Poppins", sans-serif !important; font-size:48px !important; line-height:1.12 !important; font-weight:700 !important; letter-spacing:-.03em !important; text-align:center; text-wrap:balance; } /* ========================================================= SHORT HEADER TEXT ========================================================= */ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_header p{ width:100%; max-width:780px; margin:0 auto; color:var(--es-muted); font-family: "Montserrat", sans-serif; font-size:16px !important; line-height:1.70 !important; font-weight:500 !important; text-align:center; } /* ========================================================= SWIPE INDICATOR MOBILE ONLY ========================================================= */ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_swipe{ display:none; position:relative; z-index:1; width:100%; margin: 0 auto 13px; align-items:center; justify-content:center; gap:8px; color:var(--es-green); font-family: "Montserrat", sans-serif; font-size:14px; line-height:1.65; font-weight:500; text-align:center; } #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_swipe svg{ width:18px; height:18px; display:block; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; } /* ========================================================= GRID ========================================================= */ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_grid{ position:relative; z-index:1; width:100%; max-width:100%; display:grid; grid-template-columns: repeat( 2, minmax(0,1fr) ); gap:16px; align-items:stretch; } /* ========================================================= CARD IMPORTANT: BOTH CARDS STRETCH EQUALLY AND CONTENT IS CENTERED ========================================================= */ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_card{ position:relative; width:100%; height:100%; min-height:300px; padding: clamp( 28px, 3.4vw, 42px ); display:flex; flex-direction:column; align-items:flex-start; justify-content:center; overflow:hidden; border: 1px solid rgba(58,155,39,.16); border-radius:22px; background: linear-gradient( 145deg, rgba(255,255,255,.94) 0%, rgba(255,255,255,.80) 100% ); } /* ========================================================= TOP ACCENT ========================================================= */ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_card::before{ content:""; position:absolute; top:0; left:0; width:100%; height:4px; background: linear-gradient( 90deg, var(--es-green) 0%, var(--es-lime) 62%, var(--es-yellow) 100% ); } /* ========================================================= SOFT CARD DETAIL ========================================================= */ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_card::after{ content:""; position:absolute; right:-65px; bottom:-75px; width:190px; height:190px; pointer-events:none; border-radius:50%; background: radial-gradient( circle, rgba(149,217,11,.10) 0%, rgba(149,217,11,0) 70% ); } /* ========================================================= LABEL ========================================================= */ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_label{ position:relative; z-index:1; width:100%; margin: 0 0 8px; color:var(--es-green); font-family: "Montserrat", sans-serif; font-size:14px; line-height:1.65; font-weight:700; letter-spacing:.08em; text-transform:uppercase; } /* ========================================================= CARD TITLE ========================================================= */ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_card h3{ position:relative; z-index:1; width:100%; min-height: calc( 30px * 1.20 * 2 ); margin: 0 0 12px; display:flex; align-items:flex-start; color:#000000; font-family: "Montserrat", sans-serif; font-size:30px; line-height:1.20; font-weight:700; letter-spacing:-.02em; text-wrap:balance; } /* ========================================================= COMPACT PARAGRAPH ========================================================= */ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_card p{ position:relative; z-index:1; width:100%; max-width:650px; margin:0; color:var(--es-muted); font-family: "Montserrat", sans-serif; font-size:16px; line-height:1.70; font-weight:500; } /* ========================================================= CTA ALWAYS OUTSIDE SWIPE ========================================================= */ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_actions{ position:relative; z-index:1; width:100%; max-width:520px; margin: 24px auto 0; display:flex; align-items:stretch; gap:10px; } /* ========================================================= BUTTON BASE ========================================================= */ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_btn{ position:relative; min-width:0; min-height:58px; flex:1 1 0; padding:0; display:inline-flex; align-items:center; justify-content:center; overflow:hidden; border: 2px solid transparent; border-radius:16px; font-family: "Montserrat", sans-serif; font-size:14px; line-height:1.65; font-weight:700; text-align:center; transition: border-color .3s ease; } #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_btn > span{ width:100%; min-height:54px; padding: 14px 22px; display:flex; align-items:center; justify-content:center; border-radius:14px; white-space:nowrap; transition: color .3s ease, background .3s ease; } /* ========================================================= PRIMARY ========================================================= */ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_btnPrimary{ border-color:var(--es-yellow); } #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_btnPrimary > span{ color:#ffffff; background: linear-gradient( 135deg, var(--es-green), var(--es-lime) ); } /* ========================================================= SECONDARY ========================================================= */ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_btnSecondary{ border-color:var(--es-green); } #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_btnSecondary > span{ color:#000000; background:#ffffff; } /* ========================================================= HOVER ========================================================= */ @media (hover:hover) and (pointer:fine){ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_btnPrimary:hover{ border-color:#000000; } #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_btnPrimary:hover > span{ color:#ffffff; background:#000000; } #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_btnSecondary:hover > span{ color:#ffffff; background: linear-gradient( 135deg, var(--es-green), var(--es-lime) ); } } /* ========================================================= FOCUS ========================================================= */ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_btn:focus-visible{ outline: 3px solid var(--es-lime); outline-offset:4px; } /* ========================================================= 992 — 1229 KEEP TWO COLUMNS ========================================================= */ @media (max-width:1229px) and (min-width:992px){ #CEOJA_ES_MissionVision_V5{ width:100% !important; max-width:100% !important; margin:0 !important; padding:5% !important; } #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_grid{ grid-template-columns: repeat( 2, minmax(0,1fr) ); align-items:stretch; } #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_card{ min-height:315px; padding: 30px 28px; } } /* ========================================================= TABLET 2 STATIC EQUAL CARDS ========================================================= */ @media (max-width:991px) and (min-width:641px){ #CEOJA_ES_MissionVision_V5{ width:100% !important; max-width:100% !important; margin:0 !important; padding:5% !important; } /* HEADER */ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_header{ width:100%; max-width:1200px; } #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_header h2{ width:100% !important; max-width:1200px !important; font-size:40px !important; text-align:center !important; } #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_header p{ width:100% !important; max-width:780px !important; text-align:center !important; } /* NO SWIPE ON TABLET */ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_swipe{ display:none !important; } /* GRID */ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_grid{ grid-template-columns: repeat( 2, minmax(0,1fr) ); gap:14px; align-items:stretch; } /* CARDS */ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_card{ width:100%; height:100%; min-height:360px; padding: 28px 24px; align-items:center; justify-content:center; text-align:center; } #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_label{ text-align:center; } #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_card h3{ min-height: calc( 30px * 1.20 * 3 ); align-items:flex-start; justify-content:center; text-align:center; } #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_card p{ max-width:420px; text-align:center; } } /* ========================================================= MOBILE COMPACT + ONE COMPLETE CARD ========================================================= */ @media (max-width:640px){ /* ======================================================= SECTION ======================================================= */ #CEOJA_ES_MissionVision_V5{ width:100% !important; max-width:100% !important; margin:0 !important; padding:5% !important; background: radial-gradient( circle at 50% 0%, rgba(149,217,11,.18) 0%, rgba(149,217,11,0) 34% ), linear-gradient( 180deg, #e8f5e1 0%, #eef7ea 32%, #f5faf2 60%, #ffffff 100% ); } /* ======================================================= HEADER ======================================================= */ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_header{ width:100%; max-width:100%; margin: 0 auto 24px; } #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_kicker{ width:100%; justify-content:center; text-align:center; } #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_header h2{ width:100% !important; max-width:100% !important; margin: 0 auto 12px; font-size:32px !important; line-height:1.12 !important; text-align:center !important; text-wrap:balance; } /* SHORT HEADER TEXT */ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_header p{ width:100% !important; max-width:520px !important; margin:0 auto; text-align:center !important; } /* ======================================================= SWIPE ======================================================= */ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_swipe{ display:flex; } /* ======================================================= MOBILE CAROUSEL ======================================================= */ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_grid{ display:flex; width:100%; max-width:100%; gap:12px; margin:0; padding: 2px 2px 4px; align-items:stretch; overflow-x:auto; overflow-y:hidden; scroll-snap-type: x mandatory; scroll-padding-inline:2px; overscroll-behavior-x: contain; scrollbar-width:none; -webkit-overflow-scrolling: touch; } #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_grid::-webkit-scrollbar{ display:none; } /* ======================================================= MOBILE CARD SAME HEIGHT / SAME END LINE ======================================================= */ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_card{ flex: 0 0 calc(100% - 4px); width: calc(100% - 4px); max-width: calc(100% - 4px); min-width: calc(100% - 4px); height:auto; min-height:330px; padding: 28px 22px; align-items:center; justify-content:center; border-radius:19px; text-align:center; scroll-snap-align:start; scroll-snap-stop:always; } #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_label{ width:100%; text-align:center; } #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_card h3{ width:100%; min-height:0; margin: 0 auto 12px; display:block; font-size:30px; line-height:1.20; text-align:center; } #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_card p{ width:100%; max-width:330px; margin: 0 auto; text-align:center; } /* ======================================================= CTA ======================================================= */ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_actions{ width:100%; max-width:100%; margin-top:22px; flex-direction:column; gap:10px; } #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_btn{ width:100%; flex:none; } } /* ========================================================= REDUCED MOTION ========================================================= */ @media (prefers-reduced-motion:reduce){ #CEOJA_ES_MissionVision_V5 *, #CEOJA_ES_MissionVision_V5 *::before, #CEOJA_ES_MissionVision_V5 *::after{ transition:none !important; } } /* ========================================================= E&S MISSION + VISION V5 PATCH FINAL — TABLET + MOBILE ALIGNMENT <= 1229px - KICKER / LABEL CENTERED - H2 CENTERED - H3 CENTERED - PARAGRAPHS JUSTIFIED - LAST LINE CENTERED - NO STRUCTURE / SWIPE CHANGES ========================================================= */ /* ========================================================= LARGE TABLET + TABLET + MOBILE ========================================================= */ @media (max-width:1229px){ /* ======================================================= HEADER ======================================================= */ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_header{ width:100% !important; max-width:1200px !important; margin-left:auto !important; margin-right:auto !important; text-align:center !important; } /* ======================================================= KICKER ======================================================= */ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_kicker{ width:100% !important; margin-left:auto !important; margin-right:auto !important; display:flex !important; align-items:center !important; justify-content:center !important; text-align:center !important; } /* ======================================================= H2 ======================================================= */ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_header h2{ width:min(1200px,100%) !important; max-width:1200px !important; margin-left:auto !important; margin-right:auto !important; text-align:center !important; white-space:normal !important; word-break:normal !important; overflow-wrap:normal !important; text-wrap:wrap !important; } /* ======================================================= HEADER PARAGRAPH CENTER BLOCK + JUSTIFY TEXT ======================================================= */ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_header p{ width:min(1000px,100%) !important; max-width:1000px !important; margin-left:auto !important; margin-right:auto !important; text-align:justify !important; text-align-last:center !important; white-space:normal !important; word-break:normal !important; overflow-wrap:normal !important; } /* ======================================================= CARDS ======================================================= */ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_card{ align-items:center !important; text-align:center !important; } /* ======================================================= CARD LABEL ======================================================= */ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_label{ width:100% !important; margin-left:auto !important; margin-right:auto !important; text-align:center !important; } /* ======================================================= CARD H3 ======================================================= */ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_card h3{ width:100% !important; margin-left:auto !important; margin-right:auto !important; justify-content:center !important; text-align:center !important; white-space:normal !important; word-break:normal !important; overflow-wrap:normal !important; text-wrap:wrap !important; } /* ======================================================= CARD PARAGRAPH OVERRIDES EXISTING CENTER ALIGN ======================================================= */ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_card p{ width:100% !important; max-width:650px !important; margin-left:auto !important; margin-right:auto !important; text-align:justify !important; text-align-last:center !important; white-space:normal !important; word-break:normal !important; overflow-wrap:normal !important; } /* ======================================================= SWIPE INDICATOR ======================================================= */ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_swipe{ justify-content:center !important; text-align:center !important; } } /* ========================================================= TABLET <= 991px ========================================================= */ @media (max-width:991px){ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_header h2{ font-size:40px !important; line-height:1.12 !important; } #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_header p{ width:min(1000px,100%) !important; max-width:1000px !important; text-align:justify !important; text-align-last:center !important; } #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_label, #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_card h3{ text-align:center !important; } #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_card p{ width:100% !important; margin-left:auto !important; margin-right:auto !important; text-align:justify !important; text-align-last:center !important; } } /* ========================================================= MOBILE <= 640px ========================================================= */ @media (max-width:640px){ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_header{ width:100% !important; max-width:100% !important; text-align:center !important; } #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_kicker, #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_label{ width:100% !important; justify-content:center !important; text-align:center !important; } #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_header h2{ width:100% !important; max-width:100% !important; font-size:32px !important; line-height:1.12 !important; text-align:center !important; } #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_card h3{ width:100% !important; text-align:center !important; } #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_header p, #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_card p{ width:100% !important; margin-left:auto !important; margin-right:auto !important; text-align:justify !important; text-align-last:center !important; white-space:normal !important; word-break:normal !important; overflow-wrap:normal !important; } #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_card p{ max-width:330px !important; } } /* ========================================================= E&S MISSION + VISION V5 PATCH — OFFICIAL E&S BUTTON RADIUS OFFICIAL SYSTEM --------------------------------------------------------- OUTER BUTTON = 999px INNER SPAN = 997px NO RESPONSIVE CHANGES NO SIZE CHANGES NO HOVER CHANGES ========================================================= */ /* ========================================================= OUTER BUTTON ========================================================= */ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_btn, #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_btn:hover, #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_btn:focus, #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_btn:focus-visible, #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_btn:active{ border-radius:999px !important; } /* ========================================================= INNER BUTTON SURFACE ========================================================= */ #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_btn > span, #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_btn:hover > span, #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_btn:focus > span, #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_btn:focus-visible > span, #CEOJA_ES_MissionVision_V5 .CEOJA_ESMV5_btn:active > span{ border-radius:997px !important; }/* End custom CSS */