/* Mobile editorial rhythm: keep the first message and subject in one view. */
@media (max-width: 700px) {
  body > main > .hero { height: max(700px, calc(100svh - 60px)); }
  .hero-copy { top: 72px; }
  .hero-shade { background: linear-gradient(180deg, #050505 0%, #050505 12%, rgba(5,5,5,.88) 30%, transparent 54%), linear-gradient(0deg, #050505, transparent 12%); }
  .hero .intro, .hero .down, .process-heading p, .stage-copy p { font-size: 14px; line-height: 1.6; }

  .intro-hero, .products-hero, .enquiry-hero, .how-hero, .how-hero.guide-hero,
  .biz-hero, .about-hero, .quality-hero, .tech-hero,
  .business-overview-hero { padding-top: 78px; }
  .intro-hero h1, .products-hero h1, .enquiry-hero h1,
  .how-hero h1, html[lang=en] .how-hero h1,
  .biz-hero h1, html[lang=en] .biz-hero h1,
  .about-hero h1, html[lang=en] .about-hero h1,
  .quality-hero h1, html[lang=en] .quality-hero h1,
  .tech-hero h1, html[lang=en] .tech-hero h1,
  .business-overview-hero h1 { margin-top: 28px; }
  .business-overview-hero { align-items: flex-start; min-height: 640px; }
  .enquiry-hero { min-height: 690px; }
  .products-hero { min-height: 780px; }
  .products-hero-art { background-position: 66% bottom; }
  .intro-deck, .products-hero-copy > p:not(.eyebrow),
  .enquiry-hero-copy > p:not(.eyebrow), .how-hero .deck,
  .biz-hero .deck, .about-hero .deck, .quality-hero .deck,
  .tech-hero .deck, .business-overview-intro > p,
  .business-overview-next p, .voices-stage-head > p { font-size: 14px; line-height: 1.65; }

  .voices-intro { min-height: 650px; padding: 76px 7% 55px; align-items: flex-start; }
  .voices-kicker { margin-top: 30px; }
  .voices-lead { margin: 27px 0 35px; }

  .original-hero, .ginseng-hero, .mango-hero, .custom-hero, .vn-hero { min-height: 760px; }
  .original-hero-copy, .ginseng-copy, .mango-copy, .custom-copy, .vn-copy { padding-top: 78px; }
  .product-kicker, .concept-tag, .mango-tag, .custom-kicker, .vn-status { margin-top: 24px; }
  .product-desc, .ginseng-note, .mango-note, .custom-note, .vn-deck { font-size: 14px; line-height: 1.65; }
}

@media (max-width: 370px) {
  body > main > .hero { height: 710px; }
  .hero-copy { top: 60px; }
  .intro-hero, .products-hero, .enquiry-hero, .how-hero, .how-hero.guide-hero,
  .biz-hero, .about-hero, .quality-hero, .tech-hero,
  .business-overview-hero { padding-top: 66px; }
  .original-hero-copy, .ginseng-copy, .mango-copy, .custom-copy, .vn-copy { padding-top: 66px; }
}

/* Make the first message visible sooner on small screens without changing the desktop composition. */
@media (max-width: 700px) {
  .hero-copy { top: 46px; }
  .products-hero, .enquiry-hero { padding-top: 46px; }
  .products-hero { min-height: 790px; }
  .products-hero-art { background-size: auto 430px; }
  .enquiry-hero { min-height: 720px; }
  .enquiry-hero-art { background-size: auto 450px; }
}
@media (max-width: 370px) {
  .hero-copy { top: 38px; }
  .products-hero, .enquiry-hero { padding-top: 40px; }
}
