/* ============================================================
   Mastermind Marketing: components for the coaching-first pages
   Location: /assets/ra-pages.css (loaded after /assets/ra.css)
   Uses the ra.css variables only, so it follows the brand palette.
   Mobile first; tablet at 640px, desktop at 980px.
   ============================================================ */

/* Page hero for inner pages: same look as the homepage hero, shorter */
.page-hero{padding:44px 0 52px}
.page-hero .hero-copy{max-width:900px;margin:0 auto;text-align:center}
.page-hero .cta-row{align-items:center}
.page-hero .trust-row{justify-content:center}
.crumbs{font-size:.8rem;color:var(--sage);margin-bottom:14px}
.crumbs a{color:var(--sage)}

/* Two-up grids */
.tier-grid,.split-grid,.svc-grid{display:grid;gap:18px;margin-top:36px}
.guar-grid.two{margin-left:auto;margin-right:auto;max-width:880px}

/* Coaching tier cards (build-card look, with a price) */
.tier-card{background:var(--white);border-radius:18px;padding:28px 22px;box-shadow:var(--shadow);position:relative;border:2px solid transparent;display:flex;flex-direction:column}
.tier-card.is-featured{border-color:var(--orange);box-shadow:0 22px 50px rgba(255,141,9,.22)}
.tier-card h3{font-size:1.3rem}
.tier-price{font-family:var(--head);font-weight:900;font-size:2.4rem;color:var(--forest-ink);margin:10px 0 2px;line-height:1}
.tier-price small{font-size:.9rem;font-weight:700;color:var(--moss)}
.tier-for{color:var(--moss);margin:8px 0 18px;font-size:.95rem}
.tier-card .check-list{margin-bottom:22px;flex:1}
.tier-card .btn{width:100%}
.tier-note{font-size:.82rem;color:var(--moss);margin-top:12px;text-align:center}
.badge-inline{position:absolute;top:-13px;left:22px;background:var(--orange);color:var(--forest-ink);font-family:var(--head);font-weight:800;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;padding:5px 10px;border-radius:999px}

/* 12-week roadmap and generic data tables */
.table-wrap{margin-top:32px;overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:14px;box-shadow:var(--shadow);background:var(--white)}
.data-table{width:100%;border-collapse:collapse;font-size:.94rem;min-width:560px}
.data-table caption{caption-side:top;text-align:left;font-family:var(--head);font-weight:800;padding:16px 18px 6px;color:var(--forest-ink)}
.data-table th,.data-table td{padding:13px 16px;text-align:left;vertical-align:top;border-bottom:1px solid #ECEEF2;color:var(--ink)}
.data-table thead th{background:var(--forest-ink);color:var(--cream);font-family:var(--head);font-size:.78rem;letter-spacing:.08em;text-transform:uppercase}
.data-table tbody tr:nth-child(even){background:#FAFBFC}
.data-table td.wk{font-family:var(--head);font-weight:900;color:var(--orange-deep);white-space:nowrap}
.data-table td.yes{font-weight:700;color:var(--forest-ink)}
.data-table td.no{color:var(--moss)}
.section-dark .table-wrap{box-shadow:var(--shadow-dark)}

/* Phase cards (homepage roadmap summary) */
.phase-grid{display:grid;gap:16px;margin-top:36px}
.phase{background:rgba(246,247,249,.05);border:1px solid rgba(246,247,249,.12);border-radius:16px;padding:22px 20px}
.phase .wks{font-family:var(--head);font-weight:900;font-size:.76rem;letter-spacing:.16em;text-transform:uppercase;color:var(--orange)}
.phase h3{margin:8px 0 8px;font-size:1.12rem}
.phase p{font-size:.94rem}

/* Plain info cards */
.info-card{background:var(--white);border-radius:var(--r);padding:24px 22px;box-shadow:var(--shadow)}
.info-card h3{margin-bottom:10px;font-size:1.1rem}
.info-card p,.info-card li{color:var(--moss);font-size:.95rem}
.info-card .check-list li,.info-card .x-list li{color:var(--ink)}
.info-card.is-accent{border-top:5px solid var(--orange)}
.info-card.is-muted{border-top:5px solid var(--slate);background:#ECEEF2}
.info-card .meta{font-family:var(--head);font-weight:800;color:var(--forest-ink);margin-top:12px;font-size:.92rem}

/* Notice boxes (payment status, separations, disclosures) */
.notice{margin-top:28px;border-radius:14px;padding:20px 20px 18px;background:var(--orange-soft);border-left:5px solid var(--orange);color:var(--ink)}
.notice h3{font-size:1.05rem;margin-bottom:6px}
.notice p{color:var(--ink);font-size:.95rem}
.notice p + p{margin-top:8px}
.notice.is-dark{background:rgba(246,247,249,.06);border-left-color:var(--orange);color:#DEE2E8}
.notice.is-dark h3{color:var(--cream)}
.notice.is-dark p{color:#DEE2E8}

/* Prose blocks */
.prose{max-width:760px;margin:28px auto 0}
.prose p{margin-top:14px;color:var(--moss)}
.prose h3{margin-top:28px}
.section-dark .prose p{color:#DEE2E8}
.fine{font-size:.82rem;color:var(--moss);margin-top:14px}
.section-dark .fine{color:var(--sage)}

/* Footer extra heading spacing */
.footer-h-gap{margin-top:18px}

/* Payment method rows */
.pay-list{list-style:none;display:grid;gap:12px;margin-top:22px}
.pay-list li{background:var(--white);border-radius:12px;padding:16px 18px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:4px}
.pay-list strong{font-family:var(--head);color:var(--forest-ink)}
.pay-list span{color:var(--moss);font-size:.93rem}

@media (min-width:640px){
  .tier-grid,.split-grid{grid-template-columns:1fr 1fr}
  .svc-grid{grid-template-columns:1fr 1fr}
  .phase-grid{grid-template-columns:1fr 1fr}
  .guar-grid.two{grid-template-columns:1fr 1fr}
  .page-hero .cta-row{flex-direction:row;justify-content:center}
}
@media (min-width:980px){
  .page-hero{padding:72px 0 80px}
  .tier-grid{max-width:960px;margin-left:auto;margin-right:auto}
  .svc-grid{grid-template-columns:repeat(3,1fr)}
  .phase-grid{grid-template-columns:repeat(4,1fr)}
  .guar-grid.two{grid-template-columns:1fr 1fr}
  .nav{gap:18px}
  .nav a{font-size:.88rem}
}
