/* ================================================================
   GIROVISUAL — sections.css
   Paleta: #000 negro · #F26522 naranja · #FFF blanco · #1A1A1A oscuro
   ================================================================ */

@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,400;0,600;0,700;0,800;0,900;1,400&family=Inter:wght@300;400;500;600&display=swap');


/* ================================================================
   SCROLL PROGRESS BAR
   ================================================================ */
#gv-scroll-progress {
	position: fixed;
	top: 0;
	left: 0;
	width: 0%;
	height: 3px;
	background: #F26522;
	z-index: 99999;
	transition: width 0.1s linear;
	pointer-events: none;
}

/* ================================================================
   CURSOR PERSONALIZADO
   ================================================================ */
body {
	cursor: none;
}

#gv-cursor {
	position: fixed;
	top: 0;
	left: 0;
	width: 20px;
	height: 20px;
	border: 2px solid #F26522;
	border-radius: 50%;
	pointer-events: none;
	z-index: 99998;
	transform: translate(-50%, -50%);
	transition: width 0.25s ease, height 0.25s ease, border-color 0.25s ease, background 0.25s ease;
	mix-blend-mode: normal;
}

#gv-cursor-dot {
	position: fixed;
	top: 0;
	left: 0;
	width: 4px;
	height: 4px;
	background: #FFFFFF;
	border-radius: 50%;
	pointer-events: none;
	z-index: 99999;
	transform: translate(-50%, -50%);
}

#gv-cursor.gv-cursor--hover {
	width: 40px;
	height: 40px;
	background: rgba(242, 101, 34, 0.15);
	border-color: #F26522;
}

@media (max-width: 768px) {
	body { cursor: auto; }
	#gv-cursor, #gv-cursor-dot { display: none; }
}


/* ── Variables ─────────────────────────────────────────────────── */
:root {
	--gv-black:  #000000;
	--gv-orange: #F26522;
	--gv-white:  #FFFFFF;
	--gv-dark:   #1A1A1A;
	--gv-gray:   #333333;
	--gv-gray-lt: rgba(255,255,255,.55);
	--gv-font-h: 'Montserrat', sans-serif;
	--gv-font-b: 'Inter', sans-serif;
	--gv-ease:   cubic-bezier(.22, 1, .36, 1);
}

/* ── Reset base ────────────────────────────────────────────────── */
.gv-hero, .gv-services, .gv-ia-highlight,
.gv-portfolio, .gv-stats, .gv-cta-final, .gv-contact {
	box-sizing: border-box;
	font-family: var(--gv-font-b);
}

.gv-contact *, .gv-contact *::before, .gv-contact *::after {
	box-sizing: border-box;
}

/* ================================================================
   ANIMATION UTILITIES
   ================================================================ */
.animate-on-scroll {
	opacity: 0;
	transition: opacity .7s var(--gv-ease), transform .7s var(--gv-ease);
}

.animate-on-scroll.fade-up    { transform: translateY(40px); }
.animate-on-scroll.fade-left  { transform: translateX(-40px); }
.animate-on-scroll.fade-right { transform: translateX(40px); }
.animate-on-scroll.scale-in   { transform: scale(.92); }

.animate-on-scroll.visible {
	opacity: 1;
	transform: none;
}

/* stagger helpers */
.delay-1 { transition-delay: .1s !important; }
.delay-2 { transition-delay: .2s !important; }
.delay-3 { transition-delay: .3s !important; }
.delay-4 { transition-delay: .4s !important; }
.delay-5 { transition-delay: .5s !important; }

/* ── Shared pieces ─────────────────────────────────────────────── */
/* ================================================================
   HEADER FIXED — fix recorte y scroll
   ================================================================ */
.gv-header,
#gv-site-header {
	position: fixed !important;
	top: 0 !important;
	left: 0 !important;
	width: 100% !important;
	z-index: 9999 !important;
	height: 90px;
	background: #000000;
	overflow: visible !important;
	transition: all 0.4s ease;
	display: flex;
	align-items: center;
}

.gv-header.scrolled,
#gv-site-header.scrolled {
	height: 65px;
	border-bottom: 2px solid #F26522;
	background: rgba(0, 0, 0, 0.95);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
}

/* ================================================================
   LOGO — Keyframes y animaciones
   ================================================================ */

/* ── Anim 1 + 4: Entrada del header (slide desde izq + rotate) ── */
@keyframes logoSlideIn {
	0%   { opacity: 0; transform: translateX(-20px) rotate(-10deg); }
	100% { opacity: 1; transform: translateX(0)    rotate(0deg); }
}

/* ── Anim 1 Hero: Spin espectacular de entrada ────────────────── */
@keyframes logoSpin {
	0%   { opacity: 0; transform: rotate(-180deg) scale(0.3); }
	60%  {             transform: rotate(10deg)   scale(1.05); }
	100% { opacity: 1; transform: rotate(0deg)    scale(1); }
}

/* ── Anim 2: Glow naranja pulsante (continuo) ─────────────────── */
@keyframes logoPulse {
	0%, 100% {
		filter: brightness(0) invert(1)
		        drop-shadow(0 0 8px rgba(242,101,34,0));
	}
	50% {
		filter: brightness(0) invert(1)
		        drop-shadow(0 0 25px rgba(242,101,34,0.8))
		        drop-shadow(0 0 50px rgba(242,101,34,0.3));
	}
}

/* ── Anim 3: Flotación suave post-spin (continua) ─────────────── */
@keyframes logoFloat {
	0%   { transform: rotate(0deg)  translateY(0px); }
	25%  { transform: rotate(3deg)  translateY(-6px); }
	50%  { transform: rotate(0deg)  translateY(-10px); }
	75%  { transform: rotate(-3deg) translateY(-6px); }
	100% { transform: rotate(0deg)  translateY(0px); }
}

/* ── Anim 4 (alias logoReveal — SVG fallback) ─────────────────── */
@keyframes logoReveal {
	0%   { opacity: 0; transform: scale(0.7) translateY(-10px); }
	100% { opacity: 1; transform: scale(1)   translateY(0); }
}

/* ================================================================
   LOGO IMAGE — Estilos base (header)
   ================================================================ */

/* ── Imagen del logo en el header ──────────────────────────────── */
#gv-logo-placeholder,
.gv-header__logo img,
.site-logo img,
.site-logo-img {
	height: 70px !important;
	width: auto !important;
	max-width: 200px !important;
	object-fit: contain !important;
	display: block;
	filter: brightness(0) invert(1) !important;
	transition: height 0.4s cubic-bezier(.22,1,.36,1),
	            filter 0.3s ease,
	            transform 0.3s ease;
	opacity: 0;
	/* Anim 4: slide desde izquierda con ligera rotación */
	animation: logoSlideIn 0.8s ease 0.1s forwards !important;
}

/* ── Hover header: glow naranja + rotate + scale ──────────────── */
#gv-logo-placeholder:hover,
.gv-header__logo:hover #gv-logo-placeholder,
.gv-header__logo:hover .site-logo img,
.gv-header__logo:hover .site-logo-img {
	filter: brightness(0) invert(1)
	        drop-shadow(0 0 15px rgba(242,101,34,0.9)) !important;
	transform: rotate(15deg) scale(1.1) !important;
	transition: transform 0.3s ease, filter 0.3s ease !important;
	animation: logoPulse 0.6s ease forwards !important;
}

/* Contenedor .site-logo */
.site-logo {
	display: flex;
	align-items: center;
	flex-shrink: 0;
}

/* ── Estado scrolled: logo compacto ─────────────────────────── */
.gv-header.scrolled #gv-logo-placeholder,
.gv-header.scrolled .gv-header__logo img,
.gv-header.scrolled .site-logo img,
.gv-header.scrolled .site-logo-img,
#gv-site-header.scrolled #gv-logo-placeholder,
#gv-site-header.scrolled .site-logo img {
	height: 50px !important;
}

/* ── Texto GIROVISUAL junto al logo ─────────────────────────── */
.gv-logo-text {
	font-family: 'Montserrat', sans-serif;
	font-weight: 900;
	font-size: 22px;
	color: #FFFFFF;
	letter-spacing: 2px;
	text-transform: uppercase;
	line-height: 1;
	transition: color 0.2s ease, font-size 0.4s ease;
}

.gv-logo-text .gv-logo-accent { color: #F26522; }

.gv-header.scrolled .gv-logo-text,
#gv-site-header.scrolled .gv-logo-text {
	font-size: 18px;
}

/* ── SVG fallback (si no hay imagen en media library) ───────── */
.gv-header__logo-mark {
	animation: logoReveal 0.8s ease 0.2s forwards;
	opacity: 0;
}

.gv-header__logo:hover .gv-header__logo-mark {
	transform: rotateY(15deg) rotate(90deg);
	perspective: 800px;
}

/* ================================================================
   LOGO HERO — Animaciones de entrada, float y glow
   ================================================================ */

/* Contenedor centrado del logo en el hero */
.hero-logo-container {
	display: flex;
	justify-content: center;
	margin-bottom: 24px;
}

/* Estado inicial: oculto, espera el spin */
.hero-logo-container img {
	opacity: 0;
	height: 120px;
	width: auto;
	display: block;
	animation: logoSpin 1.2s cubic-bezier(0.34, 1.56, 0.64, 1) 0.3s forwards;
}

/* Post-spin: float + pulse continuos.
   opacity:1 !important evita el flash de opacity:0 al cambiar animación */
.hero-logo-container img.logo-loaded {
	opacity: 1 !important;
	animation:
		logoFloat 4s ease-in-out infinite,
		logoPulse 3s ease-in-out infinite !important;
}

/* ── Keyframes definitivos del hero logo ──────────────────────── */

/* Spin de entrada: opacity explícita en cada step para evitar reset */
@keyframes logoSpin {
	0%   { opacity: 0; transform: rotate(-180deg) scale(0.3); }
	60%  { opacity: 1; transform: rotate(10deg)   scale(1.05); }
	100% { opacity: 1; transform: rotate(0deg)    scale(1); }
}

/* Flotación suave post-spin */
@keyframes logoFloat {
	0%,  100% { transform: rotate(0deg)  translateY(0px); }
	25%        { transform: rotate(3deg)  translateY(-6px); }
	50%        { transform: rotate(0deg)  translateY(-10px); }
	75%        { transform: rotate(-3deg) translateY(-6px); }
}

/* Glow naranja pulsante */
@keyframes logoPulse {
	0%, 100% {
		filter: brightness(0) invert(1)
		        drop-shadow(0 0 8px rgba(242,101,34,0));
	}
	50% {
		filter: brightness(0) invert(1)
		        drop-shadow(0 0 25px rgba(242,101,34,0.8))
		        drop-shadow(0 0 50px rgba(242,101,34,0.3));
	}
}

/* ================================================================
   PORTAFOLIO — Filtros + Grid + Hover
   ================================================================ */

/* ── Filtros ────────────────────────────────────────────────────── */
.gv-portfolio__filters {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
	justify-content: center;
	margin-bottom: 40px;
}

.gv-filter-btn {
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
	font-size: .72rem;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	padding: 9px 22px;
	background: transparent;
	color: rgba(255,255,255,.55);
	border: 1px solid rgba(255,255,255,.15);
	cursor: pointer;
	transition: background .25s, color .25s, border-color .25s, transform .2s;
}

.gv-filter-btn:hover {
	color: #FFFFFF;
	border-color: rgba(255,255,255,.4);
	transform: translateY(-2px);
}

.gv-filter-btn.is-active {
	background: #F26522;
	color: #FFFFFF;
	border-color: #F26522;
	box-shadow: 0 0 20px rgba(242,101,34,.35);
}

/* ── Items del grid ─────────────────────────────────────────────── */
.gv-pitem {
	position: relative;
	overflow: hidden;
	cursor: pointer;
	height: 350px;
	transition: box-shadow .35s, opacity .4s ease, transform .4s ease;
}

/* Imagen real inyectada por JS */
.gv-pitem__img-wrap {
	position: absolute;
	inset: 0;
}

.gv-pitem__img-wrap img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	object-position: center;
	display: block;
	transition: transform .5s cubic-bezier(.22,1,.36,1);
	/* Sobreescribir cualquier filter del logo-header */
	filter: none !important;
	animation: none !important;
	opacity: 1 !important;
}

.gv-pitem:hover .gv-pitem__img-wrap img {
	transform: scale(1.08);
}

/* Fallback gradient cuando no hay imagen */
.gv-pitem__fallback {
	position: absolute;
	inset: 0;
	transition: opacity .3s;
}

/* Ocultar fallback si hay imagen real */
.gv-pitem.has-image .gv-pitem__fallback {
	display: none;
}

/* ── Overlays ────────────────────────────────────────────────────── */
.gv-pitem__overlay {
	position: absolute;
	inset: 0;
	transition: opacity .3s ease;
	z-index: 1;
}

.gv-pitem__overlay--dark {
	background: rgba(0,0,0,.50);
	opacity: 1;
}

.gv-pitem__overlay--orange {
	background: #F26522;
	opacity: 0;
}

.gv-pitem:hover .gv-pitem__overlay--dark   { opacity: 0; }
.gv-pitem:hover .gv-pitem__overlay--orange { opacity: 0.72; }

/* ── Info texto en hover ─────────────────────────────────────────── */
.gv-pitem__info {
	position: absolute;
	inset: 0;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding: 24px;
	opacity: 0;
	transform: translateY(10px);
	transition: opacity .3s ease, transform .3s ease;
}

.gv-pitem:hover .gv-pitem__info {
	opacity: 1;
	transform: translateY(0);
}

.gv-pitem__info-title {
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
	font-size: 1.15rem;
	color: #FFFFFF;
	text-transform: uppercase;
	letter-spacing: 1px;
	margin: 0 0 8px;
	line-height: 1.2;
}

.gv-pitem__info-cat {
	font-family: 'Montserrat', sans-serif;
	font-weight: 600;
	font-size: .72rem;
	color: rgba(255,255,255,.85);
	text-transform: uppercase;
	letter-spacing: 3px;
	margin: 0;
	border-top: 1px solid rgba(255,255,255,.4);
	padding-top: 8px;
}

/* ── Estado de filtrado (oculto) ─────────────────────────────────── */
.gv-pitem.is-hidden {
	display: none !important;
}

/* ── Hover glow en el borde (hereda del gv-pitem custom.css) ─────── */
.gv-pitem:hover {
	box-shadow: 0 0 0 2px #F26522, 0 12px 40px rgba(242,101,34,.25);
}

body {
	padding-top: 90px;
}

.gv-section {
	padding: 100px 40px;
}

.gv-container {
	max-width: 1200px;
	margin: 0 auto;
}

.gv-eyebrow {
	display: inline-block;
	font-family: var(--gv-font-b);
	font-size: .7rem;
	font-weight: 700;
	color: var(--gv-orange);
	letter-spacing: 4px;
	text-transform: uppercase;
	margin-bottom: 14px;
}

.gv-section-title {
	font-family: var(--gv-font-h);
	font-size: clamp(2rem, 4.5vw, 3.5rem);
	font-weight: 900;
	color: var(--gv-white);
	margin: 0 0 12px;
	text-transform: uppercase;
	letter-spacing: -1px;
	line-height: 1.1;
}

.gv-section-title em, .gv-accent { font-style: normal; color: var(--gv-orange); }

.gv-section-sub {
	font-family: var(--gv-font-b);
	font-size: 1rem;
	color: var(--gv-gray-lt);
	margin: 0;
	line-height: 1.7;
}

.gv-section-header {
	margin-bottom: 64px;
}

.gv-section-header.centered { text-align: center; }

/* ── Botones ────────────────────────────────────────────────────── */
.gv-btn {
	display: inline-block;
	padding: 15px 38px;
	font-family: var(--gv-font-h);
	font-weight: 700;
	font-size: .8rem;
	text-decoration: none;
	text-transform: uppercase;
	letter-spacing: 2px;
	border: 2px solid var(--gv-orange);
	background: var(--gv-orange);
	color: var(--gv-white);
	transition: background .25s, color .25s, transform .25s, box-shadow .25s;
	position: relative;
	overflow: hidden;
	cursor: pointer;
}

.gv-btn::after {
	content: '';
	position: absolute;
	inset: 0;
	background: rgba(255,255,255,.08);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .3s;
}

.gv-btn:hover::after { transform: scaleX(1); }

.gv-btn:hover {
	background: transparent;
	color: var(--gv-orange);
	transform: translateY(-3px);
	box-shadow: 0 12px 32px rgba(242,101,34,.35);
}

.gv-btn--ghost {
	background: transparent;
	color: rgba(255,255,255,.8);
	border-color: rgba(255,255,255,.35);
}

.gv-btn--ghost::after { background: rgba(255,255,255,.05); }

.gv-btn--ghost:hover {
	border-color: var(--gv-white);
	color: var(--gv-white);
	box-shadow: 0 12px 32px rgba(255,255,255,.1);
}

.gv-btn--outline-orange {
	background: transparent;
	color: var(--gv-orange);
	border-color: var(--gv-orange);
}

.gv-btn--outline-orange:hover {
	background: var(--gv-orange);
	color: var(--gv-white);
}

/* ================================================================
   § 1  HERO
   ================================================================ */
.gv-hero {
	position: relative;
	min-height: 100vh;
	background: var(--gv-black);
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	padding: 120px 40px 80px;
}

/* Líneas diagonales animadas */
.gv-hero::before {
	content: '';
	position: absolute;
	inset: -50%;
	width: 200%;
	height: 200%;
	background: repeating-linear-gradient(
		-55deg,
		transparent,
		transparent 60px,
		rgba(242,101,34,.028) 60px,
		rgba(242,101,34,.028) 61px
	);
	animation: gv-lines-move 18s linear infinite;
	pointer-events: none;
}

@keyframes gv-lines-move {
	from { transform: translateX(0) translateY(0); }
	to   { transform: translateX(122px) translateY(122px); }
}

/* Glow central */
.gv-hero::after {
	content: '';
	position: absolute;
	top: 50%; left: 50%;
	transform: translate(-50%, -50%);
	width: 800px; height: 600px;
	background: radial-gradient(ellipse, rgba(242,101,34,.07) 0%, transparent 65%);
	pointer-events: none;
}

.gv-hero__inner {
	position: relative;
	z-index: 1;
	text-align: center;
	max-width: 960px;
}

.gv-hero__logo {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 54px;
	padding: 0 32px;
	margin-bottom: 40px;
	background: var(--gv-orange);
	font-family: var(--gv-font-h);
	font-weight: 900;
	font-size: 1.35rem;
	color: var(--gv-white);
	letter-spacing: 4px;
	text-transform: uppercase;
	clip-path: polygon(0 0, 94% 0, 100% 50%, 94% 100%, 0 100%);
	animation: gv-hero-in .9s .1s var(--gv-ease) both;
}

.gv-hero__eyebrow {
	display: block;
	font-family: var(--gv-font-b);
	font-size: .68rem;
	font-weight: 700;
	color: var(--gv-orange);
	letter-spacing: 5px;
	text-transform: uppercase;
	margin-bottom: 24px;
	animation: gv-hero-in .9s .25s var(--gv-ease) both;
}

.gv-hero__title {
	font-family: var(--gv-font-h);
	font-size: clamp(2.6rem, 6.5vw, 5.5rem);
	font-weight: 900;
	color: var(--gv-white);
	line-height: 1.05;
	margin: 0 0 28px;
	text-transform: uppercase;
	letter-spacing: -1.5px;
	animation: gv-hero-in .9s .4s var(--gv-ease) both;
}

.gv-hero__title .gv-accent { color: var(--gv-orange); }

.gv-hero__sub {
	font-family: var(--gv-font-b);
	font-size: clamp(.85rem, 1.8vw, 1.1rem);
	color: rgba(255,255,255,.5);
	letter-spacing: 4px;
	text-transform: uppercase;
	margin: 0 0 52px;
	animation: gv-hero-in .9s .55s var(--gv-ease) both;
}

.gv-hero__actions {
	display: flex;
	gap: 16px;
	justify-content: center;
	flex-wrap: wrap;
	animation: gv-hero-in .9s .7s var(--gv-ease) both;
}

@keyframes gv-hero-in {
	from { opacity: 0; transform: translateY(32px); }
	to   { opacity: 1; transform: translateY(0); }
}

/* Scroll arrow */
.gv-hero__scroll {
	position: absolute;
	bottom: 36px;
	left: 50%;
	transform: translateX(-50%);
	z-index: 1;
	animation: gv-bounce 2.5s ease infinite;
}

.gv-hero__scroll span {
	display: block;
	width: 2px;
	height: 48px;
	background: linear-gradient(to bottom, var(--gv-orange), transparent);
	margin: 0 auto;
}

@keyframes gv-bounce {
	0%,100% { transform: translateX(-50%) translateY(0); }
	50%      { transform: translateX(-50%) translateY(10px); }
}

/* ================================================================
   § 2  SERVICIOS
   ================================================================ */
.gv-services {
	background: var(--gv-black);
}

.gv-services__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
	gap: 20px;
}

.gv-card {
	background: var(--gv-dark);
	padding: 36px 28px;
	border: 1px solid rgba(255,255,255,.05);
	position: relative;
	overflow: hidden;
	transition: transform .4s var(--gv-ease), box-shadow .4s, border-color .4s;
}

.gv-card::before {
	content: '';
	position: absolute;
	top: 0; left: 0; right: 0;
	height: 3px;
	background: var(--gv-orange);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .35s var(--gv-ease);
}

.gv-card:hover::before { transform: scaleX(1); }

.gv-card:hover {
	transform: translateY(-8px);
	border-color: rgba(242,101,34,.3);
	box-shadow: 0 20px 48px rgba(0,0,0,.5), 0 0 30px rgba(242,101,34,.09);
}

.gv-card__icon {
	width: 52px;
	height: 52px;
	color: var(--gv-orange);
	margin-bottom: 20px;
}

.gv-card__title {
	font-family: var(--gv-font-h);
	font-size: 1rem;
	font-weight: 800;
	color: var(--gv-white);
	text-transform: uppercase;
	letter-spacing: 1px;
	margin: 0 0 16px;
}

.gv-card__list {
	list-style: none;
	padding: 0;
	margin: 0;
}

.gv-card__list li {
	font-family: var(--gv-font-b);
	font-size: .8rem;
	color: rgba(255,255,255,.5);
	padding: 5px 0 5px 14px;
	border-bottom: 1px solid rgba(255,255,255,.04);
	position: relative;
	transition: color .2s;
	line-height: 1.4;
}

.gv-card__list li:last-child { border-bottom: none; }
.gv-card:hover .gv-card__list li { color: rgba(255,255,255,.7); }

.gv-card__list li::before {
	content: '';
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 5px;
	height: 5px;
	background: var(--gv-orange);
	border-radius: 50%;
}

/* ── Card CTA Link (Ver servicio completo →) ──────────────────── */
.gv-card__cta {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-top: 20px;
	padding-top: 16px;
	border-top: 1px solid rgba(255,255,255,.07);
	font-family: var(--gv-font-h);
	font-size: .72rem;
	font-weight: 700;
	color: var(--gv-orange);
	text-decoration: none;
	text-transform: uppercase;
	letter-spacing: 1.5px;
	transition: gap .25s var(--gv-ease);
}

.gv-card__cta:hover { gap: 14px; color: var(--gv-orange); }

.gv-card__arrow {
	display: inline-block;
	transition: transform .25s var(--gv-ease);
}

.gv-card__cta:hover .gv-card__arrow {
	transform: translateX(5px);
}

/* ================================================================
   PÁGINAS INTERNAS — Componentes reutilizables
   ================================================================ */

/* ── Hero interno 60vh ───────────────────────────────────────── */
.page-hero-internal {
	height: 60vh;
	min-height: 420px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	background: #000000;
	padding: 120px 40px 60px;
	position: relative;
	overflow: hidden;
	margin-top: 90px;
}

.page-hero-internal::before {
	content: '';
	position: absolute;
	inset: -50%;
	width: 200%;
	height: 200%;
	background: repeating-linear-gradient(
		-55deg,
		transparent,
		transparent 60px,
		rgba(242,101,34,.025) 60px,
		rgba(242,101,34,.025) 61px
	);
	animation: gv-lines-move 18s linear infinite;
	pointer-events: none;
}

.page-hero-internal::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	height: 2px;
	background: var(--gv-orange);
}

.page-hero-internal__eyebrow {
	font-family: var(--gv-font-b);
	font-size: .68rem;
	font-weight: 700;
	color: var(--gv-orange);
	letter-spacing: 5px;
	text-transform: uppercase;
	margin-bottom: 20px;
	position: relative;
	z-index: 1;
}

.page-hero-internal__title {
	font-family: var(--gv-font-h);
	font-size: clamp(2.2rem, 5vw, 4.5rem);
	font-weight: 900;
	color: var(--gv-white);
	text-transform: uppercase;
	letter-spacing: -1px;
	line-height: 1.05;
	margin: 0 0 20px;
	position: relative;
	z-index: 1;
}

.page-hero-internal__sub {
	font-family: var(--gv-font-b);
	font-size: clamp(1rem, 2vw, 1.3rem);
	color: var(--gv-orange);
	letter-spacing: 1px;
	margin: 0;
	position: relative;
	z-index: 1;
}

/* ── Breadcrumb ──────────────────────────────────────────────── */
.gv-breadcrumb {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 14px 40px;
	background: rgba(242,101,34,.06);
	border-bottom: 1px solid rgba(242,101,34,.12);
	font-family: var(--gv-font-b);
	font-size: .75rem;
	color: rgba(255,255,255,.45);
	text-transform: uppercase;
	letter-spacing: 1px;
}

.gv-breadcrumb a {
	color: rgba(255,255,255,.45);
	text-decoration: none;
	transition: color .2s;
}

.gv-breadcrumb a:hover { color: var(--gv-orange); }

.gv-breadcrumb__sep {
	color: var(--gv-orange);
	font-size: .6rem;
}

.gv-breadcrumb__current { color: var(--gv-orange); }

/* ── Grid de servicios detallados ────────────────────────────── */
.service-detail-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 2rem;
	margin-bottom: 5rem;
}

.service-detail-card {
	background: #1A1A1A;
	padding: 2rem;
	border-left: 3px solid var(--gv-orange);
	border-radius: 0 8px 8px 0;
	transition: transform .3s var(--gv-ease), box-shadow .3s;
}

.service-detail-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 16px 40px rgba(0,0,0,.5), 0 0 0 1px rgba(242,101,34,.2);
}

.service-detail-card__icon {
	width: 44px;
	height: 44px;
	color: var(--gv-orange);
	margin-bottom: 1rem;
}

.service-detail-card__title {
	font-family: var(--gv-font-h);
	font-size: 1.1rem;
	font-weight: 800;
	color: var(--gv-white);
	text-transform: uppercase;
	letter-spacing: .5px;
	margin: 0 0 .75rem;
}

.service-detail-card__desc {
	font-family: var(--gv-font-b);
	font-size: .875rem;
	color: rgba(255,255,255,.55);
	line-height: 1.7;
	margin: 0 0 1rem;
}

/* ── Lista de entregables con checkmarks naranja ─────────────── */
.service-entregables {
	list-style: none;
	padding: 0;
	margin: 0;
}

.service-entregables li {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	font-family: var(--gv-font-b);
	font-size: .8rem;
	color: rgba(255,255,255,.6);
	padding: 5px 0;
	line-height: 1.5;
}

.service-entregables li::before {
	content: '';
	display: inline-block;
	flex-shrink: 0;
	width: 16px;
	height: 16px;
	margin-top: 1px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M13.3 3.3L6 10.6 2.7 7.3 1.3 8.7l4.7 4.7 8.7-8.7z' fill='%23F26522'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-size: contain;
}

/* ── Timeline de proceso ─────────────────────────────────────── */
.process-timeline {
	position: relative;
	padding-left: 40px;
	margin-bottom: 5rem;
	max-width: 800px;
	margin-left: auto;
	margin-right: auto;
}

.process-timeline::before {
	content: '';
	position: absolute;
	left: 12px;
	top: 0;
	bottom: 0;
	width: 2px;
	background: linear-gradient(to bottom, var(--gv-orange), transparent);
}

.process-step {
	position: relative;
	padding: 0 0 40px 0;
}

.process-step::before {
	content: attr(data-step);
	position: absolute;
	left: -40px;
	top: 0;
	width: 26px;
	height: 26px;
	background: var(--gv-orange);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--gv-font-h);
	font-size: .7rem;
	font-weight: 900;
	color: var(--gv-white);
	z-index: 1;
}

.process-step__title {
	font-family: var(--gv-font-h);
	font-size: 1rem;
	font-weight: 800;
	color: var(--gv-orange);
	text-transform: uppercase;
	margin: 0 0 8px;
}

.process-step__desc {
	font-family: var(--gv-font-b);
	font-size: .875rem;
	color: rgba(255,255,255,.55);
	line-height: 1.6;
	margin: 0;
}

/* ── CTA Section interna ─────────────────────────────────────── */
.internal-cta {
	text-align: center;
	padding: 80px 40px;
	background: linear-gradient(135deg, #0a0a0a 0%, #111111 100%);
	border-top: 1px solid rgba(242,101,34,.15);
	border-bottom: 1px solid rgba(242,101,34,.15);
	margin-bottom: 0;
}

.internal-cta__title {
	font-family: var(--gv-font-h);
	font-size: clamp(1.8rem, 4vw, 3rem);
	font-weight: 900;
	color: var(--gv-white);
	text-transform: uppercase;
	margin: 0 0 20px;
}

.internal-cta__sub {
	font-family: var(--gv-font-b);
	font-size: 1rem;
	color: rgba(255,255,255,.5);
	margin: 0 0 40px;
}

/* ── Galería grid ────────────────────────────────────────────── */
.gallery-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 12px;
	margin-bottom: 5rem;
}

.gallery-item {
	aspect-ratio: 4/3;
	background: #1A1A1A;
	border-radius: 4px;
	position: relative;
	overflow: hidden;
	cursor: pointer;
}

.gallery-item__placeholder {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--gv-font-b);
	font-size: .65rem;
	color: rgba(255,255,255,.1);
	letter-spacing: 3px;
	text-transform: uppercase;
	background: linear-gradient(135deg, #1a1a1a, #252525);
	transition: transform .5s var(--gv-ease);
}

.gallery-item:hover .gallery-item__placeholder { transform: scale(1.06); }

.gallery-item__overlay {
	position: absolute;
	inset: 0;
	background: rgba(242,101,34,.85);
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--gv-font-h);
	font-size: .85rem;
	font-weight: 700;
	color: var(--gv-white);
	text-transform: uppercase;
	letter-spacing: 2px;
	opacity: 0;
	transition: opacity .3s;
}

.gallery-item:hover .gallery-item__overlay { opacity: 1; }

/* ── WhatsApp Float ──────────────────────────────────────────── */
.gv-whatsapp-fab {
	position: fixed;
	bottom: 32px;
	right: 32px;
	width: 56px;
	height: 56px;
	background: #25D366;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	box-shadow: 0 4px 20px rgba(37,211,102,.4);
	z-index: 9000;
	transition: transform .3s var(--gv-ease), box-shadow .3s;
}

.gv-whatsapp-fab:hover {
	transform: scale(1.12);
	box-shadow: 0 8px 28px rgba(37,211,102,.55);
}

.gv-whatsapp-fab svg {
	width: 30px;
	height: 30px;
	fill: #ffffff;
}

/* ── Responsive páginas internas ─────────────────────────────── */
@media (max-width: 768px) {
	.service-detail-grid { grid-template-columns: 1fr; }
	.gallery-grid { grid-template-columns: repeat(2, 1fr); }
	.page-hero-internal { height: auto; min-height: 340px; padding: 100px 24px 50px; }
	.gv-breadcrumb { padding: 12px 24px; }
	.process-timeline { padding-left: 30px; }
}

@media (max-width: 480px) {
	.gallery-grid { grid-template-columns: 1fr; }
}


/* ================================================================
   SECTION DIVIDER — línea naranja animada
   ================================================================ */
.section-divider {
	position: relative;
}

.section-divider::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	height: 2px;
	width: 0;
	background: #F26522;
	transition: width 0.8s cubic-bezier(.22, 1, .36, 1);
}

.section-divider.gv-divider-visible::after {
	width: 100%;
}

/* ================================================================
   H2 GLOW EFECTO — al entrar en viewport
   ================================================================ */
.gv-section-title,
section h2,
.wp-block-group h2 {
	transition: text-shadow 0.6s ease;
}

.gv-section-title.gv-h2-glowing,
section h2.gv-h2-glowing,
.wp-block-group h2.gv-h2-glowing {
	text-shadow: 0 0 40px rgba(242, 101, 34, 0.3);
}

/* ================================================================
   FONDO ANIMADO — secciones oscuras (#1A1A1A)
   ================================================================ */
.gv-portfolio,
.gv-dark-section {
	background: linear-gradient(
		270deg,
		#1A1A1A 0%,
		#1f1f1f 25%,
		#1A1A1A 50%,
		#151515 75%,
		#1A1A1A 100%
	);
	background-size: 400% 400%;
	animation: gv-bg-shift 8s ease infinite;
}

@keyframes gv-bg-shift {
	0%   { background-position: 0% 50%; }
	50%  { background-position: 100% 50%; }
	100% { background-position: 0% 50%; }
}

/* ================================================================
   TEXT REVEAL — aparición palabra por palabra
   ================================================================ */
.text-reveal .gv-word {
	display: inline-block;
	opacity: 0;
	transform: translateY(20px);
	transition: opacity 0.4s ease, transform 0.4s ease;
}

.text-reveal.gv-revealed .gv-word {
	opacity: 1;
	transform: translateY(0);
}

/* ================================================================
   § 3  PROPUESTA IA
   ================================================================ */
.gv-ia-highlight {
	background: linear-gradient(180deg, var(--gv-black) 0%, #0D0D0D 100%);
	border-left: 4px solid var(--gv-orange);
	position: relative;
	overflow: hidden;
}

.gv-ia-highlight::before {
	content: '';
	position: absolute;
	top: -200px; right: -200px;
	width: 600px; height: 600px;
	background: radial-gradient(circle, rgba(242,101,34,.1) 0%, transparent 65%);
	pointer-events: none;
}

.gv-ia-highlight__inner {
	max-width: 1200px;
	margin: 0 auto;
}

.gv-ia-highlight__cols {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 40px;
	margin-top: 48px;
}

.gv-ia-col {
	text-align: center;
	padding: 32px 20px;
	background: rgba(255,255,255,.02);
	border: 1px solid rgba(242,101,34,.15);
	transition: border-color .3s, background .3s;
}

.gv-ia-col:hover {
	border-color: rgba(242,101,34,.5);
	background: rgba(242,101,34,.04);
}

.gv-ia-col__icon {
	font-size: 2.4rem;
	margin-bottom: 16px;
	display: block;
}

.gv-ia-col__title {
	font-family: var(--gv-font-h);
	font-size: .9rem;
	font-weight: 800;
	color: var(--gv-orange);
	text-transform: uppercase;
	letter-spacing: 1px;
	margin: 0 0 10px;
}

.gv-ia-col__desc {
	font-family: var(--gv-font-b);
	font-size: .85rem;
	color: rgba(255,255,255,.55);
	line-height: 1.7;
	margin: 0;
}

/* ================================================================
   § 4  PORTAFOLIO
   ================================================================ */
.gv-portfolio {
	background: var(--gv-dark);
}

.gv-portfolio__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-template-rows: auto;
	gap: 15px;
	margin-bottom: 70px;
}

.gv-pitem {
	position: relative;
	overflow: hidden;
	cursor: pointer;
}

.gv-pitem__bg {
	width: 100%;
	height: 100%;
	background: var(--gv-gray);
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--gv-font-h);
	font-size: .6rem;
	color: rgba(255,255,255,.12);
	letter-spacing: 3px;
	text-transform: uppercase;
	transition: transform .55s var(--gv-ease);
}

.gv-pitem:hover .gv-pitem__bg { transform: scale(1.07); }

.gv-pitem__overlay {
	position: absolute;
	inset: 0;
	background: rgba(242,101,34,.88);
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--gv-font-h);
	font-size: .9rem;
	font-weight: 700;
	color: var(--gv-white);
	text-transform: uppercase;
	letter-spacing: 2px;
	opacity: 0;
	transition: opacity .3s;
}

.gv-pitem:hover .gv-pitem__overlay { opacity: 1; }

.gv-portfolio__cta { text-align: center; }

/* ================================================================
   § 5  STATS / POR QUÉ ELEGIRNOS
   ================================================================ */
.gv-stats {
	background: var(--gv-black);
}

.gv-stats__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 32px;
}

.gv-stat {
	text-align: center;
	padding: 40px 20px;
	border: 1px solid rgba(255,255,255,.05);
	position: relative;
	transition: border-color .3s;
}

.gv-stat::after {
	content: '';
	position: absolute;
	bottom: 0; left: 50%;
	transform: translateX(-50%) scaleX(0);
	width: 40px; height: 2px;
	background: var(--gv-orange);
	transition: transform .4s var(--gv-ease);
}

.gv-stat:hover { border-color: rgba(242,101,34,.25); }
.gv-stat:hover::after { transform: translateX(-50%) scaleX(1); }

.gv-stat__number {
	font-family: var(--gv-font-h);
	font-size: clamp(3rem, 5vw, 5rem);
	font-weight: 900;
	color: var(--gv-orange);
	line-height: 1;
	margin-bottom: 12px;
	display: block;
}

.gv-stat__label {
	font-family: var(--gv-font-b);
	font-size: .85rem;
	color: rgba(255,255,255,.55);
	line-height: 1.5;
}

/* ================================================================
   § 6  CTA FINAL
   ================================================================ */
.gv-cta-final {
	background: var(--gv-black);
	position: relative;
	overflow: hidden;
	text-align: center;
}

.gv-cta-final::before {
	content: '';
	position: absolute;
	inset: 0;
	background:
		radial-gradient(ellipse 90% 70% at 50% 120%, rgba(242,101,34,.22) 0%, transparent 60%),
		radial-gradient(ellipse 55% 40% at 50% 110%, rgba(242,101,34,.12) 0%, transparent 55%);
	pointer-events: none;
}

.gv-cta-final__inner {
	position: relative;
	z-index: 1;
	max-width: 740px;
	margin: 0 auto;
}

.gv-cta-final__line {
	width: 56px;
	height: 3px;
	background: var(--gv-orange);
	margin: 16px auto 44px;
}

.gv-cta-final__title {
	font-family: var(--gv-font-h);
	font-size: clamp(2rem, 5vw, 4rem);
	font-weight: 900;
	color: var(--gv-white);
	text-transform: uppercase;
	letter-spacing: -1px;
	line-height: 1.1;
	margin: 0 0 20px;
}

.gv-cta-final__title .gv-accent { color: var(--gv-orange); }

.gv-cta-final__sub {
	font-family: var(--gv-font-b);
	font-size: 1rem;
	color: rgba(255,255,255,.5);
	margin: 0 0 52px;
	letter-spacing: 1px;
}

.gv-cta-final__actions {
	display: flex;
	gap: 16px;
	justify-content: center;
	flex-wrap: wrap;
}

/* ================================================================
   § 6  CONTACTO — Sección con formulario
   ================================================================ */
.gv-contact {
	background: var(--gv-black);
	position: relative;
	overflow: hidden;
}

.gv-contact::before {
	content: '';
	position: absolute;
	inset: 0;
	background:
		radial-gradient(ellipse 80% 60% at 50% 110%, rgba(242,101,34,.18) 0%, transparent 60%);
	pointer-events: none;
}

.gv-contact__inner {
	position: relative;
	z-index: 1;
}

.gv-contact__header {
	text-align: center;
	margin-bottom: 56px;
}

.gv-contact__header .gv-section-title {
	margin-bottom: 12px;
}

/* ── Grid 2 columnas: formulario | info ──────────────────────── */
.gv-contact__grid {
	display: grid;
	grid-template-columns: 1fr 380px;
	gap: 48px;
	align-items: start;
}

/* ── Formulario ─────────────────────────────────────────────── */
.gv-contact__form-wrap {
	background: #111111;
	border: 1px solid rgba(255,255,255,.08);
	border-radius: 12px;
	padding: 40px;
}

.gv-contact-form {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.gv-form-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
}

.gv-form-group {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.gv-form-group label {
	font-family: var(--gv-font-b);
	font-size: .78rem;
	font-weight: 600;
	color: rgba(255,255,255,.55);
	text-transform: uppercase;
	letter-spacing: 1px;
}

.gv-form-req {
	color: var(--gv-orange);
}

.gv-form-group input,
.gv-form-group select,
.gv-form-group textarea {
	width: 100%;
	box-sizing: border-box;
	background: #1a1a1a;
	border: 1px solid rgba(255,255,255,.12);
	border-radius: 8px;
	color: #ffffff;
	font-family: var(--gv-font-b);
	font-size: .95rem;
	padding: 12px 16px;
	outline: none;
	transition: border-color .25s ease, background .25s ease;
	-webkit-appearance: none;
	appearance: none;
}

.gv-form-group select {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23F26522' stroke-width='1.8' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 14px center;
	padding-right: 40px;
	cursor: pointer;
}

.gv-form-group select option {
	background: #1a1a1a;
	color: #ffffff;
}

.gv-form-group input::placeholder,
.gv-form-group textarea::placeholder {
	color: rgba(255,255,255,.28);
}

.gv-form-group input:focus,
.gv-form-group select:focus,
.gv-form-group textarea:focus {
	border-color: var(--gv-orange);
	background: #202020;
}

.gv-form-group textarea {
	resize: vertical;
	min-height: 120px;
}

/* ── Botón submit ───────────────────────────────────────────── */
.gv-contact-form__submit {
	align-self: flex-start;
	position: relative;
	min-width: 200px;
}

.gv-form-btn-loading {
	display: none;
}

.gv-contact-form__submit.is-loading .gv-form-btn-text {
	display: none;
}

.gv-contact-form__submit.is-loading .gv-form-btn-loading {
	display: inline;
}

.gv-contact-form__submit.is-loading {
	opacity: .7;
	pointer-events: none;
}

/* ── Feedback ──────────────────────────────────────────────── */
.gv-form-feedback {
	font-family: var(--gv-font-b);
	font-size: .9rem;
	padding: 0;
	border-radius: 8px;
	min-height: 0;
	transition: all .3s ease;
}

.gv-form-feedback.is-success {
	color: #4ade80;
	background: rgba(74,222,128,.1);
	border: 1px solid rgba(74,222,128,.3);
	padding: 12px 16px;
}

.gv-form-feedback.is-error {
	color: #f87171;
	background: rgba(248,113,113,.1);
	border: 1px solid rgba(248,113,113,.3);
	padding: 12px 16px;
}

/* ── Panel info de contacto ──────────────────────────────────── */
.gv-contact__info {
	display: flex;
	flex-direction: column;
	gap: 0;
	background: #0d0d0d;
	border: 1px solid rgba(255,255,255,.07);
	border-radius: 12px;
	padding: 36px 32px;
}

.gv-contact__info-item {
	display: flex;
	align-items: flex-start;
	gap: 16px;
	padding: 20px 0;
	border-bottom: 1px solid rgba(255,255,255,.07);
}

.gv-contact__info-item:first-child {
	padding-top: 0;
}

.gv-contact__info-item:last-of-type {
	border-bottom: none;
}

.gv-contact__info-icon {
	flex-shrink: 0;
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(242,101,34,.12);
	border-radius: 8px;
	color: var(--gv-orange);
}

.gv-contact__info-label {
	font-family: var(--gv-font-b);
	font-size: .75rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: rgba(255,255,255,.4);
	margin: 0 0 4px;
}

.gv-contact__info-link {
	font-family: var(--gv-font-b);
	font-size: .95rem;
	color: #ffffff;
	text-decoration: none;
	transition: color .2s;
}

.gv-contact__info-link:hover {
	color: var(--gv-orange);
}

.gv-contact__info-text {
	font-family: var(--gv-font-b);
	font-size: .95rem;
	color: rgba(255,255,255,.7);
	margin: 0;
	line-height: 1.5;
}

.gv-contact__wa-btn {
	margin-top: 24px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	background: #25D366 !important;
	border-color: #25D366 !important;
	color: #ffffff !important;
}

.gv-contact__wa-btn:hover {
	background: #1ebe5a !important;
	border-color: #1ebe5a !important;
}

/* ── Redes sociales desactivadas ────────────────────────────── */
.gv-social-disabled {
	opacity: .35;
	pointer-events: none;
	cursor: not-allowed;
}

/* ================================================================
   RESPONSIVE
   ================================================================ */
@media (max-width: 1024px) {
	.gv-stats__grid { grid-template-columns: repeat(2, 1fr); }
	.gv-ia-highlight__cols { grid-template-columns: 1fr; gap: 20px; }
	.gv-contact__grid { grid-template-columns: 1fr; }
	.gv-contact__info { order: -1; }
}

@media (max-width: 768px) {
	.gv-section { padding: 72px 24px; }
	.gv-services__grid { grid-template-columns: 1fr; }
	.gv-portfolio__grid { grid-template-columns: repeat(2, 1fr); grid-template-rows: auto; }
	.gv-stats__grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }
	.gv-contact__form-wrap { padding: 28px 20px; }
	.gv-form-row { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
	.gv-hero { padding: 100px 24px 60px; }
	.gv-hero__actions { flex-direction: column; align-items: center; }
	.gv-portfolio__grid { grid-template-columns: 1fr; }
	.gv-stats__grid { grid-template-columns: 1fr 1fr; }
	.gv-cta-final__actions { flex-direction: column; align-items: center; }
	.gv-contact__wa-btn { width: 100%; }
}

/* ================================================================
   PÁGINA PORTAFOLIO COMPLETO — Estilos exclusivos
   ================================================================ */

.portfolio-hero {
  min-height: 50vh !important;
  height: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  background: #000000 !important;
  border: none !important;
  outline: none !important;
  padding: 120px 2rem 60px !important;
  position: relative !important;
  overflow: hidden !important;
}

.portfolio-hero h1 {
  font-family: 'Montserrat', sans-serif !important;
  font-weight: 900 !important;
  font-size: clamp(2.5rem, 6vw, 5rem) !important;
  color: #ffffff !important;
  margin-bottom: 1rem !important;
  line-height: 1 !important;
}

.portfolio-hero .hero-subtitle {
  color: #999 !important;
  font-size: 1.1rem !important;
  letter-spacing: 2px !important;
}

.portfolio-hero .breadcrumb {
  display: flex !important;
  gap: 8px !important;
  justify-content: center !important;
  margin-bottom: 1.5rem !important;
  font-size: 0.85rem !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
}

.portfolio-hero .breadcrumb a { 
  color: #F26522 !important; 
  text-decoration: none !important;
}

.portfolio-hero .breadcrumb .current { 
  color: #666 !important; 
}

/* Quitar cualquier borde naranja del hero */
.portfolio-page section {
  border: none !important;
  outline: none !important;
}

.portfolio-full-section {
  background: #000000;
  padding: 3rem 0 5rem;
}

.portfolio-full-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 1.5rem !important;
  margin-top: 1rem !important;
}

.portfolio-full-item {
  position: relative !important;
  overflow: hidden !important;
  border-radius: 4px !important;
  background: #1A1A1A !important;
  min-height: 280px !important;
}

.portfolio-full-item .portfolio-img-wrap {
  width: 100% !important;
  height: 280px !important;
  overflow: hidden !important;
  display: block !important;
}

.portfolio-full-item img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  transition: transform 0.5s ease !important;
}

.portfolio-full-item:hover img {
  transform: scale(1.06) !important;
}

.portfolio-full-item .portfolio-overlay {
  position: absolute !important;
  inset: 0 !important;
  background: rgba(242,101,34,0.88) !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  opacity: 0 !important;
  transition: opacity 0.3s ease !important;
}

.portfolio-full-item:hover .portfolio-overlay {
  opacity: 1 !important;
}

.portfolio-full-item.coming-soon {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px dashed #333 !important;
  cursor: default !important;
  min-height: 280px !important;
}

.coming-soon-inner {
  text-align: center;
}

.coming-soon-inner svg {
  stroke: #F26522;
  opacity: 0.4;
  display: block;
  margin: 0 auto 12px;
}

.coming-soon-inner span {
  font-family: 'Montserrat', sans-serif;
  font-size: 0.75rem;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: #F26522;
  opacity: 0.5;
}

.portfolio-cta {
  background: #0D0D0D;
  padding: 6rem 0;
  text-align: center;
  border-top: 1px solid #1A1A1A;
}

.portfolio-cta h2 {
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 900;
  color: #fff;
  margin-bottom: 1rem;
}

.portfolio-cta p {
  color: #999;
  font-size: 1.1rem;
  margin-bottom: 2.5rem;
}

.cta-buttons {
  display: flex;
  gap: 1rem;
  justify-content: center;
  flex-wrap: wrap;
}

@media (max-width: 1024px) {
  .portfolio-full-grid { grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 480px) {
  .portfolio-full-grid { grid-template-columns: 1fr; }
  .portfolio-filters { gap: 0.5rem; }
  .filter-btn { padding: 6px 14px; font-size: 0.7rem; }
}

.gv-portfolio__grid,
.portfolio-grid {
  margin-bottom: 80px !important;
  padding-bottom: 40px !important;
  overflow: visible !important;
}

.portfolio-section .btn-outline-orange,
.portfolio-section a[href*="portafolio"] {
  display: block !important;
  position: relative !important;
  z-index: 10 !important;
  margin-top: 60px !important;
  clear: both !important;
}