/* Shared styles for static content pages (How It Works, Contact, FFL Info, Terms) */
.content-page { max-width: 860px; margin: 0 auto; padding: 48px 24px 72px; }
.content-page .breadcrumb { font-size: 13px; color: #999; margin-bottom: 18px; }
.content-page .breadcrumb a { color: var(--gold); text-decoration: none; }
.content-page h1 { font-family: 'Barlow Condensed', sans-serif; font-size: 42px; font-weight: 800; color: var(--navy); margin-bottom: 8px; line-height: 1.05; }
.content-page .lead { font-size: 17px; color: #666; line-height: 1.6; margin-bottom: 36px; }
.content-page h2 { font-family: 'Barlow Condensed', sans-serif; font-size: 26px; font-weight: 700; color: var(--navy); margin: 36px 0 12px; }
.content-page p { font-size: 15px; line-height: 1.75; color: #333; margin-bottom: 14px; }
.content-page ul, .content-page ol { margin: 0 0 18px 22px; }
.content-page li { font-size: 15px; line-height: 1.75; color: #333; margin-bottom: 7px; }
.content-page a { color: var(--gold); }
.content-page strong { color: var(--navy); }

/* Step cards (How It Works) */
.steps-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; margin: 28px 0 8px; }
.step-card { background: #fff; border: 1px solid var(--border); border-radius: 10px; padding: 24px; }
.step-card .step-num { width: 38px; height: 38px; border-radius: 50%; background: var(--gold); color: #fff; display: flex; align-items: center; justify-content: center; font-family: 'Barlow Condensed', sans-serif; font-size: 20px; font-weight: 800; margin-bottom: 14px; }
.step-card h3 { font-family: 'Barlow Condensed', sans-serif; font-size: 19px; font-weight: 700; color: var(--navy); margin-bottom: 6px; }
.step-card p { font-size: 14px; color: #666; line-height: 1.6; margin: 0; }

/* Callout / info box */
.callout { background: #fffaf0; border: 1px solid #f0d9a8; border-left: 4px solid var(--gold); border-radius: 8px; padding: 18px 20px; margin: 22px 0; }
.callout p { margin: 0; font-size: 14.5px; color: #6b5417; }

/* Contact layout */
.contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; margin-top: 8px; align-items: start; }
.contact-card { background: #fff; border: 1px solid var(--border); border-radius: 10px; padding: 22px; margin-bottom: 16px; }
.contact-card h3 { font-family: 'Barlow Condensed', sans-serif; font-size: 18px; font-weight: 700; color: var(--navy); margin-bottom: 6px; }
.contact-card p { font-size: 14px; color: #555; margin: 0; }
.contact-card a { font-weight: 600; }
.contact-form label { display: block; font-weight: 600; font-size: 13px; color: #333; margin: 14px 0 6px; }
.contact-form input, .contact-form textarea { width: 100%; box-sizing: border-box; padding: 11px 14px; border: 1px solid #ddd; border-radius: 8px; font-size: 15px; font-family: 'Inter', sans-serif; }
.contact-form input:focus, .contact-form textarea:focus { outline: none; border-color: var(--gold); }
.contact-form textarea { resize: vertical; min-height: 120px; }
.contact-form button { margin-top: 18px; background: var(--gold); color: #fff; border: none; padding: 12px 28px; border-radius: 8px; font-size: 15px; font-weight: 700; cursor: pointer; }
.contact-form button:hover { background: var(--gold-dark); }

/* Blog posts */
.post { background: #fff; border: 1px solid var(--border); border-radius: 10px; padding: 24px; margin-bottom: 18px; }
.post .post-date { font-size: 12px; color: #999; text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 6px; }
.post h3 { font-family: 'Barlow Condensed', sans-serif; font-size: 22px; font-weight: 700; color: var(--navy); margin-bottom: 8px; }
.post p { margin: 0; }

/* Fee / data tables */
.fee-table { width: 100%; border-collapse: collapse; margin: 18px 0 24px; }
.fee-table th, .fee-table td { text-align: left; padding: 12px 14px; border-bottom: 1px solid var(--border); font-size: 14px; }
.fee-table th { font-weight: 700; color: var(--navy); background: #fafafa; }

@media (max-width: 720px) {
  .steps-grid, .contact-grid { grid-template-columns: 1fr; }
  .content-page h1 { font-size: 34px; }
}
