/* =====================================================================
   BASE
   reset, page defaults, container and the shared type helpers
   ===================================================================== */
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--bg);
  color:var(--ink-muted);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}

.container{max-width:var(--maxw);margin:0 auto;padding:0 24px}

/* ---- shared type helpers ---- */
.eyebrow{
  font-family:var(--serif);
  font-weight:400;
  font-size:14px;
  letter-spacing:3px;
  text-transform:uppercase;
  color:var(--eyebrow);
  margin-bottom:6px;
}
/* small ornament flourish under a section eyebrow (Figma: ~133×15) */
.ornament{display:block;width:134px;height:auto;margin:0 0 26px;opacity:.95}
.section-title{
  font-family:var(--serif);
  font-weight:900;
  font-size:48px;
  line-height:1.05;
  letter-spacing:-.96px;
  color:var(--ink);
  margin-bottom:24px;
}
.section-title .alt{display:block;color:var(--gold)}
.lede{
  font-size:16px;
  line-height:1.8;
  color:var(--ink-muted);
  max-width:700px;
}

/* ---- decorative divider (Figma Divider.svg, 1726px wide) ---- */
.divider-img{
  display:block;margin:48px auto;
  width:90%;max-width:1726px;height:auto;
}

/* small gold dot grid (hero corner / section accents) */
.dotgrid{
  position:absolute;display:grid;gap:18px;
  grid-template-columns:repeat(3,4px);grid-template-rows:repeat(3,4px);
  opacity:.9;pointer-events:none;
}
.dotgrid span{width:4px;height:4px;border-radius:1.5px;background:var(--dot)}

/* placeholder styling — only shown on a missing/broken image */
img.img-missing{background:#14100a;border:1px dashed rgba(201,134,58,.35)}
