/* Acordeones de texto — destacado y chico, ancho completo o con etiqueta lateral. Estilos propios: solo dependen del sistema de diseño base. */
.cca-v2 .cca-v2__accordion { --cca-v2-acc-line: rgb(0 0 0 / 20%); scroll-margin-top: 100px; overflow-wrap: anywhere; }
.cca-v2 .cca-v2__accordion--gray { --cca-v2-surface: var(--cca-v2-gray-200); --cca-v2-ink: #000; color: var(--cca-v2-ink); background: var(--cca-v2-surface); }
.cca-v2 .cca-v2__accordion.cca-v2--dark { --cca-v2-acc-line: rgb(255 255 255 / 30%); }
.cca-v2 .cca-v2__accordion-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 40px 8px; }
.cca-v2 .cca-v2__accordion-grid > * { min-width: 0; }
.cca-v2 .cca-v2__accordion-label { grid-column: 1 / -1; margin: 0; line-height: 1.3; }
/* Chico, ancho completo: el título de la sección va en la fuente de titulares, a 32px. */
.cca-v2 .cca-v2__accordion--accordion_small .cca-v2__accordion-label { font-family: var(--cca-v2-font-headline); font-size: 32px; font-weight: 400; line-height: 1.1; letter-spacing: 0; text-transform: none; }
.cca-v2 .cca-v2__accordion--accordion_small .cca-v2__accordion-grid { row-gap: 32px; }
.cca-v2 .cca-v2__accordion-items { grid-column: 1 / -1; }
/* Con etiqueta lateral: etiqueta en la mitad izquierda y acordeón en las 6 columnas de la derecha. */
.cca-v2 .cca-v2__accordion--side .cca-v2__accordion-label { grid-column: 1 / span 6; grid-row: 1; }
.cca-v2 .cca-v2__accordion--side .cca-v2__accordion-items { grid-column: 7 / span 6; grid-row: 1; }
/* La línea superior ocupa todo el ancho: va en la grilla, no en el primer ítem, y la etiqueta baja lo mismo que el título del ítem. */
.cca-v2 .cca-v2__accordion--side .cca-v2__accordion-grid { border-top: 1px solid var(--cca-v2-acc-line); }
.cca-v2 .cca-v2__accordion--side .cca-v2__accordion-item:first-child { border-top: 0; }
.cca-v2 .cca-v2__accordion--side .cca-v2__accordion-label { padding-top: 12px; }
.cca-v2 .cca-v2__accordion-item { border-top: 1px solid var(--cca-v2-acc-line); }
.cca-v2 .cca-v2__accordion-item:last-child { border-bottom: 1px solid var(--cca-v2-acc-line); }
.cca-v2 .cca-v2__accordion-summary { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin: 0; cursor: pointer; list-style: none; }
.cca-v2 .cca-v2__accordion-summary::-webkit-details-marker { display: none; }
.cca-v2 .cca-v2__accordion-summary:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
.cca-v2 :is(.cca-v2__accordion--accordion_large, .cca-v2__accordion--accordion_large_side) .cca-v2__accordion-summary { padding-block: 12px; line-height: .95; }
.cca-v2 :is(.cca-v2__accordion--accordion_small, .cca-v2__accordion--accordion_small_side) .cca-v2__accordion-summary { padding-block: 12px 20px; font-family: var(--cca-v2-font-text); font-size: 16px; font-weight: 400; line-height: 1.4; letter-spacing: 0; }
/* Ícono + / −: texto en la fuente de titulares; el signo cambia al abrir. */
.cca-v2 .cca-v2__accordion-icon { flex: none; width: 1em; font-family: var(--cca-v2-font-headline); font-size: 40px; font-style: normal; font-weight: 400; line-height: 1.1; letter-spacing: -.01em; text-align: center; }
.cca-v2 .cca-v2__accordion-icon::before { content: "+"; }
.cca-v2 .cca-v2__accordion-item[open] .cca-v2__accordion-icon::before { content: "-"; }
/* El signo queda a 20px del borde derecho en los cuatro bloques. */
.cca-v2 .cca-v2__accordion-summary { padding-right: 20px; }
.cca-v2 .cca-v2__accordion-icon { text-align: right; }
/* Chico: el signo va en la fuente de texto, a 16px. */
.cca-v2 :is(.cca-v2__accordion--accordion_small, .cca-v2__accordion--accordion_small_side) .cca-v2__accordion-icon { font-family: var(--cca-v2-font-text); font-size: 16px; line-height: 1.4; letter-spacing: 0; }
.cca-v2 .cca-v2__accordion-panel { padding-bottom: 24px; color: var(--cca-v2-gray-800); font-weight: var(--cca-v2-weight-light); }
.cca-v2 .cca-v2__accordion-panel p { margin: 0 0 1em; max-width: 70ch; }
/* Destacado y chico, ancho completo: el texto ocupa 6 columnas de la grilla de 12 (gap de 8px), o sea la mitad del ancho menos medio gap. En móvil la grilla es de una columna y el texto usa todo el ancho. */
.cca-v2 :is(.cca-v2__accordion--accordion_large, .cca-v2__accordion--accordion_small) .cca-v2__accordion-panel :is(p, .cca-v2__accordion-media) { max-width: calc(50% - 4px); }
.cca-v2 .cca-v2__accordion-panel p:last-child { margin-bottom: 0; }
.cca-v2 .cca-v2__accordion-media { margin: 0; }
.cca-v2 .cca-v2__accordion-panel p + .cca-v2__accordion-media { margin-top: 24px; }
.cca-v2 .cca-v2__accordion-image { display: block; width: 100%; height: auto; }
/* Animación al abrir y cerrar un ítem: la altura se despliega con suavidad y el contenido entra con un fundido y un leve movimiento.
   Mejora progresiva: usa ::details-content e interpolate-size, que hoy están en los navegadores modernos; en los demás el ítem se abre al instante, como siempre.
   Es la misma animación que el acordeón por períodos de la grilla de contenidos. */
.cca-v2 .cca-v2__accordion-item { interpolate-size: allow-keywords; }
.cca-v2 .cca-v2__accordion-panel { opacity: 0; transform: translateY(-8px); transition: opacity .3s ease, transform .3s ease; }
.cca-v2 .cca-v2__accordion-item[open] .cca-v2__accordion-panel { opacity: 1; transform: none; transition: opacity .5s ease .12s, transform .55s cubic-bezier(.2, .7, .2, 1) .12s; }
@starting-style { .cca-v2 .cca-v2__accordion-item[open] .cca-v2__accordion-panel { opacity: 0; transform: translateY(-8px); } }
@supports selector(::details-content) {
  .cca-v2 .cca-v2__accordion-item::details-content { height: 0; overflow: clip; transition: height .5s cubic-bezier(.2, .7, .2, 1), content-visibility .5s allow-discrete; }
  .cca-v2 .cca-v2__accordion-item[open]::details-content { height: auto; }
}
@media (prefers-reduced-motion: reduce) {
  .cca-v2 .cca-v2__accordion-item::details-content { transition: none !important; }
  .cca-v2 .cca-v2__accordion-panel, .cca-v2 .cca-v2__accordion-item[open] .cca-v2__accordion-panel { transition: none !important; }
  .cca-v2 .cca-v2__accordion-panel { opacity: 1; transform: none; }
}
@media (max-width: 767px) {
  .cca-v2 .cca-v2__accordion-grid { grid-template-columns: minmax(0, 1fr); row-gap: 24px; }
  .cca-v2 :is(.cca-v2__accordion--accordion_large, .cca-v2__accordion--accordion_small) .cca-v2__accordion-panel :is(p, .cca-v2__accordion-media) { max-width: none; }
  .cca-v2 .cca-v2__accordion--accordion_small .cca-v2__accordion-grid { row-gap: 24px; }
  .cca-v2 .cca-v2__accordion :is(.cca-v2__accordion-label, .cca-v2__accordion-items) { grid-column: 1; grid-row: auto; }
  .cca-v2 :is(.cca-v2__accordion--accordion_large, .cca-v2__accordion--accordion_large_side) .cca-v2__accordion-summary { padding-block: 12px; }
  .cca-v2 .cca-v2__accordion-summary { gap: 16px; }
}
