/* Homepage type: the original WYRD display face echoes the wordmark's carved
   curls; Satoshi carries the interface and reading text without competing. */
@font-face{
  font-family:"WYRD Display";
  src:url("fonts/WYRDDisplay-Regular.woff2") format("woff2");
  font-style:normal;font-weight:400;font-display:swap;
}
@font-face{
  font-family:"WYRD Sans";
  src:url("fonts/Satoshi-Variable.woff2") format("woff2");
  font-style:normal;font-weight:300 900;font-display:swap;
}
:root{
  --font-display:"WYRD Display",Georgia,serif;
  --font-body:"WYRD Sans","Haas Display",Arial,sans-serif;
}
body{font-family:var(--font-body);font-weight:400;font-synthesis:none}
button,input,select,textarea{font-family:var(--font-body)}
.hdr__nav a,.btn,.skip,.hdr__cta,.say__sub,
.services__number,.services__surface figcaption,.services__title p,
.services__detail p,.services__detail>span,
.foot__form input,.foot__links,.foot__loc,.foot__thanks{
  font-family:var(--font-body);
  font-synthesis:none;
}
.hdr__nav a{font-weight:600;letter-spacing:-.015em}
.btn,.hdr__cta{font-weight:600;letter-spacing:.015em}
.say__sub,.services__detail p,.foot__loc,.foot__thanks{font-weight:400;line-height:1.5;letter-spacing:-.015em}
.services__title p{font-weight:500;line-height:1.45;letter-spacing:0}
.services__detail>span{font-weight:600;letter-spacing:.06em}
.services__number{font-variant-numeric:tabular-nums}
.services__surface figcaption{font-weight:600;letter-spacing:-.02em}
.foot__links{font-weight:500;letter-spacing:0}

.hero h1,.orbit__heading,.orbit__still span,.say__lede,
.services__heading,.services__title h3,.work__head h2,
.brk__head,.brk__motto,.foot__motto{
  font-family:var(--font-display);
  font-weight:400;font-synthesis:none;text-transform:uppercase;
  letter-spacing:0;
}
/* The custom face carries its weight in the drawing, not artificial bold. */
.services__heading{font-size:clamp(72px,10.9vw,164px);line-height:1.02;letter-spacing:.005em}
.services__heading span{padding:.025em 0}
.services__title h3{font-size:clamp(31px,3.25vw,49px);line-height:1.13;letter-spacing:.005em}
.services__title #service-web{font-size:clamp(29px,2.85vw,43px)}
.services__detail p{font-size:clamp(16px,1.25vw,19px)}
.services__title p{font-size:12px;margin-top:10px}
.orbit__heading{font-size:clamp(26px,2.65vw,42px);line-height:1.18;letter-spacing:.008em}
.orbit__heading span{padding-block:.025em}
.orbit__copy .say__lede{font-size:clamp(34px,4.2vw,65px);line-height:1.15;max-width:20em;letter-spacing:.005em;text-wrap:balance}
.work__head h2{font-size:clamp(34px,3.5vw,60px);line-height:1.13;letter-spacing:.01em}
.brk--two .brk__motto{font-size:clamp(40px,5.3vw,86px);line-height:1.08;letter-spacing:.005em}
.foot__motto{font-size:clamp(44px,4.5vw,76px);line-height:1.12;letter-spacing:.005em}
.foot__loc,.foot__thanks{font-size:16px}

@media(min-width:768px) and (max-width:1050px){
  .services__title h3{font-size:32px}
  .services__title #service-web{font-size:29px}
  .services__detail p{font-size:16px}
}
@media(max-width:767px){
  .hdr__nav a{font-size:12px;font-weight:600;padding-inline:13px}
  .services__heading{font-size:clamp(50px,13vw,91px);line-height:1.07}
  .services__title h3{font-size:clamp(22px,5.5vw,34px);line-height:1.15}
  .services__title #service-web{font-size:clamp(21px,5.3vw,32px)}
  .services__title p{font-size:10px;margin-top:9px}
  .services__detail p{font-size:14px;line-height:1.5}
  .services__detail>span{font-size:9px}
  .orbit__heading{font-size:clamp(21px,5.2vw,30px);line-height:1.2}
  .orbit__copy .say__lede{font-size:clamp(28px,6.6vw,40px);line-height:1.17;max-width:22ch}
  .say__sub{font-size:16px;line-height:1.5}
  .work__head h2{font-size:clamp(28px,7.2vw,42px);line-height:1.14}
  .brk--two .brk__motto{font-size:clamp(33px,9vw,46px);line-height:1.1}
  .foot__motto{font-size:clamp(38px,10.4vw,56px);line-height:1.14}
  .foot__loc,.foot__thanks{font-size:15px}
}
@media(max-width:359px){
  .hdr__nav a{padding-inline:10px;font-size:11px}
  .services__title h3{font-size:20px}
  .services__title #service-web{font-size:17px}
}
