@layer hero-view {
  .site-header { position:absolute; inset:0 0 auto; inline-size:100%; max-inline-size:none; padding-inline:var(--gutter); background:transparent; }
  .brand,.desktop-nav,.menu-toggle { text-shadow:0 1px 12px #e9eae6c9; }
  .hero { --forest-bleed:180px; block-size:100svh; min-block-size:700px; max-block-size:none; max-inline-size:none; inline-size:100%; overflow:clip visible; }
  .hero-art { inset:0 0 calc(-1 * var(--forest-bleed)); overflow:hidden; mask-image:linear-gradient(to bottom,#000 0%,#000 calc(100% - 250px),transparent 100%); }
  .hero-art img { inset:0; inline-size:100%; block-size:100%; object-fit:cover; object-position:50% 0%; mask-image:none; mask-composite:add; }
  .hero-title { padding-block-start:112px; padding-inline:48px; perspective:1200px; animation:none; }
  .hero h1 { font-size:clamp(48px,4.25vw,78px); line-height:1.06; margin-block:12px 13px; transform:translate3d(var(--view-x,0px),calc(var(--view-y,0px) + var(--view-scroll,0px)),0) rotateX(var(--view-rx,0deg)) rotateY(var(--view-ry,0deg)); transform-origin:50% 50%; will-change:transform; }
  .hero h1 br { display:none; }
  .hero-subtitle { transform:translate3d(calc(var(--view-x,0px) * .42),calc(var(--view-y,0px) * .42 + var(--view-scroll,0px) * .6),0); }
  .hero-title>.eyebrow { transform:translate3d(calc(var(--view-x,0px) * .2),calc(var(--view-y,0px) * .2 + var(--view-scroll,0px) * .35),0); }
  .hero-note { inset-block-end:145px; }
  .hero-action { inset-block-end:145px; }
  .hero-note,.hero-action>p,.hero-caption,.hero-bottom { text-shadow:0 1px 6px #e9eae6,0 0 20px #e9eae6; }
  .hero>.scene-guide { position:absolute; inset-inline:24px; inset-block-end:87px; margin:0 auto; max-inline-size:none; text-align:center; color:#3e4b3c; text-shadow:0 1px 6px #e9eae6,0 0 16px #e9eae6; }
  .hero-bottom { inset-block-end:25px; }
  .hero-caption,.hero-bottom,.hero>.scene-guide { color:#26322c; text-shadow:0 1px 2px #e9eae6,0 -1px 2px #e9eae6,1px 0 2px #e9eae6,-1px 0 2px #e9eae6,0 0 12px #e9eae6; }
  .idea { position:relative; padding-block-start:105px; }
  @media(max-width:1100px) and (min-width:761px) {
    .hero-title { padding-block-start:110px; padding-inline:30px; }
    .hero h1 { font-size:clamp(36px,4.35vw,48px); }
    .hero-note { max-inline-size:240px; }
  }
  @media(max-width:760px) {
    .hero { --forest-bleed:130px; min-block-size:740px; }
    .hero-art { mask-image:linear-gradient(to bottom,#000 0%,#000 calc(100% - 185px),transparent 100%); }
    .hero-art img { object-position:50% 0%; }
    .hero-title { padding-block-start:105px; padding-inline:24px; }
    .hero h1 { font-size:clamp(32px,8.8vw,56px); line-height:1.05; margin-block:12px 13px; }
    .hero h1 br { display:block; }
    .hero-subtitle { font-size:14px; max-inline-size:300px; }
    .hero-action { inset-block-end:142px; }
    .hero>.scene-guide { inset-block-end:103px; font-size:12px; }
    .hero-bottom { inset-block-end:17px; }
    .idea { padding-block-start:72px; }
  }
  @media(min-width:761px) and (max-height:740px) {
    .hero { min-block-size:620px; --forest-bleed:130px; }
    .hero-title { padding-block-start:96px; }
    .hero h1 { font-size:clamp(38px,4vw,60px); margin-block:8px; }
    .hero-subtitle { font-size:14px; }
    .hero-note,.hero-action { inset-block-end:130px; }
  }
  @media(max-width:360px) {
    .hero { min-block-size:700px; --forest-bleed:180px; }
    .hero-title { padding-block-start:96px; padding-inline:18px; }
    .hero h1 { font-size:30px; }
    .hero-subtitle { font-size:13px; }
    .hero>.scene-guide { inset-inline:14px; font-size:12px; }
  }
  @media(prefers-reduced-motion:reduce) {
    .hero h1,.hero-subtitle,.hero-title>.eyebrow { transform:none; will-change:auto; }
  }
}