/* Responsive CSS for Sono Sound Healing Website */

/* Base responsive utilities */
.container-responsive {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 1rem;
}

@media (min-width: 640px) {
    .container-responsive {
        padding: 0 1.5rem;
    }
}

@media (min-width: 1024px) {
    .container-responsive {
        padding: 0 2rem;
    }
}

/* Typography responsive scaling */
.text-responsive-xs {
    font-size: 0.75rem;
}

.text-responsive-sm {
    font-size: 0.875rem;
}

.text-responsive-base {
    font-size: 1rem;
}

.text-responsive-lg {
    font-size: 1.125rem;
}

.text-responsive-xl {
    font-size: 1.25rem;
}

.text-responsive-2xl {
    font-size: 1.5rem;
}

.text-responsive-3xl {
    font-size: 1.875rem;
}

.text-responsive-4xl {
    font-size: 2.25rem;
}

@media (min-width: 640px) {
    .text-responsive-xs { font-size: 0.875rem; }
    .text-responsive-sm { font-size: 1rem; }
    .text-responsive-base { font-size: 1.125rem; }
    .text-responsive-lg { font-size: 1.25rem; }
    .text-responsive-xl { font-size: 1.5rem; }
    .text-responsive-2xl { font-size: 1.875rem; }
    .text-responsive-3xl { font-size: 2.25rem; }
    .text-responsive-4xl { font-size: 3rem; }
}

@media (min-width: 768px) {
    .text-responsive-xs { font-size: 1rem; }
    .text-responsive-sm { font-size: 1.125rem; }
    .text-responsive-base { font-size: 1.25rem; }
    .text-responsive-lg { font-size: 1.5rem; }
    .text-responsive-xl { font-size: 1.875rem; }
    .text-responsive-2xl { font-size: 2.25rem; }
    .text-responsive-3xl { font-size: 3rem; }
    .text-responsive-4xl { font-size: 4rem; }
}