:root{
    --brand-blue:#0A63B8;
    --brand-blue-dark:#074A8C;
    --brand-teal:#0EB8A6;
    --brand-indigo:#5B3EDB;
    --brand-navy:#081229;
    --brand-green:#16A34A;
    --brand-green-dark:#128A3E;
    --brand-gold:#F0A93E;
    --brand-gold-dark:#D6860F;
    --brand-light:#EAF6FB;
    --text-muted:#57697A;
  }
  @media (prefers-reduced-motion: reduce){
    *{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
  }
  body{
    font-family:'Poppins',sans-serif;
    color:#1c2733;
  }
  a{ text-decoration:none; }

  /* ===== Scroll reveal ===== */
  .reveal{
    opacity:0;
    transform:translateY(24px);
    transition:opacity .7s ease, transform .7s ease;
  }
  .reveal.in-view{ opacity:1; transform:translateY(0); }

  /* ===== Top bar ===== */
  .topbar{
    background:var(--brand-navy);
    color:#fff;
    font-size:.82rem;
  }
  .topbar a{ color:#fff; }
  .topbar .divider{ opacity:.3; margin:0 .6rem; }

  /* ===== Navbar ===== */
  .navbar-brand span.logo-mark{
    background:var(--brand-blue);
    color:#fff;
    font-weight:800;
    border-radius:8px;
    padding:.35rem .55rem;
    font-size:1.1rem;
    margin-right:.5rem;
  }
  .navbar-brand .brand-text{
    font-weight:700;
    color:var(--brand-navy);
    line-height:1.1;
  }
  .navbar-brand small{
    display:block;
    font-size:.62rem;
    letter-spacing:.08em;
    color:var(--text-muted);
    font-weight:500;
  }
  .navbar .nav-link{
    position:relative;
    color:#2b3a4a;
    font-weight:500;
    font-size:.92rem;
    transition:color .25s ease;
  }
  .navbar .nav-link::after{
    content:"";
    position:absolute;
    left:0; bottom:-2px;
    width:0; height:2px;
    background:linear-gradient(90deg,var(--brand-blue),var(--brand-teal));
    transition:width .25s ease;
  }
  .navbar .nav-link:hover{ color:var(--brand-blue); }
  .navbar .nav-link:hover::after,
  .navbar .nav-link.active::after{ width:100%; }
  .navbar .nav-link.active{ color:var(--brand-blue); }
  .btn-brand,
  .btn-outline-brand,
  .btn-view,
  .btn-whatsapp,
  .btn-cta-white,
  .btn-cta-outline,
  .btn-cta-green{
    position:relative;
    overflow:hidden;
    transition:transform .2s ease, box-shadow .2s ease, background .2s ease, color .2s ease;
  }
  .btn-brand::after,
  .btn-outline-brand::after,
  .btn-view::after,
  .btn-whatsapp::after{
    content:"";
    position:absolute;
    top:0; left:-75%;
    width:50%; height:100%;
    background:linear-gradient(120deg, transparent, rgba(255,255,255,.45), transparent);
    transform:skewX(-20deg);
    transition:left .55s ease;
  }
  .btn-brand:hover::after,
  .btn-outline-brand:hover::after,
  .btn-view:hover::after,
  .btn-whatsapp:hover::after{ left:130%; }
  .btn-brand:hover,
  .btn-view.filled:hover,
  .btn-whatsapp:hover{ transform:translateY(-2px); box-shadow:0 10px 22px rgba(10,99,184,.28); }
  .btn-outline-brand:hover{ transform:translateY(-2px); }

  .btn-brand{
    background:linear-gradient(135deg,var(--brand-blue) 0%,var(--brand-blue-dark) 100%);
    color:#fff;
    font-weight:600;
    border-radius:8px;
  }
  .btn-brand:hover{ background:linear-gradient(135deg,var(--brand-blue-dark) 0%,var(--brand-blue) 100%); color:#fff; }

  /* ===== Hero ===== */
  .hero{
    position:relative;
    overflow:hidden;
    background:linear-gradient(135deg,#EAF3FB 0%,#F5F9FC 55%,#ffffff 100%);
    padding:4.5rem 0 3.5rem;
  }
  .hero::before,
  .hero::after{
    content:"";
    position:absolute;
    border-radius:50%;
    filter:blur(60px);
    z-index:0;
    pointer-events:none;
  }
  .hero::before{
    width:420px; height:420px;
    top:-160px; right:-100px;
    background:radial-gradient(circle, rgba(10,99,184,.16) 0%, rgba(14,184,166,.10) 55%, transparent 75%);
    animation:heroFloat1 14s ease-in-out infinite;
  }
  .hero::after{
    width:340px; height:340px;
    bottom:-140px; left:-80px;
    background:radial-gradient(circle, rgba(240,169,62,.14) 0%, rgba(91,62,219,.08) 60%, transparent 75%);
    animation:heroFloat2 16s ease-in-out infinite;
  }
  .hero .container{ position:relative; z-index:1; }
  @keyframes heroFloat1{
    0%,100%{ transform:translate(0,0) scale(1); }
    50%{ transform:translate(-24px,26px) scale(1.08); }
  }
  @keyframes heroFloat2{
    0%,100%{ transform:translate(0,0) scale(1); }
    50%{ transform:translate(22px,-20px) scale(1.06); }
  }
  .badge-pill{
    background:var(--brand-light);
    color:var(--brand-blue);
    font-weight:600;
    font-size:.78rem;
    border-radius:30px;
    padding:.4rem 1rem;
    display:inline-block;
    animation:pillGlow 3s ease-in-out infinite;
  }
  @keyframes pillGlow{
    0%,100%{ box-shadow:0 0 0 0 rgba(10,99,184,.18); }
    50%{ box-shadow:0 0 0 6px rgba(10,99,184,0); }
  }
  .hero h1{
    font-weight:800;
    font-size:2.6rem;
    line-height:1.2;
    /* color:var(--brand-navy); */
  }
  .hero h1 .accent{ color:var(--brand-blue); }
  .hero p.lead-text{
    color:var(--text-muted);
    font-size:1.02rem;
  }
  .trust-card{
    background:#fff;
    border:1px solid #e6ecf5;
    border-radius:12px;
    padding:.9rem 1.1rem;
    font-size:.85rem;
    color:var(--text-muted);
  }
  .trust-card strong{ color:var(--brand-navy); }
  .trust-card .text-primary{ color:var(--brand-blue) !important; }
  .btn-outline-brand{
    border:1px solid var(--brand-blue);
    color:var(--brand-blue);
    font-weight:600;
    border-radius:8px;
  }
  .btn-outline-brand:hover{ background:var(--brand-blue); color:#fff; }
  .btn-whatsapp{
    background:var(--brand-green);
    color:#fff;
    font-weight:600;
    border-radius:8px;
  }
  .btn-whatsapp:hover{ background:var(--brand-green-dark); color:#fff; }

  .hero-device{
    position:relative;
  }
  .hero-device .glow{
    position:absolute;
    inset:0;
    background:radial-gradient(circle at center, #c6ddf5 0%, transparent 65%);
    z-index:0;
    animation:deviceGlow 3.5s ease-in-out infinite;
  }
  @keyframes deviceGlow{
    0%,100%{ opacity:.75; transform:scale(1); }
    50%{ opacity:1; transform:scale(1.08); }
  }
  .hero-device img{
    position:relative;
    z-index:1;
        max-width: 400px;
    animation:deviceFloat 4.5s ease-in-out infinite;
  }
  @keyframes deviceFloat{
    0%,100%{ transform:translateY(0); }
    50%{ transform:translateY(-10px); }
  }
  .spec-list{
    font-size:.82rem;
    color:var(--text-muted);
  }
  .spec-list i{ color:var(--brand-blue); margin-right:.4rem; }
  .spec-list li{ margin-bottom:.7rem; }

  /* ===== Why choose ===== */
  .why-choose{
    position:relative;
    padding:3rem 0;
    border-bottom:1px solid #eef1f5;
    background:linear-gradient(180deg,#ffffff 0%,#FBFDFF 100%);
    background-image:radial-gradient(rgba(10,99,184,.08) 1px, transparent 1px);
    background-size:22px 22px;
  }
  .why-choose h2{
    font-weight:800;
    color:var(--brand-navy);
    font-size:1.5rem;
    text-align:center;
    margin-bottom:2.2rem;
  }
  .why-choose h2 .accent{ color:var(--brand-blue); }
  .why-item{ text-align:center; }
  .why-item .icon-circle{
    width:64px; height:64px;
    border-radius:50%;
    background:var(--brand-light);
    display:flex; align-items:center; justify-content:center;
    margin:0 auto .7rem;
    font-size:1.5rem;
    color:var(--brand-blue);
    transition:transform .3s ease, background .3s ease, color .3s ease, box-shadow .3s ease;
  }
  .why-item:hover .icon-circle{
    transform:translateY(-4px) scale(1.08);
    background:linear-gradient(135deg,var(--brand-blue) 0%,var(--brand-teal) 100%);
    color:#fff;
    box-shadow:0 10px 20px rgba(10,99,184,.25);
  }
  .why-item strong{
    display:block;
    color:var(--brand-navy);
    font-size:.88rem;
  }
  .why-item span{
    font-size:.8rem;
    color:var(--text-muted);
  }

  /* ===== Section heading generic ===== */
  .section-title{
    text-align:center;
    font-weight:800;
    color:var(--brand-navy);
    font-size:1.6rem;
    margin-bottom:.4rem;
    position:relative;
    padding-bottom:.8rem;
  }
  .section-title::after{
    content:"";
    position:absolute;
    bottom:0; left:50%;
    transform:translateX(-50%);
    width:56px; height:3px;
    border-radius:3px;
    background:linear-gradient(90deg,var(--brand-blue),var(--brand-gold));
  }
  .section-title .accent{ color:var(--brand-blue); }
  .section-sub{
    text-align:center;
    color:var(--text-muted);
    font-size:.92rem;
    margin-bottom:2.4rem;
  }

  /* ===== Products ===== */
  #products{
    position:relative;
    overflow:hidden;
    background:linear-gradient(135deg,#F5FAF9 0%,#E4F3F0 22%,#DCEBFA 62%,#EEF3FB 100%);
  }
  #products::before,
  #products::after{
    content:"";
    position:absolute;
    border-radius:50%;
    filter:blur(70px);
    z-index:0;
    pointer-events:none;
  }
  #products::before{
    width:380px; height:380px;
    top:-120px; left:-90px;
    background:radial-gradient(circle, rgba(14,184,166,.22) 0%, transparent 70%);
  }
  #products::after{
    width:420px; height:420px;
    bottom:-160px; right:-100px;
    background:radial-gradient(circle, rgba(10,99,184,.18) 0%, transparent 70%);
  }
  #products .container{ position:relative; z-index:1; }
  
  .product-card{
    border:1px solid #e9edf3;
    border-radius:14px;
    padding:1.3rem 1.1rem 1.5rem;
    text-align:center;
    height:100%;
    position:relative;
    background:#fff;
    transition:box-shadow .3s ease, transform .3s ease, border-color .3s ease;
  }
  .product-card:hover{
    box-shadow:0 16px 32px rgba(11,95,165,.18);
    transform:translateY(-6px);
    border-color:rgba(10,99,184,.35);
  }
  .product-card:hover img{ transform:scale(1.06); }
  .product-card .best-seller{
    position:absolute;
    top:12px; left:12px;
    background:linear-gradient(135deg,#E8B84B 0%,var(--brand-gold) 100%);
    color:#3a2a05;
    font-size:.65rem;
    font-weight:700;
    padding:.2rem .55rem;
    border-radius:5px;
    box-shadow:0 4px 10px rgba(216,154,42,.35);
    animation:badgePulse 2.2s ease-in-out infinite;
  }
  @keyframes badgePulse{
    0%,100%{ box-shadow:0 4px 10px rgba(216,154,42,.35); }
    50%{ box-shadow:0 4px 16px rgba(216,154,42,.6); }
  }
  .product-card img{
    max-height:150px;
    margin-bottom:1rem;
    transition:transform .35s ease;
  }
  .product-card h5{
    color:var(--brand-blue);
    font-weight:700;
    font-size:1rem;
    margin-bottom:.1rem;
  }
  .product-card .freq{
    font-size:.75rem;
    color:var(--text-muted);
    margin-bottom:.7rem;
  }
  .product-card ul{
    list-style:none;
    padding:0;
    font-size:.78rem;
    color:var(--text-muted);
    text-align:left;
    margin-bottom:1rem;
  }
  .product-card ul li{ margin-bottom:.25rem; }
  .product-card ul li i{ color:var(--brand-green); margin-right:.35rem; font-size:.7rem; }
  .btn-view{
    border:1px solid var(--brand-blue);
    color:var(--brand-blue);
    font-size:.8rem;
    font-weight:600;
    border-radius:6px;
    padding:.4rem 1rem;
    width:100%;
  }
  .btn-view.filled{ background:linear-gradient(135deg,var(--brand-blue) 0%,var(--brand-blue-dark) 100%); color:#fff; }
  .btn-view:hover{ background:var(--brand-blue); color:#fff; }

  /* ===== Categories ===== */
  .section-categories{
    position:relative;
    background:linear-gradient(135deg,#EEF3FB 0%,#E7EEFA 55%,#EEF3FB 100%);
  }
  .category-card{
    text-align:center;
    transition:transform .3s ease;
  }
  .category-card:hover{ transform:translateY(-5px); }
  .category-card .img-wrap{
    border-radius:12px;
    overflow:hidden;
    margin-bottom:.8rem;
    aspect-ratio:1/0.85;
    box-shadow:0 6px 16px rgba(8,18,41,.08);
    transition:box-shadow .3s ease;
  }
  .category-card:hover .img-wrap{ box-shadow:0 14px 28px rgba(10,99,184,.22); }
  .category-card .img-wrap img{
    width:100%; height:100%; object-fit:cover;
    transition:transform .4s ease;
  }
  .category-card:hover .img-wrap img{ transform:scale(1.08); }
  .category-card .icon-circle{
    width: 45px;
    position: absolute;
    margin-top: -35px;
    margin-left: -100px;
    height: 45px;
    border-radius: 50%;
    background: var(--brand-light);
    color: var(--brand-blue);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: .4rem;
    font-size: .95rem;
    box-shadow:0 4px 10px rgba(8,18,41,.12);
    transition:transform .3s ease, background .3s ease, color .3s ease;
  }
  .category-card:hover .icon-circle{
    transform:scale(1.12) rotate(-6deg);
    background:linear-gradient(135deg,var(--brand-blue) 0%,var(--brand-teal) 100%);
    color:#fff;
  }
  .category-card strong{
    display:block;
	    margin-top: 23px;
    font-size:.85rem;
    color:var(--brand-navy);
  }

  /* ===== Clients & testimonials ===== */
  .clients-section{
    position:relative;
    overflow:hidden;
    background:linear-gradient(180deg,#EEF3FB 0%,#FAF6EC 45%,#F6FAFD 100%);
    padding:3.5rem 0;
  }
  .client-logo{
    width:56px; height:56px;
    border-radius:50%;
    background:#fff;
    border:1px solid #e6ecf5;
    display:flex; align-items:center; justify-content:center;
    font-size:.65rem;
    font-weight:700;
    color:var(--brand-blue);
    margin:0 auto .4rem;
    transition:transform .3s ease, box-shadow .3s ease;
  }
  .client-logo:hover{ transform:translateY(-4px); box-shadow:0 10px 20px rgba(10,99,184,.18); }
  .clients-section .img-fluid{
    border-radius:10px;
    box-shadow:0 4px 12px rgba(8,18,41,.06);
    transition:transform .3s ease, box-shadow .3s ease;
  }
  .clients-section .img-fluid:hover{
    transform:translateY(-4px) scale(1.04);
    box-shadow:0 12px 22px rgba(10,99,184,.18);
  }
  .client-name{
    text-align:center;
    font-size:.72rem;
    color:var(--text-muted);
  }
  .testimonial-card{
    background:#fff;
    border-radius:12px;
    padding:1.4rem;
    border:1px solid #e9edf3;
    height:100%;
  }
  .testimonial-card i.quote{
    color:var(--brand-blue);
    font-size:1.2rem;
  }
  .testimonial-card p{
    font-size:.88rem;
    color:var(--text-muted);
    margin:.7rem 0 1rem;
  }
  .testimonial-author{
    display:flex; align-items:center; gap:.6rem;
  }
  .testimonial-author .avatar{
    width:38px; height:38px;
    border-radius:50%;
    background:var(--brand-light);
    display:flex; align-items:center; justify-content:center;
    color:var(--brand-blue);
    font-weight:700;
    font-size:.8rem;
  }
  .testimonial-author strong{ display:block; font-size:.82rem; color:var(--brand-navy); }
  .testimonial-author span{ font-size:.72rem; color:var(--text-muted); }

  /* ===== Service & support ===== */
  #service{
    position:relative;
    background:linear-gradient(180deg,#ffffff 0%,#F0FAF8 50%,#ffffff 100%);
  }
  .service-item{
    background:#fff;
    border:1px solid #e9edf3;
    border-radius:12px;
    padding:1.5rem 1rem;
    text-align:center;
    height:100%;
    transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease;
  }
  .service-item:hover{
    transform:translateY(-5px);
    box-shadow:0 14px 26px rgba(8,18,41,.1);
    border-color:rgba(10,99,184,.3);
  }
  .service-item .icon-circle{
    width:52px; height:52px;
    border-radius:50%;
    background:var(--brand-light);
    color:var(--brand-blue);
    display:flex; align-items:center; justify-content:center;
    margin:0 auto .7rem;
    font-size:1.2rem;
    transition:transform .3s ease, background .3s ease, color .3s ease;
  }
  .service-item:hover .icon-circle{
    transform:scale(1.1);
    background:linear-gradient(135deg,var(--brand-blue) 0%,var(--brand-teal) 100%);
    color:#fff;
  }
  .service-item strong{ display:block; font-size:.88rem; color:var(--brand-navy); margin-bottom:.2rem;}
  .service-item span{ font-size:.75rem; color:var(--text-muted); }

  /* ===== CTA banner ===== */
  .cta-banner{
    position:relative;
    overflow:hidden;
    background:linear-gradient(120deg,var(--brand-navy) 0%,var(--brand-blue) 45%,var(--brand-teal) 100%);
    background-size:220% 220%;
    animation:ctaGradient 10s ease infinite;
    color:#fff;
    padding:2.2rem 0;
  }
  @keyframes ctaGradient{
    0%{ background-position:0% 50%; }
    50%{ background-position:100% 50%; }
    100%{ background-position:0% 50%; }
  }
  .cta-banner .container{ position:relative; z-index:1; }
  .cta-banner h3{ font-weight:700; font-size:1.3rem; margin-bottom:.2rem; }
  .cta-banner p{ font-size:.85rem; opacity:.9; margin:0; }
  .btn-cta-outline{
    border:1px solid #fff;
    color:#fff;
    font-weight:600;
    border-radius:8px;
    font-size:.85rem;
  }
  .btn-cta-outline:hover{ background:#fff; color:var(--brand-blue); }
  .btn-cta-green{
    background:var(--brand-green);
    color:#fff;
    font-weight:600;
    border-radius:8px;
    font-size:.85rem;
  }
  .btn-cta-white{
    background:#fff;
    color:var(--brand-blue);
    font-weight:600;
    border-radius:8px;
    font-size:.85rem;
  }

  /* ===== Footer ===== */
  footer{
    background:var(--brand-navy);
    color:#c7d2e0;
    padding-top:3rem;
    font-size:.85rem;
  }
  footer h6{
    color:#fff;
    font-weight:700;
    font-size:.92rem;
    margin-bottom:1rem;
  }
  footer a{ color:#c7d2e0; }
  footer a:hover{ color:#fff; }
  footer ul{ list-style:none; padding:0; }
  footer ul li{ margin-bottom:.55rem; }
  footer .social-circle{
    width:34px; height:34px;
    border-radius:50%;
    background:rgba(255,255,255,.08);
    display:inline-flex; align-items:center; justify-content:center;
    margin-right:.5rem;
  }
  .footer-bottom{
    border-top:1px solid rgba(255,255,255,.1);
    margin-top:2.5rem;
    padding:1rem 0;
    font-size:.78rem;
    color:#93a2b6;
  }
  .map-box{
    border-radius:10px;
    overflow:hidden;
    border:1px solid rgba(255,255,255,.1);
  }

  /* Whatsapp floating button */
  .whatsapp-float{
    position:fixed;
    bottom:24px; right:24px;
    width:56px; height:56px;
    background:var(--brand-green);
    border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    color:#fff;
    font-size:1.6rem;
    box-shadow:0 6px 18px rgba(0,0,0,.2);
    z-index:1000;
  }

  @media (max-width:991.98px){
    .hero h1{ font-size:2rem; }
  }
  

.product-card {
    height: 100%;
    display: flex;
    flex-direction: column;
}

.product-card .btn-view {
    margin-top: auto;
}




.dropdown-item {
  padding: 10px 16px;
  font-size: 14px;
}

.client-l-c .img-fluid{
	    background: #fff;
		padding: 10px;
}


/* Submenu hidden by default */
.dropdown-submenu > .dropdown-menu {
    display: none;
    position: absolute;
    top: 0;
    left: 100%;
    margin-top: 0;
}

/* Show submenu on hover */
.dropdown-submenu:hover > .dropdown-menu {
    display: block;
}

/* First-level submenu */
.dropdown-menu > .dropdown-submenu {
    position: relative;
}

/* Remove Bootstrap dropdown click/focus behavior */
.dropdown-submenu > .dropdown-toggle::after {
    float: right;
    margin-top: 7px;
}

/* Prevent parent items from looking clickable */
.dropdown-submenu > .dropdown-toggle {
    cursor: default;
}
/* ================================
   Nested Dropdown - Hover Only
================================ */

/* Parent submenu */
.dropdown-submenu {
    position: relative;
}

/* Hide nested menu */
.dropdown-submenu > .dropdown-menu {
    display: none;
    position: absolute;
    top: 0;
    left: 100%;
    margin-top: 0;
}

/* Show nested menu on hover */
.dropdown-submenu:hover > .dropdown-menu {
    display: block;
}

/* Arrow alignment */
.dropdown-submenu > .dropdown-toggle::after {
    float: right;
    margin-top: 7px;
}

/* Parent menu cursor */
.dropdown-submenu > .dropdown-toggle {
    cursor: default;
}

/* ================================
   Nested Dropdown
   First Menu = Bottom
   Sub-Sub Menu = Right
================================ */

/* Products dropdown */
.dropdown-menu {
    margin-top: 0;
}

/* Submenu parent */
.dropdown-submenu {
    position: relative;
}

/* FIRST LEVEL SUBMENU
   Opens BELOW the Products menu */
.dropdown > .dropdown-menu {
    top: 100%;
    left: 0;
}

/* Hide nested submenu */
.dropdown-submenu > .dropdown-menu {
    display: none;
    position: absolute;
}

/* SECOND LEVEL / SUB-SUB MENU
   Opens to the RIGHT */
.dropdown-submenu:hover > .dropdown-menu {
    display: block;
    top: 0;
    left: 100%;
    margin-left: 0;
}

/* Arrow */
.dropdown-submenu > .dropdown-toggle::after {
    float: right;
    margin-top: 7px;
}

/* Parent submenu */
.dropdown-submenu > .dropdown-toggle {
    cursor: default;
}
/* ================================
   PRODUCTS DROPDOWN
================================ */

/* Main Products dropdown opens DOWN */
.nav-item.dropdown > .dropdown-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    margin-top: 0;
	    width: 250px;
}

/* Show Products menu on hover */
.nav-item.dropdown:hover > .dropdown-menu {
    display: block;
}


/* ================================
   SUB MENU
   Body Composition / Gym Equipment
================================ */

.nav-item.dropdown .dropdown-submenu {
    position: relative;
}

/* Hide submenu */
.nav-item.dropdown .dropdown-submenu > .dropdown-menu {
    display: none;
    position: absolute;
    top: 0 !important;
    left: 100% !important;
    margin: 0 !important;
}

/* Open submenu on hover */
.nav-item.dropdown .dropdown-submenu:hover > .dropdown-menu {
    display: block;
}


/* ================================
   SUB-SUB MENU
   Mediana BCA → i20, i25...
================================ */

/* Keep second-level menu opening RIGHT */
.dropdown-submenu .dropdown-submenu > .dropdown-menu {
    top: 0 !important;
    left: 100% !important;
}


/* ================================
   ARROWS
================================ */

.dropdown-submenu > .dropdown-toggle::after {
    float: right;
    margin-top: 7px;
    margin-left: 10px;
}


/* ================================
   REMOVE CLICK BEHAVIOUR VISUALLY
================================ */

.dropdown-submenu > .dropdown-toggle {
    cursor: default;
}






.cat-dropdown {
  position: relative;
}

.cat-submenu {
  display: none;
  margin-left: 45px;
  padding: 5px 0 10px;
}

.cat-dropdown:hover .cat-submenu {
  display: block;
}

.cat-submenu a {
  display: block;
  padding: 8px 15px;
  color: #555;
  text-decoration: none;
  font-size: 14px;
}

.cat-submenu a:hover {
  color: #677de3;
  background: #f5f6ff;
}

.cat-item {
  display: flex;
  align-items: center;
  gap: 10px;
}

.cat-item .chev {
  width: 18px;
  height: 18px;
  margin-left: auto;
}
.product-card img {
  max-height: 319px;
  margin-bottom: 1rem;
}
/* =========================================================
   RESPONSIVE MEDIA QUERIES
   ========================================================= */

/* Large Laptop / Desktop */
@media (max-width: 1200px) {

    #atoz-about .wrap {
        max-width: 100%;
        padding-left: 30px;
        padding-right: 30px;
    }

    #atoz-about .story-grid {
        gap: 35px;
    }

    #atoz-about .why-grid {
        gap: 15px;
    }

    #atoz-about .mv-item {
        padding: 32px;
    }
}


/* Laptop / Tablet Landscape */
@media (max-width: 1024px) {

    #atoz-about .hero {
        min-height: 300px;
    }

    #atoz-about .hero .wrap {
        padding-top: 50px;
        padding-bottom: 50px;
    }

    #atoz-about .story-grid {
        grid-template-columns: 1fr 1fr;
        gap: 30px;
    }

    #atoz-about .stats,
    #atoz-about .icons-strip {
        grid-template-columns: repeat(3, 1fr);
    }

    #atoz-about .why-grid {
        grid-template-columns: repeat(3, 1fr);
        row-gap: 35px;
    }

    #atoz-about .mv-band {
        grid-template-columns: 1fr 1fr;
    }
}


/* Tablet */
@media (max-width: 768px) {

    #atoz-about .wrap {
        padding-left: 20px;
        padding-right: 20px;
    }

    /* Hero */
    #atoz-about .hero {
        min-height: 280px;
    }

    #atoz-about .hero .wrap {
        padding: 45px 20px;
    }

    #atoz-about .hero h1 {
        font-size: 36px;
    }

    #atoz-about .hero p {
        font-size: 15px;
        max-width: 100%;
    }

    /* Story */
    #atoz-about .story-section {
        padding: 45px 0;
    }

    #atoz-about .story-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    #atoz-about .story-img {
        order: -1;
    }

    #atoz-about .story-text h2 {
        font-size: 30px;
    }

    /* Stats */
    #atoz-about .stats,
    #atoz-about .icons-strip {
        grid-template-columns: repeat(3, 1fr);
    }

    #atoz-about .stat {
        padding: 25px 10px;
    }

    #atoz-about .stat .num {
        font-size: 24px;
    }

    /* Why Choose */
    #atoz-about .why-section {
        padding-bottom: 45px;
    }

    #atoz-about .why-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 30px 20px;
    }

    /* Mission Vision */
    #atoz-about .mv-band {
        grid-template-columns: 1fr;
    }

    #atoz-about .mv-item {
        padding: 30px 25px;
    }

    #atoz-about .mv-item:first-child {
        border-right: none;
        border-bottom: 1px solid rgba(255,255,255,0.15);
    }

    /* Certifications */
    #atoz-about .cert-row {
        justify-content: center;
        padding: 25px;
        gap: 25px;
    }

    /* Help */
    #atoz-about .help-bar {
        flex-direction: column;
        align-items: flex-start;
    }

    #atoz-about .help-actions {
        width: 100%;
    }
}























/* ===== Get a Quote Modal ===== */
.quote-modal {
  border: none;
  border-radius: 16px;
  padding: 30px 28px;
  position: relative;
}

.quote-close {
  position: absolute;
  top: 18px;
  right: 18px;
}

.quote-modal-header {
  margin-bottom: 20px;
}

.quote-icon-circle {
  width: 48px;
  height: 48px;
  margin: 0 auto 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--brand-light);
  color: var(--brand-blue);
  border-radius: 50%;
  font-size: 20px;
}

.quote-modal-header h4 {
  font-weight: 700;
  color: #1a1a2e;
  margin-bottom: 6px;
}

.quote-modal-header p {
  font-size: 14px;
  color: #6b7280;
  margin: 0;
}

.quote-form .form-label {
  font-size: 13px;
  font-weight: 600;
  color: #374151;
  margin-bottom: 6px;
}

.quote-form .form-control,
.quote-form .form-select,
.quote-form .input-group-text {
  font-size: 14px;
  border-radius: 8px;
  border: 1px solid #e5e7eb;
  padding: 10px 12px;
}

.quote-form .input-group-text {
  background-color: #f9fafb;
  color: #6b7280;
}

.char-counter {
  font-size: 12px;
  color: #9ca3af;
  margin-top: 4px;
}

.quote-submit {
  background-color: var(--brand-blue);
  border: none;
  border-radius: 8px;
  font-weight: 600;
  padding: 12px;
  font-size: 15px;
}

.quote-submit:hover {
  background-color: var(--brand-blue-dark);
}

.quote-divider {
  display: flex;
  align-items: center;
  text-align: center;
  color: #9ca3af;
  font-size: 12px;
  margin: 16px 0;
}

.quote-divider::before,
.quote-divider::after {
  content: "";
  flex: 1;
  border-bottom: 1px solid #e5e7eb;
}

.quote-divider span {
  padding: 0 12px;
}

.quote-whatsapp-link {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  font-size: 14px;
  color: #374151;
  text-decoration: none;
  margin-bottom: 16px;
}

.quote-whatsapp-link span {
  color: var(--brand-green);
  font-weight: 600;
}

.quote-privacy {
  font-size: 12px;
  color: #9ca3af;
  margin: 0;
}

@media (max-width: 576px) {
  .quote-modal {
    padding: 24px 18px;
  }
}

/* ===== Book a Demo / Thank You modal (success variant) ===== */
.quote-icon-circle.success {
  background-color: #E3F6EA;
  color: var(--brand-green);
}

.quote-modal .btn-outline-brand {
  display: block;
  width: 100%;
  text-align: center;
  border: 1px solid var(--brand-blue);
  color: var(--brand-blue);
  border-radius: 8px;
  font-weight: 600;
  font-size: 14px;
  padding: 11px;
  text-decoration: none;
  margin-top: 10px;
}

.quote-modal .btn-outline-brand:hover {
  background-color: var(--brand-light);
}








.wrap {
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 24px;
}

/* Need help bar */
.help-bar {
  background: #EEF3FB;
  border-radius: 12px;
  padding: 22px 32px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
  margin-bottom: 56px;
}

.help-left {
  display: flex;
  align-items: center;
  gap: 16px;
}

.help-icon {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: var(--primary);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.help-icon svg {
  width: 24px;
  height: 24px;
}

.help-left h4 {
  font-size: 16px;
  font-weight: 700;
  margin: 0 0 4px;
  color: var(--ink);
  font-family: var(--font);
}

.help-left p {
  font-size: 13.5px;
  color: var(--ink-soft);
  margin: 0;
  font-family: var(--font);
}

.help-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.help-actions .btn-outline {
  font-family: var(--font);
  font-weight: 700;
  font-size: 13.5px;
  padding: 11px 20px;
  border-radius: 6px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--primary);
  background: #fff;
  color: var(--primary);
  cursor: pointer;
}

.help-actions .btn-whatsapp {
  background: #25D366;
  border-color: #25D366;
  color: #fff;
}

.help-actions .btn-solid {
  background: var(--primary);
  border-color: var(--primary);
  color: #fff;
}

/* Responsive */
@media (max-width: 620px) {
  .help-bar {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* Mobile */
@media (max-width: 576px) {

    #atoz-about .wrap {
        padding-left: 15px;
        padding-right: 15px;
    }

    /* Hero */
    #atoz-about .hero {
        min-height: 250px;
    }

    #atoz-about .hero .wrap {
        padding: 40px 15px;
    }

    #atoz-about .hero h1 {
        font-size: 30px;
    }

    #atoz-about .hero p {
        font-size: 14px;
        line-height: 1.6;
    }

    /* Story */
    #atoz-about .story-section {
        padding: 35px 0;
    }

    #atoz-about .story-grid {
        grid-template-columns: 1fr;
        gap: 25px;
    }

    #atoz-about .story-img {
        order: -1;
    }

    #atoz-about .story-img img {
        border-radius: 8px;
    }

    #atoz-about .story-text h2 {
        font-size: 26px;
    }

    #atoz-about .story-text p {
        font-size: 14px;
        line-height: 1.7;
    }

    /* Icons */
    #atoz-about .icons-strip {
        grid-template-columns: repeat(2, 1fr);
        margin-bottom: 15px;
    }

    #atoz-about .icons-strip .icon-item {
        padding: 18px 10px;
    }

    #atoz-about .icons-strip .icon-item:nth-child(3),
    #atoz-about .icons-strip .icon-item:nth-child(5) {
        border-left: none;
    }

    #atoz-about .icons-strip .icon-item:nth-child(n+3) {
        border-top: 1px solid var(--border);
    }

    /* Stats */
    #atoz-about .stats {
        grid-template-columns: repeat(2, 1fr);
    }

    #atoz-about .stat {
        padding: 22px 8px;
    }

    #atoz-about .stat:nth-child(odd) {
        border-left: none;
    }

    #atoz-about .stat:nth-child(n+3) {
        border-top: 1px solid var(--border);
    }

    #atoz-about .stat .num {
        font-size: 22px;
    }

    #atoz-about .stat .label {
        font-size: 12px;
    }

    /* Why Choose */
    #atoz-about .why-section h2 {
        font-size: 23px;
        margin-bottom: 30px;
    }

    #atoz-about .why-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    #atoz-about .why-card h4 {
        font-size: 15px;
    }

    #atoz-about .why-card p {
        font-size: 13px;
    }

    /* Mission / Vision */
    #atoz-about .mv-section {
        padding-bottom: 35px;
    }

    #atoz-about .mv-item {
        gap: 15px;
        padding: 25px 20px;
    }

    #atoz-about .mv-icon {
        width: 42px;
        height: 42px;
    }

    #atoz-about .mv-item h3 {
        font-size: 15px;
    }

    #atoz-about .mv-item p {
        font-size: 13px;
    }

    /* Certifications */
    #atoz-about .cert-section h2 {
        font-size: 17px;
    }

    #atoz-about .cert-row {
        padding: 20px 15px;
        gap: 20px;
    }

    #atoz-about .cert-row img,
    #atoz-about .cert-row .cert-mark {
        max-width: 100px;
        max-height: 40px;
    }

    /* Help Bar */
    #atoz-about .help-bar {
        padding: 20px;
        margin-bottom: 35px;
    }

    #atoz-about .help-left {
        align-items: flex-start;
    }

    #atoz-about .help-left h4 {
        font-size: 15px;
    }

    #atoz-about .help-left p {
        font-size: 12px;
    }

    #atoz-about .help-actions {
        flex-direction: column;
        width: 100%;
    }

    #atoz-about .help-actions a {
        width: 100%;
        justify-content: center;
    }
}


/* Small Mobile */
@media (max-width: 375px) {

    #atoz-about .hero h1 {
        font-size: 27px;
    }

    #atoz-about .hero p {
        font-size: 13px;
    }

    #atoz-about .story-text h2 {
        font-size: 24px;
    }

    #atoz-about .stats,
    #atoz-about .icons-strip {
        grid-template-columns: 1fr 1fr;
    }

    #atoz-about .stat .num {
        font-size: 20px;
    }

    #atoz-about .why-section h2 {
        font-size: 20px;
    }

    #atoz-about .mv-item {
        padding: 22px 15px;
    }

    #atoz-about .mv-icon {
        width: 38px;
        height: 38px;
    }
}



.home-products .products-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 24px;
}

.home-products .product-item {
  min-width: 0;
}

.home-products .product-card {
  height: 100%;
}

/* Tablet */
@media (max-width: 991px) {
  .home-products .products-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* Mobile */
@media (max-width: 575px) {
  .home-products .products-grid {
    grid-template-columns: 1fr;
  }
}


@media (max-width: 480px) {
    .hero .d-flex.flex-wrap.gap-2.mt-4 .btn {
        white-space: nowrap;
        flex: 1 1 0;
        font-size: 0.50rem;
        padding: 0.4rem 0.3rem;
    }
}