/* HUPI Custom - Header overlay en Home (home7) */
body.home7 .topbar,
body.home7 .gray-line{display:none !important;}

body.home7 header{
  position:fixed;
  top:0; left:0; right:0;
  z-index:999;
  background: rgba(0,0,0,.35);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(255,255,255,.18);  transition: background .22s ease, box-shadow .22s ease, border-color .22s ease;
}

/* Sticky header inteligente: transparente arriba, sólido y más compacto al scrollear */
body.home7 header.is-scrolled{
  background: rgba(0,0,0,.78);
  border-bottom-color: rgba(255,255,255,.12);
  box-shadow: 0 10px 30px rgba(0,0,0,.35);
}
body.home7 header.is-scrolled .container{
  padding-top:6px;
  padding-bottom:6px;
}
body.home7 header.is-scrolled .logo img{height:32px;}
body.home7 header.is-scrolled .menu > li > a{padding:7px 10px;}


body.home7 header .container{
  transition: padding .22s ease;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding-top:8px;
  padding-bottom:8px;
}

body.home7 header .logo img{height:38px;width:auto}

body.home7 header .menu > li > a,
body.home7 header .header-social a,
body.home7 header .header-social i{
  color:#fff !important;
}

body.home7 header .menu > li > a{font-weight:700; letter-spacing:.2px}
body.home7 header .menu > li > a:hover{opacity:.9}

/* Menú más "wey" (iconos + hover pill) */
body.home7 header .menu > li{margin:0 2px}
body.home7 header .menu > li > a{
  padding:10px 12px;
  border-radius:999px;
  display:flex;
  align-items:center;
  gap:8px;
  transition: background .18s ease, transform .18s ease, opacity .18s ease;
}
body.home7 header .menu > li > a i{font-size:14px; opacity:.95}
body.home7 header .menu > li > a:hover{
  background: rgba(255,255,255,.14);
  transform: translateY(-1px);
}
body.home7 header .menu > li.current-menu-item > a{
  background: rgba(255,255,255,.18);
}

body.home7 #slideshow7 ul.bg-info{position:relative; z-index:1}

/* Subrayado animado estilo agencia */
body.home7 header .menu > li > a{
  position:relative;
}
body.home7 header .menu > li > a::after{
  content:"";
  position:absolute;
  left:14px;
  right:14px;
  bottom:4px;
  height:2px;
  border-radius:999px;
  background: rgba(255,255,255,.85);
  transform: scaleX(0);
  transform-origin:left;
  transition: transform .18s ease, opacity .18s ease;
  opacity:.0;
}
body.home7 header .menu > li > a:hover::after{
  transform: scaleX(1);
  opacity:.95;
}
body.home7 header .menu > li.current-menu-item > a::after{
  transform: scaleX(1);
  opacity:.9;
}

/* Glow suave arriba del header */
body.home7 header::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background: linear-gradient(90deg, rgba(255,255,255,.06), rgba(255,255,255,0), rgba(255,255,255,.06));
  opacity:.45;
  mix-blend-mode: overlay;
}
body.home7 header.is-scrolled::before{opacity:.25;}



/* Mobile menu: solid background and brighter text for readability on Android */
@media (max-width: 767px){
  header .main-nav .minimal-menu{
    background: rgba(8,10,14,.94);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    color: #f8f9fa;
  }
  header .main-nav .minimal-menu h3,
  header .main-nav .minimal-menu ul li a{
    color: #f8f9fa;
    border-bottom-color: rgba(255,255,255,.08);
  }
  header .main-nav .minimal-menu li:hover a,
  header .main-nav .minimal-menu li.current a{
    background: rgba(255,255,255,.08);
  }
  header .main-nav .minimal-menu li li:hover a,
  header .main-nav .minimal-menu li li.current a{
    background: rgba(255,255,255,.12);
  }
  header .main-nav .minimal-menu li li li:hover a,
  header .main-nav .minimal-menu li li li.current a{
    background: rgba(255,255,255,.16);
  }
  header .main-nav .minimal-menu ul li.submenu > a:before,
  header .main-nav .minimal-menu ul li.submenu > a:after{
    color: #f8f9fa;
    background: #f8f9fa;
  }
  label.minimal-menu-button{
    background-color: #080a0e;
    border: 1px solid rgba(255,255,255,.12);
    box-shadow: 0 10px 30px rgba(0,0,0,.35);
  }
}
/* Mobile menu green variant to match logo */
@media (max-width: 767px){
  header .main-nav .minimal-menu{
    background: rgba(20,87,50,.96);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
  }
  header .main-nav .minimal-menu h3,
  header .main-nav .minimal-menu ul li a{
    color: #f8fff4;
  }
  header .main-nav .minimal-menu li:hover a,
  header .main-nav .minimal-menu li.current a{
    background: rgba(255,255,255,.10);
  }
  header .main-nav .minimal-menu li li:hover a,
  header .main-nav .minimal-menu li li.current a{
    background: rgba(255,255,255,.14);
  }
  header .main-nav .minimal-menu li li li:hover a,
  header .main-nav .minimal-menu li li li.current a{
    background: rgba(255,255,255,.18);
  }
  header .main-nav .minimal-menu ul li.submenu > a:before,
  header .main-nav .minimal-menu ul li.submenu > a:after{
    color: #f8fff4;
    background: #f8fff4;
  }
  label.minimal-menu-button{
    background-color: rgba(20,87,50,.96);
    border: 1px solid rgba(255,255,255,.18);
  }
}
/* Mobile menu glassy green (more transparency, still readable) */
@media (max-width: 767px){
  header .main-nav .minimal-menu{
    background: rgba(20,87,50,.78);
    -webkit-backdrop-filter: blur(10px) saturate(120%);
    backdrop-filter: blur(10px) saturate(120%);
    border: 1px solid rgba(255,255,255,.16);
    box-shadow: 0 14px 36px rgba(0,0,0,.32);
    color: #f3fff1;
    text-shadow: 0 1px 2px rgba(0,0,0,.25);
  }
  header .main-nav .minimal-menu h3,
  header .main-nav .minimal-menu ul li a{
    color: #f3fff1;
    border-bottom-color: rgba(255,255,255,.10);
  }
  header .main-nav .minimal-menu li:hover a,
  header .main-nav .minimal-menu li.current a{
    background: rgba(255,255,255,.10);
  }
  header .main-nav .minimal-menu li li:hover a,
  header .main-nav .minimal-menu li li.current a{
    background: rgba(255,255,255,.14);
  }
  header .main-nav .minimal-menu li li li:hover a,
  header .main-nav .minimal-menu li li li.current a{
    background: rgba(255,255,255,.18);
  }
  header .main-nav .minimal-menu ul li.submenu > a:before,
  header .main-nav .minimal-menu ul li.submenu > a:after{
    color: #f3fff1;
    background: #f3fff1;
  }
  label.minimal-menu-button{
    background-color: rgba(20,87,50,.82);
    border: 1px solid rgba(255,255,255,.20);
    box-shadow: 0 12px 30px rgba(0,0,0,.32);
  }
}

/* Header tech signal */
body.home7 .hupi-tech-signal{
  display:flex;
  align-items:center;
  gap:6px;
  margin-right:auto;
  padding:6px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:999px;
  background:rgba(8,16,14,.28);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}
body.home7 .hupi-tech-signal span{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 10px;
  border-radius:999px;
  background:rgba(255,255,255,.10);
  color:#f4fff8;
  font-family:"Montserrat", sans-serif;
  font-size:11px;
  font-weight:700;
  line-height:1;
  text-transform:uppercase;
  white-space:nowrap;
}
body.home7 .hupi-tech-signal i{
  color:#64d889;
  font-size:12px;
}
@media (max-width: 1180px){
  body.home7 .hupi-tech-signal{display:none;}
}
body.home7 .hupi-tech-signal{
  margin-left:8px;
  margin-right:8px;
}