/* Kenya Data Atlas — mobile optimization layer (28 Aug 2026)
 * Loaded last so phone ergonomics can be improved without weakening the
 * evidence/data contracts owned by the component stylesheets.
 */

html{scroll-padding-top:88px}
body{overflow-x:clip}
img,svg{max-width:100%}
.section,[data-view]{scroll-margin-top:86px}

@media(max-width:760px){
  :root{--mobile-gutter:1rem;--mobile-header:64px}
  html{scroll-padding-top:calc(var(--mobile-header) + 12px)}
  body{font-size:15px;-webkit-text-size-adjust:100%;text-size-adjust:100%}
  body:has(#main-nav.open){overflow:hidden}

  /* Header and navigation */
  .demo-banner{padding:.42rem var(--mobile-gutter);font-size:.62rem;line-height:1.35}
  .demo-banner span{display:block;margin:0 0 .08rem;font-size:.58rem}
  .site-header{height:var(--mobile-header);padding:0 var(--mobile-gutter);gap:.55rem}
  .brand{font-size:1rem;gap:.55rem;min-width:0}
  .brand-mark{grid-template-columns:repeat(3,4px);gap:2px}
  .brand-mark i{width:4px;height:23px}
  .menu-button,.header-search{min-width:44px;min-height:44px;display:inline-grid;place-items:center;padding:.45rem .75rem;touch-action:manipulation}
  .menu-button{margin-left:auto}
  .header-search{padding:.45rem;width:44px}
  .site-header nav{display:none;position:absolute;top:100%;left:0;right:0;max-height:calc(100dvh - var(--mobile-header) - env(safe-area-inset-bottom));overflow:auto;overscroll-behavior:contain;padding:.55rem var(--mobile-gutter) calc(.75rem + env(safe-area-inset-bottom));gap:0;background:rgba(255,255,255,.985);border-top:1px solid var(--line);border-bottom:1px solid var(--line);box-shadow:0 18px 40px rgba(22,43,35,.14);backdrop-filter:blur(16px)}
  .site-header nav.open{display:flex}
  .site-header nav a{display:flex;align-items:center;min-height:50px;padding:.25rem .65rem;border-bottom:1px solid #eef0ed;font-size:.92rem}
  .site-header nav a:last-child{border-bottom:0}
  .site-header nav a.active,.site-header nav a[aria-current="page"]{background:#eff4f0;color:var(--green2);border-radius:8px;padding-left:.8rem}

  /* Shared phone rhythm and touch ergonomics */
  button,select,input{touch-action:manipulation}
  select,input{font-size:16px}
  .section{padding:3rem var(--mobile-gutter)}
  .section-heading{gap:1rem;margin-bottom:1.55rem}
  .section-heading>p{font-size:.86rem;line-height:1.55}
  .section-heading h2,.profile-head h2,.catalogue-copy h2{font-size:clamp(2.25rem,10vw,3rem);line-height:1}
  .eyebrow{font-size:.65rem;margin-bottom:.7rem}
  .primary-button,.outline-button,.profile-actions button,.compare-panel-actions button{min-height:44px}
  .select-label select,.ranking-toolbar select{min-height:46px;width:100%}
  .text-link{min-height:44px;text-align:left}

  /* Home */
  .hero{padding:2.8rem var(--mobile-gutter) 2.6rem;gap:2rem;min-height:auto;background:radial-gradient(circle at 90% 9%,#e3ece6 0,transparent 25%),linear-gradient(150deg,#f8f7f1,#eef3ee)}
  .hero:after{width:150px;height:150px;right:-85px;top:18px}
  .hero h1{font-size:clamp(2.9rem,13.5vw,4.15rem);line-height:.93;letter-spacing:-.04em}
  .hero-intro{font-size:.98rem;line-height:1.6;margin:1.2rem 0 1.5rem}
  .search-box{height:58px;padding:0 .9rem;border-radius:9px}
  .search-shell>p{line-height:1.55}
  .search-results{top:94px;max-height:min(62dvh,440px);overflow:auto;overscroll-behavior:contain}
  .search-result{min-height:52px;padding:.72rem .85rem;gap:.75rem;align-items:center}
  .search-result small{font-size:.66rem;text-align:right}
  .hierarchy{margin-top:1.35rem;gap:.38rem;font-size:.7rem}
  .hierarchy span{padding:.36rem .58rem}
  .pulse-card{padding:1.4rem;border-radius:10px;transform:none}
  .metric-label{margin-top:1.45rem}
  .feature-value{font-size:clamp(4rem,19vw,5rem)}
  .pulse-card dl{gap:.8rem}
  .sparkline{height:78px;margin:1.1rem 0}

  /* Cards and profile */
  .metric-grid{grid-template-columns:1fr}
  .metric-card,.home-glance .metric-card,[data-view="pulse"] .metric-card{min-height:138px;padding:1.05rem 1rem}
  .metric-card strong,.home-glance .metric-card strong,[data-view="pulse"] .metric-card strong{font-size:1.85rem;margin:.4rem 0}
  .metric-card .label{display:block;max-width:72%;font-size:.75rem}
  .metric-card small{margin-top:.9rem;font-size:.64rem;line-height:1.45}
  .metric-card .badge{top:.8rem;right:.8rem}
  .profile-head{gap:1rem}
  .profile-head>div:first-child{width:100%}
  .profile-head .select-label{width:100%;margin-top:.8rem!important}
  .profile-actions{width:100%}
  .profile-actions button{width:100%}
  .topic-tabs{gap:.2rem;margin-inline:calc(-1 * var(--mobile-gutter));padding:0 var(--mobile-gutter);scroll-snap-type:x proximity;overscroll-behavior-x:contain;scrollbar-width:none}
  .topic-tabs::-webkit-scrollbar{display:none}
  .topic-tabs button{min-height:46px;padding:.8rem .75rem;scroll-snap-align:start}
  .quick-facts{margin:1.35rem 0;grid-template-columns:1fr;border-bottom:0}
  .quick-facts article{min-height:118px;padding:1.05rem;border-right:0;border-bottom:1px solid var(--line)}
  .quick-facts strong{font-size:1.65rem}
  .profile-lower{gap:1rem}
  .chart-card,.availability-card{padding:1.1rem}
  .card-head h3,.availability-card h3{font-size:1.55rem}
  .line-chart{height:210px}
  .line-chart svg{height:170px}

  /* Explore: keep map primary, then a bounded ranking list */
  .geo-section{padding:2rem .75rem}
  .geo-workspace{gap:.85rem}
  .geo-context-rail{padding:1rem;border-radius:10px}
  .geo-context-rail .geo-header h2{font-size:1.5rem}
  .geo-context-rail .select-label{margin-top:1rem}
  .geo-context-rail .geo-breadcrumb{margin:.8rem 0 0;padding-top:.8rem;gap:.25rem}
  .geo-breadcrumb button{min-height:38px;padding:.35rem .38rem}
  .geo-layout{gap:.8rem!important}
  .geo-map-panel{padding:.55rem!important;border-radius:10px}
  .geo-map-wrap{min-height:0}
  #geo-svg{height:min(54svh,460px)!important;min-height:300px!important;max-height:460px!important;aspect-ratio:auto}
  .geo-map-meta{padding:.5rem .5rem .12rem;min-height:0}
  .geo-map-meta .geo-legend{gap:.24rem .45rem!important;overflow-x:auto;flex-wrap:nowrap!important;padding-bottom:.25rem!important;scrollbar-width:none}
  .geo-map-meta .geo-legend::-webkit-scrollbar{display:none}
  .geo-map-meta .geo-legend-item{font-size:.58rem;white-space:nowrap}
  .geo-map-meta #geo-source-note{font-size:.59rem!important;line-height:1.45}
  .geo-ranking-panel{max-height:340px;padding:.85rem;border-radius:10px}
  .geo-ranking-list{max-height:276px;-webkit-overflow-scrolling:touch}
  .geo-ranking-list button{min-height:48px;padding:.65rem .15rem;grid-template-columns:1.7rem minmax(0,1fr) auto;gap:.45rem;font-size:.78rem}
  .geo-selected-summary.kda-card,.geo-selected-summary{margin-top:.8rem;padding:1.05rem;gap:.85rem;grid-template-columns:repeat(2,minmax(0,1fr))}
  .geo-selected-summary h4{font-size:1.35rem}
  .geo-selected-summary dd{font-size:1.15rem}
  .geo-tooltip{max-width:calc(100% - 18px);font-size:.68rem}

  /* Compare: remove desktop-width assumptions and nested vertical scrolling. */
  .compare-hub{padding-left:var(--mobile-gutter)!important;padding-right:var(--mobile-gutter)!important}
  .compare-mode-switch{top:calc(var(--mobile-header) + .35rem);width:100%;margin-bottom:1rem;overflow:hidden}
  .compare-mode-switch button{flex:1;min-height:44px;padding:.58rem .45rem;font-size:.76rem}
  .compare-panel{margin-inline:calc(-1 * var(--mobile-gutter));border-left:0;border-right:0;box-shadow:none}
  .compare-panel-head{padding:1.1rem var(--mobile-gutter);gap:1rem}
  .compare-panel-head h3{font-size:1.7rem}
  .compare-panel-actions{width:100%}
  .compare-panel-actions button{flex:1}
  .compare-place-strip{padding:.85rem var(--mobile-gutter);gap:.65rem;scroll-snap-type:x proximity;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
  .compare-place-card{min-width:min(82vw,285px);scroll-snap-align:start}
  .compare-coverage-note{padding:.85rem var(--mobile-gutter);line-height:1.5}
  .compare-tools{padding:.8rem var(--mobile-gutter);gap:.8rem}
  .compare-topic-filters{overflow-x:auto;flex-wrap:nowrap;padding-bottom:.2rem;scrollbar-width:none}
  .compare-topic-filters::-webkit-scrollbar{display:none}
  .compare-topic-filters button{white-space:nowrap;min-height:40px}
  .compare-search input{min-height:44px}
  .compare-matrix-wrap{max-height:none;overflow:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
  .compare-matrix{min-width:610px}
  .compare-matrix th,.compare-matrix td{padding:.8rem .75rem}
  .compare-matrix th:first-child,.compare-matrix td:first-child{min-width:155px;max-width:170px}
  .compare-matrix th:not(:first-child){min-width:150px}
  .compare-metric-name{font-size:.75rem}
  .compare-metric-meta,.compare-cell-meta{font-size:.58rem}
  .compare-cell-value{font-size:1.3rem}
  .compare-life-controls{padding:1rem var(--mobile-gutter);grid-template-columns:1fr;gap:.7rem}
  .compare-life-controls select{min-height:46px}
  .compare-life-controls .swap-life{width:48px;min-width:48px;height:44px;justify-self:center;border-radius:99px}
  .life-hero{padding:1.35rem var(--mobile-gutter);gap:1rem}
  .life-hero h3{font-size:clamp(2.2rem,11vw,3.15rem)}
  .life-card{padding:1.1rem var(--mobile-gutter);min-height:150px}
  .life-topic-head,.life-limitations{padding-left:var(--mobile-gutter);padding-right:var(--mobile-gutter)}

  /* Series */
  .series-card{border-left:0;border-right:0;margin-inline:calc(-1 * var(--mobile-gutter))}
  .series-side{padding:1.25rem var(--mobile-gutter)}
  .series-side>p{margin-top:1.25rem}
  .series-side h3{font-size:1.75rem}
  .series-value{font-size:3.35rem}
  .range-buttons{display:grid;grid-template-columns:repeat(4,1fr);margin-top:1.25rem}
  .range-buttons button{min-height:42px}
  .series-main{padding:1rem var(--mobile-gutter)}
  .series-toolbar{align-items:stretch;flex-direction:column}
  .series-toolbar select{width:100%;min-height:44px}
  .series-toolbar>div:last-child{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}
  .series-toolbar button{min-height:42px}
  .large-chart{margin:.65rem 0}
  .large-chart svg{height:190px}
  .current-point{top:28%;font-size:.6rem}
  .series-meta{grid-template-columns:1fr 1fr;gap:.75rem;font-size:.66rem}
  .series-meta span{min-width:0;overflow-wrap:anywhere}

  /* CountyIQ: retain density without turning four metrics into a long feed. */
  .countyiq-route{min-height:calc(100vh - var(--mobile-header))}
  .ciq-hero{padding:2.7rem var(--mobile-gutter) 1.5rem;gap:1.25rem}
  .ciq-hero h1{font-size:clamp(2.8rem,13vw,3.8rem)}
  .ciq-intro{font-size:.9rem;line-height:1.55}
  .ciq-controls{padding:1rem;border-radius:10px}
  .ciq-controls select{min-height:46px;font-size:16px}
  .ciq-body{padding:0 var(--mobile-gutter) 3.5rem}
  .ciq-principle{gap:.65rem;margin-bottom:1rem;font-size:.72rem}
  .ciq-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ciq-metric{min-height:145px;padding:1rem .85rem}
  .ciq-metric .label{font-size:.67rem;padding-right:2.2rem}
  .ciq-metric strong{font-size:1.65rem}
  .ciq-metric small{font-size:.58rem;margin-top:.7rem}
  .ciq-grid{gap:.85rem;margin-top:.85rem}
  .ciq-card{padding:1rem;border-radius:10px}
  .ciq-card-head{gap:.7rem;margin-bottom:.8rem}
  .ciq-card-head h2{font-size:1.55rem!important}
  .ciq-trend svg{min-height:190px}
  .ciq-years{font-size:.58rem}
  .ciq-fiscal{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ciq-fiscal div{padding:.9rem .75rem}
  .ciq-fiscal strong{font-size:1.25rem}

  /* Data catalogue and footer */
  .catalogue-section{gap:2rem}
  .coverage{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem}
  .coverage strong{font-size:1.55rem}
  .dataset{grid-template-columns:40px minmax(0,1fr) 40px;gap:.75rem;padding:1rem .85rem}
  .dataset-icon{width:38px;height:38px}
  .dataset h3{line-height:1.3}
  .dataset p{line-height:1.5}
  .dataset>button{width:40px;height:44px;padding:0}
  footer{padding:2.4rem var(--mobile-gutter) calc(2.4rem + env(safe-area-inset-bottom));gap:1.5rem}
  .footer-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.45rem 1rem}
  .footer-links a{min-height:40px;display:flex;align-items:center}
  .toast{left:var(--mobile-gutter);right:var(--mobile-gutter);bottom:calc(var(--mobile-gutter) + env(safe-area-inset-bottom));max-width:none}
}

@media(max-width:430px){
  .metric-card .label{max-width:68%}
  #geo-svg{height:min(50svh,390px)!important;min-height:285px!important}
  .geo-selected-summary.kda-card,.geo-selected-summary{grid-template-columns:1fr}
  .compare-matrix{min-width:560px}
  .compare-matrix th:first-child,.compare-matrix td:first-child{min-width:140px;max-width:150px}
  .compare-matrix th:not(:first-child){min-width:140px}
  .ciq-metrics{grid-template-columns:1fr 1fr!important}
  .ciq-metric{min-height:138px}
  .ciq-fiscal{grid-template-columns:1fr 1fr!important}
  .coverage{grid-template-columns:1fr 1fr}
  .coverage>div:last-child{grid-column:1/-1}
}

@media(max-width:350px){
  :root{--mobile-gutter:.8rem}
  .brand{font-size:.92rem}
  .hero h1{font-size:2.75rem}
  .ciq-metrics,.ciq-fiscal{grid-template-columns:1fr!important}
  .footer-links{grid-template-columns:1fr}
}

@media(pointer:coarse){
  .metric-card.kda-card:hover,.quick-facts article.kda-card:hover,.dataset.kda-card:hover{transform:none;box-shadow:none}
  .geo-ranking-list button:hover,.geo-ranking-list button.hovered{transform:none}
}

/* CountyIQ mobile screenshot hardening — 29 Aug 2026 */
@media(max-width:760px){
  /* Keep the opening screen compact and make the searchable county control read as one control. */
  .ciq-hero{padding-top:2.15rem;gap:1rem}
  .ciq-hero h1{font-size:clamp(2.65rem,12vw,3.55rem);line-height:.94}
  .ciq-intro{margin-top:.85rem}
  .ciq-controls{padding:.85rem}
  .ciq-controls label{position:relative}
  .ciq-controls select{padding-right:3.45rem}
  .ciq-controls .kda-select-search-trigger{position:absolute;right:.3rem;bottom:.3rem;width:40px;height:40px;min-width:40px;margin:0;padding:0;display:grid;place-items:center;border-radius:8px;background:#f6f4ed;z-index:2}
  .ciq-mode{margin-top:.55rem}

  /* Reduce unnecessary vertical travel without reducing the evidence shown. */
  .ciq-place-facts,.kda-place-facts{margin:1rem 0;padding:.95rem}
  .kda-place-facts-grid{gap:.5rem}
  .kda-place-fact{min-width:0}
  .ciq-grid{gap:.75rem;margin-top:.75rem}
  .ciq-card{box-shadow:0 7px 22px rgba(22,43,35,.035)}
  .ciq-card-head p{max-width:none}
  .ciq-benchmarks{gap:.85rem}
  .ciq-benchmark{padding-bottom:.8rem}

  /* Fiscal summary and changes stay in compact 2-up grids on phones. */
  .ciq-fiscal-insights{grid-template-columns:repeat(2,minmax(0,1fr))!important;margin-top:.75rem}
  .ciq-fiscal-insights>div{padding:.75rem .7rem;min-height:94px}
  .ciq-fiscal-insights strong{font-size:1.12rem}
  .ciq-fiscal-history{margin-top:.85rem;overflow:visible}
  .ciq-fiscal-chart{padding:.7rem}
  .ciq-fiscal-chart svg{min-height:165px!important}

  /* Critical fix: preserve one real all-years fiscal table on mobile. */
  .ciq-fiscal-table-wrap{display:block;max-width:100%;overflow-x:auto!important;overflow-y:hidden;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;margin-top:.75rem;border-radius:.7rem;scrollbar-width:thin}
  .ciq-fiscal-table{display:table!important;width:100%!important;min-width:720px!important;border-collapse:collapse!important;font-size:.66rem!important}
  .ciq-fiscal-table thead{display:table-header-group!important}
  .ciq-fiscal-table tbody{display:table-row-group!important}
  .ciq-fiscal-table tr{display:table-row!important;width:auto!important;margin:0!important;border:0!important;background:#fff!important}
  .ciq-fiscal-table th,.ciq-fiscal-table td{display:table-cell!important;width:auto!important;padding:.62rem .5rem!important;text-align:right!important;white-space:nowrap!important;border-bottom:1px solid var(--line)!important}
  .ciq-fiscal-table td::before{content:none!important;display:none!important}
  .ciq-fiscal-table th:first-child,.ciq-fiscal-table td:first-child{position:sticky;left:0;z-index:2;text-align:left!important;min-width:82px;background:#f7f5ee!important;box-shadow:1px 0 0 var(--line)}
  .ciq-fiscal-table thead th:first-child{z-index:3}
  .ciq-fiscal-table th:nth-child(2),.ciq-fiscal-table td:nth-child(2),.ciq-fiscal-table th:nth-child(3),.ciq-fiscal-table td:nth-child(3){min-width:100px}
  .ciq-fiscal-table th:nth-child(4),.ciq-fiscal-table td:nth-child(4),.ciq-fiscal-table th:nth-child(5),.ciq-fiscal-table td:nth-child(5){min-width:92px}
  .ciq-fiscal-table th:nth-child(6),.ciq-fiscal-table td:nth-child(6){min-width:135px}
  .ciq-fiscal-table th:last-child,.ciq-fiscal-table td:last-child{min-width:70px}

  /* The five county-outcome cells are much too tall as a single-column phone feed. */
  .ciq-social-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .ciq-social-metric{padding:.8rem;min-height:118px}
  .ciq-social-metric strong{font-size:1.35rem}
  .ciq-social-metric span,.ciq-social-metric em,.ciq-social-metric a{font-size:.59rem}
}

@media(max-width:430px){
  .ciq-fiscal-insights{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .ciq-fiscal-insights>div{min-height:88px}
  .ciq-fiscal-table{min-width:680px!important}
  .ciq-social-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

@media(max-width:350px){
  .ciq-hero h1{font-size:2.55rem}
  .ciq-fiscal-insights{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .ciq-social-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .ciq-social-metric{padding:.7rem;min-height:112px}
}

