:root{
      --primary:#1e3c72;
      --secondary:#f5f7fa;
      --accent:#ff9800;
      --dark:#1b1b1b;
      --light:#ffffff;
    }

    *{margin:0;padding:0;box-sizing:border-box}
    body{font-family:'Poppins',sans-serif;line-height:1.6;color:#333;background:#fafafa}
    img{max-width:100%;display:block}
    a{text-decoration:none;color:inherit}
    .container{width:90%;max-width:1200px;margin:auto}

    /* ===== Header ===== */
    header{position:fixed;top:0;left:0;width:100%;background:var(--light);z-index:999;box-shadow:0 2px 10px rgba(0,0,0,.05)}
    .nav{display:flex;align-items:center;justify-content:space-between;height:70px}
    .logo{font-size:24px;font-weight:700;color:var(--primary)}
    nav ul{display:flex;gap:25px;list-style:none}
    nav li a{font-weight:600}
    .menu-toggle{display:none;font-size:26px;cursor:pointer}

    /* ===== Banner ===== */
    .banner{background:linear-gradient(120deg,var(--primary),#2a5298);color:#fff;padding:140px 0 100px}
    .banner-content{max-width:700px}
    .banner h1{font-size:40px;margin-bottom:15px}
    .banner p{opacity:.95}

    /* ===== Details Section ===== */
    section{padding:80px 0}
    .details{background:var(--secondary)}
    .details h2{text-align:center;font-size:34px;margin-bottom:20px;color:var(--primary)}
    .details p{max-width:100%;margin:0 auto;text-align:justify; padding:10px 0px;}

/* ===== Details Section ===== */
    section{padding:50px 0}
    .info{background:var(--light)}
    .info h2{text-align:center;font-size:34px;margin-bottom:20px;color:var(--primary)}
    .info p{margin:0 auto;text-align:justify; padding:10px 0px}

    /* ===== Products ===== */
    .products{background:#fff}
    .products h2{text-align:center;margin-bottom:40px;color:var(--primary)}
    .product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:25px}
    .product-card{background:#fff;border-radius:14px;box-shadow:0 10px 25px rgba(0,0,0,.08);overflow:hidden;transition:.3s}
    .product-card:hover{transform:translateY(-6px)}
    .product-card .content{padding:20px}
    .rating{color:#ffc107;font-size:14px;margin:8px 0}
    .btn-group{display:flex;gap:10px;margin-top:15px}
    .btn{flex:1;padding:10px;border-radius:8px;text-align:center;font-size:14px;font-weight:500}
    .btn.whatsapp{background:#25d366;color:#fff}
    .btn.call{background:var(--primary);color:#fff}

    /* ===== Services ===== */
    .services{background:linear-gradient(135deg,#fdfbfb,#ebedee)}
    .services h2{text-align:center;margin-bottom:50px;color:var(--primary)}
    .service-box{display:flex;gap:30px;align-items:center;margin-bottom:40px;padding:10px;border-radius:15px}
    .service-box:nth-child(odd){background:#e3f2fd}
    .service-box:nth-child(even){background:#ffffff}
    .service-img{flex:0 0 30%}
    .service-content{flex:0 0 65%}
    .service-content h3{margin-bottom:10px}
    .service-buttons{margin-top:15px;display:block;gap:12px}
    .service-buttons a{padding:10px 18px;border-radius:20px;font-size:14px}
    .book{background:var(--accent);color:#fff}
    .read{border:1px solid #333}

    /* ===== Price List ===== */
    .pricing{background:#fff}
    .pricing h2{text-align:center;margin-bottom:30px;color:var(--primary)}
    table{width:100%;border-collapse:collapse;box-shadow:0 10px 25px rgba(0,0,0,.05)}
    th,td{padding:15px;text-align:center}
    th{background:var(--primary);color:#fff}
    tr:nth-child(even){background:#f5f5f5}

    /* ===== FAQ ===== */
    .faq{background:var(--secondary)}
    .faq h2{text-align:center;margin-bottom:30px;color:var(--primary)}
    .faq-item{max-width:800px;margin:0 auto 15px;background:#fff;border-radius:10px;overflow:hidden}
    .faq-question{padding:15px 20px;font-weight:500;cursor:pointer;background:#fff}
    .faq-answer{padding:0 20px;height:0;overflow:hidden;transition:.3s}
    .faq-item.active .faq-answer{padding:15px 20px;height:auto}

    /* ===== Footer ===== */
    footer{background:var(--dark);color:#ccc;padding:60px 0}
    .footer-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:25px}
    footer h4{color:#fff;margin-bottom:15px}

    /* ===== Responsive ===== */
    @media(max-width:992px){
      .product-grid{grid-template-columns:repeat(2,1fr)}
      .service-box{flex-direction:column}
      .service-img,.service-content{flex:100%}
      .footer-grid{grid-template-columns:repeat(2,1fr)}
    }
    @media(max-width:768px){
      nav ul{position:fixed;top:70px;right:-100%;background:#fff;width:100%;flex-direction:column;gap:0;transition:.3s}
      nav ul.active{right:0}
      nav li{padding:15px;border-bottom:1px solid #eee}
      .menu-toggle{display:block}
    }
    @media(max-width:576px){
      .product-grid{grid-template-columns:1fr}
      .footer-grid{grid-template-columns:1fr}
      .banner h1{font-size:32px}
    }

/* Common Button Style */
.btn {
  display: inline-block;
  padding: 10px 10px;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  border: none;
  cursor: pointer;
  transition: all 0.3s ease;
  margin: 10px 5px;
}

/* Button Colors */
.btn-primary {
  background: #007bff;
  color: #fff;
}
.btn-primary:hover {
  background: #0056b3;
}

.btn-success {
  background: #28a745;
  color: #fff;
}
.btn-success:hover {
  background: #1e7e34;
}

.btn-danger {
  background: #dc3545;
  color: #fff;
}
.btn-danger:hover {
  background: #b52a37;
}

.btn-warning {
  background: #ffc107;
  color: #000;
}
.btn-warning:hover {
  background: #e0a800;
}

.btn-info {
  background: #17a2b8;
  color: #fff;
}
.btn-info:hover {
  background: #117a8b;
}

.btn-dark {
  background: #343a40;
  color: #fff;
}
.btn-dark:hover {
  background: #1d2124;
}
li{display:block;}

.select-box select{
  width:100%;
  padding:16px 18px;
  border-radius:12px;
  border:2px solid #1a73e8;
  font-size:16px;
  font-weight:500;
  outline:none;
  background:#fff;
  cursor:pointer;
}
.select-box select:focus{
  box-shadow:0 0 0 4px rgba(26,115,232,.2);
}
strong {
 color: #007bff;
}

/* PRODUCT PROFILE SECTION */
.product-profile {
    padding: 60px 0;
    background: #fff;
}

.product-content {
    display: flex;
    gap: 40px;
    align-items: center;
}

.product-text {
    width: 55%;
}

.product-text h1 {
    font-size: 36px;
    color: #1a7f37;
    margin-bottom: 15px;
}

.product-text p {
    font-size: 16px;
    line-height: 1.7;
    margin-bottom: 25px;
}

.product-text h3 {
    margin-bottom: 10px;
    color: #333;
}

/* TABLE */
table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 25px;
}

table th, table td {
    border: 1px solid #ddd;
    padding: 12px;
    text-align: left;
}

table th {
    background: #1a7f37;
    color: #fff;
}

/* BUTTONS */
.btn-group {
    display: flex;
    gap: 15px;
}

.btn {
    padding: 12px 25px;
    text-decoration: none;
    color: #fff;
    font-weight: bold;
    border-radius: 5px;
}

.whatsapp {
    background: #25d366;
}

.call {
    background: #1a7f37;
}

/* IMAGE */
.product-image {
    width: 45%;
    text-align: center;
}

.product-image img {
    width: 100%;
    /*max-width: 400px;*/
}

/* REFERENCE PRODUCTS */
.reference-products {
    padding: 60px 0;
}

.reference-products h2 {
    text-align: center;
    margin-bottom: 40px;
    color: #1a7f37;
}

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

.ref-card {
    background: #fff;
    padding: 20px;
    text-align: center;
    border-radius: 8px;
    box-shadow: 0 0 10px rgba(0,0,0,0.08);
}

.ref-card img {
    width: 100%;
    
    object-fit: contain;
    margin-bottom: 15px;
}

.ref-card h4 {
    margin-bottom: 8px;
    color: #333;
}

.ref-card p {
    font-size: 14px;
}

/* RESPONSIVE */
@media (max-width: 900px) {
    .product-content {
        flex-direction: column;
    }

    .product-text,
    .product-image {
        width: 100%;
    }

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

@media (max-width: 500px) {
    .reference-grid {
        grid-template-columns: 1fr;
    }
}