/* R5-WEB-HOME-07C — homepage typography scale and placement refinement.
   Scope: all homepage sections below the hero. The hero typography is intentionally untouched. */

/* 01. Global vertical rhythm below hero */
main > section:not(.hero).section{padding:112px 0}
main > section:not(.hero) .kicker{margin-bottom:16px;font-size:11px;letter-spacing:.13em}

/* 02. Primary section headings — calmer commercial scale */
.statement h2,
.product-story .section-head h2,
.workflow .section-head h2,
.use-cases .section-head h2,
.trust-copy h2,
.pricing-home h2{
  font-size:clamp(38px,3.65vw,52px);
  line-height:1.12;
  letter-spacing:-.035em;
}

.final-card h2{
  font-size:clamp(42px,4.1vw,60px);
  line-height:1.08;
  letter-spacing:-.04em;
}

/* 03. Heading blocks: width and placement */
.statement-grid{grid-template-columns:1.12fr .88fr;gap:72px;align-items:start}
.statement-copy{max-width:620px;margin-top:4px;font-size:17px;line-height:1.82}

.section-head{max-width:800px}
.section-head p:last-child{max-width:680px;margin-top:18px;font-size:16.5px;line-height:1.78}
.section-head.compact{max-width:760px}

.cp3-story-head{grid-template-columns:1fr .58fr;gap:68px;align-items:start}
.cp3-story-head .cp3-head-copy{max-width:760px}
.cp3-story-head .cp3-head-side{max-width:500px;margin-top:3px;font-size:14px;line-height:1.78}

/* 04. Product story titles — strong, but no longer poster-sized */
.cp3-story-stack{margin-top:58px;gap:30px}
.cp3-story-copy{padding:28px 24px}
.cp3-story-copy h3{
  max-width:520px;
  margin:13px 0 14px;
  font-size:clamp(27px,2.35vw,36px);
  line-height:1.18;
  letter-spacing:-.032em;
}
.cp3-story-copy>p{max-width:500px;font-size:14.5px;line-height:1.78}
.cp3-feature-list{margin-top:20px;gap:8px}
.cp3-feature-list li{font-size:11px;line-height:1.52}
.cp3-story-copy a{margin-top:21px;font-size:12px}
.cp3-story-index{font-size:9.5px;letter-spacing:.13em}

/* 05. Supporting card typography */
.value-grid{margin-top:58px}
.value-grid h3{margin:23px 0 10px;font-size:20px}
.value-grid p{font-size:15px;line-height:1.72}

.cases-grid{margin-top:52px}
.case-card{min-height:350px;padding:30px}
.case-card h3{margin:66px 0 15px;font-size:30px;line-height:1.15;letter-spacing:-.025em}
.case-card p{font-size:15px;line-height:1.72}
.case-card b{left:30px;bottom:30px}
.case-card i{right:30px;bottom:26px}

/* 06. Workflow text rhythm */
.flow-line{margin-top:52px}
.flow-line>div{padding-top:26px}
.flow-line strong{margin-top:21px;font-size:17px}
.flow-line p{margin-top:7px;font-size:13.5px;line-height:1.55}
.center-link{margin-top:38px}

/* 07. Local-first / pricing / CTA positioning */
.trust-grid{grid-template-columns:.9fr 1.1fr;gap:82px;align-items:start}
.trust-copy>p:not(.kicker){max-width:560px;margin-top:20px;font-size:16px;line-height:1.78}
.trust-copy a{margin-top:20px}

.pricing-home-grid{grid-template-columns:1fr .82fr;gap:84px;align-items:start}
.pricing-facts>div{padding:19px 0}
.pricing-facts strong{font-size:20px}
.pricing-facts span{font-size:15px;line-height:1.55}

.final-card{max-width:820px}
.final-card>p:not(.kicker){max-width:620px;margin-top:22px;font-size:16.5px;line-height:1.72}
.final-card .hero-actions{margin-top:28px}
.final-card small{margin-top:17px}

/* 08. Keep line lengths under control on wide screens */
@media(min-width:1180px){
  .statement h2{max-width:650px}
  .product-story .section-head h2{max-width:720px}
  .workflow .section-head h2,.use-cases .section-head h2{max-width:700px}
  .trust-copy h2,.pricing-home h2{max-width:600px}
}

/* 09. Tablet hierarchy */
@media(max-width:980px){
  main > section:not(.hero).section{padding:92px 0}
  .statement h2,.product-story .section-head h2,.workflow .section-head h2,.use-cases .section-head h2,.trust-copy h2,.pricing-home h2{font-size:clamp(36px,5.4vw,46px)}
  .final-card h2{font-size:clamp(40px,6vw,52px)}
  .statement-grid,.cp3-story-head,.trust-grid,.pricing-home-grid{gap:36px}
  .cp3-story-copy h3{font-size:clamp(28px,4.2vw,34px)}
  .case-card h3{font-size:28px}
}

/* 10. Mobile hierarchy */
@media(max-width:760px){
  main > section:not(.hero).section{padding:76px 0}
  main > section:not(.hero) .kicker{margin-bottom:13px;font-size:10px}
  .statement h2,.product-story .section-head h2,.workflow .section-head h2,.use-cases .section-head h2,.trust-copy h2,.pricing-home h2{font-size:34px;line-height:1.15}
  .final-card h2{font-size:38px;line-height:1.1}
  .statement-copy,.section-head p:last-child,.trust-copy>p:not(.kicker),.final-card>p:not(.kicker){font-size:15px;line-height:1.72}
  .value-grid,.cases-grid,.flow-line{margin-top:40px}
  .cp3-story-stack{margin-top:42px;gap:22px}
  .cp3-story-copy{padding:22px 14px 12px}
  .cp3-story-copy h3{max-width:none;font-size:28px;line-height:1.2}
  .cp3-story-copy>p{font-size:14px}
  .case-card{min-height:310px;padding:26px}
  .case-card h3{margin-top:48px;font-size:27px}
  .case-card b{left:26px;bottom:26px}.case-card i{right:26px;bottom:22px}
}

@media(max-width:520px){
  main > section:not(.hero).section{padding:68px 0}
  .statement h2,.product-story .section-head h2,.workflow .section-head h2,.use-cases .section-head h2,.trust-copy h2,.pricing-home h2{font-size:31px}
  .final-card h2{font-size:34px}
  .cp3-story-copy h3{font-size:26px}
  .case-card h3{font-size:25px}
}
