/* Voces UC — CSS propio mínimo. Todo lo demás viene del Kit Digital UC (y de sus CSS dev y del Plan).
   Solo lo que el diseño de Experiencia Digital define y el Kit no trae como clase: fondos de
   sección y colores de marca. No se cambian tamaños, márgenes ni espaciados de componentes del Kit. */

/* Color de acento del diseño de Voces (café). */
:root { --vc-cafe: #7a4632; }

/* ── Fondos de sección ───────────────────────────────────────────────────────────── */
.vc-bg-gris { background-color: var(--lightgray-c); }
.vc-bg-azul { background-color: var(--blue); }  /* Franja "Contacto" (token --blue del Kit). */
.vc-bg-404 { background: linear-gradient(180deg, #555 0%, #fff 50%); }

/* Degradado azul de los hero del diseño (reemplaza al .uc-hero__blue-gradient--left del Kit,
   más claro que el del Figma). Mismo rol y posición que el degradado del Kit. */
.vc-hero-degradado { z-index: -1; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(1, 24, 68, .9) 0%, rgba(1, 24, 68, .88) 40%, rgba(1, 24, 68, 0) 62%); }
.vc-hero-degradado--solido { background: linear-gradient(90deg, #011844 0%, #011844 32%, rgba(1, 24, 68, 0) 52%); }
@media (max-width: 991.98px) { .vc-hero-degradado, .vc-hero-degradado--solido { background: rgba(1, 24, 68, .78); } }

/* Círculos decorativos de fondo (beige del Destacado y franja azul de Contacto). */
.vc-fondo-circulos { position: relative; isolation: isolate; overflow: hidden; }
.vc-fondo-circulos::before,
.vc-fondo-circulos::after { content: ""; position: absolute; z-index: -1; pointer-events: none; background-repeat: no-repeat; }
.vc-fondo-circulos--beige::before {
	top: 0; left: 0; width: 230px; height: 230px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='230' height='230'%3E%3Ccircle cx='100' cy='-10' r='113' fill='%23ffecd1'/%3E%3Cg fill='none' stroke='%23e3bda4'%3E%3Ccircle cx='110' cy='2' r='32'/%3E%3Ccircle cx='110' cy='2' r='20'/%3E%3Ccircle cx='110' cy='2' r='8'/%3E%3Ccircle cx='12' cy='155' r='60'/%3E%3Ccircle cx='12' cy='155' r='40'/%3E%3Ccircle cx='12' cy='155' r='18'/%3E%3C/g%3E%3C/svg%3E");
}
.vc-fondo-circulos--beige::after {
	right: 0; bottom: 0; width: 280px; height: 330px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='280' height='330'%3E%3Ccircle cx='115' cy='225' r='105' fill='%23ffecd1'/%3E%3Ccircle cx='280' cy='165' r='30' fill='%23ffecd1'/%3E%3Cg fill='none' stroke='%23e3bda4'%3E%3Ccircle cx='275' cy='117' r='62'/%3E%3Ccircle cx='275' cy='117' r='42'/%3E%3Ccircle cx='275' cy='117' r='20'/%3E%3Ccircle cx='230' cy='330' r='88'/%3E%3Ccircle cx='230' cy='330' r='58'/%3E%3Ccircle cx='230' cy='330' r='28'/%3E%3C/g%3E%3C/svg%3E");
}
.vc-fondo-circulos--azul::before {
	top: 0; right: 0; width: 300px; height: 200px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='200'%3E%3Ccircle cx='200' cy='95' r='100' fill='%23ffffff' fill-opacity='.06'/%3E%3Cg fill='none' stroke='%23ffffff' stroke-opacity='.35'%3E%3Ccircle cx='95' cy='0' r='80'/%3E%3Ccircle cx='95' cy='0' r='52'/%3E%3Ccircle cx='95' cy='0' r='22'/%3E%3C/g%3E%3C/svg%3E");
}
.vc-fondo-circulos--azul::after {
	left: 0; right: 0; bottom: 0; height: 130px;
	background-image:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='280' height='130'%3E%3Ccircle cx='140' cy='185' r='125' fill='%23ffffff' fill-opacity='.06'/%3E%3Cg fill='none' stroke='%23ffffff' stroke-opacity='.35'%3E%3Ccircle cx='18' cy='82' r='75'/%3E%3Ccircle cx='18' cy='82' r='50'/%3E%3Ccircle cx='18' cy='82' r='18'/%3E%3C/g%3E%3C/svg%3E"),
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='110'%3E%3Cg fill='none' stroke='%23ffffff' stroke-opacity='.35'%3E%3Ccircle cx='94' cy='83' r='80'/%3E%3Ccircle cx='94' cy='83' r='55'/%3E%3Ccircle cx='94' cy='83' r='22'/%3E%3C/g%3E%3C/svg%3E");
	background-position: left bottom, right bottom;
}

/* ── Colores de marca del diseño sobre componentes del Kit (solo color) ─────────────── */
.uc-card.vc-borde--cafe { border-bottom-color: var(--vc-cafe); }       /* con .card-border--bottom */
.uc-text-divider.vc-divider--cafe { background-color: var(--vc-cafe); } /* divisor bajo títulos de card */
.uc-icon.vc-icono--cafe { color: var(--vc-cafe); }                       /* íconos de pilares, citas y listas */
.uc-tag.vc-tag--amarillo { background-color: var(--yellow); color: var(--darkblue); } /* plazos y "Destacada" */
.vc-color--amarillo { color: var(--yellow); }                            /* cifras */
