.elementor-23 .elementor-element.elementor-element-6bf924d{--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-23 .elementor-element.elementor-element-e5ba63b{--display:flex;}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}/* Start custom CSS for html, class: .elementor-element-102f806 *//* ===== Topbar/Header (estilos siguen aquí) ===== */
    .topbar{background:var(--secondary); color:#fff; font-size:.9rem; padding:.6rem 1rem; text-align:center}
    header{position:sticky; top:0; z-index:20; background:#fff; box-shadow:0 1px 12px rgba(0,0,0,.06)}
    .nav{max-width:var(--container); margin:auto; display:flex; align-items:center; gap:24px; padding:16px 22px}
    .brand{display:flex; align-items:center; gap:12px; text-decoration:none; color:var(--secondary); font-weight:700}
    .brand img{height:28px}
    .menu{margin-left:auto; display:flex; gap:26px; list-style:none; padding:0}
    .menu a{color:var(--secondary); text-decoration:none; font-weight:500; position:relative}
    .menu a::after{content:""; position:absolute; left:0; bottom:-6px; height:2px; width:0; background:var(--primary); transition:width .25s var(--ease)}
    .menu a:hover::after{width:100%}
    .hamburger{display:none; margin-left:auto; background:none; border:0; width:38px; height:38px; cursor:pointer}
    .hamburger span{display:block; height:2px; background:var(--secondary); margin:7px 6px; border-radius:2px}
    .mobile{display:none; background:#fff; border-top:1px solid #eee}
    .mobile a{display:block; padding:14px 22px; border-bottom:1px solid #f1f1f1; color:var(--secondary); text-decoration:none}
    .mobile.open{display:block}
    
     @media (max-width:1100px){
      .service-cards{grid-template-columns:repeat(2,1fr)}
      .icons{grid-template-columns:repeat(2,1fr)}
      .mosaic{grid-template-columns:1fr 1fr}
      .mosaic .tile.big{grid-row:auto; aspect-ratio:auto}
      .split,.about{grid-template-columns:1fr}
      .cards3{grid-template-columns:repeat(2,1fr)}
      .projects-duo{grid-template-columns:1fr; gap:18px}
      .split2{grid-template-columns:1fr}
      main.page{row-gap:var(--section-gap-md); padding-block-end:var(--section-gap-md)}
      .hero2 .bg{height:clamp(300px,50vw,520px)}
      .hamburger{display:block}
      .menu{display:none}
    }
    @media (max-width:720px){
      .service-cards{grid-template-columns:1fr}
      .cards3{grid-template-columns:1fr}
      .icons{grid-template-columns:1fr}
      .hero-media{aspect-ratio:16/9}
      main.page{row-gap:var(--section-gap-sm); padding-block-end:var(--section-gap-sm)}
    }/* End custom CSS */