.elementor-256 .elementor-element.elementor-element-44694f97{--display:flex;--min-height:450px;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--overlay-opacity:0.5;--margin-top:-115px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:81px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-256 .elementor-element.elementor-element-44694f97:not(.elementor-motion-effects-element-type-background), .elementor-256 .elementor-element.elementor-element-44694f97 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://astibia.com/wp-content/uploads/2026/09/astibia.com307IMG_1864_1_upscaled-scaled.jpg");background-position:bottom center;background-size:cover;}.elementor-256 .elementor-element.elementor-element-44694f97::before, .elementor-256 .elementor-element.elementor-element-44694f97 > .elementor-background-video-container::before, .elementor-256 .elementor-element.elementor-element-44694f97 > .e-con-inner > .elementor-background-video-container::before, .elementor-256 .elementor-element.elementor-element-44694f97 > .elementor-background-slideshow::before, .elementor-256 .elementor-element.elementor-element-44694f97 > .e-con-inner > .elementor-background-slideshow::before, .elementor-256 .elementor-element.elementor-element-44694f97 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:#000000;--background-overlay:'';}.elementor-256 .elementor-element.elementor-element-13d94601{--display:flex;--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--gap:16px 16px;--row-gap:16px;--column-gap:16px;--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-256 .elementor-element.elementor-element-1138f752{text-align:center;}.elementor-256 .elementor-element.elementor-element-1138f752 .elementor-heading-title{font-family:"Poppins", Sans-serif;font-size:60px;font-weight:700;text-transform:none;line-height:1.1em;letter-spacing:-1.3px;color:var( --e-global-color-5bd60dc );}.elementor-256 .elementor-element.elementor-element-011ef6b .elementor-icon-wrapper{text-align:center;}.elementor-256 .elementor-element.elementor-element-011ef6b.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-b70a650 );}.elementor-256 .elementor-element.elementor-element-011ef6b.elementor-view-framed .elementor-icon, .elementor-256 .elementor-element.elementor-element-011ef6b.elementor-view-default .elementor-icon{color:var( --e-global-color-b70a650 );border-color:var( --e-global-color-b70a650 );}.elementor-256 .elementor-element.elementor-element-011ef6b.elementor-view-framed .elementor-icon, .elementor-256 .elementor-element.elementor-element-011ef6b.elementor-view-default .elementor-icon svg{fill:var( --e-global-color-b70a650 );}.elementor-256 .elementor-element.elementor-element-011ef6b.elementor-view-stacked .elementor-icon:hover{background-color:var( --e-global-color-1e38924 );}.elementor-256 .elementor-element.elementor-element-011ef6b.elementor-view-framed .elementor-icon:hover, .elementor-256 .elementor-element.elementor-element-011ef6b.elementor-view-default .elementor-icon:hover{color:var( --e-global-color-1e38924 );border-color:var( --e-global-color-1e38924 );}.elementor-256 .elementor-element.elementor-element-011ef6b.elementor-view-framed .elementor-icon:hover, .elementor-256 .elementor-element.elementor-element-011ef6b.elementor-view-default .elementor-icon:hover svg{fill:var( --e-global-color-1e38924 );}.elementor-256 .elementor-element.elementor-element-011ef6b .elementor-icon{font-size:35px;}.elementor-256 .elementor-element.elementor-element-011ef6b .elementor-icon svg{height:35px;}.elementor-256 .elementor-element.elementor-element-526e7bf{--display:flex;}.elementor-256 .elementor-element.elementor-element-390409c{width:var( --container-widget-width, 47% );max-width:47%;--container-widget-width:47%;--container-widget-flex-grow:0;text-align:center;}.elementor-256 .elementor-element.elementor-element-390409c.elementor-element{--align-self:center;}.elementor-256 .elementor-element.elementor-element-390409c .elementor-heading-title{font-weight:700;}.elementor-256 .elementor-element.elementor-element-a1a1876{--divider-border-style:solid;--divider-color:var( --e-global-color-1e38924 );--divider-border-width:3px;}.elementor-256 .elementor-element.elementor-element-a1a1876 .elementor-divider-separator{width:20%;margin:0 auto;margin-center:0;}.elementor-256 .elementor-element.elementor-element-a1a1876 .elementor-divider{text-align:center;padding-block-start:15px;padding-block-end:15px;}.elementor-256 .elementor-element.elementor-element-950d225{text-align:center;}.elementor-256 .elementor-element.elementor-element-950d225 p{margin-block-end:0px;}.elementor-256 .elementor-element.elementor-element-04a351d{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-256 .elementor-element.elementor-element-04a351d.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-256 .elementor-element.elementor-element-a980203{--display:flex;}.elementor-256 .elementor-element.elementor-element-a980203:not(.elementor-motion-effects-element-type-background), .elementor-256 .elementor-element.elementor-element-a980203 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://astibia.com/wp-content/uploads/2026/09/Trumatic-1000R.jpg");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-256 .elementor-element.elementor-element-a5cb796{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;}.elementor-256 .elementor-element.elementor-element-c971837{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-256 .elementor-element.elementor-element-486d7c5 .elementor-heading-title{font-weight:600;}.elementor-256 .elementor-element.elementor-element-90912a8{margin:-4% 0% calc(var(--kit-widget-spacing, 0px) + 0%) 0%;}.elementor-256 .elementor-element.elementor-element-90912a8 .elementor-icon-box-wrapper{align-items:center;text-align:start;gap:15px;}.elementor-256 .elementor-element.elementor-element-90912a8.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-b70a650 );}.elementor-256 .elementor-element.elementor-element-90912a8.elementor-view-framed .elementor-icon, .elementor-256 .elementor-element.elementor-element-90912a8.elementor-view-default .elementor-icon{fill:var( --e-global-color-b70a650 );color:var( --e-global-color-b70a650 );border-color:var( --e-global-color-b70a650 );}.elementor-256 .elementor-element.elementor-element-90912a8 .elementor-icon-box-title, .elementor-256 .elementor-element.elementor-element-90912a8 .elementor-icon-box-title a{font-size:22px;}.elementor-256 .elementor-element.elementor-element-56d7390{--divider-border-style:solid;--divider-color:var( --e-global-color-1e38924 );--divider-border-width:2.5px;margin:-7% 0% calc(var(--kit-widget-spacing, 0px) + 0%) 0%;}.elementor-256 .elementor-element.elementor-element-56d7390 .elementor-divider-separator{width:17%;}.elementor-256 .elementor-element.elementor-element-56d7390 .elementor-divider{padding-block-start:15px;padding-block-end:15px;}.elementor-256 .elementor-element.elementor-element-7a54267{margin:-7% 0% calc(var(--kit-widget-spacing, 0px) + 0%) 0%;}.elementor-256 .elementor-element.elementor-element-7c7290e{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-256 .elementor-element.elementor-element-7c7290e.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-256 .elementor-element.elementor-element-8945370{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;}.elementor-256 .elementor-element.elementor-element-6411ba3{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-256 .elementor-element.elementor-element-5804c51 .elementor-heading-title{font-weight:600;}.elementor-256 .elementor-element.elementor-element-d4e5d7a{margin:-4% 0% calc(var(--kit-widget-spacing, 0px) + 0%) 0%;}.elementor-256 .elementor-element.elementor-element-d4e5d7a .elementor-icon-box-wrapper{align-items:center;text-align:start;gap:15px;}.elementor-256 .elementor-element.elementor-element-d4e5d7a.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-b70a650 );}.elementor-256 .elementor-element.elementor-element-d4e5d7a.elementor-view-framed .elementor-icon, .elementor-256 .elementor-element.elementor-element-d4e5d7a.elementor-view-default .elementor-icon{fill:var( --e-global-color-b70a650 );color:var( --e-global-color-b70a650 );border-color:var( --e-global-color-b70a650 );}.elementor-256 .elementor-element.elementor-element-d4e5d7a .elementor-icon-box-title, .elementor-256 .elementor-element.elementor-element-d4e5d7a .elementor-icon-box-title a{font-size:22px;}.elementor-256 .elementor-element.elementor-element-13f65cb{--divider-border-style:solid;--divider-color:var( --e-global-color-1e38924 );--divider-border-width:2.5px;margin:-7% 0% calc(var(--kit-widget-spacing, 0px) + 0%) 0%;}.elementor-256 .elementor-element.elementor-element-13f65cb .elementor-divider-separator{width:17%;}.elementor-256 .elementor-element.elementor-element-13f65cb .elementor-divider{padding-block-start:15px;padding-block-end:15px;}.elementor-256 .elementor-element.elementor-element-61138d0{margin:-7% 0% calc(var(--kit-widget-spacing, 0px) + 0%) 0%;}.elementor-256 .elementor-element.elementor-element-7d5fdab{--display:flex;}.elementor-256 .elementor-element.elementor-element-7d5fdab:not(.elementor-motion-effects-element-type-background), .elementor-256 .elementor-element.elementor-element-7d5fdab > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://astibia.com/wp-content/uploads/2026/09/Trumabend-V130.jpg");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-256 .elementor-element.elementor-element-6c1a2b7{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-256 .elementor-element.elementor-element-6c1a2b7.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-256 .elementor-element.elementor-element-91f0abc{--display:flex;}.elementor-256 .elementor-element.elementor-element-91f0abc:not(.elementor-motion-effects-element-type-background), .elementor-256 .elementor-element.elementor-element-91f0abc > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://astibia.com/wp-content/uploads/2026/09/astibia.com430IMG_1871_2.jpg");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-256 .elementor-element.elementor-element-67c528d{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;}.elementor-256 .elementor-element.elementor-element-33fd0e4{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-256 .elementor-element.elementor-element-f8a8676 .elementor-heading-title{font-weight:600;}.elementor-256 .elementor-element.elementor-element-ac6cd0d{margin:-4% 0% calc(var(--kit-widget-spacing, 0px) + 0%) 0%;}.elementor-256 .elementor-element.elementor-element-ac6cd0d .elementor-icon-box-wrapper{align-items:center;text-align:start;gap:15px;}.elementor-256 .elementor-element.elementor-element-ac6cd0d.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-b70a650 );}.elementor-256 .elementor-element.elementor-element-ac6cd0d.elementor-view-framed .elementor-icon, .elementor-256 .elementor-element.elementor-element-ac6cd0d.elementor-view-default .elementor-icon{fill:var( --e-global-color-b70a650 );color:var( --e-global-color-b70a650 );border-color:var( --e-global-color-b70a650 );}.elementor-256 .elementor-element.elementor-element-ac6cd0d .elementor-icon-box-title, .elementor-256 .elementor-element.elementor-element-ac6cd0d .elementor-icon-box-title a{font-size:22px;}.elementor-256 .elementor-element.elementor-element-4d3f483{--divider-border-style:solid;--divider-color:var( --e-global-color-1e38924 );--divider-border-width:2.5px;margin:-7% 0% calc(var(--kit-widget-spacing, 0px) + 0%) 0%;}.elementor-256 .elementor-element.elementor-element-4d3f483 .elementor-divider-separator{width:17%;}.elementor-256 .elementor-element.elementor-element-4d3f483 .elementor-divider{padding-block-start:15px;padding-block-end:15px;}.elementor-256 .elementor-element.elementor-element-cd264f0{margin:-7% 0% calc(var(--kit-widget-spacing, 0px) + 0%) 0%;}.elementor-256 .elementor-element.elementor-element-2e206af{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-256 .elementor-element.elementor-element-2e206af.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-256 .elementor-element.elementor-element-7a555d9{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;}.elementor-256 .elementor-element.elementor-element-cd7cd6a{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-256 .elementor-element.elementor-element-dd7976c .elementor-heading-title{font-weight:600;}.elementor-256 .elementor-element.elementor-element-ffffff0{margin:-4% 0% calc(var(--kit-widget-spacing, 0px) + 0%) 0%;}.elementor-256 .elementor-element.elementor-element-ffffff0 .elementor-icon-box-wrapper{align-items:center;text-align:start;gap:15px;}.elementor-256 .elementor-element.elementor-element-ffffff0.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-b70a650 );}.elementor-256 .elementor-element.elementor-element-ffffff0.elementor-view-framed .elementor-icon, .elementor-256 .elementor-element.elementor-element-ffffff0.elementor-view-default .elementor-icon{fill:var( --e-global-color-b70a650 );color:var( --e-global-color-b70a650 );border-color:var( --e-global-color-b70a650 );}.elementor-256 .elementor-element.elementor-element-ffffff0 .elementor-icon-box-title, .elementor-256 .elementor-element.elementor-element-ffffff0 .elementor-icon-box-title a{font-size:22px;}.elementor-256 .elementor-element.elementor-element-bb29712{--divider-border-style:solid;--divider-color:var( --e-global-color-1e38924 );--divider-border-width:2.5px;margin:-7% 0% calc(var(--kit-widget-spacing, 0px) + 0%) 0%;}.elementor-256 .elementor-element.elementor-element-bb29712 .elementor-divider-separator{width:17%;}.elementor-256 .elementor-element.elementor-element-bb29712 .elementor-divider{padding-block-start:15px;padding-block-end:15px;}.elementor-256 .elementor-element.elementor-element-beec4d8{margin:-7% 0% calc(var(--kit-widget-spacing, 0px) + 0%) 0%;}.elementor-256 .elementor-element.elementor-element-ec2ed1c{--display:flex;}.elementor-256 .elementor-element.elementor-element-ec2ed1c:not(.elementor-motion-effects-element-type-background), .elementor-256 .elementor-element.elementor-element-ec2ed1c > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://astibia.com/wp-content/uploads/2026/09/Trumabend-V130.jpg");background-position:center center;background-repeat:no-repeat;background-size:cover;}body.elementor-page-256:not(.elementor-motion-effects-element-type-background), body.elementor-page-256 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-bf890a9 );}@media(min-width:768px){.elementor-256 .elementor-element.elementor-element-13d94601{--width:75%;}.elementor-256 .elementor-element.elementor-element-04a351d{--width:86%;}.elementor-256 .elementor-element.elementor-element-a980203{--width:48%;}.elementor-256 .elementor-element.elementor-element-a5cb796{--width:40%;}.elementor-256 .elementor-element.elementor-element-7c7290e{--width:86%;}.elementor-256 .elementor-element.elementor-element-8945370{--width:40%;}.elementor-256 .elementor-element.elementor-element-7d5fdab{--width:48%;}.elementor-256 .elementor-element.elementor-element-6c1a2b7{--width:86%;}.elementor-256 .elementor-element.elementor-element-91f0abc{--width:48%;}.elementor-256 .elementor-element.elementor-element-67c528d{--width:40%;}.elementor-256 .elementor-element.elementor-element-2e206af{--width:86%;}.elementor-256 .elementor-element.elementor-element-7a555d9{--width:40%;}.elementor-256 .elementor-element.elementor-element-ec2ed1c{--width:48%;}}@media(max-width:1024px){.elementor-256 .elementor-element.elementor-element-44694f97{--min-height:400px;--margin-top:-85px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:85px;--padding-bottom:0px;--padding-left:32px;--padding-right:32px;}.elementor-256 .elementor-element.elementor-element-1138f752 .elementor-heading-title{font-size:56px;line-height:1.1em;}}@media(max-width:767px){.elementor-256 .elementor-element.elementor-element-44694f97{--min-height:350px;--padding-top:85px;--padding-bottom:0px;--padding-left:20px;--padding-right:20px;}.elementor-256 .elementor-element.elementor-element-1138f752 .elementor-heading-title{font-size:40px;}}/* Start custom CSS for container, class: .elementor-element-a980203 */.elementor-256 .elementor-element.elementor-element-a980203{ position: relative; overflow: hidden; clip-path: polygon( 0 0, 100% 0, 88% 100%, 0 100% ); } /* Línea azul */ .elementor-256 .elementor-element.elementor-element-a980203::after{ content: ""; position: absolute; inset: 0; background: #1F85CE; clip-path: polygon( 99.3% 0, 100% 0, 88% 100%, 87.3% 100% ); z-index: 10; pointer-events: none; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-7d5fdab */.elementor-256 .elementor-element.elementor-element-7d5fdab{ position: relative; overflow: hidden; /* diagonal invertida */ clip-path: polygon( 0 0, 100% 0, 100% 100%, 12% 100% ); } /* línea azul diagonal */ .elementor-256 .elementor-element.elementor-element-7d5fdab::after{ content: ""; position: absolute; inset: 0; background: #1F85CE; clip-path: polygon( 0 0, 0.7% 0, 12.7% 100%, 12% 100% ); z-index: 10; pointer-events: none; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-91f0abc */.elementor-256 .elementor-element.elementor-element-91f0abc{ position: relative; overflow: hidden; clip-path: polygon( 0 0, 100% 0, 88% 100%, 0 100% ); } /* Línea azul */ .elementor-256 .elementor-element.elementor-element-91f0abc::after{ content: ""; position: absolute; inset: 0; background: #1F85CE; clip-path: polygon( 99.3% 0, 100% 0, 88% 100%, 87.3% 100% ); z-index: 10; pointer-events: none; }/* End custom CSS */ /* Start custom CSS for container, class: .elementor-element-ec2ed1c */.elementor-256 .elementor-element.elementor-element-ec2ed1c{ position: relative; overflow: hidden; /* diagonal invertida */ clip-path: polygon( 0 0, 100% 0, 100% 100%, 12% 100% ); } /* línea azul diagonal */ .elementor-256 .elementor-element.elementor-element-ec2ed1c::after{ content: ""; position: absolute; inset: 0; background: #1F85CE; clip-path: polygon( 0 0, 0.7% 0, 12.7% 100%, 12% 100% ); z-index: 10; pointer-events: none; }/* End custom CSS */ /* Start custom CSS */@import url('https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@400;700&display=swap'); /* ============================================================ CSS UNICO - Bloques de tecnica Carlos Astibia Incluir UNA sola vez en la pagina (o en el CSS global del tema). Estructura de cada bloque: div.astibia-tecnica > div.container > div.tec-row (normal: foto izq / tarjeta der) div.astibia-tecnica > div.container > div.tec-row.tec-row--invertida (invertido: tarjeta izq / foto der) Para invertir un bloque, SOLO hay que anadir la clase "tec-row--invertida" al div.tec-row. No hace falta tocar nada mas. ============================================================ */ .astibia-tecnica{ --azul:#0b1f3a; --naranja:#ff5a2f; --icono:#1F85CE; --texto:#5c6778; --fondo-icono:#f5f8fb; font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif; padding:40px 0; } .astibia-tecnica *,.astibia-tecnica *::before,.astibia-tecnica *::after{box-sizing:border-box;} .astibia-tecnica .container{max-width:1180px;margin:0 auto;padding:0 28px;} .astibia-tecnica .tec-row{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:8px;} .astibia-tecnica .tec-photo{aspect-ratio:4/3;border-radius:14px;overflow:hidden;box-shadow:0 16px 38px rgba(11,31,58,.14);background:linear-gradient(135deg,#c9d2da,#8f9aa6);} .astibia-tecnica .tec-photo img{width:100%;height:100%;object-fit:cover;display:block;} /* ---- animación de entrada: SOLO se activa si el JS ha cargado (añade "astibia-js" al body) ---- Si el script astibia-tecnica.js no está incluido en la página, estas reglas no se aplican y el bloque se ve siempre visible, sin animación, en vez de desaparecer. ---- */ body.astibia-js .astibia-tecnica .tec-photo{opacity:0;transform:translateX(-60px);transition:opacity .7s ease, transform .7s ease;} body.astibia-js .astibia-tecnica .tec-card{opacity:0;transform:translateX(60px);transition:opacity .7s ease .1s, transform .7s ease .1s;} body.astibia-js .astibia-tecnica .tec-row.in .tec-photo, body.astibia-js .astibia-tecnica .tec-row.in .tec-card{opacity:1;transform:translateX(0);} .astibia-tecnica .tec-card{ position:relative;z-index:2;background:#fff;border-radius:14px; box-shadow:0 16px 40px rgba(11,31,58,.10); padding:44px 40px 34px;margin-left:-20px; } .astibia-tecnica .tec-icon{ position:absolute;top:-32px;left:36px;width:66px;height:66px;border-radius:50%; background:#fff;border:1px solid #eef0f3;box-shadow:0 10px 24px rgba(11,31,58,.20), 0 2px 6px rgba(11,31,58,.10); display:flex;align-items:center;justify-content:center; } /* ============================================================ VARIANTE INVERTIDA: añadir class="tec-row tec-row--invertida" Foto a la derecha, tarjeta a la izquierda. ============================================================ */ .astibia-tecnica .tec-row--invertida .tec-photo{order:2;transform:translateX(60px);} .astibia-tecnica .tec-row--invertida .tec-card{order:1;margin-left:0;margin-right:-20px;transform:translateX(-60px);} .astibia-tecnica .tec-row--invertida .tec-icon{left:auto;right:36px;} /* ---- ICONO: un con máscara, sin , sin src roto ---- */ .astibia-tecnica .icon-mask{ display:block; background-color:#1F85CE; -webkit-mask-image:var(--icon-url); mask-image:var(--icon-url); -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat; -webkit-mask-position:center; mask-position:center; -webkit-mask-size:contain; mask-size:contain; } .astibia-tecnica .tec-icon .icon-mask{width:38px;height:38px;} .astibia-tecnica .tec-chip .chip-icon .icon-mask{width:24px;height:24px;} .astibia-tecnica .tec-card h3{ font-family:inherit;font-weight:900;font-size:32px;line-height:1.2; color:rgb(31,133,206); margin:0 0 6px;padding-bottom:12px;border-bottom:2px solid var(--naranja);display:inline-block; } /* descripción: Segoe UI 400 / 16px / 24px / negro */ .astibia-tecnica .tec-card p{ font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif; font-weight:400;font-size:16px;line-height:24px; color:rgb(0,0,0); margin:16px 0 20px; } /* texto del chip: Be Vietnam Pro 700 / 20px / 24px / negro */ .astibia-tecnica .tec-chip{display:inline-flex;align-items:center;gap:12px;} .astibia-tecnica .tec-chip span.chip-text{ font-family:'Be Vietnam Pro', sans-serif;font-weight:700;font-size:20px;line-height:24px; color:rgb(0,0,0); } .astibia-tecnica .tec-chip .chip-icon{width:44px;height:44px;border-radius:50%;background:var(--fondo-icono);box-shadow:0 4px 12px rgba(11,31,58,.14);display:flex;align-items:center;justify-content:center;flex-shrink:0;} /* ---------- MÓVIL: todo se apila igual, sea o no invertido ---------- */ @media(max-width:840px){ .astibia-tecnica .tec-row{grid-template-columns:1fr;justify-items:center;text-align:center;} .astibia-tecnica .tec-row .tec-photo{order:0;width:100%;transform:translateX(0) !important;} .astibia-tecnica .tec-row .tec-card{ order:0;margin:-40px 18px 0;margin-left:0;margin-right:0;padding:52px 26px 30px; display:flex;flex-direction:column;align-items:center; transform:translateX(0) !important; } .astibia-tecnica .tec-row .tec-icon{left:50%;right:auto;transform:translateX(-50%);} .astibia-tecnica .tec-card h3{margin-left:auto;margin-right:auto;} .astibia-tecnica .tec-chip{flex-direction:column;gap:10px;} } /* ========================================================= ESTILO GENERAL ICONOS ASTIBIA Funciona con: - Widget Icono - Widget Caja de icono ========================================================= */ /* CAJA DEL ICONO */ .icono-astibia .elementor-icon{ width:46px; height:46px; display:inline-flex !important; align-items:center; justify-content:center; padding:0 !important; color:#1F85CE !important; background:#F9FCFF !important; border:1px solid rgba(31,133,206,.15) !important; border-radius:9px !important; box-shadow: 0 3px 8px rgba(7,19,62,.06), 0 8px 18px rgba(7,19,62,.07); box-sizing:border-box; transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease, background .25s ease; } /* ========================================================= ICONOS DE ELEMENTOR ========================================================= */ .icono-astibia .elementor-icon i{ font-size:24px !important; color:#1F85CE !important; } /* SVG */ .icono-astibia .elementor-icon svg{ width:24px !important; height:24px !important; fill:currentColor !important; color:#1F85CE !important; } /* SVG QUE FUNCIONAN CON STROKE */ .icono-astibia .elementor-icon svg path, .icono-astibia .elementor-icon svg line, .icono-astibia .elementor-icon svg polyline, .icono-astibia .elementor-icon svg circle, .icono-astibia .elementor-icon svg rect{ transition: fill .25s ease, stroke .25s ease; } /* ========================================================= CAJA DE ICONO ========================================================= */ .icono-astibia.elementor-widget-icon-box .elementor-icon-box-icon{ margin-bottom:0; } /* Si la caja de icono está en horizontal */ .icono-astibia .elementor-icon-box-wrapper{ align-items:center; } /* ========================================================= WIDGET DE ICONO NORMAL ========================================================= */ .icono-astibia.elementor-widget-icon .elementor-icon-wrapper{ line-height:0; } /* ========================================================= HOVER ========================================================= */ .icono-astibia:hover .elementor-icon{ transform:translateY(-3px); border-color:rgba(31,133,206,.35) !important; background:#fff !important; box-shadow: 0 5px 10px rgba(7,19,62,.08), 0 10px 24px rgba(31,133,206,.14); } /* ========================================================= TAMAÑO TABLET ========================================================= */ @media(max-width:1024px){ .icono-astibia .elementor-icon{ width:43px; height:43px; } .icono-astibia .elementor-icon i{ font-size:22px !important; } .icono-astibia .elementor-icon svg{ width:22px !important; height:22px !important; } } /* ========================================================= MÓVIL ========================================================= */ @media(max-width:767px){ .icono-astibia .elementor-icon{ width:42px; height:42px; } .icono-astibia .elementor-icon i{ font-size:21px !important; } .icono-astibia .elementor-icon svg{ width:21px !important; height:21px !important; } }/* End custom CSS */