/*
  =====================================================
  BD RATHORE PORTFOLIO2 — BLACK / WHITE / GREY THEME
  Accent: #b58236 (Gold Bronze) — hover & highlights ONLY
  
  SECTION ORDER:
  1. Hero        → WHITE  #ffffff
  2. About       → BLACK  #111111
  3. Services    → GRAY   #f4f4f4
  4. Portfolio   → BLACK  #111111
  5. Partners1   → BLACK  #111111
  6. Quiz        → WHITE  #ffffff
  7. Freebies    → GRAY   #f4f4f4
  8. Partners2   → BLACK  #111111
  9. Credentials → GRAY   #f4f4f4
  10. Testimonial → WHITE  #ffffff
  11. Blog        → GRAY   #f4f4f4
  12. Footer      → BLACK  #0a0a0a
  =====================================================/* ══════════════════════════════════════════════════════
   GLOBAL SECTION SPACING (HEADER CLEARANCE + 60PX RHYTHM)
══════════════════════════════════════════════════════ */
/* Hero Section: Clearance for sticky top header bar */
.tp-hero-area.tp_about_me-space,
.tp_about_me-space {
  padding-top: 150px !important;
  padding-bottom: 60px !important;
}

/* All other sections: Exact 60px Top & 60px Bottom */
.timeline-story-section,
.pillars-section,
.pp-about-me-area,
.pp-service-area,
.pp-about-me-service-space,
#about,
#services,
#portfolio,
#quiz,
#freebies,
#credentials,
#testimonial,
#blog {
  padding-top: 60px !important;
  padding-bottom: 60px !important;
}

.pp-about-me-service-item {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.md-service-area .md-section-content-wrapper {
  padding-top: 40px !important;
  margin-bottom: 40px !important;
}

.md-process-area.md-process-space,
.md-process-space {
  padding-top: 60px !important;
  padding-bottom: 60px !important;
}

.md-accordion-step-box.pb-180,
.md-accordion-step-box {
  padding-bottom: 0 !important;
}

/* Work Process GSAP Line Fill Style */
.md-faq-accordion-wrap::after {
  content: "" !important;
  position: absolute !important;
  width: 3px !important;
  height: var(--line-progress, 0%) !important;
  background: #b58236 !important;
  box-shadow: 0 0 10px rgba(181, 130, 54, 0.8) !important;
  top: 0 !important;
  left: 20px !important;
  transition: height 0.1s linear !important;
}







/* ── ROOT VARIABLE OVERRIDES ──────────────────────── */
:root {
  --bdr-accent:            #b58236;
  --tp-theme-blue:         #111111;
  --tp-theme-paste:        #111111;
  --tp-theme-green-yellow: #b58236;
  --tp-theme-yellow:       #b58236;
  --tp-theme-yellow-light: #d4a84b;
  --tp-theme-green:        #b58236;
  --tp-common-blue-2:      #555555;
  --tp-common-jelly:       #888888;
  --tp-common-red:         #555555;
  --tp-common-paste-2:     #111111;
  --tp-common-paste-3:     #1a1a1a;
  --tp-common-paste-4:     #222222;
  --tp-coffe-1:            #1a1a1a;
  --tp-coffe-2:            #333333;
  --tp-common-yellow:      #b58236;
  --tp-common-yellow-dark: #9a6d2a;
}

/* ── GLOBAL BODY ──────────────────────────────────── */
body { background-color: #ffffff !important; color: #111111 !important; }
a:hover { color: #b58236 !important; }

/* ══════════════════════════════════════════════════════
   GLOBAL UNIFORM SECTION SPACING
   All sections: same top/bottom padding
   All section heading blocks: same gap from top
══════════════════════════════════════════════════════ */

/* ─── Uniform Section Padding (top & bottom = 110px) ─── */
#about,
#services,
#quiz,
#freebies,
.pp-award-area,
#testimonial,
#blog {
  padding-top: 60px !important;
  padding-bottom: 60px !important;
}

/* Portfolio/Podcast: top starts with full-bleed banner so keep 0 top */
#portfolio {
  padding-top: 0 !important;
  padding-bottom: 60px !important;
}

/* Partners ticker bars: tight strip vertical rhythm */
.pp-brand-area {
  padding-top: 35px !important;
  padding-bottom: 35px !important;
}

/* ─── Uniform Heading Block Gap & Font Sizes ─── */
.pp-section-content-wrapper,
.cr-section-content-wrapper {
  margin-bottom: 45px !important;
}

/* Subtle Dot Subtitle (Uniform Across All Sections) */
.pp-section-subtitle,
.cr-section-subtitle {
  font-size: 15px !important;
  font-weight: 700 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  margin-bottom: 10px !important;
  display: inline-block !important;
  color: #b58236 !important;
}

/* Main Section Titles (Uniform Gap & Height) */
.pp-section-title {
  margin-top: 6px !important;
  line-height: 1.1 !important;
}

/* ══════════════════════════════════════════════════════
   1. HERO — WHITE
══════════════════════════════════════════════════════ */
.pp-hero-area,
section#home {
  background: #ffffff !important;
  color: #111111 !important;
}

/* ══════════════════════════════════════════════════════
   2. ABOUT — BLACK
══════════════════════════════════════════════════════ */
.pp-about-area,
section#about {
  background: #111111 !important;
  color: #ffffff !important;
}
.pp-about-area h1, .pp-about-area h2, .pp-about-area h3,
.pp-about-area h4, .pp-about-area p, .pp-about-area span,
.pp-about-area li, .pp-about-area a:not(:hover),
section#about h1, section#about h2, section#about h3,
section#about h4, section#about p {
  color: #ffffff !important;
}
.pp-about-area .tp-border-1,
.pp-about-area .tp-border-2,
.pp-about-area [class*="border"] {
  border-color: #333333 !important;
}

/* ══════════════════════════════════════════════════════
   3. SERVICES — LIGHT GRAY
══════════════════════════════════════════════════════ */
.pp-service-area,
div#services {
  background: #f4f4f4 !important;
  color: #111111 !important;
}
.pp-service-area h1, .pp-service-area h2, .pp-service-area h3,
.pp-service-area h4, div#services h1, div#services h2,
div#services h3, div#services h4 {
  color: #111111 !important;
}
.pp-service-area p, div#services p { color: #555555 !important; }

/* Service items: background stays transparent, text visible grey in resting state, turns solid BLACK on hover */
.pp-style-2 .pp-service-item,
.pp-service-item {
  background: transparent !important;
  border-color: rgba(0, 0, 0, 0.12) !important;
  position: relative !important;
}
.pp-style-2 .pp-service-item:hover,
.pp-service-item:hover {
  background: transparent !important;
  border-color: rgba(0, 0, 0, 0.3) !important;
}
.pp-style-2 .pp-service-item .pp-service-item-title,
.pp-service-item .pp-service-item-title {
  color: rgba(15, 23, 42, 0.15) !important;
  transition: color 0.4s ease, opacity 0.4s ease !important;
}
.pp-style-2 .pp-service-item:hover .pp-service-item-title,
.pp-service-item:hover .pp-service-item-title {
  color: #0f172a !important;
}
.pp-style-2 .pp-service-content,
.pp-service-content {
  color: #64748b !important;
  transition: color 0.4s ease !important;
}
.pp-style-2 .pp-service-item:hover .pp-service-content,
.pp-service-item:hover .pp-service-content {
  color: #0f172a !important;
}


/* ══════════════════════════════════════════════════════
   4. PORTFOLIO / PODCAST — BLACK
══════════════════════════════════════════════════════ */
.pp-portfolio-area,
section#portfolio {
  background: #111111 !important;
  color: #ffffff !important;
}
.pp-portfolio-area h1, .pp-portfolio-area h2, .pp-portfolio-area h3,
.pp-portfolio-area h4, section#portfolio h1, section#portfolio h2,
section#portfolio h3, section#portfolio h4 { color: #ffffff !important; }
.cr-portfolio-title a, .cr-portfolio-title a.tp-line-black { color: #ffffff !important; }
.cr-portfolio-content p { color: #aaaaaa !important; }
.md-project-category a {
  color: #b58236 !important;
  background: rgba(181, 130, 54, 0.1) !important;
  border: 1px solid rgba(181, 130, 54, 0.3) !important;
}
.md-project-category a:hover {
  background: #b58236 !important;
  color: #ffffff !important;
}

/* ══════════════════════════════════════════════════════
   5. HERO STATS TICKER STRIP — NARROW STRIP WITH SEPARATION
══════════════════════════════════════════════════════ */
.pp-brand-area.pp-brand-style {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  border-top: 1px solid rgba(255, 255, 255, 0.15) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.15) !important;
}
.pp-brand-style .pp-brand-wrapper {
  background: #111111 !important;
  padding-top: 16px !important;
  padding-bottom: 16px !important;
  border-top: 1px solid rgba(255, 255, 255, 0.15) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.15) !important;
}

/* ══════════════════════════════════════════════════════
   5b. TRUSTED PARTNERS SECTION — NO BORDER LINES ON LOGO STRIP
══════════════════════════════════════════════════════ */
.pp-brand-area:not(.pp-brand-style) {
  padding-top: 80px !important;
  padding-bottom: 80px !important;
  background: #111111 !important;
  color: #ffffff !important;
}
.pp-brand-area:not(.pp-brand-style) .pp-brand-wrapper {
  background: #111111 !important;
  padding-top: 16px !important;
  padding-bottom: 16px !important;
  border: none !important;
  border-top: none !important;
  border-bottom: none !important;
}

/* ══════════════════════════════════════════════════════
   6. QUIZ — WHITE
══════════════════════════════════════════════════════ */
section#quiz {
  background: #ffffff !important;
  color: #111111 !important;
}
section#quiz h1, section#quiz h2, section#quiz h3,
section#quiz h4, section#quiz p { color: #111111 !important; }

/* ══════════════════════════════════════════════════════
   7. FREEBIES — LIGHT GRAY
══════════════════════════════════════════════════════ */
section#freebies {
  background: #f4f4f4 !important;
  color: #111111 !important;
}
section#freebies h1, section#freebies h2, section#freebies h3,
section#freebies h4 { color: #111111 !important; }
section#freebies p { color: #555555 !important; }

/* ══════════════════════════════════════════════════════
   8. PARTNERS TICKER 2 — BLACK
══════════════════════════════════════════════════════ */
.pp-brand-area {
  background: #111111 !important;
  color: #ffffff !important;
}
.pp-brand-area h2 { color: #ffffff !important; }
.pp-brand-area p { color: rgba(255,255,255,0.75) !important; }
.pp-brand-area span { color: #b58236 !important; }

/* ══════════════════════════════════════════════════════
   9. CREDENTIALS / AWARDS — BLACK
══════════════════════════════════════════════════════ */
.pp-award-area {
  background: #111111 !important;
  color: #ffffff !important;
}
.pp-award-area .pp-section-title,
.pp-award-area h1, .pp-award-area h2, .pp-award-area h3,
.pp-award-area h4, .pp-award-list-title { color: #ffffff !important; }
.pp-award-area p, .pp-award-area span { color: #aaaaaa !important; }
.pp-award-list-item {
  border-bottom: 1px solid #333333 !important;
  background: transparent !important;
  padding: 26px 0 !important;
  border-radius: 0 !important;
  transition: all 0.3s ease !important;
}
.pp-award-list-item:hover {
  background: transparent !important;
  padding-left: 8px !important;
}
.pp-award-list-item:hover .pp-award-list-title {
  color: #b58236 !important;
}
.pp-award-list-right span { color: #b58236 !important; font-weight: 700 !important; }

/* ══════════════════════════════════════════════════════
   10. TESTIMONIALS — WHITE
══════════════════════════════════════════════════════ */
.pp-testimonial-area,
section#testimonial {
  background: #ffffff !important;
  color: #111111 !important;
}
.tp-testimonial-side-overlay::before,
.tp-testimonial-side-overlay::after {
  display: none !important;
  background: none !important;
}
.md-testimonial-item {
  background: #f8f8f8 !important;
  border: 1px solid #e0e0e0 !important;
}
.md-testimonial-text p { color: #333333 !important; }
.md-testimonial-author-title { color: #111111 !important; font-weight: 800 !important; }
.md-testimonial-author-designation { color: #b58236 !important; }

/* ══════════════════════════════════════════════════════
   11. BLOG — LIGHT GRAY
══════════════════════════════════════════════════════ */
section#blog,
.pp-blog-area {
  background: #f4f4f4 !important;
  color: #111111 !important;
}
.pp-blog-content-wrap {
  background: #ffffff !important;
  border: 1px solid #e0e0e0 !important;
}
.pp-blog-title a { color: #111111 !important; }
.pp-blog-title a:hover { color: #b58236 !important; }
.pp-blog-date { color: #777777 !important; }
.tp-btn-blog-arrow { color: #111111 !important; }
.tp-btn-blog-arrow:hover { color: #b58236 !important; }
.tp-btn-blog-arrow span { background: #111111 !important; color: #ffffff !important; }
.tp-btn-blog-arrow:hover span { background: #b58236 !important; color: #ffffff !important; }

section#blog .pp-section-title,
section#blog h1, section#blog h2, section#blog h3,
section#freebies .pp-section-title,
section#freebies h1, section#freebies h2, section#freebies h3,
section#quiz .pp-section-title,
section#quiz h1, section#quiz h2, section#quiz h3 {
  color: #111111 !important;
}

/* ══════════════════════════════════════════════════════
   12. FOOTER — NEAR BLACK
══════════════════════════════════════════════════════ */
.tp-footer-area, .pp-footer-area, footer {
  background: #0a0a0a !important;
  color: #cccccc !important;
}
.tp-footer-area h1, .tp-footer-area h2, .tp-footer-area h3,
.tp-footer-area h4, .tp-footer-area h5 { color: #ffffff !important; }
.tp-footer-area a:not(:hover) { color: #aaaaaa !important; }
.tp-footer-area a:hover { color: #b58236 !important; }
.tp-copyright-area { border-color: #222222 !important; }

/* ══════════════════════════════════════════════════════
   HERO RESPONSIVE - BREAKPOINT SPECIFIC MEDIA QUERIES
══════════════════════════════════════════════════════ */

/* ─── 1. COMMON BASE (ALL Mobile & Tablets <= 1024px) ─── */
@media (max-width: 1024px) {
  .pp-hero-area,
  section#home,
  .pp-style-2.pp-hero-height {
    min-height: 100vh !important;
    min-height: 100dvh !important;
    height: 100vh !important;
    height: 100dvh !important;
    position: relative !important;
    overflow: hidden !important;
  }

  .pp-style-2 .pp-hero-thumbnail {
    position: absolute !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    bottom: 0 !important;
    top: auto !important;
    margin: 0 !important;
    width: 100% !important;
    z-index: 5 !important;
    display: flex !important;
    justify-content: center !important;
    align-items: flex-end !important;
  }
}

/* ─── 2. SAMSUNG GALAXY S8+ & SMALL PHONES (320px - 375px) ─── */
@media (max-width: 375px) {
  .pp-style-2 .pp-hero-title-box {
    padding-top: 105px !important;
    position: relative !important;
    z-index: 1 !important;
  }
  .pp-style-2 .pp-hero-thumbnail {
    height: 78vh !important;
    height: 78dvh !important;
    transform: translateX(-50%) scale(1.3) !important;
    transform-origin: bottom center !important;
  }
  .pp-style-2 .pp-hero-thumbnail img,
  img.pp-hero-person,
  img#pp-hero-person-move,
  .pp-hero-person,
  #pp-hero-person-move {
    height: 100% !important;
    width: auto !important;
  }
}

/* ─── 3. IPHONE 12 PRO / 13 / 14 / MEDIUM PHONES (376px - 414px) ─── */
@media (min-width: 376px) and (max-width: 414px) {
  .pp-style-2 .pp-hero-title-box {
    padding-top: 130px !important;
    position: relative !important;
    z-index: 1 !important;
  }
  .pp-style-2 .pp-hero-thumbnail {
    height: 82vh !important;
    height: 82dvh !important;
    transform: translateX(-50%) !important;
  }
  .pp-style-2 .pp-hero-thumbnail img,
  img.pp-hero-person,
  img#pp-hero-person-move,
  .pp-hero-person,
  #pp-hero-person-move {
    width: 160% !important;
    min-width: 160% !important;
    max-width: 160% !important;
    height: auto !important;
    display: block !important;
    margin: 0 auto !important;
    object-fit: contain !important;
    object-position: bottom center !important;
    transform: scale(1.15) !important;
    transform-origin: bottom center !important;
  }
}

/* ─── 4. IPHONE PLUS / MAX & LARGE PHONES (415px - 480px) ─── */
@media (min-width: 415px) and (max-width: 480px) {
  .pp-style-2 .pp-hero-title-box {
    padding-top: 130px !important;
    position: relative !important;
    z-index: 1 !important;
  }
  .pp-style-2 .pp-hero-thumbnail {
    height: 82vh !important;
    height: 82dvh !important;
    transform: translateX(-50%) scale(1.7) !important;
    transform-origin: bottom center !important;
  }
  .pp-style-2 .pp-hero-thumbnail img,
  img.pp-hero-person,
  img#pp-hero-person-move,
  .pp-hero-person,
  #pp-hero-person-move {
    height: 100% !important;
    width: auto !important;
  }
}

/* ─── 5. IPAD MINI, IPAD AIR & TABLETS (768px - 1024px) ─── */
@media (min-width: 768px) and (max-width: 1024px) {
  .pp-style-2 .pp-hero-title-box {
    padding-top: 170px !important;
    position: relative !important;
    z-index: 1 !important;
    text-align: center !important;
  }

  .pp-style-2 .pp-hero-title {
    font-size: 135px !important;
    letter-spacing: -3px !important;
    white-space: nowrap !important;
    text-align: center !important;
  }

  .pp-style-2 .pp-hero-thumbnail {
    position: absolute !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    bottom: 0 !important;
    top: auto !important;
    margin: 0 !important;
    width: 100% !important;
    height: 82vh !important;
    height: 82dvh !important;
    z-index: 5 !important;
    display: flex !important;
    justify-content: center !important;
    align-items: flex-end !important;
  }

  .pp-style-2 .pp-hero-thumbnail img,
  img.pp-hero-person,
  img#pp-hero-person-move,
  .pp-hero-person,
  #pp-hero-person-move {
    width: 70% !important;
    min-width: 70% !important;
    max-width: 520px !important;
    height: auto !important;
    display: block !important;
    margin: 0 auto !important;
    object-fit: contain !important;
    object-position: bottom center !important;
    transform: scale(1.18) !important;
    transform-origin: bottom center !important;
  }

  .pp-hero-bottom-wrap {
    position: absolute !important;
    bottom: 25px !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    padding: 0 30px !important;
    z-index: 20 !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: flex-end !important;
    pointer-events: none !important;
  }

  .pp-hero-social-box,
  .pp-hero-info {
    pointer-events: auto !important;
  }

  .pp-hero-social-box {
    position: relative !important;
    left: 0 !important;
    bottom: 0 !important;
    z-index: 20 !important;
  }

  .pp-hero-info {
    position: relative !important;
    right: 0 !important;
    bottom: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important;
    text-align: right !important;
    width: auto !important;
    max-width: 260px !important;
    z-index: 20 !important;
    background: rgba(255, 255, 255, 0.94) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    padding: 14px 18px !important;
    border-radius: 16px !important;
    border: 1px solid rgba(0, 0, 0, 0.1) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1) !important;
  }

  .pp-hero-info .pp-hero-info-icon {
    display: none !important;
  }

  .pp-hero-info p {
    font-size: 14px !important;
    line-height: 1.35 !important;
    font-weight: 700 !important;
    color: #111111 !important;
    margin-bottom: 8px !important;
    text-align: right !important;
    white-space: normal !important;
  }

  .pp-hero-info .pp-hero-sm-btn-wrap {
    margin-top: 4px !important;
    display: block !important;
    width: auto !important;
  }

  .pp-hero-info .hero-badge-live {
    white-space: nowrap !important;
  }
}

/* ─── 5b. SURFACE PRO 7 & TALL TABLETS (912px x 1368px) ─── */
@media (min-width: 768px) and (max-width: 991px) and (min-height: 1200px) {
  .pp-style-2 .pp-hero-title-box {
    padding-top: 400px !important;
    position: relative !important;
    z-index: 1 !important;
    text-align: center !important;
  }
  .pp-style-2 .pp-hero-title {
    font-size: 155px !important;
    letter-spacing: -4px !important;
    white-space: nowrap !important;
    text-align: center !important;
    padding-top:200px
  }
  .pp-style-2 .pp-hero-thumbnail {
    height: 84vh !important;
    height: 84dvh !important;
  }
  .pp-style-2 .pp-hero-thumbnail img,
  img.pp-hero-person,
  img#pp-hero-person-move,
  .pp-hero-person,
  #pp-hero-person-move {
    width: 75% !important;
    min-width: 75% !important;
    max-width: 600px !important;
    transform: scale(1.) !important;
    transform-origin: bottom center !important;
  }
}

/* ─── 6. IPAD PRO & LARGE TABLETS (1024px - 1366px) ─── */
@media (min-width: 1024px) and (max-width: 1366px) and (orientation: portrait), (min-width: 992px) and (max-width: 1199px) {
  .pp-hero-area,
  section#home,
  .pp-style-2.pp-hero-height {
    min-height: 100vh !important;
    min-height: 100dvh !important;
    height: 100vh !important;
    height: 100dvh !important;
    position: relative !important;
    overflow: hidden !important;
  }

  .pp-style-2 .pp-hero-title-box {
    padding-top: 300px !important;
    position: relative !important;
    z-index: 1 !important;
    text-align: center !important;
  }

  .pp-style-2 .pp-hero-title {
    font-size: 180px !important;
    letter-spacing: -4px !important;
    white-space: nowrap !important;
    text-align: center !important;
  }

  .pp-style-2 .pp-hero-thumbnail {
    position: absolute !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    bottom: 0 !important;
    top: auto !important;
    margin: 0 !important;
    width: 100% !important;
    height: 84vh !important;
    height: 84dvh !important;
    z-index: 5 !important;
    display: flex !important;
    justify-content: center !important;
    align-items: flex-end !important;
  }

  .pp-style-2 .pp-hero-thumbnail img,
  img.pp-hero-person,
  img#pp-hero-person-move,
  .pp-hero-person,
  #pp-hero-person-move {
    width: 72% !important;
    min-width: 72% !important;
    max-width: 620px !important;
    height: auto !important;
    display: block !important;
    margin: 0 auto !important;
    object-fit: contain !important;
    object-position: bottom center !important;
    transform: scale(1.4) !important;
    transform-origin: bottom center !important;
  }

  .pp-hero-bottom-wrap {
    position: absolute !important;
    bottom: 30px !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    padding: 0 40px !important;
    z-index: 20 !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: flex-end !important;
    pointer-events: none !important;
  }

  .pp-hero-social-box,
  .pp-hero-info {
    pointer-events: auto !important;
  }

  .pp-hero-social-box {
    position: relative !important;
    left: 0 !important;
    bottom: 0 !important;
    z-index: 20 !important;
  }

  .pp-hero-info {
    position: relative !important;
    right: 0 !important;
    bottom: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important;
    text-align: right !important;
    width: auto !important;
    max-width: 290px !important;
    z-index: 20 !important;
    background: rgba(255, 255, 255, 0.94) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    padding: 16px 20px !important;
    border-radius: 18px !important;
    border: 1px solid rgba(0, 0, 0, 0.1) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1) !important;
  }

  .pp-hero-info .pp-hero-info-icon {
    display: none !important;
  }

  .pp-hero-info p {
    font-size: 15px !important;
    line-height: 1.35 !important;
    font-weight: 700 !important;
    color: #111111 !important;
    margin-bottom: 8px !important;
    text-align: right !important;
    white-space: normal !important;
  }

  .pp-hero-info .pp-hero-sm-btn-wrap {
    margin-top: 4px !important;
    display: block !important;
    width: auto !important;
  }

  .pp-hero-info .hero-badge-live {
    white-space: nowrap !important;
  }
}

/* ══════════════════════════════════════════════════════
   GLOBAL HOVER & HIGHLIGHT ACCENTS (#b58236 ONLY)
══════════════════════════════════════════════════════ */
.tp-social-link a:hover, .pp-footer-social a:hover {
  color: #b58236 !important;
  border-color: #b58236 !important;
}
.active > a, .current-menu-item > a { color: #b58236 !important; }
.tp-main-menu nav > ul > li > a:hover,
.pp-main-menu nav > ul > li > a:hover { color: #b58236 !important; }
.pp-section-subtitle, .pp-hero-subtitle,
.cr-hero-subtitle, .tp-section-subtitle { color: #b58236 !important; }
.pp-section-subtitle i,
.pp-style-2 .pp-section-subtitle i {
  color: #b58236 !important;
  background: rgba(181, 130, 54, 0.15) !important;
}
.pp-section-subtitle i svg circle,
.pp-style-2 .pp-section-subtitle i svg circle {
  fill: #b58236 !important;
}

/* ══════════════════════════════════════════════════════
   SCROLLBAR
══════════════════════════════════════════════════════ */
::-webkit-scrollbar-thumb { background: #333333 !important; }
::-webkit-scrollbar-thumb:hover { background: #b58236 !important; }

/* ─── RESPONSIVE PILL BAR STYLES FOR MOBILE & TABLETS ─── */
@media (max-width: 767px) {
  .bdr-pill-middle-col {
    border-left: none !important;
    border-right: none !important;
    border-top: 1px solid rgba(255, 255, 255, 0.12) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12) !important;
    padding-top: 14px !important;
    padding-bottom: 14px !important;
    margin-top: 14px !important;
    margin-bottom: 14px !important;
  }
}

/* ══════════════════════════════════════════════════════
   HERO MOBILE 100VH FULL FOLD WITH TEXT OVERLAPPING IMAGE
   1. 100vh height: Keeps About / Ticker section completely below fold.
   2. 78vh image height: Image stays BIG, bottom-anchored, head overlaps text.
══════════════════════════════════════════════════════ */
@media (max-width: 991px) {
  .pp-hero-area,
  section#home,
  .pp-style-2.pp-hero-height {
    min-height: 100vh !important;
    min-height: 100dvh !important;
    height: 100vh !important;
    height: 100dvh !important;
    position: relative !important;
    overflow: hidden !important;
  }

  /* Position title text in top fold area */
  .pp-style-2 .pp-hero-title-box {
    padding-top: 180px !important;
    position: relative !important;
    z-index: 1 !important;
  }

  /* Bottom anchored 78vh image container so head overlaps BD RATHORE text */
  .pp-style-2 .pp-hero-thumbnail {
    position: absolute !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    bottom: 0 !important;
    top: auto !important;
    margin: 0 !important;
    width: 100% !important;
    height: 78vh !important;
    height: 78dvh !important;
    z-index: 5 !important;
    display: flex !important;
    justify-content: center !important;
    align-items: flex-end !important;
  }

  .pp-style-2 .pp-hero-thumbnail img,
  img.pp-hero-person,
  img#pp-hero-person-move,
  .pp-hero-person,
  #pp-hero-person-move {
    height: 78vh !important;
    height: 78dvh !important;
    width: auto !important;
    max-width: none !important;
    min-width: 120% !important;
    object-fit: contain !important;
    object-position: bottom center !important;
    display: block !important;
    margin: 0 auto !important;
    transform: scale(1.1) !important;
    transform-origin: bottom center !important;
  }

  .pp-hero-bottom-wrap {
    position: absolute !important;
    bottom: 15px !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 10 !important;
    width: 100% !important;
    padding: 0 15px !important;
  }
}




/* ══════════════════════════════════════════════════════
   UNIFIED BADGE TITLE & CIRCULAR GOLD DOT STYLE (ALL PAGES)
══════════════════════════════════════════════════════ */
.tp-badge-dot,
.pp-section-subtitle,
.md-section-subtitle,
.tp-service-2-subtitle {
  display: inline-flex !important;
  align-items: center !important;
  font-family: 'Inter', 'Syne', sans-serif !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  color: #b58236 !important;
  margin-bottom: 15px !important;
}

.tp-badge-dot::before,
.md-section-subtitle::before,
.tp-service-2-subtitle::before {
  content: "" !important;
  display: inline-block !important;
  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;
  min-height: 24px !important;
  border-radius: 50% !important;
  background-color: rgba(181, 130, 54, 0.18) !important;
  background-image: radial-gradient(circle, #b58236 4px, transparent 4.5px) !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  margin-right: 12px !important;
}

.pp-section-subtitle i {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;
  min-height: 24px !important;
  border-radius: 50% !important;
  background: rgba(181, 130, 54, 0.18) !important;
  margin-right: 12px !important;
  font-style: normal !important;
}


/* ══════════════════════════════════════════════════════
   MINIMAL ELEGANT STORYLINE TIMELINE (DARK THEME #07090E)
══════════════════════════════════════════════════════ */
.timeline-story-section {
  position: relative;
  background-color: #07090e !important; /* Deep Obsidian Black */
  color: #ffffff !important;
  padding-top: 100px;
  padding-bottom: 120px;
}

.timeline-wrapper {
  position: relative;
  max-width: 1180px;
  margin: 0 auto;
  padding: 60px 0 20px;
}

/* Center Line Track */
.timeline-center-line {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  width: 2px;
  background: rgba(181, 130, 54, 0.25);
  transform: translateX(-50%);
  z-index: 2;
}

/* Scroll Progress Fill Line */
.timeline-line-fill {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 0%;
  background: #b58236;
  box-shadow: 0 0 12px rgba(181, 130, 54, 0.7);
  transition: height 0.1s linear;
}

/* Timeline Node Circle Dot Marker on Line */
.timeline-node-pointer {
  position: absolute;
  left: 50%;
  top: 40px;
  transform: translate(-50%, -50%);
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #151d2a;
  border: 2.5px solid #b58236;
  z-index: 5;
  transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.timeline-item.active-node .timeline-node-pointer {
  background: #b58236;
  border-color: #ffffff;
  box-shadow: 0 0 20px rgba(181, 130, 54, 0.95);
  transform: translate(-50%, -50%) scale(1.35);
}



/* Year Display - Large Serif Heading */
.timeline-year-heading {
  font-family: 'Playfair Display', 'Syne', serif;
  font-size: 84px;
  font-weight: 700;
  color: #b58236;
  line-height: 1;
  letter-spacing: -1px;
  margin-bottom: 24px;
}

/* Milestone Event List */
.timeline-event-list {
  list-style: none;
  padding: 0;
  margin: 0 0 25px 0;
}

.timeline-event-item {
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: #f1f5f9;
  padding: 14px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.timeline-event-item:last-child {
  border-bottom: none;
}

/* Compact Polaroid Photo Card */
.timeline-polaroid-card {
  position: relative;
  display: inline-block;
  background: #111827;
  padding: 12px 12px 24px 12px;
  border-radius: 16px;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5);
  border: 1px solid rgba(255, 255, 255, 0.1);
  transition: transform 0.4s ease, box-shadow 0.4s ease;
}

.timeline-polaroid-card img {
  width: 260px;
  height: 180px;
  object-fit: cover;
  border-radius: 10px;
  display: block;
}

.timeline-polaroid-caption {
  margin-top: 14px;
  font-family: 'Caveat', cursive, sans-serif;
  font-size: 20px;
  color: #b58236;
  font-weight: 700;
  line-height: 1.2;
}

.timeline-tilt-left { transform: rotate(-3deg); }
.timeline-tilt-right { transform: rotate(3deg); }

.timeline-polaroid-card:hover {
  transform: rotate(0deg) scale(1.04) translateY(-6px);
  box-shadow: 0 25px 55px rgba(181, 130, 54, 0.3);
  border-color: rgba(181, 130, 54, 0.5);
}


/* Responsive adjustments */
@media (max-width: 991px) {
  .timeline-center-line {
    left: 20px;
    transform: none;
  }
  .timeline-node-pointer {
    left: 20px;
  }
  .timeline-wrapper {
    padding-left: 45px;
  }
  .timeline-year-heading {
    font-size: 60px;
  }
  .timeline-polaroid-card img {
    width: 100%;
    height: 200px;
  }
}

/* ══════════════════════════════════════════════════════
   TRUST METRICS DASHBOARD GRID
══════════════════════════════════════════════════════ */
.trust-metrics-section {
  background: #ffffff !important;
  padding-top: 90px;
  padding-bottom: 90px;
}

.trust-metrics-card-wrapper {
  background: linear-gradient(135deg, #0b0f19 0%, #151d30 100%) !important;
  border-radius: 32px;
  border: 1px solid rgba(181, 130, 54, 0.3);
  padding: 65px 55px;
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.22);
  position: relative;
  overflow: hidden;
}

.trust-metrics-card-wrapper::before {
  content: '';
  position: absolute;
  top: -120px;
  right: -120px;
  width: 350px;
  height: 350px;
  background: radial-gradient(circle, rgba(181, 130, 54, 0.25) 0%, transparent 70%);
  pointer-events: none;
}

.metric-glass-card {
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 22px;
  padding: 35px 28px;
  transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  height: 100%;
}

.metric-glass-card:hover {
  transform: translateY(-8px);
  background: rgba(255, 255, 255, 0.07);
  border-color: rgba(181, 130, 54, 0.6);
  box-shadow: 0 20px 45px rgba(181, 130, 54, 0.2);
}

.metric-icon-box {
  width: 52px;
  height: 52px;
  border-radius: 14px;
  background: rgba(181, 130, 54, 0.15);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #b58236;
  margin-bottom: 20px;
}

.metric-number-val {
  font-family: 'Syne', sans-serif;
  font-size: 48px;
  font-weight: 800;
  color: #ffffff;
  line-height: 1;
  margin-bottom: 8px;
}

.metric-label-text {
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #b58236;
  margin-bottom: 6px;
}

.metric-desc-text {
  font-size: 13px;
  color: #94a3b8;
  line-height: 1.5;
}

/* ══════════════════════════════════════════════════════
   CORE PILLARS OF ADVISORY PROTECTION SECTION
══════════════════════════════════════════════════════ */
.pillars-section {
  background-color: #ffffff !important;
  color: #0f172a !important;
  padding-top: 100px !important;
  padding-bottom: 100px !important;
}


.pillar-card {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 24px;
  padding: 40px 35px;
  height: 100%;
  transition: all 0.4s ease;
  position: relative;
  overflow: hidden;
}

.pillar-card::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0%;
  height: 3px;
  background: #b58236;
  transition: width 0.4s ease;
}

.pillar-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 20px 45px rgba(0, 0, 0, 0.08);
  border-color: rgba(181, 130, 54, 0.35);
  background: #ffffff;
}

.pillar-card:hover::after {
  width: 100%;
}

.pillar-icon-wrap {
  width: 60px;
  height: 60px;
  border-radius: 18px;
  background: rgba(181, 130, 54, 0.12);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #b58236;
  margin-bottom: 25px;
}

.pillar-title {
  font-family: 'Syne', sans-serif;
  font-size: 20px;
  font-weight: 800;
  color: #0f172a;
  margin-bottom: 12px;
}

.pillar-desc {
  font-size: 15px;
  color: #475569;
  line-height: 1.65;
}

/* Podcast Section Explore All Button */
.podcast-explore-btn {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  background: #ffffff !important;
  color: #0b0e14 !important;
  padding: 11px 32px;
  border-radius: 50px;
  box-shadow: 0 10px 25px rgba(255, 255, 255, 0.15);
  transition: all 0.35s ease;
  text-decoration: none !important;
  border: 2px solid #ffffff;
  font-size: 15px;
}
.podcast-explore-btn:hover {
  background: #b58236 !important;
  color: #ffffff !important;
  border-color: #b58236 !important;
  box-shadow: 0 10px 25px rgba(181, 130, 54, 0.35);
  transform: translateY(-3px);
}
.podcast-explore-btn .arrow {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #0b0e14;
  color: #ffffff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
  font-size: 13px;
}
.podcast-explore-btn:hover .arrow {
  background: #ffffff;
  color: #b58236;
  transform: translateX(4px);
}

/* ══════════════════════════════════════════════════════
   GLOBAL UNIFORM HEADER CONTACT LINK HOVER (TEXT + LINE BOTH GOLD)
══════════════════════════════════════════════════════ */
.tp-header-mail a,
.tp-header-mail a.tp-line-black,
header .tp-header-mail a,
header #header-sticky .tp-header-mail a,
header #header-sticky.tp-header-7-style .tp-header-mail a,
.header-on-light .tp-header-mail a,
.tp-header-area .tp-header-mail a {
  color: #0f172a !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  position: relative !important;
  display: inline-block !important;
  transition: color 0.3s ease !important;
  padding-bottom: 2px !important;
}

.tp-header-mail a::after,
.tp-header-mail a.tp-line-black::after,
header .tp-header-mail a::after,
header #header-sticky .tp-header-mail a::after,
header #header-sticky.tp-header-7-style .tp-header-mail a::after,
.header-on-light .tp-header-mail a::after,
.tp-header-area .tp-header-mail a::after {
  content: '' !important;
  position: absolute !important;
  left: 0 !important;
  bottom: 0 !important;
  width: 0% !important;
  height: 2px !important;
  background-color: #b58236 !important;
  transition: width 0.3s ease !important;
}

.tp-header-mail a:hover,
.tp-header-mail a.tp-line-black:hover,
header .tp-header-mail a:hover,
header #header-sticky .tp-header-mail a:hover,
header #header-sticky.tp-header-7-style .tp-header-mail a:hover,
.header-on-light .tp-header-mail a:hover,
.tp-header-area .tp-header-mail a:hover {
  color: #b58236 !important;
}

.tp-header-mail a:hover::after,
.tp-header-mail a.tp-line-black:hover::after,
header .tp-header-mail a:hover::after,
header #header-sticky .tp-header-mail a:hover::after,
header #header-sticky.tp-header-7-style .tp-header-mail a:hover::after,
.header-on-light .tp-header-mail a:hover::after,
.tp-header-area .tp-header-mail a:hover::after {
  width: 100% !important;
}

/* ══════════════════════════════════════════════════════
   GLOBAL STICKY HEADER SCROLL VISIBILITY FIX (ALL PAGES)
══════════════════════════════════════════════════════ */
header #header-sticky.header-sticky,
#header-sticky.header-sticky {
  background: #ffffff !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08) !important;
}

header #header-sticky.header-sticky .tp-header-mail a,
header #header-sticky.header-sticky .tp-header-mail a.tp-line-black,
header #header-sticky.header-sticky.header-on-dark .tp-header-mail a {
  color: #0f172a !important;
}

header #header-sticky.header-sticky .tp-header-bar,
header #header-sticky.header-sticky .tp-header-bar span,
header #header-sticky.header-sticky.header-on-dark .tp-header-bar,
header #header-sticky.header-sticky.header-on-dark .tp-header-bar span {
  color: #0f172a !important;
  border-color: rgba(15, 23, 42, 0.3) !important;
}

header #header-sticky.header-sticky .tp-header-bar svg path,
header #header-sticky.header-sticky.header-on-dark .tp-header-bar svg path {
  fill: #0f172a !important;
}

header #header-sticky.header-sticky.header-on-dark .logo-for-light {
  display: block !important;
}
header #header-sticky.header-sticky.header-on-dark .logo-for-dark {
  display: none !important;
}

header #header-sticky.header-sticky .tp-header-mail a:hover,
header #header-sticky.header-sticky.header-on-dark .tp-header-mail a:hover {
  color: #b58236 !important;
}

header #header-sticky.header-sticky .tp-header-bar:hover,
header #header-sticky.header-sticky .tp-header-bar:hover span,
header #header-sticky.header-sticky.header-on-dark .tp-header-bar:hover,
header #header-sticky.header-sticky.header-on-dark .tp-header-bar:hover span {
  color: #b58236 !important;
  border-color: #b58236 !important;
}

header #header-sticky.header-sticky .tp-header-bar:hover svg path,
header #header-sticky.header-sticky.header-on-dark .tp-header-bar:hover svg path {
  fill: #b58236 !important;
}