/* Responsive Styles for Mobile and Tablet */

/* Large devices (desktops, less than 1200px) */
@media (max-width: 1199.98px) {
    .hero-title {
        font-size: 3rem;
    }
    
    .hero-title-v2 {
        font-size: 2.5rem;
    }
    
    .hero-title-large {
        font-size: 3.5rem;
    }
    
    .hero-heading-modern {
        font-size: 3rem;
    }
    
    .hero-giant-title {
        font-size: 4rem;
    }
}

/* Medium devices (tablets, less than 992px) */
@media (max-width: 991.98px) {
    .navbar-rounded {
        padding: 0.75rem 1rem;
        border-radius: 32px;
    }

    .navbar-rounded .container {
        flex-wrap: wrap;
    }

    .navbar-rounded .navbar-toggler {
        margin-left: auto;
    }

    .navbar-rounded .navbar-collapse {
        width: 100%;
        margin-top: 0.75rem;
        background-color: rgba(255, 255, 255, 0.98) !important;
        border-radius: 24px;
        padding: 1rem 1.25rem;
        box-shadow: 0 12px 30px rgba(15, 23, 42, 0.15) !important;
    }
    
    .navbar-rounded .navbar-collapse.show {
        background-color: #ffffff  !important;
    }


    body.dark-theme .navbar-rounded .navbar-collapse {
        background-color: #ffffff !important;
    }

    body.dark-theme .navbar-nav.align-items-center .dropdown-menu {
        background-color: #ffffff !important;
    }

    .navbar-nav.mx-auto {
        flex-direction: column;
        align-items: stretch;
        gap: 0.75rem;
        width: 100%;
        
    }

    .navbar-nav.mx-auto .nav-item {
        width: 100%;
    }

    .navbar-nav.mx-auto .nav-link {
        display: block;
        width: 100%;
        padding: 0.4rem 0.25rem !important;
        text-align: left;
    }

    .navbar-nav.align-items-center {
        flex-direction: column;
        align-items: stretch;
        gap: 0.75rem;
        width: 100%;
        margin-top: 0.5rem;
    }

    .navbar-nav.align-items-center .nav-item {
        width: 100%;
    }

    .navbar-nav.align-items-center .btn-signin,
    .navbar-nav.align-items-center .dropdown-menu {
        width: 100%;
    }

    .navbar-nav.align-items-center .btn-signin {
        display: block;
        text-align: center;
    }

    .navbar-nav.align-items-center .dropdown-menu {
        position: static !important;
        transform: none !important;
        margin-top: 0;
        border: none;
        box-shadow: none;
        padding: 0;
        background: transparent;
    }

    .navbar-nav.align-items-center .dropdown-menu .dropdown-item {
        width: 100%;
        text-align: left;
        padding: 0.5rem 0;
    }

    .navbar-nav.align-items-center .dropdown-divider {
        margin: 0.5rem 0;
    }

    .navbar-nav.align-items-center .dropdown-toggle::after {
        margin-left: auto;
    }

    .hero-title {
        font-size: 2.5rem;
    }
    
    .hero-title-v2 {
        font-size: 2.2rem;
    }
    
    .hero-title-large {
        font-size: 2.8rem;
    }
    
    .hero-heading-modern {
        font-size: 2.5rem;
    }
    
    .hero-giant-title {
        font-size: 3.2rem;
    }
    
    .hero-subtitle {
        font-size: 1rem;
        max-width: 100%;
    }
    
    .hero-subtitle-v2 {
        font-size: 1.1rem;
    }
    
    .hero-subtitle-large {
        font-size: 1rem;
    }
    
    .hero-description-modern {
        font-size: 1rem;
    }
    
    .hero-desc-large {
        font-size: 1rem;
        max-width: 100%;
    }
    
    .hero-actions {
        flex-direction: column;
        align-items: flex-start;
    }
    
    .hero-cta-wrapper {
        flex-direction: column;
        align-items: stretch;
    }
    
    .cta-wrapper-modern {
        flex-direction: column;
        align-items: flex-start;
    }
    
    .btn-hero-primary,
    .btn-hero-secondary,
    .btn-hero-gradient {
        width: 100%;
        text-align: center;
        justify-content: center;
    }
    
    .btn-start-free,
    .btn-demo {
        width: 100%;
        text-align: center;
    }
    
    .btn-get-started {
        width: 100%;
        text-align: center;
    }
    
    .cta-note-modern {
        margin-left: 0;
    }
    
    .payment-info {
        margin-left: 0 !important;
        margin-top: 0.5rem;
    }
    
    .dashboard-image {
        transform: none;
    }
    
    .dashboard-screen {
        transform: none;
    }
    
    .hero-section-modern {
        padding: 4rem 0;
    }
    
    .hero-section-aifiesta {
        padding: 3rem 0;
    }
}
    
    .navbar-nav {
        padding: 1rem 0;
    }
    
    .nav-item {
        padding: 0.5rem 0;
    }
    
    .pricing-card {
        margin-bottom: 2rem;
    }
    
    .company-logo {
        max-width: 90px;
        max-height: 50px;
    }
    
    .logo-slide {
        gap: 3rem;
    }
    
    .platform-logo {
        max-width: 70px;
        max-height: 70px;
    }
    
    .platform-slide {
        gap: 2.5rem;
    }
    
    .platform-item {
        min-width: 110px;
    }
}

/* Small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {
    .hero-title {
        font-size: 2rem;
    }
    
    .hero-title-v2 {
        font-size: 1.8rem;
    }
    
    .hero-title-large {
        font-size: 2.2rem;
        line-height: 1.15;
    }
    
    .hero-heading-modern {
        font-size: 2rem;
        margin-top: 1rem;
    }
    
    .hero-giant-title {
        font-size: 2.5rem;
        line-height: 1;
        margin-bottom: 1.5rem;
    }
    
    .hero-title .emoji-icon {
        height: 35px;
    }
    
    .hero-subtitle {
        font-size: 0.95rem;
    }
    
    .hero-subtitle-v2 {
        font-size: 1rem;
    }
    
    .hero-subtitle-large {
        font-size: 0.95rem;
    }
    
    .hero-description-modern {
        font-size: 0.95rem;
    }
    
    .hero-desc-large {
        font-size: 1rem;
        margin-bottom: 2rem;
    }
    
    .badge-tag {
        font-size: 0.7rem;
        padding: 0.4rem 0.8rem;
    }
    
    .badge-pill {
        font-size: 0.65rem;
        padding: 0.4rem 0.8rem;
    }
    
    .badge-pill-top {
        font-size: 0.7rem;
        padding: 0.4rem 1rem;
    }
    
    .badge-modern {
        font-size: 0.7rem;
        padding: 0.25rem 0.65rem;
    }
    
    .yc-badge {
        font-size: 0.7rem;
        padding: 0.4rem 0.9rem;
        margin-bottom: 1.5rem;
    }
    
    .features-list li {
        font-size: 0.9rem;
    }
    
    .features-list-modern li {
        font-size: 0.9rem;
    }
    
    .btn-success {
        width: 100%;
        justify-content: center;
    }
    
    .btn-hero-primary,
    .btn-hero-secondary,
    .btn-hero-gradient {
        padding: 0.8rem 1.5rem;
        font-size: 0.95rem;
    }
    
    .btn-start-free,
    .btn-demo {
        padding: 0.7rem 1.2rem;
        font-size: 0.95rem;
    }
    
    .btn-get-started {
        padding: 0.9rem 2rem;
        font-size: 1rem;
        width: 100%;
    }
    
    .cta-note-modern {
        margin-top: 0.5rem;
        width: 100%;
    }
    
    .hero-tagline-bottom {
        margin-top: 1rem;
        font-size: 0.9rem;
    }
    
    .hero-blur-effect {
        width: 15rem;
        height: 15rem;
    }
    
    .blur-orb {
        width: 15rem;
        height: 15rem;
        right: -4rem;
        top: -4rem;
    }
    
    .hero-section-v2 {
        padding: 3rem 0;
        min-height: auto;
    }
    
    .hero-section-modern {
        padding: 3rem 0;
        min-height: auto;
    }
    
    .hero-section-aifiesta {
        padding: 2.5rem 0;
    }
}
    
    .display-3 {
        font-size: 2.5rem;
    }
    
    .display-4 {
        font-size: 2rem;
    }
    
    .display-5 {
        font-size: 1.75rem;
    }
    
    .btn-lg {
        padding: 0.75rem 1.5rem;
        font-size: 1rem;
    }
    
    .price-tag {
        font-size: 2.5rem;
    }
    
    .stats {
        flex-direction: column;
        gap: 1rem;
    }
    
    .avatar {
        width: 35px;
        height: 35px;
    }
    
    .feature-card,
    .testimonial-card {
        margin-bottom: 1.5rem;
    }
    
    .platform-card {
        padding: 1rem;
    }
    
    .platform-card img {
        max-height: 40px;
    }
    
    .company-logo {
        max-width: 70px;
        max-height: 40px;
    }
    
    .logo-slide {
        gap: 2rem;
    }
    
    .logo-scroll {
        animation: scroll 30s linear infinite;
    }
    
    .platform-logo {
        max-width: 60px;
        max-height: 60px;
    }
    
    .platform-slide {
        gap: 2rem;
    }
    
    .platform-scroll {
        animation: scroll 25s linear infinite;
    }
    
    .platform-item {
        min-width: 100px;
    }
    
    .platform-name {
        font-size: 0.75rem;
    }
    
    .hero-section {
        padding: 3rem 0 !important;
    }
    
    .min-vh-75 {
        min-height: auto;
    }
    
    .footer {
        text-align: center;
    }
    
    .footer .col-lg-2,
    .footer .col-lg-3,
    .footer .col-lg-4 {
        margin-bottom: 2rem;
    }
}

/* Extra small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) {
    .hero-content h1 {
        font-size: 1.75rem;
    }
    
    .hero-content h2 {
        font-size: 1rem;
    }
    
    .display-3 {
        font-size: 2rem;
    }
    
    .display-4 {
        font-size: 1.75rem;
    }
    
    .btn-lg {
        padding: 0.65rem 1.25rem;
        font-size: 0.95rem;
        width: 100%;
    }
    
    .price-tag {
        font-size: 2rem;
    }
    
    .navbar-brand img {
        height: 30px;
    }
    
    .navbar-brand span {
        font-size: 1.25rem;
    }
    
    .promo-banner small {
        font-size: 0.75rem;
    }
    
    .stat-card {
        padding: 1.5rem;
    }
    
    .stat-card h2 {
        font-size: 2rem;
    }
    
    .social-links a {
        width: 35px;
        height: 35px;
        font-size: 0.9rem;
    }
    
    .video-badge {
        position: static;
        transform: none;
        margin-top: 1rem;
    }
    
    .video-badge .btn {
        width: 100%;
    }
    
    .avatar-group {
        justify-content: center;
    }
    
    section {
        padding: 3rem 0 !important;
    }
    
    .card-body {
        padding: 1.5rem !important;
    }
}

/* Print styles */
@media print {
    .navbar,
    .promo-banner,
    .footer,
    .btn,
    .scroll-to-top {
        display: none !important;
    }
    
    .hero-section,
    .cta-section {
        background: white !important;
        color: black !important;
    }
}

/* Dark mode support (optional) */
@media (prefers-color-scheme: dark) {
    /* Add dark mode styles if needed */
}

/* Landscape orientation for mobile */
@media (max-width: 767.98px) and (orientation: landscape) {
    .hero-section {
        min-height: auto;
        padding: 2rem 0 !important;
    }
    
    .navbar {
        padding: 0.5rem 0;
    }
}

/* High resolution displays */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .company-logo,
    .platform-card img {
        image-rendering: -webkit-optimize-contrast;
    }
}