/* Progressive enhancements for navigation resilience and interaction feedback. */
.js .menu-button { display: none; }

@media (max-width: 1020px) {
  .nav-wrap { flex-wrap: wrap; padding-block: 12px; }
  .nav-links { width: 100%; flex-wrap: wrap; justify-content: flex-end; gap: 14px; }
  .js .nav-wrap { flex-wrap: nowrap; padding-block: 0; }
  .js .nav-links { display: none; width: auto; flex-wrap: nowrap; justify-content: initial; }
  .js .nav-links.is-open { display: flex; }
  .js .menu-button { display: inline-flex; }
}

@media (max-width: 720px) {
  .nav-links { justify-content: flex-start; }
  .nav-links .nav-cta { width: auto; }
  .js .nav-links { width: auto; }
}

.card, .industry, .quote { transition: transform .22s ease, box-shadow .22s ease; }
.card:hover, .industry:hover, .quote:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }
.chart { position: relative; overflow: hidden; }
.chart::after { position: absolute; right: 8%; bottom: 19%; left: 8%; height: 54%; border-top: 4px solid var(--cyan-400); border-radius: 52% 48% 0 0; content: ""; transform: skewY(-7deg); }

/* Homepage density and the non-claiming dashboard illustration. */
.page-home .section { padding-block: 84px; }
.page-home .section h2 { font-size: clamp(2rem, 3.9vw, 3.3rem); }
.chart::before { position: absolute; z-index: 1; top: 18px; right: 18px; left: 18px; padding: 12px 14px; border: 1px solid rgba(255,255,255,.13); border-radius: 11px; background:rgba(7,26,45,.32); color:#dcebf8; content:"RECENT ACTIVITY\A\A Customer follow-ups ready for review\A Inventory status monitored\A Connected systems active"; font-size:.72rem; font-weight:700; line-height:1.75; letter-spacing:.02em; white-space:pre-line; }

@media (max-width: 720px) {
  .page-home .section { padding-block: 64px; }
}

@media (max-width: 430px) {
  .nav-wrap { gap: 14px; }
  .brand { min-width: 0; font-size: 1.08rem; }
  .menu-button { flex: 0 0 auto; }
  .hero-grid, .hero-copy, .hero-panel { min-width: 0; }
  .hero .eyebrow { display: block; max-width: 100%; line-height: 1.45; white-space: normal; }
  .hero .eyebrow::before { display: inline-block; margin-right: 8px; vertical-align: middle; }
  .hero-actions { width: 100%; }
  .hero-actions .button { max-width: 100%; text-align: center; white-space: normal; }
  .hero-panel { padding: 18px; }
  .panel-top { align-items: flex-start; margin-bottom: 14px; }
  .panel-label { max-width: 58%; line-height: 1.35; }
  .live-chip { flex: 0 0 auto; padding: 6px 9px; }
  .score { gap: 14px; padding: 17px; }
  .score-circle { width: 96px; height: 96px; }
  .score-inner { width: 72px; height: 72px; }
  .score-inner strong { font-size: 1.45rem; }
  .opportunity-list { gap: 8px; margin-top: 12px; }
  .opportunity { gap: 10px; padding: 10px; }
  .opportunity-icon { width: 36px; height: 36px; border-radius:10px; font-size:.85rem; }
  .opportunity strong { font-size: .86rem; }
  .opportunity small { display:block; line-height:1.35; font-size:.73rem; }
  .impact { font-size:.72rem; }
  .trust-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .trust-grid > strong { grid-column: 1 / -1; }
  .trust-item { padding: 10px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-soft); font-size: .8rem; }
}

@media (max-width: 374px) {
  .trust-grid { grid-template-columns: 1fr; }
  .trust-grid > strong { grid-column: auto; }
  .hero-panel { padding: 16px; }
}
