/* Distroil - cabecera y menu */
:root{--dp-h-ink:#14181C;--dp-h-mute:#6E7884;--dp-h-line:#E7EAEE;--dp-h-amber:#FFB400}

/* ---------- barra superior ---------- */
.dp-topbar{background:#14181C;color:#C9D0D7;font:600 12px/1 'Open Sans',Arial,sans-serif}
.dp-topbar .dp-tb{max-width:1500px;margin:0 auto;padding:0 40px;height:38px;display:flex;align-items:center;gap:26px}
.dp-topbar a{color:#C9D0D7!important;text-decoration:none!important;transition:color .2s}
.dp-topbar a:hover{color:#fff!important}
.dp-topbar .dp-tb-h{display:flex;align-items:center;gap:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dp-topbar .dp-tb-sep{margin-left:auto}
.dp-topbar svg{width:14px;height:14px;flex:0 0 14px;fill:none;stroke:var(--dp-h-amber);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.dp-topbar .dp-tb-wa svg{stroke:none;fill:#25D366}

/* ---------- cabecera ---------- */
#main-header{box-shadow:0 1px 0 var(--dp-h-line)!important;background:#fff!important;transition:box-shadow .25s,padding .25s}
#main-header{padding:38px 0 0!important;position:fixed}
#main-header .dp-topbar{position:absolute;top:0;left:0;right:0;z-index:2}
#et-top-navigation,#main-header .container.et_menu_container,#main-header .logo_container{position:static!important}
#main-header .container.et_menu_container{max-width:1500px!important;width:100%!important;padding:0 40px!important;
  display:flex;align-items:center;justify-content:space-between;min-height:96px}
#et-top-navigation{margin-left:auto!important}
.et-fixed-header #main-header .container.et_menu_container{min-height:76px}
#main-header .logo_container{position:static!important;display:flex;align-items:center;float:none!important;width:auto!important;height:auto!important}
#main-header .logo_container .logo_helper{display:none!important}
#et-top-navigation{float:none!important;margin:0 0 0 auto!important}
.et_fixed_nav #main-header.et-fixed-header{box-shadow:0 6px 26px rgba(16,20,24,.09)!important}
#logo{height:68px!important;max-height:68px!important;width:auto!important;max-width:none!important;
  object-fit:contain!important;position:static!important;transform:none!important;transition:height .25s}
@media (min-width:981px){
  #et-top-navigation{display:flex!important;align-items:center;padding-top:0!important;padding-left:0!important}
  #top-menu-nav,#top-menu{display:flex!important;align-items:center}
}
@media (max-width:980px){
  #et-top-navigation{display:flex!important;align-items:center;justify-content:flex-end;padding-top:0!important}
}
#main-header .logo_container{display:flex;align-items:center}
.et-fixed-header #logo{height:52px!important;max-height:52px!important}

/* enlaces del menu */
#top-menu li{padding-right:0!important;margin-right:26px}
#top-menu li:last-child{margin-right:0}
#top-menu > li > a{
  position:relative;padding:0 0 4px!important;
  font:700 12.5px/1 'Open Sans',Arial,sans-serif!important;letter-spacing:.11em;text-transform:uppercase;
  color:#39424A!important;opacity:1!important;transition:color .2s}
#top-menu > li > a:after{
  content:"";position:absolute;left:0;right:100%;bottom:0;height:2px;background:var(--dp-h-amber);
  border-radius:2px;transition:right .28s cubic-bezier(.2,.8,.3,1)}
#top-menu > li:hover > a{color:var(--dp-h-ink)!important}
#top-menu > li.current-menu-item > a,#top-menu > li.current-menu-ancestor > a,
#top-menu > li.current_page_item > a{color:#E09E00!important}
#top-menu > li.current-menu-item > a:before,#top-menu > li.current-menu-ancestor > a:before{border-color:#E09E00}
#top-menu > li:hover > a:after,#top-menu > li.current-menu-item > a:after,#top-menu > li.current-menu-ancestor > a:after{right:0}
#top-menu > li.menu-item-has-children > a{padding-right:16px!important}
#top-menu > li.menu-item-has-children > a:before{
  content:"";position:absolute;right:0;top:50%;width:6px;height:6px;margin-top:-5px;
  border-right:1.6px solid #98A2AC;border-bottom:1.6px solid #98A2AC;transform:rotate(45deg);transition:.2s}
#top-menu > li.menu-item-has-children:hover > a:before{border-color:var(--dp-h-ink);margin-top:-3px}
/* arriba: se oculta la flecha con icono de Divi */
#top-menu li.menu-item-has-children > a:first-child:after{display:none!important}

/* submenus */
#top-menu li ul.sub-menu{
  border:0!important;border-radius:14px!important;padding:10px!important;min-width:262px!important;
  background:#fff!important;box-shadow:0 18px 46px rgba(16,20,24,.16),0 2px 6px rgba(16,20,24,.06)!important;
  transform:translateY(6px)}
#top-menu li:hover > ul.sub-menu,#top-menu li ul.sub-menu.visible{transform:translateY(0)}
#top-menu li ul.sub-menu:before{
  content:"";position:absolute;top:-8px;left:26px;width:14px;height:14px;background:#fff;transform:rotate(45deg);
  border-radius:3px}
#top-menu li ul li{padding:0!important;margin:0!important;width:100%}
#top-menu li ul li a{
  display:block;width:100%!important;padding:10px 14px!important;border-radius:9px;
  font:600 13.5px/1.3 'Open Sans',Arial,sans-serif!important;letter-spacing:0;text-transform:none;
  color:#39424A!important;transition:background .18s,color .18s}
#top-menu li ul li a:hover{background:#F4F6F8!important;color:var(--dp-h-ink)!important;opacity:1!important}
#top-menu li ul li.current-menu-item a{color:var(--dp-h-ink)!important;background:#FFF6E0!important;
  box-shadow:inset 3px 0 0 var(--dp-h-amber)}

/* boton de cotizacion */
#top-menu li.dp-cta{margin-left:6px}
#top-menu li.dp-cta > a{
  display:inline-flex!important;align-items:center;gap:8px;
  background:var(--dp-h-amber);color:var(--dp-h-ink)!important;border-radius:999px;
  padding:11px 20px!important;letter-spacing:.09em;
  box-shadow:0 6px 18px rgba(255,180,0,.32);transition:transform .2s,box-shadow .2s,background .2s}
#top-menu li.dp-cta > a:after{display:none}
#top-menu li.dp-cta > a:hover{background:#FFC633;transform:translateY(-1px);box-shadow:0 10px 24px rgba(255,180,0,.4)}
#top-menu li.dp-cta > a:before{
  content:"";width:15px;height:15px;background:no-repeat center/contain
  url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2314181C'%3E%3Cpath d='M12 2a10 10 0 0 0-8.6 15l-1.3 4.7 4.8-1.3A10 10 0 1 0 12 2zm5.6 14.1c-.2.6-1.2 1.2-1.7 1.2-.5.1-1 .3-3.3-.7-2.8-1.2-4.5-4-4.7-4.2-.1-.2-1-1.4-1-2.6s.6-1.8.9-2c.2-.3.5-.3.7-.3h.5c.2 0 .4-.1.7.5l.9 2.1c.1.2.1.4 0 .6l-.4.5-.3.4c-.1.1-.3.3-.1.6.1.3.6 1.1 1.3 1.7.9.8 1.7 1.1 1.9 1.2.2.1.4.1.5-.1l.8-.9c.2-.2.3-.2.6-.1l2 1c.3.1.5.2.5.3.1.2.1.7-.1 1.3z'/%3E%3C/svg%3E");
  border:0;position:static;transform:none;margin:0}

/* icono de busqueda */
#et_top_search{margin:0 0 0 22px!important;padding:0!important;
  width:38px!important;min-width:38px;flex:0 0 38px;display:flex!important;align-items:center;justify-content:center}
#et_top_search:before{display:none}
#et_search_icon{
  position:static!important;display:flex!important;align-items:center;justify-content:center;
  width:38px;height:38px;border:1px solid var(--dp-h-line);border-radius:999px;background:#fff;
  transition:border-color .2s,box-shadow .2s;margin:0!important}
#et_top_search #et_search_icon:before,#et_search_icon:before{
  content:""!important;position:static!important;top:auto!important;left:auto!important;right:auto!important;
  margin:0!important;font-family:inherit!important;display:block;width:16px;height:16px;background:no-repeat center/contain
  url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2314181C' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cline x1='16.5' y1='16.5' x2='21' y2='21'/%3E%3C/svg%3E")}
#et_search_icon:hover{border-color:var(--dp-h-ink);box-shadow:0 4px 14px rgba(20,24,28,.08)}

/* fuera el carrito: la web trabaja con cotizaciones */
.et-cart-info{display:none!important}

/* ---------- movil ---------- */
@media (max-width:980px){
  #main-header{padding-top:34px!important}
  #main-header .container.et_menu_container{min-height:76px}
  #logo,.et-fixed-header #logo{height:56px!important;max-height:56px!important;
    width:auto!important;max-width:62vw!important;object-fit:contain!important}
  #main-header .logo_container{width:auto!important;max-width:62vw!important}
  .dp-topbar .dp-tb{height:34px;padding:0 20px;gap:14px;flex-wrap:wrap;justify-content:center;font-size:11.5px}
  .dp-topbar .dp-tb-sep{margin-left:0}
  .dp-topbar .dp-tb-horario{display:none}
  #main-header .container,#main-header .container.et_menu_container{padding:0 24px 0 18px!important}
  #et-top-navigation{max-width:100%!important}
  #et_top_search{margin:0 14px 0 0!important}
  #et_mobile_nav_menu{margin:0!important;padding:0!important}
  /* icono propio: la fuente de Divi cargaba tarde y movia la hamburguesa */
  #et_mobile_nav_menu{width:30px!important;min-width:30px;flex:0 0 30px;display:flex!important;align-items:center;justify-content:center}
  #et_mobile_nav_menu .mobile_nav{display:flex!important;align-items:center;justify-content:center;background:transparent!important;border:0!important;padding:0!important}
  .mobile_menu_bar{display:flex!important;align-items:center;justify-content:center;width:30px;height:30px;line-height:1!important}
  #et_mobile_nav_menu .mobile_menu_bar:before{
    content:""!important;display:block!important;width:26px;height:26px;margin:0!important;position:static!important;
    font-size:0!important;color:transparent!important;background:no-repeat center/contain url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2314181C' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M4 7h16M4 12h16M4 17h16'/%3E%3C/svg%3E")}
  #mobile_menu{
    border-top:0!important;border-radius:0 0 16px 16px;padding:10px!important;
    box-shadow:0 20px 40px rgba(16,20,24,.16)!important;background:#fff!important}
  #mobile_menu li a{
    padding:13px 14px!important;border:0!important;border-radius:10px;
    font:600 14.5px/1.2 'Open Sans',Arial,sans-serif!important;color:#39424A!important}
  #mobile_menu li a:hover{background:#F4F6F8!important}
  #mobile_menu li.dp-cta > a{background:var(--dp-h-amber)!important;color:var(--dp-h-ink)!important;
    text-align:center;font-weight:700!important;letter-spacing:.08em;text-transform:uppercase;margin-top:6px}
  /* padres colapsados con flecha */
  #mobile_menu .menu-item-has-children > a{
    position:relative;font-weight:700!important;color:var(--dp-h-ink)!important;background:transparent!important}
  #mobile_menu .menu-item-has-children > a:after{
    content:"";position:absolute;right:16px;top:50%;width:7px;height:7px;margin-top:-5px;
    border-right:2px solid #98A2AC;border-bottom:2px solid #98A2AC;transform:rotate(45deg);transition:transform .22s}
  #mobile_menu .menu-item-has-children.dp-open > a:after{transform:rotate(-135deg);margin-top:-2px;
    border-color:var(--dp-h-ink)}
  #mobile_menu .menu-item-has-children > ul.sub-menu{display:none!important;padding:0 0 6px 10px!important}
  #mobile_menu .menu-item-has-children.dp-open > ul.sub-menu{display:block!important}
  #mobile_menu ul.sub-menu li a{font-weight:500!important;padding-left:16px!important}
  /* item activo en amarillo */
  #mobile_menu li.current-menu-item > a,
  #mobile_menu li.current-menu-ancestor > a,
  #mobile_menu li.current_page_item > a{
    background:#FFF6E0!important;color:var(--dp-h-ink)!important;box-shadow:inset 3px 0 0 var(--dp-h-amber)}
  #mobile_menu li.dp-cta.current-menu-item > a{box-shadow:none}
}

/* ============================================================
   PAGINA DE CONTACTO
   ============================================================ */
.dp-contacto{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;font-family:'Open Sans',Arial,sans-serif}
.dp-contacto .dp-cc{
  display:flex;flex-direction:column;gap:6px;padding:26px 24px 24px;background:#fff;border:1px solid var(--dp-h-line);
  border-radius:16px;text-decoration:none!important;transition:border-color .2s,box-shadow .2s,transform .2s}
.dp-contacto a.dp-cc:hover{border-color:var(--dp-h-ink);box-shadow:0 14px 34px rgba(16,20,24,.09);transform:translateY(-2px)}
.dp-contacto .dp-cc .ic{
  width:42px;height:42px;border-radius:12px;background:#FFF6E0;display:flex;align-items:center;justify-content:center;margin-bottom:10px}
.dp-contacto .dp-cc .ic svg{width:20px;height:20px;fill:none;stroke:#14181C;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.dp-contacto .dp-cc-wa .ic{background:#E8FBEF}
.dp-contacto .dp-cc-wa .ic svg{fill:#25D366;stroke:none}
.dp-contacto .dp-cc h3{
  margin:0!important;padding:0!important;font:700 11px/1 'Open Sans',Arial,sans-serif!important;letter-spacing:.16em;
  text-transform:uppercase;color:#9AA4AE!important}
.dp-contacto .dp-cc .dato{
  margin:0!important;padding:0!important;font:700 18px/1.3 'Rubik','Open Sans',Arial,sans-serif!important;color:var(--dp-h-ink)!important}
.dp-contacto .dp-cc .sub{margin:2px 0 0!important;padding:0!important;font:400 13px/1.5 'Open Sans',Arial,sans-serif!important;color:var(--dp-h-mute)!important}
.dp-contacto .dp-cc .link{
  margin-top:auto;padding-top:12px;font:700 11px/1 'Open Sans',Arial,sans-serif;letter-spacing:.13em;
  text-transform:uppercase;color:var(--dp-h-ink)}
.dp-contacto a.dp-cc:hover .link{color:#B87F00}
@media (max-width:1100px){.dp-contacto{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.dp-contacto{grid-template-columns:1fr;gap:12px}
  .dp-contacto .dp-cc{padding:20px}}

/* ============================================================
   SIN SCROLL HORIZONTAL (la web se movia de lado en el movil)
   ============================================================ */
html,body{overflow-x:hidden!important;max-width:100%!important}
#page-container,#et-main-area,#main-content,#main-header,#top-header{max-width:100%!important;overflow-x:clip}
img,video,iframe,table{max-width:100%}
@media (max-width:980px){
  .et_pb_row,.et_pb_section,.et_pb_column{max-width:100%!important}
  .et_pb_row{margin-left:auto!important;margin-right:auto!important}
}

/* la cabecera fija debe medir el ancho de la pantalla, no el del documento */
#main-header{left:0!important;right:0!important;width:100%!important;max-width:100vw!important}


/* ===== menu movil anclado y pagina bloqueada mientras esta abierto ===== */
@media (max-width:980px){
  #mobile_menu{
    position:fixed!important;top:var(--dp-mtop,110px)!important;left:10px!important;right:10px!important;
    width:auto!important;max-width:none!important;
    max-height:calc(100vh - var(--dp-mtop,110px) - 24px);
    overflow-y:auto!important;-webkit-overflow-scrolling:touch;
    z-index:99999!important}
  body.dp-menu-abierto{position:fixed!important;left:0!important;right:0!important;
    width:100%!important;overflow:hidden!important;overscroll-behavior:none!important}
}


/* ===== definitivo movil: lupa y hamburguesa clavadas a la derecha, fuera del flujo ===== */
@media (max-width:980px){
  #page-container{overflow-x:hidden!important}
  #main-header .container.et_menu_container{padding-right:110px!important}
  #et-top-navigation{position:absolute!important;right:24px!important;top:34px!important;bottom:0!important;left:auto!important;
    width:auto!important;min-width:0!important;max-width:none!important;height:auto!important;
    margin:0!important;padding:0!important;display:flex!important;align-items:center!important;justify-content:flex-end!important;
    float:none!important;transform:none!important;z-index:5}
  #et_top_search{margin:0 14px 0 0!important;flex:0 0 38px!important;width:38px!important}
  #et_mobile_nav_menu{flex:0 0 30px!important;width:30px!important;margin:0!important;padding:0!important;float:none!important}
  #main-header .logo_container{max-width:calc(100% - 100px)!important}
  /* la barra negra vive dentro de la nav: se vuelve a extender a todo el ancho */
  #et-top-navigation .dp-topbar{position:absolute!important;top:-34px!important;right:-24px!important;left:auto!important;width:100vw!important;max-width:100vw!important}
}
