:root{
--tm-accent:#0072CE;
--tm-accent-dark:#005AA3;
--tm-bg:#08111f;
--tm-surface:#ffffff;
--tm-soft:#eef5fc;
--tm-text:#0f1728;
--tm-muted:#5a6b84;
--tm-border:rgba(15,23,40,.08);
--tm-shadow:0 20px 50px rgba(8,17,31,.12);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}

body{
margin:0;
font-family:'Inter',system-ui,sans-serif;
color:var(--tm-text);
background:#fff;
line-height:1.6
}

a{color:inherit;text-decoration:none}

.container{
width:min(1180px,calc(100% - 2rem));
margin:0 auto
}

.site-header{
position:sticky;
top:0;
z-index:20;
background:rgba(255,255,255,.95);
backdrop-filter:blur(14px);
border-bottom:1px solid var(--tm-border)
}

.topbar,.nav-wrap{
display:flex;
justify-content:space-between;
align-items:center
}

.topbar{padding:1rem 0 .75rem}

.brand-wrap{
display:flex;
align-items:center;
gap:1rem
}

.site-title{
font-size:1.2rem;
font-weight:800
}

.site-tagline{
margin:.15rem 0 0;
color:var(--tm-muted);
font-size:.92rem
}

.header-right{text-align:right}

.phone-label{
display:block;
font-size:.78rem;
color:var(--tm-muted)
}

.topbar-phone{
font-weight:800;
color:var(--tm-accent-dark)
}

.nav-wrap{padding-bottom:.85rem}

.nav-menu,.menu{
list-style:none;
display:flex;
gap:1.2rem;
margin:0;
padding:0;
flex-wrap:wrap
}

.nav-menu a,.menu a{
color:var(--tm-muted);
font-weight:600
}

/* HERO SECTION */

.hero-section{
position:relative;
padding:5.5rem 0 4rem;
color:#fff;
min-height:720px;
display:flex;
align-items:center;
overflow:hidden
}

.hero-section::before{
content:"";
position:absolute;
inset:0;
background-image:url("https://topmaid.us/wp-content/uploads/2026/03/cleaning-background.png");
background-size:cover;
background-position:center;
z-index:0
}

.hero-section::after{
content:"";
position:absolute;
inset:0;
background:linear-gradient(rgba(7,17,31,.72),rgba(0,114,206,.55));
z-index:1
}

.hero-grid{
display:grid;
grid-template-columns:1.25fr .9fr;
gap:2rem;
align-items:center;
position:relative;
z-index:2
}

.eyebrow{
display:inline-block;
padding:.35rem .7rem;
border-radius:999px;
background:rgba(255,255,255,.12);
color:#d7ebff;
font-weight:700;
font-size:.82rem
}

.hero-copy h1{
font-size:clamp(2.3rem,6vw,4.4rem);
line-height:1.05;
margin:1rem 0;
max-width:12ch
}

.hero-copy p{
color:#d2def1;
font-size:1.08rem;
max-width:56ch
}

.hero-actions{
display:flex;
gap:1rem;
flex-wrap:wrap;
margin:1.8rem 0
}

.btn{
display:inline-flex;
align-items:center;
justify-content:center;
padding:.95rem 1.35rem;
border-radius:14px;
font-weight:800;
transition:.2s ease
}

.btn:hover{transform:translateY(-1px)}

.btn-primary{
background:linear-gradient(135deg,var(--tm-accent),var(--tm-accent-dark));
color:#fff;
box-shadow:0 16px 40px rgba(0,114,206,.28)
}

.btn-secondary{
background:rgba(255,255,255,.08);
color:#fff;
border:1px solid rgba(255,255,255,.15)
}

.hero-badges{
display:flex;
gap:.8rem;
flex-wrap:wrap
}

.hero-badges span{
background:rgba(255,255,255,.08);
border:1px solid rgba(255,255,255,.12);
padding:.65rem .85rem;
border-radius:999px;
color:#eaf2ff;
font-size:.92rem
}

.hero-card{position:relative}

.card-glow{
position:absolute;
width:190px;
height:190px;
border-radius:50%;
background:rgba(0,114,206,.35);
filter:blur(55px)
}

.estimate-box{
position:relative;
background:#fff;
color:var(--tm-text);
padding:1.8rem;
border-radius:28px;
box-shadow:var(--tm-shadow)
}

/* TRUST STRIP */

.trust-strip{
background:#fff;
border-bottom:1px solid var(--tm-border)
}

.trust-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:1rem;
padding:1.25rem 0
}

.trust-grid div{
background:var(--tm-soft);
padding:1rem;
border-radius:18px
}

.trust-grid span{
color:var(--tm-muted)
}

/* SECTIONS */

.section{padding:5rem 0}

.cards-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:1rem
}

.service-card{
background:#fff;
border-radius:24px;
padding:1.5rem;
box-shadow:var(--tm-shadow)
}

/* WHY US */

#why-us{
position:relative;
color:#fff;
overflow:hidden
}

#why-us::before{
content:"";
position:absolute;
inset:0;
background-image:url("https://topmaid.us/wp-content/uploads/2026/03/cleaning-background.png");
background-size:cover;
background-position:center;
z-index:0
}

#why-us::after{
content:"";
position:absolute;
inset:0;
background:linear-gradient(rgba(7,17,31,.75),rgba(0,114,206,.55));
z-index:1
}

#why-us .container{
position:relative;
z-index:2
}

.two-col{
display:grid;
grid-template-columns:1.1fr .9fr;
gap:2rem;
align-items:center
}

/* CTA SECTION */

.cta-section{
position:relative;
padding:4rem 0;
min-height:340px;
display:flex;
align-items:center;
overflow:hidden;
color:#fff
}

.cta-section::before{
content:"";
position:absolute;
inset:0;
background-image:url("https://topmaid.us/wp-content/uploads/2026/03/cleaning-background.png");
background-size:cover;
background-position:center;
z-index:0
}

.cta-section::after{
content:"";
position:absolute;
inset:0;
background:linear-gradient(rgba(7,17,31,.72),rgba(0,114,206,.55));
z-index:1
}

.cta-section .container{
position:relative;
z-index:2
}

.cta-box{
background:transparent;
border:none;
box-shadow:none;
display:flex;
justify-content:space-between;
gap:1.5rem;
align-items:center;
width:100%
}

/* TESTIMONIALS */

.testimonial-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:1rem
}

.testimonial-grid blockquote{
background:#fff;
padding:1.5rem;
border-radius:24px;
box-shadow:var(--tm-shadow)
}

.testimonial-grid cite{
display:block;
margin-top:1rem;
font-weight:800
}

/* RESPONSIVE */

@media(max-width:980px){

.hero-grid,
.cards-grid,
.testimonial-grid,
.trust-grid,
.two-col{
grid-template-columns:1fr 1fr
}

}

@media(max-width:720px){

.hero-grid,
.cards-grid,
.testimonial-grid,
.trust-grid,
.two-col{
grid-template-columns:1fr
}

.hero-copy h1{max-width:none}

}