/* Texto — titular y párrafos. Estilos propios: no depende de cca-v2-home.css ni de cca-v2-hero.css; solo del sistema de diseño base. */
/* Sección propia, sin relleno vertical. El fondo gris se define aquí. */
.cca-v2 .cca-v2__text-section { scroll-margin-top: 100px; overflow-wrap: anywhere; }
.cca-v2 .cca-v2__text-section--gray { --cca-v2-surface: var(--cca-v2-gray-200); --cca-v2-ink: #000; color: var(--cca-v2-ink); background: var(--cca-v2-surface); }
/* Fondos blanco y gris: borde superior de 1 px, negro al 20 %, fuera del fondo (el fondo no se pinta bajo el borde). */
.cca-v2 .cca-v2__text-section:not(.cca-v2__text-section--headline, .cca-v2__text-section--no-border, .cca-v2__text-section--left.cca-v2__text-section--cols-1):is(.cca-v2--light, .cca-v2__text-section--gray) { border-top: 1px solid rgb(0 0 0 / 20%); background-clip: padding-box; }
.cca-v2 :is(.cca-v2__text-section--right, .cca-v2__text-section--side, .cca-v2__text-section--left.cca-v2__text-section--cols-2) { padding-top: 12px; }
.cca-v2 .cca-v2__text-section:is(.cca-v2__text-section--side, .cca-v2__text-section--full, .cca-v2__text-section--cta):not(.cca-v2__text-section--headline).cca-v2__text-section--cols-1 { padding-top: 20px; }
.cca-v2 .cca-v2__text-columns { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 24px 8px; }
.cca-v2 .cca-v2__text-section--headline .cca-v2__text-columns { row-gap: 40px; }
.cca-v2 .cca-v2__text-columns > .cca-v2__label { grid-column: 1 / -1; }
.cca-v2 .cca-v2__text-columns-content { grid-column: 1 / -1; min-width: 0; }
.cca-v2 .cca-v2__text-columns--side > .cca-v2__label { grid-column: span 3; }
.cca-v2 .cca-v2__text-columns--side .cca-v2__text-columns-content { grid-column: 4 / span 9; }
.cca-v2 .cca-v2__text-columns--left .cca-v2__text-columns-content { grid-column: 1 / span 6; }
.cca-v2 .cca-v2__text-columns--right .cca-v2__text-columns-content { grid-column: 7 / span 6; }
/* Texto + botón: texto en las 8 primeras columnas y botón alineado a la derecha, a la altura de la primera línea. */
.cca-v2 .cca-v2__text-columns--cta .cca-v2__text-columns-content { grid-column: 1 / span 8; }
.cca-v2 .cca-v2__text-columns--cta > .cca-v2__text-columns-cta { grid-column: 10 / span 3; justify-self: end; align-self: start; }
/* Botón a la izquierda: mismo orden en el DOM, intercambiado en la grilla. */
.cca-v2 .cca-v2__text-columns--cta-left .cca-v2__text-columns-content { grid-column: 5 / span 8; grid-row: 1; }
.cca-v2 .cca-v2__text-columns--cta-left > .cca-v2__text-columns-cta { grid-column: 1 / span 3; grid-row: 1; justify-self: start; }
.cca-v2 .cca-v2__text-columns--side.cca-v2__text-columns--cols-2 > .cca-v2__label { grid-column: 1 / span 4; }
.cca-v2 .cca-v2__text-columns--side.cca-v2__text-columns--cols-2 > .cca-v2__text-columns-content { grid-column: 5 / span 8; }
.cca-v2 .cca-v2__text-columns--left.cca-v2__text-columns--cols-2 .cca-v2__text-columns-content { grid-column: 1 / span 8; }
.cca-v2 .cca-v2__text-columns--right.cca-v2__text-columns--cols-2 .cca-v2__text-columns-content { grid-column: 5 / span 8; }
.cca-v2 .cca-v2__text-columns--right > .cca-v2__label { grid-column: 1 / span 6; grid-row: 1; }
.cca-v2 .cca-v2__text-columns--right > .cca-v2__text-columns-content { grid-row: 1; }
.cca-v2 .cca-v2__text-columns-sub { margin-top: 40px; }
.cca-v2 .cca-v2__text-columns-body { margin-top: 40px; }
.cca-v2 .cca-v2__text-columns-body .cca-v2__body { font-weight: var(--cca-v2-weight-light); }
.cca-v2 .cca-v2__text-columns-content > :first-child { margin-top: 0; }
.cca-v2 .cca-v2__text-columns-body--2 { column-count: 2; column-gap: 8px; }
.cca-v2 .cca-v2__text-columns-body--2 :is(.cca-v2__body, .cca-v2__text-columns-dots) { break-inside: avoid; }
/* Indicador «…»: círculo de 24 px con 3 puntos de 3 px, separados 2 px, centrados en vertical y horizontal. Por defecto es solo visual.
   Con "Texto desplegable" es el botón (summary de un details nativo) que abre y cierra los párrafos adicionales: cerrado muestra los puntos y abierto una raya «−».
   Los párrafos adicionales siguen el mismo reparto en dos columnas y entran con un fundido. */
.cca-v2 .cca-v2__text-columns-more { margin: 0; }
.cca-v2 .cca-v2__text-columns-dots { display: flex; align-items: center; justify-content: center; width: 24px; height: 24px; margin-top: 12px; border-radius: 50%; background: rgb(136 136 136 / 70%); color: inherit; }
.cca-v2 summary.cca-v2__text-columns-dots { margin-bottom: 12px; list-style: none; cursor: pointer; }
.cca-v2 .cca-v2__text-columns-dots::-webkit-details-marker { display: none; }
.cca-v2 .cca-v2__text-columns-dots:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
.cca-v2 .cca-v2__text-columns-dots::before { content: ""; width: 3px; height: 3px; border-radius: 50%; background: currentColor; box-shadow: -5px 0 currentColor, 5px 0 currentColor; }
.cca-v2 .cca-v2__text-columns-more[open] > .cca-v2__text-columns-dots::before { width: 10px; height: 2px; border-radius: 1px; box-shadow: none; }
.cca-v2 .cca-v2__text-columns-more[open] > .cca-v2__body { animation: cca-v2-text-more-in .5s cubic-bezier(.2, .7, .2, 1) both; }
@keyframes cca-v2-text-more-in { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .cca-v2 .cca-v2__text-columns-more[open] > .cca-v2__body { animation: none; } }
.cca-v2 .cca-v2__text-section:is(.cca-v2__text-section--gray, .cca-v2--light) .cca-v2__text-columns-dots { background: var(--cca-v2-gray-400); color: #000; }
.cca-v2 .cca-v2__text-columns-title-row { display: flex; align-items: flex-start; gap: 40px; }
.cca-v2 .cca-v2__text-columns-title-row > h2 { min-width: 0; }
/* El botón alinea su borde superior con la parte alta de las minúsculas (x-height) del titular, a cualquier tamaño.
   Fuente: unidades 1000, ascendente 1000, descendente 300, x-height 560 → desde el borde superior de la línea:
   (interlineado − 1,3) / 2 + 0,44 em. Medido sobre el render: la x-height real (n, r, i) es 0,577 em, no 0,56, así que el borde del botón cae en (interlineado − 1,3) / 2 + 0,423 em. Interlineado 0,9 → 0,223 em · 0,95 → 0,248 em · 1,1 → 0,323 em; se restan 0,003 em para que las letras redondas, que sobresalen un poco, no queden por encima. */
.cca-v2 .cca-v2__text-columns-title-row--h1 { --title-size: var(--cca-v2-type-h1); --x-offset: .22; }
.cca-v2 .cca-v2__text-columns-title-row--h2 { --title-size: var(--cca-v2-type-h2); --x-offset: .22; }
.cca-v2 .cca-v2__text-columns-title-row--h3 { --title-size: var(--cca-v2-type-h3); --x-offset: .245; }
.cca-v2 .cca-v2__text-columns-title-row--sub { --title-size: var(--cca-v2-type-subheadline); --x-offset: .32; }
.cca-v2 .cca-v2__text-columns-title-row > .cca-v2__button { flex-shrink: 0; transform: translateY(calc(var(--title-size) * var(--x-offset))); }
@media (max-width: 767px) {
  .cca-v2 .cca-v2__text-columns-title-row { flex-direction: column; align-items: flex-start; gap: 24px; }
  .cca-v2 .cca-v2__text-section--headline .cca-v2__text-columns { row-gap: 24px; }
  .cca-v2 .cca-v2__text-columns-title-row > .cca-v2__button { transform: none; }
  .cca-v2 .cca-v2__text-columns { grid-template-columns: minmax(0, 1fr); }
  .cca-v2 .cca-v2__text-columns > .cca-v2__label, .cca-v2 .cca-v2__text-columns .cca-v2__text-columns-content { grid-column: 1; }
  .cca-v2 .cca-v2__text-columns--cta > .cca-v2__text-columns-cta, .cca-v2 .cca-v2__text-columns--cta-left > .cca-v2__text-columns-cta { grid-column: 1; grid-row: auto; justify-self: start; }
  .cca-v2 .cca-v2__text-columns--cta-left .cca-v2__text-columns-content { grid-column: 1; grid-row: auto; }
  .cca-v2 .cca-v2__text-columns--right > .cca-v2__label { grid-column: 1; grid-row: auto; }
  .cca-v2 .cca-v2__text-columns--right > .cca-v2__text-columns-content, .cca-v2 .cca-v2__text-columns--cols-2 > .cca-v2__text-columns-content { grid-column: 1; grid-row: auto; }
  .cca-v2 .cca-v2__text-columns--side.cca-v2__text-columns--cols-2 > .cca-v2__label { grid-column: 1; }
  .cca-v2 :is(.cca-v2__text-columns--side, .cca-v2__text-columns--left, .cca-v2__text-columns--right).cca-v2__text-columns--cols-2 > .cca-v2__text-columns-content { grid-column: 1; }
  .cca-v2 .cca-v2__text-columns-body--2 { column-count: 1; }
  .cca-v2 .cca-v2__text-columns-sub, .cca-v2 .cca-v2__text-columns-body { margin-top: 24px; }
}
