:root{
  --dsm-bg:#152b43; --dsm-bg-scrolled:#152b43;
  --dsm-oc-bg:#0f2236; --dsm-accent:#c9a04a;
  --dsm-text:#e9edf3; --dsm-muted:#9fb0c3;
  --dsm-oc-width:320px; --dsm-breakpoint:1024px;
  --dsm-container:1200px; --dsm-z:100000; --dsm-logo-h:64px; --dsm-gradient-alpha:.35;
  --dsm-icon-loc:var(--dsm-accent);
  --dsm-icon-phone:var(--dsm-accent);
  --dsm-icon-hamburger:var(--dsm-accent);
  --dsm-icon-close:var(--dsm-accent);
  --dsm-cta-bg:var(--dsm-accent); --dsm-cta-text:#051423;
  --dsm-header-gap-desktop:12px; --dsm-header-gap-mobile:10px;
  --dsm-controls-gap-desktop:16px; --dsm-controls-gap-mobile:12px;
  --dsm-header-pad-desktop:16px; --dsm-header-pad-mobile:12px;
  --dsm-header-pad-vertical:10px;
  --dsm-overlay-pad: clamp(80px, 12vh, 160px);
  --dsm-overlay-enabled: 1;
  --dsm-overlay-pad-mobile: clamp(64px, 10vh, 140px);
  --dsm-overlay-enabled-mobile: 1;
  --dsm-mobile-bg:transparent;
}

body.dsmpro-open{overflow:hidden;}

/* HEADER */
#dsmpro-header{position:sticky;top:0;z-index:var(--dsm-z);
  background:var(--dsm-bg) !important;
  color:var(--dsm-text);box-shadow:none}
#dsmpro-header.scrolled{ background: var(--dsm-bg-scrolled) !important; box-shadow:none }
.admin-bar #dsmpro-header{top:32px}@media(max-width:782px){.admin-bar #dsmpro-header{top:46px}}

#dsmpro-header .dsm-inner{max-width:var(--dsm-container);margin:0 auto;padding:var(--dsm-header-pad-vertical) var(--dsm-header-pad-desktop);display:flex;align-items:center;gap:var(--dsm-header-gap-desktop);position:relative}
#dsmpro-header .dsm-brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit;flex:0 0 auto}
#dsmpro-header .dsm-brand img{height:var(--dsm-logo-h);width:auto;display:block}
#dsmpro-header .dsm-controls{display:flex;align-items:center;gap:var(--dsm-controls-gap-desktop);margin-left:auto;flex:1 1 auto;min-width:0;justify-content:flex-end}
#dsmpro-header .dsm-control{display:flex;align-items:center;gap:10px;font-size:14px;white-space:nowrap;flex:0 0 auto}
#dsmpro-header .dsm-icon{background:none;border:0;cursor:pointer;font-size:18px}
#dsmpro-header .dsm-icon i{font-size:18px}
#dsmpro-header .dsm-label{color:var(--dsm-muted);font-weight:500}
#dsmpro-header .dsm-value{font-weight:600}
#dsmpro-header .dsm-select{position:relative}
#dsmpro-header .dsm-select select{appearance:none;background:transparent;color:var(--dsm-text);border:1px solid rgba(255,255,255,.25);border-radius:18px;padding:6px 30px 6px 12px;font:inherit;max-width:260px}
#dsmpro-header .dsm-select:after{content:"▾";position:absolute;right:10px;top:50%;transform:translateY(-50%);pointer-events:none;color:var(--dsm-text);font-size:12px}
#dsmpro-header .dsm-sep{height:24px;width:1px;background:rgba(255,255,255,.2)}
#dsmpro-hamburger{background:transparent;border:0;color:var(--dsm-text);font-size:28px;line-height:1;padding:6px;cursor:pointer;flex:0 0 auto}

/* Icons color per-element */
#dsmpro-header .dsm-icon.ic-loc i{ color: var(--dsm-icon-loc); }
#dsmpro-header .dsm-icon.ic-phone i{ color: var(--dsm-icon-phone); }
#dsmpro-hamburger i{ color: var(--dsm-icon-hamburger); }
#dsmpro-offcanvas .oc-head .oc-close i{ color: var(--dsm-icon-close); }

/* MOBILE: icons-only */
@media (max-width: 1024px){
  #dsmpro-header{
    position:fixed;
    top:0;
    left:0;
    right:0;
    z-index:var(--dsm-z);
    box-shadow:none!important;
    background-image:none!important;
  }
  #dsmpro-header[data-mobile-transparent="0"]{
    background:var(--dsm-mobile-bg) !important;
    background-color:var(--dsm-mobile-bg) !important;
    box-shadow:none!important;
    background-image:none!important;
  }
  #dsmpro-header.scrolled[data-mobile-transparent="0"]{
    background:var(--dsm-mobile-bg-scrolled) !important;
    background-color:var(--dsm-mobile-bg-scrolled) !important;
  }
  #dsmpro-header[data-mobile-transparent="1"]{
    background:transparent!important;
    box-shadow:none!important;
    background-image:none!important;
  }
  #dsmpro-header.scrolled[data-mobile-transparent="1"]{
    background:transparent!important;
  }
  #dsmpro-header .dsm-inner{
    padding:var(--dsm-header-pad-vertical) var(--dsm-header-pad-mobile);
    gap:var(--dsm-header-gap-mobile);
  }
  #dsmpro-header .dsm-controls{
    gap:var(--dsm-controls-gap-mobile);
  }
  #dsmpro-header .dsm-control.phone .dsm-label,
  #dsmpro-header .dsm-control.phone .dsm-value,
  #dsmpro-header .dsm-control .dsm-label{display:none}
  #dsmpro-header .dsm-select select{max-width:180px}
  body{margin-top:0!important;}
}

/* Locations overlay */
#dsmpro-header .dsm-loc-content .dsm-select{display:none}
body.dsm-loc-open #dsmpro-header .dsm-loc-content .dsm-select{
  display:block;position:absolute;left:12px;right:12px;top:100%;
  background:rgba(10,20,30,0.92);padding:10px;border-radius:12px;
  box-shadow:0 12px 24px rgba(0,0,0,.35);z-index:calc(var(--dsm-z) + 1)
}
body.dsm-loc-open #dsmpro-header .dsm-select select{max-width:none;width:100%}

/* OFF-CANVAS */
#dsmpro-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.5);opacity:0;pointer-events:none;transition:opacity .25s;z-index:calc(var(--dsm-z) - 1)}
body.dsmpro-open #dsmpro-backdrop{opacity:1;pointer-events:auto}
#dsmpro-offcanvas{position:fixed;top:0;right:0;width:min(var(--dsm-oc-width),100vw);height:100vh;background:var(--dsm-oc-bg);color:var(--dsm-text);box-shadow:-10px 0 30px rgba(0,0,0,.35);transition:transform .25s ease;transform:translateX(100%);display:flex;flex-direction:column;z-index:var(--dsm-z)}
#dsmpro-offcanvas.dsm-open{transform:translateX(0)}
#dsmpro-offcanvas .oc-head{display:flex;align-items:center;justify-content:space-between;padding:16px;border-bottom:1px solid rgba(255,255,255,.1)}
#dsmpro-offcanvas .oc-head .oc-close{background:transparent;border:0;color:var(--dsm-icon-close);font-size:22px;cursor:pointer}
#dsmpro-offcanvas .oc-head .oc-close i{color:var(--dsm-icon-close);font-size:22px}
#dsmpro-offcanvas .oc-body{flex:1 1 auto;display:flex;flex-direction:column;height:100%;overflow:auto}
#dsmpro-offcanvas nav{flex:1 1 auto}
#dsmpro-offcanvas nav ul, #dsmpro-offcanvas nav li{list-style:none;margin:0;padding:0}
#dsmpro-offcanvas nav li > a{display:block;padding:12px 8px;text-decoration:none;color:var(--dsm-text);border-bottom:1px solid rgba(255,255,255,.06)}

/* Submenu reset */
#dsmpro-offcanvas nav ul.sub-menu, #dsmpro-offcanvas nav ul.children{
  position:static !important; left:auto !important; right:auto !important; top:auto !important;
  opacity:1 !important; visibility:visible !important; transform:none !important;
  pointer-events:auto !important; width:auto !important; min-width:unset !important;
}

/* Submenu accordion */
#dsmpro-offcanvas nav li.menu-item-has-children,
#dsmpro-offcanvas nav li.page_item_has_children{position:relative}
#dsmpro-offcanvas nav li.menu-item-has-children > a,
#dsmpro-offcanvas nav li.page_item_has_children > a{padding-right:54px}
#dsmpro-offcanvas nav .dsm-toggle{
  position:absolute;
  right:12px;
  top:50%;
  transform:translateY(-50%);
  background:transparent;
  border:0;
  color:var(--dsm-accent);
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:32px;
  height:32px;
  line-height:1;
  transition:color .2s ease;
  border-radius:50%;
  z-index:1;
}
#dsmpro-offcanvas nav .dsm-toggle i{
  font-size:16px;
  transition:transform .25s ease;
}
#dsmpro-offcanvas nav .dsm-toggle .screen-reader-text{
  position:absolute;
  clip:rect(1px, 1px, 1px, 1px);
  clip-path:inset(50%);
  width:1px;
  height:1px;
  margin:-1px;
  overflow:hidden;
  white-space:nowrap;
}
#dsmpro-offcanvas nav .dsm-toggle:focus-visible{
  outline:2px solid var(--dsm-accent);
  outline-offset:2px;
}
#dsmpro-offcanvas nav li > .sub-menu, #dsmpro-offcanvas nav li > .children{display:none;padding-left:8px}
#dsmpro-offcanvas nav li.open > .sub-menu, #dsmpro-offcanvas nav li.open > .children{display:block}
#dsmpro-offcanvas nav li .sub-menu a, #dsmpro-offcanvas nav li .children a{border-bottom:1px solid rgba(255,255,255,.04);opacity:.95}
#dsmpro-offcanvas nav li .sub-menu .sub-menu, #dsmpro-offcanvas nav li .children .children{padding-left:12px}

/* CTA bottom */
#dsmpro-offcanvas .dsm-cta{flex:0 0 auto;margin-top:auto;padding:12px 16px;background:var(--dsm-oc-bg)}
#dsmpro-offcanvas .dsm-cta .btn{display:block;text-align:center;padding:12px 16px;border-radius:10px;text-decoration:none;background:var(--dsm-cta-bg);color:var(--dsm-cta-text);font-weight:700;width:100%}
/* If you prefer sticky CTA that stays visible while scrolling, use this instead:
#dsmpro-offcanvas .dsm-cta{position:sticky;bottom:0;padding:12px 16px;background:var(--dsm-oc-bg)}
*/

.dsm-hide{display:none!important}

/* === Logo swap on scroll === */
#dsmpro-header .dsm-brand .logo-initial{display:inline-block}
#dsmpro-header .dsm-brand .logo-scrolled{display:none}
#dsmpro-header.scrolled .dsm-brand .logo-initial{display:none}
#dsmpro-header.scrolled .dsm-brand .logo-scrolled{display:inline-block}

/* === Icon color overrides on scroll === */
#dsmpro-header.scrolled .dsm-icon.ic-loc i{ color: var(--dsm-icon-loc-scrolled); }
#dsmpro-header.scrolled .dsm-icon.ic-phone i{ color: var(--dsm-icon-phone-scrolled); }
#dsmpro-header.scrolled #dsmpro-hamburger i{ color: var(--dsm-icon-hamburger-scrolled); }
/* Close icon when panel abierto (tomamos scrolled como estado activo) */
body.dsmpro-open #dsmpro-offcanvas .oc-head .oc-close i{ color: var(--dsm-icon-close-scrolled); }

/* --- Overlay en desktop: dejar que el contenido pase por debajo del navbar --- */
@media (min-width: 1024px){
  /* Asegura el header como overlay y transparente solo cuando NO está scrolleado */
  body.dsm-overlay-enabled #dsmpro-header:not(.scrolled){
    position: fixed;
    top: 0; left: 0; right: 0;
    background: transparent; /* ya lo fuerza el plugin, reforzamos */
    box-shadow: none !important;
    z-index: 99990; /* o el que uses */
  }

  /* Quita cualquier empuje hacia abajo que pongan tema/constructor */
  body.dsm-overlay-enabled #page-container,
  body.dsm-overlay-enabled #et-main-area,
  body.dsm-overlay-enabled #main-content,
  body.dsm-overlay-enabled .et-l--body,
  body.dsm-overlay-enabled .et-l,
  body.dsm-overlay-enabled .et_builder_inner_content,
  body.dsm-overlay-enabled .et_pb_section:first-of-type{
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  /* Si aún ves una franja blanca, fuerza que el primer contenedor no tenga offset */
  body.dsm-overlay-enabled #dsmpro-header + *{
    margin-top: 0 !important;
    padding-top: 0 !important;
  }
  /* Reafirma el fondo cuando está scrolleado en desktop */
  body.dsm-overlay-enabled #dsmpro-header.scrolled{
    background: var(--dsm-bg-scrolled) !important;
    box-shadow: none;
  }
}

/* Ajuste para barra de administración de WordPress en desktop */
@media (min-width: 1024px){
  .admin-bar #dsmpro-header{ top: 32px; } /* 32px es la altura estándar del admin bar en desktop */
}

@media (min-width: 1024px){
  body.dsm-overlay-enabled .et_pb_section:first-of-type{
    padding-top: var(--dsm-overlay-pad) !important; /* ajustable vía admin */
  }
}

/* Overlay en móviles: mismo control independiente */
@media (max-width: 1024px) {
  body.dsm-overlay-enabled-mobile,
  body.dsm-overlay-enabled-mobile #page,
  body.dsm-overlay-enabled-mobile #page-container,
  body.dsm-overlay-enabled-mobile #et-main-area,
  body.dsm-overlay-enabled-mobile #main-content,
  body.dsm-overlay-enabled-mobile .et-l--body,
  body.dsm-overlay-enabled-mobile .et_builder_inner_content,
  body.dsm-overlay-enabled-mobile .et_pb_section:first-of-type,
  body.dsm-overlay-enabled-mobile .entry-content,
  body.dsm-overlay-enabled-mobile .entry-content > *:first-child,
  body.dsm-overlay-enabled-mobile .site-main > *:first-child,
  body.dsm-overlay-enabled-mobile .container:first-child,
  body.dsm-overlay-enabled-mobile .et_pb_column > .et_pb_module:first-child {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }
  body.dsm-overlay-enabled-mobile #dsmpro-header + * {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }
  body.dsm-overlay-enabled-mobile .et_pb_section:first-of-type {
    padding-top: var(--dsm-overlay-pad-mobile) !important;
  }
}