:root{
      --primary:#3f2771;
      --secondary:#e23127;
      --light:#fff;
      --dark:#0b0b0b;
    }

    body{ font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif; color:#222; scroll-behavior:smooth; }

    /* Navbar */
    .navbar { box-shadow: 0 4px 18px rgba(0,0,0,.06); }
    .navbar .nav-link { font-weight:600; }
    .navbar .nav-link.active, .navbar .nav-link:hover { color: var(--secondary)!important; }
    .brand-badge{
      letter-spacing:.5px;
      font-weight:800;
      color:var(--light);
      background: linear-gradient(135deg, var(--primary), #25154a 70%);
      padding: .35rem .6rem;
      border-radius: .5rem;
    }

    /* your logo image */
    .bfw-logo{ border-radius: 2%; }

    /* Buttons */
    .btn-primary{ background: var(--primary); border-color: var(--primary); }
    .btn-primary:hover{ background: var(--secondary); border-color: var(--secondary); }
    .btn-secondary{ background: var(--secondary); border-color: var(--secondary); }
    .btn-secondary:hover{  background: var(--primary); border-color: var(--primary); }

    /* Section title */
    .section-title{
      margin-bottom: 1.5rem;
      text-align: center;
    }
    .section-title h2{
      font-weight: 800;
      color: var(--primary);
      position: relative;
      display: inline-block;
      padding-bottom: .4rem;
    }
    .section-title h2:after{
      content:"";
      position:absolute;
      left:50%;
      transform:translateX(-50%);
      bottom:-8px;
      width:72px;height:4px;
      background: linear-gradient(90deg, var(--secondary), var(--primary));
      border-radius: 10px;
    }

    /* Banner slider */
    .hero .carousel-item{
/*      min-height: 62vh;*/
      background-position: center;
      background-size: cover;
      position: relative;
    }
    .hero .overlay{
      position:absolute; inset:0;
      background: linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,.55));
    }
    .hero-caption{
      position:absolute; bottom:12%; left:6%; right:6%;
      color:var(--light);
      text-shadow:0 2px 10px rgba(0,0,0,.35);
    }
    .hero-caption h1{ font-weight:900; }
    .badge-tag{
      background: rgba(255,255,255,.15);
      border:1px solid rgba(255,255,255,.3);
      color:#fff; font-weight:600;
      padding:.35rem .6rem; border-radius:999px;
      backdrop-filter: blur(2px);
    }

    /* About */
    .about-img{
      border-radius: 14px;
      box-shadow: 0 10px 30px rgba(0,0,0,.14);
    }

    /* Products */
    .product-card{
      border:0; border-radius:16px;
      overflow:hidden;
      box-shadow: 0 16px 36px rgba(0,0,0,.12);
      transition: transform .2s ease, box-shadow .2s ease;
      height:100%;
    }
    .product-card:hover{
      transform: translateY(-6px);
      box-shadow: 0 16px 36px rgba(0,0,0,.18);
    }
    .product-card .img-wrap{
      aspect-ratio: 4/3; background:#f7f7f8;/* overflow:hidden;*/
    }
    .product-card img{ 
      width:100%; /*height:100%; object-fit:cover; */
      transition: transform .4s ease; }
    .product-card:hover img{ transform: scale(1.06); }

    /* Contact strip */
    .contact-strip{
      background: linear-gradient(135deg, var(--primary), #2c1d53 70%);
      color: var(--light);
      border-radius: 16px;
    }
    .contact-item i{
      width:44px; height:44px;
      display:inline-flex; align-items:center; justify-content:center;
      border-radius: 10px;
      background: rgba(255,255,255,.12);
      margin-right: 10px;
    }
    .contact-item a{ color:#fff; text-decoration:none; }
    .contact-item a:hover{ text-decoration: underline; }

    /* Footer */
    footer{
      background:#0f0c1a; color:#bdb8d1;
    }
    footer a{ color:#d8d4e7; text-decoration:none; display:block; padding:.5rem 0; border-bottom:1px solid rgba(255,255,255,.08); }
    footer a:hover{ color:#fff; }
    .footer-links li:last-child a{ border-bottom:0; }
    .social a{
      width:38px;height:38px;border-radius:10px;
      background: rgba(255,255,255,.08);
      display:inline-flex;align-items:center;justify-content:center;
      margin-right:8px;border-bottom:0;
    }

    .copy-right{
      background: var(--secondary);
      color: var(--light);
    }

    /* Back to Top */
    .back-to-top{
      position: fixed;
      right: 18px;
      bottom: 18px;
      width: 46px; height: 46px;
      border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      background: linear-gradient(135deg, var(--secondary), var(--primary));
      color:#fff; border:0;
      box-shadow: 0 10px 20px rgba(0,0,0,.2);
      opacity: 0; visibility: hidden; transform: translateY(10px);
      transition: all .25s ease;
      z-index: 999;
    }
    .back-to-top.show{ opacity: 1; visibility: visible; transform: translateY(0); }
    .back-to-top:hover{ filter:brightness(.95); }

    /* Utilities */
    .bg-soft-secondary{ background: rgba(226,49,39,.08); }
    .text-secondary{ color: var(--secondary)!important; }
    .text-justify {
      text-align: justify!important;
    }

        /* Page Hero */
    .page-hero{
      min-height: 38vh;
      background: url('../images/banner/inner-banner.jpg') center/cover no-repeat;
      position: relative;
      display:flex;align-items:center;
      color:#fff;
    }
    .page-hero::after{
      content:""; position:absolute; inset:0;
      background: linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,.55));
    }
    .page-hero .container{ position:relative; z-index:2; }
    .crumb a{ color:#fff; opacity:.85; text-decoration:none; }
    .crumb a:hover{ opacity:1; text-decoration:underline; }

    /* Section title */
    .section-title{
      margin-bottom: 1.25rem;
      text-align: center;
    }
    .section-title h2{
      font-weight:800; color:var(--primary); position:relative; display:inline-block; padding-bottom:.4rem;
    }
    .section-title h2:after{
      content:""; position:absolute; left:50%; transform:translateX(-50%); bottom:-8px;
      width:72px; height:4px; border-radius:10px;
      background: linear-gradient(90deg, var(--secondary), var(--primary));
    }

    /* Images */
    .rounded-14{ border-radius:14px; }
    .shadow-soft{ box-shadow:0 10px 30px rgba(0,0,0,.12); }

    /* Icon cards */
    .icon-card{
      border:0; border-radius:16px;
      padding:1.25rem;
      height:100%;
      box-shadow:0 12px 28px rgba(0,0,0,.06);
      transition:.2s ease;
      background:#fff;
    }
    .icon-card:hover{ transform: translateY(-4px); box-shadow:0 16px 36px rgba(0,0,0,.12); }
    .icon-badge{
      width:56px; height:56px; border-radius:12px;
      display:inline-flex; align-items:center; justify-content:center;
      background: rgba(63,39,113,.1); color:var(--primary);
      margin-bottom:.75rem;
    }

    /* Timeline */
    .timeline{
      position:relative; padding-left:1rem; margin-left:.5rem;
    }
    .timeline::before{
      content:""; position:absolute; left:18px; top:0; bottom:0; width:3px; background:#eee;
    }
    .t-item{
      position:relative; padding-left:2.5rem; margin-bottom:1.2rem;
    }
    .t-item::before{
      content:""; position:absolute; left:10px; top:.25rem; width:20px; height:20px; border-radius:50%;
      background: linear-gradient(135deg, var(--secondary), var(--primary));
      box-shadow:0 0 0 4px #f4f2fb;
    }


@media only screen and (max-width: 767px) {
  .bfw-logo {
      max-width: 150px;
  }

  .ratio>* {
    position: relative;
  }
}

/* ===== Brands Slider ===== */
.brands {
  padding: 10px 0 20px;
  background: #fff;
}

.brand-card {
  height: 86px;
  display: flex; align-items: center; justify-content: center;
  padding: 16px 18px;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 10px 22px rgba(0,0,0,.04);
  margin: 0 10px;
}

.brand-card img {
  max-height: 48px;
  width: auto;
/*  filter: grayscale(100%) contrast(95%) brightness(1);*/
  opacity: 1;
  transition: all .25s ease;
}

.brand-card:hover img {
  filter: grayscale(0%);
  opacity: 1;
  transform: translateY(-2px);
}

/* Slick dots/arrows (if enabled later) */
.brands .slick-dots li button:before { color: var(--primary); }
.brands .slick-dots li.slick-active button:before { color: var(--secondary); }

.brands .section-title h2 { margin-bottom: 0; } /* keep things tight */

/* product image wrap keeps uniform cards */
.product-card .img-wrap{
  aspect-ratio: 1/1;
  overflow: hidden;
  background:#f7f7f7;
  display:flex; align-items:center; justify-content:center;
}
.product-card .img-wrap img{ object-fit: cover; width:100%; height:100%; }

/* brand grid tweaks */
.brand-card { transition: transform .15s ease; }
.brand-card:hover { transform: translateY(-3px); }
.brand-img { max-height: 64px; width: auto; }
@media (min-width: 992px){ .brand-img{ max-height: 72px; } }