/* ============================================================
   FinAxis — Legal pages, Contact page, 404
   Reuses wc-* classes; adds prose + contact + error styling.
   ============================================================ */
.page-wrap { font-family: "Manrope", sans-serif; color: #1a1a1a; }

/* ---------- Simple page hero ---------- */
.pg-hero {
  background: linear-gradient(180deg, #f5f8f9 0%, #ffffff 100%);
  padding: 60px 0 34px; text-align: center; border-bottom: 1px solid #e6eaed;
}
.pg-hero .pg-eyebrow { text-transform: uppercase; letter-spacing: 2.5px; font-size: 13px; font-weight: 700; color: #0a9646; }
.pg-hero h1 { font-family: "DM Serif Text", serif; color: #264653; font-size: 40px; margin: 12px 0 8px; }
.pg-hero p { color: #6b7785; font-size: 16px; margin: 0; }
@media (max-width: 600px) { .pg-hero h1 { font-size: 30px; } }

/* ---------- Legal prose ---------- */
.legal-body { max-width: 820px; margin: 0 auto; padding: 46px 20px 70px; font-size: 16px; line-height: 1.75; color: #2b2f33; }
.legal-body h2 { font-family: "Manrope", sans-serif; font-weight: 700; color: #264653; font-size: 21px; margin: 34px 0 12px; }
.legal-body h3 { color: #264653; font-size: 17px; margin: 22px 0 8px; }
.legal-body p { margin: 0 0 16px; }
.legal-body ul { margin: 0 0 16px; padding-left: 22px; }
.legal-body li { margin-bottom: 8px; }
.legal-body a { color: #0a9646; font-weight: 600; }
.legal-note {
  background: #fff8e6; border-left: 4px solid #e0a82e; border-radius: 8px;
  padding: 14px 18px; font-size: 14.5px; color: #6b5a2b; margin-bottom: 26px;
}
.legal-updated { color: #98a3ab; font-size: 14px; margin-bottom: 8px; }

/* ---------- Contact ---------- */
.contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 36px; max-width: 1080px; margin: 50px auto; padding: 0 20px; align-items: start; }
@media (max-width: 860px) { .contact-grid { grid-template-columns: 1fr; gap: 30px; } }

.contact-info { display: flex; flex-direction: column; gap: 16px; }
.contact-item { display: flex; gap: 14px; align-items: flex-start; background: #fff; border: 1px solid #e6eaed; border-radius: 12px; padding: 16px 18px; }
.contact-item .ci-icon { width: 42px; height: 42px; border-radius: 10px; background: #eef4f2; color: #0a9646; display: flex; align-items: center; justify-content: center; font-size: 19px; flex: 0 0 auto; }
.contact-item h5 { color: #264653; font-size: 15px; font-weight: 700; margin: 0 0 3px; }
.contact-item p, .contact-item a { color: #6b7785; font-size: 14.5px; margin: 0; text-decoration: none; line-height: 1.5; }
.contact-item a:hover { color: #0a9646; }
.contact-map { margin-top: 4px; border-radius: 14px; overflow: hidden; border: 1px solid #e6eaed; }
.contact-map iframe { width: 100%; height: 240px; border: 0; display: block; }

/* ---------- 404 ---------- */
.err-wrap { text-align: center; padding: 90px 20px 110px; max-width: 640px; margin: 0 auto; }
.err-code { font-family: "DM Serif Text", serif; font-size: 110px; line-height: 1; color: #0a9646; margin: 0; }
.err-wrap h1 { font-family: "DM Serif Text", serif; color: #264653; font-size: 30px; margin: 10px 0 12px; }
.err-wrap p { color: #6b7785; font-size: 17px; margin: 0 0 26px; }
.err-links { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; }
.err-links a { background: #fff; border: 1px solid #d8dee2; color: #264653; font-weight: 600; padding: 10px 20px; border-radius: 999px; text-decoration: none; font-size: 14.5px; }
.err-links a:hover { border-color: #0a9646; color: #0a9646; }
.err-links a.primary { background: #0a9646; color: #fff; border-color: #0a9646; }