@font-face{
  font-family:"Inter";
  font-style:normal;
  font-weight:300;
  font-display:swap;
  src:url("inter-300.woff2") format("woff2");
}
@font-face{
  font-family:"Inter";
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url("inter-400.woff2") format("woff2");
}

:root{
  --ink:        #111111;
  --rule:       #272727;
  --text:       #ffffff;
  --text-muted: #8c8c8c;
  --text-dim:   #5e5e5e;

  --gutter: clamp(24px, 7vw, 160px);
  --stack:  clamp(88px, 12vw, 168px);
}

*{ box-sizing:border-box; margin:0; padding:0; }

html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }

body{
  background:var(--ink);
  color:var(--text);
  font-family:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  font-weight:400;
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

.wrap{ max-width:1180px; margin:0 auto; padding:0 var(--gutter); }

a{ color:inherit; }
a:focus-visible{ outline:2px solid #fff; outline-offset:4px; }

/* ---------- masthead ---------- */
.masthead{
  display:flex; align-items:center; justify-content:space-between;
  gap:24px; padding:34px 0 30px;
}
.id{ display:flex; align-items:center; gap:14px; text-decoration:none; }
.id img{ width:44px; height:auto; display:block; }
.id span{ font-size:16px; letter-spacing:.05em; font-weight:400; white-space:nowrap; }
.masthead a.mail{
  font-size:15px; color:var(--text-muted); text-decoration:none;
  border-bottom:1px solid var(--rule); padding-bottom:2px;
  transition:color .18s ease, border-color .18s ease;
}
.masthead a.mail:hover{ color:var(--text); border-color:var(--text); }

/* ---------- hero ---------- */
.hero{ padding:clamp(70px,13vw,190px) 0 clamp(80px,11vw,150px); }

h1{
  font-weight:300;
  font-size:clamp(46px, 8.2vw, 118px);
  line-height:1.02;
  letter-spacing:-.035em;
}
h1 .l2{ display:block; }

.lede{
  margin-top:clamp(34px,4.5vw,60px);
  max-width:37ch;
  font-size:clamp(18px,2.1vw,23px);
  line-height:1.55;
  color:var(--text-muted);
  font-weight:300;
}

/* brand signature — the three bars of the E, used once */
.sig{ margin-top:clamp(56px,7vw,96px); display:grid; gap:11px; }
.sig i{ display:block; height:5px; background:var(--rule); }
.sig i:nth-child(1){ width:210px; }
.sig i:nth-child(2){ width:130px; }
.sig i:nth-child(3){ width:210px; }

/* ---------- sections ---------- */
section{ padding-bottom:var(--stack); }

h2{
  font-weight:400;
  font-size:clamp(15px,1.6vw,17px);
  letter-spacing:.01em;
  color:var(--text-dim);
  padding-bottom:26px;
  border-bottom:1px solid var(--rule);
  margin-bottom:clamp(44px,5vw,68px);
}

.caps{
  display:grid;
  column-gap:clamp(40px,4.5vw,72px);
  row-gap:clamp(52px,6vw,84px);
  grid-template-columns:repeat(3,1fr);
}
.caps h3{
  font-weight:400; font-size:clamp(22px,2.4vw,29px);
  letter-spacing:-.02em; margin-bottom:16px; line-height:1.2;
}
.caps p{ color:var(--text-muted); font-size:16px; max-width:34ch; font-weight:300; }

.statement p{
  font-weight:300;
  font-size:clamp(22px,3.1vw,40px);
  line-height:1.34;
  letter-spacing:-.025em;
  max-width:26ch;
}
.statement p + p{
  margin-top:clamp(30px,3.4vw,44px);
  font-size:clamp(17px,1.8vw,20px);
  line-height:1.6;
  color:var(--text-muted);
  max-width:44ch;
  letter-spacing:0;
}

/* ---------- contact ---------- */
.contact p{ color:var(--text-muted); max-width:44ch; font-weight:300; margin-bottom:34px; }
.contact a.big{
  display:inline-block; text-decoration:none;
  font-weight:300; letter-spacing:-.03em;
  font-size:clamp(28px,5.4vw,64px); line-height:1.1;
  border-bottom:2px solid var(--rule); padding-bottom:6px;
  transition:border-color .2s ease;
  word-break:break-word;
}
.contact a.big:hover{ border-color:var(--text); }

/* ---------- legal page ---------- */
.legal{ padding-top:clamp(48px,7vw,96px); }
.legal h1{
  font-size:clamp(36px,5.4vw,68px);
  margin-bottom:clamp(20px,2.4vw,32px);
}
.legal .updated{ color:var(--text-dim); font-size:15px; margin-bottom:clamp(56px,7vw,96px); }
.legal h2{ margin-top:clamp(56px,6vw,84px); }
.legal h2:first-of-type{ margin-top:0; }
.legal p, .legal li{
  color:var(--text-muted); font-weight:300;
  max-width:64ch; font-size:16.5px;
}
.legal p + p{ margin-top:18px; }
.legal ul{ margin:18px 0 0 20px; }
.legal li{ margin-bottom:10px; }
.legal a{ color:var(--text); text-decoration:none; border-bottom:1px solid var(--text-dim); }
.legal a:hover{ border-color:var(--text); }
.legal .back{
  display:inline-block; margin-bottom:clamp(56px,7vw,90px);
  font-size:15px; color:var(--text-muted); text-decoration:none;
  border-bottom:1px solid var(--rule); padding-bottom:2px;
}
.legal .back:hover{ color:var(--text); border-color:var(--text); }

/* ---------- footer ---------- */
footer{
  border-top:1px solid var(--rule);
  padding:38px 0 60px;
  display:flex; flex-wrap:wrap; gap:14px 40px;
  justify-content:space-between;
  color:var(--text-dim); font-size:14px;
}
footer a{ color:var(--text-dim); text-decoration:none; border-bottom:1px solid transparent; }
footer a:hover{ color:var(--text-muted); border-bottom-color:var(--rule); }

/* ---------- one page-load reveal ---------- */
.reveal{ opacity:0; transform:translateY(14px); animation:rise .9s cubic-bezier(.2,.7,.2,1) forwards; }
.reveal.d1{ animation-delay:.10s; }
.reveal.d2{ animation-delay:.22s; }
@keyframes rise{ to{ opacity:1; transform:none; } }

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  .reveal{ opacity:1; transform:none; animation:none; }
  *{ transition:none !important; }
}

@media (max-width: 1000px){
  .caps{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width: 700px){
  .caps{ grid-template-columns:1fr; }
}
@media (max-width: 520px){
  .masthead a.mail{ display:none; }
  .id span{ font-size:15px; }
  .id img{ width:38px; }
  .sig i:nth-child(1),.sig i:nth-child(3){ width:150px; }
  .sig i:nth-child(2){ width:92px; }
}