/* Layout details for the ecommerce SEO case study. */
.ecommerce-case-study :where(h1, h2, h3, p) { margin: 0; }
.ecommerce-case-study .back-link { display: inline-flex; align-items: center; gap: 8px; text-decoration: none; }
.ecommerce-case-study .back-link svg { width: 16px; height: 16px; }
.ecommerce-case-study .case-label { margin-bottom: 16px; text-transform: uppercase; letter-spacing: .08em; }
.ecommerce-case-study .case-client { color: var(--text-muted); }
.ecommerce-case-study .case-description { color: var(--text-secondary); }
.ecommerce-case-study .stats-banner { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ecommerce-case-study .stat-value { line-height: 1.2; }
.ecommerce-case-study .stat-label { margin-top: 8px; }
.ecommerce-case-study .case-period { margin-top: 24px; color: var(--stone); font-size: 14px; }
.ecommerce-case-study .case-period a { text-underline-offset: 3px; }
.ecommerce-case-study .section-label { margin-bottom: 16px; }
.ecommerce-case-study .section-title { margin-bottom: 24px; }
.ecommerce-case-study .section-text { color: var(--text-secondary); }
.ecommerce-case-study .section-text + .section-text { margin-top: 16px; }
.ecommerce-case-study .approach-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin-top: 32px; }
.ecommerce-case-study .approach-card { padding: 32px; background: var(--cloud); border: 1px solid var(--stone); border-radius: 12px; }
.ecommerce-case-study .step-number { display: block; margin-bottom: 24px; color: var(--forest); font-size: 14px; font-weight: 600; }
.ecommerce-case-study :is(.approach-card, .result-insight) h3 { font-size: 24px; line-height: 31px; letter-spacing: -.025em; font-weight: 600; margin-bottom: 16px; }
.ecommerce-case-study :is(.approach-card, .result-insight) p { color: var(--moss); font-size: 16px; line-height: 25px; }
.ecommerce-case-study .results-table-wrap { overflow-x: auto; margin-top: 32px; border: 1px solid var(--stone); border-radius: 12px; }
.ecommerce-case-study .results-table { width: 100%; border-collapse: collapse; font-size: 16px; line-height: 25px; }
.ecommerce-case-study .results-table caption { padding: 24px; color: var(--forest); background: var(--cloud); font-weight: 600; text-align: left; }
.ecommerce-case-study .results-table :is(th, td) { padding: 20px 24px; border-top: 1px solid var(--stone); text-align: left; }
.ecommerce-case-study .results-table thead { background: var(--cloud); color: var(--moss); font-size: 14px; }
.ecommerce-case-study .results-table tbody th { font-weight: 600; }
.ecommerce-case-study .results-table .numeric { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ecommerce-case-study .results-table tbody td { color: var(--forest); font-weight: 600; }
.ecommerce-case-study .results-note { margin-top: 16px; color: var(--moss); font-size: 14px; }
.ecommerce-case-study .result-insight { margin-top: 32px; padding: 32px; background: var(--cloud); border-left: 3px solid var(--forest); border-radius: 0 12px 12px 0; }
.ecommerce-case-study .next-steps { list-style: none; padding: 0; margin: 32px 0 0; max-width: 870px; }
.ecommerce-case-study .next-steps li { padding: 20px 0; border-top: 1px solid var(--stone); color: var(--moss); }
.ecommerce-case-study .next-steps strong { color: var(--summit); }
.ecommerce-case-study .measurement-note { padding: 32px; border: 1px solid var(--stone); border-radius: 12px; }
.ecommerce-case-study .measurement-note > p:not(.section-label) { max-width: 1000px; color: var(--moss); font-size: 14px; line-height: 23px; }
.ecommerce-case-study .measurement-note > p + p { margin-top: 16px; }
.ecommerce-case-study .tagline-ref { display: block; margin-top: 8px; }
@media (max-width: 900px) {
  .ecommerce-case-study .approach-grid { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
  .ecommerce-case-study .stats-banner { grid-template-columns: 1fr; }
  .ecommerce-case-study .stat-item + .stat-item { padding-top: 24px; border-top: 1px solid var(--stone); }
  .ecommerce-case-study :is(.approach-card, .result-insight, .measurement-note) { padding: 24px; }
  .ecommerce-case-study .results-table { font-size: 14px; }
  .ecommerce-case-study .results-table :is(th, td, caption) { padding: 16px 12px; }
  .ecommerce-case-study .results-table thead { font-size: 12px; }
}