/* ─── Aspen detail pages (service, service area, industry) ───
 * Long-form content (display h2/h3, lede, numbered rows from <ol>) with the featured photo under it, beside the sticky
 * inquiry card; stacked below 1024px. Sections right after a page banner start closer to it (.aspen-after-banner).
 */
.aspen-after-banner { padding-top: clamp(40px, 27.6px + 3.05vw, 72px); }

.ocf-detail-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 420px);
    gap: var(--aspen-gap-lg);
    align-items: start;
}

.ocf-detail-content { min-width: 0; }
.ocf-detail-content .prose h2 { margin-bottom: 22px; }
/* Content headings sit one step below section headings (Bennett, 10-31: 64/38px read too big). */
.ocf-detail-content .prose h2 { font-size: clamp(34px, 28px + 1.4vw, 48px); }
.ocf-detail-content .prose h3 { font-size: clamp(26px, 24px + 0.5vw, 30px); }

.ocf-detail-media {
    height: 380px;
    margin: 36px 0 0;
    overflow: hidden;
    border-radius: var(--image-radius);
}

.ocf-detail-media img { width: 100%; height: 100%; object-fit: cover; }

.ocf-detail-aside {
    position: sticky;
    top: var(--aspen-sticky-top);
}

.ocf-inquiry-panel {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 32px;
    border: var(--card-border-width) solid var(--ocf-border-light);
    border-radius: var(--card-radius);
    background: var(--ocf-bg);
    box-shadow: var(--aspen-float-shadow);
    text-align: left;
}

.ocf-inquiry-panel h3 { margin: 0; font-size: 40px; }
.ocf-inquiry-intro { font-size: 16px; }
.ocf-inquiry-panel .btn-primary,
.ocf-inquiry-panel .btn-secondary { width: 100%; }

html[data-theme="dark"] .ocf-inquiry-panel { background: var(--ocf-dark-bg-alt); }

@media (max-width: 1023px) {
    .ocf-detail-grid { grid-template-columns: 1fr; gap: 48px; }
    .ocf-detail-aside { position: static; }
    .ocf-detail-media { height: 360px; }
}

@media (max-width: 640px) {
    .ocf-detail-media { height: 240px; }
    .ocf-inquiry-panel { padding: 26px 22px; }
}
