:root{
  --forest: #1F3A2E;
  --forest-deep: #15281F;
  --forest-soft: #2A4A3B;
  --cream: #F5EFE4;
  --cream-warm: #EFE7D6;
  --cream-deep: #E6DBC4;
  --gold: #C9A66B;
  --gold-soft: #D8BC8A;
  --ink: #15281F;
  --hairline: rgba(245,239,228,0.14);
  --hairline-dark: rgba(31,58,46,0.16);
  --serif: 'Instrument Serif', 'Cardo', Georgia, serif;
  --sans: 'Manrope', system-ui, sans-serif;
  --grain-opacity: .035;
}

*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--cream);
  color:var(--ink);
  font-family:var(--sans);
  font-weight:400;
  font-size:16px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}

/* Paper grain overlay */
body::before{
  content:"";
  position:fixed; inset:0;
  pointer-events:none; z-index:9999;
  opacity:var(--grain-opacity);
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 0.85 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  mix-blend-mode:multiply;
}

a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;border:0;background:none;color:inherit}

.wrap{ max-width:1380px; margin:0 auto; padding:0 40px; }
@media (max-width:720px){ .wrap{padding:0 22px} }

/* ============ Type ============ */
.eyebrow{
  font-family:var(--sans);
  font-size:11px;
  font-weight:500;
  letter-spacing:.22em;
  text-transform:uppercase;
}
.eyebrow .dot{
  display:inline-block; width:6px; height:6px; border-radius:50%;
  background:var(--gold); margin-right:10px; vertical-align:1px;
}
.display{
  font-family:var(--serif);
  font-weight:400;
  line-height:0.96;
  letter-spacing:-0.018em;
  margin:0;
}
.display em{ font-style:italic; color:var(--gold); }
.body-lg{ font-size:19px; line-height:1.55; font-weight:300; letter-spacing:.005em; }
.body{ font-size:15.5px; line-height:1.65; font-weight:400; }
.small{ font-size:12.5px; letter-spacing:.04em; }

/* ============ Buttons ============ */
.btn{
  display:inline-flex; align-items:center; gap:14px;
  padding:18px 26px 18px 28px;
  border:1px solid currentColor;
  border-radius:999px;
  font-family:var(--sans);
  font-size:13px; font-weight:500;
  letter-spacing:.14em; text-transform:uppercase;
  transition:transform .35s cubic-bezier(.2,.7,.2,1), background .3s, color .3s, border-color .3s;
  position:relative; overflow:hidden;
}
.btn .arrow{
  display:inline-block; width:18px; height:1px; background:currentColor; position:relative;
  transition:width .35s cubic-bezier(.2,.7,.2,1);
}
.btn .arrow::after{
  content:""; position:absolute; right:0; top:-3px;
  width:8px; height:8px;
  border-top:1px solid currentColor; border-right:1px solid currentColor;
  transform:rotate(45deg);
}
.btn:hover .arrow{ width:30px; }
.btn-primary{
  background:var(--gold); color:var(--forest-deep); border-color:var(--gold);
}
.btn-primary:hover{ background:var(--forest-deep); color:var(--cream); border-color:var(--forest-deep);}
.btn-ghost-light{ color:var(--cream); border-color:rgba(245,239,228,0.35); }
.btn-ghost-light:hover{ background:var(--cream); color:var(--forest-deep); border-color:var(--cream); }
.btn-ghost-dark{ color:var(--forest-deep); border-color:rgba(31,58,46,0.25); }
.btn-ghost-dark:hover{ background:var(--forest-deep); color:var(--cream); border-color:var(--forest-deep); }

/* ============ Brand mark ============ */
.brand{
  display:flex; align-items:center; gap:10px;
  font-family:var(--serif); font-size:22px; letter-spacing:-.01em;
}
.brand em{ font-style:italic; color:var(--gold); }
.brand-mark{
  width:26px; height:26px; border-radius:50%;
  border:1px solid currentColor;
  display:inline-grid; place-items:center;
  position:relative;
}
.brand-mark::before, .brand-mark::after{
  content:""; position:absolute; left:50%; top:50%;
  width:14px; height:1px; background:currentColor;
  transform:translate(-50%,-50%);
}
.brand-mark::after{ width:1px; height:14px; }