/* Shared Coached landing styles own the layout, type, form and section spacing. */
.dr-superpower-page .dr-hero {
    background: linear-gradient(135deg, #faf8fc 0%, #e4d9ef 58%, #f0e8da 100%);
}
/* Same headline sizing as Personal Brand Strategy. */
.dr-superpower-page .dr-hero-title { font-size: clamp(1.45rem, 2.4vw, 2.4rem); }
.dr-superpower-page .sp-what { background: #faf8fc; border-top: 0; }

/* Decorative only: overlapping pencil strokes, colour, then light. */
.sp-venn { --sp-cycle: 7s; display: block; width: 100%; height: auto; overflow: visible; pointer-events: none; }
.sp-guides { stroke: #79658f; stroke-width: 1; opacity: .11; }
.sp-drawing { animation: sp-cycle var(--sp-cycle) linear infinite; }
.sp-petal { --sp-pencil: #79658f; animation: sp-settle-a var(--sp-cycle) ease-out infinite; }
.sp-petal-b { --sp-pencil: #568a89; }
.sp-petal-c { --sp-pencil: #ae8650; }
.sp-petal-b { animation-name: sp-settle-b; }
.sp-petal-c { animation-name: sp-settle-c; }
.sp-pen, .sp-pencil {
    fill: none;
    stroke: var(--sp-pencil);
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-dasharray: 100;
    animation: sp-outline-a var(--sp-cycle) ease-in-out infinite;
}
.sp-pen { stroke-width: 2.1; }
.sp-pencil { stroke-width: .8; opacity: .55; }
.sp-petal-b .sp-pen, .sp-petal-b .sp-pencil { animation-name: sp-outline-b; }
.sp-petal-c .sp-pen, .sp-petal-c .sp-pencil { animation-name: sp-outline-c; }
.sp-wash { opacity: .16; animation: sp-wash-a var(--sp-cycle) ease-in-out infinite; }
.sp-hatch { animation: sp-shade-a var(--sp-cycle) ease-in-out infinite; }
.sp-petal-b .sp-wash { animation-name: sp-wash-b; }
.sp-petal-b .sp-hatch { animation-name: sp-shade-b; }
.sp-petal-c .sp-wash { animation-name: sp-wash-c; }
.sp-petal-c .sp-hatch { animation-name: sp-shade-c; }
.sp-overlap { animation: sp-overlap var(--sp-cycle) ease-in-out infinite; }
.sp-halo { transform-origin: 303px 260px; animation: sp-glow var(--sp-cycle) ease-in-out infinite; }
.sp-rays { animation: sp-rays var(--sp-cycle) ease-in-out infinite; }
.sp-sheen { animation: sp-shine var(--sp-cycle) ease-in-out infinite; }

@keyframes sp-cycle {
    0%, 88% { opacity: 1; }
    100% { opacity: 0; }
}
@keyframes sp-settle-a {
    0% { transform: translate(-9px, -5px) rotate(-1deg); }
    25%, 100% { transform: none; }
}
@keyframes sp-settle-b {
    0% { transform: translate(9px, -4px) rotate(1deg); }
    29%, 100% { transform: none; }
}
@keyframes sp-settle-c {
    0% { transform: translate(0, 11px); }
    32%, 100% { transform: none; }
}
@keyframes sp-outline-a {
    0% { stroke-dashoffset: 100; }
    17%, 100% { stroke-dashoffset: 0; }
}
@keyframes sp-outline-b {
    0%, 5% { stroke-dashoffset: 100; }
    23%, 100% { stroke-dashoffset: 0; }
}
@keyframes sp-outline-c {
    0%, 10% { stroke-dashoffset: 100; }
    29%, 100% { stroke-dashoffset: 0; }
}
@keyframes sp-shade-a {
    0%, 9% { opacity: 0; }
    22%, 100% { opacity: 1; }
}
@keyframes sp-shade-b {
    0%, 15% { opacity: 0; }
    28%, 100% { opacity: 1; }
}
@keyframes sp-shade-c {
    0%, 21% { opacity: 0; }
    34%, 100% { opacity: 1; }
}
@keyframes sp-wash-a {
    0%, 9% { opacity: 0; }
    22%, 100% { opacity: .16; }
}
@keyframes sp-wash-b {
    0%, 15% { opacity: 0; }
    28%, 100% { opacity: .16; }
}
@keyframes sp-wash-c {
    0%, 21% { opacity: 0; }
    34%, 100% { opacity: .16; }
}
@keyframes sp-overlap {
    0%, 29% { opacity: 0; }
    43%, 100% { opacity: 1; }
}
@keyframes sp-glow {
    0%, 29% { opacity: 0; transform: scale(.7); }
    46% { opacity: 1; transform: scale(1.1); }
    62% { opacity: .45; transform: scale(.95); }
    79% { opacity: .85; transform: scale(1.05); }
    100% { opacity: .45; transform: scale(1); }
}
@keyframes sp-rays {
    0%, 33% { opacity: 0; }
    47%, 78% { opacity: .65; }
    62%, 100% { opacity: .15; }
}
@keyframes sp-shine {
    0%, 35% { opacity: 0; translate: -80px 0; }
    45% { opacity: .9; }
    61%, 100% { opacity: 0; translate: 190px 0; }
}
@media (prefers-reduced-motion: reduce) {
    .sp-venn * { animation: none !important; }
    .sp-pen, .sp-pencil { stroke-dashoffset: 0; }
    .sp-halo { opacity: .35; }
    .sp-sheen { opacity: 0; }
}