/* ICODE MOBILE ABOUT + BLOG V18.1.2 */
@media (max-width: 767px){
  html,body{max-width:100%;overflow-x:hidden}

  /* BLOG: one clear card per row. */
  body .blog-grid{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:14px!important;
    width:100%!important;
    max-width:100%!important;
    padding-left:14px!important;
    padding-right:14px!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
  body .blog-grid>a{
    grid-column:1!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    min-height:0!important;
    height:auto!important;
    padding:22px 20px!important;
    border-radius:20px!important;
    text-align:left!important;
    overflow:hidden!important;
  }
  body .blog-grid>a h2{
    margin:0 0 11px!important;
    font-size:clamp(24px,7.2vw,31px)!important;
    line-height:1.08!important;
    letter-spacing:-.035em!important;
    text-align:left!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
  }
  body .blog-grid>a p{
    margin:0!important;
    font-size:14px!important;
    line-height:1.58!important;
    text-align:left!important;
    max-width:none!important;
  }
  body .blog-grid>a small,
  body .blog-grid>a b{text-align:left!important}
  body main>.portfolio-head:has(+ .blog-grid){
    width:100%!important;
    padding:104px 14px 28px!important;
    margin:0!important;
  }
  body main>.portfolio-head:has(+ .blog-grid) h1{
    font-size:clamp(40px,11vw,54px)!important;
    line-height:.98!important;
    letter-spacing:-.055em!important;
    text-align:left!important;
  }
  body .blog-grid+.pager{
    width:100%!important;
    padding:10px 14px 44px!important;
  }

  /* ABOUT: every major card group becomes a single vertical flow. */
  body .about-premium{
    width:100%!important;
    max-width:100%!important;
    overflow:hidden!important;
  }
  body .about-premium .about-hero,
  body .about-premium .about-pillar-grid,
  body .about-premium .about-capability-board,
  body .about-premium .about-method,
  body .about-premium .about-method-steps,
  body .about-premium .about-manifesto,
  body .about-premium .about-final{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    width:100%!important;
    max-width:100%!important;
  }
  body .about-premium .about-hero,
  body .about-premium .about-pillars,
  body .about-premium .about-capabilities,
  body .about-premium .about-method,
  body .about-premium .about-manifesto,
  body .about-premium .about-final{
    padding-left:14px!important;
    padding-right:14px!important;
  }
  body .about-premium .about-pillar-grid,
  body .about-premium .about-capability-board,
  body .about-premium .about-method-steps{
    gap:12px!important;
  }
  body .about-premium .about-pillar-grid>article,
  body .about-premium .about-capability-board>a,
  body .about-premium .about-method-steps>article{
    grid-column:1!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    min-height:0!important;
    height:auto!important;
    padding:22px 20px!important;
    border-radius:20px!important;
    text-align:left!important;
    overflow:hidden!important;
  }
  body .about-premium .about-pillar-grid h3,
  body .about-premium .about-capability-board h3,
  body .about-premium .about-method-steps b{
    font-size:clamp(25px,7.5vw,32px)!important;
    line-height:1.08!important;
    letter-spacing:-.035em!important;
    text-align:left!important;
    overflow-wrap:anywhere!important;
  }
  body .about-premium .about-pillar-grid p,
  body .about-premium .about-capability-board p,
  body .about-premium .about-method-steps p{
    font-size:14px!important;
    line-height:1.58!important;
    text-align:left!important;
    max-width:none!important;
  }
  body .about-premium .about-section-head{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:12px!important;
  }
  body .about-premium .about-section-head h2,
  body .about-premium .about-method-copy h2,
  body .about-premium .about-manifesto-copy h2,
  body .about-premium .about-final h2{
    font-size:clamp(35px,10vw,46px)!important;
    line-height:1!important;
    letter-spacing:-.05em!important;
    text-align:left!important;
    overflow-wrap:anywhere!important;
  }
  body .about-premium .about-section-head>p,
  body .about-premium .about-method-copy>p,
  body .about-premium .about-manifesto-copy>p,
  body .about-premium .about-final p{
    font-size:14px!important;
    line-height:1.62!important;
    text-align:left!important;
  }
  body .about-premium .about-method-copy{
    position:static!important;
    top:auto!important;
  }
  body .about-premium .about-method-steps>article{
    display:grid!important;
    grid-template-columns:42px minmax(0,1fr)!important;
    align-items:start!important;
    gap:12px!important;
  }
  body .about-premium .about-manifesto-card{
    width:100%!important;
    min-height:220px!important;
    border-radius:22px!important;
  }

  /* Current/alternate About generations: force common 2-column section/card grids to one column. */
  body main [class*="about-"][class*="-grid"],
  body main [class*="about-"][class*="-board"],
  body main [class*="about-"][class*="-steps"]{
    grid-template-columns:minmax(0,1fr)!important;
  }
  body main [class*="about-"][class*="-grid"]>article,
  body main [class*="about-"][class*="-board"]>a{
    grid-column:1!important;
    width:100%!important;
    min-width:0!important;
  }
}
@media (max-width: 380px){
  body .blog-grid>a h2{font-size:24px!important}
  body .about-premium .about-pillar-grid h3,
  body .about-premium .about-capability-board h3,
  body .about-premium .about-method-steps b{font-size:25px!important}
}
/* END ICODE MOBILE ABOUT + BLOG V18.1.2 */