.page-header {
       margin-top: 86px;
       text-align: center;
       color: white;
       padding: 40px 0 30px;
       height: 200px;
       position: relative;
       background-image:
           linear-gradient(135deg, rgb(3 16 26 / 55%), rgb(0 3 6 / 73%)), url(../assets/images/banner/AppliCare.jpeg);
       background-size: cover;
       background-position: center;
       background-repeat: no-repeat;
   }

   .page-title {
       font-size: 2rem;
       font-weight: 700;
       margin-bottom: 8px;
       color: #fff;
   }

   .page-subtitle {
       font-size: 0.95rem;
       opacity: 0.9;
   }

   .nav-tabs {
       border: none;
       justify-content: center;
       margin: 30px 0 25px;
       gap: 10px;
       flex-wrap: wrap;
   }

   .nav-tabs .nav-link {
       background: #e0e7ff;
       color: #4f46e5;
       padding: 8px 20px;
       border-radius: 25px;
       font-weight: 600;
       border: none;
       font-size: 0.9rem;
       transition: all 0.3s;
   }

   .nav-tabs .nav-link:hover {
       background: #c7d2fe;
   }

   .nav-tabs .nav-link.active {
       background: #4f46e5;
       color: white;
       box-shadow: 0 4px 12px rgba(79, 70, 229, 0.3);
   }

   .product-card {
       background: white;
       border-radius: 12px;
       overflow: hidden;
       box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
       transition: all 0.3s;
       height: 100%;
       display: flex;
       flex-direction: column;
   }

   .product-card:hover {
       transform: translateY(-4px);
       box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
   }

   .product-img {
       width: 200px;
       height: 180px;
       object-fit: contain;
       width: 100%;
       padding: 15px;
       background: #fafafa;
   }

   .card-body {
       padding: 16px;
       flex-grow: 1;
       display: flex;
       flex-direction: column;
   }

   .product-title {
       font-size: 1.05rem;
       font-weight: 600;
       color: #1e293b;
       margin-bottom: 10px;
       line-height: 1.3;
   }

   .specs {
       list-style: none;
       padding: 0;
       margin: 8px 0 12px;
       flex-grow: 1;
   }

   .specs li {
       font-size: 0.8rem;
       color: #64748b;
       margin: 4px 0;
       line-height: 1.4;
   }

   .specs li i {
       color: #10b981;
       margin-right: 6px;
       font-size: 0.75rem;
   }

   .price {
       font-size: 1.4rem;
       font-weight: 700;
       color: #059669;
       margin: 10px 0 12px;
   }

   .btn-buy {
       background: linear-gradient(135deg, #0781cf, #202b82);
       color: white;
       border: none;
       padding: 5px;
       border-radius: 8px;
       font-weight: 600;
       width: 100%;
       font-size: 0.95rem;
       transition: all 0.3s;
       cursor: pointer;
   }

   .btn-buy:hover {
       background: linear-gradient(135deg, #ea580c, #dc2626);
       transform: translateY(-1px);
   }

   @media (max-width: 768px) {
       .page-title {
           font-size: 1.6rem;
       }

       .product-title {
           font-size: 1rem;
       }

       .price {
           font-size: 1.2rem;
       }
   }

   .header-other {
       top: 0;
   }

   /* ===================== */
   .buy-modal {
       display: none;
       position: fixed;
       inset: 0;
       background: rgba(0, 0, 0, 0.6);
       z-index: 99999;
   }

   .buy-modal-content {
       width: 300px;
       margin: 12% auto;
       background: #fff;
       padding: 20px;
       border-radius: 12px;
       text-align: center;
       position: relative;
   }

   .buy-modal-close {
       position: absolute;
       right: 12px;
       top: 10px;
       font-size: 28px;
       font-weight: bold;
       cursor: pointer;
   }

   .buy-modal-close:hover {
       color: red;
   }

   .buy-modal-buttons a {
       display: inline-block;
       margin: 8px;
       padding: 10px 18px;
       border-radius: 6px;
       color: #fff;
       text-decoration: none;
   }

   .call-btn {
       background: #28a745;
   }

   .whatsapp-btn {
       background: #25d366;
   }