:root{--cream:#b89b87;--mocha:#7a5d4b;--espresso:#4a3428;--dark:#0f0b0b;--card:#241b18;--text:#e8ddd5}*{box-sizing:border-box;margin:0;padding:0;font-family:Poppins,sans-serif}body{background:var(--dark);color:var(--text)}.navbar{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);z-index:1000;background:#0f0b0beb;border-bottom:1px solid #b89b8726;justify-content:space-between;align-items:center;width:100%;padding:20px 8%;display:flex;position:fixed;top:0}.logo{font-size:28px;font-weight:700}.logo span{color:var(--cream)}.nav-links{gap:30px;list-style:none;display:flex}.nav-links a{color:#fff;text-decoration:none;transition:all .3s}.nav-links a:hover{color:var(--cream)}.quote-btn{background:var(--cream);color:#000;cursor:pointer;border:none;border-radius:30px;padding:12px 24px;font-weight:700;transition:all .3s}.quote-btn:hover{transform:translateY(-3px)}.hero{background-blend-mode:multiply;background-color:#0000;background-image:linear-gradient(#0000008c,#000000bf),url(/images/fence-1.png);background-position:50%;background-repeat:no-repeat;background-size:cover;background-attachment:scroll,scroll;background-origin:padding-box,padding-box;background-clip:border-box,border-box;justify-content:center;align-items:center;height:100vh;display:flex}.hero-content{text-align:center;width:100%;max-width:1200px;margin:auto;padding:0 20px}.tagline{color:var(--cream);letter-spacing:8px;text-transform:uppercase;text-align:center;margin-bottom:35px;font-size:18px;font-weight:700}.hero-content h1{text-align:center;text-shadow:0 10px 30px #000000b3;margin-bottom:25px;font-size:90px;font-weight:800;line-height:1.1}.hero-content h1 span{color:var(--cream);text-shadow:0 0 15px #f7b50040,0 0 30px #f7b50026}.hero-content p{text-align:center;color:#e5e7eb;max-width:900px;margin:auto;font-size:22px;line-height:1.8}.hero-buttons{justify-content:center;align-items:center;gap:25px;margin-top:45px;display:flex}.btn1,.btn2{box-sizing:border-box;border-radius:50px;justify-content:center;align-items:center;width:240px;height:65px;padding:2px 0 0;font-size:20px;font-weight:700;line-height:65px;text-decoration:none;transition:all .3s;display:block}.btn1{color:#111;letter-spacing:.5px;background:#c9ad97;border-radius:60px}.btn1:hover{background:#a98b74;transform:translateY(-5px)}.btn2{color:#fff;background:0 0;border:2px solid #fff}.btn2:hover{color:#000;background:#fff;transform:translateY(-4px)}.fence-overlay .quote-overlay-btn{color:#111;letter-spacing:.5px;background:#c9ad97;border:none;border-radius:50px;margin-top:12px;padding:12px 28px;font-size:15px;font-weight:600;text-decoration:none;transition:all .3s;display:inline-block;box-shadow:0 5px 15px #c9ad9740}.fence-overlay .btn1:hover{background:#b3947d;transform:translateY(-3px);box-shadow:0 10px 25px #c9ad9759}@media (max-width:768px){.navbar{padding:15px 5%}.nav-links{display:none}.hero-content h1{letter-spacing:-1px;text-shadow:0 8px 25px #00000073;margin-bottom:35px;font-size:58px;font-weight:800;line-height:1.1}.hero-content p{font-size:18px}.btn1,.btn2{width:220px}.about{grid-template-columns:1fr}.about-content h2{font-size:36px}@media (max-width:768px){.founder-container{text-align:center;flex-direction:column}.founder-image img{border:4px solid var(--cream);width:280px;height:350px}}}.quick-contact{background:#1b1412;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:25px;padding:60px 8%;display:grid}.contact-card{text-align:center;background:#241b18;border-radius:20px;padding:30px;transition:all .3s}.contact-card:hover{border:1px solid var(--cream);transform:translateY(-8px)}.contact-card i{color:var(--cream);margin-bottom:15px;font-size:40px}.contact-card h3{margin-bottom:10px;font-size:22px}.contact-card p{color:#d8ccc2}.contact-card a{color:#fff;text-decoration:none;display:block}.about{background:#16100e;grid-template-columns:1fr 1fr;align-items:center;gap:60px;padding:100px 8%;display:grid}.about-image img{border-radius:25px;width:100%;box-shadow:0 10px 30px #0006}.section-tag{color:var(--cream);letter-spacing:3px;margin-bottom:15px;font-weight:700}.about-content h2{margin-bottom:25px;font-size:48px;line-height:1.2}.about-content p{color:#d8ccc2;font-size:18px;line-height:1.8}.about-stats{flex-wrap:wrap;gap:20px;margin-top:40px;display:flex}.stat-box{text-align:center;background:#1b1412;border-radius:15px;min-width:140px;padding:25px}.stat-box h3{color:var(--cream);margin-bottom:8px;font-size:32px}.stat-box p{color:#fff}.fence-btn{color:#111;background:#c9ad97;border-radius:50px;align-items:center;gap:8px;padding:12px 26px;font-weight:600;text-decoration:none;transition:all .3s;display:inline-flex}.fence-btn:hover{background:#b3947d;transform:translateY(-4px)}.why-us{text-align:center;background:#1b1412;padding:100px 8%}.section-header{margin-bottom:60px}.section-header h2{margin-top:10px;font-size:36px}.service-card,.area-card,.why-card{padding:25px}.service-card:hover,.area-card:hover,.why-card:hover{transform:translateY(-10px);box-shadow:0 20px 40px #c9ad9726}.why-container{grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:30px;display:grid}.why-card{background:#241b18;border-radius:20px;padding:40px 30px;transition:all .4s}.why-card:hover{border:1px solid var(--cream);transform:translateY(-10px);box-shadow:0 10px 25px #f7b50026}.why-card i{color:var(--cream);margin-bottom:20px;font-size:45px}.why-card h3{margin-bottom:15px;font-size:24px}.why-card p{color:#d8ccc2;line-height:1.8}.services{text-align:center;background:#0f0b0b;padding:100px 8%}.services-container{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:30px;margin-top:60px;display:grid}.service-card{background:#1b1412;border-radius:20px;padding:40px 30px;transition:all .4s}.service-card:hover{border:1px solid var(--cream);transform:translateY(-10px);box-shadow:0 15px 35px #b89b8740}.service-card i{background:#c9ad9714;border-radius:50%;justify-content:center;align-items:center;width:90px;height:90px;margin:auto auto 25px;display:flex}.service-card h3{margin-bottom:15px;font-size:24px}.service-card p{color:#d8ccc2;line-height:1.8}.fencing-types{text-align:center;background:#1b1412;padding:100px 8%}.fence-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:30px;margin-top:60px;display:grid}.fence-card{cursor:pointer;border-radius:20px;position:relative;overflow:hidden}.fence-card img{object-fit:cover;width:100%;height:350px;transition:all .5s}.fence-card:hover img{transform:scale(1.1)}.fence-overlay{text-align:left;background:linear-gradient(#0006,#000000bf);width:100%;padding:25px;position:absolute;bottom:0}.fence-overlay h3{color:#fff;font-size:24px}.project-showcase{text-align:center;background:#16100e;padding:100px 8%}.slider-container{max-width:1200px;margin:60px auto auto;position:relative}.slides{display:none;position:relative}.slides.active-slide{display:block}.slides img{object-fit:cover;border-radius:25px;width:100%;height:650px}.slide-content{text-align:left;background:#0000008c;border-radius:15px;padding:20px 30px;position:absolute;bottom:40px;left:40px}.slide-content h3{margin-bottom:10px;font-size:32px}.slide-content p{color:var(--cream)}.fade{animation:1.5s fadeEffect}@keyframes fadeEffect{0%{opacity:.4}to{opacity:1}}.stats-section{text-align:center;background:#1b1412;padding:100px 8%}.stats-container{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:30px;margin-top:60px;display:grid}.stat-card{background:#241b18;border-radius:20px;padding:40px;transition:all .3s}.stat-card:hover{border:1px solid var(--cream);transform:translateY(-10px)}.stat-card h3{color:#c9ad97;margin-bottom:10px;font-size:60px}.stat-card p{color:#d8ccc2;font-size:18px}.service-areas{text-align:center;background:#1b1412;padding:100px 8%}.area-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:30px;margin-top:60px;display:grid}.area-card{cursor:pointer;background:#241b18;border-radius:20px;transition:all .4s;overflow:hidden}.area-card:hover{border:1px solid var(--cream);transform:translateY(-10px)}.area-card img{object-fit:cover;width:100%;height:250px;transition:all .5s}.area-card:hover img{transform:scale(1.1)}.area-info{padding:20px}.quote-section{text-align:center;background:#0f0b0b;padding:100px 8%}.quote-subtitle{color:#d8ccc2;margin-top:15px}.quote-container{max-width:900px;margin:60px auto auto}.quote-form{gap:20px;display:grid}.quote-form input,.quote-form select,.quote-form textarea{color:#fff;background:#1b1412;border:none;border-radius:15px;width:100%;padding:18px;font-size:16px}.quote-form input:focus,.quote-form select:focus,.quote-form textarea:focus{border:1px solid var(--cream);outline:none}.quote-form button{background:var(--cream);color:#000;cursor:pointer;border:none;border-radius:15px;padding:18px;font-size:18px;font-weight:700;transition:all .3s}.quote-form button:hover{transform:translateY(-4px);box-shadow:0 10px 25px #f7b50059}.footer{background:#090606;border-top:1px solid #c9ad9726;padding-top:80px}.footer-container{grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:40px;width:84%;margin:auto;display:grid}.footer-box h2,.footer-box h3{color:var(--cream);margin-bottom:20px}.footer-box p{color:#d8ccc2;line-height:1.8}.footer-box ul{list-style:none}.footer-box ul li{margin-bottom:12px}.footer-box ul li a{color:#d8ccc2;text-decoration:none;transition:all .3s}.footer-box ul li a:hover{color:var(--cream)}.social-icons{gap:15px;display:flex}.social-icons a{color:#fff;background:#241b18;border-radius:50%;justify-content:center;align-items:center;width:45px;height:45px;text-decoration:none;transition:all .3s;display:flex}.social-icons a:hover{background:var(--cream);color:#000;transform:translateY(-5px)}.footer-bottom{text-align:center;color:#9ca3af;border-top:1px solid #ffffff1a;margin-top:60px;padding:25px}.whatsapp-float{color:#fff;z-index:9999;background:#25d366;border-radius:50%;justify-content:center;align-items:center;width:65px;height:65px;font-size:32px;text-decoration:none;transition:all .3s;display:flex;position:fixed;bottom:25px;right:25px;box-shadow:0 8px 20px #0000004d}.whatsapp-float:hover{transform:scale(1.1);box-shadow:0 10px 25px #25d36680}#topBtn{background:var(--cream);color:#000;cursor:pointer;z-index:9999;border:none;border-radius:50%;width:55px;height:55px;font-size:24px;font-weight:700;transition:all .3s;display:none;position:fixed;bottom:110px;right:35px}#topBtn:hover{transform:translateY(-4px)}#topBtn.show{display:block}.menu-toggle{cursor:pointer;color:#fff;background:0 0;border:0;font-size:28px;display:none}@media (max-width:768px){.menu-toggle{display:block}.quote-btn{display:none}.nav-links{background:#1b1412;flex-direction:column;align-items:center;gap:25px;width:100%;padding:30px 0;display:none;position:absolute;top:80px;left:0}.hero-content h1{letter-spacing:-1px;font-size:46px}.hero-content p{font-size:18px}.nav-links.active{display:flex}.nav-links li{list-style:none}.nav-links a{color:#fff;font-size:18px;text-decoration:none}}html{scroll-behavior:smooth}section{scroll-margin-top:100px}.btn1,.btn2,.quote-btn{text-decoration:none;display:inline-block}.call-float{background:var(--cream);color:#000;z-index:999;border-radius:50%;justify-content:center;align-items:center;width:60px;height:60px;font-size:28px;text-decoration:none;transition:all .3s;display:flex;position:fixed;bottom:25px;right:100px;box-shadow:0 5px 20px #0000004d}.call-float:hover{transform:scale(1.1);box-shadow:0 10px 25px #f7b50066}.founder-section{background:#16100e;padding:100px 8%}.founder-container{align-items:center;gap:60px;max-width:1200px;margin:auto;display:flex}.founder-image img{object-fit:cover;border:4px solid var(--cream);border-radius:20px;width:350px;height:450px;box-shadow:0 20px 40px #c9ad9733}.founder-content h4{color:var(--cream);letter-spacing:3px;margin-bottom:15px}.founder-content h2{margin-bottom:20px;font-size:42px}.founder-content p{color:#d8ccc2;margin-bottom:15px;font-size:18px;line-height:1.8}.founder-quote{color:var(--cream);margin-bottom:20px;font-style:italic}.service-areas{background:#0f0b0b;padding:100px 8%}.service-areas .section-tag{text-align:center;color:var(--cream);letter-spacing:5px;margin-bottom:20px;font-weight:700}.service-areas h2{text-align:center;color:#fff;margin-bottom:60px;font-size:60px}.areas-grid{grid-template-columns:repeat(3,1fr);gap:25px;margin-top:50px;display:grid}.area-card{text-align:center;background:#241b18;border:1px solid #b89b871f;border-radius:25px;padding:15px;transition:all .3s;overflow:hidden}.area-card:hover{transform:translateY(-8px);box-shadow:0 15px 35px #0000004d}.area-info{flex:1}.area-info h3{color:#fff;margin-bottom:15px;font-size:34px}.area-info p{color:#cbd5e1;margin-bottom:10px;font-size:17px}.area-image img{object-fit:cover;border-radius:15px;width:100%;height:180px;margin-bottom:15px}.area-card:hover .area-image img{transform:scale(1.08)}@media (max-width:992px){.areas-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:768px){.service-areas h2{font-size:36px;line-height:1.3}.areas-grid{grid-template-columns:1fr;gap:20px}.area-card{padding:15px}.area-image img{object-fit:cover;border-radius:15px;width:100%;height:200px}.area-info h3{margin-top:15px;font-size:24px}.area-info p{font-size:14px}}.service-card,.area-card,.why-card,.contact-card,.stat-card{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid #c9ad9726;box-shadow:0 5px 20px #0000004d}.service-card:hover,.contact-card:hover,.stat-card:hover,.area-card:hover,.why-card:hover{box-shadow:0 20px 40px #b89b872e}.quote-overlay-btn{color:#111;cursor:pointer;background:#c9ad97;border:none;border-radius:50px;padding:12px 28px;font-size:15px;font-weight:600;transition:all .3s;box-shadow:0 5px 15px #c9ad9740}.quote-overlay-btn:hover{background:#b3947d;transform:translateY(-3px);box-shadow:0 10px 25px #c9ad9759}.fence-overlay{text-align:center;background:linear-gradient(#0000,#000000e6);width:100%;padding:25px;position:absolute;bottom:0;left:0}.fence-overlay h3{color:#fff;margin-bottom:15px;font-size:28px;font-weight:700}@media (max-width:768px){body{overflow-x:hidden}img{max-width:100%}.navbar{min-height:64px;padding:12px 5%}.logo{font-size:21px;line-height:1.2}.nav-links{padding:24px 0;top:64px}.hero{align-items:center;height:auto;min-height:100svh;padding:112px 5% 58px}.hero-content{padding:0}.tagline{letter-spacing:2px;margin-bottom:18px;font-size:11px;line-height:1.6}.hero-content h1{letter-spacing:0;margin-bottom:18px;font-size:clamp(34px,10vw,46px);line-height:1.15}.hero-content p{font-size:15px;line-height:1.65}.hero-buttons{flex-direction:column;gap:14px;margin-top:28px}.btn1,.btn2{justify-content:center;align-items:center;width:min(100%,260px);height:54px;font-size:16px;line-height:1;display:flex}.about,.services,.fencing-types,.project-showcase,.stats-section,.quote-section,.service-areas,.why-us,.founder-section{padding:64px 5%}.section-header{margin-bottom:36px}.section-header h2,.about-content h2,.service-areas h2,.founder-content h2{font-size:30px;line-height:1.25}.section-tag{letter-spacing:2px;font-size:12px}.about{text-align:left;grid-template-columns:1fr;grid-template-areas:"about-image""about-content";gap:26px}.about-image{order:1;grid-area:about-image}.about-content{order:2;grid-area:about-content}.about-image img{object-fit:cover;object-position:center;height:260px;box-shadow:0 8px 24px #00000059}.slides img,.about-image img{border-radius:16px}.about-content h2{margin-bottom:16px}.about-content p,.founder-content p,.why-card p,.service-card p{font-size:15px;line-height:1.7}.about-stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:24px;display:grid}.stat-box{border-radius:14px;width:100%;min-width:0;padding:16px 8px}.stat-box h3{margin-bottom:5px;font-size:25px}.stat-box p{font-size:12px;line-height:1.35}.services-container,.fence-grid,.stats-container,.why-container,.quick-contact,.footer-container{grid-template-columns:1fr;gap:18px}.service-card,.why-card,.contact-card,.stat-card,.area-card{border-radius:16px;padding:24px 20px}.service-card i{width:72px;height:72px;margin-bottom:18px}.service-card h3,.why-card h3,.contact-card h3{font-size:21px}.fence-card,.area-card{border-radius:16px}.fence-card img{height:260px}.fence-overlay{padding:20px}.fence-overlay h3{font-size:22px}.slider-container{margin-top:36px}.slides img{height:320px}.slide-content{border-radius:12px;padding:16px;bottom:14px;left:14px;right:14px}.slide-content h3{font-size:22px}.stat-card h3{font-size:42px}.quote-container{margin-top:36px}.quote-form input,.quote-form select,.quote-form textarea,.quote-form button{border-radius:12px;padding:15px;font-size:15px}.service-areas h2{margin-bottom:34px}.areas-grid{grid-template-columns:1fr;gap:18px;margin-top:34px}.area-info h3{font-size:24px}.area-image img{height:190px}.founder-container{text-align:center;flex-direction:column;gap:30px}.founder-image img{border-radius:16px;width:min(100%,290px);height:360px}.founder-content h4{letter-spacing:2px;font-size:12px}.footer{padding-top:56px}.footer-container{width:90%}.footer-bottom{margin-top:36px;padding:20px 5%;font-size:13px}.whatsapp-float,.call-float{width:52px;height:52px;font-size:24px;bottom:18px}.whatsapp-float{right:18px}.call-float{right:82px}#topBtn{width:44px;height:44px;font-size:20px;bottom:84px;right:22px}}@media (max-width:420px){.logo{font-size:19px}.hero{padding-top:104px}.tagline{letter-spacing:1.5px;font-size:10px}.hero-content h1{font-size:36px}.about-image img{height:220px}.about-stats{grid-template-columns:1fr;gap:10px}.stat-box{text-align:left;justify-content:space-between;align-items:center;padding:14px 18px;display:flex}.stat-box h3{margin-bottom:0;font-size:26px}.stat-box p{text-align:right;font-size:13px}.section-header h2,.about-content h2,.service-areas h2,.founder-content h2{font-size:27px}.slides img{height:280px}.fence-card img{height:230px}}
