/* -----------------------------------------------------------------------
   Vargo — estilo macOS · inspirado en qpaypro.com  ·  v1.8.4
   Base clara + bandas inmersivas (azul profundo / negro), barra flotante de
   vidrio, tarjetas grandes muy redondeadas, botones tipo píldora.
   Se activa con body.vargo-macos (Personalizar > Colores > Estilo macOS).
----------------------------------------------------------------------- */

body.vargo-macos {
	/* --- modo claro (por defecto) --- */
	--vargo-primary: #26A9E0;
	--vargo-primary-dark: #1487BE;
	--vargo-secondary: #0E6E9E;
	--vargo-background: #F8FAFC;
	--vargo-surface: #FFFFFF;
	--vargo-text: #0D2231;
	--vargo-text-muted: #5B6B78;
	--vargo-ink-soft: #3C4C57;
	--vargo-border: rgba(13,34,49,.09);
	--vargo-tint-1: #EAF6FC;
	--vargo-tint-2: #E9FAF7;
	--vargo-tint-3: #EEF3FF;
	--vargo-tint-4: #FFF2ED;
	--vargo-tint-5: #FFF8EC;
	--vargo-radius: 28px;

	--vm-h: #0D2231;
	--vm-t: #5B6B78;
	--vm-card: #FFFFFF;
	--vm-card-bd: rgba(13,34,49,.08);
	--vm-shadow: 0 1px 2px rgba(13,34,49,.04), 0 20px 50px rgba(38,169,224,.14);
	--vm-accent: #1487BE;
	--vm-blur: saturate(180%) blur(22px);
	--vm-radius: 28px;

	background: #FFFFFF;
	color: var(--vm-t);
	font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Text', var(--vargo-font-body);
	color-scheme: light;
}
.vargo-macos ::selection { background: rgba(38,169,224,.3); }
.vargo-macos .vargo-bg-blob { display: none; }
.vargo-macos .vargo-site-content { background: #F8FAFC; }

/* --- bandas oscuras: azul profundo, negro, hero, CTA --- */
.vargo-macos .vargo-hero.elementor-section,
.vargo-macos .vargo-hero--dark.elementor-section,
.vargo-macos .vargo-tint-1.elementor-section,
.vargo-macos .vargo-tint-4.elementor-section,
.vargo-macos .vargo-footer {
	--vargo-text: #FFFFFF;
	--vargo-text-muted: rgba(255,255,255,.68);
	--vargo-ink-soft: rgba(255,255,255,.78);
	--vargo-border: rgba(255,255,255,.14);
	--vargo-surface: rgba(255,255,255,.07);
	--vargo-primary: #8AD6F2;
	--vargo-secondary: #8AD6F2;
	--vm-h: #FFFFFF;
	--vm-t: rgba(255,255,255,.74);
	--vm-card: rgba(255,255,255,.07);
	--vm-card-bd: rgba(255,255,255,.15);
	--vm-shadow: 0 1px 0 rgba(255,255,255,.08) inset, 0 24px 60px rgba(0,0,0,.35);
	--vm-accent: #8AD6F2;
	color: var(--vm-t);
}
.vargo-macos .vargo-hero.elementor-section {
	background:
		radial-gradient(900px 480px at 85% 10%, rgba(138,214,242,.35), transparent 65%),
		radial-gradient(700px 420px at 5% 100%, rgba(38,169,224,.28), transparent 65%),
		linear-gradient(165deg, #0B2331 0%, #0E4F73 58%, #1487BE 100%) !important;
}
.vargo-macos .vargo-hero--dark.elementor-section {
	background:
		radial-gradient(800px 460px at 50% 0%, rgba(38,169,224,.35), transparent 70%),
		linear-gradient(180deg, #0B2331, #081A25) !important;
}
.vargo-macos .vargo-tint-1.elementor-section {
	background:
		radial-gradient(800px 400px at 100% 0%, rgba(138,214,242,.4), transparent 65%),
		linear-gradient(120deg, #0B4F73 0%, #1487BE 58%, #26A9E0 100%) !important;
}
.vargo-macos .vargo-tint-4.elementor-section {
	background:
		radial-gradient(700px 380px at 0% 100%, rgba(38,169,224,.28), transparent 65%),
		#0B2331 !important;
}
.vargo-macos .vargo-white.elementor-section { background: #FFFFFF !important; }
.vargo-macos .vargo-tint-2.elementor-section { background: #E9FAF7 !important; }
.vargo-macos .vargo-tint-3.elementor-section { background: #EEF3FF !important; }
.vargo-macos .vargo-tint-5.elementor-section { background: #FFF8EC !important; }
.vargo-macos .elementor-section { border-color: transparent; }

/* --- tipografía --- */
.vargo-macos h1, .vargo-macos h2, .vargo-macos h3, .vargo-macos h4, .vargo-macos h5, .vargo-macos h6 {
	color: var(--vm-h); letter-spacing: -.03em;
}
.vargo-macos .elementor-widget-heading .elementor-heading-title,
.vargo-macos .elementor-heading-title { color: var(--vm-h) !important; letter-spacing: -.03em; }
.vargo-macos .vargo-hero h1.elementor-heading-title { font-weight: 800; letter-spacing: -.04em; }
.vargo-macos .elementor-widget-text-editor,
.vargo-macos .elementor-widget-text-editor p,
.vargo-macos .elementor-icon-list-text { color: var(--vm-t) !important; }
.vargo-macos .elementor-widget-text-editor strong { color: var(--vm-h); }
body.vargo-macos .vargo-eyebrow, body.vargo-macos .vargo-eyebrow *,
body.vargo-macos .elementor-widget-heading h6.elementor-heading-title {
	color: var(--vm-accent) !important; font-size: 12.5px !important; letter-spacing: .2em !important; text-transform: uppercase; font-weight: 700;
}
.vargo-macos a { color: var(--vm-accent); }
.vargo-macos .elementor-icon-list-icon i, .vargo-macos .elementor-icon-list-icon svg { color: var(--vm-accent) !important; fill: var(--vm-accent) !important; }

/* --- barra flotante de vidrio --- */
.vargo-macos .vargo-header {
	position: sticky; top: 0;
	width: 100%; margin: 0; border-radius: 0;
	background: transparent; border: 0; box-shadow: none;
}
/* El vidrio va en un pseudo-elemento: un backdrop-filter en el propio header lo
   convertiría en contenedor de los hijos position:fixed (el drawer móvil) y
   provocaría scroll horizontal. */
.vargo-macos .vargo-header::before {
	content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none;
	background: rgba(11,35,49,.92);
	-webkit-backdrop-filter: var(--vm-blur); backdrop-filter: var(--vm-blur);
	border-bottom: 1px solid rgba(255,255,255,.14);
}
.vargo-macos .vargo-header.is-scrolled::before { background: rgba(11,35,49,.96); box-shadow: 0 10px 40px rgba(5,10,30,.3); }
.vargo-macos .vargo-header__inner { padding: 12px 24px; }
.vargo-macos .vargo-header.is-scrolled .vargo-header__inner { padding: 8px 24px; }
.vargo-macos .vargo-nav__link { color: rgba(255,255,255,.9); border-radius: 12px; }
.vargo-macos .vargo-nav__link:hover,
.vargo-macos .vargo-nav__item:focus-within > .vargo-nav__link,
.vargo-macos .vargo-nav__item.has-dropdown:hover > .vargo-nav__link { background: rgba(255,255,255,.14); color: #fff; }
.vargo-macos .vargo-nav__login { color: rgba(255,255,255,.88); }
.vargo-macos .vargo-nav__login:hover { color: #fff; }
.vargo-macos .vargo-menu-trigger { color: #fff; }
.vargo-macos .vargo-dropdown {
	background: rgba(11,35,49,.98);
	-webkit-backdrop-filter: saturate(180%) blur(30px); backdrop-filter: saturate(180%) blur(30px);
	border: 1px solid rgba(255,255,255,.16); border-radius: 20px;
	box-shadow: 0 30px 80px rgba(5,10,30,.5);
}
.vargo-macos .vargo-dropdown__grid a, .vargo-macos .vargo-dropdown__list a { color: #fff; border-radius: 12px; }
.vargo-macos .vargo-dropdown__grid a span { color: rgba(255,255,255,.62); }
.vargo-macos .vargo-dropdown__grid a:hover, .vargo-macos .vargo-dropdown__list a:hover { background: rgba(255,255,255,.14); color: #fff; }
.vargo-macos .vargo-dropdown__foot { border-color: rgba(255,255,255,.12); color: rgba(255,255,255,.7); }
.vargo-macos .vargo-menu-overlay { background: rgba(11,35,49,.78); -webkit-backdrop-filter: saturate(180%) blur(28px); backdrop-filter: saturate(180%) blur(28px); border-left: 1px solid rgba(255,255,255,.14); }

/* --- botones tipo píldora --- */
.vargo-macos .vargo-btn, .vargo-macos .elementor-button { border-radius: 999px !important; font-weight: 600; letter-spacing: -.005em; }
/* primario: claro (blanco) sobre bandas oscuras, azul sobre claras */
.vargo-macos .vargo-btn--primary,
.vargo-macos .elementor-widget-button .elementor-button {
	background: linear-gradient(180deg, #38B8EC, #1487BE) !important; color: #fff !important; border: 0 !important;
	box-shadow: 0 1px 0 rgba(255,255,255,.3) inset, 0 10px 26px rgba(38,169,224,.35) !important;
}
.vargo-macos .vargo-hero .elementor-widget-button .elementor-button,
.vargo-macos .vargo-hero--dark .elementor-widget-button:not(.vargo-btn--ghost-el) .elementor-button,
.vargo-macos .vargo-tint-1 .elementor-widget-button .elementor-button,
.vargo-macos .vargo-tint-4 .elementor-widget-button .elementor-button,
.vargo-macos .vargo-footer .vargo-btn--primary,
.vargo-macos .vargo-header .vargo-btn--primary {
	background: #FFFFFF !important; color: #0E6E9E !important;
	box-shadow: 0 10px 30px rgba(0,0,0,.25) !important;
}
.vargo-macos .vargo-btn--primary:hover, .vargo-macos .elementor-widget-button .elementor-button:hover { transform: translateY(-1px); filter: brightness(1.04); }
.vargo-macos .vargo-btn--ghost-el .elementor-button,
.vargo-macos .vargo-btn-ghost-light .elementor-button,
.vargo-macos .vargo-btn--ghost {
	background: rgba(255,255,255,.12) !important; color: #fff !important;
	border: 1px solid rgba(255,255,255,.28) !important; box-shadow: none !important;
	-webkit-backdrop-filter: var(--vm-blur); backdrop-filter: var(--vm-blur);
}
.vargo-macos .vargo-white .vargo-btn--ghost-el .elementor-button,
.vargo-macos .vargo-tint-2 .vargo-btn--ghost-el .elementor-button,
.vargo-macos .vargo-tint-3 .vargo-btn--ghost-el .elementor-button {
	background: #fff !important; color: #0D2231 !important; border: 1px solid rgba(13,34,49,.14) !important;
}

/* --- tarjetas grandes con vidrio / sombra suave --- */
.vargo-macos .elementor-widget-icon-box:not(.vargo-chip),
.vargo-macos .vargo-bento-cell,
.vargo-macos .vargo-tabs__card,
.vargo-macos .vargo-partner,
.vargo-macos .elementor-widget-testimonial .elementor-testimonial-wrapper,
.vargo-macos .vargo-plan__card,
.vargo-macos .vargo-post-card,
.vargo-macos .vargo-contact-form-wrap,
.vargo-macos .vargo-stats .elementor-column-wrap {
	background: var(--vm-card) !important;
	border: 1px solid var(--vm-card-bd) !important;
	border-radius: var(--vm-radius) !important;
	box-shadow: var(--vm-shadow) !important;
	-webkit-backdrop-filter: var(--vm-blur); backdrop-filter: var(--vm-blur);
}
.vargo-macos .vargo-bento-cell[class*="tint-"] { background: var(--vm-card) !important; }
.vargo-macos .vargo-bento-cell.tint-1 { background-image: linear-gradient(160deg, rgba(38,169,224,.16), transparent 60%) !important; }
.vargo-macos .vargo-bento-cell.tint-2 { background-image: linear-gradient(160deg, rgba(52,211,153,.14), transparent 60%) !important; }
.vargo-macos .vargo-bento-cell.tint-3 { background-image: linear-gradient(160deg, rgba(129,140,248,.16), transparent 60%) !important; }
.vargo-macos .vargo-bento-cell.tint-4 { background-image: linear-gradient(160deg, rgba(251,146,110,.14), transparent 60%) !important; }
.vargo-macos .vargo-post-card:hover,
.vargo-macos .elementor-widget-icon-box:hover { transform: translateY(-4px); }
.vargo-macos .elementor-icon-box-title, .vargo-macos .elementor-icon-box-title a,
.vargo-macos .vargo-post-card__title, .vargo-macos .vargo-post-card__title a { color: var(--vm-h) !important; }
.vargo-macos .elementor-icon-box-description,
.vargo-macos .vargo-post-card__excerpt,
.vargo-macos .vargo-post-card__meta { color: var(--vm-t) !important; }
.vargo-macos .elementor-icon-box-icon .elementor-icon { color: var(--vm-accent) !important; }
.vargo-macos .elementor-icon, .vargo-macos .elementor-icon i { color: var(--vm-accent) !important; }
.vargo-macos .elementor-icon svg, .vargo-macos .elementor-icon svg path, .vargo-macos .elementor-icon svg * { fill: var(--vm-accent) !important; }
/* plan destacado: azul profundo como los bloques de qpaypro */
.vargo-macos .vargo-plan__card.is-featured, .vargo-macos .vargo-plan__card--featured {
	background: linear-gradient(160deg, #0B4F73, #1487BE) !important; border-color: rgba(255,255,255,.2) !important;
	--vm-h: #fff; --vm-t: rgba(255,255,255,.78); --vargo-text: #fff; --vargo-text-muted: rgba(255,255,255,.7); --vm-accent: #8AD6F2;
}

/* --- ventana de app (frame) --- */
.vargo-macos .vargo-frame,
.vargo-macos .vargo-hero__media .elementor-widget-image,
.vargo-macos .vargo-split__media .elementor-widget-image {
	background: rgba(255,255,255,.55) !important;
	border: 1px solid rgba(255,255,255,.35) !important; border-radius: 18px !important;
	box-shadow: 0 50px 110px rgba(11,35,49,.4), 0 0 0 .5px rgba(0,0,0,.25) !important;
}
.vargo-macos .vargo-chip {
	background: rgba(11,35,49,.75) !important; color: #fff !important;
	border: 1px solid rgba(255,255,255,.2) !important;
	-webkit-backdrop-filter: var(--vm-blur); backdrop-filter: var(--vm-blur);
	box-shadow: 0 16px 40px rgba(0,0,0,.35) !important;
}

/* --- acordeón, pestañas, formularios --- */
.vargo-macos .elementor-accordion-item {
	background: var(--vm-card) !important; border: 1px solid var(--vm-card-bd) !important; border-radius: 20px !important; box-shadow: none !important;
}
.vargo-macos .elementor-tab-title, .vargo-macos .elementor-tab-title a { color: var(--vm-h) !important; }
.vargo-macos .elementor-tab-content { color: var(--vm-t) !important; border-color: var(--vm-card-bd) !important; }
.vargo-macos input:not([type=checkbox]):not([type=radio]):not([type=submit]),
.vargo-macos textarea, .vargo-macos select {
	background: #F1F6FA !important; color: #0D2231 !important;
	border: 1px solid rgba(11,18,48,.10) !important; border-radius: 14px !important;
}
.vargo-macos input:focus, .vargo-macos textarea:focus, .vargo-macos select:focus {
	outline: none; border-color: #26A9E0 !important; box-shadow: 0 0 0 4px rgba(38,169,224,.22) !important; background: #fff !important;
}
.vargo-macos label { color: #3C4C57; }

/* --- blog / entrada --- */
.vargo-macos .vargo-single__content, .vargo-macos .entry-content, .vargo-macos .entry-content p { color: #3C4C57; }
.vargo-macos .vargo-single__title, .vargo-macos .entry-title { color: #0D2231; }
.vargo-macos blockquote { background: #EAF6FC; border-left: 3px solid #26A9E0; border-radius: 0 16px 16px 0; color: #0D2231; }
.vargo-macos .vargo-post-card__thumb { border-radius: 0; }
.vargo-macos .vargo-post-card__reactions { border-color: rgba(11,18,48,.08) !important; }

/* --- pie y chat --- */
.vargo-macos .vargo-footer {
	background: radial-gradient(800px 300px at 90% 0%, rgba(38,169,224,.25), transparent 65%), #0B2331;
	border-top: 0; color: rgba(255,255,255,.72);
}
.vargo-macos .vargo-footer a { color: rgba(255,255,255,.8); }
.vargo-macos .vargo-footer a:hover { color: #fff; }
.vargo-macos .vargo-footer h4, .vargo-macos .vargo-footer h5, .vargo-macos .vargo-footer strong { color: #fff; }
.vargo-macos #vargo-agent-chat { border-radius: 24px; -webkit-backdrop-filter: var(--vm-blur); backdrop-filter: var(--vm-blur); }

.vargo-macos ::-webkit-scrollbar { width: 12px; height: 12px; }
.vargo-macos ::-webkit-scrollbar-thumb { background: rgba(120,130,160,.45); border-radius: 10px; border: 3px solid transparent; background-clip: content-box; }

@media (max-width: 767px) {
	.vargo-macos { --vm-radius: 22px; }
	}
@media (prefers-reduced-transparency: reduce) {
	.vargo-macos .vargo-header, .vargo-macos .vargo-dropdown { background: #103240; -webkit-backdrop-filter: none; backdrop-filter: none; }
}

/* ghost sobre bandas oscuras (debe ir después de la regla del botón primario) */
body.vargo-macos .vargo-hero .vargo-btn--ghost-el .elementor-button,
body.vargo-macos .vargo-tint-1 .vargo-btn--ghost-el .elementor-button,
body.vargo-macos .vargo-tint-4 .vargo-btn--ghost-el .elementor-button,
body.vargo-macos .vargo-hero--dark .vargo-btn--ghost-el .elementor-button {
	background: rgba(255,255,255,.12) !important; color: #fff !important;
	border: 1px solid rgba(255,255,255,.3) !important; box-shadow: none !important;
}

.vargo-macos .vargo-menu-trigger__label { color: #fff; }
.vargo-macos .vargo-menu-trigger__icon span { background: #fff; }


/* ---- Botones con más aire ---- */
body.vargo-macos .vargo-btn, body.vargo-macos .elementor-button { padding: 16px 32px !important; font-size: 15.5px !important; line-height: 1.2; min-width: 168px; text-align: center; }
body.vargo-macos .vargo-btn--sm { padding: 12px 24px !important; font-size: 14px !important; min-width: 0; }
body.vargo-macos .vargo-btn--lg { padding: 18px 40px !important; font-size: 16.5px !important; }
body.vargo-macos .elementor-widget-button { margin-bottom: 8px; }
body.vargo-macos .vargo-hero__copy .elementor-widget-button { margin-top: 12px; margin-bottom: 20px; }
body.vargo-macos .vargo-hero .elementor-column .elementor-widget-wrap,
body.vargo-macos .vargo-hero--dark .elementor-column .elementor-widget-wrap { gap: 0; }
body.vargo-macos .vargo-hero .elementor-inner-section .elementor-column:first-child,
body.vargo-macos .vargo-hero--dark .elementor-inner-section .elementor-column:first-child { padding-right: 14px; }
body.vargo-macos .vargo-hero--dark .elementor-inner-section .elementor-column:last-child,
body.vargo-macos .vargo-hero .elementor-inner-section .elementor-column:last-child { padding-left: 14px; }
@media (max-width: 767px) {
	body.vargo-macos .elementor-button { min-width: 0; width: 100%; }
	body.vargo-macos .vargo-header .vargo-btn--sm { width: auto; }
}

/* ---- Enlace con flecha (no es un botón) ---- */
body.vargo-macos .vargo-arrow-btn .elementor-button {
	background: transparent !important; box-shadow: none !important; border: 0 !important;
	padding: 6px 2px !important; min-width: 0; width: auto; color: var(--vm-accent) !important; font-weight: 600;
}
body.vargo-macos .vargo-arrow-btn .elementor-button:hover { background: transparent !important; filter: none; transform: none; color: var(--vm-h) !important; }
body.vargo-macos .vargo-tint-1 .vargo-arrow-btn .elementor-button,
body.vargo-macos .vargo-tint-4 .vargo-arrow-btn .elementor-button { color: #fff !important; }

/* ---- Integraciones: sin marcos blancos ---- */
body.vargo-macos .vargo-partner .elementor-image-box-img,
body.vargo-macos .vargo-partner .elementor-image-box-img img { background: transparent !important; border: 0 !important; box-shadow: none !important; }
body.vargo-macos .vargo-partner .elementor-image-box-img { border-radius: 12px; }
body.vargo-macos .vargo-tint-1 .vargo-partner.elementor-widget-image-box,
body.vargo-macos .vargo-tint-4 .vargo-partner.elementor-widget-image-box {
	background: rgba(255,255,255,.08) !important; border: 1px solid rgba(255,255,255,.16) !important; box-shadow: none !important;
}
body.vargo-macos .vargo-tint-1 .vargo-partner:hover { background: rgba(255,255,255,.14) !important; border-color: rgba(255,255,255,.3) !important; }
body.vargo-macos .vargo-partner--add.elementor-widget-icon-box { background: transparent !important; border: 1.5px dashed rgba(255,255,255,.3) !important; box-shadow: none !important; }
body.vargo-macos .vargo-partner--add .elementor-icon { border-color: rgba(255,255,255,.35) !important; color: #fff !important; }
body.vargo-macos .vargo-partner--add .elementor-icon svg, body.vargo-macos .vargo-partner--add .elementor-icon svg * { fill: #fff !important; }
body.vargo-macos .vargo-partner .elementor-image-box-title, body.vargo-macos .vargo-partner .elementor-icon-box-title { color: #fff !important; }
body.vargo-macos .vargo-partner .elementor-image-box-description, body.vargo-macos .vargo-partner .elementor-icon-box-description { color: rgba(255,255,255,.72) !important; }

/* enlace con flecha: mayor especificidad que las píldoras blancas de las bandas oscuras */
body.vargo-macos .elementor-section .elementor-widget-button.vargo-arrow-btn .elementor-button {
	background: transparent !important; box-shadow: none !important; border: 0 !important;
	padding: 6px 2px !important; min-width: 0; width: auto; color: var(--vm-accent) !important; font-weight: 600;
}
body.vargo-macos .vargo-tint-1 .elementor-widget-button.vargo-arrow-btn .elementor-button,
body.vargo-macos .vargo-tint-4 .elementor-widget-button.vargo-arrow-btn .elementor-button { color: #fff !important; }
body.vargo-macos .vargo-tint-1 .elementor-widget-button.vargo-arrow-btn .elementor-button:hover,
body.vargo-macos .elementor-section .elementor-widget-button.vargo-arrow-btn .elementor-button:hover { background: transparent !important; filter: none; transform: none; box-shadow: none !important; }

/* CTA final: botones juntos y centrados, el secundario en vidrio */
@media (min-width: 768px) {
	body.vargo-macos .vargo-hero--dark .elementor-inner-section .elementor-container { justify-content: center; gap: 18px; }
	body.vargo-macos .vargo-hero--dark .elementor-inner-section .elementor-column[class*="elementor-col-"] { width: auto !important; flex: 0 0 auto; padding: 0; }
}
body.vargo-macos .vargo-hero--dark .elementor-widget-button.vargo-btn-ghost-light .elementor-button {
	background: rgba(255,255,255,.12) !important; color: #fff !important;
	border: 1px solid rgba(255,255,255,.32) !important; box-shadow: none !important;
}
@media (max-width: 767px) {
	body.vargo-macos .vargo-hero .elementor-inner-section .elementor-column,
	body.vargo-macos .vargo-hero--dark .elementor-inner-section .elementor-column,
	body.vargo-macos .vargo-hero .elementor-inner-section .elementor-column:first-child,
	body.vargo-macos .vargo-hero .elementor-inner-section .elementor-column:last-child,
	body.vargo-macos .vargo-hero--dark .elementor-inner-section .elementor-column:first-child,
	body.vargo-macos .vargo-hero--dark .elementor-inner-section .elementor-column:last-child { padding-left: 0; padding-right: 0; }
	body.vargo-macos .elementor-widget-button { margin-bottom: 12px; }
}

/* ---- Menú móvil (drawer) ---- */
body.vargo-macos .vargo-menu-overlay__list a { color: rgba(255,255,255,.92); }
body.vargo-macos .vargo-menu-overlay__list a:hover { color: #fff; }
body.vargo-macos .vargo-menu-close { color: #fff; }
body.vargo-macos .vargo-menu-overlay__cta { display: flex; flex-direction: column; gap: 14px; margin-top: 32px; }
body.vargo-macos .vargo-menu-overlay__cta .vargo-btn--primary { background: #fff !important; color: #0E6E9E !important; box-shadow: 0 10px 30px rgba(0,0,0,.25) !important; width: 100%; }
body.vargo-macos .vargo-menu-overlay__login {
	display: block; text-align: center; width: 100%; padding: 15px 24px; border-radius: 999px;
	color: #fff !important; font-weight: 600; font-size: 15.5px;
	background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.3);
	-webkit-backdrop-filter: var(--vm-blur); backdrop-filter: var(--vm-blur);
}
body.vargo-macos .vargo-menu-overlay__login:hover { background: rgba(255,255,255,.18); }
body.vargo-macos .vargo-menu-overlay__meta a { color: rgba(255,255,255,.78); }


/* =======================================================================
   Sistema único de botones (2 variantes por contexto, mismo tamaño y forma)
   - Sobre bandas oscuras: primario = blanco · secundario = contorno transparente
   - Sobre bandas claras:  primario = azul  · secundario = blanco con borde
   ===================================================================== */
body.vargo-macos .vargo-btn--ghost-el .elementor-button,
body.vargo-macos .vargo-btn-ghost-light .elementor-button,
body.vargo-macos .vargo-hero .vargo-btn--ghost-el .elementor-button,
body.vargo-macos .vargo-tint-1 .vargo-btn--ghost-el .elementor-button,
body.vargo-macos .vargo-tint-4 .vargo-btn--ghost-el .elementor-button,
body.vargo-macos .vargo-hero--dark .elementor-widget-button.vargo-btn-ghost-light .elementor-button,
body.vargo-macos .vargo-menu-overlay__login {
	background: transparent !important; color: #fff !important;
	border: 1.5px solid rgba(255,255,255,.6) !important; box-shadow: none !important;
	-webkit-backdrop-filter: none; backdrop-filter: none;
}
body.vargo-macos .vargo-btn--ghost-el .elementor-button:hover,
body.vargo-macos .vargo-btn-ghost-light .elementor-button:hover,
body.vargo-macos .vargo-menu-overlay__login:hover { background: rgba(255,255,255,.14) !important; border-color: #fff !important; filter: none; }
/* secundario sobre bandas claras */
body.vargo-macos .vargo-white .vargo-btn--ghost-el .elementor-button,
body.vargo-macos .vargo-tint-2 .vargo-btn--ghost-el .elementor-button,
body.vargo-macos .vargo-tint-3 .vargo-btn--ghost-el .elementor-button,
body.vargo-macos .vargo-tint-5 .vargo-btn--ghost-el .elementor-button,
body.vargo-macos .vargo-plan__cta--ghost .elementor-button {
	background: #fff !important; color: #0D2231 !important;
	border: 1.5px solid rgba(13,34,49,.18) !important; box-shadow: none !important;
}
body.vargo-macos .vargo-plan__cta--ghost .elementor-button:hover { border-color: #26A9E0 !important; color: #1487BE !important; background: #fff !important; }
/* mismo tamaño en todos los botones de contenido y en el drawer */
body.vargo-macos .elementor-button, body.vargo-macos .vargo-btn:not(.vargo-btn--sm),
body.vargo-macos .vargo-menu-overlay__login { padding: 16px 32px !important; font-size: 15.5px !important; border-radius: 999px !important; }
body.vargo-macos .vargo-menu-overlay__login { padding: 15px 24px !important; }

/* plan destacado (fondo azul): primario blanco como en el resto de bandas oscuras */
body.vargo-macos .vargo-plan__card.is-featured .elementor-button,
body.vargo-macos .vargo-plan__card--featured .elementor-button,
body.vargo-macos .vargo-plan__card:has(.vargo-plan__cta:not(.vargo-plan__cta--ghost)) .elementor-button {
	background: #fff !important; color: #0E6E9E !important; border: 0 !important; box-shadow: 0 10px 30px rgba(0,0,0,.25) !important;
}
body.vargo-macos .vargo-plan__card:has(.vargo-plan__cta:not(.vargo-plan__cta--ghost)) [class*="billing"],
body.vargo-macos .vargo-plan__card:has(.vargo-plan__cta:not(.vargo-plan__cta--ghost)) .vargo-plan__note { color: #BFE8F9 !important; }
body.vargo-macos .vargo-plan__card:has(.vargo-plan__cta:not(.vargo-plan__cta--ghost)) .vargo-plan__bill { color: #BFE8F9 !important; }

/* ---- Tarjeta "Adicional: API para desarrolladores" ---- */
body.vargo-macos .vargo-partner--api.elementor-widget-icon-box { cursor: pointer; }
body.vargo-macos .vargo-partner--api .elementor-icon-box-wrapper { align-items: center; height: 100%; }
body.vargo-macos .vargo-partner--api .elementor-icon-box-wrapper { flex-direction: row; align-items: center; gap: 18px; text-align: left; }
body.vargo-macos .vargo-partner--api .elementor-icon-box-icon { margin: 0 !important; }
body.vargo-macos .vargo-partner--api .elementor-icon { width: 52px !important; height: 52px !important; border-radius: 14px !important; background: #fff !important; display: grid; place-items: center; font-size: 22px !important; }
body.vargo-macos .vargo-partner--api .elementor-icon, body.vargo-macos .vargo-partner--api .elementor-icon i { color: #0E6E9E !important; }
body.vargo-macos .vargo-partner--api .elementor-icon svg, body.vargo-macos .vargo-partner--api .elementor-icon svg * { fill: #0E6E9E !important; }
body.vargo-macos .vargo-tint-1 .vargo-partner--api.elementor-widget-icon-box { background: rgba(255,255,255,.14) !important; border: 1px solid rgba(255,255,255,.3) !important; box-shadow: none !important; }
body.vargo-macos .vargo-partner--api .elementor-icon-box-title { font-size: 1.05rem !important; }
body.vargo-macos .vargo-partner--api .elementor-icon-box-title a::after { content: " \2192"; }
body.vargo-macos .vargo-partner--api.elementor-widget-icon-box { display: flex; align-items: center; }
body.vargo-macos .vargo-partner--api .elementor-widget-container { width: 100%; }


/* Con el marcado "clásico" de Elementor (producción) cada widget lleva un
   .elementor-widget-container interior: nunca debe duplicar borde/fondo/sombra. */
.vargo-macos .elementor-widget-icon-box > .elementor-widget-container,
.vargo-macos .elementor-widget-image-box > .elementor-widget-container,
.vargo-macos .elementor-widget-image > .elementor-widget-container,
.vargo-macos .elementor-widget-testimonial > .elementor-widget-container,
.vargo-macos .vargo-chip > .elementor-widget-container,
.vargo-macos .vargo-partner > .elementor-widget-container,
.vargo-macos .vargo-stats .elementor-widget-container {
	background: transparent !important; border: 0 !important; box-shadow: none !important;
	-webkit-backdrop-filter: none !important; backdrop-filter: none !important; border-radius: 0 !important;
}


/* Botón de cerrar (×) del menú móvil: la X se dibuja con líneas para que quede centrada */
body.vargo-macos .vargo-menu-close {
	position: absolute; padding: 0; font-size: 0; line-height: 0; color: transparent;
	display: grid; place-items: center;
	background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.28);
}
body.vargo-macos .vargo-menu-close::before,
body.vargo-macos .vargo-menu-close::after {
	content: ''; position: absolute; left: 50%; top: 50%; width: 16px; height: 2px; border-radius: 2px; background: #fff;
	transform: translate(-50%, -50%) rotate(45deg);
}
body.vargo-macos .vargo-menu-close::after { transform: translate(-50%, -50%) rotate(-45deg); }
body.vargo-macos .vargo-menu-close:hover { transform: none; background: rgba(255,255,255,.16); }

/* ---- Tarjetas de integraciones: logo alineado con el texto, mismo tamaño en todas las pantallas ---- */
body.vargo-macos .vargo-partner .elementor-image-box-wrapper { display: flex; flex-direction: column; align-items: flex-start; text-align: left; gap: 10px; }
body.vargo-macos .vargo-partner .elementor-image-box-img {
	width: 46px !important; height: 46px !important; min-width: 46px; margin: 0 !important; padding: 0 !important;
	display: block; flex: 0 0 46px; align-self: flex-start;
}
body.vargo-macos .vargo-partner .elementor-image-box-img img { width: 46px !important; height: 46px !important; max-width: none; object-fit: contain; margin: 0; display: block; }
body.vargo-macos .vargo-partner .elementor-image-box-content { width: 100%; text-align: left; margin: 0 !important; padding: 0 !important; }
@media (max-width: 900px) {
	body.vargo-macos .vargo-partner.elementor-widget-image-box,
	body.vargo-macos .vargo-partner.elementor-widget-icon-box { padding: 18px 20px !important; }
	body.vargo-macos .vargo-partners-row .elementor-column { margin-bottom: 12px; }
	body.vargo-macos .vargo-partners-row { margin-bottom: 0; }
}

/* =======================================================================
   Hero en móvil: más impacto (escritorio no cambia)
   ===================================================================== */
@media (max-width: 767px) {
	body.vargo-macos .vargo-hero.elementor-section {
		padding-top: 36px !important; padding-bottom: 44px !important;
		background:
			radial-gradient(420px 320px at 85% 0%, rgba(138,214,242,.55), transparent 65%),
			radial-gradient(380px 300px at 0% 42%, rgba(38,169,224,.45), transparent 65%),
			radial-gradient(360px 300px at 100% 92%, rgba(90,140,255,.35), transparent 65%),
			linear-gradient(170deg, #0B2331 0%, #0D4468 50%, #1487BE 100%) !important;
	}
	/* etiqueta en píldora */
	body.vargo-macos .vargo-hero .vargo-eyebrow,
	body.vargo-macos .vargo-hero .elementor-widget-heading h6.elementor-heading-title {
		display: inline-block; padding: 7px 14px; border-radius: 999px;
		background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.28);
		-webkit-backdrop-filter: var(--vm-blur); backdrop-filter: var(--vm-blur);
		font-size: 11px !important; letter-spacing: .16em !important; color: #CFF0FD !important;
	}
	/* titular grande con degradado */
	body.vargo-macos .vargo-hero h1.elementor-heading-title {
		font-size: clamp(2.5rem, 12vw, 3.2rem) !important; line-height: 1.04 !important; font-weight: 800; letter-spacing: -.045em;
		background: linear-gradient(180deg, #FFFFFF 30%, #9EDDF7 100%);
		-webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent !important;
		text-shadow: none;
	}
	body.vargo-macos .vargo-hero .vargo-hero__text { font-size: 17px; color: rgba(255,255,255,.86) !important; line-height: 1.55; }
	body.vargo-macos .vargo-hero .vargo-hero__text strong { color: #fff; }
	/* botón principal con brillo y flecha */
	body.vargo-macos .vargo-hero .elementor-widget-button:not(.vargo-btn--ghost-el) .elementor-button {
		font-size: 17px !important; padding: 18px 28px !important;
		box-shadow: 0 0 0 6px rgba(255,255,255,.14), 0 18px 40px rgba(0,0,0,.3) !important;
	}
	body.vargo-macos .vargo-hero .elementor-widget-button:not(.vargo-btn--ghost-el) .elementor-button-text::after { content: "  \2192"; }
	/* checks en tarjeta de vidrio */
	body.vargo-macos .vargo-hero .elementor-widget-icon-list {
		background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.16); border-radius: 18px; padding: 14px 16px;
		-webkit-backdrop-filter: var(--vm-blur); backdrop-filter: var(--vm-blur);
	}
	body.vargo-macos .vargo-hero .elementor-icon-list-text { color: #fff !important; }
	/* mockup con más presencia */
	body.vargo-macos .vargo-hero__media { margin-top: 28px; }
	body.vargo-macos .vargo-hero__media .elementor-widget-image { box-shadow: 0 30px 80px rgba(2,10,30,.55), 0 0 0 6px rgba(255,255,255,.10) !important; transform: none; }
}

/* Contacto: dos botones juntos y centrados (agenda + WhatsApp) */
@media (min-width: 768px) {
	body.vargo-macos .vargo-contact-cta .elementor-container { justify-content: center; gap: 16px; }
	body.vargo-macos .vargo-contact-cta .elementor-column[class*="elementor-col-"] { width: auto !important; flex: 0 0 auto; padding: 0; }
}
@media (max-width: 767px) { body.vargo-macos .vargo-contact-cta .elementor-column { padding: 0; } }
@media (max-width: 767px) { body.vargo-macos .vargo-contact-cta .elementor-column { width: 100% !important; } body.vargo-macos .vargo-contact-cta .elementor-button { width: 100%; } }

/* WhatsApp: verde */
body.vargo-macos .elementor-widget-button.vargo-btn--wa .elementor-button {
	background: linear-gradient(180deg, #2BD46A, #1DA851) !important; color: #fff !important; border: 0 !important;
	box-shadow: 0 1px 0 rgba(255,255,255,.3) inset, 0 10px 26px rgba(37,211,102,.35) !important;
}
body.vargo-macos .elementor-widget-button.vargo-btn--wa .elementor-button:hover { filter: brightness(1.06); }
body.vargo-macos .vargo-btn--wa .elementor-button-text::before { content: ""; display: inline-block; width: 1.15em; height: 1.15em; margin-right: 8px; vertical-align: -.2em;
	background: no-repeat center / contain url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'><path d='M12 2a10 10 0 0 0-8.6 15.1L2 22l5.1-1.3A10 10 0 1 0 12 2zm0 18.2a8.2 8.2 0 0 1-4.2-1.2l-.3-.2-3 .8.8-2.9-.2-.3A8.2 8.2 0 1 1 12 20.2zm4.5-6.1c-.2-.1-1.5-.7-1.7-.8s-.4-.1-.6.1-.7.8-.8 1-.3.2-.6.1a6.700 6.700 0 0 1-3.300-2.900c-.2-.4.2-.4.7-1.300.1-.2 0-.3 0-.4l-.8-1.800c-.2-.5-.4-.4-.6-.4h-.5a1 1 0 0 0-.7.3 3 3 0 0 0-.9 2.200 5.200 5.200 0 0 0 1.100 2.800 11.900 11.900 0 0 0 4.600 4c1.700.7 2.400.8 3.200.6a2.800 2.800 0 0 0 1.800-1.300 2.200 2.200 0 0 0 .2-1.300c-.1-.1-.3-.2-.6-.3z'/></svg>");
}
/* Móvil: botones de Contacto apilados y juntos */
@media (max-width: 767px) {
	body.vargo-macos .vargo-contact-cta .elementor-container { gap: 0; }
	body.vargo-macos .vargo-contact-cta .elementor-column { margin: 0; padding: 0 !important; }
	body.vargo-macos .vargo-contact-cta .elementor-widget-wrap { padding: 0 !important; }
	body.vargo-macos .vargo-contact-cta .elementor-widget-button { margin: 0 0 20px !important; }
	body.vargo-macos .vargo-contact-cta .elementor-column:last-child .elementor-widget-button { margin-bottom: 0 !important; }
}

/* la clase vargo-btn--lg cae en el contenedor del widget: no debe añadirle relleno */
body.vargo-macos .elementor-widget-button.vargo-btn--lg, body.vargo-macos .elementor-widget-button.vargo-btn--sm { padding: 0 !important; }

/* Si la banda azul queda pegada al hero (p. ej. sin franja de clientes), pasa a claro para no fundirse con él */
body.vargo-macos .elementor-top-section.vargo-hero + .elementor-top-section.vargo-tint-1 {
	--vargo-text: #0D2231; --vargo-text-muted: #5B6B78; --vargo-ink-soft: #3C4C57;
	--vargo-border: rgba(13,34,49,.09); --vargo-surface: #FFFFFF; --vargo-primary: #26A9E0; --vargo-secondary: #0E6E9E;
	--vm-h: #0D2231; --vm-t: #5B6B78; --vm-card: #FFFFFF; --vm-card-bd: rgba(13,34,49,.08);
	--vm-shadow: 0 1px 2px rgba(13,34,49,.04), 0 20px 50px rgba(38,169,224,.14); --vm-accent: #1487BE;
	background: #EAF6FC !important;
}
