/**
 * About Us - Responsive CSS
 * Media queries para mobile/tablet
 */

@media (max-width: 1024px) {
    .sslp-about-us__content {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .sslp-about-us__stats {
        grid-template-columns: repeat(2, 1fr);
    }

    /* Variant B - Timeline */
    .sslp-about-us--variant-b .sslp-about-us__timeline-line {
        left: 20px;
    }

    .sslp-about-us--variant-b .sslp-about-us__timeline-item,
    .sslp-about-us--variant-b .sslp-about-us__timeline-item:nth-child(even) {
        flex-direction: row;
        text-align: left;
        padding-left: 80px;
    }

    .sslp-about-us--variant-b .sslp-about-us__timeline-dot {
        left: 20px;
        transform: none;
    }

    .sslp-about-us--variant-b .sslp-about-us__timeline-content {
        max-width: 100%;
    }

    /* Variant D - Split */
    .sslp-about-us--variant-d .sslp-about-us__split {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .sslp-about-us--variant-d .sslp-about-us__pillars {
        grid-template-columns: 1fr;
    }

    /* Variant E - Dark */
    .sslp-about-us--variant-e .sslp-about-us__dark-content {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    /* Variant F - Fun cards */
    .sslp-about-us--variant-f .sslp-about-us__fun-cards {
        grid-template-columns: 1fr;
    }

    .sslp-about-us--variant-f .sslp-about-us__founder-fun {
        flex-direction: column;
        text-align: center;
    }

    .sslp-about-us--variant-f .sslp-about-us__founder-bubble::before {
        display: none;
    }

    /* Variant G - Social */
    .sslp-about-us--variant-g .sslp-about-us__featured-person {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .sslp-about-us--variant-g .sslp-about-us__person-quote {
        padding-left: 0;
        border-left: none;
        border-top: 3px solid var(--sslp-accent);
        padding-top: 20px;
    }

    .sslp-about-us--variant-g .sslp-about-us__person-social {
        justify-content: center;
    }

    .sslp-about-us--variant-g .sslp-about-us__social-stats {
        flex-wrap: wrap;
        gap: 30px;
    }

    /* Variant H - Urgent */
    .sslp-about-us--variant-h .sslp-about-us__urgent-layout {
        grid-template-columns: 1fr;
        gap: 40px;
    }
}

@media (max-width: 768px) {
    .sslp-about-us {
        padding: 60px 0;
    }

    .sslp-about-us__header {
        margin-bottom: 40px;
    }

    .sslp-about-us__title {
        font-size: clamp(28px, 6vw, 36px);
    }

    .sslp-about-us__glass {
        padding: 24px;
    }

    .sslp-about-us__ceo {
        flex-direction: column;
        text-align: center;
    }

    .sslp-about-us__stats {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
        padding: 24px;
    }

    .sslp-about-us__stat-value {
        font-size: 28px;
    }

    /* Variant C - Minimal */
    .sslp-about-us--variant-c {
        padding: 80px 0;
    }

    .sslp-about-us--variant-c .sslp-about-us__description {
        font-size: 18px;
    }

    /* Variant F - Fun */
    .sslp-about-us--variant-f .sslp-about-us__emoji-badge {
        font-size: 36px;
    }

    /* Variant H - Urgent */
    .sslp-about-us--variant-h .sslp-about-us__urgent-stat {
        font-size: 36px;
    }
}

@media (max-width: 480px) {
    .sslp-about-us .sslp-container {
        padding: 0 16px;
    }

    .sslp-about-us__badge {
        padding: 6px 16px;
        font-size: 12px;
    }

    .sslp-about-us .sslp-btn {
        width: 100%;
        justify-content: center;
        padding: 14px 24px;
    }

    .sslp-about-us .sslp-btn--xlarge {
        padding: 16px 24px;
        font-size: 16px;
    }

    .sslp-about-us__stats {
        grid-template-columns: 1fr 1fr;
    }

    /* Variant B - Timeline */
    .sslp-about-us--variant-b .sslp-about-us__timeline-item,
    .sslp-about-us--variant-b .sslp-about-us__timeline-item:nth-child(even) {
        padding-left: 60px;
    }

    .sslp-about-us--variant-b .sslp-about-us__timeline-content {
        padding: 16px;
    }

    /* Variant G - Social stats */
    .sslp-about-us--variant-g .sslp-about-us__social-stats {
        gap: 20px;
    }

    .sslp-about-us--variant-g .sslp-about-us__social-stat-value {
        font-size: 24px;
    }
}
