:root{
  --pf-red:#d60000;
  --pf-red-dark:#9d0000;
  --pf-black:#090909;
  --pf-white:#ffffff;
  --pf-grey:#f4f5f7;
  --pf-text:#171717;
  --pf-muted:#666;
  --pf-border:#e8e8e8;
  --pf-shadow:0 18px 45px rgba(0,0,0,.12);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--pf-text);background:#fff;line-height:1.55}
a{color:inherit}
img{max-width:100%;height:auto}
.container{width:min(1140px,92vw);margin:auto}
.topbar{background:var(--pf-black);color:#fff;font-size:.92rem}
.topbar-inner{display:flex;gap:1rem;justify-content:space-between;align-items:center;padding:.55rem 0;flex-wrap:wrap}
.topbar a{color:#fff;text-decoration:none}
.nav{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.96);backdrop-filter:blur(10px);box-shadow:0 2px 16px rgba(0,0,0,.08)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.8rem 0}
.brand{display:flex;align-items:center;gap:.8rem;text-decoration:none;font-weight:900;letter-spacing:.04em}
.brand img{width:72px}
.brand span small{display:block;color:var(--pf-muted);font-size:.74rem;font-weight:600;letter-spacing:.02em}
.nav-links{display:flex;gap:1rem;align-items:center}
.nav-links a{text-decoration:none;font-weight:700;font-size:.95rem}
.nav-actions{display:flex;gap:.6rem;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;border-radius:999px;padding:.82rem 1.1rem;font-weight:800;text-decoration:none;border:2px solid transparent;cursor:pointer}
.btn-primary{background:var(--pf-red);color:#fff;border-color:var(--pf-red)}
.btn-primary:hover{background:var(--pf-red-dark)}
.btn-secondary{background:#fff;color:var(--pf-black);border-color:#ddd}
.btn-dark{background:var(--pf-black);color:#fff;border-color:var(--pf-black)}
.hero{position:relative;overflow:hidden;background:linear-gradient(90deg,rgba(255,255,255,.96),rgba(255,255,255,.88)),url('/assets/img/plumbfit-contractors-flyer.jpeg') center/cover no-repeat}
.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(130deg,rgba(214,0,0,.10),rgba(0,0,0,.06));pointer-events:none}
.hero-grid{position:relative;display:grid;grid-template-columns:1.1fr .9fr;gap:2rem;align-items:center;min-height:610px;padding:4rem 0}
.eyebrow{display:inline-flex;background:#fff;border-left:6px solid var(--pf-red);box-shadow:0 10px 30px rgba(0,0,0,.08);padding:.55rem .85rem;font-weight:900;text-transform:uppercase;letter-spacing:.08em}
h1{font-size:clamp(2.4rem,5vw,5rem);line-height:.98;margin:1rem 0;color:var(--pf-black);letter-spacing:-.05em}
.lead{font-size:clamp(1.05rem,2vw,1.28rem);max-width:700px;color:#303030}
.hero-actions{display:flex;gap:.8rem;flex-wrap:wrap;margin:1.4rem 0}
.service-pills{display:flex;gap:.5rem;flex-wrap:wrap}
.service-pills span{background:var(--pf-black);color:#fff;border-radius:999px;padding:.45rem .75rem;font-weight:800;font-size:.88rem}
.hero-card{background:#fff;border-radius:24px;box-shadow:var(--pf-shadow);padding:1.4rem;border:1px solid var(--pf-border)}
.hero-card img{border-radius:18px}
.quick-card{margin-top:1rem;background:var(--pf-red);color:#fff;border-radius:18px;padding:1rem}
.quick-card strong{display:block;font-size:1.4rem}
section{padding:4rem 0}
.section-title{display:flex;align-items:end;justify-content:space-between;gap:1rem;margin-bottom:1.5rem}
.section-title h2{font-size:clamp(2rem,4vw,3.3rem);line-height:1;margin:0}
.section-title p{max-width:620px;color:var(--pf-muted);font-size:1.05rem}
.services{background:var(--pf-grey)}
.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.service-card{background:#fff;border:1px solid var(--pf-border);border-radius:20px;padding:1.25rem;box-shadow:0 10px 28px rgba(0,0,0,.06)}
.service-card b{display:flex;gap:.5rem;align-items:center;font-size:1.08rem}
.tick{background:var(--pf-red);color:#fff;border-radius:8px;width:28px;height:28px;display:inline-flex;align-items:center;justify-content:center;font-weight:900}
.band{background:var(--pf-red);color:#fff}
.band-grid{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:center}
.band .btn-secondary{border-color:#fff}
.sister-box{background:#fff;color:#111;border-radius:22px;padding:1.5rem}
.process-grid,.trust-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.process,.trust{border:1px solid var(--pf-border);border-radius:18px;padding:1rem;background:#fff}
.process strong{display:inline-flex;background:var(--pf-black);color:#fff;width:36px;height:36px;border-radius:50%;align-items:center;justify-content:center;margin-bottom:.8rem}
.contact{background:#111;color:#fff}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:2rem}
.contact-card{background:#fff;color:#111;border-radius:24px;padding:1.5rem}
.contact-form{display:grid;gap:.8rem}
.input,textarea,select{width:100%;border:1px solid #ddd;border-radius:12px;padding:.85rem;font:inherit}
textarea{min-height:120px}
.footer{background:#050505;color:#fff;padding:1.4rem 0}
.footer-inner{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.footer a{color:#fff}
.ecard{min-height:100vh;background:linear-gradient(140deg,#111,#2a0000);display:grid;place-items:center;padding:2rem}
.ecard-card{width:min(520px,94vw);background:#fff;border-radius:28px;box-shadow:var(--pf-shadow);padding:2rem;text-align:center}
.ecard-card .logo{width:300px;margin:auto}
.ecard-actions{display:grid;gap:.7rem;margin:1.3rem 0}
.qr{width:180px;margin:1rem auto;border:1px solid #eee;border-radius:14px;padding:.5rem}
.legal-page{padding:3rem 0}
.legal-page h1{font-size:2.5rem;letter-spacing:-.02em}



/* Header menu compact fix */
.site-nav {
    gap: 18px;
}

.site-nav a {
    font-size: 10px;
    line-height: 1.2;
    padding: 6px 4px;
    white-space: nowrap;
}

.header-actions .btn,
.nav-actions .btn {
    font-size: 10px;
    padding: 10px 18px;
}

.brand-text h1,
.brand-title {
    font-size: 22px;
    line-height: 1.1;
}

.brand-text p,
.brand-tagline {
    font-size: 13px;
    line-height: 1.3;
}

/* Better tablet handling */
@media (max-width: 1100px) {
    .site-nav {
        gap: 12px;
    }

    .site-nav a {
        font-size: 14px;
    }

    .header-actions .btn,
    .nav-actions .btn {
        font-size: 14px;
        padding: 9px 14px;
    }
}
@media(max-width:900px){
 .nav-inner{align-items:flex-start;flex-direction:column}
 .nav-links{display:none}
 .hero-grid,.band-grid,.contact-grid{grid-template-columns:1fr}
 .service-grid{grid-template-columns:1fr 1fr}
 .process-grid,.trust-grid{grid-template-columns:1fr 1fr}
 .hero-grid{min-height:auto;padding:3rem 0}
}
@media(max-width:600px){
 .service-grid,.process-grid,.trust-grid{grid-template-columns:1fr}
 .topbar-inner{display:block}
 .brand img{width:58px}
 .btn{width:100%}
 .hero-actions,.nav-actions{width:100%}
}