/* Mobile Typography - Optimized Font Sizes for RS Galeri Candra */

/* Desktop Typography - Larger for better readability */
@media (min-width: 768px) {
    p {
        font-size: 18px !important;
        line-height: 1.7;
    }
}

@media (max-width: 767px) {
    /* Paragraphs - 12px on mobile */
    p {
        font-size: 12px !important;
        line-height: 1.6;
    }
    
    /* Headings - Mobile optimized sizes */
    h1 {
        font-size: 24px !important;
        line-height: 1.3;
    }
    
    h2 {
        font-size: 20px !important;
        line-height: 1.3;
    }
    
    h3 {
        font-size: 16px !important;
        line-height: 1.4;
    }
    
    h4 {
        font-size: 14px !important;
        line-height: 1.4;
    }
    
    h5, h6 {
        font-size: 13px !important;
        line-height: 1.4;
    }
    
    /* Article & Card Text on Mobile */
    .article-title {
        font-size: 14px !important;
    }
    
    .article-excerpt {
        font-size: 12px !important;
    }
    
    .article-meta {
        font-size: 11px !important;
    }
    
    /* Service Card Text */
    .service-card h3,
    .service-card .text-lg {
        font-size: 14px !important;
    }
    
    .service-card p,
    .service-card .text-sm {
        font-size: 12px !important;
    }
    
    /* Button Text */
    button,
    .btn,
    a.btn {
        font-size: 13px !important;
    }
    
    /* Tailwind Text Utilities Override */
    .text-xs {
        font-size: 10px !important;
    }
    
    .text-sm {
        font-size: 12px !important;
    }
    
    .text-base {
        font-size: 12px !important;
    }
    
    .text-lg {
        font-size: 14px !important;
    }
    
    .text-xl {
        font-size: 16px !important;
    }
    
    .text-2xl {
        font-size: 18px !important;
    }
    
    .text-3xl {
        font-size: 20px !important;
    }
    
    .text-4xl {
        font-size: 24px !important;
    }
}