/* Ductless Brothers — Schedule form, town "local" section, blog previews, blog quote bar
   Same look as gallery.css / service.css / sections.css */

/* Shared bits */
@keyframes dbPulse{
  0%  { transform:scale(1);    box-shadow:0 0 0 0 var(--db-pulse,rgba(103,201,232,.65)), 0 12px 28px rgba(0,0,0,.35); }
  60% { transform:scale(1.04); box-shadow:0 0 0 16px rgba(0,0,0,0), 0 16px 34px rgba(0,0,0,.4); }
  100%{ transform:scale(1);    box-shadow:0 0 0 0 rgba(0,0,0,0), 0 12px 28px rgba(0,0,0,.35); }
}

/* ================= SCHEDULE YOUR SERVICE (#contact) ================= */
#contact.section{
  position:relative; overflow:hidden;
  padding-top:72px !important; padding-bottom:84px !important;
  background:
    radial-gradient(620px 420px at 12% 25%, rgba(103,201,232,.16), transparent 70%),
    radial-gradient(600px 420px at 90% 85%, rgba(216,90,28,.16), transparent 70%),
    radial-gradient(rgba(255,255,255,.05) 1.5px, transparent 2px) 0 0 / 24px 24px,
    #0B1120 !important;
}
#contact .container{ max-width:880px; text-align:center; }
#contact .section-title{
  position:relative; display:table; margin:0 auto 18px !important;
  padding:0 0 14px !important; background:none !important; border:0 !important; box-shadow:none !important;
  font-size:clamp(32px,4vw,52px) !important; color:#FFFFFF !important; letter-spacing:-.5px;
}
#contact .section-title::after{
  content:""; position:absolute; left:50% !important; bottom:0; transform:translateX(-50%);
  width:90px !important; height:5px !important; border-radius:99px;
  background:linear-gradient(90deg,#D85A1C,#67C9E8) !important;
}
#contact .container > p{ color:#D3DCE8 !important; font-size:16.5px; margin:0 auto 28px !important; max-width:640px; }
#contact .inline-cta{
  display:inline-block; padding:3px 12px; border-radius:99px;
  background:linear-gradient(135deg,#D85A1C,#B94712); color:#FFFFFF !important; font-weight:800; text-decoration:none;
}

#contact .contact-form{
  text-align:left; padding:32px 34px 30px !important; border-radius:22px !important;
  border:2px solid transparent !important;
  background:
    linear-gradient(#151E33,#151E33) padding-box,
    linear-gradient(135deg,#D85A1C,#67C9E8) border-box !important;
  box-shadow:0 20px 50px rgba(0,0,0,.45), 0 0 40px rgba(103,201,232,.12) !important;
  display:grid; grid-template-columns:1fr 1fr; gap:16px 20px;
}
#contact .contact-form::before{ display:none !important; }
#contact .form-row{ margin:0 !important; }
#contact .form-row:has(textarea), #contact .form-actions{ grid-column:1 / -1; }
#contact .form-row label{ color:#FFFFFF !important; font-weight:700; font-size:14px; letter-spacing:.02em; }
#contact .form-row input, #contact .form-row textarea{
  border-radius:12px !important; padding:12px 14px !important;
  background:#0B1120 !important; border:1px solid #2B3A55 !important; color:#FFFFFF !important;
  transition:border-color .2s, box-shadow .2s;
}
#contact .form-row input:focus, #contact .form-row textarea:focus{
  outline:none; border-color:#67C9E8 !important; box-shadow:0 0 0 4px rgba(103,201,232,.18);
}
#contact .form-actions{ display:flex; justify-content:center; margin-top:6px; }
#contact .btn-contact{
  --db-pulse:rgba(103,201,232,.65);
  padding:16px 48px !important; font-size:18px !important; font-weight:800 !important; border-radius:14px !important;
  background:linear-gradient(135deg,#67C9E8,#3AA9CF) !important; color:#FFFFFF !important;
  animation:dbPulse 2.2s ease-in-out infinite;
}
#contact .btn-contact:hover{ animation-play-state:paused; transform:translateY(-2px) scale(1.04); }

/* ================= TOWN "LOCAL" SECTION ================= */
.newburyport-local-section.section{
  position:relative; overflow:hidden;
  padding-top:72px !important; padding-bottom:80px !important;
  background:
    radial-gradient(600px 400px at 12% 30%, rgba(216,90,28,.14), transparent 70%),
    radial-gradient(560px 380px at 90% 75%, rgba(103,201,232,.16), transparent 70%),
    radial-gradient(rgba(255,255,255,.05) 1.5px, transparent 2px) 0 0 / 24px 24px,
    #0B1120 !important;
}
.newburyport-local-section .newburyport-local-title{
  position:relative; display:table; margin:0 auto 44px !important; max-width:900px;
  padding:0 0 14px !important; background:none !important; text-align:center;
  font-size:clamp(28px,3.4vw,44px) !important; line-height:1.15; color:#FFFFFF !important;
}
.newburyport-local-section .newburyport-local-title::after{
  content:""; position:absolute; left:50%; bottom:0; transform:translateX(-50%);
  width:90px; height:5px; border-radius:99px; background:linear-gradient(90deg,#D85A1C,#67C9E8);
}
.newburyport-local-section .newburyport-local-content,
.newburyport-local-section .newburyport-map-wrapper{
  border:2px solid transparent !important;
  background:
    linear-gradient(#151E33,#151E33) padding-box,
    linear-gradient(135deg,#D85A1C,#67C9E8) border-box !important;
  box-shadow:0 20px 50px rgba(0,0,0,.45), 0 0 40px rgba(103,201,232,.12) !important;
  transition:transform .3s ease, box-shadow .3s ease;
}
.newburyport-local-section .newburyport-local-content:hover,
.newburyport-local-section .newburyport-map-wrapper:hover{
  transform:translateY(-4px);
  box-shadow:0 26px 60px rgba(0,0,0,.5), 0 0 55px rgba(103,201,232,.22) !important;
}
.newburyport-local-section .newburyport-local-content::before{ display:none !important; }
.newburyport-local-section .newburyport-local-content p{ color:#D3DCE8 !important; }
.newburyport-local-section .newburyport-local-content p:first-of-type::first-letter{
  float:left; margin:6px 10px 0 0; font-size:3.2em; line-height:.8; font-weight:800;
  background:linear-gradient(135deg,#F08A4B,#67C9E8); -webkit-background-clip:text; background-clip:text; color:transparent;
}
.newburyport-local-section .newburyport-local-button{
  --db-pulse:rgba(103,201,232,.6);
  padding:14px 28px !important; font-size:16px !important; font-weight:800 !important;
  animation:dbPulse 2.4s ease-in-out infinite;
}
.newburyport-local-section .newburyport-local-button:hover{ animation-play-state:paused; }

/* ================= "FROM OUR BLOG" PREVIEWS (town pages) ================= */
.blog-town-section.section{
  position:relative; overflow:hidden;
  padding-top:72px !important; padding-bottom:80px !important;
  background:
    radial-gradient(600px 400px at 88% 20%, rgba(103,201,232,.15), transparent 70%),
    radial-gradient(560px 380px at 10% 85%, rgba(216,90,28,.14), transparent 70%),
    radial-gradient(rgba(255,255,255,.05) 1.5px, transparent 2px) 0 0 / 24px 24px,
    #0B1120 !important;
}
.blog-town-section .blog-pill-title{
  position:relative; padding:0 0 14px !important; margin:0 auto 40px !important;
  background:none !important; border:0 !important; box-shadow:none !important; border-radius:0 !important;
  color:#FFFFFF !important; font-size:clamp(28px,3.4vw,44px) !important;
}
.blog-town-section .blog-pill-title::after{
  content:""; position:absolute; left:50%; bottom:0; transform:translateX(-50%);
  width:90px; height:5px; border-radius:99px; background:linear-gradient(90deg,#D85A1C,#67C9E8);
}
.blog-town-section .blog-card{
  border:2px solid transparent !important;
  background:
    linear-gradient(#151E33,#151E33) padding-box,
    linear-gradient(135deg,#D85A1C,#67C9E8) border-box !important;
  box-shadow:0 20px 50px rgba(0,0,0,.45), 0 0 34px rgba(103,201,232,.10) !important;
  transition:transform .3s ease, box-shadow .3s ease;
}
.blog-town-section .blog-card:hover{
  transform:translateY(-6px);
  box-shadow:0 28px 60px rgba(0,0,0,.5), 0 0 55px rgba(103,201,232,.25) !important;
}
.blog-town-section .blog-card::before{ display:none !important; }
.blog-town-section .blog-card-img img{ transition:transform .6s ease !important; }
.blog-town-section .blog-card:hover .blog-card-img img{ transform:scale(1.07) !important; }
.blog-town-section .blog-local-tag{
  display:inline-block; align-self:flex-start; margin:0 0 10px !important;
  padding:5px 12px !important; border-radius:99px;
  background:rgba(103,201,232,.14) !important; color:#67C9E8 !important;
  font-size:11.5px !important; font-weight:800; letter-spacing:.1em; text-transform:uppercase;
}
.blog-town-section .blog-card-title, .blog-town-section .blog-card-body, .blog-town-section .blog-card-img{
  background:none !important; border:0 !important; box-shadow:none !important;
}
.blog-town-section .blog-card-title a{ color:#FFFFFF !important; background:none !important; }
.blog-town-section .blog-card-title a:hover{ color:#67C9E8 !important; }
.blog-town-section .blog-meta, .blog-town-section .blog-meta time{ color:#AAB6C8 !important; }
.blog-town-section .blog-meta a{ color:#67C9E8 !important; }
.blog-town-section .blog-excerpt{ color:#D3DCE8 !important; }
.blog-town-section .blog-more{
  align-self:flex-start; padding:8px 16px; border-radius:99px;
  background:linear-gradient(135deg,#D85A1C,#B94712); color:#FFFFFF !important; font-weight:800;
  box-shadow:0 8px 20px rgba(216,90,28,.3); transition:transform .2s, box-shadow .2s;
}
.blog-town-section .blog-more:hover{ transform:translateX(3px); box-shadow:0 10px 26px rgba(216,90,28,.45); text-decoration:none; }
.blog-town-section .container > p:last-child a, .blog-town-section .blog-all-link{
  display:inline-block; padding:12px 26px; border-radius:14px; margin-top:8px;
  border:1px solid rgba(103,201,232,.6); background:rgba(103,201,232,.1);
  color:#FFFFFF !important; font-weight:800; text-decoration:none;
}

/* ================= "DUE FOR A CLEANING?" QUOTE BAR (blog pages) ================= */
.blog-quote-bar{
  flex-direction:column !important; justify-content:center !important; align-items:center !important;
  text-align:center; gap:22px !important; padding:40px 32px !important; border-radius:22px !important;
  border:2px solid transparent !important;
  background:
    radial-gradient(400px 200px at 15% 0%, rgba(216,90,28,.18), transparent 70%),
    radial-gradient(400px 200px at 85% 100%, rgba(103,201,232,.18), transparent 70%),
    linear-gradient(#151E33,#151E33) padding-box,
    linear-gradient(135deg,#D85A1C,#67C9E8) border-box !important;
  box-shadow:0 20px 50px rgba(0,0,0,.45), 0 0 40px rgba(103,201,232,.14) !important;
}
.blog-quote-bar h2{ font-size:clamp(26px,3vw,36px) !important; color:#FFFFFF !important; margin:0 0 8px !important; }
.blog-quote-bar p{ color:#D3DCE8 !important; font-size:16px !important; }
.blog-quote-actions{ justify-content:center !important; gap:16px !important; }
.blog-quote-actions .btn{
  padding:18px 34px !important; font-size:18px !important; font-weight:800 !important; border-radius:16px !important;
  color:#FFFFFF !important; animation:dbPulse 2.2s ease-in-out infinite;
}
.blog-quote-actions .btn-primary{ --db-pulse:rgba(103,201,232,.65); background:linear-gradient(135deg,#67C9E8,#3AA9CF) !important; }
.blog-quote-actions .btn-secondary{ --db-pulse:rgba(216,90,28,.6); background:linear-gradient(135deg,#E8682A,#B94712) !important; border:0 !important; animation-delay:1.1s; }
.blog-quote-actions .btn:hover{ animation-play-state:paused; transform:translateY(-2px) scale(1.05); }

/* Phones */
@media (max-width:900px){
  #contact.section, .newburyport-local-section.section, .blog-town-section.section{ padding-top:56px !important; padding-bottom:60px !important; }
  #contact .contact-form{ grid-template-columns:1fr; padding:24px 20px !important; }
  #contact .btn-contact{ width:100%; }
  .blog-quote-actions{ width:100%; flex-direction:column; }
  .blog-quote-actions .btn{ width:100%; text-align:center; }
}

/* Respect people who turn off motion in their device settings */
@media (prefers-reduced-motion:reduce){
  #contact .btn-contact, .newburyport-local-section .newburyport-local-button, .blog-quote-actions .btn{ animation:none !important; }
}
