/* The opening shares the viewport with the project header, never adds to it.
   Auto height allows content to grow at high text zoom rather than clipping. */
body[data-project]{--project-header-height:100px;--opening-height:calc(100svh - var(--project-header-height))}
body[data-project="piedra"] .hero,body[data-project="habitat"] .hero,body[data-project="museum"] .hero,body[data-project="reserve"] .original-reserve-hero{height:auto;min-height:var(--opening-height);padding:clamp(28px,7svh,76px) 8%;justify-content:flex-end}
body[data-project="piedra"] .hero h1,body[data-project="habitat"] .hero h1,body[data-project="museum"] .hero h1,body[data-project="reserve"] .original-reserve-hero h1{font-size:clamp(44px,min(8vw,13svh),120px);margin:clamp(14px,3svh,28px) 0;overflow-wrap:normal}
body[data-project="piedra"] .hero p,body[data-project="habitat"] .hero p,body[data-project="museum"] .hero p,body[data-project="reserve"] .original-reserve-hero p{margin:12px 0;line-height:1.7}
body[data-project="winery"] .hero{min-height:var(--opening-height);height:auto;display:flex;flex-direction:column}
body[data-project="winery"] .hero-content{padding-top:clamp(28px,5svh,65px);padding-bottom:24px;flex:1;display:flex;flex-direction:column;justify-content:center}
body[data-project="winery"] .hero h1{font-size:clamp(40px,min(7.5vw,11svh),112px);margin:20px 0}
body[data-project="winery"] .hero-actions{margin-top:24px;gap:24px;flex-wrap:wrap}
body[data-project="winery"] .hero-footer{position:relative;inset:auto;transform:none;margin:0 auto;padding-bottom:20px;flex-shrink:0}
body[data-project="equestrian"] .equine-hero{min-height:var(--opening-height);height:auto;max-height:none}
body[data-project="equestrian"] .hero-photo{position:absolute;inset:0;height:100%;min-height:0;max-height:none}
body[data-project="equestrian"] .hero-copy{position:relative;min-height:var(--opening-height);padding:24px 6%;}
body[data-project="equestrian"] .hero-copy h1{font-size:clamp(36px,min(4.6vw,8svh),70px)}
body[data-project="hotel-preview"].hotel-view .detail{min-height:var(--opening-height);height:auto;padding-top:clamp(24px,5svh,60px);padding-bottom:80px;gap:20px}
@media(max-width:700px){body[data-project]{--project-header-height:85px}}
@media(max-width:800px){
body[data-project="piedra"] .hero,body[data-project="habitat"] .hero,body[data-project="museum"] .hero,body[data-project="reserve"] .original-reserve-hero{padding:32px 7% 40px}
body[data-project="piedra"] .hero h1,body[data-project="habitat"] .hero h1,body[data-project="museum"] .hero h1,body[data-project="reserve"] .original-reserve-hero h1{font-size:clamp(42px,10vw,70px)}
body[data-project="winery"] .hero-content{padding-top:28px;padding-bottom:24px}
body[data-project="winery"] .hero h1{font-size:clamp(38px,10vw,64px)}
body[data-project="winery"] .hero-actions{flex-direction:row;gap:14px 20px}
body[data-project="winery"] .hero-actions a{font-size:12px}
body[data-project="winery"] .hero-footer{font-size:10px;line-height:1.5}
body[data-project="equestrian"] .equine-hero{display:flex;flex-direction:column}
body[data-project="equestrian"] .hero-copy{min-height:0;flex:1;padding:24px 7%}
body[data-project="equestrian"] .hero-copy h1{font-size:clamp(34px,8vw,48px);margin:12px 0}
body[data-project="equestrian"] .hero-photo{position:relative;height:auto}
body[data-project="equestrian"] .hero-photo>img{width:100%;height:auto;aspect-ratio:1672/941;object-fit:contain}
body[data-project="hotel-preview"].hotel-view .detail{padding:28px 7% 90px}
}