:root{
  --um-site-max: 1024px;
  --um-header-bg:#ffffff;
  --um-header-text:#111111;
  --um-accent:#000000;
  --um-logo-w:160px;
  --um-logo-h:48px;
  --um-radius:15px;

  /* Global borders toggle (1 visible / 0 hidden) */
  --um-border-on: 1;
  --um-chip-base-width: 1px;
  --um-chip-border-width: calc(var(--um-border-on) * var(--um-chip-base-width));
  --um-line-border-width: calc(var(--um-border-on) * 1px);
  --um-icon-border-width: calc(var(--um-border-on) * 1px);

  --um-icon-hamburger:#111111;
  --um-icon-search:#111111;

  /* Menú estados */
  --um-menu-base-bg: transparent;
  --um-menu-base-text: #111111;
  --um-menu-hover-bg: #f0f0f0;
  --um-menu-hover-text: #111111;
  --um-menu-active-bg: #111111;
  --um-menu-active-text: #ffffff;

  /* Scrollbar thickness for WebKit (px) */
  --um-scrollbar-thickness: 2px;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:'Lexend',system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,'Helvetica Neue',Arial,'Noto Sans',sans-serif}
img{max-width:100%;height:auto;border-radius:var(--um-radius)}
a{color:inherit;text-decoration:none}
.screen-reader-text{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}

.um-container{width:100%;max-width:var(--um-site-max);margin:0 auto;padding:0 10px}

/* ====== Adbar (Above Header) ====== */
.um-adbar{
  width:100%;
  background: transparent;
  transition: max-height .22s ease, opacity .18s ease, margin .18s ease, padding .18s ease;
  will-change: max-height, opacity;
  max-height: 180px; /* suficiente para 1024x115 + márgenes */
  opacity: 1;
  overflow: hidden;
}
.um-adbar.is-hidden{
  max-height: 0;
  opacity: 0;
  margin: 0;
  padding: 0;
}
.um-adbar.is-gone{ display:none !important; }

.um-adbar .um-ad{ display:flex; justify-content:center; align-items:center; padding:8px 0; }
.um-adbar-placeholder{
  width:100%; max-width:1024px; height:115px;
  display:flex; align-items:center; justify-content:center;
  background: repeating-linear-gradient(45deg, #eee 0, #eee 10px, #e5e5e5 10px, #e5e5e5 20px);
  color:#444; font-weight:600; border-radius:10px;
  border: var(--um-line-border-width) solid rgba(0,0,0,.08);
}

/* ====== Header (STICKY) ====== */
.um-header{
  position: sticky;
  top: 0;
  z-index: 900; /* Over content, under overlays (1000) */
  background: var(--um-header-bg);
  color: var(--um-header-text);
  transition: box-shadow .18s ease, backdrop-filter .18s ease;
  will-change: box-shadow;
}
/* Admin bar offsets */
body.admin-bar .um-header{ top: 46px; }
@media (min-width: 783px){
  body.admin-bar .um-header{ top: 32px; }
}

.um-header.is-stuck{
  box-shadow: 0 2px 10px rgba(0,0,0,.06);
  backdrop-filter: saturate(1.05);
}

.um-header-inner{width:100%;max-width:var(--um-site-max);margin:0 auto;padding:0 10px}
.um-header-row{display:flex;align-items:center;justify-content:center}

/* Fila 1: fecha */
.um-header-date{height:36px;font-size:14px;opacity:.85}

/* Fila 2: 15/70/15 */
.um-header-mid{display:grid;grid-template-columns:15% 70% 15%;align-items:center;height:64px}
.um-col{display:flex;align-items:center;justify-content:center}
.um-col-left{justify-content:flex-start}
.um-col-right{justify-content:flex-end}

.um-icon-btn{
  background:transparent;
  border: var(--um-icon-border-width) solid rgba(0,0,0,.15);
  width:36px; height:36px; border-radius:50%;
  display:flex; align-items:center; justify-content:center; cursor:pointer
}
.um-btn-hamburger{color:var(--um-icon-hamburger)}
.um-btn-search{color:var(--um-icon-search)}
.um-icon-btn:hover{border-color:var(--um-accent)}

/* Logo */
.um-logo-wrap{display:flex;align-items:center;justify-content:center;height:100%}
.um-logo img{width:var(--um-logo-w);height:var(--um-logo-h);object-fit:contain;border-radius:0}
.um-site-title{font-weight:600;font-size:clamp(18px, 4vw, 24px)}

/* Fila 3: menú principal con scroll */
.um-header-mainnav{
  height:48px;
  border-top: var(--um-line-border-width) solid rgba(0,0,0,.08);
  border-bottom: var(--um-line-border-width) solid rgba(0,0,0,.08);
  position:relative;
  background: var(--um-header-bg);
}
.um-main-nav{
  width:100%;
  overflow-x:auto; overflow-y:hidden;
  -webkit-overflow-scrolling:touch; position:relative;
  overscroll-behavior-x: contain;
  scroll-padding-inline: 12px; /* asegura visibilidad de extremos en scrollIntoView */
  scrollbar-width: thin;
}
.um-main-nav .um-menu{
  display:flex; gap:12px;
  padding:8px 12px; /* margen interno para extremos */
  list-style:none; margin:0; white-space:nowrap; justify-content:center;
}
.um-main-nav.is-overflowing .um-menu{ justify-content:flex-start; }

.um-main-nav .um-menu > li{display:inline-flex}
.um-main-nav .um-menu > li > a{
  padding:8px 12px;border-radius:999px;
  border: var(--um-chip-border-width) solid rgba(0,0,0,.10);
  background: var(--um-menu-base-bg);
  color: var(--um-menu-base-text);
  text-transform: uppercase;
  font-weight:300; /* Lexend Light */
  letter-spacing:.3px;
  scroll-margin-inline: 12px;
}
.um-main-nav .um-menu > li > a:hover{
  background: var(--um-menu-hover-bg);
  color: var(--um-menu-hover-text);
  border-color: var(--um-menu-hover-bg);
}
.um-main-nav .um-menu > li.current-menu-item > a,
.um-main-nav .um-menu > li.current-menu-ancestor > a{
  background: var(--um-menu-active-bg);
  color: var(--um-menu-active-text);
  border-color: var(--um-menu-active-bg);
}

/* Scrollbar WebKit — delgado y estable */
.um-main-nav::-webkit-scrollbar{height: var(--um-scrollbar-thickness)}
.um-main-nav::-webkit-scrollbar:hover{height: var(--um-scrollbar-thickness)}
.um-main-nav::-webkit-scrollbar:vertical{width: var(--um-scrollbar-thickness)}
.um-main-nav::-webkit-scrollbar-thumb{background:#000}
.um-main-nav::-webkit-scrollbar-thumb:hover{background:#000}
.um-main-nav::-webkit-scrollbar-thumb:active{background:#000}
.um-main-nav::-webkit-scrollbar-track{background:rgba(0,0,0,.05)}

/* ====== Overlays ====== */
.um-offcanvas[hidden]{display:none}
.um-offcanvas{position:fixed;inset:0;z-index:1000}
.um-offcanvas-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.6);opacity:0;transition:opacity .25s ease}
.um-offcanvas-panel{position:absolute;inset:0;display:flex;flex-direction:column;color:#fff;transform:translateX(-102%);transition:transform .26s ease}
.um-offcanvas.is-open .um-offcanvas-backdrop{opacity:1}
.um-offcanvas.is-open .um-offcanvas-panel{transform:translateX(0)}
.um-offcanvas-header{display:flex;justify-content:flex-end;padding:12px}
.um-btn-close{
  border: var(--um-icon-border-width) solid rgba(255,255,255,.5);
  color:#fff
}
.um-offcanvas-content{padding:10px 16px 24px}
.um-menu-offcanvas{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.um-menu-offcanvas li a{
  display:block;padding:10px 12px;border-radius:10px;background:rgba(255,255,255,.08);color:#fff;
  border: var(--um-chip-border-width) solid rgba(255,255,255,.25);
}
.um-separator{
  border:none;
  border-top: var(--um-line-border-width) solid rgba(255,255,255,.25);
  margin:14px 0;
}

/* Search */
.um-search-overlay[hidden]{display:none}
.um-search-overlay{position:fixed;inset:0;z-index:1000}
.um-search-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.6);opacity:0;transition:opacity .25s ease}
.um-search-panel{position:absolute;inset:0;display:flex;flex-direction:column;color:#fff;transform:translateX(102%);transition:transform .26s ease}
.um-search-overlay.is-open .um-search-backdrop{opacity:1}
.um-search-overlay.is-open .um-search-panel{transform:translateX(0)}
.um-search-header{display:flex;justify-content:flex-end;padding:12px}
.um-search-content{display:flex;flex:1;align-items:center;justify-content:center;padding:20px}
.um-search-content form{width:min(720px, 92vw)}
.um-search-content input[type="search"]{width:100%;padding:14px 16px;border-radius:12px;border:none;font-size:18px}

/* ====== Footer (mínimo) ====== */
.um-footer{padding:24px 10px;border-top:1px solid rgba(0,0,0,.08)}
.um-footer-inner{width:100%;max-width:var(--um-site-max);margin:0 auto}

/* ====== Utilidades ====== */
body.no-scroll{overflow:hidden}

@media (min-width: 960px){
  .um-offcanvas-panel{max-width:100%;}
}