/* Shared navigation and selection controls: readable at every breakpoint. */
.app-header,.site-header{gap:20px;flex-wrap:wrap}
.app-header nav,.site-header nav{display:flex;align-items:center;gap:12px;font-size:18px;line-height:1.35}
.app-header nav a,.site-header nav a{display:flex;align-items:center;justify-content:center;min-height:48px;padding:12px 18px;font-size:18px;font-weight:600;color:#eff5e9;border-radius:28px;text-align:center}
.app-header nav a.active,.site-header nav a.active{color:#f3ffde;background:#d1e8a324;border:1px solid #d1e8a359}
.home-header nav a,.hero-cta{font-size:18px;line-height:1.35}
.selector-form label,.guide-content .small-label{font-size:15px;color:#d6e6c9;letter-spacing:.4px}
.selector-form select,.guide-content select{font-size:18px;min-height:48px;line-height:1.35}
.impact-tabs button{font-size:17px;font-weight:600;min-height:46px}
.topic-video-open,.map-link,.directions{font-size:15px}
@media(max-width:1000px){
 .app-header,.site-header{padding:14px 5%;gap:12px}
 .app-header nav,.site-header nav{gap:6px}
 .app-header nav a,.site-header nav a{font-size:16px;padding:10px 12px}
 .home-header nav a,.hero-cta{font-size:16px}
 .home-header{flex-wrap:wrap}
}
@media(max-width:700px){
 .app-header,.site-header{align-items:flex-start;gap:9px;padding:11px 5%}
 .app-header nav,.site-header nav{display:grid;grid-template-columns:.65fr 1fr 1.6fr;gap:6px;width:100%}
 .app-header nav a,.site-header nav a{min-width:0;min-height:58px;padding:8px 6px;font-size:15px;line-height:1.3;border-radius:18px}
 .home-header nav a{font-size:15px;min-height:66px;line-height:1.3;padding:9px 10px;gap:6px}
 .home-header nav a span{width:20px;height:20px;font-size:16px}
 .hero-cta{font-size:16px}
 .home-scene .hero-message{top:158px}
 .selector-form label,.guide-content .small-label{font-size:13px}
 .selector-form select,.guide-content select{font-size:16px;min-height:44px;padding:10px}
 .impact-tabs button{font-size:16px;min-height:42px;padding:8px}
 .topic-video-open,.map-link,.directions{font-size:14px}
 .card-actions{gap:8px;flex-wrap:wrap}
}
@media(min-width:701px) and (max-height:450px){
 .app-header,.site-header{padding:8px 4%;gap:10px;flex-wrap:nowrap}
 .app-header .brand,.site-header .brand{font-size:20px}
 .app-header nav a,.site-header nav a{font-size:15px;padding:8px;min-height:44px}
 .home-header nav a{font-size:15px}
}