/* Dayao — mobile header & logo optimization (drop-in override)
   Place after your main CSS. Applies to both <header> and .site-header variants. */

/* Base header bar look */
header, .site-header{
  background:#fff;
}
header .wrap, .site-header .wrap, .nav-wrap{
  max-width:1080px;
  margin:0 auto;
  padding:12px 16px;
  display:flex;
  align-items:center;
  gap:12px;
}

/* Brand / Logo */
header .brand, header .logo, .site-header .brand{
  display:flex;
  align-items:center;
}
header .brand img,
header .logo img,
.site-header .brand img{
  height:32px;           /* desktop size */
  width:auto;
  max-width:52vw;        /* prevent overflow when text logo is wide */
  object-fit:contain;
  display:block;
}

/* Default nav/actions layout */
header nav, .site-header nav{
  display:flex;
  gap:20px;
  align-items:center;
}
header .actions, .site-header .actions{
  display:flex;
  align-items:center;
  gap:12px;
  margin-left:auto;
}

/* Language select touches */
header select, .site-header select{ min-width:88px; }

/* Mobile tweaks */
@media (max-width: 768px){
  header .wrap, .site-header .wrap, .nav-wrap{
    flex-wrap:wrap;            /* allow second row */
    padding:10px 12px;
    gap:10px;
  }

  /* Logo smaller on phones to stay balanced */
  header .brand img,
  header .logo img,
  .site-header .brand img{
    height:32px;               /* <- you can change to 32~40 according preference */
    max-width:50vw;            /* ensure no overflow */
  }

  /* Actions (language + contact) stay on first row at the right */
  header .actions, .site-header .actions{
    order:2;
    margin-left:auto;
    gap:10px;
  }

  /* Contact button a bit slimmer */
  header .contact-btn, .site-header .contact-btn{
    padding:10px 14px;
    font-size:15px;
    border-radius:12px;
    line-height:1.1;
  }

  /* Move nav to second row and spread evenly */
  header nav, .site-header nav{
    order:3;
    width:100%;
    justify-content:space-evenly;
    gap:0;
    padding-top:8px;
    margin-top:6px;
    border-top:1px solid rgba(15,23,42,.06);
  }

  /* Language select font a bit smaller */
  header select, .site-header select{ font-size:14px; }
}

/* Optional: give the next section a bit of air below header on phones */
@media (max-width: 768px){
  .hero, .page-hero, .page-header{ margin-top:4px; }
}