/* Touch-friendly layout and readable copy on narrow screens. */
.hero-copy,.hero-visual,.intro-grid>*,.contact-grid>*,.case-panel>*,.solution{min-width:0}
@media(max-width:760px){
  html{scroll-padding-top:100px}
  .brief-card{scroll-margin-top:104px}
  .menu{width:44px;height:44px;flex-shrink:0}
  .nav nav a{display:flex;align-items:center;min-height:44px;font-size:15px}
  .nav nav{gap:8px;padding:15px 22px}
  .button,.wizard-back,.edit-message,.text-link{min-height:44px}
  .text-link{font-size:13px}
  .hero .actions .text-link{font-size:13px}
  .hero-description{font-size:16px;line-height:1.75}
  .hero-selector button{min-height:44px;font-size:12px;padding:9px 13px}
  .hero-selector>p{font-size:12px}
  .hero-selector .illustration-note{font-size:11px}
  .hero{padding-bottom:132px}
  .intro-grid p,.principles p,.section-heading>p,.modernize p:not(.eyebrow),.steps p,.contact-grid>div>p:not(.eyebrow),.case-story>p:not(.sr-only),.case-answer p,details p{font-size:15px;line-height:1.8}
  .principles h3,.steps h3{font-size:22px}
  .service-category{font-size:10px;line-height:1.6}
  .solution p:not(.service-category){font-size:14px;line-height:1.75}
  .solution h3{font-size:24px}
  .service-num{font-size:11px}
  .beyond p,.beyond a{font-size:14px}
  .case-tabs button{min-height:52px;line-height:1.5;font-size:12px;padding:13px 10px;min-width:0}
  .case-mode{display:flex;width:100%}
  .case-mode button{min-height:44px;font-size:12px;flex:1}
  .case-story .tag{font-size:10px}
  .case-story h3{font-size:29px}
  .graphic-foot{font-size:11px}
  .graphic-caption{font-size:10px;line-height:1.7}
  .source-nodes span{font-size:11px}
  .fragment-note{font-size:13px!important}
  .time-explorer summary{min-height:65px}
  .time-explorer summary span:not(.time-icon){font-size:14px}
  .time-explorer summary small{font-size:12px}
  .time-inputs label{font-size:13px}
  .time-inputs input[type=range]{min-height:44px;margin:14px 0 20px;touch-action:pan-y}
  .time-numbers input{font-size:16px;min-height:48px}
  .time-result .eyebrow{font-size:10px}
  .time-result>p>span,.time-result>span:not(.sr-only){font-size:13px}
  .time-result .time-disclaimer{font-size:12px;line-height:1.7}
  .time-result .text-link{font-size:13px}
  .brief-card input:not([type=hidden]),.brief-card textarea,.brief-card select{font-size:16px;line-height:1.5;min-height:48px}
  .brief-card label{font-size:13px}
  .brief-card label span{font-size:12px}
  .wizard-choices button{min-height:60px;padding:16px 13px}
  .wizard-choices strong{font-size:14px;line-height:1.45}
  .wizard-choices small{font-size:12px;line-height:1.5}
  .wizard-choices .choice-simple strong{font-size:13px}
  .wizard-choices .choice-simple{min-height:48px}
  .wizard-stage,.form-eyebrow,.wizard-meta .form-eyebrow,.wizard-meta>span:last-child{font-size:11px}
  .wizard-actions .button{font-size:14px;min-height:48px}
  .wizard-back,.edit-message{font-size:13px}
  .route-hint p{font-size:13px;line-height:1.7}
  .brief-card .form-note,.result-instruction,#copy-status,.brief-card #brief-error{font-size:12px;line-height:1.7}
  .faq summary{font-size:15px;min-height:56px}
  .footer-top p,.footer-top .text-link{font-size:13px}
  .footer-bottom{font-size:11px;line-height:1.7}
  .footer-bottom a{min-height:44px;display:flex;align-items:center}
}
@media(max-width:520px){
  .solution-grid{grid-template-columns:minmax(0,1fr);gap:16px}
  .solution.featured{grid-column:auto;grid-template-columns:minmax(0,1fr);gap:20px}
  .solution{min-height:auto;padding:26px 24px 52px}
  .solution p:not(.service-category){max-width:none}
  .dashboard-art{display:none}
  .service-symbol{font-size:36px}
  .service-category{margin-top:20px}
  .service-arrow{bottom:17px;right:22px}
  .case-tabs button{flex-direction:column;justify-content:center;gap:4px;text-align:center}
  .case-tabs .tab-arrow{display:none}
  .case-graphic{padding:28px 18px}
  .result-node{width:90%;padding:19px}
  .time-body{padding:23px;gap:25px}
}
@media(max-width:380px){
  .wrap{width:calc(100% - 32px)}
  .brief-card{padding:20px}
  .hero-selector button{padding:9px 10px;font-size:11px}
  .hero-selector>div{gap:2px}
  .wizard-choices button{gap:9px;padding:14px 10px}
  .wizard-choices strong{font-size:13px}
  .wizard-choices small{font-size:11px}
  .choice-icon{width:23px}
  .wizard-actions{gap:12px}
  .wizard-actions .button{font-size:13px;padding:15px 12px}
  .time-numbers{gap:14px}
  .time-inputs label{font-size:12px}
  .hero-visual .window-content{padding:12px}
}