/*
  Maison Miel inner pages — unified image placement V2
  Home + Shop are intentionally NOT linked to this file.
  Rule: imagery belongs to the layout, never sits under copy, never uses a broad milky overlay.
*/

:root{
  --mm-page:#fff8ea;
  --mm-cream:#f7e7c5;
  --mm-cream-soft:#fbf2df;
  --mm-cream-alt:#f5e5c7;
  --mm-ink:#342313;
  --mm-copy:#6a5138;
}

/* Shared photo behavior on redesigned inner pages */
body.inner-premium-page main{overflow:hidden}
body.inner-premium-page img{max-width:100%}

/* =========================================================
   JOURNAL INDEX
   ========================================================= */
body.journal-index main{background:var(--mm-page)!important}
body.journal-index .journal-hero{
  background:var(--mm-page)!important;
  padding:92px 0 68px!important;
}
body.journal-index .journal-hero .journal-title{
  width:min(1320px,calc(100% - 64px))!important;
  margin:0 auto!important;
  grid-template-columns:minmax(0,760px) minmax(280px,420px)!important;
  gap:80px!important;
  align-items:end!important;
}
body.journal-index .journal-hero h1{max-width:760px}
body.journal-index .journal-intro{max-width:390px!important;margin:0!important}

body.journal-index .featured-story{
  padding:0 0 104px!important;
  background:var(--mm-page)!important;
}
body.journal-index .featured-story .wrap{
  width:min(1320px,calc(100% - 64px))!important;
  max-width:none!important;
  margin:0 auto!important;
}
body.journal-index .featured-story .feature-card{
  min-height:600px!important;
  display:grid!important;
  grid-template-columns:minmax(0,1.45fr) minmax(360px,.78fr)!important;
  align-items:center!important;
  overflow:visible!important;
  background:transparent!important;
  position:relative!important;
}
body.journal-index .featured-story .feature-card::after{content:none!important}
body.journal-index .featured-story .feature-card img{
  position:relative!important;
  inset:auto!important;
  width:100%!important;
  height:600px!important;
  object-fit:cover!important;
  object-position:center!important;
  filter:saturate(.92) contrast(.98)!important;
  z-index:0!important;
  -webkit-mask-image:linear-gradient(90deg,#000 0%,#000 88%,rgba(0,0,0,.58) 96%,transparent 100%)!important;
  mask-image:linear-gradient(90deg,#000 0%,#000 88%,rgba(0,0,0,.58) 96%,transparent 100%)!important;
}
body.journal-index .featured-story .feature-copy{
  position:relative!important;
  inset:auto!important;
  right:auto!important;
  top:auto!important;
  transform:none!important;
  width:auto!important;
  padding:52px 0 52px 54px!important;
  background:transparent!important;
  z-index:2!important;
}
body.journal-index .featured-story .feature-copy h2{max-width:430px}
body.journal-index .featured-story .feature-copy p{max-width:390px}

body.journal-index .journal-list{
  padding:0 0 90px!important;
  background:var(--mm-page)!important;
}
body.journal-index .journal-list .wrap{
  width:min(1320px,calc(100% - 64px))!important;
  max-width:none!important;
  margin:0 auto!important;
}
body.journal-index .journal-list .journal-row,
body.journal-index .journal-list .journal-row:nth-child(even){
  min-height:480px!important;
  display:grid!important;
  grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr)!important;
  align-items:center!important;
  gap:0!important;
  padding:0!important;
  margin:0 0 54px!important;
  overflow:visible!important;
  background:transparent!important;
  border:0!important;
  position:relative!important;
}
body.journal-index .journal-list .journal-row img{
  position:relative!important;
  left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;
  width:100%!important;height:480px!important;
  object-fit:cover!important;object-position:center!important;
  grid-column:1!important;grid-row:1!important;
  -webkit-mask-image:linear-gradient(90deg,#000 0%,#000 88%,rgba(0,0,0,.58) 96%,transparent 100%)!important;
  mask-image:linear-gradient(90deg,#000 0%,#000 88%,rgba(0,0,0,.58) 96%,transparent 100%)!important;
}
body.journal-index .journal-list .journal-row .row-copy{
  position:relative!important;grid-column:2!important;grid-row:1!important;
  width:auto!important;max-width:500px!important;justify-self:start!important;align-self:center!important;
  padding:44px 0 44px 52px!important;
}
body.journal-index .journal-list .journal-row .row-index{
  position:static!important;display:block!important;
  grid-column:auto!important;
  font-family:Georgia,serif!important;font-size:18px!important;line-height:1!important;
  color:rgba(128,86,24,.5)!important;
  margin:0 0 14px!important;
}
body.journal-index .journal-list .journal-row .row-copy::before{
  content:attr(data-index);display:none;
}
body.journal-index .journal-list .journal-row:nth-child(even) img{
  grid-column:2!important;
  -webkit-mask-image:linear-gradient(270deg,#000 0%,#000 88%,rgba(0,0,0,.58) 96%,transparent 100%)!important;
  mask-image:linear-gradient(270deg,#000 0%,#000 88%,rgba(0,0,0,.58) 96%,transparent 100%)!important;
}
body.journal-index .journal-list .journal-row:nth-child(even) .row-copy{
  grid-column:1!important;justify-self:end!important;padding:44px 52px 44px 0!important;
}
body.journal-index .journal-list .journal-row:nth-child(even) .row-index{left:auto!important;right:auto!important}

/* =========================================================
   ABOUT
   ========================================================= */
body.about-editorial main{background:var(--mm-page)!important}
body.about-editorial .editorial-hero.about-hero{
  min-height:0!important;padding:86px 0 112px!important;overflow:visible!important;background:var(--mm-page)!important;
}
body.about-editorial .editorial-hero .hero-grid{
  width:min(1320px,calc(100% - 64px))!important;
  min-height:640px!important;
  display:grid!important;grid-template-columns:minmax(360px,.82fr) minmax(0,1.18fr)!important;
  gap:38px!important;align-items:center!important;margin:0 auto!important;
}
body.about-editorial .editorial-hero .hero-copy{
  position:relative!important;left:auto!important;top:auto!important;transform:none!important;
  width:auto!important;max-width:560px!important;padding:30px 20px 30px 0!important;z-index:2!important;
}
body.about-editorial .editorial-hero .hero-media{
  position:relative!important;inset:auto!important;left:auto!important;right:auto!important;
  min-height:640px!important;height:640px!important;grid-column:2!important;
}
body.about-editorial .editorial-hero .hero-media img{
  width:100%!important;height:100%!important;object-fit:cover!important;object-position:center!important;border-radius:0!important;
  -webkit-mask-image:linear-gradient(270deg,#000 0%,#000 90%,rgba(0,0,0,.62) 96%,transparent 100%)!important;
  mask-image:linear-gradient(270deg,#000 0%,#000 90%,rgba(0,0,0,.62) 96%,transparent 100%)!important;
}
body.about-editorial .editorial-hero .hero-media::before{content:none!important}
body.about-editorial .editorial-hero .hero-note{
  left:34px!important;right:auto!important;bottom:30px!important;
  width:210px!important;background:rgba(255,250,239,.88)!important;
}

body.about-editorial .story-chapter,
body.about-editorial .story-chapter.alt{background:transparent!important;padding:0 0 86px!important;min-height:0!important;overflow:visible!important}
body.about-editorial .story-chapter .chapter-grid{
  width:min(1320px,calc(100% - 64px))!important;min-height:520px!important;
  display:grid!important;grid-template-columns:1fr 1fr!important;gap:0!important;align-items:center!important;margin:0 auto!important;
}
body.about-editorial .story-chapter .chapter-media,
body.about-editorial .story-chapter.reverse .chapter-media{
  position:relative!important;inset:auto!important;left:auto!important;right:auto!important;width:100%!important;height:520px!important;
  grid-column:1!important;grid-row:1!important;
}
body.about-editorial .story-chapter .chapter-media img{
  width:100%!important;height:100%!important;object-fit:cover!important;border-radius:0!important;
  -webkit-mask-image:linear-gradient(90deg,#000 0%,#000 88%,rgba(0,0,0,.58) 96%,transparent 100%)!important;
  mask-image:linear-gradient(90deg,#000 0%,#000 88%,rgba(0,0,0,.58) 96%,transparent 100%)!important;
}
body.about-editorial .story-chapter .chapter-copy{
  grid-column:2!important;grid-row:1!important;width:auto!important;max-width:520px!important;justify-self:start!important;padding:50px 0 50px 56px!important;
}
body.about-editorial .story-chapter.reverse .chapter-media{grid-column:2!important}
body.about-editorial .story-chapter.reverse .chapter-media img{
  -webkit-mask-image:linear-gradient(270deg,#000 0%,#000 88%,rgba(0,0,0,.58) 96%,transparent 100%)!important;
  mask-image:linear-gradient(270deg,#000 0%,#000 88%,rgba(0,0,0,.58) 96%,transparent 100%)!important;
}
body.about-editorial .story-chapter.reverse .chapter-copy{grid-column:1!important;justify-self:end!important;padding:50px 56px 50px 0!important}

/* =========================================================
   BEE PRODUCTS — keep floating jars, tame the only photo section
   ========================================================= */
body.brand-editorial .collection-story{
  min-height:0!important;padding:0 0 96px!important;background:var(--mm-page)!important;overflow:visible!important;
}
body.brand-editorial .collection-story .wrap{
  width:min(1320px,calc(100% - 64px))!important;max-width:none!important;min-height:520px!important;
  display:grid!important;grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr)!important;align-items:center!important;margin:0 auto!important;
}
body.brand-editorial .collection-story .wrap::after{content:none!important}
body.brand-editorial .collection-story .wide-image{
  position:relative!important;inset:auto!important;grid-column:1!important;grid-row:1!important;
  width:100%!important;height:520px!important;object-fit:cover!important;
  -webkit-mask-image:linear-gradient(90deg,#000 0%,#000 88%,rgba(0,0,0,.58) 96%,transparent 100%)!important;
  mask-image:linear-gradient(90deg,#000 0%,#000 88%,rgba(0,0,0,.58) 96%,transparent 100%)!important;
}
body.brand-editorial .collection-story .story-caption{
  position:relative!important;z-index:2!important;width:auto!important;min-height:0!important;margin:0!important;
  grid-column:2!important;grid-row:1!important;display:block!important;padding:44px 0 44px 54px!important;
}
body.brand-editorial .collection-story .story-caption h2,
body.brand-editorial .collection-story .story-caption>div{grid-column:auto!important}

/* =========================================================
   JOURNAL ARTICLES
   ========================================================= */
body.journal-article-page .article-editorial{padding-top:118px!important}
body.journal-article-page .article-hero-image{
  width:min(1320px,calc(100% - 64px))!important;max-width:none!important;height:min(680px,54vw)!important;
  margin:0 auto 86px!important;object-fit:cover!important;display:block!important;
  -webkit-mask-image:none!important;mask-image:none!important;
}

/* =========================================================
   CONTACT — image becomes its own quiet field, text never floats over it
   ========================================================= */
body.contact-page .contact-editorial{padding:86px 0 110px!important;background:var(--mm-page)!important;overflow:visible!important}
body.contact-page .contact-layout{
  width:min(1320px,calc(100% - 64px))!important;max-width:none!important;margin:0 auto!important;
  grid-template-columns:minmax(360px,.9fr) minmax(420px,1.1fr)!important;gap:86px!important;min-height:0!important;align-items:start!important;
}
body.contact-page .contact-intro{
  min-height:0!important;padding:0!important;display:block!important;position:relative!important;overflow:visible!important;
}
body.contact-page .contact-intro::after{content:none!important}
body.contact-page .contact-image{
  position:relative!important;inset:auto!important;display:block!important;width:100%!important;height:430px!important;
  object-fit:cover!important;margin:38px 0 30px!important;z-index:0!important;
  -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 90%,rgba(0,0,0,.55) 96%,transparent 100%)!important;
  mask-image:linear-gradient(180deg,#000 0%,#000 90%,rgba(0,0,0,.55) 96%,transparent 100%)!important;
}
body.contact-page .contact-intro>*:not(.contact-image){position:relative!important;z-index:2!important}
body.contact-page .contact-form-shell{padding-top:16px!important}

/* =========================================================
   PRODUCT DETAIL MOOD SECTIONS — same left-image/right-copy rhythm
   ========================================================= */
body.product-editorial .mood-band{padding:92px 0!important;background:var(--mm-page)!important}
body.product-editorial .mood-grid{
  width:min(1320px,calc(100% - 64px))!important;max-width:none!important;margin:0 auto!important;
  grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr)!important;gap:0!important;align-items:center!important;
}
body.product-editorial .mood-grid img{
  width:100%!important;height:500px!important;object-fit:cover!important;
  -webkit-mask-image:linear-gradient(90deg,#000 0%,#000 88%,rgba(0,0,0,.58) 96%,transparent 100%)!important;
  mask-image:linear-gradient(90deg,#000 0%,#000 88%,rgba(0,0,0,.58) 96%,transparent 100%)!important;
}
body.product-editorial .mood-copy{padding:42px 0 42px 54px!important;max-width:500px!important}

/* =========================================================
   MOBILE — images on top, copy below; no masks across text
   ========================================================= */
@media (max-width:820px){
  body.journal-index .journal-hero{padding:72px 0 48px!important}
  body.journal-index .journal-hero .journal-title,
  body.journal-index .featured-story .wrap,
  body.journal-index .journal-list .wrap,
  body.about-editorial .editorial-hero .hero-grid,
  body.about-editorial .story-chapter .chapter-grid,
  body.brand-editorial .collection-story .wrap,
  body.contact-page .contact-layout,
  body.product-editorial .mood-grid{
    width:calc(100% - 32px)!important;
  }
  body.journal-index .journal-hero .journal-title{grid-template-columns:1fr!important;gap:24px!important}

  body.journal-index .featured-story .feature-card,
  body.journal-index .journal-list .journal-row,
  body.journal-index .journal-list .journal-row:nth-child(even),
  body.about-editorial .editorial-hero .hero-grid,
  body.about-editorial .story-chapter .chapter-grid,
  body.brand-editorial .collection-story .wrap,
  body.product-editorial .mood-grid{
    grid-template-columns:1fr!important;min-height:0!important;
  }
  body.journal-index .featured-story .feature-card img,
  body.journal-index .journal-list .journal-row img,
  body.journal-index .journal-list .journal-row:nth-child(even) img,
  body.about-editorial .editorial-hero .hero-media img,
  body.about-editorial .story-chapter .chapter-media img,
  body.about-editorial .story-chapter.reverse .chapter-media img,
  body.brand-editorial .collection-story .wide-image,
  body.product-editorial .mood-grid img{
    -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 91%,rgba(0,0,0,.55) 97%,transparent 100%)!important;
    mask-image:linear-gradient(180deg,#000 0%,#000 91%,rgba(0,0,0,.55) 97%,transparent 100%)!important;
  }

  body.journal-index .featured-story .feature-card img{height:390px!important}
  body.journal-index .featured-story .feature-copy{padding:30px 4px 10px!important}
  body.journal-index .journal-list .journal-row{margin-bottom:54px!important}
  body.journal-index .journal-list .journal-row img,
  body.journal-index .journal-list .journal-row:nth-child(even) img{grid-column:1!important;grid-row:1!important;height:330px!important}
  body.journal-index .journal-list .journal-row .row-copy,
  body.journal-index .journal-list .journal-row:nth-child(even) .row-copy{grid-column:1!important;grid-row:2!important;justify-self:start!important;padding:26px 4px 0!important}

  body.about-editorial .editorial-hero.about-hero{padding:70px 0 84px!important}
  body.about-editorial .editorial-hero .hero-copy{grid-column:1!important;grid-row:1!important;padding:0 0 30px!important;max-width:none!important}
  body.about-editorial .editorial-hero .hero-media{grid-column:1!important;grid-row:2!important;height:430px!important;min-height:430px!important}
  body.about-editorial .editorial-hero .hero-note{left:18px!important;bottom:18px!important}
  body.about-editorial .story-chapter{padding-bottom:70px!important}
  body.about-editorial .story-chapter .chapter-media,
  body.about-editorial .story-chapter.reverse .chapter-media{grid-column:1!important;grid-row:1!important;height:390px!important}
  body.about-editorial .story-chapter .chapter-copy,
  body.about-editorial .story-chapter.reverse .chapter-copy{grid-column:1!important;grid-row:2!important;justify-self:start!important;padding:28px 4px 0!important;max-width:none!important}

  body.brand-editorial .collection-story{padding-bottom:76px!important}
  body.brand-editorial .collection-story .wide-image{grid-column:1!important;grid-row:1!important;height:390px!important}
  body.brand-editorial .collection-story .story-caption{grid-column:1!important;grid-row:2!important;padding:28px 4px 0!important}

  body.journal-article-page .article-hero-image{width:calc(100% - 32px)!important;height:410px!important;margin-bottom:58px!important}

  body.contact-page .contact-editorial{padding:72px 0 84px!important}
  body.contact-page .contact-layout{grid-template-columns:1fr!important;gap:54px!important}
  body.contact-page .contact-image{height:360px!important;margin-top:30px!important}

  body.product-editorial .mood-grid img{height:390px!important}
  body.product-editorial .mood-copy{padding:28px 4px 0!important;max-width:none!important}
}
body.journal-index .journal-list .journal-row .row-index{display:none!important}