/* =====================================================================
   Sources Unlimited: bug fixes over the Webflow export (2026-11-03)
   Loaded after Webflow's own stylesheets. Wording is unchanged: every
   rule here fixes layout, legibility, accessibility or a broken state.
   Each block names the bug it fixes; see docshandoff-2026-11-03HANDOFF.md.
   ===================================================================== */

/* F1. Hero and footer license line: line-height was 0.8em, so the line
   overlapped itself whenever it wrapped (phones, tablets). */
.pi-license-text { line-height: 1.4em; }

/* F2. Links that fell back to the browser's default blue (#0000EE):
   the phone number under "Contact Us Now" and "terms and conditions". */
.cta-1-title a,
.checkbox-label a {
  color: #66584e;
  text-decoration: underline;
  text-underline-offset: 0.15em;
  transition: color 0.2s;
}
.cta-1-title a:hover,
.checkbox-label a:hover { color: #0b0c33; }

/* F3. Consent checkbox and its label sat on different lines and were
   top-aligned; centre them on one row. */
.checkbox-field.w-checkbox {
  display: flex;
  align-items: center;
  gap: 0.75em;
  padding-left: 0;
}
.checkbox-field .w-checkbox-input { flex: none; margin: 0; }
.checkbox-field .checkbox-label { margin: 0; line-height: 1.35em; }

/* F4. Keyboard users: a visible focus ring on every interactive element
   (Webflow strips outlines on links and the custom checkbox hides focus). */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 2px solid #b69f8f;
  outline-offset: 3px;
}
.checkbox-field input[type="checkbox"]:focus-visible + .checkbox-label,
.checkbox-field input[type="checkbox"]:focus-visible ~ .checkbox-label {
  outline: 2px solid #b69f8f;
  outline-offset: 3px;
}

/* F5. Glen Cox section, desktop and tablet (480px and up; phones use the
   stacked layout in the page's own <style>): about 600px of empty white
   above "Meet the Man You Can Count On" (20em margin + 33vh padding +
   10em inner padding). The sticky photo and the scroll are kept. */
@media screen and (min-width: 480px) {
  .glen-desktop .grid-7-block-3.is-2nd {
    margin-top: 4em;
    margin-bottom: 4em;
    padding-top: 12vh;
    padding-bottom: 12vh;
  }
}
@media screen and (min-width: 480px) and (max-width: 991px) {
  .glen-desktop .grid-7-block-3.is-2nd { padding-top: 4em; padding-bottom: 4em; margin-top: 0; }
  .glen-desktop .grid-7-block-4 { padding-top: 4em; }
}

/* F6. Policy pages: list items were 14px under 16.8px paragraphs, and the
   long legal text ran at a 1.19 line height. */
.w-richtext p,
.w-richtext li {
  font-size: 1.05rem;
  line-height: 1.6;
}
.w-richtext ul { margin-bottom: 1.25em; }
.w-richtext li { margin-bottom: 0.35em; }

/* F7a. Small uppercase labels ("Integrity | Quality", the stats captions)
   rendered at 11.2px at every width; keep them at 12px or more. */
.header-subtitle,
.grid-11-text-3 { font-size: max(12px, 0.8em); }

/* ---------- Tablet and phone ---------- */
@media screen and (max-width: 767px) {
  /* F7. Small uppercase labels went down to 11.2px; keep them at 12px+. */
  .header-subtitle,
  .grid-11-text-3,
  .button-text { font-size: 12px; }

  /* F8. Footer links were 20px tall: too small to tap reliably. */
  .subfooter-text-link,
  .policy-link {
    display: inline-block;
    padding-top: 0.6em;
    padding-bottom: 0.6em;
  }
}

@media screen and (max-width: 479px) {
  /* F9. Glen Cox section on phones (stacked by the page's own <style>):
     the 10em margin and the desktop padding left ~265px of white between photo and text. */
  .glen-desktop .grid-7-block-3.is-2nd { margin-top: 0; margin-bottom: 0; }
  .glen-desktop .grid-7-block-4 { padding-top: 1.5em; padding-bottom: 2.5em; }

  /* F10. "Contact Us Now" intro was set larger (30.8px) than the heading
     above it on phones. */
  .cta-1-title { font-size: 1.45em; line-height: 1.3em; }

  /* F11. Hero license line: room between it and the buttons when wrapped. */
  .pi-license-text { padding-left: 4vw; padding-right: 4vw; }
}

/* F12. Respect reduced-motion: stop the looping background videos' motion
   being forced on people who asked for less (posters still show). */
@media (prefers-reduced-motion: reduce) {
  .w-background-video video { display: none; }
}

/* F13. The credit (CLAUDE.md, Credit): only the name links, to upward.studio. The link keeps the footer's tap target and
   focus ring; its words match the line. The theme's hover colour was near-black on the footer's near-black. */
.su-credit { color: var(--lite-brown); font-size: 0.9em; font-weight: 300; }
.su-credit .subfooter-text-link.is-2nd { font-size: 1em; }
.su-credit .subfooter-text-link.is-2nd:hover { color: #fff; }

/* F14. The form's states (assets/contact-form.js): Turnstile's slot shows nothing unless Cloudflare wants the visitor to
   tick it; Send while it sends; the note where nothing is sent. */
.su-turnstile { max-width: 100%; }
.su-turnstile.is-shown { margin-bottom: 1em; }
.form-submit-button[disabled] { opacity: 0.7; cursor: progress; }
.preview-note { margin-top: 12px; font: 13px/1.4 Lato, sans-serif; opacity: 0.8; }