/* ============================================================
   Harborview Law — site style-guide overrides
   Loaded after the compiled Webflow stylesheet on every page.
   Intentional divergences from the captured Webflow design live
   here (never edit the compiled harborview-law.webflow.*.css).
   ============================================================ */

/* ---- Section rhythm (the spacing standard) -------------------
   Target: every adjacent pair of sections reads with the same
   generous whitespace (~170-185px desktop, scaling down on
   smaller screens), matching the template's natural seams.

   Why these rules exist:
   - The template pulls each section up 72px (negative margin)
     and some sections use .padding-top-0 — those seams collapsed
     to ~56px. Giving flush sections 7rem top padding restores
     the standard seam (56px + 112px ≈ 168px).
   - The homepage FAQ is a custom embed inside the news section
     with only margin-top:60px of its own; 10rem brings that seam
     to the same standard. (!important beats its inline <style>.) */

.padding-section-large.padding-top-0 {
  padding-top: 7rem;
}

div.faq-container {
  margin-top: 10rem !important;
}

@media screen and (max-width: 991px) {
  .padding-section-large.padding-top-0 {
    padding-top: 5rem;
  }
  div.faq-container {
    margin-top: 7rem !important;
  }
}

@media screen and (max-width: 767px) {
  .padding-section-large.padding-top-0 {
    padding-top: 4rem;
  }
  div.faq-container {
    margin-top: 5rem !important;
  }
}

/* ---- Form success state ---------------------------------------
   Webflow's stock success banner is green (--success); the brand
   interactive color is orange. Covers all success-message variants
   (contact form + newsletter signup). */
.success-message,
.success-message-2,
.success-message-3 {
  background-color: var(--orange);
  color: var(--white);
}

/* ---- Standalone FAQ wrapper (about + profile pages) -----------
   FAQ blocks inserted outside an existing padded section get their
   own bottom breathing room; top gap comes from .faq-container's
   standard margin. */
.faq-standalone {
  padding-bottom: 7rem;
}
@media screen and (max-width: 767px) {
  .faq-standalone {
    padding-bottom: 4rem;
  }
}

/* ---- Accessibility pass (Phase 5) ------------------------------
   Screen-reader-only text for descriptive link labels. */
.u-sr-only {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* In-text links get an underline so color is not the only cue. */
p a:not(.button):not(.w-button) {
  text-decoration: underline;
}

/* Slider dots: 16px visible square, 24px touch target (padding is
   clipped out of the painted background; runtime compensates the
   dot margin so visual spacing is unchanged). */
.w-slider-dot {
  box-sizing: content-box;
  padding: 8px;
  background-clip: content-box;
}

/* Footer contact links: 24px touch target without layout shift. */
.footer-details-wrapper a.footer-link {
  display: inline-block;
  padding: 4px 0;
  margin: -4px 0;
}

/* Article body subheads: markdown ###/#### are emitted as h2/h3 for
   a correct outline; these pin the original h3/h4 element rendering. */
.article-h3 {
  font-size: 2.25rem;
  line-height: 1.3;
}
.article-h4 {
  font-size: 1.75rem;
  line-height: 1.3;
  margin-top: 1.5rem;
  margin-bottom: 1rem;
}
@media screen and (max-width: 991px) {
  .article-h3 { font-size: 1.875rem; }
  .article-h4 { font-size: 1.625rem; line-height: 1.4; }
}
@media screen and (max-width: 767px) {
  .article-h3 { font-size: 1.75rem; }
  .article-h4 { font-size: 1.5rem; line-height: 1.4; }
}

/* Contact page office tab heading: h3 for the outline, bare-h5 look. */
.u-h5 {
  color: var(--navy-blue);
  margin: 0;
  font-family: Geologica, sans-serif;
  font-size: 1.5rem;
  font-weight: 500;
  line-height: 1.3;
}
@media screen and (max-width: 991px) {
  .u-h5 { font-size: 1.375rem; line-height: 1.4; }
}
@media screen and (max-width: 767px) {
  .u-h5 { font-size: 1.25rem; line-height: 1.4; }
}