/* OGC V2 responsive rules — canonical QA revision, 2 October 2026. */
*, *::before, *::after { box-sizing: border-box; }
body { overflow-wrap: anywhere; }
img, iframe, video, svg { max-width: 100%; }
main, section, article, div, nav, form, fieldset { min-width: 0; }
.btn, button, input, select, textarea { max-width: 100%; min-width: 0; }
.btn, .about-partner .btn { white-space: normal; overflow-wrap: anywhere; text-align: center; line-height: 1.45; }
.actions { flex-wrap: wrap; }
.hero-inner { width: min(var(--content-width), 80%); }
.about-hero-inner { width: min(95%, var(--content-width)); }
.cards { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.footer-main, .footer-bottom { gap: 20px; }
.footer-main nav { flex-wrap: wrap; }
:where(a, button, input, select, textarea):focus-visible { outline: 3px solid var(--gold-light); outline-offset: 3px; }
.site-header a[aria-current="page"] { color: var(--wine); text-decoration: underline; text-underline-offset: 6px; }
section[id], article[id] { scroll-margin-top: calc(var(--header-height) + 16px); }
@media (min-width: 901px) and (max-width: 1200px) {
  .site-header { padding-inline: 22px; }
  .site-header nav { gap: 12px; font-size: 14px; }
  .brand-logo { max-width: 180px; }
  .site-header .btn.small { padding-inline: 12px; }
}
@media (max-width: 1050px) {
  .cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .contact { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 28px; padding-inline: max(4vw, 25px); }
}
@media (max-width: 900px) {
  .menu { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 44px; min-height: 44px; color: var(--wine);}
  .site-header #nav {
    position: absolute; top: var(--header-height); left: 0; right: 0;
    display: none; flex-direction: column; align-items: stretch;
    gap: 14px; padding: 24px; background: var(--white);
    max-height: calc(100vh - var(--header-height));
    max-height: calc(100dvh - var(--header-height));
    overflow-y: auto; overscroll-behavior: contain;
    box-shadow: 0 12px 20px rgb(0 0 0 / 13%);
  }
  .site-header #nav.open { display: flex; }
  .site-header:has(#nav.open) ~ .kwan-launch { visibility: hidden; }
  .site-header #nav > a:not(.btn) { padding-block: 8px; }
}
@media (max-width: 760px) {
  .hero-inner { width: 100%; margin: 0; padding-inline: 20px; }
  .about-hero-inner { width: 100%; margin-inline: 0; }
  .cards, .contact { grid-template-columns: minmax(0, 1fr); }
  .cards article { min-height: 0; }
  .cards h3, .cards p { min-height: 0; }
  .actions .btn { width: 100%; }
  .btn { padding-inline: 16px; }
  .contact { padding-inline: 20px; }
  .contact-info-card, .service-feature-copy, .services-extra-card { padding: 24px; }
  /* Body copy only: no global justification, no heading/control overrides. */
  main p:not(.eyebrow), main li, .about-values-head .lead,
  .steps span, .exec-grid small, .visa-modal-dialog li {
    text-align: justify; text-align-last: start; text-justify: inter-word;
  }
  input, select, textarea { width: 100%; min-width: 0; }
  .visa-modal-dialog { max-height: calc(100dvh - 28px); }
  .footer-brand, .footer-logo { max-width: 100%; }
  .footer-main nav { width: 100%; }
}
@media (max-width: 390px) {
  .hero h1, .about-hero h1, .services-hero h1, .accounting-hero h1,
  .contact-page-hero h1, .legal-hero h1 { font-size: 36px; }
  .section h2, .why h2 { font-size: 30px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .services-extra-card .visa-type-trigger { transition: none; }
}