/* The Ash Counselling — Pass 3B resilience layer.
   Additive only. This file does NOT replace or modify styles.css. */

html, body { max-width: 100%; }
body { overflow-x: clip; }
main, section, .container, .nav-wrap, .footer-grid, .cookie-banner__inner, .cookie-dialog { min-width: 0; }
img, svg, video, canvas, iframe { max-width: 100%; }
iframe { display: block; width: 100%; }

/* Long URLs, email addresses and CRM-generated values must not force horizontal scrolling. */
a, p, li, dd, dt, strong, span { overflow-wrap: anywhere; }

/* Keyboard focus should never be hidden beneath a sticky header. */
:target { scroll-margin-top: 7rem; }

/* Embedded forms remain usable when zoomed or viewed on narrow screens. */
.contact-crm-embed,
.workplace-crm-embed,
.workplace-guide-form,
.workplace-guide-form__embed,
.workplace-form-card,
.workplace-library-page { min-width: 0; }

/* Legal navigation and cards can contain long email addresses. */
.legal-layout,
.legal-content,
.legal-meta-card,
.legal-toc { min-width: 0; }
.legal-meta-card strong,
.footer-grid a { overflow-wrap: anywhere; }

@media (max-width: 760px) {
  .cookie-dialog { margin: 1rem auto; max-height: calc(100dvh - 2rem); overflow: auto; }
  .cookie-category__row { align-items: center; }
  .cookie-dialog__actions .cookie-btn { flex: 1 1 100%; }
  .cookie-settings-link { min-height: 44px; padding-block: .5rem; }
}

@media (max-width: 420px) {
  .cookie-banner { left: .4rem; right: .4rem; bottom: .4rem; }
  .cookie-actions .cookie-btn { flex-basis: 100%; }
}

@supports not (overflow: clip) {
  body { overflow-x: hidden; }
}

/* Pass 3B nav accessibility patch — keep the compact menu usable at browser zoom.
   Additive only; global styles.css remains untouched. */
@media (max-width: 980px) {
  .main-nav.open {
    max-height: calc(100dvh - 100px);
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
  }
}

/* Pass 3B keyboard focus patch — make keyboard position clearly visible.
   Uses a two-ring treatment so focus remains visible on both light and dark Ash surfaces. */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 3px solid #ffffff;
  outline-offset: 2px;
  box-shadow: 0 0 0 6px #263a30;
  border-radius: 4px;
}

/* Keep focused controls from being hidden under sticky UI when the browser scrolls to them. */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  scroll-margin-block: 7rem 2rem;
}
