/* ==========================================================================
   PERFORMANCE MARKETING PAGE STYLES
   Pixel-perfect match to reference design:
   - 3D angled laptop on volcanic rock pedestal with purple neon underglow
   - High-fidelity live analytics dashboard (Revenue, ROAS, CPA, Campaigns)
   - Floating metric cards & 3D brand badges (Google Ads, Meta Ads)
   - Handwritten annotations & channel verification strip
   ========================================================================== */

:root {
  --pm-primary-purple: var(--color-accent-purple-dark);
  --pm-accent-pink: #EC4899;
  --pm-accent-orange: #F97316;
  --pm-dark: var(--text-primary);
  --pm-slate: var(--text-muted);
  --pm-border: rgba(226, 232, 240, 0.95);
  --pm-card-bg: var(--bg-primary);
}

body.pmPage {
  margin: 0;
  padding: 0;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  color: var(--pm-dark);
  background-color: var(--bg-primary);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

/* ==========================================================================
   HERO SECTION
   ========================================================================== */
.pmHero {
  position: relative;
  overflow: hidden;
  padding: clamp(52px, 6vw, 76px) 24px clamp(72px, 8vw, 96px);
  background: var(--bg-primary);
  background-image:
    radial-gradient(circle at 12% 16%, rgba(109, 40, 217, 0.045) 0%, transparent 45%),
    radial-gradient(circle at 88% 30%, rgba(236, 72, 153, 0.04) 0%, transparent 45%),
    linear-gradient(180deg, #FFFFFF 0%, #FAF8FF 50%, #FFFFFF 100%);
  border-bottom: 1px solid rgba(226, 232, 240, 0.8);
}

.pmHero__ambientGlow {
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
  filter: blur(80px);
  z-index: 1;
}

.pmHero__ambientGlow--left {
  width: 500px;
  height: 500px;
  top: -120px;
  left: -120px;
  background: radial-gradient(circle, rgba(109, 40, 217, 0.08) 0%, transparent 70%);
}

.pmHero__ambientGlow--right {
  width: 600px;
  height: 600px;
  top: 5%;
  right: -100px;
  background: radial-gradient(circle, rgba(236, 72, 153, 0.07) 0%, rgba(124, 58, 237, 0.05) 50%, transparent 70%);
}

.pmHero__container {
  width: min(var(--cybro-container, 1380px), 100%);
  margin: 28px auto 0;
  padding-top: 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
  position: relative;
  z-index: 2;
  box-sizing: border-box;
}

/* ==========================================================================
   LEFT COLUMN: CONTENT & CONVERSION DRIVERS
   ========================================================================== */
.pmHero__content {
  flex: 0 0 48%;
  max-width: 48%;
  display: flex;
  flex-direction: column;
}

/* Eyebrow Pill */
.pmHero__eyebrow {
  margin-bottom: 18px;
}

.pmHero__eyebrowPill {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
  font-size: 11.5px !important;
  font-weight: 750 !important;
  letter-spacing: 0.14em !important;
  color: #7C3AED !important;
  text-transform: uppercase !important;
  box-shadow: none !important;
}

.pmHero__eyebrowIcon {
  display: grid;
  place-items: center;
  color: var(--color-accent-purple);
}

/* H1 Heading */
.pmHero__title {
  margin: 0 0 16px 0;
  font-size: clamp(2.4rem, 3.8vw, 3.45rem);
  font-weight: 900;
  line-height: 1.12;
  letter-spacing: -0.04em;
  color: var(--text-primary);
}

.pmHero__titleLine {
  display: inline;
}

.pmHero__titleGradient {
  display: inline-block;
  white-space: nowrap;
  background: linear-gradient(90deg, #6D28D9 0%, #C026D3 35%, #EC4899 68%, #F97316 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
  filter: drop-shadow(0 4px 18px rgba(124, 58, 237, 0.14));
}

/* Subtitle */
.pmHero__desc {
  margin: 0 0 28px 0;
  font-size: 1.08rem;
  line-height: 1.55;
  color: var(--text-secondary);
  max-width: 540px;
}

/* Actions Row */
.pmHero__actions {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 32px;
  flex-wrap: wrap;
}

.pmBtn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 14px 28px;
  border-radius: var(--radius-pill);
  font-size: 15px;
  font-weight: 750;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
  box-sizing: border-box;
}

.pmBtn__arrow {
  transition: transform var(--transition-fast);
  font-size: 16px;
}

.pmBtn:hover .pmBtn__arrow {
  transform: translateX(4px);
}

.pmBtn--primary {
  background: linear-gradient(135deg, #6D28D9 0%, #8B5CF6 25%, #EC4899 65%, #F97316 100%);
  color: var(--text-on-dark);
  box-shadow:
    0 10px 28px rgba(109, 40, 217, 0.35),
    inset 0 1px 0 rgba(255, 255, 255, 0.3);
}

.pmBtn--primary:hover {
  transform: translateY(-2px);
  box-shadow:
    0 14px 34px rgba(109, 40, 217, 0.45),
    inset 0 1px 0 rgba(255, 255, 255, 0.4);
}

.pmBtn--secondary {
  background: var(--bg-primary);
  color: var(--text-primary);
  border: 1px solid rgba(226, 232, 240, 0.95);
  box-shadow: 0 4px 14px rgba(45, 51, 95, 0.04);
}

.pmBtn--secondary:hover {
  transform: translateY(-2px);
  border-color: var(--border-strong);
  box-shadow: 0 8px 20px rgba(45, 51, 95, 0.08);
}

/* Channel Badges Strip */
.pmHero__channelStrip {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 24px;
  flex-wrap: wrap;
}

.pmChannel {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.pmChannel__icon {
  display: grid;
  place-items: center;
  line-height: 1;
}

.pmChannel__text {
  font-size: 12.5px;
  font-weight: 700;
  color: #334155;
  letter-spacing: -0.01em;
}

.pmChannel__dot {
  color: #A855F7;
  font-size: 13px;
  line-height: 1;
}

/* Bottom Quote */
.pmHero__quoteRow {
  display: flex;
  align-items: center;
  gap: 10px;
  padding-top: 6px;
}

.pmHero__quoteBar {
  width: 3px;
  height: 22px;
  background: linear-gradient(180deg, #F97316 0%, #EC4899 100%);
  border-radius: 2px;
}

.pmHero__quoteIcon {
  display: grid;
  place-items: center;
  color: var(--color-accent-purple);
}

.pmHero__quoteText {
  font-size: 14.5px;
  font-weight: 650;
  color: #334155;
  letter-spacing: -0.01em;
}

/* ==========================================================================
   RIGHT COLUMN: 3D LAPTOP & DASHBOARD SCENE
   ========================================================================== */
.pmHero__visual {
  flex: 0 0 52%;
  max-width: 52%;
  position: relative;
  min-height: 600px;
  display: flex;
  align-items: center;
  justify-content: center;
  perspective: 1400px;
}

/* Top-Right Handwritten Annotation Doodle */
.pmHero__doodle {
  position: absolute;
  top: 10px;
  right: 18px;
  z-index: 6;
  text-align: right;
  pointer-events: none;
}

.pmHero__doodleLines {
  font-family: 'Caveat', 'Dancing Script', cursive;
  font-size: 21px;
  font-weight: 700;
  color: var(--color-accent-purple-dark);
  line-height: 1.15;
  display: flex;
  flex-direction: column;
  transform: rotate(-3deg);
}

.pmHero__doodleArrow {
  width: 44px;
  height: 52px;
  margin-top: 2px;
  margin-right: 14px;
  transform: rotate(5deg);
}

/* Floating Metric Cards */
.pmCard {
  background: var(--bg-primary);
  border: 1px solid rgba(226, 232, 240, 0.95);
  border-radius: 16px;
  padding: 12px 14px;
  box-shadow:
    0 14px 34px rgba(45, 51, 95, 0.09),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
  position: absolute;
  z-index: 5;
  box-sizing: border-box;
  backdrop-filter: blur(8px);
  transition: transform 0.3s ease;
}

.pmCard:hover {
  transform: translateY(-3px);
}

/* Floating Card 1: +340% Qualified Leads */
.pmCard--leads {
  top: 36px;
  left: 28%;
  width: 172px;
}

.pmCard__top {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
}

.pmCard__icon {
  width: 28px;
  height: 28px;
  border-radius: var(--radius-sm);
  display: grid;
  place-items: center;
  flex-shrink: 0;
}

.pmCard__icon--purple {
  background: #F3E8FF;
  color: var(--color-accent-purple);
}

.pmCard__icon--orange {
  background: #FFF7ED;
  color: #F97316;
}

.pmCard__info {
  display: flex;
  flex-direction: column;
}

.pmCard__value {
  font-size: 15.5px;
  font-weight: 900;
  color: var(--text-primary);
  line-height: 1.1;
}

.pmCard__label {
  font-size: 10.5px;
  font-weight: 650;
  color: var(--text-muted);
  white-space: nowrap;
}

.pmCard__arrowBtn {
  margin-left: auto;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  display: grid;
  place-items: center;
}

.pmCard__arrowBtn.green {
  background: #ECFDF5;
  color: #059669;
}

.pmCard__sparkline svg {
  width: 100%;
  height: 22px;
  display: block;
}

/* Floating Card 3: Profitable Campaigns */
.pmCard--campaigns {
  top: 38%;
  left: -20px;
  width: 136px;
  padding: 12px 12px 10px;
}

.pmCard__campaignHeader {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}

.pmCard__targetIcon {
  width: 26px;
  height: 26px;
  border-radius: 7px;
  background: #FFE4E6;
  color: #E11D48;
  display: grid;
  place-items: center;
  flex-shrink: 0;
}

.pmCard__campaignTitle {
  font-size: 11px;
  font-weight: 800;
  color: var(--text-primary);
  line-height: 1.2;
}

.pmCard__barChart {
  display: flex;
  align-items: flex-end;
  gap: 4px;
  height: 24px;
}

.pmCard__barChart .bar {
  flex: 1;
  background: linear-gradient(180deg, #7C3AED 0%, #C026D3 100%);
  border-radius: 2px;
}

.pmCard__barChart .b1 { height: 35%; opacity: 0.6; }
.pmCard__barChart .b2 { height: 50%; opacity: 0.75; }
.pmCard__barChart .b3 { height: 70%; opacity: 0.9; }
.pmCard__barChart .b4 { height: 85%; }
.pmCard__barChart .b5 { height: 100%; }

/* Floating Card 5: +220% Sales Growth */
.pmCard--sales {
  top: 42%;
  right: -10px;
  width: 165px;
}

/* Floating 3D Brand Badges */
.pmBadge3D {
  background: var(--bg-primary);
  border: 1px solid rgba(226, 232, 240, 0.95);
  border-radius: 14px;
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  position: absolute;
  z-index: 5;
  box-shadow:
    0 10px 24px rgba(45, 51, 95, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
  animation: pmBadgeFloat 4s ease-in-out infinite alternate;
}

.pmBadge3D--google {
  top: 18%;
  left: 10%;
  animation-delay: 0s;
}

.pmBadge3D--meta {
  bottom: 22%;
  left: 6%;
  animation-delay: 1.2s;
}

.pmBadge3D--chart {
  bottom: 18%;
  right: 6%;
  width: 38px;
  height: 38px;
  border-radius: 11px;
  animation-delay: 2.2s;
}

@keyframes pmBadgeFloat {
  0% { transform: translateY(0px) rotate(0deg); }
  100% { transform: translateY(-7px) rotate(2deg); }
}

/* ==========================================================================
   CENTRAL 3D LAPTOP & DASHBOARD
   ========================================================================== */
.pmLaptopMockup {
  position: relative;
  z-index: 3;
  width: 535px;
  transform: perspective(1400px) rotateY(-14deg) rotateX(6deg) rotateZ(-1deg);
  transform-style: preserve-3d;
  transition: transform 0.25s ease-out;
  margin-top: 15px;
  margin-bottom: 30px;
}

/* Screen Lid */
.pmLaptop__screenLid {
  background: var(--bg-dark);
  border: 4px solid #1E293B;
  border-radius: 16px 16px 4px 4px;
  padding: 6px;
  box-shadow:
    0 24px 50px rgba(15, 23, 42, 0.35),
    0 0 0 1px rgba(255, 255, 255, 0.1);
  position: relative;
}

.pmLaptop__screenBezel {
  background: var(--bg-primary);
  border-radius: 11px;
  overflow: hidden;
  position: relative;
}

/* Top Notch & Camera */
.pmLaptop__notch {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 60px;
  height: 9px;
  background: var(--bg-dark);
  border-radius: 0 0 6px 6px;
  z-index: 10;
  display: grid;
  place-items: center;
}

.pmLaptop__camera {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #334155;
  box-shadow: inset 0 0 1px #000;
}

/* 3D Keyboard Base Deck */
.pmLaptop__deck {
  position: relative;
  width: 104%;
  left: -2%;
  height: 64px;
  background: linear-gradient(180deg, #CBD5E1 0%, #94A3B8 35%, #64748B 75%, #475569 100%);
  border-radius: 0 0 16px 16px;
  transform: perspective(600px) rotateX(46deg);
  transform-origin: top center;
  box-shadow:
    0 16px 36px rgba(0, 0, 0, 0.4),
    inset 0 1px 0 rgba(255, 255, 255, 0.7);
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 4px 16px;
  box-sizing: border-box;
}

.pmLaptop__deckHinge {
  width: 110px;
  height: 5px;
  background: #1E293B;
  border-radius: 0 0 4px 4px;
}

.pmLaptop__deckKeys {
  width: 84%;
  height: 22px;
  background: #1E293B;
  border-radius: 3px;
  margin-top: 4px;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.6);
  opacity: 0.88;
}

.pmLaptop__deckTrackpad {
  width: 72px;
  height: 18px;
  background: rgba(248, 250, 252, 0.45);
  border: 1px solid rgba(148, 163, 184, 0.6);
  border-radius: 3px;
  margin-top: 4px;
}

.pmLaptop__deckNotch {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 44px;
  height: 3px;
  background: #334155;
  border-radius: 3px 3px 0 0;
}

/* Volcanic Rock Pedestal Base */
.pmRockPedestal {
  position: absolute;
  bottom: -32px;
  right: -10px;
  width: 610px;
  z-index: 2;
  pointer-events: none;
}

.pmRockPedestal__img {
  width: 100%;
  height: auto;
  display: block;
  filter: drop-shadow(0 0 35px rgba(168, 85, 247, 0.45));
}

.pmRockPedestal__neonGlow {
  position: absolute;
  bottom: 12px;
  left: 10%;
  right: 10%;
  height: 44px;
  background: radial-gradient(ellipse at 50% 50%, rgba(192, 38, 211, 0.65) 0%, rgba(124, 58, 237, 0.35) 45%, transparent 70%);
  filter: blur(14px);
  pointer-events: none;
}

/* ==========================================================================
   LIVE PERFORMANCE DASHBOARD
   ========================================================================== */
.pmDash {
  padding: 10px 14px 12px;
  background: #FAF8FF;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  user-select: none;
}

/* Nav */
.pmDash__nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
  padding-bottom: 6px;
  border-bottom: 1px solid rgba(226, 232, 240, 0.85);
}

.pmDash__logo {
  display: flex;
  align-items: center;
  gap: 6px;
}

.pmDash__logoIcon {
  width: 17px;
  height: 17px;
  border-radius: 5px;
  background: var(--color-accent-purple);
  color: var(--text-on-dark);
  font-weight: 900;
  font-size: 9px;
  display: grid;
  place-items: center;
}

.pmDash__logoText {
  font-size: 9.5px;
  font-weight: 900;
  letter-spacing: 0.08em;
  color: var(--text-primary);
}

.pmDash__navTabs {
  display: flex;
  align-items: center;
  gap: 12px;
}

.pmDash__navTab {
  font-size: 9px;
  font-weight: 650;
  color: var(--text-muted);
  cursor: pointer;
}

.pmDash__navTab.active {
  color: var(--color-accent-purple-dark);
  border-bottom: 1.5px solid var(--color-accent-purple-dark);
  padding-bottom: 2px;
}

.pmDash__datePill {
  display: flex;
  align-items: center;
  gap: 4px;
  background: var(--bg-primary);
  border: 1px solid rgba(226, 232, 240, 0.95);
  border-radius: var(--radius-pill);
  padding: 2px 7px;
  font-size: 8px;
  font-weight: 700;
  color: #334155;
}

/* Metrics Row 1 */
.pmDash__metricsRow1 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-bottom: 8px;
}

.pmDashCard {
  background: var(--bg-primary);
  border: 1px solid rgba(226, 232, 240, 0.9);
  border-radius: 10px;
  padding: 8px 10px 6px;
  box-shadow: 0 2px 6px rgba(45, 51, 95, 0.02);
  overflow: hidden;
  position: relative;
}

.pmDashCard__header {
  margin-bottom: 3px;
}

.pmDashCard__title {
  font-size: 8.5px;
  font-weight: 700;
  color: var(--text-muted);
}

.pmDashCard__statRow {
  display: flex;
  align-items: center;
  gap: 6px;
  position: relative;
  z-index: 2;
}

.pmDashCard__iconWrap {
  width: 20px;
  height: 20px;
  border-radius: 6px;
  display: grid;
  place-items: center;
}

.pmDashCard__iconWrap.purple {
  background: #F3E8FF;
  color: var(--color-accent-purple);
}

.pmDashCard__iconWrap.red {
  background: #FFE4E6;
  color: #E11D48;
}

.pmDashCard__mainValue {
  font-size: 15px;
  font-weight: 900;
  color: var(--text-primary);
  letter-spacing: -0.02em;
}

.pmDashCard__trend {
  font-size: 8px;
  font-weight: 750;
  padding: 1px 4px;
  border-radius: var(--radius-pill);
}

.pmDashCard__trend.green {
  background: #ECFDF5;
  color: #059669;
}

.pmDashCard__wave svg {
  width: 100%;
  height: 20px;
  display: block;
  margin-top: 2px;
}

/* Metrics Row 2 */
.pmDash__metricsRow2 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin-bottom: 10px;
}

.pmMiniStat {
  background: var(--bg-primary);
  border: 1px solid rgba(226, 232, 240, 0.9);
  border-radius: var(--radius-sm);
  padding: 6px 8px;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.pmMiniStat__top {
  display: flex;
  align-items: center;
  gap: 4px;
}

.pmMiniStat__iconWrap {
  width: 16px;
  height: 16px;
  border-radius: 4px;
  display: grid;
  place-items: center;
}

.pmMiniStat__iconWrap.purple {
  background: #F3E8FF;
  color: var(--color-accent-purple);
}

.pmMiniStat__iconWrap.red {
  background: #FFE4E6;
  color: #E11D48;
}

.pmMiniStat__title {
  font-size: 7.5px;
  font-weight: 650;
  color: var(--text-muted);
  white-space: nowrap;
}

.pmMiniStat__num {
  font-size: 12px;
  font-weight: 850;
  color: var(--text-primary);
}

.pmMiniStat__badge {
  font-size: 7.5px;
  font-weight: 750;
  align-self: flex-start;
  padding: 1px 4px;
  border-radius: var(--radius-pill);
  line-height: 1;
}

.pmMiniStat__badge.green {
  background: #ECFDF5;
  color: #059669;
}

/* Campaign Performance Table */
.pmDash__tableSection {
  background: var(--bg-primary);
  border: 1px solid rgba(226, 232, 240, 0.9);
  border-radius: 9px;
  padding: 8px 10px;
}

.pmDash__tableTitle {
  font-size: 9px;
  font-weight: 800;
  color: var(--text-primary);
  margin-bottom: 6px;
}

.pmDash__table {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.pmDash__row {
  display: grid;
  grid-template-columns: 2.3fr 1.1fr 1fr 1fr 0.9fr;
  align-items: center;
  font-size: 7.5px;
  padding: 2.5px 0;
  border-bottom: 1px solid rgba(241, 245, 249, 0.9);
}

.pmDash__row:last-child {
  border-bottom: none;
}

.pmDash__row--header {
  font-weight: 700;
  color: var(--text-subtle);
  border-bottom: 1px solid rgba(226, 232, 240, 0.85);
  padding-bottom: 3px;
}

.col-campaign {
  display: flex;
  align-items: center;
  gap: 4px;
  font-weight: 700;
  color: #1E293B;
}

.brandIcon {
  display: grid;
  place-items: center;
}

.roasPill {
  display: inline-block;
  background: #ECFDF5;
  color: #059669;
  font-weight: 800;
  padding: 1px 4px;
  border-radius: var(--radius-pill);
}

/* Mobile-only elements inside pmDash hidden on desktop and tablet */
.pmDash__sidebar,
.pmDash__trendChart {
  display: none;
}

.pmDash__bodyWrap,
.pmDash__mainContent {
  display: block;
}

/* ==========================================================================
   RESPONSIVE DESIGN
   ========================================================================== */
@media (max-width: 1180px) {
  .pmHero__container {
    flex-direction: column;
    gap: 48px;
    padding-top: 20px;
  }

  .pmHero__content {
    flex: none;
    max-width: 100%;
    width: 100%;
  }

  .pmHero__visual {
    flex: none;
    max-width: 100%;
    width: 100%;
    min-height: 520px;
  }

  .pmLaptopMockup {
    width: 480px;
    transform: none;
  }
}

@media (max-width: 768px) {
  .pmHero {
    padding: 24px 16px 48px;
  }

  .pmHero__title {
    font-size: 2.2rem;
  }

  .pmHero__desc {
    font-size: 0.95rem;
  }

  .pmHero__actions {
    flex-direction: column;
    align-items: stretch;
  }

  .pmBtn {
    justify-content: center;
  }

  .pmHero__channelStrip {
    gap: 8px;
  }

  .pmChannel__text {
    font-size: 11px;
  }

  .pmHero__visual {
    min-height: 420px;
  }

  .pmLaptopMockup {
    width: 100%;
    max-width: 360px;
  }

  .pmRockPedestal {
    width: 100%;
  }

  .pmCard--leads {
    left: 5%;
    top: 10px;
    width: 140px;
  }

  .pmCard--sales {
    right: 0;
    top: 50%;
    width: 135px;
  }

  .pmCard--campaigns {
    display: none;
  }

  .pmHero__doodle {
    right: 0;
  }
}


/* ==========================================================================
   SECTION 2: THE REAL PROBLEM (WHERE THE MONEY LEAKS)
   Clean zero-overlap architecture, full container width & exact reference match
   ========================================================================== */
.pmLeaks {
  --pm-gap: 24px;
  position: relative;
  overflow: hidden;
  padding: clamp(44px, 5vw, 64px) 24px;
  background: var(--bg-primary);
  background-image:
    radial-gradient(ellipse at 15% 20%, rgba(217, 70, 239, 0.025) 0%, transparent 50%),
    radial-gradient(ellipse at 85% 30%, rgba(244, 63, 94, 0.025) 0%, transparent 50%),
    linear-gradient(180deg, #FFFFFF 0%, #FAF8FF 50%, #FFFFFF 100%);
  border-top: 1px solid rgba(226, 232, 240, 0.8);
}

/* Full container width matching pmHero exactly */
.pmLeaks__container {
  width: min(var(--cybro-container, 1380px), 100%);
  margin: 0 auto;
  box-sizing: border-box;
  position: relative;
  z-index: 2;
}

/* Toggle desktop vs mobile views for The Root Problem section */
.pmLeaks__mobileView {
  display: none;
}

.pmLeaks__desktopView {
  display: block;
}

/* 1. Header */
.pmLeaks__header {
  text-align: center;
  max-width: 860px;
  margin: 0 auto 52px;
}

.pmLeaks__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 11px;
  font-weight: 750;
  letter-spacing: 0.22em;
  color: var(--text-subtle);
  text-transform: uppercase;
}

.pmLeaks__eyebrowDash {
  opacity: 0.6;
}

.pmLeaks__eyebrowNum,
.pmLeaks__eyebrowText {
  color: var(--text-muted);
  font-weight: 800;
}

/* H2 Headline */
.pmLeaks__title {
  font-family: var(--font-serif);
  font-size: clamp(2.1rem, 3vw, 2.9rem);
  font-weight: 850;
  line-height: 1.18;
  letter-spacing: -0.025em;
  color: var(--text-primary);
  margin: 0 0 12px 0;
}

.pmLeaks__titleGradient {
  display: inline-block;
  background: linear-gradient(90deg, #D946EF 0%, #EC4899 42%, #F97316 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.pmLeaks__subtitle {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 1.05rem;
  line-height: 1.5;
  color: var(--text-muted);
  margin: 0 auto;
  max-width: 620px;
}

/* 2. Pipeline Container: Zero Overlap Layout */
.pmLeaks__pipelineContainer {
  position: relative;
  width: 100%;
  margin: 0 auto;
  padding: 0 24px;
  box-sizing: border-box;
}

/* Pipe & Milestone Nodes Row */
.pmLeaks__pipeRow {
  position: relative;
  height: 124px;
  width: 100%;
}

/* 3D Pipe running behind nodes */
.pmLeaks__pipe {
  position: absolute;
  top: 17px;
  left: 0;
  right: 0;
  height: 14px;
  z-index: 1;
}

.pmLeaks__pipeCylinder {
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, #3730A3 0%, #1E1B4B 25%, #0F0E2A 50%, #1E1B4B 75%, #311B92 100%);
  border-radius: var(--radius-pill);
  box-shadow:
    inset 0 1.5px 2px rgba(255, 255, 255, 0.4),
    inset 0 -1.5px 2px rgba(0, 0, 0, 0.7),
    0 4px 12px rgba(15, 23, 42, 0.2);
}

.pmLeaks__pipeArrow {
  position: absolute;
  right: -26px;
  top: 50%;
  transform: translateY(-50%);
  display: grid;
  place-items: center;
  filter: drop-shadow(0 0 6px rgba(244, 63, 94, 0.5));
}

/* 4 Leak Columns on the Pipe: Exact center of each card below */
.pmLeaks__leaksRow {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--pm-gap);
  pointer-events: none;
  z-index: 2;
}

.pmLeaks__leakCol {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  height: 100%;
  padding-top: 14px;
}

.pmLeaks__collar {
  width: 14px;
  height: 20px;
  border-radius: 3px;
  background: linear-gradient(180deg, #F43F5E 0%, #E11D48 50%, #9F1239 100%);
  border: 1px solid rgba(255, 255, 255, 0.4);
  box-shadow:
    0 0 8px rgba(244, 63, 94, 0.7),
    inset 0 1px 0 rgba(255, 255, 255, 0.6);
  flex-shrink: 0;
}

.pmLeaks__drip {
  position: relative;
  width: 14px;
  height: 15px;
  display: flex;
  justify-content: center;
  flex-shrink: 0;
}

.pmLeaks__droplet {
  width: 9px;
  height: 12px;
  background: linear-gradient(180deg, #FB7185 0%, #F43F5E 100%);
  border-radius: 50% 50% 50% 50% / 30% 30% 70% 70%;
  transform: rotate(45deg);
  box-shadow: 0 3px 8px rgba(244, 63, 94, 0.5);
  animation: pmDropPulse 2.4s ease-in-out infinite;
}

@keyframes pmDropPulse {
  0%, 100% {
    transform: rotate(45deg) translateY(0) scale(1);
    opacity: 0.95;
  }
  50% {
    transform: rotate(45deg) translateY(4px) scale(1.12);
    opacity: 1;
  }
}

.pmLeaks__leakCol:nth-child(2) .pmLeaks__droplet { animation-delay: 0.6s; }
.pmLeaks__leakCol:nth-child(3) .pmLeaks__droplet { animation-delay: 1.2s; }
.pmLeaks__leakCol:nth-child(4) .pmLeaks__droplet { animation-delay: 1.8s; }

/* Dotted Line drops down passing cleanly between node labels */
.pmLeaks__dottedLine {
  width: 1px;
  flex: 1;
  border-left: 2px dotted #F43F5E;
  opacity: 0.85;
  margin-top: 1px;
}

/* 5 Nodes on the Pipe: With labels situated completely above cards */
.pmLeaks__nodes {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 80px;
  pointer-events: none;
  z-index: 3;
}

.pmLeaks__nodeItem {
  position: absolute;
  top: 0;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 80px;
  pointer-events: auto;
}

/* Exact mathematical positioning matching column gap centers */
.pmLeaks__nodeItem--1 {
  left: 0%;
}

.pmLeaks__nodeItem--2 {
  left: calc((100% - 3 * var(--pm-gap)) / 4 + var(--pm-gap) / 2);
}

.pmLeaks__nodeItem--3 {
  left: 50%;
}

.pmLeaks__nodeItem--4 {
  left: calc(100% - ((100% - 3 * var(--pm-gap)) / 4 + var(--pm-gap) / 2));
}

.pmLeaks__nodeItem--5 {
  left: 100%;
}

.pmLeaks__stageCircle {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--bg-primary);
  border: 2px solid var(--border-color);
  box-shadow:
    0 4px 14px rgba(15, 23, 42, 0.08),
    0 0 16px rgba(217, 70, 239, 0.18),
    inset 0 1px 0 #FFFFFF;
  display: grid;
  place-items: center;
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.25s, box-shadow 0.25s;
}

.pmLeaks__nodeItem:hover .pmLeaks__stageCircle {
  transform: translateY(-2px) scale(1.06);
  border-color: var(--color-accent-purple);
  box-shadow: 0 8px 24px rgba(124, 58, 237, 0.24);
}

.pmLeaks__stageCircle--sale {
  border-color: #FECDD3;
  box-shadow:
    0 4px 14px rgba(244, 63, 94, 0.14),
    0 0 18px rgba(244, 63, 94, 0.3),
    inset 0 1px 0 #FFFFFF;
}

.pmLeaks__nodeLabel {
  font-family: var(--font-serif);
  font-size: 14.5px;
  font-weight: 750;
  color: var(--text-primary);
  margin-top: 8px;
  text-align: center;
  white-space: nowrap;
}

/* 4 Problem Cards Row: Clearly below nodes, ZERO overlap */
.pmLeaks__cardsRow {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--pm-gap);
  width: 100%;
  position: relative;
  z-index: 4;
  margin-top: 0; /* Clean zero-overlap placement */
}

.pmLeaks__card {
  width: 100%;
  height: 100%;
  min-height: 122px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  background: #FFFFFF;
  border: 1px solid rgba(226, 232, 240, 0.9);
  border-radius: 16px;
  padding: 24px 22px 20px;
  box-sizing: border-box;
  box-shadow:
    0 4px 18px rgba(15, 23, 42, 0.035),
    inset 0 1px 0 #FFFFFF;
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), box-shadow var(--transition-normal), border-color var(--transition-normal);
}

.pmLeaks__card:hover {
  transform: translateY(-4px);
  border-color: rgba(244, 63, 94, 0.4);
  box-shadow:
    0 14px 30px rgba(244, 63, 94, 0.1),
    0 2px 6px rgba(244, 63, 94, 0.04);
}

.pmLeaks__cardHeader {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
  flex-wrap: wrap;
}

.pmLeaks__cardBadge {
  display: inline-block;
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #E11D48;
  background: #FFF1F2;
  border: 1px solid rgba(244, 63, 94, 0.22);
  padding: 2.5px 7.5px;
  border-radius: 999px;
  margin-right: 2px;
}

.pmLeaks__cardDropIcon {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  filter: drop-shadow(0 2px 4px rgba(244, 63, 94, 0.25));
}

.pmLeaks__cardTitle {
  font-family: var(--font-serif);
  font-size: 16.5px;
  font-weight: 800;
  color: var(--text-primary);
  margin: 0;
  letter-spacing: -0.015em;
}

.pmLeaks__cardText {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 13.5px;
  line-height: 1.55;
  color: var(--text-muted);
  margin: 0;
  flex: 1;
}

/* 3. Bottom Statement Banner */
.pmLeaks__footer {
  margin-top: 64px;
  text-align: center;
  position: relative;
}

.pmLeaks__footerBanner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 28px;
  width: 100%;
  margin: 0 auto 8px;
}

.pmLeaks__footerLine {
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, transparent 0%, rgba(203, 213, 225, 0.6) 30%, rgba(203, 213, 225, 0.6) 100%);
}

.pmLeaks__footerBanner .pmLeaks__footerLine:last-child {
  background: linear-gradient(90deg, rgba(203, 213, 225, 0.6) 0%, rgba(203, 213, 225, 0.6) 70%, transparent 100%);
}

.pmLeaks__footerTitle {
  font-family: var(--font-serif);
  font-size: clamp(1.45rem, 2.1vw, 1.95rem);
  font-weight: 850;
  line-height: 1.25;
  letter-spacing: -0.02em;
  color: var(--text-primary);
  margin: 0;
  flex-shrink: 0;
}

.pmLeaks__footerTitleGradient {
  display: inline-block;
  background: linear-gradient(90deg, #D946EF 0%, #EC4899 42%, #F97316 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.pmLeaks__footerSubtitle {
  font-family: var(--font-serif);
  font-style: italic;
  font-size: 1.08rem;
  color: var(--text-muted);
  margin: 0 auto;
}

/* Responsive adjustments */
@media (max-width: 1024px) {
  .pmLeaks__pipelineContainer {
    padding: 0 16px;
  }

  .pmLeaks__pipeRow {
    overflow-x: auto;
    min-width: 600px;
  }

  .pmLeaks__cardsRow {
    grid-template-columns: repeat(2, 1fr);
    row-gap: 16px;
    margin-top: 24px;
  }

  .pmLeaks__leaksRow {
    display: none;
  }

  .pmLeaks__nodeLabel {
    font-size: 13px;
  }

  .pmLeaks__footerLine {
    display: none;
  }
}

@media (max-width: 768px) {
  .pmLeaks {
    padding: 40px 16px 44px;
  }

  .pmLeaks__pipelineContainer {
    overflow-x: auto;
    padding: 0 12px;
  }

  .pmLeaks__cardsRow {
    grid-template-columns: 1fr;
    row-gap: 12px;
    margin-top: 16px;
  }

  .pmLeaks__title {
    font-size: 1.75rem;
  }

  .pmLeaks__footerTitle {
    font-size: 1.35rem;
  }
}



/* ==========================================================================
   SECTION 2: OUR 4-STEP REVENUE SYSTEM
   Minimalist, crystal-clear 4-card flow with platforms summary bar
   ========================================================================== */
.pmSystem {
  position: relative;
  overflow: hidden;
  padding: clamp(44px, 5vw, 64px) 24px;
  background: var(--bg-primary);
  background-image:
    radial-gradient(ellipse at 8% 20%, rgba(77, 24, 255, 0.03) 0%, transparent 45%),
    radial-gradient(ellipse at 92% 35%, rgba(237, 61, 157, 0.03) 0%, transparent 45%),
    linear-gradient(180deg, #FFFFFF 0%, #FAFAFF 50%, #FFFFFF 100%);
  border-top: 1px solid rgba(226, 232, 240, 0.8);
}

.pmSystem__container {
  width: min(var(--cybro-container, 1380px), 100%);
  margin: 0 auto;
  box-sizing: border-box;
  position: relative;
  z-index: 2;
}

/* Header */
.pmSystem__header {
  text-align: center;
  max-width: 780px;
  margin: 0 auto 56px;
}

.pmSystem__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-bottom: 12px;
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 11px;
  font-weight: 750;
  letter-spacing: 0.2em;
  color: var(--color-purple);
  text-transform: uppercase;
}

.pmSystem__eyebrowNum {
  font-weight: 850;
  color: var(--color-purple);
}

.pmSystem__eyebrowDash {
  opacity: 0.55;
  color: var(--text-subtle);
}

.pmSystem__eyebrowText {
  color: var(--text-muted);
  font-weight: 800;
}

.pmSystem__title {
  font-family: var(--font-serif);
  font-size: clamp(2rem, 3.2vw, 2.75rem);
  font-weight: 850;
  line-height: 1.15;
  letter-spacing: -0.025em;
  color: var(--text-primary);
  margin: 0 0 14px 0;
}

.pmSystem__titleGradient {
  display: inline-block;
  background: linear-gradient(90deg, #7C3AED 0%, #D946EF 38%, #EC4899 72%, #F97316 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.pmSystem__subhead {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 1.05rem;
  font-weight: 500;
  line-height: 1.55;
  color: var(--text-secondary);
  margin: 0 auto;
  max-width: 660px;
}

/* 4-Step Cards Grid */
.pmSystem__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  margin-bottom: 36px;
  align-items: stretch;
}

.pmSystem__card {
  background: #FFFFFF;
  border: 1px solid rgba(226, 232, 240, 0.95);
  border-radius: 20px;
  padding: 32px 26px 28px;
  display: flex;
  flex-direction: column;
  position: relative;
  box-shadow: 0 4px 20px -2px rgba(15, 23, 42, 0.04);
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s ease, border-color 0.3s ease;
}

.pmSystem__card:hover {
  transform: translateY(-5px);
  box-shadow: 0 20px 35px -8px rgba(15, 23, 42, 0.08), 0 6px 16px -4px rgba(124, 58, 237, 0.06);
  border-color: rgba(124, 58, 237, 0.3);
}

/* Featured 03 Card (Creative & CRO) */
.pmSystem__card--featured {
  background: linear-gradient(180deg, #FFFFFF 0%, #FAF8FF 100%);
  border: 1.5px solid rgba(124, 58, 237, 0.35);
  box-shadow: 0 10px 30px -4px rgba(124, 58, 237, 0.08);
}

.pmSystem__card--featured:hover {
  border-color: rgba(124, 58, 237, 0.6);
}

.pmSystem__cardHeader {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 20px;
}

.pmSystem__stepMarker {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #F5F3FF;
  border: 2px solid #7C3AED;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-shadow: 0 2px 8px rgba(124, 58, 237, 0.15);
  transition: all 0.25s ease;
}

.pmSystem__stepDot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #7C3AED;
  transition: all 0.25s ease;
}

.pmSystem__card:hover .pmSystem__stepMarker {
  transform: scale(1.12);
  background: #7C3AED;
  box-shadow: 0 4px 14px rgba(124, 58, 237, 0.35);
}

.pmSystem__card:hover .pmSystem__stepDot {
  background: #FFFFFF;
}

.pmSystem__stepMarker--featured {
  border-color: #EC4899;
  background: #FDF2F8;
  box-shadow: 0 2px 8px rgba(236, 72, 153, 0.2);
}

.pmSystem__stepMarker--featured .pmSystem__stepDot {
  background: #EC4899;
}

.pmSystem__card--featured:hover .pmSystem__stepMarker--featured {
  background: #EC4899;
  box-shadow: 0 4px 14px rgba(236, 72, 153, 0.4);
}

.pmSystem__icon {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: #F8FAFC;
  border: 1px solid #E2E8F0;
  display: grid;
  place-items: center;
  color: #64748B;
  transition: transform 0.25s ease, color 0.25s ease;
}

.pmSystem__card:hover .pmSystem__icon {
  transform: scale(1.08);
  color: var(--color-purple);
  background: #F3E8FF;
  border-color: #DDD6FE;
}

.pmSystem__featuredPill {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.08em;
  color: #E11D48;
  background: #FFE4E6;
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid rgba(225, 29, 72, 0.2);
  text-transform: uppercase;
}

.pmSystem__cardTitle {
  font-family: var(--font-serif);
  font-size: 1.32rem;
  font-weight: 850;
  line-height: 1.25;
  color: var(--text-primary);
  margin: 0 0 8px 0;
  letter-spacing: -0.015em;
}

.pmSystem__cardTagline {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 13px;
  line-height: 1.5;
  color: var(--text-secondary);
  margin: 0 0 20px 0;
  font-weight: 500;
  min-height: 40px;
}

.pmSystem__cardList {
  list-style: none;
  padding: 16px 0 0 0;
  margin: auto 0 0 0;
  border-top: 1px solid rgba(226, 232, 240, 0.8);
  display: flex;
  flex-direction: column;
  gap: 11px;
}

.pmSystem__cardList li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 12.5px;
  line-height: 1.45;
  color: #334155;
  font-weight: 550;
}

.pmSystem__cardList li span {
  color: #10B981;
  font-weight: 800;
  font-size: 13px;
  flex-shrink: 0;
}

/* Single Summary Bar: Platforms & Inclusions */
.pmSystem__summaryBar {
  background: #FFFFFF;
  border: 1px solid rgba(226, 232, 240, 0.95);
  border-radius: 16px;
  padding: 20px 28px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 56px;
  box-shadow: 0 4px 18px rgba(15, 23, 42, 0.02);
}

.pmSystem__summaryLeft {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}

.pmSystem__summaryLabel {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 12px;
  font-weight: 750;
  letter-spacing: 0.08em;
  color: #64748B;
  text-transform: uppercase;
}

.pmSystem__summaryPills {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.pmSystem__summaryPill {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 12px;
  font-weight: 650;
  color: #1E293B;
  background: #F1F5F9;
  padding: 5px 12px;
  border-radius: 8px;
  border: 1px solid #E2E8F0;
}

.pmSystem__summaryDivider {
  width: 1px;
  height: 32px;
  background: #E2E8F0;
}

.pmSystem__summaryRight {
  display: flex;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
}

.pmSystem__summaryCheck {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 12.5px;
  font-weight: 600;
  color: #334155;
  white-space: nowrap;
}

/* Transition Statement */
.pmSystem__transition {
  text-align: center;
}

.pmSystem__transitionHeadline {
  font-family: var(--font-serif);
  font-size: clamp(1.35rem, 1.9vw, 1.75rem);
  font-weight: 850;
  line-height: 1.25;
  letter-spacing: -0.02em;
  color: var(--text-primary);
  margin: 0;
}

.pmSystem__transitionGradient {
  display: inline-block;
  background: linear-gradient(90deg, #D946EF 0%, #EC4899 50%, #4D18FF 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* Responsive Breakpoints */
@media (max-width: 1100px) {
  .pmSystem__grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .pmSystem__cardTagline {
    min-height: auto;
  }
  .pmSystem__summaryBar {
    flex-direction: column;
    align-items: flex-start;
  }
  .pmSystem__summaryDivider {
    display: none;
  }
}

@media (max-width: 640px) {
  .pmSystem__grid {
    grid-template-columns: 1fr;
  }
  .pmSystem__summaryBar {
    padding: 18px 18px;
  }
  .pmSystem__summaryRight {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
}


/* ==========================================================================
   SECTION 4: RESULTS (RESULTS WE CAN SHOW YOU)
   Exact match to design with responsive layout & CybroMedia theme
   ========================================================================== */
.pmResults {
  position: relative;
  overflow: hidden;
  padding: clamp(44px, 5vw, 64px) 24px;
  background: var(--bg-primary);
  background-image:
    radial-gradient(ellipse at 15% 15%, rgba(124, 58, 237, 0.03) 0%, transparent 50%),
    radial-gradient(ellipse at 85% 30%, rgba(244, 63, 94, 0.03) 0%, transparent 50%),
    linear-gradient(180deg, #FFFFFF 0%, #FAF8FF 50%, #FFFFFF 100%);
  border-top: 1px solid rgba(226, 232, 240, 0.7);
}

.pmResults__container {
  width: min(var(--cybro-container, 1380px), 100%);
  margin: 0 auto;
  box-sizing: border-box;
  position: relative;
  z-index: 2;
}

/* Section Header */
.pmResults__header {
  text-align: center;
  margin-bottom: 56px;
}

.pmResults__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 14px;
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 11px;
  font-weight: 750;
  letter-spacing: 0.18em;
  color: #6D28D9;
  text-transform: uppercase;
}

.pmResults__eyebrowDash {
  opacity: 0.55;
  color: var(--text-subtle);
}

.pmResults__eyebrowNum {
  font-weight: 850;
  color: #6D28D9;
}

.pmResults__eyebrowText {
  color: var(--text-muted);
}

.pmResults__title {
  font-family: var(--font-serif);
  font-size: clamp(2.1rem, 3.2vw, 3rem);
  font-weight: 850;
  letter-spacing: -0.025em;
  color: var(--text-primary);
  margin: 0 0 12px 0;
  line-height: 1.18;
}

.pmResults__titleGradient {
  display: inline-block;
  background: linear-gradient(90deg, #7C3AED 0%, #D946EF 38%, #EC4899 72%, #F97316 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.pmResults__subtitle {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--text-muted);
  margin: 0 auto;
  max-width: 640px;
  font-weight: 500;
}

/* Row 1: 3 Case Study Cards */
.pmResults__cardsGrid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
  margin-bottom: 56px;
}

.pmResults__card {
  background: #FFFFFF;
  border: 1px solid rgba(226, 232, 240, 0.9);
  border-radius: 20px;
  padding: 28px 26px 24px;
  box-shadow: 0 4px 20px -2px rgba(15, 23, 42, 0.035);
  display: flex;
  flex-direction: column;
  transition: transform var(--transition-normal), box-shadow var(--transition-normal), border-color var(--transition-normal);
}

.pmResults__card:hover {
  transform: translateY(-3px);
  border-color: rgba(167, 139, 250, 0.6);
  box-shadow: 0 10px 28px rgba(124, 58, 237, 0.08);
}

.pmResults__cardTop {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 14px;
}

.pmResults__cardBrand {
  display: flex;
  align-items: center;
  gap: 10px;
}

.pmResults__brandIcon {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  flex-shrink: 0;
}

.pmResults__brandIcon.is-purple {
  background: #EDE9FE;
  color: var(--color-accent-purple);
}

.pmResults__brandIcon.is-pink {
  background: #FFE4E6;
  color: #E11D48;
}

.pmResults__brandIcon.is-blue {
  background: #E0F2FE;
  color: #0284C7;
}

.pmResults__brandMeta {
  display: flex;
  flex-direction: column;
}

.pmResults__brandName {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 0.96rem;
  font-weight: 750;
  color: var(--text-primary);
  margin: 0 0 1px 0;
}

.pmResults__brandCategory {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 11px;
  color: var(--text-muted);
  font-weight: 500;
}

.pmResults__badge {
  background: var(--bg-secondary);
  border: 1px solid var(--border-color);
  border-radius: var(--radius-pill);
  padding: 3px 9px;
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 10.5px;
  color: var(--text-secondary);
}

.pmResults__badge strong {
  color: var(--text-primary);
  font-weight: 700;
}

/* Hero Metric - Compact */
.pmResults__heroMetric {
  margin-bottom: 14px;
}

.pmResults__metricLabel {
  display: block;
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 11.5px;
  color: var(--text-muted);
  font-weight: 550;
  margin-bottom: 4px;
}

.pmResults__metricValues {
  display: flex;
  align-items: baseline;
  gap: 10px;
}

.pmResults__valOld {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 1.95rem;
  font-weight: 800;
  color: var(--text-subtle);
  letter-spacing: -0.03em;
  line-height: 1;
}

.pmResults__metricArrow {
  font-size: 1.3rem;
  color: #CBD5E1;
  font-weight: 300;
}

.pmResults__valNew {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 1.95rem;
  font-weight: 850;
  color: var(--color-purple);
  letter-spacing: -0.03em;
  line-height: 1;
}

/* Sub Metrics - Compact */
.pmResults__subMetrics {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 10px;
  padding: 9px 12px;
  background: var(--bg-secondary);
  border-radius: 10px;
  margin-bottom: 14px;
}

.pmResults__subMetricItem {
  display: flex;
  flex-direction: column;
}

.pmResults__subMetricDivider {
  width: 1px;
  height: 24px;
  background: #E2E8F0;
}

.pmResults__subLabel {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 10px;
  color: var(--text-muted);
  font-weight: 600;
  margin-bottom: 2px;
}

.pmResults__subValues {
  display: flex;
  align-items: baseline;
  gap: 5px;
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 11.5px;
  font-weight: 750;
}

.pmResults__subOld {
  color: var(--text-muted);
}

.pmResults__subArrow {
  color: var(--text-subtle);
  font-weight: 400;
  font-size: 10px;
}

.pmResults__subNew {
  color: var(--text-primary);
  font-weight: 800;
}

/* What We Changed - Compact */
.pmResults__changedBox {
  margin-bottom: 14px;
  flex-grow: 1;
}

.pmResults__changedLabel {
  display: block;
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 10.5px;
  font-weight: 700;
  color: var(--text-secondary);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 3px;
}

.pmResults__changedText {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 11.5px;
  line-height: 1.4;
  color: var(--text-muted);
  margin: 0;
}

/* Card Link Footer - Compact */
.pmResults__cardFooter {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 10px;
  border-top: 1px solid var(--border-light);
  text-decoration: none;
  transition: all var(--transition-fast);
}

.pmResults__footerLink {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 12px;
  font-weight: 700;
  color: var(--color-purple);
  display: flex;
  align-items: center;
  gap: 4px;
}

.pmResults__footerCircle {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: #F5F3FF;
  color: var(--color-purple);
  display: grid;
  place-items: center;
  transition: all var(--transition-fast);
}

.pmResults__cardFooter:hover .pmResults__footerLink {
  color: var(--color-accent-purple-dark);
}

.pmResults__cardFooter:hover .pmResults__footerCircle {
  background: var(--color-purple);
  color: var(--text-on-dark);
  transform: translateX(3px);
}

/* Row 2: Testimonials Grid - Compact */
.pmResults__testimonialsGrid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 28px;
  margin-bottom: 56px;
}

.pmResults__testimonialCard {
  background: #FFFFFF;
  border: 1px solid rgba(226, 232, 240, 0.9);
  border-radius: 20px;
  padding: 24px 26px;
  box-shadow: 0 4px 18px rgba(15, 23, 42, 0.035);
  display: grid;
  grid-template-columns: 86px 1fr;
  gap: 20px;
  align-items: center;
  transition: transform var(--transition-normal), box-shadow var(--transition-normal);
}

.pmResults__testimonialCard:hover {
  transform: translateY(-3px);
  box-shadow: 0 14px 28px rgba(124, 58, 237, 0.08);
}

.pmResults__testiImgWrap {
  width: 86px;
  height: 86px;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.08);
  flex-shrink: 0;
}

.pmResults__testiImg {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.pmResults__testiContent {
  display: flex;
  flex-direction: column;
}

.pmResults__quoteIcon {
  font-family: Georgia, serif;
  font-size: 22px;
  line-height: 1;
  color: #A78BFA;
  margin-bottom: 2px;
}

.pmResults__quoteText {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 12px;
  line-height: 1.45;
  color: #334155;
  margin: 0 0 8px 0;
  font-style: italic;
}

.pmResults__testiFooter {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
}

.pmResults__authorMeta {
  display: flex;
  flex-direction: column;
}

.pmResults__authorName {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 13px;
  font-weight: 750;
  color: var(--text-primary);
  margin: 0 0 1px 0;
}

.pmResults__authorRole {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 10.5px;
  color: var(--text-muted);
  font-weight: 500;
}

.pmResults__stars {
  color: #F59E0B;
  font-size: 12px;
  letter-spacing: 1.5px;
}

/* Row 3: Bottom Action & Flourish - Compact */
.pmResults__ctaWrap {
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.pmResults__ctaDecor {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  position: relative;
  margin-bottom: 6px;
}

.pmResults__arrowLeft,
.pmResults__arrowRight {
  width: 65px;
  height: 28px;
  opacity: 0.8;
}

.pmResults__ctaBtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(90deg, #7C3AED 0%, #D946EF 42%, #F43F5E 78%, #F97316 100%);
  color: var(--text-on-dark);
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 13.5px;
  font-weight: 750;
  padding: 11px 30px;
  border-radius: var(--radius-pill);
  text-decoration: none;
  box-shadow: 0 8px 20px rgba(217, 70, 239, 0.3);
  transition: transform var(--transition-normal), box-shadow var(--transition-normal), filter var(--transition-normal);
}

.pmResults__ctaBtn:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 26px rgba(217, 70, 239, 0.4);
  filter: brightness(1.04);
}

.pmResults__ctaNote {
  font-family: var(--font-serif);
  font-size: 12.5px;
  color: var(--text-muted);
  font-style: italic;
  margin: 0;
}

/* Responsiveness */
@media (max-width: 1080px) {
  .pmResults__cardsGrid {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .pmResults__testimonialsGrid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
}

@media (max-width: 640px) {
  .pmResults {
    padding: 40px 16px 44px;
  }

  .pmResults__testimonialCard {
    grid-template-columns: 1fr;
    text-align: left;
  }

  .pmResults__testiImgWrap {
    width: 80px;
    height: 80px;
  }

  .pmResults__arrowLeft,
  .pmResults__arrowRight {
    display: none;
  }
}

/* ==========================================================================
   SECTION 5: TRANSPARENCY & PROCESS (COMPACT & SLEEK)
   "Full Transparency. Every Rupee, Every Result."
   Using Core :root Design Tokens from style.css
   ========================================================================== */
.pmTransparency {
  position: relative;
  background: var(--cybro-white, #FFFFFF);
  padding: clamp(44px, 5vw, 64px) 0;
  border-top: 1px solid var(--cybro-border, rgba(77, 24, 255, 0.11));
  overflow: hidden;
}

.pmTransparency__container {
  width: min(var(--cybro-container, 1400px), 100%);
  margin: 0 auto;
  padding: 0 24px;
  box-sizing: border-box;
  position: relative;
  z-index: 2;
}

/* Main 2-Column Layout */
.pmTransparency__layout {
  display: grid;
  grid-template-columns: 1fr 1.18fr;
  gap: 48px;
  align-items: stretch;
}

/* --- Left Column: Headline & Stepper with 3D Icons --- */
.pmTransparency__leftCol {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  height: 100%;
}

.pmTransparency__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 14px;
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 11px;
  font-weight: 750;
  letter-spacing: 0.18em;
  color: #6D28D9;
  text-transform: uppercase;
}

.pmTransparency__eyebrowDash {
  opacity: 0.55;
  color: var(--text-subtle);
}

.pmTransparency__eyebrowNum {
  font-weight: 850;
  color: #6D28D9;
}

.pmTransparency__eyebrowText {
  color: var(--text-muted);
}

.pmTransparency__title {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: clamp(2.1rem, 3.2vw, 3rem);
  font-weight: 850;
  line-height: 1.18;
  letter-spacing: -0.025em;
  color: var(--cybro-heading, #0e1222);
  margin: 0 0 12px 0;
}

.pmTransparency__titleGradient {
  display: inline-block;
  background: var(--cybro-gradient, var(--gradient-brand));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.pmTransparency__subtitle {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--text-muted);
  margin: 0 0 36px 0;
  max-width: 520px;
}

/* 4-Step Vertical Timeline */
.pmTransparency__timeline {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  flex: 1;
  gap: 6px;
  padding-left: 2px;
  margin-top: 2px;
}

/* Continuous Vertical Connector Behind Badges */
.pmTransparency__timelineLine {
  position: absolute;
  top: 12px;
  bottom: 12px;
  left: 13px;
  width: 1.5px;
  background: rgba(113, 56, 255, 0.16);
  z-index: 1;
}

.pmTransparency__step {
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
  z-index: 2;
  transition: transform var(--transition-fast);
}

.pmTransparency__step:hover {
  transform: translateX(2px);
}

.pmTransparency__stepBadgeCol {
  position: relative;
  flex-shrink: 0;
  z-index: 3;
}

.pmTransparency__stepMarker {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #F5F3FF;
  border: 2px solid #7C3AED;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-shadow: 0 2px 6px rgba(124, 58, 237, 0.15);
  transition: all 0.25s ease;
}

.pmTransparency__stepDot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #7C3AED;
  transition: all 0.25s ease;
}

.pmTransparency__step:hover .pmTransparency__stepMarker {
  transform: scale(1.15);
  background: #7C3AED;
  box-shadow: 0 4px 12px rgba(124, 58, 237, 0.35);
}

.pmTransparency__step:hover .pmTransparency__stepDot {
  background: #FFFFFF;
}

/* 3D Visual Image Thumbnail Box */
.pmTransparency__stepThumbWrap {
  width: 32px;
  height: 32px;
  border-radius: var(--radius-sm);
  background: var(--cybro-background, #f8f7ff);
  border: 1px solid var(--cybro-border, rgba(77, 24, 255, 0.11));
  display: grid;
  place-items: center;
  flex-shrink: 0;
  box-shadow: 0 4px 14px rgba(45, 24, 105, 0.05);
  transition: transform var(--transition-normal), box-shadow var(--transition-normal);
}

.pmTransparency__step:hover .pmTransparency__stepThumbWrap {
  transform: translateY(-2px) scale(1.05);
  box-shadow: 0 8px 18px rgba(77, 24, 255, 0.12);
  border-color: rgba(113, 56, 255, 0.35);
}

.pmTransparency__stepThumb {
  width: 20px;
  height: 20px;
  object-fit: contain;
  display: block;
}

.pmTransparency__stepContent {
  flex: 1;
}

.pmTransparency__stepTitle {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 12.5px;
  font-weight: 750;
  color: var(--cybro-heading, #0e1222);
  margin: 0;
}

.pmTransparency__stepDesc {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 11px;
  line-height: 1.3;
  color: var(--cybro-text, #5f687e);
  margin: 0;
}

/* --- Right Column: Live Dashboard & Ownership Cards --- */
.pmTransparency__rightCol {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 8px;
  height: 100%;
}

/* 1. Live Dashboard Card */
.pmTransparency__dashCard {
  background: var(--cybro-white, #FFFFFF);
  border: 1px solid var(--cybro-border, rgba(77, 24, 255, 0.11));
  border-radius: var(--cybro-card-radius, 16px);
  padding: 10px 14px 6px;
  box-shadow: 0 8px 28px rgba(45, 24, 105, 0.05);
}

.pmTransparency__dashHeader {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 6px;
}

.pmTransparency__dashTitleWrap {
  display: flex;
  flex-direction: column;
}

.pmTransparency__dashTitle {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 12.5px;
  font-weight: 750;
  color: var(--cybro-heading, #0e1222);
  margin: 0;
}

.pmTransparency__dashSub {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 9.5px;
  color: var(--cybro-muted, #8e97ad);
  font-weight: 500;
}

.pmTransparency__dashControls {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
}

/* Connected Channels Micro Badge */
.pmTransparency__syncBadge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: var(--cybro-background, #f8f7ff);
  border: 1px solid var(--cybro-border, rgba(77, 24, 255, 0.11));
  padding: 2px 6px;
  border-radius: var(--radius-pill);
}

.pmTransparency__syncText {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 9.5px;
  font-weight: 650;
  color: var(--cybro-purple, #7138ff);
}

.pmTransparency__liveBadge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 9.5px;
  font-weight: 650;
  color: var(--cybro-green, #24b96b);
  background: #F0FDF4;
  padding: 2px 6px;
  border-radius: var(--radius-pill);
  border: 1px solid #DCFCE7;
}

.pmTransparency__liveDot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--cybro-green, #24b96b);
  box-shadow: 0 0 5px rgba(36, 185, 107, 0.6);
  animation: pmLivePulse 2s infinite ease-in-out;
}

@keyframes pmLivePulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.5; transform: scale(1.2); }
}

.pmTransparency__datePicker {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 9.5px;
  font-weight: 500;
  color: var(--cybro-heading, #0e1222);
  background: var(--cybro-white, #FFFFFF);
  border: 1px solid var(--cybro-border, rgba(77, 24, 255, 0.11));
  padding: 2.5px 6px;
  border-radius: 6px;
  white-space: nowrap;
}

/* 4 Metrics Grid - Compact */
.pmTransparency__metricsGrid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 6px;
  margin-bottom: 6px;
}

.pmTransparency__metricBox {
  background: var(--cybro-background, #f8f7ff);
  border: 1px solid var(--cybro-border, rgba(77, 24, 255, 0.11));
  border-radius: var(--radius-sm);
  padding: 5px 8px;
  display: flex;
  flex-direction: column;
  gap: 1px;
  transition: transform var(--transition-fast), background var(--transition-fast), border-color var(--transition-fast);
}

.pmTransparency__metricBox:hover {
  background: var(--bg-primary);
  border-color: rgba(113, 56, 255, 0.3);
  transform: translateY(-1px);
}

.pmTransparency__metricLabel {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 9.5px;
  color: var(--cybro-muted, #8e97ad);
  font-weight: 500;
}

.pmTransparency__metricVal {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 14px;
  font-weight: 800;
  color: var(--cybro-heading, #0e1222);
  letter-spacing: -0.02em;
}

.pmTransparency__metricPill {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 9.5px;
  font-weight: 650;
  display: inline-flex;
  align-items: center;
  gap: 2px;
}

.pmTransparency__metricPill.is-green {
  color: var(--cybro-green, #24b96b);
}

.pmTransparency__pillArrow {
  font-size: 10px;
}

/* Chart Section - Compact */
.pmTransparency__chartSection {
  background: transparent;
  padding-top: 0;
}

.pmTransparency__chartTop {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 2px;
}

.pmTransparency__chartLabel {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 11px;
  font-weight: 650;
  color: var(--cybro-heading, #0e1222);
}

.pmTransparency__chartDropdown {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  border: 1px solid var(--cybro-border, rgba(77, 24, 255, 0.11));
  border-radius: 5px;
  padding: 1.5px 6px;
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 9.5px;
  color: var(--cybro-text, #5f687e);
  background: var(--cybro-white, #FFFFFF);
}

.pmTransparency__chartWrap {
  position: relative;
  width: 100%;
  height: 78px;
}

.pmTransparency__chartSvg {
  width: 100%;
  height: 100%;
  display: block;
  overflow: visible;
}

.pmTransparency__chartYText {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 8.5px;
  font-weight: 500;
  fill: var(--cybro-muted, #8e97ad);
}

.pmTransparency__chartTooltip {
  position: absolute;
  right: 28px;
  top: -6px;
  background: var(--cybro-white, #FFFFFF);
  border: 1px solid var(--cybro-border, rgba(77, 24, 255, 0.11));
  border-radius: 5px;
  padding: 2px 6px;
  box-shadow: 0 4px 12px rgba(45, 24, 105, 0.08);
  display: flex;
  flex-direction: column;
  align-items: center;
  pointer-events: none;
  z-index: 10;
}

.pmTransparency__tooltipDate {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 8.5px;
  color: var(--cybro-muted, #8e97ad);
  font-weight: 500;
  line-height: 1.2;
}

.pmTransparency__tooltipVal {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 9.5px;
  font-weight: 800;
  color: var(--cybro-heading, #0e1222);
  line-height: 1.2;
}

.pmTransparency__chartXLabels {
  display: flex;
  justify-content: space-between;
  padding-left: 36px;
  padding-right: 6px;
  margin-top: 2px;
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 9px;
  color: var(--cybro-muted, #8e97ad);
  font-weight: 500;
}

/* 2. What you own Card - Lavender Tinted */
.pmTransparency__ownCard {
  background: var(--cybro-background, #f8f7ff);
  border: 1px solid var(--cybro-border, rgba(77, 24, 255, 0.11));
  border-radius: var(--cybro-radius, 14px);
  padding: 8px 12px;
  margin-top: auto;
}

.pmTransparency__ownHeader {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 5px;
}

.pmTransparency__ownTitle {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 12.5px;
  font-weight: 800;
  color: var(--cybro-heading, #0e1222);
  margin: 0;
}

.pmTransparency__ownBadge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 9.5px;
  font-weight: 650;
  color: var(--cybro-purple, #7138ff);
  background: rgba(113, 56, 255, 0.08);
  padding: 2px 6px;
  border-radius: var(--radius-pill);
}

.pmTransparency__ownGrid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 4px 10px;
}

.pmTransparency__ownItem {
  display: flex;
  align-items: center;
  gap: 6px;
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 10.5px;
  font-weight: 550;
  color: var(--cybro-heading, #0e1222);
}

.pmTransparency__ownCheck {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: rgba(113, 56, 255, 0.12);
  color: var(--cybro-purple, #7138ff);
  display: grid;
  place-items: center;
  flex-shrink: 0;
}

/* Bottom Transition: Questions Link */
.pmTransparency__bottomTransition {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-top: 56px;
  padding-top: 28px;
  border-top: 1px solid rgba(226, 232, 240, 0.85);
}

.pmTransparency__arrowWrap {
  display: inline-flex;
  align-items: center;
}

.pmTransparency__curvedArrow {
  width: 44px;
  height: 22px;
}

.pmTransparency__curvedArrow path {
  stroke: #7C3AED;
}

.pmTransparency__transitionText {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 14.5px;
  color: var(--text-muted);
  font-weight: 500;
  margin: 0;
}

.pmTransparency__transitionHighlight {
  color: #7C3AED;
  font-weight: 750;
}

/* Responsiveness */
@media (max-width: 1024px) {
  .pmTransparency__layout {
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .pmTransparency__subtitle {
    max-width: 100%;
  }
}

@media (max-width: 640px) {
  .pmTransparency {
    padding: 48px 0 36px;
  }

  .pmTransparency__container {
    padding: 0 16px;
  }

  .pmTransparency__metricsGrid {
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
  }

  .pmTransparency__ownGrid {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .pmTransparency__dashHeader {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }

  .pmTransparency__chartTooltip {
    right: 14px;
  }

  .pmTransparency__bottomTransition {
    flex-direction: column;
    text-align: center;
    gap: 6px;
    margin-top: 36px;
    padding-top: 20px;
  }

  .pmTransparency__curvedArrow {
    display: none;
  }
}

/* =========================================================
   LEAKS PIPELINE – SCROLLABLE ROW FIX (≤ 1024px)
   End nodes are centred on the row edges; inset the pipe and
   nodes so the first/last labels are not cut off.
========================================================= */
@media (max-width: 1024px) {
  .pmLeaks__pipeRow {
    min-width: 680px;
  }

  .pmLeaks__pipe,
  .pmLeaks__nodes {
    left: 48px;
    right: 48px;
  }
}

/* ==========================================================================
   SECTION 05: FREQUENTLY ASKED QUESTIONS
   Minimalist, Clean, High-Contrast Cards with Generous Spacing
   ========================================================================== */
/* ==========================================================================
   SECTION 5: FREQUENTLY ASKED QUESTIONS (CREATIVE 2-COLUMN ACCORDION & DIRECT SUPPORT)
   Minimalist, Interactive, High-Contrast Luxury Cards
   ========================================================================== */
.pmFaq {
  position: relative;
  background: var(--bg-primary, #FFFFFF);
  background-image:
    radial-gradient(ellipse at 12% 25%, rgba(124, 58, 237, 0.035) 0%, transparent 50%),
    radial-gradient(ellipse at 88% 60%, rgba(217, 70, 239, 0.03) 0%, transparent 45%),
    linear-gradient(180deg, #FFFFFF 0%, #FAFAFF 50%, #FFFFFF 100%);
  padding: clamp(52px, 6vw, 84px) 24px;
  border-top: 1px solid rgba(226, 232, 240, 0.8);
  overflow: hidden;
}

.pmFaq__container {
  width: min(var(--cybro-container, 1380px), 100%);
  margin: 0 auto;
  box-sizing: border-box;
  position: relative;
  z-index: 2;
}

/* 2-Column Asymmetric Layout */
.pmFaq__wrapper {
  display: grid;
  grid-template-columns: minmax(320px, 38%) minmax(0, 62%);
  gap: clamp(36px, 4.5vw, 64px);
  align-items: start;
}

/* ----------------------------------------------------
   LEFT COLUMN: Sticky Sidebar & Trust Cards
   ---------------------------------------------------- */
.pmFaq__sidebar {
  position: sticky;
  top: 96px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.pmFaq__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
}

.pmFaq__eyebrowText {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 11.5px;
  font-weight: 750;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #7C3AED;
}

.pmFaq__title {
  font-family: var(--font-serif);
  font-size: clamp(2.1rem, 2.9vw, 2.85rem);
  font-weight: 850;
  line-height: 1.16;
  letter-spacing: -0.025em;
  color: var(--text-primary, #0F172A);
  margin: 0;
}

.pmFaq__titleGradient {
  display: inline-block;
  background: linear-gradient(90deg, #7C3AED 0%, #D946EF 45%, #EC4899 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.pmFaq__subtitle {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 0.96rem;
  line-height: 1.6;
  color: #64748B;
  margin: 0;
}

/* 3 Reassurance Highlights */
.pmFaq__reassurances {
  display: flex;
  flex-direction: column;
  gap: 12px;
  background: rgba(248, 250, 252, 0.7);
  border: 1px solid rgba(226, 232, 240, 0.85);
  border-radius: 18px;
  padding: 18px 20px;
}

.pmFaq__reassuranceItem {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.pmFaq__reassuranceIcon {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  background: #FFFFFF;
  border: 1px solid rgba(226, 232, 240, 0.9);
  flex-shrink: 0;
  margin-top: 2px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.02);
}

.pmFaq__reassuranceMeta {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.pmFaq__reassuranceTitle {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 0.86rem;
  font-weight: 750;
  color: #0F172A;
  margin: 0;
}

.pmFaq__reassuranceDesc {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 0.78rem;
  line-height: 1.45;
  color: #64748B;
  margin: 0;
}

/* WhatsApp / Chat Card */
.pmFaq__chatCard {
  background: linear-gradient(135deg, #FFFFFF 0%, #FAF8FF 100%);
  border: 1px solid rgba(124, 58, 237, 0.16);
  border-radius: 20px;
  padding: 22px;
  box-shadow: 0 8px 24px rgba(124, 58, 237, 0.04);
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.pmFaq__chatCardTop {
  display: flex;
  align-items: center;
  gap: 12px;
}

.pmFaq__chatIconWrap {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: rgba(37, 211, 102, 0.12);
  flex-shrink: 0;
}

.pmFaq__chatMeta {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.pmFaq__chatStatus {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.08em;
  color: #16A34A;
}

.pmFaq__chatPulse {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #22C55E;
  box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.22);
  display: inline-block;
  animation: pmFaqPulse 2s infinite ease-in-out;
}

@keyframes pmFaqPulse {
  0%, 100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.25); opacity: 0.7; }
}

.pmFaq__chatTitle {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 0.94rem;
  font-weight: 750;
  color: #0F172A;
  margin: 0;
}

.pmFaq__chatDesc {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 0.82rem;
  line-height: 1.5;
  color: #64748B;
  margin: 0;
}

.pmFaq__chatBtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 18px;
  background: #0F172A;
  color: #FFFFFF;
  border-radius: 12px;
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 0.84rem;
  font-weight: 700;
  text-decoration: none;
  transition: all 0.2s ease;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.12);
}

.pmFaq__chatBtn:hover {
  background: #7C3AED;
  transform: translateY(-1.5px);
  box-shadow: 0 8px 20px rgba(124, 58, 237, 0.25);
  color: #FFFFFF;
}

/* ----------------------------------------------------
   RIGHT COLUMN: Filter Tabs & Accordion
   ---------------------------------------------------- */
.pmFaq__main {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

/* Filter Tabs */
.pmFaq__filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.pmFaq__filterBtn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 15px;
  background: #F8FAFC;
  border: 1px solid rgba(226, 232, 240, 0.9);
  border-radius: 9999px;
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 11.5px;
  font-weight: 700;
  color: #64748B;
  cursor: pointer;
  transition: all 0.2s ease;
}

.pmFaq__filterBtn:hover {
  background: #FFFFFF;
  color: #7C3AED;
  border-color: rgba(124, 58, 237, 0.3);
}

.pmFaq__filterBtn.is-active {
  background: #7C3AED;
  color: #FFFFFF;
  border-color: #7C3AED;
  box-shadow: 0 3px 12px rgba(124, 58, 237, 0.25);
}

.pmFaq__filterCount {
  display: inline-block;
  font-size: 10px;
  background: rgba(255, 255, 255, 0.24);
  padding: 1px 6px;
  border-radius: 999px;
}

/* Accordion Items */
.pmFaq__accordion {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.pmFaq__item {
  background: #FFFFFF;
  border: 1px solid rgba(226, 232, 240, 0.95);
  border-radius: 18px;
  overflow: hidden;
  transition: border-color 0.25s ease, box-shadow 0.25s ease, transform 0.2s ease;
}

.pmFaq__item:hover {
  border-color: rgba(124, 58, 237, 0.25);
  box-shadow: 0 4px 18px rgba(15, 23, 42, 0.04);
}

.pmFaq__item.is-open {
  border-color: rgba(124, 58, 237, 0.38);
  box-shadow: 0 10px 30px rgba(124, 58, 237, 0.07);
}

/* Trigger Button */
.pmFaq__trigger {
  width: 100%;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 16px;
  padding: 20px 22px;
  background: transparent;
  border: none;
  text-align: left;
  cursor: pointer;
  font-family: inherit;
}

.pmFaq__itemMeta {
  display: flex;
  align-items: center;
  gap: 8px;
}

.pmFaq__itemNum {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 11px;
  font-weight: 850;
  color: #7C3AED;
  background: rgba(124, 58, 237, 0.08);
  padding: 3px 8px;
  border-radius: 6px;
  letter-spacing: 0.05em;
}

.pmFaq__itemCat {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.1em;
  color: #94A3B8;
  text-transform: uppercase;
}

.pmFaq__itemQuestion {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 1.05rem;
  font-weight: 750;
  line-height: 1.35;
  color: #0F172A;
  letter-spacing: -0.015em;
  transition: color 0.2s ease;
}

.pmFaq__item:hover .pmFaq__itemQuestion,
.pmFaq__item.is-open .pmFaq__itemQuestion {
  color: #7C3AED;
}

/* Circular Toggle Icon */
.pmFaq__toggleBtn {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #F8FAFC;
  border: 1px solid #E2E8F0;
  display: grid;
  place-items: center;
  color: #64748B;
  flex-shrink: 0;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.pmFaq__item:hover .pmFaq__toggleBtn {
  border-color: #CBD5E1;
  color: #0F172A;
}

.pmFaq__item.is-open .pmFaq__toggleBtn {
  background: linear-gradient(135deg, #7C3AED, #D946EF);
  border-color: transparent;
  color: #FFFFFF;
  transform: rotate(45deg);
  box-shadow: 0 4px 12px rgba(124, 58, 237, 0.25);
}

/* Accordion Drawer */
.pmFaq__drawer {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.35s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.25s ease;
  opacity: 0;
}

.pmFaq__item.is-open .pmFaq__drawer {
  max-height: 600px;
  opacity: 1;
}

.pmFaq__drawerInner {
  padding: 0 22px 24px 22px;
  border-top: 1px dashed rgba(226, 232, 240, 0.85);
  margin-top: 2px;
  padding-top: 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.pmFaq__answerText {
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 0.91rem;
  line-height: 1.68;
  color: #475569;
  margin: 0;
}

.pmFaq__answerText strong {
  color: #0F172A;
  font-weight: 700;
}

.pmFaq__timelineList {
  margin: 4px 0 6px 0;
  padding-left: 18px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  color: #475569;
  font-size: 0.88rem;
  line-height: 1.6;
}

.pmFaq__timelineList li strong {
  color: #0F172A;
}

/* Takeaway Chips */
.pmFaq__takeaways {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 4px;
}

.pmFaq__takeawayChip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  background: #F1F5F9;
  border-radius: 6px;
  font-family: var(--cybro-font-sans, "Inter", sans-serif);
  font-size: 0.74rem;
  font-weight: 750;
  color: #334155;
  letter-spacing: 0.02em;
}

.pmFaq__takeawayDot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #10B981;
}

/* Responsive Breakpoints */
@media (max-width: 1024px) {
  .pmFaq__wrapper {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .pmFaq__sidebar {
    position: static;
  }
}

@media (max-width: 640px) {
  .pmFaq {
    padding: 40px 16px;
  }
  .pmFaq__trigger {
    grid-template-columns: 1fr auto;
    padding: 16px;
    gap: 12px;
  }
  .pmFaq__itemMeta {
    grid-column: 1 / -1;
  }
  .pmFaq__itemQuestion {
    font-size: 0.98rem;
  }
  .pmFaq__drawerInner {
    padding: 0 16px 20px 16px;
  }
  .pmFaq__reassurances {
    padding: 14px;
  }
}

/* Compact FAQ treatment: low-height, clean and content-first. */
.pmFaq {
  padding: clamp(34px, 4vw, 50px) 24px;
  background-image: linear-gradient(180deg, #ffffff 0%, #fbfaff 100%);
}

.pmFaq__wrapper {
  grid-template-columns: minmax(270px, 31%) minmax(0, 69%);
  gap: clamp(26px, 3vw, 42px);
}

.pmFaq__sidebar {
  gap: 14px;
}

.pmFaq__eyebrow {
  margin-bottom: 4px;
}

.pmFaq__title {
  font-size: clamp(1.75rem, 2.35vw, 2.3rem);
  line-height: 1.1;
}

.pmFaq__subtitle {
  font-size: 0.86rem;
  line-height: 1.45;
}

.pmFaq__reassurances {
  gap: 8px;
  padding: 12px 14px;
  border-radius: 12px;
  background: #fbfbfd;
}

.pmFaq__reassuranceItem {
  align-items: center;
  gap: 9px;
}

.pmFaq__reassuranceIcon {
  width: 24px;
  height: 24px;
  margin-top: 0;
  border-radius: 7px;
}

.pmFaq__reassuranceIcon svg {
  width: 14px;
  height: 14px;
}

.pmFaq__reassuranceTitle {
  font-size: 0.78rem;
}

.pmFaq__reassuranceDesc,
.pmFaq__chatDesc {
  display: none;
}

.pmFaq__chatCard {
  padding: 12px 14px;
  border-radius: 12px;
  gap: 9px;
  box-shadow: none;
}

.pmFaq__chatIconWrap {
  width: 32px;
  height: 32px;
  border-radius: 9px;
}

.pmFaq__chatTitle {
  font-size: 0.82rem;
}

.pmFaq__chatBtn {
  align-self: flex-start;
  padding: 7px 13px;
  border-radius: 9px;
  font-size: 0.76rem;
  box-shadow: none;
}

.pmFaq__main {
  gap: 12px;
}

.pmFaq__filters {
  gap: 6px;
}

.pmFaq__filterBtn {
  padding: 5px 11px;
  font-size: 10.5px;
}

.pmFaq__accordion {
  gap: 7px;
}

.pmFaq__item {
  border-radius: 12px;
}

.pmFaq__item.is-open {
  box-shadow: 0 6px 18px rgba(124, 58, 237, 0.06);
}

.pmFaq__trigger {
  gap: 11px;
  padding: 12px 14px;
}

.pmFaq__itemNum {
  font-size: 9px;
  padding: 2px 6px;
}

.pmFaq__itemCat {
  font-size: 8.5px;
  letter-spacing: 0.08em;
}

.pmFaq__itemQuestion {
  font-size: 0.91rem;
  line-height: 1.3;
}

.pmFaq__toggleBtn {
  width: 27px;
  height: 27px;
}

.pmFaq__toggleBtn svg {
  width: 13px;
  height: 13px;
}

.pmFaq__drawerInner {
  padding: 11px 14px 14px;
  gap: 7px;
}

.pmFaq__answerText {
  font-size: 0.82rem;
  line-height: 1.5;
}

.pmFaq__takeaways {
  gap: 5px;
  margin-top: 1px;
}

.pmFaq__takeawayChip {
  padding: 3px 7px;
  font-size: 0.66rem;
}

@media (max-width: 1024px) {
  .pmFaq__wrapper {
    gap: 24px;
  }
}

@media (max-width: 640px) {
  .pmFaq {
    padding: 30px 16px;
  }

  .pmFaq__sidebar {
    gap: 12px;
  }

  .pmFaq__trigger {
    padding: 11px 12px;
    gap: 8px;
  }

  .pmFaq__itemMeta {
    display: none;
  }

  .pmFaq__itemQuestion {
    font-size: 0.88rem;
  }

  .pmFaq__drawerInner {
    padding: 10px 12px 13px;
  }
}

/* FAQ reference layout: split question card + tabbed accordion panel. */
.pmFaq {
  padding: clamp(38px, 4.5vw, 62px) 24px;
  background: #ffffff;
}

.pmFaq__wrapper {
  grid-template-columns: minmax(330px, 43%) minmax(0, 57%);
  gap: 22px;
  align-items: stretch;
}

.pmFaq__sidebar,
.pmFaq__main {
  min-height: 470px;
  border: 1px solid #ebeaf3;
  border-radius: 18px;
  box-shadow: 0 10px 32px rgba(35, 29, 78, 0.035);
}

.pmFaq__sidebar {
  position: relative;
  top: auto;
  overflow: hidden;
  display: block;
  padding: clamp(34px, 4vw, 50px);
  background:
    radial-gradient(circle at 82% 72%, rgba(124, 58, 237, 0.11), transparent 32%),
    linear-gradient(135deg, #ffffff 0%, #faf8ff 100%);
}

.pmFaq__sidebar::before,
.pmFaq__sidebar::after {
  position: absolute;
  z-index: 0;
  display: grid;
  place-items: center;
  font-family: Inter, sans-serif;
  font-weight: 900;
  filter: drop-shadow(0 18px 18px rgba(68, 35, 150, 0.16));
}

.pmFaq__sidebar::before {
  content: "?";
  right: 74px;
  bottom: 54px;
  width: 112px;
  height: 96px;
  color: #ffffff;
  font-size: 54px;
  border-radius: 55% 55% 55% 18%;
  transform: rotate(-7deg);
  background: linear-gradient(145deg, #a57cf7, #6532db);
}

.pmFaq__sidebar::after {
  content: "•••";
  right: 24px;
  bottom: 32px;
  width: 94px;
  height: 76px;
  color: #7a4be4;
  font-size: 22px;
  letter-spacing: 2px;
  border-radius: 52% 52% 20% 52%;
  background: linear-gradient(145deg, #ffffff, #e9e3fa);
}

.pmFaq__sidebar > * {
  position: relative;
  z-index: 1;
}

.pmFaq__eyebrow {
  gap: 12px;
  margin: 0 0 24px;
}

.pmFaq__eyebrow::before {
  content: "";
  width: 34px;
  height: 2px;
  border-radius: 2px;
  background: #7047ff;
}

.pmFaq__eyebrowText {
  font-size: 10px;
  letter-spacing: 0.09em;
  color: #7047ff;
}

.pmFaq__title {
  max-width: 480px;
  font-family: Inter, sans-serif;
  font-size: clamp(2.25rem, 3.5vw, 3.45rem);
  font-weight: 850;
  line-height: 1.03;
  letter-spacing: -0.055em;
}

.pmFaq__titleGradient {
  background-image: linear-gradient(100deg, #6638ed 0%, #c13fbc 52%, #ff784f 100%);
}

.pmFaq__subtitle {
  max-width: 400px;
  margin-top: 16px;
  font-size: 0.94rem;
  line-height: 1.5;
}

.pmFaq__reassurances {
  display: none;
}

.pmFaq__chatCard {
  position: absolute;
  left: clamp(34px, 4vw, 50px);
  bottom: 48px;
  width: min(252px, calc(100% - 68px));
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.pmFaq__chatCardTop,
.pmFaq__chatDesc {
  display: none;
}

.pmFaq__chatBtn {
  width: 100%;
  justify-content: flex-start;
  padding: 13px 18px;
  border-radius: 999px;
  color: #ffffff;
  background: linear-gradient(100deg, #ff526f 0%, #ff8055 100%);
  box-shadow: 0 10px 22px rgba(255, 91, 100, 0.22);
  font-size: 0.84rem;
}

.pmFaq__chatBtn::before {
  content: "◉";
  font-size: 18px;
}

.pmFaq__chatBtn svg {
  margin-left: auto;
}

.pmFaq__chatBtn::after {
  content: "Free consultation on WhatsApp.";
  position: absolute;
  left: 18px;
  top: calc(100% + 10px);
  color: #77839a;
  font-size: 10px;
  font-weight: 500;
  white-space: nowrap;
}

.pmFaq__main {
  gap: 0;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.96);
}

.pmFaq__filters {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0;
  min-height: 90px;
  padding: 12px 10px;
  border-bottom: 1px solid #eeedf4;
}

.pmFaq__filterBtn {
  position: relative;
  flex-direction: column;
  justify-content: center;
  gap: 7px;
  min-width: 0;
  padding: 10px 6px;
  border: 0;
  border-radius: 12px;
  background: transparent;
  color: #728096;
  font-size: 10.5px;
  line-height: 1.15;
}

.pmFaq__filterBtn i,
.pmFaq__filterBtn > svg {
  width: 20px;
  height: 20px;
  stroke-width: 1.9;
}

.pmFaq__filterBtn.is-active {
  color: #6338ec;
  border: 0;
  background: linear-gradient(145deg, #faf7ff, #f0eaff);
  box-shadow: none;
}

.pmFaq__filterBtn.is-active::after {
  content: "";
  position: absolute;
  left: 28%;
  right: 28%;
  bottom: 8px;
  height: 2px;
  border-radius: 2px;
  background: #7047ff;
}

.pmFaq__filterCount {
  display: none;
}

.pmFaq__accordion {
  gap: 0;
  padding: 0 12px 10px;
}

.pmFaq__item {
  border: 0;
  border-bottom: 1px solid #ececf2;
  border-radius: 0;
  background: #ffffff;
  box-shadow: none;
}

.pmFaq__item:last-child {
  border-bottom: 0;
}

.pmFaq__item:hover,
.pmFaq__item.is-open {
  border-color: #ececf2;
  box-shadow: none;
}

.pmFaq__trigger {
  grid-template-columns: 1fr auto;
  gap: 14px;
  padding: 15px 16px;
}

.pmFaq__itemMeta {
  display: none;
}

.pmFaq__itemQuestion {
  font-size: 0.86rem;
  font-weight: 750;
  line-height: 1.35;
  color: #111a38;
}

.pmFaq__item:hover .pmFaq__itemQuestion,
.pmFaq__item.is-open .pmFaq__itemQuestion {
  color: #111a38;
}

.pmFaq__toggleBtn {
  width: 28px;
  height: 28px;
  border: 0;
  background: #f4f5f9;
  color: #8090a7;
}

.pmFaq__item.is-open .pmFaq__toggleBtn {
  color: #6d3ff0;
  background: #f0eaff;
  box-shadow: none;
}

.pmFaq__drawerInner {
  margin: 0 16px 10px;
  padding: 13px 14px;
  border: 0;
  border-radius: 10px;
  gap: 7px;
  background: linear-gradient(110deg, #f8f8fb, #fbfbfd);
}

.pmFaq__answerText {
  font-size: 0.78rem;
  line-height: 1.5;
  color: #66738a;
}

.pmFaq__answerText:nth-of-type(n+2),
.pmFaq__takeaways,
.pmFaq__timelineList {
  display: none;
}

@media (max-width: 1024px) {
  .pmFaq__wrapper {
    grid-template-columns: 1fr;
  }

  .pmFaq__sidebar,
  .pmFaq__main {
    min-height: auto;
  }

  .pmFaq__sidebar {
    min-height: 390px;
  }
}

@media (max-width: 640px) {
  .pmFaq {
    padding: 30px 14px;
  }

  .pmFaq__sidebar {
    min-height: 410px;
    padding: 28px 24px;
  }

  .pmFaq__title {
    font-size: clamp(2rem, 11vw, 2.75rem);
  }

  .pmFaq__chatCard {
    left: 24px;
    bottom: 45px;
  }

  .pmFaq__filters {
    min-height: 76px;
    padding: 8px 5px;
    overflow-x: auto;
  }

  .pmFaq__filterBtn {
    min-width: 76px;
    font-size: 9px;
  }

  .pmFaq__trigger {
    padding: 14px 10px;
  }

  .pmFaq__itemQuestion {
    font-size: 0.82rem;
  }
}

/* ==========================================================================
   MINIMALIST AESTHETICS & COMPLETE RESPONSIVE SYSTEM
   Guarantees 100% responsiveness on Mobile, Tablet & Desktop across all 7 sections
   ========================================================================== */

/* Universal Section Badges - Clean, Minimalist Eyebrows (No Pill, Gradient Dash) */
.pmHero__eyebrow,
.pmHero__eyebrowPill,
.pmLeaks__eyebrow,
.pmSystem__eyebrow,
.pmResults__eyebrow,
.pmTransparency__eyebrow,
.pmFaq__eyebrow {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
  margin-bottom: 14px !important;
  margin-left: 0 !important;
  margin-right: auto !important;
  box-shadow: none !important;
}

/* Minimalist Accent Dash before Eyebrows */
.pmHero__eyebrow::before,
.pmLeaks__eyebrow::before,
.pmSystem__eyebrow::before,
.pmResults__eyebrow::before,
.pmTransparency__eyebrow::before,
.pmFaq__eyebrow::before {
  content: none !important;
  display: none !important;
}

.pmHero__eyebrowIcon,
.pmLeaks__eyebrowLine,
.pmSystem__eyebrowDash,
.pmFaq__eyebrowDash {
  display: none !important;
}

.pmHero__eyebrowText,
.pmLeaks__eyebrowText,
.pmSystem__eyebrowText,
.pmResults__eyebrowText,
.pmTransparency__eyebrowText,
.pmFaq__eyebrowText {
  font-family: var(--cybro-font-sans, "Inter", sans-serif) !important;
  font-size: 11.5px !important;
  font-weight: 750 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: #7C3AED !important;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
}

/* Universal Section Header Typography */
.pmLeaks__header,
.pmSystem__header,
.pmResults__header,
.pmFaq__header {
  text-align: center;
  max-width: 780px;
  margin: 0 auto 44px;
}

.pmLeaks__title,
.pmSystem__title,
.pmResults__title,
.pmTransparency__title,
.pmFaq__title {
  font-size: clamp(1.85rem, 3.2vw, 2.75rem);
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: -0.03em;
  color: var(--cybro-heading, #0E1222);
  margin-bottom: 14px;
}

.pmLeaks__subtitle,
.pmSystem__subhead,
.pmResults__subtitle,
.pmTransparency__subtitle,
.pmFaq__subtitle {
  font-size: clamp(14px, 1.1vw, 16px);
  line-height: 1.6;
  color: #64748B;
  max-width: 680px;
  margin-left: auto;
  margin-right: auto;
}

/* Universal Section Lateral Padding */
.pmHero,
.pmLeaks,
.pmSystem,
.pmResults,
.pmTransparency,
.pmFaq,
.pmPage .cyStudioCta,
.pmPage .cmFooter {
  width: 100% !important;
  box-sizing: border-box !important;
}

.pmHero__container,
.pmLeaks__container,
.pmSystem__container,
.pmResults__container,
.pmTransparency__container,
.pmFaq__container,
.pmPage .cyStudioCta__container,
.pmPage .cmFooter__container {
  width: min(var(--cybro-container, 1380px), 100%) !important;
  max-width: var(--cybro-container, 1380px) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
}

/* Prevent unwanted horizontal overflow */
.pmPage {
  overflow-x: hidden !important;
  width: 100% !important;
  max-width: 100vw !important;
}

/* --------------------------------------------------------------------------
   TABLET RESPONSIVENESS (<= 1024px)
   -------------------------------------------------------------------------- */
@media (max-width: 1024px) {
  .pmHero {
    padding: 36px 20px 48px !important;
  }

  .pmHero__container {
    flex-direction: column !important;
    gap: 40px !important;
    align-items: center !important;
  }

  .pmHero__content {
    max-width: 680px !important;
    text-align: center !important;
    align-items: center !important;
    margin: 0 auto !important;
  }

  .pmHero__actions {
    justify-content: center !important;
  }

  .pmHero__channelStrip {
    justify-content: center !important;
    flex-wrap: wrap !important;
  }

  .pmHero__quoteRow {
    justify-content: center !important;
  }

  .pmHero__visual {
    max-width: 540px !important;
    min-height: 460px !important;
    margin: 0 auto !important;
  }

  .pmLaptopMockup {
    width: 440px !important;
    max-width: 90vw !important;
  }

  /* Leaks Section: 2 columns on tablet */
  .pmLeaks__cardsRow {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 20px !important;
  }

  /* System Section: 2 columns on tablet */
  .pmSystem__grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 20px !important;
  }

  /* Results Section: 2 columns on tablet */
  .pmResults__cardsGrid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 20px !important;
  }

  .pmResults__cardsGrid > :last-child {
    grid-column: 1 / -1 !important;
  }

  /* Transparency Layout: 1 column on tablet */
  .pmTransparency__layout {
    grid-template-columns: 1fr !important;
    gap: 36px !important;
  }

  .pmTransparency__leftCol {
    max-width: 680px !important;
    margin: 0 auto !important;
    text-align: center !important;
  }

  .pmTransparency__subtitle {
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .pmTransparency__timeline {
    text-align: left !important;
  }
}

/* --------------------------------------------------------------------------
   TABLET & MOBILE BREAKPOINT (<= 768px)
   -------------------------------------------------------------------------- */
@media (max-width: 768px) {
  .pmHero,
  .pmLeaks,
  .pmSystem,
  .pmResults,
  .pmTransparency,
  .pmFaq,
  .pmPage .cyStudioCta,
  .pmPage .cmFooter {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  .pmLeaks__pipeRow {
    min-width: 640px !important;
  }

  .pmLeaks__pipelineContainer {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
    padding-bottom: 8px !important;
  }

  .pmLeaks__pipelineContainer::-webkit-scrollbar {
    display: none !important;
  }

  .pmSystem__summaryBar {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 14px !important;
  }

  .pmSystem__summaryDivider {
    display: none !important;
  }

  .pmSystem__summaryLeft,
  .pmSystem__summaryRight {
    justify-content: center !important;
    flex-wrap: wrap !important;
  }

  .pmFaq__grid {
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }
}

/* --------------------------------------------------------------------------
   MOBILE BREAKPOINT (<= 640px)
   -------------------------------------------------------------------------- */
@media (max-width: 640px) {
  /* ==========================================================================
     MOBILE HERO SECTION - EXACT DESIGN (<= 640px)
     ========================================================================== */
  .pmHero {
    padding: 32px 16px 20px !important;
    text-align: center !important;
    background: radial-gradient(circle at 50% 0%, rgba(243, 232, 255, 0.45) 0%, rgba(255, 255, 255, 1) 45%, #FFFFFF 100%) !important;
    position: relative !important;
    overflow: hidden !important;
  }

  .pmHero__container {
    flex-direction: column !important;
    gap: 16px !important;
    align-items: center !important;
    padding: 0 !important;
    margin: 0 auto !important;
    max-width: 100% !important;
  }

  .pmHero__content {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Eyebrow with Flanking Dashes */
  .pmHero__eyebrow {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    margin: 0 auto 12px !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    box-shadow: none !important;
  }

  .pmHero__eyebrow::before,
  .pmHero__eyebrow::after {
    content: "" !important;
    display: inline-block !important;
    width: 24px !important;
    height: 1.5px !important;
    background: #A78BFA !important;
    border-radius: 2px !important;
  }

  .pmHero__eyebrowText {
    font-size: 10px !important;
    font-weight: 800 !important;
    letter-spacing: 0.08em !important;
    color: #6D28D9 !important;
    text-transform: uppercase !important;
  }

  /* Headline */
  .pmHero__title {
    font-size: 32px !important;
    line-height: 1.15 !important;
    font-weight: 900 !important;
    color: #0B132B !important;
    margin: 0 auto 12px !important;
    letter-spacing: -0.025em !important;
    text-align: center !important;
  }

  .pmHero__titleGradient {
    display: inline !important;
  }

  .pmHero__wordFor {
    color: #6D28D9 !important;
    font-weight: 900 !important;
    background: none !important;
    -webkit-text-fill-color: initial !important;
  }

  .pmHero__wordGrowth {
    background: linear-gradient(90deg, #9333EA 0%, #EC4899 50%, #F97316 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    font-weight: 900 !important;
  }

  /* Subtitle */
  .pmHero__desc {
    font-size: 14px !important;
    line-height: 1.48 !important;
    color: #475569 !important;
    max-width: 320px !important;
    margin: 0 auto 20px !important;
    text-align: center !important;
  }

  /* CTA Buttons */
  .pmHero__actions {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    width: 100% !important;
    max-width: 320px !important;
    margin: 0 auto 22px !important;
    gap: 10px !important;
  }

  .pmHero__actions .pmBtn {
    width: 100% !important;
    border-radius: 9999px !important;
    justify-content: center !important;
    text-align: center !important;
    font-size: 14.5px !important;
    font-weight: 750 !important;
    letter-spacing: -0.01em !important;
  }

  .pmHero__actions #btnHeroAudit {
    background: linear-gradient(90deg, #6D28D9 0%, #8B5CF6 32%, #EC4899 74%, #F97316 100%) !important;
    color: #FFFFFF !important;
    border: none !important;
    padding: 13.5px 22px !important;
    box-shadow: 0 8px 22px -3px rgba(236, 72, 153, 0.45) !important;
  }

  .pmHero__actions #btnHeroResults {
    background: #FFFFFF !important;
    color: #0B132B !important;
    border: 1.5px solid #E2E8F0 !important;
    padding: 12.5px 22px !important;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.05) !important;
  }

  /* Channel Badges Strip (4 channels in a single row) */
  .pmHero__channelStrip {
    display: flex !important;
    justify-content: center !important;
    align-items: flex-start !important;
    gap: 4px !important;
    margin: 0 auto 20px !important;
    width: 100% !important;
    max-width: 350px !important;
  }

  .pmChannel__optional {
    display: none !important;
  }

  .pmChannel__dot {
    display: inline-block !important;
    width: 1px !important;
    height: 22px !important;
    background: #E2E8F0 !important;
    font-size: 0 !important;
    line-height: 0 !important;
    align-self: flex-start !important;
    margin: 11px 3px 0 !important;
    border-radius: 1px !important;
  }

  .pmChannel {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 6px !important;
    flex: 1 !important;
    text-align: center !important;
    background: none !important;
    border: none !important;
    padding: 0 !important;
    box-shadow: none !important;
  }

  .pmChannel__icon {
    width: 44px !important;
    height: 44px !important;
    border-radius: 13px !important;
    background: #F1F5F9 !important;
    border: 1px solid rgba(226, 232, 240, 0.95) !important;
    display: grid !important;
    place-items: center !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.02) !important;
  }

  .pmChannel__text {
    font-size: 10px !important;
    font-weight: 600 !important;
    color: #334155 !important;
    line-height: 1.2 !important;
    white-space: normal !important;
    text-align: center !important;
    max-width: 65px !important;
  }

  /* Philosophy Statement / Quote Row */
  .pmHero__quoteRow {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    margin: 0 auto 20px !important;
    background: none !important;
    border: none !important;
    padding: 0 !important;
  }

  .pmHero__quoteIcon {
    display: none !important;
  }

  .pmHero__quoteBar {
    display: inline-block !important;
    width: 3.5px !important;
    height: 16px !important;
    border-radius: 2px !important;
    background: linear-gradient(180deg, #F97316 0%, #EC4899 100%) !important;
  }

  .pmHero__quoteText {
    font-size: 14.5px !important;
    font-weight: 800 !important;
    color: #0B132B !important;
    letter-spacing: -0.01em !important;
  }

  /* Mockup Scene Container */
  .pmHero__visual,
  .pmPage .pmHero__visual {
    display: flex !important;
    justify-content: center !important;
    align-items: flex-end !important;
    position: relative !important;
    width: 100% !important;
    max-width: 350px !important;
    margin: 6px auto 0 !important;
    padding: 24px 0 10px !important;
    min-height: 275px !important;
    max-height: 310px !important;
    overflow: visible !important;
  }

  /* Background Ambient Soft Glow */
  .pmHero__visual::before {
    content: "" !important;
    position: absolute !important;
    inset: -10px -20px 0 !important;
    background: radial-gradient(circle at 50% 65%, rgba(238, 242, 255, 0.95) 0%, rgba(250, 245, 255, 0.45) 55%, transparent 80%) !important;
    pointer-events: none !important;
    z-index: 1 !important;
  }

  /* Curved Upward Arrow Doodle */
  .pmHero__doodle {
    display: block !important;
    position: absolute !important;
    right: 8px !important;
    top: 8px !important;
    width: 48px !important;
    height: 48px !important;
    z-index: 2 !important;
    opacity: 0.7 !important;
    pointer-events: none !important;
  }

  .pmHero__doodleArrow {
    width: 100% !important;
    height: 100% !important;
    display: block !important;
  }

  /* Flat Front-Facing Laptop Mockup */
  .pmLaptopMockup,
  .pmPage .pmLaptopMockup {
    width: 285px !important;
    max-width: 86vw !important;
    margin: 0 auto !important;
    transform: none !important;
    position: relative !important;
    z-index: 3 !important;
    filter: drop-shadow(0 14px 28px rgba(15, 23, 42, 0.12)) !important;
  }

  .pmLaptop__screenLid {
    background: #0B132B !important;
    border-radius: 9px 9px 0 0 !important;
    padding: 4px 4px 0 !important;
    border: 1.5px solid #1E293B !important;
    border-bottom: none !important;
    box-shadow: none !important;
    transform: none !important;
  }

  .pmLaptop__screenBezel {
    border-radius: 5px 5px 0 0 !important;
    overflow: hidden !important;
    background: #FAF8FF !important;
  }

  .pmLaptop__notch {
    width: 24px !important;
    height: 4px !important;
    border-radius: 0 0 3px 3px !important;
    background: #0B132B !important;
    margin: 0 auto !important;
    position: relative !important;
    z-index: 5 !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
  }

  .pmLaptop__camera {
    width: 2px !important;
    height: 2px !important;
    border-radius: 50% !important;
    background: #38BDF8 !important;
  }

  /* Laptop Base / Deck */
  .pmLaptop__deck {
    height: 9px !important;
    background: linear-gradient(180deg, #E2E8F0 0%, #94A3B8 100%) !important;
    border-radius: 0 0 8px 8px !important;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.22) !important;
    position: relative !important;
    display: flex !important;
    justify-content: center !important;
    align-items: flex-start !important;
  }

  .pmLaptop__deckNotch {
    display: block !important;
    width: 32px !important;
    height: 2.5px !important;
    background: #64748B !important;
    border-radius: 0 0 2.5px 2.5px !important;
  }

  .pmLaptop__deckHinge,
  .pmLaptop__deckKeys,
  .pmLaptop__deckTrackpad {
    display: none !important;
  }

  /* Dashboard Inside Screen */
  .pmDash {
    padding: 5px 6px 6px !important;
    background: #FAF8FF !important;
    font-size: 7px !important;
  }

  .pmDash__nav {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    margin-bottom: 5px !important;
    padding-bottom: 3.5px !important;
    border-bottom: 1px solid #EEF2F6 !important;
  }

  .pmDash__logo {
    display: flex !important;
    align-items: center !important;
    gap: 3px !important;
  }

  .pmDash__logoIcon {
    width: 11px !important;
    height: 11px !important;
    border-radius: 3px !important;
    font-size: 6.5px !important;
  }

  .pmDash__logoText {
    font-size: 7.5px !important;
    font-weight: 800 !important;
    color: #0B132B !important;
  }

  .pmDash__navTabs {
    display: flex !important;
    gap: 5px !important;
  }

  .pmDash__navTab {
    font-size: 6px !important;
    font-weight: 650 !important;
    color: #64748B !important;
    padding-bottom: 1px !important;
  }

  .pmDash__navTab.active {
    color: #6D28D9 !important;
    border-bottom: 1px solid #6D28D9 !important;
  }

  .pmDash__datePill {
    font-size: 5.5px !important;
    padding: 1px 4px !important;
    border-radius: 99px !important;
    border: 0.5px solid #E2E8F0 !important;
    color: #475569 !important;
    gap: 2px !important;
  }

  /* Body Wrap with Sidebar */
  .pmDash__bodyWrap {
    display: flex !important;
    gap: 5px !important;
    align-items: stretch !important;
  }

  .pmDash__sidebar {
    display: flex !important;
    flex-direction: column !important;
    gap: 2.5px !important;
    width: 44px !important;
    flex-shrink: 0 !important;
    border-right: 1px solid #EEF2F6 !important;
    padding-right: 3px !important;
  }

  .pmDash__sideItem {
    display: flex !important;
    align-items: center !important;
    gap: 2.5px !important;
    padding: 1.5px 3px !important;
    border-radius: 3px !important;
    font-size: 5.8px !important;
    font-weight: 600 !important;
    color: #64748B !important;
  }

  .pmDash__sideItem.active {
    background: #F3E8FF !important;
    color: #6D28D9 !important;
    font-weight: 750 !important;
  }

  .pmDash__sideItem svg {
    width: 7.5px !important;
    height: 7.5px !important;
    flex-shrink: 0 !important;
  }

  .pmDash__mainContent {
    flex: 1 !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
  }

  .pmDash__metricsRow1 {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 4px !important;
    margin-bottom: 0 !important;
  }

  .pmDashCard {
    padding: 4px 5px !important;
    border-radius: 5px !important;
    background: #FFFFFF !important;
    border: 1px solid #EEF2F6 !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.02) !important;
  }

  .pmDashCard__title {
    font-size: 6px !important;
    font-weight: 700 !important;
    color: #64748B !important;
    margin-bottom: 1.5px !important;
  }

  .pmDashCard__statRow {
    display: flex !important;
    align-items: baseline !important;
    gap: 3px !important;
  }

  .pmDashCard__iconWrap {
    display: none !important;
  }

  .pmDashCard__mainValue {
    font-size: 10px !important;
    font-weight: 850 !important;
    color: #0B132B !important;
  }

  .pmDashCard__trend {
    font-size: 5.5px !important;
    font-weight: 700 !important;
    padding: 0.5px 2.5px !important;
    border-radius: 99px !important;
    background: #ECFDF5 !important;
    color: #059669 !important;
  }

  .pmDashCard__wave svg {
    height: 12px !important;
    margin-top: 2px !important;
  }

  /* Trend Bar Chart */
  .pmDash__trendChart {
    display: block !important;
    background: #FFFFFF !important;
    border: 1px solid #EEF2F6 !important;
    border-radius: 5px !important;
    padding: 4px 6px !important;
    margin-top: 2px !important;
  }

  .pmDash__trendHeader {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    margin-bottom: 3px !important;
  }

  .pmDash__trendTitle {
    font-size: 6px !important;
    font-weight: 750 !important;
    color: #1E293B !important;
  }

  .pmDash__trendSelect {
    font-size: 5px !important;
    font-weight: 600 !important;
    color: #64748B !important;
    border: 0.5px solid #E2E8F0 !important;
    border-radius: 3px !important;
    padding: 0.5px 3px !important;
  }

  .pmDash__barRow {
    display: flex !important;
    justify-content: space-between !important;
    align-items: flex-end !important;
    height: 25px !important;
    padding: 0 3px !important;
  }

  .pmDash__barCol {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 2px !important;
  }

  .pmDash__barCol span {
    font-size: 4.8px !important;
    color: #94A3B8 !important;
    font-weight: 600 !important;
  }

  .pmDash__bar {
    width: 6.5px !important;
    border-radius: 1.5px 1.5px 0 0 !important;
    background: #DDD6FE !important;
  }

  .pmDash__bar.b1 { height: 8px !important; }
  .pmDash__bar.b2 { height: 12px !important; }
  .pmDash__bar.b3 { height: 10px !important; }
  .pmDash__bar.b4 { height: 15px !important; }
  .pmDash__bar.b5 { height: 17px !important; }
  .pmDash__bar.b6.active { height: 21px !important; background: #8B5CF6 !important; }

  .pmDash__metricsRow2,
  .pmDash__tableSection {
    display: none !important;
  }

  /* Floating Card 1: Qualified Leads (Top-Left) */
  .pmCard--leads {
    display: block !important;
    position: absolute !important;
    left: -12px !important;
    top: 14px !important;
    z-index: 10 !important;
    background: #FFFFFF !important;
    border: 1px solid rgba(255, 255, 255, 0.95) !important;
    border-radius: 11px !important;
    padding: 6px 10px 5px !important;
    box-shadow: 0 10px 24px rgba(124, 58, 237, 0.12), 0 2px 6px rgba(0, 0, 0, 0.04) !important;
    width: 136px !important;
    transform: none !important;
  }

  .pmCard--leads .pmCard__top {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    margin-bottom: 2px !important;
  }

  .pmCard--leads .pmCard__icon {
    width: 22px !important;
    height: 22px !important;
    border-radius: 6px !important;
    background: #F3E8FF !important;
    color: #7C3AED !important;
    display: grid !important;
    place-items: center !important;
    flex-shrink: 0 !important;
  }

  .pmCard--leads .pmCard__value {
    font-size: 13px !important;
    font-weight: 900 !important;
    color: #0B132B !important;
    line-height: 1.1 !important;
  }

  .pmCard--leads .pmCard__label {
    font-size: 8.5px !important;
    font-weight: 650 !important;
    color: #64748B !important;
    line-height: 1 !important;
  }

  .pmCard--leads .pmCard__arrowBtn {
    display: none !important;
  }

  .pmCard--leads .pmCard__sparkline svg {
    height: 16px !important;
    width: 100% !important;
  }

  /* Floating Card 2: Sales Growth (Right) */
  .pmCard--sales {
    display: block !important;
    position: absolute !important;
    right: -10px !important;
    bottom: 38px !important;
    z-index: 10 !important;
    background: #FFFFFF !important;
    border: 1px solid rgba(255, 255, 255, 0.95) !important;
    border-radius: 11px !important;
    padding: 6px 10px 5px !important;
    box-shadow: 0 10px 24px rgba(249, 115, 22, 0.12), 0 2px 6px rgba(0, 0, 0, 0.04) !important;
    width: 132px !important;
    transform: none !important;
  }

  .pmCard--sales .pmCard__top {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    margin-bottom: 2px !important;
  }

  .pmCard--sales .pmCard__icon {
    width: 22px !important;
    height: 22px !important;
    border-radius: 6px !important;
    background: #FFF7ED !important;
    color: #F97316 !important;
    display: grid !important;
    place-items: center !important;
    flex-shrink: 0 !important;
  }

  .pmCard--sales .pmCard__value {
    font-size: 13px !important;
    font-weight: 900 !important;
    color: #0B132B !important;
    line-height: 1.1 !important;
  }

  .pmCard--sales .pmCard__label {
    font-size: 8.5px !important;
    font-weight: 650 !important;
    color: #64748B !important;
    line-height: 1 !important;
  }

  .pmCard--sales .pmCard__arrowBtn {
    display: none !important;
  }

  .pmCard--sales .pmCard__sparkline svg {
    height: 16px !important;
    width: 100% !important;
  }

  /* Other Floating Badges Hidden on Mobile */
  .pmCard--campaigns,
  .pmBadge3D--google,
  .pmBadge3D--meta,
  .pmBadge3D--chart,
  .pmRockPedestal {
    display: none !important;
  }

  /* All Grids Single Column on Mobile */
  .pmLeaks__cardsRow {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  .pmSystem__grid {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  .pmResults__cardsGrid {
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }

  .pmResults__cardsGrid > :last-child {
    grid-column: auto !important;
  }

  /* Transparency Mobile Layout */
  .pmTransparency__stepThumbWrap {
    width: 28px !important;
    height: 28px !important;
  }

  .pmTransparency__dashCard {
    padding: 18px 14px !important;
  }
}

/* --------------------------------------------------------------------------
   SMALL MOBILE BREAKPOINT (<= 480px)
   -------------------------------------------------------------------------- */
@media (max-width: 480px) {
  .pmHero,
  .pmLeaks,
  .pmSystem,
  .pmResults,
  .pmTransparency,
  .pmFaq,
  .pmPage .cyStudioCta,
  .pmPage .cmFooter {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
}

/* ==========================================================================
   COSMIC CTA SECTION: AIR & SPACING OVERRIDE
   ========================================================================== */
.pmPage .cyStudioCta {
  width: 100% !important;
  padding: clamp(60px, 7vh, 90px) 24px clamp(70px, 8vh, 100px) !important;
  box-sizing: border-box !important;
}

.pmPage .cyStudioCta__container {
  width: min(var(--container-width, 1400px), 100%) !important;
  max-width: var(--container-width, 1400px) !important;
  margin: 0 auto !important;
  padding: 0 !important;
  display: block !important;
  box-sizing: border-box !important;
}

.pmPage .cyStudioCta__card {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* Final FAQ cascade guard: preserve the reference-specific composition. */
.pmPage .pmFaq__title {
  max-width: 480px;
  margin: 0;
  font-family: Inter, sans-serif;
  font-size: clamp(2.25rem, 3.5vw, 3.45rem);
  font-weight: 850;
  line-height: 1.03;
  letter-spacing: -0.055em;
}

.pmPage .pmFaq__subtitle {
  max-width: 400px;
  margin: 16px 0 0;
  font-size: 0.94rem;
  line-height: 1.5;
}

@media (max-width: 640px) {
  .pmPage .pmFaq {
    padding: 30px 14px !important;
  }

  .pmPage .pmFaq__title {
    font-size: clamp(2rem, 11vw, 2.75rem);
  }
}

/* Keep the original hero artwork; only tighten the left-side content. */
.pmPage .pmHero__eyebrow {
  margin-bottom: 12px !important;
}

.pmPage .pmHero__title {
  margin-bottom: 12px;
  font-size: clamp(2.3rem, 3.5vw, 3.25rem);
  line-height: 1.1;
}

.pmPage .pmHero__titleGradient {
  background: var(--gradient-brand);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: var(--color-purple);
}

.pmPage .pmHero__desc {
  max-width: 500px;
  margin-bottom: 20px;
  font-size: 0.98rem;
  line-height: 1.5;
}

.pmPage .pmHero__actions {
  margin-bottom: 20px;
}

.pmPage .pmHero__channelStrip {
  margin-bottom: 16px;
}

.pmPage .pmChannel__optional {
  display: none;
}

.pmPage .pmHero__quoteRow {
  padding-top: 0;
}

@media (max-width: 640px) {
  .pmPage .pmHero__title {
    font-size: 2.1rem !important;
  }

  .pmPage .pmHero__actions {
    margin-bottom: 16px;
  }
}

/* Compact hero and root-problem sections without changing their visual style. */
.pmPage .pmHero {
  padding-bottom: clamp(38px, 4vw, 52px) !important;
}

.pmPage .pmHero__container {
  gap: clamp(24px, 3vw, 40px);
  margin-top: 28px;
  padding-top: 24px;
}

.pmPage .pmHero__visual {
  min-height: 500px;
}

.pmPage .pmLaptopMockup {
  width: 480px;
  margin-top: 4px;
  margin-bottom: 10px;
}

.pmPage .pmRockPedestal {
  width: 550px;
  bottom: -18px;
}

.pmPage .pmLeaks {
  padding: clamp(34px, 3.5vw, 46px) 24px !important;
}

.pmPage .pmLeaks__header {
  margin-bottom: 28px !important;
}

.pmPage .pmLeaks__title {
  margin-bottom: 8px;
  font-size: clamp(1.9rem, 2.6vw, 2.5rem);
  line-height: 1.12;
}

.pmPage .pmLeaks__subtitle {
  font-size: 0.95rem;
  line-height: 1.5;
}

.pmPage .pmLeaks__pipeRow {
  height: 96px;
}

.pmPage .pmLeaks__stageCircle {
  width: 42px;
  height: 42px;
}

.pmPage .pmLeaks__nodeLabel {
  margin-top: 5px;
  font-size: 0.8rem;
}

.pmPage .pmLeaks__cardsRow {
  gap: 16px;
}

.pmPage .pmLeaks__card {
  min-height: 104px;
  padding: 16px 16px 14px;
}

.pmPage .pmLeaks__cardHeader {
  margin-bottom: 6px;
}

.pmPage .pmLeaks__cardText {
  font-size: 0.78rem;
  line-height: 1.42;
}

.pmPage .pmLeaks__footer {
  margin-top: 30px;
}

.pmPage .pmLeaks__footerTitle {
  font-size: clamp(1.3rem, 1.8vw, 1.65rem);
}

.pmPage .pmLeaks__footerSubtitle {
  font-size: 0.94rem;
}

@media (max-width: 1180px) {
  .pmPage .pmHero__visual {
    min-height: 460px;
  }

  .pmPage .pmLaptopMockup {
    width: 440px;
  }

  .pmPage .pmRockPedestal {
    width: 505px;
  }
}

@media (max-width: 768px) {
  .pmPage .pmHero {
    padding-bottom: 32px !important;
  }

  /* ==========================================================================
     THE ROOT PROBLEM — EXACT MOBILE VIEW MATCH TO REFERENCE DESIGN (<= 768px)
     ========================================================================== */
  .pmPage .pmLeaks,
  .pmLeaks {
    padding: 36px 16px 36px !important;
    background: #FFFFFF !important;
    position: relative !important;
    overflow: hidden !important;
  }

  .pmLeaks__container {
    padding: 0 !important;
    max-width: 440px !important;
    margin: 0 auto !important;
  }

  .pmLeaks__desktopView {
    display: none !important;
  }

  .pmLeaks__mobileView {
    display: block !important;
    width: 100% !important;
  }

  /* Eyebrow: Left-aligned dash with purple text */
  .pmMobRoot__eyebrow {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin-bottom: 12px !important;
  }

  .pmMobRoot__eyebrowDash {
    display: inline-block !important;
    width: 22px !important;
    height: 2px !important;
    background: #7C3AED !important;
    border-radius: 2px !important;
  }

  .pmMobRoot__eyebrowText {
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: 0.08em !important;
    color: #7C3AED !important;
    text-transform: uppercase !important;
  }

  /* Title */
  .pmMobRoot__title {
    font-size: 32px !important;
    font-weight: 900 !important;
    line-height: 1.15 !important;
    letter-spacing: -0.025em !important;
    color: #0B132B !important;
    margin: 0 0 10px 0 !important;
    text-align: left !important;
  }

  .pmMobRoot__titleGrad {
    background: linear-gradient(90deg, #9333EA 0%, #EC4899 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    font-weight: 900 !important;
  }

  /* Subtitle */
  .pmMobRoot__subtitle {
    font-size: 14px !important;
    line-height: 1.45 !important;
    color: #64748B !important;
    font-weight: 450 !important;
    margin: 0 0 20px 0 !important;
    text-align: left !important;
  }

  /* Problem Cards Stack */
  .pmMobRoot__cards {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    margin-bottom: 20px !important;
  }

  .pmMobRoot__card {
    background: #FFFFFF !important;
    border: 1px solid rgba(226, 232, 240, 0.85) !important;
    border-radius: 18px !important;
    padding: 12px 14px !important;
    box-shadow: 0 3px 12px rgba(15, 23, 42, 0.03) !important;
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    text-align: left !important;
  }

  .pmMobRoot__icon {
    width: 48px !important;
    height: 48px !important;
    border-radius: 14px !important;
    display: grid !important;
    place-items: center !important;
    flex-shrink: 0 !important;
  }

  .pmMobRoot__icon--peach {
    background: #FFF1EE !important;
  }

  .pmMobRoot__icon--purple {
    background: #F3E8FF !important;
  }

  .pmMobRoot__icon--amber {
    background: #FFFBEB !important;
  }

  .pmMobRoot__icon--cyan {
    background: #E0F2FE !important;
  }

  .pmMobRoot__cardContent {
    flex: 1 !important;
    min-width: 0 !important;
  }

  .pmMobRoot__cardTitle {
    font-size: 15px !important;
    font-weight: 800 !important;
    color: #0B132B !important;
    margin: 0 0 2px 0 !important;
    letter-spacing: -0.01em !important;
  }

  .pmMobRoot__cardDesc {
    font-size: 12.5px !important;
    color: #64748B !important;
    line-height: 1.35 !important;
    margin: 0 !important;
  }

  .pmMobRoot__cardArrow {
    width: 32px !important;
    height: 32px !important;
    border-radius: 50% !important;
    border: 1px solid #E2E8F0 !important;
    background: #FFFFFF !important;
    display: grid !important;
    place-items: center !important;
    color: #0B132B !important;
    flex-shrink: 0 !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02) !important;
  }

  /* Banner Card: Fix these leaks and scale with confidence */
  .pmMobRoot__banner {
    background: linear-gradient(135deg, rgba(238, 242, 255, 0.75) 0%, rgba(253, 242, 248, 0.75) 100%) !important;
    border: 1px solid rgba(226, 232, 240, 0.9) !important;
    border-radius: 18px !important;
    padding: 18px 16px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    margin-bottom: 18px !important;
    position: relative !important;
    overflow: hidden !important;
    text-align: left !important;
  }

  .pmMobRoot__bannerContent {
    flex: 1 !important;
    min-width: 0 !important;
  }

  .pmMobRoot__bannerTitle {
    font-size: 17px !important;
    font-weight: 900 !important;
    line-height: 1.2 !important;
    color: #0B132B !important;
    margin: 0 0 6px 0 !important;
    letter-spacing: -0.01em !important;
  }

  .pmMobRoot__bannerGrad {
    background: linear-gradient(90deg, #7C3AED 0%, #EC4899 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
  }

  .pmMobRoot__bannerDesc {
    font-size: 12px !important;
    color: #64748B !important;
    line-height: 1.35 !important;
    margin: 0 !important;
  }

  .pmMobRoot__bannerGraphic {
    width: 85px !important;
    height: 65px !important;
    flex-shrink: 0 !important;
    display: flex !important;
    align-items: flex-end !important;
    justify-content: flex-end !important;
  }

  /* CTA Button: Red-Coral Pill */
  .pmMobRoot__btn {
    width: 100% !important;
    border-radius: 9999px !important;
    background: linear-gradient(90deg, #F87171 0%, #EF4444 35%, #F97316 100%) !important;
    color: #FFFFFF !important;
    font-size: 15px !important;
    font-weight: 750 !important;
    padding: 13.5px 20px !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 8px !important;
    border: none !important;
    text-align: center !important;
    text-decoration: none !important;
    box-shadow: 0 8px 24px -4px rgba(239, 68, 68, 0.45) !important;
    margin-bottom: 20px !important;
    letter-spacing: -0.01em !important;
    transition: transform 0.2s, box-shadow 0.2s !important;
  }

  .pmMobRoot__btn:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 10px 28px -4px rgba(239, 68, 68, 0.55) !important;
  }

  .pmMobRoot__btnArrow {
    font-size: 16px !important;
    transition: transform 0.2s !important;
  }

  .pmMobRoot__btn:hover .pmMobRoot__btnArrow {
    transform: translateX(3px) !important;
  }

  /* Trust Badges Row */
  .pmMobRoot__trustRow {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 8px !important;
    width: 100% !important;
    margin: 0 auto !important;
    flex-wrap: nowrap !important;
  }

  .pmMobRoot__trustItem {
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
    color: #64748B !important;
    font-size: 11.5px !important;
    font-weight: 600 !important;
    white-space: nowrap !important;
  }

  .pmMobRoot__trustItem svg {
    flex-shrink: 0 !important;
  }

  .pmMobRoot__trustDiv {
    display: inline-block !important;
    width: 1px !important;
    height: 14px !important;
    background: #E2E8F0 !important;
    flex-shrink: 0 !important;
  }
}

@media (max-width: 640px) {
  .pmPage .pmHero__visual {
    min-height: 195px !important;
    max-height: 225px !important;
  }

  .pmPage .pmLaptopMockup {
    width: 220px !important;
    margin-bottom: 0 !important;
    transform: scale(0.88) !important;
    transform-origin: top center !important;
  }

  .pmPage .pmRockPedestal {
    width: 260px !important;
    bottom: -6px !important;
  }
}

/* Compact verified case-studies section. */
.pmPage .pmResults {
  padding: clamp(34px, 3.5vw, 46px) 24px !important;
}

.pmPage .pmResults__header {
  margin-bottom: 28px !important;
}

.pmPage .pmResults__eyebrow {
  margin-bottom: 9px !important;
}

.pmPage .pmResults__title {
  margin-bottom: 8px;
  font-size: clamp(1.9rem, 2.6vw, 2.5rem);
  line-height: 1.12;
}

.pmPage .pmResults__subtitle {
  font-size: 0.95rem;
  line-height: 1.5;
}

.pmPage .pmResults__cardsGrid {
  gap: 18px;
  margin-bottom: 30px;
}

.pmPage .pmResults__card {
  padding: 20px 18px 17px;
  border-radius: 16px;
}

.pmPage .pmResults__cardTop,
.pmPage .pmResults__heroMetric,
.pmPage .pmResults__subMetrics,
.pmPage .pmResults__changedBox {
  margin-bottom: 10px;
}

.pmPage .pmResults__valOld,
.pmPage .pmResults__valNew {
  font-size: 1.7rem;
}

.pmPage .pmResults__subMetrics {
  padding: 7px 10px;
}

.pmPage .pmResults__cardFooter {
  padding-top: 8px;
}

.pmPage .pmResults__testimonialsGrid {
  gap: 18px;
  margin-bottom: 30px;
}

.pmPage .pmResults__testimonialCard {
  grid-template-columns: 72px 1fr;
  gap: 16px;
  padding: 17px 18px;
  border-radius: 16px;
}

.pmPage .pmResults__testiImgWrap {
  width: 72px;
  height: 72px;
}

.pmPage .pmResults__ctaDecor {
  margin-bottom: 3px;
}

@media (max-width: 768px) {
  .pmPage .pmResults {
    padding: 30px 16px 34px !important;
  }

  .pmPage .pmResults__header {
    margin-bottom: 22px !important;
  }

  .pmPage .pmResults__cardsGrid,
  .pmPage .pmResults__testimonialsGrid {
    margin-bottom: 24px;
  }
}

@media (max-width: 640px) {
  .pmPage .pmResults__card {
    padding: 16px 14px;
  }

  .pmPage .pmResults__testimonialCard {
    padding: 14px;
  }
}

/* ==========================================================================
   CYBROMEDIA UNIVERSAL TYPOGRAPHY SYNC (HOMEPAGE HARMONY)
   Enforces identical font family, size, weight, and line height across
   h1, h2, h3, and descriptions to match the homepage 100%.
   ========================================================================== */

/* 1. Universal Font Families */
h1, h2, h3, h4, h5, h6,
[class*="Hero__title"], [class*="Hero__heading"], [class*="HeroTitle"],
[class*="__title"], [class*="__heading"] {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
}

p, [class*="__desc"], [class*="__description"], [class*="__subtitle"], [class*="__subheading"], [class*="__intro"], [class*="__subtext"] {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
}

/* 2. Universal H1 / Hero Heading (Exact Homepage Scale) */
h1,
.cyHero__title,
.cyStudioHero__title,
.smmHero__title,
.pmHero__title,
.cpHero__title,
.brandHero__heading,
.workHero__title,
.indHero__title,
.insHero__title,
.cHero__title,
[class*="Hero__title"],
[class*="Hero__heading"] {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  font-size: clamp(48px, 4.5vw, 68px) !important;
  font-weight: 800 !important;
  line-height: 1.08 !important;
  letter-spacing: -0.035em !important;
}

/* 3. Universal H2 / Section Headings (Exact Homepage Scale) */
h2,
.cyProof__title,
.growth-system h2,
.cy-services h2,
.cy-industries h2,
.cyAeoShift__heading,
.cybrProofSection__title,
.cyChoiceMedia__heading,
.cyProcessFlow__title,
.cyClientVoice__heading,
.cy-story__title,
.cy-beliefs__heading,
.cy-people__heading,
.cy-studio-inside__heading,
.cy-process__heading,
.cy-cost__title,
.cy-problem__title,
.smmServices__title,
.smmPlatforms__title,
.smmFaq__title,
.pmLeaks__title,
.pmSystem__title,
.pmResults__title,
.pmFaq__title,
.cpProblem__title,
.cpReframe__title,
.cpFormats__title,
.cpProof__heroTitle,
.cpSystem__title,
.cpPackages__title,
.cpWhy__title,
.cpFaq__title,
.brandProblem__heading,
.brandWwd__title,
.brandProof__title,
.brandProcess__title,
.brandPackages__title,
.allWork__title,
.workFeatured__title,
.workFeatCard__headline,
.workResults__title,
.clientVoice__title,
.csNext__title,
.indReality__title,
.indJourney__title,
.indPlan__title,
.indCal__title,
.indFaq__title,
.insBanner__title,
.freeTools__title,
.cCard__title,
.cEnquiry__title,
.cStudio__title,
.cQuickTitle,
.cOtherDarkTitle {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  font-size: clamp(32px, 3.4vw, 48px) !important;
  font-weight: 800 !important;
  line-height: 1.12 !important;
  letter-spacing: -0.03em !important;
}

/* Compact section headings (FAQ & CTA) */
.cyFaqReplica__heading,
.cyStudioCta__heading {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  font-size: clamp(28px, 2.8vw, 38px) !important;
  font-weight: 800 !important;
  line-height: 1.12 !important;
  letter-spacing: -0.03em !important;
}

/* 4. Universal H3 / Card Titles */
h3,
.growth-card h3,
.cy-service-card h3,
.cy-industry-card h3,
.cyProcessFlow__cardTitle,
.cybrProofSection__cardTitle,
.cyStudioCurve__card h3,
.cyStudioNote h3,
.smmCard h3,
.brandProblemCard h3 {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  font-size: clamp(18px, 1.4vw, 22px) !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  letter-spacing: -0.02em !important;
}

/* 5. Universal Descriptions / Subtitles / Paragraphs (Exact Homepage Scale) */
.cyHero__description,
.system-description,
.cy-services__intro,
.cy-industries__intro,
.cyAeoShift__text p,
.cybrProofSection__subtitle,
.cyChoiceMedia__subheading,
.cyProcessFlow__subtitle,
.cyClientVoice__description,
.cyFaqReplica__description,
.cy-beliefs__desc,
.cy-people__bridge-text,
.cy-people__subtext,
.cy-process__bridge-text,
.cy-process__desc,
.cy-process__expect-text,
.cy-process__subheading,
.smmHero__desc,
.cy-problem__intro,
.cy-cost__description,
.smmServices__subtitle,
.smmPlatforms__subtitle,
.smmFaq__desc,
.pmHero__desc,
.pmLeaks__subtitle,
.pmSystem__subhead,
.pmResults__subtitle,
.pmFaq__subtitle,
.cpHero__subtitle,
.cpProblem__subtitle,
.cpReframe__subtitle,
.cpFormats__subtitle,
.cpSystem__subtitle,
.cpPackages__subtitle,
.cpWhy__subtitle,
.cpFaq__subtitle,
.brandHero__desc,
.brandProblem__subtitle,
.brandReframe__desc,
.brandWwd__subtitle,
.brandProcess__subtitle,
.workHero__subtitle,
.workFeatured__subtitle,
.workResults__subtitle,
.clientVoice__subtitle,
.csNext__desc,
.indHero__desc,
.indReality__desc,
.indJourney__desc,
.indPlan__subtitle,
.indCal__subtitle,
.indFaq__subtitle,
.insHero__desc,
.insBanner__subtitle,
.freeTools__subtitle,
.cCard__subtitle,
.cEnquiry__subtitle,
.cNextBox__subtitle,
[class*="__subtitle"],
[class*="__subheading"],
[class*="__intro"],
[class*="__lead"] {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
}

/* 6. Universal Responsive Scales (≤ 991px Tablets & Mobile) */
@media (max-width: 991px) {
  h1,
  .cyHero__title,
  .cyStudioHero__title,
  .smmHero__title,
  .pmHero__title,
  .cpHero__title,
  .brandHero__heading,
  .workHero__title,
  .indHero__title,
  .insHero__title,
  .cHero__title,
  [class*="Hero__title"],
  [class*="Hero__heading"] {
    font-size: clamp(28px, 7.5vw, 38px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
  }

  h2,
  .cyProof__title,
  .growth-system h2,
  .cy-services h2,
  .cy-industries h2,
  .cyAeoShift__heading,
  .cybrProofSection__title,
  .cyChoiceMedia__heading,
  .cyProcessFlow__title,
  .cyClientVoice__heading,
  .cyFaqReplica__heading,
  .cyStudioCta__heading {
    font-size: clamp(24px, 6.5vw, 32px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
  }

  /* Highlighted words inside headings match their heading's size */
  h1 span[class*="__title"],
  h1 span[class*="__heading"],
  h2 span[class*="__title"],
  h2 span[class*="__heading"] {
    font-size: inherit !important;
  }

  .cyHero__description,
  .system-description,
  .cy-services__intro,
  .cy-industries__intro,
  .cyAeoShift__text p,
  .cybrProofSection__subtitle,
  .cyChoiceMedia__subheading,
  .cyProcessFlow__subtitle,
  .cyClientVoice__description,
  .cyFaqReplica__description,
  [class*="__subtitle"],
  [class*="__subheading"],
  [class*="__intro"],
  [class*="__desc"] {
    font-size: 14px !important;
    line-height: 1.55 !important;
  }
}

/* Small phones: let the hero eyebrow wrap instead of running off-screen */
@media (max-width: 400px) {
  .pmHero__eyebrow .pmHero__eyebrowText {
    white-space: normal !important;
    text-align: center;
    line-height: 1.5;
  }
}