/* =========================================================
   TALKMONEY SMART RESOURCE CENTER — page-specific styles
   Extends style.css. Uses the same design tokens:
   --orange, --orange-dark, --black, --cream, --gray, --border
   ========================================================= */

/* ---- About ---- */
.src-about{padding:70px 0 20px;}
.src-about-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:50px;align-items:center;}
.src-about-text p{font-size:15px;color:var(--gray);line-height:1.75;margin:0 0 16px;}
.src-about-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.src-about-stats .stat-box{background:#FFFBF6;border:1px solid var(--border);border-radius:14px;padding:20px 16px;text-align:center;}
.src-about-stats .stat-box h3{font-size:26px;font-weight:800;margin:0 0 4px;color:var(--orange);}
.src-about-stats .stat-box p{font-size:12px;color:var(--gray);margin:0;}

/* ---- Why Choose grid ---- */
.src-why-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.src-why-card{background:#fff;border:1px solid var(--border);border-radius:16px;padding:26px 22px;text-align:center;transition:.25s ease;}
.src-why-card:hover{transform:translateY(-4px);box-shadow:0 16px 32px rgba(0,0,0,.08);}
.src-why-icon{width:52px;height:52px;border-radius:14px;background:#FFF1E3;color:var(--orange-dark);display:flex;align-items:center;justify-content:center;font-size:20px;margin:0 auto 14px;}
.src-why-card h4{font-size:14.5px;font-weight:700;margin:0 0 8px;}
.src-why-card p{font-size:12.5px;color:var(--gray);line-height:1.6;margin:0;}

/* ---- Who is this for ---- */
.src-benefit-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.src-benefit-card{background:#fff;border:1px solid var(--border);border-radius:16px;padding:24px 18px;text-align:center;transition:.25s ease;}
.src-benefit-card:hover{transform:translateY(-4px);box-shadow:0 16px 32px rgba(0,0,0,.08);}
.src-benefit-icon{width:48px;height:48px;border-radius:12px;background:#EAFAF1;color:#1AA05D;display:flex;align-items:center;justify-content:center;font-size:18px;margin:0 auto 12px;}
.src-benefit-card h4{font-size:13.5px;font-weight:700;margin:0;}

/* ---- How It Works timeline ---- */
.src-timeline{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;position:relative;}
.src-step{background:#fff;border:1px solid var(--border);border-radius:16px;padding:24px 14px 20px;text-align:center;position:relative;}
.src-step .step-num{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,var(--orange),var(--orange-dark));color:#fff;font-weight:800;font-size:15px;display:flex;align-items:center;justify-content:center;margin:0 auto 14px;}
.src-step h4{font-size:12.5px;font-weight:700;margin:0;}
.src-step:not(:last-child)::after{content:'';position:absolute;top:38px;right:-14px;width:14px;height:2px;background:var(--border);}

/* ---- FAQ wrap ---- */
.src-faq{max-width:760px;margin:0 auto;}

/* ---- Responsive ---- */
@media(max-width:980px){
  .src-about-grid{grid-template-columns:1fr;}
  .src-why-grid{grid-template-columns:repeat(2,1fr);}
  .src-benefit-grid{grid-template-columns:repeat(2,1fr);}
  .src-timeline{grid-template-columns:repeat(3,1fr);}
  .src-step:nth-child(3)::after{display:none;}
}
@media(max-width:640px){
  .src-about-stats{grid-template-columns:1fr;}
  .src-timeline{grid-template-columns:repeat(2,1fr);}
  .src-step:nth-child(2n)::after{display:none;}
}
