/* faq breakpoints, loaded after the shared ones. */

@media (min-width: 1101px) {
  body.seo-page .faq-section { height: 858px; min-height: 858px; margin-top: 120px; padding: 0; }
  body.seo-page .faq-section .section-intro h2 { margin-top: 24px; line-height: 50px; }
  body.seo-page .faq-list { margin-top: 83px; }
}

@media (max-width: 900px) {
  body.digital-marketing-page .faq-section { height: auto; min-height: 806px; margin-top: 80px; padding-bottom: 80px; }
  body.digital-marketing-page .faq-section .section-intro h2 { width: 208px; margin-top: 32px; font-size: 32px; line-height: 26.5px; }
  body.digital-marketing-page .faq-list { margin-top: 40px; }
  body.digital-marketing-page .faq-list summary { padding: 26px 52px 26px 8px; font-size: 20px; line-height: 19px; }
  body.digital-marketing-page .faq-list details p { margin: -4px 24px 24px 8px; font-size: 16px; line-height: 24px; }
  .faq-section { min-height: 0; padding: 80px 0; }
  .faq-section .section-intro h2 { max-width: 330px; margin-top: 32px; font-size: 48px; line-height: 46px; }
  .faq-list { width: 100%; margin-top: 64px; }
  .faq-list summary { padding: 26px 52px 26px 20px; font-size: 22px; line-height: 28px; }
  .faq-list summary::after { right: 22px; }
  .faq-list details p { margin: -4px 45px 26px 20px; font-size: 16px; line-height: 24px; }
}

@media (max-width: 1100px) {
  body.about-us-page .faq-section { height: auto; min-height: 0; }
  body.about-us-page .faq-section { margin-top: 120px; padding: 0 0 80px; }
}

@media (max-width: 767px) {
  .faq-section, body.about-us-page .faq-section, body.digital-marketing-page .faq-section, body.seo-page .faq-section, body.web-development-page .faq-section { height: auto; min-height: 0; padding: 79px 0 0; border-top: 1px solid rgba(0,0,0,.1); }
  /* Web development sits flush against the section above it -- in the static
     build its own page rule comes after this one and zeroes the margin, but
     here the block's breakpoints load last, so the margin is split out and the
     page simply left off the list. */
  .faq-section, body.about-us-page .faq-section, body.digital-marketing-page .faq-section, body.seo-page .faq-section { margin-top: 78px; }
  .faq-section .section-intro .eyebrow { margin-top: 0; padding-inline: 24px; font-size: 14px; }
  .faq-section .section-intro h2, body.about-us-page .faq-section .section-intro h2, body.digital-marketing-page .faq-section .section-intro h2, body.web-development-page .faq-section .section-intro h2 { width: min(100%,208px); margin: 28px auto 0; font-size: 32px; line-height: 32px; }
  .faq-section .section-intro h2 em { display: inline; }
  .faq-list, body.about-us-page .faq-list, body.digital-marketing-page .faq-list, body.web-development-page .faq-list { width: calc(100% - 32px); margin: 32px auto 0; }
  .faq-list summary, body.digital-marketing-page .faq-list summary, body.web-development-page .faq-list summary { padding: 23px 32px 19px 8px; font-size: 20px; font-weight: 400; line-height: 24px; }
  .faq-list details[open] summary { padding-bottom: 9px; }
  .faq-list summary::after { top: 27px; right: 8px; width: 10px; height: 10px; }
  .faq-list details p, body.digital-marketing-page .faq-list details p, body.web-development-page .faq-list details p { margin: 3px 8px 17px; font-size: 16px; line-height: 24px; }
}

@media (max-width: 900px) {
  body.web-development-page .faq-section .eyebrow { width: auto; height: 30px; min-height: 30px; padding: 0 12px; gap: 10px; font-size: 14px; line-height: 24px; }
  body.web-development-page .faq-section .eyebrow { width: 92px; padding: 0; }
  body.web-development-page .faq-section { padding: 65px 0 27px; }
  body.web-development-page .faq-section .section-intro h2 { width: auto; margin-top: 27.2px; font-size: 32px; line-height: 32px; }
  body.web-development-page .faq-section .section-intro h2 em { line-height: 32px; }
  body.web-development-page .faq-list { width: auto; margin: 37px 16px 0; border-top: 0; }
  body.web-development-page .faq-list details:last-child { margin-bottom: 0; }
  body.web-development-page .faq-list details { margin-bottom: 16px; border: 1px solid var(--wd-hair); background: #fff; }
  body.web-development-page .faq-list details[open] { padding-bottom: 0; }
  body.web-development-page .faq-list summary { padding: 18px 44px 18px 12px; font-size: 20px; line-height: 24px; }
  body.web-development-page .faq-list details[open] summary { padding-bottom: 8px; }
  body.web-development-page .faq-list summary::after { top: 24px; right: 16px; }
  body.web-development-page .faq-list details p { width: auto; margin: 0 12px 18px; font-size: 16px; line-height: 24px; }
  body.email-marketing-page .faq-section { margin-top: 80px; }
}
