/* =====================================
BASE
===================================== */

.rr-contact-page{
    background:#0a0a0a;
    color:#e5e7eb;
}

.rr-container{
    max-width:1200px;
    margin:0 auto;
    padding:0 20px;
}

/* =====================================
HERO
===================================== */

.rr-contact-hero{

    padding:100px 20px;

    text-align:center;

    background:
    radial-gradient(circle at top right,rgba(139,92,246,.15),transparent 35%),
    linear-gradient(180deg,#0a0a0a,#111111);
}

.rr-contact-badge{

    display:inline-block;

    padding:8px 14px;

    border-radius:999px;

    background:rgba(139,92,246,.12);

    border:1px solid rgba(139,92,246,.25);

    color:#c4b5fd;

    margin-bottom:20px;

    font-size:14px;
}

.rr-contact-hero h1{

    font-size:54px;

    font-weight:800;

    color:#fff;

    margin:0 0 20px;
}

.rr-contact-hero p{

    max-width:850px;

    margin:0 auto;

    color:#a1a1aa;

    font-size:18px;

    line-height:1.9;
}

/* =====================================
SECTION
===================================== */

.rr-contact-section{

    padding:80px 0;

    background:#111111;
}

.rr-contact-alt{

    background:#171717;
}

.rr-section-heading{

    text-align:center;

    max-width:850px;

    margin:0 auto 45px;
}

.rr-section-heading h2{

    color:#fff;

    font-size:36px;

    margin-bottom:15px;
}

.rr-section-heading p{

    color:#a1a1aa;

    line-height:1.8;
}

/* =====================================
CONTACT GRID
===================================== */

.rr-contact-grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:24px;
}

.rr-contact-card{

    background:#171717;

    border:1px solid #2d2d2d;

    border-radius:24px;

    padding:30px;

    transition:.25s ease;
}

.rr-contact-card:hover{

    transform:translateY(-4px);

    border-color:#8b5cf6;
}

.rr-contact-icon{

    font-size:34px;

    margin-bottom:18px;
}

.rr-contact-card h3{

    color:#fff;

    margin-bottom:12px;
}

.rr-contact-card p{

    color:#a1a1aa;

    line-height:1.8;

    margin-bottom:15px;
}

.rr-contact-card a{

    color:#8b5cf6;

    text-decoration:none;

    font-weight:600;
}

/* =====================================
SUPPORT GRID
===================================== */

.rr-support-grid{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:22px;
}

.rr-support-item{

    background:#111111;

    border:1px solid #2d2d2d;

    border-radius:20px;

    padding:28px;
}

.rr-support-item h3{

    color:#fff;

    margin-bottom:12px;
}

.rr-support-item p{

    color:#a1a1aa;

    line-height:1.8;
}

/* =====================================
OFFICE GRID
===================================== */

.rr-office-grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:22px;
}

.rr-office-card{

    background:#171717;

    border:1px solid #2d2d2d;

    border-radius:22px;

    padding:28px;
}

.rr-office-card h3{

    color:#fff;

    margin-bottom:15px;
}

.rr-office-card p{

    color:#cbd5e1;

    line-height:1.8;
}

.rr-office-card a{

    color:#8b5cf6;

    text-decoration:none;

    word-break:break-word;
}

/* =====================================
COUNTRY GRID
===================================== */

.rr-country-grid{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:15px;
}

.rr-country-grid div{

    background:#111111;

    border:1px solid #2d2d2d;

    border-radius:14px;

    padding:15px 18px;

    color:#e5e7eb;

    text-align:center;
}

/* =====================================
FAQ
===================================== */

.rr-faq-grid{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:22px;
}

.rr-faq-card{

    background:#171717;

    border:1px solid #2d2d2d;

    border-radius:20px;

    padding:28px;
}

.rr-faq-card h3{

    color:#fff;

    margin-bottom:12px;
}

.rr-faq-card p{

    color:#a1a1aa;

    line-height:1.8;
}

/* =====================================
CTA
===================================== */

.rr-contact-cta{

    padding:100px 20px;

    text-align:center;

    background:
    linear-gradient(
        135deg,
        rgba(139,92,246,.15),
        rgba(99,102,241,.15)
    );
}

.rr-contact-mini-title{

    display:inline-block;

    margin-bottom:15px;

    color:#c4b5fd;

    letter-spacing:1px;

    font-size:13px;
}

.rr-contact-cta h2{

    color:#fff;

    font-size:44px;

    margin-bottom:20px;
}

.rr-contact-cta p{

    max-width:800px;

    margin:0 auto 25px;

    color:#a1a1aa;

    line-height:1.9;
}

.rr-contact-cta-buttons{

    display:flex;

    justify-content:center;

    gap:15px;

    flex-wrap:wrap;
}

.rr-contact-primary-btn,
.rr-contact-secondary-btn{

    display:inline-block;

    padding:15px 28px;

    border-radius:14px;

    text-decoration:none;

    font-weight:700;

    transition:.25s ease;
}

.rr-contact-primary-btn{

    background:
    linear-gradient(
        135deg,
        #8b5cf6,
        #6366f1
    );

    color:#fff;
}

.rr-contact-secondary-btn{

    border:1px solid #2d2d2d;

    color:#fff;

    background:#171717;
}

/* =====================================
BOTTOM
===================================== */

.rr-contact-bottom{

    background:#111111;
}

.rr-contact-bottom-card{

    background:#171717;

    border:1px solid #2d2d2d;

    border-radius:24px;

    padding:35px;
}

.rr-contact-bottom-card h2{

    color:#fff;

    margin-bottom:25px;

    text-align:center;
}

.rr-contact-bottom-grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:25px;
}

.rr-contact-bottom-grid h3{

    color:#fff;

    margin-bottom:10px;
}

.rr-contact-bottom-grid p{

    color:#a1a1aa;

    line-height:1.8;
}

/* =====================================
MOBILE
===================================== */

@media(max-width:991px){

    .rr-contact-grid,
    .rr-office-grid,
    .rr-contact-bottom-grid{

        grid-template-columns:1fr;
    }

    .rr-country-grid{

        grid-template-columns:repeat(2,1fr);
    }

    .rr-support-grid,
    .rr-faq-grid{

        grid-template-columns:1fr;
    }
}

@media(max-width:768px){

    .rr-contact-hero{

        padding:70px 20px;
    }

    .rr-contact-hero h1{

        font-size:38px;
    }

    .rr-section-heading h2{

        font-size:28px;
    }

    .rr-country-grid{

        grid-template-columns:1fr;
    }

    .rr-contact-cta h2{

        font-size:32px;
    }

    .rr-contact-card,
    .rr-office-card,
    .rr-faq-card,
    .rr-support-item{

        padding:22px;
    }
}