/* =========================
    FOR CONTACT SECTION
======================== */

:root {
    --color-bg: #0a0a0a;
    --color-bg-card: rgba(255, 255, 255, 0.03);
    --color-text: #ffffff;
    --color-text-muted: rgba(255, 255, 255, 0.6);
    --color-border: rgba(255, 255, 255, 0.1);
    --color-border-hover: rgba(102, 126, 234, 0.4);
    --color-primary: #667eea;
    --radius-md: 0.5rem;
    --radius-lg: 1rem;
    --transition-base: 0.3s ease;

    /* Container */
    --container-max: 87.5rem;
    --space-lg: 2rem;
    --space-xl: 4rem;
}

/* Container - Mobile First */
.container {
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 0 1rem;
    width: 100%;
}

/* Container - Desktop padding */
@media (min-width: 769px) {
    .container {
        padding: 0 var(--space-lg);
    }
}

@media (min-width: 1025px) {
    .container {
        padding: 0 var(--space-xl);
    }
}

.wrapper {
    max-width: 97.5rem;
    margin: 0 auto;
    padding: 0 var(--space-lg);
}

/* Visually hidden but accessible to screen readers */
.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}