/* Keep the fruit beside its name and bring the tree into the middle area. */
body.site-2027.catalogue-page .catalogue-hero {
  display: grid;
  grid-template-columns: max-content minmax(220px, 300px) minmax(0, 1fr);
  gap: clamp(28px, 4vw, 60px);
  align-items: center;
}
body.site-2027.catalogue-page .catalogue-hero-copy { display: block; }
body.site-2027.catalogue-page .category-title-row {
  display: flex;
  align-items: center;
  gap: 14px;
}
body.site-2027.catalogue-page .category-title-row h1 { flex: 0 1 auto; }
body.site-2027.catalogue-page .category-title-row .fruit-illustration {
  flex: 0 0 clamp(80px, 7.6vw, 110px);
  width: clamp(80px, 7.6vw, 110px);
  margin: 0;
}
body.site-2027.catalogue-page .category-tree-centered {
  display: block;
  grid-column: 2;
  grid-row: 1;
  width: 100%;
  margin: 28px 0 0;
  padding: 0;
}
body.site-2027.catalogue-page .category-tree-centered .tree-portrait { width: 100%; }
@media (max-width: 1100px) and (min-width: 701px) {
  body.site-2027.catalogue-page .catalogue-hero {
    grid-template-columns: max-content minmax(180px, 260px);
    gap: 24px;
  }
  body.site-2027.catalogue-page .category-title-row .fruit-illustration { flex-basis: 80px; width: 80px; }
}
@media (max-width: 700px) {
  body.site-2027.catalogue-page .catalogue-hero {
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
    padding: 12px 0 24px;
  }
  body.site-2027.catalogue-page .category-title-row { gap: 10px; }
  body.site-2027.catalogue-page .category-title-row h1 { font-size: clamp(28px, 8.3vw, 42px); }
  body.site-2027.catalogue-page .category-title-row .fruit-illustration { flex-basis: 64px; width: 64px; }
  body.site-2027.catalogue-page .category-tree-centered {
    grid-column: 1;
    grid-row: 2;
    justify-self: center;
    width: min(65vw, 250px);
    margin-top: 2px;
  }
}

/* All fruit species: three individual drawings on a shared ground level. */
body.site-2027.catalogue-page .catalogue-hero {
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  gap: clamp(24px, 3vw, 46px);
}
body.site-2027.catalogue-page .category-visual.tree-growth {
  display: grid;
  grid-template-columns: .4fr .85fr 1.5fr;
  align-items: end;
  gap: 8px;
  width: 100%;
  margin-top: 18px;
}
.tree-growth .growth-stage { min-width: 0; margin: 0; }
.tree-growth .growth-drawing {
  height: clamp(240px, 29vw, 370px);
  display: flex;
  align-items: flex-end;
  justify-content: center;
}
body.site-2027.catalogue-page .tree-growth .tree-portrait {
  width: 100%;
  height: auto;
  mix-blend-mode: multiply;
  transform: translateY(10%);
}
body.site-2027.catalogue-page .growth-stage--planted .tree-portrait { width: 80%; max-width: 82px; transform: translateY(7%); }
body.site-2027.catalogue-page .growth-stage--growing .tree-portrait { width: 92%; max-width: 200px; transform: translateY(9%); }
@media (max-width: 1100px) {
  body.site-2027.catalogue-page .catalogue-hero { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  body.site-2027.catalogue-page .category-visual.tree-growth { grid-column: 1; grid-row: 2; justify-self: center; max-width: 660px; margin: 0; }
  .tree-growth .growth-drawing { height: clamp(180px, 38vw, 350px); }
}
@media (max-width: 700px) {
  body.site-2027.catalogue-page .category-visual.tree-growth { gap: 4px; margin: 8px 0 14px; }
  .tree-growth .growth-drawing { height: clamp(155px, 48vw, 290px); }
}

/* A small inward shift centres the growth sequence without altering its scale. */
@media (min-width: 1101px) {
  body.site-2027.catalogue-page .category-visual.tree-growth {
    transform: translateX(clamp(-72px, -4.5vw, -48px));
  }
}

/* The translated group must blend with the page too: a transform isolates
   the children's blend modes and would otherwise reveal their white paper. */
body.site-2027.catalogue-page .category-visual.tree-growth {
  mix-blend-mode: multiply;
}

/* Each sprite contains two equal panels; clip in CSS without changing the artwork. */
.tree-growth .growth-sprite {
  display: block;
  position: relative;
  flex: none;
  aspect-ratio: 1;
  overflow: hidden;
  transform: translateY(var(--young-ground, 4%));
}
.tree-growth .growth-stage--planted .growth-sprite { width: 80%; max-width: 82px; }
.tree-growth .growth-stage--growing .growth-sprite { width: 92%; max-width: 200px; }
body.site-2027.catalogue-page .tree-growth .growth-sprite .tree-portrait {
  position: absolute;
  top: 0;
  left: 0;
  width: 200%;
  max-width: none;
  height: 100%;
  aspect-ratio: auto;
  object-fit: fill;
  transform: none;
}
body.site-2027.catalogue-page .tree-growth .growth-stage--growing .growth-sprite .tree-portrait { left: -100%; }
/* Adult source drawings have slightly different white margins at their bases. */
body.site-2027.catalogue-page .growth-stage--adult .tree-portrait { transform: translateY(var(--adult-ground, 10%)); }
.catalogue-poiriers, .catalogue-nashis, .catalogue-pruniers, .catalogue-cerisiers { --adult-ground: 3%; }
.catalogue-nefliers { --adult-ground: 9%; }
.catalogue-cognassiers { --adult-ground: 5%; }
.catalogue-abricotiers, .catalogue-plaqueminiers { --adult-ground: 7%; }
.catalogue-pechers, .catalogue-amandiers { --adult-ground: 4%; }
.catalogue-chataigniers { --adult-ground: 3%; }

.catalogue-abricotiers { --young-ground: 6%; }