/* [L6 pàgines base 2026-09-30] El text ric (p, li, strong, b i els enllaços sense classe) pren el token de text de
   la superfície (--ia-color-text, que brand, dark i image redefineixen); sense això main p, main li, main li p,
   strong i main a del tema el pinten amb el seu color fix (1,21:1 a surface dark). Token i no inherit: inherit
   aclaria el cos a les superfícies clares (#6F6F6F, 4,53:1 sobre soft). :where() deixa p, li, strong i b a
   (0,1,0) perquè qualsevol regla pròpia del mòdul hi guanyi; el bloc va al principi perquè hi guanyin en empat. */
.iaLayer-iactabandv1 :where(p, li, strong, b) { color: var(--ia-color-text, inherit); }
.iaLayer-iactabandv1 a:not([class]) { color: var(--ia-color-text, inherit); text-decoration: underline; }
.iaLayer-iactabandv1 a:not([class]):is(:hover, :focus-visible) { --ia-interaction-text-hover: var(--ia-color-text, inherit); color: var(--ia-interaction-text-hover); text-decoration: underline; }
.iaLayer-iactabandv1 {
  --icb-bg: var(--ia-color-surface-soft, #f3f3f3);
  --icb-overlay: var(--ia-color-dark, #1a1a1a);
  --icb-overlay-opacity: 0.78;
  --icb-btn-bg: var(--ia-button-primary-bg);
  --icb-btn-fg: var(--ia-button-primary-text);
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  width: 100%;
  box-sizing: border-box;
  overflow: hidden;
  isolation: isolate;
  padding: var(--ia-space-l, 32px) var(--ia-space-m, 20px);
  margin-block-end: clamp(var(--ia-space-s, 1.5rem), 6vw, var(--ia-space-m, 3rem));
  background: var(--icb-bg);
  color: var(--ia-color-text, #1a1a1a);
  font-family: var(--ia-font-body, sans-serif);
}
.iaLayer-iactabandv1.icb-surface--brand {
  --icb-bg: var(--ia-color-primary, #000000);
  --icb-overlay: var(--ia-color-primary, #000000);
  --icb-overlay-opacity: 0.82;
  --ia-color-text: var(--ia-color-primary-contrast-text, var(--ia-color-text-inverted));
  --ia-color-text-soft: var(--ia-color-primary-contrast-text, var(--ia-color-text-inverted));
  --icb-btn-bg: var(--ia-color-primary-contrast-text, var(--ia-color-text-inverted));
  --icb-btn-fg: var(--ia-color-primary, #000000);
  --ia-color-focus-ring: var(--ia-color-primary-contrast-text, var(--ia-color-text-inverted));
}
.iaLayer-iactabandv1.icb-surface--dark,
.iaLayer-iactabandv1.icb-surface--image {
  --icb-bg: var(--ia-color-dark, #1a1a1a);
  --ia-color-text: var(--ia-color-text-inverted, #ffffff);
  --ia-color-text-soft: var(--ia-color-text-inverted-soft, #d6d6d6);
  --icb-btn-bg: var(--ia-color-text-inverted, #ffffff);
  --icb-btn-fg: var(--ia-color-dark, #1a1a1a);
  --ia-color-focus-ring: var(--ia-color-text-inverted, #ffffff);
}
.iaLayer-iactabandv1.icb-surface--soft.icb-has-media {
  --icb-overlay: var(--ia-color-surface-soft, #f3f3f3);
  --icb-overlay-opacity: 0.94;
  --ia-color-text-soft: var(--ia-color-text, #1a1a1a);
}
.iaLayer-iactabandv1 > .icb-inner {
  grid-area: 1 / 1;
  min-width: 0;
}
/* [L6 pàgines base 2026-09-30] L'alçada la marca el contingut: la imatge i el vel surten del flux (absoluts sobre
   la caixa de padding, sense grid-area perquè el bloc contenidor sigui la secció) i la imatge omple amb
   object-fit: cover. Abans eren a la mateixa cel·la de la graella i la ràtio de la foto fixava l'alçada
   (134px d'aire a dalt i uns 394px a baix a inicio-demo). El marge inferior separa la banda del peu. */
.iaLayer-iactabandv1 > .icb-media,
.iaLayer-iactabandv1 > .icb-overlay {
  position: absolute;
  inset: 0;
  margin: 0;
}
.iaLayer-iactabandv1 .icb-media {
  z-index: -2;
}
.iaLayer-iactabandv1 .icb-media picture,
.iaLayer-iactabandv1 .icb-media img {
  display: block;
  width: 100%;
  height: 100%;
}
.iaLayer-iactabandv1 .icb-media img {
  object-fit: cover;
}
.iaLayer-iactabandv1 .icb-overlay {
  z-index: -1;
  background: var(--icb-overlay);
  opacity: var(--icb-overlay-opacity);
}
.iaLayer-iactabandv1 .icb-inner {
  width: 100%;
  margin-inline: auto;
  text-align: center;
}
.iaLayer-iactabandv1 .icb-inner[data-align="start"] {
  text-align: start;
}
.iaLayer-iactabandv1 .icb-eyebrow,
.iaLayer-iactabandv1 .icb-title,
.iaLayer-iactabandv1 .icb-text {
  max-width: 65ch;
  margin-inline: auto;
  overflow-wrap: break-word;
}
.iaLayer-iactabandv1 .icb-inner[data-align="start"] .icb-eyebrow,
.iaLayer-iactabandv1 .icb-inner[data-align="start"] .icb-title,
.iaLayer-iactabandv1 .icb-inner[data-align="start"] .icb-text {
  margin-inline: 0;
}
.iaLayer-iactabandv1 .icb-eyebrow {
  margin-top: var(--ia-space-s, 12px);
  margin-bottom: 0;
  color: var(--ia-color-text-soft, #6b6b6b);
  font-size: var(--ia-eyebrow-size);
  font-weight: var(--ia-eyebrow-weight);
  letter-spacing: var(--ia-eyebrow-tracking);
  text-transform: var(--ia-eyebrow-transform);
}
.iaLayer-iactabandv1 .icb-title {
  margin-top: var(--ia-space-xs, 8px);
  margin-bottom: 0;
  color: var(--ia-color-text, #1a1a1a);
  font-family: var(--ia-font-heading, sans-serif);
  font-size: var(--ia-title-section-size);
  font-weight: var(--ia-title-section-weight);
  line-height: var(--ia-title-section-lh);
}
.iaLayer-iactabandv1 .icb-text {
  margin-top: var(--ia-space-s, 12px);
  margin-bottom: 0;
  color: var(--ia-color-text-soft, #6b6b6b);
  font-size: var(--ia-body-size);
  line-height: var(--ia-body-lh);
}
.iaLayer-iactabandv1 .icb-actions {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: var(--ia-space-s, 12px);
  margin-top: var(--ia-space-l, 32px);
}
/* [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-iactabandv1 .icb-inner > :first-child { margin-top: 0; }
.iaLayer-iactabandv1 .icb-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  box-sizing: border-box;
  padding: var(--ia-space-xs, 8px) var(--ia-space-m, 20px);
  border: 2px solid transparent;
  border-radius: var(--ia-radius-button, 8px);
  font-family: var(--ia-font-body, sans-serif);
  font-size: var(--ia-btn-size);
  font-weight: var(--ia-btn-weight);
  line-height: var(--ia-btn-lh);
  text-align: center;
  text-decoration: none;
  transition: var(--ia-interaction-transition, box-shadow 0.2s ease);
}
.iaLayer-iactabandv1 .icb-cta--primary {
  background: var(--icb-btn-bg);
  color: var(--icb-btn-fg);
}
.iaLayer-iactabandv1 .icb-cta--ghost {
  background: var(--ia-button-secondary-bg);
  border-width: var(--ia-button-secondary-border-size);
  border-style: var(--ia-button-secondary-border-type);
  border-color: var(--ia-button-secondary-border);
  color: var(--ia-button-secondary-text);
}
.iaLayer-iactabandv1 .icb-cta:hover {
  box-shadow: var(--ia-interaction-shadow-hover, 0 6px 18px rgba(0, 0, 0, 0.18));
}
.iaLayer-iactabandv1 .icb-cta--ghost:hover {
  text-decoration: underline;
  text-underline-offset: 0.2em;
}
.iaLayer-iactabandv1 .icb-cta:focus-visible {
  outline: 3px solid var(--ia-color-focus-ring, currentColor);
  outline-offset: 3px;
}
@media (min-width: 600px) {
  .iaLayer-iactabandv1 .icb-actions {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
  }
  .iaLayer-iactabandv1 .icb-inner[data-align="start"] .icb-actions {
    justify-content: flex-start;
  }
}
@media (min-width: 992px) {
  .iaLayer-iactabandv1 {
    padding: var(--ia-space-xl, 64px) var(--ia-space-l, 32px);
  }
  .iaLayer-iactabandv1.icb-has-media {
    padding-top: var(--ia-space-xl, 64px);
    padding-bottom: var(--ia-space-xl, 64px);
  }
}
@media (prefers-reduced-motion: reduce) {
  .iaLayer-iactabandv1 .icb-cta {
    transition: none;
  }
}
/* [L6 GUTTER 28 2026-09-30] Superfícies soft: gutter lateral únic var(--ia-section-gutter) (system-twig.css), a totes les amplades; brand, dark i image conserven el padding de l'arrel. */
.iaLayer-iactabandv1.icb-surface--soft { padding-inline: var(--ia-section-gutter, 28px); }