/* =========================================================
   MARBE TELECOM PREMIUM UI
========================================================= */

/* =========================
RESET
========================= */

*{
	margin:0;
	padding:0;
	box-sizing:border-box;
}

html{
	scroll-behavior:smooth;
	min-height:100%;
	background:#02070d;
	scroll-padding-top:82px;
}

body{
	font-family:'Inter',sans-serif;
	font-size:18px;
	color:#ffffff;
	overflow-x:hidden;
	position:relative;
	min-height:100%;
	min-height:100vh;

	background:
	linear-gradient(
		135deg,
		#02070d 0%,
		#07131b 35%,
		#081922 65%,
		#0a1d27 100%
	);
}

/* Continuidad visual: fondo hasta el footer en páginas internas */
body.empresa-page,
body.servicio-page,
body.servicios-page,
body.contacto-page,
body.donde-estamos-page{
	display:flex;
	flex-direction:column;
	min-height:100vh;
}

body.empresa-page > .footer,
body.servicio-page > .footer,
body.servicios-page > .footer,
body.contacto-page > .footer,
body.donde-estamos-page > .footer{
	margin-top:auto;
}

/* =========================================================
NIEBLA / NUBES VERDES
========================================================= */

body::before{
	content:"";
	position:fixed;
	inset:-10%;
	z-index:-3;

	background:

	radial-gradient(
		circle at 75% 20%,
		rgba(0,255,200,0.18) 0%,
		rgba(0,255,200,0.10) 18%,
		transparent 42%
	),

	radial-gradient(
		circle at 95% 45%,
		rgba(0,220,180,0.14) 0%,
		rgba(0,220,180,0.08) 20%,
		transparent 40%
	),

	radial-gradient(
		circle at 55% 40%,
		rgba(0,180,150,0.10) 0%,
		transparent 38%
	),

	radial-gradient(
		circle at 20% 80%,
		rgba(0,255,180,0.12) 0%,
		transparent 40%
	),

	linear-gradient(
		135deg,
		#02070d 0%,
		#07131b 35%,
		#081922 65%,
		#0a1d27 100%
	);

	filter:blur(45px);
	opacity:.95;

	animation:fogMove 18s ease-in-out infinite alternate;
}

/* =========================================================
GRID TECNOLÓGICO
========================================================= */

body::after{
	content:"";
	position:fixed;
	inset:0;
	z-index:-2;

	background-image:

	linear-gradient(
		rgba(255,255,255,0.015) 1px,
		transparent 1px
	),

	linear-gradient(
		90deg,
		rgba(255,255,255,0.015) 1px,
		transparent 1px
	);

	background-size:60px 60px;

	opacity:.22;
	pointer-events:none;
}

/* =========================================================
ANIMACIÓN NUBES
========================================================= */

@keyframes fogMove{

	0%{
		transform:
		scale(1)
		translate(0,0);
	}

	100%{
		transform:
		scale(1.08)
		translate(-20px,-10px);
	}
}

/* =========================
GLOBAL
========================= */

.container{
	width:90%;
	max-width:1200px;
	margin:auto;
}

a{
	text-decoration:none;
}

img{
	max-width:100%;
	display:block;
}

/* =========================
HEADER
========================= */

.header{
	position:sticky;
	top:0;
	z-index:999;

	backdrop-filter:blur(18px);

	background:
	linear-gradient(
		180deg,
		rgba(3,10,15,0.88),
		rgba(3,10,15,0.62)
	);

	border-bottom:
	1px solid rgba(0,255,200,0.08);
}

.nav-container{
	height:82px;

	display:flex;
	align-items:center;
	justify-content:space-between;
}

.logo-left img{
	height:42px;
}

.logo-right img{
	height:28px;
}

.menu{
	display:flex;
	gap:34px;
}

.menu a{
	color:#d6f7f4;
	font-size:18px;
	font-weight:500;

	position:relative;

	transition:.3s;
}

.menu a:hover{
	color:#00ffd0;
}

.menu a::after{
	content:"";
	position:absolute;
	left:0;
	bottom:-7px;

	width:0;
	height:1px;

	background:#00ffd0;

	transition:.3s;
}

.menu a:hover::after{
	width:100%;
}

/* =========================
DROPDOWN
========================= */

.logo-dropdown{
	position:relative;
}

.dropdown-content{
	position:absolute;
	top:120%;
	right:0;

	width:220px;

	background:
	linear-gradient(
		180deg,
		rgba(8,19,29,0.98),
		rgba(6,14,22,0.98)
	);

	border:
	1px solid rgba(0,255,200,0.08);

	border-radius:18px;

	overflow:hidden;

	opacity:0;
	pointer-events:none;

	transform:translateY(10px);

	transition:.3s;

	box-shadow:
	0 20px 40px rgba(0,0,0,0.45);
}

.logo-dropdown:hover .dropdown-content{
	opacity:1;
	pointer-events:auto;
	transform:translateY(0);
}

.dropdown-content a{
	display:block;
	padding:14px 18px;

	color:#d8f4ef;

	border-bottom:
	1px solid rgba(255,255,255,0.03);

	transition:.3s;
}

.dropdown-content a:hover{
	background:#0d1d2b;
	color:#00ffd0;
}

/* =========================================================
HERO 
========================================================= */
.hero{
	position:relative;

	min-height:820px;

	display:flex;
	align-items:center;

	overflow:hidden;
	isolation:isolate;

	background:#02070b;

	border-bottom:
	1px solid rgba(0,255,200,0.06);
}


/* =========================================================
IMAGEN FULL HERO
========================================================= */

.hero-home::before{
	content:"";

	position:absolute;
	inset:0;

	z-index:1;

	background:

	/* overlay oscuro premium */
	linear-gradient(
		90deg,
		rgba(2,7,12,0.92) 0%,
		rgba(2,7,12,0.78) 22%,
		rgba(2,7,12,0.58) 42%,
		rgba(2,7,12,0.34) 58%,
		rgba(2,7,12,0.16) 75%,
		rgba(2,7,12,0.08) 100%
	),

	/* viñeta superior */
	linear-gradient(
		180deg,
		rgba(0,0,0,0.34),
		rgba(0,0,0,0.08)
	),

	/* glow teal izquierda */
	radial-gradient(
		circle at 28% 35%,
		rgba(0,255,210,0.12) 0%,
		transparent 42%
	),

	/* glow central */
	radial-gradient(
		circle at 55% 48%,
		rgba(0,255,180,0.10) 0%,
		transparent 48%
	),

	/* glow torre */
	radial-gradient(
		circle at 78% 32%,
		rgba(0,255,220,0.18) 0%,
		transparent 38%
	),

	url("../images/N-torreTelecomunicacionesH(index).webp");

	background-size:cover;
	background-position:center center;
	background-repeat:no-repeat;

	transform:scale(1.03);

	filter:
	contrast(1.05)
	saturate(1.1)
	brightness(.92);
}


/* =========================================================
NIEBLA CINEMÁTICA
========================================================= */

.hero-home::after{
	content:"";

	position:absolute;
	inset:0;

	z-index:2;

	background:

	radial-gradient(
		circle at 70% 30%,
		rgba(0,255,210,0.14),
		transparent 30%
	),

	radial-gradient(
		circle at 45% 75%,
		rgba(0,180,255,0.10),
		transparent 42%
	),

	radial-gradient(
		circle at 20% 50%,
		rgba(0,255,180,0.06),
		transparent 38%
	);

	mix-blend-mode:screen;

	opacity:.95;
}


/* =========================================================
CONTENIDO
========================================================= */

.hero-content{
	position:relative;

	z-index:5;

	width:100%;
	max-width:1380px;

	margin:auto;

	padding:
	120px
	70px;

	display:flex;
	flex-direction:column;
	align-items:flex-start;
	justify-content:center;
}


/* =========================================================
TEXTOS
========================================================= */

.hero-kicker{
	display:inline-flex;
	align-items:center;
	gap:10px;

	margin-bottom:24px;

	color:#00ffd5;

	font-size:.82rem;
	font-weight:700;
	letter-spacing:3px;

	text-transform:uppercase;
}

.hero-kicker::before{
	content:"";

	width:38px;
	height:1px;

	background:#00ffd5;
}

.hero h1{
	max-width:760px;

	font-size:clamp(2.8rem,4.5vw,5rem);

	line-height:.92;

	font-weight:800;

	letter-spacing:-3px;

	color:#ffffff;

	margin-bottom:32px;

	text-shadow:
	0 10px 30px rgba(0,0,0,.45);
}

.hero p{
	max-width:620px;

	font-size:1.1rem;

	line-height:1.9;

	color:rgba(255,255,255,0.76);

	margin-bottom:42px;
}


/* =========================================================
BOTONES
========================================================= */

.hero-buttons{
	display:flex;
	gap:18px;
	flex-wrap:wrap;
}

.btn-primary{
	padding:1.1rem 2.2rem;

	border-radius:16px;

	background:
	linear-gradient(
		135deg,
		#00ffd0,
		#00c8b4
	);

	color:#041014;

	font-weight:700;

	box-shadow:
	0 10px 30px rgba(0,255,210,.25);

	transition:.35s;
}

.btn-primary:hover{
	transform:translateY(-3px);

	box-shadow:
	0 18px 45px rgba(0,255,210,.38);
}

.btn-secondary{
	padding:1.1rem 2.2rem;

	border-radius:16px;

	border:
	1px solid rgba(255,255,255,.12);

	background:
	rgba(255,255,255,.03);

	backdrop-filter:blur(10px);

	color:#ffffff;

	font-weight:600;

	transition:.35s;
}

.btn-secondary:hover{
	background:
	rgba(255,255,255,.08);

	border-color:
	rgba(0,255,210,.25);
}


/* =========================================================
EMPRESA PAGE
========================================================= */

.empresa-page .empresa-historia{
	padding:120px 0 80px;
	display:flex;
	flex-direction:column;
	gap:120px;
}

.empresa-page .historia-item{
	display:grid;
	grid-template-columns:1.1fr 1fr;
	align-items:center;
	gap:70px;
}

.empresa-page .historia-item.reverse{
	grid-template-columns:1fr 1.1fr;
}

.empresa-page .historia-item.reverse .historia-texto{
	order:2;
}

.empresa-page .historia-item.reverse .historia-img{
	order:1;
}

.empresa-page .historia-texto h2{
	font-size:3rem;
	line-height:1.1;
	margin-bottom:26px;
	color:#ffffff;
}

.empresa-page .historia-texto p{
	font-size:1.05rem;
	line-height:1.9;
	color:#9fb3b7;
	max-width:620px;
}

.empresa-page .historia-puntos{
	margin-top:30px;
	display:flex;
	flex-direction:column;
	gap:14px;
	list-style:none;
}

.empresa-page .historia-puntos li{
	color:#dffcf7;
	font-size:1rem;
}

.empresa-page .historia-img img{
	width:100%;
	border-radius:28px;

	border:
	1px solid rgba(255,255,255,0.06);

	box-shadow:
	0 25px 60px rgba(0,0,0,0.35);

	object-fit:cover;
}

/* =========================================================
TÍTULOS
========================================================= */

.empresa-page .titulo-seccion{
	font-size:3rem;
	margin-bottom:60px;
	text-align:center;
	color:#ffffff;
}

/* =========================================================
GRID GENERAL
========================================================= */

.empresa-page .empresa-grid,
.empresa-page .diferencial-grid,
.empresa-page .sectores-grid{
	display:grid;
	grid-template-columns:repeat(4,minmax(0,1fr));
	gap:28px;
	align-items:stretch;
}

/* Grids reutilizables */
.grid-4{
	display:grid;
	grid-template-columns:repeat(4,minmax(0,1fr));
	gap:28px;
	align-items:stretch;
}

.grid-3-center{
	display:grid;
	grid-template-columns:repeat(3,minmax(0,1fr));
	gap:28px;
	align-items:stretch;
	max-width:1080px;
	margin-left:auto;
	margin-right:auto;
	width:100%;
}

/* =========================================================
CARDS
========================================================= */

.empresa-page .empresa-card,
.empresa-page .diferencial-item,
.empresa-page .sector-card,
.servicio-page .diferencial-item,
.servicio-page .sector-card,
.servicio-page .servicio-box,
.servicio-page .servicio-link-card{
	position:relative;
	height:100%;

	padding:38px 30px;

	border-radius:28px;

	background:
	linear-gradient(
		180deg,
		rgba(8,19,29,0.92),
		rgba(5,12,18,0.95)
	);

	border:
	1px solid rgba(255,255,255,0.06);

	backdrop-filter:blur(12px);

	transition:.35s;

	box-shadow:
	0 15px 35px rgba(0,0,0,0.35);
}

.empresa-page .empresa-card:hover,
.empresa-page .diferencial-item:hover,
.empresa-page .sector-card:hover{
	transform:translateY(-8px);

	border-color:
	rgba(0,255,200,0.22);

	box-shadow:
	0 0 35px rgba(0,255,200,0.10),
	0 20px 45px rgba(0,0,0,0.45);
}

.empresa-page .icono i{
	color:#00ffd0;

	font-size:2rem;

	filter:
	drop-shadow(0 0 12px rgba(0,255,210,.35));
}

.empresa-page .empresa-card h3,
.empresa-page .diferencial-item h3,
.empresa-page .sector-card h3{
	font-size:1.4rem;
	margin-bottom:16px;
	color:#ffffff;
}

.empresa-page .empresa-card p,
.empresa-page .diferencial-item p,
.empresa-page .sector-card p{
	color:#94a9ad;
	line-height:1.8;
	font-size:.96rem;
}

/* =========================================================
NÚMEROS PROCESO
========================================================= */

.empresa-page .proceso-num{
	position:absolute;
	top:24px;
	right:24px;

	font-size:.9rem;
	color:#476064;
}

/* =========================================================
SECCIONES
========================================================= */

.empresa-page .proceso,
.empresa-page .diferencial,
.empresa-page .sectores{
	padding:100px 0;
}

/* =========================================================
CTA FINAL
========================================================= */

.empresa-page .cta-final{
	padding:120px 0;
	text-align:center;
}

.empresa-page .cta-final h2{
	font-size:3rem;
	margin-bottom:30px;
}

.empresa-page .cta-button{
	display:inline-flex;
	align-items:center;
	justify-content:center;

	padding:1.1rem 2.4rem;

	border-radius:18px;

	background:
	linear-gradient(
		135deg,
		#00ffd0,
		#00c8b4
	);

	color:#041014;
	font-weight:700;

	transition:.35s;

	box-shadow:
	0 10px 30px rgba(0,255,210,.25);
}

.empresa-page .cta-button:hover{
	transform:translateY(-4px);

	box-shadow:
	0 18px 45px rgba(0,255,210,.38);
}

.historia-img{
	position:relative;
}

.historia-img::after{
	content:"";

	position:absolute;
	inset:0;

	border-radius:28px;

	background:
	linear-gradient(
		180deg,
		transparent,
		rgba(0,0,0,.28)
	);

	pointer-events:none;
}

/* =========================================================
BANNER EMPRESA
========================================================= */

.empresa-banner{
	padding:120px 0 70px;
	position:relative;
}

.empresa-banner::before{
	content:"";

	position:absolute;
	inset:0;

	background:
	radial-gradient(
		circle at center,
		rgba(0,255,210,0.10),
		transparent 60%
	);

	pointer-events:none;
}

.empresa-banner-grid{
	display:grid;
	grid-template-columns:repeat(3,1fr);
	gap:26px;
}

.empresa-banner-grid div{
	position:relative;

	padding:45px 30px;

	text-align:center;

	border-radius:28px;

	background:
	linear-gradient(
		180deg,
		rgba(8,19,29,0.92),
		rgba(5,12,18,0.95)
	);

	border:
	1px solid rgba(255,255,255,0.06);

	backdrop-filter:blur(12px);

	box-shadow:
	0 15px 35px rgba(0,0,0,0.35);

	transition:.35s;
}

.empresa-banner-grid div:hover{
	transform:translateY(-8px);

	border-color:
	rgba(0,255,200,0.22);

	box-shadow:
	0 0 35px rgba(0,255,200,0.10),
	0 20px 45px rgba(0,0,0,0.45);
}

.empresa-banner-grid h3{
	font-size:3.4rem;
	color:#00ffd0;
	margin-bottom:12px;
}

.empresa-banner-grid p{
	color:#9eb2b5;
	font-size:1rem;
}

.glass-image{
	position:relative;
}

.glass-image::before{
	content:"";

	position:absolute;
	inset:0;

	border-radius:28px;

	background:
	linear-gradient(
		135deg,
		rgba(255,255,255,0.08),
		transparent 40%
	);

	pointer-events:none;
}



/* =========================================================
RESPONSIVE
========================================================= */

@media(max-width:1100px){

	.empresa-page .historia-item,
	.empresa-page .historia-item.reverse{
		grid-template-columns:1fr;
	}

	.empresa-page .historia-item.reverse .historia-texto,
	.empresa-page .historia-item.reverse .historia-img{
		order:initial;
	}

	.empresa-page .empresa-grid,
	.empresa-page .diferencial-grid,
	.empresa-page .sectores-grid,
	.grid-4,
	.grid-3-center,
	.servicio-page .diferencial-grid,
	.servicio-page .sectores-grid{
		grid-template-columns:repeat(2,minmax(0,1fr));
	}

	.grid-3-center{
		max-width:100%;
	}
}

@media(max-width:768px){

	.empresa-page .empresa-grid,
	.empresa-page .diferencial-grid,
	.empresa-page .sectores-grid,
	.grid-4,
	.grid-3-center,
	.servicio-page .diferencial-grid,
	.servicio-page .sectores-grid{
		grid-template-columns:1fr;
	}

	.empresa-page .historia-texto h2,
	.empresa-page .titulo-seccion,
	.empresa-page .cta-final h2{
		font-size:2.2rem;
	}

	.empresa-page .empresa-historia{
		gap:80px;
	}
}


/* =========================================================
RESPONSIVE
========================================================= */

@media(max-width:900px){

	.hero{
		min-height:auto;
		padding:140px 0 100px;
	}

	.hero-content{
		padding:0 28px;
	}

	.hero h1{
		font-size:3.4rem;
		line-height:.96;
	}

	.hero::before{
		background-position:72% center;
	}
}

@media(max-width:640px){

	.hero h1{
		font-size:2.8rem;
	}

	.hero-buttons{
		flex-direction:column;
		width:100%;
	}

	.btn-primary,
	.btn-secondary{
		width:100%;
		text-align:center;
	}
}

/* =========================================================
RESPONSIVE
========================================================= */

@media(max-width:1200px){

	.hero{
		min-height:760px;
	}

	.hero h1{
		max-width:680px;
		font-size:5rem;
	}

	.hero::before{
		background-position:72% center;
	}
}


@media(max-width:900px){

	.hero{
		min-height:auto;

		padding:140px 0 100px;
	}

	.hero-content{
		padding:
		0
		28px
		0
		28px;
	}

	.hero h1{
		font-size:3.6rem;

		letter-spacing:-2px;
	}

	.hero p{
		font-size:1rem;
	}

	.hero::before{

		background:

		linear-gradient(
			180deg,
			rgba(2,7,12,0.90),
			rgba(2,7,12,0.72)
		),

		url("../images/N-torreTelecomunicacionesH(index).webp");

		background-size:cover;
		background-position:68% center;
	}
}


@media(max-width:640px){

	.hero h1{
		font-size:3rem;
		line-height:1;
	}

	.hero-buttons{
		flex-direction:column;
		align-items:stretch;
		width:100%;
	}

	.btn-primary,
	.btn-secondary{
		text-align:center;
		width:100%;
	}
}

/* =========================
STATS PREMIUM LIMPIO
========================= */

.stats{
	position:relative;
	z-index:10;

	margin-top:80px;
	margin-bottom:100px;
}

.stats-grid{
	display:grid;
	grid-template-columns:repeat(4,1fr);
	gap:22px;
}

.stat-card{
	position:relative;

	padding:34px 20px;

	text-align:center;

	border-radius:24px;

	overflow:hidden;

	background:
	linear-gradient(
		180deg,
		rgba(8,19,29,0.96),
		rgba(5,12,18,0.98)
	);

	border:1px solid rgba(0,255,200,0.10);

	backdrop-filter:blur(16px);

	transition:transform .35s ease, border-color .35s ease, box-shadow .35s ease;

	box-shadow:
	0 20px 45px rgba(0,0,0,0.42);
}

.stat-card:hover{
	transform:translateY(-8px);
	border-color:rgba(0,255,200,0.28);
	box-shadow:
	0 26px 54px rgba(0,0,0,0.48),
	0 0 34px rgba(0,255,200,0.10),
	inset 0 1px 0 rgba(0,255,200,0.08);
}

.stat-card i{
	display:inline-block;
	color:#00ffd0;
	font-size:34px;
	margin-bottom:20px;
	filter:drop-shadow(0 0 14px rgba(0,255,208,0.30));
}

.stat-card h3{
	font-size:42px;
	margin-bottom:10px;
}

.stat-card p{
	color:#8ba3a7;
}

/* =========================
SECTION TITLES
========================= */

.experience,
.servicios{
	padding-top:90px;
}

.section-tag{
	display:block;

	color:#00ffd0;

	font-size:12px;
	letter-spacing:2px;

	margin-bottom:18px;
}

.section-title,
.experience h2{
	font-size:44px;
	line-height:1.2;

	margin-bottom:50px;

	max-width:850px;
}

.section-subtitle{
	max-width:720px;
	margin:-25px 0 55px;
	color:#9ab0b3;
	line-height:1.8;
	font-size:1.05rem;
}

/* =========================
SERVICES
========================= */

.services-hero{
	position: relative;
	width: 100%;
	height: 650px;
	border-radius: 60px;   /* REDONDITO */
	overflow: hidden; 
	
	box-shadow:
    0 10px 30px rgba(0,0,0,0.08),
    0 25px 60px rgba(0,0,0,0.12);/* IMPORTANTE */
  }

  .bg-image{
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
  }

.services-grid{
	display:grid;
	grid-template-columns:repeat(3,1fr);
	gap:24px;
}

.service-card{
	position:relative;

	overflow:hidden;

	padding:36px;

	border-radius:24px;

	background:
	linear-gradient(
		180deg,
		rgba(8,19,29,0.92),
		rgba(5,12,18,0.95)
	);

	border:
	1px solid rgba(255,255,255,0.06);

	backdrop-filter:blur(12px);

	transition:.35s;

	box-shadow:
	0 15px 35px rgba(0,0,0,0.35);
}

.service-card::before{
	content:"";

	position:absolute;
	inset:0;

	background:
	linear-gradient(
		135deg,
		rgba(0,255,200,0.05),
		transparent 60%
	);

	opacity:0;

	transition:.35s;
}

.service-card:hover::before{
	opacity:1;
}

.service-card:hover{
	transform:translateY(-8px);

	border-color:
	rgba(0,255,200,0.22);

	box-shadow:
	0 0 35px rgba(0,255,200,0.10),
	0 20px 45px rgba(0,0,0,0.45);
}

.service-number{
	position:absolute;

	top:20px;
	right:24px;

	font-size:14px;

	color:#3f5a5d;
}

.service-card i{
	color:#00ffd0;

	font-size:34px;

	margin-bottom:24px;
}

.service-card h3{
	margin-bottom:14px;
	font-size:24px;
	color:#e9fffb;
}

.service-card p{
	color:#8ba3a7;
	line-height:1.7;
}

/* =========================
CTA
========================= */

.cta-section{
	padding:100px 0;
}

.cta-box{
	position:relative;

	overflow:hidden;

	border-radius:32px;

	padding:80px;

	text-align:center;

	background:
	linear-gradient(
		135deg,
		rgba(0,255,200,0.06),
		rgba(0,255,200,0.02)
	);

	border:
	1px solid rgba(0,255,200,0.08);

	backdrop-filter:blur(16px);

	box-shadow:
	0 25px 60px rgba(0,0,0,0.35);
}

.cta-box::before{
	content:"";

	position:absolute;

	width:120%;
	height:320px;

	left:-10%;
	bottom:-220px;

	background:
	radial-gradient(
		circle,
		rgba(0,255,200,0.18),
		transparent 70%
	);

	filter:blur(40px);
}

.cta-box h2{
	position:relative;
	z-index:2;

	max-width:720px;

	margin:auto auto 32px;

	font-size:46px;
	line-height:1.2;
}

/* =========================
FOOTER
========================= */

.footer{
	border-top:
	1px solid rgba(255,255,255,0.05);

	padding:40px 0;

	background:
	rgba(0,0,0,0.18);

	backdrop-filter:blur(12px);
}

.footer-content{
	display:flex;
	justify-content:space-between;
	align-items:center;
}

.footer-left img{
	height:40px;

	margin-bottom:12px;
}

.footer-left p{
	color:#8ea4a8;
}

.footer-right{
	display:flex;
	flex-direction:column;
	gap:10px;
}

.footer-right p{
	color:#8ea4a8;
	font-size:14px;
}

.footer-right i{
	color:#00ffd0;
	margin-right:8px;
}

.menu a.active{
	color:#00ffd0;
}

.menu a.active::after{
	width:100%;
}

/* =========================================================
PAGE HERO GLOBAL
========================================================= */

.page-hero{
	position:relative;

	min-height:520px;

	display:flex;
	align-items:center;

	overflow:hidden;

	border-bottom:
	1px solid rgba(0,255,200,0.08);
}

/* =========================
FONDO NUBES
========================= */

.page-hero::before{
	content:"";

	position:absolute;
	inset:0;

	background:

	linear-gradient(
		90deg,
		rgba(2,7,12,0.92) 0%,
		rgba(2,7,12,0.78) 35%,
		rgba(2,7,12,0.55) 58%,
		rgba(2,7,12,0.20) 100%
	),

	url("../images/N-FondoNubes(marbeComunicaciones).webp");

	background-size:cover;
	background-position:center;

	transform:scale(1.05);

	filter:
	brightness(.75)
	contrast(1.1)
	saturate(1.05);
}

/* =========================
OVERLAY LIGHT
========================= */

.page-hero-overlay{
	position:absolute;
	inset:0;

	background:

	radial-gradient(
		circle at 70% 30%,
		rgba(0,255,210,0.16),
		transparent 32%
	),

	radial-gradient(
		circle at 45% 75%,
		rgba(0,180,255,0.08),
		transparent 42%
	);

	mix-blend-mode:screen;

	z-index:2;
}

/* =========================
CONTENIDO
========================= */

.page-hero-content{
	position:relative;
	z-index:5;

	padding-top:80px;
	padding-bottom:80px;
}

.page-kicker{
	display:inline-flex;
	align-items:center;
	gap:12px;

	margin-bottom:24px;

	color:#00ffd0;

	font-size:.82rem;
	font-weight:700;
	letter-spacing:3px;

	text-transform:uppercase;
}

.page-kicker::before{
	content:"";

	width:42px;
	height:1px;

	background:#00ffd0;
}

.page-hero h1{
	font-size:clamp(3rem,5vw,5.5rem);

	line-height:.92;

	font-weight:800;

	letter-spacing:-3px;

	max-width:760px;

	margin-bottom:28px;

	text-shadow:
	0 10px 30px rgba(0,0,0,.45);
}

.page-hero p{
	max-width:620px;

	font-size:1.08rem;

	line-height:1.9;

	color:rgba(255,255,255,.74);
}

/* =========================================================
HERO PREMIUM SECUNDARIO
========================================================= */

.hero-secondary{
	position:relative;

	min-height:85vh;

	display:flex;
	align-items:center;

	overflow:hidden;
	isolation:isolate;

	padding:
	clamp(72px,10vh,120px)
	0
	clamp(56px,8vh,80px);

	background-color:#02070d;

	background-image:
	url("../images/N-FondoNubes(marbeComunicaciones).webp");

	background-size:cover;
	background-position:center;
	background-repeat:no-repeat;
}

/* =========================================================
OVERLAY OSCURO
========================================================= */

.hero-secondary-overlay{
	position:absolute;
	inset:0;

	z-index:1;

	background:

	linear-gradient(
		90deg,
		rgba(2,7,12,0.92) 0%,
		rgba(2,7,12,0.82) 30%,
		rgba(2,7,12,0.55) 60%,
		rgba(2,7,12,0.35) 100%
	),

	linear-gradient(
		180deg,
		rgba(0,0,0,0.25),
		rgba(0,0,0,0.55)
	);
}

/* =========================================================
GLOW AMBIENTAL
========================================================= */

.hero-secondary-glow{
	position:absolute;
	inset:0;

	z-index:2;

	background:

	radial-gradient(
		circle at 20% 40%,
		rgba(0,255,200,0.10),
		transparent 35%
	),

	radial-gradient(
		circle at 80% 50%,
		rgba(0,180,255,0.12),
		transparent 40%
	),

	radial-gradient(
		circle at 60% 80%,
		rgba(0,255,180,0.06),
		transparent 35%
	);

	filter:blur(20px);

	pointer-events:none;
}

/* =========================================================
CONTAINER
========================================================= */

.hero-secondary-container{
	position:relative;
	z-index:5;

	display:grid;

	/* MÁS ESPACIO DERECHA */
	grid-template-columns:0.9fr 1.4fr;

	align-items:center;
	gap:40px;
}

/* =========================================================
LEFT CONTENT
========================================================= */

.hero-secondary-content{
	max-width:700px;
}

/* KICKER */

.hero-kicker{
	display:inline-flex;
	align-items:center;
	gap:12px;

	margin-bottom:26px;

	color:#00ffd0;

	font-size:.78rem;
	font-weight:700;

	letter-spacing:3px;
	text-transform:uppercase;
}

.hero-kicker::before{
	content:"";

	width:42px;
	height:1px;

	background:#00ffd0;
}

/* TITLE */

.hero-secondary h1{
	font-size:clamp(3rem,5vw,5.5rem);

	line-height:.95;

	font-weight:800;

	letter-spacing:-3px;

	color:#ffffff;

	margin-bottom:32px;

	text-shadow:
	0 10px 40px rgba(0,0,0,.45);
}

/* TEXT */

.hero-secondary p{
	max-width:620px;

	font-size:1.08rem;

	line-height:1.9;

	color:rgba(255,255,255,0.72);

	margin-bottom:42px;
}

/* =========================================================
BUTTONS
========================================================= */

.hero-buttons{
	display:flex;
	gap:18px;
	flex-wrap:wrap;
}

.btn-primary{
	display:inline-flex;
	align-items:center;
	justify-content:center;

	padding:1.1rem 2.4rem;

	border-radius:18px;

	background:
	linear-gradient(
		135deg,
		#00ffd0,
		#00c2a8
	);

	color:#041014;

	font-weight:700;

	box-shadow:
	0 12px 35px rgba(0,255,210,.28);

	transition:.35s;
}

.btn-primary:hover{
	transform:translateY(-4px);

	box-shadow:
	0 20px 50px rgba(0,255,210,.40);
}

/* SECONDARY */

.btn-secondary{
	display:inline-flex;
	align-items:center;
	justify-content:center;

	padding:1.1rem 2.4rem;

	border-radius:18px;

	background:
	rgba(255,255,255,0.04);

	backdrop-filter:blur(14px);

	border:
	1px solid rgba(255,255,255,0.08);

	color:#ffffff;

	font-weight:600;

	transition:.35s;
}

.btn-secondary:hover{
	transform:translateY(-4px);

	border-color:
	rgba(0,255,210,.25);

	background:
	rgba(255,255,255,0.08);
}

/* =========================================================
VISUAL DERECHA HERO
========================================================= */

.hero-secondary-visual{
	display:flex;
	justify-content:flex-end;
	align-items:center;

	padding-left:80px;
}

.hero-image-wrapper{
	position:relative;

	background:none;
	border:none;
	box-shadow:none;
	padding:0;

	animation:heroFloat 6s ease-in-out infinite;
}

.hero-image-wrapper::before{
	display:none;
}

.hero-image-wrapper img{
	width:760px;
	max-width:none;

	height:auto;

	object-fit:contain;

	display:block;

	border-radius:0;

	box-shadow:none;

	transition:transform .5s ease;
}

.hero-image-wrapper:hover img{
	transform:
	translateY(-8px)
	scale(1.02);
}

/* =========================================================
SERVICIOS HERO FIX
SOLO SERVICIOS.HTML
========================================================= */

.servicios-visual{
	display:flex;
	justify-content:flex-end;
	align-items:center;

	padding-left:60px;
}

/* CARD */

.servicios-image-card{
	position:relative;

	width:100%;
	max-width:860px;
	

	border-radius:34px;

	overflow:hidden;

	background:
	linear-gradient(
		180deg,
		rgba(8,19,29,0.92),
		rgba(5,12,18,0.96)
	);

	border:
	1px solid rgba(255,255,255,0.06);

	box-shadow:
	0 30px 70px rgba(0,0,0,0.45);

	backdrop-filter:blur(12px);

	animation:heroFloat 6s ease-in-out infinite;

	transform:translateX(40px);
}

/* GLOW */

.servicios-image-glow{
	position:absolute;
	inset:0;

	z-index:2;

	background:

	radial-gradient(
		circle at 75% 20%,
		rgba(0,255,210,0.18),
		transparent 35%
	),

	radial-gradient(
		circle at 25% 80%,
		rgba(0,180,255,0.12),
		transparent 40%
	);

	pointer-events:none;
}

/* IMAGEN */

.servicios-hero-img{
	position:relative;
	z-index:1;

	width:100%;
	height:auto;

	display:block;

	object-fit:cover;

	filter:
	contrast(1.04)
	saturate(1.05)
	brightness(.95);

	transition:
	transform .7s ease,
	filter .7s ease;
}

/* HOVER */

.servicios-image-card:hover .servicios-hero-img{
	transform:scale(1.03);

	filter:
	contrast(1.08)
	saturate(1.08)
	brightness(1);
}

/* =========================================================
RESPONSIVE
========================================================= */

@media(max-width:1100px){

	.servicios-visual{
		justify-content:center;
		padding-left:0;
	}

	.servicios-image-card{
		max-width:620px;
		transform:none;
	}
}

@media(max-width:768px){

	.servicios-image-card{
		border-radius:24px;
	}
}

/* =========================================================
ANIMACIÓN
========================================================= */

@keyframes heroFloat{

	0%{
		transform:translateY(0px);
	}

	50%{
		transform:translateY(-10px);
	}

	100%{
		transform:translateY(0px);
	}
}

/* =========================================================
MOBILE
========================================================= */

@media(max-width:768px){

	.hero-secondary{
		padding:140px 0 80px;
		min-height:auto;
	}

	.hero-secondary-container{
		gap:40px;
	}

	.hero-secondary-content{
		text-align:left;
	}

	.hero-secondary h1{
		font-size:3rem;
		line-height:1;
	}

	.hero-secondary p{
		font-size:1rem;
		line-height:1.8;
	}

	.hero-buttons{
		flex-direction:column;
		align-items:stretch;
	}

	.btn-primary,
	.btn-secondary{
		width:100%;
	}

	.servicios-hero-img{
		max-width:100%;
		border-radius:20px;
	}
}

/* =========================================================
SMALL MOBILE
========================================================= */

@media(max-width:540px){

	.hero-secondary h1{
		font-size:2.4rem;
	}

	.hero-kicker{
		font-size:.7rem;
		letter-spacing:2px;
	}
}


/* =========================================================
ANIMACIÓN
========================================================= */

@keyframes heroFloat{

	0%{
		transform:translateY(0px);
	}

	50%{
		transform:translateY(-10px);
	}

	100%{
		transform:translateY(0px);
	}
}

/* =========================================================
RESPONSIVE
========================================================= */

@media(max-width:1100px){

	.hero-secondary-visual{
		justify-content:center;
	}

	.hero-image-wrapper{
		max-width:620px;
	}
}

@media(max-width:768px){

	.hero-image-wrapper{
		max-width:100%;
		border-radius:28px;
	}

	.hero-image-wrapper img{
		border-radius:28px;
	}
}


  /* =========================================================
CONTACTO PREMIUM PAGE
========================================================= */

.contacto-page .contacto-hero{
	min-height:calc(100vh - 82px);
}

.contacto-hero-container{
	grid-template-columns:1fr 1fr;
	gap:80px;
	align-items:center;
}

/* =========================================================
DATOS CONTACTO
========================================================= */

.contacto-data{
	margin-top:40px;

	display:flex;
	flex-direction:column;
	gap:18px;
}

.contacto-data-item{
	display:flex;
	align-items:center;
	gap:16px;

	color:#d8f5ef;

	font-size:1rem;
}

.contacto-data-item i{
	width:46px;
	height:46px;

	display:flex;
	align-items:center;
	justify-content:center;

	border-radius:14px;

	background:
	rgba(255,255,255,0.04);

	border:
	1px solid rgba(255,255,255,0.06);

	color:#00ffd0;

	font-size:1rem;

	backdrop-filter:blur(10px);
}

/* =========================================================
FORM WRAPPER
========================================================= */

.contact-form-wrapper{
	position:relative;
	z-index:5;
}

.contact-form-card{
	position:relative;

	padding:42px;

	border-radius:34px;

	background:
	linear-gradient(
		180deg,
		rgba(8,19,29,0.92),
		rgba(5,12,18,0.96)
	);

	border:
	1px solid rgba(255,255,255,0.06);

	backdrop-filter:blur(20px);

	box-shadow:
	0 25px 60px rgba(0,0,0,0.40);

	overflow:hidden;
}

.contact-form-card::before{
	content:"";

	position:absolute;

	width:420px;
	height:420px;

	top:-220px;
	right:-120px;

	background:
	radial-gradient(
		circle,
		rgba(0,255,210,0.16),
		transparent 70%
	);

	filter:blur(30px);

	pointer-events:none;
}

/* =========================================================
TOP FORM
========================================================= */

.form-top{
	position:relative;
	z-index:2;

	margin-bottom:34px;
}

.form-tag{
	display:inline-flex;
	align-items:center;

	padding:10px 16px;

	border-radius:999px;

	background:
	rgba(0,255,210,0.08);

	border:
	1px solid rgba(0,255,210,0.12);

	color:#00ffd0;

	font-size:.78rem;
	font-weight:700;

	letter-spacing:1px;

	text-transform:uppercase;

	margin-bottom:18px;
}

.form-top h2{
	font-size:2.2rem;

	margin-bottom:14px;

	color:#ffffff;
}

.form-top p{
	color:#93a8ac;
	line-height:1.8;
}

/* =========================================================
FORM GRID
========================================================= */

.form-grid{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:18px;

	margin-bottom:18px;
}


.form-grid .input-wide{
	grid-column:1 / -1;
}

/* =========================================================
INPUTS
========================================================= */

.input-group{
	position:relative;
}

.input-group i{
	position:absolute;

	top:50%;
	left:18px;

	transform:translateY(-50%);

	color:#00ffd0;

	font-size:.95rem;
}

.input-group input,
.input-group textarea{
	width:100%;

	background:
	rgba(255,255,255,0.03);

	border:
	1px solid rgba(255,255,255,0.06);

	border-radius:18px;

	padding:
	18px
	18px
	18px
	52px;

	color:#ffffff;

	font-family:'Inter',sans-serif;
	font-size:.98rem;

	outline:none;

	transition:.3s;
}

.input-group textarea{
	min-height:180px;

	resize:vertical;

	padding-top:20px;
}

.input-group.textarea i{
	top:24px;
	transform:none;
}

.input-group input:focus,
.input-group textarea:focus{
	border-color:
	rgba(0,255,210,0.35);

	background:
	rgba(255,255,255,0.05);

	box-shadow:
	0 0 0 4px rgba(0,255,210,0.06);
}

.input-group input::placeholder,
.input-group textarea::placeholder{
	color:#7f9499;
}

/* =========================================================
BUTTON
========================================================= */

.btn-enviar{
	width:100%;

	margin-top:24px;

	border:none;

	padding:1.15rem 2rem;

	border-radius:18px;

	background:
	linear-gradient(
		135deg,
		#00ffd0,
		#00c2a8
	);

	color:#041014;

	font-weight:700;
	font-size:1rem;

	cursor:pointer;

	transition:.35s;

	box-shadow:
	0 12px 35px rgba(0,255,210,.25);
}

.btn-enviar:hover{
	transform:translateY(-3px);

	box-shadow:
	0 20px 45px rgba(0,255,210,.35);
}

/* =========================================================
SUCCESS
========================================================= */

#success-msg{
	display:none;

	margin-top:22px;

	padding:16px;

	border-radius:16px;

	background:
	rgba(0,255,180,0.08);

	border:
	1px solid rgba(0,255,180,0.18);

	color:#8fffe1;

	text-align:center;
}

/* =========================================================
EXTRA BLOCK
========================================================= */

.contacto-extra{
	padding:100px 0;
}

.contacto-extra-grid{
	display:grid;
	grid-template-columns:repeat(3,1fr);
	gap:28px;
}

.contacto-extra-card{
	position:relative;

	padding:40px 32px;

	border-radius:28px;

	background:
	linear-gradient(
		180deg,
		rgba(8,19,29,0.92),
		rgba(5,12,18,0.95)
	);

	border:
	1px solid rgba(255,255,255,0.06);

	backdrop-filter:blur(12px);

	transition:.35s;

	box-shadow:
	0 15px 35px rgba(0,0,0,0.35);
}

.contacto-extra-card:hover{
	transform:translateY(-8px);

	border-color:
	rgba(0,255,200,0.22);

	box-shadow:
	0 0 35px rgba(0,255,200,0.10),
	0 20px 45px rgba(0,0,0,0.45);
}

.contacto-extra-card .icono{
	margin-bottom:22px;
}

.contacto-extra-card .icono i{
	font-size:2rem;

	color:#00ffd0;
}

.contacto-extra-card h3{
	font-size:1.4rem;

	margin-bottom:16px;
}

.contacto-extra-card p{
	color:#94a9ad;

	line-height:1.8;
}

/* =========================================================
DONDE ESTAMOS PAGE
========================================================= */

.donde-estamos-page .ubicacion-section{
	padding:120px 0;
}

.ubicacion-grid{
	display:grid;
	grid-template-columns:1.2fr .9fr;
	gap:40px;
	align-items:stretch;
}

/* =========================================================
MAPA
========================================================= */

.mapa-box{
	position:relative;

	border-radius:32px;

	overflow:hidden;

	background:
	linear-gradient(
		180deg,
		rgba(8,19,29,0.92),
		rgba(5,12,18,0.96)
	);

	border:
	1px solid rgba(255,255,255,0.06);

	box-shadow:
	0 20px 50px rgba(0,0,0,0.45);
}

.mapa-box iframe{
	width:100%;
	height:100%;
	min-height:520px;
	border:0;

	filter:
	contrast(1.05)
	saturate(.95)
	brightness(.92);
}

/* =========================================================
INFO BOX
========================================================= */

.ubicacion-info{
	position:relative;

	padding:50px 42px;

	border-radius:32px;

	background:
	linear-gradient(
		180deg,
		rgba(8,19,29,0.92),
		rgba(5,12,18,0.96)
	);

	border:
	1px solid rgba(255,255,255,0.06);

	backdrop-filter:blur(14px);

	box-shadow:
	0 20px 50px rgba(0,0,0,0.40);
}

.ubicacion-info h2{
	font-size:3rem;
	line-height:1.05;

	margin:
	18px
	0
	24px;

	color:#ffffff;
}

.ubicacion-info p{
	color:#96adb1;
	line-height:1.9;

	font-size:1rem;
}

/* =========================================================
CARDS INFO
========================================================= */

.ubicacion-cards{
	margin-top:40px;

	display:flex;
	flex-direction:column;
	gap:22px;
}

.ubicacion-card{
	display:flex;
	align-items:flex-start;
	gap:20px;

	padding:24px;

	border-radius:24px;

	background:
	rgba(255,255,255,0.03);

	border:
	1px solid rgba(255,255,255,0.05);

	transition:.35s;
}

.ubicacion-card:hover{
	transform:translateY(-4px);

	border-color:
	rgba(0,255,200,0.18);

	box-shadow:
	0 0 25px rgba(0,255,200,0.08);
}

.ubicacion-card i{
	color:#00ffd0;

	font-size:1.4rem;

	margin-top:4px;

	filter:
	drop-shadow(0 0 10px rgba(0,255,210,.35));
}

.ubicacion-card h3{
	color:#ffffff;

	font-size:1.1rem;

	margin-bottom:6px;
}

.ubicacion-card p{
	color:#9ab0b3;

	line-height:1.7;
}

/* =========================================================
VISITA SECTION
========================================================= */

.visita-section{
	padding:
	40px
	0
	120px;
}

/* =========================================================
IMAGEN UBICACIÓN PREMIUM
========================================================= */

.ubicacion-image{
	width:100%;

	max-width:900px;

	margin:
	0 auto
	60px;

	border-radius:32px;

	overflow:hidden;

	position:relative;

	border:
	1px solid rgba(255,255,255,0.08);

	box-shadow:
	0 25px 60px rgba(0,0,0,0.45);

	background:
	linear-gradient(
		180deg,
		rgba(8,19,29,0.92),
		rgba(5,12,18,0.95)
	);

	transition:.4s;
}

/* GLOW */

.ubicacion-image::before{
	content:"";

	position:absolute;
	inset:0;

	background:
	linear-gradient(
		135deg,
		rgba(0,255,200,0.08),
		transparent 45%
	);

	pointer-events:none;

	z-index:2;
}

/* IMAGEN */

.ubicacion-image img{
	width:100%;

	height:500px;

	object-fit:cover;

	display:block;

	transition:
	transform .6s ease,
	filter .6s ease;

	filter:
	contrast(1.05)
	saturate(1.05);
}

/* =========================================================
SERVICIOS PREMIUM 3 + 3
========================================================= */

.servicios-premium{
	padding:110px 0;
}

.servicios-premium .titulo-seccion{
	font-size:3rem;
	margin-bottom:60px;
	text-align:center;
	color:#ffffff;
}

.servicios-premium .sectores-grid{
	display:grid;
	grid-template-columns:repeat(3,1fr);
	gap:28px;
}

.servicios-premium .sector-card{
	position:relative;
	min-height:280px;

	padding:42px 34px;

	border-radius:30px;

	overflow:hidden;

	background:
	linear-gradient(
		180deg,
		rgba(8,19,29,0.94),
		rgba(5,12,18,0.98)
	);

	border:1px solid rgba(255,255,255,0.06);

	box-shadow:
	0 18px 40px rgba(0,0,0,0.38);

	transition:.4s ease;
}

.servicios-premium .sector-card::before{
	content:"";

	position:absolute;
	inset:0;

	background:
	radial-gradient(
		circle at top right,
		rgba(0,255,210,0.14),
		transparent 42%
	);

	opacity:0;
	transition:.4s ease;
}

.servicios-premium .sector-card::after{
	content:"Ver servicio →";

	position:absolute;
	left:34px;
	bottom:28px;

	color:#00ffd0;

	font-size:.9rem;
	font-weight:700;

	opacity:0;
	transform:translateY(12px);

	transition:.35s ease;
}

.servicios-premium .sector-card:hover{
	transform:translateY(-10px) scale(1.02);

	border-color:rgba(0,255,200,0.25);

	box-shadow:
	0 0 45px rgba(0,255,200,0.12),
	0 25px 60px rgba(0,0,0,0.55);
}

.servicios-premium .sector-card:hover::before{
	opacity:1;
}

.servicios-premium .sector-card:hover::after{
	opacity:1;
	transform:translateY(0);
}

.servicios-premium .icono{
	width:64px;
	height:64px;

	display:flex;
	align-items:center;
	justify-content:center;

	margin-bottom:28px;

	border-radius:20px;

	background:rgba(0,255,210,0.07);

	border:1px solid rgba(0,255,210,0.12);
}

.servicios-premium .icono i{
	color:#00ffd0;
	font-size:1.8rem;

	filter:
	drop-shadow(0 0 14px rgba(0,255,210,.35));
}

.servicios-premium .sector-card h3{
	font-size:1.45rem;
	margin-bottom:16px;
	color:#ffffff;
}

.servicios-premium .sector-card p{
	color:#9ab0b3;
	line-height:1.8;
	font-size:.98rem;

	padding-bottom:34px;
}

/* =========================================================
FIX HERO SERVICIOS
Texto separado + imagen centrada derecha
========================================================= */

.servicios-page .hero-secondary-container{
	grid-template-columns:50% 50%;
	gap:120px;
}

.servicios-page .hero-secondary-content{
	max-width:620px;
}

.servicios-page .hero-secondary h1{
	max-width:620px;
	font-size:clamp(3.4rem,4.4vw,5rem);
}

.servicios-page .hero-secondary p{
	max-width:560px;
}

.servicios-page .servicios-visual{
	display:flex;
	justify-content:center;
	align-items:center;
	transform:translateX(80px);
}

.servicios-page .servicios-image-card{
	width:100%;
	max-width:700px;
	margin:0 auto;
}

/* =========================================================
PÁGINAS DE SERVICIO
Telefonía, SAI, Informática, Videovigilancia, etc.
========================================================= */

.servicio-page .telefonia-top,
.servicio-page .telefonia-top.detalle-hero{
	padding:clamp(40px,5vh,64px) 0 clamp(56px,6vh,80px);
}

.servicio-page .telefonia-title{
	max-width:850px;
	margin:0 auto clamp(32px,4vh,52px);
	text-align:center;
}

.servicio-page .titulo-premium-telefonia{
	display:block;
	margin-bottom:22px;
	color:#fff;
	font-size:clamp(2.8rem,5vw,4.8rem);
	font-weight:800;
	letter-spacing:3px;
	text-transform:uppercase;
}

.servicio-page .telefonia-title p{
	color:#9ab0b3;
	font-size:1.15rem;
	line-height:1.8;
}

.servicio-page .telefonia-content{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:clamp(40px,5vw,64px);
	align-items:center;
}

.servicio-page .telefonia-content:has(.logos-grid),
.servicio-page .telefonia-content.logos-wrap{
	grid-template-columns:1fr;
}

.servicio-page .telefonia-text{
	padding:45px;

	border-radius:30px;

	background:
	linear-gradient(
		180deg,
		rgba(8,19,29,0.92),
		rgba(5,12,18,0.96)
	);

	border:1px solid rgba(255,255,255,0.06);

	box-shadow:
	0 20px 50px rgba(0,0,0,0.38);
}

.servicio-page .telefonia-text h2{
	font-size:2.5rem;
	line-height:1.1;
	margin-bottom:26px;
	color:#ffffff;
}

.servicio-page .telefonia-text p{
	color:#9ab0b3;
	line-height:1.9;
	font-size:1rem;
	margin-bottom:20px;
}

.servicio-page .telefonia-text p:last-child{
	margin-bottom:0;
}

.servicio-page .telefonia-image{
	border-radius:32px;
	overflow:hidden;

	border:1px solid rgba(255,255,255,0.08);

	box-shadow:
	0 25px 60px rgba(0,0,0,0.45);
}

.servicio-page .telefonia-image img{
	width:100%;
	height:auto;
	max-height:min(420px,42vh);
	min-height:240px;
	aspect-ratio:4/3;
	object-fit:cover;

	transition:.5s ease;
}

.servicio-page .telefonia-image:hover img{
	transform:scale(1.04);
}

/* Iconos emoji dentro de cards */
.servicio-page .icono{
	width:58px;
	height:58px;

	display:flex;
	align-items:center;
	justify-content:center;

	margin-bottom:22px;

	border-radius:18px;

	background:rgba(0,255,210,0.07);

	border:1px solid rgba(0,255,210,0.12);

	font-size:1.7rem;
}

/* Bloque extra de informática */
.servicio-page .servicios-links{
	padding:100px 0;
}

.servicio-page .servicios-grid{
	display:grid;
	grid-template-columns:repeat(3,minmax(0,1fr));
	gap:28px;
	align-items:stretch;
}

.servicio-page .servicios-grid.grid-3-center{
	grid-template-columns:repeat(3,minmax(0,1fr));
	max-width:1080px;
	margin-left:auto;
	margin-right:auto;
	width:100%;
}

.servicio-page .servicio-link-card{
	display:block;
	position:relative;
	overflow:hidden;
	color:inherit;
	text-decoration:none;

	padding:38px 32px;

	border-radius:28px;

	background:
	linear-gradient(
		180deg,
		rgba(8,19,29,0.92),
		rgba(5,12,18,0.96)
	);

	border:1px solid rgba(255,255,255,0.06);

	box-shadow:
	0 18px 40px rgba(0,0,0,0.38);

	transition:.35s ease;
}

.servicio-page .servicio-link-card::before{
	content:"";

	position:absolute;
	inset:0;

	background:
	radial-gradient(
		circle at top right,
		rgba(0,255,210,0.14),
		transparent 42%
	);

	opacity:0;
	transition:.35s ease;
}

.servicio-page .servicio-link-card:hover{
	transform:translateY(-8px);

	border-color:rgba(0,255,200,0.22);

	box-shadow:
	0 0 40px rgba(0,255,200,0.10),
	0 24px 55px rgba(0,0,0,0.50);
}

.servicio-page .servicio-link-card:hover::before{
	opacity:1;
}

.servicio-page .servicio-link-card .servicio-icon,
.servicio-page .servicios-links .servicio-icon{
	position:relative;
	z-index:2;

	width:64px;
	height:64px;

	display:flex;
	align-items:center;
	justify-content:center;

	margin-bottom:22px;

	border-radius:20px;

	background:rgba(0,255,210,0.07);

	border:1px solid rgba(0,255,210,0.12);

	color:#00ffd0;
	font-size:1.6rem;
}

.servicio-page .servicio-link-card h3{
	position:relative;
	z-index:2;
	color:#ffffff;
	font-size:1.35rem;
	margin-bottom:14px;
}

.servicio-page .servicio-link-card p{
	position:relative;
	z-index:2;
	color:#9ab0b3;
	line-height:1.8;
	font-size:.96rem;
	margin-bottom:22px;
}

.servicio-page .servicio-link-card span{
	position:relative;
	z-index:2;
	color:#00ffd0;
	font-weight:700;
	font-size:.9rem;
}

/* Distribuidores */
.servicio-page .logos-grid{
	display:grid;
	grid-template-columns:repeat(4,minmax(0,1fr));
	gap:32px;
	margin-top:40px;
	width:100%;
}

.servicio-page .logo-item{
	min-height:170px;

	display:flex;
	align-items:center;
	justify-content:center;

	padding:36px 28px;

	border-radius:26px;

	background:
	linear-gradient(
		180deg,
		rgba(8,19,29,0.92),
		rgba(5,12,18,0.96)
	);

	border:1px solid rgba(255,255,255,0.06);

	box-shadow:
	0 18px 40px rgba(0,0,0,0.38);

	transition:.35s ease;
}

.servicio-page .logo-item:hover{
	transform:translateY(-8px);

	border-color:rgba(0,255,200,0.22);
}

.servicio-page .logo-item img{
	max-height:100px;
	width:auto;
	max-width:100%;
	object-fit:contain;
}

/* =========================================================
PÁGINA TELEFONÍA - DETALLE DE SERVICIOS
========================================================= */

.servicio-page .servicios-detalle{
	position:relative;
	padding:clamp(56px,7vh,96px) 0 clamp(64px,7vh,100px);
	overflow:hidden;
}

.servicio-page .servicios-detalle::before{
	content:"";

	position:absolute;
	top:10%;
	left:50%;
	width:min(920px,95%);
	height:420px;
	transform:translateX(-50%);

	background:
	radial-gradient(
		ellipse at center,
		rgba(0,255,200,0.10),
		rgba(0,255,200,0.03) 45%,
		transparent 72%
	);

	filter:blur(70px);
	pointer-events:none;
	z-index:0;
}

.servicio-page .servicios-detalle > *{
	position:relative;
	z-index:1;
}

.servicio-page .servicios-intro{
	max-width:850px;
	margin:0 auto 70px;
	text-align:center;
}

.servicio-page .servicios-intro .titulo-premium-telefonia{
	display:block;
	margin-bottom:22px;

	color:#00ffd0;

	font-size:.85rem;
	font-weight:800;
	letter-spacing:3px;
	text-transform:uppercase;
}

.servicio-page .servicios-intro p{
	color:#9ab0b3;
	font-size:1.15rem;
	line-height:1.8;
}

.servicio-page .servicio-box{
	position:relative;

	min-height:310px;

	padding:42px 34px;

	border-radius:30px;

	overflow:hidden;

	background:
	linear-gradient(
		180deg,
		rgba(8,19,29,0.94),
		rgba(5,12,18,0.98)
	);

	border:1px solid rgba(255,255,255,0.06);

	box-shadow:
	0 18px 40px rgba(0,0,0,0.38);

	transition:.4s ease;
}

.servicio-page .servicio-box::before{
	content:"";

	position:absolute;
	inset:0;

	background:
	radial-gradient(
		circle at top right,
		rgba(0,255,210,0.14),
		transparent 42%
	);

	opacity:0;
	transition:.4s ease;
}

.servicio-page .servicio-box:hover{
	transform:translateY(-10px) scale(1.02);

	border-color:rgba(0,255,200,0.25);

	box-shadow:
	0 0 45px rgba(0,255,200,0.12),
	0 25px 60px rgba(0,0,0,0.55);
}

.servicio-page .servicio-box:hover::before{
	opacity:1;
}

.servicio-page .servicio-icon{
	width:64px;
	height:64px;

	display:flex;
	align-items:center;
	justify-content:center;

	margin-bottom:28px;

	border-radius:20px;

	background:rgba(0,255,210,0.07);

	border:1px solid rgba(0,255,210,0.12);

	font-size:1.8rem;
}

.servicio-page .servicio-box h3{
	position:relative;
	z-index:2;

	font-size:1.45rem;
	margin-bottom:16px;
	color:#ffffff;
}

.servicio-page .servicio-box p{
	position:relative;
	z-index:2;

	color:#9ab0b3;
	line-height:1.8;
	font-size:.98rem;

	margin-bottom:34px;
}

.servicio-page .servicio-link{
	position:absolute;
	left:34px;
	bottom:30px;
	z-index:2;

	color:#00ffd0;

	font-size:.9rem;
	font-weight:700;
}

/* =========================================================
PÁGINAS PRODUCTOS / ADSL / TELEFONÍA IP
========================================================= */

.servicio-page .sectores{
	padding:100px 0;
}

.servicio-page .sectores-grid{
	display:grid;
	grid-template-columns:repeat(4,minmax(0,1fr));
	gap:28px;
	align-items:stretch;
}

.servicio-page .diferencial-grid{
	display:grid;
	grid-template-columns:repeat(4,minmax(0,1fr));
	gap:28px;
	align-items:stretch;
}

.servicio-page .sectores-grid .sector-card{
	text-decoration:none;
	color:inherit;
}

.servicio-page .sector-card{
	position:relative;
	min-height:280px;

	padding:42px 34px;

	border-radius:30px;

	overflow:hidden;

	background:
	linear-gradient(
		180deg,
		rgba(8,19,29,0.94),
		rgba(5,12,18,0.98)
	);

	border:1px solid rgba(255,255,255,0.06);

	box-shadow:
	0 18px 40px rgba(0,0,0,0.38);

	transition:.4s ease;
}

.servicio-page .sector-card::before{
	content:"";

	position:absolute;
	inset:0;

	background:
	radial-gradient(
		circle at top right,
		rgba(0,255,210,0.14),
		transparent 42%
	);

	opacity:0;
	transition:.4s ease;
}

.servicio-page .sector-card:hover{
	transform:translateY(-10px) scale(1.02);

	border-color:rgba(0,255,200,0.25);

	box-shadow:
	0 0 45px rgba(0,255,200,0.12),
	0 25px 60px rgba(0,0,0,0.55);
}

.servicio-page .sector-card:hover::before{
	opacity:1;
}

.servicio-page .sector-card h3,
.servicio-page .sector-card p,
.servicio-page .sector-card .icono{
	position:relative;
	z-index:2;
}

.servicio-page .sector-card h3{
	font-size:1.45rem;
	margin-bottom:16px;
	color:#ffffff;
}

.servicio-page .sector-card p{
	color:#9ab0b3;
	line-height:1.8;
	font-size:.98rem;
}

/* =========================================================
EXPERIENCIA PREMIUM INDEX
========================================================= */

.experience-premium{
	padding:120px 0 70px;
	position:relative;
	overflow:hidden;
}

.experience-header{
	position:relative;
	z-index:1;
	max-width:820px;
	margin-bottom:70px;
}

.experience-header h2{
	font-size:clamp(2.4rem,4vw,4.4rem);
	line-height:1.05;
	letter-spacing:-2px;
	color:#ffffff;
	margin-bottom:26px;
}

.experience-header p{
	max-width:680px;
	color:#9ab0b3;
	font-size:1.08rem;
	line-height:1.8;
}

.experience-timeline{
	position:relative;

	display:grid;
	grid-template-columns:repeat(4,1fr);
	gap:24px;
}

.experience-timeline::before{
	content:"";
	position:absolute;
	top:42px;
	left:8%;
	right:8%;
	height:1px;

	background:
	linear-gradient(
		90deg,
		transparent,
		rgba(0,255,210,0.35),
		transparent
	);

	z-index:0;
}

.experience-step{
	position:relative;
	z-index:2;

	min-height:310px;

	padding:42px 30px 36px;

	border-radius:30px;

	background:
	linear-gradient(
		180deg,
		rgba(8,19,29,0.94),
		rgba(5,12,18,0.98)
	);

	border:1px solid rgba(255,255,255,0.06);

	box-shadow:
	0 18px 40px rgba(0,0,0,0.38);

	overflow:hidden;

	transition:.4s ease;
}

.experience-step::before{
	content:"";
	position:absolute;
	inset:0;

	background:
	radial-gradient(
		circle at top right,
		rgba(0,255,210,0.16),
		transparent 42%
	);

	opacity:0;
	transition:.4s ease;
}

.experience-step:hover{
	transform:translateY(-10px);

	border-color:rgba(0,255,200,0.25);

	box-shadow:
	0 0 45px rgba(0,255,200,0.12),
	0 25px 60px rgba(0,0,0,0.55);
}

.experience-step:hover::before{
	opacity:1;
}

.experience-premium::before{
	content:"";
	position:absolute;
	top:50%;
	left:50%;
	width:min(880px,115%);
	height:460px;
	transform:translate(-50%,-50%);
	background:
	radial-gradient(
		ellipse at center,
		rgba(0,255,208,0.13),
		rgba(0,255,208,0.04) 48%,
		transparent 72%
	);
	filter:blur(90px);
	z-index:0;
	pointer-events:none;
}

.step-number{
	position:absolute;
	top:24px;
	right:26px;

	color:rgba(255,255,255,0.12);

	font-size:.95rem;
	font-weight:800;
	letter-spacing:2px;
}

.step-icon{
	position:relative;
	z-index:2;

	width:68px;
	height:68px;

	display:flex;
	align-items:center;
	justify-content:center;

	margin-bottom:28px;

	border-radius:22px;

	background:rgba(0,255,210,0.07);

	border:1px solid rgba(0,255,210,0.14);
}

.step-icon i{
	color:#00ffd0;
	font-size:1.8rem;

	filter:
	drop-shadow(0 0 14px rgba(0,255,210,.35));
}

.experience-step h3{
	position:relative;
	z-index:2;

	color:#ffffff;
	font-size:1.35rem;
	line-height:1.25;
	margin-bottom:16px;
}

.experience-step p{
	position:relative;
	z-index:2;

	color:#9ab0b3;
	line-height:1.8;
	font-size:.96rem;
}

@media(max-width:1100px){

	.experience-timeline{
		grid-template-columns:repeat(2,1fr);
	}

	.experience-timeline::before{
		display:none;
	}
}

@media(max-width:768px){

	.experience-premium{
		padding:90px 0 50px;
	}

	.experience-header{
		margin-bottom:45px;
	}

	.experience-header h2{
		font-size:2.3rem;
	}

	.experience-timeline{
		grid-template-columns:1fr;
	}

	.experience-step{
		min-height:auto;
	}
}

@media(max-width:1100px){

	.servicio-page .sectores-grid,
	.servicio-page .diferencial-grid{
		grid-template-columns:repeat(2,minmax(0,1fr));
	}
}

@media(max-width:768px){

	.servicio-page .sectores-grid{
		grid-template-columns:1fr;
	}

	.servicio-page .sector-card{
		min-height:auto;
	}
}

/* Responsive telefonía */
@media(max-width:1100px){

	.servicio-page .servicios-grid{
		grid-template-columns:repeat(2,1fr);
	}
}

@media(max-width:768px){

	.servicio-page .servicios-detalle{
		padding:90px 0 70px;
	}

	.servicio-page .servicios-grid{
		grid-template-columns:1fr;
	}

	.servicio-page .servicios-intro p{
		font-size:1rem;
	}

	.servicio-page .servicio-box{
		min-height:auto;
	}
}

/* Responsive */
@media(max-width:1100px){

	.servicio-page .telefonia-content{
		grid-template-columns:1fr;
	}

	.servicio-page .servicios-grid,
	.servicio-page .logos-grid,
	.grid-4,
	.grid-3-center{
		grid-template-columns:repeat(2,minmax(0,1fr));
	}
}

@media(max-width:768px){

	.servicio-page .telefonia-top{
		padding:48px 0 56px;
	}

	.servicio-page .telefonia-text{
		padding:32px 24px;
	}

	.servicio-page .telefonia-text h2{
		font-size:2rem;
	}

	.servicio-page .telefonia-image img{
		max-height:320px;
		min-height:200px;
	}

	.servicio-page .servicios-grid,
	.servicio-page .logos-grid,
	.grid-4,
	.grid-3-center{
		grid-template-columns:1fr;
	}
}

@media(max-width:1100px){
	

	.servicios-page .hero-secondary-container{
		grid-template-columns:1fr;
		gap:60px;
	}

	.servicios-page .hero-secondary-content{
		max-width:100%;
	}

	.servicios-page .hero-secondary h1,
	.servicios-page .hero-secondary p{
		max-width:100%;
	}

	.servicios-page .servicios-visual{
		transform:none;
	}

	.servicios-page .servicios-image-card{
		max-width:620px;
	}
}

/* Responsive */
@media(max-width:1100px){

	.servicios-premium .sectores-grid{
		grid-template-columns:repeat(2,1fr);
	}
}

@media(max-width:768px){

	.servicios-premium{
		padding:80px 0;
	}

	.servicios-premium .sectores-grid{
		grid-template-columns:1fr;
	}

	.servicios-premium .titulo-seccion{
		font-size:2.2rem;
	}

	.servicios-premium .sector-card{
		min-height:auto;
	}

	
}

/* HOVER */

.ubicacion-image:hover img{
	transform:scale(1.03);

	filter:
	contrast(1.08)
	saturate(1.1);
}

/* RESPONSIVE */

@media(max-width:768px){

	.ubicacion-image img{
		height:320px;
	}

	.ubicacion-image{
		border-radius:24px;
	}
}

/* =========================================================
RESPONSIVE
========================================================= */

@media(max-width:1100px){

	.ubicacion-grid{
		grid-template-columns:1fr;
	}

	.mapa-box iframe{
		min-height:420px;
	}
}

@media(max-width:768px){

	.donde-estamos-page .ubicacion-section{
		padding:90px 0;
	}

	.ubicacion-info{
		padding:38px 26px;
	}

	.ubicacion-info h2{
		font-size:2.3rem;
	}

	.mapa-box iframe{
		min-height:340px;
	}
}

/* =========================================================
RESPONSIVE
========================================================= */

@media(max-width:1100px){

	.contacto-hero-container{
		grid-template-columns:1fr;
	}

	.contact-form-wrapper{
		width:100%;
	}
}

@media(max-width:768px){

	.form-grid{
		grid-template-columns:1fr;
	}

	.contacto-extra-grid{
		grid-template-columns:1fr;
	}

	.contact-form-card{
		padding:30px 22px;
	}

	.form-top h2{
		font-size:1.8rem;
	}

	.contacto-page .hero-secondary{
		padding-top:140px;
	}
	
}

@media(max-width:1100px){

	.stats{
		margin-top:40px;
		margin-bottom:70px;
	}

	.stats-grid{
		grid-template-columns:repeat(2,1fr);
	}
}

@media(max-width:768px){

	.stats{
		margin-top:35px;
		margin-bottom:60px;
	}

	.stats-grid{
		grid-template-columns:1fr;
	}
}

  

/* =========================================================
RESPONSIVE
========================================================= */

@media(max-width:1100px){

	.hero-secondary-container{
		grid-template-columns:1fr;

		gap:60px;
	}

	.hero-secondary-content{
		max-width:100%;
	}

	.hero-secondary-visual{
		order:2;
	}
}

@media(max-width:768px){

	.hero-secondary{
		padding:
		140px
		0
		80px;
	}

	.hero-secondary h1{
		font-size:3rem;

		letter-spacing:-2px;
	}

	.hero-secondary p{
		font-size:1rem;
		line-height:1.8;
	}

	.hero-buttons{
		flex-direction:column;
		width:100%;
	}

	.btn-primary,
	.btn-secondary{
		width:100%;
	}

	.hero-image-wrapper{
		max-width:100%;
	}
}

@media(max-width:540px){

	.hero-secondary h1{
		font-size:2.4rem;
	}

	.hero-kicker{
		font-size:.7rem;
		letter-spacing:2px;
	}
}

/* =========================================================
RESPONSIVE
========================================================= */

@media(max-width:768px){

	.page-hero{
		min-height:430px;
	}

	.page-hero h1{
		font-size:3rem;
		line-height:1;
	}

	.page-hero p{
		font-size:1rem;
	}
}

/* =========================================================
RESPONSIVE
========================================================= */
@media(max-width:768px){

	.empresa-banner-grid{
		grid-template-columns:1fr;
	}

	.empresa-banner-grid h3{
		font-size:2.6rem;
	}
}

@media(max-width:1100px){

	.stats-grid,
	.experience-grid,
	.services-grid{
		grid-template-columns:repeat(2,1fr);
	}

	.hero{
		min-height:auto;
		padding:140px 0 100px;
	}

	.hero-content{
		max-width:700px;
		padding-left:40px;
		padding-right:40px;
	}

	.hero h1{
		font-size:4.4rem;
	}
}

@media(max-width:768px){

	.menu{
		display:none;
	}

	.hero{
		padding:130px 0 90px;
	}

	.hero-content{
		padding:0 26px;
	}

	.hero h1{
		font-size:3.3rem;
		line-height:.96;
	}

	.hero p{
		font-size:1rem;
		line-height:1.7;
	}

	.hero-buttons{
		flex-direction:column;
		align-items:flex-start;
		width:100%;
	}

	.btn-primary,
	.btn-secondary{
		width:100%;
		text-align:center;
	}

	.section-title,
	.experience h2,
	.cta-box h2{
		font-size:32px;
	}



	.stats-grid,
	.experience-grid,
	.services-grid{
		grid-template-columns:1fr;
	}

	.footer-content{
		flex-direction:column;
		gap:30px;
		align-items:flex-start;
	}

	.cta-box{
		padding:50px 25px;
	}
}

/* =========================================================
   PREMIUM INTERACTIONS 2026
========================================================= */

/* Scroll reveal — sin CLS: reserva espacio, solo anima opacidad/transform */
body.js .fade-in{
	opacity:0;
	transform:translate3d(0, 30px, 0);
	transition:
		opacity .75s cubic-bezier(.22, 1, .36, 1),
		transform .75s cubic-bezier(.22, 1, .36, 1);
	will-change:opacity, transform;
}

body.js .fade-in.visible{
	opacity:1;
	transform:translate3d(0, 0, 0);
}

/* Header premium al scroll */
.header{
	transition:
		background .45s ease,
		backdrop-filter .45s ease,
		border-color .45s ease,
		box-shadow .45s ease;
}

.header.scrolled{
	background:
	linear-gradient(
		180deg,
		rgba(3, 10, 15, 0.96),
		rgba(3, 10, 15, 0.88)
	);

	backdrop-filter:blur(22px);
	-webkit-backdrop-filter:blur(22px);

	border-bottom-color:rgba(0, 255, 200, 0.14);

	box-shadow:
		0 12px 40px rgba(0, 0, 0, 0.35),
		0 1px 0 rgba(0, 255, 200, 0.06);
}

/* Línea luminosa bajo títulos de sección */
.titulo-seccion{
	position:relative;
}

.titulo-seccion::after{
	content:"";
	display:block;
	width:52px;
	height:2px;
	margin:20px auto 0;
	border-radius:999px;
	background:linear-gradient(
		90deg,
		transparent,
		rgba(0, 255, 208, 0.85),
		transparent
	);
	box-shadow:0 0 14px rgba(0, 255, 208, 0.35);
	animation:tituloLinePulse 3.2s ease-in-out infinite;
}

@keyframes tituloLinePulse{
	0%, 100%{
		opacity:.55;
		width:52px;
		box-shadow:0 0 10px rgba(0, 255, 208, 0.2);
	}
	50%{
		opacity:1;
		width:76px;
		box-shadow:0 0 22px rgba(0, 255, 208, 0.45);
	}
}

/* Iconos vivos al hover de la card */
.empresa-page .empresa-card .icono i,
.empresa-page .diferencial-item .icono i,
.empresa-page .sector-card .icono i,
.stat-card i,
.service-card i,
.servicios-premium .sector-card .icono i,
.servicio-page .sector-card .icono i{
	transition:
		transform .35s cubic-bezier(.22, 1, .36, 1),
		filter .35s ease;
}

.empresa-page .empresa-card:hover .icono i,
.empresa-page .diferencial-item:hover .icono i,
.empresa-page .sector-card:hover .icono i,
.stat-card:hover i,
.service-card:hover i,
.servicios-premium .sector-card:hover .icono i,
.servicio-page .sector-card:hover .icono i{
	transform:scale(1.1);
	filter:drop-shadow(0 0 18px rgba(0, 255, 210, 0.55));
}

/* Imágenes premium — zoom sutil */
.hero-image-wrapper,
.historia-img,
.telefonia-image,
.servicios-image-card{
	overflow:hidden;
}

.hero-image-wrapper img,
.empresa-page .historia-img img,
.servicio-page .telefonia-image img,
.servicios-hero-img{
	transition:
		transform .55s cubic-bezier(.22, 1, .36, 1),
		box-shadow .55s ease,
		filter .55s ease;
}

.hero-image-wrapper:hover img,
.empresa-page .historia-img:hover img,
.servicio-page .telefonia-image:hover img,
.servicios-image-card:hover .servicios-hero-img{
	transform:translateY(-6px) scale(1.03);
	box-shadow:0 28px 60px rgba(0, 0, 0, 0.42);
	filter:drop-shadow(0 0 24px rgba(0, 255, 200, 0.12));
}

/* Microinteracciones botones */
.btn-primary,
.btn-secondary{
	transition:
		transform .35s cubic-bezier(.22, 1, .36, 1),
		box-shadow .35s ease,
		border-color .35s ease,
		background .35s ease;
}

.btn-primary:hover{
	transform:translateY(-4px);
	box-shadow:
		0 18px 45px rgba(0, 255, 210, 0.38),
		0 0 28px rgba(0, 255, 210, 0.18);
}

.btn-secondary:hover{
	transform:translateY(-4px);
	box-shadow:0 0 22px rgba(0, 255, 200, 0.12);
}

/* Logos distribuidores */
.servicio-page .logo-item{
	transition:
		transform .4s cubic-bezier(.22, 1, .36, 1),
		border-color .4s ease,
		box-shadow .4s ease;
}

.servicio-page .logo-item img{
	transition:
		transform .4s cubic-bezier(.22, 1, .36, 1),
		filter .4s ease;
}

.servicio-page .logo-item:hover{
	transform:translateY(-6px) scale(1.02);
	border-color:rgba(0, 255, 200, 0.28);
	box-shadow:
		0 22px 48px rgba(0, 0, 0, 0.42),
		0 0 32px rgba(0, 255, 200, 0.12);
}

.servicio-page .logo-item:hover img{
	transform:scale(1.06);
	filter:drop-shadow(0 0 14px rgba(0, 255, 200, 0.28));
}

/* Botón flotante contacto */
.float-contact{
	position:fixed;
	right:28px;
	bottom:28px;
	z-index:998;

	display:flex;
	align-items:center;
	justify-content:center;

	width:58px;
	height:58px;

	border-radius:50%;

	background:linear-gradient(135deg, #00ffd0, #00c2a8);
	color:#041014;

	font-size:1.35rem;

	box-shadow:
		0 12px 32px rgba(0, 255, 210, 0.32),
		0 0 24px rgba(0, 255, 200, 0.22);

	transition:
		transform .35s cubic-bezier(.22, 1, .36, 1),
		box-shadow .35s ease;
}

.float-contact:hover{
	transform:translateY(-4px) scale(1.05);
	box-shadow:
		0 18px 42px rgba(0, 255, 210, 0.42),
		0 0 36px rgba(0, 255, 200, 0.35);
}

.float-contact:focus-visible{
	outline:2px solid #00ffd0;
	outline-offset:3px;
}

/* Parallax suave — capa de contenido hero */
.hero-home .hero-content,
.hero-secondary .hero-secondary-container,
.hero-secondary .hero-secondary-visual{
	transition:transform .12s linear;
	will-change:transform;
}

/* =========================================================
   TELEFONÍA - ESTILO PREMIUM UNIFICADO
========================================================= */

.servicio-page .servicios-detalle .servicios-intro .titulo-premium-telefonia {
	display: block;
	color: #ffffff;
	font-size: clamp(2.8rem, 5vw, 4.8rem);
	font-weight: 800;
	letter-spacing: 3px;
	text-transform: uppercase;
	margin-bottom: 22px;
  }
  
  .servicio-page .servicios-detalle .servicios-intro p {
	max-width: 850px;
	margin: 0 auto;
	color: #9ab0b3;
	font-size: 1.15rem;
	line-height: 1.8;
  }
  
  .servicio-page .servicios-detalle .servicio-box {
	color: inherit;
  }
  
  .servicio-page .servicios-detalle .servicio-box:visited,
  .servicio-page .servicios-detalle .servicio-box:active,
  .servicio-page .servicios-detalle .servicio-box:focus {
	color: inherit;
  }
  
  .servicio-page .servicios-detalle .servicio-box h3 {
	color: #ffffff;
  }
  
  .servicio-page .servicios-detalle .servicio-box p {
	color: #9ab0b3;
  }
  
  .servicio-page .servicios-detalle .servicio-box:hover h3 {
	color: #ffffff;
  }
  
  .servicio-page .servicios-detalle .servicio-box:hover p {
	color: #9ab0b3;
  }
  
  .servicio-page .servicios-detalle .servicio-link {
	color: #00ffd0;
  }

  .servicio-page .servicios-detalle .servicio-box {
	border-color: rgba(0, 255, 200, 0.10);
  }

  .servicio-page .servicios-detalle .servicio-box:hover {
	border-color: rgba(0, 255, 200, 0.32);
	box-shadow:
	  0 0 55px rgba(0, 255, 200, 0.16),
	  0 28px 65px rgba(0, 0, 0, 0.58);
  }

  .servicio-page .servicios-detalle .servicio-icon {
	background: rgba(0, 255, 210, 0.10);
	border-color: rgba(0, 255, 210, 0.20);
	box-shadow: 0 0 24px rgba(0, 255, 200, 0.08);
  }

  .servicio-page .servicios-detalle .servicio-box:hover .servicio-icon {
	box-shadow: 0 0 32px rgba(0, 255, 200, 0.22);
  }

  .servicio-page .servicio-box,
.servicio-page .servicio-box:visited,
.servicio-page .servicio-box:hover,
.servicio-page .servicio-box:active {
  text-decoration: none;
  color: inherit;
}

/* =========================================================
   AJUSTE PORTÁTILES / PANTALLAS BAJAS
========================================================= */

@media (max-height: 820px) and (min-width: 900px) {

	.hero,
	.hero-secondary {
	  min-height: auto;
	  padding: 60px 0 50px;
	}
  
	.hero-content {
	  padding: 60px 50px;
	}
  
	.hero-secondary-container {
	  min-height: auto;
	  padding: 80px 0 70px;
	}
  
	.hero h1,
	.hero-secondary-content h1 {
	  font-size: clamp(3rem, 4vw, 4.4rem);
	  line-height: 1;
	}
  
	.hero p,
	.hero-secondary-content p {
	  font-size: 1rem;
	  line-height: 1.7;
	  margin-bottom: 32px;
	}
  
	.hero-image-wrapper img,
	.ubicacion-image img,
	.servicios-hero-img {
	  max-height: 460px;
	  object-fit: cover;
	}
  
	.hero-buttons {
	  margin-top: 10px;
	}
  }

/* Accesibilidad y rendimiento */
@media (prefers-reduced-motion: reduce){
	body.js .fade-in{
		opacity:1;
		transform:none;
		transition:none;
	}

	.titulo-seccion::after{
		animation:none;
		opacity:.75;
	}

	.hero-home .hero-content,
	.hero-secondary .hero-secondary-container,
	.hero-secondary .hero-secondary-visual{
		transform:none !important;
		transition:none;
	}

	.float-contact:hover,
	.btn-primary:hover,
	.btn-secondary:hover,
	.stat-card:hover,
	.empresa-page .empresa-card:hover,
	.empresa-page .diferencial-item:hover,
	.empresa-page .sector-card:hover{
		transform:none;
	}
}

/* =========================================================
   FIX PORTÁTILES / PANTALLAS BAJAS
========================================================= */

@media (min-width: 900px) and (max-height: 850px) {

	.hero,
	.hero-secondary,
	.contacto-page .contacto-hero {
	  min-height: calc(100vh - 82px);
	  padding: 55px 0 45px;
	}
  
	.hero-content {
	  padding: 40px 70px;
	}
  
	.hero-secondary-container,
	.contacto-hero-container {
	  align-items: center;
	}
  
	.hero-secondary h1,
	.hero h1 {
	  font-size: clamp(3rem, 4.3vw, 4.8rem);
	  line-height: .95;
	  margin-bottom: 24px;
	}
  
	.hero-secondary p,
	.hero p {
	  font-size: 1rem;
	  line-height: 1.65;
	  margin-bottom: 28px;
	}
  
	.hero-kicker {
	  margin-bottom: 18px;
	}
  
	.hero-buttons {
	  margin-top: 0;
	}
  
	.hero-image-wrapper img {
	  max-height: 520px;
	  width: auto;
	}
  
	.servicios-image-card {
	  max-width: 650px;
	}
  
	.ubicacion-image {
	  max-width: 760px;
	  margin-bottom: 0;
	}
  
	.ubicacion-image img {
	  height: 420px;
	}
  
	.contact-form-card {
	  padding: 34px;
	}
  
	.form-top {
	  margin-bottom: 24px;
	}
  
	.input-group textarea {
	  min-height: 125px;
	}
  }

  /* =========================================================
   FIX DEFINITIVO PORTÁTIL - SOLO HERO PRINCIPALES
========================================================= */

@media (min-width: 900px) and (max-height: 850px) {

	/* EMPRESA */
	.empresa-page .hero-secondary {
	  min-height: calc(100vh - 82px);
	  padding: 35px 0 35px;
	}
  
	.empresa-page .hero-secondary-container {
	  min-height: calc(100vh - 160px);
	  align-items: center;
	}
  
	.empresa-page .hero-secondary h1 {
	  font-size: clamp(3.4rem, 4.1vw, 4.7rem);
	  line-height: .96;
	  margin-bottom: 24px;
	}
  
	.empresa-page .hero-secondary p {
	  font-size: 1rem;
	  line-height: 1.65;
	  margin-bottom: 28px;
	}
  
	.empresa-page .hero-image-wrapper img {
	  max-height: 430px;
	  width: auto;
	}
  
  
	/* SERVICIOS - SOLO FOTO */
	.servicios-page .servicios-visual {
	  transform: none;
	  padding-left: 20px;
	  justify-content: flex-end;
	}
  
	.servicios-page .servicios-image-card {
	  max-width: 600px;
	  transform: none;
	}
  
	.servicios-page .servicios-hero-img {
	  max-height: 360px;
	  object-fit: cover;
	}
  
  
	/* CONTACTO */
	.contacto-page .contacto-hero {
	  min-height: calc(100vh - 82px);
	  padding: 35px 0 35px;
	}
	/* CONTACTO - AJUSTE FINAL */

.contacto-page .contacto-hero-container{
    transform: translateY(-30px);
}
  
	.contacto-page .contacto-hero-container {
	  min-height: calc(100vh - 160px);
	  align-items: center;
	  gap: 55px;
	}
  
	.contacto-page .hero-secondary h1 {
	  font-size: clamp(3.2rem, 4vw, 4.6rem);
	  line-height: .96;
	  margin-bottom: 24px;
	}
  
	.contacto-page .hero-secondary p {
	  font-size: 1rem;
	  line-height: 1.65;
	  margin-bottom: 28px;
	}
  
	.contacto-page .contact-form-card {
	  padding: 30px 34px;
	}
  
	.contacto-page .form-top {
	  margin-bottom: 22px;
	}
  
	.contacto-page .form-top h2 {
	  font-size: 2rem;
	  margin-bottom: 10px;
	}
  
	.contacto-page .form-grid {
	  gap: 14px;
	  margin-bottom: 14px;
	}
  
	.contacto-page .input-group input,
	.contacto-page .input-group textarea {
	  padding-top: 15px;
	  padding-bottom: 15px;
	}
  
	.contacto-page .input-group textarea {
	  min-height: 115px;
	}
  
	.contacto-page .btn-enviar {
	  margin-top: 18px;
	  padding: 1rem 2rem;
	}
	
  }

@media (max-width:640px){
	.float-contact{
		right:18px;
		bottom:18px;
		width:52px;
		height:52px;
		font-size:1.2rem;
	}


}

	/* CONTACTO - SUBIR BLOQUE COMPLETO */
	@media (min-width: 900px) and (max-height: 900px) {
		.contacto-page .hero-secondary-container {
		  position: relative;
		  top: -55px;
		}
	  }

	 /* =========================================================
   FIX PORTÁTIL - PÁGINAS INTERNAS DE SERVICIOS
   No afecta a index, empresa, servicios, contacto ni dónde estamos
========================================================= */

@media (min-width: 900px) and (max-height: 900px) {

	body.servicio-page:not(.servicios-page):not(.contacto-page):not(.donde-estamos-page) .telefonia-top {
	  padding-top: 40px !important;
	  padding-bottom: 48px !important;
	}
  
	body.servicio-page:not(.servicios-page):not(.contacto-page):not(.donde-estamos-page) .telefonia-title {
	  margin-bottom: 28px !important;
	}
  
	body.servicio-page:not(.servicios-page):not(.contacto-page):not(.donde-estamos-page) .titulo-premium-telefonia {
	  font-size: clamp(2.4rem, 4vw, 4rem) !important;
	  margin-bottom: 14px !important;
	}
  
	body.servicio-page:not(.servicios-page):not(.contacto-page):not(.donde-estamos-page) .telefonia-title p {
	  font-size: 1rem !important;
	  line-height: 1.55 !important;
	}
  
	body.servicio-page:not(.servicios-page):not(.contacto-page):not(.donde-estamos-page) .telefonia-content {
	  gap: 36px !important;
	  align-items: center !important;
	}
  
	body.servicio-page:not(.servicios-page):not(.contacto-page):not(.donde-estamos-page) .telefonia-text {
	  padding: 30px !important;
	}
  
	body.servicio-page:not(.servicios-page):not(.contacto-page):not(.donde-estamos-page) .telefonia-text h2 {
	  font-size: 2.1rem !important;
	  margin-bottom: 18px !important;
	}
  
	body.servicio-page:not(.servicios-page):not(.contacto-page):not(.donde-estamos-page) .telefonia-text p {
	  font-size: .96rem !important;
	  line-height: 1.65 !important;
	  margin-bottom: 14px !important;
	}
  
	body.servicio-page:not(.servicios-page):not(.contacto-page):not(.donde-estamos-page) .telefonia-image img {
	  max-height: 340px !important;
	  min-height: 220px !important;
	  object-fit: cover !important;
	}
  }

/* ==========================================================================
   INFORME CSS MUERTO — Auditoría estructural (no eliminar reglas aún)
   Detalle completo: css/CSS_DEAD_CODE_REPORT.md
   ==========================================================================
   Posiblemente sin uso en MarbeComunicaciones/*.html:
   - .bg-image          → hero servicios antiguo
   - .cta-button        → sustituido por .btn-primary / .btn-secondary
   - .cta-final         → sustituido por .cta-section + .cta-box
   - .empresa-banner    → sustituido por .hero-secondary
   - .empresa-banner-grid
   - .experience-grid   → sustituido por .experience-timeline
   - .page-hero         → sustituido por .hero-secondary
   - .page-hero-content
   - .page-hero-overlay
   - .page-kicker       → sustituido por .hero-kicker
   - .services-hero     → clase parcial; HTML usa .hero-secondary.servicios-hero
   - .visita-section    → dondeEstamos usa .ubicacion-section
   Falsos positivos del análisis (.HTML, .jpg, .png): extensiones en url(), no clases.
   ========================================================================== */

/* =========================================================
PÁGINAS NUEVAS DE PRODUCTOS
Centralitas, Teléfonos y Radio-Enlaces WiMAX
========================================================= */

.producto-detalle-page .producto-imagen-contain{
	background:
	linear-gradient(
		180deg,
		rgba(8,19,29,0.92),
		rgba(5,12,18,0.96)
	);
	display:flex;
	align-items:center;
	justify-content:center;
	padding:38px;
}

.producto-detalle-page .producto-imagen-contain img{
	object-fit:contain !important;
	background:rgba(255,255,255,0.96);
	padding:24px;
	border-radius:24px;
}

.producto-detalle-page .productos-detalle-section{
	padding:100px 0;
}

.producto-detalle-page .productos-grid{
	display:grid;
	grid-template-columns:repeat(3,minmax(0,1fr));
	gap:28px;
	align-items:stretch;
}

.producto-detalle-page .producto-card{
	position:relative;
	height:100%;
	padding:34px;
	border-radius:30px;
	background:
	linear-gradient(
		180deg,
		rgba(8,19,29,0.92),
		rgba(5,12,18,0.96)
	);
	border:1px solid rgba(255,255,255,0.07);
	box-shadow:0 20px 50px rgba(0,0,0,0.35);
	overflow:hidden;
	transition:transform .35s ease, border-color .35s ease, box-shadow .35s ease;
}

.producto-detalle-page .producto-card::before{
	content:"";
	position:absolute;
	inset:0;
	background:radial-gradient(circle at top right, rgba(0,255,210,0.12), transparent 38%);
	pointer-events:none;
}

.producto-detalle-page .producto-card:hover{
	transform:translateY(-8px);
	border-color:rgba(0,255,210,0.28);
	box-shadow:0 28px 70px rgba(0,0,0,0.48);
}

.producto-detalle-page .producto-img{
	position:relative;
	z-index:1;
	height:190px;
	margin-bottom:26px;
	display:flex;
	align-items:center;
	justify-content:center;
	border-radius:24px;
	background:rgba(255,255,255,0.94);
	overflow:hidden;
}

.producto-detalle-page .producto-img img{
	width:100%;
	height:100%;
	object-fit:contain;
	padding:18px;
	transition:.45s ease;
}

.producto-detalle-page .producto-card:hover .producto-img img{
	transform:scale(1.05);
}

.producto-detalle-page .producto-card h3{
	position:relative;
	z-index:1;
	color:#fff;
	font-size:1.25rem;
	line-height:1.25;
	margin-bottom:16px;
}

.producto-detalle-page .producto-card p{
	position:relative;
	z-index:1;
	color:#9ab0b3;
	font-size:.96rem;
	line-height:1.75;
}

.producto-detalle-page .producto-historia-icono{
	display:flex;
	align-items:center;
	justify-content:center;
	min-height:320px;
	border-radius:30px;
	background:
	linear-gradient(
		180deg,
		rgba(8,19,29,0.92),
		rgba(5,12,18,0.96)
	);
	border:1px solid rgba(255,255,255,0.07);
	box-shadow:0 20px 50px rgba(0,0,0,0.35);
}

.producto-detalle-page .producto-historia-icono i{
	font-size:7rem;
	color:#00ffd2;
	filter:drop-shadow(0 0 26px rgba(0,255,210,.32));
}

.producto-detalle-page .cta-actions{
	display:flex;
	justify-content:center;
	gap:16px;
	flex-wrap:wrap;
	margin-top:28px;
}

@media (max-width:1100px){
	.producto-detalle-page .productos-grid{
		grid-template-columns:repeat(2,minmax(0,1fr));
	}
}

@media (max-width:700px){
	.producto-detalle-page .productos-detalle-section{
		padding:70px 0;
	}

	.producto-detalle-page .productos-grid{
		grid-template-columns:1fr;
	}

	.producto-detalle-page .producto-card{
		padding:26px 22px;
		border-radius:24px;
	}

	.producto-detalle-page .producto-img{
		height:170px;
	}

	.producto-detalle-page .producto-imagen-contain{
		padding:24px;
	}

	.producto-detalle-page .producto-historia-icono{
		min-height:210px;
	}

	.producto-detalle-page .producto-historia-icono i{
		font-size:4.8rem;
	}
}

/* =========================================================
PÁGINA NUESTROS PRODUCTOS
========================================================= */

.productos-page .productos-hero{
	padding-top:clamp(42px,5vh,70px);
	padding-bottom:clamp(54px,7vh,92px);
}

.productos-page .productos-hero-grid{
	display:grid;
	grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);
	gap:clamp(34px,5vw,70px);
	align-items:center;
}

.productos-page .productos-hero-text{
	max-width:820px;
	margin:0;
	text-align:left;
}

.productos-page .productos-hero-text .titulo-premium-telefonia{
	margin-top:18px;
	margin-bottom:22px;
}

.productos-page .productos-hero-text p{
	max-width:720px;
}

.productos-page .productos-hero-badges{
	display:flex;
	flex-wrap:wrap;
	gap:12px;
	margin-top:30px;
}

.productos-page .productos-hero-badges span{
	display:inline-flex;
	align-items:center;
	gap:9px;
	padding:11px 15px;
	border-radius:999px;
	background:rgba(0,255,210,.07);
	border:1px solid rgba(0,255,210,.14);
	color:#c9f6ee;
	font-size:.88rem;
	font-weight:700;
}

.productos-page .productos-hero-badges i{
	color:#00ffd0;
}

.productos-page .productos-hero-panel{
	position:relative;
	overflow:hidden;
	padding:42px 38px;
	border-radius:32px;
	background:
		radial-gradient(circle at top right, rgba(0,255,210,.15), transparent 42%),
		linear-gradient(180deg, rgba(8,19,29,.94), rgba(5,12,18,.98));
	border:1px solid rgba(255,255,255,.08);
	box-shadow:0 26px 70px rgba(0,0,0,.42);
}

.productos-page .productos-hero-panel::before{
	content:"";
	position:absolute;
	inset:auto -35% -45% auto;
	width:260px;
	height:260px;
	border-radius:50%;
	background:rgba(0,255,210,.10);
	filter:blur(20px);
}

.productos-page .productos-panel-icon{
	position:relative;
	z-index:1;
	width:82px;
	height:82px;
	display:flex;
	align-items:center;
	justify-content:center;
	margin-bottom:28px;
	border-radius:25px;
	background:rgba(0,255,210,.08);
	border:1px solid rgba(0,255,210,.16);
	color:#00ffd0;
	font-size:2.05rem;
	box-shadow:0 0 35px rgba(0,255,210,.10);
}

.productos-page .productos-hero-panel h2{
	position:relative;
	z-index:1;
	color:#fff;
	font-size:clamp(1.65rem,2.4vw,2.25rem);
	line-height:1.15;
	margin-bottom:18px;
}

.productos-page .productos-hero-panel p{
	position:relative;
	z-index:1;
	color:#9ab0b3;
	font-size:1rem;
	line-height:1.85;
}

.productos-page .productos-catalogo{
	position:relative;
	padding:clamp(58px,7vh,100px) 0 clamp(48px,6vh,82px);
}

.productos-page .productos-catalogo-header{
	max-width:760px;
	margin:0 auto 42px;
	text-align:center;
}

.productos-page .productos-catalogo-header h2{
	color:#fff;
	font-size:clamp(2.05rem,3.4vw,3.2rem);
	line-height:1.1;
	margin:18px 0 16px;
}

.productos-page .productos-catalogo-header p{
	color:#9ab0b3;
	font-size:1.05rem;
	line-height:1.8;
}

.productos-page .productos-cards-grid{
	display:grid;
	grid-template-columns:repeat(3,minmax(0,1fr));
	gap:28px;
	align-items:stretch;
}

.productos-page .producto-card-prof{
	position:relative;
	overflow:hidden;
	display:flex;
	flex-direction:column;
	min-height:430px;
	padding:34px 30px 30px;
	border-radius:30px;
	background:
		radial-gradient(circle at top right, rgba(0,255,210,.10), transparent 40%),
		linear-gradient(180deg, rgba(8,19,29,.94), rgba(5,12,18,.98));
	border:1px solid rgba(255,255,255,.07);
	box-shadow:0 18px 48px rgba(0,0,0,.36);
	transition:transform .35s ease, border-color .35s ease, box-shadow .35s ease;
}

.productos-page .producto-card-prof::before{
	content:"";
	position:absolute;
	inset:0;
	background:linear-gradient(135deg, rgba(0,255,210,.12), transparent 45%);
	opacity:0;
	transition:.35s ease;
}

.productos-page .producto-card-prof:hover{
	transform:translateY(-10px);
	border-color:rgba(0,255,210,.25);
	box-shadow:0 0 42px rgba(0,255,210,.10), 0 28px 70px rgba(0,0,0,.50);
}

.productos-page .producto-card-prof:hover::before{
	opacity:1;
}

.productos-page .producto-card-top{
	position:relative;
	z-index:1;
	display:flex;
	justify-content:space-between;
	align-items:flex-start;
	gap:18px;
	margin-bottom:28px;
}

.productos-page .producto-card-top .icono{
	margin-bottom:0;
}

.productos-page .producto-numero{
	color:rgba(255,255,255,.12);
	font-size:2.5rem;
	font-weight:800;
	line-height:1;
	letter-spacing:-1px;
}

.productos-page .producto-card-prof h3{
	position:relative;
	z-index:1;
	color:#fff;
	font-size:1.55rem;
	margin-bottom:15px;
}

.productos-page .producto-card-prof p{
	position:relative;
	z-index:1;
	color:#9ab0b3;
	font-size:.98rem;
	line-height:1.75;
	margin-bottom:22px;
}

.productos-page .producto-card-prof ul{
	position:relative;
	z-index:1;
	list-style:none;
	padding:0;
	margin:0 0 28px;
}

.productos-page .producto-card-prof li{
	position:relative;
	padding-left:24px;
	margin-bottom:11px;
	color:#c8d6d8;
	font-size:.93rem;
	line-height:1.45;
}

.productos-page .producto-card-prof li::before{
	content:"\f00c";
	font-family:"Font Awesome 6 Free";
	font-weight:900;
	position:absolute;
	left:0;
	top:1px;
	color:#00ffd0;
	font-size:.76rem;
}

.productos-page .producto-card-link{
	position:relative;
	z-index:1;
	display:inline-flex;
	align-items:center;
	gap:10px;
	margin-top:auto;
	color:#00ffd0;
	font-weight:800;
	font-size:.93rem;
	letter-spacing:.2px;
}

.productos-page .producto-card-link i{
	transition:.3s ease;
}

.productos-page .producto-card-prof:hover .producto-card-link i{
	transform:translateX(5px);
}

.productos-page .productos-confianza{
	padding:clamp(18px,3vh,32px) 0 clamp(58px,7vh,92px);
}

.productos-page .productos-confianza-box{
	display:grid;
	grid-template-columns:repeat(3,minmax(0,1fr));
	gap:22px;
	padding:28px;
	border-radius:32px;
	background:rgba(8,19,29,.58);
	border:1px solid rgba(255,255,255,.06);
	box-shadow:0 18px 50px rgba(0,0,0,.28);
}

.productos-page .productos-confianza-item{
	padding:24px 22px;
	border-radius:24px;
	background:rgba(255,255,255,.025);
	border:1px solid rgba(255,255,255,.05);
}

.productos-page .productos-confianza-item i{
	color:#00ffd0;
	font-size:1.45rem;
	margin-bottom:16px;
}

.productos-page .productos-confianza-item h3{
	color:#fff;
	font-size:1.12rem;
	margin-bottom:10px;
}

.productos-page .productos-confianza-item p{
	color:#9ab0b3;
	font-size:.93rem;
	line-height:1.65;
}

.productos-page .productos-cta-actions{
	display:flex;
	justify-content:center;
	gap:16px;
	flex-wrap:wrap;
	margin-top:26px;
}

.productos-page .cta-box p{
	max-width:650px;
	margin:16px auto 0;
	color:#9ab0b3;
	line-height:1.75;
}

@media (max-width:1100px){
	.productos-page .productos-hero-grid{
		grid-template-columns:1fr;
	}

	.productos-page .productos-hero-text{
		text-align:center;
		margin:0 auto;
	}

	.productos-page .productos-hero-text p{
		margin-left:auto;
		margin-right:auto;
	}

	.productos-page .productos-hero-badges{
		justify-content:center;
	}

	.productos-page .productos-hero-panel{
		max-width:760px;
		margin:0 auto;
	}

	.productos-page .productos-cards-grid{
		grid-template-columns:1fr;
		max-width:760px;
		margin:0 auto;
	}

	.productos-page .producto-card-prof{
		min-height:auto;
	}
}

@media (max-width:780px){
	.productos-page .productos-hero{
		padding-top:34px;
		padding-bottom:58px;
	}

	.productos-page .productos-hero-panel{
		padding:32px 24px;
		border-radius:26px;
	}

	.productos-page .productos-panel-icon{
		width:68px;
		height:68px;
		font-size:1.65rem;
		border-radius:21px;
	}

	.productos-page .productos-catalogo{
		padding-top:58px;
	}

	.productos-page .productos-catalogo-header{
		margin-bottom:30px;
	}

	.productos-page .producto-card-prof{
		padding:28px 23px;
		border-radius:25px;
	}

	.productos-page .producto-numero{
		font-size:2.1rem;
	}

	.productos-page .productos-confianza-box{
		grid-template-columns:1fr;
		padding:18px;
		border-radius:26px;
	}
}

@media (max-width:520px){
	.productos-page .productos-hero-badges span{
		width:100%;
		justify-content:center;
	}

	.productos-page .productos-card-top{
		gap:12px;
	}
}

/* =========================================================
   AJUSTES FINALES PUBLICACIÓN 2026
   Menú móvil, responsive general, accesibilidad y pulido visual
========================================================= */

html,
body{
	max-width:100%;
	overflow-x:hidden;
}

.mobile-menu-toggle{
	display:none;
	align-items:center;
	justify-content:center;
	flex-direction:column;
	gap:5px;
	width:46px;
	height:46px;
	padding:0;
	margin-left:auto;
	border:1px solid rgba(0,255,208,0.22);
	border-radius:15px;
	background:rgba(3,10,15,0.74);
	color:#00ffd0;
	cursor:pointer;
	box-shadow:0 14px 36px rgba(0,0,0,0.28);
	transition:background .3s ease, border-color .3s ease, transform .3s ease;
}

.mobile-menu-toggle:hover,
.mobile-menu-toggle:focus-visible{
	background:rgba(0,255,208,0.10);
	border-color:rgba(0,255,208,0.48);
	outline:none;
}

.mobile-menu-toggle:active{
	transform:scale(.97);
}

.mobile-menu-line{
	display:block;
	width:21px;
	height:2px;
	border-radius:999px;
	background:#00ffd0;
	transition:transform .28s ease, opacity .28s ease;
}

.header.nav-open .mobile-menu-line:nth-child(1){
	transform:translateY(7px) rotate(45deg);
}

.header.nav-open .mobile-menu-line:nth-child(2){
	opacity:0;
}

.header.nav-open .mobile-menu-line:nth-child(3){
	transform:translateY(-7px) rotate(-45deg);
}

.btn-primary:focus-visible,
.btn-secondary:focus-visible,
.btn-enviar:focus-visible,
.menu a:focus-visible,
.logo-left:focus-visible,
.logo-right:focus-visible,
.sector-card:focus-visible,
.producto-card-premium:focus-visible{
	outline:2px solid rgba(0,255,208,0.9);
	outline-offset:4px;
}

.titulo-premium-telefonia{
	line-height:1.03;
}

.servicio-page .telefonia-image img,
.empresa-page .historia-item img,
.servicios-page .hero-secondary-visual img,
.donde-estamos-page .where-image img{
	width:100%;
	height:auto;
	object-fit:cover;
}

#form.is-sending .btn-enviar,
.btn-enviar:disabled{
	opacity:.72;
	cursor:not-allowed;
	transform:none;
}

#success-msg.form-error{
	background:rgba(255,80,80,0.10);
	border-color:rgba(255,80,80,0.28);
	color:#ffb3b3;
}

@media(max-width:980px){
	.nav-container{
		height:74px;
		position:relative;
	}

	.logo-left img{
		height:38px;
	}

	.logo-dropdown{
		display:none;
	}

	.mobile-menu-toggle{
		display:flex;
	}

	.header .menu{
		position:fixed;
		top:86px;
		left:5%;
		right:5%;
		display:flex !important;
		flex-direction:column;
		gap:6px;
		padding:16px;
		border:1px solid rgba(0,255,208,0.16);
		border-radius:22px;
		background:linear-gradient(180deg, rgba(5,14,22,0.98), rgba(3,10,15,0.98));
		box-shadow:0 24px 60px rgba(0,0,0,0.45);
		backdrop-filter:blur(22px);
		-webkit-backdrop-filter:blur(22px);
		opacity:0;
		visibility:hidden;
		pointer-events:none;
		transform:translateY(-14px);
		transition:opacity .28s ease, visibility .28s ease, transform .28s ease;
	}

	.header.nav-open .menu{
		opacity:1;
		visibility:visible;
		pointer-events:auto;
		transform:translateY(0);
	}

	.header .menu a{
		width:100%;
		padding:14px 16px;
		border-radius:14px;
		font-size:1rem;
		background:rgba(255,255,255,0.025);
	}

	.header .menu a:hover,
	.header .menu a.active{
		background:rgba(0,255,208,0.10);
		color:#00ffd0;
	}

	.header .menu a::after{
		display:none;
	}

	.hero,
	.hero-secondary,
	.servicio-page .telefonia-top,
	.productos-page .telefonia-top{
		padding-top:clamp(72px, 12vw, 104px) !important;
	}

	.servicio-page .telefonia-content,
	.productos-page .productos-hero-grid,
	.contacto-hero-container{
		grid-template-columns:1fr !important;
	}

	.servicio-page .telefonia-title,
	.productos-page .productos-hero-text{
		text-align:center;
		margin-left:auto;
		margin-right:auto;
	}

	.productos-page .productos-hero-badges,
	.productos-page .productos-hero-actions{
		justify-content:center;
	}

	.contacto-page .contact-form-wrapper{
		width:100%;
	}
}

@media(max-width:768px){
	.container{
		width:92%;
	}

	.hero h1,
	.hero-secondary h1,
	.page-hero h1,
	.servicio-page .titulo-premium-telefonia{
		font-size:clamp(2.25rem, 11vw, 3.25rem) !important;
		letter-spacing:-1.5px !important;
		line-height:1.02 !important;
	}

	.servicio-page .telefonia-title p,
	.productos-page .productos-hero-text p,
	.hero-secondary p{
		font-size:1rem !important;
		line-height:1.7 !important;
	}

	.form-grid,
	.contacto-extra-grid,
	.servicio-page .diferencial-grid,
	.servicio-page .sectores-grid,
	.grid-3-center,
	.productos-page .productos-catalogo-grid,
	.productos-page .productos-confianza-grid,
	.telefonos-grid{
		grid-template-columns:1fr !important;
	}

	.sector-card,
	.diferencial-item,
	.producto-card-premium,
	.producto-confianza-card,
	.telefono-card{
		min-height:auto !important;
	}

	.cta-box{
		padding:38px 24px !important;
	}

	.footer-content{
		gap:28px;
		text-align:center;
	}

	.footer-left,
	.footer-right{
		align-items:center;
	}
}

@media(max-width:480px){
	.header .menu{
		left:4%;
		right:4%;
		top:78px;
	}

	.logo-left img{
		height:34px;
	}

	.mobile-menu-toggle{
		width:43px;
		height:43px;
		border-radius:14px;
	}

	.btn-primary,
	.btn-secondary,
	.btn-enviar{
		width:100%;
		justify-content:center;
		text-align:center;
	}

	.productos-page .productos-hero-badges span{
		width:100%;
		justify-content:center;
	}

	.input-group input,
	.input-group textarea{
		font-size:.95rem;
		padding-left:48px;
	}
}

/* =========================================================
   MOBILE REDESIGN V2 - MARBE COMUNICACIONES
   Rediseño móvil real: menos huecos, mejor jerarquía,
   tarjetas compactas y navegación limpia.
========================================================= */

@media (hover:none) and (pointer:coarse){
  .service-card:hover,
  .servicio-page .sector-card:hover,
  .servicio-page .servicio-box:hover,
  .servicio-page .servicio-link-card:hover,
  .producto-detalle-page .producto-card:hover,
  .productos-page .producto-card-prof:hover,
  .contacto-extra-card:hover,
  .stat-card:hover{
    transform:none !important;
  }
}

@media (max-width: 820px){
  html{
    scroll-padding-top:68px;
  }

  body{
    font-size:16px;
    line-height:1.55;
    background:
      radial-gradient(circle at 85% 8%, rgba(0,255,210,.11), transparent 30%),
      linear-gradient(145deg,#02070d 0%,#07131b 55%,#081922 100%) !important;
  }

  body::before{
    filter:blur(28px);
    opacity:.62;
    animation:none;
  }

  body::after{
    background-size:42px 42px;
    opacity:.13;
  }

  .container{
    width:min(100% - 32px, 560px) !important;
    max-width:560px !important;
  }

  /* HEADER / MENÚ MÓVIL */
  .header{
    position:sticky;
    top:0;
    background:rgba(3,10,15,.94) !important;
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
    box-shadow:0 12px 34px rgba(0,0,0,.32);
  }

  .nav-container{
    height:64px !important;
    width:min(100% - 28px, 560px) !important;
  }

  .logo-left img{
    height:33px !important;
    width:auto;
  }

  .logo-dropdown{
    display:none !important;
  }

  .mobile-menu-toggle{
    display:flex !important;
    width:44px !important;
    height:44px !important;
    border-radius:14px !important;
    background:rgba(255,255,255,.045) !important;
    border:1px solid rgba(0,255,208,.24) !important;
    box-shadow:none !important;
  }

  .mobile-menu-line{
    width:20px;
  }

  .header .menu{
    position:fixed !important;
    top:74px !important;
    left:16px !important;
    right:16px !important;
    z-index:1000;
    display:flex !important;
    flex-direction:column !important;
    gap:8px !important;
    max-height:calc(100svh - 92px);
    overflow:auto;
    padding:12px !important;
    border-radius:22px !important;
    background:
      radial-gradient(circle at top right, rgba(0,255,210,.12), transparent 34%),
      linear-gradient(180deg, rgba(6,17,25,.98), rgba(3,9,14,.99)) !important;
    border:1px solid rgba(0,255,208,.18) !important;
    box-shadow:0 24px 70px rgba(0,0,0,.56) !important;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateY(-12px) scale(.98);
    transition:opacity .22s ease, visibility .22s ease, transform .22s ease;
  }

  .header.nav-open .menu{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:translateY(0) scale(1);
  }

  .header .menu a{
    width:100%;
    min-height:50px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:14px 15px !important;
    border-radius:15px !important;
    color:#e9fffb !important;
    font-size:.98rem !important;
    font-weight:700 !important;
    background:rgba(255,255,255,.035) !important;
    border:1px solid rgba(255,255,255,.045);
  }

  .header .menu a::before{
    content:"";
    width:8px;
    height:8px;
    margin-right:10px;
    border-radius:50%;
    background:rgba(0,255,208,.38);
    box-shadow:0 0 16px rgba(0,255,208,.22);
  }

  .header .menu a::after{
    content:"›" !important;
    position:static !important;
    display:block !important;
    width:auto !important;
    height:auto !important;
    margin-left:auto;
    color:#00ffd0;
    background:none !important;
    font-size:1.15rem;
    line-height:1;
  }

  .header .menu a.active,
  .header .menu a:hover{
    color:#061014 !important;
    background:linear-gradient(135deg,#00ffd0,#00c8b4) !important;
    border-color:transparent !important;
  }

  .header .menu a.active::before,
  .header .menu a:hover::before{
    background:#061014;
    box-shadow:none;
  }

  .header .menu a.active::after,
  .header .menu a:hover::after{
    color:#061014;
  }

  /* BOTONES */
  .hero-buttons,
  .productos-page .productos-cta-actions,
  .producto-detalle-page .cta-actions{
    width:100%;
    display:flex;
    flex-direction:column;
    align-items:stretch !important;
    gap:12px !important;
  }

  .btn-primary,
  .btn-secondary,
  .btn-enviar{
    width:100% !important;
    min-height:50px;
    display:inline-flex !important;
    align-items:center;
    justify-content:center !important;
    padding:14px 18px !important;
    border-radius:15px !important;
    text-align:center !important;
    font-size:.96rem !important;
    line-height:1.2;
  }

  /* HOME */
  .hero{
    min-height:auto !important;
    padding:78px 0 48px !important;
    align-items:flex-start !important;
  }

  .hero-home::before{
    transform:none !important;
    background:
      linear-gradient(180deg, rgba(2,7,12,.93) 0%, rgba(2,7,12,.76) 55%, rgba(2,7,12,.94) 100%),
      radial-gradient(circle at 50% 20%, rgba(0,255,210,.16), transparent 34%),
      url("../images/N-torreTelecomunicacionesH(index).webp") !important;
    background-size:cover !important;
    background-position:69% center !important;
  }

  .hero-home::after{
    opacity:.45 !important;
  }

  .hero-content{
    width:100% !important;
    max-width:560px !important;
    padding:0 !important;
    align-items:center !important;
    text-align:center !important;
    transform:none !important;
  }

  .hero-kicker{
    justify-content:center;
    gap:9px;
    margin-bottom:16px !important;
    font-size:.70rem !important;
    letter-spacing:1.7px !important;
    line-height:1.25;
  }

  .hero-kicker::before{
    width:22px !important;
  }

  .hero h1,
  .hero-secondary h1,
  .page-hero h1,
  .servicio-page .titulo-premium-telefonia,
  .productos-page .productos-hero-text .titulo-premium-telefonia{
    max-width:100% !important;
    margin-left:auto !important;
    margin-right:auto !important;
    font-size:clamp(2rem, 8.2vw, 2.85rem) !important;
    line-height:1.08 !important;
    letter-spacing:-.045em !important;
    text-transform:none !important;
  }

  .hero p,
  .hero-secondary p,
  .page-hero p,
  .servicio-page .telefonia-title p,
  .productos-page .productos-hero-text p{
    max-width:100% !important;
    margin-left:auto !important;
    margin-right:auto !important;
    font-size:.98rem !important;
    line-height:1.68 !important;
    color:#b6c9cb !important;
  }

  .hero p{
    margin-bottom:24px !important;
  }

  .stats{
    margin-top:34px !important;
    margin-bottom:48px !important;
  }

  .stats-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:12px !important;
  }

  .stat-card{
    padding:20px 12px !important;
    border-radius:18px !important;
    box-shadow:0 12px 30px rgba(0,0,0,.28) !important;
  }

  .stat-card i{
    font-size:24px !important;
    margin-bottom:12px !important;
  }

  .stat-card h3{
    font-size:28px !important;
    margin-bottom:4px !important;
  }

  .stat-card p{
    font-size:.78rem !important;
    line-height:1.35 !important;
  }

  .experience,
  .servicios,
  .experience-premium{
    padding-top:50px !important;
    padding-bottom:42px !important;
  }

  .experience-header,
  .productos-catalogo-header{
    text-align:left !important;
    margin-bottom:24px !important;
  }

  .section-tag{
    font-size:.68rem !important;
    letter-spacing:1.7px !important;
    margin-bottom:12px !important;
  }

  .section-title,
  .experience h2,
  .experience-header h2,
  .titulo-seccion,
  .productos-page .productos-catalogo-header h2,
  .cta-box h2{
    font-size:clamp(1.65rem, 7vw, 2.1rem) !important;
    line-height:1.16 !important;
    letter-spacing:-.035em !important;
    margin-bottom:18px !important;
    text-align:left !important;
  }

  .titulo-seccion::after{
    margin-left:0 !important;
    margin-right:auto !important;
  }

  .section-subtitle,
  .experience-header p,
  .productos-page .productos-catalogo-header p{
    margin:0 0 24px !important;
    font-size:.96rem !important;
    line-height:1.65 !important;
    color:#a9bdc0 !important;
    text-align:left !important;
  }

  .experience-timeline,
  .services-grid,
  .servicios-premium .sectores-grid,
  .servicio-page .sectores-grid,
  .servicio-page .diferencial-grid,
  .servicio-page .servicios-grid,
  .contacto-extra-grid,
  .productos-page .productos-cards-grid,
  .productos-page .productos-confianza-box,
  .producto-detalle-page .productos-grid{
    grid-template-columns:1fr !important;
    gap:14px !important;
    max-width:100% !important;
  }

  .experience-timeline{
    margin-top:22px !important;
  }

  .experience-timeline::before{
    display:none !important;
  }

  .experience-step,
  .service-card,
  .servicios-premium .sector-card,
  .servicio-page .sector-card,
  .servicio-page .diferencial-item,
  .servicio-page .servicio-box,
  .servicio-page .servicio-link-card,
  .producto-detalle-page .producto-card,
  .productos-page .producto-card-prof,
  .productos-page .productos-confianza-item,
  .contacto-extra-card{
    min-height:auto !important;
    padding:22px 19px !important;
    border-radius:22px !important;
    box-shadow:0 14px 34px rgba(0,0,0,.28) !important;
  }

  .experience-step{
    text-align:left !important;
    display:grid;
    grid-template-columns:auto 1fr;
    column-gap:14px;
    align-items:start;
  }

  .experience-step .step-number{
    position:static !important;
    grid-row:1 / span 3;
    display:flex;
    width:42px;
    height:42px;
    align-items:center;
    justify-content:center;
    border-radius:14px;
    background:rgba(0,255,210,.08);
    border:1px solid rgba(0,255,210,.16);
    color:#00ffd0 !important;
    font-size:.82rem !important;
    opacity:1 !important;
  }

  .experience-step .step-icon,
  .service-card i,
  .servicio-page .icono,
  .servicio-page .servicio-icon,
  .productos-page .producto-card-top .icono,
  .contacto-extra-card .icono,
  .contacto-data-item i{
    width:48px !important;
    height:48px !important;
    min-width:48px !important;
    border-radius:16px !important;
    margin-bottom:16px !important;
    font-size:1.22rem !important;
  }

  .experience-step .step-icon{
    display:none !important;
  }

  .experience-step h3,
  .service-card h3,
  .servicios-premium .sector-card h3,
  .servicio-page .sector-card h3,
  .servicio-page .diferencial-item h3,
  .servicio-page .servicio-box h3,
  .servicio-page .servicio-link-card h3,
  .producto-detalle-page .producto-card h3,
  .productos-page .producto-card-prof h3,
  .productos-page .productos-confianza-item h3{
    font-size:1.12rem !important;
    line-height:1.25 !important;
    margin-bottom:9px !important;
  }

  .experience-step p,
  .service-card p,
  .servicios-premium .sector-card p,
  .servicio-page .sector-card p,
  .servicio-page .diferencial-item p,
  .servicio-page .servicio-box p,
  .servicio-page .servicio-link-card p,
  .producto-detalle-page .producto-card p,
  .productos-page .producto-card-prof p,
  .productos-page .productos-confianza-item p{
    font-size:.92rem !important;
    line-height:1.58 !important;
    margin-bottom:0 !important;
  }

  .service-number,
  .productos-page .producto-numero{
    font-size:1.6rem !important;
    opacity:.75;
  }

  .cta-section{
    padding:44px 0 56px !important;
  }

  .cta-box{
    padding:28px 20px !important;
    border-radius:24px !important;
    text-align:left !important;
  }

  .cta-box h2{
    max-width:100% !important;
    margin:0 0 20px !important;
  }

  .cta-box p{
    text-align:left !important;
  }

  /* HERO SECUNDARIO / SERVICIOS */
  .hero-secondary{
    min-height:auto !important;
    padding:78px 0 46px !important;
  }

  .hero-secondary-container,
  .contacto-hero-container{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:24px !important;
    min-height:0 !important;
    text-align:center !important;
    transform:none !important;
  }

  .hero-secondary-content{
    text-align:center !important;
    align-items:center !important;
    transform:none !important;
  }

  .hero-secondary-visual{
    width:100% !important;
    justify-content:center !important;
    padding:0 !important;
    transform:none !important;
  }

  .hero-image-wrapper,
  .servicios-image-card{
    max-width:100% !important;
    border-radius:24px !important;
  }

  .hero-image-wrapper img,
  .servicios-hero-img{
    width:100% !important;
    height:210px !important;
    max-height:210px !important;
    object-fit:cover !important;
    border-radius:22px !important;
  }

  .servicios-section,
  .servicios-premium,
  .diferencial,
  .sectores,
  .servicio-page .sectores,
  .servicio-page .servicios-links,
  .servicio-page .servicios-detalle,
  .producto-detalle-page .productos-detalle-section{
    padding:48px 0 !important;
  }

  /* PÁGINAS DE SERVICIO */
  .servicio-page .telefonia-top,
  .servicio-page .telefonia-top.detalle-hero,
  .productos-page .productos-hero{
    padding:36px 0 44px !important;
  }

  .servicio-page .telefonia-title{
    max-width:100% !important;
    margin:0 auto 24px !important;
    text-align:center !important;
  }

  .servicio-page .telefonia-content,
  .productos-page .productos-hero-grid{
    grid-template-columns:1fr !important;
    gap:20px !important;
  }

  .servicio-page .telefonia-text{
    padding:23px 20px !important;
    border-radius:24px !important;
  }

  .servicio-page .telefonia-text h2{
    font-size:1.45rem !important;
    line-height:1.18 !important;
    margin-bottom:14px !important;
  }

  .servicio-page .telefonia-text p{
    font-size:.94rem !important;
    line-height:1.68 !important;
    margin-bottom:14px !important;
  }

  .servicio-page .telefonia-image{
    border-radius:24px !important;
  }

  .servicio-page .telefonia-image img{
    min-height:0 !important;
    height:auto !important;
    max-height:230px !important;
    aspect-ratio:16 / 10 !important;
    object-fit:cover !important;
    border-radius:24px !important;
  }

  .servicio-page .logos-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:14px !important;
    margin-top:24px !important;
  }

  .servicio-page .logo-item{
    min-height:112px !important;
    padding:20px 16px !important;
    border-radius:20px !important;
  }

  .servicio-page .logo-item img{
    max-height:64px !important;
  }

  /* PRODUCTOS */
  .productos-page .productos-hero-text{
    text-align:center !important;
  }

  .productos-page .productos-hero-badges{
    justify-content:center !important;
    gap:9px !important;
    margin-top:20px !important;
  }

  .productos-page .productos-hero-badges span{
    width:auto !important;
    justify-content:center !important;
    padding:9px 12px !important;
    font-size:.78rem !important;
  }

  .productos-page .productos-hero-panel{
    padding:22px 19px !important;
    border-radius:22px !important;
    text-align:left !important;
  }

  .productos-page .productos-panel-icon{
    width:54px !important;
    height:54px !important;
    border-radius:17px !important;
    margin-bottom:15px !important;
    font-size:1.35rem !important;
  }

  .productos-page .productos-hero-panel h2{
    font-size:1.32rem !important;
    line-height:1.22 !important;
    margin-bottom:10px !important;
  }

  .productos-page .productos-hero-panel p{
    font-size:.92rem !important;
    line-height:1.58 !important;
  }

  .productos-page .productos-catalogo{
    padding:42px 0 !important;
  }

  .productos-page .producto-card-top{
    margin-bottom:16px !important;
  }

  .productos-page .producto-card-prof ul{
    margin:16px 0 18px !important;
  }

  .productos-page .producto-card-prof li{
    font-size:.88rem !important;
    line-height:1.42 !important;
    margin-bottom:9px !important;
  }

  .productos-page .producto-card-link{
    margin-top:18px !important;
    font-size:.9rem !important;
  }

  .productos-page .productos-confianza{
    padding:18px 0 46px !important;
  }

  .productos-page .productos-confianza-box{
    padding:0 !important;
    background:transparent !important;
    border:none !important;
    box-shadow:none !important;
  }

  /* DETALLE PRODUCTOS / TELÉFONOS */
  .producto-detalle-page .producto-img{
    height:150px !important;
    border-radius:18px !important;
    margin-bottom:18px !important;
  }

  .producto-detalle-page .producto-img img{
    padding:14px !important;
  }

  .producto-detalle-page .producto-imagen-contain{
    padding:22px !important;
  }

  .producto-detalle-page .producto-imagen-contain img{
    padding:14px !important;
    border-radius:18px !important;
  }

  .producto-detalle-page .producto-historia-icono{
    min-height:150px !important;
    border-radius:22px !important;
  }

  .producto-detalle-page .producto-historia-icono i{
    font-size:3.2rem !important;
  }

  /* CONTACTO */
  .contacto-page .contacto-hero{
    min-height:auto !important;
    padding:74px 0 44px !important;
  }

  .contacto-page .contacto-hero-container{
    align-items:start !important;
    text-align:center !important;
  }

  .contacto-data{
    margin-top:22px !important;
    gap:10px !important;
  }

  .contacto-data-item{
    align-items:flex-start !important;
    gap:12px !important;
    padding:12px !important;
    border-radius:16px;
    background:rgba(255,255,255,.026);
    border:1px solid rgba(255,255,255,.045);
    text-align:left;
    font-size:.9rem !important;
  }

  .contact-form-card{
    padding:23px 19px !important;
    border-radius:24px !important;
  }

  .form-top{
    margin-bottom:18px !important;
  }

  .form-top h2{
    font-size:1.45rem !important;
    line-height:1.2 !important;
    margin-bottom:8px !important;
  }

  .form-top p{
    font-size:.92rem !important;
    line-height:1.58 !important;
  }

  .form-grid{
    grid-template-columns:1fr !important;
    gap:12px !important;
    margin-bottom:12px !important;
  }

  .input-group input,
  .input-group textarea{
    min-height:50px !important;
    padding:14px 14px 14px 46px !important;
    border-radius:15px !important;
    font-size:.94rem !important;
  }

  .input-group textarea{
    min-height:118px !important;
  }

  .input-group i{
    left:16px !important;
    top:17px !important;
  }

  /* DÓNDE ESTAMOS */
  .donde-estamos-page .ubicacion-section{
    padding:46px 0 !important;
  }

  .ubicacion-image,
  .where-image{
    border-radius:24px !important;
    overflow:hidden;
  }

  .ubicacion-image img,
  .where-image img{
    height:auto !important;
    max-height:240px !important;
    object-fit:cover !important;
  }

  /* FOOTER */
  .footer{
    padding:38px 0 !important;
  }

  .footer-content{
    flex-direction:column !important;
    align-items:center !important;
    gap:20px !important;
    text-align:center !important;
  }

  .footer-left,
  .footer-right{
    align-items:center !important;
    text-align:center !important;
  }

  .footer-left img{
    height:36px !important;
    margin:0 auto 8px !important;
  }

  .footer-right{
    gap:9px !important;
  }

  .footer-right p{
    justify-content:center !important;
    font-size:.88rem !important;
    line-height:1.45 !important;
  }

  .float-contact{
    right:16px !important;
    bottom:16px !important;
    width:50px !important;
    height:50px !important;
    box-shadow:0 14px 32px rgba(0,0,0,.32) !important;
  }
}

@media (max-width: 480px){
  .container{
    width:min(100% - 26px, 440px) !important;
  }

  .nav-container{
    width:min(100% - 24px, 440px) !important;
  }

  .hero{
    padding-top:68px !important;
    padding-bottom:40px !important;
  }

  .hero h1,
  .hero-secondary h1,
  .page-hero h1,
  .servicio-page .titulo-premium-telefonia,
  .productos-page .productos-hero-text .titulo-premium-telefonia{
    font-size:clamp(1.85rem, 9vw, 2.45rem) !important;
    line-height:1.09 !important;
  }

  .hero p,
  .hero-secondary p,
  .servicio-page .telefonia-title p,
  .productos-page .productos-hero-text p{
    font-size:.94rem !important;
  }

  .stats-grid{
    gap:10px !important;
  }

  .stat-card{
    padding:17px 10px !important;
  }

  .stat-card h3{
    font-size:25px !important;
  }

  .experience-step,
  .service-card,
  .servicios-premium .sector-card,
  .servicio-page .sector-card,
  .servicio-page .diferencial-item,
  .servicio-page .servicio-box,
  .servicio-page .servicio-link-card,
  .producto-detalle-page .producto-card,
  .productos-page .producto-card-prof,
  .productos-page .productos-confianza-item,
  .contacto-extra-card{
    padding:20px 17px !important;
    border-radius:20px !important;
  }

  .servicio-page .logos-grid{
    grid-template-columns:1fr !important;
  }

  .productos-page .productos-hero-badges{
    align-items:stretch !important;
  }

  .productos-page .productos-hero-badges span{
    width:100% !important;
  }

  .hero-image-wrapper img,
  .servicios-hero-img,
  .servicio-page .telefonia-image img{
    max-height:205px !important;
  }
}

/* =========================================================
   MOBILE REDESIGN V2.1 - páginas empresa y ubicación
========================================================= */
@media (max-width: 820px){
  .empresa-grid,
  .empresa-page .sectores-grid,
  .empresa-page .diferencial-grid,
  .ubicacion-grid,
  .ubicacion-cards{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:14px !important;
  }

  .empresa-card,
  .historia-item,
  .empresa-page .sector-card,
  .empresa-page .diferencial-item,
  .ubicacion-card,
  .mapa-box{
    padding:22px 19px !important;
    border-radius:22px !important;
    min-height:auto !important;
    box-shadow:0 14px 34px rgba(0,0,0,.28) !important;
  }

  .empresa-historia,
  .empresa-page .sectores,
  .empresa-page .diferencial,
  .donde-estamos-page .ubicacion-section{
    padding:48px 0 !important;
  }

  .historia-item,
  .historia-item.reverse{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:18px !important;
  }

  .historia-item.reverse .historia-img,
  .historia-item.reverse .historia-texto{
    order:initial !important;
  }

  .historia-texto h2,
  .empresa-card h3,
  .ubicacion-card h3,
  .ubicacion-info h2{
    font-size:1.28rem !important;
    line-height:1.22 !important;
    margin-bottom:10px !important;
  }

  .historia-texto p,
  .empresa-card p,
  .ubicacion-card p,
  .ubicacion-info p{
    font-size:.93rem !important;
    line-height:1.6 !important;
  }

  .historia-img,
  .glass-image,
  .ubicacion-image{
    border-radius:22px !important;
    overflow:hidden !important;
  }

  .historia-img img,
  .glass-image img,
  .ubicacion-image img{
    width:100% !important;
    height:auto !important;
    max-height:230px !important;
    object-fit:cover !important;
  }

  .historia-puntos,
  .proceso{
    gap:10px !important;
  }

  .proceso-num{
    width:38px !important;
    height:38px !important;
    min-width:38px !important;
    border-radius:13px !important;
    font-size:.82rem !important;
  }

  .mapa-box iframe,
  .mapa-box > *{
    max-width:100% !important;
  }
}

/* =========================================================
   MOBILE FIX V3 - HEADER FIJO + ENLACE A MARBECOM
   Corrige que la hamburguesa desaparezca al hacer scroll.
========================================================= */
.site-switch-mobile{
  display:none !important;
}

@media (max-width: 980px){
  body.mobile-menu-open{
    overflow:hidden !important;
  }

  .header{
    position:fixed !important;
    top:0 !important;
    left:0 !important;
    right:0 !important;
    width:100% !important;
    z-index:9999 !important;
  }

  body{
    padding-top:64px !important;
  }

  .nav-container{
    height:64px !important;
  }

  .header .menu{
    position:fixed !important;
    top:74px !important;
    left:16px !important;
    right:16px !important;
    z-index:10000 !important;
    max-height:calc(100svh - 92px) !important;
    overflow:auto !important;
    -webkit-overflow-scrolling:touch;
  }

  .site-switch-mobile{
    display:flex !important;
    margin-top:8px !important;
    background:linear-gradient(135deg, rgba(0,255,208,.18), rgba(0,160,255,.12)) !important;
    border:1px solid rgba(0,255,208,.30) !important;
    color:#ffffff !important;
  }

  .site-switch-mobile::before{
    background:#00ffd0 !important;
  }

  .site-switch-mobile::after{
    content:"↗" !important;
    color:#00ffd0 !important;
  }
}

@media (max-width: 480px){
  .header .menu{
    top:72px !important;
    left:12px !important;
    right:12px !important;
  }
}

/* =========================================================
   FINAL POLISH - MARBECOMUNICACIONES PUBLICACIÓN
========================================================= */

#success-msg.form-error{
  background:rgba(255,75,75,.12) !important;
  border-color:rgba(255,75,75,.28) !important;
  color:#ffd7d7 !important;
}

@media (max-width:980px){
  .site-switch-mobile{
    margin-top:12px !important;
    min-height:56px !important;
    background:linear-gradient(135deg,#2ed3ff,#00ffd0) !important;
    color:#041014 !important;
    border:0 !important;
    box-shadow:0 16px 35px rgba(46,211,255,.18) !important;
  }

  .site-switch-mobile::before{
    background:#041014 !important;
    box-shadow:none !important;
  }

  .site-switch-mobile::after{
    color:#041014 !important;
    font-weight:900 !important;
  }

  .float-contact{
    width:48px !important;
    height:48px !important;
    right:14px !important;
    bottom:14px !important;
  }

  .contacto-page .float-contact{
    display:none !important;
  }
}


/* =========================================================
   AJUSTE FINAL HEADER COMPARTIDO
   Mantiene la misma posición visual de logos entre ambas webs
========================================================= */
@media (min-width:981px){
  .header .nav-container{
    width:min(100% - 48px, 1180px) !important;
    max-width:1180px !important;
    margin:0 auto !important;
    height:82px !important;
    padding:0 !important;
  }

  .header .logo-left img{
    height:42px !important;
    width:auto !important;
    display:block !important;
  }

  .header .logo-right img{
    height:28px !important;
    width:auto !important;
    display:block !important;
  }
}


/* =========================================================
   FIX DROPDOWN HEADER - EVITA QUE SE CIERRE AL BAJAR EL RATÓN
   Crea una zona invisible entre el logo/enlace y el desplegable.
========================================================= */
@media (min-width:981px){
  .header .dropdown,
  .header .logo-dropdown{
    position:relative !important;
  }

  .header .dropdown::after,
  .header .logo-dropdown::after{
    content:"";
    position:absolute;
    left:-18px;
    right:-18px;
    top:100%;
    height:28px;
    display:block;
    background:transparent;
    pointer-events:auto;
  }

  .header .dropdown-content{
    top:calc(100% + 10px) !important;
    pointer-events:none;
  }

  .header .dropdown:hover .dropdown-content,
  .header .dropdown:focus-within .dropdown-content,
  .header .logo-dropdown:hover .dropdown-content,
  .header .logo-dropdown:focus-within .dropdown-content{
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
    transform:translateY(0) !important;
  }

  .header .dropdown-content:hover{
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
    transform:translateY(0) !important;
  }
}


/* =========================================================
   AJUSTES FINALES CHATGPT - RESPONSIVE MARBECOMUNICACIONES
   Fecha: 2026-06-18
========================================================= */

html,
body{
  max-width:100%;
  overflow-x:hidden;
}

body{
  background-color:#02070d;
}

.container{
  width:min(100% - 48px, 1200px);
}

/* Imagen principal de empresa preparada para PNG transparente */
.empresa-page .hero-image-wrapper{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  overflow:visible !important;
}

.empresa-page .hero-image-wrapper::before{
  display:none !important;
}

.empresa-page .hero-image-wrapper img[src$="N-PrincipioPagina(empresa).png"]{
  background:transparent !important;
  border-radius:0 !important;
  box-shadow:none !important;
  filter:drop-shadow(0 28px 44px rgba(0,255,210,.12));
}

@media (min-width:981px){
  .hero-secondary{
    min-height:calc(100svh - 82px) !important;
    padding-top:clamp(54px,7vh,92px) !important;
    padding-bottom:clamp(48px,6vh,76px) !important;
  }

  .hero-secondary-container{
    grid-template-columns:minmax(0,.95fr) minmax(420px,1.05fr) !important;
    gap:clamp(36px,5vw,72px) !important;
  }

  .hero-secondary-visual{
    padding-left:clamp(20px,4vw,60px) !important;
  }

  .hero-image-wrapper img{
    width:min(100%, 650px) !important;
    max-width:100% !important;
    max-height:520px !important;
    object-fit:contain !important;
  }

  .servicios-page .servicios-visual{
    transform:none !important;
  }

  .servicios-page .hero-secondary-container{
    grid-template-columns:minmax(0,1fr) minmax(420px,1fr) !important;
    gap:clamp(42px,6vw,86px) !important;
  }

  .servicio-page .telefonia-top.detalle-hero,
  .servicio-page .telefonia-top{
    padding-top:clamp(28px,4vh,48px) !important;
    padding-bottom:clamp(44px,5vh,66px) !important;
  }

  .servicio-page .telefonia-title{
    margin-bottom:clamp(24px,3vh,40px) !important;
  }

  .servicio-page .titulo-premium-telefonia{
    font-size:clamp(2.65rem,4.4vw,4.55rem) !important;
    line-height:1.02 !important;
  }

  .servicio-page .telefonia-content{
    grid-template-columns:minmax(0,.96fr) minmax(380px,1.04fr) !important;
    gap:clamp(34px,4vw,56px) !important;
    align-items:center !important;
  }

  .servicio-page .telefonia-text{
    padding:clamp(30px,3vw,42px) !important;
  }

  .servicio-page .telefonia-image{
    align-self:center !important;
  }

  .servicio-page .telefonia-image img{
    width:100% !important;
    max-height:430px !important;
    object-fit:contain !important;
  }

  .servicio-page .diferencial-grid,
  .servicio-page .sectores-grid,
  .servicios-premium .sectores-grid{
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  }

  .servicio-page .diferencial-grid.grid-3-center,
  .servicio-page .diferencial-grid:has(> :nth-child(3):last-child),
  .servicio-page .sectores-grid:has(> :nth-child(3):last-child){
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    max-width:980px !important;
    margin-left:auto !important;
    margin-right:auto !important;
    justify-content:center !important;
  }

  .servicio-page .logos-grid{
    grid-template-columns:repeat(4,minmax(170px,1fr)) !important;
    gap:28px !important;
    width:100% !important;
  }

  .servicio-page .logo-item{
    min-height:150px !important;
    padding:32px 26px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
  }

  .servicio-page .logo-item img{
    max-width:88% !important;
    max-height:82px !important;
    object-fit:contain !important;
  }
}

@media (min-width:981px) and (max-width:1400px){
  .header .nav-container{
    width:min(100% - 42px, 1120px) !important;
  }

  .menu{
    gap:26px !important;
  }

  .menu a{
    font-size:16px !important;
  }

  .hero-secondary h1{
    font-size:clamp(3rem,4.7vw,4.9rem) !important;
  }

  .hero-secondary p{
    font-size:1rem !important;
    line-height:1.75 !important;
  }
}

@media (min-width:981px) and (max-height:820px){
  .hero-secondary{
    min-height:calc(100svh - 82px) !important;
    padding-top:44px !important;
    padding-bottom:44px !important;
  }

  .hero-secondary h1{
    font-size:clamp(2.75rem,4.1vw,4.25rem) !important;
    margin-bottom:22px !important;
  }

  .hero-secondary p{
    font-size:.98rem !important;
    line-height:1.62 !important;
    margin-bottom:28px !important;
  }

  .hero-kicker{
    margin-bottom:18px !important;
  }

  .hero-image-wrapper img{
    max-height:410px !important;
  }

  .servicio-page .telefonia-top.detalle-hero,
  .servicio-page .telefonia-top{
    padding-top:24px !important;
    padding-bottom:42px !important;
  }

  .servicio-page .telefonia-title{
    margin-bottom:22px !important;
  }

  .servicio-page .titulo-premium-telefonia{
    font-size:clamp(2.35rem,4vw,3.8rem) !important;
    margin-bottom:14px !important;
  }

  .servicio-page .telefonia-title p{
    font-size:1rem !important;
    line-height:1.55 !important;
  }

  .servicio-page .telefonia-text{
    padding:30px !important;
  }

  .servicio-page .telefonia-text h2{
    font-size:2rem !important;
    margin-bottom:18px !important;
  }

  .servicio-page .telefonia-text p{
    font-size:.94rem !important;
    line-height:1.68 !important;
  }

  .servicio-page .telefonia-image img{
    max-height:360px !important;
  }
}

@media (max-width:980px){
  body{
    padding-top:64px !important;
  }

  .container{
    width:min(100% - 34px, 760px) !important;
  }

  .header{
    position:fixed !important;
    top:0 !important;
    left:0 !important;
    right:0 !important;
    width:100% !important;
  }

  .header .nav-container{
    height:64px !important;
    width:min(100% - 28px, 760px) !important;
  }

  .logo-left img{
    height:36px !important;
    width:auto !important;
  }

  .logo-dropdown{
    display:none !important;
  }

  .hero,
  .hero-secondary,
  .servicio-page .telefonia-top,
  .productos-page .telefonia-top{
    min-height:auto !important;
    padding-top:46px !important;
    padding-bottom:54px !important;
  }

  .hero-secondary-container,
  .servicio-page .telefonia-content,
  .contacto-hero-container,
  .ubicacion-grid,
  .empresa-historia .historia-item{
    grid-template-columns:1fr !important;
    gap:28px !important;
  }

  .hero-secondary-content,
  .servicio-page .telefonia-title,
  .servicio-page .telefonia-text,
  .servicio-page .telefonia-image,
  .hero-secondary-visual{
    max-width:760px !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }

  .hero-secondary-content,
  .servicio-page .telefonia-title{
    text-align:center !important;
  }

  .hero-secondary-visual{
    padding-left:0 !important;
    justify-content:center !important;
  }

  .hero-image-wrapper img,
  .servicio-page .telefonia-image img,
  .servicios-page .hero-secondary-visual img,
  .ubicacion-image img,
  .historia-img img{
    width:100% !important;
    max-height:360px !important;
    object-fit:contain !important;
  }

  .servicio-page .telefonia-text{
    padding:30px !important;
  }

  .servicio-page .diferencial-grid,
  .servicio-page .sectores-grid,
  .servicios-premium .sectores-grid,
  .empresa-page .diferencial-grid,
  .empresa-page .sectores-grid,
  .logos-grid,
  .telefonos-grid,
  .productos-page .productos-catalogo-grid,
  .productos-page .productos-confianza-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:20px !important;
  }

  .servicio-page .logo-item{
    min-height:130px !important;
    padding:26px 20px !important;
  }

  .servicio-page .logo-item img{
    max-height:72px !important;
    object-fit:contain !important;
  }
}

@media (max-width:768px){
  .hero h1,
  .hero-secondary h1,
  .servicio-page .titulo-premium-telefonia,
  .productos-page .titulo-premium-telefonia{
    font-size:clamp(2.05rem,10vw,3.15rem) !important;
    line-height:1.05 !important;
    letter-spacing:-1.2px !important;
  }

  .hero p,
  .hero-secondary p,
  .servicio-page .telefonia-title p,
  .servicio-page .telefonia-text p{
    font-size:.98rem !important;
    line-height:1.65 !important;
  }

  .hero-buttons,
  .cta-actions{
    width:100% !important;
    flex-direction:column !important;
    align-items:stretch !important;
  }

  .btn-primary,
  .btn-secondary,
  .btn-enviar{
    width:100% !important;
    justify-content:center !important;
    text-align:center !important;
  }

  .servicio-page .diferencial-grid,
  .servicio-page .sectores-grid,
  .servicios-premium .sectores-grid,
  .empresa-page .diferencial-grid,
  .empresa-page .sectores-grid,
  .logos-grid,
  .telefonos-grid,
  .productos-page .productos-catalogo-grid,
  .productos-page .productos-confianza-grid,
  .form-grid,
  .contacto-extra-grid{
    grid-template-columns:1fr !important;
  }

  .diferencial-item,
  .sector-card,
  .servicio-box,
  .logo-item,
  .telefono-card,
  .producto-card-premium,
  .producto-confianza-card{
    min-height:auto !important;
  }

  .servicio-page .telefonia-text{
    padding:26px 22px !important;
    border-radius:24px !important;
  }

  .servicio-page .telefonia-text h2{
    font-size:1.8rem !important;
  }

  .cta-box{
    padding:38px 22px !important;
  }
}

@media (max-width:480px){
  .container{
    width:calc(100% - 28px) !important;
  }

  .header .nav-container{
    width:calc(100% - 24px) !important;
  }

  .logo-left img{
    height:32px !important;
  }

  .mobile-menu-toggle{
    width:42px !important;
    height:42px !important;
  }

  .header .menu{
    left:12px !important;
    right:12px !important;
    top:72px !important;
  }

  .hero,
  .hero-secondary,
  .servicio-page .telefonia-top,
  .productos-page .telefonia-top{
    padding-top:36px !important;
    padding-bottom:44px !important;
  }

  .hero-image-wrapper img,
  .servicio-page .telefonia-image img,
  .servicios-page .hero-secondary-visual img,
  .ubicacion-image img,
  .historia-img img{
    max-height:280px !important;
  }

  .servicio-page .logo-item{
    min-height:118px !important;
  }

  .servicio-page .logo-item img{
    max-height:68px !important;
  }
}

/* =========================================================
   FIX FINAL - HEADER SIEMPRE VISIBLE MARBE COMUNICACIONES
   Mantiene el menú superior fijo al hacer scroll, sin tapar contenido.
========================================================= */
body{
  padding-top:82px !important;
  scroll-padding-top:98px !important;
}

.header{
  position:fixed !important;
  top:0 !important;
  left:0 !important;
  right:0 !important;
  width:100% !important;
  z-index:9999 !important;
}

.header.scrolled{
  background:
    linear-gradient(
      180deg,
      rgba(3,10,15,.96),
      rgba(3,10,15,.88)
    ) !important;
  border-bottom-color:rgba(0,255,200,.16) !important;
  box-shadow:0 14px 42px rgba(0,0,0,.36) !important;
  backdrop-filter:blur(22px) !important;
  -webkit-backdrop-filter:blur(22px) !important;
}

@media (max-width:980px){
  body{
    padding-top:74px !important;
    scroll-padding-top:90px !important;
  }

  .header .menu{
    top:86px !important;
  }
}

@media (max-width:520px){
  body{
    padding-top:64px !important;
    scroll-padding-top:80px !important;
  }

  .header .menu{
    top:76px !important;
  }
}


/* =========================================================
   CORRECCIÓN FINAL - TELEFONÍA MÓVIL
   Evita que el enlace "Ver ..." se superponga al texto dentro
   de las tarjetas en teléfono.
========================================================= */
@media (max-width: 767px){
  .servicio-page .servicios-detalle .servicio-box,
  .servicio-page .telefonia-premium .servicio-box{
    display:flex !important;
    flex-direction:column !important;
    align-items:flex-start !important;
    justify-content:flex-start !important;
    min-height:auto !important;
    height:auto !important;
    padding:24px 20px 26px !important;
  }

  .servicio-page .servicios-detalle .servicio-box p,
  .servicio-page .telefonia-premium .servicio-box p{
    margin-bottom:0 !important;
    width:100% !important;
  }

  .servicio-page .servicios-detalle .servicio-link,
  .servicio-page .telefonia-premium .servicio-link{
    position:static !important;
    left:auto !important;
    bottom:auto !important;
    display:inline-flex !important;
    align-items:center !important;
    margin-top:16px !important;
    line-height:1.2 !important;
    white-space:normal !important;
  }
}


/* =========================================================
   AJUSTE FINAL - SERVICIOS EN 3 + 3
   Mantiene servicios.html en 3 columnas en escritorio,
   aunque las reglas generales de páginas de servicio usen 4.
========================================================= */
@media (min-width:981px){
  body.servicios-page .servicios-premium .sectores-grid{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    max-width:1180px;
    margin-left:auto;
    margin-right:auto;
  }
}

/* =========================================================
   FIX FINAL - SERVICIOS HERO EN ESCRITORIO GRANDE
   Evita que la imagen se meta hacia el texto en monitores grandes.
   No afecta a portátil, tablet ni móvil.
========================================================= */
@media (min-width:1441px){
  body.servicios-page .hero-secondary-container{
    grid-template-columns:minmax(0,1.06fr) minmax(540px,0.94fr) !important;
    gap:clamp(96px,7vw,152px) !important;
    align-items:center !important;
  }

  body.servicios-page .hero-secondary-content{
    max-width:650px !important;
  }

  body.servicios-page .hero-secondary h1{
    max-width:650px !important;
    font-size:clamp(3.65rem,4vw,4.8rem) !important;
  }

  body.servicios-page .servicios-visual{
    justify-content:flex-end !important;
    align-self:center !important;
    padding-left:0 !important;
    transform:translateX(125px) !important;
  }

  body.servicios-page .servicios-image-card{
    width:min(100%,560px) !important;
    max-width:560px !important;
    margin-left:auto !important;
    margin-right:0 !important;
    transform:none !important;
  }
}


/* =========================================================
   AJUSTE FINAL - IMAGEN HERO EMPRESA MÁS GRANDE EN ESCRITORIO
   Mantiene el centrado y aumenta el tamaño solo en pantallas grandes.
========================================================= */
@media (min-width:1201px){
  .empresa-page .hero-secondary-container{
    grid-template-columns:minmax(0,.92fr) minmax(520px,1.08fr) !important;
    gap:clamp(44px,5.2vw,86px) !important;
  }

  .empresa-page .hero-secondary-visual{
    justify-content:center !important;
    padding-left:clamp(12px,2vw,28px) !important;
  }

  .empresa-page .hero-image-wrapper img[src$="N-PrincipioPagina(empresa).png"],
  .empresa-page .hero-image-wrapper img{
    width:min(100%,780px) !important;
    max-width:100% !important;
    max-height:620px !important;
    object-fit:contain !important;
  }
}


/* =========================================================
   AJUSTE FINAL - DISTRIBUIDORES
   Logos más grandes, mejor centrados y con más presencia visual.
========================================================= */
.servicio-page .logos-wrap{
  width:100%;
}

.servicio-page .logos-wrap .logos-grid{
  width:min(100%, 1120px) !important;
  margin:42px auto 0 !important;
  grid-template-columns:repeat(4, minmax(0, 1fr)) !important;
  gap:28px !important;
  justify-items:center !important;
  align-items:stretch !important;
}

.servicio-page .logos-wrap .logo-item{
  width:100% !important;
  min-height:182px !important;
  padding:30px 24px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}

.servicio-page .logos-wrap .logo-item img{
  width:auto !important;
  max-width:168px !important;
  max-height:92px !important;
  object-fit:contain !important;
}

@media (min-width:1400px){
  .servicio-page .logos-wrap .logos-grid{
    width:min(100%, 1180px) !important;
    gap:32px !important;
  }

  .servicio-page .logos-wrap .logo-item{
    min-height:196px !important;
  }

  .servicio-page .logos-wrap .logo-item img{
    max-width:180px !important;
    max-height:100px !important;
  }
}


/* =========================================================
   FIX DEFINITIVO REAL - DISTRIBUIDORES
   Corrige logos salidos, mantiene 4-4 en escritorio y centra todo.
========================================================= */
body.servicio-page .logos-wrap{
  width:100% !important;
  max-width:none !important;
  display:block !important;
}

body.servicio-page .logos-wrap .logos-grid{
  width:min(100%, 1040px) !important;
  max-width:1040px !important;
  margin:46px auto 0 !important;
  display:grid !important;
  grid-template-columns:repeat(4, minmax(0, 1fr)) !important;
  gap:28px !important;
  justify-content:center !important;
  align-items:stretch !important;
}

body.servicio-page .logos-wrap .logo-item{
  width:100% !important;
  min-width:0 !important;
  min-height:168px !important;
  padding:28px 24px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  overflow:hidden !important;
  box-sizing:border-box !important;
}

body.servicio-page .logos-wrap .logo-item img{
  display:block !important;
  width:auto !important;
  height:auto !important;
  max-width:130px !important;
  max-height:72px !important;
  object-fit:contain !important;
  object-position:center center !important;
  transform:none !important;
}

body.servicio-page .logos-wrap .logo-item img[alt="Siemens"],
body.servicio-page .logos-wrap .logo-item img[alt="Cisco"],
body.servicio-page .logos-wrap .logo-item img[alt="Inverter"]{
  max-width:150px !important;
  max-height:70px !important;
}

body.servicio-page .logos-wrap .logo-item img[alt="HP"]{
  max-width:112px !important;
  max-height:82px !important;
}

body.servicio-page .logos-wrap .logo-item img[alt="BT"]{
  max-width:140px !important;
  max-height:76px !important;
}

@media (min-width:1400px){
  body.servicio-page .logos-wrap .logos-grid{
    width:min(100%, 1080px) !important;
    max-width:1080px !important;
    gap:30px !important;
  }

  body.servicio-page .logos-wrap .logo-item{
    min-height:176px !important;
  }

  body.servicio-page .logos-wrap .logo-item img{
    max-width:140px !important;
    max-height:78px !important;
  }

  body.servicio-page .logos-wrap .logo-item img[alt="Siemens"],
  body.servicio-page .logos-wrap .logo-item img[alt="Cisco"],
  body.servicio-page .logos-wrap .logo-item img[alt="Inverter"]{
    max-width:162px !important;
    max-height:74px !important;
  }

  body.servicio-page .logos-wrap .logo-item img[alt="HP"]{
    max-width:118px !important;
    max-height:88px !important;
  }
}

@media (max-width:1100px){
  body.servicio-page .logos-wrap .logos-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    width:min(100%, 640px) !important;
    max-width:640px !important;
  }
}

@media (max-width:620px){
  body.servicio-page .logos-wrap .logos-grid{
    grid-template-columns:1fr !important;
    width:min(100%, 320px) !important;
    max-width:320px !important;
    gap:18px !important;
  }

  body.servicio-page .logos-wrap .logo-item{
    min-height:132px !important;
    padding:24px 20px !important;
  }

  body.servicio-page .logos-wrap .logo-item img{
    max-width:140px !important;
    max-height:72px !important;
  }
}


/* AJUSTE JEFE - NUEVOS DISTRIBUIDORES */
body.servicio-page .logos-wrap .logo-item img[alt="Powertronix"],
body.servicio-page .logos-wrap .logo-item img[alt="Grandstream"]{
  max-width:168px !important;
  max-height:76px !important;
}

@media (min-width:1400px){
  body.servicio-page .logos-wrap .logo-item img[alt="Powertronix"],
  body.servicio-page .logos-wrap .logo-item img[alt="Grandstream"]{
    max-width:178px !important;
    max-height:82px !important;
  }
}


/* =========================================================
   FIX FINAL MÓVIL - DÓNDE ESTAMOS MARBE COMUNICACIONES
   Centra tarjetas, mapa y evita que email/dirección desborden.
========================================================= */
@media (max-width: 820px){
  body.donde-estamos-page{
    overflow-x:hidden !important;
  }

  body.donde-estamos-page .ubicacion-section.container{
    width:calc(100% - 28px) !important;
    max-width:720px !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding-left:0 !important;
    padding-right:0 !important;
    box-sizing:border-box !important;
  }

  body.donde-estamos-page .ubicacion-grid,
  body.donde-estamos-page .ubicacion-info,
  body.donde-estamos-page .ubicacion-cards,
  body.donde-estamos-page .mapa-box{
    width:100% !important;
    max-width:100% !important;
    margin-left:auto !important;
    margin-right:auto !important;
    box-sizing:border-box !important;
  }

  body.donde-estamos-page .ubicacion-card{
    width:100% !important;
    max-width:100% !important;
    box-sizing:border-box !important;
    overflow:hidden !important;
    align-items:flex-start !important;
  }

  body.donde-estamos-page .ubicacion-card > div{
    min-width:0 !important;
    flex:1 1 auto !important;
  }

  body.donde-estamos-page .ubicacion-card p{
    max-width:100% !important;
    overflow-wrap:anywhere !important;
    word-break:break-word !important;
  }

  body.donde-estamos-page .mapa-box iframe{
    width:100% !important;
    max-width:100% !important;
    display:block !important;
  }
}
