:root,
html {
	color-scheme: only light;
	scroll-behavior: smooth;
}

:root {
	--site-color-primary:    #051C3C;
	--site-color-secondary:  #E3F5FF;
	--site-color-text:       #676F8F;
	--site-color-accent:     #91A0B4;
	--site-color-f29cbf6:    #000000;
	--site-color-4baa0cb:    #FFFFFF;
	--site-color-a1d799a:    #7E5ED5;
	--site-color-908e84f:    #9C89FD;
	--site-color-dd5d35a:    #EAE7F2;
	--site-color-93d65f3:    #EBEEF7;
	--site-color-7932011:    #1DC8AB;
	--site-color-549a7cc:    #8EE3D5;
	--site-color-e1853bc:    #FCB629;
	--site-color-0cc96a0:    #FDDA94;
	--site-color-de3400f:    #FFFFFF00;
	--site-color-debac6c:    #697C9630;
	--site-color-7560b43:    #F9F9FF;
	--site-color-0731926:    #FFFFFF00;
	--site-color-ea5641a:    #2CAB1C;
	--site-color-2577381:    #47454B;
	--site-color-08eb625:    #47454B;
	--site-color-6f7ce93:    #7E5ED5;
	--site-color-cefc1fa:    #6F6E70;

	--site-typography-primary-font-family: "colfax-web";
	--site-typography-script-font-family: "Style Script";

	--site-transition: 0.3s ease;

	--site-bp-laptop: 1300px;
	--site-bp-tablet: 1024px;
	--site-bp-mobile: 768px;
}

/* ================================
   SECTION — padding estándar global
   ================================ */
section {
	padding: 70px 0 !important;
}

@media (max-width: 1024px) {
	section { padding: 40px 0 !important; }
}

/* ================================
   BASE
   ================================ */
body {
	background: var(--site-color-7560b43);
	font-family: var(--site-typography-primary-font-family), sans-serif;
}

h1, h2, h3, h4, h5, h6 {
	letter-spacing: -0.5px;
	font-weight: 500;
}

h1 {
	font-size: 76px;
	line-height: 1em;
}

@media (max-width: 1024px) {
	h1 { font-size: 48px; }
}

@media (max-width: 768px) {
	h1 { font-size: 44px; }
}

h2 {
	font-size: 40px;
	color: var(--site-color-primary);
}

@media (max-width: 768px) {
	h2 { font-size: 32px; }
}

h3 {
	font-size: 26px;
	color: var(--site-color-a1d799a);
}

@media (max-width: 768px) {
	h3 { font-size: 22px; }
}

h4 {
	font-size: 20px;
	font-weight: 400;
	letter-spacing: -0.5px;
}

p,
li {
	font-size: 18px;
	color: var(--site-color-text);
	line-height: 1.3em;
}

ol {
	padding: 5px 0 5px 20px;
}

p strong,
p b {
	font-weight: 500;
}

/* ---- Botones estándar ---- */
.btn-wsp,
.btn-cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	gap: 10px;
	color: #fff;
	font-size: 18px;
	font-weight: 500;
	padding: 14px 28px;
	border-radius: 8px;
	border: none;
	text-decoration: none;
	transition: opacity var(--site-transition);
}

.btn-wsp:hover,
.btn-cta:hover {
	opacity: 0.88;
}

/* WhatsApp — verde */
.btn-wsp {
	background: var(--site-color-ea5641a);
}

.btn-wsp svg {
	width: 22px;
	height: 22px;
	fill: #fff;
	flex-shrink: 0;
}

/* CTA — morado */
.btn-cta {
	background: var(--site-color-a1d799a);
}

.btn-cta svg {
	width: 20px;
	height: 20px;
	fill: #fff;
	flex-shrink: 0;
}


/* ---- Enlace con subrayado degradado ---- */
.link-gradient svg {
	width: 20px;
	height: 20px;
	vertical-align: middle;
}

@keyframes arrow-slide {
	0%, 100% { transform: translateX(0); }
	50%       { transform: translateX(5px); }
}

.link-gradient:hover svg {
	animation: arrow-slide 0.6s ease infinite;
}

.link-gradient {
	position: relative;
	display: inline-block;
	font-size: 20px;
	font-weight: 500;
	color: var(--site-color-primary);
	text-decoration: none;
	text-transform: none !important;
}

.link-general {
	font-size: inherit;
	font-weight: inherit;
	line-height: inherit;
	color: var(--site-color-primary);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.link-general:hover {
	opacity: 0.8;
}

/* ---- Ribbon "MÁS POPULAR" ---- */
.popular,
.ultimo {
	position: relative;
	overflow: hidden;
}


.popular::after {
	content: 'MÁS POPULAR';
	position: absolute;
	top: 30px;
	right: -45px;
	background: linear-gradient(90deg, #8F67FF, #1DC8AB);
	color: #fff;
	font-size: 12px;
	font-weight: 500;
	padding: 6px 44px;
	transform: rotate(45deg);
	letter-spacing: 0.5px;
	white-space: nowrap;
}

.badge {
	display: inline-block;
	background-color: var(--site-color-secondary);
	padding: 9px 10px;
	border-radius: 7px;
	font-size: 16px;
	color: var(--site-color-primary);
}

.link-gradient::after {
	content: '' !important;
	position: absolute !important;
	width: 100% !important;
	margin: 0px auto !important;
	height: 2px !important;
	background: linear-gradient(270deg, #8F67FF 1.05%, #1DC8AB 51.88%) !important;
	bottom: -6px !important;
	left: 0px !important;
	right: 0px !important;
	display: block !important;
	transition: all .3s linear !important;
}

/* ---- H4 ---- */
h4 {
	font-size: 26px;
	font-weight: 500;
}

/* ---- Bajada ---- */
.bajada *,
.bajada {
	font-size: 20px !important;
	font-weight: 400 !important;
	line-height: 1.3em !important;
	letter-spacing: 0 !important;
	word-spacing: 0 !important;
}

/* ---- List ---- */
.list ul {
	list-style: none;
	padding: 0;
	margin: 0 0 20px;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.list li {
	display: block;
	font: 400 15px / 1.5 var(--font-raleway);
	color: var(--site-color-text);
}

.list ul li::before {
	content: "";
	display: inline-block;
	width: 12px;
	height: 12px;
	background-color: var(--site-color-a1d799a);
	border-radius: 50%;
	flex-shrink: 0;
}

/* ---- Error page (403, 404) ---- */
.error-page {
	padding: 100px 0;
	text-align: center;
}

.error-page__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 16px;
}

.error-page__code {
	font-size: 120px;
	font-weight: 500;
	line-height: 1;
	color: var(--site-color-dd5d35a);
	letter-spacing: -4px;
}

.error-page__title {
	font-size: 32px;
	font-weight: 600;
	color: var(--site-color-primary);
	margin: 0;
	max-width: 520px;
}

.error-page__actions {
	display: flex;
	gap: 16px;
	margin-top: 16px;
	flex-wrap: wrap;
	justify-content: center;
}

@media (max-width: 768px) {
	.error-page { padding: 60px 0; }
	.error-page__code { font-size: 80px; }
	.error-page__title { font-size: 24px; }
	.error-page__actions { flex-direction: column; align-items: center; }
}

/* ================================
   UTILIDADES — FONDOS
   ================================ */
.bg-blue_standar {
	position: relative;
	background: var(--site-color-primary);
	overflow: hidden;
}

.bg-blue_standar::before {
	content: '';
	position: absolute;
	inset: 0;
	background-image: url('../../img/core/pattern_corporativo.png');
	background-repeat: repeat;
	opacity: 0.04;
	pointer-events: none;
	z-index: 0;
}

/* ================================
   DARK MODE
   ================================ */
[data-theme="dark"] {
	color-scheme: dark;
	--site-color-primary:   #E8EEF7;
	--site-color-secondary: #0D1B2E;
	--site-color-text:      #B0BEC5;
	--site-color-4baa0cb:   #0D1B2E;
	--site-color-7560b43:   #111827;
	--site-color-93d65f3:   #1E2A3A;
	--site-color-dd5d35a:   #1A2436;
}

/* ================================
   LOGO
   ================================ */
.logo-dark { display: none; }
.logo-light { display: block; }

[data-theme="dark"] .logo-dark  { display: block; }
[data-theme="dark"] .logo-light { display: none; }

/* ================================
   CURSOR CUSTOM
   ================================ */
#cursorElement {
	position: fixed;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 25px;
	height: 25px;
	top: 0;
	left: 0;
	pointer-events: none;
	z-index: 99999;
	mix-blend-mode: exclusion;
}

#cursorElement::before {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	mix-blend-mode: exclusion;
	pointer-events: none;
	z-index: 99999;
	background: transparent;
	border: 1px solid #fff;
	opacity: 0.2;
	border-radius: 100%;
}

#cursorElement #cursor_arrow {
	opacity: 0;
	transition: .6s;
	transform: scale(0.3);
	pointer-events: none;
}

#cursorElement.showArrow {
	cursor: pointer;
	pointer-events: none;
}

#cursorElement.showArrow #cursor_arrow {
	opacity: 1;
	transform: scale(1);
	pointer-events: none;
	display: none;
}

/* ================================
   GRADIENT TEXT CLASSES
   ================================ */
@keyframes shine {
	to { background-position: 200%; }
}

@keyframes shine-y {
	to { background-position-y: 200%; }
}

.grd_general { color: var(--site-color-a1d799a); }

.grd_eventos,
.grd_gestion,
.grd_web {
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	background-size: 200% auto;
	animation: shine 3s linear infinite;
	-webkit-animation: shine 3s linear infinite;
}

.grd_eventos {
	background-image: linear-gradient(90deg, #9C89FD 20%, #7E5ED5 40%, #7E5ED5 60%, #9C89FD 80%);
}

.grd_gestion {
	background-image: linear-gradient(90deg, #FCB629 20%, #FDDA94 40%, #FDDA94 60%, #FCB629 80%);
}

.grd_web {
	background-image: linear-gradient(90deg, #8EE3D5 20%, #1DC8AB 40%, #1DC8AB 60%, #8EE3D5 80%);
}

/* ================================
   INNER CONTAINER
   ================================ */
.site-inner {
	max-width: 1120px;
	margin: 0 auto;
	padding: 0 30px !important;
}

@media (max-width: 1024px) {
	.site-inner { max-width: 920px !important; padding: 0 30px !important; }
}

@media (max-width: 768px) {
	.site-inner { max-width: 500px !important; padding: 0 30px !important; }
}

/* ================================
   SITE HEADER
   ================================ */
.site-header {
	position: sticky;
	top: 0;
	z-index: 9000;
	width: 100% !important;
	max-width: 100% !important;
	padding: 10px 0 !important;
	background: var(--site-color-7560b43);
	border-bottom: 1px solid var(--site-color-debac6c);
	transition: box-shadow 0.3s ease;
}

.site-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	max-width: 1140px;
	margin: 0 auto;
	padding: 0 30px;
}

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

.site-header__logo img {
	height: 72px;
	width: auto;
}

/* ---- Nav desktop ---- */
.site-footer #menu-principal-es-1,
.site-footer .sub-menu {
	list-style-type: none;
}

.site-header__nav .menu {
	display: flex;
	list-style: none;
	margin: 0;
	padding: 0;
	gap: 26px;
	align-items: center;
}

.site-header__nav .menu li a {
	font-family: var(--site-typography-primary-font-family), Sans-serif;
	font-size: 18px;
	font-weight: 400;
	color: var(--site-color-text);
	text-decoration: none;
	padding: 0 0 3px 0;
	border-bottom: 2px solid transparent;
	transition: color 0.2s, border-color 0.2s;
	white-space: nowrap;
	display: inline-block;
}

.site-header__nav .menu li a:hover {
	color: var(--site-color-a1d799a);
}

.site-header__nav .menu li.current-menu-item > a,
.site-header__nav .menu li.current-menu-ancestor > a {
	color: var(--site-color-a1d799a);
	border-bottom-color: var(--site-color-a1d799a);
}

/* ---- Dark mode toggle ---- */
.site-header__darkmode {
	display: flex !important;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	background: transparent;
	border: none;
	border-radius: 50%;
	box-shadow: none;
	outline: none;
	color: var(--site-color-text);
	flex-shrink: 0;
	transition: color 0.2s, background 0.2s;
}

.site-header__darkmode:hover {
	background: var(--site-color-93d65f3) !important;
}

.site-header__darkmode svg {
	stroke: var(--site-color-text) !important;
	flex-shrink: 0;
}

.site-header__darkmode .icon-moon { display: none !important; }
.site-header__darkmode .icon-sun  { display: block !important; }

[data-theme="dark"] .site-header__darkmode .icon-moon { display: block !important; }
[data-theme="dark"] .site-header__darkmode .icon-sun  { display: none !important; }

/* ---- Hamburger ---- */
.site-header__hamburger {
	display: none;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 5px;
	width: 40px;
	height: 40px;
	background: var(--site-color-a1d799a);
	border: none;
	border-radius: 4px;
	padding: 8px;
	flex-shrink: 0;
}

.site-header__hamburger span {
	display: block !important;
	width: 24px;
	height: 2px;
	background: var(--site-color-4baa0cb) !important;
	border-radius: 2px;
	transition: transform 0.3s ease, opacity 0.3s ease;
	transform-origin: center;
}

.site-header__hamburger.is-active span:nth-child(1) {
	transform: translateY(7px) rotate(45deg);
}
.site-header__hamburger.is-active span:nth-child(2) {
	opacity: 0;
}
.site-header__hamburger.is-active span:nth-child(3) {
	transform: translateY(-7px) rotate(-45deg);
}

/* ---- Submenú desktop ---- */
.site-header__nav .menu li {
	position: relative;
}

.site-header__nav .menu .sub-menu {
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 200px;
	background: var(--site-color-7560b43);
	border: 1px solid var(--site-color-debac6c);
	border-radius: 10px;
	padding: 8px;
	list-style: none;
	margin: 0;
	box-shadow: 0 8px 24px rgba(5, 28, 60, 0.10);
	z-index: 9100;
}

.site-header__nav .menu li:hover > .sub-menu {
	display: block;
}

.site-header__nav .menu .sub-menu li {
	width: 100%;
	border-bottom: none;
}

.site-header__nav .menu .sub-menu li a {
	display: block;
	padding: 9px 14px;
	font-size: 16px;
	border-radius: 6px;
	border-bottom: none;
	color: var(--site-color-text);
	white-space: nowrap;
	transition: background var(--site-transition), color var(--site-transition);
}

.site-header__nav .menu .sub-menu li a:hover {
	background: var(--site-color-dd5d35a);
	color: var(--site-color-a1d799a);
}

.site-header__nav .menu .sub-menu li.current-menu-item > a {
	color: var(--site-color-a1d799a);
	border-bottom: none;
}

[data-theme="dark"] .site-header__nav .menu .sub-menu {
	background: var(--site-color-secondary);
	border-color: #ffffff15;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.30);
}

/* ---- Header mobile ---- */
@media (max-width: 1024px) {
	.site-header__inner {
		padding: 0 24px;
	}

	.site-header__darkmode {
		margin-left: auto;
		margin-right: 8px;
	}

	.site-header__hamburger {
		display: flex;
	}

	.site-header__nav {
		position: fixed;
		inset: 80px 0 0 0;
		background: var(--site-color-7560b43);
		padding: 40px 24px;
		transform: translateX(100%);
		transition: transform 0.35s ease;
		overflow-y: auto;
		z-index: 8999;
	}

	.site-header__nav.is-open {
		transform: translateX(0);
	}

	.site-header__nav .menu {
		flex-direction: column;
		align-items: flex-start;
		gap: 0;
	}

	.site-header__nav .menu li {
		width: 100%;
		border-bottom: 1px solid var(--site-color-93d65f3);
	}

	.site-header__nav .menu li a {
		display: block;
		padding: 16px 0;
		font-size: 18px;
		border-bottom: none;
	}

	.site-header__nav .menu li.current-menu-item > a {
		color: var(--site-color-a1d799a);
		border-bottom: none;
	}

	/* Submenú mobile — inline, sin posición absoluta */
	.site-header__nav .menu .sub-menu {
		display: block;
		position: static;
		box-shadow: none;
		border: none;
		border-radius: 0;
		padding: 0 0 0 16px;
		background: transparent;
		min-width: 0;
	}

	.site-header__nav .menu .sub-menu li {
		border-bottom: 1px solid var(--site-color-93d65f3);
	}

	.site-header__nav .menu .sub-menu li a {
		padding: 12px 0;
		border-radius: 0;
		font-size: 16px;
	}
}

@media (max-width: 768px) {
	.site-header__logo img {
		height: 62px;
	}
}

/* ================================
   SITE FOOTER
   ================================ */
.site-footer {
	width: 100%;
	background: #DFE8F5;
	font-size: 18px;
}

.site-footer a {
	text-decoration: none;
}

.site-footer__inner {
	display: flex;
	max-width: 1140px;
	margin: 0 auto;
	padding: 0 30px;
}

.site-footer__upper {
	padding: 134px 0 64px 0;
}

.site-footer__upper .site-footer__inner {
	gap: 48px;
	align-items: flex-start;
}

.site-footer__col {
	flex: 1;
}

.site-footer__links {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	flex: 1.4;
}

.site-footer__heading {
	font-family: var(--site-typography-primary-font-family), sans-serif;
	font-size: 18px;
	font-weight: 500;
	color: var(--site-color-primary);
	margin-bottom: 20px;
}

.site-footer__about p {
	line-height: 1.7;
	color: var(--site-color-text);
	margin-bottom: 12px;
}

.site-footer__legal-link {
	display: inline-block;
	margin-top: 8px;
	color: var(--site-color-text);
	text-decoration: underline;
	transition: color var(--site-transition);
}

.site-footer__legal-link:hover {
	color: var(--site-color-a1d799a);
}

.site-footer__legal-menu {
	list-style: none;
	padding: 0;
	margin: 8px 0 0;
	display: flex;
	flex-wrap: wrap;
	gap: 4px 16px;
}

.site-footer__legal-menu li a {
	color: var(--site-color-text);
	font-size: 14px;
	text-decoration: underline;
	transition: color var(--site-transition);
}

.site-footer__legal-menu li a:hover {
	color: var(--site-color-a1d799a);
}

.site-footer__menu {
	display: flex;
	flex-direction: column;
	gap: 0;
	font-size: 20px;
	align-items: flex-start;
	list-style: none;
	padding: 0;
	margin: 0;
}

.site-footer__menu > li > a {
	display: block;
	padding: 6px 0;
	text-align: left;
	font-family: var(--site-typography-primary-font-family), sans-serif;
	font-size: 18px;
	font-weight: 400;
	color: var(--site-color-primary);
	transition: color var(--site-transition);
}

.site-footer__menu li a:hover,
.site-footer__menu li.current-menu-item > a {
	color: var(--site-color-7932011);
}

.site-footer__menu .sub-menu {
	list-style: none;
	padding: 0;
	margin: 0;
	width: 100%;
}

.site-footer__menu .sub-menu li a {
	display: block;
	padding: 8px 0 8px 16px;
	font-size: 16px;
	font-weight: 400;
	color: var(--site-color-text);
	border-top: 1px solid var(--site-color-93d65f3);
	transition: color var(--site-transition);
}

.site-footer__contact-item {
	display: flex;
	align-items: center;
	gap: 8px;
	color: var(--site-color-text);
	margin-bottom: 12px;
	transition: color var(--site-transition);
}

.site-footer__contact-item:hover {
	color: var(--site-color-a1d799a);
}

.site-footer__contact-item svg {
	flex-shrink: 0;
	color: var(--site-color-a1d799a);
}

.site-footer__payment-label {
	color: var(--site-color-text);
	line-height: 1.5;
	margin: 20px 0 10px;
}

.site-footer__izipay {
	height: 48px !important;
	width: auto;
	margin-bottom: 16px;
}

.site-footer__libro {
	display: flex;
	flex-flow: column nowrap;
	align-items: center;
	gap: 12px;
	background: #051C3C08;
	border-radius: 8px;
	padding: 12px 16px;
	color: var(--site-color-text);
	font-weight: 500;
}

.site-footer__libro img {
	width: 116px;
	height: auto;
}

.site-footer__social-bar {
	border-top: 1px solid var(--site-color-debac6c);
	padding: 40px 0;
}

.site-footer__social-bar .site-footer__inner {
	align-items: center;
	justify-content: center;
}

.site-footer__social-group {
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 16px;
}

.site-footer__social-group img {
	height: 68px;
	width: auto;
}

.site-footer__handle {
	font-family: var(--site-typography-primary-font-family), sans-serif;
	font-weight: 500;
	transition: opacity var(--site-transition);
}

.site-footer__handle:hover {
	opacity: 0.8;
}

.site-footer__handle--purple { color: var(--site-color-a1d799a); }
.site-footer__handle--teal   { color: var(--site-color-7932011); }

.site-footer__social-icons {
	display: flex;
	gap: 12px;
}

.site-footer__social-icons a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	color: var(--site-color-4baa0cb);
	transition: opacity var(--site-transition), transform var(--site-transition);
}

.site-footer__social-icons a:hover {
	opacity: 0.85;
	transform: translateY(-2px);
}

.site-footer__social-icons--purple a { background: var(--site-color-a1d799a); }
.site-footer__social-icons--teal   a { background: var(--site-color-7932011); }

.site-footer__social-divider {
	width: 1px;
	height: 120px;
	background: var(--site-color-accent);
	opacity: 0.4;
	flex-shrink: 0;
	margin: 0 40px;
}

.site-footer__bottom {
	border-top: 1px solid var(--site-color-debac6c);
	padding: 20px 30px;
	text-align: center;
}

.site-footer__bottom p {
	font-size: 14px;
	color: var(--site-color-accent);
}

.site-footer__strip {
	width: 100%;
	height: 16px;
	background-repeat: repeat-x;
	background-size: 258px auto;
}

[data-theme="dark"] .site-footer {
	background: var(--site-color-7560b43);
}

[data-theme="dark"] .site-footer__libro {
	background: var(--site-color-93d65f3);
}

/* ---- Footer responsive ---- */
@media (max-width: 1024px) {
	.site-footer__inner {
		max-width: 920px;
	}

	.site-footer__upper .site-footer__inner {
		flex-wrap: wrap;
		gap: 36px;
	}

	.site-footer__links {
		display: none;
	}

	.site-footer__col {
		flex: 1 1 calc(50% - 18px);
	}

	.site-footer__social-divider {
		height: 80px;
		margin: 0 24px;
	}
}

@media (max-width: 768px) {
	.site-footer__inner {
		max-width: 500px;
	}

	.site-footer {
		text-align: center;
	}

	.site-footer__about p {
		font-size: 16px;
		text-align: center;
	}

	.site-footer__legal-link,
	.site-footer__contact-item,
	.site-footer__payment-label {
		text-align: center;
		justify-content: center;
	}

	.site-footer__social-group img {
		height: 50px;
	}

	.site-footer__upper {
		padding: 150px 0 40px 0;
	}

	.site-footer__upper .site-footer__inner {
		flex-direction: column;
		gap: 32px;
	}

	.site-footer__col {
		flex: 1 1 100%;
	}

	.site-footer__social-bar .site-footer__inner {
		flex-direction: column;
		gap: 36px;
	}

	.site-footer__social-divider {
		width: 80px;
		height: 1px;
		margin: 0;
	}
}

/* ================================
   HERO
   ================================ */
.fp-hero {
	overflow: hidden;
	position: relative;
}

.fp-hero::before {
	content: '';
	position: absolute;
	inset: 0;
	background-image: var(--fp-hero-blur);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain;
	opacity: 0.1;
	pointer-events: none;
	z-index: 0;
}

.fp-hero__inner {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	gap: 60px;
}

/* ---- Text col ---- */
.fp-hero__text {
	flex: 1.3;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	text-align: right;
}

.fp-hero__pretitle {
	font-size: 36px;
	font-weight: 500;
	color: var(--site-color-primary);
	line-height: 1em;
	margin-bottom: 4px;
}

.fp-hero__title {
	color: var(--site-color-primary);
	margin-bottom: 24px;
}

.fp-hero__gradient {
	animation: shine 3s linear infinite;
	background: linear-gradient(270deg, #1DC8AB 20%, #8F67FF 40%, #8F67FF 60%, #1DC8AB 80%);
	background-size: 200% auto;
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
}

.fp-hero__sub {
	margin-bottom: 36px;
	text-align: right;
}


/* ---- Image col ---- */
.fp-hero__image {
	flex: 1;
}

.fp-hero__image img {
	width: 100%;
	height: auto;
	display: block;
}

/* ================================
   WHY
   ================================ */
.fp-why {
	background: #fff;
}

[data-theme="dark"] .fp-why {
	background: var(--site-color-7560b43);
}

.fp-why__header {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 20px;
	margin-bottom: 60px;
}

.fp-why__title {
	line-height: 1.1em;
}

/* ---- Grid ---- */
.fp-why__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 110px;
}

.fp-why__card {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}

.fp-why__card-img {
	width: 100%;
	max-width: 250px;
	height: auto;
	display: block;
	border-radius: 12px;
	margin-bottom: 24px;
}

.fp-why__card-title {
	line-height: 1.2em;
	margin-bottom: 12px;
}

.fp-why__card p {
	font-size: 20px;
	color: var(--site-color-text);
	line-height: 1.5em;
	margin-bottom: 20px;
	flex: 1;
}


/* ================================
   RESPONSIVE
   ================================ */
@media (max-width: 1024px) {
	.fp-hero__pretitle {
		font-size: 22px;
	}

	.fp-hero__inner {
		gap: 40px;
	}

}

@media (max-width: 768px) {
	.fp-hero__inner {
		flex-direction: column;
		text-align: center;
	}

	.fp-hero__text {
		align-items: center;
		text-align: center;
	}

	.fp-hero__pretitle,
	.fp-hero__sub {
		text-align: center;
	}

	.fp-hero__pretitle {
		font-size: 28px;
	}

	.fp-hero__sub {
		max-width: 100%;
	}

	.fp-hero__image {
		width: 100%;
	}

	/* why mobile */
	.fp-why__header {
		margin-bottom: 40px;
	}

	.fp-why__grid {
		grid-template-columns: 1fr;
		gap: 48px;
	}
}

/* ================================
   DARK MODE
   ================================ */
[data-theme="dark"] .bg-blue_standar {
	background: var(--site-color-secondary);
}

[data-theme="dark"] .fp-stat {
	background: var(--site-color-secondary);
}


[data-theme="dark"] .fp-stat__pill {
	background: #000;
	box-shadow: 0px 4px 15px 0px rgb(42 23 97 / 20%);
}

/* ================================
   TESTIMONIOS
   ================================ */
.fp-testimonials {
	padding-bottom: 120px !important;
}

.fp-testimonials__inner {
	position: relative;
	z-index: 1;
}

.fp-testimonials__header {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 20px;
	margin-bottom: 60px;
}

.fp-testimonials__header h2 {
	color: #fff;
}

/* ---- Masonry grid ---- */
.fp-testimonials__grid {
	columns: 3;
	column-gap: 10px;
}

/* ---- Card ---- */
.fp-testimonials__card {
	padding: 15px !important;
	break-inside: avoid;
	page-break-inside: avoid;
	margin-bottom: 10px;
}

.fp-testimonials__quote {
	font-size: 16px;
	color: var(--site-color-primary);
	line-height: 1.6em;
	flex: 1;
}

/* ---- Author ---- */
.fp-testimonials__author {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding-top: 16px;
	border-top: 1px solid var(--site-color-debac6c);
}

.fp-testimonials__name {
	display: block;
	font-size: 13px;
	font-weight: 500;
	color: var(--site-color-7932011);
	text-transform: uppercase;
	letter-spacing: 0.5px;
	margin-bottom: 4px;
}

.fp-testimonials__company {
	display: block;
	font-size: 13px;
	color: var(--site-color-text);
}

/* ---- Avatar con borde degradado ---- */
.fp-testimonials__avatar {
	width: 56px;
	height: 56px;
	border-radius: 50%;
	padding: 2px;
	background: linear-gradient(270deg, #1DC8AB, #8F67FF);
	flex-shrink: 0;
}

.fp-testimonials__avatar img {
	width: 100%;
	height: 100%;
	border-radius: 50%;
	object-fit: cover;
	display: block;
}

/* ---- Responsive ---- */
@media (max-width: 1024px) {
	.fp-testimonials__grid {
		columns: 2;
	}
}

@media (max-width: 768px) {
	.fp-testimonials__grid {
		columns: 1;
	}

	.fp-testimonials__header {
		margin-bottom: 40px;
	}
}

/* ================================
   STAT FLOTANTE
   ================================ */
.fp-stat {
	background: var(--site-color-secondary);
	padding: 0 30px !important;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 0;
	overflow: inherit;
	z-index: 1;
	position: relative;
}

.fp-stat__pill {
	background: #fff;
	border-radius: 100px;
	padding: 20px 60px;
	display: flex;
	align-items: center;
	gap: 24px;
	max-width: 800px;
	box-shadow: 0px 4px 15px 0px rgba(113, 87, 186, 0.2);
}

.fp-stat__img {
	width: 72px;
	height: auto;
	flex-shrink: 0;
}

.fp-stat__number {
	font-size: 68px;
	font-weight: 500;
	color: var(--site-color-e1853bc);
	line-height: 1;
	flex-shrink: 0;
	letter-spacing: -2px;
}

.fp-stat__text {
	font-size: 27px;
	font-weight: 500;
	color: var(--site-color-primary);
	line-height: 1.2em;
	letter-spacing: -1px;
}

@media (max-width: 768px) {
	.fp-stat__pill {
		border-radius: 20px;
		padding: 24px;
		flex-wrap: wrap;
		justify-content: center;
		text-align: center;
		gap: 10px;
	}

	.fp-stat__img {
		width: 52px;
	}

	.fp-stat__number {
		font-size: 40px;
	}

	.fp-stat__text {
		font-size: 18px;
	}
}

/* ================================
   PORTFOLIO
   ================================ */
.fp-portfolio {
	background: #fff;
}

[data-theme="dark"] .fp-portfolio {
	background: var(--site-color-7560b43);
}

main.page-nosotros .fp-portfolio {
	background: transparent;
}

.fp-portfolio__header {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 20px;
	margin-bottom: 60px;
}

.fp-portfolio__flags {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
}

.fp-portfolio__flags img {
	width: 30px;
	height: 24px;
	object-fit: cover;
	border-radius: 4px;
	box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.09);
}

/* ---- Grid ---- */
.fp-portfolio__grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 24px;
}

.fp-portfolio__card {
	position: relative;
	overflow: hidden;
	border-radius: 16px;
	display: block;
	text-decoration: none;
	transition: transform 0.3s ease;
}

.fp-portfolio__card:hover {
	transform: scale(1.02);
}

.fp-portfolio__card-img {
	width: 100%;
	height: auto;
	display: block;
}

/* ---- Overlay hover ---- */
.fp-portfolio__overlay {
	position: absolute;
	bottom: 10px;
	left: 10px;
	right: inherit;
	background: rgba(5, 28, 60, 0.8);
	padding: 20px 24px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	transform: translateY(150%);
	transition: transform 0.35s ease;
	border-radius: 8px;
}

.fp-portfolio__card:hover .fp-portfolio__overlay {
	transform: translateY(0);
}

.fp-portfolio__overlay-type {
	font-size: 14px;
	color: rgba(255, 255, 255, 0.7);
	margin-bottom: 4px;
}

.fp-portfolio__overlay-name {
	font-size: 20px;
	font-weight: 500;
	color: #fff;
}

.fp-portfolio__overlay-arrow {
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.fp-portfolio__overlay-arrow svg {
	width: 28px;
	height: 28px;
}

.fp-portfolio__ribbon {
	position: absolute;
	bottom: 50%;
	left: 0;
	z-index: 1;
	pointer-events: none;
	width: 60px;
	transform: translateY(50%);
}

.fp-portfolio__card-flag {
	position: absolute;
	top: 16px;
	left: 16px;
	width: 30px;
	height: 24px;
	object-fit: cover;
	border-radius: 4px;
	box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.09);
}

/* ---- CTA ---- */
.fp-portfolio__cta {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 32px;
	margin-top: 48px;
}

/* ---- Responsive ---- */
@media (max-width: 768px) {
	.fp-portfolio__grid {
		grid-template-columns: 1fr;
	}

	.fp-portfolio__header {
		margin-bottom: 40px;
	}

	.fp-portfolio__cta {
		flex-direction: column;
		gap: 20px;
	}
}

/* ================================
   SERVICES
   ================================ */
.fp-services {
}

.fp-services__inner {
	position: relative;
	z-index: 1;
}

.fp-services__header {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 20px;
	margin-bottom: 60px;
}

.fp-services__header h2 {
	color: #fff;
}

/* ---- Grid ---- */
.fp-services__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}

.fp-services__card {
	padding: 32px 24px 28px;
	align-items: center;
	text-align: center;
	text-decoration: none;
	transition: transform 0.3s ease;
}

.fp-services__card:hover {
	transform: scale(1.05);
}


.fp-services__card-title {
	margin-bottom: 24px;
	line-height: 1.2em;
}

.fp-services__card-img {
	min-width: 100%;
	padding: 0;
	margin-bottom: 28px;
}

.fp-services__card-img img {
	height: auto;
	width: 100%;
	display: block;
}

/* ---- Responsive ---- */
@media (max-width: 1024px) {
	.fp-services__grid {
		gap: 16px;
	}
}

@media (max-width: 768px) {
	.fp-services__grid {
		grid-template-columns: 1fr;
		gap: 24px;
	}

	.fp-services__header {
		margin-bottom: 40px;
	}
}


/* ================================
   DISEÑO Y DESARROLLO WEB
   ================================ */

/* Badge en lugar de pretitle: necesita el mismo spacing */
.fp-hero__text .badge {
	margin-bottom: 4px;
}

/* ================================
   TIPOS DE PROYECTO
   ================================ */
.sw-types .site-inner {
	max-width: 1300px !important;
}

.sw-types__header {
	text-align: center;
	margin-bottom: 48px;
}

/* Contenedor con scroll horizontal cuando el abanico no entra.
   El padding lateral negativo deja que las cards rotadas y sus sombras
   no se recorten contra los bordes del scroller. */
.sw-types__scroller {
	overflow-x: auto;
	overflow-y: hidden;
	margin: 0 -30px;
	padding: 0 30px;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: thin;
	scrollbar-color: var(--site-color-549a7cc) transparent;
}
/* arrastre con el mouse (solo desktop/tablet) */
@media (min-width: 768px) {
	.sw-types__scroller {
		cursor: grab;
	}
	/* los botones conservan su cursor y su clic */
	.sw-types__scroller a {
		cursor: pointer;
	}
	.sw-types__scroller.is-dragging,
	.sw-types__scroller.is-dragging a {
		cursor: grabbing;
	}
	.sw-types__scroller.is-dragging {
		user-select: none;
		scroll-behavior: auto;
	}
	/* solo mientras se arrastra de verdad se desactiva el hover/enlace */
	.sw-types__scroller.is-dragging .sw-types__card {
		transition: none;
	}
	.sw-types__scroller.is-dragging a {
		pointer-events: none;
	}
}

.sw-types__scroller::-webkit-scrollbar {
	height: 6px;
}
.sw-types__scroller::-webkit-scrollbar-thumb {
	background: var(--site-color-549a7cc);
	border-radius: 3px;
}

/* Abanico: las cards se solapan y se inclinan alternadamente.
   Al pasar el mouse, la card se endereza y pasa por encima del resto. */
.sw-types__grid {
	display: flex;
	justify-content: center;
	align-items: flex-end;
	padding: 30px 0;
	min-width: max-content;
	margin: 0 auto;
}

.card-standar {
	background: #fff;
	border: 1px solid var(--site-color-debac6c);
	border-radius: 8px;
	padding: 32px 28px;
	display: flex;
	flex-direction: column;
	gap: 12px;
	position: relative;
	overflow: hidden;
}

.card-standar ol,
.card-standar ul {
	list-style: none;
}

.card-standar p,
.card-standar li {
	font-size: 18px;
	color: var(--site-color-text);
	line-height: 1.4em;
}

.sw-types__card {
	flex: 0 0 260px;
	border: 1px solid #e2e8f0;
	border-radius: 18px;
	padding: 28px 24px;
	box-shadow: 0 10px 15px #2549cc1a, 0 4px 6px #28335b1a;
	transform-origin: center bottom;
	transition: transform .25s ease, box-shadow .25s ease;
}

/* solape + inclinación en abanico */
.sw-types__card + .sw-types__card { margin-left: -20px; }
.sw-types__card:nth-child(1) { transform: rotate(-3.5deg) translateY(8px);  z-index: 1; }
.sw-types__card:nth-child(2) { transform: rotate(1.5deg)  translateY(-4px); z-index: 2; }
.sw-types__card:nth-child(3) { transform: rotate(-1.5deg) translateY(6px);  z-index: 3; }
.sw-types__card:nth-child(4) { transform: rotate(2.5deg)  translateY(-2px); z-index: 4; }
.sw-types__card:nth-child(5) { transform: rotate(-2.5deg) translateY(5px);  z-index: 5; }

/* al hover: derecha, elevada y por encima de todas.
   Solo en dispositivos con puntero real: en táctil el :hover se queda
   pegado tras el tap, sin importar el ancho de pantalla. */
@media (hover: hover) and (pointer: fine) {
	.sw-types__grid .sw-types__card:hover,
	.sw-types__grid .sw-types__card:focus-within {
		transform: rotate(0deg) translateY(-14px) scale(1.04);
		box-shadow: 0 22px 20px rgba(20, 30, 60, .20);
		z-index: 20;
	}
}

/* chip de categoría — el color lo define cada card con --c */
.sw-types__chip {
	align-self: flex-start;
	display: inline-block;
	padding: 6px 14px;
	border-radius: 999px;
	background: color-mix(in srgb, var(--c, var(--site-color-a1d799a)) 12%, transparent);
	color: color-mix(in srgb, var(--c, var(--site-color-a1d799a)) 78%, #000);
	font-size: 13px;
	font-weight: 500;
	line-height: 1.2;
}

.sw-types__card h3 {
	color: var(--site-color-primary);
	font-size: 22px;
	line-height: 1.2em;
}

.sw-types__card p {
	flex: 1;
}

/* el boton usa la clase global .btn-wsp; aqui solo se ajusta al ancho de la card */
.sw-types__card .btn-wsp {
	width: 100%;
	font-size: 16px;
	padding: 12px 20px;
}

/* ---- Responsive ---- */
/* Hasta tablet se mantiene el abanico y se navega con scroll horizontal;
   solo en móvil las cards se apilan una debajo de otra. */
@media (max-width: 1024px) {
	.sw-types__grid {
		justify-content: flex-start;
	}
}

@media (max-width: 767px) {
	.sw-types__scroller {
		overflow-x: visible;
		margin: 0;
		padding: 0;
	}
	.sw-types__grid {
		display: grid;
		grid-template-columns: 1fr;
		gap: 20px;
		padding: 0;
		min-width: 0;
	}
	.sw-types__card {
		flex: 1 1 auto;
		box-shadow: none;
	}
	.sw-types__card + .sw-types__card { margin-left: 0; }
	.sw-types__card:nth-child(1),
	.sw-types__card:nth-child(2),
	.sw-types__card:nth-child(3),
	.sw-types__card:nth-child(4),
	.sw-types__card:nth-child(5) {
		transform: none;
		z-index: auto;
	}
	/* refuerzo: aunque el equipo reporte puntero fino, en móvil no hay hover */
	.sw-types__grid .sw-types__card:hover,
	.sw-types__grid .sw-types__card:focus-within {
		transform: none;
		box-shadow: none;
		z-index: auto;
	}

	.sw-types__header {
		margin-bottom: 32px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.sw-types__card { transition: box-shadow .2s ease; }
}

/* ================================
   BENEFITS
   ================================ */
.sw-benefits {
	margin-top: 0;
	padding-top: 60px;
}

.sw-benefits__title {
	text-align: center;
	margin-bottom: 40px;
	color: var(--site-color-primary);
}

.sw-benefits__grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 16px;
	margin-bottom: 48px;
}

.sw-benefits__item {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	background: #fff;
	border: 1px solid var(--site-color-debac6c);
	border-radius: 12px;
	padding: 20px;
}

.sw-benefits__item p {
	margin: 0;
}

.sw-benefits__icon {
	display: flex;
	flex-shrink: 0;
	width: 24px;
	height: 24px;
	margin-top: 2px;
}

.sw-benefits__cta {
	display: flex;
	justify-content: center;
}

/* ---- Responsive ---- */
@media (max-width: 768px) {
	.sw-benefits {
		margin-top: 40px;
		padding-top: 40px;
	}

	.sw-benefits__grid {
		grid-template-columns: 1fr;
	}
}

/* ================================
   PAIN POINTS
   ================================ */
.sw-pain {
	background: var(--site-color-primary);
}

.sw-pain__inner {
	display: flex;
	align-items: center;
	gap: 80px;
}

.sw-pain__title {
	color: #fff;
	flex: 1;
	flex-shrink: 0;
	line-height: 1.15em;
}

.sw-pain__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 40px;
	flex: 2.5;
}

.sw-pain__icon {
	display: block;
	width: 56px;
	height: auto;
	margin-bottom: 16px;
}

.sw-pain__card h3 {
	color: #fff;
	font-size: 20px;
	line-height: 1.3em;
	margin-bottom: 12px;
}

.sw-pain__card p {
	color: rgba(255, 255, 255, 0.65);
	font-size: 16px;
	line-height: 1.6em;
}

/* ---- Responsive ---- */
@media (max-width: 1024px) {
	.sw-pain__inner {
		flex-direction: column;
		align-items: flex-start;
		gap: 40px;
	}

	.sw-pain__title {
		text-align: center;
		width: 100%;
	}

	.sw-pain__grid {
		width: 100%;
	}
}

@media (max-width: 768px) {
	.sw-pain__grid {
		grid-template-columns: 1fr;
		gap: 32px;
	}

	.sw-pain__card {
		display: flex;
		flex-direction: column;
		align-items: center;
		text-align: center;
	}
}

/* ================================
   PLANES DE GESTIÓN
   ================================ */
.sw-plans__header {
	text-align: center;
	margin-bottom: 60px;
}

.sw-plans__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
	align-items: start;
	margin-bottom: 60px;
}

.sw-plans__renewal {
	font-size: 14px;
	color: var(--site-color-accent);
	margin: 0;
}

.sw-plans__name {
	font-size: 24px;
	font-weight: 500;
	color: var(--site-color-primary);
	line-height: 1.2em;
	margin: 0;
}

.sw-plans__hours {
	font-size: 16px;
	font-weight: 500;
	color: var(--site-color-primary);
	margin: 4px 0 8px;
}

.sw-plans__hours span {
	color: var(--site-color-e1853bc);
}

.sw-plans__list {
	list-style-type: none;
	padding: 0;
	margin: 0 0 20px;
	display: flex;
	flex-direction: column;
	gap: 10px;
	flex: 1;
}


.sw-plans__btn {
	display: block;
	text-align: center;
	background: var(--site-color-ea5641a);
	color: #fff;
	padding: 14px 20px;
	border-radius: 8px;
	text-decoration: none;
	font-size: 16px;
	font-weight: 500;
	transition: opacity var(--site-transition);
	margin-top: auto;
}

.sw-plans__btn:hover {
	opacity: 0.88;
}

.sw-plans__cta-wrap {
	display: flex;
	justify-content: center;
	margin-top: 40px;
}

.sw-plans__btn--cta {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	width: fit-content;
	margin-top: 0;
}

/* ---- Responsive ---- */
@media (max-width: 1024px) {
	.sw-plans__grid {
		grid-template-columns: 1fr;
		max-width: 480px;
		margin: 0 auto;
	}
}

@media (max-width: 768px) {
	.sw-plans__header {
		margin-bottom: 40px;
	}
}

/* ================================================
   NOSOTROS - HERO
   ================================================ */
.ns-hero {
	text-align: center;
	position: relative;
	overflow: hidden;
}

.ns-hero::before {
	content: '';
	position: absolute;
	inset: 0;
	background-image: var(--fp-hero-blur);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain;
	opacity: 0.1;
	pointer-events: none;
}

.ns-hero__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.ns-hero__title {
	line-height: 1.1em;
	color: var(--site-color-primary);
	margin-bottom: 24px;
}

.ns-hero__sub {
	max-width: 480px;
	text-align: center;
}

@media (max-width: 768px) {
	/* ns-hero__title hereda responsive del h1 global */
}

/* ================================================
   NOSOTROS - TIMELINE
   ================================================ */
.ns-timeline {
	background: #fff;
}

.ns-timeline__header {
	text-align: center;
	margin-bottom: 64px;
}

.ns-timeline__header h2 {
	margin-bottom: 16px;
}

.ns-timeline__header p {
	max-width: 560px;
	margin: 0 auto;
}

.ns-timeline__track {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 40px;
}

.ns-timeline__track::before {
	content: '';
	position: absolute;
	left: 50%;
	top: 0;
	bottom: 0;
	width: 1px;
	background: var(--site-color-dd5d35a);
	transform: translateX(-50%);
	z-index: 0;
}

.ns-timeline__item {
	display: grid;
	grid-template-columns: 1fr 80px 1fr;
	align-items: start;
	position: relative;
	z-index: 1;
}

.ns-timeline__center {
	display: flex;
	justify-content: center;
	padding-top: 28px;
}

.ns-timeline__dot {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	border: 5px solid transparent;
	background-image: linear-gradient(#fff, #fff), linear-gradient(270deg, #1DC8AB, #8F67FF);
	background-origin: border-box;
	background-clip: padding-box, border-box;
	flex-shrink: 0;
}

.ns-timeline__card {
	border-radius: 12px;
	padding: 28px;
	padding-right: 110px;
	position: relative;
	overflow: hidden;
	background: #f9f9ff;
}

.ns-timeline__item--right .ns-timeline__card {
	padding-right: 28px;
	padding-left: 110px;
}

.ns-timeline__year {
	display: block;
	color: var(--site-color-908e84f);
	font-size: 15px;
	margin-bottom: 8px;
}

.ns-timeline__card-title {
	color: var(--site-color-primary);
	margin-bottom: 12px;
}

.ns-timeline__card p {
	font-size: 16px;
	line-height: 1.6em;
	color: var(--site-color-text);
}

.ns-timeline__card::after {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	width: 50px;
	height: 100%;
	background-image: var(--ns-pattern);
	background-repeat: repeat;
	background-size: 50px;
	pointer-events: none;
}

.ns-timeline__item--right .ns-timeline__card::after {
	right: auto;
	left: 0;
}

.ns-timeline__spacer {
	/* placeholder vacío */
}

/* ================================================
   NOSOTROS - EQUIPO
   ================================================ */
.ns-team {
	text-align: center;
	padding-bottom: 40px;
}

.ns-team__connector {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.ns-team__line {
	width: 1px;
	height: 48px;
	background: var(--site-color-dd5d35a);
}

.ns-team__title {
	margin: 48px 0 40px;
}

.ns-team__grid {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 32px 24px;
}

.ns-team__member {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
	width: 140px;
}

.ns-team__avatar {
	width: 140px;
	height: 140px;
	border-radius: 50%;
	border: 3px solid transparent;
	background-image: linear-gradient(#fff, #fff), linear-gradient(135deg, #1DC8AB, #8F67FF);
	background-origin: border-box;
	background-clip: padding-box, border-box;
	overflow: hidden;
	flex-shrink: 0;
}

.ns-team__avatar img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.ns-team__role {
	font-size: 15px;
	color: var(--site-color-text);
	text-align: center;
	line-height: 1.4em;
}

/* ================================================
   NOSOTROS - STATS
   ================================================ */
.ns-stats {
	text-align: center;
	padding: 60px 0 0;
}

.ns-stats__title {
	margin-bottom: 48px;
}

.ns-stats__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 40px;
}

.ns-stats__number {
	display: block;
	font-size: 76px;
	font-weight: 500;
	color: var(--site-color-7932011);
	line-height: 1em;
	margin-bottom: 12px;
}

.ns-stats__desc {
	font-size: 20px;
	color: var(--site-color-text);
	line-height: 1.4em;
}

@media (max-width: 768px) {
	.ns-stats__grid {
		grid-template-columns: 1fr;
		gap: 32px;
	}

	.ns-stats__number {
		font-size: 48px;
	}
}

@media (max-width: 768px) {
	.ns-timeline__track {
		gap: 24px;
	}

	.ns-timeline__track::before {
		display: none;
	}

	.ns-timeline__item {
		grid-template-columns: 1fr;
	}

	.ns-timeline__center {
		display: none;
	}

	.ns-timeline__spacer {
		display: none;
	}

	.ns-timeline__card,
	.ns-timeline__item--right .ns-timeline__card {
		padding: 24px;
		padding-right: 70px;
	}

	.ns-timeline__item--right .ns-timeline__card::after {
		right: 0;
		left: auto;
	}

	.ns-timeline__card::after {
		width: 24px;
		background-size: 32px;
	}
}

/* ================================================
   BLOG
   ================================================ */
.bl-hero__inner {
	display: flex;
	align-items: center;
	gap: 28px;
}

.bl-hero__title {
	font-size: 80px;
	line-height: 1em;
	flex-shrink: 0;
}

.bl-hero__sub {
	font-size: 18px;
	color: var(--site-color-text);
}

/* Categorías */
.bl-categories {
	background: #fff;
}

.bl-cat {
	margin-bottom: 60px;
}

.bl-cat__header {
	display: flex;
	align-items: center;
	gap: 16px;
	border-bottom: 2px solid var(--site-color-908e84f);
	padding-bottom: 12px;
	margin-bottom: 28px;
}

.bl-cat__name {
	font-size: 24px;
	color: var(--site-color-908e84f);
	flex-shrink: 0;
	margin: 0;
}

.bl-cat__link {
	margin-left: auto;
	font-size: 13px;
	color: var(--site-color-908e84f);
	text-decoration: none;
	letter-spacing: 0.06em;
	flex-shrink: 0;
	transition: opacity var(--site-transition);
}

.bl-cat__link:hover {
	opacity: 0.7;
}

/* Grid de posts */
.bl-cat__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 28px;
}

.bl-card__img-wrap {
	display: block;
	border-radius: 8px;
	overflow: hidden;
	margin-bottom: 16px;
	aspect-ratio: 4 / 3;
}

.bl-card__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform var(--site-transition);
}

.bl-card__img--placeholder {
	width: 100%;
	height: 100%;
	background: var(--site-color-dd5d35a);
}

.bl-card__img-wrap:hover .bl-card__img {
	transform: scale(1.04);
}

.bl-card__body {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.bl-card__title {
	font-size: 20px;
	line-height: 1.3em;
	margin: 0;
}

.bl-card__title a {
	color: var(--site-color-primary);
	text-decoration: none;
}

.bl-card__title a:hover {
	color: var(--site-color-908e84f);
}

.bl-card__excerpt {
	font-size: 16px;
	line-height: 1.5em;
	color: var(--site-color-text);
	margin: 0;
}

.bl-card__meta {
	font-size: 14px;
	color: var(--site-color-text);
	opacity: 0.6;
	margin: 0;
}

.bl-card__sep {
	margin: 0 6px;
}

/* Responsive */
@media (max-width: 1024px) {
	.bl-cat__grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

/* ================================================
   CATEGORY ARCHIVE
   ================================================ */
.cat-hero {
	text-align: center;
}

.cat-hero__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 16px;
}

.cat-hero__title {
	font-size: 64px;
	color: var(--site-color-7932011);
	line-height: 1.1em;
	margin: 0;
}

.cat-hero__back {
	font-size: 14px;
	color: var(--site-color-primary);
	text-decoration: underline;
	text-underline-offset: 4px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.cat-filter-wrap {
	border-top: 1px dashed var(--site-color-debac6c);
	border-bottom: 1px dashed var(--site-color-debac6c);
	padding: 16px 0;
}

.cat-filter {
	display: flex;
	align-items: center;
	gap: 16px;
	flex-wrap: wrap;
}

.cat-filter__label {
	font-size: 14px;
	color: var(--site-color-primary);
	flex-shrink: 0;
}

.cat-filter__links {
	display: flex;
	align-items: center;
	gap: 20px;
	flex-wrap: wrap;
}

.cat-filter__link {
	font-size: 15px;
	color: var(--site-color-7932011);
	text-decoration: none;
	transition: opacity var(--site-transition);
}

.cat-filter__link:hover,
.cat-filter__link.active {
	opacity: 0.7;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.cat-posts {
	background: #fff;
}

.cat-pagination {
	margin-top: 48px;
	display: flex;
	justify-content: center;
}

@media (max-width: 768px) {
	.cat-hero__title {
		font-size: 40px;
	}
}

@media (max-width: 768px) {
	.bl-hero__title {
		font-size: 52px;
	}

	.bl-cat__grid {
		grid-template-columns: 1fr;
	}
}

/* ================================================
   DARK MODE  (activado por JS: data-theme="dark" en <body>)
   ================================================ */

/* ---- Fondos de sección ---- */
[data-theme="dark"] .bl-categories,
[data-theme="dark"] .ns-timeline,
[data-theme="dark"] .cat-posts {
	background: #0e131e;
}

[data-theme="dark"] .sw-pain {
	background: #0d1b2e;
}

/* ---- Fondos de cards / items ---- */
[data-theme="dark"] .sw-benefits__item,
[data-theme="dark"] .card-standar,
[data-theme="dark"] .fp-services__card,
[data-theme="dark"] .ns-timeline__card {
	background: #000000b5;
}

/* ---- Punto de timeline (color interior adapta al fondo) ---- */
[data-theme="dark"] .ns-timeline__dot {
	background-image: linear-gradient(#0e131e, #0e131e), linear-gradient(270deg, #1DC8AB, #8F67FF);
}

/* ---- Líneas verticales ---- */
[data-theme="dark"] .ns-timeline__track::before,
[data-theme="dark"] .ns-team__line {
	background: #ffffff47;
}

/* ================================================
   SINGLE POST
   ================================================ */
.sp-hero {
	overflow: hidden;
}

.sp-hero__inner,
.sp-content__inner {
	max-width: 1000px;
	margin: 0 auto;
	padding: 0 30px;
}

.sp-hero__inner {
	max-width: 1100px;
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.sp-breadcrumb {
	display: flex;
	align-items: center;
	gap: 8px;
}

.sp-breadcrumb .badge {
	text-decoration: none;
	transition: opacity var(--site-transition);
}

.sp-breadcrumb .badge:hover {
	opacity: 0.75;
}

.sp-hero__title {
	line-height: 1.1em;
	margin: 0;
}

@media (min-width: 769px) {
	.head-title_h1B {
		font-size: 56px;
	}
}

.sp-hero__divider {
	border: none;
	border-top: 1px solid var(--site-color-debac6c);
	margin: 32px 0 0;
}

.sp-content {
	padding: 48px 0 80px;
	overflow: hidden;
}

/* sp-hero__title hereda responsive del h1 global */

/* ---- Contenido del post ---- */
.sp-content__inner p {
	margin-bottom: 15px;
	line-height: 1.6em;
}

/* ---- Listas del contenido ---- */
.sp-content__inner ul,
.sp-content__inner ol {
	margin: 0 0 20px;
	padding-left: 26px;
}

.sp-content__inner li {
	position: relative;
	margin-bottom: 10px;
	/* mismo tamano y alto de linea que los parrafos del contenido */
	font-size: 18px;
	line-height: 1.6em;
}

.sp-content__inner li:last-child {
	margin-bottom: 0;
}

/* Listas anidadas */
.sp-content__inner li > ul,
.sp-content__inner li > ol {
	margin: 10px 0 0;
}

/* Viñeta cuadrada morada, alineada con la primera línea del texto */
.sp-content__inner ul {
	list-style: none;
}

.sp-content__inner ul > li::before {
	content: '';
	position: absolute;
	left: -26px;
	/* centra el cuadrito respecto a la altura de la primera línea */
	top: calc((1.6em - 10px) / 2);
	width: 10px;
	height: 10px;
	background: var(--site-color-a1d799a);
}

/* Numeradas: mantiene el número, en morado */
.sp-content__inner ol {
	list-style: decimal;
}

.sp-content__inner ol > li::marker {
	color: var(--site-color-a1d799a);
	font-weight: 500;
}

.sp-content__inner h1{
	margin-bottom: 8px;
	margin-top: 32px;
}

.sp-content__inner h2 {
	font-family: var(--site-typography-primary-font-family), sans-serif;
	font-size: 26px;
	letter-spacing: 0;
	margin: 45px 0 20px;
}

.sp-content__inner h3,
.sp-content__inner h4 {
	font-family: var(--site-typography-primary-font-family), sans-serif;
	letter-spacing: 0;
	color: var(--site-color-text);
	margin: 35px 0 20px;
}

.sp-content__inner h3 { font-size: 22px; }
.sp-content__inner h4 { font-size: 18px; }

.sp-content__inner a {
	color: var(--site-color-a1d799a);
	font-size: inherit;
	text-decoration: underline;
}

.sp-content__inner strong,
.sp-content__inner b {
	font-weight: 500;
}

.sp-content__inner em {
	background: #fff490;
	font-style: normal;
	text-decoration: inherit;
}

.sp-content__inner img,
.sp-content__inner video {
	border-radius: 6px;
	box-shadow: 0 0 6px rgba(19, 48, 106, 0.1);
	background: #fff;
	border: 4px solid #fff;
	display: block;
	margin: 10px auto;
	max-width: 100%;
}

.sp-content__inner img.emoji {
	background: transparent;
	border: none;
	padding: 2px;
	margin: auto;
	position: relative;
	top: 4px;
	width: 35px;
	height: auto;
	box-shadow: none;
}

.sp-content__inner figcaption {
	color: var(--site-color-text);
	font-size: 14px;
	font-style: italic;
	font-weight: 300;
	line-height: 1.4;
	margin: 2px auto;
	text-align: center;
	display: block;
}

.sp-content__inner figure.wp-caption.alignright { margin: 0 0 0 20px; }
.sp-content__inner figure.wp-caption.alignleft  { margin: 0 20px 0 0; }

.sp-content__inner blockquote {
	border-radius: 8px;
	border: 1px solid #A370F7;
	padding: 16px;
	margin: 10px 0;
	width: 100%;
	background: #EBE5FC;
	font-family: var(--site-typography-primary-font-family), sans-serif;
	font-size: 18px;
	color: #290661;
}

[data-theme="dark"] .sp-content__inner em {
	background: #edff0038;
}

[data-theme="dark"] .sp-content__inner blockquote {
	background: #281f45;
}

/* ---- Post-it / insight ---- */
.sp-content__inner .insight_blog {
	display: inline-block;
	vertical-align: top;
	text-align: center;
	width: 300px;
	position: relative;
	background: #dfd6ff;
	overflow: hidden;
	margin: 20px;
	padding: 20px 20px 30px;
	border-radius: 0 0 0 30px / 45px;
	box-shadow:
		inset 0 -40px 40px rgba(0,0,0,0.04),
		inset 0  25px 10px rgba(0,0,0,0.04),
		0 5px 6px 5px rgba(0,0,0,0.04);
}

.sp-content__inner .insight_blog::before {
	content: '';
	display: block;
	position: absolute;
	width: 20px;
	height: 25px;
	background: #dfd6ff;
	box-shadow: 3px -2px 10px rgba(0,0,0,0.2), inset 15px -15px 15px rgba(0,0,0,0.2);
	left: 0;
	bottom: 0;
	z-index: 2;
	transform: skewX(25deg);
}

/* ---- Utilidades ---- */
.hide { display: none !important; }

.sp-content__inner .img-only-mobile { display: none; }

@media (max-width: 768px) {
	.sp-content__inner .img-only-desktop { display: none; }
	.sp-content__inner .img-only-mobile  { display: block; }

	.sp-content__inner figure {
		padding: 0;
		display: block;
		float: none;
		width: 100%;
	}

	.sp-content__inner figure.wp-caption.alignright,
	.sp-content__inner figure.wp-caption.alignleft {
		margin: 0 auto;
	}
}

/* ================================================
   RELACIONADOS (grid de productos — sección universal)
   ================================================ */
.p3d-relacionados {
	border-top: 1px solid var(--site-color-debac6c);
	padding-top: 40px !important;
	padding-bottom: 80px !important;
}

.p3d-relacionados__header h4 {
	font-size: 22px;
	color: var(--site-color-primary);
	margin: 0 0 28px;
}

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

.p3d-rel-card {
	display: flex;
	flex-direction: column;
}

.p3d-rel-card__img {
	display: block;
	background: #FDEAE2;
	border-radius: 12px;
	overflow: hidden;
	aspect-ratio: 1 / 1;
	margin-bottom: 12px;
	transition: transform var(--site-transition);
}

.p3d-rel-card__img:hover {
	transform: scale(1.02);
}

.p3d-rel-card__img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	padding: 0;
}

.p3d-rel-card__title {
	font-size: 15px;
	font-weight: 500;
	color: var(--site-color-primary);
	text-decoration: none;
	line-height: 1.3em;
	transition: color var(--site-transition);
	display: block;
	margin-bottom: 4px;
}

.p3d-rel-card__title:hover {
	color: var(--site-color-a1d799a);
}

.p3d-rel-card__excerpt {
	font-size: 13px;
	color: var(--site-color-text);
	margin: 0 0 6px;
	line-height: 1.4em;
}

.p3d-rel-card__precio {
	display: flex;
	align-items: center;
	gap: 6px;
	flex-wrap: wrap;
}

.p3d-rel-card__precio-sale .woocommerce-Price-amount {
	font-size: 16px;
	font-weight: 600;
	color: var(--site-color-primary);
}

.p3d-rel-card__precio-tachado .woocommerce-Price-amount {
	font-size: 13px;
	color: var(--site-color-text);
	text-decoration: line-through;
	opacity: 0.5;
}

.p3d-rel-card__precio-actual .woocommerce-Price-amount {
	font-size: 16px;
	font-weight: 600;
	color: var(--site-color-primary);
}

@media (max-width: 1024px) {
	.p3d-relacionados__grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 768px) {
	.p3d-relacionados__grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 16px;
	}
}

@media (max-width: 480px) {
	.p3d-relacionados__grid {
		grid-template-columns: 1fr 1fr;
		gap: 12px;
	}
}

/* ================================================
   MAPA DE SITIO
   ================================================ */
.sitemap-hero {
	padding: 60px 0 80px;
}

.sitemap-title {
	font-size: clamp(2rem, 5vw, 3rem);
	margin-bottom: 12px;
}

.sitemap-desc {
	margin-bottom: 48px;
	max-width: 560px;
}

.sitemap-nav {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: 40px 48px;
}

.sitemap-section__title {
	font-family: var(--site-typography-primary-font-family), sans-serif;
	font-size: 18px;
	font-weight: 600;
	margin-bottom: 10px;
	color: var(--site-color-a1d799a);
}

.sitemap-section__title a {
	color: var(--site-color-primary);
	transition: color var(--site-transition);
}

.sitemap-section__title a:hover {
	color: var(--site-color-7932011);
}

.sitemap-section__list {
	list-style: none;
	padding: 0;
	margin: 0;
	border-top: 1px solid var(--site-color-93d65f3);
}

.sitemap-section__list li {
	border-bottom: 1px solid var(--site-color-93d65f3);
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
}

.sitemap-section__list li a {
	display: block;
	padding: 7px 0;
	font-size: 15px;
	color: var(--site-color-text);
	transition: color var(--site-transition);
}

.sitemap-section__list li a:hover {
	color: var(--site-color-7932011);
}

.sitemap-date {
	font-size: 12px;
	color: var(--site-color-908e84f);
	white-space: nowrap;
	flex-shrink: 0;
}

/* ================================================
   PROMOS
   ================================================ */
.pm-hero {
	text-align: center;
	overflow: hidden;
}

.pm-hero__title {
	margin: 0 0 60px 0;
}

/* ---- Tabs nav ---- */
.pm-tabs .site-inner,
.page-promos .site-inner {
	max-width: 800px;
}

.pm-tabs__nav {
	display: flex;
	justify-content: center;
	gap: 32px;
	border-bottom: 1px solid var(--site-color-debac6c);
	margin-bottom: 32px;
}

.pm-tabs__btn {
	background: none;
	border: none;
	border-bottom: 2px solid transparent;
	padding: 10px 0;
	margin-bottom: -1px;
	font-size: 18px;
	font-weight: 500;
	color: var(--site-color-primary);
	cursor: pointer;
	transition: color var(--site-transition), border-color var(--site-transition);
	font-family: var(--site-typography-primary-font-family), sans-serif;
}

.pm-tabs__btn.is-active {
	color: var(--site-color-7932011);
	border-bottom-color: var(--site-color-7932011);
}

/* ---- Panels ---- */
.pm-tabs__panel {
	display: none;
}

.pm-tabs__panel.is-active {
	display: block;
}

/* ---- Lista de promos ---- */
.pm-list {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.pm-item {
	display: flex;
	align-items: center;
	gap: 20px;
	background: #fff;
	border: 1px solid var(--site-color-debac6c);
	border-radius: 8px;
	padding: 16px 20px;
	text-decoration: none;
	transition: box-shadow var(--site-transition);
	box-shadow: 0 2px 10px 0 rgba(66, 35, 187, .05);
}

.pm-item:hover {
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.07);
}

.pm-item:hover .pm-item__arrow svg {
	animation: arrow-slide 0.6s ease infinite;
}

.pm-item__img {
	width: 100%;
	max-width: 80px;
	border-radius: 8px;
	overflow: hidden;
	flex-shrink: 0;
	background: var(--site-color-dd5d35a);
	box-shadow: 0 0 10px 0 rgb(0 0 0 / .05);
}

.pm-item__img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.pm-item__img--placeholder {
	background: var(--site-color-dd5d35a);
}

.pm-item__body {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 4px;
	text-align: left;
}

.pm-item__title {
	font-weight: 500;
	color: var(--site-color-primary);
	margin: 0;
}

.page-legales .pm-item__title {
	font-weight: 400 !important;
}

.pm-item__vigencia {
	font-size: 14px;
	color: var(--site-color-accent);
	margin: 0;
}

.pm-item__arrow {
	color: var(--site-color-a1d799a);
	flex-shrink: 0;
	display: flex;
	align-items: center;
}

.pm-item__arrow svg {
	width: 30px;
	height: 30px;
}

.pm-empty {
	color: var(--site-color-accent);
}

/* ---- Dark mode ---- */
[data-theme="dark"] .pm-item {
	background: #000000b5;
}

@media (max-width: 768px) {
	/* pm-hero__title hereda responsive del h1 global */
	.pm-tabs__nav { gap: 20px; }
}

/* ================================================
   SINGLE PROMO
   ================================================ */
.spr-hero__body {
	display: flex;
	align-items: center;
	gap: 32px;
}

.spr-hero__img {
	flex-shrink: 0;
	width: 180px;
	height: 180px;
	border-radius: 12px;
	overflow: hidden;
	background: var(--site-color-dd5d35a);
	box-shadow: 0 4px 20px 0 rgb(0 0 0 / .08);
}

.spr-hero__img img {
	width: 100%;
	max-width: 200px;
	border-style: solid;
	border-width: 2px;
	border-color: var(--e-global-color-4baa0cb);
	border-radius: 16px;
	box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.05);
	display: block;
}

.spr-hero__meta {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.spr-hero__estado {
	font-size: 13px;
	font-weight: 400;
	letter-spacing: 0.04em;
	color: var(--site-color-accent);
	text-transform: uppercase;
	margin: 0;
}

.spr-hero__estado strong {
	font-weight: 500;
}

.spr-hero__meta .sp-hero__title {
	margin: 0;
}

.spr-hero__vigencia {
	font-size: 15px;
	color: var(--site-color-text);
	margin: 0;
}

@media (max-width: 600px) {
	.spr-hero__body {
		flex-direction: column;
		align-items: flex-start;
	}
	.spr-hero__img {
		width: 140px;
		height: 140px;
	}
}

/* ================================================
   LIST — bullets reemplazados por checkmark SVG
   ================================================ */
.list ul {
	list-style: none;
	padding-left: 0;
	margin: 0;
}

.list ul li {
	position: relative;
	padding: 4px 0 4px 28px;
}

/* Ítems de icono: por defecto el SVG se oculta y el label se muestra (footer, mobile, tablet) */
.menu-icon-svg { display: none !important; }
.menu-icon-label { display: inline; }

/* Solo en el header desktop se invierte */
@media (min-width: 1025px) {
	.site-header__nav .menu-icon-svg {
		display: inline-flex !important;
		align-items: center;
		width: 1.2em;
		height: 1.2em;
		vertical-align: middle;
		fill: currentColor;
		line-height: 1;
	}
	.site-header__nav .menu-icon-svg svg {
		width: 24px;
		height: 24px;
		display: block;
		fill: inherit;
	}
	.site-header__nav .menu-icon-label { display: none; }

	/* Separador vertical antes del icono */
	.site-header__nav .menu-carrito,
	.site-header__nav .menu-user {
		border-left: 1px solid #ccc;
		padding: 0 0 0 10px;
	}
}

.list ul li::before {
	content: '';
	position: absolute;
	top: 6px;
	left: 0;
	width: 18px;
	height: 18px;
	background: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='currentColor' aria-hidden='true'><path d='M14.72 8.79L10.43 13.09L8.78 11.44C8.69036 11.3353 8.58004 11.2503 8.45597 11.1903C8.33191 11.1303 8.19678 11.0965 8.05906 11.0912C7.92134 11.0859 7.78401 11.1091 7.65568 11.1594C7.52736 11.2096 7.41081 11.2859 7.31335 11.3833C7.2159 11.4808 7.13964 11.5974 7.08937 11.7257C7.03909 11.854 7.01589 11.9913 7.02121 12.1291C7.02653 12.2668 7.06026 12.4019 7.12028 12.526C7.1803 12.65 7.26532 12.7604 7.37 12.85L9.72 15.21C9.81344 15.3027 9.92426 15.376 10.0461 15.4258C10.1679 15.4755 10.2984 15.5008 10.43 15.5C10.6923 15.4989 10.9437 15.3947 11.13 15.21L16.13 10.21C16.2237 10.117 16.2981 10.0064 16.3489 9.88458C16.3997 9.76272 16.4258 9.63201 16.4258 9.5C16.4258 9.36799 16.3997 9.23728 16.3489 9.11542C16.2981 8.99356 16.2237 8.88296 16.13 8.79C15.9426 8.60375 15.6892 8.49921 15.425 8.49921C15.1608 8.49921 14.9074 8.60375 14.72 8.79ZM12 2C10.0222 2 8.08879 2.58649 6.4443 3.6853C4.79981 4.78412 3.51809 6.3459 2.76121 8.17317C2.00433 10.0004 1.8063 12.0111 2.19215 13.9509C2.578 15.8907 3.53041 17.6725 4.92894 19.0711C6.32746 20.4696 8.10929 21.422 10.0491 21.8079C11.9889 22.1937 13.9996 21.9957 15.8268 21.2388C17.6541 20.4819 19.2159 19.2002 20.3147 17.5557C21.4135 15.9112 22 13.9778 22 12C22 10.6868 21.7413 9.38642 21.2388 8.17317C20.7363 6.95991 19.9997 5.85752 19.0711 4.92893C18.1425 4.00035 17.0401 3.26375 15.8268 2.7612C14.6136 2.25866 13.3132 2 12 2V2ZM12 20C10.4178 20 8.87104 19.5308 7.55544 18.6518C6.23985 17.7727 5.21447 16.5233 4.60897 15.0615C4.00347 13.5997 3.84504 11.9911 4.15372 10.4393C4.4624 8.88743 5.22433 7.46197 6.34315 6.34315C7.46197 5.22433 8.88743 4.4624 10.4393 4.15372C11.9911 3.84504 13.5997 4.00346 15.0615 4.60896C16.5233 5.21447 17.7727 6.23984 18.6518 7.55544C19.5308 8.87103 20 10.4177 20 12C20 14.1217 19.1572 16.1566 17.6569 17.6569C16.1566 19.1571 14.1217 20 12 20V20Z' fill='%2310DB48'/></svg>") center / contain no-repeat;
}

.page-virtual-invitations .site-footer__upper { display: none !important; }
.page-virtual-invitations .site-header__nav { display: none !important; }

.vi-lang-float {
	position: fixed;
	top: 26px;
	right: 96px;
	z-index: 9999;
	background: #fff;
	color: var(--site-color-primary);
	font-size: 14px;
	font-weight: 600;
	padding: 10px 16px;
	border-radius: 999px;
	box-shadow: none;
	border: 1px solid var(--site-color-908e84f);
	text-decoration: none;
	transition: opacity 0.2s;
}

@media (max-width: 768px) {
	.vi-lang-float {
		top: 23px;
		right: 76px;
	}
	.vi-lang-float__text {
		display: none;
	}
}

.vi-lang-float:hover {
	opacity: 0.85;
}
.page-virtual-invitations .site-header__hamburger { display: none !important; }

/* ================================================
   DISEÑO Y DESARROLLO WEB — secciones nuevas
   ================================================ */

/* ---- Hero full-width (sin imagen) ---- */
.dw-hero-full .fp-hero__inner {
	justify-content: center;
}
.dw-hero-full .fp-hero__text {
	flex: unset;
	align-items: center;
	text-align: center;
	max-width: 700px;
}
.dw-hero-full .fp-hero__sub {
	text-align: center;
}

/* ---- Pain points (dark) ---- */
.dw-pain {
	background: #0b1628;
	padding: 72px 0;
}
.dw-pain__inner {
	display: flex;
	align-items: center;
	gap: 60px;
}
.dw-pain__title {
	flex: 0 0 260px;
	color: #fff;
	font-size: 36px;
	line-height: 1.2;
	margin: 0;
}
.dw-pain__grid {
	flex: 1;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 40px;
}
.dw-pain__icon {
	width: 64px;
	height: 64px;
	object-fit: contain;
	display: block;
	margin-bottom: 16px;
}
.dw-pain__card h3 {
	color: #fff;
	font-size: 17px;
	font-weight: 500;
	margin: 0 0 10px;
	line-height: 1.3;
}
.dw-pain__card p {
	color: #a0aec0;
	font-size: 14px;
	margin: 0;
	line-height: 1.7;
}

@media (max-width: 900px) {
	.dw-pain__inner { flex-direction: column; gap: 40px; }
	.dw-pain__title { flex: unset; font-size: 28px; }
	.dw-pain__grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 500px) {
	.dw-pain__grid { grid-template-columns: 1fr; }
}

/* ---- Reencuadre ---- */
.dw-reframe {
	background: var(--site-color-7560b43);
	padding: 80px 0;
	overflow: hidden;
}
.dw-reframe__inner {
	display: flex;
	align-items: flex-start;
	gap: 60px;
}
.dw-reframe__text {
	flex: 1.4;
}
.dw-reframe__text .badge {
	margin-bottom: 16px;
	display: inline-block;
}
.dw-reframe__text h2 {
	margin: 0 0 30px;
}
.dw-reframe__text p {
	margin-bottom: 30px;
	color: var(--site-color-primary) !important;
}
.dw-hl {
	font-weight: 500;
}
/* chips */
.dw-reframe__chips {
	list-style: none;
	padding: 0;
	margin: 30px 0 0;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}
.dw-reframe__chip {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 9px 16px;
	border-radius: 999px;
	background: #fff;
	border: 1px solid var(--site-color-debac6c);
	font-size: 15px;
	font-weight: 500;
	line-height: 1;
	transition: border-color var(--site-transition), transform var(--site-transition);
}
.dw-reframe__chip:hover {
	border-color: var(--site-color-7932011);
	transform: translateY(-2px);
}
.dw-reframe__chip svg {
	width: 17px;
	height: 17px;
	flex-shrink: 0;
}

/* visual: imagen + stats flotando */
.dw-reframe__visual {
	flex: 1;
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
}

/* ---- Mockup de tienda (fondo imagen + secuencia de compra en código) ---- */
.dw-mock {
	position: relative;
	width: 100%;
	max-width: 420px;
	margin: 0 auto;
}
.dw-mock__bg {
	display: block;
	width: 100%;
	height: auto;
}

/* card de producto */
.dw-mock__card {
	position: absolute;
	z-index: 1;
	top: 10%;
	left: 10%;
	width: 100%;
	max-width: 230px;
	background: #fff;
	border-radius: 18px;
	padding: 10px 10px 16px;
	box-shadow: 0 2px 15px rgba(20, 30, 60, .20);
}
.dw-mock__photo {
	position: relative;
	border-radius: 12px;
	margin-bottom: 12px;
}
.dw-mock__photo svg {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 12px;
}
.dw-mock__badge {
	position: absolute;
	top: -6px;
	right: -4px;
	background: #E5342A;
	color: #fff;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: .3px;
	padding: 5px 9px;
	border-radius: 6px;
	line-height: 1;
}
.dw-mock__name {
	font-size: 19px;
	font-weight: 500;
	color: #0D1B2A;
	margin: 0 0 7px;
	padding: 0 4px;
	line-height: 1.15;
}
.dw-mock__stars {
	display: flex;
	gap: 3px;
	padding: 0 4px;
	margin-bottom: 9px;
}
.dw-mock__stars span {
	width: 12px;
	height: 12px;
	background: #DDDDE8;
	clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%);
}
.dw-mock__stars span.on { background: #F5A623; }
.dw-mock__desc {
	font-size: 12px;
	font-weight: 400;
	color: #5A6A85;
	line-height: 1.5;
	margin: 0 0 12px;
	padding: 0 4px;
}

/* fila precio + carrito */
.dw-mock__buy {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 0 4px;
}
.dw-mock__price {
	font-size: 18px;
	font-weight: 500;
	color: #0D1B2A;
	margin: 0;
}
.dw-mock__cart {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 9px 15px;
	border-radius: 10px;
	background: #E5342A;
	color: #fff;
	font-size: 13px;
	font-weight: 600;
	line-height: 1;
	white-space: nowrap;
	box-shadow: 0 4px 12px rgba(229, 52, 42, .32);
	animation: dw-cart-press 9s ease-in-out infinite;
}
.dw-mock__cart svg { width: 16px; height: 16px; flex-shrink: 0; }
@keyframes dw-cart-press {
	0%,  18%  { transform: scale(1); }
	21%       { transform: scale(.82); }
	25%, 100% { transform: scale(1); }
}

/* popup de compra exitosa */
.dw-mock__popup {
	position: absolute;
	z-index: 3;
	top: 30%;
	left: 20%;
	width: 56%;
	background: #fff;
	border-radius: 18px;
	padding: 26px 18px 22px;
	text-align: center;
	box-shadow: 0 12px 40px rgba(20, 30, 60, .22);
	opacity: 0;
	transform: scale(.85);
	animation: dw-popup 9s ease-in-out infinite;
}
@keyframes dw-popup {
	0%,  22%  { opacity: 0; transform: scale(.85); pointer-events: none; }
	27%, 62%  { opacity: 1; transform: scale(1); }
	68%, 100% { opacity: 0; transform: scale(.85); }
}
.dw-mock__popup-close {
	position: absolute;
	top: 10px;
	right: 10px;
	width: 22px;
	height: 22px;
	color: #9AA5B8;
	display: flex;
	align-items: center;
	justify-content: center;
	animation: dw-close-press 9s ease-in-out infinite;
}
.dw-mock__popup-close svg { width: 13px; height: 13px; }
@keyframes dw-close-press {
	0%,  58%  { transform: scale(1); }
	61%       { transform: scale(.75); }
	65%, 100% { transform: scale(1); }
}
.dw-mock__popup-icon {
	display: block;
	width: 52px;
	margin: 0 auto 12px;
}
.dw-mock__popup-icon svg { width: 100%; height: auto; }
.dw-mock__popup-ring {
	stroke-dasharray: 145;
	stroke-dashoffset: 145;
	animation: dw-ring 9s ease-in-out infinite;
}
@keyframes dw-ring {
	0%,  23%  { stroke-dashoffset: 145; }
	33%, 66%  { stroke-dashoffset: 0; }
	67%, 100% { stroke-dashoffset: 145; }
}
.dw-mock__popup-check {
	stroke-dasharray: 40;
	stroke-dashoffset: 40;
	animation: dw-check 9s ease-in-out infinite;
}
@keyframes dw-check {
	0%,  29%  { stroke-dashoffset: 40; }
	37%, 66%  { stroke-dashoffset: 0; }
	67%, 100% { stroke-dashoffset: 40; }
}
.dw-mock__popup-title {
	font-size: 17px;
	font-weight: 500;
	color: #0D1B2A;
	margin: 0 0 4px;
}
.dw-mock__popup-sub {
	font-size: 12px;
	color: #5A6A85;
	margin: 0;
}

/* cursor */
.dw-mock__cursor {
	position: absolute;
	z-index: 4;
	width: 20px;
	top: 0;
	left: 0;
	animation: dw-cursor-move 9s cubic-bezier(.45, 0, .25, 1) infinite;
}
.dw-mock__cursor svg {
	width: 100%;
	height: auto;
	filter: drop-shadow(0 2px 4px rgba(20, 30, 60, .3));
	animation: dw-cursor-click 9s ease-in-out infinite;
}
/* recorrido: entra → clic en "Comprar" → sube a la X → clic → sale */
@keyframes dw-cursor-move {
	0%        { top: 96%; left: 80%; opacity: 0; }
	6%        { top: 92%; left: 76%; opacity: 1; }
	18%, 25%  { top: 71%; left: 52%; opacity: 1; }
	48%, 66%  { top: 34%; left: 71%; opacity: 1; }
	84%       { top: 92%; left: 76%; opacity: 1; }
	94%, 100% { top: 96%; left: 80%; opacity: 0; }
}
@keyframes dw-cursor-click {
	0%,  18%  { transform: scale(1); }
	21%       { transform: scale(.75); }
	25%, 58%  { transform: scale(1); }
	61%       { transform: scale(.75); }
	65%, 100% { transform: scale(1); }
}

@media (max-width: 900px) {
	.dw-mock { max-width: 360px; }
}
@media (max-width: 500px) {
	.dw-mock__name  { font-size: 16px; }
	.dw-mock__price { font-size: 15px; }
	.dw-mock__desc  { font-size: 10.5px; }
	.dw-mock__badge { font-size: 9px; padding: 4px 7px; }
	.dw-mock__cart  { font-size: 11px; padding: 7px 11px; gap: 5px; }
	.dw-mock__popup-title { font-size: 15px; }
}

@media (prefers-reduced-motion: reduce) {
	.dw-mock__cart, .dw-mock__cursor, .dw-mock__cursor svg,
	.dw-mock__popup, .dw-mock__popup-close,
	.dw-mock__popup-ring, .dw-mock__popup-check {
		animation: none;
	}
	.dw-mock__popup { display: none; }
	.dw-mock__cursor { display: none; }
}

.dw-reframe__cards {
	display: flex;
	align-items: stretch;
	gap: 30px;
	margin-top: 30px;
}
.dw-reframe__stat {
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding-left: 28px;
	border-left: 1px solid var(--site-color-debac6c);
}
.dw-reframe__stat:first-child {
	padding-left: 0;
	border-left: 0;
}
.dw-reframe__num {
	font-size: 44px;
	font-weight: 500;
	line-height: 1;
	background: linear-gradient(90deg, var(--site-color-7932011), var(--site-color-a1d799a));
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
}
.dw-reframe__label {
	font-size: 14px;
	color: var(--site-color-primary) !important;
	line-height: 1.4;
}

@media (max-width: 900px) {
	.dw-reframe__inner {
		flex-direction: column;
		align-items: center;
		gap: 40px;
	}
	.dw-reframe__text {
		text-align: center;
	}
	.dw-reframe__chips,
	.dw-reframe__cards {
		justify-content: center;
	}
	.dw-reframe__stat {
		align-items: center;
		text-align: center;
	}
	.dw-reframe__visual {
		width: 100%;
		order: -1;
	}
}
@media (max-width: 500px) {
	.dw-reframe__cards { gap: 18px; margin-top: 24px; }
	.dw-reframe__stat { padding-left: 18px; }
	.dw-reframe__num { font-size: 34px; }
	.dw-reframe__chip { font-size: 13px; padding: 8px 13px; }
}

/* dark */
[data-theme="dark"] .dw-reframe__chip {
	background: #000000b5;
}

/* ---- Qué incluye ---- */
.dw-includes {
	padding: 80px 0;
}
.dw-includes__inner {}
.dw-includes__header {
	text-align: center;
	margin-bottom: 48px;
}
.dw-includes__header .badge {
	background: rgba(255, 255, 255, .12);
	color: #fff;
}
.dw-includes__header h2 {
	margin-top: 12px;
	color: #fff !important;
}
.dw-includes__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
}

/* Cards navy con borde de color y resplandor del mismo tono.
   Cada card define su color con la variable --c. */
.dw-includes__card {
	display: flex;
	flex-direction: column;
	gap: 12px;
	position: relative;
	background: var(--site-color-primary) !important;
	border: 1px solid color-mix(in srgb, var(--c, #1DC8AB) 45%, transparent) !important;
	border-radius: 16px;
	padding: 26px 22px;
	overflow: visible;
	box-shadow: 0 8px 24px rgba(6, 12, 28, .35);
	transition: border-color var(--site-transition),
	            box-shadow var(--site-transition),
	            transform var(--site-transition);
}
@media (hover: hover) and (pointer: fine) {
	.dw-includes__card:hover {
		border-color: color-mix(in srgb, var(--c, #1DC8AB) 90%, transparent) !important;
		box-shadow: 0 0 34px -2px color-mix(in srgb, var(--c, #1DC8AB) 75%, transparent),
		            0 12px 30px rgba(6, 12, 28, .4);
		transform: translateY(-4px);
	}
}

.dw-includes__icon {
	width: 44px;
	height: 44px;
	border-radius: 12px;
	background: color-mix(in srgb, var(--c, #1DC8AB) 16%, transparent);
	border: 1px solid color-mix(in srgb, var(--c, #1DC8AB) 40%, transparent);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}
.dw-includes__icon svg {
	width: 22px;
	height: 22px;
	fill: var(--c, #1DC8AB);
}
/* tipografía global del sitio; solo se ajusta el color por el fondo navy */
.dw-includes__card h3 {
	margin: 0;
	color: #fff;
}
.dw-includes__card p {
	margin: 0;
	color: var(--site-color-accent) !important;
}

@media (max-width: 900px) {
	.dw-includes__grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 500px) {
	.dw-includes__grid { grid-template-columns: 1fr; }
}

/* ---- Proceso (timeline vertical) ---- */
.dw-process {
	padding: 80px 0;
}
/* contenedor más angosto solo en esta sección */
.dw-process__inner {
	max-width: 900px;
}
.dw-process__header {
	text-align: center;
	margin-bottom: 56px;
}
.dw-process__header h2 {
	margin-top: 12px;
}

/* línea vertical que recorre todos los pasos */
.dw-process__steps {
	position: relative;
	padding-left: 22px;
}
.dw-process__steps::before {
	content: '';
	position: absolute;
	left: 0;
	top: 12px;
	bottom: 12px;
	width: 2px;
	background: var(--site-color-debac6c);
}

/* cada paso: [número] [título] | [descripción] */
.dw-process__step {
	position: relative;
	display: grid;
	grid-template-columns: 64px minmax(0, 1fr) minmax(0, 1.1fr);
	align-items: start;
	gap: 24px;
	padding: 34px 0;
	border-bottom: 1px solid var(--site-color-debac6c);
}
.dw-process__step:last-child {
	border-bottom: 0;
}

/* punto sobre la línea */
.dw-process__step::before {
	content: '';
	position: absolute;
	left: -27px;
	top: 62px;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: var(--c, var(--site-color-a1d799a));
}

/* caja del número */
.dw-process__num {
	width: 64px;
	height: 64px;
	border-radius: 14px;
	border: 2px solid color-mix(in srgb, var(--c, var(--site-color-a1d799a)) 55%, transparent);
	background: color-mix(in srgb, var(--c, var(--site-color-a1d799a)) 10%, transparent);
	color: var(--c, var(--site-color-a1d799a));
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 20px;
	font-weight: 500;
	flex-shrink: 0;
}

/* título: el verbo inicial toma el color del paso */
/* col 1: número (ocupa las dos filas) */
.dw-process__num {
	grid-column: 1;
	grid-row: 1 / span 2;
}

/* col 2: título y, debajo, los tags */
.dw-process__title {
	grid-column: 2;
	grid-row: 1;
	margin: 0;
	font-size: 26px;
	line-height: 1.25;
	color: var(--site-color-primary);
}
.dw-process__title span {
	color: var(--c, var(--site-color-a1d799a));
}
.dw-process__tags {
	grid-column: 2;
	grid-row: 2;
	margin: 10px 0 0 !important;
	font-size: 14px;
	color: var(--site-color-accent) !important;
}

/* col 3: descripción, abarcando ambas filas */
.dw-process__content {
	grid-column: 3;
	grid-row: 1 / span 2;
	align-self: center;
}
.dw-process__content p {
	margin: 0;
	color: var(--site-color-text);
}

@media (max-width: 1024px) {
	.dw-process__step {
		grid-template-columns: 56px minmax(0, 1fr);
		gap: 18px;
	}
	.dw-process__num {
		width: 56px;
		height: 56px;
		font-size: 18px;
	}
	.dw-process__title {
		font-size: 22px;
	}
	/* dos columnas: todo se apila bajo el título */
	.dw-process__num    { grid-row: 1 / span 3; }
	.dw-process__content {
		grid-column: 2;
		grid-row: 2;
		margin-top: 12px;
	}
	.dw-process__tags   { grid-row: 3; }
	.dw-process__step::before {
		top: 52px;
	}
}

@media (max-width: 500px) {
	.dw-process__steps { padding-left: 18px; }
	.dw-process__step { padding: 26px 0; gap: 14px; }
	.dw-process__step::before { left: -23px; top: 44px; }
	.dw-process__num { width: 48px; height: 48px; font-size: 16px; border-radius: 12px; }
	.dw-process__step { grid-template-columns: 48px minmax(0, 1fr); }
	.dw-process__title { font-size: 19px; }
}

/* ---- FAQ ---- */
.dw-faq {
	padding: 80px 0;
	background: var(--site-color-bg, #fff);
}
.dw-faq__inner {}
.dw-faq__header {
	text-align: center;
	margin-bottom: 48px;
}
.dw-faq__header h2 {
	margin-top: 12px;
}
.dw-faq__list {
	max-width: 720px;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.dw-faq__item {
	border: 1px solid var(--site-color-debac6c);
	border-radius: 14px;
	overflow: hidden;
	background: var(--site-color-bg-card, #f9f9ff);
	transition: border-color var(--site-transition);
}
.dw-faq__item[open] {
	border-color: var(--site-color-primary);
}
.dw-faq__question {
	padding: 18px 20px;
	font-weight: 600;
	font-size: 15px;
	cursor: pointer;
	list-style: none;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
	color: var(--site-color-primary);
}
.dw-faq__question::-webkit-details-marker { display: none; }
.dw-faq__question::after {
	content: '+';
	font-size: 22px;
	font-weight: 400;
	flex-shrink: 0;
	line-height: 1;
	transition: transform var(--site-transition);
}
.dw-faq__item[open] .dw-faq__question::after {
	transform: rotate(45deg);
}
.dw-faq__answer {
	padding: 0 20px 18px;
	font-size: 14px;
	color: var(--site-color-primary) !important;
	margin: 0;
	line-height: 1.7;
}

/* ---- CTA final ---- */
.dw-cta {
	padding: 40px 0 90px;
}
/* caja navy con degradado de marca */
.dw-cta__box {
	position: relative;
	overflow: hidden;
	border-radius: 26px;
	padding: 70px 40px;
	text-align: center;
	background:
		radial-gradient(120% 130% at 75% 110%, color-mix(in srgb, var(--site-color-a1d799a) 55%, transparent) 0%, transparent 60%),
		radial-gradient(110% 120% at 15% 100%, color-mix(in srgb, var(--site-color-7932011) 30%, transparent) 0%, transparent 55%),
		linear-gradient(160deg, var(--site-color-primary) 0%, #0A2350 100%);
	box-shadow: 0 24px 60px rgba(5, 28, 60, .28);
}
.dw-cta__pretitle {
	color: #fff;
	font-size: 22px;
	font-weight: 500;
	margin: 0 0 4px;
	line-height: 1.3;
}
.dw-cta__title {
	color: #fff;
	margin: 0 0 20px;
	line-height: 1.2;
}
/* palabras destacadas con el degradado de marca */
.dw-cta__grad {
	background: linear-gradient(90deg, var(--site-color-549a7cc), var(--site-color-908e84f));
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
}
.dw-cta__sub {
	max-width: 640px;
	margin: 0 auto 34px;
	color: var(--site-color-accent) !important;
}
.dw-cta__sub u {
	text-decoration-color: color-mix(in srgb, var(--site-color-accent) 60%, transparent);
	text-underline-offset: 4px;
}
.dw-cta__btns {
	display: flex;
	justify-content: center;
	gap: 16px;
	flex-wrap: wrap;
}

@media (max-width: 768px) {
	.dw-cta { padding: 20px 0 60px; }
	.dw-cta__box { padding: 48px 24px; border-radius: 20px; }
	.dw-cta__pretitle { font-size: 18px; }
}

/* dark mode */
[data-theme="dark"] .dw-faq__item {
	background: #000000b5;
}
[data-theme="dark"] .dw-faq {
	background: transparent;
}
[data-theme="dark"] .dw-includes {
	background: var(--site-color-bg-dark, #0e131e);
}

/* ================================================
   FAQ (compartido: productos y pagina de servicio)
   ================================================ */
.ex-faq {
	padding: 60px 0 80px;
}

.ex-faq__inner {
	max-width: 750px;
}

.ex-faq__header {
	text-align: center;
	margin-bottom: 48px;
}

.ex-faq__title {
	color: var(--site-color-a1d799a);
}

.ex-faq__header .bajada {
	margin-top: 8px;
}

.ex-faq__list {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.ex-faq__item {
	border: 1px solid rgba(126, 94, 213, 0.25);
	border-radius: 12px;
	overflow: hidden;
	transition: border-color 0.2s;
	background-color: #fff;
}

[data-theme="dark"] .ex-faq__item,
[data-theme="dark"] .ex-includes__item {
	background-color: #000000b5;
}

[data-theme="dark"] .ex-faq__question {
	color: #fff;
}

.ex-faq__item[open] {
	border-color: rgba(126, 94, 213, 0.6);
}

.ex-faq__question {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 18px 24px;
	font-size: inherit;
	font-weight: inherit;
	line-height: inherit;
	cursor: pointer;
	list-style: none;
	user-select: none;
}

.ex-faq__question::-webkit-details-marker {
	display: none;
}

.ex-faq__question::after {
	content: '';
	flex-shrink: 0;
	width: 20px;
	height: 20px;
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%237e5ed5'%3E%3Cpath d='M11.9999 13.1714L16.9497 8.22168L18.3639 9.63589L11.9999 15.9999L5.63599 9.63589L7.0502 8.22168L11.9999 13.1714Z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-size: contain;
	transition: transform 0.25s ease;
}

.ex-faq__item[open] .ex-faq__question::after {
	transform: rotate(180deg);
}

.ex-faq__answer {
	padding: 0 24px 20px;
	display: flex;
	flex-direction: column;
	gap: 8px;
	font-size: 0.9rem;
	line-height: 1.6;
	opacity: 0.85;
}

@media (max-width: 768px) {
	.ex-faq__question {
		padding: 16px 18px;
	}

	.ex-faq__answer {
		padding: 0 18px 18px;
	}
}

/* ================================================
   LIBRO DE RECLAMACIONES
   Reutiliza .card-standar, .badge, .bajada y .btn-cta.
   Aquí solo va el layout y el patrón de campos del checkout.
   ================================================ */
.gr-libro__inner {
	max-width: 900px;
}

.gr-libro__header {
	text-align: center;
	margin-bottom: 36px;
}
.gr-libro__header .sp-hero__title {
	margin: 14px 0 12px;
}
.gr-libro__header .bajada {
	max-width: 620px;
	margin: 0 auto;
}

.gr-libro__legal,
.gr-libro__form {
	margin-bottom: 28px;
}
.gr-libro__legal p:last-child {
	margin-bottom: 0;
}

.gr-libro__section {
	margin-bottom: 34px;
}
.gr-libro__section > h3 {
	padding-bottom: 14px;
	margin-bottom: 20px;
	border-bottom: 1px solid var(--site-color-debac6c);
}

.gr-libro__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 22px;
}

.gr-libro__apoderado {
	margin-top: 24px;
	padding-top: 20px;
	border-top: 1px dashed var(--site-color-debac6c);
}

/* ---- Campos: mismo patrón que el checkout (solo borde inferior) ---- */
.gr-field {
	display: flex;
	flex-direction: column;
	margin: 0;
}
.gr-field--full {
	grid-column: 1 / -1;
}
.gr-field > label {
	font-size: 14px;
	color: var(--site-color-text);
	margin-bottom: 4px;
}
.gr-field input,
.gr-field select,
.gr-field textarea {
	border: none;
	border-bottom: 1px solid var(--site-color-primary);
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	padding: 8px 0;
	width: 100%;
	font-size: 18px;
	font-family: var(--site-typography-primary-font-family), sans-serif;
	color: var(--site-color-primary);
	outline: none;
}
.gr-field textarea {
	resize: vertical;
}
.gr-field input:focus,
.gr-field select:focus,
.gr-field textarea:focus {
	border-bottom-color: var(--site-color-a1d799a);
}

.gr-field__radios {
	display: flex;
	gap: 24px;
	flex-wrap: wrap;
	padding-top: 4px;
}
.gr-field__radios label {
	display: flex;
	align-items: center;
	gap: 8px;
	cursor: pointer;
}
.gr-field__radios input {
	width: auto;
	accent-color: var(--site-color-7932011);
}

.gr-field__hint {
	font-size: 14px;
	color: var(--site-color-text);
	line-height: 1.5;
}

.gr-field__accept {
	margin: 24px 0;
}
.gr-field__accept label {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	cursor: pointer;
	font-size: 14px;
	color: var(--site-color-text);
	line-height: 1.5;
}
.gr-field__accept input {
	width: 16px;
	height: 16px;
	margin-top: 3px;
	flex-shrink: 0;
	accent-color: var(--site-color-7932011);
}
.gr-field__accept a {
	color: var(--site-color-7932011);
}

.gr-libro__error {
	border: 1px solid var(--site-color-debac6c);
	border-left: 3px solid #E5342A;
	border-radius: 8px;
	padding: 12px 16px;
	margin-bottom: 18px;
	font-size: 14px;
	color: #A32118;
}

.gr-libro__form .btn-cta:disabled {
	opacity: .6;
	cursor: not-allowed;
}

@media (max-width: 768px) {
	.gr-libro__grid {
		grid-template-columns: 1fr;
	}
}

/* ================================================
   WHATSAPP FLOTANTE (todas las páginas)
   ================================================ */
.wsp-float {
	position: fixed;
	right: 24px;
	bottom: 24px;
	z-index: 9990;
	width: 58px;
	height: 58px;
	border-radius: 50%;
	background: var(--site-color-ea5641a);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 6px 20px rgba(20, 30, 60, .25);
	transition: transform var(--site-transition), box-shadow var(--site-transition);
}
.wsp-float svg {
	width: 30px;
	height: 30px;
	fill: #fff;
}
.wsp-float:hover {
	transform: scale(1.08);
	box-shadow: 0 10px 28px rgba(20, 30, 60, .32);
}

@media (max-width: 768px) {
	.wsp-float {
		right: 16px;
		bottom: 16px;
		width: 52px;
		height: 52px;
	}
	.wsp-float svg { width: 27px; height: 27px; }
}

@media (prefers-reduced-motion: reduce) {
	.wsp-float { transition: none; }
	.wsp-float:hover { transform: none; }
}

/* ================================================
   PUBLICIDAD DEL BLOG
   ================================================ */

/* Cuando hay publicidad vertical, la nota pasa a dos columnas */
.sp-content__inner--con-aside {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 300px;
	gap: 40px;
	align-items: start;
	max-width: 1180px;
}

.sp-content__texto {
	min-width: 0; /* evita que el contenido desborde la columna */
}

.sp-aside {
	position: sticky;
	top: 100px;
}

/* ---- Caja del anuncio ---- */
.gr-ad {
	display: block;
}

.gr-ad__label {
	display: block;
	margin-bottom: 6px;
	font-size: 11px;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--site-color-accent);
}

.gr-ad__slot img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 8px;
}

/* El alto lo define la propia imagen: el JS le pasa width/height reales,
   asi el navegador reserva el espacio exacto y el contenido no salta. */

.gr-ad--horizontal {
	margin: 40px 0 10px;
}

/* Publicidad horizontal de la nota: fuera de las dos columnas,
   alineada con el ancho del contenido */
.sp-content__ad {
	max-width: 1100px;
}

/* Dentro de la grilla del blog ocupa todas las columnas */
.bl-cat__grid > .gr-ad {
	grid-column: 1 / -1;
	margin: 10px 0 20px;
}

/* Entre bloques de categoría */
.bl-cat + .gr-ad {
	margin: 10px 0 50px;
}

@media (max-width: 1024px) {
	/* El aside baja debajo del contenido */
	.sp-content__inner--con-aside {
		grid-template-columns: 1fr;
		gap: 32px;
	}
	.sp-aside {
		position: static;
		display: flex;
		justify-content: center;
	}
	.gr-ad--vertical .gr-ad__slot img {
		max-width: 300px;
	}
}

/* ================================================
   BLOG — destacado y filtros
   ================================================ */

/* ---- Artículo destacado ---- */
.bl-destacado,
.bl-listado {
	background: var(--site-color-4baa0cb);
}

.bl-destacado {
	padding-bottom: 20px !important;
}

.bl-destacado__card {
	display: grid;
	grid-template-columns: 1.15fr 1fr;
	gap: 36px;
	align-items: center;
}

.bl-destacado__img-wrap {
	display: block;
	border-radius: 12px;
	overflow: hidden;
	aspect-ratio: 16 / 10;
}

.bl-destacado__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform var(--site-transition);
}

.bl-destacado__img-wrap:hover .bl-destacado__img {
	transform: scale(1.03);
}

.bl-destacado__body {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 14px;
}

.bl-destacado__title {
	font-size: 34px;
	line-height: 1.2em;
	margin: 0;
}

.bl-destacado__title a {
	color: var(--site-color-primary);
	text-decoration: none;
	transition: opacity var(--site-transition);
}

.bl-destacado__title a:hover {
	opacity: .8;
}

.bl-destacado__excerpt {
	margin: 0;
}

/* ---- Filtros de categoría ---- */
.bl-filtros {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-bottom: 32px;
}

.bl-filtro {
	padding: 9px 18px;
	border: 1px solid var(--site-color-debac6c);
	border-radius: 999px;
	background: transparent;
	color: var(--site-color-primary);
	font-family: inherit;
	font-size: 15px;
	font-weight: 500;
	line-height: 1;
	cursor: pointer;
	transition: border-color var(--site-transition),
	            background-color var(--site-transition),
	            color var(--site-transition);
}

.bl-filtro:hover {
	border-color: var(--site-color-a1d799a);
}

.bl-filtro.is-active {
	background: var(--site-color-a1d799a);
	border-color: var(--site-color-a1d799a);
	color: #fff;
}

.bl-vacio {
	text-align: center;
	padding: 40px 0;
	color: var(--site-color-text);
}

/* Usada por el filtro. El reset aplica article{display:block}, que
   anula el atributo [hidden], por eso se oculta con clase. */
.is-oculto {
	display: none !important;
}

@media (max-width: 900px) {
	.bl-destacado__card {
		grid-template-columns: 1fr;
		gap: 20px;
	}
	.bl-destacado__title {
		font-size: 26px;
	}
}

@media (max-width: 600px) {
	.bl-filtros {
		gap: 8px;
	}
	.bl-filtro {
		font-size: 14px;
		padding: 8px 14px;
	}
}

/* ======================================
   LANDING PORTAFOLIO (page-portafolio.php)
   ====================================== */
/* franja con el patron a todo el ancho; la foto la pisa por abajo */
.pf-hero { padding: 0 0 90px !important; } /* el global section pone 70px arriba */
.pf-hero__patron {
	height: 180px;
	background-repeat: repeat-x;
	background-size: auto 201%;
	background-position: center top;
}
.pf-hero__perfil {
	display: flex;
	align-items: flex-start;
	gap: 32px;
	margin-top: -110px;
}
.pf-hero__avatar {
	flex-shrink: 0;
	width: 220px;
	height: 220px;
}
.pf-hero__texto { padding-top: 130px; } /* 110 del solape + aire para no tocar el patron */
.pf-hero__texto h1 { font-size: 48px; margin-bottom: 12px; }
.pf-hero__texto p { max-width: 640px; margin: 0; }
.pf-hero__texto p + p { margin-top: 8px; }
.pf-hero__texto a { color: var(--site-color-a1d799a); text-decoration: underline; }
@media (max-width: 768px) {
	.pf-hero__patron { height: 120px; }
	.pf-hero__perfil { flex-direction: column; align-items: flex-start; gap: 16px; margin-top: -80px; }
	.pf-hero__avatar { width: 160px; height: 160px; }
	.pf-hero__texto { padding-top: 0; }
	.pf-hero__texto h1 { font-size: 36px; }
}

/* iOS ignora overflow-x en body si html no lo lleva tambien */
html:has(.page-template-page-portafolio),
.page-template-page-portafolio { overflow-x: hidden; }

/* Grupos por categoria: titulo + fila con scroll horizontal */
.pf-grupo { padding-top: 60px; }
.pf-grupo__head { display: flex; align-items: baseline; gap: 14px; margin-bottom: 16px; padding-bottom: 12px; border-bottom: 4px solid var(--site-color-primary); }
.pf-grupo__conteo { font-size: 14px; color: var(--site-color-text); }
.pf-grupo__nota { margin: 0; font-size: 14px; color: var(--site-color-text); }
.pf-scroller {
	overflow-x: auto;
	overflow-y: hidden;
	/* de borde a borde del navegador; el padding devuelve el primer item a la
	   linea del titulo, y al hacer scroll la fila corre hasta el extremo */
	margin: 0 calc(50% - 50vw);
	padding: 20px calc(50vw - 50%) 26px;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;      /* la barra nativa se oculta: la reemplaza .pf-barra */
}
.pf-scroller::-webkit-scrollbar { display: none; }

/* barra propia: 200px centrada, thumb morado */
.pf-barra {
	position: relative;
	width: 200px;
	height: 6px;
	margin: 4px auto 0;
	border-radius: 3px;
	background: var(--site-color-debac6c);
}
.pf-barra.is-oculto { display: none; }
.pf-barra__thumb {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	border-radius: 3px;
	background: var(--site-color-a1d799a);
	cursor: grab;
	will-change: transform;
}
.pf-barra__thumb:active { cursor: grabbing; }
@media (min-width: 768px) {
	.pf-scroller { cursor: grab; }
	.pf-scroller.is-dragging { cursor: grabbing; user-select: none; scroll-behavior: auto; }
}
.pf-scroller__fila {
	display: flex;
	align-items: stretch;
	gap: 48px;
	width: max-content;
}

/* Cada proyecto: case de celular (como .ti-showcase__phone) + texto al lado */
.pf-item {
	position: relative;
	display: flex;
	align-items: stretch;
	gap: 24px;
	/* ancho explicito (no solo flex-basis): Safari calcula el max-content de la fila
	   con el tamano natural de la imagen y dejaba un hueco enorme al final */
	width: 560px;
	max-width: 560px;
	flex: 0 0 auto;
	padding: 20px;
	opacity: .12;
	transition: opacity .35s ease;
}
.pf-item.is-centro { opacity: 1; }
/* la capsula blanca va en un ::before para poder moverla/animarla sin tocar el contenido */
.pf-item::before {
	content: '';
	position: absolute;
	inset: 0;
	top: 10%;
	height: 80%;
	z-index: 0;
	background: #fff;
	border: 1px solid var(--site-color-debac6c);
	border-radius: 20px;
}
.pf-item > * { position: relative; z-index: 1; }
.pf-item__phone {
	position: relative;
	align-self: center;
	flex: 0 0 auto;
	width: 50%;
	min-width: 0;
	padding: 4px;
	box-sizing: border-box;
	border-radius: 26px;
	background: #14131A;
	box-shadow: 0 0 0 4px #D9D2F0, 0 12px 24px rgba(20, 30, 60, .14);
}
.pf-item__lente {
	position: absolute;
	top: 10px;
	left: 50%;
	transform: translateX(-50%);
	width: 9px;
	height: 9px;
	border-radius: 50%;
	background: #14131A;
	box-shadow: 0 0 0 2px rgba(0, 0, 0, .35);
	z-index: 2;
}
.pf-item__phone-img {
	display: block;
	width: 100%;
	max-width: 100%;
	height: auto;
	border-radius: 22px;
}
.pf-item__texto {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
	padding: 0 4px;
}
.pf-item__texto .badge { margin-bottom: 12px; }
.pf-item__bandera { width: 30px; height: 24px; object-fit: cover; border-radius: 4px; margin-bottom: 10px; }
.pf-item__texto h3 { font-size: 24px; font-weight: 400; line-height: 1.35; color: var(--site-color-primary); margin: 0; }
.pf-item__texto h3 strong { font-weight: 500; }
.pf-item__links { display: flex; flex-wrap: wrap; gap: 8px 20px; margin-top: 16px; }
.pf-item__link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: var(--site-color-a1d799a);
	text-decoration: underline;
}
.pf-item__link { font-size: 15px; }
.pf-item__link svg { width: 16px; height: 16px; }

/* ---- Modo oscuro de la landing (el tema aplica data-theme en todas las paginas) ---- */
[data-theme="dark"] .pf-item::before {
	background: #000000b5;                       /* mismo fondo que .card-standar en oscuro */
	border-color: var(--site-color-93d65f3);
}
[data-theme="dark"] .pf-item__phone {
	box-shadow: 0 0 0 4px var(--site-color-93d65f3), 0 12px 24px rgba(0, 0, 0, .45);
}
[data-theme="dark"] .pf-barra { background: var(--site-color-93d65f3); }
[data-theme="dark"] .pf-grupo__head { border-bottom-color: var(--site-color-primary); }

@media (max-width: 1024px) {
	.pf-item::before { top: 0; height: 100%; border-radius: 10px; }
	.pf-item__phone { border-radius: 12px; }
	.pf-item__phone-img { border-radius: 9px; } /* 12 del marco - 4 de padding, para que no asome */
}
@media (max-width: 768px) {
	.pf-grid { margin-top: 32px; }
	.pf-item__texto h3 { font-size: 20px; line-height: 1.1; }
	.pf-grupo { padding-top: 40px; }
	.pf-scroller__fila { gap: 28px; }
	/* en movil: scroll nativo de borde a borde, sin barra propia ni cards veladas */
	/* sin vw: en iOS el viewport de layout infla 50vw y dejaba un hueco enorme al final.
	   El inner mide 30px de padding, asi que -30/30 lo lleva al borde igual. */
	.pf-scroller { margin: 0 -30px; padding: 16px 30px 22px; scrollbar-width: auto; }
	.pf-scroller::-webkit-scrollbar { display: block; height: 6px; }
	.pf-scroller::-webkit-scrollbar-thumb { background: var(--site-color-debac6c); border-radius: 3px; }
	.pf-barra { display: none; }
	.pf-item { opacity: 1; }
	.pf-item { width: 300px; max-width: 300px; gap: 14px; }
	.pf-item__phone { width: 40%; }
	.pf-item { padding: 14px; }
}