*, *::before, *::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  padding: 0;
  background: #f2f2f2;
  overflow-x: hidden;
}

.hero {
  padding: 35px 20px 20px;
  background: white;
}

.product-card{

transition:.3s;

border:none;

}

.product-card:hover{

transform:translateY(-6px);

box-shadow:0 5px 20px rgba(0,0,0,.15);

}

.card img{

height:220px;

object-fit:cover;

}

.site-header{

background: transparent;

padding:18px 0;

}

.site-header .container {
  align-items: center;
  justify-content: space-between;
}

.site-name{

margin:0;

color:white;

font-weight:700;

}

.header-tagline{

color:#dcdcdc;

font-size:14px;

font-weight:500;

}

.step-card{

background:white;

padding:28px;

height:100%;

border-radius:14px;

text-align:center;

box-shadow:0 3px 12px rgba(0,0,0,.08);

transition:.3s;

max-width:260px;

margin:auto;

}

.step-card:hover{

transform:translateY(-5px);

}

.step-number{

width:50px;

height:50px;

background:black;

color:white;

margin:0 auto 18px auto;

border-radius:50%;

display:flex;

align-items:center;

justify-content:center;

font-weight:bold;

font-size:18px;

}

.step-card h5{

margin-bottom:15px;

}

.step-card p{

margin-bottom:0;

line-height:1.6;

}

.disclaimer-box{

background:#fff3f3;

border-left:6px solid #dc3545;

padding:30px;

border-radius:12px;

text-align:center;

box-shadow:0 3px 12px rgba(0,0,0,.08);

max-width:900px;

margin:auto;

}

.disclaimer-box h3{

color:#c82333;

font-weight:700;

margin-bottom:20px;

}

.disclaimer-box p{

color:#5c2a2a;

line-height:1.8;

margin-bottom:10px;

font-weight:500;

}

footer{

margin-top:60px;

}

footer h5{

font-weight:700;

}

footer p{

opacity:.9;

}



header {
    background: transparent;
    height: 90px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
    position: relative;
    overflow: hidden;
    box-shadow:0 2px 12px rgba(0,0,0,0.2);
    width: 100%;
    max-width: 100vw;
}

header::before {
    display: none;
}

.logo{
    background: rgba(255,255,255,0.08);
    padding: 10px 25px;
    border-radius: 14px;

    border: 1px solid rgba(255,255,255,0.12);

    backdrop-filter: blur(8px);

    display:flex;
    align-items:center;
    justify-content:center;
    margin-left:0;
}

.logo img{
   max-height:90px;
   width:auto;
}

.header-features{

display:flex;

align-items:center;

gap:18px;

font-size:15px;

font-weight:500;

color:#000;
margin-left:auto;

}

.pipe{

color:rgba(255,255,255,.35);

font-size:18px;

}

#products img {
  margin: 0 auto; 
  max-width: 70%;
  height: auto;
  display: block;
  object-fit: contain; /* ensures full image is visible */
}

 .updateCollection {
  color: red;
  font-weight: bold;
  animation: blink 1.5s infinite;
}

@keyframes blink {
  0% { opacity: 1; }
  50% { opacity: 0; }
  100% { opacity: 1; }
}

@media (max-width: 768px) {
  .site-header .container {
    justify-content: center;
    gap: 12px;
  }

  .header-features {
    display: none;
  }

  .logo {
    margin: 0 auto;
    padding: 8px 18px;
  }

  .logo img {
    height: 70px;
  }
}