/* Cross-site resilience layer. Keep page-specific visual design in each route. */
html {
  color-scheme: light;
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  min-width: 320px;
  overflow-wrap: anywhere;
}

header, main, nav, section, article, aside, footer,
.wrap, .nav, .menu, .hero, .layout, .row2, .cards,
.card, .formcol, form, fieldset {
  min-width: 0;
}

img, svg, video, canvas, iframe {
  max-width: 100%;
}

button, input, select, textarea {
  font: inherit;
}

button, [type="button"], [type="submit"], [role="button"], summary {
  touch-action: manipulation;
}

a, button, input, select, textarea, summary {
  -webkit-tap-highlight-color: transparent;
}

:focus-visible {
  outline: 3px solid var(--accent, var(--purple, var(--teal, #6b4f94)));
  outline-offset: 3px;
}

input[aria-invalid="true"], textarea[aria-invalid="true"], select[aria-invalid="true"],
input.err, textarea.err, select.err {
  border-color: #a94430 !important;
  box-shadow: 0 0 0 1px #a94430;
}

[role="alert"]:empty, [role="status"]:empty {
  display: none;
}

.skip-link {
  position: fixed;
  inset-block-start: 10px;
  inset-inline-start: 10px;
  z-index: 1000;
  padding: 10px 14px;
  border-radius: 8px;
  background: #fff;
  color: #2e2b33;
  box-shadow: 0 6px 20px rgba(46, 43, 51, .2);
  transform: translateY(-160%);
}

.skip-link:focus {
  transform: translateY(0);
}

@media (max-width: 640px) {
  input, select, textarea {
    font-size: 16px !important;
  }

  .wrap, .nav {
    padding-inline: clamp(18px, 5vw, 28px);
  }

  .footband {
    padding-inline: 18px;
  }

  .footband span {
    max-width: 100%;
    white-space: normal;
  }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

@media (forced-colors: active) {
  .btn, button, input, select, textarea, .card, .c, form {
    border: 1px solid CanvasText;
  }
}

@media print {
  nav, .btn, button, .footband, .back { display: none !important; }
  body { background: #fff !important; color: #000 !important; }
  * { box-shadow: none !important; }
  a { color: inherit !important; text-decoration: underline; }
}
