/* Piel de la portada (tarjeta IEwzpDJu). Lleva los bloques de Avada de la portada
   al sistema de diseño sin tocar su contenido: mismos bloques, mismo orden, mismos
   textos (la portada se mejora por pasos, O4TumpLR). Sólo usa variables del sistema
   (conexcol-sistema.css). Todo selector empieza por body.cx-piel-portada; la carga
   el tema hijo cuando la página tiene el metadato _cx_piel=portada.

   Avada pinta cada contenedor con variables --awb-* en línea: se redefinen con
   !important, que gana a una declaración en línea sin él. */

/* --- Orden (cWUeL6K9): un borde, un ritmo, nada centrado ------------------------
   David la vio «medio desorganizada». Medido contra /aplicaciones/: allí todo arranca
   en el mismo borde, cada sección tiene el mismo espacio arriba y el título va pegado
   a su contenido. Aquí había 50–135 px sobre los títulos, 5–172 px del título a su
   contenido y dos bordes (55 y 76 px). */
body.cx-piel-portada { --cx-inset: var(--space-4); --cx-ritmo: var(--space-8); --cx-titulo-contenido: var(--space-6); }
@media (max-width: 640px) { body.cx-piel-portada { --cx-inset: var(--space-2); --cx-ritmo: var(--space-7); --cx-titulo-contenido: var(--space-5); } }
/* El mismo espacio sobre cada sección, y nada debajo: lo pone la siguiente. */
body.cx-piel-portada #main .fusion-fullwidth:is(.fusion-builder-row-3, .fusion-builder-row-4, .fusion-builder-row-10, .fusion-builder-row-12, .fusion-builder-row-13, .fusion-builder-row-14, .fusion-builder-row-15) { --awb-padding-top: var(--cx-ritmo) !important; --awb-padding-bottom: 0px !important; }
body.cx-piel-portada #main .fusion-fullwidth:is(.fusion-builder-row-5, .fusion-builder-row-6, .fusion-builder-row-7, .fusion-builder-row-8, .fusion-builder-row-9) { --awb-padding-top: var(--space-6) !important; --awb-padding-bottom: 0px !important; }
body.cx-piel-portada #main .fusion-fullwidth.fusion-builder-row-15 { --awb-padding-bottom: var(--cx-ritmo) !important; }
body.cx-piel-portada #main .fusion-fullwidth.fusion-builder-row-16 { --awb-padding-top: var(--cx-ritmo) !important; --awb-padding-bottom: var(--cx-ritmo) !important; }
body.cx-piel-portada #main .fusion-fullwidth:is(.fusion-builder-row-11, .fusion-builder-row-17) { --awb-padding-top: var(--cx-ritmo) !important; --awb-padding-bottom: var(--cx-ritmo) !important; }
body.cx-piel-portada #main .fusion-fullwidth:not(.fusion-builder-row-1, .fusion-builder-row-11, .fusion-builder-row-17) .fusion-layout-column { margin-bottom: 0 !important; }
/* Título, subtítulo y contenido: 12 px y luego 32 px, en todas. Los separadores de Avada eran
   los que daban cada vez un espacio distinto. */
body.cx-piel-portada #main .fusion-fullwidth:not(.fusion-builder-row-1, .fusion-builder-row-11) .fusion-separator.fusion-full-width-sep { display: none !important; }
body.cx-piel-portada #main .fusion-fullwidth:not(.fusion-builder-row-1) .fusion-title:has(> h2) { margin: 0 0 var(--space-3) !important; }
body.cx-piel-portada #main .fusion-fullwidth:not(.fusion-builder-row-1) .fusion-title:has(> h3) { margin: 0 !important; }
body.cx-piel-portada #main .fusion-builder-row-3 .fusion-layout-column + .fusion-layout-column,
body.cx-piel-portada #main .fusion-builder-row-4 .cxh-seg,
body.cx-piel-portada #main .fusion-builder-row-12 .fusion-testimonials,
body.cx-piel-portada #main .fusion-builder-row-13 .cxm-wall,
body.cx-piel-portada #main .fusion-builder-row-10 .fusion-content-boxes { margin-top: var(--cx-titulo-contenido) !important; }
body.cx-piel-portada #main .fusion-builder-row-4 .fusion-column-wrapper > p { margin: 0 !important; }
body.cx-piel-portada #main .fusion-builder-row-4 .cxh-seg { margin-left: 0 !important; margin-right: auto !important; }
/* El widget de Reputación Verificada viene centrado de fábrica. */
body.cx-piel-portada #main .fusion-builder-row-3 .counters-box + div, body.cx-piel-portada #main .fusion-builder-row-3 .counters-box + div > * { text-align: left !important; margin-left: 0 !important; }
body.cx-piel-portada #main .fusion-builder-row-3 .counters-box + div,
body.cx-piel-portada #main .fusion-builder-row-12 .fusion-text-13 { margin-top: var(--space-6) !important; }
/* Súbete a la nube: título arriba, no centrado en vertical con la ilustración. */
body.cx-piel-portada #main .fusion-builder-row-10 .fusion-layout-column { align-self: flex-start !important; }
/* Nada centrado bajo un título alineado a la izquierda. */
body.cx-piel-portada #main .fusion-builder-row-12 .fusion-testimonials { --awb-margin-left: 0px !important; --awb-margin-right: 0px !important; margin-left: 0 !important; margin-right: 0 !important; }
body.cx-piel-portada #main .fusion-builder-row-12 .fusion-builder-row-inner { justify-content: flex-start !important; gap: var(--space-3); margin: var(--space-6) 0 0 !important; width: auto !important; }
body.cx-piel-portada #main .fusion-builder-row-12 .cxh-cta { width: auto !important; flex: 0 0 auto !important; padding: 0 !important; margin: 0 !important; }
body.cx-piel-portada #main .fusion-builder-row-12 .cxh-cta .fusion-column-wrapper { align-items: flex-start !important; margin: 0 !important; }
body.cx-piel-portada #main .fusion-builder-row-12 .cxh-cta .fusion-button { margin-top: 0 !important; }
body.cx-piel-portada #main .fusion-builder-row-13 .cxm-wall { justify-content: flex-start !important; max-width: none !important; margin-left: 0 !important; margin-right: 0 !important; gap: var(--space-6) var(--space-7) !important; padding: 0 !important; }
/* Logos en rejilla: con anchos fijos distintos y blanco dentro de cada imagen, una fila
   flexible dejaba huecos desiguales. En columnas, cada logo arranca en su sitio. */
body.cx-piel-portada #main .fusion-builder-row-13 .cxm-wall { display: grid !important; grid-template-columns: repeat(5, minmax(0, 1fr)); align-items: center; justify-items: start; }
body.cx-piel-portada #main .fusion-builder-row-13 .cxm-logo { width: auto !important; max-width: 100%; justify-content: flex-start !important; }
body.cx-piel-portada #main .fusion-builder-row-13 .cxm-logo img { max-width: 100% !important; height: auto !important; max-height: 40px; }
@media (max-width: 800px) { body.cx-piel-portada #main .fusion-builder-row-13 .cxm-wall { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-5) var(--space-5) !important; } }
/* Subtítulos que traen estilo en línea (caja centrada de 700 px a 19 px): como los demás. */
body.cx-piel-portada #main .fusion-fullwidth:not(.fusion-builder-row-1, .fusion-builder-row-11, .fusion-builder-row-17) .fusion-text > p { margin-left: 0 !important; margin-right: 0 !important; }
body.cx-piel-portada #main :is(.fusion-builder-row-13 .fusion-text-14, .fusion-builder-row-15 .fusion-text-15) p { max-width: 56ch !important; font-size: 17px !important; line-height: 27px !important; color: var(--texto-2) !important; }
body.cx-piel-portada #main .fusion-builder-row-11 .fusion-column-wrapper > div:has(> .fusion-button) { text-align: left !important; }
body.cx-piel-portada #main .fusion-builder-row-17 .fusion-layout-column:has(.fusion-button) .fusion-column-wrapper { align-items: flex-end !important; text-align: right !important; }
/* Novedades: del ancho del contenido, no más ancho. */
body.cx-piel-portada #main .fusion-builder-row-14 .cxb { max-width: var(--site_width, 1170px) !important; }
/* Conexcol en un minuto: título a la izquierda y vídeo a la derecha (FilaDestacada). */
@media (min-width: 801px) {
	body.cx-piel-portada #main .fusion-builder-row-15 .fusion-column-wrapper { display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(0, 1.9fr); grid-template-rows: auto 1fr; column-gap: var(--space-7); align-items: start; }
	body.cx-piel-portada #main .fusion-builder-row-15 .fusion-column-wrapper > .fusion-title { grid-column: 1; grid-row: 1; }
	body.cx-piel-portada #main .fusion-builder-row-15 .fusion-column-wrapper > .fusion-text { grid-column: 1; grid-row: 2; }
	body.cx-piel-portada #main .fusion-builder-row-15 .fusion-column-wrapper > lite-youtube { grid-column: 2; grid-row: 1 / span 2; width: 100% !important; max-width: none !important; }
}
@media (max-width: 800px) { body.cx-piel-portada #main .fusion-builder-row-15 lite-youtube { margin-top: var(--cx-titulo-contenido) !important; } }

/* --- Titulares de sección: a la izquierda, en tinta, 40/44 a peso 500 -------- */
body.cx-piel-portada #main .fusion-fullwidth:not(.fusion-builder-row-1) .fusion-title { justify-content: flex-start !important; text-align: left !important; margin-left: 0 !important; }
body.cx-piel-portada #main .fusion-fullwidth:not(.fusion-builder-row-1) .fusion-title h2.fusion-title-heading,
body.cx-piel-portada #main .fusion-builder-row-11 .fusion-text h2 { text-align: left !important; max-width: 22ch; font-size: 40px !important; line-height: 44px !important; font-weight: 500 !important; letter-spacing: -.03em !important; color: var(--tinta) !important; text-wrap: balance; }
/* Sobre el azul (Datacenter y cierre), en blanco. Misma especificidad que la de arriba, y después. */
body.cx-piel-portada #main .fusion-fullwidth.fusion-builder-row-17:not(.fusion-builder-row-1) .fusion-title h2.fusion-title-heading,
body.cx-piel-portada #main .fusion-fullwidth.fusion-builder-row-11:not(.fusion-builder-row-1) .fusion-text h2 { color: var(--on-hero) !important; }
/* Sin textos centrados: lo que acompaña a un titular va alineado con él. */
body.cx-piel-portada #main .fusion-fullwidth:not(.fusion-builder-row-1) :is(.fusion-text, .fusion-text :is(p, h3), .fusion-column-wrapper > p) { text-align: left !important; }
body.cx-piel-portada #main .fusion-fullwidth:not(.fusion-builder-row-1) .fusion-title h3.fusion-title-heading { text-align: left !important; max-width: 56ch; font-size: 17px !important; line-height: 27px !important; font-weight: 400 !important; letter-spacing: 0 !important; color: var(--texto-2) !important; }
@media (max-width: 640px) {
	body.cx-piel-portada #main .fusion-fullwidth:not(.fusion-builder-row-1) .fusion-title h2.fusion-title-heading,
	body.cx-piel-portada #main .fusion-builder-row-11 .fusion-text h2 { font-size: 28px !important; line-height: 32px !important; }
}

/* --- Botones de Avada: cápsula a 15/500 (la global ya quitó las mayúsculas) --- */
body.cx-piel-portada #main .fusion-button { border-radius: var(--radio-capsula) !important; font-weight: 500 !important; letter-spacing: -.005em; box-shadow: none !important; }
body.cx-piel-portada #main .fusion-button .fusion-button-text { font-size: 15px !important; line-height: 20px !important; font-weight: 500 !important; }

/* --- Sin ondas ni separadores de nube: el sistema no los usa ------------------- */
body.cx-piel-portada #main .fusion-layout-column:has(> .fusion-column-wrapper > .fusion-section-separator:only-child) { display: none !important; }
body.cx-piel-portada #main .fusion-section-separator { display: none !important; }

/* --- 1. Hero: el azul como bloque metido en el margen -------------------------- */
body.cx-piel-portada .fusion-builder-row-1 {
	margin: var(--space-4) calc(var(--cx-inset) - var(--hundredp_padding, 30px)) 0 !important;
	padding-left: calc(var(--hundredp_padding, 30px) - var(--cx-inset)) !important;
	padding-right: calc(var(--hundredp_padding, 30px) - var(--cx-inset)) !important;
	border-radius: var(--radio-bloque) !important;
	overflow: hidden;
	isolation: isolate;
	--awb-background-color: var(--hero) !important;
	background-color: var(--hero) !important;
	background-image: radial-gradient(55% 80% at 92% 0%, color-mix(in srgb, var(--hero-brillo) 55%, transparent), transparent 70%) !important;
	--awb-padding-top: var(--space-8) !important;
	--awb-padding-bottom: var(--space-8) !important;
}
body.cx-piel-portada .fusion-builder-row-1 > .awb-background-mask,
body.cx-piel-portada .fusion-builder-row-1 > .awb-background-pattern { display: none !important; }
body.cx-piel-portada .fusion-builder-row-1::before {
	content: ""; position: absolute; z-index: -1; inset: 0; pointer-events: none;
	background-image: var(--textura-circuito); background-size: 304px; opacity: .5;
	-webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 55%); mask-image: linear-gradient(90deg, transparent 0%, #000 55%);
}
body.cx-piel-portada .fusion-builder-row-1 h1.fusion-title-heading { font-size: 56px !important; line-height: 58px !important; font-weight: 500 !important; letter-spacing: -.035em !important; max-width: none; text-wrap: balance; color: var(--on-hero) !important; }
body.cx-piel-portada .fusion-builder-row-1 h2.fusion-title-heading { font-size: 20px !important; line-height: 30px !important; font-weight: 400 !important; letter-spacing: -.005em !important; max-width: 46ch; color: var(--on-hero) !important; opacity: .92; }
body.cx-piel-portada .fusion-builder-row-1 .cxh-rating { font-size: 15px !important; line-height: 22px !important; opacity: .92; }
body.cx-piel-portada .fusion-builder-row-1 .cxh-rating a { color: var(--on-hero) !important; }
/* Acciones: `claro` + `contorno-claro`, como el componente Hero. */
body.cx-piel-portada .fusion-builder-row-1 .fusion-button { min-height: 52px; padding: 12px 24px !important; }
body.cx-piel-portada .fusion-builder-row-1 .fusion-layout-column:nth-child(1 of .fusion-layout-column:has(.fusion-button)) .fusion-button { background: var(--on-hero) !important; border: 1px solid transparent !important; }
body.cx-piel-portada .fusion-builder-row-1 .fusion-layout-column:nth-child(1 of .fusion-layout-column:has(.fusion-button)) .fusion-button .fusion-button-text { color: var(--hero) !important; }
body.cx-piel-portada .fusion-builder-row-1 .fusion-layout-column:nth-child(1 of .fusion-layout-column:has(.fusion-button)) .fusion-button:hover { opacity: .92; }
body.cx-piel-portada .fusion-builder-row-1 .fusion-layout-column:nth-child(2 of .fusion-layout-column:has(.fusion-button)) .fusion-button { background: rgba(255, 255, 255, .08) !important; border: 1px solid rgba(255, 255, 255, .55) !important; }
body.cx-piel-portada .fusion-builder-row-1 .fusion-layout-column:nth-child(2 of .fusion-layout-column:has(.fusion-button)) .fusion-button .fusion-button-text { color: var(--on-hero) !important; }
body.cx-piel-portada .fusion-builder-row-1 .fusion-layout-column:nth-child(2 of .fusion-layout-column:has(.fusion-button)) .fusion-button:hover { background: var(--on-hero) !important; }
body.cx-piel-portada .fusion-builder-row-1 .fusion-layout-column:nth-child(2 of .fusion-layout-column:has(.fusion-button)) .fusion-button:hover .fusion-button-text { color: var(--hero) !important; }
/* Buscador de dominio: cápsula (el formulario y su envío no cambian). */
body.cx-piel-portada .fusion-builder-row-1 form.domain input.domain { border-radius: var(--radio-capsula) !important; height: 52px; padding-left: var(--space-5) !important; box-shadow: 0 1px 2px rgba(11, 37, 64, .06); }
@media (max-width: 640px) {
	body.cx-piel-portada .fusion-builder-row-1 { margin-top: var(--space-2) !important; border-radius: var(--radio-destacada) !important; --awb-padding-top: var(--space-6) !important; --awb-padding-bottom: var(--space-6) !important; }
	body.cx-piel-portada .fusion-builder-row-1 h1.fusion-title-heading { font-size: 36px !important; line-height: 40px !important; }
	body.cx-piel-portada .fusion-builder-row-1 h2.fusion-title-heading { font-size: 17px !important; line-height: 26px !important; }
}

/* --- 3. Cifras: número grande en tinta, rótulo en mono, filete a la izquierda --- */
body.cx-piel-portada .fusion-counters-box { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-5); margin: 0 !important; }
body.cx-piel-portada .fusion-counters-box::before, body.cx-piel-portada .fusion-counters-box::after { display: none !important; }
body.cx-piel-portada #main .fusion-counters-box .fusion-counter-box { width: auto !important; padding: 0 !important; margin: 0 !important; float: none !important; }
body.cx-piel-portada #main .fusion-counters-box .counter-box-container { width: 100% !important; box-sizing: border-box; text-align: left !important; padding: 0 0 0 var(--space-4) !important; border-left: 1px solid var(--linea); }
body.cx-piel-portada .fusion-counters-box .content-box-percentage { font: 500 48px/48px var(--font-sans) !important; letter-spacing: -.03em; color: var(--tinta) !important; font-variant-numeric: tabular-nums; }
body.cx-piel-portada .fusion-counters-box .content-box-percentage .unit { font-size: inherit !important; color: inherit !important; }
body.cx-piel-portada .fusion-counters-box .counter-box-content { margin-top: var(--space-2) !important; font: 400 13px/18px var(--font-mono) !important; color: var(--texto-3) !important; text-align: left !important; }
@media (max-width: 800px) { body.cx-piel-portada .fusion-counters-box { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5) var(--space-3); } body.cx-piel-portada .fusion-counters-box .content-box-percentage { font-size: 36px !important; line-height: 40px !important; } }

/* --- 4. Pestañas de planes: control segmentado --------------------------------- */
body.cx-piel-portada .cxh-seg { display: inline-flex !important; width: fit-content; max-width: 100%; flex-wrap: wrap; gap: 2px !important; padding: 4px !important; border-radius: var(--radio-capsula); background: var(--nube); border: 1px solid var(--linea); justify-content: flex-start !important; }
body.cx-piel-portada .cxh-seg button { border: 0 !important; background: transparent !important; box-shadow: none !important; padding: 7px 16px !important; border-radius: var(--radio-capsula) !important; font: 500 14px/18px var(--font-sans) !important; color: var(--texto-2) !important; }
body.cx-piel-portada .cxh-seg button[aria-selected="true"] { background: var(--superficie) !important; color: var(--tinta) !important; box-shadow: 0 0 0 1px var(--linea) !important; }
body.cx-piel-portada .cxh-seg button:focus-visible { outline: none; box-shadow: var(--anillo-foco) !important; }
@media (max-width: 640px) { body.cx-piel-portada .cxh-seg { border-radius: var(--radio-destacada); } }
body.cx-piel-portada .fusion-builder-row-4 .fusion-column-wrapper > p { margin-left: 0 !important; }
body.cx-piel-portada .fusion-builder-row-4 .fusion-column-wrapper:has(> .cxh-seg) { align-items: flex-start !important; }

/* --- 5–8. Tarjetas de plan: TarjetaPrecio -------------------------------------- */
body.cx-piel-portada .fusion-column-wrapper:has(> .cxp) { background: var(--superficie) !important; border: 1px solid var(--linea) !important; border-radius: var(--radio-destacada) !important; box-shadow: none !important; overflow: visible; }
body.cx-piel-portada .fusion-column-wrapper:has(> .cxp .cxp-reco) { border-color: transparent !important; box-shadow: 0 0 0 2px var(--azul) !important; }
body.cx-piel-portada .cxp { text-align: left !important; padding: var(--space-6) !important; display: flex; flex-direction: column; gap: 0; height: 100%; }
body.cx-piel-portada .cxp-top { min-height: 26px; position: static !important; display: flex !important; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-2); margin: 0 0 var(--space-3) !important; padding: 0 !important; background: none !important; border: 0 !important; }
body.cx-piel-portada .cxp-line { font: 500 12px/16px var(--font-mono) !important; letter-spacing: .04em !important; text-transform: uppercase; color: var(--azul) !important; }
body.cx-piel-portada .cxp-reco { position: static !important; transform: none !important; order: 2; display: inline-flex; padding: 3px 10px !important; border-radius: var(--radio-capsula) !important; background: var(--azul-suave) !important; color: var(--azul-profundo) !important; font: 500 13px/18px var(--font-sans) !important; letter-spacing: 0 !important; text-transform: none !important; box-shadow: none !important; }
body.cx-piel-portada .cxp-name { text-align: left !important; margin: 0 !important; font: 600 22px/28px var(--font-sans) !important; letter-spacing: -.01em !important; color: var(--tinta) !important; }
body.cx-piel-portada .cxp-who { text-align: left !important; margin: 4px 0 0 !important; font-size: 15px !important; line-height: 22px !important; color: var(--texto-2) !important; min-height: 0 !important; }
body.cx-piel-portada .cxp-price { text-align: left !important; align-items: flex-start !important; margin: var(--space-5) 0 0 !important; padding: 0 !important; background: none !important; }
body.cx-piel-portada .cxp-old { font: 400 13px/18px var(--font-mono) !important; color: var(--texto-3) !important; }
body.cx-piel-portada .cxp-now { display: flex !important; align-items: baseline; gap: 2px; justify-content: flex-start !important; font: 500 48px/52px var(--font-sans) !important; letter-spacing: -.03em !important; color: var(--tinta) !important; font-variant-numeric: tabular-nums; }
body.cx-piel-portada .cxp-now sup { top: 0 !important; align-self: flex-start; margin-top: 6px; font-size: 22px !important; color: var(--tinta) !important; }
body.cx-piel-portada .cxp-now small { font: 400 14px/20px var(--font-sans) !important; letter-spacing: 0 !important; color: var(--texto-3) !important; margin-left: 4px; }
body.cx-piel-portada .cxp-promo { display: inline-flex !important; width: auto !important; align-self: flex-start; margin: var(--space-2) 0 0 !important; padding: 3px 10px 3px 8px !important; border-radius: var(--radio-capsula) !important; background: var(--acierto-suave) !important; color: var(--acierto) !important; font: 500 13px/18px var(--font-sans) !important; border: 0 !important; }
body.cx-piel-portada .cxp-renew { margin: 6px 0 0 !important; font: 400 13px/18px var(--font-mono) !important; color: var(--texto-3) !important; text-align: left !important; }
body.cx-piel-portada .cxp-res { justify-content: flex-start !important; align-items: center !important; flex-direction: row !important; display: flex !important; flex-wrap: wrap; gap: var(--space-2) !important; margin: var(--space-5) 0 0 !important; }
body.cx-piel-portada .cxp-chip { margin: 0 !important; padding: 4px 11px !important; border-radius: var(--radio-capsula) !important; background: var(--azul-suave) !important; color: var(--chip-texto) !important; border: 0 !important; box-shadow: none !important; font: 500 12px/18px var(--font-mono) !important; }
body.cx-piel-portada .cxp-chip svg { fill: var(--azul) !important; }
body.cx-piel-portada .cxp-lt { text-align: left !important; margin: var(--space-5) 0 0 !important; padding-top: var(--space-5); border-top: 1px solid var(--linea); font: 500 12px/16px var(--font-mono) !important; letter-spacing: .04em !important; color: var(--texto-3) !important; }
body.cx-piel-portada .cxp-list { margin: var(--space-3) 0 0 !important; padding: 0 !important; }
body.cx-piel-portada .cxp-list li { border: 0 !important; padding: 0 0 0 24px !important; margin: 0 0 10px !important; font: 400 13px/20px var(--font-mono) !important; color: var(--texto-2) !important; }
body.cx-piel-portada .cxp-list li b { font-weight: 500 !important; color: var(--tinta) !important; }
body.cx-piel-portada .cxp-list li::before { color: var(--verde) !important; }
body.cx-piel-portada .cxp-btn { margin-top: var(--space-6) !important; min-height: 48px; display: flex !important; align-items: center; justify-content: center; border-radius: var(--radio-capsula) !important; font: 500 15px/20px var(--font-sans) !important; box-shadow: none !important; background: var(--superficie) !important; color: var(--tinta) !important; border: 1px solid var(--linea) !important; }
body.cx-piel-portada .cxp-btn:hover { border-color: var(--linea-control) !important; }
body.cx-piel-portada .cxp:has(.cxp-reco) .cxp-btn { background: var(--verde) !important; color: var(--on-verde) !important; border-color: transparent !important; }
body.cx-piel-portada .cxp:has(.cxp-reco) .cxp-btn:hover { filter: brightness(.93); }
body.cx-piel-portada .cxp-trust { text-align: left !important; margin: var(--space-3) 0 0 !important; font-size: 12px !important; line-height: 17px !important; color: var(--texto-3) !important; }
@media (max-width: 600px) { body.cx-piel-portada .cxp-now { font-size: 40px !important; line-height: 44px !important; } body.cx-piel-portada .cxp-renew { margin: 6px 0 0 8px !important; } }
body.cx-piel-portada .cxh-more { text-align: left !important; }
body.cx-piel-portada .cxh-more a { color: var(--azul) !important; font-weight: 500 !important; }

/* --- 10. Súbete a la nube: tarjetas de producto -------------------------------- */
body.cx-piel-portada .fusion-builder-row-10 > .awb-background-mask,
body.cx-piel-portada .fusion-builder-row-10 > .awb-background-pattern { display: none !important; }
body.cx-piel-portada .fusion-builder-row-10 .content-box-column > .col { background: var(--superficie) !important; border: 1px solid var(--linea) !important; border-radius: var(--radio-destacada) !important; box-shadow: none !important; overflow: hidden; }
body.cx-piel-portada .fusion-builder-row-10 .content-box-heading { font: 600 22px/28px var(--font-sans) !important; letter-spacing: -.01em !important; color: var(--tinta) !important; }
body.cx-piel-portada .fusion-builder-row-10 .cxs-who { color: var(--texto) !important; font-weight: 500 !important; }
body.cx-piel-portada .fusion-builder-row-10 .cxs-list li { color: var(--texto-2) !important; }
body.cx-piel-portada .fusion-builder-row-10 .cxs-price { color: var(--texto-3) !important; }
body.cx-piel-portada .fusion-builder-row-10 .cxs-price strong { font: 500 28px/32px var(--font-sans) !important; letter-spacing: -.02em !important; color: var(--tinta) !important; font-variant-numeric: tabular-nums; }
body.cx-piel-portada .fusion-builder-row-10 .fusion-content-box-button { background: var(--azul) !important; border: 0 !important; }
body.cx-piel-portada .fusion-builder-row-10 .fusion-content-box-button .fusion-button-text { color: var(--on-azul) !important; }
body.cx-piel-portada .fusion-builder-row-10 .fusion-content-box-button:hover { background: var(--azul-profundo) !important; }

/* --- 11. Datacenter en Colombia: bloque azul en el margen, tarjetas sin sombra --- */
body.cx-piel-portada .fusion-builder-row-11 {
	margin: var(--cx-ritmo) calc(var(--cx-inset) - var(--hundredp_padding, 30px)) 0 !important;
	padding-left: calc(var(--hundredp_padding, 30px) - var(--cx-inset)) !important;
	padding-right: calc(var(--hundredp_padding, 30px) - var(--cx-inset)) !important;
	border-radius: var(--radio-bloque) !important;
	overflow: hidden;
	--awb-background-color: var(--hero) !important;
	background-color: var(--hero) !important;
	background-image: radial-gradient(closest-side at 10% 100%, color-mix(in srgb, var(--hero-brillo) 40%, transparent), transparent) !important;
}
body.cx-piel-portada .fusion-builder-row-11 .fusion-text-7 p { text-align: left !important; max-width: 64ch; color: var(--on-hero) !important; opacity: .92; }
body.cx-piel-portada .fusion-builder-row-11 .fusion_builder_column_1_4 > .fusion-column-wrapper { border-radius: var(--radio-tarjeta) !important; box-shadow: none !important; align-items: flex-start !important; text-align: left !important; }
body.cx-piel-portada .fusion-builder-row-11 .fusion_builder_column_1_4 .fusion-imageframe { width: 48px !important; max-width: 48px !important; margin: 0 !important; align-self: flex-start; }
body.cx-piel-portada .fusion-builder-row-11 .fusion_builder_column_1_4 .fusion-text h3 { text-align: left !important; text-transform: lowercase; font: 600 18px/24px var(--font-sans) !important; letter-spacing: -.01em !important; color: var(--tinta) !important; }
body.cx-piel-portada .fusion-builder-row-11 .fusion_builder_column_1_4 .fusion-text h3::first-letter { text-transform: uppercase; }
body.cx-piel-portada .fusion-builder-row-11 .fusion_builder_column_1_4 .fusion-text p { text-align: left !important; font-size: 15px !important; line-height: 24px !important; color: var(--texto-2) !important; }
body.cx-piel-portada .fusion-builder-row-11 .fusion-button { background: var(--on-hero) !important; border: 0 !important; }
body.cx-piel-portada .fusion-builder-row-11 .fusion-button .fusion-button-text { color: var(--hero) !important; }
@media (max-width: 640px) { body.cx-piel-portada .fusion-builder-row-11 { border-radius: var(--radio-destacada) !important; } }

/* --- 12. Opiniones: tarjetas de borde fino ------------------------------------- */
body.cx-piel-portada .fusion-testimonials .awb-quote { background: var(--nube) !important; border-radius: var(--radio-tarjeta) !important; color: var(--texto) !important; }
body.cx-piel-portada .fusion-testimonials .awb-triangle { border-top-color: var(--nube) !important; }
body.cx-piel-portada .cxl-reviews__summary { background: var(--nube) !important; border: 1px solid var(--linea) !important; border-radius: var(--radio-tarjeta) !important; }
body.cx-piel-portada .cxl-reviews__score { font-weight: 500 !important; letter-spacing: -.02em; color: var(--tinta) !important; }
body.cx-piel-portada .cxl-review { background: var(--superficie) !important; border: 1px solid var(--linea) !important; border-radius: var(--radio-tarjeta) !important; box-shadow: none !important; }
body.cx-piel-portada .cxl-review__text { color: var(--texto) !important; }
body.cx-piel-portada .cxl-review__author { font-family: var(--font-sans) !important; font-size: 14px !important; color: var(--tinta) !important; font-weight: 500 !important; }
body.cx-piel-portada .cxl-review__meta { font-family: var(--font-mono) !important; font-size: 12px !important; color: var(--texto-3) !important; }
body.cx-piel-portada .cxh-cta .fusion-button { background: var(--azul) !important; border: 1px solid transparent !important; }
body.cx-piel-portada .cxh-cta .fusion-button .fusion-button-text { color: var(--on-azul) !important; }
body.cx-piel-portada .cxh-cta + .cxh-cta .fusion-button { background: var(--superficie) !important; border-color: var(--linea) !important; }
body.cx-piel-portada .cxh-cta + .cxh-cta .fusion-button .fusion-button-text { color: var(--tinta) !important; }

/* --- 14. Novedades: franja noche con el radio del sistema ---------------------- */
body.cx-piel-portada .fusion-builder-row-14 .cxb { background: var(--noche) !important; border-radius: var(--radio-destacada) !important; max-width: calc(var(--contenedor) - 2 * var(--margen-escritorio)); margin-left: auto !important; margin-right: auto !important; overflow: hidden; }
body.cx-piel-portada .fusion-builder-row-14 .cxb-btn { background: var(--on-hero) !important; color: var(--noche) !important; border-radius: var(--radio-capsula) !important; box-shadow: none !important; font-weight: 500 !important; }
body.cx-piel-portada .fusion-builder-row-14 .cxb-label { background: var(--acierto-suave) !important; color: var(--acierto) !important; border-radius: var(--radio-capsula) !important; }

/* --- 15. Vídeo -------------------------------------------------------------------- */
body.cx-piel-portada .fusion-builder-row-15 > .awb-background-mask,
body.cx-piel-portada .fusion-builder-row-15 > .awb-background-pattern { display: none !important; }
body.cx-piel-portada .fusion-builder-row-15 :is(iframe, lite-youtube, .fusion-video, .cxh-video) { border-radius: var(--radio-destacada) !important; overflow: hidden; margin-left: 0 !important; }

/* --- 16. Preguntas: filetes, sin cajas ---------------------------------------- */
body.cx-piel-portada .fusion-builder-row-16 { --awb-background-color: var(--nube) !important; background-color: var(--nube) !important; }
body.cx-piel-portada .fusion-builder-row-16 .fusion-panel { background: transparent !important; border: 0 !important; border-bottom: 1px solid var(--linea) !important; border-radius: 0 !important; box-shadow: none !important; margin: 0 !important; }
body.cx-piel-portada .fusion-builder-row-16 .fusion-panel:first-child { border-top: 1px solid var(--linea) !important; }
body.cx-piel-portada .fusion-builder-row-16 .panel-title a { display: flex !important; flex-direction: row-reverse; justify-content: space-between; align-items: center; gap: var(--space-4); padding: var(--space-5) 0 !important; background: transparent !important; }
body.cx-piel-portada .fusion-builder-row-16 .fusion-toggle-heading { font: 500 18px/26px var(--font-sans) !important; letter-spacing: -.01em !important; color: var(--tinta) !important; margin: 0 !important; }
body.cx-piel-portada .fusion-builder-row-16 .fusion-toggle-icon-wrapper { background: transparent !important; color: var(--texto-3) !important; border: 0 !important; }
body.cx-piel-portada #main .fusion-builder-row-16 .fusion-toggle-icon-wrapper i::before { color: var(--texto-3) !important; }
body.cx-piel-portada #main .fusion-builder-row-16 .fusion-toggle-icon-wrapper i { color: var(--texto-3) !important; background: transparent !important; border: 0 !important; font-size: 16px !important; }
body.cx-piel-portada .fusion-builder-row-16 .panel-body { padding: 0 0 var(--space-5) !important; max-width: 64ch; font-size: 16px !important; line-height: 26px !important; color: var(--texto-2) !important; }
/* Llamar es la acción principal; el chat, la secundaria (cada botón va en su propio div). */
body.cx-piel-portada .fusion-builder-row-16 .cxh-faq-cta a.fusion-button { background: var(--azul) !important; border: 1px solid transparent !important; }
body.cx-piel-portada .fusion-builder-row-16 .cxh-faq-cta a.fusion-button :is(.fusion-button-text, i) { color: var(--on-azul) !important; }
body.cx-piel-portada .fusion-builder-row-16 .cxh-faq-cta a.fusion-button:has(.fa-comment-dots) { background: var(--superficie) !important; border-color: var(--linea) !important; }
body.cx-piel-portada .fusion-builder-row-16 .cxh-faq-cta a.fusion-button:has(.fa-comment-dots) :is(.fusion-button-text, i) { color: var(--tinta) !important; }

/* --- 17. Cierre: FranjaCTA, el bloque de marca en el margen --------------------- */
body.cx-piel-portada .fusion-builder-row-17 {
	margin: var(--cx-ritmo) calc(var(--cx-inset) - var(--hundredp_padding, 30px)) var(--cx-inset) !important;
	padding-left: calc(var(--hundredp_padding, 30px) - var(--cx-inset)) !important;
	padding-right: calc(var(--hundredp_padding, 30px) - var(--cx-inset)) !important;
	border-radius: var(--radio-bloque) !important;
	overflow: hidden;
	isolation: isolate;
	background-attachment: scroll !important;
	--awb-background-color: var(--hero) !important;
	background-color: var(--hero) !important;
	background-image: radial-gradient(closest-side at 10% 110%, color-mix(in srgb, var(--hero-brillo) 45%, transparent), transparent) !important;
}
body.cx-piel-portada .fusion-builder-row-17 > .fullwidth-faded { display: none !important; }
body.cx-piel-portada #main .fusion-builder-row-17 .fusion-title h2.fusion-title-heading { max-width: 18ch; }
body.cx-piel-portada .fusion-builder-row-17 .fusion-text p { color: var(--on-hero) !important; opacity: .9; }
body.cx-piel-portada .fusion-builder-row-17 .fusion-button { background: var(--on-hero) !important; border: 1px solid transparent !important; }
body.cx-piel-portada .fusion-builder-row-17 .fusion-button .fusion-button-text { color: var(--hero) !important; }
@media (max-width: 640px) { body.cx-piel-portada .fusion-builder-row-17 { border-radius: var(--radio-destacada) !important; } }