/* [Project-rule] Expressive campaign motion requested by Ricardo.
   Designer: a pinned architectural opening and decisive typography.
   Visitor: architecture remains real, copy readable and scrolling native. */
:root{--motion-enter:900ms;--motion-fast:300ms;--motion-travel:72px;--motion-stagger:100ms;--motion-scale:1.12;--motion-ease:cubic-bezier(.16,1,.3,1)}
.hero-scene{position:relative;background:#0b1512;color:#fff}
.hero-scene .hero{position:relative;width:100%;margin:0;min-height:calc(100svh - var(--nav-height));padding:clamp(3rem,7vw,7rem) max(var(--gutter),calc((100vw - var(--content-max))/2));isolation:isolate;overflow:clip;display:flex;align-items:center}
.hero-scene .hero-copy{position:relative;z-index:2;width:min(58%,46rem);padding:0}
.hero-scene .hero-visual{position:absolute;inset:0 0 0 30%;border-radius:0;background:#14281e;z-index:0;margin:0}
.hero-scene .hero-visual img{width:100%;height:100%;aspect-ratio:auto;object-fit:cover;object-position:center 47%;animation:none}
.hero-scene .hero::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,#0b1512 2%,#0b1512eb 25%,#0b151287 49%,#0b15120d 100%)}
.hero-scene .hero h1{font-size:clamp(3.4rem,7.2vw,7rem);line-height:1.04;letter-spacing:-.065em;color:#fff;margin:0}
.motion-line{display:block;overflow:clip;padding-bottom:.09em;margin-bottom:-.06em;perspective:800px;color:inherit}
.motion-line>span{display:block;color:inherit;transform-origin:50% 100%}
.hero-scene .hero .motion-accent{color:#a9e6c4}
.hero-scene .hero-copy:focus-within{animation:none!important;transform:none!important;opacity:1!important}
.hero-scene .eyebrow{color:#c4f0d8;letter-spacing:.1em;text-transform:uppercase;font-size:.75rem}
.hero-scene .hero-description,.hero-scene .hero-address{color:#eef5f0}
.hero-scene .text-link{color:#ceefdc}
.hero-scene .button{background:#b9edcf;color:#10271b}
.hero-scene .button:hover{background:#dcf8e7}
.hero-scene .hero-visual figcaption{position:absolute;left:auto;right:1rem;bottom:1rem;max-width:18rem;background:#0b1512df;color:#fff;border-radius:.5rem;padding:.5rem .75rem;z-index:3}
.plan-card{transform-origin:center bottom;transition:transform 500ms var(--motion-ease),box-shadow 400ms var(--motion-ease)}
.plan-card:focus-within{transform:translateY(-5px)}
.ui-nav{transition:box-shadow 300ms ease,background 300ms ease}
html[data-scrolled=true] .ui-nav{box-shadow:0 8px 28px #00000015}
.motion-progress{position:fixed;left:0;right:0;bottom:0;height:3px;background:#2a9269;z-index:40;pointer-events:none;transform:scaleX(0);transform-origin:left}
@media(hover:hover) and (pointer:fine){.plan-card:hover{transform:translateY(-10px) scale(1.015);box-shadow:0 24px 48px #172c221a}.button:hover{transform:translateY(-3px)}.rooftop-grid figure:hover img{transform:scale(1.055)}}
/* Native scroll timelines are progressive enhancement: no wheel/touch handlers. */
@supports(animation-timeline:view()){@media(prefers-reduced-motion:no-preference) and (min-width:768px){
 .hero-scene{height:170svh;view-timeline-name:--hero-scene;view-timeline-axis:block}
 .hero-scene .hero{position:sticky;top:var(--nav-height);height:calc(100svh - var(--nav-height))}
 .hero-scene .hero-visual{animation:hero-expand linear both;animation-timeline:--hero-scene;animation-range:contain 0% contain 100%}
 .hero-scene .hero-copy{animation:hero-exit linear both;animation-timeline:--hero-scene;animation-range:contain 0% contain 100%}
 .hero-scene .hero::after{animation:veil-release linear both;animation-timeline:--hero-scene;animation-range:contain 0% contain 100%}
 @keyframes hero-expand{from{transform:translateX(0) scale(1.12)}to{transform:translateX(-8%) scale(1.28)}}
 @keyframes hero-exit{0%,20%{transform:translateY(0) scale(1);opacity:1}100%{transform:translateY(-80px) scale(.92);opacity:0}}
 @keyframes veil-release{from{opacity:1}to{opacity:.4}}
}}
@supports(animation-timeline:scroll()){@media(prefers-reduced-motion:no-preference){.motion-progress{animation:read-progress linear both;animation-timeline:scroll(root)}@keyframes read-progress{from{transform:scaleX(0)}to{transform:scaleX(1)}}}}
@media(max-width:767px){.hero-scene .hero{min-height:800px;min-height:max(760px,calc(100svh - var(--nav-height)));align-items:flex-start;padding:3rem var(--gutter) 20rem}.hero-scene .hero-copy{width:100%;max-width:32rem}.hero-scene .hero h1{font-size:clamp(3rem,12vw,5.3rem)}.hero-scene .hero-visual{inset:0}.hero-scene .hero-visual img{object-position:65% center}.hero-scene .hero::after{background:linear-gradient(180deg,#0b1512fa 0%,#0b1512e8 35%,#0b151295 65%,#0b15120d 100%)}.hero-scene .hero-visual figcaption{font-size:.75rem;max-width:calc(100% - 2rem)}.hero-scene .hero-actions{gap:1.25rem}.plan-card:focus-within{transform:none}}
@media(prefers-reduced-motion:reduce){.hero-scene{height:auto}.hero-scene .hero{position:relative}.hero-scene .hero-visual,.hero-scene .hero-copy,.hero-scene .hero::after{animation:none;transform:none;opacity:1}.motion-progress{display:none}.plan-card,.plan-card:hover,.plan-card:focus-within,.button:hover,.rooftop-grid figure:hover img{transform:none;transition:none}}
