/* ═══════════════════════════════════════════════════
   GAD Salcedo v2 – custom.css (Header/Nav/Footer)
═══════════════════════════════════════════════════ */

/* ── ANNOUNCE BAR ── */
.announce-bar{background:var(--acento);color:#fff;text-align:center;padding:9px 48px;font-size:13px;font-weight:600;display:flex;align-items:center;justify-content:center;gap:10px;position:relative;}
.announce-bar a{color:#fff;text-decoration:underline;font-weight:700;}
.announce-bar .ann-close{position:absolute;right:16px;background:none;border:none;color:#fff;font-size:18px;cursor:pointer;padding:4px;border-radius:4px;line-height:1;}
.announce-bar .ann-close:hover{background:rgba(0,0,0,.15);}

/* ── TOPBAR ── */
.topbar{background:var(--c-800);color:rgba(255,255,255,.7);font-size:12px;padding:6px 0;border-bottom:2px solid var(--acento);}
.topbar .topbar-inner{max-width:var(--max-width);margin:0 auto;padding:0 1.5rem;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:.5rem;}
.topbar-left{display:flex;align-items:center;gap:1rem;}
.topbar-right{display:flex;align-items:center;}
.topbar-right a{color:rgba(255,255,255,.68);font-size:12px;padding:3px 10px;border-left:1px solid rgba(255,255,255,.1);transition:color .2s;white-space:nowrap;}
.topbar-right a:first-child{border-left:none;}
.topbar-right a:hover{color:var(--acento-hover);}

/* ── SITE HEADER ── */
.site-header{background:#fff;box-shadow:0 2px 16px rgba(10,31,68,.08);position:sticky;top:0;z-index:900;transition:box-shadow .3s;}
.site-header.scrolled{box-shadow:0 4px 28px rgba(10,31,68,.15);}
.header-inner-wrap{max-width:var(--max-width);margin:0 auto;padding:0 1.5rem;display:flex;align-items:center;justify-content:space-between;height:80px;gap:1rem;}

/* ── LOGO ── */
.site-logo{display:flex;align-items:center;gap:.875rem;text-decoration:none;flex-shrink:0;position:relative;}
.logo-escudo{width:58px;height:58px;background:linear-gradient(135deg,var(--c-700),var(--c-500));border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:26px;border:3px solid var(--acento);box-shadow:0 3px 12px rgba(13,50,114,.25);flex-shrink:0;}
.logo-img-wrap{position:relative;}
.logo-img-wrap img{height:60px;width:auto;max-width:180px;object-fit:contain;transition:transform .4s cubic-bezier(.34,1.56,.64,1);position:relative;z-index:1;}
.site-logo:hover .logo-img-wrap img{transform:scale(1.07) rotate(-1deg);}

/* Halo pulsante detrás del logo */
.logo-img-wrap::before{
  content:'';display:block;
  position:absolute;inset:-6px;border-radius:12px;
  background:linear-gradient(135deg,rgba(17,85,181,.18),rgba(41,121,232,.10));
  opacity:0;transform:scale(.85);
  transition:opacity .35s,transform .35s;
  z-index:0;
}
.site-logo:hover .logo-img-wrap::before{opacity:1;transform:scale(1);}

.logo-nombre{font-family:var(--font-serif);font-weight:900;font-size:19px;color:var(--c-800);line-height:1.1;}
.logo-sub{font-size:10px;color:var(--c-600);letter-spacing:1.5px;text-transform:uppercase;font-weight:600;}

/* ── BRAND WRAP (logo + imagen secundaria) ── */
.header-brand{display:flex;align-items:center;gap:1.125rem;flex-shrink:0;}

/* Separador animado entre logo y campaña */
.header-brand-sep{
  width:2px;height:44px;
  background:linear-gradient(to bottom,transparent,var(--c-400),transparent);
  border-radius:2px;flex-shrink:0;
  opacity:.5;
  animation:sepPulse 2.5s ease-in-out infinite;
}
@keyframes sepPulse{0%,100%{opacity:.3;height:36px;}50%{opacity:.8;height:50px;}}

/* Imagen campaña con efectos digitales */
.header-banner2{display:flex;align-items:center;position:relative;}
.header-banner2 img{
  height:52px;width:auto;max-width:220px;object-fit:contain;
  position:relative;z-index:1;
  animation:bannerFloat 3.6s ease-in-out infinite;
  filter:drop-shadow(0 2px 8px rgba(41,121,232,.25));
  transition:filter .3s;
  cursor:default;
}
@keyframes bannerFloat{
  0%,100%{transform:translateY(0)   scale(1);}
  45%    {transform:translateY(-4px) scale(1.015);}
}
.site-header:hover .header-banner2 img{filter:drop-shadow(0 4px 18px rgba(41,121,232,.45)) brightness(1.06);}

/* Destello de luz que barre la imagen */
.header-banner2::after{
  content:'';
  position:absolute;top:0;left:-40%;width:40%;height:100%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent);
  transform:skewX(-20deg);
  animation:bannerShine 4s ease-in-out infinite;
  pointer-events:none;z-index:2;border-radius:4px;
  overflow:hidden;
}
@keyframes bannerShine{
  0%   {left:-40%;opacity:0;}
  18%  {opacity:1;}
  38%  {left:130%;opacity:0;}
  100% {left:130%;opacity:0;}
}

/* Píxeles / partículas decorativas flotantes */
.header-brand{position:relative;}
.header-brand::before,.header-brand::after{
  content:'';position:absolute;border-radius:50%;
  background:var(--acento);pointer-events:none;
  animation:pixelFloat 5s ease-in-out infinite;
  opacity:0;
}
.header-brand::before{width:5px;height:5px;top:-4px;left:50%;animation-delay:0s;}
.header-brand::after {width:4px;height:4px;bottom:-4px;right:20%;animation-delay:2.2s;}
@keyframes pixelFloat{
  0%   {opacity:0;transform:translateY(0);}
  25%  {opacity:.7;}
  75%  {opacity:.4;}
  100% {opacity:0;transform:translateY(-14px);}
}

/* ── MAIN NAV DESKTOP ── */
.main-nav{flex:1;display:flex;justify-content:center;}
.nav-list{list-style:none;display:flex;align-items:center;gap:2px;margin:0;padding:0;}
.nav-item{position:relative;}
.nav-link{display:flex;align-items:center;gap:4px;padding:9px 12px;font-size:13.5px;font-weight:600;color:var(--c-800);border-radius:7px;cursor:pointer;transition:var(--transition);white-space:nowrap;background:none;border:none;font-family:var(--font-sans);text-decoration:none;}
.nav-link:hover,.nav-link.active,.nav-item:hover>.nav-link{background:var(--c-600);color:#fff;}
.nav-chevron{font-size:9px;opacity:.55;transition:transform .22s;display:inline-block;}
.nav-item:hover .nav-chevron{transform:rotate(180deg);}

/* DROPDOWN */
.nav-dropdown{position:absolute;top:calc(100% + 6px);left:0;background:#fff;border-radius:var(--radius-md);box-shadow:var(--shadow-lg);min-width:230px;opacity:0;pointer-events:none;transform:translateY(-8px);transition:var(--transition);border:1px solid var(--color-border);z-index:1000;padding:6px;}
.nav-item:hover .nav-dropdown{opacity:1;pointer-events:all;transform:translateY(0);}
.nav-dropdown-item{display:flex;align-items:center;gap:10px;padding:9px 14px;border-radius:8px;font-size:13.5px;color:var(--color-text);transition:var(--transition);white-space:nowrap;text-decoration:none;}
.nav-dropdown-item:hover{background:var(--c-600);color:#fff;}
.nav-dd-ico{font-size:14px;width:18px;text-align:center;flex-shrink:0;}

/* MEGA MENU */
.nav-mega{position:absolute;top:calc(100% + 6px);left:50%;transform:translateX(-50%) translateY(-8px);background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-xl);width:680px;max-width:calc(100vw - 32px);opacity:0;pointer-events:none;transition:var(--transition);border:1px solid var(--color-border);z-index:1000;padding:1.5rem;}
.nav-item:hover .nav-mega{opacity:1;pointer-events:all;transform:translateX(-50%) translateY(0);}
.mega-cols-2{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;}
.mega-cols-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:.5rem;}
.mega-col h5{font-size:10px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--c-400);padding:0 10px 8px;margin-bottom:4px;border-bottom:1px solid var(--c-50);}
.mega-item{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:8px;font-size:13px;color:var(--color-text);transition:var(--transition);text-decoration:none;}
.mega-item:hover{background:var(--c-600);color:#fff;}
.mega-ico{font-size:15px;width:20px;text-align:center;flex-shrink:0;}

/* HEADER ACTIONS */
.header-actions{display:flex;align-items:center;gap:6px;flex-shrink:0;}
.hdr-search-btn{background:none;border:none;color:var(--c-700);font-size:18px;cursor:pointer;padding:8px;border-radius:var(--radius-sm);transition:var(--transition);line-height:1;}
.hdr-search-btn:hover{background:var(--c-100);color:var(--c-600);}
.hdr-tramites-btn{background:var(--acento);color:#fff;border:none;padding:9px 16px;border-radius:var(--radius-sm);font-size:13px;font-weight:700;cursor:pointer;transition:var(--transition);font-family:var(--font-sans);white-space:nowrap;box-shadow:0 3px 10px rgba(240,165,0,.3);}
.hdr-tramites-btn:hover{background:var(--c-600);}
.hdr-tramites-btn .t-txt{display:inline;}

/* HAMBURGER */
.hamburger{display:none;flex-direction:column;justify-content:center;gap:5px;background:none;border:none;cursor:pointer;padding:8px;border-radius:var(--radius-sm);width:42px;height:42px;transition:var(--transition);}
.hamburger:hover{background:var(--c-50);}
.hamburger span{display:block;height:2.5px;width:24px;background:var(--c-800);border-radius:2px;transition:all .3s;}
.hamburger.open span:nth-child(1){transform:translateY(7.5px) rotate(45deg);}
.hamburger.open span:nth-child(2){opacity:0;transform:scaleX(0);}
.hamburger.open span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg);}

/* SEARCH BAR */
.search-bar{position:absolute;top:100%;left:0;right:0;background:#fff;border-top:2px solid var(--color-border);max-height:0;overflow:hidden;transition:max-height .3s,padding .3s;box-shadow:var(--shadow-md);z-index:899;}
.search-bar.open{max-height:80px;padding:.875rem 0;}
.search-bar-inner{max-width:var(--max-width);margin:0 auto;padding:0 1.5rem;display:flex;gap:.75rem;}
.search-bar input{flex:1;border:2px solid var(--color-border);border-radius:var(--radius-sm);padding:.75rem 1rem;font-size:var(--text-base);font-family:var(--font-sans);outline:none;transition:border .2s;color:var(--color-text);}
.search-bar input:focus{border-color:var(--c-500);}
.search-bar .s-btn{background:var(--c-600);color:#fff;border:none;padding:.75rem 1.5rem;border-radius:var(--radius-sm);font-size:var(--text-sm);font-weight:700;cursor:pointer;font-family:var(--font-sans);transition:background .2s;}
.search-bar .s-btn:hover{background:var(--c-800);}

/* ── MOBILE NAV ── */
.mob-overlay{display:none;position:fixed;inset:0;background:rgba(10,31,68,.5);z-index:1099;backdrop-filter:blur(4px);}
.mob-overlay.open{display:block;}
.mobile-nav{display:none;position:fixed;top:0;right:-100%;width:min(340px,95vw);height:100dvh;background:#fff;z-index:1100;overflow-y:auto;box-shadow:-6px 0 40px rgba(10,31,68,.2);transition:right .32s cubic-bezier(.4,0,.2,1);flex-direction:column;}
.mobile-nav.open{right:0;}
.mob-head{background:linear-gradient(135deg,var(--c-800),var(--c-700));padding:1.125rem 1.25rem;display:flex;justify-content:space-between;align-items:center;}
.mob-head .ml{display:flex;align-items:center;gap:.75rem;}
.mob-head .ml img{height:42px;width:auto;object-fit:contain;}
.mob-head .ml .ico{font-size:26px;}
.mob-head .nt{font-family:var(--font-serif);font-size:14px;font-weight:900;color:#fff;line-height:1.15;}
.mob-head .ns{font-size:9.5px;color:rgba(255,255,255,.7);letter-spacing:1px;text-transform:uppercase;}
.mob-close{background:rgba(255,255,255,.12);border:none;color:#fff;font-size:20px;cursor:pointer;width:36px;height:36px;border-radius:var(--radius-sm);line-height:1;transition:background .2s;}
.mob-close:hover{background:rgba(255,255,255,.25);}
.mob-body{flex:1;padding:.625rem .75rem;}
.mob-search{display:flex;gap:.5rem;padding:.625rem 0 .875rem;border-bottom:1px solid var(--color-border);margin-bottom:.375rem;}
.mob-search input{flex:1;border:2px solid var(--color-border);border-radius:var(--radius-sm);padding:.5rem .75rem;font-size:14px;font-family:var(--font-sans);outline:none;color:var(--color-text);}
.mob-search input:focus{border-color:var(--c-600);}
.mob-search button{background:var(--c-600);color:#fff;border:none;border-radius:var(--radius-sm);padding:.5rem .875rem;font-size:15px;cursor:pointer;}
.mi{border-bottom:1px solid var(--c-50);}
.mi-lnk{display:flex;justify-content:space-between;align-items:center;padding:.8125rem .625rem;font-size:14.5px;font-weight:600;color:var(--c-800);cursor:pointer;border-radius:var(--radius-sm);transition:background .2s;text-decoration:none;}
.mi-lnk:hover,.mi-lnk:focus{background:var(--color-bg);}
.mi-arr{font-size:13px;color:var(--c-500);transition:transform .25s;display:inline-block;}
.mi.open .mi-arr{transform:rotate(90deg);}
.mi-sub{max-height:0;overflow:hidden;transition:max-height .35s ease;}
.mi.open .mi-sub{max-height:800px;}
.mi-grp{padding:.25rem 0 .5rem .75rem;}
.mi-grp-ttl{font-size:9.5px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--c-400);padding:.25rem .75rem .5rem;display:block;}
.mi-sl{display:flex;align-items:center;gap:.625rem;padding:.5625rem .75rem;font-size:13.5px;color:var(--color-muted);border-radius:var(--radius-sm);transition:var(--transition);margin-bottom:2px;text-decoration:none;}
.mi-sl:hover{background:var(--c-600);color:#fff;}
.mi-sl .ico{font-size:14px;width:18px;text-align:center;flex-shrink:0;}
.mob-foot{padding:1rem;background:var(--color-bg);border-top:1px solid var(--color-border);}
.mob-tramites-btn{display:block;width:100%;text-align:center;background:var(--acento);color:#fff;padding:.75rem;border-radius:var(--radius-sm);font-size:14px;font-weight:700;margin-bottom:.75rem;text-decoration:none;transition:background .2s;}
.mob-tramites-btn:hover{background:var(--c-600);}
.mob-info{font-size:12px;color:var(--color-muted);line-height:1.9;}
.mob-info a{color:var(--c-500);}

/* ── RESPONSIVE BREAKPOINTS ── */
@media(max-width:1100px){
  .nav-link{padding:9px 9px;font-size:13px;}
  .hdr-tramites-btn .t-txt{display:none;}
  .nav-mega{width:560px;}
}
@media(max-width:900px){
  .main-nav,.hdr-tramites-btn{display:none;}
  .hamburger{display:flex;}
  .mobile-nav{display:flex;}
  .header-inner-wrap{height:70px;}
}
@media(max-width:640px){
  .header-banner2{display:none;}
}
@media(max-width:520px){
  .topbar-left .tp-dir{display:none;}
  .logo-nombre{font-size:16px;}
  .logo-sub{display:none;}
  .topbar-right a{padding:3px 7px;}
}

/* ── SEARCHFORM WP override ── */
.search-form{display:flex;gap:.5rem;}
.search-field{flex:1;padding:.625rem .875rem;border:2px solid var(--color-border);border-radius:var(--radius-sm);font-family:var(--font-sans);font-size:var(--text-sm);outline:none;transition:border .2s;}
.search-field:focus{border-color:var(--c-500);}
.search-submit{padding:.625rem 1rem;background:var(--c-600);color:#fff;border:none;border-radius:var(--radius-sm);cursor:pointer;font-family:var(--font-sans);font-weight:700;transition:background .2s;}
.search-submit:hover{background:var(--c-800);}

/* ═══════════════════════════════════════════════════
   LOADER DE NAVEGACIÓN – GAD Salcedo
═══════════════════════════════════════════════════ */
#gad-loader {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(5, 15, 34, 0.92);
  backdrop-filter: blur(8px);
  opacity: 0;
  pointer-events: none;
  transition: opacity .3s ease;
}
#gad-loader.active {
  opacity: 1;
  pointer-events: all;
}
.gad-loader-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.5rem;
  animation: loaderPop .35s cubic-bezier(.34,1.56,.64,1) both;
}
@keyframes loaderPop {
  from { transform: scale(.82) translateY(12px); opacity: 0; }
  to   { transform: scale(1)   translateY(0);    opacity: 1; }
}
.gad-loader-img {
  max-width: min(480px, 88vw);
  max-height: 280px;
  width: auto;
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 8px 32px rgba(41,121,232,.45));
  border-radius: 12px;
}
/* Imagen "Una obra por semana" tiene fondo oscuro — mostrar con borde */
.gad-loader-img.img-obra {
  background: var(--c-800);
  border-radius: 14px;
  padding: 12px 20px;
  box-shadow: 0 0 0 2px rgba(240,165,0,.35);
}
/* Imagen "A Salcedo vuelven las obras" tiene fondo negro transparente */
.gad-loader-img.img-campana {
  background: transparent;
}

/* Barra de progreso */
.gad-loader-bar {
  width: min(360px, 80vw);
  height: 5px;
  background: rgba(255,255,255,.12);
  border-radius: 99px;
  overflow: hidden;
}
.gad-loader-progress {
  height: 100%;
  width: 0%;
  background: linear-gradient(90deg, var(--acento), var(--c-400));
  border-radius: 99px;
  transition: width .05s linear;
  box-shadow: 0 0 8px rgba(240,165,0,.6);
}
.gad-loader-txt {
  font-size: .8rem;
  color: rgba(255,255,255,.4);
  font-weight: 500;
  letter-spacing: 1px;
  text-transform: uppercase;
  margin: 0;
}

/* Reducir en móvil */
@media (max-width: 480px) {
  .gad-loader-img { max-height: 200px; }
  .gad-loader-bar { width: 85vw; }
}
