/* ==================================
   PREMIUM HOMEPAGE LOOK UPGRADE
================================== */

.hero{
background:
linear-gradient(135deg, rgba(0,0,0,.72), rgba(0,0,0,.45)),
url('../images/hero.jpg');
background-size:cover;
background-position:center;
background-attachment:fixed;
padding:130px 0;
text-align:center;
color:#fff;
}

.hero h1{
font-size:64px;
font-weight:700;
max-width:820px;
margin:0 auto 22px;
line-height:1.08;
color:#fff;
letter-spacing:-1px;
}

.hero p{
font-size:21px;
max-width:680px;
margin:0 auto 34px;
color:#eee;
line-height:1.8;
}

.search-box{
background:rgba(255,255,255,.10);
backdrop-filter:blur(14px);
-webkit-backdrop-filter:blur(14px);
padding:18px;
border-radius:14px;
display:grid;
grid-template-columns:1fr 1fr auto;
gap:12px;
max-width:900px;
margin:0 auto 28px;
border:1px solid rgba(255,255,255,.14);
box-shadow:0 18px 40px rgba(0,0,0,.18);
align-items:center;
}

.search-box select{
width:100%;
height:56px;
padding:0 16px;
border:none;
border-radius:10px;
font-size:15px;
outline:none;
background:#fff;
color:#111;
appearance:auto;
display:block;
}

.search-box button{
height:56px;
padding:0 30px;
border:none;
border-radius:10px;
font-size:15px;
background:#c8a96b;
color:#111;
font-weight:700;
cursor:pointer;
transition:.3s;
white-space:nowrap;
}

.search-box button:hover{
background:#fff;
transform:translateY(-2px);
}

@media(max-width:768px){

.search-box{
grid-template-columns:1fr;
max-width:95%;
}

.search-box button,
.search-box select{
width:100%;
}

}
.main-btn{
display:inline-block;
padding:16px 34px;
background:#c8a96b;
color:#111;
text-decoration:none;
font-weight:700;
border-radius:10px;
transition:.3s;
box-shadow:0 14px 30px rgba(0,0,0,.18);
}

.main-btn:hover{
background:#fff;
color:#111;
transform:translateY(-3px);
box-shadow:0 18px 35px rgba(0,0,0,.22);
}

.ghost-btn{
display:inline-block;
padding:16px 34px;
border:1px solid rgba(255,255,255,.28);
color:#fff;
text-decoration:none;
font-weight:600;
border-radius:10px;
margin-left:12px;
transition:.3s;
}

.ghost-btn:hover{
background:#fff;
color:#111;
}

.stats{
display:flex;
justify-content:center;
align-items:stretch;
gap:18px;
margin-top:42px;
flex-wrap:wrap;
}

.stats .box{
background:rgba(255,255,255,.10);
backdrop-filter:blur(12px);
-webkit-backdrop-filter:blur(12px);
border:1px solid rgba(255,255,255,.14);
padding:22px 28px;
min-width:190px;
text-align:center;
border-radius:14px;
box-shadow:0 14px 30px rgba(0,0,0,.18);
}

.stats h3{
font-size:32px;
margin-bottom:8px;
color:#c8a96b;
line-height:1;
}

.stats p,
.stats span{
font-size:15px;
color:#fff;
opacity:.9;
}

.cards{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:25px;
}

.cards .card{
background:#fff;
padding:0;
border:none;
border-radius:16px;
overflow:hidden;
box-shadow:0 18px 40px rgba(0,0,0,.08);
transition:.35s ease;
}

.cards .card:hover{
transform:translateY(-8px);
box-shadow:0 22px 48px rgba(0,0,0,.12);
}

.cards .card img{
width:100%;
height:240px;
object-fit:cover;
display:block;
margin:0;
border-radius:0;
}

.cards .card h3{
font-size:26px;
padding:24px 24px 10px;
margin:0;
color:#111;
line-height:1.3;
}

.cards .card p{
font-size:16px;
line-height:1.7;
color:#666;
padding:0 24px 12px;
margin:0;
}

.cards .card .main-btn{
margin:12px 24px 24px;
display:inline-block;
}

/* MOBILE */
@media(max-width:768px){

.hero{
padding:90px 0;
}

.hero h1{
font-size:36px;
}

.hero p{
font-size:17px;
}

.search-box{
padding:15px;
}

}

/* ===============================
   PREMIUM TESTIMONIALS
=============================== */
.testimonial-card{
background:#fff;
padding:38px 32px;
border-radius:18px;
box-shadow:0 18px 40px rgba(0,0,0,.07);
text-align:left;
border:1px solid #eee;
position:relative;
transition:.3s;
}

.testimonial-card:hover{
transform:translateY(-8px);
box-shadow:0 22px 48px rgba(0,0,0,.11);
}

.testimonial-card::before{
content:"“";
font-size:70px;
line-height:1;
color:#c8a96b;
position:absolute;
top:18px;
left:22px;
opacity:.35;
font-family:serif;
}

.testimonial-card p{
font-size:17px;
line-height:1.9;
color:#444;
margin-bottom:24px;
padding-top:18px;
}

.testimonial-card h3{
font-size:24px;
margin-bottom:6px;
color:#111;
}

.testimonial-card span{
font-size:14px;
color:#777;
letter-spacing:.3px;
}

/* ===============================
   PREMIUM SERVICES
=============================== */

.services{
padding:90px 20px;
}

.services h2{
font-size:46px;
line-height:1.2;
font-weight:700;
letter-spacing:-0.5px;
text-align:center;
margin-bottom:45px;
position:relative;
}

.services h2::after{
content:"";
display:block;
width:70px;
height:3px;
background:#c8a96b;
margin:18px auto 0;
border-radius:10px;
}

.cards{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:25px;
}

.cards .card{
background:#fff;
padding:40px 30px;
border-radius:14px;
box-shadow:0 15px 35px rgba(0,0,0,.06);
border:1px solid #eee;
transition:.3s;
}

.cards .card:hover{
transform:translateY(-8px);
}

.cards .card h3{
font-size:30px;
margin-bottom:12px;
}

.cards .card p{
font-size:18px;
line-height:1.7;
color:#555;
}

/* MOBILE */
@media(max-width:768px){

.testimonial-grid,
.cards{
grid-template-columns:1fr;
}

.testimonials h2,
.services h2{
font-size:32px;
}

}

/* ===============================
   WHY CHOOSE US SECTION
=============================== */

.why-us{
padding:90px 20px;
background:#111;
color:#fff;
}

.why-us h2{
text-align:center;
font-size:42px;
margin-bottom:12px;
}

.why-sub{
text-align:center;
max-width:700px;
margin:0 auto 45px;
color:#bbb;
font-size:18px;
}

.why-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:25px;
max-width:1200px;
margin:auto;
}

.why-card{
background:linear-gradient(180deg,#1a1a1a,#141414);
padding:38px 30px;
border-radius:18px;
border:1px solid rgba(255,255,255,.08);
transition:.35s ease;
box-shadow:0 14px 28px rgba(0,0,0,.22);
}

.why-card:hover{
transform:translateY(-8px);
border-color:#c8a96b;
box-shadow:0 18px 36px rgba(0,0,0,.30);
}

.why-card h3{
font-size:24px;
margin-bottom:14px;
color:#fff;
line-height:1.3;
}

.why-card p{
font-size:16px;
line-height:1.9;
color:#bdbdbd;
}
/* MOBILE */
@media(max-width:768px){

.why-us h2{
font-size:32px;
}

.why-grid{
grid-template-columns:1fr;
}

}

/* ===============================
   PRIME AREAS SECTION
=============================== */

.areas{
padding:90px 20px;
background:#f8f8f8;
}

.areas h2{
text-align:center;
font-size:42px;
color:#111;
margin-bottom:12px;
}

.areas-sub{
text-align:center;
max-width:760px;
margin:0 auto 45px;
font-size:18px;
color:#666;
}

.area-wrap{
display:grid;
grid-template-columns:repeat(2,1fr);
gap:28px;
max-width:1200px;
margin:auto;
}

.area-box{
background:#fff;
padding:42px 34px;
border-radius:18px;
box-shadow:0 18px 40px rgba(0,0,0,.07);
border:1px solid #eee;
transition:.35s ease;
}

.area-box:hover{
transform:translateY(-8px);
box-shadow:0 22px 48px rgba(0,0,0,.11);
}

.area-box h3{
font-size:30px;
margin-bottom:18px;
color:#111;
line-height:1.2;
}

.area-box p{
font-size:17px;
line-height:2;
color:#666;
}

/* MOBILE */
@media(max-width:768px){

.areas h2{
font-size:32px;
}

.area-wrap{
grid-template-columns:1fr;
}

} 
/* ===============================
   COMPACT PREMIUM LEAD FORM
=============================== */

.lead-section{
padding:70px 20px;
background:#111;
color:#fff;
}

.lead-section h2{
text-align:center;
font-size:36px;
margin-bottom:10px;
font-weight:700;
}

.lead-sub{
text-align:center;
max-width:620px;
margin:0 auto 30px;
font-size:16px;
color:#bbb;
line-height:1.7;
}

.lead-form{
max-width:760px;
margin:auto;
display:grid;
grid-template-columns:repeat(2,1fr);
gap:14px;
}

.lead-form input,
.lead-form select,
.lead-form textarea{
padding:16px 18px;
border:1px solid rgba(255,255,255,.10);
background:#181818;
color:#fff;
border-radius:12px;
font-size:15px;
transition:.3s;
outline:none;
}

.lead-form input:focus,
.lead-form select:focus,
.lead-form textarea:focus{
border-color:#c8a96b;
background:#1f1f1f;
}

.lead-form button{
grid-column:1 / -1;
padding:16px;
background:#c8a96b;
color:#111;
font-weight:700;
border:none;
border-radius:12px;
cursor:pointer;
transition:.3s;
}

.lead-form button:hover{
background:#fff;
transform:translateY(-3px);
}

/* MOBILE */
@media(max-width:768px){

.lead-section{
padding:55px 15px;
}

.lead-section h2{
font-size:28px;
}

.lead-form{
grid-template-columns:1fr;
}

.lead-form textarea,
.lead-form button{
grid-column:auto;
}

}

/* ===============================
   PREMIUM COUNTER STRIP
=============================== */

.counter-strip{
padding:38px 20px;
background:#fff;
border-top:1px solid #eeeeee;
border-bottom:1px solid #eeeeee;
}

.counter-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:0;
align-items:center;
}

.counter-box{
text-align:center;
padding:12px 18px;
border-right:1px solid #f1f1f1;
}

.counter-box:last-child{
border-right:none;
}

.counter-box h3{
font-size:40px;
line-height:1;
margin:0 0 8px;
font-weight:700;
color:#c8a96b;
}

.counter-box p{
margin:0;
font-size:14px;
color:#666;
letter-spacing:.6px;
text-transform:uppercase;
font-weight:600;
}

/* MOBILE */
@media(max-width:768px){

.counter-strip{
padding:28px 15px;
}

.counter-grid{
grid-template-columns:repeat(2,1fr);
gap:14px;
}

.counter-box{
padding:16px 10px;
border-right:none;
border:1px solid #f3f3f3;
border-radius:10px;
}

.counter-box h3{
font-size:30px;
}

.counter-box p{
font-size:13px;
}

}

/* ===============================
   LUXURY FINAL CTA SECTION
=============================== */

.final-cta{
padding:110px 20px;
background:linear-gradient(135deg,#111,#1a1a1a);
color:#fff;
text-align:center;
}

.final-cta h2{
font-size:52px;
line-height:1.15;
margin-bottom:16px;
font-weight:700;
max-width:900px;
margin-left:auto;
margin-right:auto;
}

.final-cta p{
max-width:760px;
margin:0 auto 34px;
font-size:18px;
line-height:1.9;
color:#bdbdbd;
}

.cta-actions{
display:flex;
justify-content:center;
gap:16px;
flex-wrap:wrap;
}

.ghost-dark-btn{
display:inline-block;
padding:14px 28px;
border:1px solid #fff;
color:#fff;
text-decoration:none;
border-radius:6px;
font-weight:600;
transition:.3s;
}

.ghost-dark-btn:hover{
background:#fff;
color:#111;
}

/* MOBILE */
@media(max-width:768px){

.final-cta{
padding:70px 15px;
}

.final-cta h2{
font-size:32px;
}

.final-cta p{
font-size:16px;
margin-bottom:24px;
}

.cta-actions{
flex-direction:column;
align-items:center;
}

}

/* ===============================
   PREMIUM TRANSPARENT NAVBAR
=============================== */

.transparent-header{
position:absolute;
top:0;
left:0;
width:100%;
z-index:999;
background:transparent;
padding:22px 0;
}

.transparent-header .logo,
.transparent-header nav a{
color:#fff;
}

.transparent-header .nav-btn{
background:#fff;
color:#111 !important;
}

/* MOBILE */
@media(max-width:768px){

.transparent-header{
position:relative;
background:#111;
padding:18px 0;
}

}

/* ===============================
   SCROLL NAVBAR EFFECT
=============================== */

.transparent-header{
transition:all .3s ease;
}

.transparent-header.scrolled{
position:fixed;
top:0;
left:0;
background:rgba(0,0,0,.95);
box-shadow:0 8px 25px rgba(0,0,0,.18);
padding:16px 0;
}

.transparent-header.scrolled .logo,
.transparent-header.scrolled nav a{
color:#fff;
}

/* ===============================
   HERO FADE ANIMATION
=============================== */

.hero .container{
animation:heroFade 1s ease forwards;
opacity:0;
transform:translateY(30px);
}

@keyframes heroFade{
to{
opacity:1;
transform:translateY(0);
}
}



/* ===============================
   SCROLL REVEAL EFFECT
=============================== */

.services,
.testimonials,
.why-us,
.areas,
.lead-section,
.counter-strip,
.final-cta{
animation:fadeSection .9s ease both;
}

@keyframes fadeSection{
from{
opacity:0;
transform:translateY(35px);
}
to{
opacity:1;
transform:translateY(0);
}
}

/* ===============================
   GOLD LUXURY ACCENT
=============================== */

.hero h1 span,
.services h2 span,
.testimonials h2 span,
.why-us h2 span,
.areas h2 span,
.lead-section h2 span,
.final-cta h2 span{
color:#c8a96b;
}

.main-btn{
background:#c8a96b;
color:#111;
}

.main-btn:hover{
background:#fff;
color:#111;
}

.stats .box h3,
.counter-box h3{
color:#c8a96b;
}

/* ===============================
   PREMIUM BUTTON HOVER EFFECT
=============================== */

.main-btn,
.ghost-dark-btn,
.search-box button,
.lead-form button{
transition:all .3s ease;
}

.main-btn:hover,
.search-box button:hover,
.lead-form button:hover{
transform:translateY(-3px);
box-shadow:0 12px 24px rgba(0,0,0,.18);
}

.ghost-dark-btn:hover{
transform:translateY(-3px);
box-shadow:0 12px 24px rgba(255,255,255,.12);
}

/* ===============================
   SECTION DIVIDER SPACING
=============================== */

.services,
.testimonials,
.why-us,
.areas,
.lead-section,
.counter-strip,
.final-cta{
position:relative;
}

.services::before,
.testimonials::before,
.areas::before{
content:"";
position:absolute;
top:0;
left:50%;
transform:translateX(-50%);
width:80px;
height:2px;
background:#c8a96b;
opacity:.65;
}

/* ===============================
   FINAL MOBILE PREMIUM FIX
=============================== */

@media(max-width:768px){

.hero{
padding:95px 15px 70px;
}

.hero h1{
font-size:38px;
line-height:1.15;
letter-spacing:-0.5px;
}

.hero p{
font-size:16px;
line-height:1.8;
margin-bottom:26px;
}

.search-box{
padding:14px;
gap:10px;
}

.search-box select,
.search-box button{
min-width:100%;
width:100%;
}

.stats .box{
width:100%;
max-width:320px;
}

.cards,
.testimonial-grid,
.why-grid,
.area-wrap,
.counter-grid{
grid-template-columns:1fr !important;
}

.cards .card,
.testimonial-card,
.why-card,
.area-box{
border-radius:16px;
}

.final-cta{
padding:80px 15px;
}

.final-cta h2{
font-size:34px;
}

.lead-section,
.services,
.testimonials,
.why-us,
.areas{
padding:70px 15px;
}

}

/* ===============================
   HOMEPAGE FINAL POLISH
=============================== */

/* smoother rendering */
body{
-webkit-font-smoothing:antialiased;
-moz-osx-font-smoothing:grayscale;
}

/* section spacing consistency */
.services,
.testimonials,
.why-us,
.areas,
.lead-section,
.counter-strip,
.final-cta{
overflow:hidden;
}

/* elegant text selection */
::selection{
background:#c8a96b;
color:#111;
}

/* links smoother */
a{
transition:all .25s ease;
}

/* cards premium hover depth */
.cards .card:hover,
.testimonial-card:hover,
.why-card:hover,
.area-box:hover{
will-change:transform;
}

/* buttons premium click feel */
.main-btn:active,
.ghost-btn:active,
.ghost-dark-btn:active,
.search-box button:active,
.lead-form button:active{
transform:translateY(1px);
}

/* better input placeholder */
input::placeholder,
textarea::placeholder{
opacity:.9;
}

/* cleaner section paragraphs */
.services p,
.testimonials p,
.areas p,
.final-cta p,
.lead-sub,
.why-sub{
letter-spacing:.1px;
}

/* subtle hero glow */
.hero h1{
text-shadow:0 10px 30px rgba(0,0,0,.25);
}

/* cleaner images */
.cards .card img{
filter:saturate(1.02) contrast(1.02);
} 

/* ===============================
   HOMEPAGE FINAL POLISH 2
=============================== */

/* smooth section entrance */
.hero,
.services,
.testimonials,
.why-us,
.areas,
.lead-section,
.counter-strip,
.final-cta{
backface-visibility:hidden;
transform:translateZ(0);
}

/* premium underline animation */
.services h2::after,
.testimonials h2::after,
.areas h2::after{
transition:width .35s ease;
}

.services:hover h2::after,
.testimonials:hover h2::after,
.areas:hover h2::after{
width:95px;
}

/* elegant navbar link hover */
.transparent-header nav a{
position:relative;
}

.transparent-header nav a::after{
content:"";
position:absolute;
left:0;
bottom:-6px;
width:0;
height:2px;
background:#c8a96b;
transition:.3s ease;
}

.transparent-header nav a:hover::after{
width:100%;
}

/* stat boxes subtle float */
.stats .box{
transition:transform .3s ease;
}

.stats .box:hover{
transform:translateY(-5px);
}

/* premium form focus glow */
.lead-form input:focus,
.lead-form select:focus,
.lead-form textarea:focus{
box-shadow:0 0 0 4px rgba(200,169,107,.10);
}

/* footer links polish */
.footer a{
transition:.25s ease;
}

.footer a:hover{
opacity:.8;
} 
/* ===============================
   HOMEPAGE FINAL POLISH 3
=============================== */

/* premium page flow */
body{
overflow-x:hidden;
}

/* elegant section titles balance */
.services h2,
.testimonials h2,
.why-us h2,
.areas h2,
.lead-section h2,
.final-cta h2{
text-wrap:balance;
}

/* subtle card border glow */
.cards .card,
.testimonial-card,
.area-box{
position:relative;
}

.cards .card::after,
.testimonial-card::after,
.area-box::after{
content:"";
position:absolute;
inset:0;
border-radius:inherit;
pointer-events:none;
box-shadow:inset 0 0 0 1px rgba(255,255,255,.25);
opacity:.35;
}

/* premium CTA pulse */
.final-cta .main-btn{
animation:ctaPulse 2.8s infinite;
}

@keyframes ctaPulse{
0%,100%{box-shadow:0 14px 30px rgba(0,0,0,.18);}
50%{box-shadow:0 18px 38px rgba(200,169,107,.30);}
}

/* luxury scroll softness */
html{
scroll-padding-top:90px;
}

/* mobile tap polish */
@media(max-width:768px){

.main-btn,
.ghost-btn,
.ghost-dark-btn,
.search-box button,
.lead-form button{
min-height:48px;
}

} 

/* ===============================
   SERVICE CARD LINK FIX
=============================== */

.cards .card a{
display:block;
text-decoration:none;
color:#111;
height:100%;
}

.cards .card a h3{
color:#111;
}

.cards .card a p{
color:#666;
}

.cards .card a:hover{
text-decoration:none;
} 
/* ===============================
   SERVICE CARD PREMIUM HOVER
=============================== */

.cards .card a{
position:relative;
}

.cards .card a::after{
content:"→";
position:absolute;
right:24px;
bottom:24px;
font-size:22px;
color:#c8a96b;
opacity:0;
transform:translateX(-8px);
transition:.3s ease;
}

.cards .card:hover a::after{
opacity:1;
transform:translateX(0);
}

.cards .card:hover a h3{
color:#c8a96b;
transition:.3s ease;
}