/* =========================================================
   Dynamic Services Template Pro CSS
   Version: v4.2.1  (2025-09-22)
   Author: Homeowners Marketplace
   
   Key Updates v4.2.1:
   - [NEW] Added intro content paragraph styling between subtitle and content list
   - [ENHANCED] Improved content flow in intro section
   - [MAINTAINED] All existing functionality and responsive design
   ========================================================= */

/* ---------- palette & layout tokens ---------- */
:root{
  --primary-blue:#2c5aa0;
  --secondary-blue:#4a90e2;

  /* Section rhythm */
  --section-py:4rem;
  --section-py-sm:3rem;

  /* Hero - NO OVERLAY */
  --hero-height:45vh;
  --hero-height-mobile:55vh;

  /* HERO COLOR CONTROL VARIABLES */
  --hero-title-desktop: #FFFFFF;
  --hero-subtitle-desktop: #FFFFFF;
  --hero-paragraph-desktop: #FFFFFF;
  --hero-title-mobile: #2c5aa0;
  --hero-subtitle-mobile: #4a90e2;
  --hero-paragraph-mobile: #666666;

  /* Colors */
  --hm-blue:var(--primary-blue);
  --hm-blue-dark:#234a87;
  --hm-blue-light:#5a8bc4;
  --hm-blue-lighter:#7ba5d1;
  --hm-text:#1F2A37;
  --hm-text-light:#5B6B7A;
  --hm-bg:#F8FAFC;
  --hm-surface:#FFFFFF;
  --hm-border:#E2E8F0;
  --hm-accent:#F1F5F9;

  /* Typography */
  --font-sans: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto,
               "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji",
               "Segoe UI Emoji", "Segoe UI Symbol";

  /* UI */
  --radius-pill:9999px;
  --radius-sm:.375rem;
  --radius-md:.5rem;
  --radius-lg:.75rem;
  --radius-xl:1rem;
  --shadow-sm:0 1px 2px 0 rgba(0,0,0,.05);
  --shadow-md:0 4px 6px -1px rgba(0,0,0,.1), 0 2px 4px -1px rgba(0,0,0,.06);
  --shadow-lg:0 10px 15px -3px rgba(0,0,0,.1), 0 4px 6px -2px rgba(0,0,0,.05);
  --shadow-xl:0 20px 25px -5px rgba(0,0,0,.1), 0 10px 10px -5px rgba(0,0,0,.04);

  --container:1200px;
  --border-subtle:1px solid var(--hm-border);
}

/* ---------- global resets & typography ---------- */
*{box-sizing:border-box}
html, body{
  font-family:var(--font-sans);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
  font-feature-settings:"liga","kern";
  color:var(--hm-text);
}
.container{max-width:var(--container);margin-inline:auto;padding:0 1rem}

/* UPDATED HEADING HIERARCHY - DISTINCT TYPOGRAPHY FOR BETTER HIERARCHY */
/* Typography tokens for distinct, visible scaling */
:root{
  /* H1 - Hero only, largest and most prominent */
  --fs-h1-min: 2.5rem;   /* 40px */
  --fs-h1-max: 4rem;     /* 64px */
  --color-h1: #1a365d;   /* Dark blue, very prominent */
  
  /* H2 - Section headings, clearly smaller than H1 */
  --fs-h2-min: 1.875rem; /* 30px */
  --fs-h2-max: 2.75rem;  /* 44px */
  --color-h2: var(--hm-blue-dark); /* Medium blue */
  
  /* H3 - Content headings, clearly smaller than H2 */
  --fs-h3-min: 1.375rem; /* 22px */
  --fs-h3-max: 1.75rem;  /* 28px */
  --color-h3: var(--hm-blue); /* Standard blue */
  
  /* Subtitles - clearly distinct from headings */
  --fs-subtitle-min: 1.125rem; /* 18px */
  --fs-subtitle-max: 1.375rem; /* 22px */
  --color-subtitle: var(--hm-text-light); /* Light gray */
  
  /* Content - base size, clearly distinct */
  --fs-content-min: 1rem;      /* 16px */
  --fs-content-max: 1.125rem;  /* 18px */
  --color-content: var(--hm-text); /* Standard text color */

  --lh-tight: 1.1;
  --lh-snug: 1.2;
  --lh-normal: 1.4;
  --lh-relaxed: 1.6;
}

/* H1 - Hero only - LARGEST & MOST PROMINENT */
h1, .dstp-h1{
  font: 800 clamp(var(--fs-h1-min), 2rem + 4vw, var(--fs-h1-max))/var(--lh-tight) var(--font-sans);
  color: var(--color-h1);
  margin: 0 0 .6em;
  letter-spacing: -0.025em;
  text-transform: none;
}

/* H2 - Section headings - CLEARLY SMALLER THAN H1 */
h2, .dstp-h2{
  font: 700 clamp(var(--fs-h2-min), 1.5rem + 2.5vw, var(--fs-h2-max))/var(--lh-snug) var(--font-sans);
  color: var(--color-h2);
  margin: 0 0 .5em;
  letter-spacing: -0.015em;
}

/* H3 - Content headings - CLEARLY SMALLER THAN H2 */
h3, .dstp-h3{
  font: 600 clamp(var(--fs-h3-min), 1.2rem + 1.2vw, var(--fs-h3-max))/var(--lh-normal) var(--font-sans);
  color: var(--color-h3);
  margin: 0 0 .4em;
  letter-spacing: -0.005em;
}

/* Subtitle styling - DISTINCT FROM HEADINGS */
.dstp-subtitle, .section-subtitle, .dstp-hero__subtitle, .dstp-intro__subtitle, 
.dstp-why-choose__subtitle, .dstp-get-quote__subtitle, .dstp-service-types__subtitle,
.dstp-subscribe__subtitle, .areas-subtitle{
  font: 500 clamp(var(--fs-subtitle-min), 1rem + .6vw, var(--fs-subtitle-max))/var(--lh-relaxed) var(--font-sans);
  color: var(--color-subtitle);
  margin: .3rem 0 1.2rem;
  font-style: italic;
}

/* Content elements - BASE SIZE, CLEARLY DISTINCT */
.dstp-content, .dstp-intro__content-item, .hmp-verified-content, 
.service-name, .promo-content{
  font: 400 clamp(var(--fs-content-min), .9rem + .4vw, var(--fs-content-max))/var(--lh-relaxed) var(--font-sans);
  color: var(--color-content);
  margin: 0 0 .6em;
}

/* Section headers - updated for distinct H2 structure */
.dstp-section-header, .section-header, .areas-header{
  text-align:center;
  margin-bottom:2.5rem;
}
.dstp-section-header h2, .section-header h2, .areas-header h2{
  margin:0 0 .6rem;
  color:var(--color-h2);
  font-size:clamp(1.875rem, 1.5rem + 2.5vw, 2.75rem);
  font-weight:700;
  line-height:1.2;
}
.dstp-section-sub, .section-subtitle{
  color:var(--color-subtitle);
  font-size:clamp(1.125rem, 1rem + .6vw, 1.375rem);
  line-height:1.6;
  margin:.4rem 0 1.5rem;
  font-style:italic;
  font-weight:500;
}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  padding:.875rem 1.5rem;border-radius:var(--radius-md);border:0;cursor:pointer;
  font-weight:600;text-decoration:none;transition:all .2s ease;
  font-size:.9375rem;line-height:1.5;letter-spacing:0.025em;
  font-family:var(--font-sans);
}
.btn-cta{background:linear-gradient(135deg, var(--primary-blue), var(--secondary-blue));color:#fff;box-shadow:var(--shadow-lg)}
.btn-cta:hover{transform:translateY(-2px);box-shadow:var(--shadow-xl);background:linear-gradient(135deg, var(--hm-blue-dark), var(--primary-blue))}
.btn-secondary{background:var(--hm-blue-dark);color:#fff;border:var(--border-subtle)}
.btn-secondary:hover{background:var(--hm-blue)}

/* ---------- HERO - H1 TITLE, SUBTITLE, PARAGRAPH ---------- */
.dstp-hero{
  position:relative;background:var(--hm-blue-dark);color:#fff;
  padding:4rem 0;background-position:center;background-size:cover;overflow:hidden;
  min-height:var(--hero-height);
}
.dstp-hero__bg-mobile{display:none;position:absolute;inset:0;z-index:0;width:100%;height:100%;object-fit:cover}

/* NO OVERLAY */
.dstp-hero::before{display:none !important;}
.dstp-hero::after{display:none !important;}

/* Keep content above bg */
.dstp-hero > .container{position:relative;z-index:1}
.dstp-hero__inner{max-width:1100px;margin:0 auto;text-align:center}

/* HERO H1 - DESKTOP: WHITE, MOBILE: BLUE */
.dstp-hero h1{
  margin:0 0 .75rem;
  font-size:clamp(2.5rem,5vw,4rem);
  line-height:1.1;
  color:var(--hero-title-desktop) !important;
  text-shadow:0 2px 8px rgba(0,0,0,.3);
  font-weight:800;
  letter-spacing:-0.025em;
}

/* HERO SUBTITLE - DESKTOP: WHITE, MOBILE: BLUE */
.dstp-hero__subtitle{
  color:var(--hero-subtitle-desktop) !important;
  margin:.4rem 0 .6rem;
  font-size:clamp(1.25rem,2.2vw,1.5rem);
  line-height:1.4;
  font-weight:500;
  font-style:italic;
}

/* HERO PARAGRAPH - DESKTOP: WHITE, MOBILE: GRAY */
.dstp-hero__paragraph{
  color:var(--hero-paragraph-desktop) !important;
  margin:.6rem 0 1.8rem;
  font-size:clamp(1.125rem,1.8vw,1.25rem);
  line-height:1.6;
  font-weight:400;
  max-width:700px;
  margin-left:auto;
  margin-right:auto;
  opacity:0.95;
}

/* SHORTCODE CONTAINERS - NO STYLING INTERFERENCE */
.dstp-zip-search,
.quote-form-container,
.dstp-subscribe-container{
  margin-top:1.5rem;
}

/* Mobile - BLUE TEXT */
@media(max-width:768px){
  .dstp-hero{
    padding:3rem 0;background-image:none !important;min-height:var(--hero-height-mobile);
  }
  .dstp-hero__bg-mobile{display:block}
  .dstp-hero__inner{padding:1.5rem 1rem}
  
  /* MOBILE: BLUE/GRAY TEXT, NO BLUR */
  .dstp-hero h1{
    color:var(--hero-title-mobile) !important;
    text-shadow:none;
  }
  .dstp-hero__subtitle{
    color:var(--hero-subtitle-mobile) !important;
  }
  .dstp-hero__paragraph{
    color:var(--hero-paragraph-mobile) !important;
    margin:.8rem 0 2rem;
    font-size:clamp(1.125rem, 1.5vw, 1.25rem);
    opacity:1;
  }
}

/* ---------- Global section padding ---------- */
.dstp-intro,
.dstp-why-choose,
.hmp-process,
.dstp-get-quote,
.hmp-verified-pros,
.hmp-service-areas,
.dstp-service-types,
.dstp-subscribe,
.hm-faq,
.hmp-promos{
  padding:var(--section-py) 1rem;
}
@media(max-width:768px){
  .dstp-intro,
  .dstp-why-choose,
  .hmp-process,
  .dstp-get-quote,
  .hmp-verified-pros,
  .hmp-service-areas,
  .dstp-service-types,
  .dstp-subscribe,
  .hm-faq,
  .hmp-promos{
    padding:var(--section-py-sm) .75rem;
  }
}

/* ---------- SECTION BACKGROUNDS - ALTERNATING PATTERN ---------- */
/* Pattern: Hero(blue) -> Intro(white) -> Why(gray) -> Process(white) -> Quote(gray) -> Services(white) -> Verified(gray) -> Areas(white) -> Subscribe(gray) -> FAQ(white) -> Promos(gray) */

/* INTRO SECTION - H2/SUBTITLE/NEW PARAGRAPH/CONTENT structure - WHITE */
.dstp-intro{background:var(--hm-surface)}
.dstp-intro__row{display:grid;grid-template-columns:1fr;gap:2rem;align-items:center}

/* Tight vertical grouping */
.dstp-intro h2 + .dstp-intro__subtitle{margin-top:.25rem}
.dstp-intro__subtitle + .dstp-intro__content-paragraph{margin-top:.75rem}
.dstp-intro__content-paragraph + .dstp-intro__content-list{margin-top:.75rem}
.dstp-intro__content-list + .dstp-intro__ctas{margin-top:1.5rem}

/* NEW: Content paragraph styling - positioned between subtitle and content list */
.dstp-intro__content-paragraph{
  margin-top:.75rem;
  margin-bottom:.75rem;
  font-size:clamp(1rem, .9rem + .5vw, 1.125rem);
  line-height:1.6;
  color:var(--color-content);
  text-align:left;
}
.dstp-intro__content-paragraph p{
  margin:0 0 .8em;
  line-height:1.6;
}
.dstp-intro__content-paragraph p:last-child{
  margin-bottom:0;
}

/* ENHANCED: Content list as LEFT-ALIGNED VERTICAL LIST */
.dstp-intro__content-list{
  margin-top:.75rem;
  text-align: left;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding: 0;
  list-style: none;
}

.dstp-intro__content-item{
  margin: 0;
  padding: 0.5rem 0;
  font-weight:600;
  color:var(--color-content);
  font-size:clamp(1rem, .9rem + .5vw, 1.125rem);
  line-height:1.5;
  position: relative;
  padding-left: 1.5rem;
}

.dstp-intro__content-item::before{
  content: "✓";
  position: absolute;
  left: 0;
  color: var(--hm-blue);
  font-weight: 700;
  font-size: 1.1em;
}

.dstp-intro__ctas{display:flex;gap:1rem;flex-wrap:wrap;margin-top:1.5rem}
.dstp-intro__figure{background:var(--hm-accent);border-radius:var(--radius-xl);overflow:hidden;box-shadow:var(--shadow-lg)}
.dstp-intro__figure img{width:100%;height:auto;display:block}

/* Desktop: no dividers, Mobile: keep dividers */
@media(min-width:769px){
  .dstp-intro{border-bottom:none}
  .dstp-intro__row{grid-template-columns:1.2fr .8fr;gap:3rem}
}
@media(max-width:768px){
  .dstp-intro{border-bottom:var(--border-subtle)}
}

/* WHY CHOOSE SECTION - H2/SUBTITLE/CONTENT structure - LIGHT GRAY */
.dstp-why-choose{background:var(--hm-bg)}
.dstp-why-choose .dstp-rich{color:var(--hm-text);margin-top:.75rem;line-height:1.7}
.dstp-centered{text-align:center;max-width:800px;margin:0 auto}

/* Desktop: no dividers, Mobile: keep dividers */
@media(min-width:769px){
  .dstp-why-choose{border-bottom:none}
}
@media(max-width:768px){
  .dstp-why-choose{border-bottom:var(--border-subtle)}
}

/* PROCESS SECTION - H2/SUBTITLE with H3 content - WHITE */
.hmp-process{position:relative;overflow:hidden;background:var(--hm-surface)}
.hmp-process .container{position:relative;z-index:1}
.hmp-process .section-header{text-align:center;max-width:900px;margin:0 auto 2rem}

/* Desktop grid */
.hmp-process .process-steps-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:1.5rem;margin-top:2rem;
}

/* MOBILE: Vertical stacking */
@media(max-width:768px){
  .hmp-process .process-steps-grid{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:1rem !important;
    margin:1.5rem 0 0 !important;
    padding:0 !important;
    overflow:visible !important;
  }
}

.process-step-card{
  display:flex;flex-direction:column;align-items:center;background:var(--hm-surface);border-radius:var(--radius-lg);
  padding:1.5rem 1.25rem;border:var(--border-subtle);box-shadow:var(--shadow-md);text-align:center;transition:transform .2s, box-shadow .2s;
  min-width:0;overflow:hidden;height:100%;
}
.process-step-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.step-icon{width:60px;height:60px;margin-bottom:1rem;object-fit:contain;flex:0 0 auto}
.step-icon--fallback{display:inline-flex;align-items:center;justify-content:center;font-size:1.5rem;background:var(--hm-accent);border-radius:50%;width:60px;height:60px;color:var(--hm-blue)}

/* Process step titles */
.process-step-title{
  font-weight:600;color:var(--hm-blue);font-size:.875rem;margin:.25rem 0 .45rem;
  text-transform:uppercase;letter-spacing:.05em;overflow-wrap:anywhere;word-break:break-word;
}

/* Process step headings as H3 */
.process-step-card h3, .process-step-card strong{
  font-weight:700;color:var(--hm-blue-dark);font-size:1.125rem;margin-bottom:.45rem;
  display:block;line-height:1.3;overflow-wrap:anywhere;word-break:break-word;
}

.process-step-text{color:var(--hm-text);line-height:1.5;margin-bottom:.9rem;font-size:.9375rem;overflow-wrap:anywhere;word-break:break-word}

@media(max-width:768px){
  .process-step-card{width:auto;flex:initial;padding:1.1rem .9rem;min-height:unset}
  .process-step-card *{min-width:0;overflow-wrap:anywhere;word-break:break-word}
}

.btn-process{margin-top:auto;padding:.625rem 1.25rem;border-radius:var(--radius-md);background:linear-gradient(135deg, var(--primary-blue), var(--secondary-blue));color:#fff;text-decoration:none;font-weight:600;transition:all .2s ease;box-shadow:var(--shadow-md);font-size:.875rem}

/* Desktop: no dividers, Mobile: keep dividers */
@media(min-width:769px){
  .hmp-process{border-bottom:none}
}
@media(max-width:768px){
  .hmp-process{border-bottom:var(--border-subtle)}
}

/* GET A QUOTE SECTION - H2/SUBTITLE structure - LIGHT GRAY */
.dstp-get-quote{background:var(--hm-bg)}
.dstp-get-quote .dstp-centered{text-align:center;max-width:900px;margin:0 auto}

/* Desktop: no dividers, Mobile: keep dividers */
@media(min-width:769px){
  .dstp-get-quote{border-bottom:none}
}
@media(max-width:768px){
  .dstp-get-quote{border-bottom:var(--border-subtle)}
}

/* SERVICE TYPES SECTION - H2/SUBTITLE with service descriptions as H3 content - WHITE */
.dstp-service-types{background:var(--hm-surface)}

/* 2-column grid (mobile → 1) */
.service-types-list{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:1.25rem 2rem;
  max-width:100%;
  margin:2rem auto 0;
}
@media(max-width:768px){
  .service-types-list{grid-template-columns:1fr}
}

.service-type-item{
  margin:0;
  padding-bottom:1rem;
  border-bottom:1px solid var(--hm-border);
}

/* Remove divider from last items in each column */
@media(min-width:769px){
  .service-type-item:nth-last-child(-n+2){
    border-bottom:none;
  }
}

/* Mobile: Remove divider from last item only */
@media(max-width:768px){
  .service-type-item:last-child{
    border-bottom:none;
  }
}

/* Service names and descriptions - DISTINCT HIERARCHY */
.service-name{
  color:var(--color-content);
  margin:0 0 .5rem;
  font-size:clamp(1.125rem, 1rem + .4vw, 1.25rem);
  font-weight:600;
  line-height:1.3;
  letter-spacing: 0.01em;
}
.service-description{
  color:var(--color-h3) !important;
  font-size:clamp(1.25rem, 1.15rem + .8vw, 1.5rem) !important;
  font-weight:600 !important;
  line-height:1.5 !important;
  margin:0 !important;
  letter-spacing: -0.005em;
}

/* Desktop: no dividers, Mobile: keep dividers */
@media(min-width:769px){
  .dstp-service-types{border-bottom:none}
}
@media(max-width:768px){
  .dstp-service-types{border-bottom:var(--border-subtle)}
}

/* VERIFIED PROS SECTION - H2/SUBTITLE with content cards - LIGHT GRAY */
.hmp-verified-pros{background:var(--hm-bg)}
.hmp-verified-pros .section-header{text-align:center;margin-bottom:2rem}
.hmp-verified-pros .section-header p{font-size:1.125rem;color:var(--hm-text-light);line-height:1.5}
.verified-pro-section-img{max-width:120px;border-radius:var(--radius-md);margin:0 auto 1rem}

.hmp-verified-cards{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:1.5rem;align-items:stretch;
}
@media(max-width:768px){ .hmp-verified-cards{grid-template-columns:1fr} }

.hmp-verified-card{
  display:flex;flex-direction:column;align-items:flex-start;
  background:var(--hm-surface);border-radius:var(--radius-lg);
  padding:1.5rem 1.25rem;border:var(--border-subtle);box-shadow:var(--shadow-md);
  text-align:left;transition:transform .2s, box-shadow .2s;
  min-width:0;overflow:visible;height:100%;
}
.hmp-verified-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:var(--hm-blue)}
.hmp-verified-card .promo-icon{width:60px;height:60px;margin-bottom:1rem;object-fit:contain;flex:0 0 auto}

/* Verified card content - DISTINCT STYLING */
.hmp-verified-content{
  font-weight:600;
  color:var(--color-content);
  font-size:clamp(1.125rem, 1rem + .5vw, 1.25rem);
  margin:0 0 .6rem;
  line-height:1.3;
  overflow-wrap:anywhere;
  word-break:break-word;
}

.hmp-verified-description{
  color:var(--hm-text);line-height:1.5;margin:0 0 1rem;font-size:.9375rem;
  overflow-wrap:anywhere;word-break:break-word;
  display:-webkit-box;-webkit-line-clamp:6;line-clamp:6;-webkit-box-orient:vertical;
}
@media(max-width:768px){
  .hmp-verified-description{display:block;-webkit-line-clamp:unset;line-clamp:unset}
}

.hmp-verified-cta,
.hmp-verified-card .btn,
.hmp-verified-card a.btn,
.hmp-verified-card button{
  margin-top:auto;align-self:stretch;text-align:center;
  padding:.75rem 1rem;border-radius:var(--radius-md);
  background:linear-gradient(135deg, var(--primary-blue), var(--secondary-blue));
  color:#fff;text-decoration:none;font-weight:700;transition:all .2s ease;box-shadow:var(--shadow-md);font-size:.9375rem;
}

/* Desktop: no dividers, Mobile: keep dividers */
@media(min-width:769px){
  .hmp-verified-pros{border-bottom:none}
}
@media(max-width:768px){
  .hmp-verified-pros{border-bottom:var(--border-subtle)}
}

/* SERVICE AREAS SECTION - H2/SUBTITLE with city/zip content - WHITE */
.hmp-service-areas{background:var(--hm-surface)}
.hmp-service-areas .container{max-width:1100px}
.areas-header{text-align:center;margin:0 0 1.25rem}

/* DESKTOP: Proper carousel container that stays in place */
.areas-list{
  position: relative;
  overflow: hidden;
  padding-bottom: .25rem;
  width: 100%;
}

/* Desktop carousel wrapper - this moves, container stays */
@media(min-width:641px){
  .areas-list-wrapper{
    display: flex;
    gap: .5rem;
    animation: carousel-scroll 25s linear infinite;
    width: max-content;
  }
  
  .areas-list:hover .areas-list-wrapper{
    animation-play-state: paused;
  }
}

@keyframes carousel-scroll {
  0% { 
    transform: translateX(0); 
  }
  100% { 
    transform: translateX(-50%); 
  }
}

/* MOBILE: vertical flex */
@media(max-width:640px){
  .areas-list{
    display:flex;flex-direction:column;gap:.4rem;overflow:visible;padding-bottom:0;
  }
  .areas-list-wrapper{
    display: flex;
    flex-direction: column;
    gap: .4rem;
    animation: none;
  }
}

/* Area items as CTAs */
.area-item{
  display:flex !important;flex-direction:column !important;
  align-items:center;justify-content:center;text-align:center;

  padding:.6rem .9rem;border-radius:var(--radius-pill);
  background:linear-gradient(135deg, var(--hm-blue-dark), var(--primary-blue));
  color:#fff;border:1px solid rgba(255,255,255,.18);
  box-shadow:0 1px 2px rgba(0,0,0,.04), 0 6px 18px rgba(0,0,0,.06);

  flex:0 0 auto;min-height:56px;min-width:160px;max-width:240px;
  
  /* CTA styling */
  text-decoration:none;
  cursor:pointer;
  transition:all .2s ease;
  white-space: nowrap;
}
.area-item:hover{
  transform:translateY(-1px);
  box-shadow:0 6px 16px rgba(0,0,0,.12);
  filter:saturate(1.05);
  color:#fff;
}

.area-item__name,
.area-item__zip{display:block;width:100%;text-align:center}
.area-item__name{
  color:#fff;font-weight:800;line-height:1.1;margin:0 0 .18rem;
  font-size:.98rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.area-item__zip{
  color:#E6EEFF;font-weight:600;line-height:1;margin:0;
  font-size:.82rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}

@media(max-width:640px){
  .area-item{width:100%;max-width:none;min-width:0;min-height:58px;padding:.7rem 1rem}
  .area-item__name,.area-item__zip{white-space:nowrap}
}

/* Desktop: no dividers, Mobile: keep dividers */
@media(min-width:769px){
  .hmp-service-areas{border-bottom:none}
}
@media(max-width:768px){
  .hmp-service-areas{border-bottom:var(--border-subtle)}
}

/* SUBSCRIBE SECTION - H2/SUBTITLE structure - LIGHT GRAY */
.dstp-subscribe{background:var(--hm-bg)}
.dstp-subscribe .dstp-section-header{margin-bottom:.75rem}

/* Fallback form styling - MINIMAL INTERFERENCE */
.dstp-subscribe-form{
  display:flex;gap:.75rem;justify-content:center;align-items:center;
  margin-top:.5rem;max-width:600px;margin-left:auto;margin-right:auto;
}
.dstp-subscribe-form input[type="email"]{
  flex:1;padding:.875rem 1.25rem;border:var(--border-subtle);border-radius:var(--radius-md);
  min-width:280px;background:var(--hm-surface);color:var(--hm-text);
  transition:border-color .2s, box-shadow .2s;font-family:var(--font-sans);
}
.dstp-subscribe-form input[type="email"]:focus{
  outline:none;border-color:var(--hm-blue);box-shadow:0 0 0 3px rgba(44,90,160,0.1);
}
.dstp-subscribe-form .btn{padding:.875rem 1.5rem;margin:0}
.dstp-subscribe-note{
  max-width:600px;margin:.5rem auto 0;text-align:center;
  color:var(--hm-text-light);font-size:.9rem;
}

/* Desktop: no dividers, Mobile: keep dividers */
@media(min-width:769px){
  .dstp-subscribe{border-bottom:none}
}
@media(max-width:768px){
  .dstp-subscribe{border-bottom:var(--border-subtle)}
}

/* FAQ - H2 heading - WHITE */
.hm-faq{background:var(--hm-surface)}
.hm-faq .container{max-width:640px;margin:0 auto;padding:2rem;background:var(--hm-surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);border:var(--border-subtle)}
.hm-faq__title{margin:0 0 2rem;color:var(--hm-blue-dark);text-align:center;font-size:2rem;font-weight:700;padding-top:1rem}
.hm-faq-list{border:var(--border-subtle);border-radius:var(--radius-md);overflow:hidden;box-shadow:var(--shadow-sm)}
.hm-faq-item + .hm-faq-item{border-top:var(--border-subtle)}
.hm-faq-question{width:100%;background:var(--hm-blue);color:#fff;font-weight:600;padding:1.25rem 1.5rem;border:0;text-align:left;display:flex;justify-content:space-between;align-items:center;cursor:pointer;transition:background-color .2s;font-size:1.0625rem;line-height:1.4}
.hm-faq-question:hover{background:var(--hm-blue-dark)}
.hm-faq-icon{font-weight:700;font-size:1.125rem}
.hm-faq-answer{max-height:0;opacity:0;overflow:hidden;padding:0 1.5rem;background:#FFFFFF;color:var(--hm-text);border-top:1px solid #E6EEF9;transition:max-height .3s ease, opacity .3s ease, padding .3s ease}
.hm-faq-answer.open{max-height:500px;opacity:1;padding:1.25rem 1.5rem 1.5rem}
.hm-faq-answer div{line-height:1rem;font-size:1rem}

/* PROMOS - H2/SUBTITLE with H3 card titles - LIGHT GRAY */
.hmp-promos{background:var(--hm-bg)}
.hmp-promos .section-header{text-align:center;margin-bottom:2rem}
.promo-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.5rem}
.promo-card{background:var(--hm-surface);border-radius:var(--radius-lg);padding:2rem;box-shadow:var(--shadow-md);text-align:center;border:var(--border-subtle);transition:all .2s ease}
.promo-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.promo-icon{width:64px;height:64px;margin:0 auto 1.25rem}
.promo-icon img{width:100%;height:100%;object-fit:contain}

/* Promo card titles as H3 */
.promo-card h3{
  font-size:1.25rem;color:var(--hm-blue-dark);margin-bottom:1rem;
  font-weight:600;line-height:1.3;
}

.promo-content{
  font-size:clamp(1rem, .9rem + .4vw, 1.125rem);
  line-height:1.6;
  color:var(--color-content);
  margin-bottom:1.5rem;
  font-weight:400;
}
.promo-cta{margin-top:1rem}
.btn-promo{padding:.75rem 1.5rem;background:linear-gradient(135deg, var(--primary-blue), var(--secondary-blue));color:#fff;border-radius:var(--radius-md);text-decoration:none;font-weight:600;box-shadow:var(--shadow-md);transition:all .2s ease}
.btn-promo:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}

/* ---------- Mobile Quote Bar ---------- */
.mobile-quote-bar {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  display: none;
  background: linear-gradient(135deg, var(--primary-blue), var(--secondary-blue));
  color: #fff;
  text-align: center;
  padding: 1rem;
  font-weight: 600;
  text-decoration: none;
  box-shadow: 0 -2px 10px rgba(0,0,0,0.1);
  transition: all 0.3s ease;
}

.mobile-quote-bar:hover {
  background: linear-gradient(135deg, var(--hm-blue-dark), var(--primary-blue));
  color: #fff;
}

@media (max-width: 768px) {
  .mobile-quote-bar {
    display: block;
  }
}

/* ---------- adjacency cleanup (only for mobile now) ---------- */
@media(max-width:768px){
  .dstp-hero + .dstp-intro,
  .dstp-intro + .dstp-why-choose,
  .dstp-why-choose + .hmp-process,
  .hmp-process + .dstp-get-quote,
  .dstp-get-quote + .dstp-service-types,
  .dstp-service-types + .hmp-verified-pros,
  .hmp-verified-pros + .hmp-service-areas,
  .hmp-service-areas + .dstp-subscribe,
  .dstp-subscribe + .hm-faq,
  .hm-faq + .hmp-promos{margin-top:-1px}
}

/* ---------- responsive container padding ---------- */
@media(max-width:640px){.container{padding:0 .75rem}}