.ocf-countertop-guide {
    background: var(--ocf-bg-alt);
    border-top: 1px solid var(--ocf-border-light);
    border-bottom: 1px solid var(--ocf-border-light);
}

.ocf-countertop-guide__content {
    display: grid;
    gap: 1.25rem;
    max-width: 1100px;
    margin: 0 auto;
    color: var(--ocf-body);
    line-height: 1.72;
}

.ocf-countertop-guide__content > * { margin: 0; }

.ocf-countertop-guide__content h2 {
    max-width: 820px;
    margin-top: clamp(2.25rem, 5vw, 4rem);
    color: var(--ocf-heading);
    font-family: var(--ocf-font-heading), system-ui, sans-serif;
    font-size: clamp(1.65rem, 3vw, var(--font-h2-size));
    line-height: 1.16;
}

.ocf-countertop-guide__content h2:first-child { margin-top: 0; }

.ocf-countertop-guide__content h3 {
    margin-top: .35rem;
    color: var(--ocf-heading);
    font-family: var(--ocf-font-heading), system-ui, sans-serif;
    font-size: 1.15rem;
    line-height: 1.3;
}

.ocf-countertop-guide__content a {
    color: var(--ocf-primary);
    font-weight: var(--font-weight-bold);
    text-decoration: underline;
    text-underline-offset: .18em;
}

.ocf-countertop-guide__content figure {
    margin: .5rem 0;
    overflow: hidden;
    border: 1px solid var(--card-border-color);
    border-radius: var(--image-radius);
    background: var(--ocf-bg);
    box-shadow: var(--image-shadow);
}

.ocf-countertop-guide__content figure img {
    display: block;
    width: 100%;
    max-height: 470px;
    object-fit: cover;
}

.ocf-countertop-guide__content figcaption {
    padding: .75rem 1rem;
    color: var(--ocf-label);
    font-size: var(--font-label-size);
}

.ocf-countertop-guide__content ul,
.ocf-countertop-guide__content ol {
    display: grid;
    gap: .55rem;
    margin: 0;
    padding-left: 1.25rem;
}

.ocf-countertop-guide__content table {
    display: block;
    width: 100%;
    overflow-x: auto;
    border: 1px solid var(--ocf-border);
    border-collapse: collapse;
    border-radius: var(--card-radius);
    background: var(--ocf-bg);
    line-height: 1.45;
}

.ocf-countertop-guide__content th,
.ocf-countertop-guide__content td {
    min-width: 135px;
    padding: .85rem 1rem;
    border-bottom: 1px solid var(--ocf-border-light);
    text-align: left;
    vertical-align: top;
}

.ocf-countertop-guide__content th {
    color: var(--ocf-heading);
    background: color-mix(in srgb, var(--ocf-primary) 10%, var(--ocf-bg));
    font-weight: var(--font-weight-bold);
}

.ocf-countertop-guide__content tr:last-child td { border-bottom: 0; }

@media (max-width: 640px) {
    .ocf-countertop-guide__content h2 { margin-top: 2.5rem; }
    .ocf-countertop-guide__content th,
    .ocf-countertop-guide__content td { min-width: 125px; padding: .7rem .8rem; }
}