:root {
  --midnight: #121822;
  --porcelain: #FAFAF7;
  --copper: #B48A78;
  --slate: #2E3239;
}
* { box-sizing: border-box; }
html, body { margin:0; padding:0; background: var(--porcelain); color: var(--midnight); }
body { font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif; line-height:1.6; }
.container { width: min(1100px, 92%); margin: 0 auto; }

.nav { position: sticky; top:0; backdrop-filter: blur(4px); background: rgba(250,250,247,.92); border-bottom: 1px solid rgba(18,24,34,.12); z-index:100; }
.nav-wrap { display:flex; align-items:center; justify-content:space-between; padding:.65rem 0; }
.brand img { height:34px; width:auto; display:block; }
.toplinks a { color: var(--midnight); text-decoration:none; margin-left:1rem; opacity:.9; }
.toplinks a:hover { opacity:1; }
.toplinks .cta { border:1px solid var(--midnight); padding:.4rem .7rem; border-radius:8px; }

.hero { position: relative; padding: 80px 0 64px; overflow: hidden; }
.hero::before {
  content:""; position:absolute; inset:0;
  background-image: radial-gradient(circle at 1px 1px, rgba(18,24,34,.12) 1px, transparent 1px);
  background-size:22px 22px; mask-image: linear-gradient(to bottom, black 55%, transparent 100%); opacity:.35;
}
.hero-wrap { position:relative; }
.hero h1 { font-family: 'Spectral', Georgia, serif; font-weight:600; letter-spacing:.5px; font-size: clamp(28px, 4vw, 44px); margin:0 0 .5rem; }
.hero .lead { font-size: clamp(16px, 1.8vw, 20px); max-width: 780px; opacity:.95; }
.primary { display:inline-block; margin-top:1rem; padding:.7rem 1.0rem; border:1px solid var(--midnight); border-radius:10px; text-decoration:none; color:var(--midnight); }
.primary:hover { background:white; }
.hero-accent { height:2px; width:min(880px, 90%); background: var(--copper); margin: 28px auto 0; border-radius:2px; }

.divider { height:1px; width:100%; }
.divider.copper { background: var(--copper); opacity:.9; }
.divider.gradient { background: linear-gradient(to right, transparent, var(--copper), transparent); opacity:.7; }
.divider.lattice {
  background-image: linear-gradient(135deg, rgba(18,24,34,.14) 25%, transparent 25%),
                    linear-gradient(225deg, rgba(18,24,34,.14) 25%, transparent 25%);
  background-size: 8px 8px; opacity:.25;
}

.section { padding: 56px 0; }
.section.muted { background: rgba(255,255,255,.6); }
.two-col { display:grid; grid-template-columns: 1fr; gap: 1.75rem; }
@media (min-width: 900px) { .two-col { grid-template-columns: 1fr 1fr; } }

h2 { font-family: 'Spectral', Georgia, serif; font-weight:600; letter-spacing:.4px; margin:0 0 .5rem; }
h3 { font-family: 'Spectral', Georgia, serif; font-weight:600; margin:.25rem 0 .25rem; font-size:1.05rem; }

.card { background:white; border:1px solid rgba(18,24,34,.12); border-radius:14px; padding:1.1rem 1.2rem; box-shadow: 0 4px 18px rgba(0,0,0,.03); }
.checklist { list-style:none; padding:0; margin:.45rem 0 0; }
.checklist li::before { content:"• "; color: var(--copper); margin-right:.35rem; }

.grid-3 { display:grid; grid-template-columns: 1fr; gap: 1rem; margin-top: 1rem; }
@media (min-width: 900px) { .grid-3 { grid-template-columns: repeat(3, 1fr); } }
.cap-card { background:white; border:1px solid rgba(18,24,34,.12); border-radius:14px; padding:1.1rem 1.2rem; box-shadow: 0 3px 16px rgba(0,0,0,.03); min-height: 160px; }

.bullets { padding-left:1.1rem; margin:.5rem 0 0; }
.signal { align-self:start; border-left: 3px solid var(--copper); padding-left:1rem; opacity:.95; }
.signal-title { font-weight:600; letter-spacing:.4px; margin-bottom:.35rem; }

.contact a { color: var(--midnight); text-decoration: none; border-bottom:1px solid rgba(18,24,34,.2); }
.contact a:hover { border-bottom-color: var(--copper); }

.footer { padding: 36px 0 48px; }
.fineprint { font-size:.9rem; opacity:.7; text-align:center; }

@media (prefers-reduced-motion: no-preference) {
  .cap-card, .card { transition: transform .2s ease, box-shadow .2s ease; }
  .cap-card:hover { transform: translateY(-2px); box-shadow: 0 6px 24px rgba(0,0,0,.06); }
}
/* --- Enhanced Delivery Signals layout --- */
.signal-list {
  list-style: none;
  margin: 0.5rem 0 0;
  padding-left: 0;
  line-height: 1.8;
}

.signal-list li::before {
  content: "✔ ";
  color: var(--copper);
  font-weight: 600;
}

.signal {
  align-self: start;
  border-left: 3px solid var(--copper);
  padding-left: 1.2rem;
  margin-top: 0.5rem;
  background: rgba(255, 255, 255, 0.5);
  border-radius: 8px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.03);
}

.signal-title {
  font-weight: 600;
  letter-spacing: 0.4px;
  margin-bottom: 0.5rem;
}
