/* ==========================================================================
   Home — page-specific blocks with no reusable component of their own:
   Bloque 4 (Camino) and Bloque 8 (Qué hace diferente el trabajo).
   Everything else on Home reuses an existing component's own CSS file.
   ========================================================================== */

/* --- Bloque 2 — Hero image (Teo, 2026-08-02) -------------------------------
   Same img-fills-column rule as .service-hero__media / .featured-project__media
   (service-landing.css) — kept page-scoped rather than reusing their class
   names, since this is Home's own hero, not a ServiceHero instance. */

.home-hero {
  /* Added 2026-08-03 (Teo, audit-approved): .section--editorial (layout.css)
     is shared with 404.php, so it can't be edited directly — this scoped
     class overrides it (same specificity, later in cascade order since
     home.css loads after layout.css). Was 152px @1440. */
  padding-block: var(--space-section-generous);
}

.home-hero__media img {
  width: 100%;
}

/* .split--media-dominant (layout.css, 1.6fr text : 1fr media) reads as the
   image having LESS presence despite its name — this page-scoped modifier
   is additive and never edits the shared rule, so every other
   .split--media-dominant caller is unaffected. Folded into the real page
   2026-08-03 (was preview-only 2026-08-02). */
@media (min-width: 64rem) {
  .home-hero__split--wide {
    grid-template-columns: 1fr 1.3fr;
  }
}

.home-path {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-6);
}

@media (min-width: 48rem) {
  .home-path {
    grid-template-columns: repeat(2, 1fr);
  }
}

.home-path__card {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  padding: var(--space-6);
  border-radius: var(--radius-card);
  background-color: var(--surface-raised);
}

.home-differentiators {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-6);
}

@media (min-width: 48rem) {
  .home-differentiators {
    grid-template-columns: repeat(3, 1fr);
  }
}

.home-differentiators__item h3 {
  margin-bottom: var(--space-2);
}