/* =========================================================
   ProPlumb Pro Directory - Main Stylesheet
   ========================================================= */

@font-face {
  font-family: 'Gilroy';
  src: url('../fonts/Gilroy-Regular.woff2') format('woff2'), url('../fonts/Gilroy-Regular.woff') format('woff');
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Gilroy';
  src: url('../fonts/Gilroy-Medium.woff2') format('woff2'), url('../fonts/Gilroy-Medium.woff') format('woff');
  font-weight: 600; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Gilroy';
  src: url('../fonts/Gilroy-Bold.woff2') format('woff2'), url('../fonts/Gilroy-Bold.woff') format('woff');
  font-weight: 700; font-style: normal; font-display: swap;
}

:root{
  --blue:#0169eb;
  --blue-dark:#0552b5;
  --ink:#202731;
  --ink-soft:#374355;
  --bg-light:#f4f6f9;
  --border:#e7ecf2;
  --blue-tint:#d9ecff;
  --green:#01b062;
  --white:#fff;
  --radius:14px;
  --shadow: 0 10px 30px rgba(32,39,49,.08);
  --max: 1180px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;font-family:'Gilroy',Arial,sans-serif;color:var(--ink);background:var(--white);line-height:1.55;}
h1,h2,h3,h4{font-weight:700;line-height:1.2;margin:0 0 .5em;color:var(--ink);}
h1{font-size:clamp(28px,4vw,42px);}
h2{font-size:clamp(22px,3vw,30px);}
h3{font-size:19px;}
p{margin:0 0 1em;color:var(--ink-soft);}
a{color:var(--blue);text-decoration:none;}
a:hover{text-decoration:underline;}
ul{margin:0;padding:0;list-style:none;}
img{max-width:100%;display:block;}
.container{max-width:var(--max);margin:0 auto;padding:0 20px;}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:8px;background:var(--blue);color:#fff;padding:14px 26px;border-radius:999px;font-weight:700;font-size:16px;border:none;cursor:pointer;transition:.2s background;}
.btn:hover{background:var(--blue-dark);text-decoration:none;}
.btn-lg{padding:18px 36px;font-size:18px;}
.btn-outline{background:transparent;border:2px solid var(--blue);color:var(--blue);}
.pulse-dot{width:9px;height:9px;border-radius:50%;background:#4ade80;box-shadow:0 0 0 rgba(74,222,128,.6);animation:pulse 1.6s infinite;}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(74,222,128,.6);}70%{box-shadow:0 0 0 8px rgba(74,222,128,0);}100%{box-shadow:0 0 0 0 rgba(74,222,128,0);}}

/* Top bar + header */
.top-bar{background:var(--ink);color:#cbd5e1;font-size:13px;}
.top-bar-inner{display:flex;justify-content:space-between;align-items:center;padding:7px 20px;}
.top-bar-phone{color:#fff;font-weight:700;}
.site-header{border-bottom:1px solid var(--border);position:sticky;top:0;background:#fff;z-index:50;}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;gap:20px;}
.logo-text{font-size:22px;font-weight:700;color:var(--ink);}
.logo-img{max-height:44px;}
.main-nav{display:flex;gap:26px;font-weight:600;}
.main-nav a{color:var(--ink-soft);}
.header-call{white-space:nowrap;}
@media (max-width:820px){.main-nav{display:none;}}

/* Hero */
.hero{background:linear-gradient(180deg,var(--blue-tint) 0%, #fff 100%);padding:56px 0 40px;}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:center;}
@media (max-width:900px){.hero-grid{grid-template-columns:1fr;}}
.hero-badges{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0 22px;}
.badge{background:#fff;border:1px solid var(--border);border-radius:999px;padding:8px 14px;font-size:13px;font-weight:600;display:flex;align-items:center;gap:6px;color:var(--ink-soft);}
.badge svg{flex-shrink:0;}
.badge.green svg{color:var(--green);}
.hero-badges{justify-content:flex-start;}
.hero-cta-row{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin-top:6px;}
.hero-rating{display:flex;align-items:center;gap:8px;margin-top:18px;font-weight:600;color:var(--ink-soft);font-size:14px;}
.stars{color:#f5a623;letter-spacing:2px;}
.hero-image-wrap{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);}
.hero-image-wrap img{width:100%;height:100%;object-fit:cover;}
.trust-strip{display:flex;flex-wrap:wrap;gap:24px;padding:18px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border);margin:26px 0;font-size:14px;font-weight:600;color:var(--ink-soft);justify-content:center;}
.trust-strip span{display:flex;align-items:center;gap:8px;}

/* Breadcrumbs */
.breadcrumbs{padding:14px 0;font-size:13px;color:var(--ink-soft);}
.breadcrumbs ol{display:flex;flex-wrap:wrap;gap:6px;}
.breadcrumbs li:not(:last-child)::after{content:"/";margin-left:6px;color:#aab4c0;}

/* Sections */
.section{padding:46px 0;}
.section-alt{background:var(--bg-light);}
.section-head{max-width:720px;margin-bottom:26px;}

/* Service grid / cards */
.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px;}
.card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:22px;transition:.2s transform,.2s box-shadow;}
.card:hover{transform:translateY(-3px);box-shadow:var(--shadow);}
.card h3 a{color:var(--ink);}
.card .price-tag{display:inline-block;margin-top:8px;font-size:13px;font-weight:700;color:var(--blue);background:var(--blue-tint);padding:4px 10px;border-radius:999px;}

/* Why choose list */
.why-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;margin-top:20px;}
.why-item{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:20px;}
.why-item .icon{width:38px;height:38px;border-radius:10px;background:var(--blue-tint);color:var(--blue);display:flex;align-items:center;justify-content:center;font-weight:700;margin-bottom:10px;}

/* Cost table */
.cost-table{width:100%;border-collapse:collapse;background:#fff;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);}
.cost-table th,.cost-table td{padding:16px;text-align:left;border-bottom:1px solid var(--border);}
.cost-table th{background:var(--ink);color:#fff;}
.cost-table tr:last-child td{border-bottom:none;}
.factor-list li{padding:10px 0 10px 26px;position:relative;border-bottom:1px dashed var(--border);color:var(--ink-soft);}
.factor-list li::before{content:"✓";position:absolute;left:0;color:var(--green);font-weight:700;}

/* FAQ accordion */
.faq-item{border:1px solid var(--border);border-radius:12px;margin-bottom:12px;overflow:hidden;}
.faq-q{width:100%;text-align:left;background:#fff;border:none;padding:18px 20px;font-weight:700;font-size:16px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;color:var(--ink);}
.faq-a{padding:0 20px;max-height:0;overflow:hidden;transition:.25s ease;color:var(--ink-soft);}
.faq-item.open .faq-a{padding:0 20px 18px;max-height:400px;}
.faq-item.open .faq-q .chevron{transform:rotate(180deg);}
.chevron{transition:.2s transform;}

/* Testimonials */
.testimonial-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:22px;}
.testimonial-stars{color:#f5a623;margin-bottom:8px;}
.testimonial-name{font-weight:700;margin-top:10px;color:var(--ink);}

/* Location link grids */
.loc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px 20px;}
.loc-grid a{color:var(--ink-soft);font-weight:600;}
.state-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px;}
.state-card{background:#fff;border:1px solid var(--border);border-radius:12px;padding:16px;font-weight:700;}
.state-card small{display:block;color:var(--ink-soft);font-weight:500;margin-top:4px;}

/* CTA band */
.cta-band{background:var(--ink);color:#fff;border-radius:var(--radius);padding:40px;text-align:center;}
.cta-band h2{color:#fff;}
.cta-band p{color:#cbd5e1;}

/* Disclaimer */
.footer-disclaimer{border-top:1px solid #333d4d;margin-top:24px;padding-top:20px;}
.footer-disclaimer p{font-size:12px;color:#8391a4;line-height:1.6;margin:0 0 10px;}

/* Footer */
.footer-locations{background:var(--bg-light);padding:40px 0;border-top:1px solid var(--border);}
.footer-loc-block{margin-bottom:26px;}
.footer-loc-block h3{font-size:16px;margin-bottom:14px;}
.footer-link-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:8px 20px;}
.footer-link-grid a{color:var(--ink-soft);font-size:14px;}
.site-footer{background:var(--ink);color:#cbd5e1;padding:44px 0 18px;}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1.2fr;gap:30px;}
@media (max-width:820px){.footer-grid{grid-template-columns:1fr 1fr;}}
.footer-col h4{color:#fff;font-size:14px;text-transform:uppercase;letter-spacing:.06em;margin-bottom:14px;}
.footer-col a{color:#cbd5e1;}
.footer-col ul li{margin-bottom:8px;}
.footer-brand p{color:#94a3b8;font-size:14px;}
.footer-eeat{font-size:13px;color:#94a3b8;}
.footer-hours{font-size:13px;margin-top:10px;color:#94a3b8;}
.footer-bottom{border-top:1px solid #333d4d;margin-top:30px;padding-top:18px;font-size:12px;color:#fff;}
.footer-bottom p{color:#fff;margin:0;}

/* Sticky mobile call bar */
.mobile-call-bar{display:none;}
@media (max-width:720px){
  .mobile-call-bar{display:flex;position:fixed;bottom:0;left:0;right:0;background:var(--blue);z-index:100;padding:12px 16px;justify-content:center;align-items:center;gap:8px;font-weight:700;color:#fff;box-shadow:0 -4px 16px rgba(0,0,0,.15);}
  .mobile-call-bar a{color:#fff;}
  body{padding-bottom:58px;}
}

/* Admin-adjacent utility (front-end forms like contact) */
.form-grid{display:grid;gap:14px;max-width:560px;}
.form-grid input,.form-grid textarea{padding:12px 14px;border:1px solid var(--border);border-radius:10px;font-family:inherit;font-size:15px;}

/* two column content layout */
.two-col{display:grid;grid-template-columns:2fr 1fr;gap:40px;}
@media (max-width:900px){.two-col{grid-template-columns:1fr;}}
.side-box{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:22px;margin-bottom:20px;}
.side-box h4{font-size:15px;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-soft);}
