/* About (homepage): white band; the about copy beside the request form card. */
.ocf-about {
    position: relative;
    background: var(--ocf-bg);
    color: var(--ocf-body);
}

/* After a warm band (services) the seam rises gently to the right, echoing the hero slash: the band's color dips
 * --portola-seam-rise into the top-left of the about band. */
.portola-warm + .ocf-about::before {
    content: '';
    position: absolute;
    inset: -1px 0 auto;
    height: calc(var(--portola-seam-rise, 44px) + 1px);
    background: var(--ocf-bg-alt);
    clip-path: polygon(0 0, 100% 0, 0 100%);
    pointer-events: none;
}

@media (max-width: 767px) { .ocf-about { --portola-seam-rise: 24px; } }

.ocf-about-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 520px);
    gap: var(--ocf-split-gap);
    align-items: center;
}

.ocf-about-copy .heading-2 {
    margin-bottom: calc(var(--ocf-grid-gap) * 0.85);
    color: var(--ocf-heading);
}

.ocf-about-copy .prose { color: var(--ocf-body); }
.ocf-about-copy .prose > p:first-child { font-size: calc(var(--font-body-size) * 1.11); }
.ocf-about-copy .prose p + p { margin-top: calc(var(--ocf-grid-gap) * 0.55); }
.ocf-about-copy .prose strong { color: var(--ocf-heading); }

/* List items: uppercase labels with primary check marks. */
.ocf-about-copy .prose ul { list-style: none; margin: calc(var(--ocf-grid-gap) * 1.1) 0 0; padding-left: 0; }
.ocf-about-copy .prose li {
    position: relative;
    margin: calc(var(--ocf-grid-gap) * 0.45) 0;
    padding-left: calc(var(--ocf-space-unit) * 2);
    color: var(--ocf-heading);
    font-size: calc(var(--font-body-size) * 0.94);
}

.ocf-about-copy .prose li::before {
    content: '';
    position: absolute;
    top: 0.25em;
    left: 0;
    width: 20px;
    height: 20px;
    background: var(--ocf-primary);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4.5 12.5l4.8 4.6L19.5 7' fill='none' stroke='%23000' stroke-width='3.4' stroke-linecap='square'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4.5 12.5l4.8 4.6L19.5 7' fill='none' stroke='%23000' stroke-width='3.4' stroke-linecap='square'/%3E%3C/svg%3E") center / contain no-repeat;
}

.ocf-about-actions { margin-top: calc(var(--ocf-grid-gap) * 1.4); }

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

@media (max-width: 1023px) {
    .ocf-about-grid { grid-template-columns: 1fr; gap: calc(var(--ocf-grid-gap) * 2); }
}

@media (max-width: 767px) {
    .ocf-about-actions { flex-direction: column; align-items: stretch; }
    .ocf-about-actions > a { width: 100%; }
}