/* Only the outside of the page clips the garden. Section backgrounds paint
   below the shared positive branch layer; readable content keeps its own layer. */
html { overflow-x:clip; }
body.garden-flow { isolation:isolate; }
.garden-flow main,
.garden-flow main :has(.edge-branch),
.garden-flow .garden-footer {
 overflow:visible;
 isolation:auto;
 z-index:auto;
}
/* Explicit fallbacks also cover the principal scenes without :has(). */
.garden-flow .garden-world,
.garden-flow .continuous-garden,
.garden-flow .vineyard-science,
.garden-flow .certification-garden,
.garden-flow .garden-insights,
.garden-flow .orchard-invitation,
.garden-flow .fig-garden,
.garden-flow .peach-partnership,
.garden-flow .garden-page-opening,
.garden-flow .garden-document-passage,
.garden-flow .research-garden-header,
.garden-flow .research-principles,
.garden-flow .harvest-hero,
.garden-flow .garden-root-passage,
.garden-flow .garden-range-passage {
 overflow:visible;
 isolation:auto;
 z-index:auto;
}
.garden-flow .edge-branch { z-index:2; pointer-events:none; }
/* Sticky positioning creates a context of its own. Keep the whole hero above
   subsequent backgrounds so its foliage can cross the first transition. */
.garden-flow main .garden-view { overflow:visible; isolation:auto; z-index:2; }
.garden-flow .garden-footer>.wrap { position:relative; z-index:3; }

/* The supplied tagline appears once. Generous painted bounds protect both
   the letter shapes and descenders at desktop and mobile text sizes. */
.garden-flow .garden-hero-copy { max-width:1160px; padding-inline:clamp(1rem,4vw,4rem); padding-bottom:3rem; }
.garden-flow .garden-hero-copy h1 { margin:0; font-size:inherit; line-height:1.1; letter-spacing:-.035em; }
.garden-flow .hero-title-line { font-size:clamp(1.5rem,3vw,2.75rem); font-weight:500; line-height:1.35; letter-spacing:-.025em; margin-bottom:.6rem; }
.garden-flow .garden-hero-copy .pattern-type {
 --pattern-period:400px;
 font-size:clamp(3.5rem,8.6vw,8.4rem);
 font-weight:800;
 line-height:1.05;
 letter-spacing:-.04em;
 padding:.06em .06em .16em;
 margin:0 auto -.07em;
 width:fit-content;
 max-width:100%;
 background-size:var(--pattern-period) auto;
 background-position:0 50%;
 animation:growth-pattern-flow 20s linear infinite;
 overflow:visible;
 overflow-wrap:normal;
}
.hero-growth-word { display:block; }
@keyframes growth-pattern-flow {
 from { background-position:0 50%; }
 to { background-position:var(--pattern-period) 50%; }
}
.garden-flow .garden-hero .edge-branch .garden-botanical {
 opacity:1;
 animation:hero-living-breeze 8s ease-in-out infinite alternate;
}
.garden-flow .garden-hero .hero-citrus .garden-botanical { animation-duration:10s; animation-delay:-5s; }
.garden-flow .garden-hero .hero-plums .garden-botanical { animation-duration:9s; animation-delay:-3s; }
@keyframes hero-living-breeze {
 from { transform:translate(calc(-1 * var(--stem-x)),calc(-1 * var(--stem-y))) rotate(calc(var(--branch-angle) - 1.2deg)) scaleX(var(--branch-flip)); }
 to { transform:translate(calc(-1 * var(--stem-x)),calc(-1 * var(--stem-y))) rotate(calc(var(--branch-angle) + 1.2deg)) scaleX(var(--branch-flip)); }
}
.garden-flow .garden-scene-sleeping .garden-botanical { animation-play-state:paused; }
.garden-flow.motion-paused .garden-botanical,
.garden-flow.motion-paused .pattern-type { animation-play-state:paused!important; }
@media(max-width:650px) {
 .garden-flow .garden-hero-copy { padding-inline:1rem; padding-bottom:3rem; }
 .garden-flow .hero-title-line { font-size:clamp(1.3rem,5.3vw,1.9rem); margin-bottom:.7rem; }
 .garden-flow .garden-hero-copy .pattern-type {
  --pattern-period:270px;
  font-size:clamp(2.4rem,10.7vw,4.4rem);
  line-height:1.1;
  letter-spacing:-.035em;
 }
}
@media(prefers-reduced-motion:reduce) {
 .garden-flow .garden-hero-copy .pattern-type,
 .garden-flow .garden-hero .edge-branch .garden-botanical { animation:none!important; }
}
@media print {
 .garden-flow .garden-hero-copy .pattern-type { animation:none!important; color:black; background:none; }
 .garden-flow .edge-branch { display:none!important; }
}