:root{
  --brand:#0d6efd;
  --brand2:#22c55e;
  --ink:#0f172a;
  --muted:#475569;
  --bg:#f8fafc;
  --card:#ffffff;
  --ring:rgba(13,110,253,.25);
}
body{font-family:'Poppins',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--ink);background:var(--bg);}
a{color:var(--brand);}
a:hover{color:#0b5ed7;}
.navbar{backdrop-filter:saturate(180%) blur(8px);}
.navbar .navbar-brand{font-weight:700;letter-spacing:.2px;}
.navbar.shadow-sm{box-shadow:0 10px 30px rgba(2,6,23,.12)!important;}
.section{padding:56px 0;}
.section-title{font-weight:700;letter-spacing:.2px;}
.section-lead{color:var(--muted);max-width:850px;margin:0 auto;}
.card-soft{background:var(--card);border:1px solid rgba(15,23,42,.08);border-radius:16px;box-shadow:0 14px 40px rgba(2,6,23,.06);}
.card-soft:hover{box-shadow:0 18px 55px rgba(2,6,23,.10);transform:translateY(-2px);}
.icon-badge{width:56px;height:56px;border-radius:16px;display:grid;place-items:center;background:rgba(13,110,253,.10);color:var(--brand);margin:0 auto 12px;}
.btn-brand{background:var(--brand);border-color:var(--brand);}
.btn-brand:hover{background:#0b5ed7;border-color:#0b5ed7;}
.btn-outline-brand{border-color:rgba(13,110,253,.45);color:var(--brand);}
.btn-outline-brand:hover{background:rgba(13,110,253,.08);}
.hero{
  position:relative;overflow:hidden;border-radius:20px;
  background:linear-gradient(110deg, rgba(15,23,42,.85), rgba(13,110,253,.45));
  color:#fff;
}
.hero::after{
  content:"";position:absolute;inset:0;
  background:url('images/slide1.jpg') center/cover no-repeat;
  opacity:.25;pointer-events:none;
}
.hero > .hero-inner{position:relative;z-index:1;padding:70px 26px;}
.hero h1{font-weight:800;letter-spacing:.2px;}
.hero p{color:rgba(255,255,255,.85);max-width:820px;}
.hero .pill{display:inline-flex;gap:8px;align-items:center;background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.18);padding:8px 12px;border-radius:999px;color:#fff;font-size:.9rem;}
.kpi{font-size:1.8rem;font-weight:800;color:var(--brand);}
.kpi-label{color:var(--muted);}
footer{background:#0f172a;color:#e2e8f0;}
footer a{color:#cbd5e1;text-decoration:none;}
footer a:hover{color:#fff;text-decoration:underline;}
/* focus ring */
:focus-visible{outline:none;box-shadow:0 0 0 .25rem var(--ring);border-radius:8px;}
/* WhatsApp */
.whatsapp-float{position:fixed;width:56px;height:56px;bottom:20px;right:20px;background:#25d366;color:#fff;border-radius:50%;
  display:flex;align-items:center;justify-content:center;box-shadow:0 10px 28px rgba(2,6,23,.18);z-index:1000;text-decoration:none;}
@media (max-width:576px){.section{padding:44px 0}.hero>.hero-inner{padding:56px 18px}.whatsapp-float{right:12px;bottom:12px;width:48px;height:48px}}
/* Make embeds responsive */
.embed-wrap{border-radius:16px;overflow:hidden;border:1px solid rgba(15,23,42,.08);background:#fff;}

/* Products page: Our Product Categories images - fit in box, no stretch */
#categories img,
.product-categories img,
.card-soft img{
  width: 100% !important;
  height: 200px !important;     /* frame height */
  object-fit: contain !important;/* show full image, no crop, no distortion */
  object-position: center !important;
  display: block;
  background: #f8fafc;          /* nice “frame” background */
  padding: 14px;                /* gives icon-style images breathing room */
  border-radius: 12px;
}

@media (max-width: 576px){
  #categories img,
  .product-categories img,
  .card-soft img{
    height: 170px !important;
  }
}