/* The home page is a visual index. Service and company copy lives in /services/. */
.hero-copy{padding-top:clamp(170px,19vh,255px)}
.hero h1{margin-bottom:32px}
.hero-copy .hero-services-link{min-height:66px;padding:15px 19px 15px 29px;gap:27px;border:1px solid #f2dba8;background:#e5c991;color:#12232c;font:700 clamp(16px,1.55vw,21px)/1.3 var(--serif);letter-spacing:.07em;box-shadow:0 12px 30px rgba(4,16,22,.3)}
.hero-copy .hero-services-link:hover{background:#f4dda9;color:#12232c;transform:translateY(-3px)}
.hero-services-link span{display:grid;place-items:center;width:36px;height:36px;flex:0 0 36px;border-radius:50%;background:#12232c;color:#f7e5bc;font:22px/1 var(--sans)}
.hero-services-link:focus-visible{outline:3px solid #fff;outline-offset:4px}
.sample-mobile-break{display:none}
.portfolio-work{padding-top:clamp(74px,8vw,115px)}
.portfolio-work .work-head{margin-bottom:42px}
.portfolio-work .work-head h2{margin-bottom:0}
.portfolio-work .featured-work{margin-bottom:55px}
.portfolio-columns{gap:24px}
.portfolio-columns .column-head{min-height:107px}
.portfolio-columns .column-head p{display:none}
.portfolio-columns .mini-work{padding-top:16px}
.portfolio-columns .mini-work h4{margin:15px 0 5px}
.portfolio-columns .mini-work .text-link{margin-top:11px}
.portfolio-work .industry-samples-link{margin-top:45px}
.portfolio-columns .mini-shot{height:auto;overflow:visible;background:#dbe3e3}
.portfolio-columns .mini-shot img{width:100%;height:auto;max-height:none;object-fit:contain;object-position:center}
.portfolio-columns .mini-shot figcaption{position:static;min-height:29px}
@media(max-width:720px){
  .hero-copy{padding-top:clamp(150px,19vh,195px)}
  .hero h1{margin-bottom:32px}
  .hero-copy .hero-services-link{min-height:58px;padding:11px 13px 11px 20px;gap:15px;font-size:16px}
  .hero-services-link span{width:32px;height:32px;flex-basis:32px;font-size:19px}
  .portfolio-work .work-head{margin-bottom:26px}
  .portfolio-columns{gap:16px}
  .portfolio-columns .column-head{min-height:0;padding:14px 0}
  .portfolio-columns .column-head h3{margin:7px 0}
  .portfolio-work .industry-samples-link{margin-top:34px}
}
@media(max-width:520px){.sample-mobile-break{display:block}}
@media(max-width:1050px){
  .portfolio-work .sample-gallery-copy{display:block}
  .portfolio-work .sample-gallery-copy .button{margin-top:20px}
}
@media(max-width:420px){
  .portfolio-work .sample-gallery-copy h3{font-size:28px;letter-spacing:.02em}
}
