/* StudioWhole brand artwork, service information and case-study availability. */
.hero .reel-controls{left:auto;right:12px}
.reel-count{padding-right:10px}
.reel-signature{position:absolute;top:20px;left:20px;width:100px;pointer-events:none;filter:brightness(0) invert(1);mix-blend-mode:difference}
.work-availability{padding-bottom:90px}
.availability-badge{display:inline-flex;align-items:center;gap:8px;color:var(--muted);font-size:13px;line-height:1.4}
.availability-badge:before{content:'';height:6px;width:6px;background:var(--blue);border-radius:50%}
.availability-content{display:grid;grid-template-columns:1.25fr 1fr;align-items:end;gap:8vw;padding-top:24px}
.availability-content h3,.process-heading h3{font-size:clamp(38px,5vw,76px);line-height:1.06;letter-spacing:-.008em;font-weight:600}
.availability-content h3>span{color:var(--blue)}
.availability-content p,.process-heading>p{font-size:clamp(17px,1.55vw,23px);line-height:1.5;max-width:470px;color:var(--muted)}
.text-link{display:inline-flex;gap:30px;align-items:center;border-bottom:1px solid var(--ink);padding-bottom:8px;margin-top:28px;font-size:15px}
.text-link>span{font-size:24px}
.text-link:hover{color:var(--blue);border-color:var(--blue)}
.process{padding-block:0 110px}
.process-heading{display:grid;grid-template-columns:1.25fr 1fr;align-items:end;gap:8vw;padding-block:18px 55px}
.process-steps{display:grid;grid-template-columns:repeat(3,1fr);list-style:none;padding:0;margin:0;gap:36px}
.process-steps li{border-top:1px solid var(--line);padding-top:22px}
.process-steps .mono{font-size:13px;color:var(--blue)}
.process-steps h4{font-size:clamp(23px,2.1vw,32px);line-height:1.2;letter-spacing:-.008em;font-weight:550;margin:28px 0 14px}
.process-steps p{font-size:16px;line-height:1.55;color:var(--muted);max-width:360px}
.contact-email{display:inline-block;font-size:clamp(16px,1.4vw,21px);margin-top:15px;border-bottom:1px solid #ffffff70;padding-bottom:4px}
.contact-email:hover{color:var(--lime);border-color:var(--lime)}
@media(max-width:760px){
  .reel-signature{width:82px;top:16px;left:16px}
  .work .section-top{gap:20px;align-items:flex-start}
  .work-availability{padding-bottom:58px}
  .availability-content,.process-heading{grid-template-columns:1fr;gap:28px;padding-top:8px}
  .availability-content h3,.process-heading h3{font-size:clamp(38px,9.8vw,58px)}
  .availability-content p,.process-heading>p{font-size:18px}
  .process{padding-bottom:65px}
  .process-heading{padding-bottom:35px}
  .process-steps{grid-template-columns:1fr;gap:30px}
  .process-steps h4{font-size:26px;margin-top:20px}
  .process-steps p{max-width:100%}
}
