/* Mobile + tablet overrides. Pages tag elements with classes; inline styles need !important to be beaten. */
html{-webkit-text-size-adjust:100%;}

@media (max-width:1000px){
  .steps{grid-template-columns:repeat(2,1fr)!important;}
}

@media (max-width:820px){
  .hero{grid-template-columns:1fr!important;gap:10px!important;padding-top:30px!important;}
  .hero-art{height:auto!important;aspect-ratio:34/47;width:100%;max-width:420px;margin:0 auto;}
  .hero-art img{left:50%!important;width:94%!important;}
  .split{grid-template-columns:1fr!important;gap:26px!important;padding-top:40px!important;}
  .split-img{max-width:210px;margin:0 auto;}
  .g4{grid-template-columns:repeat(2,1fr)!important;gap:16px!important;}
}

@media (max-width:640px){
  /* gutters + margin line */
  header,main,section{padding-left:18px!important;padding-right:18px!important;}
  .mline{left:8px!important;}

  /* nav: logo + ORDER NOW on row one, links on row two; not sticky so it does not eat the screen */
  .nv{position:static!important;}
  .nv-in{flex-wrap:wrap!important;padding:10px 14px!important;gap:6px 12px!important;justify-content:center!important;}
  .nv-in::after{content:"";order:2;flex:0 0 100%;height:0;}
  .nv-logo{order:0;gap:8px!important;margin-right:auto;}
  .nv-logo span:last-child{font-size:25px!important;}
  .nv-links{display:contents!important;}
  .nv-cta{order:1;font-size:17px!important;padding:.25em .8em!important;}
  .nv-links a:not(.nv-cta){order:3;font-size:19px!important;padding:5px 6px;}

  /* home */
  .hero-h1{font-size:clamp(44px,15vw,128px)!important;}
  .hero p{font-size:21px!important;}
  .hero a{font-size:21px!important;}
  .steps{grid-template-columns:1fr!important;}
  .ctype,.ctype span{white-space:normal!important;}
  .ctype{font-size:21px!important;margin-bottom:12px!important;}
  .cpanel{padding:26px 14px 30px!important;}
  .stats{gap:8px!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;}
  .stats>div{padding:14px 4px!important;}
  .stats>div>div:last-child{font-size:15px!important;}
  .pbox{padding:34px 16px!important;}

  /* deck */
  .dk{max-width:none!important;gap:34px 26px!important;}
  .dk-i{flex:0 0 calc(50% - 13px)!important;width:calc(50% - 13px)!important;}
  .dk-cap{font-size:22px!important;margin:8px -6px 0!important;}
  .dk-h{flex-wrap:wrap;}
  .lb{padding:16px!important;}

  /* text pages */
  .dc-card{padding:20px 18px!important;}
  .dc-card p{font-size:18px!important;}
  .rb-card{padding:22px 16px!important;margin-bottom:26px!important;}
  .rb-card p,.rb-card ul,.rb-card ol{font-size:18px!important;}

  /* footer */
  footer>div{justify-content:center!important;text-align:center;}
  footer>div>div{justify-content:center;}
}