/* Tema Videovigilancia: estilos de maquetación que theme.json no cubre. */

body {
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

:where(.wp-site-blocks) > * {
	margin-block-start: 0;
}

:focus-visible {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 2px;
}

img {
	max-width: 100%;
	height: auto;
}

/* ---------- Cabecera ---------- */
.vv-header > .alignfull:not(.vv-navbar) {
	padding-inline: clamp(16px, 2vw, 24px) !important;
}

.vv-topbar p {
	margin: 0;
}

.vv-topbar a {
	text-decoration: none;
}

.vv-pill .vv-icon-list__link {
	padding: 0.35rem 1rem;
	border-radius: 999px;
	background: var(--wp--preset--color--warning);
	color: #fff;
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 600;
	transition: background 0.2s;
}

.vv-pill a.vv-icon-list__link:hover {
	background: #d38e27;
	text-decoration: none;
}

.vv-utilitybar .wp-block-vv-icon-list {
	font-size: 0.8125rem;
}

.vv-mainbar {
	gap: clamp(1rem, 4vw, 4rem);
}

.vv-mainbar__logo {
	flex: none;
}

.vv-mainbar__search,
.vv-mainbar > .dgwt-wcas-search-wrapp {
	flex: 1 1 auto;
	max-width: 620px;
}

.vv-mainbar__cart,
.vv-mainbar__actions {
	flex: none;
}

.vv-mainbar__account a {
	display: grid;
	place-items: center;
	width: 42px;
	height: 42px;
	border-radius: 50%;
	color: var(--wp--preset--color--primary);
	transition: background 0.2s;
}

.vv-mainbar__account a:hover {
	background: var(--wp--preset--color--cream);
}

.vv-mainbar__account svg {
	width: 24px;
	height: 24px;
}

.vv-utilitybar .wp-block-vv-rotator {
	font-size: 0.875rem;
	letter-spacing: 0.01em;
}

/* FiboSearch usa su estilo "pirx" (píldora gris), como la web anterior. */
.vv-mainbar__search .dgwt-wcas-search-wrapp {
	max-width: none;
}

/* Banda de garantías: pastilla blanca sobre fondo arena. */
.vv-trust {
	width: fit-content;
	max-width: 100%;
	margin-inline: auto !important;
	padding: 0.45rem 1.25rem !important;
	border-radius: 0 0 12px 12px;
	background: #fff;
	font-size: 0.875rem;
	gap: 0.4rem 1.5rem !important;
}

.vv-navbar .wp-block-vv-mega-menu {
	font-size: 0.9375rem;
}

@media (max-width: 1024px) {
	.vv-utilitybar {
		justify-content: center !important;
	}

	.vv-utilitybar__links {
		display: none !important;
	}

	.vv-mainbar {
		flex-wrap: wrap !important;
		row-gap: 12px;
	}

	.vv-mainbar__search,
	.vv-mainbar > .dgwt-wcas-search-wrapp {
		order: 3;
		flex-basis: 100%;
		max-width: none;
	}

	.vv-mainbar__logo img {
		width: 140px !important;
	}

	.vv-trust {
		display: none !important;
	}
}

/* ---------- Títulos ---------- */
.wp-block-heading.is-style-lined {
	display: flex;
	align-items: center;
	gap: 1.25rem;
	font-size: var(--wp--preset--font-size--x-large);
	font-weight: 400;
	text-align: center;
}

.wp-block-heading.is-style-lined::before,
.wp-block-heading.is-style-lined::after {
	content: "";
	flex: 1;
	height: 1px;
	background: var(--wp--preset--color--primary);
}

@media (max-width: 781px) {
	.wp-block-heading.is-style-lined::before,
	.wp-block-heading.is-style-lined::after {
		display: none;
	}

	.wp-block-heading.is-style-lined {
		justify-content: center;
	}
}

.wp-block-list.is-style-links {
	padding: 0;
	list-style: none;
}

.wp-block-group.is-style-card {
	padding: 1.5rem;
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 14px;
	background: #fff;
}

/* ---------- Megamenú: subtítulos ---------- */
.vv-mega__sub {
	margin: 0.6rem 0 0.25rem !important;
	font-size: 0.875rem;
	font-weight: 700;
	text-transform: uppercase;
}

.vv-mega__sub a {
	color: var(--wp--preset--color--body) !important;
}

/* ---------- Pie ---------- */
.vv-footer__title {
	margin: 0 0 0.9rem;
	padding-bottom: 0.45rem;
	border-bottom: 1px solid var(--wp--preset--color--line);
	color: var(--wp--preset--color--ink);
	font-size: 0.9375rem;
	font-weight: 700;
	letter-spacing: 0.02em;
	text-transform: uppercase;
}

.vv-footer .wp-block-vv-icon-list.is-column {
	font-size: 0.9375rem;
	font-weight: 500;
}

.vv-footer__bottom p {
	margin: 0;
}

/* ---------- Home ---------- */
.vv-main--home > .wp-block-post-content > * + * {
	margin-block-start: var(--wp--preset--spacing--50);
}

.vv-solutions > .wp-block-column {
	display: flex;
}

/* ---------- Tienda ---------- */
.vv-shop-head .wp-block-query-title {
	margin: 0;
	font-size: var(--wp--preset--font-size--xx-large);
}

.vv-shop-head .wp-block-term-description p {
	margin: 0.25rem 0 0;
}

@media (max-width: 781px) {
	.vv-shop {
		gap: 1rem !important;
	}

	.vv-shop__aside {
		flex-basis: auto !important;
	}
}

/* ---------- Ficha de producto ---------- */
.vv-product__title {
	margin-bottom: 0;
	font-weight: 500;
	line-height: 1.15;
}

.vv-product__sep {
	width: 100%;
	max-width: none !important;
	margin-block: 1rem !important;
}

.vv-product__summary > * + * {
	margin-block-start: 1rem;
}

.vv-flips .wp-block-vv-flip-box {
	min-height: 160px;
}

@media (min-width: 782px) {
	.vv-product__media {
		position: sticky;
		top: 20px;
		align-self: flex-start;
	}
}

@media (max-width: 781px) {
	.vv-flips {
		flex-wrap: wrap !important;
	}

	.vv-flips > .wp-block-column {
		flex-basis: calc(33.333% - 0.5rem) !important;
	}

	.vv-flips .wp-block-vv-flip-box {
		min-height: 140px;
	}

	.vv-flips .vv-flip__icon {
		width: 54px;
		height: 54px;
	}

	.vv-flips .vv-flip__title {
		font-size: 0.75rem;
	}
}

/* ---------- Ventajas ---------- */
@media (max-width: 1024px) and (min-width: 782px) {
	.vv-benefits {
		flex-wrap: wrap !important;
	}

	.vv-benefits > .wp-block-column {
		flex-basis: calc(50% - 0.75rem) !important;
	}
}

.vv-banner img {
	border-radius: 0;
}

/* =========================================================================
   Efectos
   ========================================================================= */

/* ---------- Cabecera fija y compacta ---------- */
.vv-site-header {
	position: sticky;
	top: var(--vv-sticky-top, 0px);
	z-index: 100;
}

.vv-site-header .vv-mainbar,
.vv-site-header .vv-trust,
.vv-site-header .vv-mainbar__logo img {
	transition: padding 0.3s ease, width 0.3s ease, max-height 0.3s ease, opacity 0.3s ease, margin 0.3s ease;
}

.vv-site-header.is-stuck .vv-mainbar {
	padding-top: 8px !important;
	padding-bottom: 8px !important;
}

.vv-site-header.is-stuck .vv-mainbar__logo img {
	width: 140px !important;
}

.vv-site-header.is-stuck .vv-trust {
	max-height: 0;
	padding-block: 0 !important;
	overflow: hidden;
	opacity: 0;
}

.vv-site-header.is-stuck .vv-navbar {
	box-shadow: 0 10px 30px -12px rgba(26, 26, 26, 0.25);
}

.vv-site-header.vv-no-transition,
.vv-site-header.vv-no-transition * {
	transition: none !important;
}

/* ---------- Aparición escalonada ---------- */
.vv-reveal {
	opacity: 0;
	transform: translateY(28px);
	transition: opacity 0.7s cubic-bezier(0.2, 0.7, 0.2, 1), transform 0.7s cubic-bezier(0.2, 0.7, 0.2, 1);
	transition-delay: calc(var(--vv-i, 0) * 70ms);
}

.vv-reveal.is-visible {
	opacity: 1;
	transform: none;
}

/* ---------- Aviso al añadir al carrito ---------- */
.vv-toast {
	position: fixed;
	left: 50%;
	bottom: 24px;
	z-index: 1100;
	display: flex;
	align-items: center;
	gap: 0.9rem;
	padding: 0.8rem 0.9rem 0.8rem 1rem;
	border-radius: 16px;
	background: var(--wp--preset--color--primary);
	color: #fff;
	font-size: var(--wp--preset--font-size--small);
	box-shadow: 0 20px 50px -10px rgba(0, 0, 0, 0.45);
	opacity: 0;
	pointer-events: none;
	transform: translate(-50%, 30px) scale(0.96);
	transition: opacity 0.35s ease, transform 0.45s cubic-bezier(0.2, 0.9, 0.3, 1.3);
}

.vv-toast.is-visible {
	opacity: 1;
	pointer-events: auto;
	transform: translate(-50%, 0) scale(1);
}

.vv-toast__icon {
	display: grid;
	place-items: center;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: #2fbf71;
	animation: vv-pop 0.5s ease;
}

.vv-toast__text {
	max-width: 340px;
	font-weight: 600;
}

.vv-toast__link {
	color: #fff !important;
	opacity: 0.8;
	white-space: nowrap;
}

.vv-toast__cta {
	padding: 0.5rem 1rem;
	border-radius: 999px;
	background: var(--wp--preset--color--accent);
	color: #fff !important;
	font-weight: 700;
	text-decoration: none !important;
	white-space: nowrap;
}

@media (max-width: 600px) {
	.vv-toast {
		left: 12px;
		right: 12px;
		bottom: calc(76px + env(safe-area-inset-bottom));
		flex-wrap: wrap;
		transform: translateY(30px);
	}

	.vv-toast.is-visible {
		transform: none;
	}

	.vv-toast__text {
		flex: 1;
	}
}

@keyframes vv-pop {
	0% { transform: scale(0.3); }
	70% { transform: scale(1.15); }
	100% { transform: scale(1); }
}

.wc-block-mini-cart__button.vv-bump .wc-block-mini-cart__badge,
.wc-block-mini-cart__button.vv-bump svg {
	animation: vv-bump 0.6s ease;
}

@keyframes vv-bump {
	0%, 100% { transform: scale(1); }
	30% { transform: scale(1.35) rotate(-8deg); }
	60% { transform: scale(0.95) rotate(4deg); }
}

@media (prefers-reduced-motion: reduce) {
	.vv-reveal,
	.vv-toast {
		transition: none;
	}

	.vv-toast__icon,
	.wc-block-mini-cart__button.vv-bump * {
		animation: none !important;
	}
}

/* ---------- Encabezados de sección ---------- */
.vv-section-head {
	margin-bottom: var(--wp--preset--spacing--40);
}

.vv-section-head .wp-block-heading {
	margin: 0;
	line-height: 1.05;
	letter-spacing: -0.03em;
}

.vv-kicker {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	margin-block: 0 0.6rem !important;
	color: var(--wp--preset--color--accent);
	font-size: 0.8rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.vv-kicker::before {
	content: "";
	width: 28px;
	height: 2px;
	border-radius: 2px;
	background: currentColor;
}

.vv-section-head.is-centered {
	text-align: center;
}

.vv-section-head.is-centered .vv-kicker {
	justify-content: center;
}

/* ---------- Tarjetas de solución con brillo ---------- */
.wp-block-vv-feature-card {
	position: relative;
	isolation: isolate;
}

.wp-block-vv-feature-card::before {
	content: "";
	position: absolute;
	inset: -2px;
	z-index: -1;
	border-radius: inherit;
	background: conic-gradient(from var(--vv-angle, 0deg), transparent 0deg, var(--wp--preset--color--accent) 70deg, var(--wp--preset--color--warning) 140deg, transparent 220deg);
	opacity: 0;
	transition: opacity 0.4s;
}

.wp-block-vv-feature-card:hover::before {
	opacity: 1;
	animation: vv-spin 3s linear infinite;
}

.wp-block-vv-feature-card::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	border-radius: inherit;
	background: #fff;
}

.wp-block-vv-feature-card .vv-feature__btn {
	border-radius: 999px;
	transition: background 0.25s, color 0.25s, gap 0.25s;
}

.wp-block-vv-feature-card:hover .vv-feature__btn {
	background: var(--wp--preset--color--accent);
	border-color: var(--wp--preset--color--accent);
	color: #fff;
}

@property --vv-angle {
	syntax: "<angle>";
	initial-value: 0deg;
	inherits: false;
}

@keyframes vv-spin {
	to {
		--vv-angle: 360deg;
	}
}

@media (prefers-reduced-motion: reduce) {
	.wp-block-vv-feature-card:hover::before {
		animation: none;
	}
}

/* ---------- Hero: sombra y ligera profundidad ---------- */
.wp-block-vv-hero-slider {
	box-shadow: 0 30px 60px -30px rgba(26, 26, 36, 0.55);
}

/* Franja final del pie dentro del área crema. */
.vv-footer > .vv-footer__cta {
	max-width: 1280px;
	margin-inline: auto !important;
}

@media (max-width: 781px) {
	.vv-benefits {
		flex-wrap: wrap !important;
		gap: 0.6rem !important;
	}

	.vv-benefits > .wp-block-column {
		flex-basis: calc(50% - 0.3rem) !important;
	}

	.vv-benefits .wp-block-vv-icon-box {
		padding: 1.1rem;
		border-radius: 14px;
	}

	.vv-benefits .vv-icon-box__title {
		font-size: 0.95rem;
	}
}

/* =========================================================================
   Landing: diseño gratuito
   ========================================================================= */
html {
	scroll-behavior: smooth;
}

#formulario {
	scroll-margin-top: 140px;
}

.vv-main--full:has(.vv-landing-hero) {
	padding-top: 0 !important;
}

.vv-landing-hero {
	position: relative;
	overflow: hidden;
	background:
		radial-gradient(circle at 85% 20%, rgba(196, 57, 43, 0.45), transparent 45%),
		radial-gradient(circle at 10% 90%, rgba(232, 162, 58, 0.18), transparent 40%),
		linear-gradient(135deg, #23232f 0%, #2d2d3a 55%, #1a1a24 100%);
	color: rgba(255, 255, 255, 0.78);
	isolation: isolate;
}

.vv-landing-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background-image: radial-gradient(rgba(255, 255, 255, 0.07) 1px, transparent 1px);
	background-size: 22px 22px;
	mask-image: linear-gradient(90deg, #000, transparent 70%);
}

.vv-landing-hero .vv-kicker {
	color: var(--wp--preset--color--warning);
}

.vv-landing-hero__title {
	margin: 0 0 1rem;
	color: #fff;
	font-size: clamp(2.2rem, 5vw, 3.75rem) !important;
	font-weight: 800 !important;
	line-height: 1.02;
	letter-spacing: -0.035em;
}

.vv-landing-hero__lead {
	max-width: 560px;
	font-size: var(--wp--preset--font-size--medium);
	line-height: 1.6;
}

.vv-landing-hero__ticks {
	margin: 1.5rem 0 !important;
	font-size: 1rem;
	gap: 0.6rem !important;
}

.vv-landing-hero__ticks .vv-icon {
	padding: 3px;
	border-radius: 50%;
	background: rgba(47, 191, 113, 0.18);
	color: #4fd38a;
}

.vv-landing-hero__ticks strong {
	color: #fff;
}

.vv-btn-accent .wp-block-button__link {
	padding: 1rem 1.6rem;
	background: var(--wp--preset--color--accent);
	box-shadow: 0 14px 30px -12px rgba(196, 57, 43, 0.9);
	font-size: 0.85rem;
}

.vv-btn-accent .wp-block-button__link:hover {
	background: var(--wp--preset--color--accent-dark);
}

.vv-btn-light .wp-block-button__link {
	padding: 1rem 1.6rem;
	border-color: rgba(255, 255, 255, 0.35) !important;
	color: #fff !important;
	font-size: 0.85rem;
}

.vv-btn-light .wp-block-button__link:hover {
	background: rgba(255, 255, 255, 0.1);
}

.vv-landing-form {
	padding: clamp(1.25rem, 3vw, 2rem);
	border-radius: 24px;
	background: #fff;
	color: var(--wp--preset--color--body);
	box-shadow: 0 40px 80px -30px rgba(0, 0, 0, 0.6);
}

.vv-landing-form__title {
	margin: 0 0 0.25rem;
	font-size: var(--wp--preset--font-size--large) !important;
	font-weight: 800 !important;
}

.vv-landing-form__sub {
	margin: 0 0 1.25rem;
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--small);
}

.vv-landing-benefits .wp-block-vv-icon-box {
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 20px;
	background: #fff;
	transition: box-shadow 0.3s, transform 0.3s;
}

.vv-landing-benefits .wp-block-vv-icon-box:hover {
	box-shadow: 0 20px 40px -24px rgba(45, 45, 58, 0.45);
	transform: translateY(-3px);
}

.vv-landing-benefits .vv-icon-box__icon {
	display: grid;
	place-items: center;
	width: 52px;
	height: 52px;
	border-radius: 14px;
	background: #fdf1ef;
	color: var(--wp--preset--color--accent);
}

/* Pasos numerados. */
.vv-landing-steps {
	counter-reset: vv-step;
}

.vv-step {
	position: relative;
	padding: 2rem 1.5rem 1.5rem;
	border-radius: 20px;
	background: #fff;
	counter-increment: vv-step;
}

.vv-step::before {
	content: counter(vv-step);
	display: grid;
	place-items: center;
	width: 48px;
	height: 48px;
	margin-bottom: 1rem;
	border-radius: 50%;
	background: var(--wp--preset--color--primary);
	color: #fff;
	font-size: 1.25rem;
	font-weight: 800;
}

.vv-step:not(:last-child)::after {
	content: "";
	position: absolute;
	top: calc(2rem + 24px);
	left: calc(1.5rem + 56px);
	right: -1.25rem;
	height: 2px;
	background: repeating-linear-gradient(90deg, var(--wp--preset--color--line) 0 8px, transparent 8px 14px);
}

.vv-step h3 {
	margin: 0 0 0.5rem;
	font-size: var(--wp--preset--font-size--medium) !important;
}

.vv-step p {
	margin: 0;
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--small);
}

@media (max-width: 781px) {
	.vv-step::after {
		display: none;
	}
}

/* Preguntas frecuentes (bloque Detalles). */
.vv-landing-faq .wp-block-details {
	margin: 0 0 0.75rem;
	padding: 0;
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 16px;
	background: #fff;
	transition: box-shadow 0.25s;
}

.vv-landing-faq .wp-block-details[open] {
	box-shadow: 0 16px 32px -24px rgba(45, 45, 58, 0.45);
}

.vv-landing-faq .wp-block-details summary {
	position: relative;
	padding: 1.1rem 3.5rem 1.1rem 1.4rem;
	color: var(--wp--preset--color--ink);
	font-weight: 700;
	cursor: pointer;
	list-style: none;
}

.vv-landing-faq .wp-block-details summary::-webkit-details-marker {
	display: none;
}

.vv-landing-faq .wp-block-details summary::after {
	content: "+";
	position: absolute;
	top: 50%;
	right: 1.2rem;
	display: grid;
	place-items: center;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background: var(--wp--preset--color--cream);
	color: var(--wp--preset--color--accent);
	font-size: 1.2rem;
	transform: translateY(-50%);
	transition: transform 0.25s;
}

.vv-landing-faq .wp-block-details[open] summary::after {
	transform: translateY(-50%) rotate(45deg);
}

.vv-landing-faq .wp-block-details > :not(summary) {
	margin: 0;
	padding: 0 1.4rem 1.2rem;
	color: var(--wp--preset--color--muted);
}

/* Si la página ya tiene su propia franja de llamada a la acción, la del pie sobra. */
body:has(.vv-main .wp-block-vv-cta-band) .vv-footer > .vv-footer__cta {
	display: none;
}

/* =========================================================================
   Páginas legales
   ========================================================================= */
.vv-legal-title {
	margin-block: 0 var(--wp--preset--spacing--40) !important;
	font-size: clamp(2rem, 4vw, 2.75rem) !important;
	font-weight: 800 !important;
	letter-spacing: -0.03em;
}

.vv-legal {
	color: var(--wp--preset--color--body);
	font-size: 1rem;
	line-height: 1.75;
}

.vv-legal h2 {
	margin: 2.5rem 0 1rem;
	padding-top: 1.5rem;
	border-top: 1px solid var(--wp--preset--color--line);
	font-size: var(--wp--preset--font-size--large);
	font-weight: 800;
	scroll-margin-top: 140px;
}

.vv-legal h3 {
	margin: 2rem 0 0.75rem;
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 700;
}

.vv-legal > h2:first-child,
.vv-legal > .vv-legal-toc + h2,
.vv-legal > .vv-legal-toc + h3 {
	margin-top: 1rem;
}

.vv-legal p {
	margin: 0 0 0.85rem;
}

.vv-legal .vv-legal-label {
	margin: 1.25rem 0 0.4rem;
	color: var(--wp--preset--color--ink);
}

.vv-legal ul,
.vv-legal ol {
	margin: 0 0 1rem;
	padding-left: 1.25rem;
}

.vv-legal li {
	margin: 0.25rem 0;
}

.vv-legal li::marker {
	color: var(--wp--preset--color--accent);
}

.vv-legal a {
	text-decoration: underline;
	text-underline-offset: 3px;
}

.vv-legal-toc {
	margin-bottom: 2rem;
	padding: 1.25rem 1.5rem;
	border-radius: 16px;
	background: var(--wp--preset--color--cream);
}

.vv-legal-toc p {
	margin: 0 0 0.5rem;
}

.vv-legal-toc ul {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0.25rem 1.5rem;
	margin: 0;
	padding: 0;
}

.vv-legal-toc li::marker {
	content: none;
}

.vv-legal-toc a {
	color: var(--wp--preset--color--body);
	text-decoration: none;
}

.vv-legal-toc a:hover {
	color: var(--wp--preset--color--accent);
}

.vv-legal-more {
	margin-top: var(--wp--preset--spacing--50) !important;
	padding: 1.5rem;
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 16px;
}

.vv-legal-more p {
	margin: 0 0 0.75rem;
}

@media (max-width: 600px) {
	.vv-legal-toc ul {
		grid-template-columns: 1fr;
	}
}