/* Mobile performance / reading pass 2026-11-06 */
.colorido-sitemap-link{text-align:center;font-size:14px;margin:12px 0}
@media (max-width:767px){
 .pagination-bar,.pagination,#applications-pagination,.nav-links{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;align-items:center}
 .pagination-bar a,.pagination-bar span:not(.pagination__total),.page-numbers,#applications-pagination a,#applications-pagination button{min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;padding:0 10px;box-sizing:border-box;font-size:16px}
 .page-numbers.current,.pagination-bar .current,#applications-pagination .active,#applications-pagination [aria-current]{font-weight:700;outline:2px solid currentColor;outline-offset:-2px}
 .colorido-app-detail main p,.colorido-app-detail main li{font-size:16px;line-height:1.7}
 .colorido-app-detail main h1{font-size:26px;line-height:1.25}
 .colorido-app-detail main h2{font-size:22px;line-height:1.3}
 .colorido-app-detail main h3{font-size:18px;line-height:1.35}
 .colorido-app-detail main img{max-width:100%;height:auto}
 .colorido-app-detail main table{display:block;overflow-x:auto}
 .colorido-app-detail main a.btn,.colorido-app-detail main button{min-height:44px}
}


/* a11y-20261106 */
/* Footer collapse: state on data-expanded (ARIA stays on the h3 toggle). */
@media (max-width: 576px) {
  .footer-section[data-collapsible]:not([aria-expanded="true"]) .footer-links {
    height: auto;
  }
  .footer-section[data-collapsible]:not([data-expanded="true"]) .footer-links {
    height: 0;
    overflow: hidden;
  }
  .footer-section[data-collapsible][data-expanded="true"] .footer-toggle {
    transform: rotate(45deg);
  }
  .footer-section[data-collapsible] .footer-links {
    overflow: hidden;
    transition: height var(--duration-slow, .35s) var(--easing-standard, ease);
  }
}

/* Copyright link: not color-only. */
.footer-bottom .bottom-inner > p > a {
  text-decoration: underline;
  text-underline-offset: 2px;
  font-weight: 600;
}

/* Heading tag changes keep prior visual size/weight. */
h3.brand-title {
  font-size: var(--h4-size);
  color: var(--text-heavy);
}
.feature-content h3 {
  font-weight: var(--font-weight-semibold);
  color: var(--brand-strong);
  font-size: var(--h4-size);
}
.process-content h3 {
  font-weight: var(--font-weight-semibold);
  font-size: var(--h4-size);
  color: var(--text-strong);
}
.contact-info .contact-item h3,
.contact-content h3 {
  font-weight: var(--font-weight-semibold);
  font-size: var(--h5-size);
  color: var(--text-strong);
}
.about-icon-item .content h3 {
  font-size: var(--h5-size);
  color: var(--text-strong);
}