.ocf-detail-grid { display:grid;grid-template-columns:minmax(0,792fr) minmax(0,352fr);gap:var(--ocf-split-gap);align-items:start; }
.ocf-detail-aside { position:sticky;top: var(--cardiff-sticky-top); }
@media(max-width:850px) { .ocf-detail-grid { grid-template-columns:1fr;gap:calc(var(--ocf-grid-gap) * 1.25); }.ocf-detail-aside { position:static; } }

/* Featured image: framed at the top of the content column, beside the inquiry panel. */
.ocf-detail-media { aspect-ratio: 16 / 9; margin-bottom: calc(var(--ocf-grid-gap) * 1.75); }
@media (max-width: 600px) { .ocf-detail-media { box-shadow: 10px 10px 0 var(--cardiff-tint); } }

/* Inquiry panel: pressed white card edged by the triple stripe; CTA and a light call button. */
.ocf-inquiry-panel {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: calc(var(--ocf-space-unit) * 0.875);
    overflow: hidden;
    padding: calc(var(--ocf-space-unit) * 2.75) calc(var(--ocf-space-unit) * 2) calc(var(--ocf-space-unit) * 2);
    border: var(--button-border-width) solid var(--cardiff-ink);
    border-radius: var(--card-radius-lg);
    background: var(--ocf-bg);
    box-shadow: 0 calc(var(--cardiff-press) + 3px) 0 var(--cardiff-ink);
    color: var(--ocf-body);
}

.ocf-inquiry-panel::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 14px;
    background: linear-gradient(180deg, var(--cardiff-tint) 0 33.33%, var(--ocf-border) 33.33% 66.67%, var(--cardiff-ink) 66.67% 100%);
}

.ocf-inquiry-panel .eyebrow,
.ocf-inquiry-panel h3,
.ocf-inquiry-panel p { margin: 0; }

.ocf-inquiry-panel h3 { color: var(--ocf-heading); }

.ocf-inquiry-intro {
    font-size: calc(var(--font-body-size) * 0.889);
    line-height: 1.6;
}

.ocf-inquiry-panel .btn-primary,
.ocf-inquiry-panel .btn-secondary { width: 100%; }
.ocf-inquiry-panel .btn-primary { margin-top: calc(var(--ocf-space-unit) * 0.25); }

html[data-theme="dark"] .ocf-inquiry-panel { background: var(--ocf-dark-bg-alt); border-color: var(--ocf-dark-border); box-shadow: 0 calc(var(--cardiff-press) + 3px) 0 #000; }

/* Long-form lists: ordered steps get display-type primary numbers (01, 02 ...). */
.ocf-longform ol {
    counter-reset: cardiff-step;
    list-style: none;
    padding-left: 0;
}

.ocf-longform ol > li {
    position: relative;
    padding-left: calc(var(--ocf-space-unit) * 2.5);
    counter-increment: cardiff-step;
}

.ocf-longform ol > li {
    min-height: calc(var(--ocf-space-unit) * 2.75);
    padding-left: calc(var(--ocf-space-unit) * 3.5);
}

/* Ordered steps: small pressed number badges. */
.ocf-longform ol > li::before {
    content: counter(cardiff-step, decimal-leading-zero);
    position: absolute;
    top: 0;
    left: 0;
    display: grid;
    place-items: center;
    width: calc(var(--ocf-space-unit) * 2.5);
    height: calc(var(--ocf-space-unit) * 2.5);
    border: var(--button-border-width) solid var(--cardiff-ink);
    border-radius: var(--radius-sm);
    background: var(--ocf-bg-alt);
    box-shadow: 0 3px 0 var(--cardiff-ink);
    color: var(--ocf-link);
    font-family: var(--ocf-font-heading), system-ui, sans-serif;
    font-size: calc(var(--font-body-size) * 1.05);
    font-weight: 800;
    line-height: 1;
}

.ocf-longform ul { padding-left: 0; list-style: none; }
.ocf-longform ul > li { position: relative; padding-left: calc(var(--ocf-space-unit) * 1.25); }
.ocf-longform ul > li { padding-left: calc(var(--ocf-space-unit) * 1.875); }
.ocf-longform ul > li::before {
    content: '';
    position: absolute;
    top: 0.3em;
    left: 0;
    width: calc(var(--ocf-space-unit) * 1.125);
    height: calc(var(--ocf-space-unit) * 1.125);
    border-radius: 50%;
    background: var(--ocf-primary) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.5 12.3l3.6 3.4L17.5 8.5' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 72% no-repeat;
}
