/*==================================================
RUSH TECH
RESPONSIVE.CSS
==================================================*/



/*==================================================
1400px
==================================================*/

@media(max-width:1400px){

.hero-grid{

gap:50px;

}

.laptop-card{

width:500px;

}

.phone-card{

width:200px;

}

}



/*==================================================
1200px
==================================================*/

@media(max-width:1200px){

.container{

width:94%;

}

.hero-grid{

grid-template-columns:1fr;

text-align:center;

}

.hero-content{

max-width:850px;

margin:auto;

}

.hero-description{

margin-inline:auto;

}

.hero-buttons{

justify-content:center;

}

.hero-trust{

justify-content:center;

}

.hero-visual{

margin-top:70px;

height:720px;

}

.about-grid{

grid-template-columns:1fr;

}

.about-content{

text-align:center;

}

.services-grid{

grid-template-columns:repeat(2,1fr);

}

.project-showcase,

.project-showcase.reverse{

grid-template-columns:1fr;

}

.project-showcase.reverse .project-image,

.project-showcase.reverse .project-content{

order:unset;

}

.project-content{

text-align:center;

}

.project-content p{

margin-inline:auto;

}

.project-tech{

justify-content:center;

}

.tech-grid{

grid-template-columns:repeat(3,1fr);

}

.why-grid{

grid-template-columns:repeat(2,1fr);

}

.footer-grid{

grid-template-columns:repeat(2,1fr);

gap:45px;

}

.training-banner{

grid-template-columns:1fr;

text-align:center;

}

.contact-grid{

grid-template-columns:1fr;

}

.contact-btn{

margin-inline:auto;

}

}
/*==================================================
992px
TABLETS
==================================================*/

@media (max-width:992px){

section{

padding:90px 0;

}

.menu-btn{

display:block;

z-index:1001;

}

.nav-links{

position:fixed;

top:0;

right:-100%;

width:320px;

height:100vh;

background:#fff;

display:flex;

flex-direction:column;

justify-content:center;

align-items:center;

gap:35px;

box-shadow:-20px 0 60px rgba(0,0,0,.08);

transition:.45s ease;

}

.nav-links.active{

right:0;

}

.nav-actions .btn-primary{

display:none;

}

.hero-visual{

height:620px;

}

.laptop-card{

position:absolute;

width:420px;

left:50%;

transform:translateX(-50%);

}

.phone-card{

width:170px;

right:8%;

top:240px;

}

.analytics-card{

left:5%;

bottom:80px;

}

.code-card{

display:none;

}

.review-card{

right:8%;

bottom:30px;

}

.about-highlights{

grid-template-columns:1fr 1fr;

}

.services-grid{

grid-template-columns:1fr;

}

.tech-grid{

grid-template-columns:repeat(2,1fr);

}

.project-stats{

grid-template-columns:repeat(2,1fr);

}

.timeline::before{

left:26px;

}

.timeline-number{

width:56px;

height:56px;

font-size:1rem;

}

.testimonial-slider{

grid-template-columns:1fr;

}

.footer-grid{

grid-template-columns:1fr;

text-align:center;

}

.footer-about{

max-width:600px;

margin:auto;

}

.social-links{

justify-content:center;

}

.footer-contact p{

justify-content:center;

}

.footer-btn{

margin:auto;

display:inline-flex;

}

}



/*==================================================
768px
LARGE PHONES
==================================================*/

@media (max-width:768px){

h1{

font-size:2.8rem;

}

h2{

font-size:2.2rem;

}

.hero{

padding-top:120px;

}

.hero-description{

font-size:1rem;

}

.hero-buttons{

flex-direction:column;

align-items:center;

}

.hero-buttons a{

width:100%;

max-width:320px;

}

.hero-trust{

flex-direction:column;

align-items:center;

}

.trust-item{

width:100%;

max-width:340px;

text-align:center;

}

.hero-visual{

height:520px;

}

.laptop-card{

width:330px;

}

.phone-card{

width:140px;

top:210px;

}

.analytics-card{

display:none;

}

.review-card{

display:none;

}

.about-highlights{

grid-template-columns:1fr;

}

.highlight-card{

text-align:center;

}

.highlight-card i{

margin-inline:auto;

}

.project-showcase{

margin-bottom:90px;

}

.project-image img{

border-radius:20px;

}

.project-content h3{

font-size:2rem;

}

.tech-grid{

grid-template-columns:1fr 1fr;

}

.why-grid{

grid-template-columns:1fr;

}

.training-banner{

gap:40px;

}

.contact-map img{

min-height:350px;

}

.project-stats{

grid-template-columns:1fr;

}

.footer-bottom{

flex-direction:column;

text-align:center;

}

}
/*==================================================
576px
SMALL PHONES
==================================================*/

@media (max-width:576px){

.container{

width:92%;

}

section{

padding:75px 0;

}

.section-heading{

margin-bottom:50px;

}

.section-tag{

font-size:.72rem;

padding:7px 15px;

}

h1{

font-size:2.3rem;

line-height:1.15;

}

h2{

font-size:1.9rem;

}

h3{

font-size:1.3rem;

}

p{

font-size:.98rem;

}

.logo img{

width:150px;

}

.nav-links{

width:100%;

}

.hero-content{

text-align:center;

}

.hero-buttons{

gap:15px;

}

.hero-buttons a{

width:100%;

max-width:none;

}

.hero-visual{

height:420px;

margin-top:40px;

}

.laptop-card{

width:270px;

}

.phone-card{

width:115px;

top:170px;

right:5%;

border-width:6px;

}

.scroll-indicator{

display:none;

}

.service-card img{

height:190px;

}

.project-content h3{

font-size:1.8rem;

}

.project-tech{

gap:10px;

}

.project-tech span{

font-size:.82rem;

padding:8px 14px;

}

.timeline{

margin-top:40px;

}

.timeline-item{

gap:18px;

margin-bottom:40px;

}

.timeline::before{

left:20px;

}

.timeline-number{

width:42px;

height:42px;

font-size:.85rem;

}

.timeline-content{

padding:22px;

}

.tech-card{

padding:20px;

font-size:.92rem;

}

.why-card{

padding:30px 24px;

}

.testimonial-card{

padding:28px;

}

.client-info img{

width:55px;

height:55px;

}

.faq-question{

padding:22px;

font-size:1rem;

}

.faq-answer p{

padding:0 22px 22px;

}

.contact-card{

padding:22px;

}

.contact-map img{

min-height:260px;

}

.footer-logo{

width:150px;

margin-inline:auto;

}

.footer-grid{

gap:35px;

}

.social-links{

gap:12px;

}

.social-links a{

width:44px;

height:44px;

}

.floating-whatsapp{

width:58px;

height:58px;

font-size:1.5rem;

right:18px;

bottom:18px;

}

#backToTop{

width:50px;

height:50px;

right:18px;

bottom:92px;

}

.cursor-glow{

display:none;

}

}



/*==================================================
400px
EXTRA SMALL DEVICES
==================================================*/

@media (max-width:400px){

h1{

font-size:2rem;

}

h2{

font-size:1.7rem;

}

.hero-visual{

height:360px;

}

.laptop-card{

width:230px;

}

.phone-card{

width:95px;

top:145px;

}

.hero-trust{

gap:14px;

}

.trust-item{

padding:18px;

}

.project-content h3{

font-size:1.6rem;

}

.tech-grid{

grid-template-columns:1fr;

}

.footer-bottom p{

font-size:.82rem;

}

}



/*==================================================
LANDSCAPE PHONES
==================================================*/

@media (max-height:500px) and (orientation:landscape){

#hero{

min-height:auto;

padding-top:130px;

padding-bottom:80px;

}

.hero-grid{

gap:40px;

}

.hero-visual{

height:420px;

}

.nav-links{

overflow-y:auto;

}

}



/*==================================================
REDUCED MOTION
Accessibility
==================================================*/

@media (prefers-reduced-motion: reduce){

*{

animation:none !important;

transition:none !important;

scroll-behavior:auto !important;

}

}



/*==================================================
PRINT STYLES
==================================================*/

@media print{

#header,

#backToTop,

.floating-whatsapp,

#preloader,

.cursor-glow{

display:none !important;

}

body{

background:#fff;

color:#000;

}

a{

text-decoration:none;

color:#000;

}

}



/*==================================================
END OF RESPONSIVE.CSS
==================================================*/