/* ====== Google Fonts ====== */
@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@700&family=Poppins:wght@400;600;700&display=swap');

/* ====== Reset ====== */
* { margin:0; padding:0; box-sizing:border-box; }
body { font-family:'Poppins', sans-serif; line-height:1.6; color:#333; scroll-behavior:smooth; background:#f9f9f9; }
a { text-decoration:none; color:inherit; }
ul { list-style:none; }

/* ====== Container ====== */
.container { width:90%; max-width:1200px; margin:0 auto; }

/* ====== Header ====== */
.header {
  position: fixed;
  top:0; left:0; width:100%;
  background:#0d1b2a;
  color:#fff;
  z-index:1000;
  padding:15px 0;
  box-shadow:0 5px 20px rgba(0,0,0,0.2);
}
.header-container {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:30px;
}
.logo {
  font-family:'Orbitron',sans-serif;
  font-size:36px;
  font-weight:700;
  letter-spacing:2px;
  background: linear-gradient(45deg, #ff7e5f, #feb47b);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  text-transform: uppercase;
  transition: transform 0.3s, text-shadow 0.3s;
}
.logo:hover {
  transform: scale(1.1) rotate(-2deg);
  text-shadow:0 5px 20px rgba(255,126,95,0.6);
}
.nav ul { display:flex; gap:25px; }
.nav ul li a { color:#fff; font-weight:600; transition:0.3s; }
.nav ul li a:hover { color:#ff7e5f; }

/* ====== Mobile Menu ====== */
.mobile-menu { display:none; font-size:28px; cursor:pointer; color:#fff; }
@media(max-width:480px){
  .nav ul {
    display:none;
    flex-direction:column;
    position:absolute;
    top:60px; right:0;
    background:#0d1b2a;
    width:200px;
    padding:20px 0;
    gap:10px;
  }
  .nav ul.active { display:flex; }
  .nav ul li { padding:10px 20px; }
  .mobile-menu { display:block; }
}

/* ====== Hero Section ====== */
.hero {
  position:relative;
  height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  background:linear-gradient(135deg,#0d1b2a,#1b263b,#415a77);
  color:#fff;
  overflow:hidden;
  padding-top:80px;
}
.hero-overlay {
  position:absolute; top:0; left:0; width:100%; height:100%;
  background:rgba(13,27,42,0.6); z-index:1;
}
.hero-content {
  position:relative; z-index:2;
  max-width:900px; padding:0 20px;
  animation:fadeInUp 1s ease forwards;
}
.hero-content h1 {
  font-size:60px;
  margin-bottom:20px;
  font-weight:700;
  background:linear-gradient(90deg,#ff7e5f,#feb47b);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent;
}
.hero-content h1 span { display:block; color:#feb47b; }
.hero-content p { font-size:22px; margin-bottom:30px; }
.hero-content .btn {
  font-size:20px; padding:15px 45px; border-radius:50px;
  background:linear-gradient(45deg,#ff7e5f,#feb47b);
  color:#fff; transition:all 0.3s ease;
}
.hero-content .btn:hover {
  transform:scale(1.1);
  box-shadow:0 10px 25px rgba(255,126,95,0.5);
}

/* Floating Hero Products */
.hero-products {
  position:absolute; bottom:50px; right:50px;
  display:flex; gap:30px; z-index:2;
}
.hero-product { position:relative; transition:transform 0.3s; }
.hero-product img {
  width:150px; border-radius:15px; transform:rotate(-5deg);
  box-shadow:0 15px 30px rgba(0,0,0,0.3);
  transition:all 0.3s;
}
.hero-product:hover img { transform:rotate(0deg) scale(1.1); }
.hero-product .price {
  position:absolute; bottom:-15px; left:50%;
  transform:translateX(-50%);
  background:rgba(255,126,95,0.9); color:#fff;
  padding:5px 10px; border-radius:15px;
  font-weight:700; font-size:14px;
  box-shadow:0 5px 15px rgba(0,0,0,0.2);
}

/* ====== Featured Products ====== */
.featured-products {
  padding:100px 0; background:#fefefe;
}
.featured-products h2 {
  text-align:center; margin-bottom:50px; font-size:38px; font-weight:700; position:relative;
}
.featured-products h2::after {
  content:''; display:block; width:80px; height:4px;
  background:linear-gradient(45deg,#ff7e5f,#feb47b);
  margin:10px auto 0; border-radius:2px;
}
.product-grid {
  display:flex; flex-wrap:wrap; gap:30px; justify-content:center;
}
.product-card {
  background:#fff; padding:20px; border-radius:20px; text-align:center;
  box-shadow:0 15px 35px rgba(0,0,0,0.1);
  transition:transform 0.3s, box-shadow 0.3s;
  flex:1 1 250px; max-width:300px;
}
.product-card:hover {
  transform:translateY(-15px);
  box-shadow:0 25px 50px rgba(0,0,0,0.2);
}
.product-card img { width:100%; border-radius:15px; margin-bottom:15px; transition:transform 0.3s; }
.product-card img:hover { transform:scale(1.05); }
.product-card h3 { margin-bottom:10px; font-size:22px; font-weight:600; }
.product-card p { font-weight:700; margin-bottom:15px; color:#ff7e5f; }
.add-cart {
  cursor:pointer; padding:12px 25px; border:none; border-radius:30px;
  background:linear-gradient(45deg,#ff7e5f,#feb47b); color:#fff; font-weight:600;
  transition:all 0.3s ease;
}
.add-cart:hover {
  transform:scale(1.05); box-shadow:0 8px 20px rgba(255,126,95,0.4);
}

/* ====== About Section ====== */
.about-preview { padding:80px 0; text-align:center; background:#f2f6fc; }
.about-preview h2 { margin-bottom:20px; font-size:36px; font-weight:700; }
.about-preview p { max-width:700px; margin:0 auto 30px; font-size:18px; line-height:1.6; color:#555; }

/* ====== Testimonials ====== */
.testimonials {
  padding:100px 0; background:#0d1b2a; text-align:center; color:#fff;
}
.testimonials h2 {
  margin-bottom:50px; font-size:36px; font-weight:700; color:#ff7e5f;
}
.testimonial-grid { display:flex; flex-wrap:wrap; justify-content:center; gap:30px; }
.testimonial-card {
  background:rgba(255,255,255,0.05); padding:25px; border-radius:20px;
  max-width:300px; backdrop-filter:blur(10px);
  transition:transform 0.3s, box-shadow 0.3s;
}
.testimonial-card:hover { transform:translateY(-10px); box-shadow:0 20px 40px rgba(0,0,0,0.3); }
.testimonial-card p { font-style:italic; margin-bottom:15px; font-size:16px; }
.testimonial-card span { font-weight:700; color:#feb47b; }

/* ====== Footer ====== */
footer { background:#0d1b2a; color:#fff; padding:50px 0 30px 0; text-align:center; }
.footer-links a { margin:0 10px; color:#fff; transition:all 0.3s; }
.footer-links a:hover { color:#ff7e5f; }
.social a { margin:0 10px; color:#fff; transition:all 0.3s; }
.social a:hover { color:#feb47b; }

/* ====== Animations ====== */
@keyframes fadeInUp { 0%{opacity:0; transform:translateY(40px);} 100%{opacity:1; transform:translateY(0);} }

/* ====== Responsive ====== */
@media(max-width:992px){
  .hero-content h1 { font-size:48px; }
  .hero-content p { font-size:20px; }
  .featured-products h2, .about-preview h2, .testimonials h2 { font-size:32px; }
}
@media(max-width:768px){
  .hero-content h1 { font-size:36px; }
  .hero-content p { font-size:18px; }
  .product-grid, .testimonial-grid { gap:20px; }
}
@media(max-width:480px){
  .hero-content h1 { font-size:28px; }
  .hero-content p { font-size:16px; }
  .about-preview p { font-size:16px; }
  .product-card, .testimonial-card { max-width:100%; }
  .hero-products { flex-direction:column; bottom:20px; right:10px; }
}