
.dubaios-header{
  position:sticky;
  top:0;
  z-index:99;
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:16px 20px;
  background:rgba(11,15,20,.8);
  backdrop-filter:blur(20px);
}

.logo a{
  font-size:24px;
  font-weight:700;
  color:var(--accent-gold);
}

.hero{
  min-height:70vh;
  background:url('https://images.unsplash.com/photo-1512453979798-5ea266f8880c?q=80&w=1600&auto=format&fit=crop') center/cover;
  display:flex;
  align-items:end;
  padding:24px;
}

.hero-overlay{
  width:100%;
  background:rgba(0,0,0,.45);
  padding:24px;
  border-radius:28px;
  backdrop-filter:blur(10px);
}

.hero h1{
  font-size:42px;
  margin-bottom:20px;
}

.search-box input{
  width:100%;
  padding:18px;
  border:none;
  border-radius:24px;
  background:rgba(255,255,255,.08);
  color:white;
}

.quick-tags{
  margin-top:18px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.quick-tags span{
  background:rgba(212,175,55,.15);
  color:var(--accent-gold);
  padding:10px 16px;
  border-radius:999px;
}

.feed-section{
  padding:24px;
}

.feed-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:20px;
}

.feed-card{
  background:var(--bg-secondary);
  border-radius:28px;
  overflow:hidden;
  box-shadow:0 10px 30px rgba(0,0,0,.25);
  transition:.3s ease;
}

.feed-card:hover{
  transform:translateY(-4px);
}

.feed-card img{
  width:100%;
  height:240px;
  object-fit:cover;
}

.card-content{
  padding:18px;
}

.mobile-nav{
  position:fixed;
  left:16px;
  right:16px;
  bottom:18px;
  display:flex;
  justify-content:space-around;
  padding:16px;
  border-radius:28px;
  background:rgba(255,255,255,.08);
  backdrop-filter:blur(20px);
}

@media(min-width:768px){
  .feed-grid{
    grid-template-columns:repeat(3,1fr);
  }

  .mobile-nav{
    display:none;
  }
}
