/* Restore the approved continuous portrait/panorama, keeping the full artwork visible. */
.site-header .nav-cta { min-height: 46px; padding: 12px 23px; gap: 14px; border-radius: 999px; box-shadow: 0 5px 15px #237a0c18; }
.site-header .nav-cta span { font-size: 18px; line-height: 1; }
.hero { display: block; position: relative; min-height: 0; background: #f4faff; }
.hero-art { display: block; position: absolute; inset: 0; width: 100%; height: 100%; padding: 0; }
.hero-art img { display: block; width: 100%; height: 100%; object-fit: contain; object-position: center; mask-image: none; }
.hero-art .hero-backdrop { position: absolute; inset: 0; }
.hero-art .hero-owner { position: absolute; left: 52%; bottom: max(0px,calc((100% - 40.62vw) / 2)); width: 43%; max-width: 43%; height: min(96%,39vw); object-fit: contain; object-position: center bottom; transform: translateX(-50%); mask-image: linear-gradient(90deg,transparent 0%,#000 12%,#000 100%); }
.hero > .container { display: flex; position: relative; z-index: 1; width: min(calc(100% - 96px), 1320px); min-height: max(610px, 40.62vw); margin-inline: auto; padding: 0; }
.hero-copy { width: 38%; max-width: 510px; padding: 48px 0; }
.hero h1 { font-size: clamp(37px, 3.4vw, 53px); letter-spacing: -1.5px; }
.hero-copy > p { font-size: 17px; line-height: 1.65; }
.hero-benefits { width: min(100%, 345px); }
@media (min-width: 1151px) { .hero h1 .catch { font-size: .9em; white-space: nowrap; } }
@media (max-width: 1150px) and (min-width: 801px) {
 .hero > .container { width: calc(100% - 64px); min-height: 590px; }
 .hero-copy { width: 38%; padding-block: 40px; }
 .hero h1 { font-size: 37px; }
 .hero-copy > p { font-size: 15px; }
}
@media (max-width: 800px) {
 .hero { display: flex; flex-direction: column; }
 .hero > .container { width: calc(100% - 48px); min-height: 0; }
 .hero-copy { width: 100%; max-width: 620px; padding: 48px 0 28px; }
 .hero h1 { font-size: clamp(37px, 6vw, 48px); }
 .hero-copy > p { font-size: 16px; }
 .hero-art { position: relative; inset: auto; order: 2; width: 100%; height: auto; aspect-ratio: 1967 / 799; }
 .hero-art img { width: 100%; height: auto; object-fit: contain; }
 .hero-art .hero-backdrop { height: 100%; }
 .hero-art .hero-owner { width: 43%; height: 96%; bottom: 0; }
 .hero-benefits { margin-bottom: 0; }
}
@media (max-width: 480px) {
 .hero > .container { width: calc(100% - 40px); }
 .site-header .nav-cta { min-height: 42px; padding: 10px 15px; gap: 8px; font-size: 12px; }
 .site-header .nav-cta span { display: none; }
}