/* ===================================
   RESPONSIVE.CSS
   Mobile First — Rising Star Digital
   =================================== */

/* ---- TABLET (max 1024px) ---- */
@media (max-width:1024px){
    .container{padding:0 20px}
    .nav-container{padding:.5rem 1.5rem;gap:1rem}
    .nav-menu{gap:1rem}
    .nav-link{font-size:.85rem}
    .logo-image{width:55px;height:55px}

    .hero{padding:120px 20px 80px}
    .hero-title{font-size:3rem}
    .hero-subtitle{font-size:1.05rem}

    .why-us-grid{grid-template-columns:1fr;gap:3rem}
    .visual-card-wrap{max-width:100%;min-height:auto}

    .services-grid{grid-template-columns:repeat(2,1fr)}
    .testimonials-grid{grid-template-columns:repeat(2,1fr)}
    .blog-grid{grid-template-columns:repeat(2,1fr)}
    .blog-featured{grid-template-columns:1fr}
    .blog-featured-content{padding:2rem}

    .pricing-grid{grid-template-columns:1fr;max-width:500px;margin:0 auto 4rem}
    .pricing-card.featured{transform:none}
    .pfaq-grid{grid-template-columns:1fr}

    .footer-content{grid-template-columns:repeat(2,1fr);gap:2rem}
    .team-page-grid{grid-template-columns:repeat(3,1fr)}
    .mv-grid{grid-template-columns:repeat(3,1fr)}
    .features-grid{grid-template-columns:repeat(3,1fr)}

    .newsletter-content{flex-direction:column;text-align:center}
    .newsletter-form{min-width:100%}

    .section-title{font-size:2.4rem}
    .page-header{padding:140px 20px 80px!important}
}

/* ---- MOBILE (max 768px) ---- */
@media (max-width:768px){

    /* NAVBAR */
    .hamburger{display:flex!important}
    .nav-container{
        padding:.6rem 1rem;
        justify-content:space-between;
        gap:0;
    }
    .logo{order:1;flex-shrink:0;margin:0}
    .hamburger{order:2;margin:0}
    .logo-image{width:50px;height:50px;border-width:2px}

    .nav-menu{
        position:fixed!important;
        top:0;right:-100%!important;left:auto!important;
        width:80%;max-width:290px;
        height:100vh;
        background:#fff;
        flex-direction:column!important;
        align-items:flex-start!important;
        padding:80px 1.5rem 2rem;
        gap:0!important;
        box-shadow:-5px 0 30px rgba(0,0,0,.15);
        transition:right .3s ease!important;
        overflow-y:auto;
        z-index:999;
        order:3;
        flex:none!important;
        justify-content:flex-start!important;
        margin:0!important;
    }
    .nav-menu.active{right:0!important}
    .nav-menu li{width:100%;border-bottom:1px solid #f0f4ff}
    .nav-menu li:last-child{border-bottom:none}
    .nav-link{display:block!important;padding:.9rem 0;font-size:.95rem}
    .nav-link::after{display:none!important}
    .btn-nav{display:block!important;text-align:center;padding:.8rem 1.2rem;margin-top:.5rem}
    .dropdown-menu{
        position:static!important;opacity:1!important;visibility:visible!important;
        transform:none!important;box-shadow:none!important;
        background:#f0f4ff;border-radius:10px;
        padding:.4rem 0;margin:.4rem 0 .8rem 1rem;min-width:unset;
    }
    .dropdown-menu a{padding:.55rem 1rem;font-size:.88rem}
    .nav-overlay{
        display:none;position:fixed;inset:0;
        background:rgba(0,0,0,.5);z-index:998;
    }
    .nav-overlay.active{display:block}

    /* HERO */
    .hero{padding:95px 16px 55px;min-height:auto}
    .hero-title{font-size:1.95rem;line-height:1.3;letter-spacing:-.02em}
    .hero-subtitle{font-size:.95rem;margin-bottom:1.75rem}
    .hero-badge{font-size:.75rem;padding:.5rem 1rem}
    .hero-badge-wrap{margin-bottom:1.25rem}

    .hero-cta{flex-direction:column!important;align-items:center;gap:.85rem;margin-bottom:2rem}
    .hero-btn-primary,.hero-btn-secondary,.hero-btn-outline{
        width:100%!important;max-width:300px;
        justify-content:center;font-size:.95rem;padding:.9rem 1.5rem;
    }
    .hero-trust{gap:.4rem;font-size:.75rem}
    .trust-dot{display:none}
    .scroll-indicator{display:none}

    .hero-stats{
        display:grid!important;
        grid-template-columns:1fr 1fr;
        gap:0;padding:1rem;max-width:100%;
        flex-wrap:unset!important;
    }
    .stat-divider{display:none!important}
    .stat-item{padding:.75rem .5rem;border-bottom:1px solid rgba(255,255,255,.1)}
    .stat-item:nth-child(1),.stat-item:nth-child(3){border-right:1px solid rgba(255,255,255,.1)}
    .stat-number{font-size:1.85rem}
    .stat-item p{font-size:.75rem}

    /* SECTIONS */
    .section-title{font-size:1.75rem}
    .section-subtitle{font-size:.95rem}
    .section-header{margin-bottom:2rem}

    /* WHY US */
    .why-us-section{padding:55px 16px}
    .why-us-grid{grid-template-columns:1fr;gap:2rem}
    .why-us-content h2{font-size:1.75rem}
    .why-us-content p{font-size:.95rem}
    .usp-list li{font-size:.9rem;gap:.75rem;padding:.75rem 0}
    .visual-float-card{display:none!important}
    .visual-card-wrap{min-height:auto}
    .visual-main-card{padding:2rem}
    .image-placeholder{height:260px;font-size:4rem}

    /* SERVICES */
    .services-section{padding:55px 16px}
    .services-grid{grid-template-columns:1fr!important;gap:1.25rem}
    .service-card{padding:2rem 1.5rem!important;border-radius:20px!important}
    .service-card h3{font-size:1.2rem}

    /* PROCESS */
    .process-section{padding:55px 16px}
    .process-grid{flex-direction:column!important;align-items:center;gap:.5rem}
    .process-step{max-width:100%!important;width:100%}
    .process-arrow{transform:rotate(90deg);margin:0;padding:.2rem 0}

    /* TESTIMONIALS */
    .testimonials-section{padding:55px 16px}
    .testimonials-grid{grid-template-columns:1fr!important;gap:1.25rem}
    .testi-card{padding:1.75rem 1.5rem}

    /* NEWSLETTER */
    .newsletter-section{padding:45px 16px}
    .newsletter-content{padding:2rem 1.5rem;gap:1.5rem;flex-direction:column;text-align:center}
    .newsletter-text h3{font-size:1.4rem}
    .newsletter-form{flex-direction:column!important;gap:.75rem;min-width:100%!important}
    .newsletter-form input,.newsletter-form button{width:100%}

    /* CTA */
    .cta-section{padding:55px 16px}
    .cta-content h2{font-size:1.75rem}
    .cta-content p{font-size:.95rem;margin-bottom:2rem}
    .cta-buttons{flex-direction:column!important;align-items:center;gap:1rem}
    .cta-buttons .hero-btn-primary,
    .cta-buttons .hero-btn-outline{width:100%!important;max-width:300px;justify-content:center}

    /* PAGE HEADER */
    .page-header{padding:105px 16px 55px!important}
    .page-header h1{font-size:1.95rem}
    .page-header p{font-size:.95rem}

    /* ABOUT */
    .about-story{padding:55px 16px}
    .story-content h2{font-size:1.75rem}
    .story-content p{font-size:.95rem}
    .mission-vision{padding:55px 16px}
    .mv-grid{grid-template-columns:1fr!important;gap:1.25rem}
    .mv-card{padding:2rem 1.5rem}
    .why-choose{padding:55px 16px}
    .features-grid{grid-template-columns:1fr!important;gap:1.25rem}
    .feature-card{padding:2rem 1.5rem}

    /* TEAM PAGE */
    .team-page-section{padding:55px 16px}
    .team-page-grid{grid-template-columns:repeat(2,1fr)!important;gap:1.25rem}
    .team-page-grid .team-card:last-child:nth-child(3n+1){grid-column:auto!important}
    .team-card-body{padding:1.25rem 1rem}
    .team-card-body h4{font-size:1.05rem}
    .team-card-img{height:240px}
    .team-join-cta{padding:2.5rem 1.5rem;margin-top:3rem}
    .team-join-cta h3{font-size:1.5rem}

    /* PRICING */
    .pricing-section{padding:55px 16px 75px}
    .pricing-grid{grid-template-columns:1fr!important;max-width:100%}
    .pricing-card.featured{transform:none!important}
    .pricing-card.featured:hover{transform:translateY(-8px)!important}
    .pfaq-grid{grid-template-columns:1fr!important}
    .custom-plan-content{flex-direction:column;text-align:center}
    .comparison-table th,.comparison-table td{padding:.7rem .75rem;font-size:.8rem}

    /* BLOG */
    .blog-section{padding:55px 16px 75px}
    .blog-featured{grid-template-columns:1fr!important}
    .blog-featured-content{padding:1.5rem!important}
    .blog-featured-content h2{font-size:1.25rem}
    .blog-grid{grid-template-columns:1fr!important;gap:1.25rem}
    .blog-filters{gap:.5rem}
    .blog-filter-btn{padding:.5rem 1rem;font-size:.82rem}
    .blog-newsletter{padding:2rem 1.5rem}
    .blog-newsletter-content{flex-direction:column;text-align:center}
    .blog-newsletter-content .newsletter-form{min-width:100%!important;flex-direction:column}

    /* CONTACT */
    .contact-section{padding:55px 16px}
    .contact-grid{grid-template-columns:1fr!important;gap:2rem}
    .contact-info-box{position:static!important}
    .form-row{grid-template-columns:1fr!important}
    .contact-form-box{padding:2rem 1.5rem}

    /* TESTIMONIALS PAGE */
    .testimonials-main{padding:60px 16px}
    .testimonials-grid{grid-template-columns:1fr!important}
    .testimonial-card{padding:2rem 1.5rem}
    .stats-grid{grid-template-columns:repeat(2,1fr)!important}
    .logos-grid{grid-template-columns:repeat(2,1fr)!important}

    /* FOOTER */
    .footer{padding:55px 16px 24px}
    .footer-content{grid-template-columns:1fr!important;gap:2rem}
    .footer-bottom{flex-direction:column;gap:1rem;text-align:center}
    .footer-links{flex-wrap:wrap;justify-content:center;gap:1rem}
    .footer-logo-image{width:50px;height:50px}
    .footer-newsletter-form{flex-direction:column}
    .footer-newsletter-form button{width:100%;height:50px;border-radius:50px}
    .social-links{flex-wrap:wrap}

    /* CLIENTS */
    .clients-strip{padding:2rem 16px}
    .clients-logos{gap:1.25rem}
    .clients-logos span{font-size:.85rem}

    /* MISC */
    .btn{padding:.85rem 1.75rem;font-size:.95rem}
    .left-sidebar{display:none!important}
    .team-section{padding:55px 16px}
    .team-grid{grid-template-columns:repeat(2,1fr);gap:1.5rem}
}

/* ---- SMALL MOBILE (max 480px) ---- */
@media (max-width:480px){
    .container{padding:0 14px}
    .nav-container{padding:.5rem .85rem}
    .logo-image{width:46px;height:46px}

    .hero{padding:90px 14px 50px}
    .hero-title{font-size:1.7rem}
    .hero-subtitle{font-size:.9rem}
    .hero-badge{font-size:.72rem;padding:.45rem .85rem}
    .stat-number{font-size:1.65rem}
    .stat-item p{font-size:.72rem}

    .section-title{font-size:1.55rem}
    .page-header h1{font-size:1.7rem}
    .page-header{padding:95px 14px 50px!important}

    .team-page-grid{grid-template-columns:1fr!important}
    .team-card-img{height:280px}
    .team-grid{grid-template-columns:1fr!important}
    .mv-grid{grid-template-columns:1fr!important}
    .features-grid{grid-template-columns:1fr!important}
    .services-grid{grid-template-columns:1fr!important}
    .testimonials-grid{grid-template-columns:1fr!important}

    .service-card{padding:1.75rem 1.25rem!important}
    .feature-card{padding:1.75rem 1.25rem}
    .mv-card{padding:1.75rem 1.25rem}
    .testi-card{padding:1.5rem 1.25rem}
    .pricing-card{padding:2rem 1.5rem}

    .cta-content h2{font-size:1.55rem}
    .newsletter-text h3{font-size:1.25rem}
    .blog-card-img{height:160px}

    .footer-links{flex-direction:column;gap:.5rem}
    .footer-logo-image{width:45px;height:45px}

    .stats-grid{grid-template-columns:1fr!important}
    .logos-grid{grid-template-columns:repeat(2,1fr)!important}
    .testimonial-card{padding:2rem 1.25rem}
}

/* ---- VERY SMALL (max 360px) ---- */
@media (max-width:360px){
    .hero-title{font-size:1.55rem}
    .stat-number{font-size:1.5rem}
    .hero-stats{padding:.75rem}
    .section-title{font-size:1.4rem}
    .page-header h1{font-size:1.55rem}
    .nav-container{padding:.5rem .75rem}
    .logo-image{width:42px;height:42px}
}