.cf {
  --cf-ink: #1A1208;
  --cf-body: #4A4235;
  --cf-muted: #6A6050;
  --cf-gold: #C9A46E;
  --cf-gold-deep: #A07830;
  --cf-line: #E4DECF;
  --cf-panel: #FAF8F3;
  --cf-panel-2: #F5F2EA;
  --cf-radius: 10px;
  --cf-maxw: 860px;
  --cf-serif: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --cf-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

  max-width: var(--cf-maxw);
  margin: 0 auto;
  padding: 8px 20px 56px;
  color: var(--cf-body);
  font-family: var(--cf-sans);
  font-size: 17px;
  line-height: 1.75;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* Shared rhythm via the cascade -------------------------------------------- */
.cf h1, .cf h2 { font-family: var(--cf-serif); color: var(--cf-ink); font-weight: 500; line-height: 1.15; }
.cf p { margin: 0 0 16px; }
.cf a { color: var(--cf-gold-deep); text-decoration: none; }
.cf a:hover { text-decoration: underline; }

/* Hero --------------------------------------------------------------------- */
.cf-hero {
  padding: 40px 0 28px;
  border-bottom: 1px solid var(--cf-line);
  margin-bottom: 36px;
}
.cf-eyebrow {
  font-size: 13px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--cf-gold-deep);
  font-weight: 700;
  margin: 0 0 10px;
}
.cf-title { font-size: clamp(30px, 5vw, 46px); margin: 0 0 16px; }
.cf-lead {
  font-size: clamp(18px, 2.4vw, 21px);
  line-height: 1.6;
  color: var(--cf-ink);
  max-width: 40em;
}

/* Sections ----------------------------------------------------------------- */
.cf-section { margin: 0 0 34px; }
.cf-section > h2 {
  font-size: clamp(23px, 3vw, 30px);
  margin: 0 0 14px;
  padding-left: 14px;
  border-left: 3px solid var(--cf-gold);
}

/* Lists -------------------------------------------------------------------- */
.cf-list { list-style: none; margin: 8px 0 0; padding: 0; }
.cf-list li {
  position: relative;
  padding: 0 0 10px 26px;
  margin: 0;
}
/* dash marker drawn with a box, not a glyph */
.cf-list li::before {
  content: "";
  position: absolute;
  left: 2px;
  top: 12px;
  width: 12px;
  height: 2px;
  background: var(--cf-gold);
}

/* Note / disclaimer -------------------------------------------------------- */
.cf-note {
  font-size: 15px;
  color: var(--cf-muted);
  background: var(--cf-panel-2);
  border: 1px solid var(--cf-line);
  border-radius: var(--cf-radius);
  padding: 14px 18px;
  margin-top: 18px;
}

/* Call-to-action panel ----------------------------------------------------- */
.cf-cta {
  background: var(--cf-panel);
  border: 1px solid var(--cf-line);
  border-radius: var(--cf-radius);
  padding: 26px 26px 8px;
}
.cf-cta > h2 { border-left: 0; padding-left: 0; }

/* FAQ (native details, no JS) --------------------------------------------- */
.cf-faq { margin-top: 44px; padding-top: 8px; }
.cf-faq > h2 {
  font-family: var(--cf-serif);
  font-size: clamp(23px, 3vw, 30px);
  color: var(--cf-ink);
  text-align: center;
  margin: 0 0 22px;
}
.cf-faq-item {
  border: 1px solid var(--cf-line);
  border-radius: var(--cf-radius);
  background: #fff;
  margin: 0 0 12px;
  overflow: hidden;
}
.cf-faq-q {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  cursor: pointer;
  list-style: none;
  padding: 18px 22px;
  font-weight: 600;
  color: var(--cf-ink);
  font-size: 17px;
}
.cf-faq-q::-webkit-details-marker { display: none; }
/* plus / minus indicator using ASCII characters only */
.cf-faq-q::after {
  content: "+";
  font-family: var(--cf-serif);
  font-size: 26px;
  line-height: 1;
  color: var(--cf-gold-deep);
  flex: 0 0 auto;
}
.cf-faq-item[open] .cf-faq-q::after { content: "-"; }
.cf-faq-a { padding: 0 22px 18px; color: var(--cf-body); }
.cf-faq-a p { margin: 0; }

/* Responsive --------------------------------------------------------------- */
@media (max-width: 600px) {
  .cf { padding: 4px 16px 40px; font-size: 16px; }
  .cf-hero { padding: 28px 0 22px; margin-bottom: 28px; }
  .cf-cta { padding: 20px 18px 4px; }
  .cf-faq-q { padding: 16px 18px; }
}