:root {
    --primary-red: #ff186b;
    --primary-red-dark: #a91827;
    --text-dark: #2c2c2c;
    --bg-light: #fafafa;
    --card-bg: #ffffff;
  }
h2{font-size: 2.8rem !important;
text-align: center;
margin-bottom: 23px;}
p{font-size: 1.2rem !important;}
  body {
    font-family: 'Segoe UI', sans-serif;
    background: var(--bg-light);
    margin: 0;
    padding: 0;
  }

  /* Hero Section with Background Image */
  .hero-section {
    position: relative;
    padding: 80px 20px 200px; /* extra bottom padding for card overlap */
  }
.partner-img{height: 100px;
  object-fit: contain;
}
  .hero-title {
    font-size: 3rem;
    font-weight: 800;
    color: #ff186b !important;
    text-shadow: 3px 3px 5px #505050;
  }
  .hero-subtitle {
    font-size: 1.2rem;
    color: #555;
    margin: 15px 0 25px;
  }
  .highlight {
    color: #ffffff ;
    font-weight: 800;
  }


.custom-image-gallery-section {
  /*padding: 60px 20px;*/
  background-color: #f9fafe;
}

/* Card */
.custom-image-gallery-card {
  overflow: hidden;
  border-radius: 12px;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.05);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  background: #fff;
  /*border: 2px solid #03a9f4;*/
}

.custom-image-gallery-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 25px rgba(0, 0, 0, 0.1);
}

/* Image */
.custom-image-gallery-img {
  width: 100%;
  height: auto;
  object-fit: cover;
  border-radius: 12px;
  transition: transform 0.3s ease;

}

.custom-image-gallery-card:hover .custom-image-gallery-img {
  transform: scale(1.05);
}

/* Content Box */
.gallery-content-box {
  background: #fff;
  border-top: 1px solid #eee;
  border-radius: 0 0 12px 12px;
}

/* Title */
.gallery-title {
  font-weight: 600;
  margin-bottom: 8px;
  color: #333;
  font-size: 1.2rem;
}

/* Paragraph */
.gallery-description {
  color: #666;
  margin: 0 0 0 0;
}

/* Button */
.gallery-btn {
  display: inline-block;
  padding: 8px 18px;
  background: #03a9f4;
  color: #fff;
  text-decoration: none;
  border-radius: 30px;
  transition: background 0.3s ease;
}

.gallery-btn:hover {
  background: #0288d1;
}

  /* Buttons */
  .btn-main {
    background: var(--primary-red-dark);
    color: #fff;
    font-weight: 600;
    padding: 12px 28px;
    border-radius: 10px;
    transition: all 0.3s ease;
  }
  .btn-main:hover {
    background: var(--primary-red);
  }
  .btn-outline {
    border: 2px solid var(--primary-red-dark);
    color: var(--text-dark);
    font-weight: 600;
    padding: 12px 28px;
    border-radius: 10px;
    transition: all 0.3s ease;
    background: #fff;
  }
  .btn-outline:hover {
    background: var(--primary-red-dark);
    color: #fff;
  }

  /* Cards Section (Foreground Overlap) */
  .info-section {
    margin: -65px 12vw 0 12vw;
    position: relative;
    z-index: 5;
  }
  .info-card {
	background: #ffffff5c;
    border-radius: 16px;
    box-shadow: 0 6px 25px rgba(0, 0, 0, 0.12);
    padding: 17px 20px 30px 20px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    text-align: center;
    height: 340px;
    display: flex
;
    flex-direction: column;
  }
  .info-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 12px 30px rgba(0,0,0,0.18);
  }
  .info-card h5 {
    margin-top: 15px;
    font-size: 1.2rem;
    color: var(--text-dark);
  }
  .info-icon {
    font-size: 3rem;
    color: var(--primary-red);
  }







  .feature-box {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
    font-size: 2.5rem !important;
  }
  
  .feature-box {
    font-size: 2.5rem !important;
  }
  .feature-icon {
    font-size: 2.5rem !important;
    color: #ff186b; 
    margin-right: 15px;
  }
  .feature-text h5 {
    margin: 0;
    font-weight: 600;
  }
  .feature-text p {
    margin: 0;
    color: #555;
    font-size: 14px;
  }



  /* Section Background */
.service-section {
  background: linear-gradient(135deg, #0d1b2a, #1b263b, #415a77);
  color: #fff;
  padding: 80px 0;
  position: relative;
}

/* Heading Styles */
.section-title {
  font-size: 2.5rem;
  font-weight: 700;
  margin-bottom: 10px;
  color: #f4f4f4;
}

.section-subtitle {
  font-size: 1.2rem;
  color: #ddd;
}

/* Service Card */
.service-card {
  background: rgba(255, 255, 255, 0.05);
  border-radius: 15px;
  padding: 30px 20px;
  margin-bottom: 30px;
  transition: all 0.3s ease;
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.2);
}

.service-card:hover {
  transform: translateY(-10px);
  background: rgba(255, 255, 255, 0.1);
}

/* Icon Box */
.icon-box {
  width: 70px;
  height: 70px;
  margin: 0 auto 20px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #ff186b, #ff4d94);
  color: #fff;
  font-size: 28px;
  box-shadow: 0 5px 15px rgba(255, 24, 107, 0.4);
}

.service-card h4 {
  font-size: 1.3rem;
  font-weight: 600;
  margin-bottom: 15px;
  color: #fff;
}

.service-card p {
  font-size: 0.95rem;
  color: #ccc;
}
.btn-shop {
  display: inline-block;
  background: #fff;
  color: #a5003d;
  font-size: 1.2rem;
  font-weight: bold;
  padding: 12px 30px;
  border-radius: 50px;
  text-decoration: none;
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(0,0,0,0.2);
}

.btn-shop:hover {
  background: #ff186b;
  color: #fff;
  transform: translateY(-3px);
  box-shadow: 0 6px 20px rgba(0,0,0,0.3);
}


.india-section {
  background:; /* Drring-style gradient */
  padding: 80px 20px;
  color: black;
  border-radius: 15px;
  box-shadow: 0 8px 20px rgba(0,0,0,0.2);
}

.section-title {
  font-size: 2.2rem;
  font-weight: 700;
  margin-bottom: 25px;
}

.province-list {
  list-style: none;
  padding: 0;
}

.province-list li {
  font-size: 1.1rem;
  margin-bottom: 10px;
  display: ruby-text;
  align-items: center;
}

.province-list i {
  color:black;
  background: rgba(255,255,255,0.2);
  padding: 6px;
  border-radius: 50%;
  margin-left: 10px;
}

.india-map {
  max-width: 100%;
  border-radius: 15px;
  padding: 10px;
}
/* Section Background */
.drring-how-section {
  background: aliceblue;
  color: #fff;
}

/* Heading */
.drring-how-section h2 {
  color: #ff186b;
  font-size: 2rem;
}
.img-icon1{height: 50px; margin: 10px;}
/* Step Card */
.drring-step-card {
  background: #fff;
  color: #333;
  border-radius: 16px;
  padding: 25px;
  position: relative;
  box-shadow: 0 6px 20px rgba(0,0,0,0.1);
  transition: all 0.3s ease;
}

.drring-step-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 8px 25px rgba(0,0,0,0.15);
}

/* Step Number */
.drring-step-number {
  position: absolute;
  top: -20px;
  left: 50%;
  transform: translateX(-50%);
  background: #ff186b;
  color: #fff;
  font-size: 1.2rem;
  font-weight: bold;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 10px rgba(0,0,0,0.2);
}
/* Gradient Title */
.custom-title {
  background: linear-gradient(90deg, #ff007f, #009dff);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* Product Image */
.custom-product-img {
  max-width: 240px;
  animation: custom-float 3s ease-in-out infinite;
}

@keyframes custom-float {
  0% { transform: translateY(0px); }
  50% { transform: translateY(-10px); }
  100% { transform: translateY(0px); }
}
:root{
  --brand:#ff166d;             /* DrRing pink */
  --brand-ink:#8a0739;
  --ink:#0f172a;               /* slate-900 */
  --muted:#667085;             /* slate-500 */
  --bg:#f7f8fb;                /* soft paper */
  --card:#ffffff;              /* card base */
  --ok:#16a34a;                /* green check */
  --ring: 0 10px 30px rgba(17,24,39,.08), 0 2px 10px rgba(17,24,39,.06);
  --rounded: 20px;
  --radius-xl: 28px;
}

/* --------- Base --------- */
*{box-sizing:border-box}
.body-2{height:100%}

.wrap{margin:auto;padding:40px 20px}

h1{
  font-size:clamp(28px,4vw,44px) !important;
  letter-spacing:-.02em !important;
  margin:0 0 18px;
  font-weight:800;
  color:var(--ink) !important;
}
.subtitle{color:var(--muted);margin-bottom:28px}

/* --------- Card --------- */
.plancard{
  position:relative;
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap:12px;
  margin-top: 18px;
  background:
    radial-gradient(140% 140% at 100% -10%, rgba(255,22,109,.08) 0%, rgba(255,22,109,0) 55%),
    linear-gradient(180deg,#fff, #fbfcfe);
  border:1px solid rgba(2,6,23,.06);
  border-radius:var(--radius-xl);
  box-shadow:var(--ring);
  overflow:hidden;
}
@media (max-width:880px){
  .plancard{grid-template-columns:1fr !important}
}

/* Decorative glow */
.plancard::after{
  content:"";position:absolute;inset:-1px;pointer-events:none;border-radius:inherit;
  background: radial-gradient(600px 120px at 80% 0%, rgba(255,22,109,.10), transparent 60%),
              radial-gradient(300px 80px at 10% 100%, rgba(32,119,255,.08), transparent 60%);
  mix-blend-mode:screen;opacity:.9
}

/* Left: content */
.left{padding:30px 28px 26px 28px}
.plan-tag{
  display:inline-flex;align-items:center;gap:.5rem;
  background:linear-gradient(180deg,#eaf6ff,#ffffff);
  color:#0455a6;border:1px solid rgba(2,6,23,.08);
  padding:8px 14px;border-radius:999px;font-weight:700;box-shadow:0 1px 0 rgba(2,6,23,.04) inset
}
.plan-tag svg{width:18px;height:18px}

.title{font-weight:900;font-size:clamp(22px,3vw,32px) !important;margin:14px 0 6px}
.tagline{color:var(--muted);margin:0 0 14px}

.features{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 18px;margin-top:12px}
@media (max-width:700px){.features{grid-template-columns:1fr}}

.feat{display:flex;gap:10px;align-items:flex-start;background:#fff;border:1px solid rgba(2,6,23,.06);padding:10px 12px;border-radius:14px}
.feat svg{flex:0 0 auto;width:18px;height:18px;margin-top:2px}
.feat .t{font-weight:600; font-size:1.2rem;}
.feat .d{color:var(--muted); font-size:1.2rem;}

/* Right: price stack */
.right{
  padding:24px 24px 24px 6px;display:grid;place-items:center;background:linear-gradient(180deg,#fff, #f7f9ff)
}

.price-badge{
  position:relative;display:grid;place-items:center;aspect-ratio:1/1;width:min(220px,70vw);
  background: conic-gradient(from 200deg, rgba(255,22,109,.18), rgba(255,22,109,.02) 40%),
              radial-gradient(120px 120px at 70% 25%, rgba(2,6,23,.05), transparent 55%),
              #ffffff;
  border:1px solid rgba(2,6,23,.08);
  border-radius:50%;box-shadow: var(--ring)
}
.price-badge::before{content:"";position:absolute;inset:10px;border-radius:50%;background:radial-gradient(circle at 30% 25%, #fff, #fbfbff);box-shadow:inset 0 1px 0 #fff}
.price{
  position:relative;text-align:center;padding:18px 20px;z-index:2
}
.price .yr{font-size:16px;color:#f44336;font-weight:600;margin-top:2px}
.num{font-size:54px;font-weight:900;letter-spacing:-.02em}
.currency{font-weight:800;font-size:20px;margin-right:2px;color:var(--brand-ink)}
.per{font-size:14px;color:var(--muted);font-weight:600}

.breakdown{margin-top:10px;color:var(--muted);font-weight:600;display:none;}

.cta{
  margin-top:16px;display:inline-grid;place-items:center;gap:8px
}
.btn{
  --padx:22px;--pady:13px;
  background: linear-gradient(180deg,#ff4d98, var(--brand));
  color:#fff;border:none;border-radius:14px;padding:var(--pady) var(--padx);
  font-size:16px;font-weight:800;letter-spacing:.2px;cursor:pointer;box-shadow:0 10px 20px rgba(255,22,109,.25), 0 2px 6px rgba(255,22,109,.2);
  transition:transform .12s ease, box-shadow .2s ease, filter .2s ease
}
.btn:hover{transform:translateY(-1px);filter:saturate(1.05)}
.btn:active{transform:translateY(0)}
.tiny{font-size:12px;color:var(--muted);text-align:center}

/* Mini bullet list under card */
.fine{display:flex;gap:18px;flex-wrap:wrap;margin-top:18px;color:var(--muted);font-weight:600}
.fine span{display:inline-flex;gap:8px;align-items:center}
.fine svg{width:16px;height:16px}

/* Utility */
.sr-only{position:absolute;clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;width:1px;overflow:hidden;white-space:nowrap}







*{box-sizing:border-box}
body{margin:0;background:
  radial-gradient(900px 420px at -10% -20%, rgba(255,22,109,.08) 0%, transparent 55%),
  radial-gradient(740px 380px at 110% -10%, rgba(30,136,255,.10) 0%, transparent 55%),
  var(--bg);
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial;
  color:var(--ink); line-height:1.45;
}

.wrap{max-width:1200px;margin:auto;padding:34px 20px}

.eyebrow{display:inline-flex;gap:.5rem;align-items:center;padding:6px 10px;border-radius:999px;border:1px solid rgba(2,6,23,.08);background:linear-gradient(180deg,#fff,#f6f9ff);color:#0a56c6;font-weight:800;box-shadow:0 1px 0 rgba(2,6,23,.04) inset}
.eyebrow svg{width:16px;height:16px}

h2{margin:10px 0 6px;font-size:clamp(24px,3.6vw,40px);font-weight:900;letter-spacing:-.02em}
.grad{background:linear-gradient(90deg,var(--brand),var(--blue));-webkit-background-clip:text;background-clip:text;color:transparent}
.sub{color:var(--muted);margin:0 0 10px}

/* ---- Slim banner area ---- */
.ribbon{display:grid;grid-template-columns:.95fr 1.05fr;grid-template-areas:"states map";gap:var(--gridGap);align-items:stretch;min-height:var(--panelH)}
@media (max-width:980px){.ribbon{grid-template-columns:1fr;grid-template-areas:"map" "states";min-height:auto}}

/* ---------- Map card (smaller, light) ---------- */
.map-card{position:relative;grid-area:map;height:500px;overflow:hidden;/*border-radius:var(--r);background:linear-gradient(180deg,#fff,#fbfdff);border:1px solid rgba(2,6,23,.08);box-shadow:var(--ring)*/}
.map-media{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 8px 18px rgba(0,0,0,.06))}
.map-overlay{position:absolute;inset:0;pointer-events:none;/*background:
  radial-gradient(280px 90px at 80% 0%, rgba(255,22,109,.10), transparent 60%),
  radial-gradient(180px 60px at 10% 100%, rgba(30,136,255,.08), transparent 60%);*/}    

/* tiny decorative pulse */
.pulse{position:absolute;bottom:18%;left:54%;width:10px;height:10px;border-radius:50%;background:var(--brand);box-shadow:0 0 0 0 rgba(255,22,109,.40);animation:pulse 2.4s ease-out infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(255,22,109,.40)}70%{box-shadow:0 0 0 14px rgba(255,22,109,0)}100%{box-shadow:0 0 0 0 rgba(255,22,109,0)}}

/* ---------- States column (vertical infinite marquee) ---------- */
.states{grid-area:states;display:grid;grid-template-rows:auto 1fr auto;gap:10px;/*background:linear-gradient(180deg,#fff,#fbfdff);border:1px solid rgba(2,6,23,.08);border-radius:var(--r);box-shadow:var(--ring);*/padding:14px;height:500px;}
.meta{display:flex;gap:10px;align-items:center;justify-content:space-between}
.count{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;border-radius:999px;background:#111827;color:#fff;font-weight:800;font-size:12px}
.count svg{width:14px;height:14px}

.scroller{position:relative;overflow:hidden;height:414px;border-radius:12px}

.marquee{display:grid;gap:10px;padding-right:6px}

/* Seamless vertical loop: duplicate list and animate upward; duration via --scrollDur */
.marquee-wrap{position:absolute;inset:0;display:flex;flex-direction:column;animation:scrollUp var(--scrollDur) linear infinite}
.marquee-wrap:hover{animation-play-state:paused}
@media (prefers-reduced-motion:reduce){.marquee-wrap{animation:none}}
@keyframes scrollUp{0%{transform:translateY(0)}100%{transform:translateY(-50%)}}

.chip{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:12px;background:var(--chip);border:1px solid rgba(2,6,23,.06);box-shadow:0 1px 0 rgba(2,6,23,.04) inset;min-height:44px;font-size:clamp(16px,2.1vw,20px);font-weight:700;color:var(--ink)}
.chip .pin{flex:0 0 auto;width:16px;height:16px;color:var(--brand)}

.badges{display:flex;gap:10px;flex-wrap:wrap}
.badge{display:inline-flex;gap:8px;align-items:center;border-radius:999px;padding:6px 10px;background:linear-gradient(180deg,#f6f7fb,#ffffff);border:1px solid rgba(2,6,23,.08);color:var(--muted);font-weight:700}
.badge svg{width:14px;height:14px}


:root{
  --brand:#ff166d;             /* DrRing pink */
  --blue:#1e88ff;              /* Brand blue */
  --ink:#0f172a;               /* Slate 900 */
  --muted:#667085;             /* Slate 500 */
  --bg:#f7f8fb;                /* Paper */
  --panel:#ffffff;             /* Card surface */
  --chip:#ffffff;
  --ring: 0 10px 30px rgba(17,24,39,.08), 0 2px 10px rgba(17,24,39,.06);
  --r: 18px;                   /* card radius */
  --panelH: clamp(260px, 36vh, 380px);  /* unified height for map & list */
  --gridGap: 18px;
  --scrollDur: 8.4s;            /* marquee speed */
}













/* Feature Card */
.custom-feature-card {
  background: #fff;
  border-radius: 16px;
  padding: 15px;
  display: flex;
  gap: 12px;
  box-shadow: 0px 4px 14px rgba(0, 0, 0, 0.08);
  transition: all 0.3s ease;

}

.custom-feature-card:hover {
  transform: translateY(-5px);
  box-shadow: 0px 8px 22px rgba(0, 0, 0, 0.12);
}

/* Feature Icon */
.custom-feature-icon {
  width: 42px;
  height: 42px;
  object-fit: contain;
}

/* Text Styling (kept same sizes you used) */
.custom-feature-text h6 {
  margin: 0;
  font-weight: 600;
}

.custom-feature-text p {
  margin: 0;
  font-size: 0.85rem;
  color: #555;
}
.custom-feature-text h6{font-size: 1.5rem; color: #ff186b ;}
.modern-feature-card{color:#ff186b }




/* Title with gradient */
.modern-title {
  background: linear-gradient(90deg, #ff007f, #009dff);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* Floating product */
.modern-product-img {
  max-width: 230px;
  animation: modern-float 3s ease-in-out infinite;
}

@keyframes modern-float {
  0% { transform: translateY(0px); }
  50% { transform: translateY(-10px); }
  100% { transform: translateY(0px); }
}

/* Feature card */
.modern-feature-card {
  background: #fff;
  border-radius: 18px;
  padding: 18px;
  text-align: center;
  box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.08);
  transition: all 0.3s ease;
}

.modern-feature-card:hover {
  transform: translateY(-6px);
  box-shadow: 0px 8px 24px rgba(0, 0, 0, 0.12);
}

/* Icons */
.modern-feature-icon {
  width: 112px;
  height: 112px;
  object-fit: contain;
  margin-bottom: 8px;
}
.modern-feature-card h6{font-size: 1.4rem !important;}
/* Keep same text sizes */
.modern-feature-card h6 {
  font-weight: 600;
  margin-bottom: 4px;
}

.modern-feature-card p {
  font-size: 0.85rem;
  margin: 0;
  color: #666;
}

/* Responsive */
@media (max-width: 768px) {
  .modern-features-section .row {
    flex-direction: row;
  }
  .highlight {
    color: #000000;
    font-weight: 600;
}
.hero-title {
  font-size: 3rem;
  color: #ff186b;
  text-shadow: none;
}
  .modern-feature-card {
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
  }
  .modern-product-img {
    max-width: 100%;
  }
  h6{font-size: 1.4rem !important;}
}

.partner-img2 {
  height: 134px;
  width: auto;
  object-fit: contain;
  margin-bottom: 7px;
}
.wrap{max-width:1200px;margin:auto;padding:34px 20px}



/* Hide mobile version on desktop */
.mobile-section {
  display: none;
}

/* Show mobile section only on small screens */
@media (max-width: 768px) {
  .desktop-section {
    display: none !important;
  }
  .partner-img2 {
    height: 95px !important;
    width: auto;
    object-fit: contain;
    margin-bottom: 0px !important;
}
  .mobile-section {
    display: block !important;
  }
  .info-section {
    margin-top: 0 !important;
    position: relative;
    z-index: 5;
}
.info-card{    
	/*margin: 20px 44px; */
	margin: 20px -5vw;
}
}
.info-card h5 {
  margin-top: 15px;
  font-size: 1.2rem;
  color: #771717 !important;
  font-weight: 400;
  line-height: 1.5rem;
  letter-spacing: 0.5px;
}
.sp-hero-banner {
  background: radial-gradient(circle at top left, #ffffff, rgb(206 234 255 / 80%));
    padding: 60px 20px;
  text-align: center;
  position: relative;
}

.sp-hero-banner h1 {
  font-size: 28px;
  font-weight: 700;
  color: #ff186b;
}

.sp-hero-banner .sp-subheading {
  font-size: 14px;
  font-weight: 700;
  color: #9a1949;
  margin: 10px 0;
  text-transform: uppercase;
  line-height: 1.4;
}

.sp-hero-banner .sp-text {
  font-size: 17px !important;
  font-weight: 500;
  color: #000000;
  margin-bottom: 25px;
}

.sp-hero-banner .sp-btn-primary {
  background-color: #9a1949;
  border: none;
  padding: 8px 18px;
  font-size: 16px;
  font-weight: 700;
  border-radius: 8px;
  width: 100%;
  margin: 20px auto 0 auto;
  display: block;
  color: #fff;
}
.logo-text {
  font-size: 14px;
  font-weight: normal;
  color: #404040;
  margin-bottom:20px;
}

.sp-hero-banner .sp-btn-primary:hover {
  background-color: #b71f28;
}

.sp-hero-banner .sp-or {
  font-size: 13px;
  font-weight: 600;
  color: #666;
  margin: 5px 0 10px;
}

.sp-hero-banner .sp-btn-outline {
  border: 2px solid #ccc;
  padding: 12px 18px;
  font-size: 16px;
  font-weight: 700;
  border-radius: 8px;
  width: 100%;
  max-width: 280px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: #2c3452;
  background: #fff;
}
















/* Responsive */
@media (max-width: 768px) {
  .custom-features-section .row {
    flex-direction: column;
  }
  .custom-feature-card {
    max-width: 90%;
    margin-left: auto;
    margin-right: auto;
  }
  .custom-product-img {
    max-width: 200px;
    margin: 20px auto;
  }
}


/* Step Image */
.drring-step-img {
	height: auto;
    width: 100%;
    border-radius: 20px;
    margin-top: 20px;
    border: 4px solid #ff186b;
    box-shadow: 0 6px 15px rgba(0, 0, 0, 0.15);
    padding: 11px 0px;
}
.text-color-drring{color:#ff186b }
/* CTA Button */
.drring-how-section .btn-danger {
  background: #d63057;
  border: none;
  border-radius: 30px;
  padding: 12px 40px;
  font-weight: bold;
  transition: background 0.3s;
}

.drring-how-section .btn-danger:hover {
  background: #ff186b;
}

.product{color: #ff186b;}


/* Section Background */
.drring-director-section {
  color: #fff;
}

/* Heading */
.drring-director-section h2 {
  color: ff186b;
}

/* Video Box */
.drring-director-section iframe {
  border-radius: 16px;
  border: 4px solid #fff;
  box-shadow: 0 8px 25px rgba(0,0,0,0.25);
}

/* Button */
.drring-director-section .btn-danger {
  background: #d63057;
  border: none;
  border-radius: 30px;
  font-weight: bold;
  transition: all 0.3s;
}

.drring-director-section .btn-danger:hover {
  background: #ff186b;
  transform: translateY(-3px);
}




.mobox {
	width: 145px;
	height: 65px;
	display: flex;
	justify-content: space-evenly;
	align-items: normal;
}

.mocurrency {
	font-weight: bold;
	font-size: 17px;
	align-content: space-around;
	margin: 0px -9px 0 0px;
}

.movalue {
	font-size: 44px;
	font-weight: bold;
	align-content: flex-end;
}

.mopermonth {
	margin: 0 0 7px -10px;
	line-height:97px;
}

td.spectd {
    font-size: 18px;
    padding: 14px;
}

tr.spectr-blue{
	background: aliceblue;
    border-bottom: 0.51px solid #e5e5e5;
}

tr.spectr{
	background: #fff;
    border-bottom: 0.51px solid #e5e5e5;
}

td.spectd.label {
    width: 30%;
    color: #2196F3;
}
.highlight2{
  color:#03a9f4;
  font-weight: 700;
  }


 .feature-item-image {    height: 79px;
    margin-right: 11px;
}
.up-mg-2{    height: 79px;
  margin-right: 11px;
}
.feature-text h6{font-size: 1.5rem;}










.plan-card {
  border: 1px solid #eee;
  border-radius: 12px;
  padding: 25px;
  margin-bottom: 25px;
  box-shadow: 0 6px 16px rgba(0,0,0,0.1);
  display: flex;
  align-items: center;   /* vertical center */
  justify-content: space-between; /* equal space */
  transition: 0.3s;
}
.plan-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 20px rgba(0,0,0,0.15);
}
.plan-img {
  flex: 0 0 100px;
  text-align: center;
}
.plan-img img {
  width: auto;
  border-radius: 100%;
  margin: 12px;
}
.plan-content {
  flex: 1;
  padding: 0 50px;   /* equal gap left-right */
  text-align: left;
}
.plan-title {
  font-size: 24px;
  font-weight: 700;
  color: #c00;
  margin-bottom: 10px;
  margin-top: 10px;

}
.plan-price {
  font-size: 22px;
  font-weight: 700;
  color: #333;
  margin: 8px 0;
}
.plan-features {
  display: grid;
  grid-template-columns: repeat(2, 1fr); /* 2 items in one row */
  gap: 6px 20px; /* row gap, column gap */
  list-style-type: disclosure-closed;  padding-left: 18px;
}
.plan-features li {
  font-weight: 500;
}
.plan-btn {
  flex: 0 0 180px;
  text-align: center;
}
.plan-btn .btn {
  font-size: 16px;
  font-weight: bold;
  padding: 10px 20px;
  border-radius: 8px;
}
.plan-price-tag {
  font-weight: 700;
  font-size: 18px;
  margin-bottom: 10px;
  color: #111;
}
.dr-alert { border-left: 6px solid #d9534f; }
.dr-protect { border-left: 6px solid #0275d8; }
.dr-peace { border-left: 6px solid #5cb85c; }

h2 {color: #ff186b !important;}




.feature-card {
  transition: all 0.3s ease;
}
.feature-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 6px 18px rgba(0,0,0,0.12);
}


.hero-image{height: auto;
  width: 100% !important;
  color: rgb(0, 0, 0);
  display: flex
;
  align-items: center;
  justify-content: center;
  text-align: left;
  flex-direction: column;
  width: 100%;}
small{font-size: 22px !important;}

.review-card {
  background: #fff;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.review-card:hover {
  transform: translateY(-10px);
  box-shadow: 0 8px 20px rgba(0,0,0,0.15);
}
.card-title {
  font-weight: bold;
  color: #ff186b ;
  font-size: 1.4rem;
}
.card-text {
  font-size: 0.95rem;
}
.text-danger{color: #ff186b !important;}

.navbar-toggler-icon {
  display: inline-block;
  width: 3em;
  height: 3em;
  vertical-align: middle;
  background-image: var(--bs-navbar-toggler-icon-bg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
}
@media (max-width: 768px) {
  p {
      font-size: 0.9rem !important;
  }
  li {
    font-size: 0.9rem !important;
}
}
@media (min-width: 768px) {
.plan-price {
  font-size: 30px !important;
  font-weight: 700;
  color: #333;
  margin: 8px 0;
  text-align: left;
}}
p {
  font-size: 1.2rem !important;
  
}
li {
  font-size: 1.2rem !important;
}
.title-gradient {
  background: linear-gradient(90deg, #ff007f, #009dff);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.states-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}

.state {
  background: #fff;
  padding: 10px 15px;
  border-radius: 12px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.08);
  font-weight: 500;
  transition: 0.3s;
  cursor: pointer;
  font-size: 1.2rem;
}

.state:hover {
  background: #ffe6f0;
  transform: translateY(-2px);
}

.india-map {
  max-width: 100%;
  border-radius: 15px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
  transition: transform 0.3s ease;
}

.india-map:hover {
  transform: scale(1.05);
}






@media (max-width: 768px) {
  .nav-link {
      color: black;
      font-size: 1.2rem;
      font-weight: 600;
  }
}
p {
  font-size: 1.2rem !important;
}


   /* Mobile View */
   @media (max-width: 770px) {
    .state {
      background: #fff;
      padding: 10px 15px;
      border-radius: 12px;
      box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
      font-weight: 500;
      transition: 0.3s;
      cursor: pointer;
      font-size: 0.9rem;
  }
  h2 {
    font-size: 2rem !important;
    text-align: center;
    margin-bottom: 23px;
}
.mb-5{margin-bottom: 1rem !important;}

    .plan-card {
      border: 1px solid #eee;
      border-radius: 12px;
      padding: 5px;
      margin-bottom: 25px;
      box-shadow: 0 6px 16px rgba(0, 0, 0, 0.1);
      display: block;
      align-items: center;
      justify-content: space-between;
      transition: 0.3s;
  }

  .plan-btn .btn {
    font-size: 16px;
    font-weight: bold;
    padding: 10px 20px;
    border-radius: 8px;
    margin: 10px 0 20px 0px;
}
.plan-title {
  font-size: 24px;
  font-weight: 700;
  color: #c00;
  margin-bottom: 10px;
  margin-top: 10px;
  text-align: center;
  
}
small {
  font-size: 22px !important;
  float: right;
  /* margin-bottom: 50px; */
  /* padding-bottom: 33px; */
  width: 100%;
  margin-bottom: 10px;
}.plan-features {
  grid-template-columns: repeat(2, 1fr);
  gap: 6px 20px;
  list-style-type: disclosure-closed;
  padding-left: 18px;
  display: block;
}

}
.plan-price-tag {
  font-weight: 700;
  font-size: 28px;
  margin-bottom: 10px;
  color: #111;
}

@media (max-width: 876px) {
  .navbar-toggler-icon {
  display: inline-block;
      width: 1.5em;
      height: 1.5em;
      vertical-align: baseline;
      background: none !important;
      position: relative;
  }
}

@media (max-width: 876px) {
  .navbar-toggler-icon::before {
  content: "\f0c9";
      font-family: "Font Awesome 6 Free";
      font-weight: 900;
      font-size: 3vh;
      color: #ff186b !important;
      display: block;
      text-align: center;
      line-height: 1em;
  }

.navbar-brand img {
  height: 8vh;
}
}







.logo-slider {
  overflow: hidden;
  position: relative;
  white-space: nowrap;
}
.logo-slide-track {
  display: flex;
  gap: 60px;
  width: max-content;
}
.logo-box {
  text-align: center;
  flex: 0 0 auto;
}
.partner-img {
  height: 80px;
  width: auto;
  object-fit: contain;
  /*margin-bottom: 8px;*/
}
.logo-text {
  font-size: 14px !important;
  font-weight: normal;
  color: #404040;
}

/* Animations */
.logo-slider-ltr .logo-slide-track {
  animation: scroll-ltr 8s linear infinite;
}
.logo-slider-rtl .logo-slide-track {
  animation: scroll-rtl 9s linear infinite;
}

@keyframes scroll-ltr {
  from { transform: translateX(-50%); }
  to { transform: translateX(0); }
}
@keyframes scroll-rtl {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

/* Mobile Speed Adjustment */
@media (max-width: 768px) {
  .logo-slider-ltr .logo-slide-track,
  .logo-slider-rtl .logo-slide-track {
    animation-duration: 7s; /* slower on mobile */
  }
}

















.body-3{margin:0;background:
  radial-gradient(1000px 520px at -10% -10%, #ffe3ee 0%, transparent 45%),
  radial-gradient(900px 480px at 110% 0%, #e7f4ff 0%, transparent 45%),
  var(--bg);
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial;
  color:var(--ink); line-height:1.5;
}
.wrap{max-width:1100px;margin:auto;padding:40px 20px}

/* ---------------- Heading ---------------- */
h2{margin:0 0 10px;font-size:clamp(26px,4vw,44px);font-weight:900;letter-spacing:-.02em}
.grad{background:linear-gradient(90deg,var(--brand),var(--blue));-webkit-background-clip:text;background-clip:text;color:transparent}
.sub{color:var(--muted);margin:0 0 22px}

/* ---------------- Highlights ---------------- */
.highlights{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:18px}
@media (max-width:900px){.highlights{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.highlights{grid-template-columns:1fr}}
.pill{
  display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:999px;
  font-size: 1.2rem !important;
  background:linear-gradient(180deg,#fff,#fbfdff);border:1px solid rgba(2,6,23,.08);box-shadow:0 1px 0 rgba(2,6,23,.04) inset
}
.pill svg{width:18px;height:18px}
.pill strong{font-weight:900}

/* ---------------- Spec Grid ---------------- */
.specgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:860px){.specgrid{grid-template-columns:1fr}}

.spec{
  position:relative;display:grid;grid-template-columns:220px 1fr;align-items:center;gap:16px;
  background:linear-gradient(180deg,#ffffff,#fbfdff);border:1px solid rgba(2,6,23,.08);border-radius:var(--r);
  box-shadow:var(--ring);padding:16px 18px;overflow:hidden
}
@media (max-width:640px){.spec{grid-template-columns:1fr}}

/* left label */
.k{display:flex;align-items:center;gap:10px;font-weight:900;color:#ff186b; font-size: 1.2rem !important;}
.k svg{width:20px;height:20px; font-size: 1.2rem !important;}

/* right value */
.v{font-size:clamp(15px,1.8vw,18px) !important ;font-weight:700;color:var(--ink); font-size: 1.2rem !important;}
.v small{color:var(--muted);font-weight:600; font-size: 1.2rem !important;}

/* accent stripe */
.spec::before{content:"";position:absolute;inset:0  auto 0 0;width:6px;background:#03a9f4;opacity:.7}

/* subtle hover */
.spec:hover{transform:translateY(-1px);box-shadow:0 16px 40px rgba(2,6,23,.12);transition:.18s ease}

/* foot */
.foot{margin-top:14px;color:var(--muted);font-weight:600}