/**
 * ============================================
 * MOBILE & TABLET RESPONSIVENESS ENHANCEMENTS
 * Comprehensive responsive styles for sharp, clear mobile experience
 * ============================================
 */

/* ============================================
   MOBILE FIRST - EXTRA SMALL DEVICES (< 576px)
   ============================================ */
@media (max-width: 575px) {
    /* Global Typography */
    body {
        font-size: 15px;
        line-height: 1.6;
    }

    /* Container Padding */
    .container {
        padding-left: 20px;
        padding-right: 20px;
    }

    /* Navigation Optimizations */
    .navbar {
        padding: 1rem 0;
    }

    .navbar-logo {
        height: 45px !important;
        width: 170px !important;
    }

    .navbar.scrolled .navbar-logo {
        height: 42px !important;
        width: 160px !important;
    }

    .navbar-collapse {
        margin-top: 0.75rem;
        padding: 1.25rem 0.75rem;
    }

    .navbar-nav .nav-link {
        padding: 0.65rem 1.25rem !important;
        font-size: 0.75rem !important;
        margin: 0.2rem 0;
    }

    .btn-contact-nav {
        padding: 0.65rem 1.5rem !important;
        font-size: 0.75rem !important;
        margin: 0.5rem 0 0.25rem 0 !important;
    }

    /* Hero Section - Mobile */
    .hero-ultra-premium {
        min-height: 70vh !important;
        padding: 100px 0 40px !important;
    }

    .hero-premium-label {
        font-size: 0.55rem !important;
        padding: 0.4rem 1rem !important;
        letter-spacing: 2px !important;
    }

    .hero-premium-headline {
        font-size: 2.5rem !important;
        line-height: 1.2 !important;
        margin-bottom: 1.5rem !important;
    }

    .hero-line-1,
    .hero-line-2,
    .hero-line-3 {
        display: block;
        margin-bottom: 0.25rem;
    }

    .hero-premium-text {
        font-size: 0.95rem !important;
        line-height: 1.6 !important;
        margin-bottom: 2rem !important;
    }

    .hero-premium-buttons {
        flex-direction: column !important;
        gap: 1rem !important;
        width: 100%;
    }

    .btn-hero-main,
    .btn-hero-outline {
        width: 100% !important;
        padding: 0.9rem 1.5rem !important;
        font-size: 0.85rem !important;
        justify-content: center !important;
    }

    /* Logo Strip Section */
    .logos-header-wrapper .stats-section-title {
        font-size: 1.75rem !important;
        line-height: 1.3 !important;
    }

    .features-subtitle {
        font-size: 0.9rem !important;
        line-height: 1.6 !important;
    }

    /* Hero Logo Slider - Match Desktop Speed */
    .hero-logo-item {
        padding: 0 1rem;
    }

    .hero-logo-img {
        max-height: 40px !important;
    }

    .hero-logos-track {
        gap: 1.5rem !important;
        animation: scrollLogos 36s linear infinite !important;
    }

    /* Statistics Section */
    .stats-bar-modern {
        padding: 3rem 0 !important;
    }

    .stats-header-wrapper {
        margin-bottom: 2rem !important;
    }

    .stats-section-label {
        font-size: 0.55rem !important;
        padding: 0.4rem 1rem !important;
    }

    .stats-section-title {
        font-size: 1.75rem !important;
        line-height: 1.3 !important;
    }

    .stats-section-subtitle {
        font-size: 0.9rem !important;
    }

    .stat-item-modern {
        padding: 1rem 1rem !important;
        margin-bottom: 1rem !important;
        min-height: auto !important;
        max-height: 300px !important;
    }

    .stat-icon-modern {
        width: 50px !important;
        height: 50px !important;
        font-size: 1.25rem !important;
        margin-bottom: 1rem !important;
    }

    .stat-number-modern {
        font-size: 2.25rem !important;
        margin-bottom: 0.5rem !important;
    }

    .stat-label-modern {
        font-size: 0.8rem !important;
    }

    /* Features Section */
    .features-section-modern {
        padding: 3rem 0 !important;
    }

    .features-header-wrapper {
        margin-bottom: 2rem !important;
    }

    .section-label {
        font-size: 0.55rem !important;
        padding: 0.4rem 1rem !important;
        letter-spacing: 2px !important;
    }

    .section-title {
        font-size: 1.75rem !important;
        line-height: 1.3 !important;
        margin-bottom: 1rem !important;
    }

    .features-subtitle {
        font-size: 0.9rem !important;
    }

    .feature-card-split {
        margin-bottom: 1.5rem !important;
        border-radius: 16px !important;
        min-height: auto !important;
    }

    .feature-image-split {
        height: 200px !important;
        border-radius: 16px 16px 0 0 !important;
    }

    .feature-content-split {
        padding: 0.75rem 1.25rem !important;
        min-height: 290px !important;
    }

    .feature-icon-split {
        width: 50px !important;
        height: 50px !important;
        margin-bottom: 0.75rem !important;
    }

    .feature-icon-split i {
        font-size: 1.5rem !important;
    }

    .feature-title-split {
        font-size: 1.35rem !important;
        margin-bottom: 0.5rem !important;
    }

    .feature-description-split {
        font-size: 0.9rem !important;
        line-height: 1.6 !important;
    }

    /* Process Carousel */
    .process-carousel-section {
        padding: 3rem 0 !important;
    }

    .process-carousel-title {
        font-size: 1.5rem !important;
        line-height: 1.3 !important;
        margin-bottom: 2rem !important;
    }

    #processCarousel {
        padding: 0 0 40px !important;
    }

    .process-carousel-card {
        margin: 20px 0 0 !important;
        padding: 1rem 1.25rem !important;
        min-height: auto !important;
        border-radius: 16px !important;
    }

    .process-step-badge {
        width: 50px !important;
        height: 50px !important;
        font-size: 1.25rem !important;
        top: -20px !important;
        left: 50% !important;
        transform: translateX(-50%) !important;
        border-width: 2px !important;
    }

    .process-carousel-content {
        padding: 1rem 0 0.75rem !important;
        order: 2;
    }

    .process-step-title {
        font-size: 1.5rem !important;
        margin-bottom: 0.75rem !important;
        text-align: left !important;
    }

    .process-step-description {
        font-size: 0.9rem !important;
        line-height: 1.6 !important;
        text-align: left !important;
    }

    .process-carousel-image {
        height: 250px !important;
        order: 1;
        margin-bottom: 1rem !important;
        border-radius: 12px !important;
    }

    .process-carousel-control {
        width: 40px !important;
        height: 40px !important;
    }

    .process-carousel-control-prev {
        left: 5px !important;
    }

    .process-carousel-control-next {
        right: 5px !important;
    }

    .process-carousel-control-prev-icon,
    .process-carousel-control-next-icon {
        width: 1.25rem !important;
        height: 1.25rem !important;
    }

    .process-progress-container {
        width: 100% !important;
        margin-top: 2rem !important;
        height: 4px !important;
    }

    .process-progress-bar {
        height: 4px !important;
    }

    /* Prime Moment Section */
    .prime-moment-section-modern {
        padding: 3rem 0 !important;
    }

    .prime-image-modern {
        height: 250px !important;
        margin-bottom: 2rem !important;
        border-radius: 16px !important;
    }

    .prime-content-wrapper {
        padding: 0 !important;
        text-align: left !important;
    }

    .prime-content-wrapper .section-label {
        text-align: left !important;
    }

    .prime-content-wrapper .section-title {
        text-align: left !important;
    }

    .section-label.text-white {
        font-size: 0.55rem !important;
    }

    .prime-text {
        font-size: 0.9rem !important;
        line-height: 1.6 !important;
        margin-bottom: 1.5rem !important;
        text-align: left !important;
    }

    .prime-highlights {
        margin-bottom: 2rem !important;
    }

    .prime-highlight-item {
        padding: 0.75rem 0 !important;
        margin-bottom: 0.5rem !important;
    }

    .prime-highlight-icon {
        width: 35px !important;
        height: 35px !important;
        margin-right: 0.75rem !important;
    }

    .prime-highlight-icon i {
        font-size: 1rem !important;
    }

    .prime-highlight-text {
        font-size: 0.85rem !important;
        text-align: left !important;
    }

    .prime-highlight-text strong {
        font-size: 0.9rem !important;
        margin-bottom: 0.25rem !important;
        text-align: left !important;
    }

    .prime-highlight-text span {
        font-size: 0.8rem !important;
        text-align: left !important;
    }

    .prime-btn {
        width: 100% !important;
        padding: 0.9rem 1.5rem !important;
        font-size: 0.85rem !important;
    }

    /* FAQ Section */
    .faq-section {
        padding: 3rem 0 !important;
    }

    .faq-header-wrapper {
        margin-bottom: 2rem !important;
    }

    .faq-section-title {
        font-size: 1.75rem !important;
        line-height: 1.3 !important;
    }

    .faq-intro-text {
        font-size: 0.9rem !important;
        line-height: 1.6 !important;
    }

    .accordion-item {
        margin-bottom: 1rem !important;
        border-radius: 12px !important;
    }

    .accordion-button {
        font-size: 0.9rem !important;
        padding: 0.75rem 1.25rem !important;
        line-height: 1.4 !important;
    }

    .accordion-body {
        font-size: 0.85rem !important;
        line-height: 1.6 !important;
        padding: 0.75rem 1.25rem 1rem !important;
    }

    /* CTA Section */
    .cta-section {
        padding: 3rem 0 !important;
    }

    .cta-title {
        font-size: 1.5rem !important;
        line-height: 1.3 !important;
        margin-bottom: 1rem !important;
    }

    .cta-subtitle {
        font-size: 0.9rem !important;
        line-height: 1.6 !important;
        margin-bottom: 1.5rem !important;
    }

    .cta-buttons .btn {
        width: 100% !important;
        padding: 0.9rem 1.5rem !important;
        font-size: 0.85rem !important;
        margin: 0.5rem 0 !important;
    }

    /* Footer */
    .footer {
        padding: 2rem 0 !important;
    }

    .footer .py-5 {
        padding-top: 2rem !important;
        padding-bottom: 2rem !important;
    }

    .footer-title {
        font-size: 1rem !important;
        margin-bottom: 1rem !important;
    }

    .footer-text {
        font-size: 0.85rem !important;
        line-height: 1.6 !important;
    }

    .footer-text a {
        word-break: break-word !important;
        overflow-wrap: break-word !important;
        display: inline-block !important;
        max-width: 100% !important;
    }

    .footer-links li {
        margin-bottom: 0.5rem !important;
    }

    .footer-links a {
        font-size: 0.85rem !important;
    }

    .footer-social-link {
        width: 40px !important;
        height: 40px !important;
        font-size: 1.1rem !important;
    }

    .footer-text-small {
        font-size: 0.75rem !important;
    }

    .footer-legal-link {
        font-size: 0.75rem !important;
    }

    /* About Page Specific */
    .about-hero-section-new {
        padding: 100px 0 30px !important;
        min-height: auto !important;
    }

    .about-hero-badge-new {
        font-size: 0.55rem !important;
        padding: 0.4rem 1rem !important;
        margin-bottom: 1rem !important;
    }

    .about-hero-title-new {
        font-size: 2rem !important;
        margin-bottom: 0.75rem !important;
    }

    .about-hero-description-new {
        font-size: 0.9rem !important;
        margin-bottom: 0 !important;
    }

    .about-firm-section,
    .about-expertise-section,
    .about-milestones-section {
        padding: 2.5rem 0 !important;
    }

    .about-milestones-section .row.g-4 {
        margin-top: 1rem !important;
    }

    .about-milestones-section .col-lg-4 {
        margin-bottom: 1.5rem !important;
    }

    .about-section-badge {
        font-size: 0.55rem !important;
        padding: 0.4rem 1rem !important;
    }

    .about-firm-title,
    .about-expertise-title,
    .about-milestones-title {
        font-size: 1.75rem !important;
    }

    .about-firm-text,
    .about-expertise-text,
    .about-milestones-text {
        font-size: 0.9rem !important;
        line-height: 1.6 !important;
    }

    .about-stat-number {
        font-size: 2rem !important;
    }

    .about-stat-label {
        font-size: 0.85rem !important;
    }

    .about-milestone-card-new {
        padding: 1rem 1.25rem !important;
        margin-bottom: 1.5rem !important;
        min-height: auto !important;
        max-height: none !important;
    }

    .milestone-year {
        font-size: 0.75rem !important;
    }

    .milestone-title {
        font-size: 1.25rem !important;
    }

    .milestone-description {
        font-size: 0.85rem !important;
        line-height: 1.5 !important;
        overflow: visible !important;
        text-overflow: initial !important;
    }

    /* Specific fix for featured milestone card */
    .milestone-card-featured {
        max-height: none !important;
        height: auto !important;
    }

    .milestone-card-featured .milestone-description {
        font-size: 0.83rem !important;
        line-height: 1.45 !important;
    }

    /* Services Page Specific */
    .services-hero-section {
        padding: 100px 0 30px !important;
        min-height: auto !important;
    }

    .services-hero-badge {
        font-size: 0.55rem !important;
        padding: 0.4rem 1rem !important;
        margin-bottom: 1rem !important;
    }

    .services-hero-title {
        font-size: 2rem !important;
        margin-bottom: 0.75rem !important;
    }

    .services-hero-description {
        font-size: 0.9rem !important;
        margin-bottom: 0 !important;
    }

    .services-main-section {
        padding: 2.5rem 0 !important;
    }

    /* Logo Strip Section */
    .logos-header-wrapper .stats-section-title {
        font-size: 1.75rem !important;
        line-height: 1.3 !important;
    }

    .features-subtitle {
        font-size: 0.9rem !important;
        line-height: 1.6 !important;
    }
    section[class*="hero"] {
        min-height: auto !important;
    }

    section[class*="hero"] .container {
        padding-top: 1rem !important;
        padding-bottom: 1rem !important;
    }

    .services-badge-modern {
        font-size: 0.55rem !important;
        padding: 0.4rem 1rem !important;
    }

    .services-main-title {
        font-size: 1.75rem !important;
    }

    .services-main-subtitle {
        font-size: 0.9rem !important;
    }

    .service-slide-container {
        padding: 1rem 1.25rem !important;
        border-radius: 16px !important;
        min-height: auto !important;
    }

    .service-slide-number {
        font-size: 2rem !important;
    }

    .service-slide-content {
        text-align: left !important;
        min-height: auto !important;
        max-height: 300px !important;
    }

    .service-slide-title {
        font-size: 1.35rem !important;
        text-align: left !important;
    }

    .service-slide-description {
        font-size: 0.9rem !important;
        text-align: left !important;
    }

    .service-slide-image {
        height: 200px !important;
        border-radius: 12px !important;
        margin-bottom: 1.5rem !important;
    }

    /* Market Page Specific */
    .market-overview-badge {
        font-size: 0.55rem !important;
        padding: 0.4rem 1rem !important;
    }

    .market-overview-title {
        font-size: 1.75rem !important;
    }

    .market-overview-description {
        font-size: 0.9rem !important;
        margin-bottom: 2.5rem !important;
    }

    .modern-stat-card {
        padding: 1rem 1.25rem !important;
        margin-bottom: 1.5rem !important;
        border-radius: 16px !important;
        min-height: auto !important;
        max-height: 300px !important;
    }

    .modern-stat-icon {
        width: 36px !important;
        height: 36px !important;
    }

    .modern-stat-icon i {
        font-size: 1.1rem !important;
    }

    .modern-stat-value {
        font-size: 2rem !important;
    }

    .modern-stat-desc {
        font-size: 0.85rem !important;
    }

    .benefits-badge-refined {
        font-size: 0.55rem !important;
        padding: 0.4rem 1rem !important;
    }

    .benefits-main-title {
        font-size: 1.75rem !important;
    }

    .benefits-main-subtitle {
        font-size: 0.9rem !important;
    }

    .benefit-card-refined {
        padding: 1rem 1.25rem !important;
        margin-bottom: 1.5rem !important;
        border-radius: 16px !important;
        text-align: left !important;
        min-height: auto !important;
        max-height: 300px !important;
    }

    .benefit-number-refined {
        font-size: 2.25rem !important;
    }

    .benefit-icon-refined {
        width: 50px !important;
        height: 50px !important;
    }

    .benefit-icon-refined i {
        font-size: 1.35rem !important;
    }

    .benefit-title-refined {
        font-size: 1.25rem !important;
        text-align: left !important;
    }

    .benefit-text-refined {
        font-size: 0.9rem !important;
        text-align: left !important;
    }

    .return-card-ultra-premium {
        padding: 1rem 1.25rem !important;
        margin-bottom: 1.5rem !important;
        border-radius: 16px !important;
        min-height: auto !important;
        max-height: 300px !important;
    }

    .return-distillery-badge {
        font-size: 0.6rem !important;
        padding: 0.35rem 0.85rem !important;
    }

    .return-value-ultra {
        font-size: 2.25rem !important;
    }

    .return-label-ultra {
        font-size: 0.65rem !important;
    }

    .return-detail-label {
        font-size: 0.75rem !important;
    }

    .return-detail-value {
        font-size: 0.85rem !important;
    }

    /* Exit Strategies Page */
    .exit-hero-section {
        padding: 100px 0 30px !important;
        min-height: auto !important;
    }

    .exit-hero-badge {
        font-size: 0.55rem !important;
        padding: 0.4rem 1rem !important;
        margin-bottom: 1rem !important;
    }

    .exit-hero-title {
        font-size: 1.75rem !important;
        margin-bottom: 0.75rem !important;
    }

    .exit-hero-description {
        font-size: 0.9rem !important;
        margin-bottom: 0 !important;
    }

    .exit-options-section {
        padding: 3rem 0 !important;
    }

    .exit-strategy-card-refined {
        padding: 1rem 1.25rem !important;
        margin-bottom: 1.5rem !important;
        border-radius: 16px !important;
        text-align: left !important;
        min-height: auto !important;
        max-height: 450px !important;
    }

    .exit-strategy-icon-refined {
        width: 55px !important;
        height: 55px !important;
    }

    .exit-strategy-icon-refined i {
        font-size: 1.5rem !important;
    }

    .exit-strategy-title {
        font-size: 1.35rem !important;
        text-align: left !important;
    }

    .exit-strategy-description {
        font-size: 0.9rem !important;
        text-align: left !important;
    }

    .exit-feature-item {
        font-size: 0.85rem !important;
    }

    /* Contact Page */
    .contact-hero-section {
        padding: 100px 0 30px !important;
        min-height: auto !important;
    }

    .contact-hero-badge {
        font-size: 0.55rem !important;
        padding: 0.4rem 1rem !important;
        margin-bottom: 1rem !important;
    }

    .contact-hero-title {
        font-size: 1.75rem !important;
        margin-bottom: 0.75rem !important;
    }

    .contact-hero-description {
        font-size: 0.9rem !important;
        margin-bottom: 0 !important;
    }

    .contact-main-section {
        padding: 3rem 0 !important;
    }

    .contact-form-premium {
        padding: 1rem 1.25rem !important;
        border-radius: 16px !important;
        margin-bottom: 2rem !important;
    }

    .contact-form-title {
        font-size: 1.5rem !important;
    }

    .contact-form-subtitle {
        font-size: 0.85rem !important;
    }

    .form-label-premium {
        font-size: 0.85rem !important;
    }

    .form-control-premium,
    .form-select-premium {
        padding: 0.75rem 1rem !important;
        font-size: 0.9rem !important;
    }

    .btn-contact-submit {
        padding: 0.9rem 1.5rem !important;
        font-size: 0.85rem !important;
        width: 100% !important;
    }

    .contact-info-premium {
        padding: 1rem 1.25rem !important;
        border-radius: 16px !important;
    }

    .contact-info-title {
        font-size: 1.35rem !important;
    }

    .contact-info-subtitle {
        font-size: 0.85rem !important;
    }

    .contact-info-item-premium {
        padding: 0.75rem !important;
        gap: 1rem !important;
        align-items: flex-start !important;
    }

    .contact-info-icon {
        width: 50px !important;
        height: 50px !important;
        min-width: 50px !important;
        flex-shrink: 0 !important;
    }

    .contact-info-content {
        flex: 1;
        min-width: 0;
        overflow: hidden;
    }

    .contact-info-item-premium h6 {
        font-size: 0.85rem !important;
    }

    .contact-info-item-premium a,
    .contact-info-item-premium p {
        font-size: 0.8rem !important;
        word-break: break-word !important;
        overflow-wrap: break-word !important;
        line-height: 1.5 !important;
        display: block !important;
    }

    .contact-service-card {
        padding: 1rem 1.25rem !important;
        margin-bottom: 1.5rem !important;
        border-radius: 16px !important;
        min-height: auto !important;
        max-height: 300px !important;
    }

    .contact-service-icon {
        width: 50px !important;
        height: 50px !important;
        font-size: 1.35rem !important;
    }

    .contact-service-card h5 {
        font-size: 1.15rem !important;
    }

    .contact-service-card p {
        font-size: 0.85rem !important;
    }
}

/* ============================================
   SMALL DEVICES - PORTRAIT PHONES (576px - 767px)
   ============================================ */
@media (min-width: 576px) and (max-width: 767px) {
    /* Slightly larger mobile styles */
    body {
        font-size: 15px;
    }

    .container {
        padding-left: 24px;
        padding-right: 24px;
    }

    .hero-premium-headline {
        font-size: 2.75rem !important;
    }

    .section-title {
        font-size: 2rem !important;
    }

    .stat-item-modern {
        padding: 1.25rem 1.25rem !important;
    }

    .feature-card-split {
        margin-bottom: 2.5rem !important;
    }

    .benefit-card-refined {
        padding: 1rem 1.5rem !important;
    }
}

/* ============================================
   MEDIUM DEVICES - TABLETS (768px - 991px)
   ============================================ */
@media (min-width: 768px) and (max-width: 991px) {
    /* Tablet optimizations */
    body {
        font-size: 16px;
    }

    .container {
        max-width: 720px;
    }

    .hero-premium-headline {
        font-size: 3.5rem !important;
    }

    .section-title {
        font-size: 2.5rem !important;
    }

    /* Two column layouts for cards */
    .feature-card-split,
    .benefit-card-refined,
    .exit-strategy-card-refined {
        margin-bottom: 2rem;
    }

    /* Improved touch targets */
    .btn,
    .nav-link,
    .accordion-button {
        min-height: 44px;
    }
}

/* ============================================
   IMAGE OPTIMIZATIONS FOR ALL MOBILE DEVICES
   ============================================ */
@media (max-width: 991px) {
    img {
        max-width: 100%;
        height: auto;
        display: block;
    }

    .hero-bg-img,
    .prime-bg-image {
        object-fit: cover;
        object-position: center;
    }

    /* Ensure sharp images on retina displays */
    img {
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        image-rendering: -webkit-optimize-contrast;
        image-rendering: crisp-edges;
    }
}

/* ============================================
   TOUCH-FRIENDLY ENHANCEMENTS
   ============================================ */
@media (hover: none) and (pointer: coarse) {
    /* Remove hover effects on touch devices */
    .feature-card-split:hover,
    .benefit-card-refined:hover,
    .exit-strategy-card-refined:hover {
        transform: none !important;
    }

    /* Increase touch target sizes */
    .btn,
    .nav-link,
    .accordion-button,
    .carousel-control-prev,
    .carousel-control-next {
        min-height: 44px;
        min-width: 44px;
    }

    /* Improve carousel controls for touch */
    .carousel-control-prev,
    .carousel-control-next {
        opacity: 1;
    }
}

/* ============================================
   PERFORMANCE OPTIMIZATIONS
   ============================================ */
@media (max-width: 991px) {
    /* Reduce animations on mobile */
    * {
        animation-duration: 0.3s !important;
        transition-duration: 0.3s !important;
    }

    /* Optimize scroll performance */
    * {
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
    }
}