:root{
  /* Colors */
  --bg: #F5F3EA;
  --ink: #1D1A1A;
  --muted: #8D8D8D;

  /* Type scale */
  --wordmark-size: 20pt; /* Inter Tight Regular */
  --title-size: 42pt;    
  --footer-size: 9pt;    

  /* Spacing */
  --pad: 28px;
  --maxw: 1100px;
  --lockup-gap: 0.2em;   /* ≈ 1/5 'e' width */
}

/* Base */
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: 'Inter Tight', ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;
  color: var(--ink);
  background: var(--bg);
  line-height: 1.25;
  overflow:hidden;
}

/* Header lockup */
.brand{
  position:absolute;
  top:var(--pad);
  left:var(--pad);
}
.brand__lockup{
  display:inline-flex;
  align-items:center;
  gap: var(--lockup-gap);
  font-size: var(--wordmark-size);
  color: var(--ink);
}
.brand__logo{
  height: 1.4em;     
  width: auto;
  display:block;
}
.brand__wordmark{
  font-weight: 400;
  line-height: 1;
  font-size: 1em;   
}

/* Hero */
.hero{
  position:absolute;
  left:var(--pad);
  right:var(--pad);
  top:61.8vh;
  transform:translateY(-50%);
  max-width: var(--maxw);
}
.hero__title{
  font-size: var(--title-size);
  font-weight: 400;
  color: var(--ink);
  letter-spacing: -0.01em;
  line-height: 1.12;
  margin:0;
  max-width: 900px;
}
.hero__title .br{ display:block; }

/* Footer */
.legal{
  position:absolute;
  left:var(--pad);
  right:var(--pad);
  bottom:var(--pad);
  font-size: var(--footer-size);
  color: var(--muted);
}
.legal a{ color: var(--muted); text-decoration: none; border-bottom: 1px dotted currentColor; }
.legal a:hover{ opacity: .9; }