/* about-us.css — page sections: judicial expertise (A1), vision (A3), partnership (A7).
   Everything else comes from the locked system (components.css). */

/* ============================================================ خبرتنا في المجال القضائي */
.judicial__grid {
    display: grid;
    align-items: start;
    gap: var(--space-2xl);
}

.judicial__text {
    margin-block-start: var(--space-lg);
    max-inline-size: var(--measure);
}

.judicial__lead {
    color: var(--color-heading);
    font-size: var(--fs-lg);
    font-weight: 400;
}

/* Statement card — the house's opening commitments, gold rule on top */
.statement {
    padding: var(--space-lg);
    border: 1px solid var(--color-border);
    border-block-start: 2px solid var(--color-accent);
    border-radius: var(--radius-card);
    background-color: var(--color-bg);
}

.statement__list {
    display: grid;
    gap: var(--space-lg);
}

.statement__item {
    position: relative;
    padding-inline-start: var(--space-xl);
    font-size: var(--fs-md);
}

.statement__item::before {
    content: "";
    position: absolute;
    inset-block-start: 0.8em;
    inset-inline-start: var(--space-xs);
    inline-size: var(--space-sm);
    block-size: var(--space-sm);
    border: 1px solid var(--color-accent-deep);
    transform: rotate(45deg);
}

.statement__item strong { color: var(--color-heading); }

/* ============================================================ رؤيتنا */
.vision .section-head { margin-block-end: var(--space-xl); }

.vision__statement {
    padding-block: var(--space-xl);
    border-block: 1px solid var(--color-border);
    color: var(--color-heading);
    font-size: clamp(var(--fs-lg), 2.2vw, var(--fs-xl));
    font-weight: 400;
    line-height: var(--lh-body);
    text-align: center;
    text-wrap: balance;
}

/* ============================================================ شراكة مهنية تقوم على الثقة */
.partnership__grid {
    display: grid;
    gap: var(--space-lg);
}

.partnership__title::after {
    content: "";
    display: block;
    inline-size: var(--space-3xl);
    block-size: 1px;
    margin-block-start: var(--space-md);
    background-color: var(--color-accent);
}

.partnership__text { max-inline-size: var(--measure); }

@media (min-width: 768px) {
    .statement { padding: var(--space-xl); }
}

@media (min-width: 992px) {
    .judicial__grid {
        grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
        gap: calc(var(--space-3xl) + var(--space-md));
    }

    .judicial__lead { font-size: var(--fs-xl); }

    .partnership__grid {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr);
        align-items: start;
        gap: calc(var(--space-3xl) + var(--space-md));
    }
}
