
.hero-image{position:relative;min-height:min(790px,86vh);padding:0;overflow:hidden;isolation:isolate}.hero-image .hero-media{position:absolute;inset:-10%;z-index:-3;will-change:transform,opacity;transform:translate3d(0,var(--hero-shift,0px),0) scale(var(--hero-scale,1.08));opacity:var(--hero-opacity,1)}.hero-media picture,.hero-media img{width:100%;height:100%;display:block}.hero-media img{object-fit:cover;object-position:center 46%}.hero-wash{position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,rgba(248,248,244,.92) 0%,rgba(248,248,244,.78) 40%,rgba(248,248,244,.34) 72%,rgba(248,248,244,.14) 100%),linear-gradient(180deg,rgba(248,248,244,.12) 0%,rgba(248,248,244,.24) 60%,rgba(248,248,244,.56) 100%)}.hero-image::after{content:"";position:absolute;z-index:-1;left:0;right:0;bottom:0;height:210px;pointer-events:none;background:linear-gradient(180deg,rgba(248,248,244,0) 0%,rgba(248,248,244,.42) 46%,rgba(248,248,244,.86) 78%,var(--background) 100%)}.hero-content{display:flex;min-height:min(790px,86vh);flex-direction:column;padding-top:38px;padding-bottom:34px}.hero-image .hero-topline{color:#4e504c}.hero-stack{margin:auto 0;max-width:760px;padding:78px 0 64px}.hero-stack h1{max-width:760px}.hero-stack>p{max-width:560px;margin:28px 0 0;color:#3f413e;font-size:15px;line-height:1.65}.hero-image .hero-foot{margin-top:auto;color:#5d5e5a}.aligned-project-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:54px 28px}.aligned-project-grid .project-card{padding-top:0!important;margin-top:0!important}.aligned-project-grid .project-art{aspect-ratio:16/10;min-height:0;box-shadow:0 14px 38px rgba(28,29,26,.06)}.creator-strip{margin-top:116px}.home-service-list .service-row{cursor:pointer}.home-service-list a.service-row:hover{color:inherit}
@media(max-width:850px){.hero-image{min-height:720px}.hero-content{min-height:720px;padding-top:24px;padding-bottom:25px}.hero-wash{background:linear-gradient(180deg,rgba(248,248,244,.88) 0%,rgba(248,248,244,.66) 54%,rgba(248,248,244,.42) 76%,rgba(248,248,244,.62) 100%)}.hero-image::after{height:170px}.hero-stack{padding:80px 0 58px}.hero-stack h1{font-size:clamp(48px,13vw,70px)}.hero-stack>p{font-size:14px;max-width:330px;margin-top:23px}.aligned-project-grid{grid-template-columns:1fr;gap:48px}.creator-strip{margin-top:85px}}


/* V7 hero layout: Manus/V4 content composition on top of the V6 animated background */
.hero-image .hero-grid{margin:auto 0;width:100%;padding:72px 0 70px;align-items:end}
.hero-image .hero-grid h1{max-width:780px}
.hero-image .hero-copy{max-width:330px;padding-bottom:7px}
.hero-image .hero-copy p{color:#3f413e;font-size:15px;line-height:1.65}
.hero-image .hero-actions{margin-top:26px}
.hero-image .hero-topline{position:relative;z-index:2}
.hero-image .hero-foot{position:relative;z-index:2}
@media(max-width:850px){
  .hero-image .hero-grid{display:block;padding:72px 0 58px;margin:auto 0}
  .hero-image .hero-grid h1{font-size:clamp(48px,13vw,70px);max-width:680px}
  .hero-image .hero-copy{padding-top:30px;max-width:335px}
  .hero-image .hero-copy p{font-size:14px}
}


/* V8 — desktop keeps the existing topline; mobile moves it into the content flow above H1. */
.hero-mobile-topline { display: none; }
@media (max-width: 850px) {
  .hero-image > .hero-content > .hero-topline { display: none; }
  .hero-mobile-topline {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 14px;
    margin: 0 0 17px;
    color: #4e504c;
    font-size: 10px;
    line-height: 1.4;
    letter-spacing: .025em;
  }
  .hero-mobile-topline .hero-status { font-size: 10px; }
}
@media (max-width: 850px) and (prefers-color-scheme: dark) {
  .hero-wash {
    background: linear-gradient(180deg,rgba(16,16,15,.72) 0%,rgba(16,16,15,.58) 50%,rgba(16,16,15,.60) 76%,rgba(16,16,15,.82) 100%);
  }
  .hero-image::after {
    background: linear-gradient(180deg,rgba(16,16,15,0) 0%,rgba(16,16,15,.38) 44%,rgba(16,16,15,.80) 78%,var(--background) 100%);
  }
  .hero-mobile-topline, .hero-image .hero-foot { color: #b7b7b0; }
  .hero-image .hero-copy p { color: #d0d0c9; }
  .hero-status i { box-shadow: 0 0 0 4px rgba(138,176,0,.18); }
}
