:root{
  --paper:#f4f3f0;
  --white:#ffffff;
  --ink:#2f2f2f;
  --charcoal:#2f2f2f;
  --near-black:#111111;
  --mid:#666666;
  --line:#d4d4d4;
  --max:1180px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;line-height:1.6}
a{color:inherit;text-decoration:none}
img,video{display:block;max-width:100%}

.site-header{
  position:absolute;z-index:20;top:0;left:0;right:0;
  display:flex;align-items:center;justify-content:space-between;gap:32px;
  padding:26px max(26px,calc((100vw - var(--max))/2));
  color:#fff;
}
.logo img{width:178px;height:auto}
.site-header nav{display:flex;gap:30px;font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase}
.site-header nav a{opacity:.88}
.site-header nav a:hover{opacity:1}

.hero{
  position:relative;
  min-height:620px;
  height:min(78vh,820px);
  background:#000;
  display:flex;
  align-items:flex-end;
  overflow:hidden;
}
.hero-video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  background:#000;
}
.hero-overlay{
  position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(0,0,0,.88) 0%,rgba(0,0,0,.57) 38%,rgba(0,0,0,.08) 70%,rgba(0,0,0,.12) 100%);
  pointer-events:none;
}
.hero-copy{
  position:relative;z-index:2;
  width:100%;max-width:var(--max);margin:0 auto;
  padding:0 28px 8vh;
  color:#fff;
}
.eyebrow{margin:0 0 17px;color:#777;font-size:11px;font-weight:700;letter-spacing:.22em;text-transform:uppercase}
.eyebrow.light{color:#d8d8d8}
h1,h2{font-family:Georgia,"Times New Roman",serif;font-weight:400;letter-spacing:-.04em}
.hero h1{margin:0 0 26px;font-size:clamp(58px,7vw,96px);line-height:.94}
.hero-lede{max-width:590px;margin:0;color:#ebebeb;font-size:18px;line-height:1.65}

.section{max-width:var(--max);margin:0 auto;padding:105px 28px}
.about{display:grid;grid-template-columns:.82fr 1.18fr;gap:88px;align-items:center}
.about-photo img{width:100%;max-width:420px;margin:auto}
.about-copy h2,.services-heading h2,.candid-copy h2,.contact h2{margin:0 0 23px;font-size:clamp(40px,4.7vw,62px);line-height:1.03}
.about-copy>p:not(.eyebrow){margin:0 0 18px;color:#555;font-size:17px;line-height:1.75}

.services{background:#fff;padding:96px 28px 110px}
.services-inner{max-width:var(--max);margin:0 auto}
.services-heading{max-width:780px;margin:0 auto 56px;text-align:center}
.service-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line)}
.service-grid article{padding:30px 26px 6px;border-right:1px solid var(--line)}
.service-grid article:first-child{padding-left:0}
.service-grid article:last-child{padding-right:0;border-right:0}
.number{font-size:11px;letter-spacing:.17em;color:#888}
.service-grid h3{margin:42px 0 12px;font-size:15px;line-height:1.35;letter-spacing:.04em;text-transform:uppercase}
.service-grid p{margin:0;color:#666;font-size:14px;line-height:1.7}

.candid{display:grid;grid-template-columns:.82fr 1.18fr;background:var(--charcoal);color:#fff}
.candid-copy{display:flex;flex-direction:column;justify-content:center;padding:90px max(32px,7vw)}
.candid-copy p:last-child{max-width:430px;margin:0;color:#d7d7d7;line-height:1.75}
.candid-photo img{width:100%;height:100%;min-height:500px;object-fit:cover}

.contact{padding:98px 28px;text-align:center;background:#151515;color:#fff}
.contact h2{margin-bottom:30px;font-size:clamp(32px,3.4vw,46px)}
.contact-links{display:flex;justify-content:center;align-items:center;gap:22px;flex-wrap:wrap;font-size:18px;letter-spacing:.04em}
.contact-links a{display:inline-flex;align-items:center;gap:9px;padding-bottom:4px;border-bottom:1px solid rgba(255,255,255,.44)}
.contact-links svg{width:18px;height:18px;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.contact-links a:hover{border-color:#fff}

footer{display:flex;justify-content:space-between;gap:24px;padding:24px max(28px,calc((100vw - var(--max))/2));background:#0b0b0b;color:#888;font-size:10px;letter-spacing:.12em;text-transform:uppercase}

@media(max-width:820px){
  .site-header{padding:22px 24px}
  .logo img{width:148px}
  .site-header nav{gap:18px;font-size:10px}
  .hero{height:auto;min-height:0;aspect-ratio:16/9}
  .hero-copy{padding:0 24px 7vw}
  .hero .eyebrow{display:none}
  .hero-lede{font-size:15px;max-width:500px}
  .about{grid-template-columns:1fr;gap:46px;padding-top:80px;padding-bottom:80px}
  .about-photo img{max-width:330px}
  .service-grid{grid-template-columns:1fr 1fr}
  .service-grid article{padding:28px;border-bottom:1px solid var(--line)}
  .service-grid article:nth-child(2){border-right:0}
  .service-grid article:first-child{padding-left:28px}
  .service-grid article:last-child{padding-right:28px}
  .candid{grid-template-columns:1fr}
  .candid-photo img{min-height:360px}
}

@media(max-width:560px){
  .site-header nav a:not(:last-child){display:none}
  .hero{aspect-ratio:auto;min-height:560px}
  .hero-video{object-fit:contain}
  .hero-overlay{background:linear-gradient(0deg,rgba(0,0,0,.88) 0%,rgba(0,0,0,.15) 58%,rgba(0,0,0,.08) 100%)}
  .hero-copy{padding:0 20px 48px}
  .hero h1{font-size:52px}
  .hero-lede{font-size:15px}
  .section,.services{padding-left:20px;padding-right:20px}
  .about{padding-top:72px;padding-bottom:72px}
  .service-grid{grid-template-columns:1fr}
  .service-grid article,.service-grid article:first-child,.service-grid article:last-child{padding:26px 0;border-right:0}
  .candid-copy{padding:72px 20px}
  .contact{padding:80px 20px}
  .contact-links{gap:12px;font-size:16px}
  .contact-links span{display:none}
  .contact-links a{width:100%;border-bottom:0}
  footer{flex-direction:column;align-items:center;text-align:center;padding:24px 20px}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
}