body{font-family:Onest,Arial,sans-serif;background:#141f1a}.roof-hero{position:relative;min-height:760px;height:100svh;overflow:hidden;background:linear-gradient(0deg,#151e1bb3,#151e1b55),url('../assets/roof.webp') center/cover}.roof-hero .concept-logo span{font-family:'Bricolage Grotesque',Arial,sans-serif;font-size:25px;font-weight:600;letter-spacing:-.04em}.roof-location{position:absolute;left:50%;transform:translateX(-50%);font-size:15px;color:#f4f6f3db}.roof-nav{display:flex;gap:25px;font-size:14px;color:#f4f6f3db}.roof-nav a:hover{color:#d7ea81}.roof-copy{position:absolute;right:6vw;top:50%;transform:translateY(-42%);width:53%;max-width:760px}.roof-availability{font-size:16px;color:#f4f6f3cc;margin:0 0 32px;display:flex;gap:10px;align-items:center}.roof-availability::before{content:'';width:6px;height:6px;border-radius:50%;background:#d7ea81}.roof-copy h1{font-family:'Bricolage Grotesque',Arial,sans-serif;font-weight:500;font-size:clamp(45px,5.5vw,86px);line-height:.98;letter-spacing:-.045em;margin:0 0 48px;max-width:730px}.roof-actions{border-top:1px solid #f4f6f366;padding-top:24px}.roof-actions p{font-size:18px;color:#f4f6f3db}.roof-button{display:inline-flex;align-items:center;gap:20px;font-family:'Bricolage Grotesque',Arial,sans-serif;background:#f4f6f3;color:#141f1a;padding:15px 22px;font-size:18px;font-weight:600;transition:background .3s,transform .3s}.roof-button:hover{background:#d7ea81;transform:translateY(-3px)}.roof-services{position:absolute;left:6vw;bottom:85px;width:23%;max-width:300px;display:flex;flex-direction:column}.roof-services a{border-top:1px solid #f4f6f333;padding:16px 0;font-size:15px;color:#f4f6f3db}.roof-services a:last-child{border-bottom:1px solid #f4f6f333}.roof-concept-note{position:absolute;left:6vw;bottom:22px;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#f4f6f3b3}.roof-details{padding:100px 8vw;background:#f4f6f3;color:#141f1a}.roof-details h2{font:500 clamp(36px,4.5vw,64px)/1.02 'Bricolage Grotesque',Arial,sans-serif;letter-spacing:-.04em}.roof-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:50px;margin-top:60px}.roof-grid article{border-top:1px solid #141f1a40;padding-top:25px}.roof-grid span{font-size:12px;color:#58695f}.roof-grid h3,.roof-approach h3{font:500 28px 'Bricolage Grotesque',Arial,sans-serif;letter-spacing:-.03em}.roof-grid p,.roof-approach p{font-size:15px;line-height:1.8;color:#526057}.roof-approach{display:grid;grid-template-columns:1fr 1.5fr;gap:60px;border-top:1px solid #141f1a40;margin-top:70px;padding-top:40px;scroll-margin-top:30px}.roof-approach h3{margin-top:10px}.roof-details+.concept-end{background:#e4eae4}.roof-mobile-menu{position:absolute;top:80px;left:20px;right:20px;background:#141f1a;border:1px solid #f4f6f333;padding:22px;box-shadow:0 20px 50px #0008}.roof-mobile-menu p{color:#c6d0ca;font-size:13px}.roof-mobile-menu a{display:block;padding:16px 0;border-bottom:1px solid #ffffff22}.roof-intro{position:fixed;inset:0;z-index:50;pointer-events:none}.roof-intro .intro-skip{pointer-events:auto}.curtain{position:absolute;left:0;right:0;height:50%;background:#141f1a;display:flex;justify-content:center;overflow:hidden;transition:transform .8s cubic-bezier(.76,0,.24,1)}.curtain.top{top:0;align-items:flex-end;padding-bottom:6px}.curtain.bottom{bottom:0;align-items:flex-start;padding-top:6px}.curtain span{font-family:'Bricolage Grotesque',Arial,sans-serif;font-size:clamp(27px,6vw,95px);font-weight:500;letter-spacing:-.04em;white-space:nowrap;clip-path:inset(0 100% 0 0);animation:type-open .8s steps(24,end) forwards}.curtain.bottom span{font-family:Onest,Arial,sans-serif;font-size:clamp(20px,4.7vw,75px);color:#f4f6f3cc;clip-path:inset(0 0 0 100%);animation-name:type-bottom}.roof-intro.leaving .top{transform:translateY(-100%)}.roof-intro.leaving .bottom{transform:translateY(100%)}@keyframes type-open{to{clip-path:inset(0)}}@keyframes type-bottom{to{clip-path:inset(0)}}.roof-reveal h1 .word{display:inline-block;white-space:nowrap}.roof-reveal h1 .letter{display:inline-block;animation:roof-letter .7s var(--delay,0s) both cubic-bezier(.16,1,.3,1)}@keyframes roof-letter{from{opacity:0;filter:blur(8px);transform:translateY(20px)}to{opacity:1;filter:blur(0);transform:translateY(0)}}
@media(max-width:1000px){.roof-nav{display:none}.roof-hero .menu-toggle{display:flex;align-items:center;justify-content:center;background:#141f1a88;border:1px solid #ffffff55;border-radius:50%;width:44px;height:44px}.roof-services{display:none}.roof-copy{left:6vw;right:6vw;width:auto;max-width:700px;top:auto;bottom:90px;transform:none}.roof-copy h1{font-size:clamp(44px,7.4vw,75px)}.roof-location{font-size:13px}.roof-grid{gap:25px}}@media(max-width:650px){.roof-hero{min-height:730px}.roof-location{display:none}.roof-hero .concept-logo span{font-size:22px}.roof-copy{left:24px;right:24px;bottom:85px}.roof-copy h1{font-size:clamp(42px,11.8vw,68px);margin-bottom:32px}.roof-availability{font-size:13px;margin-bottom:24px}.roof-actions p{font-size:16px}.roof-button{font-size:16px}.roof-concept-note{left:24px;font-size:9px}.roof-details{padding:70px 24px}.roof-grid{grid-template-columns:1fr;gap:28px;margin-top:40px}.roof-approach{grid-template-columns:1fr;gap:8px;margin-top:40px}.curtain.top span{font-size:8vw}.curtain.bottom span{font-size:6.2vw}}

.roof-hero .concept-top{background:linear-gradient(#07120ddd,#07120d55,transparent);padding-bottom:32px}