/* [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-trabajarjuntostecnologia :where(p, li, strong, b) { color: var(--ia-color-text, inherit); }
.iaLayer-trabajarjuntostecnologia a:not([class]) { color: var(--ia-color-text, inherit); text-decoration: underline; }
.iaLayer-trabajarjuntostecnologia 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-trabajarjuntostecnologia {
  background: var(--section-bg, var(--ia-color-page, #f1f5f9));
  padding: 80px 24px;
  box-sizing: border-box;
}

.iaLayer-trabajarjuntostecnologia .wj-inner {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 56px;
  align-items: center;
}

.iaLayer-trabajarjuntostecnologia .wj-media {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: auto auto;
  gap: 16px;
}

.iaLayer-trabajarjuntostecnologia .wj-img-main {
  grid-column: 1 / 3;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 8px 32px rgba(31,41,51,0.13);
}

.iaLayer-trabajarjuntostecnologia .wj-img-hero {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
  aspect-ratio: 4/3;
}

.iaLayer-trabajarjuntostecnologia .wj-img-deco {
  grid-column: 2 / 3;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 4px 16px rgba(31,41,51,0.10);
  margin-top: -48px;
  position: relative;
  z-index: 2;
}

.iaLayer-trabajarjuntostecnologia .wj-img-dec {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
  aspect-ratio: 4/3;
}

.iaLayer-trabajarjuntostecnologia .wj-content {
  display: flex;
  flex-direction: column;
}

.iaLayer-trabajarjuntostecnologia .wj-eyebrow {
  font-family: var(--ia-font-body, sans-serif);
  font-size: var(--ia-eyebrow-size);
  font-weight: var(--ia-eyebrow-weight);
  letter-spacing: 0.12em;
  text-transform: var(--ia-eyebrow-transform);
  color: var(--accent-color, var(--ia-color-primary, #47cf73));
  margin-top: var(--ia-space-s, 1rem); margin-bottom: 0;
}

.iaLayer-trabajarjuntostecnologia .wj-heading {
  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);
  color: var(--heading-color, var(--ia-color-dark, #1F2933));
  margin-top: 20px; margin-bottom: 0;
}

.iaLayer-trabajarjuntostecnologia .wj-heading-highlight {
  color: var(--accent-color, var(--ia-color-primary, #47cf73));
}

.iaLayer-trabajarjuntostecnologia .wj-subtitle {
  font-family: var(--ia-font-body, sans-serif);
  font-size: var(--ia-body-size);
  line-height: var(--ia-body-lh);
  color: var(--subtext-color, var(--ia-color-text-soft, #4a5568));
  margin-top: 20px; margin-bottom: 0;
}

.iaLayer-trabajarjuntostecnologia .wj-features {
  list-style: none;
  margin-top: 20px; margin-bottom: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.iaLayer-trabajarjuntostecnologia .wj-feature-item {
  display: flex;
  align-items: flex-start;
  gap: 14px;
}

.iaLayer-trabajarjuntostecnologia .wj-feature-icon {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border-radius: 8px;
  background: var(--accent-color, var(--ia-color-primary, #47cf73));
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--ia-color-text-inverted, #fff);
}

.iaLayer-trabajarjuntostecnologia .wj-feature-icon svg {
  width: 18px;
  height: 18px;
}

.iaLayer-trabajarjuntostecnologia .wj-feature-body {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.iaLayer-trabajarjuntostecnologia .wj-feature-title {
  font-family: var(--ia-font-body, sans-serif);
  font-size: var(--ia-card-title-size);
  font-weight: var(--ia-card-title-weight);
  color: var(--heading-color, var(--ia-color-dark, #1F2933));
}

.iaLayer-trabajarjuntostecnologia .wj-feature-desc {
  font-family: var(--ia-font-body, sans-serif);
  font-size: var(--ia-card-text-size);
  line-height: var(--ia-card-text-lh);
  color: var(--subtext-color, var(--ia-color-text-soft, #4a5568));
  margin: 0;
}

.iaLayer-trabajarjuntostecnologia .wj-ctas {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  align-items: center;
  margin-top: calc(20px + 8px); 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-trabajarjuntostecnologia .wj-content > :first-child { margin-top: 0; }

.iaLayer-trabajarjuntostecnologia .wj-btn-primary {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--primary-btn-bg, var(--ia-button-primary-bg));
  color: var(--primary-btn-color, var(--ia-button-primary-text));
  font-family: var(--ia-font-body, sans-serif);
  font-size: var(--ia-btn-size);
  font-weight: var(--ia-btn-weight);
  padding: 14px 28px;
  border-radius: var(--ia-radius-button, 8px);
  text-decoration: none;
  border: 2px solid transparent;
  --ia-interaction-transition: filter 0.2s, box-shadow 0.2s; transition: var(--ia-interaction-transition);
}

.iaLayer-trabajarjuntostecnologia .wj-btn-primary:hover {
  filter: brightness(1.08);
  --ia-interaction-shadow-hover: 0 4px 18px rgba(71,207,115,0.25); box-shadow: var(--ia-interaction-shadow-hover);
}

.iaLayer-trabajarjuntostecnologia .wj-btn-ic svg {
  width: 16px;
  height: 16px;
}

.iaLayer-trabajarjuntostecnologia .wj-btn-secondary {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: transparent;
  color: var(--secondary-btn-color, var(--ia-button-secondary-text));
  font-family: var(--ia-font-body, sans-serif);
  font-size: var(--ia-btn-size);
  font-weight: var(--ia-btn-weight);
  padding: 14px 24px;
  border-radius: var(--ia-radius-button, 8px);
  text-decoration: none;
  border: var(--ia-button-secondary-border-size) var(--ia-button-secondary-border-type) var(--secondary-btn-color, var(--ia-button-secondary-text));
  --ia-interaction-transition: background 0.2s, color 0.2s; transition: var(--ia-interaction-transition);
}

.iaLayer-trabajarjuntostecnologia .wj-btn-secondary:hover {
  --ia-interaction-bg-hover: var(--secondary-btn-color, var(--ia-button-secondary-text)); background: var(--ia-interaction-bg-hover);
  --ia-interaction-text-hover: var(--ia-color-text-inverted, #fff); color: var(--ia-interaction-text-hover);
}

@media (max-width: 900px) {
  .iaLayer-trabajarjuntostecnologia .wj-inner {
    grid-template-columns: 1fr;
    gap: 36px;
  }
  .iaLayer-trabajarjuntostecnologia .wj-media {
    order: 2;
    grid-template-columns: 1fr;
  }
  .iaLayer-trabajarjuntostecnologia .wj-img-main {
    grid-column: 1 / 2;
  }
  .iaLayer-trabajarjuntostecnologia .wj-img-deco {
    grid-column: 1 / 2;
    margin-top: 0;
  }
  .iaLayer-trabajarjuntostecnologia .wj-content {
    order: 1;
  }
}

@media (max-width: 600px) {
  .iaLayer-trabajarjuntostecnologia {
    padding: 56px 20px;
  }
  .iaLayer-trabajarjuntostecnologia .wj-ctas {
    flex-direction: column;
    align-items: stretch;
  }
  .iaLayer-trabajarjuntostecnologia .wj-btn-primary,
  .iaLayer-trabajarjuntostecnologia .wj-btn-secondary {
    justify-content: center;
  }
}