/* =========================
   GLOBAL RESET
========================= */
*{
  box-sizing: border-box;
}

html{
  scroll-behavior: smooth;   /* ✅ Smooth scroll for Contact Us */
}

body{
  margin:0;
  padding:0;
  font-family: Arial, sans-serif;
  background:#f5f5f5;
}

/* =========================
   HEADER
========================= */
.site-header{
  background:#ffffff;
  box-shadow:0 2px 10px rgba(0,0,0,0.08);
  position:sticky;
  top:0;
  z-index:1000;
}

.header-inner{
  max-width:1100px;
  margin:auto;
  padding:10px 14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
}

.menu-btn{
  font-size:26px;
  cursor:pointer;
  display:block;
}

.logo{
  height:36px;   /* Desktop logo */
  width:auto;
}

.sell-btn{
  background:#ff6600;
  color:#ffffff;
  padding:8px 12px;
  border-radius:8px;
  font-weight:bold;
  text-decoration:none;
  font-size:13px;
}

/* =========================
   NAVIGATION
========================= */
#nav{
  display:none;
  background:#ffffff;
  border-top:1px solid #eee;
}

#nav a{
  display:block;
  padding:14px 16px;
  color:#333;
  text-decoration:none;
  font-weight:600;
  border-bottom:1px solid #eee;
}

/* =========================
   DESKTOP NAV
========================= */
@media(min-width:768px){
  .menu-btn{
    display:none;
  }

  #nav{
    display:flex !important;
    justify-content:center;
    background:none;
    border:none;
  }

  #nav a{
    border:none;
    margin:0 12px;
  }
}

/* =========================
   SELL BIKE FORM
========================= */
.sell-container{
  max-width:420px;
  margin:20px auto 80px;
  background:#ffffff;
  padding:22px 20px;
  border-radius:14px;
  box-shadow:0 10px 30px rgba(0,0,0,0.1);
}

.sell-title{
  text-align:center;
  font-size:24px;
  font-weight:bold;
  color:#ff6600;
}

.sell-sub{
  text-align:center;
  color:#666;
  margin-bottom:18px;
  font-size:14px;
}

.sell-container label{
  display:block;
  margin-top:14px;
  font-weight:600;
  font-size:14px;
}

.sell-container input,
.sell-container textarea{
  width:100%;
  padding:13px;
  margin-top:6px;
  border:1px solid #ddd;
  border-radius:8px;
  font-size:15px;
}

.sell-container button{
  margin-top:22px;
  width:100%;
  padding:15px;
  background:#ff6600;
  color:#fff;
  font-size:17px;
  border:none;
  border-radius:10px;
  cursor:pointer;
}

.sell-container button:hover{
  background:#e65c00;
}

.sell-note{
  text-align:center;
  font-size:13px;
  color:#777;
  margin-top:12px;
}

/* =========================
   GENERIC CARD (HOME)
========================= */
.container{
  max-width:420px;
  margin:20px auto;
  padding:22px 18px;
  background:#ffffff;
  text-align:center;
  border-radius:12px;
  box-shadow:0 10px 30px rgba(0,0,0,0.1);
}

/* =========================
   WHATSAPP FLOAT
========================= */
.whatsapp-float{
  position:fixed;
  bottom:18px;
  right:18px;
  width:56px;
  height:56px;
  background:#25D366;
  color:#fff;
  font-size:26px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  box-shadow:0 8px 20px rgba(0,0,0,0.3);
  z-index:9999;
}

.whatsapp-float:hover{
  background:#1ebe5d;
}

/* =========================
   FOOTER
========================= */
.site-footer{
  background:#111;
  color:#ddd;
  padding:28px 14px;
  font-size:14px;
}

.footer-box{
  max-width:1100px;
  margin:auto;
  text-align:center;
}

.site-footer h3{
  color:#fff;
  font-size:17px;
  margin-bottom:12px;
}

.site-footer p{
  margin:8px 0;
  line-height:1.6;
}

.site-footer a{
  color:#ff6600;
  text-decoration:none;
  font-weight:600;
}

.site-footer a:hover{
  text-decoration:underline;
}

.copyright{
  margin-top:16px;
  font-size:13px;
  color:#aaa;
}

/* =========================
   MOBILE FIXES
========================= */
@media(max-width:767px){
  .logo{
    height:30px;   /* Smaller logo on mobile */
  }

  .sell-btn{
    padding:7px 10px;
    font-size:12px;
  }

  .sell-container{
    margin:16px 12px 80px;
    padding:18px;
  }
}

@media(max-width:480px){
  .site-footer{
    padding:24px 12px;
  }

  .site-footer h3{
    font-size:16px;
  }
}