/* =========================================================
   PROEM Connecting — main.css
   Editorial · full-bleed · mostly white
   ========================================================= */

:root{
	--paper:      #F5F3EE;   /* warm off-white base            */
	--paper-2:    #FFFFFF;   /* pure white cards               */
	--ink:        #10182B;   /* near-black navy (brand)        */
	--ink-70:     #47506A;
	--ink-45:     #8890A3;
	--line:       #E4E0D6;   /* hairlines on paper             */
	--accent:     #2340FF;   /* electric cobalt                */
	--accent-2:   #C9B7A0;   /* warm sand (secondary)          */
	--navy-deep:  #0B1120;   /* dark full-bleed bands          */

	--font-display: "Archivo", "Archivo Black", system-ui, sans-serif;
	--font-body:    "Inter", system-ui, -apple-system, sans-serif;

	--container: 1440px;
	--gutter: clamp(1.25rem, 5vw, 6rem);
	--radius: 18px;

	--ease: cubic-bezier(.16,1,.3,1);
}

/* ---------- reset-ish ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body{
	margin:0;
	background:var(--paper);
	color:var(--ink);
	font-family:var(--font-body);
	font-size:clamp(1rem, .55vw + .9rem, 1.125rem);
	line-height:1.6;
	font-weight:400;
	-webkit-font-smoothing:antialiased;
	text-rendering:optimizeLegibility;
	overflow-x:hidden;
}
img{ display:block; max-width:100%; height:auto; }
a{ color:inherit; text-decoration:none; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3{ margin:0; font-family:var(--font-display); font-weight:800; }
p{ margin:0 0 1em; }
::selection{ background:var(--accent); color:#fff; }

/* ---------- layout primitives ---------- */
.container{
	width:100%;
	max-width:var(--container);
	margin-inline:auto;
	padding-inline:var(--gutter);
}
.section{ position:relative; padding-block:clamp(5rem, 12vh, 11rem); }
.bleed{ position:relative; width:100%; }

/* ---------- type helpers ---------- */
.eyebrow{
	font-family:var(--font-body);
	font-size:.78rem;
	font-weight:600;
	letter-spacing:.2em;
	text-transform:uppercase;
	color:var(--ink-45);
	margin:0 0 1.4rem;
}
.eyebrow--accent{ color:var(--accent); }
.eyebrow--light{ color:rgba(255,255,255,.65); }

.h2{
	font-size:clamp(2.1rem, 5.2vw, 4.6rem);
	line-height:1.02;
	letter-spacing:-.025em;
	max-width:16ch;
}
.h2--big{ font-size:clamp(2.6rem, 8vw, 6.2rem); max-width:14ch; margin-inline:auto; text-align:center; }
.h2--light{ color:#fff; }
.h3{
	font-size:clamp(1.5rem, 2.4vw, 2.15rem);
	line-height:1.08;
	letter-spacing:-.02em;
	margin:0 0 .8rem;
}
.lead{
	font-size:clamp(1.15rem, 1.4vw, 1.5rem);
	line-height:1.5;
	letter-spacing:-.01em;
	color:var(--ink);
	max-width:44ch;
}
.lead--center{ margin:1.6rem auto 0; text-align:center; color:var(--ink-70); }
.lead--light{ color:rgba(255,255,255,.8); }

.section__head{ margin-bottom:clamp(2.5rem,5vw,4.5rem); }
.section__head--split{
	display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(1.5rem,4vw,4rem);
	align-items:end;
}
.section__note{ color:var(--ink-70); max-width:42ch; margin:0; align-self:end; }
.section__lead{
	color:var(--ink-70); max-width:48ch; margin:clamp(1rem,2vw,1.5rem) 0 0;
	font-size:clamp(1.05rem,1.2vw,1.25rem); line-height:1.5;
}

/* ---------- buttons ---------- */
.btn{
	display:inline-flex; align-items:center; justify-content:center; gap:.5em;
	font-family:var(--font-body); font-weight:600; font-size:.98rem;
	letter-spacing:-.01em; line-height:1;
	padding:1.05em 1.7em; border-radius:100px;
	background:var(--ink); color:#fff;
	border:0 !important; outline:none !important; appearance:none; -webkit-appearance:none;
	cursor:pointer; text-decoration:none;
	box-shadow:none;
	transition:transform .5s var(--ease), background .35s var(--ease), color .35s var(--ease), box-shadow .35s var(--ease);
	will-change:transform;
}
.btn:hover{ transform:translateY(-3px); background:var(--accent); color:#fff; }
.btn--dark{ background:var(--ink); color:#fff; border:0 !important; }
.btn--light{ background:#fff; color:var(--ink); border:0 !important; }
.btn--light:hover{ background:var(--accent); color:#fff; }
.btn--primary{ background:var(--accent-1); color:#fff; border:0 !important; }
.btn--primary:hover{ background:var(--accent-2); color:#fff; }
.btn--xl{ font-size:1.15rem; padding:1.25em 2.2em; margin-top:2.5rem; }
.btn--nav{
	padding:.65rem 1.45rem;
	font-size:.92rem;
	font-weight:600;
	min-height:44px;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	border:0 !important;
}

/* ---------- pills ---------- */
.pills{ display:flex; flex-wrap:wrap; gap:.6rem; margin:1.6rem 0 0; }
.pills li{
	font-size:.82rem; font-weight:600; letter-spacing:.02em;
	padding:.52em 1.15em; border:1px solid var(--line); border-radius:100px;
	color:var(--ink); background:var(--paper-2);
	box-shadow:0 2px 8px rgba(16,24,43,.04);
	display:inline-flex; align-items:center; gap:.5em;
	transition:transform .3s var(--ease), border-color .3s var(--ease), box-shadow .3s var(--ease);
}
.pills li::before{
	content:""; width:6px; height:6px; border-radius:50%; background:var(--accent); display:inline-block;
}
.pills li:hover{
	transform:translateY(-2px); border-color:var(--accent);
	box-shadow:0 4px 12px rgba(35,64,255,.12);
}
.pills--sm li{ font-size:.76rem; padding:.42em .9em; }
.pills--sm li::before{ width:5px; height:5px; }

/* =========================================================
   NAV
   ========================================================= */
.nav{
	position:fixed; inset:0 0 auto 0; z-index:50;
	transition:background .5s var(--ease), box-shadow .5s var(--ease), padding .5s var(--ease), border-color .5s var(--ease);
	padding-block:1.35rem;
}
.nav__inner{
	max-width:var(--container); margin-inline:auto; padding-inline:var(--gutter);
	display:flex; align-items:center; gap:2rem;
}
.nav__brand img{ width:144px; height:auto; display:block; }
.nav__links{ display:flex; gap:2rem; margin-left:auto; }
.nav__links a{
	font-size:.92rem; font-weight:500; color:rgba(255,255,255,.8);
	position:relative; transition:color .3s var(--ease);
}
.nav__links a::after{
	content:""; position:absolute; left:0; bottom:-6px; width:100%; height:1.5px;
	background:var(--accent); transform:scaleX(0); transform-origin:left;
	transition:transform .4s var(--ease);
}
.nav__links a:hover{ color:#fff; }
.nav__links a:hover::after{ transform:scaleX(1); }
.nav .btn--nav{
	background:#fff;
	color:var(--ink);
	transition:transform .3s var(--ease), background .3s var(--ease), color .3s var(--ease);
}
.nav .btn--nav:hover{
	background:var(--accent);
	color:#fff;
	transform:translateY(-2px);
}
.nav__burger{
	display:none;
	background:none;
	border:none;
	cursor:pointer;
	padding:0;
	width:44px;
	height:44px;
	min-width:44px;
	min-height:44px;
	position:relative;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	gap:6px;
	z-index:60;
	touch-action:manipulation;
}
.nav__burger span{
	display:block;
	width:24px;
	height:2px;
	background:#fff;
	border-radius:2px;
	transition:transform .3s var(--ease), opacity .3s var(--ease);
}
.nav__burger.is-active span:nth-child(1){
	transform:translateY(8px) rotate(45deg);
}
.nav__burger.is-active span:nth-child(2){
	opacity:0;
}
.nav__burger.is-active span:nth-child(3){
	transform:translateY(-8px) rotate(-45deg);
}
.nav.is-scrolled{
	background:rgba(9, 13, 24, 0.78);
	backdrop-filter:saturate(180%) blur(20px);
	-webkit-backdrop-filter:saturate(180%) blur(20px);
	border-bottom:1px solid rgba(255, 255, 255, 0.1);
	box-shadow:0 8px 32px rgba(0, 0, 0, 0.35);
	padding-block:.9rem;
}

/* =========================================================
   HERO
   ========================================================= */
.hero{
	position:relative; overflow:hidden;
	min-height:100svh;
	display:flex; flex-direction:column;
	padding-top:clamp(6rem, 12vh, 8.5rem);
}
/* ---- slideshow background ---- */
.hero__bg{ position:absolute; inset:0; z-index:0; background:var(--navy-deep); }
.hero__slide{
	position:absolute; inset:0;
	background-size:cover; background-position:center;
	opacity:0;
	transition:opacity 1.6s ease-in-out; will-change:opacity;
}
.hero__slide.is-active{ opacity:1; }
.hero__scrim{ position:absolute; inset:0; z-index:1; }

.hero__inner{ position:relative; z-index:2; flex:1; display:flex; flex-direction:column; justify-content:center; }
.hero__title{
	font-size:clamp(2.6rem, 9.2vw, 6.8rem);
	line-height:.94;
	letter-spacing:-.04em;
	font-weight:800;
	margin:.05em 0 0 -.05em; /* optical left-align: compensate glyph side-bearing */
}
.hero__title .line{ display:block; overflow:hidden; }
.word{ display:inline-block; overflow:hidden; }
.word__i{ display:inline-block; }
.hero__lead{ margin-top:clamp(1.6rem, 3.5vw, 2.8rem); }
.hero__sub{
	font-size:clamp(1.1rem, 1.35vw, 1.45rem); line-height:1.5;
	max-width:44ch; margin:0 0 2rem;
}
.hero__meta{ display:flex; align-items:center; gap:1.5rem; flex-wrap:wrap; }
.hero__loc{ font-size:.86rem; letter-spacing:.02em; }
.hero__cta{ transition:transform .5s var(--ease), background .35s var(--ease), color .35s var(--ease); }
.hero__cta:hover{ transform:translateY(-3px); }

.hero__ticker{
	position:relative; z-index:2;
	margin-top:clamp(2rem,5vw,3.5rem);
	border-top:1px solid rgba(255,255,255,.16); border-bottom:1px solid rgba(255,255,255,.16);
	overflow:hidden; width:100%;
}
.ticker__track{
	display:flex;
	width:max-content;
	padding-block:1.1rem;
	animation:marq 32s linear infinite;
	font-family:var(--font-display); font-weight:700; letter-spacing:-.01em;
	font-size:clamp(1rem,1.4vw,1.35rem); text-transform:uppercase;
	color:#fff;
	will-change:transform;
}
.ticker__group{
	display:flex;
	align-items:center;
	gap:2.5rem;
	padding-right:2.5rem;
	flex-shrink:0;
}
.ticker__group i{ color:#6274ff; font-style:normal; font-size:.7em; }

/* ================= HERO (Dark Theme) ================= */
.hero__scrim{
	background:
		linear-gradient(90deg, rgba(9,13,24,.82) 0%, rgba(9,13,24,.45) 55%, rgba(9,13,24,.25) 100%),
		linear-gradient(180deg, rgba(9,13,24,.5) 0%, transparent 32%, rgba(9,13,24,.85) 100%);
}
.hero__title{ color:#fff; text-shadow:0 2px 24px rgba(6,10,20,.4); }
.hero__title .word--accent .word__i,
.hero__title .line--accent .word__i{ color:#6274ff; }
.hero .eyebrow{ color:rgba(255,255,255,.72); }
.hero__sub{ color:rgba(255,255,255,.84); text-shadow:0 1px 2px rgba(6,10,20,.6), 0 2px 20px rgba(6,10,20,.5); }
.hero__loc{ color:rgba(255,255,255,.6); }
.hero__cta{ background:#fff; color:var(--ink); }
.hero__cta:hover{ background:var(--accent); color:#fff; }


/* On narrow screens the copy spans full width, so use a vertical veil for legibility */
@media (max-width:768px){
	.hero__scrim{
		background:linear-gradient(180deg, rgba(9,13,24,.5) 0%, rgba(9,13,24,.72) 46%, rgba(9,13,24,.93) 100%);
	}
}

/* =========================================================
   VISIÓN (Split 60/40 Full-Bleed)
   ========================================================= */
.vision{
	padding-block:0;
}
.vision__split{
	display:grid;
	grid-template-columns:60% 40%;
	min-height:clamp(480px, 65vh, 700px);
	align-items:stretch;
	width:100%;
}
.vision__content{
	display:flex;
	align-items:center;
	justify-content:flex-start;
	padding-left:max(var(--gutter), calc((100vw - var(--container)) / 2 + var(--gutter)));
	padding-right:clamp(2rem, 4.5vw, 4.5rem);
	padding-block:clamp(3.8rem, 6.5vh, 6rem);
}
.vision__text{
	max-width:680px;
	width:100%;
}
.vision__text .h2{
	margin-bottom:clamp(1.2rem, 2vw, 1.6rem);
	letter-spacing:-.03em;
}
.vision__text .lead{
	font-size:clamp(1.08rem, 1.25vw, 1.3rem);
	line-height:1.55;
	color:var(--ink);
	margin-bottom:1.1rem;
}
.vision__text .lead strong,
.vision__paragraphs strong{
	color:var(--ink);
	font-weight:700;
}
.vision__text p{
	color:var(--ink-70);
	font-size:clamp(1.02rem, 1.2vw, 1.14rem);
	line-height:1.68;
	margin:0 0 1.25rem;
	max-width:52ch;
}
.vision__text p:last-child{
	margin-bottom:0;
}

/* Gradient shimmer text */
.gradient-shimmer{
	background:linear-gradient(135deg, #2340ff 0%, #6274ff 50%, #22d3ee 100%);
	-webkit-background-clip:text;
	background-clip:text;
	-webkit-text-fill-color:transparent;
	display:inline-block;
	font-weight:inherit;
}
.vision__quote-box{
	margin:clamp(1.4rem, 2.5vw, 2rem) 0 1.5rem;
	padding:1.1rem 1.5rem;
	background:rgba(35,64,255,.04);
	border-left:3px solid var(--accent);
	border-radius:0 12px 12px 0;
}
.vision__quote{
	font-family:var(--font-display);
	font-weight:700;
	color:var(--ink);
	font-size:clamp(1.05rem, 1.35vw, 1.25rem);
	line-height:1.35;
	letter-spacing:-.02em;
	margin:0;
}
.vision__action{
	margin-top:clamp(1.6rem, 2.8vw, 2.2rem);
}
.vision__media{
	position:relative;
	margin:0;
	width:100%;
	height:100%;
	min-height:100%;
	border-radius:0;
	overflow:hidden;
	background:var(--navy-deep);
}
.vision__media img{
	position:absolute;
	inset:-10% 0;
	width:100%;
	height:120%;
	object-fit:cover;
	object-position:40% center;
}

/* =========================================================
   SOPORTES (Dark Navy Band)
   ========================================================= */
.soportes{
	background:radial-gradient(120% 100% at 50% 0%, #16223f 0%, #0d1424 55%, #080d18 100%);
	overflow:hidden;
	position:relative;
	border-bottom:none;
	z-index:2;
}
.soportes__canvas{
	position:absolute;
	inset:0;
	width:100%;
	height:100%;
	pointer-events:none;
	z-index:1;
	opacity:.9;
	mask-image:radial-gradient(ellipse 85% 75% at 50% 50%, #000 35%, transparent 100%);
	-webkit-mask-image:radial-gradient(ellipse 85% 75% at 50% 50%, #000 35%, transparent 100%);
}
.soportes .container{
	position:relative;
	z-index:2;
}
.soportes .h2{ color:#fff; }
.soportes .section__note--light{
	color:rgba(255,255,255,.9);
	font-size:clamp(1.15rem, 1.45vw, 1.4rem);
	line-height:1.55;
	max-width:44ch;
	align-self:center;
}

.stats{
	display:grid; grid-template-columns:repeat(3,1fr);
	border:none;
	margin-top:clamp(2.2rem, 4vw, 3.5rem);
	max-width:1020px;
	margin-inline:auto;
}
.stat{
	padding:clamp(1.2rem, 2vw, 2.2rem) 0;
	border:none;
	padding-inline:clamp(.5rem, 2vw, 2rem);
	text-align:center;
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:flex-start;
}
.stat:first-child{ padding-left:0; }
.stat__num{
	display:flex;
	align-items:baseline;
	justify-content:center;
	font-family:var(--font-display);
	font-weight:800;
	font-size:clamp(2.4rem, 5vw, 4.6rem);
	line-height:1;
	letter-spacing:-.04em;
	color:#fff;
	height:1.15em;
	white-space:nowrap;
}
.stat__pct{ font-size:.5em; vertical-align:top; color:#6274ff; }
.stat__label{
	display:block;
	margin-top:.85rem;
	color:rgba(255,255,255,.72);
	font-size:clamp(.88rem, 1.05vw, 1rem);
	letter-spacing:.01em;
	text-align:center;
	line-height:1.3;
}
.soportes__expansion-note{
	text-align:center;
	margin:clamp(1.8rem, 3vw, 2.6rem) auto 0;
	color:rgba(255,255,255,.65);
	font-size:clamp(.9rem, 1.1vw, 1rem);
	font-style:italic;
	letter-spacing:.02em;
}

/* =========================================================
   MARCAS / LOCALES (Full Bleed Split)
   ========================================================= */
.split-hero{
	position:relative;
	width:100%;
	overflow:visible;
	padding:0;
	background:var(--navy-deep);
	z-index:3;
}
.split-hero__arrows{
	position:absolute;
	top:0;
	left:0;
	right:0;
	z-index:30;
	pointer-events:none;
}
.split-hero__arrow{
	position:absolute;
	top:0;
	transform:translate(-50%, -50%);
	color:#fff;
	filter:drop-shadow(0 6px 16px rgba(0,0,0,.85));
	transition:transform .4s var(--ease);
}
.split-hero__arrow--left{ left:25%; }
.split-hero__arrow--right{ left:75%; }
.split-hero__arrow svg{
	width:clamp(44px, 5vw, 60px);
	height:clamp(44px, 5vw, 60px);
	stroke:#fff;
	display:block;
}
.split-hero__grid{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:0;
	background:transparent;
	min-height:clamp(560px, 80vh, 800px);
	overflow:hidden;
	position:relative;
}
.split-card{
	position:relative;
	overflow:hidden;
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	padding:clamp(2.5rem, 5vw, 4.5rem);
	min-height:clamp(520px, 75vh, 760px);
}
.split-card:hover .split-hero__arrow{
	transform:translate(-50%, calc(-50% + 6px));
}
.split-card__bg{
	position:absolute;
	inset:0;
	z-index:1;
	overflow:hidden;
}
.split-card__bg img{
	position:absolute;
	inset:-15% 0;
	width:100%;
	height:130%;
	object-fit:cover;
}
.split-card__scrim{
	position:absolute;
	inset:0;
	z-index:2;
	background:
		radial-gradient(ellipse 80% 80% at 50% 50%, rgba(9,13,24,.55) 0%, rgba(9,13,24,.82) 100%),
		linear-gradient(180deg, rgba(9,13,24,.35) 0%, rgba(9,13,24,.6) 50%, rgba(9,13,24,.92) 100%);
	pointer-events:none;
}
.split-card__content{
	position:relative;
	z-index:3;
	max-width:540px;
	width:100%;
	display:flex;
	flex-direction:column;
	align-items:center;
	text-align:center;
}
.split-card__tag{
	display:inline-block;
	font-family:var(--font-display);
	font-weight:800;
	font-size:clamp(0.92rem, 1.12vw, 1.08rem);
	text-transform:uppercase;
	letter-spacing:.1em;
	margin-bottom:1.15rem;
	padding:.42em 1.2em;
	border-radius:100px;
	text-align:center;
	transition:transform .3s var(--ease), box-shadow .3s var(--ease);
}
.split-card__tag--marcas{
	color:#7084ff;
	background:rgba(98, 116, 255, 0.18);
	border:1.5px solid rgba(98, 116, 255, 0.45);
	box-shadow:0 0 24px rgba(98, 116, 255, 0.22);
}
.split-card__tag--locales{
	color:#22d3ee;
	background:rgba(6, 182, 212, 0.18);
	border:1.5px solid rgba(34, 211, 238, 0.45);
	box-shadow:0 0 24px rgba(6, 182, 212, 0.22);
}
.split-card__title{
	font-family:var(--font-display);
	font-weight:800;
	font-size:clamp(1.8rem, 3.2vw, 2.75rem);
	line-height:1.12;
	letter-spacing:-.03em;
	color:#fff;
	margin:0 0 1rem;
	text-align:center;
	text-shadow:0 2px 20px rgba(0,0,0,.5);
}
.split-card__desc{
	color:rgba(255,255,255,.82);
	font-size:clamp(0.95rem, 1.08vw, 1.1rem);
	line-height:1.6;
	margin:0 0 1.5rem;
	text-align:center;
	text-shadow:0 1px 10px rgba(0,0,0,.4);
}
.split-card .pills{
	justify-content:center;
}
.pills--light li{
	background:rgba(255,255,255,.1);
	border-color:rgba(255,255,255,.18);
	color:rgba(255,255,255,.9);
	backdrop-filter:blur(6px);
}
.split-card__cta{
	margin-top:clamp(1.5rem, 2.5vw, 2rem);
	display:flex;
	justify-content:center;
}
.split-card__cta .btn{
	animation: btnHeartbeatPrimary 3.2s ease-in-out infinite;
	transform-origin: center center;
}
.split-card__cta .btn--light{
	animation-name: btnHeartbeatLight;
	animation-delay: .35s;
}
.split-card__cta .btn:hover{
	animation-play-state: paused;
}

@keyframes btnHeartbeatPrimary{
	0%, 100%{
		transform: scale(1);
	}
	12%{
		transform: scale(1.045);
	}
	24%{
		transform: scale(1.015);
	}
	36%{
		transform: scale(1.055);
	}
	60%, 100%{
		transform: scale(1);
	}
}

@keyframes btnHeartbeatLight{
	0%, 100%{
		transform: scale(1);
	}
	12%{
		transform: scale(1.045);
	}
	24%{
		transform: scale(1.015);
	}
	36%{
		transform: scale(1.055);
	}
	60%, 100%{
		transform: scale(1);
	}
}

.btn--primary{
	background:var(--accent);
	color:#fff;
	box-shadow:0 4px 20px rgba(35,64,255,.35);
}
.btn--primary:hover{
	background:#fff;
	color:var(--ink);
	transform:translateY(-2px);
}
.btn--light{
	background:#fff;
	color:var(--ink);
}
.btn--light:hover{
	background:var(--accent);
	color:#fff;
	transform:translateY(-2px);
}

/* =========================================================
   EXPERIENCE (3-Card Showcase)
   ========================================================= */
.experience .section__head{ text-align:center; }
.marquee{ overflow:hidden; width:100%; margin-block:clamp(2.5rem,5vw,4rem); }
.marquee--services{
	border-top:1px solid var(--line);
	border-bottom:none;
	margin-bottom:0;
}
.marquee__track{
	display:flex;
	width:max-content;
	font-family:var(--font-display); font-weight:800; text-transform:uppercase;
	font-size:clamp(1.8rem,5vw,4.2rem); letter-spacing:-.02em;
	padding-block:.6em;
	animation:marq 40s linear infinite;
	will-change:transform;
}
.marquee__group{
	display:flex;
	align-items:center;
	gap:2rem;
	padding-right:2rem;
	flex-shrink:0;
}
.marquee__group i{ color:rgba(16,24,43,.3); font-style:normal; }

/* =========================================================
   EXPERIENCE FULL-BLEED 3-PANEL DIAGONAL SPLIT
   ========================================================= */
.experience{
	padding-inline:0;
	padding-bottom:0;
	overflow:hidden;
}
.experience .container{
	padding-inline:var(--gutter);
}

.exp-split{
	position:relative;
	display:block;
	width:100%;
	min-height:clamp(660px, 86vh, 900px);
	overflow:hidden;
	background:var(--navy-deep);
	margin-top:0;
}

/* Title strictly centered inside the 3-panel split */
.exp-split__top{
	position:absolute;
	top:clamp(2.5rem, 5vw, 4.2rem);
	left:0;
	right:0;
	width:100%;
	display:flex;
	justify-content:center;
	align-items:center;
	text-align:center;
	z-index:25;
	pointer-events:none;
	padding-inline:var(--gutter);
	box-sizing:border-box;
}
.exp-split__title{
	font-family:var(--font-display);
	font-weight:800;
	color:#fff;
	font-size:clamp(2.2rem, 5vw, 4.6rem);
	line-height:1;
	letter-spacing:-.035em;
	margin:0 auto;
	text-align:center;
	text-shadow:0 4px 24px rgba(0,0,0,.75), 0 2px 8px rgba(0,0,0,.9);
	width:100%;
}

/* Diagonal Track Container */
.exp-split__track{
	display:flex;
	width:100%;
	height:100%;
	min-height:clamp(660px, 86vh, 900px);
	position:relative;
}

/* Desktop diagonal skewed panels */
@media (min-width: 901px){
	.exp-split__track{
		width:calc(100% + 220px);
		margin-left:-110px;
	}

	.exp-slice{
		position:relative;
		flex:1;
		height:100%;
		min-height:clamp(660px, 86vh, 900px);
		overflow:hidden;
		transform:skewX(-10deg);
		transform-origin:center;
		border-right:2px solid rgba(255,255,255,.25);
		box-shadow:0 0 25px rgba(0,0,0,.6);
		transition:flex .7s cubic-bezier(.16, 1, .3, 1), filter .5s var(--ease);
		cursor:pointer;
		z-index:2;
		display:flex;
		flex-direction:column;
		justify-content:flex-end;
		padding:clamp(2.5rem, 5vw, 4.5rem) clamp(2.5rem, 4vw, 4rem);
		box-sizing:border-box;
	}

	/* Un-skew photo and content so they are perfectly upright and centered */
	.exp-slice__bg{
		position:absolute;
		top:-20%;
		bottom:-20%;
		left:-40%;
		right:-40%;
		width:180%;
		height:140%;
		transform:skewX(10deg);
		transform-origin:center;
		z-index:1;
		overflow:hidden;
		background:var(--navy-deep);
	}

	.exp-slice__scrim{
		position:absolute;
		inset:-20% -40%;
		width:180%;
		height:140%;
		transform:skewX(10deg);
		transform-origin:center;
		z-index:2;
		background:linear-gradient(180deg, rgba(9,13,24,.35) 0%, rgba(9,13,24,.4) 30%, rgba(9,13,24,.85) 70%, rgba(9,13,24,.97) 100%);
		transition:background .6s var(--ease);
		pointer-events:none;
	}

	.exp-slice__content{
		position:relative;
		z-index:6;
		color:#fff;
		width:100%;
		transform:skewX(10deg);
		transform-origin:center;
		display:flex;
		flex-direction:column;
		justify-content:flex-end;
		align-items:center;
		text-align:center;
		transition:transform .5s var(--ease);
	}

	.exp-slice:hover{
		flex:1.55;
		z-index:5;
	}
	.exp-split:hover .exp-slice:not(:hover){
		filter:brightness(.65) contrast(1.08);
	}
	.exp-slice:hover .exp-slice__content{
		transform:skewX(10deg) translateY(-6px);
	}
}

.exp-slice__bg img{
	position:absolute;
	inset:0;
	width:100%;
	height:100%;
	object-fit:cover;
	object-position:center;
	transition:transform .8s cubic-bezier(.16, 1, .3, 1), filter .6s var(--ease);
	filter:saturate(1.15) brightness(.9);
}
.exp-slice:hover .exp-slice__bg img{
	transform:scale(1.08);
	filter:saturate(1.25) brightness(1.02);
}

.exp-slice:hover .exp-slice__scrim{
	background:linear-gradient(180deg, rgba(9,13,24,.15) 0%, rgba(9,13,24,.2) 30%, rgba(9,13,24,.75) 65%, rgba(9,13,24,.93) 100%);
}

.exp-slice__header{
	display:flex;
	flex-direction:column;
	justify-content:flex-end;
	align-items:center;
	text-align:center;
	min-height:92px;
	width:100%;
}

.exp-slice__num{
	display:block;
	font-family:var(--font-display);
	font-weight:800;
	font-size:clamp(1.05rem, 1.4vw, 1.35rem);
	color:var(--accent-2);
	letter-spacing:.08em;
	margin-bottom:.4rem;
	text-shadow:0 2px 12px rgba(98,116,255,.6);
}

.exp-slice__title{
	font-family:var(--font-display);
	font-weight:800;
	color:#fff;
	font-size:clamp(1.4rem, 1.85vw, 1.95rem);
	line-height:1.15;
	letter-spacing:-.03em;
	margin:0;
	min-height:2.35em;
	display:flex;
	align-items:flex-end;
	justify-content:center;
	text-align:center;
	text-shadow:0 2px 16px rgba(0,0,0,.75);
}

/* Butter-smooth accordion reveal and collapse */
.exp-slice__reveal{
	opacity:0;
	transform:translateY(16px);
	max-height:0;
	margin-top:0;
	overflow:hidden;
	pointer-events:none;
	transition:opacity .45s var(--ease), transform .45s cubic-bezier(.16, 1, .3, 1), max-height .55s cubic-bezier(.16, 1, .3, 1), margin-top .45s var(--ease);
	width:100%;
	display:flex;
	flex-direction:column;
	align-items:center;
}

.exp-slice:hover .exp-slice__reveal{
	opacity:1;
	transform:translateY(0);
	max-height:220px;
	margin-top:1.1rem;
	pointer-events:auto;
}

.exp-slice__desc{
	color:rgba(255,255,255,.86);
	font-size:clamp(.92rem, 1.05vw, 1.02rem);
	line-height:1.55;
	margin:0 0 1.1rem;
	text-align:center;
	max-width:36ch;
	text-shadow:0 1px 8px rgba(0,0,0,.5);
}

.exp-slice .pills{
	justify-content:center;
}

/* Mobile: 3 rows with horizontal diagonal splits and scroll-driven reveal */
@media (max-width: 900px){
	.exp-split{
		padding-bottom:1rem;
	}
	.exp-split__track{
		flex-direction:column;
		min-height:auto;
		gap:0;
		width:100%;
		margin-left:0;
	}
	.exp-split__top{
		position:relative;
		top:auto;
		left:auto;
		transform:none;
		padding:clamp(2.8rem, 7vw, 4.2rem) clamp(0.75rem, 3.5vw, 1.5rem) clamp(1.4rem, 4vw, 2.2rem);
		background:var(--navy-deep);
		width:100%;
		box-sizing:border-box;
	}
	.exp-split__title{
		font-size:clamp(2.75rem, 11vw, 4.5rem);
		line-height:.96;
		letter-spacing:-.045em;
		width:100%;
		max-width:100%;
		margin:0 auto;
		text-align:center;
		text-wrap:balance;
	}

	.exp-slice{
		min-height:clamp(420px, 65vh, 540px);
		position:relative;
		display:flex;
		flex-direction:column;
		justify-content:center;
		align-items:center;
		padding:clamp(2.5rem, 6vw, 4rem) var(--gutter);
		border-right:none;
		box-shadow:none;
		transform:none !important;
		z-index:2;
		transition:filter .4s var(--ease);
	}

	/* Diagonal horizontal cuts separating the 3 rows */
	.exp-slice--1{
		clip-path:polygon(0 0, 100% 0, 100% calc(100% - 28px), 0 100%);
		z-index:3;
	}
	.exp-slice--2{
		margin-top:-28px;
		clip-path:polygon(0 28px, 100% 0, 100% calc(100% - 28px), 0 100%);
		z-index:2;
	}
	.exp-slice--3{
		margin-top:-28px;
		clip-path:polygon(0 28px, 100% 0, 100% 100%, 0 100%);
		z-index:1;
	}

	.exp-slice__bg{
		position:absolute;
		inset:0;
		width:100%;
		height:100%;
		z-index:1;
		overflow:hidden;
		background:var(--navy-deep);
		transform:none !important;
	}
	.exp-slice__bg img{
		position:absolute;
		inset:0;
		width:100%;
		height:100%;
		object-fit:cover;
		object-position:center;
		transition:transform .7s cubic-bezier(.16, 1, .3, 1), filter .6s var(--ease);
		filter:saturate(1.1) brightness(.75);
	}
	.exp-slice.is-active .exp-slice__bg img{
		transform:scale(1.05);
		filter:saturate(1.15) brightness(.82);
	}

	.exp-slice__scrim{
		position:absolute;
		inset:0;
		width:100%;
		height:100%;
		z-index:2;
		background:radial-gradient(ellipse 90% 90% at 50% 50%, rgba(9,13,24,.55) 0%, rgba(9,13,24,.88) 100%), linear-gradient(180deg, rgba(9,13,24,.4) 0%, rgba(9,13,24,.75) 50%, rgba(9,13,24,.96) 100%);
		transition:background .5s var(--ease);
		pointer-events:none;
		transform:none !important;
	}
	.exp-slice.is-active .exp-slice__scrim{
		background:radial-gradient(ellipse 90% 90% at 50% 50%, rgba(9,13,24,.4) 0%, rgba(9,13,24,.82) 100%), linear-gradient(180deg, rgba(9,13,24,.25) 0%, rgba(9,13,24,.65) 50%, rgba(9,13,24,.92) 100%);
	}

	.exp-slice__content{
		position:relative;
		z-index:6;
		transform:none !important;
		display:flex;
		flex-direction:column;
		justify-content:center;
		align-items:center;
		text-align:center;
		width:100%;
		max-width:38ch;
		margin-inline:auto;
		opacity:.82;
		transition:opacity .45s var(--ease), transform .45s var(--ease);
	}
	.exp-slice.is-active .exp-slice__content,
	.exp-slice:hover .exp-slice__content{
		opacity:1;
		transform:scale(1.03) !important;
	}

	.exp-slice__header{
		display:flex;
		flex-direction:column;
		align-items:center;
		justify-content:center;
		min-height:auto;
		margin-bottom:.4rem;
		width:100%;
	}
	.exp-slice__title{
		min-height:auto;
		font-size:clamp(1.4rem, 5.5vw, 1.85rem);
		text-align:center;
		justify-content:center;
	}

	.exp-slice__reveal{
		opacity:1 !important;
		max-height:none !important;
		transform:none !important;
		margin-top:.6rem;
		overflow:visible;
		pointer-events:auto;
		width:100%;
		display:flex;
		flex-direction:column;
		align-items:center;
	}
	.exp-slice__desc{
		font-size:clamp(.88rem, 3.6vw, .98rem);
		line-height:1.5;
		margin:0 0 .9rem;
		max-width:34ch;
		text-align:center;
	}

	/* Mobile Section 6: Data balanced without excessive empty margins */
	.data{
		padding-block:clamp(3.5rem, 6vh, 5rem);
		min-height:auto;
		display:block;
	}
	.data__inner{
		width:100%;
	}
	.metrics{
		gap:clamp(.8rem, 2.2vh, 1.6rem);
		margin:clamp(1.8rem, 3.5vh, 2.6rem) auto;
	}
	.metrics li{
		font-size:clamp(2.1rem, 7.8vw, 3.2rem);
		line-height:1.15;
		padding-block:.2rem;
	}

	/* Mobile Section 7: Contacto 100% Full Viewport */
	.contacto{
		padding-block:clamp(3rem, 6vh, 5rem);
		min-height:100vh;
		min-height:100dvh;
		min-height:100svh;
		display:flex;
		flex-direction:column;
		justify-content:center;
		align-items:center;
	}
	.contacto__inner{
		width:100%;
	}
}

/* =========================================================
   DATA (dark band)
   ========================================================= */
.data{ background:var(--navy-deep); overflow:hidden; position:relative; }
.data__bg{ position:absolute; inset:0; opacity:.24; z-index:0; }
.data__bg img{ width:100%; height:120%; object-fit:cover; filter:saturate(1.1); }
.data__symbol{
	position:absolute;
	top:50%;
	left:-10vw;
	transform:translateY(-50%);
	width:clamp(480px, 55vw, 850px);
	max-width:90vw;
	height:auto;
	opacity:.15;
	pointer-events:none;
	z-index:1;
	display:flex;
	align-items:center;
	justify-content:flex-start;
}
.data__symbol img{
	width:100%;
	height:auto;
	display:block;
	filter:drop-shadow(0 0 45px rgba(98,116,255,.45));
	will-change:transform;
}
.data::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(11,17,32,.72),rgba(11,17,32,.92)); z-index:1; }
.data__inner{ position:relative; z-index:2; text-align:center; overflow:visible; padding-inline:clamp(1.5rem, 5vw, 4rem); }
.data__inner .h2{ margin:0 auto .55em; max-width:18ch; }
.data__inner .lead{ margin-inline:auto; }
.metrics{
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	gap:clamp(.3em, 1.1vw, .55em);
	margin:clamp(2.5rem,5vw,4rem) auto;
	width:100%;
	max-width:100%;
	overflow:visible;
}
.metrics li{
	font-family:var(--font-display); font-weight:800; text-transform:uppercase;
	font-size:clamp(2.2rem, 5.5vw, 4.8rem); line-height:1.05; letter-spacing:-.03em;
	color:rgba(255,255,255,.2);
	transition:color .4s var(--ease), text-shadow .4s var(--ease), transform .4s var(--ease);
	display:flex;
	justify-content:center;
	align-items:center;
	width:100%;
	text-align:center;
	transform-origin:center;
	white-space:nowrap;
	overflow:visible;
}
.metric-wrap{
	position:relative;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	overflow:visible;
}
.metric-text{
	display:inline-block;
	text-align:center;
	color:inherit;
	transition:inherit;
}
.metrics li.is-active{
	color:#fff;
	text-shadow:0 0 20px rgba(255,255,255,.7), 0 0 45px rgba(98,116,255,.45);
	transform:scale(1.05);
}
.metric-icon{
	position:absolute;
	right:calc(100% + clamp(12px, 1.8vw, 24px));
	top:50%;
	transform:translateY(-50%) scale(0.35) rotate(-20deg);
	width:clamp(34px, 4.8vw, 58px);
	height:clamp(34px, 4.8vw, 58px);
	opacity:0;
	pointer-events:none;
	z-index:10;
	transition:opacity .32s cubic-bezier(.16, 1, .3, 1), transform .4s cubic-bezier(.16, 1, .3, 1);
	display:flex;
	align-items:center;
	justify-content:center;
	overflow:visible;
	flex-shrink:0;
}
.metric-icon img{
	width:100%;
	height:100%;
	object-fit:contain;
	filter:drop-shadow(0 0 14px rgba(255, 255, 255, 0.95)) drop-shadow(0 0 32px rgba(98, 116, 255, 0.75));
}
.metrics li.is-active .metric-icon{
	opacity:1;
	transform:translateY(-50%) scale(1) rotate(0deg);
}
.metrics li.is-active .metric-text{
	color:#ffffff;
	text-shadow:0 0 20px rgba(255,255,255,.7), 0 0 45px rgba(98,116,255,.45);
}

.data__tag{ color:var(--accent-2); font-size:1.05rem; letter-spacing:.01em; margin:0; }

/* =========================================================
   CONTACTO (dark with Video Background) - 100% Full Viewport
   ========================================================= */
.contacto{
	background:var(--navy-deep);
	position:relative;
	overflow:hidden;
	text-align:center;
	min-height:100vh;
	min-height:100dvh;
	padding-block:clamp(3.5rem, 6vh, 6rem);
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	box-sizing:border-box;
}
.contacto__video-wrap{
	position:absolute;
	inset:0;
	z-index:1;
	overflow:hidden;
	pointer-events:none;
}
.contacto__video{
	position:absolute;
	top:50%;
	left:50%;
	min-width:100%;
	min-height:100%;
	width:100%;
	height:100%;
	transform:translate(-50%, -50%);
	object-fit:cover;
	opacity:.62;
	filter:brightness(1.02) contrast(1.05);
}
.contacto__scrim{
	position:absolute;
	inset:0;
	background:radial-gradient(120% 90% at 50% 10%, rgba(9,13,24,.38), rgba(9,13,24,.72));
}
.contacto__inner{
	position:relative;
	z-index:2;
	display:flex;
	flex-direction:column;
	align-items:center;
	text-align:center;
	width:100%;
}
.contacto__title{
	font-family:var(--font-display);
	font-weight:800;
	color:#fff;
	font-size:clamp(2.6rem, 7.5vw, 6.5rem);
	line-height:.96;
	letter-spacing:-.035em;
	margin:.2em auto .3em;
	max-width:16ch;
	text-shadow:0 2px 20px rgba(6,10,20,.6);
}
.contacto__sub{
	color:rgba(255,255,255,.8);
	font-size:clamp(1.05rem, 1.3vw, 1.25rem);
	line-height:1.5;
	max-width:44ch;
	margin:0 auto clamp(2rem, 3.5vw, 3rem);
}
.contacto__stage,
.contacto__screen-totem,
.contacto__screen-bezel,
.contacto__screen-glass{
	display:contents;
}
.contacto__screen-glare,
.contacto__screen-brand,
.contacto__screen-status-bar,
.contacto__screen-base{
	display:none;
}

/* =========================================================
   VERSION PANTALLA: SIMULADOR DE PANTALLA DOOH (?v=pantalla)
   ========================================================= */
.version-pantalla .contacto{
	background:radial-gradient(ellipse 90% 70% at 50% 40%, #0d1629 0%, #040710 100%);
	min-height:100vh;
	min-height:100dvh;
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	padding:clamp(2.5rem, 5vh, 4.5rem) clamp(1rem, 3vw, 2.5rem);
	position:relative;
	overflow:hidden;
}
.version-pantalla .contacto::before{
	content:"";
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%, -50%);
	width:clamp(300px, 75vw, 1000px);
	height:clamp(300px, 60vh, 700px);
	background:radial-gradient(ellipse at center, rgba(98,116,255,.18) 0%, rgba(98,116,255,0) 70%);
	pointer-events:none;
	z-index:1;
}
.version-pantalla .contacto__stage{
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	width:100%;
	max-width:1160px;
	position:relative;
	z-index:2;
}
.version-pantalla .contacto__screen-totem{
	display:flex;
	flex-direction:column;
	align-items:center;
	width:100%;
	max-width:clamp(340px, 94vw, 1040px);
	position:relative;
}
.version-pantalla .contacto__screen-bezel{
	display:flex;
	flex-direction:column;
	width:100%;
	background:linear-gradient(165deg, #1e293b 0%, #0b1120 40%, #060913 100%);
	border:1.5px solid rgba(255,255,255,.14);
	border-radius:clamp(20px, 2.8vw, 34px);
	padding:clamp(12px, 1.6vw, 20px);
	box-shadow:
		0 35px 90px -15px rgba(0,0,0,.95),
		0 0 50px rgba(98,116,255,.2),
		inset 0 1px 2px rgba(255,255,255,.3),
		inset 0 -2px 8px rgba(0,0,0,.85);
	position:relative;
	overflow:hidden;
}
.version-pantalla .contacto__screen-glass{
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	position:relative;
	width:100%;
	min-height:clamp(460px, 64vh, 680px);
	border-radius:clamp(12px, 1.8vw, 22px);
	overflow:hidden;
	background:#000;
	border:1px solid rgba(255,255,255,.08);
	box-shadow:inset 0 0 30px rgba(0,0,0,.6);
}
.version-pantalla .contacto__video-wrap{
	position:absolute;
	inset:0;
	z-index:1;
	overflow:hidden;
	pointer-events:none;
}
.version-pantalla .contacto__video{
	position:absolute;
	top:50%;
	left:50%;
	width:100%;
	height:100%;
	transform:translate(-50%, -50%);
	object-fit:cover;
	opacity:.75;
	filter:brightness(1.05) contrast(1.08);
}
.version-pantalla .contacto__scrim{
	position:absolute;
	inset:0;
	background:radial-gradient(110% 90% at 50% 20%, rgba(9,13,24,.32) 0%, rgba(9,13,24,.8) 100%);
}
.version-pantalla .contacto__screen-glare{
	display:block;
	position:absolute;
	inset:0;
	background:linear-gradient(125deg, rgba(255,255,255,.1) 0%, rgba(255,255,255,.02) 28%, rgba(255,255,255,0) 50%, rgba(255,255,255,.04) 100%);
	pointer-events:none;
	z-index:2;
}
.version-pantalla .contacto__inner{
	position:relative;
	z-index:5;
	padding:clamp(2rem, 4vw, 3.5rem) clamp(1rem, 2.5vw, 2.5rem);
	display:flex;
	flex-direction:column;
	align-items:center;
	text-align:center;
	width:100%;
}
.version-pantalla .contacto__screen-brand{
	display:flex;
	align-items:center;
	justify-content:center;
	margin-bottom:clamp(.8rem, 1.8vw, 1.4rem);
	opacity:.9;
}
.version-pantalla .contacto__screen-brand img{
	height:clamp(20px, 2.6vw, 30px);
	width:auto;
	filter:drop-shadow(0 2px 10px rgba(0,0,0,.9));
}
.version-pantalla .contacto__title{
	font-size:clamp(2rem, 5.2vw, 4.2rem);
	line-height:1.02;
	margin-bottom:.35em;
	text-shadow:0 4px 25px rgba(0,0,0,.9);
}
.version-pantalla .contacto__sub{
	font-size:clamp(.92rem, 1.15vw, 1.15rem);
	max-width:40ch;
	margin-bottom:clamp(1.6rem, 2.8vh, 2.4rem);
	text-shadow:0 2px 12px rgba(0,0,0,.9);
}
.version-pantalla .contacto__screen-status-bar{
	display:flex;
	align-items:center;
	justify-content:center;
	gap:8px;
	padding-top:clamp(8px, 1.1vw, 13px);
	color:rgba(255,255,255,.45);
	font-family:var(--font-display);
	font-size:clamp(.65rem, .8vw, .76rem);
	font-weight:700;
	letter-spacing:.14em;
	text-transform:uppercase;
}
.version-pantalla .contacto__screen-dot{
	width:6px;
	height:6px;
	border-radius:50%;
	background:#22c55e;
	box-shadow:0 0 8px #22c55e;
	animation:blinkScreenLed 2.2s infinite ease-in-out;
}
@keyframes blinkScreenLed{
	0%, 100%{ opacity:1; transform:scale(1); }
	50%{ opacity:.4; transform:scale(.85); }
}
.version-pantalla .contacto__screen-base{
	display:block;
	width:clamp(160px, 32vw, 360px);
	height:clamp(8px, 1.2vw, 14px);
	background:linear-gradient(180deg, #1e293b 0%, #090e18 100%);
	border:1px solid rgba(255,255,255,.1);
	border-top:none;
	border-radius:0 0 12px 12px;
	box-shadow:0 15px 30px rgba(0,0,0,.9);
	margin-top:-1px;
}

/* =========================================================
   FOOTER (Dark Theme)
   ========================================================= */
.foot{
	background:var(--ink);
	padding-block:clamp(2.5rem, 5vw, 4rem);
	border-top:1px solid rgba(255, 255, 255, 0.08);
	color:rgba(255, 255, 255, 0.65);
}
.foot__inner{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:2rem;
	flex-wrap:wrap;
}
.foot__logo{
	width:150px;
	height:auto;
}
.foot__meta{
	display:flex;
	gap:2rem;
	flex-wrap:wrap;
	color:rgba(255, 255, 255, 0.55);
	font-size:.86rem;
}

/* =========================================================
   GSAP reveal initial states (JS toggles .is-in)
   ========================================================= */
.js [data-reveal]{ opacity:0; transform:translateY(26px); }
.js [data-reveal].is-in{ opacity:1; transform:none; transition:opacity .9s var(--ease), transform .9s var(--ease); }
/* Above the fold Hero is always immediately visible for instant LCP */
.hero [data-reveal], .hero .reveal-line__i, .hero .hero__sub, .hero .hero__title, .hero .hero__badge, .hero .hero__cta {
	opacity: 1 !important;
	transform: none !important;
}
.js .word__i{ transform:translateY(105%); }
.js .reveal-line{ display:inline-block; overflow:hidden; }
.js .reveal-line__i{ display:inline-block; transform:translateY(105%); }

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width:1024px){
	.nav__inner{ justify-content:space-between; gap:.75rem; }
	.nav__brand img{ width:136px; max-height:46px; object-fit:contain; }
	.nav .btn--nav{ margin-inline:auto; font-size:.9rem; font-weight:600; padding:.6rem 1.4rem; min-height:44px; display:inline-flex; align-items:center; justify-content:center; }
	.nav__burger{ display:flex; }
	.nav__links{
		position:fixed;
		top:0;
		right:0;
		bottom:0;
		width:min(320px, 85vw);
		background:rgba(9, 13, 24, 0.96);
		backdrop-filter:blur(24px);
		-webkit-backdrop-filter:blur(24px);
		border-left:1px solid rgba(255,255,255,.1);
		display:flex;
		flex-direction:column;
		justify-content:center;
		gap:1.8rem;
		padding:3rem 2.5rem;
		transform:translateX(100%);
		transition:transform .4s cubic-bezier(.16, 1, .3, 1);
		z-index:55;
		box-shadow:-10px 0 40px rgba(0,0,0,.6);
	}
	.nav__links.is-open{ transform:translateX(0); }
	.nav__links a{ font-size:1.2rem; font-weight:700; color:rgba(255,255,255,.9); }

	.section__head--split{ grid-template-columns:1fr; }
	.split-hero__grid{ grid-template-columns:1fr; }
	.split-hero__arrow--left{ left:50%; }
	.split-hero__arrow--right{ display:none; }

	.vision__split{ grid-template-columns:1fr; min-height:auto; }
	.vision__content{ padding-inline:var(--gutter); padding-block:clamp(3rem, 6vw, 4.5rem); text-align:center; }
	.vision__text{ max-width:100%; text-align:center; }
	.vision__text .eyebrow{ margin-inline:auto; text-align:center; }
	.vision__text .h2{ font-size:clamp(2.3rem, 7.8vw, 3.4rem); line-height:1.04; margin-inline:auto; text-align:center; }
	.vision__text .lead{ margin-inline:auto; text-align:center; }
	.vision__text p{ margin-inline:auto; text-align:center; }
	.vision__quote-box{ margin:1.5rem auto; text-align:center; max-width:48ch; }
	.vision__text .pills{ justify-content:center; }
	.vision__action{ display:flex; justify-content:center; }
	.vision__media{ order:-1; position:relative; aspect-ratio:16/10; min-height:280px; height:auto; }
	.vision__media img{ position:absolute; inset:-10% 0; width:100%; height:120%; object-position:40% center; }
}

@media (max-width:768px){
	.hero{
		padding-top:clamp(5.5rem, 14vh, 7.5rem);
		justify-content:center;
	}
	.hero__inner{
		text-align:center;
		align-items:center;
		justify-content:center;
	}
	.hero .eyebrow{
		margin-inline:auto;
		text-align:center;
	}
	.hero__title{
		font-size:clamp(2.7rem, 11vw, 4.2rem);
		line-height:.96;
		letter-spacing:-.035em;
		margin:.15em auto 0;
		text-align:center;
	}
	.hero__title .line{
		text-align:center;
	}
	.hero__lead{
		margin-top:clamp(1.2rem, 3.5vh, 2rem);
		display:flex;
		flex-direction:column;
		align-items:center;
	}
	.hero__sub{
		margin:0 auto 1.4rem;
		text-align:center;
		max-width:32ch;
		font-size:1.02rem;
	}
	.hero__meta{
		justify-content:center;
		flex-direction:column;
		align-items:center;
		gap:.9rem;
	}
	.hero__loc{
		text-align:center;
	}
	.hero__ticker{
		margin-top:clamp(1.5rem, 3vh, 2.5rem);
	}

	.soportes .section__head{ text-align:center; }
	.soportes .h2{ font-size:clamp(2.3rem, 8vw, 3.4rem); line-height:1.04; margin-inline:auto; text-align:center; }
	.soportes .section__note--light{ font-size:1.12rem; line-height:1.5; text-align:center; margin-inline:auto; max-width:44ch; }

	.stats{
		grid-template-columns:repeat(3, 1fr);
		gap:1.2rem .35rem;
		margin-top:1.4rem;
	}
	.stat{
		padding:0;
		text-align:center;
		display:flex;
		flex-direction:column;
		align-items:center;
		border:none !important;
	}
	.stat__num{
		font-size:clamp(1.65rem, 6vw, 2.6rem);
		line-height:1;
		height:auto;
	}
	.stat__label{
		margin-top:.4rem;
		font-size:.76rem;
		line-height:1.2;
		max-width:14ch;
		text-align:center;
	}
	.soportes__expansion-note{
		margin-top:1.4rem;
		font-size:.85rem;
		text-align:center;
	}
	.data__symbol{
		left:-20vw;
		width:95vw;
	}

	.data__inner .h2{ font-size:clamp(2.3rem, 8vw, 3.4rem); line-height:1.04; margin-inline:auto; text-align:center; }
	.data__inner .lead{ margin-inline:auto; text-align:center; max-width:42ch; }
	.metrics{ display:flex; flex-direction:column; align-items:center; gap:.3em; width:100%; margin:clamp(2rem, 4vw, 3rem) auto; }
	.metrics li{ font-size:clamp(2.2rem, 9vw, 3.6rem); line-height:1.1; width:100%; text-align:center; display:flex; justify-content:center; align-items:center; }
	.metric-icon{ width:clamp(22px, 6.5vw, 34px); height:clamp(22px, 6.5vw, 34px); }
	.data__tag{ text-align:center; }

	.h2--big{ font-size:clamp(2.2rem, 10vw, 3rem); }
	.foot__inner{ flex-direction:column; align-items:flex-start; }
}

/* marquee keyframe */
@keyframes marq{ to{ transform:translateX(-50%); } }

/* =========================================================
   PROEM MODALS (White background, synchronized instant blur)
   ========================================================= */
.proem-modal{
	position:fixed;
	inset:0;
	z-index:9999;
	display:flex;
	align-items:center;
	justify-content:center;
	visibility:hidden;
	pointer-events:none;
	transition:visibility .28s ease;
}
.proem-modal.is-open{
	visibility:visible;
	pointer-events:auto;
}
.proem-modal__backdrop{
	position:absolute;
	inset:0;
	background:rgba(9, 13, 24, 0.76);
	-webkit-backdrop-filter:blur(18px);
	backdrop-filter:blur(18px);
	cursor:pointer;
	opacity:0;
	transition:opacity .28s cubic-bezier(0.16, 1, 0.3, 1);
	will-change:opacity;
	transform:translateZ(0);
}
.proem-modal.is-open .proem-modal__backdrop{
	opacity:1;
}
.proem-modal__container{
	position:relative;
	z-index:10;
	width:100%;
	max-width:620px;
	padding:1.2rem;
	display:flex;
	justify-content:center;
	box-sizing:border-box;
}
.proem-modal__dialog{
	background:#ffffff;
	border:1px solid #e2e8f0;
	box-shadow:0 25px 80px rgba(0,0,0,.45), 0 0 1px rgba(0,0,0,.15);
	border-radius:24px;
	padding:clamp(1.8rem, 4vw, 2.5rem);
	position:relative;
	width:100%;
	max-height:min(90vh, 800px);
	overflow-y:auto;
	box-sizing:border-box;
	opacity:0;
	transform:scale(0.96) translateY(12px);
	transition:opacity .28s cubic-bezier(0.16, 1, 0.3, 1), transform .28s cubic-bezier(0.16, 1, 0.3, 1);
	color:#0f172a;
	will-change:transform, opacity;
}
.proem-modal.is-open .proem-modal__dialog{
	opacity:1;
	transform:scale(1) translateY(0);
}
.proem-modal__close{
	position:absolute;
	top:1.2rem;
	right:1.2rem;
	width:36px;
	height:36px;
	border-radius:50%;
	background:#f1f5f9;
	border:1px solid #e2e8f0;
	color:#64748b;
	cursor:pointer;
	display:flex;
	align-items:center;
	justify-content:center;
	transition:background .2s, color .2s, transform .2s;
	z-index:15;
	padding:0;
}
.proem-modal__close:hover{
	background:#e2e8f0;
	color:#0f172a;
	transform:rotate(90deg);
}
.proem-modal__header{
	text-align:left;
	margin-bottom:1.5rem;
	padding-right:2.5rem;
}
.proem-modal__tag{
	font-size:.72rem;
	font-weight:700;
	letter-spacing:.12em;
	text-transform:uppercase;
	color:#3b50e0;
	display:inline-block;
	margin-bottom:.35rem;
}
.proem-modal__title{
	font-size:clamp(1.6rem, 3.5vw, 2.1rem);
	font-family:var(--font-display);
	font-weight:800;
	color:#0f172a;
	line-height:1.1;
	margin:0 0 .4rem;
	letter-spacing:-.03em;
}
.proem-modal__subtitle{
	font-size:.9rem;
	color:#64748b;
	margin:0;
	line-height:1.45;
}

/* White Form Styles */
.form-grid{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:1rem 1.1rem;
}
.form-group{
	display:flex;
	flex-direction:column;
	gap:.35rem;
	text-align:left;
}
.form-group--full{
	grid-column:1 / -1;
}
.form-group label{
	font-size:.82rem;
	font-weight:600;
	color:#334155;
	display:flex;
	align-items:center;
	gap:.25rem;
}
.form-group .req{
	color:#3b50e0;
	font-weight:700;
}
.form-group input[type="text"],
.form-group input[type="email"],
.form-group input[type="tel"],
.form-group textarea,
.form-group select{
	background:#f8fafc;
	border:1px solid #cbd5e1;
	border-radius:10px;
	padding:.75rem .95rem;
	color:#0f172a;
	font-size:.92rem;
	font-family:inherit;
	width:100%;
	box-sizing:border-box;
	transition:border-color .2s, box-shadow .2s, background .2s;
}
.form-group input[type="text"]::placeholder,
.form-group input[type="email"]::placeholder,
.form-group input[type="tel"]::placeholder,
.form-group textarea::placeholder{
	color:#94a3b8;
}
.form-group input:focus,
.form-group textarea:focus,
.form-group select:focus{
	outline:none;
	border-color:#3b50e0;
	background:#ffffff;
	box-shadow:0 0 0 3px rgba(59, 80, 224, 0.16);
}
.form-group select{
	appearance:none;
	-webkit-appearance:none;
	cursor:pointer;
	background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
	background-repeat:no-repeat;
	background-position:right .95rem center;
	padding-right:2.4rem;
}
.form-group select option{
	background:#ffffff;
	color:#0f172a;
}
.form-group textarea{
	resize:vertical;
	min-height:75px;
}
.checkbox-label{
	display:flex;
	align-items:flex-start;
	gap:.65rem;
	font-size:.8rem;
	color:#64748b;
	cursor:pointer;
	line-height:1.45;
	margin-top:.2rem;
}
.checkbox-label input[type="checkbox"]{
	width:16px;
	height:16px;
	margin-top:.15rem;
	accent-color:#3b50e0;
	cursor:pointer;
	flex-shrink:0;
}
.form-actions{
	margin-top:1.4rem;
}
.btn--submit{
	width:100%;
	display:flex;
	align-items:center;
	justify-content:center;
	gap:.6rem;
	padding:.85rem 1.6rem;
	font-size:.98rem;
	font-weight:700;
	border-radius:12px;
	background:#0f172a;
	color:#ffffff !important;
	border:0 !important;
	cursor:pointer;
	transition:background .2s, transform .2s, box-shadow .2s;
	box-shadow:0 4px 16px rgba(15, 23, 42, 0.2);
}
.btn--submit:hover{
	background:#3b50e0;
	transform:translateY(-2px);
	box-shadow:0 8px 24px rgba(59, 80, 224, 0.35);
}
.proem-modal__success{
	display:none;
	flex-direction:column;
	align-items:center;
	text-align:center;
	padding:2rem 1rem;
}
.proem-modal__success.is-visible{
	display:flex;
	animation:fadeInModal .35s ease;
}
.success-icon{
	width:64px;
	height:64px;
	border-radius:50%;
	background:#eff6ff;
	border:2px solid #3b50e0;
	display:flex;
	align-items:center;
	justify-content:center;
	margin-bottom:1.2rem;
	color:#3b50e0;
}
.success-title{
	font-size:1.6rem;
	font-family:var(--font-display);
	font-weight:800;
	color:#0f172a;
	margin:0 0 .6rem;
}
.success-desc{
	font-size:.95rem;
	color:#64748b;
	max-width:38ch;
	margin:0 0 1.6rem;
	line-height:1.5;
}

@media (max-width:600px){
	.form-grid{ grid-template-columns:1fr; }
	.proem-modal__dialog{ padding:1.5rem 1.15rem; }
}

@media (prefers-reduced-motion:reduce){
	*{ animation:none !important; }
	.js [data-reveal]{ opacity:1 !important; transform:none !important; }
	.js .word__i,.js .reveal-line__i{ transform:none !important; }
	html{ scroll-behavior:auto; }
}


/* =========================================================
   BLOG & ARTÍCULOS STYLES (home.php & single.php)
   ========================================================= */

/* ---- Global Body & Hero Modifiers ---- */
body.page-articles,
body.single-article-body{
	background-color:#050810 !important;
	color:#e2e8f0 !important;
	min-height:100vh;
	display:flex;
	flex-direction:column;
}
.page-articles main,
.single-article-body main{
	flex:1 0 auto;
	background-color:#050810;
}

/* ---- Nav Scrolled State for Subpages ---- */
.nav.is-scrolled{
	background:rgba(5,8,16,.92) !important;
	backdrop-filter:blur(20px);
	-webkit-backdrop-filter:blur(20px);
	border-bottom:1px solid rgba(255,255,255,.08);
	box-shadow:0 10px 30px rgba(0,0,0,.6);
}
.nav__links a.is-active{
	color:#fff !important;
	text-shadow:0 0 12px rgba(98,116,255,.6);
}

/* ---- Articles Hero Header (Archive) ---- */
.articles-hero{
	position:relative;
	padding:clamp(8rem, 13vw, 11rem) clamp(1.25rem, 4vw, 3rem) clamp(3rem, 6vw, 4.5rem);
	text-align:center;
	overflow:hidden;
	border-bottom:1px solid rgba(255,255,255,.06);
	background:radial-gradient(ellipse 90% 70% at 50% 0%, #0d1629 0%, #040710 100%);
}
.articles-hero__ambient{
	position:absolute;
	top:-20%;
	left:50%;
	transform:translateX(-50%);
	width:clamp(400px, 80vw, 1100px);
	height:450px;
	background:radial-gradient(ellipse at center, rgba(98,116,255,.22) 0%, rgba(34,211,238,.08) 45%, transparent 70%);
	filter:blur(60px);
	pointer-events:none;
	z-index:0;
}
.articles-hero__container{
	max-width:860px;
	margin:0 auto;
	position:relative;
	z-index:1;
}
.articles-hero__badge{
	display:inline-flex;
	align-items:center;
	gap:8px;
	padding:6px 16px;
	border-radius:100px;
	background:rgba(98,116,255,.12);
	border:1px solid rgba(98,116,255,.3);
	color:#94a3b8;
	font-family:var(--font-display);
	font-size:clamp(.7rem, .85vw, .8rem);
	font-weight:700;
	letter-spacing:.14em;
	text-transform:uppercase;
	margin-bottom:1.5rem;
}
.pulse-dot{
	width:7px;
	height:7px;
	border-radius:50%;
	background:#22d3ee;
	box-shadow:0 0 10px #22d3ee;
	animation:pulseNeonDot 2s infinite ease-in-out;
}
@keyframes pulseNeonDot{
	0%, 100%{ opacity:1; transform:scale(1); }
	50%{ opacity:.4; transform:scale(.8); }
}
.articles-hero__title{
	font-size:clamp(2.75rem, 6.5vw, 5.2rem);
	line-height:1.02;
	letter-spacing:-.03em;
	color:#fff;
	margin-bottom:clamp(1rem, 2vw, 1.5rem);
	font-family:var(--font-display);
	font-weight:800;
	text-shadow:0 4px 30px rgba(0,0,0,.9);
}
.articles-hero__subtitle{
	font-size:clamp(1rem, 1.25vw, 1.25rem);
	line-height:1.6;
	color:rgba(255,255,255,.75);
	max-width:58ch;
	margin:0 auto;
}

/* ---- Category Pills ---- */
.category-pill{
	display:inline-flex;
	align-items:center;
	font-family:var(--font-display);
	font-size:.72rem;
	font-weight:700;
	letter-spacing:.08em;
	text-transform:uppercase;
	padding:4px 12px;
	border-radius:100px;
	background:rgba(34,211,238,.12);
	color:#22d3ee;
	border:1px solid rgba(34,211,238,.28);
	transition:all .3s ease;
}
.category-pill--featured{
	background:linear-gradient(135deg, rgba(98,116,255,.25) 0%, rgba(34,211,238,.15) 100%);
	color:#99a8ff;
	border-color:rgba(98,116,255,.4);
}
.meta-item{
	display:inline-flex;
	align-items:center;
	gap:5px;
	font-size:.8rem;
	color:rgba(255,255,255,.55);
}

/* ---- Section & Container ---- */
.articles-section{
	padding:clamp(3rem, 6vw, 5rem) clamp(1.25rem, 4vw, 3rem);
}
.articles-container{
	max-width:1240px;
	margin:0 auto;
}

/* ---- Featured Article Card ---- */
.featured-article{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:clamp(1.5rem, 3.5vw, 3rem);
	align-items:center;
	background:linear-gradient(145deg, rgba(20,29,51,.6) 0%, rgba(8,13,24,.85) 100%);
	border:1px solid rgba(255,255,255,.12);
	border-radius:clamp(18px, 2.5vw, 28px);
	padding:clamp(1.2rem, 2vw, 2rem);
	box-shadow:0 25px 60px -15px rgba(0,0,0,.7), 0 0 40px rgba(98,116,255,.08);
	transition:all .4s cubic-bezier(.16,1,.3,1);
	margin-bottom:clamp(3rem, 5vw, 4.5rem);
	position:relative;
	overflow:hidden;
}
.featured-article:hover{
	border-color:rgba(98,116,255,.35);
	box-shadow:0 35px 80px -15px rgba(0,0,0,.85), 0 0 50px rgba(98,116,255,.2);
	transform:translateY(-3px);
}
.featured-article__media{
	position:relative;
	border-radius:clamp(12px, 1.8vw, 20px);
	overflow:hidden;
	aspect-ratio:16/10;
	background:#0b1120;
}
.featured-article__media img{
	width:100%;
	height:100%;
	object-fit:cover;
	transition:transform .6s cubic-bezier(.16,1,.3,1);
}
.featured-article:hover .featured-article__media img{
	transform:scale(1.04);
}
.featured-article__media-glare{
	position:absolute;
	inset:0;
	background:linear-gradient(180deg, rgba(255,255,255,.06) 0%, transparent 60%);
	pointer-events:none;
}
.featured-article__meta-top{
	display:flex;
	align-items:center;
	gap:12px;
	margin-bottom:1rem;
}
.featured-article__title{
	font-size:clamp(1.6rem, 2.8vw, 2.4rem);
	line-height:1.15;
	letter-spacing:-.02em;
	color:#fff;
	margin-bottom:1rem;
	font-family:var(--font-display);
	font-weight:700;
}
.featured-article__title a{
	color:#fff;
	text-decoration:none;
	transition:color .2s;
}
.featured-article__title a:hover{
	color:#22d3ee;
}
.featured-article__excerpt{
	font-size:clamp(.92rem, 1.05vw, 1.05rem);
	line-height:1.6;
	color:rgba(255,255,255,.7);
	margin-bottom:1.5rem;
}
.featured-article__footer{
	display:flex;
	align-items:center;
	justify-content:space-between;
	padding-top:1.2rem;
	border-top:1px solid rgba(255,255,255,.08);
	flex-wrap:wrap;
	gap:12px;
}
.article-author-info{
	display:flex;
	align-items:center;
	gap:8px;
	font-size:.82rem;
	color:rgba(255,255,255,.5);
}
.author-name{
	color:rgba(255,255,255,.8);
	font-weight:600;
}
.btn-read-more{
	display:inline-flex;
	align-items:center;
	gap:8px;
	font-family:var(--font-display);
	font-size:.85rem;
	font-weight:700;
	color:#22d3ee;
	text-decoration:none;
	transition:all .25s ease;
}
.btn-read-more:hover{
	color:#fff;
	transform:translateX(4px);
}

/* ---- Grid Divider ---- */
.articles-grid-divider{
	text-align:center;
	margin-bottom:clamp(2rem, 3.5vw, 3rem);
	position:relative;
}
.articles-grid-divider::before{
	content:'';
	position:absolute;
	left:0;
	right:0;
	top:50%;
	height:1px;
	background:rgba(255,255,255,.08);
	z-index:0;
}
.articles-grid-divider span{
	position:relative;
	z-index:1;
	background:#050810;
	padding:0 20px;
	font-family:var(--font-display);
	font-size:.78rem;
	font-weight:700;
	letter-spacing:.14em;
	text-transform:uppercase;
	color:rgba(255,255,255,.4);
}

/* ---- 3-Column Articles Grid ---- */
.articles-grid{
	display:grid;
	grid-template-columns:repeat(3, 1fr);
	gap:clamp(1.25rem, 2.5vw, 2rem);
	margin-bottom:clamp(3rem, 6vw, 5rem);
}
.article-card{
	background:rgba(18,27,47,.4);
	border:1px solid rgba(255,255,255,.08);
	border-radius:18px;
	overflow:hidden;
	display:flex;
	flex-direction:column;
	transition:all .35s cubic-bezier(.16,1,.3,1);
}
.article-card:hover{
	border-color:rgba(98,116,255,.3);
	transform:translateY(-4px);
	box-shadow:0 20px 45px -10px rgba(0,0,0,.7);
}
.article-card__media{
	aspect-ratio:16/9;
	overflow:hidden;
	position:relative;
	background:#0b1120;
}
.article-card__media img{
	width:100%;
	height:100%;
	object-fit:cover;
	transition:transform .5s cubic-bezier(.16,1,.3,1);
}
.article-card:hover .article-card__media img{
	transform:scale(1.05);
}
.article-card__body{
	padding:1.4rem;
	display:flex;
	flex-direction:column;
	flex:1;
}
.article-card__meta-top{
	display:flex;
	align-items:center;
	gap:10px;
	margin-bottom:.8rem;
}
.article-card__title{
	font-size:clamp(1.15rem, 1.4vw, 1.3rem);
	line-height:1.25;
	color:#fff;
	margin-bottom:.7rem;
	font-family:var(--font-display);
	font-weight:700;
}
.article-card__title a{
	color:#fff;
	text-decoration:none;
	transition:color .2s;
}
.article-card__title a:hover{
	color:#22d3ee;
}
.article-card__excerpt{
	font-size:.88rem;
	line-height:1.55;
	color:rgba(255,255,255,.65);
	margin-bottom:1.2rem;
	flex:1;
}
.article-card__footer{
	display:flex;
	align-items:center;
	justify-content:space-between;
	padding-top:.8rem;
	border-top:1px solid rgba(255,255,255,.06);
	font-size:.8rem;
}
.article-card__link{
	color:#22d3ee;
	text-decoration:none;
	display:inline-flex;
	align-items:center;
	gap:5px;
	font-weight:600;
	transition:all .2s;
}
.article-card__link:hover{
	color:#fff;
	transform:translateX(3px);
}

/* ---- Conversion CTA Banner ---- */
.articles-cta-banner{
	background:linear-gradient(135deg, rgba(35,64,255,.15) 0%, rgba(34,211,238,.08) 50%, rgba(5,8,16,.95) 100%);
	border-top:1px solid rgba(98,116,255,.2);
	border-bottom:1px solid rgba(98,116,255,.1);
	padding:clamp(3.5rem, 6vw, 5.5rem) clamp(1.25rem, 4vw, 3rem);
	text-align:center;
}
.articles-cta-banner__inner{
	max-width:820px;
	margin:0 auto;
}
.articles-cta-banner__title{
	font-size:clamp(1.8rem, 3.5vw, 2.6rem);
	line-height:1.15;
	color:#fff;
	margin-bottom:1rem;
	font-family:var(--font-display);
	font-weight:800;
}
.articles-cta-banner__desc{
	font-size:clamp(.95rem, 1.15vw, 1.15rem);
	line-height:1.55;
	color:rgba(255,255,255,.75);
	max-width:52ch;
	margin:0 auto clamp(1.8rem, 3vw, 2.5rem);
}
.articles-cta-banner__actions{
	display:flex;
	align-items:center;
	justify-content:center;
	flex-wrap:wrap;
	gap:14px;
}

/* =========================================================
   SINGLE ARTICLE VIEW (single.php)
   ========================================================= */

.single-article-main{
	background-color:#050810 !important;
	color:#e2e8f0 !important;
	width:100%;
}

.single-article-container{
	max-width:860px;
	margin:0 auto;
	padding:clamp(8rem, 13vw, 11rem) clamp(1.25rem, 4vw, 2.5rem) clamp(3rem, 6vw, 5rem);
	position:relative;
}

/* ---- Single Article Header ---- */
.single-article-header{
	margin-bottom:clamp(2rem, 3.5vw, 3rem);
}
.article-breadcrumbs{
	display:flex;
	align-items:center;
	gap:8px;
	font-size:.85rem;
	color:rgba(255,255,255,.45);
	margin-bottom:1.5rem;
	flex-wrap:wrap;
}
.article-breadcrumbs a{
	color:rgba(255,255,255,.6);
	text-decoration:none;
	transition:color .2s;
}
.article-breadcrumbs a:hover{
	color:#22d3ee;
}
.article-breadcrumbs .sep{
	color:rgba(255,255,255,.2);
}
.article-breadcrumbs .current{
	color:#22d3ee;
	font-weight:600;
}
.article-meta-badges{
	display:flex;
	align-items:center;
	gap:14px;
	margin-bottom:1.3rem;
}
.single-article__title{
	font-size:clamp(2.4rem, 5.5vw, 4.2rem);
	line-height:1.06;
	letter-spacing:-.025em;
	color:#ffffff;
	margin-bottom:clamp(1.1rem, 2vw, 1.6rem);
	font-family:var(--font-display);
	font-weight:800;
	text-shadow:0 4px 30px rgba(0,0,0,.9);
}
.single-article__lead{
	font-size:clamp(1.12rem, 1.4vw, 1.3rem);
	line-height:1.6;
	color:#94a3b8;
	margin-bottom:clamp(1.6rem, 2.5vw, 2.2rem);
}
.article-author-meta{
	display:flex;
	align-items:center;
	gap:14px;
	padding-top:1.4rem;
	border-top:1px solid rgba(255,255,255,.1);
}
.author-avatar img{
	border-radius:50%;
	border:2px solid #6274ff;
	background:#0b1120;
}
.author-details{
	display:flex;
	flex-direction:column;
	gap:2px;
}
.author-name{
	font-family:var(--font-display);
	font-size:.9rem;
	font-weight:700;
	color:#ffffff;
}
.post-date{
	font-size:.8rem;
	color:rgba(255,255,255,.5);
}

/* ---- Featured Image Media ---- */
.article-featured-media{
	width:100%;
	aspect-ratio:16/9;
	border-radius:clamp(14px, 2.2vw, 22px);
	overflow:hidden;
	position:relative;
	margin:0 0 clamp(2rem, 3.5vw, 3rem);
	background:#0b1120;
	border:1px solid rgba(255,255,255,.12);
	box-shadow:0 25px 60px -10px rgba(0,0,0,.8);
}
.article-featured-media img{
	width:100%;
	height:100%;
	object-fit:cover;
}

/* ---- Social Share Bar ---- */
.article-share-bar{
	display:flex;
	align-items:center;
	gap:10px;
	padding:10px 18px;
	background:rgba(18,27,47,.75);
	backdrop-filter:blur(16px);
	-webkit-backdrop-filter:blur(16px);
	border:1px solid rgba(255,255,255,.12);
	border-radius:100px;
	margin-bottom:clamp(2.2rem, 4vw, 3.5rem);
	width:fit-content;
}
.share-label{
	font-family:var(--font-display);
	font-size:.72rem;
	font-weight:700;
	letter-spacing:.12em;
	text-transform:uppercase;
	color:rgba(255,255,255,.5);
	margin-right:4px;
}
.share-btn{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	width:34px;
	height:34px;
	border-radius:50%;
	background:rgba(255,255,255,.06);
	border:1px solid rgba(255,255,255,.1);
	color:#fff;
	text-decoration:none;
	transition:all .25s ease;
	cursor:pointer;
}
.share-btn:hover{
	transform:translateY(-2px);
}
.share-btn--linkedin:hover{ background:#0077b5; border-color:#0077b5; color:#fff; }
.share-btn--whatsapp:hover{ background:#25d366; border-color:#25d366; color:#fff; }
.share-btn--twitter:hover{ background:#000; border-color:#fff; color:#fff; }
.share-btn--copy:hover{ background:#6274ff; border-color:#6274ff; color:#fff; }

/* ---- Rich Text Editorial Content Typography ---- */
.article-content{
	font-size:clamp(1.08rem, 1.25vw, 1.22rem);
	line-height:1.85;
	color:#cbd5e1;
}
.article-content p{
	margin-bottom:1.8em;
}
.article-content p.lead-text{
	font-size:1.22em;
	line-height:1.7;
	color:#f1f5f9;
	font-weight:400;
}
.article-content h2{
	font-size:clamp(1.65rem, 2.6vw, 2.3rem);
	line-height:1.2;
	letter-spacing:-.02em;
	color:#ffffff;
	margin-top:2.4em;
	margin-bottom:.8em;
	padding-bottom:.4em;
	border-bottom:1px solid rgba(255,255,255,.09);
	font-family:var(--font-display);
	font-weight:800;
}
.article-content h3{
	font-size:clamp(1.25rem, 1.8vw, 1.55rem);
	line-height:1.3;
	color:#22d3ee;
	margin-top:1.8em;
	margin-bottom:.6em;
	font-family:var(--font-display);
	font-weight:700;
}
.article-content ul,
.article-content ol{
	margin:0 0 1.8em 1.5em;
	padding:0;
}
.article-content li{
	margin-bottom:.65em;
	line-height:1.7;
}
.article-content blockquote{
	margin:2.4em 0;
	padding:1.4em 1.8em;
	background:linear-gradient(135deg, rgba(98,116,255,.12) 0%, rgba(34,211,238,.06) 100%);
	border-left:4px solid #22d3ee;
	border-radius:0 14px 14px 0;
	font-size:clamp(1.15rem, 1.35vw, 1.35rem);
	font-style:italic;
	line-height:1.6;
	color:#f8fafc;
}
.article-content strong{
	color:#ffffff;
	font-weight:700;
}
.article-content em{
	color:#93c5fd;
}
.article-content a{
	color:#22d3ee;
	text-decoration:underline;
	text-underline-offset:3px;
	transition:color .2s;
}
.article-content a:hover{
	color:#93c5fd;
}

/* Key Takeaway Box */
.article-content .key-takeaways{
	margin:2.5em 0;
	padding:clamp(1.4rem, 2.5vw, 2rem);
	background:linear-gradient(145deg, rgba(21,31,54,.6) 0%, rgba(9,14,26,.85) 100%);
	border:1.5px solid rgba(34,211,238,.3);
	border-radius:18px;
	box-shadow:0 15px 40px rgba(0,0,0,.5);
}
.article-content .key-takeaways h4{
	display:flex;
	align-items:center;
	gap:8px;
	font-family:var(--font-display);
	font-size:.95rem;
	font-weight:700;
	letter-spacing:.08em;
	text-transform:uppercase;
	color:#22d3ee;
	margin-top:0;
	margin-bottom:1rem;
}
.article-content .key-takeaways ul{
	margin-bottom:0;
}

/* ---- Author Footer Card & Back Link ---- */
.article-author-card{
	display:flex;
	align-items:center;
	gap:18px;
	padding:1.8rem;
	background:rgba(18,27,47,.45);
	border:1px solid rgba(255,255,255,.09);
	border-radius:18px;
	margin-top:clamp(3.5rem, 5vw, 5rem);
	margin-bottom:2rem;
}
.article-author-card__avatar img{
	border-radius:50%;
	border:2px solid #6274ff;
}
.author-title{
	font-family:var(--font-display);
	font-size:1rem;
	font-weight:700;
	color:#fff;
	margin:0 0 .3rem;
}
.author-bio{
	font-size:.86rem;
	line-height:1.5;
	color:rgba(255,255,255,.65);
	margin:0;
}
.article-back-link{
	margin-top:1.5rem;
	margin-bottom:clamp(3rem, 5vw, 4rem);
}
.article-back-link a{
	display:inline-flex;
	align-items:center;
	gap:8px;
	font-family:var(--font-display);
	font-size:.9rem;
	font-weight:700;
	color:#22d3ee;
	text-decoration:none;
	transition:all .25s ease;
}
.article-back-link a:hover{
	color:#fff;
	transform:translateX(-4px);
}

/* ---- Toast Copied ---- */
.toast-copied{
	position:fixed;
	bottom:30px;
	right:30px;
	background:#0b1324;
	color:#22d3ee;
	border:1px solid #22d3ee;
	padding:12px 22px;
	border-radius:100px;
	font-family:var(--font-display);
	font-size:.85rem;
	font-weight:700;
	box-shadow:0 15px 40px rgba(0,0,0,.8);
	opacity:0;
	pointer-events:none;
	transform:translateY(15px);
	transition:all .3s cubic-bezier(.16,1,.3,1);
	z-index:9999;
}
.toast-copied.is-visible{
	opacity:1;
	transform:translateY(0);
}

/* ---- Responsive adjustments ---- */
@media (max-width:900px){
	.featured-article{
		grid-template-columns:1fr;
	}
	.articles-grid{
		grid-template-columns:1fr;
	}
	.article-author-card{
		flex-direction:column;
		text-align:center;
	}
}
