/* Location pages (locations/ and locations/<city>/). Loaded after services.css. */
@media only screen and (min-width: 0rem) {
  .cs-breadcrumbs { background: #f7f7f7; padding: 0.75rem 1rem; }
  .cs-breadcrumbs ol { display: flex; flex-wrap: wrap; gap: 0.5rem; list-style: none; margin: auto; max-width: 80rem; padding: 0; font-size: 0.9375rem; color: var(--bodyTextColor); }
  .cs-breadcrumbs li + li:before { content: "/"; margin-right: 0.5rem; opacity: 0.5; }
  .cs-breadcrumbs a { color: var(--primary); text-decoration: none; }
  .cs-breadcrumbs a:hover { text-decoration: underline; }

  #location-info { background: #f7f7f7; padding: var(--sectionPadding); }
  #location-info .cs-container { display: flex; flex-direction: column; gap: clamp(2rem, 4vw, 3rem); margin: auto; max-width: 80rem; width: 100%; }
  #location-info .cs-card { background: #fff; border-radius: 1rem; box-shadow: 0 8px 30px rgba(0, 0, 0, 0.06); box-sizing: border-box; padding: clamp(1.5rem, 3vw, 2.5rem); width: 100%; }
  #location-info .cs-topper { color: var(--primary); display: block; font-size: var(--topperFontSize); font-weight: 700; letter-spacing: 0.1em; margin-bottom: 0.25rem; text-transform: uppercase; }
  #location-info .cs-title { color: var(--headerColor); font-family: var(--headerFont); font-size: clamp(1.75rem, 3vw, 2.25rem); font-weight: 400; line-height: 1.2em; margin: 0 0 1rem; }
  #location-info .cs-address { color: var(--headerColor); font-size: 1.125rem; font-style: normal; line-height: 1.5em; }
  #location-info .cs-phone { font-size: 1.125rem; margin: 0.5rem 0 0; }
  #location-info .cs-phone a, #location-info .cs-services a, #location-info .cs-links a { color: var(--primary); font-weight: 700; text-decoration: none; }
  #location-info .cs-phone a:hover, #location-info .cs-services a:hover, #location-info .cs-links a:hover { text-decoration: underline; }
  #location-info .cs-services { color: var(--bodyTextColor); margin: 0.5rem 0 1.5rem; }
  #location-info .cs-h3 { color: var(--headerColor); font-size: 1.125rem; font-weight: 700; margin: 0 0 0.5rem; }
  #location-info .cs-hours { border-collapse: collapse; width: 100%; }
  #location-info .cs-hours th, #location-info .cs-hours td { border-bottom: 1px solid #eee; color: var(--bodyTextColor); font-size: 1rem; padding: 0.4rem 0; text-align: left; }
  #location-info .cs-hours th { font-weight: 700; width: 40%; }
  #location-info .cs-note { color: var(--bodyTextColor); font-size: 0.9375rem; margin: 0.75rem 0 1.5rem; }
  #location-info .cs-actions { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-bottom: 1rem; }
  #location-info .cs-button-solid { background-color: var(--primary); box-sizing: border-box; color: #fff; display: inline-block; font-size: 1rem; font-weight: 700; line-height: clamp(2.875rem, 5.5vw, 3.5rem); margin: 0; min-width: 9.375rem; padding: 0 2rem; position: relative; text-align: center; text-decoration: none; z-index: 1; }
  #location-info .cs-button-solid:before { background: #000; content: ""; height: 100%; left: 0; opacity: 1; position: absolute; top: 0; transition: width 0.3s; width: 0; z-index: -1; }
  #location-info .cs-button-solid:hover:before { width: 100%; }
  #location-info .cs-button-outline { border: 2px solid var(--primary); box-sizing: border-box; color: var(--primary); display: inline-block; font-size: 1rem; font-weight: 700; line-height: calc(clamp(2.875rem, 5.5vw, 3.5rem) - 4px); min-width: 9.375rem; padding: 0 2rem; text-align: center; text-decoration: none; transition: background-color 0.3s, color 0.3s; }
  #location-info .cs-button-outline:hover { background-color: var(--primary); color: #fff; }
  #location-info .cs-links { color: var(--bodyTextColor); font-size: 0.9375rem; margin: 0; }
  #location-info .cs-map { border-radius: 1rem; overflow: hidden; width: 100%; }
  #location-info .cs-map iframe { aspect-ratio: 4 / 3; display: block; height: auto; width: 100%; }

  #location-faq { padding: var(--sectionPadding); }
  #location-faq .cs-container { margin: auto; max-width: 50rem; width: 100%; }
  #location-faq .cs-content { margin-bottom: 2rem; text-align: center; }
  #location-faq .cs-topper { color: var(--primary); display: block; font-size: var(--topperFontSize); font-weight: 700; letter-spacing: 0.1em; margin-bottom: 0.25rem; text-transform: uppercase; }
  #location-faq .cs-title { color: var(--headerColor); font-family: var(--headerFont); font-size: var(--headerFontSize); font-weight: 400; line-height: 1.2em; margin: 0; }
  #location-faq .cs-faq-item { border-bottom: 1px solid #e5e5e5; padding: 0.25rem 0; }
  #location-faq .cs-faq-q { color: var(--headerColor); cursor: pointer; font-size: 1.125rem; font-weight: 700; line-height: 1.4em; list-style: none; padding: 1rem 2rem 1rem 0; position: relative; }
  #location-faq .cs-faq-q::-webkit-details-marker { display: none; }
  #location-faq .cs-faq-q:after { color: var(--primary); content: "+"; font-size: 1.5rem; line-height: 1; position: absolute; right: 0; top: 50%; transform: translateY(-50%); transition: transform 0.2s; }
  #location-faq .cs-faq-item[open] .cs-faq-q:after { transform: translateY(-50%) rotate(45deg); }
  #location-faq .cs-faq-a { color: var(--bodyTextColor); font-size: var(--bodyFontSize); line-height: 1.5em; margin: 0 0 1rem; }

  #features-service .cs-h3 a { color: inherit; text-decoration: none; }
  #features-service .cs-h3 a:hover { color: var(--primary); }
  #locations-1697 .cs-h3 a { color: inherit; text-decoration: none; }
  #locations-1697 .cs-h3 a:hover { color: var(--primary); }
  #locations-1697 .cs-services { display: block; }
  #sbs-service .cs-text a { color: var(--primary); }
}
@media only screen and (min-width: 64rem) {
  #location-info .cs-container { align-items: stretch; flex-direction: row; }
  #location-info .cs-card { width: 45%; }
  #location-info .cs-map { width: 55%; }
  #location-info .cs-map iframe { aspect-ratio: auto; height: 100%; }
}
