/* =========================================================
   AMONGIA — responsive.css
========================================================= */

@media (max-width:1050px){
  .container{width:min(100% - 34px,1180px)}
  .main-navigation ul{gap:25px}
  .hero h1{font-size:52px}
  .product-grid{grid-template-columns:repeat(2,1fr)}
  .future-grid{grid-template-columns:1fr}
  .play-banner-button{margin-right:220px}
  .footer-grid{grid-template-columns:repeat(3,1fr)}
}

@media (max-width:760px){
  .container{width:min(100% - 24px,1180px)}
  .header-container{min-height:82px;gap:8px}
  .main-navigation{display:none}
  .language-current{padding:7px 9px}
  .hero{min-height:355px;background-position:62% center}
  .hero-container{min-height:355px;align-items:flex-start;padding-top:105px;padding-bottom:0}
  .hero-content{padding-top:0}
  .hero h1{font-size:45px}
  .hero p{font-size:16px}
  .desktop-only{display:none}
  .product-grid{grid-template-columns:1fr}
  .product-card{max-width:420px;margin-inline:auto;width:100%}
  .product-image{height:230px}
  .google-play-banner{padding:16px;min-height:190px;align-items:flex-start}
  .google-play-content{align-items:flex-start}
  .google-play-content img{width:48px;height:48px}
  .google-play-content h2{font-size:15px}
  .play-banner-button{
    position:absolute;
    left:16px;
    bottom:16px;
    margin:0;
  }
  .phone{width:190px;right:-35px;bottom:-54px}
  .social-layout{flex-direction:column}
  .social-icons{width:100%;display:grid;grid-template-columns:repeat(3,1fr);gap:18px 10px}
  .information-card{width:100%}
  .future-body{grid-template-columns:120px 1fr}
  .future-body img{width:120px;height:120px}
  .footer-grid{grid-template-columns:1fr 1fr}
  .footer-brand{grid-column:1/-1}
  .footer-bottom{flex-direction:column;gap:7px}
}

@media (max-width:430px){
  .hero h1{font-size:39px}
  .product-image{height:205px}
  .future-body{grid-template-columns:1fr}
  .future-body img{width:100%;height:180px}
  .dev-status{margin-left:auto}
  .google-play-content{max-width:70%}
  .phone{opacity:.9;width:160px}
}


/* Keep a little white space above every main product image on phones too. */
@media (max-width:760px){
  .product-card .product-image{
    height:235px;
    padding-top:12px;
  }
}
@media (max-width:430px){
  .product-card .product-image{
    height:210px;
    padding-top:10px;
  }
}