@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@300;400&display=swap');

:root{
  --ink:#202020;
  --soft:#747474;
  --hair:#1f1f1f;
  --editorial:'Barlow Condensed','Arial Narrow','Helvetica Neue',Arial,sans-serif;
  --brand:'Helvetica Neue',Helvetica,Arial,-apple-system,BlinkMacSystemFont,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:#fff;color:var(--ink)}
body{-webkit-font-smoothing:antialiased;text-rendering:geometricPrecision}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}

.site-header{
  position:fixed;inset:0 0 auto 0;height:44.8px;z-index:20;
  display:flex;align-items:flex-start;justify-content:space-between;
  padding:12.6px 11.2px 0 16.8px;background:rgba(255,255,255,.97);
}
.site-nav{display:flex;gap:17.5px;align-items:flex-start}
.site-nav a,.contact-link{
  font-family:var(--editorial);font-weight:400;font-size:11.2px;line-height:1;
  letter-spacing:.18em;text-transform:uppercase;white-space:nowrap
}
.site-nav a{padding:2.1px 0 4.9px}
.site-nav a.active{border-bottom:1.4px solid var(--hair)}
.contact-link{border:1px solid var(--hair);padding:4.9px 8.4px 4.2px}

.page{min-height:100svh;width:100%;padding-top:44.8px;position:relative}

/* HOME */
.home-stage{min-height:calc(100svh - 44.8px);display:flex;justify-content:center;align-items:flex-start}
.home-composition{width:364px;text-align:center;margin-top:18.3vh}
.brandmark{font-family:var(--brand);font-weight:300;font-size:26.6px;line-height:1;letter-spacing:.015em;color:#666;white-space:nowrap}
.brandmark .dash{display:inline-block;width:40.6px;height:1px;background:#777;vertical-align:middle;margin:0 5.6px 5.6px}
.tagline{font-family:var(--editorial);font-weight:400;font-size:12.6px;line-height:1;letter-spacing:.17em;margin-top:32.2px;text-transform:uppercase}
.home-image{width:155.4px;height:176.4px;object-fit:cover;margin:16.1px auto 0}
.stats{display:flex;width:155.4px;margin:11.9px auto 0;justify-content:space-between;align-items:flex-start}
.stat{display:flex;align-items:flex-start;gap:3.5px}
.stat-number{font-family:var(--editorial);font-weight:300;font-size:18.9px;line-height:.92;letter-spacing:.01em}
.stat-label{font-family:var(--editorial);font-weight:400;font-size:6.3px;line-height:1.05;letter-spacing:.08em;text-align:left;text-transform:uppercase;margin-top:1.4px}
.disciplines{font-family:var(--editorial);font-weight:400;font-size:11.2px;line-height:1;letter-spacing:.17em;margin-top:26.6px;white-space:nowrap}

/* ABOUT */
.about-wrap{width:383.6px;margin:17.9vh auto 0}
.about-image{width:378px;height:126px;object-fit:cover;margin:0 auto}
.about-copy{font-family:var(--editorial);font-weight:300;color:#777;font-size:18.2px;line-height:1.14;letter-spacing:.09em;margin-top:16.8px}

/* FOCUS */
.focus-grid{width:596.4px;margin:27vh auto 0;display:grid;grid-template-columns:135.8px 150.5px 128.8px 144.2px;gap:13.3px}
.focus-card img{width:100%;height:139.3px;object-fit:cover}
.focus-card h2{font-family:var(--editorial);font-weight:300;color:#7a7a7a;font-size:21.7px;line-height:1.02;letter-spacing:.015em;margin:15.4px 0 2.8px}
.focus-card p{font-family:var(--editorial);font-weight:300;color:#7a7a7a;font-size:15.4px;line-height:1.35;letter-spacing:.025em;margin:0}

/* CONTACT */
.contact-wrap{width:178.5px;margin:19.8vh auto 0}
.contact-image{width:178.5px;height:183.4px;object-fit:cover}
.contact-copy{font-family:var(--editorial);font-weight:300;color:#6f6f6f;font-size:16.8px;line-height:1.9;letter-spacing:.07em;margin-top:9.1px}
.contact-copy a{display:block}

@media (max-width: 800px){
  .site-header{height:58px;padding:17px 15px 0 17px}
  .site-nav{gap:17px}
  .site-nav a,.contact-link{font-size:12px;letter-spacing:.14em}
  .site-nav a{padding-bottom:6px}
  .contact-link{padding:6px 8px 5px}
  .page{padding-top:58px}

  .home-stage{min-height:calc(100svh - 58px)}
  .home-composition{width:min(88vw,390px);margin-top:11vh}
  .brandmark{font-size:31px}
  .brandmark .dash{width:48px;margin:0 7px 7px}
  .tagline{font-size:15px;margin-top:35px;letter-spacing:.16em}
  .home-image{width:170px;height:193px;margin-top:21px}
  .stats{width:210px;margin-top:16px}
  .stat-number{font-size:24px}
  .stat-label{font-size:8px}
  .disciplines{white-space:normal;font-size:14px;line-height:1.45;letter-spacing:.15em;max-width:330px;margin:32px auto 0}

  .about-wrap{width:min(88vw,540px);margin:10vh auto 60px}
  .about-image{width:100%;height:auto;aspect-ratio:3/1;object-fit:cover}
  .about-copy{font-size:23px;line-height:1.22;letter-spacing:.065em;margin-top:24px}

  .focus-grid{width:min(88vw,520px);margin:9vh auto 64px;display:grid;grid-template-columns:1fr;gap:42px}
  .focus-card{display:grid;grid-template-columns:42% 1fr;column-gap:20px;align-items:start}
  .focus-card img{width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;grid-row:1/3}
  .focus-card h2{font-size:27px;line-height:1.03;margin:0 0 7px}
  .focus-card p{font-size:20px;line-height:1.3}

  .contact-wrap{width:min(74vw,300px);margin:11vh auto 50px}
  .contact-image{width:100%;height:auto;aspect-ratio:255/262;object-fit:cover}
  .contact-copy{font-size:23px;line-height:1.85;letter-spacing:.055em;margin-top:16px}
}

@media (max-width: 420px){
  .site-nav{gap:13px}
  .site-nav a,.contact-link{font-size:11px;letter-spacing:.11em}
  .home-composition{margin-top:9vh}
  .focus-card{grid-template-columns:40% 1fr;column-gap:16px}
  .focus-card h2{font-size:24px}
  .focus-card p{font-size:18px}
}