/* Este subdominio es exclusivo del portal — el header propio de Blocksy
   (id="header" class="ct-header") se oculta en cualquier página que use
   nuestro shortcode, para que no compita por el mismo espacio. */
#header.ct-header{ display:none !important; }

/* Header sólido en el flujo normal de la página (no position:fixed).
   Antes flotaba transparente sobre el hero, pero un contenedor de
   Stackable con transform rompe el comportamiento de "fixed" en varios
   navegadores/temas — así queda simple y siempre se ve bien, sin
   depender de la estructura de bloques por debajo. */
.site-header{
	position:relative; z-index:5;
	display:flex; align-items:center; justify-content:space-between;
	padding:20px clamp(20px,5vw,64px);
	background:var(--sp-bg-dark);
	font-family:'Inter', sans-serif;
}

.site-header .logo{
	font-family:'Fraunces', serif; font-size:1.4rem; font-weight:500;
	color:var(--sp-logo-green) !important; white-space:nowrap;
	text-decoration:none;
	display:inline-flex; align-items:center; gap:8px;
}
.site-header .logo-icon{ width:26px; height:26px; flex-shrink:0; }
.site-header .logo span{ color:var(--sp-logo-red) !important; }
.site-header .main-nav{ display:flex; align-items:center; gap:34px; }
.site-header .main-nav a{ font-size:.98rem; color:var(--sp-text-cream-dim) !important; text-decoration:none; transition:color .2s ease; }
.site-header .main-nav a:hover{ color:var(--sp-text-cream) !important; }
.site-header .header-right{ display:flex; align-items:center; gap:18px; }
.site-header .publish-btn{
	font-size:.88rem; font-weight:600; color:#fff !important; background:var(--sp-accent-red);
	text-decoration:none; padding:10px 20px; border-radius:100px; white-space:nowrap;
	transition:background .2s ease;
}
.site-header .publish-btn:hover{ background:var(--sp-accent-red-hover); }

@media (max-width:900px){ .site-header .main-nav{ display:none; } }

.header-toggle{
	display:none;
	flex-direction:column;
	justify-content:center;
	gap:5px;
	width:34px; height:34px;
	background:transparent;
	border:none;
	cursor:pointer;
	padding:0;
}
.header-toggle span{
	display:block;
	width:100%;
	height:2px;
	background:var(--sp-text-cream);
	border-radius:2px;
	transition:transform .2s ease, opacity .2s ease;
}
.site-header.is-solid .header-toggle span{ background:var(--sp-text-cream); }
.header-toggle.is-open span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.header-toggle.is-open span:nth-child(2){ opacity:0; }
.header-toggle.is-open span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

.mobile-nav{
	display:none;
	flex-direction:column;
	position:fixed;
	left:0; right:0;
	background:var(--sp-bg-dark);
	padding:6px 20px 16px;
	box-shadow:0 12px 24px rgba(0,0,0,.25);
	z-index:99999;
}
.mobile-nav.is-open{ display:flex !important; }
.mobile-nav a{
	color:var(--sp-text-cream-dim) !important;
	text-decoration:none !important;
	display:block !important;
	padding:10px 4px !important;
	line-height:1.3 !important;
	font-size:.95rem !important;
	border-bottom:1px solid rgba(246,241,231,.1);
}
.mobile-nav a:last-of-type{ border-bottom:none; }
.mobile-nav a.mobile-nav-publish{
	color:#fff !important;
	background:var(--sp-accent-red) !important;
	font-weight:600 !important;
	text-align:center !important;
	border-radius:100px !important;
	padding:12px 20px !important;
	margin-top:6px !important;
	border-bottom:none !important;
}
.mobile-nav a.mobile-nav-publish:active,
.mobile-nav a.mobile-nav-publish:hover{ background:var(--sp-accent-red-hover) !important; }

@media (max-width:900px){
	.header-toggle{ display:flex; }
	.site-header{ position:relative; }
	.header-right .publish-btn{ display:none; }
}
@media (min-width:901px){
	.mobile-nav{ display:none !important; }
}