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

    body {
      font-family: 'Poppins', sans-serif;
      background: linear-gradient(#0b1c8c, #2475c7);
      color: #0b1c8c;
      line-height: 1.6;
    }

    /* --- Header --- */
    .color {
      background: linear-gradient(90deg, #2475c7, #0b1c8c);
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 12px 20px;
      flex-wrap: wrap;
    }

    .logo img { height: 50px; padding-left: 10px; }

    /* Navbar Base */
    .navbar {
      padding: 12px 40px;
      display: flex;
      justify-content: flex-end;
      align-items: center;
      position: sticky;
      top: 0;
      z-index: 100;
    }

    .nav-links {
      list-style: none;
      display: flex;
      align-items: center;
      gap: 18px;
    }

    .nav-links a {
      color: #fff;
      text-decoration: none;
      font-weight: 600;
      padding: 6px 10px;
      border-radius: 6px;
    }

    /* Hover effect */
    .nav-links a:hover {
      background: #ffcc00;
      color: #111;
    }

    /* Active page highlight */
    .nav-links a:hover,
    .nav-links a.active {
      background: #ffcc00;
      color: #111;
    }

    /* Dropdown */
    .dropdown {
      position: relative;
    }

    .dropdown-menu {
      display: none;
      position: absolute;
      top: 100%;
      left: 0;
      background: #222;
      min-width: 180px;
      border-radius: 8px;
      box-shadow: 0 5px 15px rgba(0,0,0,0.3);
      flex-direction: column;
      overflow: hidden;
    }

    .dropdown-menu li a {
      display: block;
      padding: 10px 15px;
      color: #fff;
      transition: 0.3s;
    }

    .dropdown-menu li a:hover {
      background: #ffcc00;
      color: #111;
    }

    /* Show dropdown on hover */
    .dropdown:hover .dropdown-menu {
      display: flex;
    }

    /* Responsive */
    @media (max-width: 768px) {
      .nav-links {
        flex-direction: column;
        background: #111;
        position: absolute;
        top: 60px;
        right: 0;
        width: 200px;
        display: none;
        border-radius: 10px;
        padding: 15px 0;
      }

      .nav-links.active {
        display: flex;
      }

      .menu-toggle {
        display: block;
        cursor: pointer;
        color: #fff;
        font-size: 28px;
        position: absolute;
        right: 30px;
      }
    }

    .menu-toggle {
      display: none;
    }

    .call a { text-decoration: none; }
    .call button {
      background: #ffd700;
      color: #0b1c8c;
      border: 0;
      padding: 10px 14px;
      border-radius: 6px;
      font-weight: 700;
      cursor: pointer;
      transition: transform .18s, opacity .18s;
    }
    .call button:hover { transform: scale(1.03); opacity: 0.95; }

    /* --- Hero --- */
    .contact-hero {
      background: url('contact.png') center/cover no-repeat;
      position: relative;
      color: #fff;
      padding: 100px 0;
    }

    .contact-hero::before {
      content: "";
      position: absolute;
      inset: 0;
      background: rgba(0, 0, 0, 0.45);
    }

    .hero-container {
      position: relative;
      z-index: 2;
      max-width: 1100px;
      margin: 0 auto;
      display: flex;
      justify-content: center;
      align-items: center;
      padding: 0 20px;
    }

    .hero-text h1 {
      font-size: 36px;
      color: #fff;
      text-align: center;
    }

    /* --- Two-Column Top (Form + QA) --- */
    .page-wrap {
      max-width: 1200px;
      margin: 40px auto;
      padding: 0 20px;
    }

    .top-grid {
      display: grid;
      grid-template-columns: 1fr 480px;
      gap: 30px;
    }

    .box-form {
      background: linear-gradient(#0b1c8c, #2475c7);
      padding: 30px;
      border-radius: 10px;
      margin-left: -30px;
    }

    .box-form h2 { font-size: 22px; margin-bottom: 6px; color: #fff; }
    .lead { color: #fff; margin-bottom: 12px; font-size: 14px; }

    .field-row {
      display: flex;
      gap: 10px;
      margin-bottom: 8px;
    }

    .field-row input {
      flex: 1;
      padding: 10px;
      font-size: 18px;
      border: 1.5px solid #cfd8f0;
      border-radius: 4px;
    }

    textarea {
      width: 100%;
      padding: 10px;
      font-size: 18px;
      border: 1.5px solid #cfd8f0;
      border-radius: 4px;
      min-height: 120px;
    }

    .form-actions {
      margin-top: 10px;
      display: flex;
      justify-content: center;
    }

    .btn-send {
      background: #ffd700;
      color: #0b1c8c;
      border: 0;
      padding: 12px 18px;
      border-radius: 8px;
      font-weight: 700;
      font-size: 18px;
      cursor: pointer;
    }

    .qa-card {
      background: transparent;
      padding: 42px;
      border-radius: 10px;
    }

    .qa-card h3 { font-size: 22px; margin-bottom: 16px; color: #fff; }
    .qa-card h3 span { color: #fff; }
    .qa-card p, .qa-list { color: #fff; margin-bottom: 8px; }

    .qa-social {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-top: 30px;
      font-size: 20px;
      color: #ffffff;
    }

    .qa-social-icons a {
      color: #ffffff;
      margin: 0 10px;
      font-size: 20px;
      text-decoration: none;
    }

    .qa-social-icons a:hover { color: #fff; }

    /* --- Simple Contact + Map Section --- */
    .contact-section-plain {
      width: 100%;
      padding: 60px 20px;
      background: transparent;
    }

    .contact-container {
      display: grid;
      grid-template-columns: 1fr 1fr;
      align-items: start;
      gap: 40px;
      max-width: 1100px;
      margin: 0 auto;
    }

    .contact-details-plain { color: #fff; }
    .contact-details-plain h3 {
      font-size: 26px;
      color: #ffd700;
      margin-bottom: 20px;
    }

    .contact-details-plain p {
      font-size: 18px;
      margin: 8px 0;
      color: #fff;
    }

    .contact-details-plain a {
      color: #ffd700;
      text-decoration: none;
    }

    .contact-details-plain .note {
      margin-top: 20px;
      font-size: 16px;
      color: #e6e6e6;
      line-height: 1.5;
    }

    .map-container-plain iframe {
      width: 100%;
      height: 380px;
      border: 0;
      border-radius: 8px;
    }

    /* --- Stats --- */
    .stats-row {
      max-width: 1200px;
      margin: 40px auto 60px;
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 16px;
      padding: 0 20px;
    }

    .stat {
  background-image: 
    linear-gradient(to top, 
      rgb(0, 0, 0) 0%,   /* bottom dark */
      rgba(0, 0, 0, 0.692) 40%,  /* mid fade */
      rgba(0, 0, 0, 0.0) 100%  /* center transparent */
    ),
    url('3Dk.jpg');
      padding: 20px;
      border-radius: 10px;
      text-align:center;
    }

    .num { font-size: 26px; font-weight: 800; color: #0b1c8c; }
    .label {
      font-size: 23px;
      color: #ffd700;
      font-family: Georgia, 'Times New Roman', Times, serif;
      margin-top: 6px;
    }

    .stat p { color: #ffffff; margin-top: 6px; }

    /* --- Footer --- */
    .footer {
      background: #0b1c8c;
      color: #fff;
      padding: 14px 20px;
    }

    .footer-container {
      max-width: 1100px;
      margin: 0 auto;
      display: flex;
      justify-content: space-between;
      align-items: center;
      flex-wrap: wrap;
    }

    .footer p { font-size: 16px; }
    .social a {
      color: #ffffff;
      margin: 0 10px;
      font-size: 18px;
      text-decoration: none;
    }

    .social a:hover { color: #fff; }

    /* --- Responsive --- */
    @media (max-width: 900px) {
      .top-grid, .contact-container {
        grid-template-columns: 1fr;
      }
      .map-container-plain iframe { height: 300px; margin-top: 20px; }
      .stats-row { grid-template-columns: repeat(2, 1fr); }
    }

    @media (max-width: 600px) {
      .stats-row { grid-template-columns: 1fr; }
    }