/* =========================================================
   AMITEAES PUBLIC WEBSITE — MOBILE VIEW EXACT FIX
   Desktop is untouched. Rules apply only on tablets/mobiles.
   ========================================================= */

@media (max-width: 900px){

  html,body{
    width:100%;
    max-width:100%;
    overflow-x:hidden !important;
  }

  *,*::before,*::after{box-sizing:border-box}
  img,svg,video,iframe{max-width:100%;height:auto}

  /* ---------- HOME / SHARED TOP BAR ---------- */
  .topbar{
    height:auto !important;
    min-height:0 !important;
  }

  .topbar-row{
    width:100% !important;
    height:auto !important;
    min-height:0 !important;
    padding:8px 14px !important;
    display:flex !important;
    flex-wrap:wrap !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:7px 10px !important;
    font-size:11px !important;
  }

  .topbar-row > div:first-child{
    width:100%;
    text-align:center;
    white-space:normal !important;
    line-height:1.45;
  }

  .toplinks{
    width:100% !important;
    display:flex !important;
    gap:5px !important;
    justify-content:center !important;
    overflow-x:auto !important;
    white-space:nowrap !important;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
  }
  .toplinks::-webkit-scrollbar{display:none}
  .toplinks a{
    flex:0 0 auto;
    padding:5px 7px !important;
    font-size:10px !important;
  }
  .top-login{padding:5px 10px !important}

  /* ---------- HOME / SHARED HEADER ---------- */
  .header{
    position:relative !important;
    top:auto !important;
    height:auto !important;
  }

  .header-row{
    width:100% !important;
    min-height:0 !important;
    padding:10px 14px 8px !important;
    display:flex !important;
    flex-wrap:wrap !important;
    align-items:center !important;
    gap:8px 10px !important;
  }

  .brand{
    min-width:0 !important;
    width:auto !important;
    max-width:calc(100% - 2px) !important;
    flex:1 1 100% !important;
    display:flex !important;
    align-items:center !important;
    gap:9px !important;
  }

  .brand > img{
    flex:0 0 auto !important;
    width:62px !important;
    height:48px !important;
    max-width:62px !important;
    object-fit:contain !important;
  }

  .brand-copy{
    min-width:0 !important;
    display:flex !important;
    flex-direction:column !important;
  }
  .brand-copy b{
    font-size:20px !important;
    line-height:1.05 !important;
  }
  .brand-copy strong{
    font-size:10px !important;
    line-height:1.25 !important;
    white-space:normal !important;
  }
  .brand-copy small{
    font-size:9px !important;
    line-height:1.25 !important;
  }

  .header-row nav{
    order:3;
    width:100% !important;
    max-width:100% !important;
    display:flex !important;
    gap:2px !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    white-space:nowrap !important;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
    padding:5px 0 2px !important;
  }
  .header-row nav::-webkit-scrollbar{display:none}
  .header-row nav a{
    flex:0 0 auto !important;
    min-height:38px !important;
    padding:9px 10px !important;
    font-size:11px !important;
    display:inline-flex !important;
    align-items:center !important;
  }

  .header-row .post-btn{
    order:2;
    width:100% !important;
    min-height:42px !important;
    padding:10px 14px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    font-size:11px !important;
    margin:0 !important;
  }

  /* ---------- HOME HERO: true mobile stack ---------- */
  .am-hero{
    width:100% !important;
    height:auto !important;
    min-height:0 !important;
    display:block !important;
    grid-template-columns:1fr !important;
    padding:0 !important;
    overflow:hidden !important;
    background:
      linear-gradient(rgba(255,255,255,.95),rgba(255,255,255,.95)),
      url("../images/home/hero-engineering-background.png") center / cover no-repeat !important;
  }

  .am-hero-left{
    width:100% !important;
    padding:30px 18px 18px !important;
    display:block !important;
  }

  .am-hero-tag{
    margin:0 0 12px !important;
    font-size:12px !important;
    line-height:1.3 !important;
    letter-spacing:1.2px !important;
  }

  .am-hero-left h1{
    margin:0 !important;
    font-size:36px !important;
    line-height:1.04 !important;
    letter-spacing:-.5px !important;
    overflow-wrap:normal !important;
  }

  .am-hero-left h1 br{display:none !important}

  .am-hero-description{
    width:100% !important;
    max-width:none !important;
    margin:16px 0 0 !important;
    font-size:14px !important;
    line-height:1.55 !important;
    color:#314d6e !important;
  }

  .am-hero-buttons{
    width:100% !important;
    margin-top:20px !important;
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:10px !important;
  }

  .am-hero-buttons a{
    width:100% !important;
    height:auto !important;
    min-height:46px !important;
    padding:10px 12px !important;
    font-size:11px !important;
    line-height:1.25 !important;
    text-align:center !important;
  }

  /* These are the four icons that were getting hidden/faded */
  .am-hero-benefits{
    width:100% !important;
    margin-top:20px !important;
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:12px !important;
    position:relative !important;
    z-index:3 !important;
  }

  .am-hero-benefits > div{
    min-width:0 !important;
    display:flex !important;
    align-items:center !important;
    gap:8px !important;
    opacity:1 !important;
    visibility:visible !important;
  }

  .am-hero-benefits > div > span{
    flex:0 0 30px !important;
    width:30px !important;
    height:30px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    opacity:1 !important;
    visibility:visible !important;
    color:#ff641a !important;
    background:#fff !important;
    border:1px solid #0b3766 !important;
  }

  .am-hero-benefits strong{
    font-size:11px !important;
    opacity:1 !important;
    color:#082950 !important;
  }
  .am-hero-benefits small{
    font-size:9px !important;
    opacity:1 !important;
    color:#62738a !important;
  }

  /* Do not overlay the blue solution box over text/icons on mobile */
  .am-hero-solution-box{
    position:relative !important;
    top:auto !important;
    right:auto !important;
    bottom:auto !important;
    left:auto !important;
    transform:none !important;
    width:calc(100% - 36px) !important;
    max-width:none !important;
    margin:4px 18px 26px !important;
    padding:18px 18px !important;
    z-index:2 !important;
  }

  .am-hero-solution-box h3{
    font-size:15px !important;
    line-height:1.4 !important;
  }
  .solution-box-line{
    min-height:40px !important;
    font-size:11px !important;
    line-height:1.35 !important;
  }

  .am-hero-right{display:none !important}

  /* ---------- HOME SECTIONS ---------- */
  .how-container,
  .partner-container,
  .catalog-section .wrap,
  .industries-section .wrap,
  .projects-section .wrap,
  .solutions-section .wrap{
    width:100% !important;
    max-width:100% !important;
    padding-left:14px !important;
    padding-right:14px !important;
  }

  .how-process{
    grid-template-columns:1fr !important;
    gap:12px !important;
  }
  .how-arrow{display:none !important}

  .dual-catalog{
    grid-template-columns:1fr !important;
    gap:24px !important;
  }

  .catalog-section .dual-catalog .card-row{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:10px !important;
  }

  .catalog-section .dual-catalog .compact-card{
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
  }

  .catalog-section .dual-catalog .compact-card img{
    width:100% !important;
    height:120px !important;
    object-fit:contain !important;
    background:#fff !important;
  }

  /* common public grids */
  .products-grid,.product-grid,.services-grid,.service-grid,
  .solutions-grid,.solution-grid,.industries-grid,.industry-grid,
  .projects-grid,.project-grid,.cards-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:10px !important;
  }

  /* public filters/sidebar */
  .shop-layout,.catalog-layout,.products-layout,.services-layout{
    grid-template-columns:1fr !important;
    display:grid !important;
    gap:14px !important;
  }
  .sidebar,.catalog-sidebar,.product-sidebar,.service-sidebar,.filters{
    position:static !important;
    width:100% !important;
    max-width:100% !important;
  }

  .search-row,.filter-row,.catalog-toolbar,.shop-toolbar{
    grid-template-columns:1fr !important;
    display:grid !important;
    gap:8px !important;
  }

  input,select,textarea{font-size:16px !important;max-width:100% !important}

  /* Footer */
  .footer-grid,.footer-cols,.footer-columns{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:20px 14px !important;
  }

  /* Floating cart: do not cover header/nav */
  .am-cart-float{
    position:fixed !important;
    top:auto !important;
    right:12px !important;
    bottom:16px !important;
    width:52px !important;
    height:52px !important;
    z-index:9996 !important;
  }
  .am-cart-drawer{
    width:100% !important;
    max-width:100vw !important;
  }

  /* Any table on public side: scroll safely */
  .table-wrap,.table-responsive,.responsive-table,.table-container{
    width:100% !important;
    overflow-x:auto !important;
    -webkit-overflow-scrolling:touch;
  }
}

/* Small phones */
@media (max-width: 560px){

  .toplinks{
    justify-content:flex-start !important;
  }

  .brand > img{
    width:54px !important;
    height:43px !important;
    max-width:54px !important;
  }

  .brand-copy b{font-size:18px !important}
  .brand-copy strong{font-size:9px !important}
  .brand-copy small{font-size:8px !important}

  .am-hero-left{
    padding:26px 14px 16px !important;
  }

  .am-hero-left h1{
    font-size:31px !important;
  }

  .am-hero-buttons{
    grid-template-columns:1fr !important;
  }

  .am-hero-benefits{
    grid-template-columns:1fr 1fr !important;
    gap:10px 8px !important;
  }

  .am-hero-solution-box{
    width:calc(100% - 28px) !important;
    margin:4px 14px 22px !important;
  }

  .catalog-section .dual-catalog .card-row,
  .products-grid,.product-grid,.services-grid,.service-grid,
  .solutions-grid,.solution-grid,.industries-grid,.industry-grid,
  .projects-grid,.project-grid,.cards-grid{
    grid-template-columns:1fr !important;
  }

  .footer-grid,.footer-cols,.footer-columns{
    grid-template-columns:1fr !important;
  }
}
