/* M101 hero visual — enlarged UGT protein as a full-bleed background layer
   Scope: public home hero only. Left copy floats above the visual layer;
   right research-brief card is untouched. */

body[data-page="home"] .m34-home-hero{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding:52px 0 72px;
  min-height:640px;
}

/* soft green halo behind the structure, blending into the paper background */
body[data-page="home"] .m34-home-hero::before{
  content:"";
  position:absolute;
  z-index:0;
  inset:-6% 11% -8% -4%;
  pointer-events:none;
  background:
    radial-gradient(50% 46% at 38% 42%, rgba(23,107,82,.16) 0%, rgba(23,107,82,.08) 44%, rgba(23,107,82,0) 74%),
    radial-gradient(34% 32% at 58% 76%, rgba(38,150,107,.12) 0%, rgba(38,150,107,0) 70%),
    radial-gradient(40% 36% at 16% 30%, rgba(234,244,239,.9) 0%, rgba(234,244,239,0) 78%);
  filter:blur(22px);
}

/* protein figure becomes the main visual background, enlarged in all directions */
body[data-page="home"] .m34-home-hero > .m34-hero-visual{
  position:absolute;
  z-index:1;
  inset:-3% 9% -5% -1%;
  width:auto;
  max-width:none;
  margin:0;
  padding:0;
  display:block;
  background:none;
  border-radius:0;
  pointer-events:none;
  -webkit-mask-image:radial-gradient(54% 56% at 42% 46%, #000 0%, #000 36%, rgba(0,0,0,.78) 58%, rgba(0,0,0,.32) 76%, rgba(0,0,0,0) 92%);
  mask-image:radial-gradient(54% 56% at 42% 46%, #000 0%, #000 36%, rgba(0,0,0,.78) 58%, rgba(0,0,0,.32) 76%, rgba(0,0,0,0) 92%);
}

body[data-page="home"] .m34-home-hero > .m34-hero-visual img{
  display:block;
  width:100%;
  height:100%;
  max-height:none;
  object-fit:contain;
  object-position:38% 48%;
  border-radius:0;
  mix-blend-mode:darken;
  transform:scale(1);
}

body[data-page="home"] .m34-home-hero > .m34-hero-visual .m34-hero-caption{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  margin:0;
  color:var(--m34-sage,#7d8f85);
  font-size:11px;
  line-height:1.4;
  text-align:center;
}

/* text stays in front of the gradient layer */
body[data-page="home"] .m34-home-hero > .m34-hero-copy,
body[data-page="home"] .m34-home-hero > .m34-research-brief{
  position:relative;
  z-index:2;
  grid-row:1;
}

/* the figure leaves the grid flow, so pin both columns explicitly */
body[data-page="home"] .m34-home-hero > .m34-hero-copy{
  grid-column:1;
}

body[data-page="home"] .m34-home-hero > .m34-research-brief{
  grid-column:3;
}

body[data-page="home"] .m34-home-hero > .m34-hero-copy{
  padding-top:8px;
}

body[data-page="home"] .m34-home-hero > .m34-hero-copy h1{
  text-shadow:0 1px 0 rgba(246,248,246,.86), 0 0 30px rgba(246,248,246,.92);
}

body[data-page="home"] .m34-home-hero > .m34-hero-copy .m34-hero-lead,
body[data-page="home"] .m34-home-hero > .m34-hero-copy .m34-kicker{
  text-shadow:0 1px 0 rgba(246,248,246,.9), 0 0 22px rgba(246,248,246,.95);
}

/* keep the brief card crisp above the visual layer */
body[data-page="home"] .m34-home-hero > .m34-research-brief{
  background:#fff;
}

/* the figure left the grid flow, so the middle 42fr column is now empty:
   give the free space back to the copy and pin the brief card on the right */
@media(min-width:901px){
  body[data-page="home"] .m34-home-hero{
    grid-template-columns:minmax(0,1fr) minmax(300px,380px);
  }
  body[data-page="home"] .m34-home-hero > .m34-hero-copy{
    grid-column:1;
  }
  body[data-page="home"] .m34-home-hero > .m34-research-brief{
    grid-column:2;
  }
  body[data-page="home"] .m34-home-hero > .m34-hero-copy h1{
    max-width:720px;
    font-size:clamp(36px,3.6vw,54px);
    line-height:1.1;
  }
  body[data-page="home"] .m34-home-hero > .m34-hero-copy .m34-hero-lead{
    max-width:560px;
  }
}

@media(max-width:900px){
  body[data-page="home"] .m34-home-hero{
    padding:58px 0 42px;
    min-height:0;
  }
  body[data-page="home"] .m34-home-hero > .m34-hero-copy,
  body[data-page="home"] .m34-home-hero > .m34-research-brief{
    grid-column:auto;
    grid-row:auto;
  }
  body[data-page="home"] .m34-home-hero::before{
    display:none;
  }
  body[data-page="home"] .m34-home-hero > .m34-hero-visual{
    position:relative;
    inset:auto;
    z-index:1;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    width:100%;
    max-width:480px;
    margin:0 auto;
    pointer-events:auto;
    -webkit-mask-image:none;
    mask-image:none;
    background:radial-gradient(ellipse 65% 55% at 50% 50%,var(--m34-pale) 0%,rgba(237,244,238,.55) 60%,transparent 100%);
  }
  body[data-page="home"] .m34-home-hero > .m34-hero-visual img{
    height:auto;
    max-height:520px;
    transform:none;
  }
  body[data-page="home"] .m34-home-hero > .m34-hero-visual .m34-hero-caption{
    position:static;
    margin:6px 0 0;
  }
  body[data-page="home"] .m34-home-hero > .m34-hero-copy h1,
  body[data-page="home"] .m34-home-hero > .m34-hero-copy .m34-hero-lead,
  body[data-page="home"] .m34-home-hero > .m34-hero-copy .m34-kicker{
    text-shadow:none;
  }
}

@media(prefers-reduced-motion:reduce){
  body[data-page="home"] .m34-home-hero > .m34-hero-visual img{
    transform:none;
  }
}