/* =====================================================================
   NBK Electrónica — estilo moderno y movimiento
   Colores de marca: azul #0F2D5C · magenta #B8237F
   ===================================================================== */
:root {
	--nbk-navy: #0F2D5C;
	--nbk-mag: #B8237F;
	--nbk-dark: #0A1E3F;
	--nbk-violet: #7A2A93;
	--nbk-grad: linear-gradient(120deg, #B8237F 0%, #7A2A93 50%, #0F2D5C 100%);
	--nbk-grad-soft: linear-gradient(120deg, rgba(184,35,127,.12), rgba(15,45,92,.10));
	--nbk-radius: 22px;
	--nbk-shadow: 0 24px 60px -24px rgba(15,45,92,.38);
	--nbk-ease: cubic-bezier(.2,.8,.2,1);
	--nbk-top: var(--wp-admin--admin-bar--height, 0px);
	--nbk-circuit: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260' fill='none' stroke-width='2' stroke-linecap='round'%3E%3Cg stroke='%23B8237F'%3E%3Cpath d='M0 46h70l34 34h96'/%3E%3Ccircle cx='206' cy='80' r='6'/%3E%3Cpath d='M46 260v-62l34-34h46'/%3E%3Ccircle cx='132' cy='164' r='6'/%3E%3C/g%3E%3Cg stroke='%230F2D5C'%3E%3Cpath d='M214 260v-66l-34-34'/%3E%3Ccircle cx='176' cy='156' r='6'/%3E%3Cpath d='M160 0v26l26 26h74'/%3E%3C/g%3E%3C/svg%3E");
}

html { scroll-behavior: smooth; scroll-padding-top: 96px; }
body { -webkit-font-smoothing: antialiased; }

/* ---------------------------------------------------------------- Barra de progreso */
.nbk-progress {
	position: fixed; top: var(--nbk-top); left: 0; right: 0; height: 3px; z-index: 1001;
	background: var(--nbk-grad); transform-origin: 0 50%; transform: scaleX(0); pointer-events: none;
}

/* ---------------------------------------------------------------- Cabecera fija con efecto vidrio */
.site-header {
	position: sticky; top: var(--nbk-top); z-index: 1000;
	background: rgba(255,255,255,.72);
	-webkit-backdrop-filter: saturate(180%) blur(16px); backdrop-filter: saturate(180%) blur(16px);
	border-bottom: 1px solid rgba(15,45,92,.06);
	transition: padding .35s var(--nbk-ease), box-shadow .35s, background .35s;
}
.nbk-scrolled .site-header {
	background: rgba(255,255,255,.9);
	box-shadow: 0 12px 34px -18px rgba(15,45,92,.35);
	padding-block: 6px;
}
.site-header .site-logo img, .site-header .custom-logo { transition: transform .35s var(--nbk-ease); transform-origin: left center; }
.nbk-scrolled .site-header .site-logo img, .nbk-scrolled .site-header .custom-logo { transform: scale(.86); }

.site-navigation ul.menu li a {
	position: relative; font-weight: 600; color: var(--nbk-navy); transition: color .25s;
}
.site-navigation ul.menu li a::after {
	content: ""; position: absolute; left: 14%; right: 14%; bottom: 6px; height: 2px; border-radius: 2px;
	background: var(--nbk-grad); transform: scaleX(0); transition: transform .35s var(--nbk-ease);
}
.site-navigation ul.menu li a:hover { color: var(--nbk-mag); }
.site-navigation ul.menu li a:hover::after,
.site-header .site-navigation ul.menu li.current-menu-item:not(.menu-item-type-custom) > a::after { transform: scaleX(1); }

/* Pie de página: enlaces legibles sobre fondo oscuro */
.site-footer .site-navigation ul.menu li a { color: #C9D2E6 !important; font-weight: 500; }
.site-footer .site-navigation ul.menu li a:hover { color: #fff !important; }
.site-footer .site-navigation ul.menu li a::after { bottom: 2px; }

.site-navigation ul.menu li.nbk-menu-cta > a,
.site-navigation-dropdown ul.menu li.nbk-menu-cta > a {
	background: var(--nbk-grad); background-size: 200% auto; color: #fff !important;
	border-radius: 999px; padding: 10px 22px; margin-left: 10px;
	box-shadow: 0 10px 24px -12px rgba(184,35,127,.7);
	transition: background-position .5s, transform .3s;
}
.site-navigation ul.menu li.nbk-menu-cta > a::after { display: none; }
.site-navigation ul.menu li.nbk-menu-cta > a:hover { background-position: right center; transform: translateY(-2px); }

/* ---------------------------------------------------------------- Botones */
.elementor-button { border-radius: 999px !important; transition: transform .3s var(--nbk-ease), box-shadow .3s, background-position .5s, background-color .3s !important; }
.elementor-button:hover { transform: translateY(-3px); }
.nbk-btn-grad .elementor-button {
	background-image: var(--nbk-grad) !important; background-size: 200% auto !important; color: #fff !important;
	box-shadow: 0 14px 30px -14px rgba(184,35,127,.75);
}
.nbk-btn-grad .elementor-button:hover { background-position: right center !important; }
.nbk-btn-wa .elementor-button { animation: nbk-pulse 2.6s infinite; }
.nbk-btn-ghost .elementor-button { -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.nbk-btn-chip .elementor-button {
	background: #fff !important; color: var(--nbk-navy) !important; border: 1px solid rgba(15,45,92,.12) !important;
	padding: 10px 20px !important; font-size: 15px !important;
}
.nbk-btn-chip .elementor-button:hover { background: var(--nbk-navy) !important; color: #fff !important; }

/* ---------------------------------------------------------------- Etiqueta (eyebrow) */
.nbk-eyebrow .elementor-heading-title {
	display: inline-flex; align-items: center; gap: 10px; padding: 7px 16px 7px 12px;
	border-radius: 999px; background: rgba(184,35,127,.09); border: 1px solid rgba(184,35,127,.18);
}
.nbk-eyebrow .elementor-heading-title::before {
	content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--nbk-mag);
	box-shadow: 0 0 0 0 rgba(184,35,127,.6); animation: nbk-dot 2s infinite;
}
.nbk-eyebrow-dark .elementor-heading-title { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.18); }

/* ---------------------------------------------------------------- Texto con degradé y palabra que rota */
.nbk-grad-text, .nbk-rotar > span { background: var(--nbk-grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.nbk-hero-dark .nbk-grad-text, .nbk-hero-dark .nbk-rotar > span,
.nbk-hero-photo .nbk-rotar > span { background: linear-gradient(120deg, #FF7AC6, #F2A6D3 45%, #9DB8FF); -webkit-background-clip: text; background-clip: text; }

.nbk-rotar { display: inline-grid; vertical-align: bottom; overflow: hidden; line-height: 1.2; padding-bottom: .06em; }
.nbk-rotar > span { grid-area: 1 / 1; opacity: 0; transform: translateY(100%); animation: nbk-rot 10s infinite; white-space: nowrap; }
.nbk-rotar > span:nth-child(2) { animation-delay: 2.5s; }
.nbk-rotar > span:nth-child(3) { animation-delay: 5s; }
.nbk-rotar > span:nth-child(4) { animation-delay: 7.5s; }
.nbk-centro .nbk-rotar { justify-items: center; }

/* ---------------------------------------------------------------- Héroe con fondo vivo */
.elementor .e-con.nbk-hero { position: relative; overflow: hidden; isolation: isolate; }
.elementor .e-con.nbk-hero::before {
	content: ""; position: absolute; inset: -25%; z-index: -2; pointer-events: none;
	background:
		radial-gradient(38% 38% at 18% 30%, rgba(184,35,127,.26), transparent 70%),
		radial-gradient(34% 34% at 82% 22%, rgba(15,45,92,.22), transparent 70%),
		radial-gradient(30% 30% at 62% 82%, rgba(122,42,147,.20), transparent 70%);
	animation: nbk-blobs 16s ease-in-out infinite alternate;
}
.elementor .e-con.nbk-hero::after {
	content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
	background-image: var(--nbk-circuit); background-size: 260px; opacity: .13;
	-webkit-mask-image: radial-gradient(70% 80% at 50% 40%, #000 30%, transparent 85%);
	mask-image: radial-gradient(70% 80% at 50% 40%, #000 30%, transparent 85%);
	animation: nbk-drift 50s linear infinite;
}
.elementor .e-con.nbk-hero-dark { background-color: var(--nbk-dark) !important; }
.elementor .e-con.nbk-hero-dark::before {
	background:
		radial-gradient(40% 40% at 15% 25%, rgba(184,35,127,.55), transparent 70%),
		radial-gradient(36% 36% at 85% 30%, rgba(46,94,170,.45), transparent 70%),
		radial-gradient(32% 32% at 55% 90%, rgba(122,42,147,.45), transparent 70%);
}
.elementor .e-con.nbk-hero-dark::after { opacity: .22; filter: brightness(2.2) saturate(1.2); }
.elementor .e-con.nbk-hero-photo::before {
	inset: 0; animation: none;
	background: linear-gradient(135deg, rgba(10,30,63,.94) 0%, rgba(10,30,63,.86) 45%, rgba(184,35,127,.78) 100%);
}
.elementor .e-con.nbk-hero-photo::after { opacity: .2; filter: brightness(2.2); }

/* ---------------------------------------------------------------- Chips de confianza */
.nbk-chips { gap: 12px !important; }
.nbk-chip { width: auto !important; }
.nbk-chip .elementor-widget-container,
.nbk-chip.elementor-widget-text-editor {
	display: inline-flex; align-items: center; gap: 8px; padding: 10px 18px; border-radius: 999px;
	background: rgba(255,255,255,.75); border: 1px solid rgba(15,45,92,.08);
	-webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
	box-shadow: 0 8px 24px -16px rgba(15,45,92,.4); font-size: 15px; color: var(--nbk-navy);
}
.nbk-chip p { margin: 0; }
.nbk-chip strong { background: var(--nbk-grad); -webkit-background-clip: text; background-clip: text; color: transparent; font-family: Montserrat, sans-serif; font-weight: 800; }
.nbk-chips-dark .nbk-chip .elementor-widget-container,
.nbk-chips-dark .nbk-chip.elementor-widget-text-editor { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.16); color: #fff; }
.nbk-chips-dark .nbk-chip strong { background: linear-gradient(120deg, #FF7AC6, #9DB8FF); -webkit-background-clip: text; background-clip: text; }

/* ---------------------------------------------------------------- Imagen flotante con resplandor */
.nbk-img-glow { position: relative; isolation: isolate; }
.nbk-img-glow img { border-radius: 26px !important; animation: nbk-float 7s ease-in-out infinite; box-shadow: var(--nbk-shadow); }
.nbk-img-glow::before {
	content: ""; position: absolute; inset: 10% -3% -6% 10%; z-index: -1; border-radius: 32px;
	background: var(--nbk-grad); filter: blur(44px); opacity: .45; animation: nbk-glow 7s ease-in-out infinite;
}

/* ---------------------------------------------------------------- Franja en movimiento */
.elementor .e-con.nbk-marquee { overflow: hidden; background: var(--nbk-grad) !important; }
.nbk-marquee .elementor-widget { width: max-content !important; max-width: none !important; }
.nbk-track { display: flex; width: max-content; animation: nbk-marquee 32s linear infinite; }
.nbk-track p { display: contents; }
.nbk-track span {
	display: inline-flex; align-items: center; gap: 44px; padding-right: 44px; white-space: nowrap;
	font-family: Montserrat, sans-serif; font-weight: 700; font-size: 21px; color: #fff; letter-spacing: .3px;
}
.nbk-track span::after { content: "✦"; font-size: 16px; color: rgba(255,255,255,.55); }
.nbk-marquee:hover .nbk-track { animation-play-state: paused; }

/* ---------------------------------------------------------------- Tarjetas */
.elementor .e-con.nbk-card {
	position: relative; background: #fff; border-radius: var(--nbk-radius) !important;
	border: 1px solid rgba(15,45,92,.08) !important; box-shadow: 0 2px 6px rgba(15,45,92,.04);
	transition: transform .5s var(--nbk-ease), box-shadow .5s var(--nbk-ease);
}
.elementor .e-con.nbk-card::after {
	content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1.6px; pointer-events: none;
	background: var(--nbk-grad);
	-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor;
	mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
	opacity: 0; transition: opacity .45s;
}
.elementor .e-con.nbk-card:hover { transform: translateY(-8px); box-shadow: var(--nbk-shadow); }
.elementor .e-con.nbk-card:hover::after { opacity: 1; }
.elementor .e-con.nbk-card-dark { background: rgba(255,255,255,.05) !important; border-color: rgba(255,255,255,.10) !important; -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
.elementor .e-con.nbk-card-dark:hover { box-shadow: 0 24px 60px -24px rgba(0,0,0,.6); }

.nbk-card .elementor-icon-box-icon .elementor-icon,
.nbk-icon-grad .elementor-icon {
	background: var(--nbk-grad) !important; color: #fff !important; border-radius: 18px !important;
	padding: .5em !important; transition: transform .5s var(--nbk-ease);
	box-shadow: 0 12px 26px -12px rgba(184,35,127,.7);
}
.nbk-card .elementor-icon svg, .nbk-icon-grad .elementor-icon svg { fill: #fff !important; }
.nbk-card:hover .elementor-icon-box-icon .elementor-icon { transform: rotate(-8deg) scale(1.08); }

.nbk-num .elementor-heading-title {
	font-size: 54px !important; line-height: 1 !important; font-weight: 800 !important; color: transparent !important;
	-webkit-text-stroke: 1.6px rgba(184,35,127,.45);
}
.nbk-card-dark .nbk-num .elementor-heading-title { -webkit-text-stroke-color: rgba(255,255,255,.35); }

.nbk-link a {
	font-family: Montserrat, sans-serif; font-weight: 700; color: var(--nbk-mag) !important; text-decoration: none;
	display: inline-flex; gap: 8px; align-items: center;
}
.nbk-link a::after { content: "→"; transition: transform .3s var(--nbk-ease); }
.nbk-link a:hover::after { transform: translateX(6px); }
.nbk-card-dark .nbk-link a { color: #FF9AD5 !important; }

/* ---------------------------------------------------------------- Pasos con línea */
.nbk-paso .nbk-num .elementor-heading-title { -webkit-text-stroke: 0; background: var(--nbk-grad); -webkit-background-clip: text; background-clip: text; }

/* ---------------------------------------------------------------- Sub-navegación de servicios (fija) */
.elementor .e-con.nbk-subnav {
	position: sticky; top: calc(var(--nbk-top) + 74px); z-index: 50;
	background: rgba(244,245,250,.82) !important; -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
	border-bottom: 1px solid rgba(15,45,92,.06);
}
.nbk-subnav .elementor-widget { width: auto !important; }

/* ---------------------------------------------------------------- Mapa */
.nbk-map { border-radius: var(--nbk-radius) !important; overflow: hidden; box-shadow: var(--nbk-shadow); }
.nbk-map iframe { display: block; filter: saturate(1.05); }

/* ---------------------------------------------------------------- Fondo degradé */
.elementor .e-con.nbk-bg-grad { background: var(--nbk-grad) !important; background-size: 200% 200% !important; animation: nbk-gradmove 14s ease infinite; }

/* ---------------------------------------------------------------- Botón flotante de WhatsApp */
.nbk-wa-float {
	position: fixed; right: 22px; bottom: 22px; z-index: 999; display: inline-flex; align-items: center; gap: 10px;
	padding: 14px; border-radius: 999px; background: #1FA855; color: #fff !important; text-decoration: none;
	box-shadow: 0 14px 34px -10px rgba(31,168,85,.75); animation: nbk-pulse 2.6s infinite;
	font-family: Montserrat, sans-serif; font-weight: 700; font-size: 15px;
	transition: transform .3s var(--nbk-ease), padding .3s;
}
.nbk-wa-float svg { width: 30px; height: 30px; }
.nbk-wa-float span { max-width: 0; overflow: hidden; white-space: nowrap; transition: max-width .4s var(--nbk-ease); }
.nbk-wa-float:hover { transform: translateY(-3px); padding-right: 22px; }
.nbk-wa-float:hover span { max-width: 140px; }

/* ---------------------------------------------------------------- Pie */
.site-footer { border-top: 3px solid transparent; border-image: var(--nbk-grad) 1; }

/* ---------------------------------------------------------------- Animaciones */
@keyframes nbk-blobs { 0% { transform: translate3d(0,0,0) rotate(0); } 50% { transform: translate3d(4%,-3%,0) rotate(10deg); } 100% { transform: translate3d(-4%,3%,0) rotate(-8deg); } }
@keyframes nbk-drift { to { background-position: 260px 260px; } }
@keyframes nbk-rot { 0% { opacity: 0; transform: translateY(100%); } 4%, 22% { opacity: 1; transform: none; } 26%, 100% { opacity: 0; transform: translateY(-100%); } }
@keyframes nbk-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-12px); } }
@keyframes nbk-glow { 0%, 100% { opacity: .38; transform: scale(1); } 50% { opacity: .55; transform: scale(1.04); } }
@keyframes nbk-marquee { to { transform: translateX(-50%); } }
@keyframes nbk-pulse { 0% { box-shadow: 0 0 0 0 rgba(31,168,85,.55), 0 14px 34px -10px rgba(31,168,85,.75); } 70% { box-shadow: 0 0 0 16px rgba(31,168,85,0), 0 14px 34px -10px rgba(31,168,85,.75); } 100% { box-shadow: 0 0 0 0 rgba(31,168,85,0), 0 14px 34px -10px rgba(31,168,85,.75); } }
@keyframes nbk-dot { 0% { box-shadow: 0 0 0 0 rgba(184,35,127,.6); } 70% { box-shadow: 0 0 0 9px rgba(184,35,127,0); } 100% { box-shadow: 0 0 0 0 rgba(184,35,127,0); } }
@keyframes nbk-gradmove { 0%, 100% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } }

/* ---------------------------------------------------------------- Celular */
@media (max-width: 767px) {
	html { scroll-padding-top: 76px; }
	.nbk-track span { font-size: 17px; gap: 30px; padding-right: 30px; }
	.nbk-wa-float { right: 16px; bottom: 16px; padding: 12px; }
	.nbk-num .elementor-heading-title { font-size: 42px !important; }
	.elementor .e-con.nbk-subnav { top: calc(var(--nbk-top) + 64px); }
	.site-navigation-dropdown ul.menu li.nbk-menu-cta > a { margin: 8px 16px; text-align: center; }
}

/* ---------------------------------------------------------------- Accesibilidad: sin movimiento si el usuario lo pide */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
	.nbk-rotar > span { opacity: 0; transform: none; }
	.nbk-rotar > span:first-child { opacity: 1; }
	.elementor-invisible { visibility: visible !important; }
}
