/* Preserve the existing compact homepage navigation and its touch targets. */
body.ha-message-hierarchy .ha-home-nav{height:60px;margin-bottom:-60px}
html:has(.ha-home-nav){scroll-padding-top:60px}
@media(max-width:860px){.ha-home-nav .ha-nav-list{max-height:calc(100dvh - 60px)}}
/* Compose the identity above the cards, leaving the woodland path and foreground open. */
html body.ha-message-hierarchy section.woodland-hero .signature{
 top:calc((100% - var(--hc-overlap,0px) + 60px) / 2);
 width:min(74%,1100px);
 transform:translate(-50%,-50%);
}
html body.ha-message-hierarchy section.woodland-hero .tagline{
 margin:clamp(20px,2.2vw,30px) 0 0;
 color:var(--ha-paper);
 font:500 clamp(28px,2.6vw,38px)/1.2 var(--ha-font-sans);
 letter-spacing:-.035em;
 text-wrap:balance;
 opacity:1!important;
}
html body.ha-message-hierarchy section.woodland-hero :is(.controls,.film-toggle){display:none!important}
.woodland-hero .hero-service-index{display:none}
/* Show the actual headings while allowing the cut-out artwork to rise above its card. */
@media(min-width:761px) and (min-height:521px){
 body:has(#packages.ha-hero-cards){--hc-overlap:calc(var(--hc-art-height) + 92px + var(--hero-preview-space,0px))}
 body:has(.integration-review-bar){--hero-preview-space:28px}
}
@media(min-width:761px) and (min-height:521px) and (max-height:700px){
 body:has(.integration-review-bar){--hero-preview-space:20px}
 html body.ha-message-hierarchy section.woodland-hero .signature{
  top:calc((100% - var(--hc-overlap) - 16px) / 2);
  width:min(74%,1100px,calc((100svh - var(--hc-overlap) - 210px) * 5.4));
 }
 html body.ha-message-hierarchy section.woodland-hero .tagline{margin-top:12px;font-size:28px}
}
@media(max-width:760px){
 html body.ha-message-hierarchy section.woodland-hero .signature{width:88%}
 html body.ha-message-hierarchy section.woodland-hero .tagline{margin-top:22px;font-size:clamp(26px,7vw,32px)}

}
/* Landscape phones get their own composition rather than a squeezed portrait layout. */
@media(max-height:520px) and (min-width:761px){
 html body.ha-message-hierarchy section.woodland-hero .signature{top:calc((100% - var(--hc-overlap) + 60px) / 2 - 28px);width:min(46%,420px)}
 html body.ha-message-hierarchy section.woodland-hero .tagline{margin-top:12px;font-size:22px}
 body:has(#packages.ha-hero-cards){--hc-art-height:80px;--hc-overlap:172px}
}
@media(max-height:520px) and (max-width:760px){
 html body.ha-message-hierarchy section.woodland-hero .signature{top:calc((100% - var(--hc-overlap)) / 2);width:min(68%,460px)}
 html body.ha-message-hierarchy section.woodland-hero .tagline{margin-top:12px;font-size:24px}
}