
    *{
  margin:0;
  padding:0;
  box-sizing:border-box;
}

body{
  font-family:"Poppins", sans-serif;
  background:#fff6ef;
}

/* ===== TOP BAR ===== */
.top-bar{
  background:linear-gradient(90deg,#fde3d2,#fbc9a6);
  padding:6px 12px;
  font-size:13px;
  color:#5a2d0c;
}
.small-text{ font-size:12px; }

/* ===== HEADER ===== */
.main-header{
  position:sticky;
  top:0;
  z-index:999;
  background:linear-gradient(90deg,#fde7d9,#f9c9a3);
  padding:12px 14px;
  border-bottom-left-radius:18px;
  border-bottom-right-radius:18px;
  box-shadow:0 10px 28px rgba(0,0,0,0.12);
}

.header-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
}

/* LEFT */
.header-left{
  display:flex;
  align-items:center;
  gap:8px;
}

.logo-box{
  background:#fff;
  padding:6px;
  border-radius:50%;
  box-shadow:0 4px 10px rgba(0,0,0,0.18);
}
.logo-box img{
  width:42px;
}

/* ===== BRAND TEXT ===== */
.brand-text{
  line-height:1.2;
}
.brand-text h4{
  margin:0;
  font-family:"Yatra One", cursive;
  font-weight:700;
  letter-spacing:1.5px;
  color:#7b1e1e;
  font-size:15px;
}
.brand-text p{
  margin:0;
  font-family:"Yatra One", cursive;
  font-size:11px;
  letter-spacing:2px;
  color:#a03b0d;
}

/* CENTER NAV */
.main-nav{
  background:#7b1e1e;
  padding:10px 28px;
  border-radius:40px;
  display:flex;
  gap:30px;
  box-shadow:0 8px 20px rgba(0,0,0,0.2);
}
.main-nav a{
  color:#fff;
  text-decoration:none;
  font-weight:500;
  transition:0.3s;
  position:relative;
}
.main-nav a:hover{
  color:#ffddb3;
}

/* RIGHT */
.header-right{
  display:flex;
  align-items:center;
  gap:8px;
}

/* SOCIAL */
.social-icons{
  display:flex;
  gap:8px;
}
.social-icons a{
  width:32px;
  height:32px;
  background:#7b1e1e;
  color:#fff;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  transition:0.3s;
}
.social-icons a:hover{
  background:#a52a2a;
}

/* ICON BUTTON */
.icon-btn{
  background:#fff;
  border:none;
  border-radius:50%;
  width:34px;
  height:34px;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 4px 10px rgba(0,0,0,0.1);
}
.icon-btn i{
  font-size:16px;
  color:#7b1e1e;
}

/* DONATE BUTTON */
.donate-btn{
  background:linear-gradient(135deg,#ff9a3c,#ffb86c);
  padding:8px 18px;
  border-radius:25px;
  color:#000;
  font-weight:600;
  text-decoration:none;
  display:flex;
  align-items:center;
  gap:6px;
  font-size:14px;
  box-shadow:0 6px 15px rgba(255,154,60,0.45);
  transition:0.3s;
}

/* MENU BUTTON */
.menu-btn{
  background:#fff;
  border:none;
  border-radius:50%;
  width:36px;
  height:36px;
  box-shadow:0 4px 10px rgba(0,0,0,0.15);
}
.menu-btn i{
  font-size:22px;
  color:#7b1e1e;
}

/* MOBILE MENU */
.mobile-menu{
  display:none;
  background:linear-gradient(180deg,#7b1e1e,#a52a2a);
  padding:16px;
  text-align:center;
  animation:slideDown 0.35s ease;
  box-shadow:0 10px 25px rgba(0,0,0,0.3);
}
.mobile-menu a{
  display:block;
  padding:12px;
  margin:6px 0;
  color:#fff;
  text-decoration:none;
  border-radius:8px;
  transition:0.3s;
  font-size:15px;
}
.mobile-menu a:hover{
  background:#9b2a2a;
}
.mobile-social{
  margin-top:15px;
  display:flex;
  justify-content:center;
  gap:18px;
}
.mobile-social a{
  color:#fff;
  font-size:22px;
}

/* ANIMATION */
@keyframes slideDown{
  from{ opacity:0; transform:translateY(-10px);}
  to{ opacity:1; transform:translateY(0);}
}

/* ===== MOBILE RESPONSIVE ===== */
@media(max-width:991px){
  .main-nav{ display:none; }
  .social-icons{ display:none; }

  .header-right{
    gap:6px;
  }

  .donate-btn{
    padding:8px 14px;
    font-size:13px;
  }
}

/* ===== EXTRA SMALL DEVICES ===== */
@media(max-width:480px){
  .brand-text h4{
    font-size:14px;
  }
  .brand-text p{
    font-size:10px;
  }

  .logo-box img{
    width:38px;
  }

  .donate-btn{
    width:100%;
    justify-content:center;
    margin-top:8px;
  }

  .header-inner{
    flex-direction:column;
    align-items:flex-start;
    gap:8px;
  }

  .header-right{
    width:100%;
    justify-content:space-between;
  }
}