/* BBB Lawn Care Modern Theme (Redesign 2025)
   Layered, marketing-focused, performance-conscious.
*/
:root {
  --color-bg: #0f1e12;
  --color-surface: #16281a;
  --color-surface-alt: #1e3523;
  --color-elevated: #23402a;
  --color-primary: #2e7d32;
  --color-primary-accent: #48b14e;
  --color-primary-soft: #3d9a43;
  --color-secondary: #ffc107;
  --color-text: #e4f5e6;
  --color-text-soft: #b8d3bc;
  --color-border: #2e4a35;
  --color-gradient-start: #0d1a11;
  --color-gradient-end: #21472b;
  --radius-xs: 4px;
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-full: 999px;
  --shadow-sm: 0 2px 4px -1px rgba(0,0,0,.4), 0 1px 2px rgba(0,0,0,.3);
  --shadow-md: 0 4px 16px -2px rgba(0,0,0,.45),0 2px 6px -1px rgba(0,0,0,.3);
  --shadow-lg: 0 10px 32px -4px rgba(0,0,0,.55),0 4px 12px -2px rgba(0,0,0,.4);
  --shadow-focus: 0 0 0 3px rgba(72,177,78,.35);
  --font-stack: 'Inter', 'Arial', system-ui, sans-serif;
  --font-display: 'Poppins', var(--font-stack);
  --transition-fast: .18s cubic-bezier(.4,.0,.2,1);
  --transition-med: .35s cubic-bezier(.4,.0,.2,1);
  --max-width: 1180px;
  --hero-height: min(92vh, 860px);
}

/******************** Base ********************/ 
html {scroll-behavior:smooth; font-size: 16px;}
body.modern-site {margin:0; font-family:var(--font-stack); background:linear-gradient(145deg,var(--color-gradient-start),var(--color-gradient-end)); color:var(--color-text); -webkit-font-smoothing:antialiased;}
body.modern-site * {box-sizing:border-box;}

/* Accessibility / Contrast Helpers */
.dark-bg {color:var(--color-text);}
.dark-bg h1,.dark-bg h2,.dark-bg h3,.dark-bg h4,.dark-bg h5,.dark-bg h6 {color:#fff;}
.dark-bg p,.dark-bg li,.dark-bg .section-sub {color:var(--color-text-soft);}
.contrast-high {color:#fff !important;}
.contrast-soft {color:var(--color-text-soft) !important;}
.footer-payment-note {margin-top:1rem; font-size:.75rem; color:var(--color-text-soft); max-width:240px; line-height:1.3;}
.skip-link {position:absolute; left:-10000px; top:auto; width:1px; height:1px; overflow:hidden;}
.skip-link:focus {left:50%; top:0; transform:translateX(-50%); background:var(--color-primary); color:#fff; padding:.75rem 1rem; border-radius:0 0 6px 6px; z-index:2000; box-shadow:var(--shadow-md);} 

/******************** Legacy Button Overrides (Unify Style) ********************/
.btn,
.btn-primary,
.btn-secondary,
.btn-outline,
.btn-nav,
.footer-cta-btn {position:relative; display:inline-flex; align-items:center; justify-content:center; gap:.55rem; font-weight:600; letter-spacing:.5px; font-size:.9rem; text-transform:uppercase; border-radius:var(--radius-full); padding:.9rem 1.35rem; line-height:1; cursor:pointer; text-decoration:none; border:0; background:linear-gradient(90deg,var(--color-primary),var(--color-primary-soft)); color:#fff; box-shadow:var(--shadow-sm); transition:box-shadow var(--transition-fast), transform var(--transition-fast), background var(--transition-fast);} 
.btn-primary {background:linear-gradient(90deg,var(--color-primary),var(--color-primary-soft)); color:#fff;}
.btn-secondary {background:linear-gradient(90deg,var(--color-primary-soft),var(--color-primary-accent)); color:#fff;}
.btn-outline {background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.25); color:var(--color-text);} 
.btn-outline:hover {background:rgba(255,255,255,.15);} 
.btn:hover,.btn-primary:hover,.btn-secondary:hover,.btn-nav:hover,.footer-cta-btn:hover {transform:translateY(-4px); box-shadow:var(--shadow-lg);} 
.btn:focus-visible,.btn-primary:focus-visible,.btn-secondary:focus-visible,.btn-outline:focus-visible,.btn-nav:focus-visible,.footer-cta-btn:focus-visible {outline:2px solid var(--color-primary-accent); outline-offset:2px; box-shadow:var(--shadow-focus);} 
.btn:active,.btn-primary:active,.btn-secondary:active,.btn-outline:active,.btn-nav:active,.footer-cta-btn:active {transform:translateY(-1px); box-shadow:var(--shadow-md);} 
.btn.disabled,.btn[disabled],.btn-primary[disabled],.btn-secondary[disabled] {opacity:.55; cursor:not-allowed; transform:none; box-shadow:none;} 

/* CTA contextual enhancements */
.cta-buttons .btn-primary,
.cta-buttons .btn-secondary,
.banner-cta .btn-modern,
.hero-modern .btn-modern {color:#f7fff9; text-shadow:0 2px 4px rgba(0,0,0,.45);} 

/******************** Dark Background Section Text Contrast ********************/
/* Force heading/body color in image-overlay sections originally defined in legacy CSS */
.services-overview-bg h2,
.services-overview-bg .section-sub,
.detailed-services-bg h2,
.detailed-services-bg .section-sub,
.service-areas-bg h2,
.service-areas-bg .section-sub,
.cta-section-bg h2,
.cta-section-bg p,
.contact-form-section-bg h2,
.contact-form-section-bg p,
.faq-section-bg h2,
.faq-section-bg p,
.story-section-bg h2,
.story-section-bg p,
.why-choose-bg h2,
.why-choose-bg p {color:#fff !important; text-shadow:0 2px 6px rgba(0,0,0,.5);} 

.services-overview-bg p.section-subtitle,
.service-areas-bg p.section-subtitle,
.detailed-services-bg p.section-subtitle {color:var(--color-text-soft) !important;}

/* Anchor contrast inside dark overlay sections */
.services-overview-bg a,
.detailed-services-bg a,
.service-areas-bg a,
.cta-section-bg a,
.contact-form-section-bg a,
.faq-section-bg a,
.story-section-bg a,
.why-choose-bg a {color:var(--color-primary-accent);}
.services-overview-bg a:hover,
.detailed-services-bg a:hover,
.service-areas-bg a:hover,
.cta-section-bg a:hover,
.contact-form-section-bg a:hover,
.faq-section-bg a:hover,
.story-section-bg a:hover,
.why-choose-bg a:hover {color:#fff;}

/* Glass effect cards inside dark backgrounds inherit readable text */
.glass-effect h1,.glass-effect h2,.glass-effect h3,.glass-effect h4,.glass-effect h5,.glass-effect h6 {color:#fff;}
.glass-effect p,.glass-effect li {color:var(--color-text-soft);} 

img {max-width:100%; display:block;}

/* Inline style migration utilities */
.min-h-360 {min-height:360px!important;}
.min-h-380 {min-height:380px!important;}
.min-h-420 {min-height:420px!important;}
.min-h-480 {min-height:480px!important;}
.min-h-520 {min-height:520px!important;}
.bg-cover-center {background-position:center!important; background-size:cover!important;}
.filter-bright-55 {filter:brightness(.55)!important;}
.filter-bright-6 {filter:brightness(.6)!important;}
.filter-bright-62 {filter:brightness(.62)!important;}
.hero-title-tight {font-size:clamp(2.2rem,5vw,3.4rem)!important;}
.hero-title-privacy {font-size:clamp(2.1rem,4.6vw,3.2rem)!important;}
.hero-title-terms {font-size:clamp(2.1rem,4.6vw,3.1rem)!important;}
.m-0 {margin:0!important;}
.mt-0 {margin-top:0!important;}
.mt-09 {margin-top:.9rem!important;}
.mt-1 {margin-top:1rem!important;}
.mt-2rem {margin-top:2rem!important;}
.p-0 {padding:0!important;}
.p-1-25 {padding:1.25rem!important;}
.border-left-accent {border-left:4px solid #2E7D32!important;}
.noindex-note {font-size:.75rem!important; color:var(--color-text-soft)!important;}
.subtitle-small {font-size:.8rem!important;}
.subtitle-xs {font-size:.75rem!important;}
.text-95 {font-size:.95rem!important; color:var(--color-text-soft)!important;}
.note-xs {font-size:.75rem!important; color:var(--color-text-soft)!important; margin:0!important;}
.note-sm {font-size:.8rem!important; color:var(--color-text-soft)!important;}
.flex-row-gap {display:flex!important; gap:1rem!important; flex-wrap:wrap!important;}
.grid-auto-fit-260 {display:grid!important; grid-template-columns:repeat(auto-fit,minmax(260px,1fr))!important; gap:1rem!important;}
.grid-auto-fit-280 {display:grid!important; grid-template-columns:repeat(auto-fit,minmax(280px,1fr))!important; gap:1.1rem!important;}
.grid-auto-fit-240 {display:grid!important; grid-template-columns:repeat(auto-fit,minmax(240px,1fr))!important; gap:1rem!important;}
.gradient-green-80 {background: linear-gradient(rgba(46, 125, 50, 0.8), rgba(46, 125, 50, 0.8));}
.gradient-green-70 {background: linear-gradient(rgba(46, 125, 50, 0.7), rgba(46, 125, 50, 0.7));}
.gradient-black-40 {background: linear-gradient(rgba(0,0,0,0.4), rgba(0,0,0,0.4));}
.gradient-black-60 {background: linear-gradient(rgba(0,0,0,0.6), rgba(0,0,0,0.6));}
.gradient-angle-135-a {background:linear-gradient(135deg,#1a2e1f,#213d28)!important;}
.gradient-angle-135-b {background:linear-gradient(135deg,#1a2d1e,#203a27)!important;}
.gradient-angle-135-c {background:linear-gradient(135deg,#1a3020,#233f29)!important;}
.gradient-angle-135-d {background:linear-gradient(135deg,#1a2f1f,#203b27)!important;}
.gradient-angle-135-e {background:linear-gradient(135deg,#1b2f20,#223d29)!important;}
.gradient-angle-145-f {background:linear-gradient(145deg,#182a1d,#1f3b28)!important;}
.gradient-angle-135-g {background:linear-gradient(135deg,#192e1f,#203a27)!important;}
.gradient-angle-135-h {background:linear-gradient(135deg,#1a3020,#233f29)!important;}
.gradient-angle-135-i {background:linear-gradient(135deg,#1a2e1f,#223c28)!important;}
.note-soft {color:var(--color-text-soft)!important; font-size:.85rem!important;}
.link-accent {color:var(--color-primary-accent)!important;}
.list-standard {margin:0!important; padding-left:1.1rem!important; font-size:.95rem!important; line-height:1.55!important; color:var(--color-text-soft)!important;}
.hero-bg-privacy {background:url('../images/gallery/precision-lawn-edging-trimming-4.jpg') center/cover no-repeat!important;}
.hero-bg-terms {background:url('../images/gallery/lawn-care-transformation-before-after-2.jpg') center/cover no-repeat!important;}
.bg-img-lawn-transform {background:url('../images/gallery/lawn-care-transformation-before-after-2.jpg') center/cover no-repeat!important;}
.bg-img-weekly-mowing {background:url('../images/gallery/lawn-care-service-north-fort-worth-weekly-mowing-1.jpg') center/cover no-repeat!important;}
.bg-img-landscape-design {background:url('../images/gallery/landscape-design-installation-north-texas-3.jpg') center/cover no-repeat!important;}
.bg-img-precision-edging {background:url('../images/gallery/precision-lawn-edging-trimming-4.jpg') center/cover no-repeat!important;}
.bg-img-seasonal-cleanup {background:url('../images/gallery/seasonal-lawn-cleanup-fall-spring-5.jpg') center/cover no-repeat!important;}
.bg-img-healthy-lawn {background:url('../images/gallery/healthy-green-lawn-maintenance-results-7.jpg') center/cover no-repeat!important;}
.mt-2-5 {margin-top:2.5rem!important;}
.max-w-640 {max-width:640px!important;}
.main-404 {min-height:60vh;display:flex;align-items:center;justify-content:center;padding:2rem;flex-direction:column;text-align:center;}
.heading-clamp-large {font-size:clamp(2.2rem,5vw,3.4rem)!important; margin-bottom:1rem!important;}
.description-max-640 {max-width:640px!important; margin:0 auto 1.5rem!important;}
.btn-row-center {display:flex!important; gap:1rem!important; flex-wrap:wrap!important; justify-content:center!important;}

/******************** Layout Utilities ********************/ 
.container-modern {width:100%; margin:0 auto; max-width:var(--max-width); padding:0 1.25rem;}
.stack-lg {display:flex; flex-direction:column; gap:3.5rem;}
.stack-md {display:flex; flex-direction:column; gap:2rem;}
.stack-sm {display:flex; flex-direction:column; gap:1rem;}
.flex {display:flex;} .flex-center {display:flex;align-items:center;justify-content:center;}
.grid {display:grid; gap:1.5rem;}

/******************** Navigation ********************/ 
.nav-modern {position:fixed; inset:0 auto auto 0; width:100%; height:70px; display:flex; align-items:center; z-index:1000; backdrop-filter:saturate(160%) blur(14px); background:rgba(15,30,18,0.72); border-bottom:1px solid rgba(255,255,255,.06);}
.nav-modern .nav-inner {display:flex; align-items:center; justify-content:space-between; width:100%; max-width:var(--max-width); margin:0 auto; padding:0 1.25rem;}
.nav-brand {display:flex; align-items:center; gap:.65rem; font-weight:600; letter-spacing:.5px; font-size:1.05rem; color:var(--color-text); text-decoration:none;}
.nav-brand img {height:40px; width:auto; filter:drop-shadow(0 4px 6px rgba(0,0,0,.4));}
.nav-links {list-style:none; display:flex; gap:.35rem; margin:0; padding:0;}
.nav-links a {--hover-bg:rgba(255,255,255,0.06); position:relative; display:inline-flex; align-items:center; padding:.65rem 1rem; border-radius:var(--radius-full); font-size:.8rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--color-text-soft); text-decoration:none; transition:background var(--transition-fast), color var(--transition-fast), transform var(--transition-fast);} 
.nav-links a:hover,.nav-links a:focus {background:var(--hover-bg); color:var(--color-text); outline:none;}
.nav-links a.cta {background:linear-gradient(90deg,var(--color-primary) 0%, var(--color-primary-soft) 60%, var(--color-primary-accent) 100%); color:#fff; box-shadow:var(--shadow-sm); padding:.7rem 1.25rem;}
.nav-links a.cta:hover {transform:translateY(-3px); box-shadow:var(--shadow-md);} 

/******************** Hero ********************/ 
.hero-modern {position:relative; min-height:var(--hero-height); display:flex; align-items:stretch; isolation:isolate;}
.hero-bg-layer {position:absolute; inset:0; overflow:hidden; border-bottom-left-radius: clamp(40px,8vw,140px);}
.hero-bg-layer::after {content:''; position:absolute; inset:0; background:linear-gradient(65deg,rgba(15,30,18,.9),rgba(15,30,18,.4) 48%, rgba(15,30,18,.15));}
.hero-slide {position:absolute; inset:0; background-size:cover; background-position:center; opacity:0; transform:scale(1.06); transition: opacity 1.2s ease, transform 7s linear; filter:brightness(.9) saturate(1.2);}
.hero-slide.active {opacity:1; transform:scale(1);} 
.hero-content-wrap {position:relative; z-index:2; flex:1; display:flex; align-items:center;}
.hero-content-inner {padding:6.5rem 0 4rem; width:100%;}
.hero-eyebrow {font-size:.75rem; letter-spacing:.35em; font-weight:600; text-transform:uppercase; color:var(--color-primary-accent); opacity:.85; margin-bottom:1.5rem; display:inline-block;}
.hero-title {font-family:var(--font-display); font-size:clamp(2.4rem,5.4vw,4.2rem); line-height:1.05; margin:0 0 1.2rem; background:linear-gradient(90deg,#fff,var(--color-primary-accent) 70%); -webkit-background-clip:text; background-clip:text; color:transparent;}
.hero-sub {max-width:640px; font-size:1.05rem; line-height:1.55; color:var(--color-text-soft); margin:0 0 2.2rem;}
.badge-row {display:flex; flex-wrap:wrap; gap:.65rem; margin:0 0 2rem;}
.badge {--badge-bg:rgba(255,255,255,.08); --badge-border:rgba(255,255,255,.15); display:inline-flex; align-items:center; gap:.5rem; padding:.55rem .9rem; background:var(--badge-bg); border:1px solid var(--badge-border); border-radius:var(--radius-full); font-size:.7rem; letter-spacing:.08em; font-weight:600; text-transform:uppercase; backdrop-filter:blur(6px) saturate(160%);}
.badge i {color:var(--color-primary-accent);} 
.hero-cta-row {display:flex; gap:1rem; flex-wrap:wrap;}
.btn-modern {--btn-bg:var(--color-primary); --btn-bg-alt:var(--color-primary-soft); position:relative; display:inline-flex; align-items:center; gap:.65rem; padding:.95rem 1.5rem; font-weight:600; letter-spacing:.5px; font-size:.95rem; border-radius:var(--radius-full); background:linear-gradient(90deg,var(--btn-bg),var(--btn-bg-alt)); color:#fff; text-decoration:none; box-shadow:var(--shadow-sm); transition:box-shadow var(--transition-fast), transform var(--transition-fast);} 
.btn-modern:hover {transform:translateY(-4px); box-shadow:var(--shadow-lg);} 
.btn-outline {background:rgba(255,255,255,.08); color:var(--color-text); border:1px solid rgba(255,255,255,.25);}
.btn-outline:hover {background:rgba(255,255,255,.15);} 
.hero-metrics {display:flex; gap:2.5rem; margin-top:3rem; flex-wrap:wrap;}
.metric {display:flex; flex-direction:column; gap:.45rem; min-width:140px;}
.metric-value {font-size:2rem; font-weight:700; font-family:var(--font-display); background:linear-gradient(90deg,#fff,var(--color-primary-soft)); -webkit-background-clip:text; background-clip:text; color:transparent;}
.metric-label {font-size:.75rem; letter-spacing:.15em; font-weight:600; text-transform:uppercase; color:var(--color-text-soft);} 

/******************** Sections ********************/ 
.section {padding:5.5rem 0; position:relative;}
.section-header {margin:0 0 3.25rem; display:flex; flex-direction:column; gap:.9rem;}
.section-kicker {font-size:.65rem; letter-spacing:.28em; text-transform:uppercase; font-weight:600; color:var(--color-primary-accent);}
.section-title {font-size:clamp(2rem,3.5vw,3rem); font-family:var(--font-display); line-height:1.08; margin:0;}
.section-sub {max-width:720px; font-size:1.02rem; line-height:1.55; color:var(--color-text-soft);} 

/******************** Services Grid ********************/ 
.services-modern {display:grid; gap:1.2rem; grid-template-columns:repeat(auto-fill,minmax(240px,1fr));}
.service-card {position:relative; padding:1.1rem 1.15rem 1.25rem; background:linear-gradient(145deg,#1a2d1e,#223b28); border:1px solid #2e4a35; border-radius:var(--radius-lg); box-shadow:var(--shadow-sm); display:flex; flex-direction:column; gap:.75rem; overflow:hidden; isolation:isolate;}
.service-card::before {content:''; position:absolute; inset:0; background:radial-gradient(circle at 20% 15%,rgba(72,177,78,.15),transparent 60%); opacity:0; transition:opacity var(--transition-med);} 
.service-card:hover::before {opacity:1;}
.service-icon-wrap {width:52px; height:52px; border-radius:16px; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg,var(--color-primary),var(--color-primary-soft)); box-shadow:0 6px 14px -4px rgba(46,125,50,.65); font-size:1.5rem;}
.service-title {font-size:1.05rem; margin:0; font-weight:600; letter-spacing:.4px;}
.service-desc {font-size:.85rem; line-height:1.4; color:var(--color-text-soft); margin:0 0 .25rem; flex-grow:1;}
.service-price {font-size:.75rem; letter-spacing:.15em; text-transform:uppercase; font-weight:600; color:var(--color-primary-accent);} 
.service-cta {font-size:.7rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase; display:inline-flex; align-items:center; gap:.4rem; color:var(--color-text-soft); text-decoration:none; margin-top:.35rem;}
.service-cta i {font-size:.75rem; transition:transform var(--transition-fast);} 
.service-card:hover .service-cta i {transform:translateX(4px);} 

/******************** Gallery Mosaic ********************/ 
.mosaic-grid {--col:5; display:grid; gap:.55rem; grid-auto-rows:140px; grid-template-columns:repeat(var(--col),1fr);}
.mosaic-item {position:relative; border-radius:18px; overflow:hidden; background:#122017; box-shadow:var(--shadow-sm);}
.mosaic-item img {width:100%; height:100%; object-fit:cover; transition:transform 5s linear, filter .6s ease; filter:brightness(.9) saturate(1.15);} 
.mosaic-item:hover img {transform:scale(1.12); filter:brightness(1) saturate(1.25);} 
.mosaic-item.large {grid-row:span 2; grid-column:span 2;}
.mosaic-item.wide {grid-column:span 2;}
.mosaic-item.tall {grid-row:span 2;}

/******************** Reviews Slider (Progressive enhance) ********************/ 
.reviews-modern {position:relative;}
.review-track {display:flex; gap:1.25rem; overflow-x:auto; scroll-snap-type:x mandatory; padding:.25rem .25rem 1rem;}
.review-track::-webkit-scrollbar {height:10px;} 
.review-track::-webkit-scrollbar-thumb {background:#2e4a35; border-radius:6px;}
.review-card-modern {scroll-snap-align:start; flex:0 0 300px; background:linear-gradient(150deg,#182b1d,#213c28); border:1px solid #2d4934; border-radius:18px; padding:1.1rem 1rem 1.25rem; display:flex; flex-direction:column; gap:.65rem; position:relative; box-shadow:var(--shadow-sm);}
.review-card-modern .stars {font-size:.8rem; letter-spacing:2px; color:#ffb400;}
.review-card-modern p {font-size:.8rem; line-height:1.35rem; color:var(--color-text-soft); margin:0; flex-grow:1;}
.review-meta {display:flex; align-items:center; gap:.35rem; font-size:.6rem; letter-spacing:.15em; text-transform:uppercase; color:var(--color-primary-accent); font-weight:600;}

/******************** CTA Banner ********************/ 
.banner-cta {position:relative; padding:4.5rem 0; background:linear-gradient(120deg,#244b30,#1b3824); border-top:1px solid #31533c; border-bottom:1px solid #31533c; overflow:hidden;}
.banner-cta::before {content:''; position:absolute; inset:0; background:radial-gradient(circle at 25% 30%,rgba(255,255,255,.08),transparent 60%);} 
.banner-cta .inner {display:flex; flex-direction:column; gap:1.6rem; align-items:flex-start;}
.banner-cta h2 {margin:0; font-family:var(--font-display); font-size:clamp(2rem,3.2vw,3rem); line-height:1.1;}
.banner-cta p {margin:0; max-width:640px; color:var(--color-text-soft);} 

/******************** Footer tweaks (inherits existing) ********************/ 
.footer-modern-spacer {height:4rem;}

/******************** Responsive ********************/ 
@media (max-width:1040px){
  .hero-metrics {gap:1.5rem;}
  .mosaic-grid {--col:4; grid-auto-rows:120px;}
}
@media (max-width:820px){
  .hero-content-inner {padding:7rem 0 3rem;}
  .hero-modern {min-height:unset;}
  .mosaic-grid {--col:3; grid-auto-rows:110px;}
}
@media (max-width:620px){
  .nav-links {gap:.15rem;}
  .nav-links a {padding:.55rem .75rem; font-size:.65rem;}
  .hero-title {font-size:clamp(2rem,10vw,3.2rem);} 
  .hero-sub {font-size:.95rem;}
  .hero-metrics {margin-top:2.25rem;}
  .mosaic-grid {--col:2; grid-auto-rows:120px;}
  .service-card {padding:1rem;}
}

/******************** Contrast Enhancement Overrides ********************/
:root {--color-heading-bright:#f5fff6; --color-text-bright:#ecf9ee;}
.dark-bg h1,.dark-bg h2,.dark-bg h3,.dark-bg h4,.dark-bg h5,.dark-bg h6 {color:var(--color-heading-bright);}
.section-title {color:var(--color-heading-bright);}
/* Card / tile titles on darker or glass backgrounds */
.service-card .service-title,
.service-detail-card h3,
.service-detail-card h4,
.service-detail-card h5,
.service-detail-card h2,
.area-card-compact h4,
.feature-card-compact h4,
.story-card h3,
.faq-card-compact h4,
.contact-info-card h4,
.pricing-tier h5,
.pricing-card h5,
.service-category h5,
.service-detail-card .service-header h3 {color:var(--color-heading-bright)!important;}
/* Ensure smaller descriptive text remains legible but softer */
.service-card .service-desc,
.service-detail-card p,
.area-card-compact p,
.feature-card-compact p,
.story-card p,
.faq-card-compact p,
.contact-info-card span,
.pricing-tier > p,
.pricing-card > p {color:var(--color-text-soft)!important;}
/* Price / key figures pop slightly brighter */
.price-range,.price,.service-price,.pricing-tier .price,.pricing-card .price {color:var(--color-primary-accent)!important;}

/******************** Service Detail (Modern) ********************/
.service-detail-grid {display:grid; gap:1.2rem; grid-template-columns:repeat(auto-fill,minmax(300px,1fr));}
.service-detail-card {position:relative; display:flex; flex-direction:column; gap:1.1rem; padding:1.35rem 1.4rem 1.5rem; background:linear-gradient(150deg,#192b1d,#243c29); border:1px solid #2e4a35; border-radius:var(--radius-lg); box-shadow:var(--shadow-sm); overflow:hidden; isolation:isolate;}
.service-detail-card::before {content:''; position:absolute; inset:0; background:radial-gradient(circle at 18% 20%,rgba(72,177,78,.18),transparent 60%); opacity:0; transition:opacity var(--transition-med);} 
.service-detail-card:hover::before {opacity:1;}
.service-detail-card .service-header {display:flex; align-items:flex-start; gap:1rem;}
.service-detail-card .service-header .service-icon {width:58px; height:58px; display:flex; align-items:center; justify-content:center; font-size:1.9rem; border-radius:18px; background:linear-gradient(135deg,var(--color-primary),var(--color-primary-soft)); box-shadow:0 6px 14px -4px rgba(46,125,50,.65);} 
.service-detail-card h3 {margin:0 0 .35rem; font-size:1.15rem; font-family:var(--font-display);}
.service-detail-card p {margin:0; font-size:.85rem; line-height:1.45; color:var(--color-text-soft);}
.service-features {display:flex; flex-direction:column; gap:.75rem; margin-top:.5rem;}
.service-features ul {list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:.4rem;}
.service-features li {font-size:.78rem; letter-spacing:.05em; font-weight:600; text-transform:uppercase; color:var(--color-text-soft); display:flex; align-items:center; gap:.4rem;}
.service-features li::before {content:'+'; font-weight:700; color:var(--color-primary-accent);} 
.pricing-compact {display:flex; flex-direction:column; gap:.25rem; margin-top:.35rem;}
.price-range {font-size:.75rem; letter-spacing:.15em; text-transform:uppercase; font-weight:700; color:var(--color-primary-accent);} 
.frequency {font-size:.6rem; letter-spacing:.15em; text-transform:uppercase; font-weight:600; color:var(--color-text-soft);} 

/******************** Service Areas (Modern) ********************/
.area-grid-modern {display:grid; gap:1.1rem; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); margin-top:2rem;}
.area-card {position:relative; display:flex; flex-direction:column; gap:.55rem; padding:1rem 1.1rem 1.15rem; background:linear-gradient(145deg,#1b2f20,#203a27); border:1px solid #2e4a35; border-radius:var(--radius-lg); box-shadow:var(--shadow-sm);}
.area-card .area-icon {font-size:1.4rem; filter:drop-shadow(0 4px 6px rgba(0,0,0,.45));}
.area-card h4 {margin:.2rem 0 .25rem; font-size:1rem; font-weight:600; letter-spacing:.4px;}
.area-card p {margin:0; font-size:.75rem; line-height:1.35; color:var(--color-text-soft);} 
.area-card .zip-codes {font-size:.6rem; letter-spacing:.15em; text-transform:uppercase; font-weight:600; color:var(--color-primary-accent);} 
.coverage-note {margin-top:2.5rem; padding:1.15rem 1.25rem; background:linear-gradient(145deg,#1c3021,#223c28); border:1px solid #2e4a35; border-radius:var(--radius-lg); box-shadow:var(--shadow-sm);} 
.coverage-note p {margin:0; font-size:.8rem; line-height:1.4; color:var(--color-text-soft);} 

.payment-methods-modern {margin-top:2rem; padding:1.25rem 1.35rem; background:linear-gradient(140deg,#213c28,#1a2e1f); border:1px solid #2e4a35; border-radius:var(--radius-lg); box-shadow:var(--shadow-sm);} 
.payment-methods-modern h3 {margin:0 0 .6rem; font-size:1rem; font-family:var(--font-display);} 
.payment-methods-modern p {margin:0; font-size:.8rem; line-height:1.4; color:var(--color-text-soft);} 

/******************** Section Background Overlays (Modern adaptation) ********************/
.section-bg-overlay {position:relative; overflow:hidden; border-top:1px solid rgba(255,255,255,.05); border-bottom:1px solid rgba(255,255,255,.05);} 
.section-bg-overlay .bg-layer {position:absolute; inset:0; background-size:cover; background-position:center; filter:brightness(.9) saturate(1.1);} 
.section-bg-overlay .bg-layer::after {content:''; position:absolute; inset:0; background:linear-gradient(65deg,rgba(15,30,18,.92),rgba(15,30,18,.6) 55%, rgba(15,30,18,.35));} 
.section-bg-overlay .inner {position:relative; z-index:2; padding:5rem 0;} 

/******************** Final CTA Modern ********************/
.cta-final-modern {position:relative; padding:4.5rem 0; overflow:hidden; border-top:1px solid #2e4a35;}
.cta-final-modern::before {content:''; position:absolute; inset:0; background:radial-gradient(circle at 25% 25%,rgba(72,177,78,.25),transparent 65%);} 
.cta-final-modern .inner {position:relative; z-index:2; display:flex; flex-direction:column; gap:1.5rem; align-items:flex-start;}
.cta-final-modern h2 {margin:0; font-family:var(--font-display); font-size:clamp(2rem,3.2vw,3rem);} 
.cta-final-modern p {margin:0; max-width:620px; color:var(--color-text-soft);} 
.cta-buttons {display:flex; flex-wrap:wrap; gap:.85rem;}