    :root {
      --navy: #062847;
      --dark-navy: #031b32;
      --gold: #c9963e;
      --light-blue: #eef5fa;
      --text: #142536;
      --white: #ffffff;
    }

    * {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
    }

    body {
      font-family: Arial, Helvetica, sans-serif;
      color: var(--text);
      background: #ffffff;
      line-height: 1.6;
    }

    a {
      text-decoration: none;
      color: inherit;
    }

    .container {
      width: 90%;
      max-width: 1200px;
      margin: auto;
    }

    /* ================= NAVBAR ================= */

    header {
      background: white;
      border-bottom: 1px solid #eeeeee;
    }
    .header-logo {
        width: 220px;
        height: auto;
        display: block;
        }

    .navbar {
      height: 86px;
      display: flex;
      align-items: center;
      justify-content: space-between;
    }

   

    .nav-links {
      display: flex;
      gap: 30px;
      align-items: center;
      font-size: 14px;
    }

    .nav-links a {
      transition: 0.3s;
    }

    .nav-links a:hover {
      color: var(--gold);
    }

    .nav-button {
      background: var(--navy);
      color: white !important;
      padding: 13px 22px;
      border-radius: 7px;
    }

    .nav-button:hover {
      background: var(--gold);
    }
.menu-toggle{
    display:none;
    background:none;
    border:none;
    font-size:30px;
    cursor:pointer;
}


    /* ================= HERO ================= */

    .hero {
      min-height: 550px;
      background:
        linear-gradient(90deg, rgba(239,246,251,0.98), rgba(239,246,251,0.65)),
        url("images/hero-bg.jpg") center/cover;
      display: flex;
      align-items: center;
    }

    .hero-content {
      display: grid;
      grid-template-columns: 1fr 1.1fr;
      gap: 40px;
      align-items: center;
    }

    .hero-text small {
      font-size: 13px;
      font-weight: bold;
      color: var(--navy);
      letter-spacing: 0.5px;
    }

    .hero h1 {
      font-family: Georgia, serif;
      line-height: 1.05;
      margin: 20px 0;
      color: var(--navy);
    }

    .hero h1 span {
      color: var(--gold);
    }

    .gold-line {
      width: 55px;
      height: 4px;
      background: var(--gold);
      margin: 22px 0;
    }

    .hero p {
      max-width: 470px;
      color: #425364;
      font-size: 17px;
    }

    .hero-buttons {
      display: flex;
      gap: 15px;
      margin-top: 30px;
    }

    .btn {
      padding: 14px 25px;
      border-radius: 6px;
      font-weight: bold;
      display: inline-block;
      transition: 0.3s;
    }

    .btn-primary {
      background: var(--navy);
      color: white;
    }

    .btn-primary:hover {
      background: var(--gold);
    }

    .btn-outline {
      border: 1px solid var(--navy);
      color: var(--navy);
    }

    .btn-outline:hover {
      background: var(--navy);
      color: white;
    }

    /* HERO PRODUCT DISPLAY */

    .hero-products {
      position: relative;
      min-height: 420px;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .hero-products::before {
      content: "";
      position: absolute;
      width: 400px;
      height: 400px;
      border-radius: 50%;
      background: rgba(255,255,255,0.65);
    }

    .hero-products img {
      position: relative;
      max-width: 100%;
      max-height: 410px;
      object-fit: contain;
      z-index: 1;
    }

    /* ================= FEATURE STRIP ================= */

    .features {
      margin-top: -35px;
      position: relative;
      z-index: 3;
    }

    .feature-box {
      background: white;
      border-radius: 15px;
      padding: 28px;
      box-shadow: 0 10px 35px rgba(0,0,0,0.08);
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 25px;
    }

    .feature {
      display: flex;
      gap: 15px;
      align-items: flex-start;
      padding-right: 20px;
      border-right: 1px solid #e5e5e5;
    }

    .feature:last-child {
      border-right: none;
    }

    .feature-icon {
      min-width: 45px;
      height: 45px;
      border-radius: 50%;
      background: var(--navy);
      color: white;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 20px;
    }

    .feature:nth-child(2) .feature-icon,
    .feature:nth-child(4) .feature-icon {
      background: var(--gold);
    }

    .feature h3 {
      font-size: 16px;
      margin-bottom: 5px;
    }

    .feature p {
      font-size: 13px;
      color: #697783;
    }

    /* ================= PRODUCTS ================= */

    .section {
      padding: 90px 0;
    }

    .section-heading {
      text-align: center;
      margin-bottom: 45px;
    }

    .section-heading small {
      color: var(--gold);
      font-weight: bold;
      letter-spacing: 2px;
    }

    .section-heading h2 {
      font-family: Georgia, serif;
      font-size: 40px;
      color: var(--navy);
      margin-top: 10px;
    }

    .products-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 18px;
    }

    .product-card {
      border: 1px solid #e5e8eb;
      border-radius: 10px;
      overflow: hidden;
      background: white;
      transition: 0.3s;
      text-align: center;
    }

    .product-card:hover {
      transform: translateY(-8px);
      box-shadow: 0 15px 30px rgba(0,0,0,0.1);
    }

    .product-image {
      height: 230px;
      background: #f5f8fa;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 15px;
    }

    .product-image img {
      max-width: 100%;
      max-height: 210px;
      object-fit: contain;
    }

    .product-info {
      padding: 20px 15px;
    }

    .product-info h3 {
      font-size: 18px;
      color: var(--navy);
      margin-bottom: 8px;
    }

    .product-info p {
      font-size: 13px;
      color: #697783;
      min-height: 42px;
    }

    .product-btn {
      display: inline-block;
      margin-top: 15px;
      padding: 8px 18px;
      border: 1px solid var(--navy);
      border-radius: 5px;
      font-size: 13px;
      color: var(--navy);
    }

    .product-btn:hover {
      background: var(--navy);
      color: white;
    }
    
    
    /* ================= PRODUCT DETAIL ================= */

/* ================= PRODUCT DETAIL ================= */

.product-detail {

    display:grid;

    grid-template-columns: 380px 1fr;

    gap:60px;

    align-items:center;

}



/* IMAGE BOX */

.product-detail-image {

    width:100%;

    height:380px;

    background:#f8fafb;

    border:1px solid #e8edf2;

    border-radius:12px;

    display:flex;

    align-items:center;

    justify-content:center;

    padding:25px;

    box-sizing:border-box;

}



/* IMAGE */

.product-detail-image img {

    width:auto;

    height:auto;

    max-width:280px;

    max-height:300px;

    object-fit:contain;

}





/* CONTENT */

.product-detail-content {

    max-width:650px;

}


.product-detail-content h2 {

    font-family:Georgia,serif;

    font-size:38px;

    color:var(--navy);

    margin:15px 0 20px;

}



.product-detail-content p {

    font-size:16px;

    line-height:1.8;

    color:#697783;

}





.product-detail-content h3 {

    color:var(--navy);

    margin-top:25px;

    margin-bottom:10px;

}





.featured {

    display:inline-block;

    background:var(--gold);

    color:#fff;

    padding:6px 15px;

    border-radius:20px;

    font-size:12px;

    font-weight:600;

}

/* ================= THERAPEUTIC AREA TABS ================= */

.product-tabs {

    margin-bottom:40px;

    width:100%;

}


.product-tabs ul {

    list-style:none;

    padding:0;

    margin:0;

    display:flex;

    gap:12px;

    flex-wrap:wrap;

    justify-content:center;

}



/* TAB */

.product-tabs ul li a {

    display:block;

    padding:12px 25px;

    background:#ffffff;

    border:1px solid #e5e8eb;

    border-radius:30px;

    color:#062847;

    font-size:14px;

    font-weight:600;

    transition:all .3s ease;

}



/* HOVER */

.product-tabs ul li a:hover {

    background:#062847;

    color:#ffffff;

    border-color:#062847;

}



/* ACTIVE TAB */

.product-tabs ul li a.active {

    background:#062847;

    color:#ffffff;

    border-color:#062847;

}

.product-sidebar{
    width: 100%;
    margin-bottom: 40px;
}

.product-sidebar h3{
    margin-bottom: 15px;
    color: #062847;
    font-size: 22px;
}

.product-sidebar ul{
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    list-style: none;
    padding: 0;
    margin: 0;
}

.product-sidebar ul li{
    margin: 0;
}

.product-sidebar ul li a{
    display: inline-block;
    padding: 10px 18px;
    background: #f5f7fa;
    border: 1px solid #d9e2ec;
    border-radius: 30px;
    text-decoration: none;
    color: #062847;
    font-weight: 600;
    transition: all .3s ease;
}

.product-sidebar ul li a:hover,
.product-sidebar ul li a.active{
    background: #062847;
    color: #fff;
    border-color: #062847;
}

.product-info-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
    gap:25px;
    margin-top:40px;
}

.info-card{
    background:#fff;
    padding:25px;
    border-radius:12px;
    box-shadow:0 8px 20px rgba(0,0,0,.06);
}

.info-card h3{
    margin-bottom:12px;
    color:#0d5c63;
}

.product-section{
    margin-top:45px;
}

.product-section h2{
    margin-bottom:15px;
}

.benefits-list{
    margin:0;
    padding-left:22px;
}

.benefits-list li{
    margin-bottom:12px;
}

.lead{
    font-size:18px;
    line-height:1.8;
    color:#555;
}

.product-category{
    display:inline-block;
    margin-bottom:10px;
    color:#0d5c63;
    font-weight:600;
}

.product-detail{
    display:grid;
    grid-template-columns:520px 1fr;
    gap:60px;
    align-items:start;
}

.product-gallery{
    display:flex;
    gap:18px;
    position:sticky;
    top:120px;
    align-self:start;
}
.gallery-main{

    flex:1;

    background:#fff;

    border-radius:18px;

    padding:25px;

    border:1px solid #eee;

    box-shadow:0 10px 30px rgba(0,0,0,.05);

}

.gallery-main img{

    width:100%;

    display:block;

    object-fit:contain;

}
.gallery-thumbs{

    width:90px;

    display:flex;

    flex-direction:column;

    gap:12px;

}

.gallery-thumbs img{

    width:80px;

    height:80px;

    object-fit:cover;

    border:2px solid #ddd;

    border-radius:10px;

    cursor:pointer;

    transition:.25s;

}

.gallery-thumbs img:hover{

    border-color:#0a7b64;

}

.gallery-thumbs img.active{

    border-color:#0a7b64;

    box-shadow:0 0 0 3px rgba(10,123,100,.15);

}
/* MOBILE */

@media(max-width:768px){

 .navbar{
        position: relative;
    }

    .menu-toggle{
        display: block;
        background: none;
        border: none;
        font-size: 30px;
        cursor: pointer;
        color: #062847;
    }

    .nav-links{
        display: none;
    }

    .nav-links.active{
        display: flex;
        flex-direction: column;
        position: absolute;
        top: 70px;
        left: 0;
        width: 100%;
        background: #fff;
        padding: 20px 0;
        box-shadow: 0 5px 15px rgba(0,0,0,.15);
        z-index: 999;
    }

    .nav-links.active a{
        display: block;
        padding: 12px 20px;
        text-decoration: none;
        color: #062847;
        border-bottom: 1px solid #eee;
    }

    .nav-links.active .nav-button{
        margin: 15px 20px 0;
        text-align: center;
    }
.product-tabs ul {

    justify-content:flex-start;

    overflow-x:auto;

    flex-wrap:nowrap;

    padding-bottom:10px;

}


.product-tabs ul li a {

    white-space:nowrap;

    padding:10px 18px;

}


}



/* RESPONSIVE */

@media(max-width:900px){


.product-detail{

    grid-template-columns:1fr;

    gap:35px;

}



.product-detail-image{

    height:350px;

}


.product-detail-image img{

    max-width:240px;

    max-height:260px;

}


}



/* MOBILE */

@media(max-width:768px){


.product-detail{

    grid-template-columns:1fr;
    gap:30px;

}



.product-detail-image{

    height:350px;

}



.product-detail-content h2{

    font-size:28px;

}


}




    /* ================= ABOUT ================= */

    .about {
      background: #f6f9fb;
    }

    .about-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 55px;
      align-items: center;
    }

    .about-image {
      height: 370px;
      border-radius: 18px;
      background:
        linear-gradient(rgba(5,35,65,0.15), rgba(5,35,65,0.15)),
        url("../images/about.png") center/cover no-repeat;
    }

    .about-content small {
      color: var(--gold);
      font-weight: bold;
      letter-spacing: 1px;
    }

    .about-content h2 {
      font-family: Georgia, serif;
      font-size: 42px;
      color: var(--navy);
      margin: 15px 0;
    }

    .about-content p {
      color: #5c6c78;
      margin-bottom: 20px;
    }

    .focus-box {
      background: var(--navy);
      color: white;
      padding: 30px;
      border-radius: 15px;
      margin-top: 25px;
    }

    .focus-box h3 {
      color: var(--gold);
      margin-bottom: 20px;
    }

    .focus-list {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 12px;
      font-size: 14px;
    }

    /* ================= CTA ================= */

    .cta {
      background: var(--dark-navy);
      color: white;
      padding: 70px 0;
    }

    .cta-content {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 30px;
    }

    .cta h2 {
      font-family: Georgia, serif;
      font-size: 40px;
    }

    .cta p {
      margin-top: 10px;
      color: #c7d1da;
    }

    .cta .btn {
      background: white;
      color: var(--navy);
    }

    /* ================= FOOTER ================= */

    footer {
  background: #062847;
  color: #ffffff;
  padding: 70px 0 0;
  margin-top: 80px;
}

/* Footer Grid */

.footer-grid {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1.2fr;
  gap: 50px;
  padding-bottom: 55px;
}

/* Footer Headings */

footer h3 {
  color: #ffffff;
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 22px;
  letter-spacing: 0.3px;
}

/* Brand Section */

.footer-brand h3 {
  font-size: 24px;
  color: #ffffff;
  margin-bottom: 18px;
}

.footer-brand p {
  max-width: 330px;
  color: rgba(255, 255, 255, 0.72);
  line-height: 1.8;
  font-size: 15px;
}

.footer-tagline {
  color: #c9963e !important;
  font-weight: 600;
  margin-top: 20px;
}

/* Footer Links */

footer a {
  display: block;
  color: rgba(255, 255, 255, 0.72);
  text-decoration: none;
  font-size: 15px;
  margin-bottom: 13px;
  transition: all 0.3s ease;
}

footer a:hover {
  color: #c9963e;
  transform: translateX(4px);
}

/* Contact Section */

.footer-contact p {
  color: rgba(255, 255, 255, 0.72);
  font-size: 15px;
  line-height: 1.7;
  margin-bottom: 18px;
}

.footer-contact strong {
  display: block;
  color: #ffffff;
  font-weight: 600;
  margin-bottom: 3px;
}

/* Contact Links Should Not Have Transform */

.footer-contact a {
  display: inline-block;
  margin-bottom: 0;
}

/* Footer Bottom */

.footer-bottom {
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  padding: 22px 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
}

.footer-bottom p {
  margin: 0;
  color: rgba(255, 255, 255, 0.55);
  font-size: 13px;
}

.footer-legal {
  display: flex;
  gap: 25px;
}

.footer-legal a {
  margin: 0;
  font-size: 13px;
}

    /* ================= CATEGORIES ================= */

.categories-section {
  background: #ffffff;
}

.section-heading p {
  max-width: 650px;
  margin: 15px auto 0;
  color: #697783;
}

.category-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 25px;
}

.category-card {
  padding: 35px;
  border: 1px solid #e5e8eb;
  border-radius: 15px;
  transition: 0.3s;
}

.category-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 15px 30px rgba(0,0,0,0.08);
}

.category-icon {
  font-size: 35px;
  margin-bottom: 20px;
}

.category-card h3 {
  color: var(--navy);
  font-size: 22px;
  margin-bottom: 12px;
}

.category-card p {
  color: #697783;
  font-size: 14px;
  margin-bottom: 20px;
}

.category-card a {
  color: var(--gold);
  font-weight: bold;
  font-size: 14px;
}


/* ================= WHY SECTION ================= */

.why-section {
  background: #f6f9fb;
}

.why-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.why-card {
  background: white;
  padding: 28px;
  border-radius: 12px;
  border-top: 3px solid var(--gold);
}

.why-card h3 {
  color: var(--navy);
  margin-bottom: 12px;
}

.why-card p {
  color: #697783;
  font-size: 14px;
}


/* ================= QUALITY ================= */

.quality-section {
  background: #eef5fa;
}

.quality-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  align-items: center;
}

.quality-grid small {
  color: var(--gold);
  font-weight: bold;
  letter-spacing: 2px;
}

.quality-grid h2 {
  font-family: Georgia, serif;
  color: var(--navy);
  font-size: 42px;
  margin: 15px 0;
}

.quality-grid p {
  color: #607080;
  margin-bottom: 15px;
}

.quality-points {
  background: var(--navy);
  color: white;
  padding: 35px;
  border-radius: 15px;
}

.quality-points div {
  display: flex;
  gap: 15px;
  padding: 15px 0;
  border-bottom: 1px solid rgba(255,255,255,0.15);
}

.quality-points div:last-child {
  border-bottom: none;
}

.quality-points strong {
  color: var(--gold);
}


/* ================= INSIGHTS ================= */

.insights-section {
  background: white;
}

.insights-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 25px;
}

.insight-card {
  border: 1px solid #e5e8eb;
  border-radius: 12px;
  padding: 28px;
  transition: 0.3s;
}

.insight-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 25px rgba(0,0,0,0.08);
}

.insight-content small {
  color: var(--gold);
  font-weight: bold;
  letter-spacing: 1px;
}

.insight-content h3 {
  color: var(--navy);
  margin: 12px 0;
  font-size: 20px;
}

.insight-content p {
  color: #697783;
  font-size: 14px;
  margin-bottom: 18px;
}

.insight-content a {
  color: var(--navy);
  font-weight: bold;
}


/* ================= FAQ ================= */

.faq-section {
  background: #f6f9fb;
}

.faq-list {
  max-width: 850px;
  margin: auto;
}

.faq-list details {
  background: white;
  margin-bottom: 12px;
  border-radius: 8px;
  padding: 20px 25px;
  border: 1px solid #e5e8eb;
}

.faq-list summary {
  cursor: pointer;
  font-weight: bold;
  color: var(--navy);
}

.faq-list p {
  color: #697783;
  margin-top: 15px;
  font-size: 14px;
}
/* ================= COMPACT CONTACT FORM ================= */

.contact-form {

  background: #ffffff;

  padding: 22px;

  border-radius: 8px;

  box-shadow: 0 8px 25px rgba(6, 40, 71, 0.08);

  border: 1px solid #e8edf2;

}


/* FORM GROUP */

.contact-form .form-group {

  margin-bottom: 14px;

}


/* LABEL */

.contact-form label {

  display: block;

  margin-bottom: 5px;

  font-size: 13px;

  font-weight: 600;

  color: #062847;

}


/* INPUTS */

.contact-form input,
.contact-form textarea,
.contact-form select {

  width: 100%;

  padding: 10px 12px;

  border: 1px solid #d8e0e7;

  border-radius: 5px;

  font-family: inherit;

  font-size: 14px;

  color: #062847;

  background: #fff;

  outline: none;

  transition: .25s ease;

  box-sizing: border-box;

}


/* TEXTAREA */

.contact-form textarea {

  min-height: 90px;

  resize: vertical;

}


/* PLACEHOLDER */

.contact-form input::placeholder,
.contact-form textarea::placeholder {

  color:#9aa7b2;

}


/* FOCUS */

.contact-form input:focus,
.contact-form textarea:focus,
.contact-form select:focus {

  border-color:#c9963e;

  box-shadow:0 0 0 2px rgba(201,150,62,.12);

}


/* TWO COLUMN */

.contact-form .form-row {

  display:grid;

  grid-template-columns:repeat(2,1fr);

  gap:12px;

}


/* BUTTON */

.contact-form button {

  padding:10px 24px;

  border:none;

  border-radius:5px;

  cursor:pointer;

  font-size:14px;

  font-weight:600;

  margin-top:5px;

}


/* REQUIRED */

.contact-form .required {

  color:#c9963e;

}

/**POPUP**/
/* =================================================
   FIXED ENQUIRE BUTTON
================================================= */

.fixed-enquiry-btn {

    position: fixed;

    right: 25px;

    bottom: 25px;

    background: #c9963e;

    color: #ffffff;

    padding: 14px 24px;

    border-radius: 30px;

    font-size: 15px;

    font-weight: 600;

    text-decoration: none;

    z-index: 9998;

    box-shadow: 0 8px 25px rgba(0,0,0,0.20);

    transition: .3s ease;

}


.fixed-enquiry-btn:hover {

    background:#062847;

    transform:translateY(-3px);

}





/* =================================================
   OVERLAY
================================================= */


.enquiry-overlay {


    position: fixed;

    top:0;

    left:0;

    width:100%;

    height:100%;


    background:rgba(6,40,71,0.65);


    display:flex;

    align-items:center;

    justify-content:center;


    z-index:9999;


    opacity:0;

    visibility:hidden;


    transition:.3s ease;


}




.enquiry-overlay.active {


    opacity:1;

    visibility:visible;


}





/* =================================================
   MODAL BOX
================================================= */


.enquiry-panel {


    width:450px;

    max-width:90%;


    background:#ffffff;


    border-radius:16px;


    padding:35px;


    position:relative;


    box-shadow:0 20px 60px rgba(0,0,0,.25);



    transform:scale(.85) translateY(30px);


    transition:.35s ease;


}




.enquiry-overlay.active .enquiry-panel {


    transform:scale(1) translateY(0);


}





/* =================================================
   CLOSE BUTTON
================================================= */


.close-enquiry {


    position:absolute;


    right:18px;


    top:12px;


    width:35px;

    height:35px;


    border-radius:50%;


    border:none;


    background:#f1f1f1;


    color:#062847;


    font-size:24px;


    line-height:30px;


    cursor:pointer;


    transition:.3s;


}



.close-enquiry:hover {


    background:#c9963e;

    color:#fff;


}






/* =================================================
   FORM CONTENT
================================================= */


.enquiry-panel h3 {


    margin:0 0 25px;


    font-size:28px;


    color:#062847;


    text-align:center;


}




.enquiry-panel .form-group {


    margin-bottom:16px;


}




.enquiry-panel label {


    display:block;


    margin-bottom:6px;


    font-size:14px;


    font-weight:600;


    color:#062847;


}




.enquiry-panel input,
.enquiry-panel textarea,
.enquiry-panel select {


    width:100%;


    padding:12px 14px;


    border:1px solid #d8e0e7;


    border-radius:6px;


    font-size:14px;


    font-family:inherit;


    color:#062847;


    outline:none;


    box-sizing:border-box;


    transition:.3s;


}




.enquiry-panel input:focus,
.enquiry-panel textarea:focus,
.enquiry-panel select:focus {


    border-color:#c9963e;


    box-shadow:0 0 0 3px rgba(201,150,62,.15);


}





.enquiry-panel textarea {


    height:100px;

    resize:none;


}





/* BUTTON */


.enquiry-panel .btn-primary {


    width:100%;


    padding:13px;


    margin-top:10px;


    border:none;


    border-radius:30px;


    background:#062847;


    color:#fff;


    font-size:15px;


    font-weight:600;


    cursor:pointer;


    transition:.3s;


}



.enquiry-panel .btn-primary:hover {


    background:#c9963e;


}


/* ================= PRODUCT ACTION BUTTONS ================= */


.product-actions {

    display:flex;

    gap:12px;

    margin-top:20px;

}



.product-actions .product-btn {


    flex:1;

    text-align:center;

    padding:11px 14px;

    border-radius:30px;

    font-size:14px;

    font-weight:600;

    text-decoration:none;

    transition:.3s ease;

}




/* View Product */

.view-btn {

    background:#062847;

    color:#fff;

}




.view-btn:hover {

    background:#c9963e;

    color:#fff;

}





/* Enquiry Button */

.enquiry-btn {

    background:#c9963e;

    color:#fff;

}




.enquiry-btn:hover {

    background:#062847;

    color:#fff;

}





/* Featured Badge */

.featured {

    display:inline-block;

    background:#eaf6ef;

    color:#1c7c54;

    padding:5px 12px;

    border-radius:20px;

    font-size:12px;

    font-weight:600;

    margin-bottom:10px;

}




.product-info {

    /*display:flex;*/

    flex-direction:column;

    height:100%;

}



.product-info p {

    flex-grow:1;

}



/* Mobile */

@media(max-width:600px){


.product-actions {

    flex-direction:column;

}


}



/* =================================================
   MOBILE
================================================= */



/* MOBILE */

@media(max-width:768px){

  .contact-form {

    padding:16px;

  }


  .contact-form .form-row {

    grid-template-columns:1fr;

  }

}

/* MOBILE */

@media (max-width: 768px) {

  .contact-form {

    padding: 25px 20px;

  }

  .contact-form .form-row {

    grid-template-columns: 1fr;

    gap: 0;

  }
.fixed-enquiry-btn {


    right:15px;

    bottom:15px;


    padding:12px 20px;


}



.enquiry-panel {


    width:100%;


    max-width:calc(100% - 30px);


    padding:25px;


}



.enquiry-panel h3 {


    font-size:22px;


}


}

    /* ================= MOBILE ================= */

    @media (max-width: 1000px) {

      .nav-links {
        display: none;
      }

      .hero-content {
        grid-template-columns: 1fr;
        padding: 60px 0;
      }

      .hero-products {
        min-height: 300px;
      }

      .feature-box {
        grid-template-columns: repeat(2, 1fr);
      }

      .feature:nth-child(2) {
        border-right: none;
      }

      .products-grid {
        grid-template-columns: repeat(2, 1fr);
      }

      .about-grid {
        grid-template-columns: 1fr;
      }

      .footer-grid {
        grid-template-columns: repeat(2, 1fr);
      }
      .category-grid,
        .insights-grid {
        grid-template-columns: repeat(2, 1fr);
        }

        .why-grid {
        grid-template-columns: repeat(2, 1fr);
        }

        .quality-grid {
        grid-template-columns: 1fr;
        }
    }

    @media (max-width: 600px) {

    .category-grid,
    .why-grid,
    .insights-grid {
    grid-template-columns: 1fr;
    }

      .hero h1 {
        font-size: 44px;
      }

      .hero-buttons {
        flex-direction: column;
      }

      .feature-box {
        grid-template-columns: 1fr;
      }

      .feature {
        border-right: none;
        border-bottom: 1px solid #eee;
        padding-bottom: 18px;
      }

      .feature:last-child {
        border-bottom: none;
      }

      .products-grid {
        grid-template-columns: 1fr;
      }

      .cta-content {
        flex-direction: column;
        align-items: flex-start;
      }

      .footer-grid {
        grid-template-columns: 1fr;
      }
    }
    /* ===============================
   Fixed Header (Desktop Only)
================================= */

@media (min-width: 992px) {

    header {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        width: 100%;
        z-index: 9999;
        background: #fff;
        transition: all .3s ease;
        box-shadow: 0 2px 12px rgba(0,0,0,.08);
    }

    /* Push page content below fixed header */
    body {
        padding-top: 90px; /* Match your header height */
    }

}
