/* one rhythm for every page: type scale 13/15/18/20/28/44/64, spacing 16/24/48/120 */
main section{padding-block:clamp(64px,8vw,120px)}
main section[style*="padding-top:0"]{padding-top:0}
.head{margin-bottom:clamp(32px,4vw,48px)!important;gap:16px!important}
.head h2,.work-head h2,.contact h2{font-size:clamp(36px,4.6vw,64px)!important;line-height:1.02!important;letter-spacing:-.035em!important}
.lede{font-size:clamp(18px,1.4vw,20px)!important;line-height:1.5!important;max-width:62ch!important}
.cap{font-size:14.5px;line-height:1.5}
.eyebrow{font-size:12px!important;letter-spacing:.08em!important}
h3{letter-spacing:-.015em}
@media (max-width:560px){main section{padding-block:56px}.head h2,.work-head h2,.contact h2{font-size:36px!important}}

/* mobile QA fixes */
h1,h2,h3,.eyebrow,.lbl,.jobs b{text-wrap:balance}
p,.cap,.jobs p,.more p{text-wrap:pretty}
#role{padding-bottom:clamp(56px,7vw,96px)!important}
.comps img:last-child{-webkit-mask-image:linear-gradient(#000 72%,transparent);mask-image:linear-gradient(#000 72%,transparent)}
@media (max-width:560px){
  .meta b,.meta dd{overflow-wrap:anywhere}
  .code{-webkit-mask-image:linear-gradient(90deg,#000 82%,transparent);mask-image:linear-gradient(90deg,#000 82%,transparent);padding-right:40px}
  .pt{min-height:0!important;align-content:start!important;gap:12px!important}
  .vids .wide{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .vids .wide video{width:190%!important;max-width:none!important}
  .try{row-gap:56px!important}
  .dsx{padding-inline:16px!important}
  .dsx .tile{padding:16px!important}
  .motion li{grid-template-columns:28px 1fr!important;gap:4px 12px!important}
  .motion li span{grid-column:2}
}
/* review round 3 */
.sfoot{margin-top:0!important}
.char .m{padding:0!important;min-height:0!important;border-radius:0!important;background:none!important}
#partner .ph3{font-size:clamp(36px,4.6vw,64px)!important;line-height:1.02!important;letter-spacing:-.035em!important;max-width:18ch!important}
@media (min-width:861px){.rail{-webkit-mask-image:linear-gradient(90deg,#000 86%,transparent);mask-image:linear-gradient(90deg,#000 86%,transparent)}}
/* four-case nav on phones: the name already links home */
/* phones: name + Work only, cases are reached from Work and next-case links */
@media (max-width:600px){.sbar nav a{display:none}.sbar nav a[href="index.html#work"],.sbar nav a[href="#work"]{display:flex}}
