/* Gardening demonstrates application; Technology opens the tablet and explains release. */
.gardening-page .garden-range-hero { padding-block: 38px 45px; }
.gardening-page .garden-range-inner,
.technical-page .tech-intro-layout {
  display: grid;
  grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr);
  align-items: center;
  gap: 45px;
}
.gardening-page .garden-range-copy,
.technical-page .tech-intro-copy { min-width: 0; }
.gardening-page .garden-range-copy h1,
.technical-page .tech-intro h1 {
  font-size: 38px;
  line-height: 1.18;
  letter-spacing: -.025em;
  max-width: 22ch;
}
.gardening-page .garden-range-copy h1 { margin-bottom: 16px; }
.gardening-page .garden-range-lead,
.technical-page .technology-lead {
  max-width: 53ch;
  font-size: 13px;
  line-height: 1.8;
}
.technical-page .technology-lead { margin-top: 16px; }
.gardening-page .garden-range-actions { margin-top: 16px; }
.technical-page .tech-formula-link { margin-top: 16px; }
.gardening-page .garden-range-visual {
  min-width: 0;
  width: 100%;
  height: auto;
  overflow: visible;
}
.gardening-page .garden-range-visual img {
  width: 100%;
  max-width: 100%;
  height: auto;
  aspect-ratio: 1672 / 941;
  object-fit: contain;
  transform: none;
  mix-blend-mode: normal;
}
.gardening-page #range { padding-top: 38px; }

/* A modest, unboxed cutaway shares the hero's visual centre with its copy. */
.technical-page .tech-intro { padding-top: 38px; }
.technical-page .tech-hero-image { min-width: 0; width: 100%; }
.technical-page .tech-hero-image img {
  width: 100%;
  height: auto;
  aspect-ratio: 1800 / 982;
  object-fit: contain;
  mix-blend-mode: multiply;
}
.technical-page .tech-hero-image figcaption {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-top: 10px;
  color: var(--muted);
  font: 400 11px/1.6 var(--sans);
}
.technical-page .tech-hero-image figcaption span { color: #879680; }
.technical-page .tech-page-nav { margin-top: 32px; padding-bottom: 10px; gap: 19px; }
.technical-page .tech-page-nav a { gap: 13px; }
.technical-page .tech-page-nav svg { transform: rotate(90deg); }

/* A consistent title column connects mechanism, profile and practical advantages. */
.technical-page .tech-mechanism { padding-block: 51px; }
.technical-page .tech-mechanism-panel {
  display: grid;
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.6fr);
  gap: 19px 45px;
  align-items: start;
}
.technical-page .tech-mechanism .tech-section-heading { display: block; margin: 0; }
.technical-page .tech-mechanism .tech-section-heading p { margin-top: 16px; max-width: 38ch; }
.technical-page .tech-process { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px; }
.technical-page .tech-process img { aspect-ratio: 1800 / 982; object-fit: contain; }
.technical-page .tech-step-title { margin-block: 14px 8px; }
.technical-page .tech-step-title h3 { font: 500 19px/1.3 var(--sans); letter-spacing: -.015em; }
.technical-page .tech-process p { font-size: 13px; line-height: 1.75; }
.technical-page .tech-note { grid-column: 2; margin: 0; }
.technical-page .tech-profile {
  width: min(var(--content), calc(100% - var(--gutter) * 2));
  padding: 40px;
}
.technical-page .tech-profile-panel {
  width: 100%;
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.6fr);
  gap: 38px;
}
.technical-page .tech-profile-copy h2 { margin-bottom: 16px; }
.technical-page .tech-advantages { padding-block: 51px; }
.technical-page .tech-advantages-panel {
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.6fr);
  gap: 19px 45px;
}
.technical-page .tech-advantage-list > div { grid-template-columns: minmax(0, .75fr) minmax(0, 1.25fr); gap: 19px; }
.technical-page .tech-handling-note { margin: 0; }
.technical-page .tech-range { padding-block: 38px; }
.technical-page .tech-support-panel { padding-block: 32px 45px; }

@media (max-width: 1100px) {
  .gardening-page .garden-range-inner,
  .technical-page .tech-intro-layout { gap: 26px; }
  .gardening-page .garden-range-copy h1,
  .technical-page .tech-intro h1 { font-size: 34px; }
  .technical-page .tech-mechanism-panel,
  .technical-page .tech-advantages-panel { gap: 19px 26px; }
  .technical-page .tech-profile { padding: 32px; }
  .technical-page .tech-profile-panel { gap: 26px; }
  .technical-page .tech-process { gap: 19px; }
}
@media (max-width: 800px) {
  .gardening-page .garden-range-hero { padding-block: 26px 32px; }
  .gardening-page .garden-range-inner,
  .technical-page .tech-intro-layout { grid-template-columns: 1fr; gap: 22px; }
  .gardening-page .garden-range-copy,
  .technical-page .tech-intro-copy { max-width: 620px; }
  .gardening-page .garden-range-copy h1 { max-width: 25ch; }
  .gardening-page .garden-range-visual,
  .technical-page .tech-hero-image { width: 100%; max-width: 620px; justify-self: center; }
  .technical-page .tech-intro { padding-top: 26px; }
  .technical-page .tech-page-nav { margin-top: 26px; }
  .technical-page .tech-mechanism,
  .technical-page .tech-advantages { padding-block: 38px; }
  .technical-page .tech-mechanism-panel,
  .technical-page .tech-advantages-panel { grid-template-columns: 1fr; gap: 22px; }
  .technical-page .tech-mechanism .tech-section-heading p { max-width: 62ch; margin-top: 13px; }
  .technical-page .tech-mechanism h2 br { display: none; }
  .technical-page .tech-note { grid-column: auto; }
  .technical-page .tech-profile-panel { grid-template-columns: 1fr; gap: 22px; }
  .technical-page .tech-profile-copy { max-width: 62ch; }
  .technical-page .tech-profile-copy h2 br { display: none; }
  .technical-page .tech-handling-note { grid-column: auto; }
}
@media (max-width: 580px) {
  .gardening-page .garden-range-copy h1,
  .technical-page .tech-intro h1 { font-size: 30px; }
  .gardening-page .garden-range-visual { height: auto; }
  .gardening-page #range { padding-top: 26px; }
  .technical-page .tech-page-nav { gap: 0; }
  .technical-page .tech-mechanism,
  .technical-page .tech-advantages { padding-block: 32px; }
  .technical-page .tech-process { grid-template-columns: 1fr; gap: 22px; }
  .technical-page .tech-profile { padding: 24px; }
  .technical-page .tech-profile-panel { gap: 19px; }
  .technical-page .tech-advantage-list > div { grid-template-columns: 1fr; gap: 8px; }
  .technical-page .tech-range { padding-block: 29px; }
  .technical-page .tech-support-panel { padding-block: 26px 35px; }
}
