/* ---------- Story section ---------- */
.story-grid{display:grid; grid-template-columns:1.1fr 0.9fr; gap:64px; align-items:start;}
.story-copy h2{font-size:34px; margin-bottom:20px;}
.story-copy p{margin-bottom:16px; font-size:15.5px;}
.story-card{
  background:var(--green-tint); border:1px solid var(--green-tint2); border-radius:14px;
  padding:40px 36px; margin-top:8px;
}
.story-quote{font-style:italic; font-size:19px; line-height:1.5; color:var(--ink); font-weight:400; margin-bottom:30px;}
.story-stats{display:grid; grid-template-columns:1fr 1fr; gap:22px 18px; border-top:1px solid var(--green-tint2); padding-top:26px;}
.story-stats div b{display:block; font-size:24px; color:var(--green-dark); font-weight:700;}
.story-stats div span{font-size:12px; color:var(--gray); font-weight:700; letter-spacing:0.4px; text-transform:uppercase;}

/* ---------- Customer-is-hero grid ---------- */
.hero-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:20px;}
.hero-role-card{
  background:var(--white); border:1px solid var(--line); border-radius:12px; padding:28px 26px;
}
.hero-role-card.highlight{background:var(--green-dark); border-color:var(--green-dark);}
.hero-role-card.highlight .hr-label{color:var(--green-tint2);}
.hero-role-card.highlight h4, .hero-role-card.highlight p{color:var(--white);}
.hero-role-card.highlight p{color:var(--green-tint2);}
.hr-label{font-size:11px; font-weight:700; letter-spacing:1.5px; text-transform:uppercase; color:var(--green); margin-bottom:10px;}
.hero-role-card h4{font-size:18px; margin-bottom:8px;}
.hero-role-card p{font-size:13.5px; line-height:1.55;}

/* ---------- Belief grid (4-up dark cards) ---------- */
.belief-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:22px; margin-top:20px;}
.belief-grid .secret-card{padding:28px 24px;}
.belief-grid .secret-card h3{font-size:17px; margin-bottom:8px;}
.belief-grid .secret-card p{font-size:13px;}

@media (max-width:600px){
  .story-grid{grid-template-columns:1fr; gap:36px;}
  .hero-grid{grid-template-columns:1fr 1fr; gap:14px;}
  .belief-grid{grid-template-columns:1fr 1fr; gap:14px;}
}