
:root{
	--db-hero-start:#4484B2;
	--db-hero-end:#4A64E0;
	--db-a:#C7DEEB; /* light blue */
	--db-b:#E3E6E9; /* light grey */
	--db-b:#F5F5F5; /* light grey */
	--db-footer:#7B679A;
	--db-dots:rgba(0,0,0,.035);
}


/* ========== THEME OVERRIDES ========== */

/* Green */
[data-theme="green"] {

	--db-hero-start: #57C785; /* Light Mint Green */
	--db-hero-end:   #2BA26E; /* Medium Jade */
	--db-hero-start: #009688; /* Teal */
	--db-hero-end:   #00695C; /* Darker teal */
  --db-hero-start: #2E8B57; /* Sea Green */
  --db-hero-end:   #1C6E3E; /* Deeper Forest Green */
}

/* Orange */
[data-theme="orange"] {
	--db-hero-start: #FF8C42; /* Warm Tangerine */
	--db-hero-end:   #E65C00; /* Deep Orange */
	--db-hero-start: #FF7E67; /* Coral Orange */
  --db-hero-end:   #FF3C00; /* Bright Persimmon */
  --db-hero-start: #F9A826; /* Golden Honey */
  --db-hero-end:   #F57C00; /* Medium Orange */
	--db-hero-start: #FF8C42; /* Warm Tangerine */
	--db-hero-end:   #E65C00; /* Deep Orange */
}

/* Blue (explicit, optional if your :root is already blue) */
[data-theme="blue"] {
  --db-hero-start: #4484B2;
  --db-hero-end:   #4A64E0;
}
[data-theme="plum"] {
  --db-hero-start: #FF4F9A; /* Hot Pink */
  --db-hero-end:   #B91C74; /* Deep Magenta */
  --db-hero-start: #C64CA8; /* Medium Orchid */
  --db-hero-end:   #7A3B8F; /* Soft Grape */
  --db-hero-start: #E0457B; /* Vibrant Magenta Pink */
  --db-hero-end:   #A12C6A; /* Deep Rose Violet */
}



    /* ===== Global/layout ===== */
    body{ padding-top: 3.5rem; } /* offset for fixed-top navbar */

		/* Prevent horizontal scrollbar caused by wide elements */
		html, body {
		  font-family: Roboto, "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
			overflow-x: hidden;
		}

p { font-size:1.25em; }



    .block{ position:relative; }
    .block-padding{ padding:2rem 0; }
    @media (min-width:992px){ .block-padding{ padding:2rem 0; } }

    /* ===== Navbar (fixed top) ===== */
    .navbar-brand { font-weight:700; letter-spacing:.2px; }
    .navbar.fixed-top { backdrop-filter: saturate(120%) blur(4px); }

/* ===== Hero (scales with the page) ===== */
.block--hero{
  color:#fff;
  /* remove: min-height:72vh; */
  padding-top:  clamp(2.5rem, 6vh, 5rem);
  padding-bottom: clamp(3.5rem, 10vh, 7rem);
  background:
    radial-gradient(1200px 600px at 15% 25%, rgba(255,255,255,.10), transparent 60%),
    radial-gradient(1200px 600px at 85% 20%, rgba(255,255,255,.08), transparent 60%),
    radial-gradient(var(--db-dots) 1px, transparent 1px) 0 0/22px 22px,
    linear-gradient(135deg,var(--db-hero-start),var(--db-hero-end));
}

    /* Right graphic treatment (tilt + drop shadow) */
    .hero-image{
      max-width:520px;
      /*transform: rotate(+2deg) translateY(6px);*/
      filter: drop-shadow(0 20px 32px rgba(0,0,0,.35));
      /* swap fade */
      transition: opacity .8s ease-in-out;
    }

    .hero-image-nomax{
      filter: drop-shadow(0 20px 32px rgba(0,0,0,.35));
      /* swap fade */
      transition: opacity .8s ease-in-out;
    }

    .fade-out{ opacity:0; }

    @media (max-width:991.98px){
      .block--hero{ min-height:auto; padding-top:3.5rem; padding-bottom:6rem; text-align:center; }
      .hero-image{ max-width:82%; transform:none; margin-top:2rem; }
      .hero-image-nomax{ max-width:92%; transform:none; margin-top:2rem; }
    }

    /* ===== Section backgrounds ===== */
    .block--a{ background:var(--db-a); } /* light blue */
    .block--b{ background:var(--db-b); } /* light grey */
    .block--footer{ background:var(--db-footer); color:#cbd5e1; }

    /* ===== Waves ===== */
    .wave{ position:absolute; left:0; width:100%; line-height:0; }
    .wave-bottom{ bottom:-1px; }
    .wave svg{ display:block; width:100%; height:120px; }
    @media (min-width:1200px){ .wave svg{ height:150px; } }

    /* Variety knobs */
    .wave--sm svg{ height:90px; }
    .wave--lg svg{ height:180px; }
    .flip-x{ transform:scaleX(-1); transform-origin:center; }


    /* Buttons (just a friendly pop) */
    .btn-success { background:#39c16c; border:0; }
    .btn-success:hover { background:#2fa95c; }

		.nowrap {
			white-space: nowrap;
			word-break: keep-all;
			hyphens: none;
		}


		.stats-grid {
			display:flex;
			justify-content:center;
			gap:2rem;
			flex-wrap:wrap;
			margin-top:2rem;
		}

		.stat-card {
			background:var(--card-bg);
			color:#fff;
			border-radius:1.5rem;
			width:18rem;
			/*height:22rem;*/
			text-align:center;
			box-shadow:0 1rem 2rem rgba(0,0,0,0.18);
			padding:2rem 1.5rem;
			position:relative;
			overflow:hidden;
			transition:transform .25s ease, box-shadow .25s ease;
			border: 3px solid #fff;
		}

		.stat-card:hover {
			transform:translateY(-6px);
			box-shadow:0 1.25rem 2.5rem rgba(0,0,0,0.25);
		}

		/* gigantic centered icons */
		.card-icon {
			width:8rem;
			height:8rem;
			color:var(--icon-color);
			opacity:.9;
			margin:0 auto 1.5rem;
			display:block;
			background:rgba(255,255,255,0.1);
			border-radius:50%;
			padding:1.5rem;
			box-shadow:
				inset 0 0 20px rgba(255,255,255,0.25),
				0 0 25px rgba(0,0,0,0.15);
		}

		/* headline + subtext */
		.stat-card h2 {
			font-size:1.7rem;
			font-size:2.0rem;
			font-weight:800;
			line-height:1.3;
			margin:.75rem 0 1rem;
		}

		.stat-card p {
			font-size:1rem;
			line-height:1.4;
			opacity:.9;
			margin:0 auto;
			max-width:14rem;
		}

		/* responsive */
		@media (max-width:900px){
			.stat-card{
				width:100%;
				max-width:22rem;
				height:auto;
			}
			.card-icon{width:7rem;height:7rem;}
		}



		.testimonials {
			/*background-color: #dfeef7;  soft backdrop similar to your sample */
		}

		.quote-card {
			background-color: #e9f4fb;
			border-left: 4px solid #93c6e7;
			border-radius: 12px;
			padding: 2rem;
			box-shadow: 0 4px 12px rgba(0,0,0,0.05);
			font-style: italic;
			font-size: 1.2rem;
			line-height: 1.7;
			color: #222;
			height: 100%;
		}

		.quote-card footer {
			font-style: normal;
			font-size: 0.95rem;
			margin-top: 1rem;
			color: #555;
		}

		.quote-card p {
			margin: 0;
		}




/* Scoped styles for the Special Note component */
.dbp-special-note{
  /* Tweak these per page/theme as needed */
  --note-blue: #2b6cb0;         /* headline + left edge */
  --note-text: #1f2937;         /* body text */
  --note-bg:   #ffffff;         /* card background */
  --footer-bg: #111827;         /* dark footer background */
  --footer-fg: #ffffff;         /* dark footer text */
  --radius: 12px;

  background: var(--note-bg);
  color: var(--note-text);
  border-left: 6px solid var(--note-blue);
  border-radius: var(--radius);
  box-shadow: 0 12px 20px rgba(0,0,0,.36);
  padding: 1.25rem 1.25rem 0;        /* bottom padding handled by footer */
  max-width: 980px;                   /* feel free to remove */
  margin: 0 auto 1.5rem;              /* center + spacing under */
}

.dbp-special-note .note-title{
  color: var(--note-blue);
  margin: 0 0 .75rem;
  line-height: 1.2;
  font-weight: 700;
}

.dbp-special-note .note-body p{
  margin: 0 0 .9rem;
  line-height: 1.65;
}

.dbp-special-note .note-list{
  margin: 0 0 1rem 1.25rem;
}

.dbp-special-note .note-list li{
  margin: .4rem 0;
}

.dbp-special-note .note-footer{
  background: var(--footer-bg);
  color: var(--footer-fg);
  margin: 1rem -1.25rem 0;           /* stretch footer edge-to-edge */
  padding: .9rem 1.25rem;
  border-bottom-left-radius: var(--radius);
  border-bottom-right-radius: var(--radius);
  font-size: .95rem;
}

.dbp-special-note .note-footer p{
  margin: 0;
}


/* ===== Debt Blaster Pricing — Bulletproof CTA ===== */

/* Base card */


.dbp-pricing .dbp-card{
  position:relative;
  background:#fff;
  border:3px solid transparent;
  border-radius:18px;
  box-shadow:0 8px 24px rgba(0,0,0,.08);
  overflow:hidden;
  transition:transform .15s ease, box-shadow .15s ease;
}

/* Nuke any decorative pseudo-elements that might overlay the bottom */
.dbp-pricing .dbp-card::before,
.dbp-pricing .dbp-card::after,
.dbp-pricing .dbp-content::before,
.dbp-pricing .dbp-content::after,
.dbp-pricing .dbp-card .p-4::before,
.dbp-pricing .dbp-card .p-4::after{
  content:none !important;
  display:none !important;
  box-shadow:none !important;
  background:transparent !important;
  border:0 !important;
}

/* Hover lift */
.dbp-pricing .dbp-card:hover{
  transform:translateY(-4px);
  box-shadow:0 12px 30px rgba(0,0,0,.12);
}

/* Top band (solid color) */
.dbp-pricing .dbp-band{
  height:56px;
  display:flex; align-items:center; justify-content:center;
  border-top-left-radius:16px; border-top-right-radius:16px;
  background-image:none;
}

/* Band text */
.dbp-pricing .dbp-badge-inband{
  color:#fff; font-weight:800; font-size:1.5rem; letter-spacing:.02em; text-transform:uppercase;
}

/* Content & bottom spacing: pad for absolute CTA */
.dbp-pricing .dbp-content{
  padding-bottom:88px !important; /* room for the fixed CTA */
  min-height:100%;
}

/* CTA pinned to the real bottom of the card */
.dbp-pricing .dbp-cta{
  position:absolute;
  left:16px; right:16px; bottom:16px;
  z-index:50;  /* above any accidental overlays */
}

/* Button */
.dbp-pricing .dbp-btn{
  display:block; width:100%;
  min-height:52px;
  text-align:center;
  padding:.95rem 1rem;
  border:none; border-radius:.9rem;
  color:#fff !important; font-weight:700; text-decoration:none; line-height:1.2;
  box-shadow:0 2px 0 rgba(0,0,0,.15) inset;
  transition:filter .15s ease;
}
.dbp-pricing .dbp-btn:hover{ filter:brightness(0.95); }

/* Accents */
.dbp-pricing .dbp-accent-free{ border-color:#FF6600; }
.dbp-pricing .dbp-accent-free .dbp-band{ background-color:#FF6600; }
.dbp-pricing .dbp-accent-free .dbp-btn{ background-color:#FF6600; color:#ffffff !important; }

.dbp-pricing .dbp-accent-standard{ border-color:#4484B2; }
.dbp-pricing .dbp-accent-standard .dbp-band{ background-color:#4484B2; }
.dbp-pricing .dbp-accent-standard .dbp-btn{ background-color:#4484B2; }

.dbp-pricing .dbp-accent-pro{ border-color:#87B26E; }
.dbp-pricing .dbp-accent-pro .dbp-band{ background-color:#87B26E; }
.dbp-pricing .dbp-accent-pro .dbp-btn{ background-color:#87B26E; }

/* Featured outline */
.dbp-pricing .dbp-featured{ outline:4px solid rgba(68,132,178,.15); }

/* Features with checks (restore after pseudo-element nuke) */
.dbp-pricing .dbp-features{ list-style:none; padding-left:0; }
.dbp-pricing .dbp-features li{ position:relative; padding-left:28px; margin-bottom:.6rem; }
.dbp-pricing .dbp-features li::before{
  content:"\2713" !important; /* ? */
  position:absolute; left:0; top:0; line-height:1; font-weight:700; transform:translateY(2px);
}

/* Small screens */
@media (max-width:575.98px){
  .dbp-pricing .dbp-content{ padding-bottom:84px !important; }
  .dbp-pricing .dbp-features li{ margin-bottom:.5rem; }
}

@media print {
  .navbar {
    display: none !important;
  }
}



.wave {
  pointer-events: none;
}

