/* ===== Header ===== */
.site-header{
	position:sticky;
	top:0;
	z-index:50;
	background:var(--red);
	color:#fff;
	box-shadow:var(--shadow);
}
.site-header .container{ 
    height: 95px; /* MODIFICADO: Antes 91px */ 
    display:flex; 
    align-items:center; 
    justify-content:space-between; 
    gap:16px; 
}
.brand{display:flex; align-items:center; gap:100px; color:#ffffff; text-decoration:none; font-weight:800; letter-spacing:.5px}
.brand-mark{
    height: 70px; /* MODIFICADO: Antes 44px */ 
    width: auto; 
    object-fit:contain; 
    border-radius:10px
}
.brand-slogan {
  font-size: 14px;
  font-weight: 500;
  margin-top: 5px;
  margin-left: 18px;
  color: #feffff; 
  text-align: left;
  letter-spacing: 0.5px;
}
.brand-logo-container {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
}
.brand-text{font-size:18px}
.nav{display:flex; align-items:center; gap:20px}

/* ===== Modificado: subrayado animado ===== */
.site-header .nav .nav-link,
.site-header .nav .nav-link:link,
.site-header .nav .nav-link:visited{
	color:#fff;
	text-decoration:none !important;
	font-weight:600;
	font-size:18.5px;
	opacity:.95;
	position:relative;
	background-image: linear-gradient(currentColor, currentColor);
	background-position: 0 100%;
	background-repeat: no-repeat;
	background-size: 0% 2px;
	transition: background-size .25s ease, opacity .2s ease;
}
.site-header .nav .nav-link:hover{
	opacity:1;
	background-size: 100% 2px;
}
.site-header .nav .nav-link.active,
.site-header .nav .nav-link[aria-current="page"]{
	background-size: 100% 2px;
}
/* ===== Fin mod ===== */

.btn-cta{ background:#fff; color:var(--red); font-weight:800; padding:10px 14px; border-radius:999px; text-decoration:none; border:2px solid #fff; transition:.1s }
.btn-cta:hover{transform:translateY(-1px); background:transparent; color:#fff}

a:focus-visible, button:focus-visible{ outline:3px solid #fff; outline-offset:2px; border-radius:8px }
.nav-toggle{ display:none; border:0; background:transparent; cursor:pointer; width:40px; height:40px; padding:8px; border-radius:8px;}
.nav-toggle .bar{display:block; width:100%; height:2px; background:#fff; margin:5px 0}

@media (max-width: 880px){
	.nav-toggle{display:block}
	.nav{
		position:fixed;
		inset:64px 0 auto 0;
		background:var(--red);
		display:flex;
		flex-direction:column;
		gap:14px;
		padding:16px 20px 24px;
		transform:translateY(-12px);
		opacity:0;
		pointer-events:none;
		transition:.2s
	}
	.nav.open{transform:translateY(0); opacity:1; pointer-events:auto}
	.btn-cta{align-self:flex-start}
}

/* ===== Botón de cambio de tema - MODO CLARO ===== */
.theme-toggle,
#theme-toggle,
#mini-theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  background: white;
  border: 2px solid white;
  font-size: 18px;
  border-radius: 50%;
  cursor: pointer;
  transition: all 0.2s ease;
  padding: 0;
}

/* Ícono ROJO por defecto */
.theme-toggle i,
#theme-toggle i,
#mini-theme-toggle i {
  color: var(--red) !important;
  font-size: 18px;
}

/* Hover: fondo rojo, ícono blanco */
.theme-toggle:hover,
#theme-toggle:hover,
#mini-theme-toggle:hover {
  background: var(--red);
  border-color: white;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(255, 255, 255, 0.4);
}

.theme-toggle:hover i,
#theme-toggle:hover i,
#mini-theme-toggle:hover i {
  color: white !important;
}