:root{
  --paper:#faf8f4;
  --navy:#16243b;
  --gold:#a8842c;
  --ink:#222a33;
  --muted:#5c6573;
  --rule:#e6e1d8;
  --serif:"Fraunces",Georgia,"Times New Roman",serif;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box;}
html{font-size:16px;-webkit-text-size-adjust:100%;}
html,body{margin:0;padding:0;}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{max-width:100%;}

/* liquid full-width container, no max-width cap anywhere */
.wrap{
  width:100%;
  padding-inline:clamp(20px,5vw,80px);
}

.masthead{
  background:var(--paper);
  border-bottom:1px solid var(--rule);
}
.masthead .wrap{
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  justify-content:space-between;
  gap:6px 24px;
  padding-block:26px 20px;
}
.logo{
  font-family:var(--serif);
  font-weight:600;
  font-size:clamp(1.35rem,2.2vw,1.7rem);
  letter-spacing:-0.012em;
  color:var(--navy);
  line-height:1;
}
.logo-tld{color:var(--gold);}
.tagline{
  margin:0;
  font-size:0.72rem;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:0.16em;
  color:var(--muted);
}

/* HERO: image stretches to match the text column height */
.hero{padding-block:clamp(28px,4vw,56px);}
.hero-grid{
  display:flex;
  align-items:stretch;
  gap:clamp(24px,3vw,52px);
  min-height:clamp(300px,32vw,440px);
}
.hero-image{
  flex:0 0 55%;
  max-width:55%;
  min-width:0;
  overflow:hidden;
}
.hero-image img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}
.hero-text{
  flex:1 1 auto;
  min-width:0;
  display:flex;
  flex-direction:column;
}
.hero-kicker{
  display:inline-flex;
  align-items:center;
  gap:12px;
  font-size:0.72rem;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:0.18em;
  color:var(--gold);
  margin-bottom:22px;
}
.hero-kicker::before{
  content:"";
  width:34px;
  height:2px;
  background:var(--gold);
}
.hero-statement{
  margin:0;
  font-family:var(--serif);
  font-weight:400;
  font-size:clamp(1.05rem,1vw,1.25rem);
  line-height:1.55;
  letter-spacing:-0.003em;
  color:var(--navy);
}
.hero-meta{
  margin-top:auto;
  padding-top:18px;
  border-top:1px solid var(--rule);
  font-size:0.7rem;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:0.14em;
  color:var(--muted);
}

/* FEATURE: fully liquid, no width cap */
.feature{
  border-top:1px solid var(--rule);
  padding-block:clamp(38px,5vw,68px);
}
.feature-kicker{
  display:inline-block;
  font-size:0.72rem;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:0.18em;
  color:var(--gold);
  margin-bottom:18px;
}
article h1{
  font-family:var(--serif);
  font-weight:500;
  color:var(--navy);
  font-size:clamp(1.7rem,3vw,2.4rem);
  line-height:1.16;
  letter-spacing:-0.016em;
  margin:0 0 26px;
}
article h2{
  font-family:var(--serif);
  font-weight:500;
  color:var(--navy);
  font-size:clamp(1.3rem,2vw,1.6rem);
  line-height:1.26;
  letter-spacing:-0.008em;
  margin:42px 0 14px;
}
article h3{
  font-family:var(--serif);
  font-weight:500;
  color:var(--navy);
  font-size:clamp(1.12rem,1.6vw,1.3rem);
  line-height:1.3;
  margin:34px 0 12px;
}
article h4{
  font-family:var(--sans);
  font-size:0.76rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:0.12em;
  color:var(--gold);
  margin:38px 0 12px;
}
article p{
  font-size:1.05rem;
  line-height:1.72;
  color:var(--ink);
  margin:0 0 1.15em;
}
article p:first-of-type{
  font-size:1.22rem;
  line-height:1.6;
  color:#2a3545;
}
.empty{color:var(--muted);}

.site-footer{
  background:var(--navy);
  color:#c7d0dc;
  margin-top:clamp(44px,6vw,76px);
}
.site-footer .wrap{
  padding-block:clamp(34px,4vw,54px) clamp(28px,4vw,44px);
}
.footer-logo{
  font-family:var(--serif);
  font-weight:600;
  font-size:1.3rem;
  color:#fff;
  line-height:1;
}
.footer-logo .logo-tld{color:var(--gold);}
.footer-note{
  margin:14px 0 0;
  max-width:52ch;
  font-size:0.92rem;
  line-height:1.6;
  color:#aab5c3;
}
.footer-rule{
  height:1px;
  background:rgba(255,255,255,0.12);
  margin:26px 0;
}
.footer-copy{
  margin:0;
  font-size:0.7rem;
  font-weight:500;
  text-transform:uppercase;
  letter-spacing:0.1em;
  color:#8995a6;
}

@media (max-width:760px){
  .hero-grid{
    flex-direction:column;
    align-items:stretch;
    min-height:0;
    gap:20px;
  }
  .hero-image,
  .hero-text{
    flex:none;
    max-width:100%;
  }
  .hero-image img{
    aspect-ratio:3/2;
    height:auto;
  }
  .hero-meta{margin-top:22px;}
  article p:first-of-type{font-size:1.12rem;}
}