/*====================================================
  FIBERTECH RESPONSIVE DESIGN
====================================================*/


/*==============================
 LARGE SCREENS
==============================*/

@media(max-width:1200px){

.hero h1{
    font-size:58px;
}


.technology-grid{
    grid-template-columns:repeat(3,1fr);
}


.trusted-grid{
    grid-template-columns:repeat(4,1fr);
}


.industry-grid{
    grid-template-columns:repeat(3,1fr);
}

}



/*==============================
 TABLETS
==============================*/

@media(max-width:992px){


.custom-navbar{

    background:rgba(3,7,18,.95);

}


.navbar-collapse{

    background:#0B1220;

    padding:25px;

    border-radius:20px;

    margin-top:20px;

    overflow:visible !important;

}



.nav-action{

    margin-top:20px;

}



.hero{

    padding-top:120px;

}



.hero h1{

    font-size:48px;

}



.hero-buttons{

    flex-wrap:wrap;

}



.hero-metrics{

    gap:25px;

}



.hero-metrics h2{

    font-size:30px;

}



.technology-hub{

    height:500px;

    margin-top:50px;

}



.services-section,
.why-section,
.technology-section,
.solutions-section{

    padding:80px 0;

}



.section-header h2,
.why-content h2,
.cta-box h2{

    font-size:38px;

}



.technology-grid{

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

}



.stats-wrapper{

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

}



.industry-grid{

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

}



.floating-card:nth-child(1){

    left:20px;

}



.floating-card:nth-child(3){

    left:80px;

}


/* MOBILE NAVBAR */

.navbar-brand h4{

    font-size:22px;

}


.navbar-brand small{

    font-size:11px;

}


.navbar-toggler{

    border:none;

}


.navbar-toggler i{

    font-size:30px;

    color:#00d9ff;

}



.navbar-nav{

    text-align:center;

}



.nav-item{

    margin-bottom:10px;

}



.quote-btn{

    display:block;

    text-align:center;

    margin-top:15px;

}


/* SERVICES DROPDOWN */

.dropdown-menu{

    position:relative !important;

    transform:none !important;

    inset:auto !important;

    width:100%;

    margin-top:10px;

    background:#0b1d33 !important;

    border:1px solid rgba(0,217,255,.25);

    border-radius:12px;

}



.dropdown-menu.show{

    display:block !important;

}



.dropdown-item{

    color:#ffffff !important;

    padding:12px 15px;

    white-space:normal;

}



.dropdown-item:hover{

    background:#00d9ff !important;

    color:#07111f !important;

}


}





/*==============================
 MOBILE PHONES
==============================*/

@media(max-width:576px){


body{

    font-size:15px;

}



.container{

    padding-left:20px;

    padding-right:20px;

}



.hero{

    min-height:auto;

    padding:140px 0 80px;

}



.hero h1{

    font-size:38px;

    line-height:1.2;

}



.hero p{

    font-size:16px;

}



.hero-buttons{

    flex-direction:column;

    gap:15px;

}



.btn-primary,
.btn-outline{

    width:100%;

    text-align:center;

}



.hero-metrics{

    display:grid;

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

    gap:10px;

}



.hero-metrics h2{

    font-size:24px;

}



.hero-metrics p{

    font-size:12px;

}



.technology-hub{

    height:420px;

}



.hub-center{

    height:120px;

    width:120px;

}



.hub-center i{

    font-size:45px;

}



.hub-node{

    height:75px;

    width:75px;

}



.hub-node i{

    font-size:20px;

}



.hub-node p{

    font-size:10px;

}



.trusted-grid{

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

}



.section-header h2,
.why-content h2,
.cta-box h2{

    font-size:32px;

}



.service-card{

    padding:25px;

}



.technology-grid{

    grid-template-columns:1fr;

}



.enterprise-card{

    height:380px;

}



.floating-card{

    width:170px;

    padding:18px;

}



.floating-card h4{

    font-size:16px;

}



.stats-wrapper{

    grid-template-columns:1fr;

}



.stat-box h2{

    font-size:42px;

}



.industry-grid{

    grid-template-columns:1fr;

}



.footer{

    text-align:center;

}



.social-links{

    justify-content:center;

}


}