.recording-page { max-width: 1320px; }
.recording-coverage { margin-bottom: 1.5rem; }
.recording-frame { background: #fff; border: 1px solid var(--rule); border-radius: var(--radius); overflow: hidden; }
.recording-frame iframe { display: block; border: 0; width: 100%; height: 1100px; }
.recording-fallback { margin-top: 1rem; font-size: .9rem; }
.recording-explainer { background: var(--bg-light); }
.recording-explainer h2 { margin-top: 2rem; margin-bottom: 1rem; }
.recording-explainer p, .recording-explainer li { margin-bottom: 1rem; }
.recording-explainer ol { padding-left: 1.5rem; }
.recording-explainer summary { cursor: pointer; font-weight: 600; padding: 1rem 0; }
.recording-explainer details { border-bottom: 1px solid var(--rule); }
@media (max-width: 600px) { .recording-frame iframe { height: 1550px; } }

.recording-state-links { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 8px 24px; list-style: none; padding: 0; }
.recording-state-summary { max-width: 850px; }
.recording-state-summary li { margin-bottom: 8px; }
.recording-state-summary a { overflow-wrap: anywhere; }

/* Compact calculator sections without changing spacing on other site pages. */
.recording-calculator-page .page-header { padding: 2rem 0; }
.recording-calculator-page .content-section { padding: 1.5rem 0; }
.recording-calculator-page .cta-section { padding: 2rem 0; }
.recording-state-summary p, .recording-state-summary ul { margin-bottom: .75rem; }
.recording-state-summary details { margin: .75rem 0; }
.recording-state-summary h2 { margin-bottom: .5rem; }
.recording-state-summary .btn-primary { margin-bottom: .75rem; }
@media (max-width: 600px) {
    .recording-calculator-page .page-header { padding: 1.5rem 0; }
    .recording-calculator-page .content-section { padding: 1rem 0; }
}

/* A single page surface and aligned content column around the embedded form. */
.recording-calculator-page .recording-frame { border: 0; border-radius: 0; overflow: visible; }
.recording-calculator-page .recording-state-summary { max-width: 1320px; }
.recording-calculator-page .page-header { text-align: left; background: white; border: 0; padding-bottom: .5rem; }
.recording-calculator-page h1, .recording-calculator-page h2 { font-family: system-ui, sans-serif; }
.recording-calculator-page .page-header h1 { font-size: clamp(26px, 3vw, 36px); margin-top: .5rem; }
.recording-calculator-page .page-header p { max-width: none; margin: 0; }