/* =========================================================
   DORA Band Section — layout only (typography comes from base.css / .text-quote)
   ========================================================= */

.dora-section {
    background-color: var(--color-white);
    /* border-bottom: 1px solid var(--color-border); */
}

.dora-section .dora-section-wrapper {
    gap: 48px;
    padding-block: var(--section-padding);
}

/* ---------- Content ---------- */

.dora-section .dora-section-wrapper .dora-section-content {
    flex-shrink: 0;
    width: 600px;
    gap: 18px;
}

.dora-section .dora-section-wrapper .dora-section-content h3 {
    color: var(--color-teal-700);
}

.dora-section .dora-section-wrapper .dora-section-content .dora-section-quote {
    gap: 18px;
}

/* ---------- Snapshot ---------- */

.dora-section .dora-section-wrapper .dora-section-snapshot {
    flex: 1 1 0;
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-2xl);
    /* the export is cropped to the card itself, so the drop shadow lives here */
    box-shadow: var(--shadow-md);
}

.dora-section .dora-section-wrapper .dora-section-snapshot img {
    aspect-ratio: 556 / 327;
    object-fit: cover;
}

/* ---------- Large Desktop / Laptop ---------- */
@media (max-width: 1199px) {

    .dora-section .dora-section-wrapper {
        gap: var(--space-lg);
    }

    .dora-section .dora-section-wrapper .dora-section-content {
        /* flex: 1 1 480px; */
        width: 480px;
    }

    .dora-section .dora-section-wrapper .dora-section-content h2 br {
        display: none;
    }

}

/* ---------- Tablet ---------- */
@media (max-width: 991px) {

    .dora-section .dora-section-wrapper {
        flex-direction: column;
        align-items: stretch;
        gap: var(--space-md);
    }

    .dora-section .dora-section-wrapper .dora-section-content {
        flex: 0 0 auto;
        width: 100%;
        gap: var(--space-sm);
    }

    .dora-section .dora-section-wrapper .dora-section-content .dora-section-quote {
        gap: var(--space-sm);
    }

    .dora-section .dora-section-wrapper .dora-section-snapshot {
        flex: 0 0 auto;
    }

}

/* ---------- Mobile ---------- */