/* ===========================================================
   Insurance Life Galaxy — content/legal page patterns
   Loaded alongside calc-base.css. Same tokens, same components
   (panel, field, btn, disclaimer-box, cta-band already defined
   in calc-base.css) — this file only adds prose/about/contact
   specific layout that those files don't already cover.
   =========================================================== */

/* Long-form legal / policy text */
.prose{max-width:760px;}
.prose h2{font-family:var(--sans);font-size:20px;font-weight:700;margin:40px 0 14px;letter-spacing:-.01em;}
.prose h2:first-child{margin-top:0;}
.prose h3{font-family:var(--sans);font-size:16px;font-weight:700;margin:24px 0 10px;}
.prose p{font-size:15px;color:var(--ink-soft);line-height:1.75;margin:0 0 16px;}
.prose ul, .prose ol{margin:0 0 16px;padding-left:22px;}
.prose li{font-size:15px;color:var(--ink-soft);line-height:1.75;margin-bottom:8px;}
.prose strong{color:var(--ink);}
.prose a{color:var(--gold-dark);text-decoration:underline;text-underline-offset:2px;}
.last-updated{font-family:var(--mono);font-size:12.5px;color:var(--text-muted);margin-bottom:8px;}

/* Table of contents for long legal pages */
.toc{background:var(--ivory-2);border:1px solid var(--line);border-radius:var(--radius);padding:22px 26px;margin:28px 0 40px;max-width:760px;}
.toc h2{font-size:13px;font-family:var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted);margin:0 0 12px;}
.toc ol{margin:0;padding-left:20px;}
.toc li{font-size:14px;margin-bottom:6px;}
.toc a{color:var(--ink-soft);font-weight:600;}
.toc a:hover{color:var(--gold-dark);}

/* About page */
.about-hero{display:grid;grid-template-columns:.85fr 1.15fr;gap:48px;align-items:center;margin-bottom:56px;}
.about-photo{border-radius:18px;overflow:hidden;aspect-ratio:4/5;box-shadow:0 24px 60px -20px rgba(22,35,26,.3);}
.about-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 20%;}
.credential-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:28px;}
.credential-card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:18px 20px;}
.credential-card .label{font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--gold-dark);margin-bottom:6px;}
.credential-card p{font-size:13.5px;color:var(--text-muted);margin:0;line-height:1.55;}

/* Contact page */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:start;}
.contact-info-card{background:var(--ink);color:var(--text-onink);border-radius:var(--radius);padding:30px;}
.contact-info-card h2{color:#fff;font-size:19px;font-family:var(--sans);font-weight:700;margin-bottom:14px;}
.contact-info-card p{color:#c7cfc0;font-size:14px;line-height:1.7;margin-bottom:22px;}
.contact-detail{display:flex;flex-direction:column;gap:4px;margin-bottom:20px;}
.contact-detail .label{font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:#9bd08f;}
.contact-detail .value{font-size:14.5px;color:#fff;font-weight:500;}
.contact-detail .value a{color:#fff;text-decoration:underline;text-underline-offset:2px;}
.placeholder-note{font-size:12px;color:#8a9482;font-style:italic;margin-top:2px;}

.checkbox-field{display:flex;align-items:flex-start;gap:10px;margin-bottom:22px;}
.checkbox-field input[type="checkbox"]{width:18px;height:18px;margin-top:2px;accent-color:var(--gold);flex-shrink:0;}
.checkbox-field label{font-size:13.5px;color:var(--text-muted);font-weight:500;line-height:1.55;margin:0;}
.checkbox-field.error label{color:#b3432f;}

.form-status{display:none;padding:14px 18px;border-radius:10px;font-size:13.5px;margin-top:18px;}
.form-status.show{display:block;}
.form-status.success{background:#e9f2e7;color:#3f6b39;border:1px solid #cfe3cb;}
.form-status.error{background:#fbf1ee;color:#9a3b28;border:1px solid #f0d5cd;}

.contact-textarea{width:100%;padding:11px 13px;border:1px solid var(--line);border-radius:9px;font-family:var(--sans);font-size:14.5px;background:var(--ivory);color:var(--ink);resize:vertical;min-height:120px;}
.contact-textarea:focus{border-color:var(--gold-dark);outline:none;background:#fff;}

@media (max-width:980px){
  .about-hero{grid-template-columns:1fr;}
  .about-photo{max-width:320px;margin:0 auto;}
  .credential-grid{grid-template-columns:1fr;}
  .contact-grid{grid-template-columns:1fr;}
}