/* ===== GOOGLE FONTS ===== */
  @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800;900&display=swap');

  /* ===== CSS VARIABLES ===== */
  :root {
    --blue: #1565C0;
    --blue-light: #42A5F5;
    --blue-dark: #0D47A1;
    --yellow: #FFD600;
    --pink: #E91E8C;
    --pink-light: #F48FB1;
    --text-dark: #1a1a2e;
    --text-gray: #6b7280;
    --gradient-main: linear-gradient(135deg, #1565C0 0%, #E91E8C 100%);
    --shadow-card: 0 20px 60px rgba(0,0,0,0.12);
    --radius: 20px;
  }

  *, *::before, *::after { box-sizing: border-box; }
  html, body { height: 100%; scroll-behavior: smooth; }
  body {
    font-family: 'Poppins', sans-serif;
    display: flex; flex-direction: column;
    color: var(--text-dark);
    background: #ffffff;
    overflow-x: hidden;
  }

  ::-webkit-scrollbar { width: 6px; }
  ::-webkit-scrollbar-track { background: #f1f1f1; }
  ::-webkit-scrollbar-thumb { background: #1565C0; border-radius: 10px; }

  /* ===== NAVBAR ===== */
  .main-nav {
    background: linear-gradient(90deg, #0D47A1 0%, #1565C0 60%, #E91E8C 100%) !important;
    height: auto !important;
    min-height: 75px;
    box-shadow: 0 4px 20px rgba(21,101,192,0.4);
    position: sticky; top: 0; z-index: 1000; padding: 10px 0;
  }
  .nav-img { border-radius: 50%; border: 2px solid #FFD600; padding: 2px; }
  .nav-text { font-weight: 800; font-size: 18px; color: #FFD600 !important; letter-spacing: 1px; }
  .navbar-nav .nav-link {
    font-weight: 600 !important; font-size: 14px !important;
    color: rgba(255,255,255,0.9) !important;
    padding: 8px 16px !important; border-radius: 25px; transition: all 0.3s ease;
  }
  .navbar-nav .nav-link:hover { color: #FFD600 !important; background: rgba(255,255,255,0.15); }
  .navbar-toggler { border: 2px solid #FFD600 !important; }
  .navbar-collapse { background: rgba(13,71,161,0.97); padding: 10px 15px; border-radius: 0 0 16px 16px; }

  /* ===== HERO - NO OVERLAY ===== */
  .bg-img-section { position: relative; overflow: hidden; }
  /* NO ::before overlay - image pure dikhegi */
  .bg-image {
    width: 100%; height: 880px; display: block;
    object-fit: cover;
    /* No filter - original image */
  }
  .content {
    position: absolute; top: 50%; left: 8%;
    transform: translateY(-50%);
    color: white; z-index: 2; max-width: 620px;
    background: linear-gradient(135deg, rgba(13,71,161,0.85), rgba(233,30,140,0.7));
    padding: 40px; border-radius: 20px;
    backdrop-filter: blur(4px);
    border: 1px solid rgba(255,255,255,0.2);
  }
  .bg-text { font-size: 52px; font-weight: 900; line-height: 1.15; margin-bottom: 16px; color: #ffffff; }
  .hero-subtitle { font-size: 16px; color: rgba(255,255,255,0.9); margin-bottom: 25px; line-height: 1.7; }
  .app-section { margin-top: 15px; display: flex; gap: 12px; flex-wrap: wrap; }
  .web-icon-img {
    width: 150px; height: auto; cursor: pointer; border-radius: 10px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    box-shadow: 0 4px 15px rgba(0,0,0,0.3);
  }
  .web-icon-img:hover { transform: translateY(-4px); box-shadow: 0 8px 25px rgba(0,0,0,0.4); }
  .divider-img { position: relative; width: 100%; top: -10px; z-index: 3; }

  /* ===== OUR MISSION ===== */
  .our-mission { margin-top: 5rem; margin-bottom: 5rem; position: relative; }
  .our-mission-img { width: 100%; border-radius: 20px; box-shadow: 0 20px 60px rgba(0,0,0,0.12); }
  .our-mission-p { text-align: justify; color: #6b7280; font-size: 15px; line-height: 1.9; }
  .text-gradient-border {
    font-size: 48px; font-weight: 800;
    background: linear-gradient(135deg, #1565C0 0%, #E91E8C 100%);
    -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
  }

  /* ===== WHY CHOOSE ===== */
  .why-choose-section {
    position: relative; width: 100%;
    background: linear-gradient(135deg, #0D47A1 0%, #1565C0 50%, #880E5A 100%);
    padding: 80px 0; overflow: hidden;
  }
  .why-choose-section::before {
    content: ''; position: absolute; top: -100px; left: -100px;
    width: 400px; height: 400px;
    background: radial-gradient(circle, rgba(255,214,0,0.12) 0%, transparent 70%);
    border-radius: 50%;
  }
  .whychoose_image { display: none; }
  .content-overlay { position: relative; width: 100%; }
  .why-choose-content {
    position: relative; top: auto; left: auto; transform: none;
    width: 100%; max-width: 1400px; padding: 0 40px; z-index: 2; margin: 0 auto;
  }
  .why-choose-content .container-fluid { margin-top: 0 !important; margin-bottom: 0 !important; }
  .why-choose-content h2 { font-size: 48px; font-weight: 800; color: #ffffff; margin-bottom: 12px; }
  .why-choose-content h2::after {
    content: ''; display: block; width: 70px; height: 4px;
    background: #FFD600; border-radius: 2px; margin-top: 12px;
  }
  .why-choose-content h6 { font-size: 17px; color: rgba(255,255,255,0.8); margin-bottom: 50px; font-weight: 400; }
  .why-choose-card {
    background-color: transparent !important;
    width: 100%; max-width: 420px; margin: 0 auto; transition: transform 0.3s ease;
  }
  .why-choose-card:hover { transform: translateY(-10px); }
  .why-choose-card-body {
    background: rgba(255,255,255,0.1) !important;
    border: 1px solid rgba(255,255,255,0.2) !important;
    border-radius: 20px !important;
    backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
    box-shadow: 0 10px 40px rgba(0,0,0,0.25);
    transition: all 0.35s ease; padding: 30px !important;
    position: relative; overflow: hidden;
  }
  .why-choose-card-body::before {
    content: ''; position: absolute; top: 0; left: 0; right: 0; height: 4px;
    background: linear-gradient(90deg, #FFD600, #E91E8C);
  }
  .why-choose-card-body:hover {
    background: rgba(255,255,255,0.18) !important;
    box-shadow: 0 20px 60px rgba(0,0,0,0.35);
    border-color: rgba(255,214,0,0.4) !important;
  }
  .why-round-image {
    width: 85px; height: 85px;
    background: linear-gradient(135deg, #FFD600 0%, #FFF9C4 100%);
    border-radius: 50%; overflow: hidden;
    display: flex; justify-content: center; align-items: center;
    border: 3px solid rgba(255,255,255,0.5);
    box-shadow: 0 6px 20px rgba(255,214,0,0.3);
  }
  .why-p { color: rgba(255,255,255,0.85) !important; max-height: 120px; line-height: 1.8; overflow: hidden; transition: max-height 0.4s ease; font-size: 14px; }
  .why-h5 { height: auto !important; overflow: visible !important; color: #ffffff !important; font-weight: 700; font-size: 17px; }
  .why-choose-card-body.expanded { max-height: none; }
  .why-choose-card-body.expanded .why-p { max-height: none; }
  .read-more, .read-less { cursor: pointer; font-size: 12px; font-weight: 700; color: #FFD600 !important; text-transform: uppercase; }
  .read-less { display: none; }

  /* ===== TESTIMONIAL ===== */
  .testimonial-container {
    margin-bottom: 6rem;
    background: linear-gradient(135deg, #f0f4ff 0%, #fce4ec 100%) !important;
    height: auto !important; padding-bottom: 60px;
  }
  .testimonial-content { display: flex; flex-direction: column; margin-top: 3rem; margin-bottom: 3rem; }
  .testimonial-content h2 {
    font-size: 48px; margin-top: 50px; font-weight: 800;
    background: linear-gradient(135deg, #1565C0 0%, #E91E8C 100%);
    -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
  }
  .testimonial-content p { margin-top: 10px; font-size: 17px; color: #6b7280; }
  .testimonial {
    height: auto !important;
    background: linear-gradient(135deg, #1565C0 0%, #0D47A1 100%) !important;
    border-radius: 20px; padding: 40px !important;
    box-shadow: 0 20px 60px rgba(0,0,0,0.15); min-height: 280px;
  }
  .testimonial-p { height: auto !important; line-height: 1.8; overflow: visible !important; color: rgba(255,255,255,0.9) !important; font-size: 15px; }
  .testimonial-item h4 { color: #FFD600 !important; font-weight: 700; }
  .testimonial-item h5 { color: #F48FB1 !important; font-weight: 500; font-size: 14px; }
  .marbot-30 { margin-bottom: 20px; }
  .profile-border-img { height: 380px !important; position: relative; }
  .profile-image-wrapper { position: absolute; top: 50%; left: 68%; transform: translate(-50%, -50%); width: 340px; height: 340px; }
  .profile-image { border-radius: 50%; width: 100%; height: 100%; object-fit: cover; border: 4px solid #E91E8C; }

  /* ===== DOWNLOAD ===== */
  .download-section {
    margin-bottom: 5rem; padding: 60px 40px;
    background: linear-gradient(135deg, #fff9c4 0%, #fce4ec 50%, #e3f2fd 100%);
    border-radius: 20px; margin-left: 20px; margin-right: 20px;
  }
  .mobile-section { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; padding-left: 30px; }
  .download-now {
    font-size: 48px !important; font-weight: 800;
    background: linear-gradient(135deg, #1565C0 0%, #E91E8C 100%);
    -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
    line-height: 1.2; margin-bottom: 15px;
  }
  .mobile_image img { filter: drop-shadow(0 20px 40px rgba(21,101,192,0.25)); transition: transform 0.4s ease; }
  .mobile_image img:hover { transform: translateY(-10px); }

  /* ===== FOOTER - FULLY VISIBLE TEXT ===== */
  .footer {
    background: #111827 !important;
    padding: 20px 0; width: 100%;
  }
  .footer-container { margin-top: 3rem; }
  .footer-bottom { margin-bottom: 3rem; }
  .footer a { text-decoration: none; transition: color 0.3s ease; }
  .footer a:hover { color: #FFD600 !important; }
  .footer-content { color: #d1d5db !important; }
  .footer-heading { font-size: 16px; margin-bottom: 1.2rem; color: #FFD600 !important; font-weight: 700; }
  .footer-link { font-size: 14px; line-height: 2.2; color: #d1d5db !important; }
  .footer p, .footer span, .footer li, .footer address { color: #d1d5db !important; }
  .footer h1, .footer h2, .footer h3, .footer h4, .footer h5, .footer h6 { color: #FFD600 !important; }
  .footer .social-icons a { margin: 0 10px; font-size: 22px; color: #d1d5db !important; }
  .footer .social-icons a:hover { color: #E91E8C !important; }
  .footer .divider { border-top: 1px solid rgba(255,255,255,0.15); margin: 20px 0; }
  .terms-condition { font-size: 13px; font-weight: 600; color: #d1d5db !important; }
  .logo-name { font-weight: 800; color: #FFD600 !important; font-size: 18px; }
  .copyright { font-size: 13px; color: #9ca3af !important; }
  .hover-stop { color: #d1d5db !important; }

  /* PAGES */
  .pages { margin-top: 4rem; }
  .pages p { font-size: 14px; }

  /* TERMS & PRIVACY */
  .terms-service, .privacy-policy { margin-top: 2rem; }
  .terms-service p, .privacy-policy p, .terms-service ul li, .privacy-policy ul li { color: rgb(83,83,83) !important; font-size: 15px; }

  /* ===== MEDIA QUERIES ===== */
  @media (min-width: 1200px) { .nav-container { margin-left: 40px !important; margin-right: 40px !important; } }

  @media (max-width: 992px) {
    .bg-image { height: 600px !important; }
    .content { top: 50% !important; left: 5% !important; max-width: 90% !important; }
    .bg-text { font-size: 38px !important; }
    .web-icon-img { width: 130px !important; }
    .navbar-collapse { margin-top: 10px; }
  }

  @media (max-width: 768px) {
    .our-mission { margin-top: 2rem !important; }
    .text-gradient-border { font-size: 32px !important; }
    .mobile_image { margin-top: 3rem !important; }
    .testimonial-image-div { display: none !important; }
    .bg-text { font-size: 28px !important; width: 100% !important; }
    .content { padding: 25px !important; }
    .testimonial-container { margin-bottom: 3rem !important; }
    .mobile-section { align-items: center !important; padding-left: 0 !important; text-align: center; }
    .download-section { margin-left: 10px !important; margin-right: 10px !important; padding: 35px 20px !important; }
    .why-choose-section { padding: 50px 0; }
    .why-choose-content { padding: 0 15px !important; }
    .why-choose-content h2 { font-size: 30px !important; }
    .why-choose-card { max-width: 100% !important; }
    .copyright { margin-top: 15px !important; }
    .testimonial-content { margin-top: 0 !important; }
    .download-now { font-size: 30px !important; }
  }

  @media only screen and (min-width: 768px) and (max-width: 992px) {
    .profile-image-wrapper { top: 50% !important; left: 51% !important; width: 200px !important; height: 200px !important; }
    .profile-border-img { height: 225px !important; }
  }

  @media only screen and (min-width: 992px) and (max-width: 1200px) {
    .profile-image-wrapper { left: 55% !important; }
    .content { top: 50% !important; left: 5% !important; }
  }

  @media only screen and (min-width: 1200px) and (max-width: 1400px) {
    .profile-image-wrapper { left: 63% !important; }
  }

  @media (min-width: 768px) { .footer-container { padding-left: 50px !important; padding-right: 50px !important; } }
  @media (min-width: 992px) { .footer-container { padding-left: 100px !important; padding-right: 100px !important; } }
  @media (min-width: 1300px) {
    .footer-container { padding-left: 200px !important; padding-right: 200px !important; }
    .social-icons { text-align: center; }
  }