/* WordPress-specific additions. The main design is untouched in style.css. */

/* The original header sat inside a plain wrapper div, which stopped position:sticky from working. */
#site-header{display:contents;}

.screen-reader-text{border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;word-wrap:normal!important;}
.admin-bar .site-header{top:32px;}
@media(max-width:782px){.admin-bar .site-header{top:46px;}}

/* ---------------- Single service page ---------------- */
.service-single{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:44px;align-items:start;}
.service-single-media img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:var(--r-lg);box-shadow:var(--shadow-md);}
.service-single-head{display:flex;align-items:center;gap:18px;margin:34px 0 14px;}
.service-single-head .service-ico-lg{width:64px;height:64px;border-radius:18px;background:var(--grad-brand-soft);display:flex;align-items:center;justify-content:center;flex:none;}
.service-single-head .service-ico-lg svg{width:30px;height:30px;color:var(--primary);}
.service-single-head .section-title{margin:0;}
.service-lead{font-size:1.1rem;color:var(--ink-soft);margin-bottom:6px;}
.service-points{margin:22px 0 8px;padding:22px 24px;background:var(--bg-soft);border:1px solid var(--border);border-radius:var(--r-md);}

.entry-content{color:var(--ink-soft);}
.entry-content h2{margin:38px 0 14px;font-size:1.45rem;}
.entry-content h3{margin:26px 0 10px;font-size:1.15rem;}
.entry-content p{margin-bottom:18px;}
.entry-content ul,.entry-content ol{margin:0 0 22px 22px;padding-left:12px;}
.entry-content ul{list-style:disc;}
.entry-content ol{list-style:decimal;}
.entry-content li{margin-bottom:10px;padding-left:4px;}
.entry-content li::marker{color:var(--primary);font-weight:600;}
.entry-content a{color:var(--primary);text-decoration:underline;text-underline-offset:2px;}
.entry-content img{max-width:100%;height:auto;border-radius:var(--r-md);}
.entry-content blockquote{border-left:4px solid var(--primary);background:var(--bg-soft);padding:16px 22px;border-radius:0 var(--r-md) var(--r-md) 0;margin:0 0 20px;}
.entry-content .alignleft{float:left;margin:0 20px 14px 0;}
.entry-content .alignright{float:right;margin:0 0 14px 20px;}
.entry-content .aligncenter{display:block;margin:0 auto 18px;}
.article-body.entry-content img{height:auto;}

.service-faq{margin-top:46px;}
.service-faq h2{margin-bottom:20px;font-size:1.45rem;}
.service-faq .faq-list{max-width:none;}
.service-note{margin-top:34px;padding:16px 20px;border-radius:var(--r-md);background:var(--bg-tint);color:var(--muted);font-size:.88rem;}

.service-side{position:sticky;top:calc(var(--header-h) + 24px);display:flex;flex-direction:column;gap:22px;}
.side-card{background:var(--white);border:1px solid var(--border);border-radius:var(--r-lg);padding:26px;box-shadow:var(--shadow-sm);}
.side-card h3{font-size:1.1rem;margin-bottom:10px;color:var(--secondary-dark);}
.side-card p{color:var(--muted);font-size:.92rem;margin-bottom:16px;}
.side-book{background:var(--grad-brand-soft);}
.side-book .btn{margin-top:10px;}
.side-list{display:flex;flex-direction:column;max-height:420px;overflow:auto;margin-top:6px;}
.side-list a{display:block;padding:10px 12px;border-radius:var(--r-sm);font-size:.92rem;color:var(--ink-soft);transition:background .2s ease,color .2s ease;}
.side-list a:hover,.side-list a.active{background:var(--bg-tint);color:var(--primary);}
.side-list a.active{font-weight:600;}
@media(max-width:980px){
  .service-single{grid-template-columns:1fr;}
  .service-side{position:static;}
}
@media(max-width:560px){
  .service-single-head{flex-direction:column;align-items:flex-start;}
  .service-points{padding:18px;}
}

/* ---------------- Google reviews section ---------------- */
.reviews-wrap{max-width:1100px;margin:0 auto;}
.reviews-widget{margin-bottom:20px;}
.reviews-fallback{text-align:center;background:var(--white);border:1px solid var(--border);border-radius:var(--r-lg);padding:44px 24px;box-shadow:var(--shadow-sm);}
.reviews-fallback .rating-stars{display:flex;justify-content:center;gap:4px;margin-bottom:14px;}
.reviews-fallback .rating-stars svg{width:22px;height:22px;color:#F5A623;}
.reviews-fallback h3{margin-bottom:8px;}
.reviews-fallback p{color:var(--muted);margin-bottom:20px;}

/* ---------------- Blog pagination ---------------- */
.du-pagination{margin-top:44px;text-align:center;}
.du-pagination .nav-links{display:inline-flex;gap:8px;flex-wrap:wrap;justify-content:center;}
.du-pagination .page-numbers{min-width:42px;height:42px;padding:0 14px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--border);border-radius:var(--r-pill);font-weight:500;color:var(--ink-soft);}
.du-pagination .page-numbers.current,.du-pagination .page-numbers:hover{background:var(--primary);border-color:var(--primary);color:#fff;}

/* ---------------- Hyperlinks inside text show in the brand green ---------------- */
/* The theme resets every <a> to inherit the text colour, so links added in the editor looked like plain text. */
.entry-content a:not(.btn),
.article-body a:not(.btn),
.faq-a-inner a,
.section-sub a,
.service-lead a,
.service-note a,
.side-card p a{
  color:var(--primary);
  text-decoration:underline;
  text-underline-offset:2px;
  text-decoration-thickness:1px;
  transition:color .2s ease;
}
.entry-content a:not(.btn):hover,
.article-body a:not(.btn):hover,
.faq-a-inner a:hover,
.section-sub a:hover,
.service-lead a:hover,
.service-note a:hover,
.side-card p a:hover{
  color:var(--primary-dark);
}

/* ---------------- Hero: one slim proof line instead of the 4-number grid (the full numbers live in the About section) ---------------- */
.hero-proof{display:flex;flex-wrap:wrap;align-items:center;gap:10px 22px;font-size:.9rem;color:rgba(255,255,255,.78);}
.hero-proof-item{display:inline-flex;align-items:center;gap:7px;}
.hero-proof-item strong{color:#fff;font-family:var(--font-display);font-size:1.05rem;}
.hero-proof-item svg{width:16px;height:16px;color:#F5C451;}
.hero-proof-item + .hero-proof-item{padding-left:22px;border-left:1px solid rgba(255,255,255,.25);}
@media(max-width:900px){.hero-proof{justify-content:center;}}
@media(max-width:380px){.hero-proof-item + .hero-proof-item{padding-left:0;border-left:0;}}
.hero-cta{margin-bottom:30px;}

/* ---------------- Areas We Serve ---------------- */
.area-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.area-card{display:flex;flex-direction:column;gap:6px;background:var(--white);border:1px solid var(--border);border-radius:var(--r-lg);padding:26px;box-shadow:var(--shadow-sm);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;}
.area-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-md);border-color:var(--primary-light);}
.area-pin{width:44px;height:44px;border-radius:12px;background:var(--bg-tint);display:flex;align-items:center;justify-content:center;margin-bottom:8px;}
.area-pin svg{width:22px;height:22px;color:var(--primary);}
.area-card h3{font-size:1.1rem;}
.area-card p{color:var(--muted);font-size:.92rem;margin:0 0 6px;}
@media(max-width:980px){.area-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:560px){.area-grid{grid-template-columns:1fr;}}
.area-h2{margin:38px 0 14px;font-size:1.45rem;}
.entry-content-p{color:var(--ink-soft);margin-bottom:16px;}
.area-focus{grid-template-columns:repeat(2,1fr);}
@media(max-width:640px){.area-focus{grid-template-columns:1fr;}}
.side-hours{color:var(--ink-soft);font-size:.9rem;padding:5px 0;border-bottom:1px dashed var(--border);}
.side-hours:last-child{border-bottom:0;}
.footer-areas{display:flex;flex-wrap:wrap;gap:6px 18px;align-items:center;padding:22px 0;margin-top:10px;border-top:1px solid rgba(255,255,255,.12);font-size:.85rem;}
.footer-areas strong{color:#fff;}
.footer-areas a{color:rgba(255,255,255,.7);}
.footer-areas a:hover{color:var(--primary-light);}
.side-hours span:last-child{color:var(--ink);font-weight:500;}

/* Blog post: the featured photo comes first, details (tag, title, meta) below it. */
.article-body img.article-cover{margin:0 0 26px;}

/* ---------------- Mobile hero: photo first, details below ---------------- */
@media(max-width:900px){
  .hero{padding:34px 0 70px;}
  .hero-grid{gap:30px;}
  .hero-grid .hero-media{order:-1;max-width:460px;width:100%;}
  .hero-card img{aspect-ratio:4/3;}
}

/* ---------------- Sticky header: no floating gap on phones ---------------- */
/* On screens up to 600px the WordPress admin bar scrolls away with the page, so the header must stick to the very top.
   (It was offset by 46px, which made the logo bar look like it was hanging in mid-air for logged-in admins.) */
@media(max-width:600px){ .admin-bar .site-header{top:0;} }
/* A little more solid so text never shows through behind the logo and menu button. */
.site-header::before{background:rgba(255,255,255,.98);}