/* Critical CSS for above-the-fold content */
*{margin:0;padding:0;border:none;outline:none;font-size:100%;line-height:inherit}
body{font-size:18px;color:#6E6E6E;line-height:1.7em;font-weight:500;-webkit-font-smoothing:antialiased;background:#fff;font-family:'Roboto',sans-serif;margin:0;padding:0}
.page-wrapper{position:relative;width:100%;min-width:320px;z-index:9;margin:0 auto;overflow:hidden}
.main-header{position:absolute;top:0;left:0;right:0;z-index:1000;background:rgba(255,255,255,0.95);backdrop-filter:blur(10px)}
.header-upper{padding:15px 0}
.auto-container{max-width:1200px;margin:0 auto;padding:0 15px}
.inner-container{display:flex;align-items:center;justify-content:space-between}
.logo-box img{max-height:60px;width:auto}
.navigation{display:flex;list-style:none;margin:0;padding:0}
.navigation > li{position:relative;margin:0 20px}
.navigation > li > a{color:#333;text-decoration:none;font-weight:500;padding:10px 0;display:block}
.btn-1{background:#00abe7;color:#fff;padding:12px 25px;border-radius:25px;text-decoration:none;font-weight:600;transition:all 0.3s ease}
.btn-1:hover{background:#0088b8;transform:translateY(-2px)}
.hero-section{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:50px 0;background:url('../images/windows-siding-roofing-northern-virginia.jpg') center/cover no-repeat;position:relative;z-index:1}
.hero-section::before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.4);z-index:-1}
.hero-text{flex:3;color:white;text-shadow:2px 2px 6px rgba(0,0,0,0.8);padding:20px;display:flex;flex-direction:column}
.main-title{font-size:clamp(60px,12vw,130px);font-weight:bold;color:white;text-transform:uppercase;text-shadow:2px 2px 6px rgba(0,0,0,0.8);margin:0;line-height:1}
.tagline{font-size:clamp(12px,1.5vw,16px);letter-spacing:clamp(5px,2vw,13px);color:white;text-transform:uppercase;margin-bottom:20px}
.sub-title{font-size:clamp(24px,4vw,45px);letter-spacing:clamp(5px,1.5vw,13px);color:white;text-transform:uppercase;text-shadow:2px 2px 6px rgba(0,0,0,0.8);margin-bottom:30px}
.hero-description{font-size:16px;color:white;margin-bottom:30px;max-width:600px}
.btn-primary{background:#00abe7;color:#fff;padding:15px 30px;border-radius:5px;text-decoration:none;font-weight:600;display:inline-block;transition:all 0.3s ease}
.btn-primary:hover{background:#0088b8;transform:translateY(-2px)}
.form-container{flex:2;padding:30px;background:rgba(255,255,255,0.95);border-radius:10px;margin-left:30px;backdrop-filter:blur(10px)}
.promo-text{margin-bottom:30px}
.discount-text{font-size:18px;color:#333;margin:5px 0}
.discount-value{font-size:48px;font-weight:bold;color:#00abe7;margin:10px 0}
.loader-wrap{position:fixed;top:0;left:0;width:100%;height:100%;background:#fff;z-index:9999;display:flex;align-items:center;justify-content:center;transition:opacity 0.5s ease}
.preloader{width:50px;height:50px;border:3px solid #f3f3f3;border-top:3px solid #00abe7;border-radius:50%;animation:spin 1s linear infinite}
@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}
.d-flex{display:flex}
.align-items-center{align-items:center}
.justify-content-between{justify-content:between}
.container{max-width:1200px;margin:0 auto;padding:0 15px}
.row{display:flex;flex-wrap:wrap;margin:0 -15px}
.col-lg-8{flex:0 0 66.666667%;max-width:66.666667%;padding:0 15px}
.col-lg-4{flex:0 0 33.333333%;max-width:33.333333%;padding:0 15px}
@media (max-width:991px){
.col-lg-8,.col-lg-4{flex:0 0 100%;max-width:100%}
.hero-text{padding:20px 0}
.form-container{margin-left:0;margin-top:30px}
.navigation{display:none}
.mobile-nav-toggler{display:block}
}
@media (max-width:767px){
.main-title{font-size:clamp(40px,10vw,80px)}
.sub-title{font-size:clamp(20px,6vw,35px)}
.hero-section{padding:100px 0 50px}
}