@media (max-width: 900px){
  .about-grid,
  .contact-wrapper{
    grid-template-columns:1fr;
    gap:32px;
  }

  .blog-grid{
    grid-template-columns:1fr 1fr;
    gap:20px;
  }

  .hf-grid{
    grid-template-columns:1fr 1fr;
    gap:28px;
  }
  .hf-brand{
    grid-column:1 / -1;
  }

  .hero-content{
    max-width:100%;
  }
}

@media (max-width: 700px){
  .nav-logo img{height:64px}

  .cat-grid{
    grid-template-columns:1fr;
  }

  .form-grid{
    grid-template-columns:1fr;
    gap:14px;
  }

  .form-grid .inp-group{
    margin-bottom:0;
  }

  .nav-links{
    display:none;
    position:fixed;
    top:0;left:0;right:0;bottom:0;
    width:100vw;
    height:100dvh;
    background:rgba(18,12,5,.98);
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:32px;
    z-index:9000;
    overflow-y:auto;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    padding:80px 24px 40px;
  }

  .nav-links.open{
    display:flex;
  }

  .nav-links a{
    font-size:1.1rem;
    padding:10px 0;
    -webkit-tap-highlight-color:transparent;
  }

  .nav-toggle{
    display:flex;
  }

  .hero-stats{
    gap:24px;
  }

  .hero-stat-num{
    font-size:1.6rem;
  }

  .modal{
    padding:24px;
    max-width:95%;
    width:calc(100vw - 24px);
  }

  .modal-title{
    font-size:1.4rem;
  }

  .contact-pref{
    flex-direction:column;
  }

  .ipoz-item{
    min-height:44px;
    font-size:.9rem;
  }
  .ipoz-item input[type="checkbox"]{
    width:18px;
    height:18px;
  }

  .hf-grid{
    grid-template-columns:1fr;
  }
  .hf-bottom{
    flex-direction:column;
    align-items:center;
    text-align:center;
  }
  .hf-socials{
    justify-content:center;
  }
  .hf-root{margin:8px}
  .hf-logo{height:140px}
  .hf-brand{text-align:center}
  .hf-logo-showcase{padding:20px 5% 40px}
  .hf-showcase-img{width:200px}

  .ref-card{width:260px}
  .marquee-wrap::before,.marquee-wrap::after{width:60px}
}

@media (max-width: 480px){
  .blog-grid{grid-template-columns:1fr}

  section{
    padding:52px 4%;
  }

  #hero{
    padding:90px 4% 50px;
  }

  .hero-btns{
    flex-direction:column;
    align-items:center;
    width:100%;
  }

  .btn-gold,
  .btn-ghost{
    width:100%;
    justify-content:center;
  }

  .about-stat-row{
    grid-template-columns:1fr 1fr;
    gap:12px;
  }

  .form-actions{
    flex-direction:column;
  }

  .modal{
    padding:16px;
    border-radius:18px;
    width:calc(100vw - 16px);
  }

  .contact-form-box{
    padding:22px;
  }

  .city-card{
    width:200px;
    height:130px;
  }

  .nav-phone{display:none}

  .hero-logo{width:300px}
  .nav-logo img{height:64px}

  .faq-q{font-size:.84rem;padding:16px 18px}
  .faq-a{font-size:.82rem}

  .hf-logo{height:120px}
  .hf-showcase-img{width:180px}
  .hf-content{padding:36px 5% 24px}
  .hf-logo-showcase{padding:16px 5% 32px}
}