/* =============================================================================
   Coin intro — premium "lead" paragraph beneath the H1, above the coin box
   (also used on the front page). Self-contained tokens so it works on any
   theme + dark mode. Loaded only on pages where the intro actually prints.
   ========================================================================== */
.dd-cointro{
	--ddci-gold:#e0a300;
	--ddci-grad:linear-gradient(135deg,#fdb837 0%,#ffc53d 48%,#e0a300 100%);
	--ddci-ink:#3a3a46;
	--ddci-strong:#26262f;
	--ddci-surface:#fffdf7;
	--ddci-surface-2:#fff7e6;
	--ddci-line:rgba(224,163,0,.26);
	--ddci-shadow:0 1px 2px rgba(120,90,0,.05),0 20px 44px -28px rgba(170,125,0,.5);
	position:relative;
	max-width:800px;
	margin:-2px auto 30px;
	padding-top:17px;          /* room for the connector stem up to the H1 */
	text-align:center;
}
/* connector: a hairline stem rising toward the title… */
.dd-cointro::before{
	content:"";
	position:absolute;top:0;left:50%;transform:translateX(-50%);
	width:2px;height:17px;border-radius:2px;
	background:linear-gradient(to bottom,rgba(224,163,0,0),var(--ddci-gold));
}
/* …capped with a glowing gold dot. */
.dd-cointro::after{
	content:"";
	position:absolute;top:-3px;left:50%;transform:translateX(-50%);
	width:9px;height:9px;border-radius:50%;
	background:var(--ddci-grad);
	box-shadow:0 0 0 4px rgba(224,163,0,.12),0 2px 9px rgba(224,163,0,.55);
}
.dd-cointro__inner{
	position:relative;
	padding:21px 32px 23px;
	background:linear-gradient(180deg,var(--ddci-surface) 0%,var(--ddci-surface-2) 100%);
	border:1px solid var(--ddci-line);
	border-radius:22px;
	box-shadow:var(--ddci-shadow);
	overflow:hidden;
	animation:ddci-rise .6s cubic-bezier(.2,.7,.2,1) both;
}
/* luminous, slowly shimmering top hairline */
.dd-cointro__inner::before{
	content:"";
	position:absolute;inset:0 0 auto 0;height:3px;
	background:var(--ddci-grad);
	background-size:220% 100%;
	opacity:.92;
	animation:ddci-shimmer 7s linear infinite;
}
/* soft radial halo behind the spark */
.dd-cointro__inner::after{
	content:"";
	position:absolute;top:-46px;left:50%;transform:translateX(-50%);
	width:240px;height:130px;pointer-events:none;
	background:radial-gradient(closest-side,rgba(255,197,61,.22),rgba(255,197,61,0));
}
.dd-cointro__spark{
	display:block;
	font-size:17px;line-height:1;margin:0 0 9px;
	color:var(--ddci-gold);
	filter:drop-shadow(0 1px 4px rgba(224,163,0,.45));
}
.dd-cointro__spark::before{content:"✦";}
.dd-cointro__text{
	position:relative;z-index:1;
	font-size:1.12rem;line-height:1.95;font-weight:500;
	color:var(--ddci-ink);
	text-wrap:balance;
}
.dd-cointro__text p{margin:0 0 .6em;}
.dd-cointro__text p:last-child{margin-bottom:0;}
.dd-cointro__text strong,
.dd-cointro__text b{color:var(--ddci-strong);font-weight:700;}
.dd-cointro__text a{
	color:var(--ddci-gold);font-weight:700;text-decoration:none;
	border-bottom:1px solid rgba(224,163,0,.42);
	transition:border-color .2s ease;
}
.dd-cointro__text a:hover{border-bottom-color:var(--ddci-gold);}

@keyframes ddci-rise{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:none;}}
@keyframes ddci-shimmer{0%{background-position:0 0;}100%{background-position:220% 0;}}

/* Dark mode (Dracula scheme) */
html[data-dracula-scheme="dark"] .dd-cointro{
	--ddci-ink:#cfcfdb;
	--ddci-strong:#ffffff;
	--ddci-surface:#1d1e28;
	--ddci-surface-2:#23202b;
	--ddci-line:rgba(255,197,61,.22);
	--ddci-shadow:0 1px 2px rgba(0,0,0,.4),0 24px 48px -28px rgba(0,0,0,.8);
}

@media (max-width:600px){
	.dd-cointro{margin:2px auto 22px;}
	.dd-cointro__inner{padding:17px 18px 19px;border-radius:18px;}
	.dd-cointro__text{font-size:1.02rem;line-height:1.85;}
}
@media (prefers-reduced-motion:reduce){
	.dd-cointro__inner,
	.dd-cointro__inner::before{animation:none !important;}
}