/* Watermark */
.watermark{
  position: fixed; inset: 0;
  background: url('assets/logo-watermark.png') no-repeat center center / 420px auto;
  opacity: 0.06; pointer-events: none; z-index: -1;
}

/* Banner */
.banner{ position: relative; text-align: center; }
.banner img{ width: 100%; height: 320px; object-fit: cover; filter: brightness(70%); display:block; }
.banner .banner-text{
  position:absolute; inset:0; display:grid; place-content:center; color:#fff;
  text-shadow:0 2px 4px rgba(0,0,0,.6);
}
.banner .banner-text h1{ font-size: clamp(1.6rem, 3.2vw, 2.2rem); margin-bottom: .4rem; }

/* Categories */
.category-section{ padding: 32px 16px; text-align: center; background:#f8f8f8; }
.category-section h2{ color:#004aad; margin-bottom: 18px; }
.category-grid{
  max-width: 1100px; margin: 0 auto;
  display: grid; gap: 16px;
  grid-template-columns: repeat(auto-fit, minmax(250px,1fr));
}
.category-card{
  background:#fff; border-radius:12px; box-shadow:0 2px 8px rgba(0,0,0,.08);
  padding:16px; opacity:0; transform: translateY(40px);
  transition: transform .7s ease-out, opacity .7s ease-out, box-shadow .25s ease;
}
.category-card.visible{ opacity:1; transform: translateY(0); }
.category-card:hover{ box-shadow: 0 12px 24px rgba(0,0,0,.12); }
.category-card img{ width:100%; height:150px; object-fit:cover; border-radius:8px; display:block; margin-bottom:10px; }
.category-card h3{ color:#004aad; margin-bottom:8px; }
.category-card ul{ list-style: disc inside; text-align:left; margin-bottom: 8px; }
.category-card a{ color:#0d2a6b; text-decoration: underline; }

/* Contact */
.contact-section{
  text-align:center; background:#f0faff; padding: 26px 16px; margin-top: 18px;
}
.contact-section h2{ color:#004aad; margin-bottom: 8px; }

/* Small screens */
@media (max-width: 640px){
  .banner img{ height: 280px; }
}