/* Phase 5 structure uses the approved palette, type, CTA and container. */
.lp-context-section { padding-block: var(--lp-space-2xl); border-block-end: 1px solid var(--lp-color-border); }
.lp-context-section p { margin-block: 0 var(--lp-space-md); }
.lp-context-section h2 { font-size: var(--wp--preset--font-size--lp-h-2); margin-block-end: var(--lp-space-lg); }
.lp-context-section h3 { font-size: var(--wp--preset--font-size--lp-h-4); margin-block-end: var(--lp-space-sm); }
.lp-context-image { display: grid; place-content: center; aspect-ratio: 8 / 5; min-inline-size: 0; border: 1px solid var(--lp-color-border); background: var(--lp-color-bg-alt); color: var(--lp-color-text); }
.lp-context-image p { margin: 0; padding: var(--lp-space-md); text-align: center; }
.lp-context-card-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--lp-space-xl); }
.lp-context-card { min-inline-size: 0; border-block-start: 2px solid var(--lp-color-primary); padding-block-start: var(--lp-space-lg); }
.lp-context-card .lp-context-image { margin-block-end: var(--lp-space-lg); }
.lp-context-hero-grid { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: var(--lp-space-2xl); }
.lp-context-hero .lp-context-image { aspect-ratio: 4 / 3; }
.lp-context-hero-copy { max-inline-size: 36rem; }
.lp-context-link-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); gap: var(--lp-space-lg); }
.lp-context-link-item { border-block-start: 2px solid var(--lp-color-primary); padding-block-start: var(--lp-space-lg); }
.lp-context-link-item a { display: inline-flex; align-items: center; min-block-size: 44px; font-weight: 600; }
.lp-context-link-item p:last-child { margin: 0; }
@media (max-width: 767px) {
  .lp-context-card-grid, .lp-context-hero-grid { grid-template-columns: 1fr; gap: var(--lp-space-xl); }
  .lp-context-hero .lp-context-image { aspect-ratio: 2 / 1; }
}