/* [IRIDIAN AI LAYER] CSS del bloc IaAccordionV1 — familia ia*v1 (fase C).
 * Accordion natiu <details>/<summary>, JS-free. Tot scoped sota .iaLayer-iaaccordionv1.
 * Sense CSS global, sense tocar CSS legacy.
 */
.iaLayer-iaaccordionv1 {
    /* [F5-unificació 2026-07-14] Escala canònica --ia-color-* (patró IaStatsV1, P7B.4). Substitueix
       els tokens legacy de P7B.2. Fallbacks = valors originals. Delta deliberat: la resposta passa
       a text-soft (com els 5 mòduls canònics). */
    --iaacc-accent: var(--ia-color-accent, #0071e3);
    --iaacc-border: var(--ia-color-border, #e3e3e8);
    --iaacc-q-color: var(--ia-color-text, #1d1d1f);
    --iaacc-a-color: var(--ia-color-text-soft, #4a4a4f);
    --iaacc-bg: var(--ia-color-surface, #ffffff);
    max-width: 820px;
    margin: 0 auto;
    /* [D29 2026-09-30] Decisió 29 (Xavi): les caixes amb vora no toquen la vora de la pantalla; gutter = var(--ia-section-gutter) [L6 GUTTER 28 2026-09-30] (abans 20px i 14px a 600px o menys). */
    padding: 40px var(--ia-section-gutter, 28px);
    font-family: var(--ia-font-body, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif);
    color: var(--iaacc-q-color);
}
.iaLayer-iaaccordionv1 .iaacc-title {
    margin-top: var(--ia-space-s, 1rem); margin-bottom: 0;
    font-size: var(--ia-title-section-size);
    letter-spacing: -.02em;
    font-weight: var(--ia-title-section-weight);
    text-align: center;
}
.iaLayer-iaaccordionv1 .iaacc-intro {
    margin-top: 6px; margin-bottom: 0; margin-inline: auto;
    max-width: 620px;
    text-align: center;
    color: var(--iaacc-a-color);
    font-size: var(--ia-body-size);
    line-height: var(--ia-body-lh);
}
.iaLayer-iaaccordionv1 .iaacc-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 24px; margin-bottom: 0;
}
/* [MOVE-READY 2026-10-03] Espaiat «cada peça el seu margin-top + reinici del primer fill» (només layout; l'aspecte per defecte no canvia): moure una peça s'emporta el seu espai. */
.iaLayer-iaaccordionv1 > :first-child { margin-top: 0; }
/* [MOVE-READY] El vídeo de fons (iaLayer_bg_video.js) s'insereix com a PRIMER fill de l'arrel (absolut): la primera peça real tampoc no ha de portar marge a dalt. */
.iaLayer-iaaccordionv1 > .ia-bg-video:first-child + * { margin-top: 0; }
.iaLayer-iaaccordionv1 .iaacc-item {
    border: 1px solid var(--iaacc-border);
    /* [ACORDIÓ · RADI PEL TOKEN 2026-09-30] El radi de les caixes és el d'Estils (--ia-card-radius); el 12px és només el fallback si el token no existeix (abans era un 12px literal que ignorava Estils i deixava l'acordió arrodonit al costat d'una FAQ quadrada). */
    border-radius: var(--ia-card-radius, 12px);
    background: var(--iaacc-bg);
    overflow: hidden;
}
.iaLayer-iaaccordionv1 .iaacc-q {
    list-style: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 18px;
    font-size: var(--ia-card-title-size);
    font-weight: var(--ia-card-title-weight);
    color: var(--iaacc-q-color);
    --ia-interaction-transition: background .15s ease; transition: var(--ia-interaction-transition);
}
.iaLayer-iaaccordionv1 .iaacc-q::-webkit-details-marker { display: none; }
.iaLayer-iaaccordionv1 .iaacc-q:hover { --ia-interaction-bg-hover: rgba(127,127,127,.10); background: var(--ia-interaction-bg-hover); }
.iaLayer-iaaccordionv1 .iaacc-q-text { flex: 1; }
.iaLayer-iaaccordionv1 .iaacc-ico {
    flex: none;
    width: 11px;
    height: 11px;
    border-right: 2px solid var(--iaacc-accent);
    border-bottom: 2px solid var(--iaacc-accent);
    transform: rotate(45deg);
    --ia-interaction-transition: transform .2s ease; transition: var(--ia-interaction-transition);
    margin-right: 4px;
}
.iaLayer-iaaccordionv1 .iaacc-item[open] .iaacc-ico { transform: rotate(-135deg); }
.iaLayer-iaaccordionv1 .iaacc-a {
    padding: 0 18px 18px;
    color: var(--iaacc-a-color);
    line-height: var(--ia-card-text-lh);
    font-size: var(--ia-card-text-size);
}
/* [RESPOSTA · RESET DEL <p> 2026-09-30] `main p`/`main li` del tema (19px, color fix) guanyaven a la resposta: el text sortia gran i fosc en lloc de la mida i el text-soft de la resposta. Els <p> i <li> de dins hereten color, mida i interlineat de .iaacc-a (tokens: text-soft i la mida pròpia de la resposta); (0,2,0) guanya a main p (0,0,2). */
.iaLayer-iaaccordionv1 .iaacc-a :where(p, li) { color: inherit; font-size: inherit; font-weight: inherit; line-height: inherit; }
.iaLayer-iaaccordionv1 .iaacc-a > :first-child { margin-top: 0; }
.iaLayer-iaaccordionv1 .iaacc-a > :last-child { margin-bottom: 0; }
@media (max-width: 600px) {
    .iaLayer-iaaccordionv1 { padding-block: 28px; }
    .iaLayer-iaaccordionv1 .iaacc-q { padding: 14px 14px; }
    .iaLayer-iaaccordionv1 .iaacc-a { padding: 0 14px 14px; }
}