/*
  INFERT responsive art-direction system.
  Physical artwork keeps one coordinate system in both languages.
  Copy direction may change; scene geometry does not.
*/
:root {
  --scene-gutter: clamp(1.25rem, 3.5vw, 4rem);
  --scene-space: clamp(4.5rem, 7vw, 7rem);
  --hero-header: var(--header-height, 88px);
}

/* ---------- Direction + artwork invariants ---------- */
.garden-flow .brand,
.garden-flow .garden-layer.edge-branch,
.garden-flow :is(.range-bags,.product-bag-stage,.detail-product-stage,.story-pack-stage,.collection-composition,.network-map) {
  direction:ltr;
}
.garden-flow .edge-branch > .garden-botanical {
  left:0;
  right:auto;
  top:0;
  bottom:auto;
}
.garden-flow :is(
  .garden-view,.root-story-grid,.garden-range .family-panel,.story-hero-grid,
  .collection-hero-grid,.crop-insights-heading,.process-layout,.programme-grid,
  .research-principles .principles-lead,.direct-contact-grid
) {
  direction:ltr;
}
html[lang="ar"] .garden-flow :is(
  .garden-hero-copy,.root-story-title,.root-story-copy,.family-description,
  .story-hero-copy,.collection-copy,.crop-insights-heading .section-heading,
  .process-text-panels,.programme-copy,.principles-title,.garden-science-copy,
  .about-purpose,.invitation-copy,.direct-contact-copy,.story-heading
) {
  direction:rtl;
  text-align:right;
}
html[lang="ar"] .garden-flow .garden-hero-copy { text-align:center; }

.garden-motion,.pause-motion { display:none!important; }

/* ---------- Full-screen hero ---------- */
.garden-flow main .garden-hero {
  position:relative;
  height:auto;
  min-height:calc(100svh - var(--hero-header));
  overflow:clip;
  isolation:isolate;
}
.garden-flow main .garden-hero .garden-view {
  position:relative;
  top:0;
  height:auto;
  min-height:calc(100svh - var(--hero-header));
  padding-block:clamp(4.5rem,7vh,7rem) clamp(5.75rem,9vh,8rem);
  display:grid;
  place-items:center;
  overflow:clip;
}
.garden-flow .garden-hero-copy {
  width:min(44vw, 53rem);
  max-width:calc(100vw - 2 * var(--scene-gutter));
  padding-inline:1rem;
  padding-bottom:0;
  transform:none;
}
.garden-flow .garden-hero-copy h1 { margin:0; }
.garden-flow .garden-hero-copy .pattern-type {
  font-size:clamp(4rem,7vw,8.35rem);
  line-height:1.04;
}
html[lang="ar"] .garden-flow .garden-hero-copy .pattern-type {
  font-size:clamp(3.4rem,6.5vw,7.3rem);
  line-height:1.34;
  font-weight:700;
}
.garden-flow .garden-hero .edge-branch.hero-canopy {
  left:-8vw;
  right:auto;
  top:clamp(1.25rem,4vh,3.5rem);
  --branch-size:clamp(360px,34vw,720px);
}
.garden-flow .garden-hero .edge-branch.hero-plums {
  left:-3vw;
  right:auto;
  top:auto;
  bottom:8%;
  --branch-size:clamp(250px,25vw,500px);
}
.garden-flow .garden-hero .edge-branch.hero-citrus {
  right:-4vw;
  left:auto;
  top:auto;
  bottom:-3%;
  --branch-size:clamp(320px,31vw,650px);
}
.garden-flow .garden-scroll { bottom:1.5rem; }

/* ---------- Editorial scene: rooted story ---------- */
.garden-flow .root-story {
  padding-block:var(--scene-space);
}
.garden-flow .root-story-grid {
  grid-template-columns:minmax(0,1fr) minmax(280px,.82fr) minmax(0,.82fr);
  gap:clamp(2rem,4vw,4.5rem);
  align-items:center;
}
.garden-flow .root-story-title {
  padding-top:0;
  align-self:center;
}
.garden-flow .root-story-copy {
  padding-bottom:0;
  align-self:center;
}
.garden-flow .root-study {
  height:clamp(480px,40vw,680px);
}
.garden-flow .root-study-plant {
  width:125%;
  left:-12.5%;
  top:0;
}

/* ---------- Product visual primitive ---------- */
.garden-flow .garden-range .family-panel {
  grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);
  gap:clamp(2rem,5vw,5rem);
  align-items:center;
  padding-block:2.5rem 1rem;
}
.garden-flow .garden-range .range-bags {
  --pack-w:70%;
  --pack-h:92%;
  --material-w:42%;
  --material-right:4%;
  --material-bottom:2%;
  position:relative;
  display:grid;
  place-items:center;
  width:100%;
  height:clamp(430px,38vw,590px);
  min-height:0;
  margin:0;
  overflow:visible;
  isolation:isolate;
}
.garden-flow .garden-range .range-bag {
  position:absolute;
  inset:2% 0 auto;
  margin:auto;
  width:var(--pack-w);
  height:var(--pack-h);
  max-width:100%;
  object-fit:contain;
  object-position:center bottom;
}
.garden-flow .garden-range .family-material {
  width:var(--material-w);
  max-width:none;
  right:var(--material-right);
  left:auto;
  bottom:var(--material-bottom);
  z-index:4;
}
.garden-flow :is(.crop-panel-liquid,.crop-panel-suspension-gel,.crop-panel-foliar) .range-bags {
  --pack-w:58%;
  --material-w:38%;
  --material-right:11%;
  --material-bottom:5%;
}
.garden-flow :is(.crop-panel-micro-element) .range-bags {
  --pack-w:62%;
  --material-w:40%;
  --material-right:8%;
}
.garden-flow .garden-range .family-description {
  min-width:0;
  min-block-size:0;
  padding:0;
}
.garden-flow .garden-range .family-description .concept-note {
  position:static;
  margin-top:1rem;
}

.garden-flow .product-card {
  --card-pack-w:70%;
  --card-material-w:48%;
  --card-material-right:1%;
  --card-material-bottom:2%;
}
.garden-flow .product-card[data-family="liquid"],
.garden-flow .product-card[data-family="suspension-gel"],
.garden-flow .product-card[data-family="foliar"] {
  --card-pack-w:60%;
  --card-material-w:40%;
  --card-material-right:8%;
  --card-material-bottom:5%;
}
.garden-flow .product-bag-stage {
  position:relative;
  display:grid;
  place-items:center;
  min-height:0;
  height:clamp(300px,31vw,460px);
  padding:1.5rem 1rem 2.5rem;
  overflow:hidden;
}
.garden-flow .product-bag-stage .product-bag {
  width:var(--card-pack-w);
  height:92%;
  object-fit:contain;
  object-position:center bottom;
  padding:0;
}
.garden-flow .product-bag-stage .card-material {
  width:var(--card-material-w);
  right:var(--card-material-right);
  left:auto;
  bottom:var(--card-material-bottom);
}

.garden-flow .story-pack-stage,
.garden-flow .detail-product-stage {
  --detail-pack-w:70%;
  --detail-material-w:42%;
  --detail-material-right:1%;
  --detail-material-bottom:3%;
  position:relative;
  width:100%;
  max-width:680px;
  aspect-ratio:1.04;
  margin-inline:auto;
}
.garden-flow .story-pack-stage .story-bag,
.garden-flow .detail-product-stage .detail-bag {
  position:absolute;
  inset:auto 0 5%;
  margin:auto;
  width:var(--detail-pack-w);
  height:90%;
  object-fit:contain;
  object-position:center bottom;
}
.garden-flow .story-pack-stage .story-material,
.garden-flow .detail-product-stage .detail-material {
  position:absolute;
  width:var(--detail-material-w);
  height:auto;
  right:var(--detail-material-right);
  left:auto;
  bottom:var(--detail-material-bottom);
  z-index:3;
  object-fit:contain;
}
.garden-flow [data-product-story^="lq-"] .story-pack-stage,
.garden-flow [data-product-story^="sc-"] .story-pack-stage,
.garden-flow [data-product-story^="gel-"] .story-pack-stage,
.garden-flow [data-product-story^="fo-"] .story-pack-stage {
  --detail-pack-w:58%;
  --detail-material-w:35%;
  --detail-material-right:10%;
  --detail-material-bottom:5%;
}
.garden-flow .story-intro { padding-block:2.5rem 4.5rem; }
.garden-flow .story-hero-grid {
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:clamp(2.5rem,6vw,6rem);
}
.garden-flow .story-visual { align-self:center; }
.garden-flow .story-hero-copy { align-self:center; }

/* ---------- Map scene ---------- */
.garden-flow .network-wrap {
  width:min(calc(100% - 2 * var(--scene-gutter)), 1680px);
  max-width:1680px;
  margin-inline:auto;
}
.garden-flow .network-garden {
  padding-block:clamp(4rem,6vw,6.5rem);
}
.garden-flow .network-heading { margin-bottom:2.25rem; }
.garden-flow .network-canvas { margin-top:1rem; }
.garden-flow .network-map {
  aspect-ratio:2.05;
  min-height:clamp(430px,31vw,650px);
}
.garden-flow .network-country-control { width:min(360px,100%); }

@media (min-width:1600px) {
  .garden-flow .garden-hero-copy { width:min(43vw,56rem); }
  .garden-flow .garden-hero .edge-branch.hero-canopy { --branch-size:min(36vw,760px); }
  .garden-flow .garden-hero .edge-branch.hero-citrus { --branch-size:min(33vw,690px); }
  .garden-flow .garden-hero .edge-branch.hero-plums { --branch-size:min(27vw,540px); }
}

@media (max-width:1099px) {
  .garden-flow .garden-hero-copy { width:min(58vw,42rem); }
  .garden-flow .garden-hero-copy .pattern-type { font-size:clamp(3.5rem,8vw,6.4rem); }
  .garden-flow .garden-hero .edge-branch.hero-canopy { left:-8vw; --branch-size:40vw; }
  .garden-flow .garden-hero .edge-branch.hero-citrus { right:-7vw; --branch-size:36vw; }
  .garden-flow .garden-hero .edge-branch.hero-plums { left:-5vw; --branch-size:29vw; }
  .garden-flow .root-story-grid { grid-template-columns:1fr .85fr; }
  .garden-flow .root-story-title { grid-column:1; }
  .garden-flow .root-study { grid-column:2; grid-row:1 / span 2; height:clamp(390px,50vw,540px); }
  .garden-flow .root-story-copy { grid-column:1; }
  .garden-flow .garden-range .family-panel { gap:2.25rem; }
  .garden-flow .network-wrap { width:min(calc(100% - 2 * var(--scene-gutter)), 1120px); }
  .garden-flow .network-map { min-height:380px; }
}

@media (max-width:699px) {
  :root {
    --scene-gutter:1.1rem;
    --scene-space:3.25rem;
  }
  .garden-flow .nav-inner { height:auto; min-height:74px; }
  .garden-flow main .garden-hero {
    min-height:calc(100svh - 74px);
  }
  .garden-flow main .garden-hero .garden-view {
    min-height:calc(100svh - 74px);
    padding-block:clamp(5rem,14vh,7.5rem) clamp(6.5rem,16vh,9rem);
  }
  .garden-flow .garden-hero-copy {
    width:100%;
    max-width:32rem;
    padding-inline:1.25rem;
  }
  .garden-flow .hero-title-line {
    font-size:clamp(1.25rem,5.3vw,1.8rem);
  }
  .garden-flow .garden-hero-copy .pattern-type {
    font-size:clamp(2.8rem,12vw,4.6rem);
    line-height:1.08;
  }
  html[lang="ar"] .garden-flow .garden-hero-copy .pattern-type {
    font-size:clamp(2.6rem,11vw,4.2rem);
    line-height:1.34;
  }
  .garden-flow .garden-hero-copy > p {
    font-size:1rem;
    max-width:28ch;
    margin-block:1.2rem 1.35rem;
  }
  .garden-flow .garden-hero .edge-branch.hero-canopy {
    left:-7vw;
    top:.75rem;
    --branch-size:min(58vw,270px);
  }
  .garden-flow .garden-hero .edge-branch.hero-plums {
    left:-5vw;
    bottom:8%;
    --branch-size:min(45vw,210px);
  }
  .garden-flow .garden-hero .edge-branch.hero-citrus {
    right:-9vw;
    bottom:-1%;
    --branch-size:min(48vw,225px);
  }
  .garden-flow .garden-scroll { bottom:1rem; }

  /* normal-flow editorial chapters */
  .garden-flow .root-story { padding-block:var(--scene-space); }
  .garden-flow .root-story-grid {
    grid-template-columns:1fr;
    gap:1.4rem;
    text-align:center;
  }
  .garden-flow .root-story-title,
  .garden-flow .root-story-copy,
  html[lang="ar"] .garden-flow :is(.root-story-title,.root-story-copy) {
    padding:0;
    text-align:center;
  }
  .garden-flow .root-story-title h2 { font-size:clamp(2.45rem,10vw,3.5rem); }
  .garden-flow .root-study {
    grid-column:auto;
    grid-row:auto;
    height:clamp(300px,78vw,390px);
    order:2;
  }
  .garden-flow .root-story-title { order:1; }
  .garden-flow .root-story-copy { order:3; }
  .garden-flow .root-study-plant {
    inset:0;
    width:100%;
    height:100%;
  }
  .garden-flow .root-study-plant .garden-botanical {
    width:100%;
    height:100%;
    object-fit:contain;
  }
  .garden-flow .root-story-copy > p { margin-inline:auto; max-width:34ch; }

  .garden-flow .section,
  .garden-flow .garden-range-passage,
  .garden-flow .garden-document-passage,
  .garden-flow .research-principles {
    padding-block:var(--scene-space);
  }

  .garden-flow .garden-range-section > .wrap > h2 { margin-bottom:1.6rem; }
  .garden-flow .garden-range .family-tabs {
    justify-content:flex-start;
    gap:.45rem;
  }
  .garden-flow .garden-range .family-tabs [role="tab"] {
    min-block-size:74px;
    flex:0 0 7.5rem;
  }
  .garden-flow .garden-range .family-panel {
    display:flex;
    flex-direction:column;
    gap:1.15rem;
    padding-block:1rem 0;
  }
  .garden-flow .garden-range .range-bags {
    width:100%;
    max-width:27rem;
    height:clamp(300px,82vw,390px);
    margin-inline:auto;
    order:1;
  }
  .garden-flow .garden-range .family-description {
    width:100%;
    order:2;
    text-align:center;
  }
  html[lang="ar"] .garden-flow .garden-range .family-description { text-align:center; }
  .garden-flow .garden-range .family-description :is(h3,p),
  html[lang="ar"] .garden-flow .garden-range .family-description :is(h3,p) {
    margin-inline:auto;
  }
  .garden-flow .garden-range .family-description p { margin-block:1rem; }

  .garden-flow .product-bag-stage {
    height:clamp(310px,86vw,410px);
  }
  .garden-flow .product-card {
    --card-pack-w:68%;
    --card-material-w:48%;
  }

  .garden-flow .story-intro { padding-block:1.75rem 3rem; }
  .garden-flow .story-hero-grid {
    grid-template-columns:1fr;
    gap:1.5rem;
  }
  .garden-flow .story-hero-copy { grid-row:1; text-align:left; }
  html[lang="ar"] .garden-flow .story-hero-copy { text-align:right; }
  .garden-flow .story-visual { grid-row:2; }
  .garden-flow .story-pack-stage,
  .garden-flow .detail-product-stage {
    max-width:28rem;
    aspect-ratio:1.05;
  }

  .garden-flow :is(.vineyard-science,.fig-garden,.peach-partnership,.orchard-invitation) {
    min-height:0;
    display:block;
    padding-block:var(--scene-space);
  }
  .garden-flow :is(.garden-science-copy,.about-purpose,.invitation-copy),
  .garden-flow .peach-partnership .wrap > div {
    width:100%;
    margin:0;
    padding:0;
    text-align:center;
  }
  html[lang="ar"] .garden-flow :is(.garden-science-copy,.about-purpose,.invitation-copy) { text-align:center; }
  .garden-flow :is(.vineyard-science,.fig-garden,.peach-partnership,.orchard-invitation) > .edge-branch {
    position:relative;
    inset:auto;
    width:100%;
    height:auto;
    margin-top:1.5rem;
  }
  .garden-flow :is(.vineyard-science,.fig-garden,.peach-partnership,.orchard-invitation) > .edge-branch > .garden-botanical {
    position:relative;
    inset:auto;
    display:block;
    width:min(88vw,31rem);
    height:auto;
    margin-inline:auto;
    transform:none!important;
  }

  .garden-flow .research-garden-header {
    min-height:0;
    display:block;
    padding-bottom:0;
  }
  .garden-flow .research-garden-header .page-hero { padding-block:var(--scene-space) 1.5rem; }
  .garden-flow .research-garden-header .page-hero-row {
    width:100%;
    max-width:100%;
    margin:0;
  }
  .garden-flow .research-garden-header .page-hero h1 {
    max-width:13ch;
    font-size:clamp(2.6rem,10.5vw,4rem);
  }
  .garden-flow .research-garden-header .edge-branch.research-blossoms {
    position:relative;
    inset:auto;
    width:100%;
    height:auto;
    margin-top:.5rem;
  }
  .garden-flow .research-garden-header .research-blossoms > .garden-botanical {
    position:relative;
    inset:auto;
    width:min(92vw,32rem);
    height:auto;
    margin-left:auto;
    transform:none!important;
  }

  .garden-flow .network-wrap {
    width:calc(100% - 2 * var(--scene-gutter));
  }
  .garden-flow .network-garden { padding-block:3.5rem; }
  .garden-flow .network-heading { margin-bottom:1.75rem; }
  .garden-flow .network-toolbar {
    align-items:stretch;
    gap:.75rem;
  }
  .garden-flow .network-country-control { width:100%; }
  .garden-flow .network-map {
    min-height:0;
    aspect-ratio:1.58;
  }
  .garden-flow .network-popup {
    width:100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .garden-flow .garden-layer,
  .garden-flow .garden-hero-copy,
  .garden-flow .hero-title-line,
  .garden-flow .garden-hero-copy > p,
  .garden-flow .garden-hero-copy > .btn {
    animation:none!important;
    transform:none!important;
    transition:none!important;
  }
}
