/* Maison Miel — V21 visual integration
   Editorial image treatment only. No card UI, no rounded-image slop, no shadows.
   Home/footer are untouched. */

/* ==========================================================
   ÜBER UNS — image should feel built into the page, not boxed.
   ========================================================== */
body.about-v5-page .about-v5-hero{
  display:grid !important;
  grid-template-columns:minmax(340px,.86fr) minmax(520px,1.14fr) !important;
  align-items:stretch !important;
  gap:0 !important;
  min-height:620px !important;
  padding:0 !important;
  overflow:hidden !important;
  background:#fcf4e5 !important;
}
body.about-v5-page .about-v5-hero::after{display:none !important;}

body.about-v5-page .about-v5-hero__copy{
  position:relative !important;
  z-index:4 !important;
  width:auto !important;
  max-width:none !important;
  min-height:620px !important;
  padding:88px clamp(42px,5vw,86px) 84px clamp(64px,9vw,156px) !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
}
body.about-v5-page .about-v5-hero__copy h1{
  max-width:560px !important;
  margin:16px 0 22px !important;
  font-size:clamp(60px,5.15vw,84px) !important;
  line-height:.92 !important;
  letter-spacing:-.045em !important;
}
body.about-v5-page .about-v5-hero__copy > p:not(.about-v5-eyebrow){
  max-width:510px !important;
  font-size:18px !important;
  line-height:1.68 !important;
}

body.about-v5-page .about-v5-hero__media{
  position:relative !important;
  z-index:1 !important;
  width:100% !important;
  height:auto !important;
  min-height:620px !important;
  overflow:hidden !important;
  border-radius:0 !important;
  box-shadow:none !important;
  background:#e7c996 !important;
}
body.about-v5-page .about-v5-hero__media::before{
  content:"" !important;
  display:block !important;
  position:absolute !important;
  z-index:2 !important;
  left:0 !important;
  top:0 !important;
  bottom:0 !important;
  width:clamp(38px,4.5vw,76px) !important;
  pointer-events:none !important;
  background:linear-gradient(90deg,#fcf4e5 0%,rgba(252,244,229,.76) 28%,rgba(252,244,229,.22) 67%,transparent 100%) !important;
}
body.about-v5-page .about-v5-hero__media::after{
  content:"" !important;
  position:absolute !important;
  z-index:2 !important;
  left:0 !important;
  right:0 !important;
  bottom:0 !important;
  height:46px !important;
  pointer-events:none !important;
  background:linear-gradient(180deg,transparent 0%,rgba(252,244,229,.58) 70%,#fcf4e5 100%) !important;
}
body.about-v5-page .about-v5-hero__media img{
  display:block !important;
  width:100% !important;
  height:100% !important;
  min-height:620px !important;
  object-fit:cover !important;
  object-position:49% 50% !important;
  transform:none !important;
  border-radius:0 !important;
}

body.about-v5-page .about-v5-hero__flowers{
  left:calc(46% - 88px) !important;
  right:auto !important;
  bottom:-34px !important;
  width:180px !important;
  opacity:.42 !important;
}
body.about-v5-page .about-v5-hero__bee{
  left:47.5% !important;
  right:auto !important;
  top:30% !important;
  width:50px !important;
  height:50px !important;
  opacity:.9 !important;
}
body.about-v5-page .about-v5-flight{
  left:43.5% !important;
  right:auto !important;
  top:25% !important;
  width:220px !important;
  opacity:.32 !important;
}

/* ==========================================================
   BIENENPRODUKTE — editorial image/text composition.
   The image stays rectangular and visually blends at one edge only.
   ========================================================== */
body.products-discovery .collection-story{
  padding:92px 0 108px !important;
  background:#fff8eb !important;
}
body.products-discovery .collection-story .wrap{
  width:min(1320px,calc(100% - 80px)) !important;
  display:grid !important;
  grid-template-columns:minmax(0,1.2fr) minmax(330px,.8fr) !important;
  align-items:center !important;
  gap:clamp(48px,6vw,92px) !important;
}
body.products-discovery .collection-story .wide-image{
  display:block !important;
  width:100% !important;
  height:clamp(500px,38vw,620px) !important;
  object-fit:cover !important;
  object-position:46% 52% !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  -webkit-mask-image:linear-gradient(90deg,#000 0%,#000 93%,rgba(0,0,0,.82) 96%,transparent 100%) !important;
  mask-image:linear-gradient(90deg,#000 0%,#000 93%,rgba(0,0,0,.82) 96%,transparent 100%) !important;
}
body.products-discovery .collection-story .story-caption{
  display:block !important;
  width:100% !important;
  max-width:460px !important;
  padding:0 !important;
}
body.products-discovery .collection-story .story-caption h2{
  max-width:440px !important;
  margin:0 0 24px !important;
  font-size:clamp(54px,4.85vw,78px) !important;
  line-height:.92 !important;
  letter-spacing:-.045em !important;
}
body.products-discovery .collection-story .story-caption p{
  max-width:430px !important;
  margin:0 0 22px !important;
  font-size:16.5px !important;
  line-height:1.72 !important;
}

/* ---------- tablet ---------- */
@media (max-width:1100px){
  body.about-v5-page .about-v5-hero{
    grid-template-columns:minmax(310px,.9fr) minmax(410px,1.1fr) !important;
    min-height:560px !important;
  }
  body.about-v5-page .about-v5-hero__copy{
    min-height:560px !important;
    padding:72px 38px 72px 48px !important;
  }
  body.about-v5-page .about-v5-hero__copy h1{
    font-size:clamp(54px,5.8vw,70px) !important;
  }
  body.about-v5-page .about-v5-hero__media,
  body.about-v5-page .about-v5-hero__media img{
    min-height:560px !important;
  }
  body.about-v5-page .about-v5-hero__bee,
  body.about-v5-page .about-v5-flight{display:none !important;}

  body.products-discovery .collection-story .wrap{
    width:calc(100% - 56px) !important;
    grid-template-columns:minmax(0,1.08fr) minmax(290px,.92fr) !important;
    gap:40px !important;
  }
  body.products-discovery .collection-story .wide-image{
    height:clamp(430px,44vw,540px) !important;
  }
}

/* ---------- mobile ---------- */
@media (max-width:820px){
  body.about-v5-page .about-v5-hero{
    display:flex !important;
    flex-direction:column !important;
    min-height:0 !important;
    background:#fcf4e5 !important;
  }
  body.about-v5-page .about-v5-hero__media{
    order:1 !important;
    width:100% !important;
    min-height:0 !important;
    height:clamp(330px,77vw,460px) !important;
    border-radius:0 !important;
    box-shadow:none !important;
  }
  body.about-v5-page .about-v5-hero__media img{
    min-height:0 !important;
    height:100% !important;
    object-position:43% 46% !important;
  }
  body.about-v5-page .about-v5-hero__media::before{display:none !important;}
  body.about-v5-page .about-v5-hero__media::after{
    display:block !important;
    height:64px !important;
    background:linear-gradient(180deg,transparent 0%,rgba(252,244,229,.72) 65%,#fcf4e5 100%) !important;
  }
  body.about-v5-page .about-v5-hero__copy{
    order:2 !important;
    width:100% !important;
    max-width:640px !important;
    min-height:0 !important;
    padding:30px 20px 66px !important;
    margin:0 auto !important;
  }
  body.about-v5-page .about-v5-hero__copy h1{
    max-width:520px !important;
    font-size:clamp(48px,11.7vw,62px) !important;
    line-height:.93 !important;
  }
  body.about-v5-page .about-v5-hero__copy > p:not(.about-v5-eyebrow){
    max-width:520px !important;
    font-size:16px !important;
    line-height:1.62 !important;
  }
  body.about-v5-page .about-v5-hero__flowers{
    left:auto !important;
    right:-34px !important;
    bottom:220px !important;
    width:128px !important;
    opacity:.28 !important;
  }
  body.about-v5-page .about-v5-hero__bee,
  body.about-v5-page .about-v5-flight{display:none !important;}

  body.products-discovery .collection-story{
    padding:72px 0 84px !important;
  }
  body.products-discovery .collection-story .wrap{
    width:calc(100% - 32px) !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    gap:26px !important;
  }
  body.products-discovery .collection-story .wide-image{
    width:100% !important;
    height:clamp(300px,74vw,420px) !important;
    object-position:42% 50% !important;
    border-radius:0 !important;
    box-shadow:none !important;
    -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 94%,rgba(0,0,0,.76) 97%,transparent 100%) !important;
    mask-image:linear-gradient(180deg,#000 0%,#000 94%,rgba(0,0,0,.76) 97%,transparent 100%) !important;
  }
  body.products-discovery .collection-story .story-caption{
    max-width:600px !important;
  }
  body.products-discovery .collection-story .story-caption h2{
    font-size:clamp(42px,10.5vw,56px) !important;
    line-height:.94 !important;
    margin-bottom:18px !important;
  }
  body.products-discovery .collection-story .story-caption p{
    font-size:15.5px !important;
    line-height:1.62 !important;
  }
}

@media (max-width:430px){
  body.about-v5-page .about-v5-hero__media{
    height:clamp(300px,82vw,360px) !important;
  }
  body.about-v5-page .about-v5-hero__copy{
    padding:24px 16px 58px !important;
  }
  body.about-v5-page .about-v5-hero__copy h1{
    font-size:clamp(44px,12vw,54px) !important;
  }
  body.about-v5-page .about-v5-hero__copy > p:not(.about-v5-eyebrow){
    font-size:15px !important;
  }
  body.products-discovery .collection-story .wrap{
    width:calc(100% - 24px) !important;
  }
  body.products-discovery .collection-story .wide-image{
    height:clamp(270px,76vw,330px) !important;
  }
}


/* ===== V22 mobile-only footer honey line fix ===== */
@media (max-width: 640px) {
  .footerref-page {
    overflow: hidden !important;
  }

  /* Use the single supplied artwork on mobile so the wave and drips stay visually connected. */
  .footerref-left-wave {
    display: none !important;
  }

  .footerref-honey {
    left: 50% !important;
    top: 0 !important;
    width: 138% !important;
    height: auto !important;
    transform: translateX(-50%) !important;
    object-fit: contain !important;
    object-position: top center !important;
  }
}

@media (max-width: 430px) {
  .footerref-honey {
    width: 148% !important;
  }
}
