:root {
      --saffron: #E8621A;
      --saffron-light: #F5A25C;
      --saffron-dark: #B84A0E;
      --saffron-pale: #E6C4B5;
      --indigo: #1E2D6B;
      --indigo-mid: #2E4299;
      --indigo-light: #4A5EAB;
      --indigo-pale: #EEF1FA;
      --gold: #C9920A;
      --gold-light: #F0C040;
      --gold-pale: #FDF5DC;
      --cream: #FFFBF3;
      --green: #2D6B3C;
      --green-light: #4A9960;
      --text-dark: #1A1208;
      --text-mid: #3D2E14;
      --text-light: #7A6548;
      --border: rgba(200, 146, 10, 0.2);
    }

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

    body {
      font-family: 'DM Sans', sans-serif;
      background-color: var(--cream);
      color: var(--text-dark);
      overflow-x: hidden;
    }

    h1, h2, h3, h4, h5 {
      font-family: 'Eczar', serif;
    }

    /* ── TOPBAR ── */
    .topbar {
      background-color: var(--indigo);
      padding: 8px 0;
    }
    .topbar-inner {
      max-width: 1200px;
      margin: 0 auto;
      padding: 0 24px;
      display: flex;
      align-items: center;
      justify-content: space-between;
    }
    .topbar-contact a {
      color: rgba(255,255,255,0.85);
      text-decoration: none;
      font-size: 12.5px;
      margin-right: 20px;
      transition: color 0.2s;
    }
    .topbar-contact a:hover { color: var(--gold-light); }
    .topbar-contact i { margin-right: 5px; }
    .topbar-social a {
      color: rgba(255,255,255,0.75);
      font-size: 14px;
      margin-left: 14px;
      transition: color 0.2s;
    }
    .topbar-social a:hover { color: var(--gold-light); }

    /* ── HEADER ── */
    header {
      background: linear-gradient(135deg, var(--indigo) 0%, var(--indigo-mid) 60%, #3A1C6E 100%);
      padding: 0;
      position: sticky;
      top: 0;
      z-index: 1000;
      box-shadow: 0 4px 20px rgba(0,0,0,0.3);
    }
    .header-inner {
      max-width: 1200px;
      margin: 0 auto;
      padding: 14px 24px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 20px;
    }
    .logo {
      display: flex;
      align-items: center;
      gap: 12px;
      text-decoration: none;
    }
    .logo-icon {
      width: 48px;
      height: 48px;
      background: var(--gold-light);
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 22px;
      color: var(--indigo);
    }
    .logo-text h1 {
      font-size: 22px;
      font-weight: 800;
      color: #fff;
      letter-spacing: -0.3px;
      line-height: 1.1;
    }
    .logo-text span {
      font-size: 11px;
      color: var(--gold-light);
      font-family: 'DM Sans', sans-serif;
      font-weight: 400;
      letter-spacing: 1.5px;
      text-transform: uppercase;
    }

    nav ul {
      list-style: none;
      display: flex;
      align-items: center;
      gap: 4px;
    }
    nav ul li a {
      color: rgba(255,255,255,0.85);
      text-decoration: none;
      font-size: 13.5px;
      font-weight: 400;
      padding: 8px 14px;
      border-radius: 8px;
      transition: all 0.2s;
      display: flex;
      align-items: center;
      gap: 6px;
    }
    nav ul li a:hover {
      background: rgba(255,255,255,0.12);
      color: #fff;
    }
    nav ul li a i { font-size: 13px; }

    .dropdown { position: relative; }
    .dropdown-menu {
      display: none;
      position: absolute;
      top: calc(100% + 8px);
      left: 0;
      background: #fff;
      border-radius: 12px;
      box-shadow: 0 20px 60px rgba(0,0,0,0.15);
      min-width: 200px;
      overflow: hidden;
      border: 1px solid var(--border);
    }
    .dropdown:hover .dropdown-menu { display: block; }
    .dropdown-menu a {
      color: var(--text-dark) !important;
      padding: 10px 18px !important;
      border-radius: 0 !important;
      font-size: 13.5px !important;
      border-bottom: 1px solid rgba(0,0,0,0.05);
      display: flex;
      align-items: center;
      gap: 10px;
    }
    .dropdown-menu a:hover {
      background: var(--indigo-pale) !important;
      color: var(--indigo) !important;
    }

    .bajar-btn {
      background: linear-gradient(135deg, var(--saffron), var(--saffron-dark));
      color: #fff !important;
      border-radius: 10px !important;
      padding: 10px 20px !important;
      font-weight: 500 !important;
      font-size: 14px !important;
      border: none;
      box-shadow: 0 4px 14px rgba(232,98,26,0.4);
      display: flex;
      align-items: center;
      gap: 8px;
      text-decoration: none;
      transition: all 0.25s;
    }
    .bajar-btn:hover {
      transform: translateY(-1px);
      box-shadow: 0 6px 20px rgba(232,98,26,0.5);
    }

    /* ── HERO ── */
    .hero {
      background: linear-gradient(160deg, var(--indigo) 0%, #2A1B5C 40%, #1A3A5C 100%);
      min-height: 560px;
      display: flex;
      align-items: center;
      position: relative;
      overflow: hidden;
      padding: 60px 0 80px;
    }
    .hero::before {
      content: '';
      position: absolute;
      width: 700px;
      height: 700px;
      border-radius: 50%;
      background: radial-gradient(circle, rgba(201,146,10,0.08) 0%, transparent 70%);
      right: -200px;
      top: -200px;
      pointer-events: none;
    }
    .hero::after {
      content: '';
      position: absolute;
      inset: 0;
      background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.02'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
      pointer-events: none;
    }
    .hero-inner {
      max-width: 1200px;
      margin: 0 auto;
      padding: 0 24px;
      display: grid;
      grid-template-columns: 1fr 1fr;
      align-items: center;
      gap: 60px;
      position: relative;
      z-index: 1;
    }
    .hero-badge {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      background: rgba(201,146,10,0.15);
      border: 1px solid rgba(201,146,10,0.3);
      color: var(--gold-light);
      font-size: 12px;
      letter-spacing: 2px;
      text-transform: uppercase;
      padding: 6px 14px;
      border-radius: 50px;
      margin-bottom: 20px;
      font-family: 'DM Sans', sans-serif;
    }
    .hero-badge span { width: 6px; height: 6px; background: var(--gold-light); border-radius: 50%; display: block; }
    .hero h2 {
      font-size: 48px;
      font-weight: 800;
      color: #fff;
      line-height: 1.15;
      margin-bottom: 16px;
    }
    .hero h2 em {
      font-style: normal;
      color: var(--gold-light);
    }
    .hero p {
      font-size: 16px;
      color: rgba(255,255,255,0.7);
      line-height: 1.75;
      margin-bottom: 32px;
    }
    .hero-cta {
      display: flex;
      gap: 14px;
      flex-wrap: wrap;
    }
    .btn-primary-hero {
      background: linear-gradient(135deg, var(--saffron), var(--saffron-dark));
      color: #fff;
      padding: 14px 28px;
      border-radius: 12px;
      text-decoration: none;
      font-weight: 500;
      font-size: 15px;
      display: flex;
      align-items: center;
      gap: 10px;
      box-shadow: 0 8px 24px rgba(232,98,26,0.45);
      transition: all 0.25s;
      border: none;
      cursor: pointer;
    }
    .btn-primary-hero:hover { transform: translateY(-2px); box-shadow: 0 12px 32px rgba(232,98,26,0.55); color: #fff; text-decoration: none; }
    .btn-secondary-hero {
      background: rgba(255,255,255,0.1);
      color: #fff;
      padding: 14px 28px;
      border-radius: 12px;
      text-decoration: none;
      font-weight: 400;
      font-size: 15px;
      display: flex;
      align-items: center;
      gap: 10px;
      border: 1px solid rgba(255,255,255,0.2);
      transition: all 0.25s;
    }
   
  .btn-secondary-hero:hover { transform: translateY(-2px); box-shadow: 0 12px 32px rgba(232,98,26,0.55); color: #fff; text-decoration: none; }
    .hero-img-wrap {
      position: relative;
    }
    .hero-img-wrap img {
      width: 100%;
      max-width: 480px;
      border-radius: 20px;
      display: block;
      margin: 0 auto;
      filter: drop-shadow(0 20px 60px rgba(0,0,0,0.4));
    }

    /* ── QUICK LINKS (Marquee Scroll) ── */
    .quick-links {
      background: #fff;
      border-bottom: 1px solid var(--border);
      overflow: hidden;
      padding: 0;
    }
    .quick-links-track-wrap {
      display: flex;
      width: 100%;
      overflow: hidden;
    }
    .quick-links-track {
      display: flex;
      animation: scrollQuickLinks 22s linear infinite;
      width: max-content;
    }
    .quick-links-track:hover { animation-play-state: paused; }
    @keyframes scrollQuickLinks {
      0%   { transform: translateX(0); }
      100% { transform: translateX(-50%); }
    }
    .quick-link-item {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 10px;
      padding: 20px 28px;
      text-decoration: none;
      transition: all 0.2s;
      border-bottom: 3px solid transparent;
      flex-shrink: 0;
      white-space: nowrap;
    }
    .quick-link-item:hover {
      border-bottom-color: var(--saffron);
      background: var(--saffron-pale);
    }
    .quick-link-icon {
      width: 52px;
      height: 52px;
      border-radius: 14px;
      background: var(--indigo-pale);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 22px;
      color: var(--indigo);
      transition: all 0.2s;
    }
    .quick-link-item:hover .quick-link-icon {
      background: var(--saffron);
      color: #fff;
    }
    .quick-link-label {
      font-size: 13px;
      font-weight: 500;
      color: var(--text-dark);
      font-family: 'Eczar', serif;
      text-align: center;
    }

    /* ── SECTION COMMONS ── */
    section { padding: 72px 0; }
    .section-inner { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
    .section-label {
      font-size: 11px;
      letter-spacing: 3px;
      text-transform: uppercase;
      color: var(--saffron);
      font-weight: 500;
      margin-bottom: 10px;
    }
    .section-title {
      font-size: 36px;
      font-weight: 800;
      color: var(--indigo);
      margin-bottom: 14px;
    }
    .section-subtitle {
      font-size: 16px;
      color: var(--text-light);
      line-height: 1.7;
      max-width: 600px;
    }
    .section-header { margin-bottom: 48px; }

/* ── CTA BANNER ── */
/* ── PREMIUM CTA BANNER ── */
.cta-banner {
  background:
    radial-gradient(
      circle at 15% 50%,
      rgba(240, 192, 64, 0.16) 0%,
      transparent 40%
    ),
    radial-gradient(
      circle at 90% 20%,
      rgba(120, 90, 200, 0.20) 0%,
      transparent 45%
    ),
    linear-gradient(
      135deg,
      #101A46 0%,
      #18275F 35%,
      #29205F 70%,
      #3A1C6E 100%
    );

  padding: 50px 24px;

  max-width: 1200px;
  margin: 0 auto;

  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;

  padding: 25px 20px;

  align-items: center;

  position: relative;
  overflow: hidden;
}

.swadeshi-quote-card {
  width: 100%;
  max-width: 520px;
  margin: 0 auto;

  background: rgba(255, 255, 255, 0.08);

  border: 1px solid rgba(240, 192, 64, 0.35);

  border-radius: 18px;

  padding: 26px;

  color: #fff;

  box-shadow:
    0 15px 40px rgba(0, 0, 0, 0.25),
    inset 0 1px 0 rgba(255, 255, 255, 0.12);

  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

/* Quote Header */
.swadeshi-quote-header {
  color: #F0C040;
  font-family: 'Eczar', serif;
  font-size: 20px;
  font-weight: 700;

  display: flex;
  align-items: center;
  justify-content: center;

  gap: 8px;
  margin-bottom: 20px;
}
.swadeshi-flag {
  font-size: 24px;
}


/* Quote Text */
.swadeshi-quote-body {
  color: #F8F7FF;
  font-family: 'Eczar', serif;
  font-size: 14px;
  line-height: 1.8;
  text-align: center;
  text-shadow: 0 1px 3px rgba(0,0,0,0.25);
}


/* Quote Date */
.swadeshi-quote-footer {
  text-align: center;

  margin-top: 20px;
  padding-top: 14px;

  border-top: 1px solid rgba(255,255,255,0.20);
}

.swadeshi-date {
  font-size: 10px;
  color: white;
  background: #7D0F43;
  padding: 4px;
  bor
}


/* RIGHT - PARICHAY */
.cta-banner-inner {
  width: 100%;
  max-width: 520px;
  margin: 0 auto;
  text-align: center;
  padding: 10px 0;
}



/* Play + परिचय */
.cta-play-wrap {
  display: flex;
  align-items: center;
  justify-content: center;

  gap: 20px;

  margin-bottom: 24px;
}

.cta-play-btn {
  width: 64px;
  height: 64px;

  border-radius: 50%;

  background: rgba(255,255,255,0.2);

  border: 2px solid rgba(255,255,255,0.5);

  display: flex;
  align-items: center;
  justify-content: center;

  cursor: pointer;

  transition: all 0.2s;

  text-decoration: none;
}

.cta-play-btn:hover {
  background: rgba(255,255,255,0.35);
}

.cta-play-btn i {
  color: #fff;
  font-size: 24px;
  margin-left: 4px;
}


.cta-banner h3 {
  color: #F0C040;

  font-size: 30px;
  font-weight: 800;

  margin-bottom: 14px;

  text-shadow: 0 2px 8px rgba(0,0,0,0.25);
}

.cta-banner-inner p {
  font-size: 16px;
  color: rgba(255,255,255,0.92);
  line-height: 1.8;
  font-style: italic;
}

.cta-attribution {
  margin-top: 12px;

  font-size: 13.5px;

  color: rgba(255,255,255,0.75);

  font-family: 'DM Sans', sans-serif;
}

    /* ── SERVICES ── */
    .services { background: var(--cream); }
    .services-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 24px;
    }
    .service-card {
      background: #fff;
      border-radius: 18px;
      padding: 28px 24px;
      border: 1px solid var(--border);
      transition: all 0.3s;
      position: relative;
      overflow: hidden;
    }
    .service-card::before {
      content: '';
      position: absolute;
      top: 0; left: 0; right: 0;
      height: 4px;
      background: linear-gradient(90deg, var(--saffron), var(--gold));
      opacity: 0;
      transition: opacity 0.3s;
    }
    .service-card:hover {
      transform: translateY(-4px);
      box-shadow: 0 16px 48px rgba(30,45,107,0.1);
      border-color: rgba(232,98,26,0.3);
    }
    .service-card:hover::before { opacity: 1; }
    .service-card-icon {
      width: 56px;
      height: 56px;
      border-radius: 14px;
      background: var(--saffron-pale);
      display: flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 18px;
    }
    .service-card-icon img { width: 30px; height: 30px; }
    .service-card h3 {
      font-size: 18px;
      font-weight: 700;
      color: var(--indigo);
      margin-bottom: 10px;
    }
    .service-card p {
      font-size: 14px;
      color: var(--text-light);
      line-height: 1.7;
      margin-bottom: 18px;
      display: -webkit-box;
      -webkit-line-clamp: 4;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }
    .readmore-link {
      font-size: 13.5px;
      font-weight: 500;
      color: var(--saffron);
      text-decoration: none;
      display: flex;
      align-items: center;
      gap: 6px;
      transition: gap 0.2s;
    }
    .readmore-link:hover { gap: 10px; color: var(--saffron-dark); text-decoration: none; }
    
    .box-links{
         color: var(--saffron);
      text-decoration: none;
    }

    /* ── TESTIMONIALS ── */
    .testimonials { background: var(--indigo); padding: 72px 0; }
    .testimonials-ticker-wrap {
      overflow: hidden;
      background: rgba(255,255,255,0.06);
      border: 1px solid rgba(255,255,255,0.1);
      border-radius: 12px;
      margin-bottom: 48px;
      padding: 14px 0;
    }
    .testimonials-ticker {
      display: flex;
      width: max-content;
      animation: tickerScroll 30s linear infinite;
    }
    .testimonials-ticker:hover { animation-play-state: paused; }
    @keyframes tickerScroll {
      0%   { transform: translateX(0); }
      100% { transform: translateX(-50%); }
    }
    .ticker-item {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 0 40px;
      white-space: nowrap;
      border-right: 1px solid rgba(255,255,255,0.1);
      flex-shrink: 0;
    }
    .ticker-item .ticker-dot {
      width: 6px; height: 6px;
      background: var(--gold-light);
      border-radius: 50%;
      flex-shrink: 0;
    }
    .ticker-item .ticker-text {
      font-size: 14px;
      color: rgba(255,255,255,0.8);
      font-style: italic;
    }
    .ticker-item .ticker-author {
      font-size: 12px;
      font-weight: 600;
      color: var(--gold-light);
      flex-shrink: 0;
    }
    .testimonials-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 24px;
    }
    .testimonial-card {
      background: rgba(255,255,255,0.06);
      border: 1px solid rgba(255,255,255,0.1);
      border-radius: 18px;
      padding: 28px 24px;
      transition: all 0.3s;
    }
    .testimonial-card:hover {
      background: rgba(255,255,255,0.1);
      transform: translateY(-4px);
    }
    .testimonial-head {
      display: flex;
      align-items: center;
      gap: 14px;
      margin-bottom: 18px;
    }
    .testimonial-head img {
      width: 52px;
      height: 52px;
      border-radius: 50%;
      object-fit: cover;
      border: 2px solid rgba(240,192,64,0.5);
    }
    .testimonial-head h3 {
      font-size: 16px;
      font-weight: 700;
      color: #fff;
      margin-bottom: 2px;
    }
    .testimonial-head span {
      font-size: 12px;
      color: var(--gold-light);
    }
    .testimonial-quote {
      font-size: 14.5px;
      color: rgba(255,255,255,0.75);
      line-height: 1.75;
      font-style: italic;
    }
    .quote-mark {
      font-size: 36px;
      color: var(--gold-light);
      opacity: 0.4;
      line-height: 1;
      margin-bottom: 8px;
      font-family: 'Eczar', serif;
    }
    .testimonial-stars {
      margin-top: 14px;
      color: var(--gold-light);
      font-size: 12px;
      letter-spacing: 2px;
    }

    /* ── PORTFOLIO ── */
    .portfolio { background: #fff; }
    .portfolio-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 24px;
    }
    .portfolio-card {
      border-radius: 16px;
      overflow: hidden;
      border: 1px solid var(--border);
      transition: all 0.3s;
      text-decoration: none;
      display: block;
    }
    .portfolio-card:hover {
      transform: translateY(-6px);
      box-shadow: 0 20px 50px rgba(30,45,107,0.12);
    }
    .portfolio-card-img {
      aspect-ratio: 4/3;
      overflow: hidden;
    }
    .portfolio-card-img img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: transform 0.5s;
    }
    .portfolio-card:hover .portfolio-card-img img { transform: scale(1.08); }
    .portfolio-card-body {
      padding: 18px 20px;
      background: #fff;
    }
    .portfolio-card-body .tag {
      font-size: 11px;
      letter-spacing: 2px;
      text-transform: uppercase;
      color: var(--saffron);
      font-weight: 600;
      margin-bottom: 6px;
    }
    .portfolio-card-body h4 {
      font-size: 16px;
      font-weight: 700;
      color: var(--indigo);
      margin-bottom: 6px;
    }
    .portfolio-card-body p {
      font-size: 13px;
      color: var(--text-light);
    }

    /* ── FAQ ── */
    .faq { background: var(--gold-pale); }
    .faq-layout {
      display: grid;
      grid-template-columns: 340px 1fr;
      gap: 60px;
      align-items: start;
    }
    .faq-side h3 {
      font-size: 28px;
      font-weight: 800;
      color: var(--indigo);
      margin-bottom: 14px;
    }
    .faq-side p {
      font-size: 15px;
      color: var(--text-light);
      line-height: 1.75;
      font-style: italic;
    }
    .faq-decoration {
      width: 60px;
      height: 4px;
      background: linear-gradient(90deg, var(--saffron), var(--gold));
      border-radius: 2px;
      margin-bottom: 20px;
    }
    .accordion-item {
      background: #fff;
      border: 1px solid var(--border);
      border-radius: 12px;
      margin-bottom: 12px;
      overflow: hidden;
    }
    .accordion-btn {
      width: 100%;
      background: none;
      border: none;
      padding: 18px 20px;
      text-align: left;
      cursor: pointer;
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 12px;
      font-family: 'Eczar', serif;
      font-size: 15.5px;
      font-weight: 600;
      color: var(--indigo);
      transition: all 0.2s;
    }
    .accordion-btn:hover { background: var(--indigo-pale); }
    .accordion-btn .num {
      color: var(--saffron);
      font-weight: 700;
      min-width: 24px;
    }
    .accordion-btn i {
      color: var(--saffron);
      transition: transform 0.3s;
      flex-shrink: 0;
    }
    .accordion-btn.open i { transform: rotate(180deg); }
    .accordion-body {
      padding: 0 20px 18px 20px;
      font-size: 14.5px;
      color: var(--text-light);
      line-height: 1.8;
      display: none;
    }
    .accordion-body.open { display: block; }

    /* ── BLOG ── */
    .blog { background: var(--cream); }
    .blog-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 24px;
    }
    .blog-card {
      background: #fff;
      border-radius: 16px;
      overflow: hidden;
      border: 1px solid var(--border);
      text-decoration: none;
      display: block;
      transition: all 0.3s;
    }
    .blog-card:hover {
      transform: translateY(-4px);
      box-shadow: 0 16px 48px rgba(30,45,107,0.1);
    }
    .blog-card-img {
      aspect-ratio: 16/9;
      overflow: hidden;
      background: var(--indigo-pale);
    }
    .blog-card-img img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.4s; }
    .blog-card:hover .blog-card-img img { transform: scale(1.06); }
    .blog-card-body { padding: 20px; }
    .blog-card-cat {
      font-size: 11px;
      letter-spacing: 2px;
      text-transform: uppercase;
      color: var(--saffron);
      font-weight: 600;
      margin-bottom: 8px;
    }
    .blog-card-body h2 {
      font-size: 17px;
      font-weight: 700;
      color: var(--indigo);
      margin-bottom: 10px;
      line-height: 1.4;
    }
    .blog-card-body p {
      font-size: 13.5px;
      color: var(--text-light);
      line-height: 1.65;
      overflow: hidden;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
    }

    /* ── CONTACT ── */
    .contact { background: #fff; }
    .contact-layout {
      display: grid;
      grid-template-columns: 360px 1fr;
      gap: 60px;
      align-items: start;
    }
    .contact-info-card {
      background: linear-gradient(160deg, var(--indigo) 0%, var(--indigo-mid) 100%);
      border-radius: 20px;
      padding: 36px 30px;
    }
    .contact-info-card h3 {
      font-size: 24px;
      color: #fff;
      margin-bottom: 8px;
    }
    .contact-info-card > p {
      font-size: 14px;
      color: rgba(255,255,255,0.65);
      margin-bottom: 32px;
      line-height: 1.6;
    }
    .contact-info-item {
      display: flex;
      gap: 16px;
      align-items: flex-start;
      margin-bottom: 24px;
    }
    .contact-info-ico {
      width: 40px;
      height: 40px;
      border-radius: 10px;
      background: rgba(255,255,255,0.1);
      display: flex;
      align-items: center;
      justify-content: center;
      color: var(--gold-light);
      font-size: 16px;
      flex-shrink: 0;
    }
    .contact-info-item h4 {
      font-size: 12px;
      letter-spacing: 1px;
      text-transform: uppercase;
      color: rgba(255,255,255,0.5);
      margin-bottom: 4px;
      font-family: 'DM Sans', sans-serif;
      font-weight: 400;
    }
    .contact-info-item p {
      font-size: 14.5px;
      color: #fff;
    }
    .contact-social {
      margin-top: 32px;
      display: flex;
      gap: 10px;
    }
    .contact-social a {
      width: 36px;
      height: 36px;
      border-radius: 8px;
      background: rgba(255,255,255,0.1);
      display: flex;
      align-items: center;
      justify-content: center;
      color: rgba(255,255,255,0.7);
      font-size: 15px;
      text-decoration: none;
      transition: all 0.2s;
    }
    .contact-social a:hover { background: var(--saffron); color: #fff; }

    .contact-form { background: var(--cream); border-radius: 20px; padding: 36px 32px; }
    .form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-bottom: 18px; }
    .form-group { margin-bottom: 18px; }
    .form-group label {
      display: block;
      font-size: 13px;
      font-weight: 500;
      color: var(--text-mid);
      margin-bottom: 7px;
    }
    .form-control {
      width: 100%;
      padding: 12px 16px;
      border: 1.5px solid var(--border);
      border-radius: 10px;
      font-size: 14.5px;
      font-family: 'DM Sans', sans-serif;
      color: var(--text-dark);
      background: #fff;
      outline: none;
      transition: border-color 0.2s;
    }
    .form-control:focus { border-color: var(--indigo-light); }
    textarea.form-control { resize: vertical; min-height: 120px; }
    .form-submit {
      background: linear-gradient(135deg, var(--indigo), var(--indigo-mid));
      color: #fff;
      border: none;
      padding: 14px 36px;
      border-radius: 12px;
      font-size: 15px;
      font-weight: 500;
      cursor: pointer;
      transition: all 0.25s;
      display: flex;
      align-items: center;
      gap: 10px;
    }
    .form-submit:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(30,45,107,0.3); }

    /* ── STATS ── */
    .stats { background: var(--indigo-pale); padding: 56px 0; }
    .stats-inner {
      max-width: 1200px; margin: 0 auto; padding: 0 24px;
      display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center;
    }
    .stats-img img { width: 100%; max-width: 440px; display: block; }
    .stat-item {
      display: flex;
      align-items: center;
      gap: 16px;
      padding: 20px;
      background: #fff;
      border-radius: 14px;
      margin-bottom: 14px;
      border: 1px solid var(--border);
    }
    .stat-num {
      font-size: 28px;
      font-weight: 800;
      color: var(--indigo);
      font-family: 'Eczar', serif;
      min-width: 120px;
    }
    .stat-label { font-size: 14px; color: var(--text-light); font-weight: 400; }
    .stat-label strong { display: block; font-size: 15px; color: var(--text-dark); font-weight: 500; }

    /* ── BOTTOM NAV ── */
    .bottom-nav {
      display: flex;
      position: fixed;
      bottom: 0;
      left: 0;
      right: 0;
      background: var(--indigo);
      border-top: 1px solid rgba(255,255,255,0.12);
      z-index: 999;
      padding: 8px 0 env(safe-area-inset-bottom, 8px);
      justify-content: space-around;
      box-shadow: 0 -4px 20px rgba(0,0,0,0.2);
    }
    .bottom-nav a {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 4px;
      color: rgba(255,255,255,0.6);
      text-decoration: none;
      font-size: 11px;
      font-weight: 500;
      padding: 6px 16px;
      border-radius: 10px;
      transition: all 0.2s;
      min-width: 60px;
    }
    .bottom-nav a:hover,
    .bottom-nav a.active {
      color: var(--gold-light);
      background: rgba(255,255,255,0.08);
    }
    .bottom-nav a i { font-size: 20px; }

    /* ── FAB SEARCH BUTTON ── */
    .fab-search {
      position: fixed;
      bottom: 72px;
      right: 20px;
      z-index: 1000;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 6px;
    }
    .fab-search-btn {
      width: 52px;
      height: 52px;
      border-radius: 50%;
      background: linear-gradient(135deg, var(--saffron), var(--saffron-dark));
      color: #fff;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      text-decoration: none;
      box-shadow: 0 6px 20px rgba(232,98,26,0.5);
      transition: all 0.25s;
      border: 2px solid rgba(255,255,255,0.2);
      gap: 2px;
    }
    .fab-search-btn:hover {
      transform: scale(1.1);
      box-shadow: 0 10px 28px rgba(232,98,26,0.6);
      color: #fff;
    }
    .fab-search-btn i { font-size: 16px; }
    .fab-search-btn span { font-size: 8px;  letter-spacing: 0.5px; line-height: 1; }

    /* ── FOOTER ── */
    footer {
      background: linear-gradient(160deg, #12183A 0%, var(--indigo) 100%);
      padding: 64px 0 0;
    }
    .footer-inner {
      max-width: 1200px;
      margin: 0 auto;
      padding: 0 24px;
      display: grid;
      grid-template-columns: 2fr 1fr 1fr 1fr;
      gap: 40px;
      margin-bottom: 48px;
    }
    .footer-brand h2 {
      font-size: 22px;
      color: #fff;
      margin-bottom: 12px;
    }
    .footer-brand p {
      font-size: 14px;
      color: rgba(255,255,255,0.55);
      line-height: 1.75;
      margin-bottom: 24px;
    }
    .footer-social { display: flex; gap: 10px; }
    .footer-social a {
      width: 36px; height: 36px; border-radius: 8px;
      background: rgba(255,255,255,0.08);
      display: flex; align-items: center; justify-content: center;
      color: rgba(255,255,255,0.65); font-size: 15px;
      text-decoration: none; transition: all 0.2s;
    }
    .footer-social a:hover { background: var(--saffron); color: #fff; }
    .footer-col h3 {
      font-size: 14px;
      letter-spacing: 2px;
      text-transform: uppercase;
      color: var(--gold-light);
      font-family: 'DM Sans', sans-serif;
      font-weight: 500;
      margin-bottom: 20px;
    }
    .footer-col ul { list-style: none; }
    .footer-col ul li { margin-bottom: 10px; }
    .footer-col ul li a {
      color: rgba(255,255,255,0.6);
      text-decoration: none;
      font-size: 14px;
      transition: color 0.2s;
      display: flex;
      align-items: center;
      gap: 8px;
    }
    .footer-col ul li a:hover { color: var(--gold-light); }
    .footer-col ul li a i { font-size: 12px; }
    .footer-bottom {
      border-top: 1px solid rgba(255,255,255,0.08);
      padding: 20px 24px;
      max-width: 1200px;
      margin: 0 auto;
      display: flex;
      justify-content: space-between;
      align-items: center;
    }
    .footer-bottom p { font-size: 13px; color: rgba(255,255,255,0.4); }
    .footer-bottom a { color: var(--gold-light); text-decoration: none; }

    /* ── SCROLL TOP ── */
    .scroll-top {
      position: fixed;
      bottom: 138px;
      right: 20px;
      width: 40px;
      height: 40px;
      background: var(--indigo);
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      color: #fff;
      font-size: 16px;
      text-decoration: none;
      box-shadow: 0 4px 14px rgba(30,45,107,0.35);
      transition: all 0.2s;
      z-index: 998;
      opacity: 0;
      pointer-events: none;
      border: 1px solid rgba(255,255,255,0.15);
    }
    .scroll-top:hover { background: var(--saffron); transform: translateY(-2px); color: #fff; }

    /* ── MOBILE NAV TOGGLE ── */
    .mobile-menu-toggle {
      display: none;
      background: none;
      border: none;
      color: #fff;
      font-size: 24px;
      cursor: pointer;
      padding: 6px;
      line-height: 1;
      z-index: 1100;
    }

    /* ── MOBILE DRAWER NAV ── */
    .mobile-nav-overlay {
      display: none;
      position: fixed;
      inset: 0;
      background: rgba(0,0,0,0.55);
      z-index: 1050;
    }
    .mobile-nav-overlay.open { display: block; }

    .mobile-nav-drawer {
      position: fixed;
      top: 0;
      right: -320px;
      width: 300px;
      height: 100%;
      background: linear-gradient(180deg, var(--indigo) 0%, #12183A 100%);
      z-index: 1060;
      transition: right 0.32s cubic-bezier(0.4,0,0.2,1);
      overflow-y: auto;
      padding: 0 0 32px;
    }
    .mobile-nav-drawer.open { right: 0; }

    .mobile-nav-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 18px 20px;
      border-bottom: 1px solid rgba(255,255,255,0.1);
      margin-bottom: 12px;
    }
    .mobile-nav-header span {
      font-family: 'Eczar', serif;
      font-size: 18px;
      font-weight: 700;
      color: #fff;
    }
    .mobile-nav-close {
      background: none;
      border: none;
      color: rgba(255,255,255,0.7);
      font-size: 22px;
      cursor: pointer;
      padding: 4px;
    }
    .mobile-nav-close:hover { color: #fff; }

    /* बाजार button in mobile drawer */
    .mobile-bajar-btn {
      display: flex;
      align-items: center;
      gap: 10px;
      margin: 0 16px 16px;
      background: linear-gradient(135deg, var(--saffron), var(--saffron-dark));
      color: #fff;
      padding: 13px 18px;
      border-radius: 12px;
      text-decoration: none;
      font-weight: 600;
      font-size: 15px;
      box-shadow: 0 4px 16px rgba(232,98,26,0.4);
    }
    .mobile-bajar-btn i { font-size: 16px; }

    .mobile-nav-links { list-style: none; padding: 0 8px; }
    .mobile-nav-links li { border-radius: 10px; overflow: hidden; }
    .mobile-nav-links > li > a {
      display: flex;
      align-items: center;
      gap: 12px;
      padding: 13px 16px;
      color: rgba(255,255,255,0.85);
      text-decoration: none;
      font-size: 15px;
      font-weight: 400;
      border-radius: 10px;
      transition: background 0.2s;
    }
    .mobile-nav-links > li > a:hover,
    .mobile-nav-links > li > a.active { background: rgba(255,255,255,0.1); color: #fff; }
    .mobile-nav-links > li > a i { width: 20px; text-align: center; color: var(--gold-light); }

    .mobile-dropdown-toggle {
      width: 100%;
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 13px 16px;
      color: rgba(255,255,255,0.85);
      background: none;
      border: none;
      cursor: pointer;
      font-size: 15px;
      border-radius: 10px;
      font-family: 'DM Sans', sans-serif;
    }
    .mobile-dropdown-toggle:hover { background: rgba(255,255,255,0.1); color: #fff; }
    .mobile-dropdown-toggle .left { display: flex; align-items: center; gap: 12px; }
    .mobile-dropdown-toggle .left i { width: 20px; text-align: center; color: var(--gold-light); }
    .mobile-dropdown-toggle .arrow { font-size: 12px; color: rgba(255,255,255,0.4); transition: transform 0.25s; }
    .mobile-dropdown-toggle.open .arrow { transform: rotate(180deg); }

    .mobile-sub-menu {
      display: none;
      list-style: none;
      padding: 4px 0 4px 16px;
    }
    .mobile-sub-menu.open { display: block; }
    .mobile-sub-menu a {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 10px 14px;
      color: rgba(255,255,255,0.65);
      text-decoration: none;
      font-size: 14px;
      border-radius: 8px;
      transition: all 0.2s;
    }
    .mobile-sub-menu a:hover { background: rgba(255,255,255,0.08); color: #fff; }
    .mobile-sub-menu a i { font-size: 13px; color: var(--saffron-light); }

    /* ── ICON BOXES ── */
    .icon-boxes-section {
      background: #fff;
      padding: 0;
      margin-top: -1px;
    }
    .icon-boxes-inner {
      max-width: 1200px;
      margin: 0 auto;
      padding: 0 24px 0;
    }
    .icon-boxes-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 0;
      margin-top: -40px;
      position: relative;
      z-index: 10;
    }
    .icon-box-card {
      background: #fff;
      border: 1px solid var(--border);
      padding: 28px 20px 24px;
      text-align: center;
      text-decoration: none;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 14px;
      transition: all 0.3s;
      position: relative;
    }
    .icon-box-card:first-child { border-radius: 16px 0 0 16px; }
    .icon-box-card:last-child { border-radius: 0 16px 16px 0; }
    .icon-box-card:not(:first-child) { border-left: none; }
    .icon-box-card:hover {
      background: var(--indigo);
      border-color: var(--indigo);
      transform: translateY(-6px);
      box-shadow: 0 16px 40px rgba(30,45,107,0.2);
      z-index: 2;
    }
    .icon-box-card:hover .icon-box-title { color: #fff; }
    .icon-box-img {
      width: 64px;
      height: 64px;
      object-fit: contain;
      transition: transform 0.3s;
    }
    .icon-box-card:hover .icon-box-img { transform: scale(1.1); filter: brightness(0) invert(1); }
    .icon-box-title {
      font-family: 'Eczar', serif;
      font-size: 16px;
      font-weight: 700;
      color: var(--indigo);
      transition: color 0.3s;
    }

    /* ── RESPONSIVE ── */
    @media (max-width: 1024px) {
      .services-grid, .portfolio-grid, .blog-grid { grid-template-columns: repeat(2, 1fr); }
      .testimonials-grid { grid-template-columns: repeat(2, 1fr); }
      .icon-boxes-grid { grid-template-columns: repeat(2, 1fr); gap: 16px; margin-top: -20px; }
      .icon-box-card:first-child,
      .icon-box-card:last-child { border-radius: 12px; }
      .icon-box-card:not(:first-child) { border-left: 1px solid var(--border); }
      .icon-box-card { border-radius: 12px; }
    }

    @media (max-width: 768px) {
      .hero-inner { grid-template-columns: 1fr; gap: 30px; text-align: center; }
      .hero h2 { font-size: 32px; }
      .hero-cta { justify-content: center; }
      .hero-img-wrap { order: -1; }
      .services-grid, .portfolio-grid, .blog-grid, .testimonials-grid { grid-template-columns: 1fr; }
      .faq-layout { grid-template-columns: 1fr; gap: 30px; }
      .contact-layout { grid-template-columns: 1fr; }
      .stats-inner { grid-template-columns: 1fr; }
      .footer-inner { grid-template-columns: 1fr 1fr; }
      .form-row { grid-template-columns: 1fr; }
      section { padding: 48px 0; }
      .topbar-social { display: none; }
      /* hide desktop nav & bajar btn in header on mobile */
      nav { display: none; }
     .bajar-btn{
    display: flex !important;
    padding: 8px 12px !important;
    font-size: 9px !important;
    gap: 5px;
  }

  .bajar-btn span{
    display: inline;
  }

  .header-inner{
    gap: 10px;
  }
      .mobile-menu-toggle { display: flex; align-items: center; }
      .icon-boxes-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; margin-top: -10px; padding-top: 20px; }
      .icon-box-card, .icon-box-card:first-child, .icon-box-card:last-child { border-radius: 14px; border: 1px solid var(--border); }
      .bottom-nav a { padding: 6px 10px; font-size: 10px; min-width: 50px; }
      .bottom-nav a i { font-size: 18px; }
    }

    @media (min-width: 769px) {
      .mobile-menu-toggle { display: none; }
    }

    @media (max-width: 480px) {
      .hero h2 { font-size: 28px; }
      .section-title { font-size: 28px; }
      .footer-inner { grid-template-columns: 1fr; }
      .icon-boxes-grid { grid-template-columns: repeat(2, 1fr); }
      .bottom-nav a span { display: none; }
      .bottom-nav a { min-width: 44px; }
    }

    /* Always pad body bottom for bottom-nav */
    body { padding-bottom: 60px; }

    /* Animate on scroll */
    .fade-up {
      opacity: 0;
      transform: translateY(24px);
      transition: opacity 0.6s ease, transform 0.6s ease;
    }
    .fade-up.visible {
      opacity: 1;
      transform: translateY(0);
    }
    
    .logo-icon2 img { max-height: 44px; margin-right: 8px; }
    
    
.fab-gurukul {
  position: fixed;
  bottom: 80px;
  left: 20px;
  z-index: 998;
  background: linear-gradient(135deg, #1B5E20, #2E7D32);
  color: white;
  border: none;
  border-radius: 50px;
  padding: 7px 15px;
  font-family: 'DM Sans', sans-serif;
  font-size: 11px;
  font-weight: 500;
  cursor: pointer;
  box-shadow: 0 4px 20px rgba(0,0,0,0.2);
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 8px;
  transition: transform 0.2s, box-shadow 0.2s;
  animation: pulse-green 3s infinite;
}
.fab-gurukul:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0,0,0,0.28);
  color: white;
}

/* ---------- Rajiv Dixit Video ZIP SEO CTA ---------- */

/* =========================================
   Rajiv Dixit Video ZIP Button
   ========================================= */

.rdx-zip-btn{
    position:relative;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;

    padding:10px 18px;

    background:linear-gradient(
        135deg,
        #d99a2b,
        #f2bd58
    );

    color:#2d1800;

    font-size:14px;
    font-weight:700;

    border:1px solid rgba(255,255,255,.65);
    border-radius:9px;

    text-decoration:none;

    box-shadow:
        0 5px 15px rgba(217,154,43,.35);

    overflow:hidden;

    transition:
        transform .2s ease,
        box-shadow .2s ease;
    
    animation:rdxZipPulse 2.8s infinite;
}


/* Download Icon */

.rdx-zip-btn svg{
    width:18px;
    height:18px;
    flex-shrink:0;
}


/* Shine Effect */

.rdx-zip-btn::before{
    content:"";
    position:absolute;

    top:0;
    left:-120%;

    width:70%;
    height:100%;

    background:linear-gradient(
        90deg,
        transparent,
        rgba(255,255,255,.65),
        transparent
    );

    transform:skewX(-20deg);

    animation:rdxZipShine 3.5s infinite;
}


/* Hover */

.rdx-zip-btn:hover{
    transform:translateY(-2px);

    box-shadow:
        0 8px 22px rgba(217,154,43,.50);

    color:#1f1100;
}


/* Note below button */

.rdx-zip-note{
    margin-top:6px;

    font-size:11px;

    color:rgba(255,255,255,.78);

    letter-spacing:.2px;
}


/* Pulse */

@keyframes rdxZipPulse{

    0%{
        box-shadow:
            0 5px 15px rgba(217,154,43,.30),
            0 0 0 0 rgba(217,154,43,.30);
    }

    50%{
        box-shadow:
            0 7px 20px rgba(217,154,43,.42),
            0 0 0 5px rgba(217,154,43,.07);
    }

    100%{
        box-shadow:
            0 5px 15px rgba(217,154,43,.30),
            0 0 0 0 rgba(217,154,43,0);
    }

}


/* Shine */

@keyframes rdxZipShine{

    0%{
        left:-120%;
    }

    35%{
        left:140%;
    }

    100%{
        left:140%;
    }

}


/* Mobile */

@media(max-width:600px){

    .rdx-zip-btn{
        padding:9px 15px;
        font-size:13px;
        border-radius:8px;
    }

    .rdx-zip-btn svg{
        width:17px;
        height:17px;
    }

    .rdx-zip-note{
        font-size:10px;
    }

}


/* =========================================
   COMMON LANGUAGE SELECTOR
   Google Translate + Custom UI
   ========================================= */
.site-language {
  position: relative;
  flex-shrink: 0;
}

.site-language-btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 40px;
  padding: 8px 12px;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 10px;
  background: rgba(255,255,255,.10);
  color: #fff;
  font-family: 'DM Sans', sans-serif;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: all .25s ease;
}

.site-language-btn:hover,
.site-language.open .site-language-btn {
  background: rgba(255,255,255,.18);
  border-color: rgba(240,192,64,.65);
  box-shadow: 0 5px 18px rgba(0,0,0,.15);
}

.site-language-btn .lang-globe {
  color: var(--gold-light);
  font-size: 15px;
}

.site-language-btn .lang-arrow {
  font-size: 10px;
  transition: transform .25s ease;
}

.site-language.open .lang-arrow {
  transform: rotate(180deg);
}

.site-language-menu {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  width: 185px;
  padding: 7px;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 13px;
  box-shadow: 0 18px 45px rgba(0,0,0,.20);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-6px);
  transition: all .2s ease;
  z-index: 1200;
}

.site-language.open .site-language-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.site-language-menu button {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 9px 10px;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: var(--text-dark);
  font-family: 'DM Sans', sans-serif;
  font-size: 13px;
  text-align: left;
  cursor: pointer;
  transition: all .18s ease;
}

.site-language-menu button:hover,
.site-language-menu button.active {
  background: var(--indigo-pale);
  color: var(--indigo);
}

.site-language-menu button .lang-flag {
  width: 22px;
  text-align: center;
  font-size: 15px;
}

/* Google Translate hidden helper - custom selector is used instead */
#google_translate_element {
  position: fixed !important;
  left: -10000px !important;
  top: 0 !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.goog-te-banner-frame.skiptranslate {
  display: none !important;
}

body { top: 0 !important; }

/* Mobile language selector */
.mobile-language-box {
  margin: 0 16px 14px;
  padding: 12px;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 13px;
  background: rgba(255,255,255,.055);
}

.mobile-language-title {
  display: flex;
  align-items: center;
  gap: 8px;
  color: rgba(255,255,255,.72);
  font-size: 12px;
  margin-bottom: 9px;
}

.mobile-language-title i {
  color: var(--gold-light);
}

.mobile-language-select {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 9px;
  background: rgba(255,255,255,.10);
  color: #fff;
  outline: none;
  font-family: 'DM Sans', sans-serif;
  font-size: 13px;
}

.mobile-language-select option {
  color: #111;
  background: #fff;
}
/* ── INDIAN FLAG ── */


@media (max-width: 768px) {
  .site-language { display: none; }
}

@media (min-width: 769px) {
  .mobile-language-box { display: none; }
}
.india-flag {
  width: 42px;
  height: 28px;
  display: inline-flex;
  flex-direction: column;
  overflow: hidden;
  border-radius: 2px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.25);
  vertical-align: middle;
}

.flag-saffron {
  height: 33.33%;
  background: #FF9933;
}

.flag-white {
  height: 33.33%;
  background: #FFFFFF;
  display: flex;
  align-items: center;
  justify-content: center;
}

.flag-green {
  height: 33.33%;
  background: #138808;
}

.ashoka-chakra {
  color: #000080;
  font-size: 17px;
  line-height: 1;
  font-family: Arial, sans-serif;
}

/* =========================================================
   COMPACT DAILY SWADESHI VISUAL
========================================================= */

/* =========================================================
   DAILY QUESTION - COMPACT VERSION
========================================================= */
.daily-visual-section {
  width: 100%;
  padding: 0;
}

.daily-visual-card {
  width: 100%;
  max-width: 600px;

  height: 300px;
  min-height: 300px;

  margin: 0 auto;

  padding: 13px 15px;

  box-sizing: border-box;

  background: #fff;

  border-radius: 15px;

  border: 1px solid rgba(201,146,10,0.22);

  box-shadow:
    0 8px 25px rgba(20,30,80,0.12);

  overflow: hidden;
}


/* =========================================================
   HEADER
========================================================= */

.daily-visual-heading {
  display: flex;
  align-items: center;

  gap: 9px;

  margin-bottom: 7px;
}

.daily-visual-icon {
  width: 34px;
  height: 34px;

  flex-shrink: 0;

  border-radius: 50%;

  background: #FFF1C7;

  display: flex;
  align-items: center;
  justify-content: center;

  color: #C47B00;

  font-size: 15px;
}

.daily-label {
  color: #1E2D6B;

  font-size: 10px;

  font-weight: 700;

  margin: 0;
}

.daily-visual-heading h2 {
  margin: 0;

  color: #B84A0E;

  font-family: 'Eczar', serif;

  font-size: 17px;

  line-height: 1.15;

  font-weight: 800;
}

.daily-visual-heading p {
  margin: 1px 0 0;

  color: #777;

  font-size: 9px;

  line-height: 1.25;
}


/* =========================================================
   CHART + LEGEND
========================================================= */

.daily-visual-content {
  display: grid;

  grid-template-columns: 145px 1fr;

  gap: 12px;

  align-items: center;

  height: 140px;
}


/* =========================================================
   DONUT
========================================================= */

.daily-chart-area {
  display: flex;

  align-items: center;
  justify-content: center;
}

.daily-donut {
  width: 135px;
  height: 135px;

  border-radius: 50%;

  display: flex;

  align-items: center;
  justify-content: center;

  position: relative;

  box-shadow:
    0 5px 15px rgba(30,45,107,0.10);
}


/* DONUT HOLE */

.daily-donut::after {
  content: "";

  position: absolute;

  width: 67px;
  height: 67px;

  border-radius: 50%;

  background: #fff;
}


/* CENTER */

.daily-donut-center {
  position: relative;

  z-index: 2;

  display: flex;

  flex-direction: column;

  align-items: center;
  justify-content: center;
}

.daily-donut-center span {
  color: #777;

  font-size: 8px;
}

.daily-donut-center strong {
  color: #1E2D6B;

  font-size: 20px;

  font-weight: 800;
}


/* =========================================================
   LEGEND
========================================================= */

.daily-legend {
  display: flex;

  flex-direction: column;

  gap: 0;
}

.daily-legend-item {
  display: flex;

  align-items: center;

  gap: 6px;

  padding: 3px 1px;

  border-bottom: 1px solid #eeeeee;
}

.daily-legend-color {
  width: 9px;
  height: 9px;

  border-radius: 50%;

  flex-shrink: 0;
}

.daily-legend-name {
  flex: 1;

  color: #1E2D6B;

  font-size: 10px;

  line-height: 1.15;
}

.daily-legend-value {
  color: #1E2D6B;

  font-size: 10px;

  font-weight: 800;

  white-space: nowrap;
}


/* =========================================================
   INFORMATION BOX
========================================================= */

.daily-info-box {
  display: flex;

  align-items: center;

  gap: 7px;

  margin-top: 7px;

  padding: 7px 9px;

  background: #FFF6D9;

  border-radius: 9px;

  border: 1px solid rgba(201,146,10,0.18);

  min-height: 35px;

  box-sizing: border-box;
}

.daily-info-icon {
  width: 23px;
  height: 23px;

  border-radius: 50%;

  flex-shrink: 0;

  background: #F4A900;

  color: #fff;

  display: flex;

  align-items: center;
  justify-content: center;

  font-size: 11px;
}

.daily-info-box strong {
  color: #A95D00;

  font-size: 16px;

  margin-right: 3px;
}

.daily-info-box span {
  color: #5F5038;

  font-size: 9px;

  line-height: 1.3;
}


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

.daily-visual-footer {
  display: flex;

  justify-content: space-between;

  align-items: center;

  margin-top: 5px;

  gap: 5px;
}

.daily-update {
  display: flex;

  align-items: center;

  gap: 4px;

  color: #1E4B96;

  background: #EAF1FF;

  border-radius: 20px;

  padding: 4px 7px;

  font-size: 8px;
}

.daily-update i {
  font-size: 9px;
}

.daily-date {
  color: #777;

  font-size: 8px;
}


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

@media (max-width: 768px) {

  .daily-visual-card {
    height: 270px;
    min-height: 270px;

    padding: 10px 9px;

    border-radius: 12px;

    box-sizing: border-box;

    overflow: hidden;
  }


  /* =========================================
     HEADER
  ========================================= */

  .daily-visual-heading {
    gap: 6px;

    margin-bottom: 4px;

    align-items: center;
  }

  .daily-visual-icon {
    width: 29px;
    height: 29px;

    font-size: 11px;
  }

  .daily-label {
    font-size: 8px;

    line-height: 1;
  }

  .daily-visual-heading h2 {
    font-size: 13px;

    line-height: 1.15;

    margin: 0;
  }

  .daily-visual-heading p {
    font-size: 8px;

    line-height: 1.15;

    margin: 1px 0 0;
  }


  /* =========================================
     CHART + LEGEND
  ========================================= */

  .daily-visual-content {
    display: grid;

    grid-template-columns: 110px 1fr;

    gap: 8px;

    height: 112px;

    align-items: center;

    margin-top: 1px;
  }


  /* =========================================
     DONUT
  ========================================= */

  .daily-chart-area {
    display: flex;

    align-items: center;
    justify-content: center;
  }

  .daily-donut {
    width: 105px;
    height: 105px;

    flex-shrink: 0;
  }

  .daily-donut::after {
    width: 52px;
    height: 52px;
  }

  .daily-donut-center span {
    font-size: 7px;

    line-height: 1;
  }

  .daily-donut-center strong {
    font-size: 16px;

    line-height: 1.1;
  }


  /* =========================================
     LEGEND
  ========================================= */

  .daily-legend {
    gap: 0;

    width: 100%;
  }

  .daily-legend-item {
    gap: 4px;

    padding: 3px 0;

    min-height: 17px;

    box-sizing: border-box;
  }

  .daily-legend-color {
    width: 7px;
    height: 7px;

    flex-shrink: 0;
  }

  .daily-legend-name {
    font-size: 8.5px;

    line-height: 1.1;

    white-space: nowrap;

    overflow: hidden;

    text-overflow: ellipsis;
  }

  .daily-legend-value {
    font-size: 8.5px;

    line-height: 1;

    white-space: nowrap;
  }


  /* =========================================
     INFORMATION BOX
  ========================================= */

  .daily-info-box {
    display: flex;

    align-items: center;

    gap: 6px;

    margin-top: 6px;

    padding: 6px 7px;

    min-height: 34px;

    max-height: 38px;

    box-sizing: border-box;

    overflow: hidden;
  }

  .daily-info-icon {
    width: 21px;
    height: 21px;

    flex-shrink: 0;

    font-size: 9px;
  }

  .daily-info-box strong {
    font-size: 8px;

    line-height: 1;

    margin-right: 2px;
  }

  .daily-info-box span {
    font-size: 7.5px;

    line-height: 1.25;

    display: -webkit-box;

    -webkit-line-clamp: 2;

    -webkit-box-orient: vertical;

    overflow: hidden;
  }


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

  .daily-visual-footer {
    display: flex;

    justify-content: space-between;

    align-items: center;

    margin-top: 5px;

    height: 18px;
  }

  .daily-update {
    padding: 3px 6px;

    gap: 3px;

    font-size: 7px;

    line-height: 1;
  }

  .daily-update i {
    font-size: 8px;
  }

  .daily-date {
    font-size: 7px;

    line-height: 1;
  }

}
/* ── CTA MOBILE ── */
/* ── PREMIUM CTA MOBILE ── */
@media (max-width: 768px) {

  .cta-banner {
    background:
      radial-gradient(
        circle at 20% 25%,
        rgba(240, 192, 64, 0.18) 0%,
        transparent 38%
      ),
      radial-gradient(
        circle at 85% 15%,
        rgba(135, 100, 255, 0.18) 0%,
        transparent 45%
      ),
      linear-gradient(
        135deg,
        #101A46 0%,
        #18275F 45%,
        #29205F 75%,
        #3A1C6E 100%
      );

    border-radius: 18px;
     grid-template-columns: 1fr 1fr;
  gap: 20px;
  padding: 25px 20px;
  align-items: center;
  }
  


  /* Quote Card */
  .swadeshi-quote-card {
    padding: 14px 10px;
    border-radius: 14px;
    background: rgba(255,255,255,0.08);
    border: 1px solid rgba(240,192,64,0.30);
    backdrop-filter: blur(10px);
  }

  .swadeshi-quote-header {
    font-size: 13px;
    color: #F0C040;
    margin-bottom: 10px;
  }

  .swadeshi-quote-body {
    font-size: 12px;
    line-height: 1.6;
    color: #F8F7FF;
  }

  .swadeshi-date {
    font-size: 10px;
    color: rgba(255,255,255,0.75);
  }

  /* परिचय */
  .cta-banner-inner {
    padding: 4px;
  }

  .cta-play-wrap {
    flex-direction: column;
    gap: 8px;
    margin-bottom: 10px;
  }

  .cta-play-btn {
    width: 46px;
    height: 46px;
    border-color: rgba(240,192,64,0.45);
  }

  .cta-play-btn i {
    font-size: 18px;
    color: #F0C040;
  }

  .cta-banner h3 {
    font-size: 20px;
    color: #F0C040;
    margin-bottom: 6px;
  }

  .cta-banner-inner p {
    font-size: 12px;
    line-height: 1.6;
    color: rgba(255,255,255,0.92);
  }

  .cta-attribution {
    font-size: 10px;
    color: rgba(240,192,64,0.9);
  }
}