/* whoscrizzz — tweaks.css
 * Overrides expresivos accionados por body classes:
 *   .mood-mono (home y portafolio)
 *   .density-compact | .density-default | .density-airy
 * Plus CSS vars on :root for atmosphere slider:
 *   --atm: 0..1   (intensidad cinematográfica)
 */

:root {
	--atm: 0.85;
	--shimmer-dur: 2.9s;
}

/* ───── MOOD: MONO — escala de grises elegante ───── */
body.mono-bw,
body.mood-mono {
	--mood-shimmer: linear-gradient(
		120deg,
		#4a4a4a 0%,
		#707070 12%,
		#aaaaaa 28%,
		#e8e8e8 44%,
		#ffffff 50%,
		#e8e8e8 56%,
		#aaaaaa 72%,
		#707070 88%,
		#4a4a4a 100%
	);
	--mood-line: linear-gradient(
		90deg,
		#4a4a4a 0%,
		#707070 12%,
		#aaaaaa 28%,
		#e8e8e8 44%,
		#ffffff 50%,
		#e8e8e8 56%,
		#aaaaaa 72%,
		#707070 88%,
		#4a4a4a 100%
	);
	--mood-pulse: #aaaaaa;
	--mood-bg-1: rgba(120, 120, 120, 0.22);
	--mood-bg-2: rgba(60, 60, 60, 0.32);
	--mood-bg-3: rgba(80, 80, 80, 0.14);
	--mood-greet-dot: #888888;
}

body.mood-mono #smoke {
	filter: grayscale(0.72) brightness(0.92) contrast(1.14) saturate(0.42);
}
body.mood-mono #lightning-canvas {
	filter: grayscale(0.68) brightness(0.88) contrast(1.14) saturate(0.48);
	opacity: 0.72;
}

body.mood-mono[data-page='home'] #smoke {
	filter: grayscale(0.7) brightness(0.9) contrast(1.16) saturate(0.45);
	opacity: min(1, calc(0.3 + var(--atm, 0.85) * 1.02));
}

body.mood-mono[data-page='home'] #lightning-canvas {
	filter: grayscale(0.66) brightness(0.86) contrast(1.16) saturate(0.5);
	opacity: calc(0.38 + var(--atm, 0.85) * 0.58);
}

body.mood-mono[data-page='portafolio'] #smoke {
	filter: grayscale(0.7) brightness(0.9) contrast(1.16) saturate(0.45);
	opacity: min(1, calc(0.3 + var(--atm, 0.85) * 1.02));
}

body.mood-mono[data-page='portafolio'] #lightning-canvas {
	filter: grayscale(0.66) brightness(0.86) contrast(1.16) saturate(0.5);
	opacity: calc(0.38 + var(--atm, 0.85) * 0.58);
}
body.mood-mono .av-pulse {
	background: #b0b0b0;
	box-shadow: 0 0 0 0 rgba(180, 180, 180, 0.55);
}

/* Home mono — fondo cinematográfico (sin mover layout) */
body.mood-mono[data-page='home']::before {
	background:
		radial-gradient(ellipse 110% 75% at 50% -8%, rgba(72, 72, 80, 0.12) 0%, transparent 52%),
		radial-gradient(ellipse 120% 80% at 50% 0%, rgba(32, 34, 40, 0.44) 0%, transparent 55%),
		radial-gradient(ellipse 95% 72% at 82% 100%, rgba(12, 12, 16, 0.58) 0%, transparent 58%),
		radial-gradient(ellipse 70% 55% at 12% 88%, rgba(20, 20, 24, 0.4) 0%, transparent 62%),
		linear-gradient(180deg, #060608 0%, #040406 42%, #020202 100%);
}

/* Capa de color grade + letterbox sutil (fijo, sin animación) */
body.mood-mono[data-page='home']::after {
	content: '';
	position: fixed;
	inset: 0;
	z-index: 0;
	pointer-events: none;
	background:
		linear-gradient(180deg, rgba(0, 0, 0, 0.4) 0%, transparent 5%, transparent 95%, rgba(0, 0, 0, 0.44) 100%),
		radial-gradient(ellipse 105% 78% at 50% 48%, transparent 36%, rgba(4, 4, 8, 0.48) 100%),
		radial-gradient(ellipse 55% 35% at 50% 0%, rgba(180, 180, 190, 0.04) 0%, transparent 72%);
	opacity: calc(0.42 + var(--atm, 0.85) * 0.18);
}

.cine-vignette,
.cine-grain {
	position: fixed;
	inset: 0;
	pointer-events: none;
}

.cine-vignette {
	z-index: 0;
	background: radial-gradient(ellipse 72% 68% at 50% 46%, transparent 42%, rgba(0, 0, 0, 0.42) 72%, rgba(0, 0, 0, 0.72) 100%);
	opacity: 0;
	transition: opacity 0.4s ease;
}

.cine-grain {
	z-index: 0;
	opacity: 0;
	background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
	background-size: 180px 180px;
	mix-blend-mode: overlay;
}

body.mood-mono[data-page='home'] .cine-vignette,
body.mood-mono[data-page='home'] .cine-grain,
body.mood-mono[data-page='portafolio'] .cine-vignette,
body.mood-mono[data-page='portafolio'] .cine-grain {
	opacity: 1;
}

body.mood-mono[data-page='portafolio'] .cine-vignette {
	background: radial-gradient(ellipse 66% 58% at 50% 38%, transparent 36%, rgba(0, 0, 0, 0.42) 66%, rgba(0, 0, 0, 0.78) 100%);
	opacity: calc(0.5 + var(--atm, 0.85) * 0.12);
	-webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 42%, rgba(0, 0, 0, 0.55) 72%, transparent 100%);
	mask-image: linear-gradient(to bottom, #000 0%, #000 42%, rgba(0, 0, 0, 0.55) 72%, transparent 100%);
}

body.mood-mono[data-page='home'] .cine-vignette {
	background: radial-gradient(ellipse 66% 58% at 50% 38%, transparent 36%, rgba(0, 0, 0, 0.42) 66%, rgba(0, 0, 0, 0.78) 100%);
	opacity: calc(0.52 + var(--atm, 0.85) * 0.12);
	-webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 42%, rgba(0, 0, 0, 0.55) 72%, transparent 100%);
	mask-image: linear-gradient(to bottom, #000 0%, #000 42%, rgba(0, 0, 0, 0.55) 72%, transparent 100%);
}

body.mood-mono[data-page='home'] .cine-grain {
	opacity: calc(0.08 + var(--atm, 0.85) * 0.09);
	-webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 48%, rgba(0, 0, 0, 0.35) 78%, transparent 100%);
	mask-image: linear-gradient(to bottom, #000 0%, #000 48%, rgba(0, 0, 0, 0.35) 78%, transparent 100%);
	animation: cine-grain-drift 9s steps(8) infinite;
	mix-blend-mode: soft-light;
	background-image:
		url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E"),
		repeating-linear-gradient(0deg, transparent 0, transparent 2px, rgba(0, 0, 0, 0.025) 2px, rgba(0, 0, 0, 0.025) 3px);
}

body.mood-mono[data-page='portafolio'] .cine-grain {
	opacity: calc(0.08 + var(--atm, 0.85) * 0.09);
	animation: cine-grain-drift 9s steps(8) infinite;
	mix-blend-mode: soft-light;
	-webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 48%, rgba(0, 0, 0, 0.35) 78%, transparent 100%);
	mask-image: linear-gradient(to bottom, #000 0%, #000 48%, rgba(0, 0, 0, 0.35) 78%, transparent 100%);
}

@keyframes cine-grain-drift {
	0%,
	100% {
		transform: translate(0, 0);
	}
	20% {
		transform: translate(-2%, -1%);
	}
	40% {
		transform: translate(1%, 2%);
	}
	60% {
		transform: translate(2%, -2%);
	}
	80% {
		transform: translate(-1%, 1%);
	}
}

@media (prefers-reduced-motion: reduce) {
	body.mood-mono[data-page='home'] .cine-grain,
	body.mood-mono[data-page='portafolio'] .cine-grain {
		animation: none;
	}
}

/* Portafolio mono — mismo fondo cinematográfico que home */
body.mood-mono[data-page='portafolio']::before {
	background:
		radial-gradient(ellipse 110% 75% at 50% -8%, rgba(72, 72, 80, 0.12) 0%, transparent 52%),
		radial-gradient(ellipse 120% 80% at 50% 0%, rgba(32, 34, 40, 0.44) 0%, transparent 55%),
		radial-gradient(ellipse 95% 72% at 82% 100%, rgba(12, 12, 16, 0.58) 0%, transparent 58%),
		radial-gradient(ellipse 70% 55% at 12% 88%, rgba(20, 20, 24, 0.4) 0%, transparent 62%),
		linear-gradient(180deg, #060608 0%, #040406 42%, #020202 100%);
}

body.mood-mono[data-page='portafolio']::after {
	content: '';
	position: fixed;
	inset: 0;
	z-index: 0;
	pointer-events: none;
	background:
		linear-gradient(180deg, rgba(0, 0, 0, 0.4) 0%, transparent 5%, transparent 95%, rgba(0, 0, 0, 0.44) 100%),
		radial-gradient(ellipse 105% 78% at 50% 48%, transparent 36%, rgba(4, 4, 8, 0.48) 100%),
		radial-gradient(ellipse 55% 35% at 50% 0%, rgba(180, 180, 190, 0.04) 0%, transparent 72%);
	opacity: calc(0.42 + var(--atm, 0.85) * 0.18);
}

/* Mono — nav pill negra/plata (home + portafolio) */
body.mood-mono .main-nav {
	display: grid;
	grid-template-columns: minmax(5.5rem, 1fr) auto minmax(5.5rem, 1fr);
	align-items: center;
	column-gap: clamp(6px, 1.4vw, 14px);
	row-gap: 2px;
	min-width: min(100%, 17.5rem);
	background: linear-gradient(165deg, rgba(20, 20, 24, 0.92) 0%, rgba(10, 10, 14, 0.86) 50%, rgba(16, 16, 20, 0.9) 100%);
	border: 1px solid rgba(255, 255, 255, 0.14);
	box-shadow:
		0 0 0 1px rgba(255, 255, 255, 0.06) inset,
		0 18px 44px -20px rgba(0, 0, 0, 0.72),
		0 0 20px rgba(255, 255, 255, 0.03);
	backdrop-filter: blur(22px) saturate(110%);
	-webkit-backdrop-filter: blur(22px) saturate(110%);
}

body.mood-mono .main-nav .nav-link--inicio {
	justify-self: end;
}

body.mood-mono .main-nav .nav-link--portafolio {
	justify-self: start;
}

body.mood-mono .main-nav .nav-link-label {
	display: inline-block;
	line-height: 1.15;
	white-space: nowrap;
}

body.mood-mono .main-nav .nav-link--inicio,
body.mood-mono .main-nav .nav-link--portafolio {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	min-height: 36px;
	min-width: 5.5rem;
	padding: 8px 14px;
	border: none;
	box-shadow: none;
	color: rgba(168, 172, 180, 0.9);
	background: transparent;
	font-size: 0.84rem;
	letter-spacing: 0.02em;
	transition:
		color 0.2s ease,
		background 0.2s ease,
		box-shadow 0.2s ease;
}

body.mood-mono .main-nav .nav-link--inicio:hover,
body.mood-mono .main-nav .nav-link--inicio:focus-visible,
body.mood-mono .main-nav .nav-link--portafolio:hover,
body.mood-mono .main-nav .nav-link--portafolio:focus-visible {
	color: #ececf0;
	background: rgba(255, 255, 255, 0.07);
	border: none;
	box-shadow: none;
}

body.mood-mono .main-nav .nav-link.active {
	color: #f4f4f8;
	background: rgba(255, 255, 255, 0.12);
	box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.14) inset;
}

body.mood-mono .main-nav .nav-link.active:hover,
body.mood-mono .main-nav .nav-link.active:focus-visible {
	color: #fafafc;
	background: rgba(255, 255, 255, 0.14);
}

body.mood-mono[data-page='home'] .main-nav .nav-link--portafolio,
body.mood-mono[data-page='portafolio'] .main-nav .nav-link--portafolio {
	min-width: 6.75rem;
}

body.mood-mono[data-page='home'] .main-nav .nav-link--portafolio {
	padding-inline: 10px 12px;
}

body.mood-mono[data-page='home'] .main-nav .nav-link--inicio,
body.mood-mono[data-page='portafolio'] .main-nav .nav-link--inicio {
	min-width: 6.75rem;
}

body.mood-mono[data-page='home'] .main-nav .nav-cursor-wrap {
	width: 18px;
	height: 18px;
	overflow: visible;
	opacity: 0.55;
	transition:
		opacity 0.25s ease,
		transform 0.25s ease;
}

body.mood-mono[data-page='home'] .main-nav .nav-cursor-wrap::before {
	content: '';
	position: absolute;
	inset: -4px;
	border-radius: 50%;
	border: 1px solid rgba(255, 255, 255, 0.16);
	opacity: 0;
	transform: scale(0.82);
	transition:
		opacity 0.25s ease,
		transform 0.25s ease;
	pointer-events: none;
}

body.mood-mono[data-page='home'] .main-nav .nav-link--portafolio:hover .nav-cursor-wrap,
body.mood-mono[data-page='home'] .main-nav .nav-link--portafolio:focus-visible .nav-cursor-wrap {
	opacity: 1;
	transform: scale(1.04);
}

body.mood-mono[data-page='home'] .main-nav .nav-link--portafolio:hover .nav-cursor-wrap::before,
body.mood-mono[data-page='home'] .main-nav .nav-link--portafolio:focus-visible .nav-cursor-wrap::before {
	opacity: 1;
	transform: scale(1);
	animation: nav-cursor-ring 1.6s ease-in-out infinite;
}

body.mood-mono[data-page='home'] .main-nav .nav-cursor-hint {
	width: 16px;
	height: 16px;
	transform-origin: 2px 2px;
	filter: drop-shadow(1px 2px 0 rgba(0, 0, 0, 0.5));
}

@keyframes nav-cursor-ring {
	0%,
	100% {
		opacity: 0.45;
		transform: scale(0.92);
	}
	50% {
		opacity: 0.95;
		transform: scale(1.08);
	}
}

@media (prefers-reduced-motion: reduce) {
	body.mood-mono[data-page='home'] .main-nav .nav-cursor-wrap::before {
		animation: none;
	}
}

body.mood-mono .main-nav .nav-brand {
	justify-self: center;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	padding: 0;
	opacity: 1;
	border-radius: 50%;
	background: linear-gradient(165deg, rgba(255, 255, 255, 0.18) 0%, rgba(255, 255, 255, 0.07) 46%, rgba(128, 229, 255, 0.12) 100%);
	border: 1px solid rgba(255, 255, 255, 0.22);
	box-shadow:
		0 0 0 1px rgba(0, 0, 0, 0.32) inset,
		0 0 16px rgba(128, 229, 255, 0.14),
		0 4px 14px rgba(0, 0, 0, 0.38);
	transition:
		background 0.22s ease,
		border-color 0.22s ease,
		box-shadow 0.22s ease,
		transform 0.22s ease;
}

body.mood-mono .main-nav .nav-brand img,
body.mood-mono .main-nav .nav-brand svg {
	width: 22px;
	height: 22px;
	display: block;
	object-fit: contain;
	filter: drop-shadow(0 0 5px rgba(255, 255, 255, 0.42)) drop-shadow(0 0 10px rgba(128, 229, 255, 0.28));
}

body.mood-mono .main-nav .nav-brand:hover,
body.mood-mono .main-nav .nav-brand:focus-visible {
	background: linear-gradient(165deg, rgba(255, 255, 255, 0.24) 0%, rgba(255, 255, 255, 0.1) 46%, rgba(128, 229, 255, 0.18) 100%);
	border-color: rgba(255, 255, 255, 0.3);
	box-shadow:
		0 0 0 1px rgba(0, 0, 0, 0.28) inset,
		0 0 22px rgba(128, 229, 255, 0.22),
		0 6px 16px rgba(0, 0, 0, 0.42);
	transform: translateY(-1px) scale(1.04);
}

body[data-page='portafolio'] .main-nav {
	margin: 0 auto 1.1rem;
}

@media (min-width: 900px) {
	body.mood-mono .main-nav .nav-link--inicio,
	body.mood-mono .main-nav .nav-link--portafolio {
		min-height: 40px;
		min-width: 6.25rem;
		padding: 10px 18px;
		font-size: 0.9rem;
	}

	body.mood-mono .main-nav .nav-brand {
		width: 38px;
		height: 38px;
	}

	body.mood-mono .main-nav .nav-brand img,
	body.mood-mono .main-nav .nav-brand svg {
		width: 24px;
		height: 24px;
	}
}

body.mood-mono[data-page='home'] .hero-unified-panel {
	background: transparent;
	background-image: none;
	border: none;
	box-shadow: none;
}

/* Hero mono — plata/blanco cinematográfico */
body.mood-mono[data-page='home'] .hero-stage .hero-wordmark {
	background: linear-gradient(168deg, #fafafa 0%, #ececf0 18%, #d0d0d8 38%, #a8a8b4 62%, #808088 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: #d0d0d8;
	filter: none;
}

body.mood-mono[data-page='home'] .hero-stage .hero-wordmark .reg {
	-webkit-text-fill-color: #b0b0b8;
	color: #b0b0b8;
}

body.mood-mono[data-page='home'] .hero-unified-panel .hero-logo--stage,
body.mood-mono[data-page='home'] .hero-stage .hero-logo--stage {
	border: none;
	background: transparent;
	box-shadow: none;
	backdrop-filter: none;
	-webkit-backdrop-filter: none;
}

body.mood-mono[data-page='home'] .hero-stage .hero-line,
body.mood-mono[data-page='home'] .hero-unified-panel .hero-line {
	position: relative;
	height: 1px;
	background: linear-gradient(
		90deg,
		transparent 0%,
		rgba(0, 212, 255, 0.35) 18%,
		rgba(200, 245, 255, 0.85) 50%,
		rgba(0, 212, 255, 0.35) 82%,
		transparent 100%
	);
	box-shadow: 0 0 10px rgba(0, 212, 255, 0.28);
}

body.mood-mono[data-page='home'] .hero-stage .hero-line::after {
	content: '';
	position: absolute;
	left: 50%;
	top: 50%;
	width: 34%;
	height: 2px;
	transform: translate(-50%, -50%);
	border-radius: 999px;
	background: radial-gradient(ellipse at center, rgba(240, 240, 246, 0.42) 0%, transparent 72%);
	filter: blur(1.5px);
	pointer-events: none;
}

body.mood-mono[data-page='home'] .hero-stage .hero-tagline {
	color: #9ca0a8;
	letter-spacing: 0.16em;
	text-shadow: 0 0 14px rgba(255, 255, 255, 0.07);
}

/* Portafolio hero — misma marca que home mood-mono */
body.mood-mono[data-page='portafolio'] .pf-hero .hero-wordmark {
	background: linear-gradient(168deg, #fafafa 0%, #ececf0 18%, #d0d0d8 38%, #a8a8b4 62%, #808088 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: #d0d0d8;
	filter: none;
}

body.mood-mono[data-page='portafolio'] .pf-hero .hero-wordmark .reg {
	-webkit-text-fill-color: #b0b0b8;
	color: #b0b0b8;
}

body.mood-mono[data-page='portafolio'] .pf-hero .hero-subtitle {
	font-weight: 500;
	letter-spacing: 0.16em;
	color: #9ca0a8;
	text-shadow: 0 0 10px rgba(255, 255, 255, 0.06);
}

body.mood-mono[data-page='portafolio'] .pf-hero .hero-line {
	background: linear-gradient(
		90deg,
		transparent 0%,
		rgba(0, 212, 255, 0.35) 18%,
		rgba(200, 245, 255, 0.85) 50%,
		rgba(0, 212, 255, 0.35) 82%,
		transparent 100%
	);
	box-shadow: 0 0 10px rgba(0, 212, 255, 0.28);
}

body.mood-mono[data-page='home'] .hero-stage .hero-avail {
	margin: clamp(8px, 1.6vw, 12px) 0 0;
	padding: 5px 12px;
	border-radius: 999px;
	font-family: 'Albert Sans', system-ui, sans-serif;
	font-size: clamp(0.52rem, 1.3vw, 0.68rem);
	font-weight: 500;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: rgba(200, 204, 212, 0.88);
	border: 1px solid rgba(255, 255, 255, 0.12);
	background: rgba(255, 255, 255, 0.04);
}

body.mood-mono[data-page='home'] .contact-section .section-heading,
body.mood-mono[data-page='home'] .hero-unified-panel .contact-section-heading {
	background: linear-gradient(168deg, #f4fcff 0%, #d4f4ff 28%, #9ad8f2 62%, #7ec8e8 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: transparent;
	filter: drop-shadow(0 0 14px rgba(0, 212, 255, 0.22));
}

body.mood-mono[data-page='home'] .contact-section .section-lead,
body.mood-mono[data-page='home'] .hero-unified-panel .contact-section-lead {
	color: #c4cad4;
	text-shadow: 0 0 14px rgba(255, 255, 255, 0.06);
}

body.mood-mono[data-page='home'] .home-contact-btn {
	border-color: rgba(0, 212, 255, 0.32);
	background: linear-gradient(168deg, rgba(18, 28, 36, 0.88) 0%, rgba(10, 14, 20, 0.72) 100%);
	box-shadow:
		0 0 0 1px rgba(0, 212, 255, 0.1) inset,
		0 12px 32px -14px rgba(0, 0, 0, 0.6),
		0 0 28px -8px rgba(0, 212, 255, 0.2);
}

body.mood-mono[data-page='home'] .home-contact-btn-glow {
	background: radial-gradient(ellipse 70% 80% at 50% 100%, rgba(0, 212, 255, 0.16), transparent 68%);
}

body.mood-mono[data-page='home'] .home-contact-btn-icon {
	color: #9ad8f2;
	filter: drop-shadow(0 0 8px rgba(0, 212, 255, 0.35));
}

body.mood-mono[data-page='home'] .home-contact-btn:hover,
body.mood-mono[data-page='home'] .home-contact-btn:focus-visible {
	border-color: rgba(0, 212, 255, 0.52);
	box-shadow:
		0 0 0 1px rgba(0, 212, 255, 0.16) inset,
		0 18px 40px -12px rgba(0, 0, 0, 0.62),
		0 0 36px -2px rgba(0, 212, 255, 0.32);
}

/* Redes: conservan color de marca en mono */
body.mood-mono[data-page='home'] .social-section-kicker {
	color: rgba(210, 214, 222, 0.96);
	letter-spacing: 0.34em;
	text-shadow:
		0 0 10px rgba(255, 255, 255, 0.2),
		0 0 20px rgba(220, 225, 235, 0.1);
	animation: section-kicker-glow 4.2s ease-in-out infinite;
}

body.mood-mono[data-page='home'] .social-section-title {
	background: linear-gradient(168deg, #ffffff 0%, #f4f4f8 18%, #e0e0e8 42%, #c0c0c8 68%, #a0a0a8 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: transparent;
	filter: drop-shadow(0 0 12px rgba(255, 255, 255, 0.22)) drop-shadow(0 0 28px rgba(235, 238, 246, 0.12));
}

body.mood-mono[data-page='home'] .social-section-lead {
	color: #c0c8d4;
	text-shadow: 0 0 12px rgba(255, 255, 255, 0.05);
}

body.mood-mono[data-page='home'] .social-section-bridge {
	background: linear-gradient(
		90deg,
		transparent,
		rgba(255, 255, 255, 0.38) 32%,
		rgba(255, 255, 255, 0.88) 50%,
		rgba(255, 255, 255, 0.38) 68%,
		transparent
	);
	box-shadow:
		0 0 18px rgba(255, 255, 255, 0.22),
		0 0 36px rgba(220, 225, 235, 0.1);
}

body.mood-mono[data-page='home'] .section-block-head .section-bridge {
	background: linear-gradient(
		90deg,
		transparent,
		rgba(255, 255, 255, 0.34) 38%,
		rgba(255, 255, 255, 0.82) 50%,
		rgba(255, 255, 255, 0.34) 62%,
		transparent
	);
	box-shadow:
		0 0 16px rgba(255, 255, 255, 0.18),
		0 0 32px rgba(220, 225, 235, 0.08);
}

@keyframes section-kicker-glow {
	0%,
	100% {
		text-shadow:
			0 0 8px rgba(255, 255, 255, 0.14),
			0 0 16px rgba(220, 225, 235, 0.06);
	}
	50% {
		text-shadow:
			0 0 14px rgba(255, 255, 255, 0.28),
			0 0 28px rgba(235, 238, 246, 0.14);
	}
}

@media (prefers-reduced-motion: reduce) {
	body.mood-mono[data-page='home'] .social-section-kicker,
	body[data-page='home'] .section-block-head .section-bridge::after {
		animation: none;
	}
}

/* Profundidad cinematográfica — redes y bloque inferior (solo sombras/luz, sin mover) */
body.mood-mono[data-page='home'] .home-below-hero::before {
	content: '';
	position: absolute;
	inset: 0 0 -6%;
	pointer-events: none;
	z-index: 0;
	background:
		radial-gradient(ellipse 90% 38% at 50% 0%, rgba(160, 164, 174, 0.025) 0%, transparent 72%),
		radial-gradient(ellipse 95% 55% at 50% 100%, rgba(0, 0, 0, 0.14) 0%, transparent 78%);
}

body.mood-mono[data-page='home'] .hero-unified-panel .home-below-hero::before,
body.mood-mono[data-page='home'] .hero-unified-panel .home-unified-content::before {
	display: none;
}

body.mood-mono[data-page='home'] .home-below-hero > * {
	position: relative;
	z-index: 1;
}

body.mood-mono[data-page='home'] .social-section {
	/* Sin filter en el contenedor: evita composición borrosa en hijos */
	filter: none;
}

body.mood-mono[data-page='home'] .social-card {
	border-color: rgba(180, 184, 192, 0.16);
	box-shadow:
		0 22px 48px -14px rgba(0, 0, 0, 0.78),
		0 10px 24px -10px rgba(0, 0, 0, 0.55),
		0 0 0 1px rgba(255, 255, 255, 0.05) inset,
		0 0 48px -20px rgba(200, 200, 210, 0.06);
}

body.mood-mono[data-page='home'] .home-flow-divider {
	box-shadow:
		0 0 14px rgba(255, 255, 255, 0.12),
		0 0 28px rgba(200, 200, 210, 0.06);
	opacity: 0.92;
}

body.mood-mono[data-page='home'] .card {
	filter: contrast(1.02);
}

/* Fondo radial reactivo al mood */
body[class*='mood-']::before {
	background:
		radial-gradient(ellipse 100% 70% at 15% 10%, var(--mood-bg-1) 0%, transparent 60%),
		radial-gradient(ellipse 80% 90% at 85% 90%, var(--mood-bg-2) 0%, transparent 60%),
		radial-gradient(ellipse 70% 60% at 50% 50%, var(--mood-bg-3) 0%, transparent 65%),
		linear-gradient(175deg, #0a0d12 0%, #0e1419 30%, #05070b 100%);
}

/* ───── POLISH FOR NEW HOMEPAGE HERO + SECTIONS BELOW ───── */

/* Breathing room below hero (home) */
.availability,
.home-ctas,
.links {
	max-width: 620px;
	margin-left: auto;
	margin-right: auto;
}

.availability {
	margin-top: 16px;
	margin-bottom: 24px;
	padding: 20px 24px;
	background: rgba(15, 23, 42, 0.5);
	border: 1px solid rgba(148, 163, 184, 0.15);
	border-radius: 14px;
	backdrop-filter: blur(14px);
	box-shadow: 0 8px 32px rgba(0, 0, 0, 0.25);
}

.home-ctas {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin-bottom: 28px;
}

/* Make CTAs feel more premium on homepage */
.pf-cta,
.visual-feature-link {
	background: rgba(15, 23, 42, 0.45);
	border: 1px solid rgba(148, 163, 184, 0.15);
	backdrop-filter: blur(10px);
}

.links {
	margin-bottom: 20px;
}

/* ───── SOCIAL CARDS (Homepage — canonical source) ───── */
.social-section {
	max-width: 100%;
	margin-left: auto;
	margin-right: auto;
}

.contact-section {
	max-width: 640px;
	margin-left: auto;
	margin-right: auto;
	padding: 0 clamp(12px, 4vw, 20px);
}

.social-section {
	max-width: min(100%, 920px);
	margin-left: auto;
	margin-right: auto;
	padding: 0 clamp(16px, 4vw, 28px);
}

@media (min-width: 1024px) {
	body[data-page='home'] .home-below-hero .social-section {
		max-width: 100%;
		padding-inline: clamp(12px, 2vw, 20px);
	}
}

.contact-section {
	margin-top: 0;
	margin-bottom: clamp(10px, 2vw, 16px);
}

body[data-page='home'] .home-below-hero {
	margin-top: var(--design-social-top, var(--sync-social-gap, clamp(10px, 1.8vw, 18px)));
	padding-top: 0;
}

body[data-page='home'] .hero-unified-panel .home-below-hero,
body[data-page='home'] .hero-unified-panel .home-unified-content {
	margin-top: 0;
	padding-top: 0;
}

body[data-page='home'] .home-below-hero .social-section {
	max-width: 100%;
	padding-inline: 0;
	content-visibility: auto;
	contain-intrinsic-size: auto 720px;
}

body[data-page='home'] .contact-section--closing {
	max-width: min(100%, 760px);
	margin-top: clamp(28px, 4.5vw, 48px);
	margin-bottom: clamp(20px, 3.5vw, 36px);
	padding: clamp(28px, 4vw, 44px) clamp(16px, 3vw, 28px);
	border-radius: 24px;
	border: 1px solid rgba(148, 158, 176, 0.14);
	background: linear-gradient(155deg, rgba(148, 158, 176, 0.06) 0%, transparent 52%), rgba(10, 14, 20, 0.42);
	box-shadow:
		0 18px 48px -16px rgba(0, 0, 0, 0.55),
		inset 0 1px 0 rgba(255, 255, 255, 0.06);
	backdrop-filter: blur(14px);
}

body[data-page='home'] .hero-unified-panel .contact-section--closing {
	max-width: 100%;
	margin-top: 0;
	margin-bottom: 0;
	padding: clamp(22px, 3.5vw, 36px) 0 clamp(8px, 1.2vw, 12px);
	border: none;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	backdrop-filter: none;
}

body[data-page='home'] .home-cta-actions--closing {
	width: 100%;
	max-width: min(100%, 420px);
	margin-inline: auto;
	gap: clamp(14px, 2.4vw, 20px);
}

body[data-page='home'] .home-cta-actions--closing .home-cta-portfolio-actions {
	display: flex;
	justify-content: center;
	width: 100%;
}

body[data-page='home'] .home-cta-actions--closing .home-hero-btn--ghost {
	min-width: min(100%, 12rem);
}

body[data-page='home'] .contact-block {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100%;
	gap: clamp(10px, 2vw, 16px);
}

body[data-page='home'] .contact-section .section-block-head {
	margin-bottom: clamp(4px, 1vw, 8px);
}

body[data-page='home'] .contact-section .section-lead {
	margin-bottom: 0;
}

@media (min-width: 900px) {
	body[data-page='home'] .home-below-hero .social-section {
		margin-top: 0;
	}
}

body[data-page='home'] .contact-block {
	perspective: 1200px;
	perspective-origin: 50% 62%;
}

body[data-page='home'] .home-cta-actions .home-contact-btn {
	max-width: 100%;
	width: 100%;
}

body[data-page='home'] .home-contact-btn {
	border-radius: 12px;
	max-width: min(100%, 300px);
	margin-inline: auto;
	padding: clamp(9px, 1.8vw, 11px) clamp(12px, 2.4vw, 16px);
	border-color: rgba(0, 212, 255, 0.28);
	background: linear-gradient(168deg, rgba(18, 28, 36, 0.86) 0%, rgba(10, 14, 20, 0.68) 100%);
	box-shadow:
		0 0 0 1px rgba(0, 212, 255, 0.08) inset,
		0 12px 32px -14px rgba(0, 0, 0, 0.58),
		0 0 24px -6px rgba(0, 212, 255, 0.16);
	transform: none;
	filter: none;
}

body[data-page='home'] .home-contact-btn-glow {
	position: absolute;
	inset: -1px;
	border-radius: inherit;
	background: radial-gradient(ellipse 70% 80% at 50% 100%, rgba(0, 212, 255, 0.14), transparent 68%);
	opacity: 0.7;
	pointer-events: none;
	transition: opacity 0.25s ease;
}

body[data-page='home'] .home-contact-btn:hover .home-contact-btn-glow,
body[data-page='home'] .home-contact-btn:focus-visible .home-contact-btn-glow {
	opacity: 1;
}

body[data-page='home'] .home-contact-btn:hover,
body[data-page='home'] .home-contact-btn:focus-visible {
	border-color: rgba(0, 212, 255, 0.48);
	background: linear-gradient(168deg, rgba(22, 34, 44, 0.92) 0%, rgba(12, 18, 26, 0.76) 100%);
	box-shadow:
		0 0 0 1px rgba(0, 212, 255, 0.14) inset,
		0 18px 40px -12px rgba(0, 0, 0, 0.58),
		0 0 32px -2px rgba(0, 212, 255, 0.28);
	color: #f4f4f8;
	transform: translateY(-2px);
}

body[data-page='home'] .home-contact-btn-icon,
body[data-page='home'] .home-contact-btn-email {
	position: relative;
	z-index: 1;
}

body[data-page='home'] .home-contact-btn-icon {
	color: #9ad8f2;
	filter: drop-shadow(0 0 8px rgba(0, 212, 255, 0.32));
}

body[data-page='home'] .home-contact-btn-email {
	font-size: clamp(0.88rem, 2.4vw, 1.08rem);
	letter-spacing: 0.03em;
}

@media (max-width: 899px) {
	body[data-page='home'] .contact-section .section-block-head {
		padding-top: clamp(6px, 2vw, 12px);
	}
}

.social-section {
	margin-top: clamp(6px, 1.5vw, 12px);
	margin-bottom: 28px;
}

.section-block-head {
	text-align: center;
	margin-bottom: clamp(12px, 2.5vw, 18px);
}

.section-block-head .section-bridge {
	height: 1px;
	width: 48px;
	margin: 0 auto 12px;
	background: linear-gradient(to right, transparent, rgba(148, 163, 184, 0.28), transparent);
}

.section-eyebrow {
	margin: 0 0 8px;
	font-family: 'Space Grotesk', system-ui, sans-serif;
	font-size: 0.62rem;
	font-weight: 500;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: #64748b;
}

.section-heading {
	margin: 0 0 10px;
	font-family: 'Outfit', system-ui, sans-serif;
	font-size: var(--sync-section-heading, clamp(1.2rem, 3.6vw, 1.55rem));
	font-weight: 700;
	letter-spacing: -0.02em;
	line-height: 1.15;
	background: linear-gradient(180deg, #f1f5f9 0%, #94a3b8 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

.section-lead {
	margin: 0 auto;
	max-width: 44ch;
	font-size: var(--sync-section-lead, clamp(0.84rem, 2.1vw, 0.94rem));
	line-height: 1.55;
	color: #a8b9cc;
	letter-spacing: 0.015em;
}

.section-lead strong {
	color: #c8d4e8;
	font-weight: 600;
}

/* Variante sutil: subtítulo breve y ligero (sección Redes, sin título) */
.section-lead--subtle {
	font-size: clamp(0.78rem, 1.7vw, 0.88rem);
	color: #8295ab;
	letter-spacing: 0.04em;
	opacity: 0.92;
}

.home-cta-actions {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 10px;
	width: 100%;
	max-width: min(100%, 520px);
	margin: 0 auto;
}

.contact-section .home-cta-actions {
	max-width: 420px;
}

.home-portfolio-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 7px;
	width: 100%;
	padding: clamp(9px, 2.2vw, 11px) clamp(12px, 2.4vw, 16px);
	border-radius: 12px;
	text-decoration: none;
	font-family: 'Albert Sans', system-ui, sans-serif;
	font-size: clamp(0.78rem, 2.2vw, 0.92rem);
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: rgba(184, 188, 196, 0.92);
	border: 1px solid rgba(255, 255, 255, 0.14);
	background: rgba(255, 255, 255, 0.03);
	transition:
		transform 0.25s cubic-bezier(0.23, 1, 0.32, 1),
		border-color 0.2s ease,
		background 0.2s ease,
		color 0.2s ease;
}

.home-portfolio-btn svg {
	width: 14px;
	height: 14px;
	flex-shrink: 0;
	opacity: 0.85;
}

.home-portfolio-btn:hover,
.home-portfolio-btn:focus-visible {
	color: #f0f0f4;
	border-color: rgba(255, 255, 255, 0.28);
	background: rgba(255, 255, 255, 0.08);
	transform: translateY(-2px);
}

body.mood-mono[data-page='home'] .home-portfolio-btn {
	color: rgba(192, 196, 204, 0.9);
	border-color: rgba(255, 255, 255, 0.16);
}

body.mood-mono[data-page='home'] .home-portfolio-btn:hover,
body.mood-mono[data-page='home'] .home-portfolio-btn:focus-visible {
	color: #f4f4f8;
	border-color: rgba(255, 255, 255, 0.32);
	background: rgba(255, 255, 255, 0.09);
}

@media (prefers-reduced-motion: reduce) {
	.home-portfolio-btn:hover,
	.home-portfolio-btn:focus-visible {
		transform: none;
	}
}

/* Puente visual: fin del hero → proyectos */
body[data-page='home'] .hero-scroll-bridge {
	position: relative;
	z-index: 3;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	min-height: clamp(44px, 7vh, 64px);
	margin: 0;
	padding: clamp(8px, 1.6vh, 14px) 0 clamp(12px, 2.2vh, 20px);
}

/* Indicador de scroll — debajo del hero, antes de proyectos */
body[data-page='home'] .hero-scroll-indicator {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: flex-start;
	width: 36px;
	height: 56px;
	text-decoration: none;
	opacity: 0.9;
	transition:
		opacity 0.35s ease,
		visibility 0.35s ease,
		transform 0.25s ease;
}

body[data-page='home'] .hero-scroll-indicator__line {
	display: block;
	width: 2px;
	height: 44px;
	border-radius: 999px;
	background: linear-gradient(
		to bottom,
		rgba(255, 255, 255, 0.65) 0%,
		rgba(255, 255, 255, 0.22) 48%,
		rgba(255, 255, 255, 0.06) 78%,
		transparent 100%
	);
	box-shadow: 0 0 10px rgba(255, 255, 255, 0.12);
	animation: hero-scroll-indicator-drift 2.6s ease-in-out infinite;
}

body[data-page='home'] .hero-scroll-indicator:hover,
body[data-page='home'] .hero-scroll-indicator:focus-visible {
	opacity: 1;
	transform: translateY(2px);
}

body[data-page='home'] .hero-scroll-indicator:hover .hero-scroll-indicator__line,
body[data-page='home'] .hero-scroll-indicator:focus-visible .hero-scroll-indicator__line {
	background: linear-gradient(
		to bottom,
		rgba(255, 255, 255, 0.78) 0%,
		rgba(255, 255, 255, 0.28) 48%,
		rgba(255, 255, 255, 0.08) 78%,
		transparent 100%
	);
}

body[data-page='home'] .hero-scroll-indicator.is-hidden {
	visibility: hidden;
	opacity: 0;
	pointer-events: none;
}

@keyframes hero-scroll-indicator-drift {
	0% {
		transform: translateY(0);
		opacity: 0.95;
	}
	100% {
		transform: translateY(14px);
		opacity: 0.2;
	}
}

@media (min-width: 1024px) {
	body[data-page='home'] .hero-scroll-bridge {
		min-height: clamp(52px, 6vh, 72px);
		padding: clamp(10px, 1.4vh, 16px) 0 clamp(14px, 2vh, 22px);
	}

	body[data-page='home'] .hero-scroll-indicator {
		width: 40px;
		height: 64px;
	}

	body[data-page='home'] .hero-scroll-indicator__line {
		width: 2px;
		height: 52px;
	}
}

body.mood-mono[data-page='home'] .hero-stage-spotlight {
	background: radial-gradient(ellipse 68% 58% at 42% 46%, rgba(210, 218, 228, 0.045) 0%, rgba(128, 229, 255, 0.018) 42%, transparent 76%);
}

/* Hero: wordmark + iconografía anclada al texto (escala en em) */
body[data-page='home'] .hero-logo-column {
	position: relative;
	isolation: isolate;
	overflow: visible;
}

body[data-page='home'] .hero-wordmark-wrap {
	position: relative;
	display: inline-block;
	width: max-content;
	max-width: 100%;
	overflow: visible;
	vertical-align: top;
	isolation: isolate;
}

body[data-page='home'] .hero-wordmark-wrap::after {
	content: '';
	position: absolute;
	inset: -0.18em -0.42em -0.12em -0.38em;
	z-index: 0;
	pointer-events: none;
	border-radius: 999px;
	background: radial-gradient(ellipse 88% 78% at 46% 52%, rgba(190, 215, 235, 0.07) 0%, rgba(128, 229, 255, 0.025) 44%, transparent 72%);
}

body[data-page='home'] .hero-wordmark-wrap .hero-wordmark {
	position: relative;
	z-index: 2;
	margin: 0;
	width: max-content;
	max-width: none;
}

body[data-page='home'] .hero-wordmark-wrap .hero-float-icons {
	--hero-icon-gap: 0.52em;
	--hero-icon-max: 0.82em;
	position: absolute;
	inset: -0.78em -1.42em -0.68em -1.32em;
	z-index: 1;
	pointer-events: none;
	overflow: visible;
}

body[data-page='home'] .hero-wordmark-wrap {
	margin-bottom: clamp(0.2em, 0.6vw, 0.45em);
}

body[data-page='home'] .hero-logo--stage .hero-line,
body[data-page='home'] .hero-logo--stage .hero-tagline,
body[data-page='home'] .hero-logo--stage .hero-byline {
	position: relative;
	z-index: 2;
}

body[data-page='home'] .hero-logo--stage .home-hero-actions {
	position: relative;
	z-index: 4;
	isolation: isolate;
}

/*
 * Iconos en em → escalan con el wordmark.
 * Posiciones relativas al bbox del título, no a la columna.
 */
body[data-page='home'] .hero-float-icon-shell {
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	background: none;
	border: none;
	box-shadow: none;
	z-index: var(--hero-icon-z, 0);
	opacity: var(--hero-icon-opacity, 0.72);
	transform: rotate(var(--hero-icon-tilt, 0deg)) scale(var(--hero-icon-scale, 1));
	animation: hero-icon-float var(--hero-icon-duration, 6s) ease-in-out infinite;
	animation-delay: var(--hero-icon-delay, 0s);
	will-change: transform;
}

body[data-page='home'] .hero-float-icon-shell::before {
	content: '';
	position: absolute;
	inset: -42%;
	border-radius: 50%;
	background: var(--hero-icon-halo, radial-gradient(circle, rgba(128, 229, 255, 0.14) 0%, transparent 72%));
	z-index: -1;
	pointer-events: none;
}

body[data-page='home'] .hero-float-icon-shell .hero-float-icon {
	position: static;
	display: block;
	width: var(--hero-icon-size, var(--hero-icon-max));
	height: auto;
	object-fit: contain;
	filter: var(--hero-icon-filter, none);
	transform: translateZ(0);
}

body[data-page='home'] .hero-float-icon-shell--pencil {
	top: 16%;
	left: 7%;
	--hero-icon-size: calc(var(--hero-icon-max) * 1.14);
	--hero-icon-z: 1;
	--hero-icon-tilt: -20deg;
	--hero-icon-drift-x: -3px;
	--hero-icon-drift-y: -5px;
	--hero-icon-drift-rotate: 3deg;
	--hero-icon-duration: 6.2s;
	--hero-icon-delay: 0s;
	--hero-icon-scale: 1;
	--hero-icon-opacity: 0.88;
	--hero-icon-halo: radial-gradient(circle, rgba(180, 220, 240, 0.22) 0%, transparent 72%);
	--hero-icon-filter: brightness(1.12) saturate(0.95) drop-shadow(0 3px 8px rgba(0, 0, 0, 0.32))
		drop-shadow(0 0 16px rgba(154, 216, 242, 0.32));
}

body[data-page='home'] .hero-float-icon-shell--type {
	top: -0.36em;
	left: 30%;
	--hero-icon-size: calc(var(--hero-icon-max) * 1.02);
	--hero-icon-z: 1;
	--hero-icon-tilt: -10deg;
	--hero-icon-drift-x: -2px;
	--hero-icon-drift-y: -4px;
	--hero-icon-drift-rotate: 2deg;
	--hero-icon-duration: 6.6s;
	--hero-icon-delay: -1.4s;
	--hero-icon-scale: 1;
	--hero-icon-opacity: 0.84;
	--hero-icon-halo: radial-gradient(circle, rgba(160, 210, 235, 0.2) 0%, transparent 72%);
	--hero-icon-filter: brightness(1.1) saturate(0.96) drop-shadow(0 3px 7px rgba(0, 0, 0, 0.28))
		drop-shadow(0 0 14px rgba(154, 216, 242, 0.26));
}

body[data-page='home'] .hero-float-icon-shell--ps {
	top: -0.18em;
	right: 16%;
	--hero-icon-size: calc(var(--hero-icon-max) * 1.1);
	--hero-icon-z: 1;
	--hero-icon-tilt: 10deg;
	--hero-icon-drift-x: 3px;
	--hero-icon-drift-y: -4px;
	--hero-icon-drift-rotate: -2deg;
	--hero-icon-duration: 7s;
	--hero-icon-delay: -2.8s;
	--hero-icon-scale: 1;
	--hero-icon-opacity: 0.8;
	--hero-icon-halo: radial-gradient(circle, rgba(0, 120, 200, 0.24) 0%, transparent 72%);
	--hero-icon-filter: brightness(1.08) saturate(1.04) drop-shadow(0 3px 8px rgba(0, 0, 0, 0.32))
		drop-shadow(0 0 16px rgba(0, 140, 220, 0.3));
}

body[data-page='home'] .hero-float-icon-shell--ai {
	top: 70%;
	right: 10%;
	--hero-icon-size: calc(var(--hero-icon-max) * 1.06);
	--hero-icon-z: 1;
	--hero-icon-tilt: 6deg;
	--hero-icon-drift-x: 2px;
	--hero-icon-drift-y: -3px;
	--hero-icon-drift-rotate: -2deg;
	--hero-icon-duration: 7.2s;
	--hero-icon-delay: -3.6s;
	--hero-icon-scale: 1;
	--hero-icon-opacity: 0.78;
	--hero-icon-halo: radial-gradient(circle, rgba(255, 140, 60, 0.22) 0%, transparent 72%);
	--hero-icon-filter: brightness(1.1) saturate(1.06) drop-shadow(0 3px 8px rgba(0, 0, 0, 0.3)) drop-shadow(0 0 14px rgba(255, 127, 0, 0.26));
}

body[data-page='home'] .hero-float-icon-shell--swatches {
	top: -12%;
	right: 38%;
	--hero-icon-size: calc(var(--hero-icon-max) * 1);
	--hero-icon-z: 1;
	--hero-icon-tilt: 12deg;
	--hero-icon-drift-x: 2px;
	--hero-icon-drift-y: -3px;
	--hero-icon-drift-rotate: -2deg;
	--hero-icon-duration: 6.8s;
	--hero-icon-delay: -4s;
	--hero-icon-scale: 1;
	--hero-icon-opacity: 0.76;
	--hero-icon-halo: radial-gradient(circle, rgba(180, 210, 230, 0.18) 0%, transparent 72%);
	--hero-icon-filter: brightness(1.08) saturate(0.98) drop-shadow(0 3px 7px rgba(0, 0, 0, 0.28))
		drop-shadow(0 0 12px rgba(160, 200, 220, 0.24));
}

@media (min-width: 1024px) {
	body[data-page='home'] .hero-wordmark-wrap {
		max-width: none;
	}

	body[data-page='home'] .hero-wordmark-wrap .hero-float-icons {
		--hero-icon-gap: 0.58em;
		--hero-icon-max: 0.96em;
		inset: -0.88em -1.62em -0.78em -1.48em;
	}
}

@media (min-width: 1024px) and (max-width: 1180px) {
	body[data-page='home'] .hero-wordmark-wrap .hero-float-icons {
		--hero-icon-max: 0.76em;
		inset: -0.72em -1.28em -0.62em -1.18em;
	}
}

/* Portafolio — wordmark (sin iconos flotantes; home los conserva) */
body[data-page='portafolio'] .hero-wordmark-wrap {
	position: relative;
	display: inline-block;
	width: max-content;
	max-width: 100%;
	overflow: visible;
	vertical-align: top;
	isolation: isolate;
	margin-bottom: clamp(0.15em, 0.5vw, 0.35em);
}

body[data-page='portafolio'] .hero-wordmark-wrap .hero-wordmark {
	position: relative;
	z-index: 2;
	margin: 0;
	width: max-content;
	max-width: none;
}

@media (min-width: 768px) {
	body[data-page='portafolio'] .pf-hero-identity {
		overflow: visible;
		padding-top: 0.38em;
	}

	body[data-page='portafolio'] .hero-wordmark-wrap {
		margin-bottom: clamp(0.4em, 1.1vw, 0.6em);
	}

	body[data-page='portafolio'] .pf-hero-identity .hero-line,
	body[data-page='portafolio'] .pf-hero-identity .hero-subtitle {
		position: relative;
		z-index: 3;
	}
}

@media (max-width: 767px) {
	body[data-page='portafolio'] .hero-wordmark-wrap .hero-wordmark {
		width: auto;
		max-width: 100%;
	}
}

@keyframes hero-icon-float {
	0%,
	100% {
		transform: translate3d(0, 0, 0) rotate(var(--hero-icon-tilt, 0deg)) scale(var(--hero-icon-scale, 1));
	}
	28% {
		transform: translate3d(calc(var(--hero-icon-drift-x, 0px) * 0.55), calc(var(--hero-icon-drift-y, -6px) * 0.45), 0)
			rotate(calc(var(--hero-icon-tilt, 0deg) + var(--hero-icon-drift-rotate, 3deg) * 0.4)) scale(calc(var(--hero-icon-scale, 1) * 1.03));
	}
	52% {
		transform: translate3d(var(--hero-icon-drift-x, 0px), var(--hero-icon-drift-y, -10px), 0)
			rotate(calc(var(--hero-icon-tilt, 0deg) + var(--hero-icon-drift-rotate, 4deg))) scale(var(--hero-icon-scale, 1));
	}
	76% {
		transform: translate3d(calc(var(--hero-icon-drift-x, 0px) * 0.35), calc(var(--hero-icon-drift-y, -6px) * 0.75), 0)
			rotate(calc(var(--hero-icon-tilt, 0deg) + var(--hero-icon-drift-rotate, 3deg) * 0.25)) scale(calc(var(--hero-icon-scale, 1) * 0.98));
	}
}

@media (prefers-reduced-motion: reduce) {
	body[data-page='home'] .hero-float-icon-shell {
		animation: none;
		will-change: auto;
	}
}

@media (max-width: 1023px) {
	body[data-page='home'] .hero-logo-column {
		display: flex;
		flex-direction: column;
		align-items: center;
		width: 100%;
		max-width: min(100%, 420px);
		margin-inline: auto;
	}

	body[data-page='home'] .hero-wordmark-wrap {
		overflow: visible;
		margin-inline: auto;
		font-size: clamp(1.85rem, 7.2vw, 2.75rem);
		line-height: 1.12;
	}

	body[data-page='home'] .hero-wordmark-wrap::after {
		inset: -0.22em -0.48em -0.16em -0.44em;
	}

	body[data-page='home'] .hero-wordmark-wrap .hero-wordmark {
		width: auto;
		max-width: 100%;
	}

	body[data-page='home'] .hero-wordmark-wrap .hero-float-icons {
		--hero-icon-max: 0.68em;
		inset: -0.62em -1.05em -0.52em -0.98em;
		display: block;
	}

	body[data-page='home'] .hero-float-icon-shell {
		--hero-icon-opacity: 0.82;
	}
}

/* Puente Home → Portafolio */
.home-portfolio-bridge {
	width: min(100%, 520px);
	margin: 0 auto clamp(14px, 2.8vw, 22px);
	padding: clamp(12px, 2.4vw, 16px) clamp(14px, 3vw, 20px);
	border-radius: 16px;
	border: 0.5px solid rgba(255, 255, 255, 0.12);
	background: linear-gradient(168deg, rgba(18, 20, 28, 0.88) 0%, rgba(10, 12, 18, 0.78) 100%);
	box-shadow:
		0 0 0 1px rgba(255, 255, 255, 0.04) inset,
		0 16px 36px -24px rgba(0, 0, 0, 0.65);
	text-align: center;
}

.home-portfolio-bridge-lead {
	margin: 0 0 clamp(10px, 2vw, 12px);
	font-family: 'Albert Sans', system-ui, sans-serif;
	font-size: clamp(0.88rem, 2.2vw, 1rem);
	font-weight: 400;
	letter-spacing: 0.02em;
	color: #c4cad4;
}

.home-portfolio-bridge-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 8px 10px;
}

.home-portfolio-bridge-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 40px;
	padding: 9px 16px;
	border-radius: 999px;
	font-family: 'Albert Sans', system-ui, sans-serif;
	font-size: clamp(0.72rem, 1.9vw, 0.82rem);
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-decoration: none;
	color: rgba(196, 202, 212, 0.94);
	border: 1px solid rgba(255, 255, 255, 0.16);
	background: rgba(255, 255, 255, 0.04);
	transition:
		color 0.2s ease,
		background 0.2s ease,
		border-color 0.2s ease,
		transform 0.2s ease;
}

.home-portfolio-bridge-btn--primary {
	color: #f2f6fa;
	border-color: rgba(255, 255, 255, 0.24);
	background: rgba(255, 255, 255, 0.1);
}

.home-portfolio-bridge-btn:hover,
.home-portfolio-bridge-btn:focus-visible {
	color: #ffffff;
	border-color: rgba(255, 255, 255, 0.32);
	background: rgba(255, 255, 255, 0.12);
	transform: translateY(-1px);
}

/* Pills de propósito en redes */
body[data-page='home'] .social-slot[data-label]::before {
	display: none;
}

.social-purpose-pill {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin: 0 0 8px 4px;
	padding: 4px 10px;
	border-radius: 999px;
	font-family: 'Space Grotesk', system-ui, sans-serif;
	font-size: 0.62rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: #e8eef6;
	border: 0.5px solid rgba(255, 255, 255, 0.16);
	background: rgba(255, 255, 255, 0.07);
}

.social-purpose-pill--ig {
	border-color: rgba(225, 48, 108, 0.35);
	background: rgba(225, 48, 108, 0.12);
}

.social-purpose-pill--x {
	border-color: rgba(255, 255, 255, 0.22);
	background: rgba(255, 255, 255, 0.08);
}

.social-purpose-pill--pi {
	border-color: rgba(230, 0, 35, 0.32);
	background: rgba(230, 0, 35, 0.1);
}

.social-purpose-pill--sp {
	border-color: rgba(29, 185, 84, 0.34);
	background: rgba(29, 185, 84, 0.1);
}

/* Zona de lectura: halo local en bloque inferior */
body[data-page='home'] .home-reading-zone {
	position: relative;
	z-index: 1;
}

body[data-page='home'] .home-reading-zone::before {
	content: '';
	position: absolute;
	inset: 0;
	z-index: -1;
	border-radius: 0;
	pointer-events: none;
	background: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.08) 6%, transparent 18%);
}

body[data-page='home'] .hero-byline {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.75rem;
	margin: clamp(12px, 1.8vw, 16px) 0 0;
	font-family: 'Albert Sans', system-ui, sans-serif;
}

body[data-page='home'] .hero-byline-services {
	display: block;
	max-width: 38ch;
	margin: 0;
	font-size: clamp(0.72rem, 1.9vw, 0.88rem);
	font-weight: 400;
	letter-spacing: 0.03em;
	line-height: 1.5;
	color: rgba(168, 178, 196, 0.95);
	text-wrap: pretty;
}

body[data-page='home'] .hero-byline-avail {
	display: inline-flex;
	align-items: center;
	gap: 0.42rem;
	margin: 0;
	padding: 0.28rem 0.72rem 0.28rem 0.52rem;
	border: 1px solid rgba(62, 200, 122, 0.22);
	border-radius: 999px;
	background: rgba(62, 200, 122, 0.06);
	font-size: clamp(0.68rem, 1.6vw, 0.78rem);
	font-weight: 400;
	letter-spacing: 0.04em;
	line-height: 1.3;
	color: rgba(126, 188, 154, 0.95);
}

/* ── Home: proyectos destacados (3D glass, mood-mono) ── */
/* Composición portafolio: dos capas superpuestas */
body[data-page='home'] .home-featured-stack {
	position: relative;
	width: min(100%, 960px);
	min-height: clamp(380px, 62vw, 580px);
	margin-top: clamp(1.25rem, 3vw, 2rem);
	margin-bottom: clamp(18px, 3vw, 28px);
	margin-inline: auto;
}

body[data-page='home'] .home-featured-stack__item {
	position: absolute;
	display: block;
	text-decoration: none;
	filter: drop-shadow(0 20px 36px rgba(0, 0, 0, 0.48));
	transition: transform 0.35s cubic-bezier(0.23, 1, 0.32, 1);
}

body[data-page='home'] .home-featured-stack__item img {
	display: block;
	width: auto;
	height: auto;
	max-width: 100%;
}

/* Capa trasera: index.png — arriba izquierda, inclinada a la izq */
body[data-page='home'] .home-featured-stack__item--back {
	top: 0;
	left: clamp(0%, 4vw, 8%);
	z-index: 1;
	width: clamp(280px, 54vw, 480px);
	transform: perspective(1000px) rotateY(-14deg) rotateZ(-5deg) rotateX(4deg);
}

body[data-page='home'] .home-featured-stack__item--back img {
	width: 100%;
}

/* Capa delantera: laptop — abajo derecha, inclinada a la der */
body[data-page='home'] .home-featured-stack__item--front {
	bottom: 0;
	right: clamp(0%, 2vw, 6%);
	z-index: 2;
	width: clamp(260px, 52vw, 440px);
	transform: perspective(1000px) rotateY(12deg) rotateZ(4deg) rotateX(3deg);
}

body[data-page='home'] .home-featured-stack__item--front img {
	width: 100%;
}

/* Hover sutil */
body[data-page='home'] .home-featured-stack__item:hover,
body[data-page='home'] .home-featured-stack__item:focus-visible {
	transform: perspective(1000px) rotateY(0deg) rotateZ(0deg) rotateX(0deg) translateY(-4px);
	outline: none;
}

/* Móvil: menos superposición, más legible */
@media (max-width: 719px) {
	body[data-page='home'] .home-featured-stack {
		min-height: clamp(420px, 110vw, 520px);
	}

	body[data-page='home'] .home-featured-stack__item--back {
		top: 0;
		left: 0;
		width: min(82vw, 340px);
		transform: perspective(900px) rotateY(-8deg) rotateZ(-3deg);
	}

	body[data-page='home'] .home-featured-stack__item--front {
		bottom: 0;
		right: 0;
		width: min(78vw, 320px);
		transform: perspective(900px) rotateY(8deg) rotateZ(3deg);
	}
}

@media (min-width: 1024px) {
	body[data-page='home'] .hero-unified-panel .home-featured {
		margin-top: clamp(12px, 2vh, 22px);
	}
}

body[data-page='home'] .home-featured-head {
	margin-bottom: 0;
}

body[data-page='home'] .home-featured-all {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-inline: auto;
	min-height: 44px;
	padding: 0.65rem 1.4rem;
	border-radius: 999px;
	border: 1px solid rgba(168, 176, 192, 0.34);
	background: rgba(148, 156, 172, 0.06);
	color: rgba(216, 222, 232, 0.94);
	font-family: var(--font-label);
	font-size: 0.76rem;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	text-decoration: none;
	transition:
		transform 0.22s ease,
		border-color 0.2s ease,
		background 0.2s ease;
}

body[data-page='home'] .home-featured-all:hover,
body[data-page='home'] .home-featured-all:focus-visible {
	transform: translateY(-2px);
	border-color: rgba(192, 200, 214, 0.5);
	background: rgba(168, 176, 192, 0.12);
}

@media (prefers-reduced-motion: reduce) {
	body[data-page='home'] .home-featured-all:hover,
	body[data-page='home'] .home-featured-all:focus-visible {
		transform: none;
	}
}

body[data-page='home'] .hero-byline-avail .av-pulse {
	background: #3ec87a;
	box-shadow: 0 0 8px rgba(62, 200, 122, 0.55);
}

body[data-page='home'] .home-cta-actions--dual,
body[data-page='home'] .home-cta-actions--unified {
	max-width: 100%;
	width: 100%;
	gap: 12px;
	margin-inline: auto;
}

body[data-page='home'] .home-cta-portfolio {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	width: 100%;
	padding: 12px 0 4px;
	margin: 2px 0 0;
	background: transparent;
	border-top: 1px solid rgba(255, 255, 255, 0.1);
}

/* Panel unificado — contacto plano, ancho completo, ritmo visual */
body[data-page='home'] .hero-unified-panel .contact-block {
	perspective: none;
	gap: clamp(8px, 1.5vw, 12px);
}

body[data-page='home'] .hero-unified-panel .contact-block-head {
	position: relative;
	width: 100%;
	margin-bottom: clamp(10px, 1.6vw, 16px);
	padding-left: clamp(12px, 1.8vw, 16px);
	border-left: 2px solid rgba(0, 212, 255, 0.42);
	text-align: left;
}

body[data-page='home'] .contact-section-kicker {
	margin: 0 0 0.45rem;
	font-family: 'Space Grotesk', system-ui, sans-serif;
	font-size: clamp(0.58rem, 1.4vw, 0.68rem);
	font-weight: 500;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: rgba(154, 216, 242, 0.78);
}

body[data-page='home'] .hero-unified-panel .contact-section-heading {
	font-family: 'Outfit', system-ui, sans-serif;
	font-size: clamp(1.28rem, 3.4vw, 1.9rem);
	font-weight: 700;
	letter-spacing: -0.03em;
	line-height: 1.08;
	margin: 0 0 0.5rem;
}

body[data-page='home'] .hero-unified-panel .contact-section-lead {
	font-family: 'Albert Sans', system-ui, sans-serif;
	font-size: clamp(0.88rem, 2.15vw, 1.02rem);
	font-weight: 300;
	line-height: 1.55;
	letter-spacing: 0.01em;
	color: rgba(196, 206, 220, 0.94);
	max-width: 36ch;
	margin: 0;
	text-wrap: pretty;
}

body[data-page='home'] .hero-unified-panel .home-contact-btn {
	max-width: 100%;
	transform: none;
	filter: none;
	transform-style: flat;
	box-shadow:
		0 0 0 1px rgba(255, 255, 255, 0.08) inset,
		0 8px 24px -10px rgba(0, 0, 0, 0.5);
}

body[data-page='home'] .hero-unified-panel .home-contact-btn:hover,
body[data-page='home'] .hero-unified-panel .home-contact-btn:focus-visible {
	transform: translateY(-2px);
	filter: none;
}

body[data-page='home'] .hero-unified-panel .home-cta-chip {
	min-height: 36px;
}

body[data-page='home'] .hero-unified-panel .home-cta-portfolio-actions {
	padding-bottom: 0;
	margin-bottom: 0;
}

@media (min-width: 1024px) {
	body[data-page='home'] .hero-unified-panel .contact-section-heading {
		font-size: clamp(1.55rem, 2.5vw, 2rem);
	}

	body[data-page='home'] .hero-unified-panel .contact-section-lead {
		max-width: 34ch;
		font-size: clamp(0.92rem, 1.5vw, 1.05rem);
	}

	body[data-page='home'] .hero-unified-panel .home-cta-portfolio {
		align-items: flex-start;
		width: 100%;
	}

	body[data-page='home'] .hero-unified-panel .home-cta-portfolio-actions {
		justify-content: flex-start;
		width: 100%;
	}
}

body[data-page='home'] .home-cta-portfolio-lead {
	margin: 0;
	font-family: 'Albert Sans', system-ui, sans-serif;
	font-size: clamp(0.78rem, 1.8vw, 0.86rem);
	font-weight: 400;
	letter-spacing: 0.02em;
	color: #a8b4c4;
	text-align: center;
}

body[data-page='home'] .home-cta-portfolio-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
}

body[data-page='home'] .home-cta-chip {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 36px;
	flex: 1 1 calc(50% - 4px);
	max-width: calc(50% - 4px);
	padding: 8px 12px;
	border-radius: 10px;
	font-family: 'Albert Sans', system-ui, sans-serif;
	font-size: clamp(0.68rem, 1.7vw, 0.76rem);
	font-weight: 600;
	letter-spacing: 0.07em;
	text-transform: uppercase;
	text-decoration: none;
	color: rgba(196, 202, 212, 0.94);
	border: 1px solid rgba(255, 255, 255, 0.14);
	background: rgba(255, 255, 255, 0.04);
	transition:
		color 0.2s ease,
		background 0.2s ease,
		border-color 0.2s ease;
}

body[data-page='home'] .home-cta-chip--primary {
	color: #f2f6fa;
	border-color: rgba(0, 212, 255, 0.42);
	background: rgba(0, 212, 255, 0.06);
}

body[data-page='home'] .home-cta-chip:hover,
body[data-page='home'] .home-cta-chip:focus-visible {
	color: #ffffff;
	border-color: rgba(0, 212, 255, 0.38);
	background: rgba(0, 212, 255, 0.08);
}

body[data-page='home'] .home-cta-chip--primary:hover,
body[data-page='home'] .home-cta-chip--primary:focus-visible {
	border-color: rgba(0, 212, 255, 0.58);
	background: rgba(0, 212, 255, 0.12);
}

body[data-page='home'] .home-contact-btn-text {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 2px;
	min-width: 0;
}

body[data-page='home'] .home-contact-btn-note {
	font-size: clamp(0.68rem, 1.7vw, 0.76rem);
	font-weight: 400;
	letter-spacing: 0.03em;
	text-transform: none;
	color: rgba(176, 186, 200, 0.88);
}

body[data-page='home'] .home-footer {
	flex-direction: column;
	align-items: center;
	gap: 10px;
	margin-top: clamp(16px, 3vw, 24px);
	padding-top: clamp(12px, 2.4vw, 18px);
	border-top: 1px solid rgba(0, 212, 255, 0.12);
}

body[data-page='home'] .home-footer .foot-mark {
	letter-spacing: 0.12em;
	font-size: clamp(10px, 2.3vw, 12.5px);
	font-weight: 500;
	color: rgba(190, 198, 210, 0.92);
	text-align: center;
	line-height: 1.5;
	max-width: 100%;
}

.home-footer-nav {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 8px 14px;
}

.home-footer-nav a {
	font-family: 'Albert Sans', system-ui, sans-serif;
	font-size: clamp(0.68rem, 1.8vw, 0.78rem);
	font-weight: 500;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	text-decoration: none;
	color: rgba(148, 163, 184, 0.9);
	transition: color 0.2s ease;
}

.home-footer-nav a:hover,
.home-footer-nav a:focus-visible {
	color: #b8ecff;
}

/* Legibilidad: títulos sólidos, leads y stats más claros */
body[data-page='home'] .contact-section .section-heading,
body[data-page='home'] .social-section-title {
	background: none;
	-webkit-background-clip: border-box;
	background-clip: border-box;
	-webkit-text-fill-color: #f0f4f8;
	color: #f0f4f8;
	text-shadow: 0 1px 0 rgba(0, 0, 0, 0.35);
}

body.mood-mono[data-page='home'] .contact-section .section-heading {
	background: none;
	-webkit-text-fill-color: #f2f2f6;
	color: #f2f2f6;
	filter: none;
}

body[data-page='home'] .section-lead,
body[data-page='home'] .social-section-lead {
	color: #c8d0dc;
	font-size: clamp(0.94rem, 2.4vw, 1.08rem);
	line-height: 1.55;
}

body[data-page='home'] .hero-unified-panel .hero-tagline {
	font-size: clamp(0.58rem, 1.55vw, 0.74rem);
	letter-spacing: 0.12em;
	color: #c4ccd8;
	line-height: 1.45;
}

body[data-page='home'] .social-role,
.social-purpose-pill {
	display: none !important;
}

/* Home: bio pegada a stats — sin min-height reservado */
body[data-page='home'] .social-bio {
	color: #d0d8e4;
	min-height: 0;
	margin-top: 6px;
	margin-bottom: 0;
	line-height: 1.35;
}

body[data-page='home'] .social-stats {
	color: #8a9aae;
	font-size: 12px;
	margin-top: 8px;
}

body[data-page='home'] .social-stats strong {
	color: #ffffff;
	font-weight: 700;
}

body[data-page='home'] .hero-pair,
body[data-page='home'] .hero-stage-spotlight {
	position: relative;
	z-index: 1;
}

/* Reveal escalonado en redes */
body[data-page='home'] .social-slot.reveal:nth-child(2) {
	transition-delay: 0.08s;
}
body[data-page='home'] .social-slot.reveal:nth-child(3) {
	transition-delay: 0.16s;
}
body[data-page='home'] .social-slot.reveal:nth-child(4) {
	transition-delay: 0.24s;
}

@media (prefers-reduced-motion: reduce) {
	body[data-page='home'] .hero-scroll-indicator__line {
		animation: none;
		opacity: 0.55;
	}

	body[data-page='home'] .hero-float-icon-shell {
		animation: none;
	}

	body[data-page='home'] .social-slot.reveal {
		transition-delay: 0s;
	}
	body[data-page='home'] .social-slot:hover .social-card,
	body[data-page='home'] .social-slot:focus-within .social-card {
		transform: none;
	}
}

/* Escritorio: contacto compacto; redes más anchas para visibilidad */
@media (min-width: 900px) {
	.contact-section {
		max-width: 680px;
	}

	.social-section {
		max-width: min(100%, 1040px);
		margin-bottom: 36px;
	}

	body[data-page='home'] .social-grid {
		gap: clamp(52px, 6.5vw, 80px) clamp(56px, 7.5vw, 96px);
		padding: clamp(4px, 1vw, 8px) clamp(24px, 3.5vw, 44px) 28px;
	}

	body[data-page='home'] .social-section-head {
		margin-bottom: clamp(32px, 5.5vw, 52px);
	}
}

.home-contact-btn {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	width: 100%;
	padding: clamp(12px, 3vw, 16px) clamp(16px, 3vw, 22px);
	border-radius: 12px;
	text-decoration: none;
	background: linear-gradient(180deg, rgba(123, 163, 184, 0.24) 0%, rgba(71, 100, 128, 0.16) 100%);
	border: 1px solid rgba(148, 163, 184, 0.32);
	color: #e8f0f8;
	box-shadow: 0 6px 20px -10px rgba(0, 0, 0, 0.5);
	transition:
		transform 0.25s cubic-bezier(0.23, 1, 0.32, 1),
		border-color 0.2s ease,
		box-shadow 0.25s ease,
		background 0.2s ease;
}

.home-contact-btn-icon {
	width: clamp(22px, 5vw, 26px);
	height: clamp(22px, 5vw, 26px);
	flex-shrink: 0;
	opacity: 0.9;
}

.home-contact-btn-email {
	font-family: 'Space Grotesk', system-ui, sans-serif;
	font-size: clamp(0.82rem, 2.6vw, 1.05rem);
	font-weight: 600;
	letter-spacing: 0.02em;
	line-height: 1.2;
	word-break: break-word;
}

.home-contact-btn:hover,
.home-contact-btn:focus-visible {
	transform: translateY(-3px);
	border-color: rgba(186, 210, 228, 0.55);
	background: linear-gradient(180deg, rgba(148, 163, 184, 0.32) 0%, rgba(91, 120, 150, 0.2) 100%);
	box-shadow:
		0 14px 32px -10px rgba(0, 0, 0, 0.5),
		0 0 32px -4px rgba(123, 163, 184, 0.35);
	color: #fff;
}

@media (prefers-reduced-motion: reduce) {
	.home-contact-btn:hover,
	.home-contact-btn:focus-visible {
		transform: none;
	}
}

.social-header .section-title {
	font-family: 'Space Grotesk', system-ui, sans-serif;
	font-size: 0.72rem;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: #64748b;
	font-weight: 500;
}

.social-header .section-sub {
	margin: 8px auto 0;
	max-width: 40ch;
	font-size: 0.82rem;
	line-height: 1.45;
	color: #64748b;
	letter-spacing: 0.02em;
}

.social-header .section-sub strong {
	color: #94a3b8;
	font-weight: 600;
}

.social-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: clamp(28px, 5vw, 40px) clamp(24px, 4.5vw, 36px);
	margin: 0 auto;
	padding: clamp(8px, 2vw, 16px) clamp(10px, 3vw, 20px) clamp(12px, 2.5vw, 20px);
	isolation: isolate;
}

@media (min-width: 900px) {
	.social-grid {
		gap: clamp(48px, 6vw, 72px) clamp(52px, 7vw, 88px);
		padding: 16px clamp(20px, 3vw, 36px) 24px;
	}
}

.social-slot {
	position: relative;
	width: 100%;
	animation: social-float 7s ease-in-out infinite;
}

.social-slot:nth-child(1) {
	animation-delay: 0s;
}
.social-slot:nth-child(2) {
	animation-delay: -1.6s;
}
.social-slot:nth-child(3) {
	animation-delay: -3.2s;
}
.social-slot:nth-child(4) {
	animation-delay: -4.8s;
}

.social-slot[data-label]::before {
	content: attr(data-label);
	display: block;
	margin: 0 0 8px 6px;
	font-family: 'Space Grotesk', system-ui, sans-serif;
	font-size: 0.62rem;
	font-weight: 500;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: #64748b;
}

body[data-page='home'] .social-slot[data-label]::before {
	color: rgba(180, 188, 198, 0.82);
	letter-spacing: 0.18em;
	text-shadow: none;
}

body.mood-mono[data-page='home'] .social-slot[data-label]::before {
	color: rgba(196, 200, 210, 0.88);
	text-shadow: 0 0 10px rgba(255, 255, 255, 0.06);
}

/* Home: cluster 3D + flotación (keyframes combinan tilt y translateY) */
body[data-page='home'] .social-slot {
	animation: none;
}

body[data-page='home'] .social-grid {
	isolation: isolate;
	perspective: none;
	transform-style: flat;
}

body[data-page='home'] .social-slot {
	isolation: isolate;
}

body[data-page='home'] .social-card {
	background: #090c14;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
	transform: translateZ(0);
	transform-style: flat;
	backface-visibility: visible;
	filter: none;
}

body[data-page='home'] .social-slot:nth-child(1) .social-card {
	animation: social-float 7s ease-in-out infinite;
	animation-delay: 0s;
}

body[data-page='home'] .social-slot:nth-child(2) .social-card {
	animation: social-float 7s ease-in-out infinite;
	animation-delay: -1.6s;
}

body[data-page='home'] .social-slot:nth-child(3) .social-card {
	animation: social-float 7s ease-in-out infinite;
	animation-delay: -3.2s;
}

body[data-page='home'] .social-slot:nth-child(4) .social-card {
	animation: social-float 7s ease-in-out infinite;
	animation-delay: -4.8s;
}

body[data-page='home'] .social-slot:hover .social-card,
body[data-page='home'] .social-slot:focus-within .social-card {
	animation-play-state: paused;
	transform: translateY(-6px);
	border-color: rgba(168, 178, 196, 0.38);
	box-shadow:
		0 24px 52px -14px rgba(0, 0, 0, 0.82),
		0 12px 28px -10px rgba(0, 0, 0, 0.58),
		0 0 28px -10px rgba(148, 158, 176, 0.14);
	transition:
		transform 0.25s ease,
		border-color 0.2s ease,
		box-shadow 0.3s ease;
}

body[data-page='home'] .social-halo {
	z-index: -1;
	filter: none;
	opacity: 0.22;
	left: 2%;
	right: 2%;
	top: 24px;
	bottom: 8px;
	transition: opacity 0.3s ease;
}

body[data-page='home'] .social-slot:hover .social-halo,
body[data-page='home'] .social-slot:focus-within .social-halo {
	opacity: 0.45;
	animation: social-halo-pulse 2.4s ease-in-out infinite;
}

@keyframes social-halo-pulse {
	0%,
	100% {
		opacity: 0.38;
		transform: scale(1);
	}
	50% {
		opacity: 0.48;
		transform: scale(1.03);
	}
}

body[data-page='home'] .social-avatar img {
	image-rendering: auto;
}

@keyframes social-float {
	0%,
	100% {
		transform: translate3d(0, -6px, 0);
	}
	50% {
		transform: translate3d(0, 6px, 0);
	}
}

@keyframes social-float-3d-1 {
	0%,
	100% {
		transform: rotateY(13deg) rotateX(7deg) translateZ(-26px) translateY(-6px);
	}
	50% {
		transform: rotateY(13deg) rotateX(7deg) translateZ(-26px) translateY(6px);
	}
}

@keyframes social-float-3d-2 {
	0%,
	100% {
		transform: rotateY(-14deg) rotateX(6deg) translateZ(22px) translateY(-6px);
	}
	50% {
		transform: rotateY(-14deg) rotateX(6deg) translateZ(22px) translateY(6px);
	}
}

@keyframes social-float-3d-3 {
	0%,
	100% {
		transform: rotateY(12deg) rotateX(-7deg) translateZ(6px) translateY(-6px);
	}
	50% {
		transform: rotateY(12deg) rotateX(-7deg) translateZ(6px) translateY(6px);
	}
}

@keyframes social-float-3d-4 {
	0%,
	100% {
		transform: rotateY(-13deg) rotateX(-6deg) translateZ(-12px) translateY(-6px);
	}
	50% {
		transform: rotateY(-13deg) rotateX(-6deg) translateZ(-12px) translateY(6px);
	}
}

@media (prefers-reduced-motion: reduce) {
	.social-slot,
	body[data-page='home'] .social-slot .social-card {
		animation: none;
	}

	body[data-page='home'] .social-slot:nth-child(1) .social-card,
	body[data-page='home'] .social-slot:nth-child(2) .social-card,
	body[data-page='home'] .social-slot:nth-child(3) .social-card,
	body[data-page='home'] .social-slot:nth-child(4) .social-card {
		transform: none;
	}

	body[data-page='home'] .social-slot:hover .social-card,
	body[data-page='home'] .social-slot:focus-within .social-card {
		transform: none;
	}

	body[data-page='home'] .social-slot:hover .social-halo,
	body[data-page='home'] .social-slot:focus-within .social-halo {
		animation: none;
		opacity: 0.32;
	}
}

.social-halo {
	position: absolute;
	z-index: 0;
	left: -8%;
	right: -8%;
	top: 8px;
	bottom: -32px;
	opacity: 0.58;
	pointer-events: none;
	border-radius: 50%;
	filter: blur(12px);
	transition: opacity 0.3s ease;
}

.social-halo.x {
	background: radial-gradient(60% 60% at 50% 45%, rgba(91, 140, 255, 0.85), rgba(138, 108, 255, 0.45) 55%, transparent 75%);
}
.social-halo.ig {
	background: radial-gradient(60% 60% at 50% 45%, rgba(214, 41, 118, 0.85), rgba(150, 47, 191, 0.45) 55%, transparent 75%);
}
.social-halo.sp {
	background: radial-gradient(60% 60% at 50% 45%, rgba(29, 185, 84, 0.8), rgba(20, 120, 60, 0.4) 55%, transparent 75%);
}
.social-halo.pi {
	background: radial-gradient(60% 60% at 50% 45%, rgba(230, 0, 35, 0.75), rgba(150, 0, 30, 0.4) 55%, transparent 75%);
}

.social-card {
	position: relative;
	z-index: 2;
	width: 100%;
	max-width: min(100%, 340px);
	margin: 0 auto;
	background: rgba(8, 11, 18, 0.96);
	border: 1px solid rgba(148, 163, 184, 0.14);
	border-radius: 24px;
	overflow: hidden;
	box-shadow:
		0 18px 36px -12px rgba(0, 0, 0, 0.62),
		0 8px 20px -8px rgba(0, 0, 0, 0.45),
		inset 0 1px 0 rgba(255, 255, 255, 0.08);
	transition:
		transform 0.32s cubic-bezier(0.23, 1, 0.32, 1),
		box-shadow 0.32s ease,
		border-color 0.2s ease,
		filter 0.32s ease;
}

.social-card-hit {
	position: relative;
	display: block;
	text-decoration: none;
	color: inherit;
	cursor: pointer;
}

/* Tarjetas planas en reposo (portafolio/otras páginas) */
body:not([data-page='home']) .social-slot:nth-child(1) .social-card,
body:not([data-page='home']) .social-slot:nth-child(2) .social-card,
body:not([data-page='home']) .social-slot:nth-child(3) .social-card,
body:not([data-page='home']) .social-slot:nth-child(4) .social-card {
	transform: none;
}

/* Escalonado vertical (columna derecha desfasada) para romper la rejilla */
.social-slot:nth-child(2),
.social-slot:nth-child(4) {
	margin-top: clamp(28px, 5vw, 48px);
}

@media (min-width: 900px) {
	.social-card {
		max-width: min(100%, 420px);
		border-radius: 26px;
	}

	.social-banner {
		height: 124px;
	}

	.social-avatar {
		width: 84px;
		height: 84px;
		top: 82px;
		left: 22px;
		border-radius: 22px;
	}

	.social-body {
		padding: 48px 22px 14px;
	}

	.social-name {
		font-size: 16px;
	}

	.social-handle {
		font-size: 14px;
	}

	.social-bio {
		font-size: 13.5px;
		min-height: 40px;
		line-height: 1.45;
	}

	body[data-page='home'] .social-bio {
		min-height: 0;
	}

	.social-stats {
		font-size: 12px;
		gap: 14px;
	}

	.social-follow {
		font-size: 13px;
		padding: 7px 16px;
	}

	.social-plat {
		width: 24px;
		height: 24px;
	}

	.social-links {
		padding: 14px 22px 18px;
	}

	.social-link {
		font-size: 13px;
	}
}

.social-card:has(.social-card-hit:hover),
.social-card:has(.social-card-hit:focus-visible),
.social-slot:hover .social-card,
.social-slot:focus-within .social-card {
	transform: translateY(-6px);
	box-shadow:
		0 28px 52px -14px rgba(0, 0, 0, 0.68),
		0 12px 28px -10px rgba(0, 0, 0, 0.5),
		inset 0 1px 0 rgba(255, 255, 255, 0.1);
	border-color: rgba(148, 163, 184, 0.3);
	z-index: 5;
}

body[data-page='home'] .social-slot:hover .social-card,
body[data-page='home'] .social-slot:focus-within .social-card {
	transform: translateY(-6px);
	filter: none;
}

.social-slot:hover .social-halo,
.social-slot:focus-within .social-halo {
	opacity: 0.82;
}

.social-card-hit:focus-visible {
	outline: none;
}

.social-card:has(.social-card-hit:focus-visible) {
	box-shadow:
		0 26px 48px -14px rgba(0, 0, 0, 0.58),
		0 0 0 2px rgba(91, 140, 255, 0.45),
		inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

.social-banner {
	height: 108px;
	position: relative;
	overflow: visible;
	background: transparent;
}

/* Arco superior tipo perfil */
.social-banner::before {
	content: '';
	position: absolute;
	left: 50%;
	top: -72%;
	width: 132%;
	height: 168%;
	transform: translateX(-50%);
	border-radius: 50%;
	pointer-events: none;
	opacity: 0.92;
}

.social-banner::after {
	content: '';
	position: absolute;
	left: 50%;
	bottom: -8px;
	width: 88%;
	height: 28px;
	transform: translateX(-50%);
	background: radial-gradient(ellipse 80% 100% at 50% 0%, rgba(0, 0, 0, 0.35) 0%, transparent 72%);
	pointer-events: none;
}

.social-banner.x::before {
	background: radial-gradient(ellipse 100% 100% at 50% 100%, #60a5fa 0%, #4f46e5 38%, #312e81 62%, transparent 74%);
}
.social-banner.ig::before {
	background: radial-gradient(ellipse 100% 100% at 50% 100%, #f472b6 0%, #c026d3 32%, #6d28d9 58%, transparent 74%);
}
.social-banner.sp::before {
	background: radial-gradient(ellipse 100% 100% at 50% 100%, #4ade80 0%, #16a34a 40%, #052e16 62%, transparent 74%);
}
.social-banner.pi::before {
	background: radial-gradient(ellipse 100% 100% at 50% 100%, #f87171 0%, #dc2626 38%, #450a0a 60%, transparent 74%);
}

.social-top {
	position: absolute;
	top: 12px;
	right: 12px;
	display: flex;
	align-items: center;
	gap: 10px;
	z-index: 4;
}

.social-plat {
	width: 20px;
	height: 20px;
	display: grid;
	place-items: center;
	opacity: 0.9;
}

.social-plat svg {
	width: 100%;
	height: 100%;
	display: block;
}

.social-follow {
	font-family: 'Space Grotesk', system-ui, sans-serif;
	font-size: 12px;
	font-weight: 700;
	padding: 6px 14px;
	border-radius: 999px;
	letter-spacing: 0.02em;
	pointer-events: none;
}

.social-follow.x {
	background: #f4f7fb;
	color: #0a0d14;
}
.social-follow.ig {
	background: linear-gradient(45deg, #feda75, #fa7e1e, #d62976, #962fbf);
	color: #fff;
}
.social-follow.sp {
	background: #1db954;
	color: #04130a;
}
.social-follow.pi {
	background: #e60023;
	color: #fff;
}

.social-avatar {
	position: absolute;
	left: 18px;
	top: 72px;
	width: 72px;
	height: 72px;
	border-radius: 20px;
	overflow: hidden;
	border: 3px solid rgba(15, 23, 42, 0.55);
	box-shadow:
		0 12px 28px rgba(0, 0, 0, 0.55),
		0 0 0 1px rgba(255, 255, 255, 0.12);
	background: #1e2937;
	z-index: 3;
}

.social-avatar img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.social-card-hit,
.social-body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.social-body {
	padding: 48px 18px 12px;
	font-family: 'Space Grotesk', system-ui, sans-serif;
	text-shadow: 0 1px 12px rgba(0, 0, 0, 0.65);
	text-align: left;
}

.social-name {
	font-family: 'Outfit', system-ui, sans-serif;
	font-size: 15px;
	font-weight: 700;
	color: #e8f1f8;
	display: flex;
	align-items: center;
	gap: 6px;
	letter-spacing: -0.01em;
}

.social-name .verified {
	width: 16px;
	height: 16px;
	flex-shrink: 0;
}

.social-handle {
	font-size: 12px;
	color: #64748b;
	margin-top: 2px;
	text-align: left;
}

.social-role {
	margin: 6px 0 0;
	font-family: 'Space Grotesk', system-ui, sans-serif;
	font-size: 10px;
	font-weight: 500;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: #7c8ea3;
	text-align: left;
}

.social-slot:nth-child(1) .social-role {
	color: rgba(120, 196, 255, 0.92);
}

.social-slot:nth-child(2) .social-role {
	color: rgba(255, 140, 190, 0.9);
}

.social-slot:nth-child(3) .social-role {
	color: rgba(90, 220, 140, 0.92);
}

.social-slot:nth-child(4) .social-role {
	color: rgba(255, 120, 140, 0.92);
}

body.mood-mono[data-page='home'] .social-role {
	letter-spacing: 0.14em;
	text-shadow: 0 0 10px rgba(255, 255, 255, 0.08);
}

body.mood-mono[data-page='home'] .social-slot:nth-child(1) .social-role {
	color: rgba(168, 210, 255, 0.9);
}

body.mood-mono[data-page='home'] .social-slot:nth-child(2) .social-role {
	color: rgba(255, 170, 210, 0.88);
}

body.mood-mono[data-page='home'] .social-slot:nth-child(3) .social-role {
	color: rgba(130, 230, 170, 0.9);
}

body.mood-mono[data-page='home'] .social-slot:nth-child(4) .social-role {
	color: rgba(255, 150, 165, 0.9);
}

.social-bio {
	font-size: 12.5px;
	line-height: 1.45;
	color: #94a3b8;
	margin-top: 8px;
	min-height: 40px;
	text-align: left;
}

.social-stats {
	display: flex;
	flex-wrap: wrap;
	gap: 12px 14px;
	margin-top: 12px;
	font-size: 11.5px;
	color: #64748b;
}

.social-stats strong {
	color: #e8f1f8;
	font-weight: 700;
}

.social-links {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 14px;
	padding: 0 18px 16px;
	border-top: 1px solid rgba(148, 163, 184, 0.1);
	margin-top: 4px;
	padding-top: 12px;
}

.social-link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 12px;
	font-weight: 600;
	color: #38bdf8;
	text-decoration: none;
	letter-spacing: 0.01em;
	transition: color 0.2s ease;
}

.social-link svg {
	width: 14px;
	height: 14px;
	flex-shrink: 0;
	opacity: 0.9;
}

.social-link:hover,
.social-link:focus-visible {
	color: #7dd3fc;
	text-decoration: underline;
	text-underline-offset: 3px;
}

@media (max-width: 720px) {
	.social-header .section-sub {
		font-size: 0.78rem;
		padding: 0 8px;
	}

	.social-grid {
		grid-template-columns: 1fr 1fr;
		grid-template-rows: auto;
		gap: 22px 18px;
		padding: 4px 6px 8px;
	}

	body:not([data-page='home']) .social-slot:nth-child(1) .social-card,
	body:not([data-page='home']) .social-slot:nth-child(2) .social-card,
	body:not([data-page='home']) .social-slot:nth-child(3) .social-card,
	body:not([data-page='home']) .social-slot:nth-child(4) .social-card {
		transform: none;
	}

	body[data-page='home'] .social-grid {
		perspective: none;
	}

	body[data-page='home'] .social-slot:nth-child(1) .social-card,
	body[data-page='home'] .social-slot:nth-child(2) .social-card,
	body[data-page='home'] .social-slot:nth-child(3) .social-card,
	body[data-page='home'] .social-slot:nth-child(4) .social-card {
		animation: social-float 7s ease-in-out infinite;
		filter: none;
		transform: none;
	}

	body[data-page='home'] .contact-block {
		perspective: none;
	}

	body[data-page='home'] .home-contact-btn {
		transform: none;
		filter: none;
	}

	.social-slot:nth-child(2),
	.social-slot:nth-child(4) {
		margin-top: 0;
	}

	.social-card:has(.social-card-hit:hover),
	.social-card:has(.social-card-hit:focus-visible),
	.social-slot:hover .social-card,
	.social-slot:focus-within .social-card {
		transform: translateY(-4px);
	}

	body[data-page='home'] .social-slot:hover .social-card,
	body[data-page='home'] .social-slot:focus-within .social-card {
		transform: translateY(-4px) scale(1.01);
		filter: none;
	}

	body[data-page='home'] .home-contact-btn:hover,
	body[data-page='home'] .home-contact-btn:focus-visible {
		transform: translateY(-3px);
		filter: none;
	}

	.social-card {
		max-width: 100%;
	}

	.social-banner {
		height: 96px;
	}

	.social-banner::before {
		top: -68%;
		width: 128%;
	}

	.social-avatar {
		width: 56px;
		height: 56px;
		top: 52px;
		left: 14px;
		border-radius: 16px;
		border-width: 3px;
	}

	.social-body {
		padding: 40px 14px 10px;
	}

	.social-name {
		font-size: 13px;
	}

	.social-bio {
		font-size: 11.5px;
		min-height: 32px;
	}

	body[data-page='home'] .social-bio {
		min-height: 0;
	}

	.social-links {
		padding: 10px 14px 14px;
	}

	.social-link {
		font-size: 11px;
	}

	.social-stats {
		font-size: 10px;
		gap: 8px;
	}

	.social-follow {
		font-size: 10px;
		padding: 4px 10px;
	}
}

@media (max-width: 400px) {
	.social-grid {
		grid-template-columns: 1fr;
		max-width: min(100%, 340px);
		gap: 28px;
	}
}

@media (max-width: 720px) {
	.hero-logo {
		margin-bottom: 24px;
	}

	.pf-hero .hero-wordmark {
		font-size: clamp(1.35rem, 7.8vw, 2.4rem);
	}

	.pf-hero .hero-line {
		width: min(72%, 7.5rem);
	}

	.pf-hero .hero-tagline {
		font-size: clamp(0.5rem, 2.6vw, 0.68rem);
		letter-spacing: 0.08em;
	}

	.availability {
		margin-top: 4px;
		margin-bottom: 18px;
		padding: 14px 16px;
	}

	.home-ctas {
		margin-bottom: 16px;
	}

	.contact-section {
		margin-bottom: 28px;
	}
}

/* Portafolio: misma marca visual que home (glass-light .hero-showcase) */
.pf-hero .hero-wordmark {
	font-family: 'Outfit', system-ui, sans-serif;
	font-size: clamp(1.75rem, 5.5vw, 3.35rem);
	font-weight: 700;
	letter-spacing: -0.03em;
	line-height: 1;
	white-space: nowrap;
	margin: 0 0 8px;
	background: linear-gradient(165deg, #f0fbff 0%, #b8ecff 30%, #5ec8f0 58%, #3a8ab8 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: transparent;
	filter: none;
}

.pf-hero .hero-wordmark .reg {
	font-size: 0.68em;
	vertical-align: super;
	margin-left: 2px;
	-webkit-text-fill-color: #7ec8e8;
	color: #7ec8e8;
	filter: none;
}

.pf-hero .hero-line {
	width: min(68%, 9rem);
	height: 1px;
	margin: 12px 0 10px;
	background: linear-gradient(
		90deg,
		transparent 0%,
		rgba(0, 212, 255, 0.35) 18%,
		rgba(200, 245, 255, 0.9) 50%,
		rgba(0, 212, 255, 0.35) 82%,
		transparent 100%
	);
	box-shadow: 0 0 10px rgba(0, 212, 255, 0.35);
	opacity: 1;
}

.pf-hero .hero-tagline {
	margin: 0 0 26px;
	max-width: min(100%, 42ch);
	font-family: 'Space Grotesk', system-ui, sans-serif;
	font-size: clamp(0.52rem, 1.6vw, 0.84rem);
	font-weight: 500;
	letter-spacing: 0.11em;
	line-height: 1.55;
	text-transform: uppercase;
	color: #9ad8f2;
	text-shadow: 0 0 14px rgba(0, 212, 255, 0.28);
}

/* ───── DENSITY ───── */
body.density-compact .card {
	max-width: clamp(300px, 86vw, 420px);
}
body.density-compact .links {
	gap: 5px;
	margin-bottom: 0.9rem;
}
body.density-compact .link {
	padding: 8px 11px;
	min-height: 40px;
}

body.density-compact .portfolio summary {
	padding: 8px 0;
}
body.density-compact .cv-bio {
	padding: 10px 14px;
}
body.density-compact .availability {
	padding: 10px 14px;
}
body.density-compact .metrics {
	padding: 12px 14px;
}
body.density-compact .now-card {
	padding: 12px 14px;
}
body.density-compact .cv-card {
	padding: 9px 12px;
	min-height: 40px;
}

body.density-airy .card {
	max-width: clamp(340px, 96vw, 560px);
}

body[data-page='home'].density-airy .card,
body[data-page='home'].density-compact .card,
body[data-page='home'].density-default .card {
	max-width: min(100%, 1200px);
}
body.density-airy .links {
	gap: 14px;
	margin-bottom: 1.8rem;
}
body.density-airy .link {
	padding: 16px 18px;
	min-height: 56px;
}

body.density-airy .portfolio summary {
	padding: 16px 0;
	letter-spacing: 0.36em;
}
body.density-airy .cv-bio {
	padding: 22px 24px;
	line-height: 1.95;
}
body.density-airy .availability {
	padding: 18px 22px;
}
body.density-airy .metrics {
	padding: 22px 18px;
}
body.density-airy .now-card {
	padding: 20px 22px;
}
body.density-airy .cv-card {
	padding: 16px 18px;
	min-height: 56px;
}
body.density-airy .label,
body.density-airy .cv-card-title {
	letter-spacing: 0.04em;
}

.hero-visual {
	width: 100%;
	margin: 0;
	position: relative;
	background: transparent;
	display: flex;
	justify-content: center;
	align-items: center;
}

.hero-visual__frame {
	position: relative;
	width: 100%;
	max-width: var(--sync-video-stage-max, min(100%, clamp(200px, 76vw, 320px)));
	line-height: 0;
	background: transparent;
	margin-inline: auto;
	overflow: visible;
}

/* Home: borde inferior del hero = base del video (corte del brazo), sin línea horizontal rara */
body[data-page='home'] .hero-visual__frame {
	display: block;
	overflow: visible;
	aspect-ratio: unset;
	min-height: 0;
	max-height: none;
	height: auto;
}

@media (min-width: 1024px) {
	body[data-page='home'] .hero-visual__frame {
		min-height: 0;
	}

	body[data-page='home'] .home-contact-btn-email {
		font-size: clamp(0.82rem, 1.5vw, 0.92rem);
	}

	body[data-page='home'] .home-contact-btn-note {
		font-size: 0.68rem;
	}

	body[data-page='home'] .home-portfolio-btn {
		padding: 9px 14px;
		font-size: 0.72rem;
	}
}

@media (min-width: 900px) {
	body[data-page='home'] .hero-visual {
		justify-content: flex-start;
	}

	body[data-page='home'] .hero-visual__frame {
		margin-inline: 0;
		justify-content: flex-start;
	}
}

body[data-page='home'] .hero-visual__frame img {
	position: relative;
	z-index: 1;
	width: 100%;
	height: auto;
	max-height: min(
		var(--sync-video-height-max, min(40dvh, 40vh, 380px)),
		calc(var(--sync-video-height-cap, 380px) * var(--design-video-height-mul, var(--sync-video-height-mul, 1)))
	);
	display: block;
	object-fit: contain;
	object-position: var(--sync-video-object-x, 52%) var(--sync-video-object-y, 38%);
	-webkit-mask-image: none;
	mask-image: none;
	filter: drop-shadow(0 12px 28px rgba(0, 212, 255, 0.1));
	animation: hero-header-float 7.5s ease-in-out infinite;
	will-change: transform;
}

@keyframes hero-header-float {
	0%,
	100% {
		transform: translate3d(0, -7px, 0);
	}
	50% {
		transform: translate3d(0, 7px, 0);
	}
}

@media (prefers-reduced-motion: reduce) {
	body[data-page='home'] .hero-visual__frame img {
		animation: none;
		will-change: auto;
	}
}

@media (max-width: 1023px) {
	body[data-page='home'] .hero-visual__frame img {
		max-height: min(
			var(--sync-video-height-max, min(38dvh, 38vh, 380px)),
			calc(var(--sync-video-height-cap, 380px) * var(--design-video-height-mul, var(--sync-video-height-mul, 1)))
		);
	}
}

/* Tamaños hero: variables --sync-video-* en glass-light.css (:root por breakpoint) */

/* ───── ATMOSPHERE — driven por --atm (0..1) ───── */
#smoke {
	opacity: var(--atm);
}

/* idle icon glow scales with atmosphere */
body {
	--glow-mul: var(--atm);
}
.link:nth-child(1) .icon svg {
	animation-duration: calc(3s / max(0.4, var(--atm)));
}
.link:nth-child(2) .icon svg {
	animation-duration: calc(3.4s / max(0.4, var(--atm)));
}
.link:nth-child(3) .icon svg {
	animation-duration: calc(2.8s / max(0.4, var(--atm)));
}
.link:nth-child(4) .icon svg {
	animation-duration: calc(3.2s / max(0.4, var(--atm)));
}
.link:nth-child(5) .icon svg {
	animation-duration: calc(3.6s / max(0.4, var(--atm)));
}

/* atmosphere apaga el smoke por completo abajo de 0.05 */
body[data-atm='0'] #smoke {
	display: none;
}

/* Layout home — offsets hero (editar aquí; DevTools → tweaks.css) */
body[data-page='home'] {
	--design-panel-x: 0px;
	--design-panel-y: 0px;
	--design-panel-scale: 1;
	--design-logo-x: 12px;
	--design-logo-y: -24px;
	--design-logo-scale: 1;
	--design-video-x: 42px;
	--design-video-y: -4px;
	--design-video-scale: 1;
}

body[data-page='home'] .hero-unified-panel {
	transform: translate(var(--design-panel-x, 0px), var(--design-panel-y, 0px)) scale(var(--design-panel-scale, 1));
	transform-origin: top center;
}

@media (min-width: 1024px) {
	body[data-page='home'] .hero-unified-panel {
		transform: translate(var(--design-panel-x, 0px), var(--design-panel-y, 0px)) scale(var(--design-panel-scale, 1));
		transform-origin: top center;
	}
}

/* ───── HOME: layout estable (antes inline en index.html) ───── */
body[data-page='home'] {
	align-items: flex-start;
}

@media (min-height: 980px) {
	body[data-page='home'] {
		align-items: flex-start;
		padding-top: max(clamp(0.75rem, 2vh, 1.25rem), var(--safe-t));
	}
}

body[data-page='home'] .card {
	padding-bottom: clamp(24px, 5vh, 56px);
}

body[data-page='home'] .hero-showcase {
	margin-bottom: 0;
	padding-bottom: 0;
}

body[data-page='home'] .home-below-hero .social-section {
	margin-top: 0;
}

body[data-page='home'] .home-contact-btn {
	transition:
		transform 0.28s cubic-bezier(0.23, 1, 0.32, 1),
		box-shadow 0.3s ease,
		border-color 0.3s ease,
		background 0.3s ease,
		color 0.2s ease,
		filter 0.28s ease;
}

/* ───── HOME MÓVIL ESTRECHO (≤768px) — refuerza styles.css mobile block ───── */
@media (max-width: 768px) {
	body[data-page='home'] .hero-logo-column {
		order: 1;
	}

	body[data-page='home'] .hero-unified-panel .hero-visual {
		order: 2;
	}

	body[data-page='home'] .hero-unified-panel .hero-visual__frame img {
		max-width: 300px;
		max-height: min(42dvh, 42vh);
	}

	body[data-page='home'] .home-hero-actions {
		flex-direction: column;
		align-items: center;
		gap: 1rem;
	}

	body[data-page='home'] .home-hero-btn {
		width: 100%;
		max-width: 280px;
		min-height: 48px;
		padding: 14px 20px;
	}

	body[data-page='home'] .social-grid {
		grid-template-columns: 1fr;
		gap: 1.5rem;
	}
}

/* ───── HOME MÓVIL/TABLET (≤1023px) — layout sólido; escritorio intacto (≥1024) ───── */
@media (max-width: 1023px) {
	body[data-page='home'] .hero-unified-body--slim {
		padding-top: clamp(8px, 2.5vw, 14px);
	}

	body[data-page='home'] .hero-unified-body--slim .hero-logo--stage {
		align-items: center;
		text-align: center;
		width: 100%;
		max-width: 100%;
		margin-inline: auto;
	}

	body[data-page='home'] .hero-unified-body--slim .hero-wordmark {
		font-size: clamp(1.85rem, 7.2vw, 2.75rem);
		white-space: normal;
		text-wrap: balance;
	}

	body[data-page='home'] .hero-unified-body--slim .hero-tagline {
		font-size: clamp(0.78rem, 3.2vw, 0.95rem);
		max-width: 34ch;
		margin-inline: auto;
		text-align: center;
	}

	body[data-page='home'] .hero-unified-body--slim .hero-byline {
		align-items: center;
		text-align: center;
		max-width: 36ch;
		margin-inline: auto;
	}

	body[data-page='home'] .hero-unified-body--slim .home-hero-actions {
		justify-content: center;
		width: 100%;
		max-width: min(100%, 300px);
		margin-inline: auto;
	}

	body[data-page='home'] {
		--design-panel-x: 0px;
		--design-panel-y: 0px;
		--design-panel-scale: 1;
		--design-logo-x: 0px;
		--design-logo-y: 0px;
		--design-logo-scale: 1;
		--design-video-x: 0px;
		--design-video-y: 0px;
		--design-video-scale: 1;
		--design-contact-x: 0px;
		--design-contact-y: 0px;
		--design-contact-scale: 1;
		--sync-hero-seam-x: 0px;
	}

	body[data-page='home'] .hero-unified-panel {
		max-width: 100%;
		padding: 0;
		transform: none;
		transform-origin: top center;
	}

	body[data-page='home'] .hero-unified-panel .hero-pair {
		perspective: none;
		gap: clamp(10px, 3vw, 16px);
	}

	body[data-page='home'] .hero-unified-panel .hero-logo--stage,
	body[data-page='home'] .hero-unified-panel .hero-logo--stage:hover {
		transform: none;
		width: 100%;
		max-width: 100%;
		margin-inline: auto;
		margin-bottom: 0;
	}

	body[data-page='home'] .hero-unified-body--slim .hero-visual {
		transform: none;
		margin-top: clamp(1rem, 3.5vw, 1.75rem);
	}

	body[data-page='home'] .hero-unified-panel .hero-visual__frame {
		overflow: visible;
	}

	body.mood-mono .main-nav {
		width: min(100%, calc(100vw - 20px));
		column-gap: 4px;
		padding: 7px 10px;
		min-width: 0;
		grid-template-columns: minmax(4.5rem, 1fr) auto minmax(4.5rem, 1fr);
	}

	body.mood-mono[data-page='home'] .main-nav {
		margin-top: max(8px, env(safe-area-inset-top, 0px));
	}

	body.mood-mono .main-nav .nav-link--inicio,
	body.mood-mono .main-nav .nav-link--portafolio {
		padding: 7px 10px;
		min-height: 34px;
		min-width: 4.5rem;
		font-size: 0.78rem;
		gap: 4px;
	}

	body.mood-mono .main-nav .nav-brand {
		width: 32px;
		height: 32px;
	}

	body.mood-mono .main-nav .nav-brand img,
	body.mood-mono .main-nav .nav-brand svg {
		width: 20px;
		height: 20px;
	}

	body.mood-mono[data-page='home'] .main-nav .nav-cursor-wrap {
		width: 16px;
		height: 16px;
	}

	body.mood-mono[data-page='home'] .main-nav .nav-cursor-hint {
		width: 14px;
		height: 14px;
	}

	body[data-page='home'] .contact-block {
		perspective: none;
	}

	body[data-page='home'] .home-cta-actions {
		max-width: 100%;
	}

	body[data-page='home'] .home-contact-btn,
	body[data-page='home'] .home-portfolio-btn {
		transform: none;
		filter: none;
	}

	body[data-page='home'] .home-contact-btn:hover,
	body[data-page='home'] .home-contact-btn:focus-visible,
	body[data-page='home'] .home-portfolio-btn:hover,
	body[data-page='home'] .home-portfolio-btn:focus-visible {
		transform: translateY(-2px);
		filter: none;
	}

	body[data-page='home'] .contact-section .section-lead,
	body[data-page='home'] .social-section-lead {
		font-size: clamp(0.8rem, 2.5vw, 0.9rem);
		line-height: 1.45;
		padding-inline: 2px;
	}

	body[data-page='home'] .social-grid {
		perspective: none;
		padding-inline: clamp(4px, 2vw, 10px);
	}

	body[data-page='home'] .social-slot:nth-child(1) .social-card,
	body[data-page='home'] .social-slot:nth-child(2) .social-card,
	body[data-page='home'] .social-slot:nth-child(3) .social-card,
	body[data-page='home'] .social-slot:nth-child(4) .social-card {
		animation: social-float 7s ease-in-out infinite;
		transform: none;
		filter: none;
	}

	body[data-page='home'] .social-slot:nth-child(2),
	body[data-page='home'] .social-slot:nth-child(4) {
		margin-top: 0;
	}

	body[data-page='home'] .social-slot:hover .social-card,
	body[data-page='home'] .social-slot:focus-within .social-card {
		transform: none;
		filter: none;
	}

	body[data-page='home'] .social-slot:hover .social-halo,
	body[data-page='home'] .social-slot:focus-within .social-halo {
		animation: none;
		opacity: 0.32;
	}

	body[data-page='home'] .home-below-hero {
		max-width: 100%;
		padding-inline: max(12px, env(safe-area-inset-left, 0px)) max(12px, env(safe-area-inset-right, 0px));
	}

	body.mood-mono[data-page='home'] .cine-grain {
		opacity: calc(0.04 + var(--atm, 0.85) * 0.05);
		animation: none;
	}

	body.mood-mono[data-page='home'] .cine-vignette {
		opacity: calc(0.46 + var(--atm, 0.85) * 0.1);
	}

	body.mood-mono[data-page='home'] #smoke {
		opacity: min(1, calc(0.26 + var(--atm, 0.85) * 0.96));
	}

	body.mood-mono[data-page='portafolio'] #smoke {
		opacity: min(1, calc(0.26 + var(--atm, 0.85) * 0.96));
	}

	body.mood-mono[data-page='home'] #lightning-canvas,
	body.mood-mono[data-page='portafolio'] #lightning-canvas {
		opacity: calc(0.34 + var(--atm, 0.85) * 0.52);
	}
}

@media (max-width: 399px) {
	body[data-page='home'] .hero-unified-body--slim .hero-wordmark {
		font-size: clamp(1.72rem, 8.4vw, 2.35rem);
	}

	body[data-page='home'] .hero-wordmark-wrap {
		font-size: clamp(1.72rem, 8.4vw, 2.35rem);
	}

	body[data-page='home'] .hero-wordmark-wrap .hero-float-icons {
		--hero-icon-max: 0.56em;
		inset: -0.5em -0.82em -0.44em -0.76em;
		font-size: inherit;
	}

	body[data-page='home'] .home-hero-btn {
		max-width: 100%;
	}

	body[data-page='home'] .home-cta-actions--closing {
		max-width: 100%;
		gap: 10px;
	}

	body[data-page='home'] .hero-unified-panel .home-contact-btn {
		min-height: 48px;
		padding: 12px 14px;
		max-width: 100%;
	}

	body[data-page='home'] .hero-unified-panel .home-contact-btn-text {
		align-items: center;
		text-align: center;
	}
}

@media (max-width: 420px) {
	body[data-page='home'] .social-grid {
		grid-template-columns: 1fr;
		max-width: 100%;
		margin-inline: auto;
		gap: 18px;
	}

	body[data-page='home'] .hero-unified-panel .hero-visual__frame img {
		max-width: min(100%, 280px);
	}
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.001ms !important;
	}
}