:root{
  --logo: 70px;   /* smaller logo size */
  --gap: 10px;    /* reduced gap */
}

.site-header {
  background: #2d6a4f;
  color: #fff;
  font-family: "Poppins","Trebuchet MS",Helvetica,Arial,sans-serif;
  box-shadow: 0 2px 10px rgba(0,0,0,.18);
  padding: 0;
}

.header-inner {
  max-width: 1500px;
  margin: 0 auto;
  padding: 4px 12px;     /* reduced padding */
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 10px;

  margin-left: 150px;   /* 👈 keep same as menu */
}

/* Logo */
.brand-logo {
  width: 65px;     /* smaller */
  height: 65px;
  border-radius: 50%;
  object-fit: contain;
  border: 2px solid rgba(255,255,255,.85);
  background: none;
  flex: 0 0 auto;
}

/* Brand */
.brand {
  display: flex;
  align-items: center;
  gap: var(--gap);
  flex-wrap: nowrap;
  min-width: 0;
}

/* Title */
.brand-title {
  margin: 0;
  color: #fff;
  font-weight: 700;
  line-height: 1.1;
  white-space: nowrap;
  flex: 0 0 auto;
  font-size: clamp(1.2rem, 2vw + 0.5rem, 2.2rem); /* smaller */
  letter-spacing: 0;
}

/* ---- Mobile ---- */
@media (max-width: 600px){
  .header-inner {
    padding: 8px 12px;
    justify-content: center;
    margin-left: 0;
  }

  .brand {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    column-gap: var(--gap);
    row-gap: 0;
    max-width: 100%;
  }

  .brand-logo {
    width: 48px;
    height: 48px;
  }

  .brand-title {
    white-space: normal;
    font-size: clamp(1rem, 4.5vw, 1.4rem);
    line-height: 1.2;
  }
}