/* 3ON / SmartersWeb Canada — UI/UX stabilization, 2026-10-09.
   Additive layer. Keep this file after public.css and public-v2.css. */
:root {
  --ui-space: clamp(1rem, 2.3vw, 2.25rem);
  --ui-focus: #ff7285;
  --ui-radius: 18px;
}
html { scroll-padding-top: 104px; }
body { min-width: 320px; }
.site-main, .footer, .navbar, .home-section, .section { min-width: 0; }
.site-main > * { min-width: 0; }
img, video, iframe { max-width: 100%; }
button, input, select, textarea { font: inherit; }
a, button, input, textarea, select { -webkit-tap-highlight-color: transparent; }
a:focus-visible, button:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible {
  outline: 3px solid var(--ui-focus);
  outline-offset: 3px;
}
button, .btn-gold, .btn-outline, .nav-cta { touch-action: manipulation; }
.navbar { max-width: calc(100vw - 22px); }
.nav-links { align-items: center; }
.nav-links a { min-height: 42px; display: inline-flex; align-items: center; justify-content: center; }
.nav-logo img { max-width: 100%; height: auto; object-fit: contain; }
.home-hero-title { overflow-wrap: break-word; }
.home-hero, .home-hero-content, .home-hero-left, .home-hero-right { min-width: 0; }
.home-hero-buttons { display: flex; flex-wrap: wrap; }
.home-hero-buttons > a { text-align: center; }
.home-section-header, .section-header, .footer-grid { min-width: 0; }
.home-division-card, .home-blog-card, .home-spotlight-card, .blog-card,
.division-card, .blog-featured { min-width: 0; }
.blog-article-content, .article-body { overflow-wrap: anywhere; }
.blog-article-content pre, .article-body pre { max-width: 100%; overflow: auto; }
.blog-article-content table, .article-body table { display: block; max-width: 100%; overflow-x: auto; }
.blog-article-content img, .article-body img { height: auto; }
.mobile-nav { overscroll-behavior: contain; }
.mobile-nav a { min-height: 46px; display: flex; align-items: center; }
.mobile-nav-close { min-width: 44px; min-height: 44px; }
.footer-grid > * { min-width: 0; }
.footer a { text-underline-offset: .2em; }
.footer-social a { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; }
.footer-link-button { min-height: 44px; }
[hidden] { display: none !important; }
@media (max-width: 1024px) {
  .home-hero { min-height: auto; padding-top: clamp(130px, 19vw, 170px); padding-bottom: 72px; }
  .home-hero-content { grid-template-columns: 1fr; }
  .mobile-nav { max-width: min(92vw, 380px); }
}
@media (max-width: 720px) {
  html { scroll-padding-top: 84px; }
  .navbar { top: 9px; }
  .home-hero { padding-inline: 20px; padding-top: 120px; padding-bottom: 54px; }
  .home-hero-title { line-height: 1.03; letter-spacing: -.035em; }
  .home-hero-desc { line-height: 1.65; }
  .home-hero-buttons { gap: 10px; }
  .home-hero-buttons > a { flex: 1 1 190px; }
  .home-section, .section { padding-top: 62px; padding-bottom: 62px; }
  .footer-grid, .footer-bottom { padding-inline: 20px; }
  .blog-article-content, .article-body { font-size: 1rem; line-height: 1.75; }
}
@media (max-width: 420px) {
  .home-hero-buttons > a { flex-basis: 100%; }
  .navbar { width: calc(100% - 18px); }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}
