/* v3 (Smart Sermon) — small overrides on top of landing-v2.css */

.vision-opening strong {
    color: var(--primary);
    font-weight: 600;
}

/* ---- Hero: rounded “bento” flow (replaces circle node-map on v3 only) ---- */
.hero-sermon-canvas {
    width: 100%;
    max-width: 520px;
    height: auto;
    overflow: visible;
}

.v3-frame {
    fill: none;
    stroke: var(--primary-dim);
    stroke-width: 1.25;
    stroke-dasharray: 10 14;
    opacity: 0.35;
    animation: v3-frame-breathe 8s ease-in-out infinite;
}

@keyframes v3-frame-breathe {
    0%, 100% { opacity: 0.28; }
    50%      { opacity: 0.45; }
}

.v3-flow {
    fill: none;
    stroke: var(--primary-dim);
    stroke-width: 1.75;
    stroke-linecap: round;
    stroke-dasharray: 5 12;
    animation: v3-dash 4.5s linear infinite;
}

.v3-flow--slow {
    animation-duration: 7s;
    opacity: 0.85;
}

@keyframes v3-dash {
    to { stroke-dashoffset: -68; }
}

.v3-brick--mission > rect:first-of-type,
.v3-brick--sat > rect:first-of-type {
    fill: var(--bg-card);
    stroke: var(--primary-dim);
    stroke-width: 1.5;
}

.v3-center-edge {
    stroke: var(--primary);
    stroke-width: 2;
}

.v3-brick-title {
    fill: var(--text);
    font-family: 'Outfit', sans-serif;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.14em;
}

.v3-brick-title--sm {
    font-size: 11px;
    letter-spacing: 0.12em;
}

.v3-brick-sub {
    fill: var(--text-secondary);
    font-family: 'Outfit', sans-serif;
    font-size: 9px;
    font-weight: 500;
    letter-spacing: 0.06em;
    opacity: 0.85;
}

.v3-brick-hero {
    fill: var(--text);
    font-family: 'Outfit', sans-serif;
    font-size: 22px;
    font-weight: 800;
    letter-spacing: 0.18em;
}

.v3-brick-tag {
    fill: var(--text-secondary);
    font-family: 'Outfit', sans-serif;
    font-size: 10px;
    font-weight: 500;
    letter-spacing: 0.02em;
}

.v3-brick-micro {
    fill: var(--text-secondary);
    font-family: 'Outfit', sans-serif;
    font-size: 9px;
    font-weight: 500;
    opacity: 0.9;
}

.v3-brick-micro--hero {
    font-size: 8px;
    letter-spacing: 0.04em;
    opacity: 0.85;
}

.hero-sermon-canvas > g.v3-brick--mission,
.hero-sermon-canvas > g.v3-brick--center,
.hero-sermon-canvas > g.v3-brick--sat {
    animation: v3-brick-in 0.55s ease-out backwards;
}

.hero-sermon-canvas > g.v3-brick--mission { animation-delay: 0.04s; }
.hero-sermon-canvas > g.v3-brick--center { animation-delay: 0.2s; }
.hero-sermon-canvas > g.v3-brick--sat:nth-of-type(3) { animation-delay: 0.34s; }
.hero-sermon-canvas > g.v3-brick--sat:nth-of-type(4) { animation-delay: 0.42s; }
.hero-sermon-canvas > g.v3-brick--sat:nth-of-type(5) { animation-delay: 0.5s; }

@keyframes v3-brick-in {
    from { opacity: 0; }
    to { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
    .v3-frame,
    .v3-flow,
    .hero-sermon-canvas > g.v3-brick--mission,
    .hero-sermon-canvas > g.v3-brick--center,
    .hero-sermon-canvas > g.v3-brick--sat {
        animation: none !important;
    }
    .v3-flow {
        stroke-dashoffset: 0;
    }
}

/* Keep hero illustration visible on small screens (landing-v2 hides .hero-visual) */
@media (max-width: 768px) {
    .hero .hero-visual {
        display: flex;
        margin-top: 8px;
    }
}

/* ---- Vision (v3): card grid + header ---- */
.vision-section--v3 {
    position: relative;
    padding-top: clamp(88px, 12vw, 128px);
    padding-bottom: clamp(88px, 11vw, 120px);
    background:
        radial-gradient(ellipse 80% 55% at 50% -15%, var(--primary-glow), transparent 55%),
        radial-gradient(ellipse 60% 40% at 100% 60%, var(--primary-glow), transparent 50%),
        radial-gradient(ellipse 50% 35% at 0% 80%, var(--accent-glow), transparent 45%),
        var(--bg-surface);
}

.vision-section--v3::before,
.vision-section--v3::after {
    opacity: 0.85;
}

.vision-section--v3__container {
    max-width: 1180px;
}

.vision-header-v3 {
    text-align: center;
    max-width: 780px;
    margin: 0 auto 56px;
}

.vision-header-v3__title {
    margin: 0 0 18px;
    font-family: 'Outfit', sans-serif;
    font-size: clamp(2.15rem, 4.5vw, 3rem);
    font-weight: 800;
    letter-spacing: -0.02em;
    line-height: 1.12;
    color: var(--text);
}

.vision-header-v3__summary {
    margin: 0;
    font-size: clamp(1.12rem, 2vw, 1.35rem);
    line-height: 1.45;
    font-weight: 400;
    color: var(--text-secondary);
}

.vision-cards-v3 {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(22px, 3vw, 36px);
    align-items: stretch;
    list-style: none;
    margin: 0;
    padding: 0;
}

/* Slightly longer stagger for cards (scroll-in) */
.vision-cards-v3 .vision-card-v3.reveal-delay-1 {
    transition-delay: 0.14s;
}

.vision-cards-v3 .vision-card-v3.reveal-delay-2 {
    transition-delay: 0.3s;
}

.vision-cards-v3 .vision-card-v3.reveal-delay-3 {
    transition-delay: 0.46s;
}

.vision-card-v3 {
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 38px 32px 42px;
    min-height: 420px;
    border-radius: 22px;
    background: var(--bg-card);
    border: 1px solid var(--border-light);
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.04) inset,
        0 8px 32px rgba(0, 0, 0, 0.12);
    overflow: hidden;
    transition:
        transform 0.28s cubic-bezier(0.22, 1, 0.36, 1),
        box-shadow 0.28s ease,
        border-color 0.28s ease;
}

[data-theme="light"] .vision-card-v3 {
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.9) inset,
        0 10px 36px rgba(0, 90, 90, 0.08);
}

.vision-card-v3:hover {
    transform: translateY(-5px);
    border-color: color-mix(in srgb, var(--primary) 28%, var(--border-light));
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.06) inset,
        0 16px 48px rgba(0, 0, 0, 0.2);
}

[data-theme="light"] .vision-card-v3:hover {
    box-shadow:
        0 1px 0 #fff inset,
        0 18px 44px rgba(0, 100, 100, 0.12);
}

.vision-card-v3__watermark {
    position: absolute;
    right: -4px;
    top: -8px;
    font-family: 'Outfit', sans-serif;
    font-size: clamp(5rem, 13vw, 6.5rem);
    font-weight: 800;
    line-height: 1;
    letter-spacing: -0.04em;
    color: var(--text);
    opacity: 0.055;
    pointer-events: none;
    user-select: none;
}

.vision-card-v3__viz {
    flex-shrink: 0;
    min-height: 96px;
    margin-bottom: 26px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    transition: transform 0.35s cubic-bezier(0.34, 1.4, 0.64, 1);
}

.vision-card-v3:hover .vision-card-v3__viz {
    transform: translateY(-3px);
}

/* ---- Shared viz wrapper ---- */
.vision-viz {
    color: var(--primary);
}

/* Accessible: live caption frame */
.vision-viz--access {
    width: 100%;
    max-width: 176px;
}

.vision-viz-access__frame {
    position: relative;
    padding: 14px 14px 16px;
    border: 2px solid color-mix(in srgb, var(--primary) 55%, var(--border-light));
    border-radius: 14px;
    background: color-mix(in srgb, var(--primary) 6%, var(--bg-card));
    animation: vision-viz-access-breathe 3.2s ease-in-out infinite;
}

.vision-viz-access__line {
    height: 4px;
    border-radius: 2px;
    background: color-mix(in srgb, var(--primary) 45%, transparent);
    margin-bottom: 8px;
    width: 100%;
    animation: vision-viz-line-pulse 2.5s ease-in-out infinite;
}

.vision-viz-access__line--b {
    width: 88%;
    animation-delay: 0.12s;
}

.vision-viz-access__line--c {
    width: 72%;
    margin-bottom: 0;
    animation-delay: 0.24s;
}

.vision-viz-access__live {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--primary);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 28%, transparent);
    animation: vision-viz-live-pulse 1.8s ease-in-out infinite;
}

@keyframes vision-viz-access-breathe {
    0%, 100% {
        box-shadow: 0 0 0 0 color-mix(in srgb, var(--primary) 0%, transparent);
    }

    50% {
        box-shadow: 0 0 24px -4px color-mix(in srgb, var(--primary) 22%, transparent);
    }
}

@keyframes vision-viz-line-pulse {
    0%, 100% { opacity: 0.55; }
    50% { opacity: 0.95; }
}

@keyframes vision-viz-live-pulse {
    0%, 100% {
        opacity: 1;
        transform: scale(1);
    }

    50% {
        opacity: 0.45;
        transform: scale(0.92);
    }
}

/* Intelligent: bars */
.vision-viz--intel {
    width: 100%;
    max-width: 148px;
}

.vision-viz-intel__bars {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: 14px;
    height: 64px;
    width: 100%;
}

.vision-viz-intel__bar {
    flex: 1;
    max-width: 36px;
    min-height: 12px;
    border-radius: 6px 6px 0 0;
    background: linear-gradient(
        180deg,
        color-mix(in srgb, var(--primary) 95%, transparent),
        color-mix(in srgb, var(--primary) 45%, transparent)
    );
    transform-origin: bottom center;
    animation: vision-viz-bar-pulse 2.4s ease-in-out infinite;
}

.vision-viz-intel__bar:nth-child(1) {
    height: 38%;
}

.vision-viz-intel__bar:nth-child(2) {
    height: 100%;
    animation-delay: 0.2s;
}

.vision-viz-intel__bar:nth-child(3) {
    height: 62%;
    animation-delay: 0.4s;
}

@keyframes vision-viz-bar-pulse {
    0%, 100% {
        opacity: 0.65;
        transform: scaleY(0.94);
    }

    50% {
        opacity: 1;
        transform: scaleY(1);
    }
}

/* Amplified: source + rays */
.vision-viz--amp {
    width: 100%;
    max-width: 168px;
}

.vision-viz-amp__broadcast {
    display: flex;
    align-items: center;
    gap: 14px;
    width: 100%;
}

.vision-viz-amp__dot {
    flex-shrink: 0;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: var(--primary);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--primary) 22%, transparent);
    animation: vision-viz-amp-dot 2s ease-in-out infinite;
}

.vision-viz-amp__rays {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 10px;
    flex: 1;
    min-width: 0;
}

.vision-viz-amp__ray {
    display: block;
    height: 4px;
    border-radius: 4px;
    background: linear-gradient(90deg, var(--primary), color-mix(in srgb, var(--primary) 8%, var(--bg-card)));
    animation: vision-viz-amp-ray 2.2s ease-in-out infinite;
}

.vision-viz-amp__ray:nth-child(1) {
    width: 100%;
}

.vision-viz-amp__ray:nth-child(2) {
    width: 86%;
    animation-delay: 0.14s;
}

.vision-viz-amp__ray:nth-child(3) {
    width: 72%;
    animation-delay: 0.28s;
}

@keyframes vision-viz-amp-dot {
    0%, 100% {
        opacity: 1;
        transform: scale(1);
    }

    50% {
        opacity: 0.72;
        transform: scale(0.9);
    }
}

@keyframes vision-viz-amp-ray {
    0%, 100% {
        opacity: 0.38;
        transform: scaleX(0.94);
    }

    50% {
        opacity: 0.85;
        transform: scaleX(1);
    }
}

.vision-card-v3__heading {
    margin: 0 0 12px;
    font-family: 'Outfit', sans-serif;
    font-size: clamp(1.12rem, 1.5vw, 1.28rem);
    font-weight: 700;
    line-height: 1.25;
    color: var(--text);
}

.vision-card-v3__heading-num,
.vision-card-v3__heading-sep {
    font-weight: 600;
    color: var(--text-muted);
}

.vision-card-v3__heading-label {
    font-weight: 800;
    color: var(--text);
}

.vision-card-v3__lead {
    margin: 0 0 18px;
    font-size: clamp(1.02rem, 1.35vw, 1.12rem);
    line-height: 1.5;
    font-weight: 500;
    color: var(--text-secondary);
}

.vision-card-v3__bullets {
    margin: 0;
    padding: 0 0 0 1.15em;
    font-size: clamp(0.95rem, 1.2vw, 1.05rem);
    line-height: 1.55;
    color: var(--text-muted);
}

.vision-card-v3__bullets li {
    margin-bottom: 0.5em;
}

.vision-card-v3__bullets li:last-child {
    margin-bottom: 0;
}

@media (max-width: 960px) {
    .vision-cards-v3 {
        grid-template-columns: 1fr;
        max-width: 600px;
        margin-left: auto;
        margin-right: auto;
    }

    .vision-header-v3 {
        margin-bottom: 44px;
    }

    .vision-card-v3 {
        min-height: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .vision-card-v3 {
        transition: border-color 0.2s ease;
    }

    .vision-card-v3:hover {
        transform: none;
    }

    .vision-card-v3:hover .vision-card-v3__viz {
        transform: none;
    }

    .vision-cards-v3 .vision-card-v3.reveal-delay-1,
    .vision-cards-v3 .vision-card-v3.reveal-delay-2,
    .vision-cards-v3 .vision-card-v3.reveal-delay-3 {
        transition-delay: 0s !important;
    }

    .vision-viz-access__frame,
    .vision-viz-access__line,
    .vision-viz-access__live,
    .vision-viz-intel__bar,
    .vision-viz-amp__dot,
    .vision-viz-amp__ray {
        animation: none !important;
    }
}

/* ---- Weight (v3): scattered pill word cloud ---- */
.weight-section--v3 .weight-viz--wordcloud {
    max-width: 1180px;
    margin-left: auto;
    margin-right: auto;
    padding: 12px clamp(8px, 2vw, 24px) 0;
}

.weight-section--v3 .weight-wordcloud {
    position: relative;
    width: 100%;
    max-width: 1120px;
    min-height: 500px;
    margin: 0 auto;
}

@keyframes wc-pill-float {
    0%,
    100% {
        transform: translateY(0) rotate(var(--wc-rot, 0deg));
        box-shadow:
            0 2px 0 rgba(255, 255, 255, 0.04) inset,
            0 4px 20px rgba(0, 0, 0, 0.22),
            0 0 0 1px rgba(0, 0, 0, 0.12);
    }
    50% {
        transform: translateY(-6px) rotate(var(--wc-rot, 0deg));
        box-shadow:
            0 2px 0 rgba(255, 255, 255, 0.06) inset,
            0 12px 32px rgba(0, 0, 0, 0.28),
            0 0 24px rgba(0, 200, 200, 0.12),
            0 0 0 1px rgba(0, 200, 200, 0.18);
    }
}

@keyframes wc-pill-float-light {
    0%,
    100% {
        transform: translateY(0) rotate(var(--wc-rot, 0deg));
        box-shadow:
            0 1px 0 rgba(255, 255, 255, 0.9) inset,
            0 4px 14px rgba(0, 0, 0, 0.05),
            0 0 0 1px rgba(0, 0, 0, 0.06);
    }
    50% {
        transform: translateY(-5px) rotate(var(--wc-rot, 0deg));
        box-shadow:
            0 1px 0 rgba(255, 255, 255, 0.95) inset,
            0 10px 26px rgba(0, 0, 0, 0.08),
            0 0 20px rgba(0, 180, 180, 0.14),
            0 0 0 1px rgba(0, 180, 180, 0.2);
    }
}

@keyframes wc-pill-shimmer {
    0%,
    100% {
        filter: brightness(1);
    }
    50% {
        filter: brightness(1.08);
    }
}

.weight-section--v3 .wc {
    position: absolute;
    z-index: 1;
    font-family: 'Outfit', sans-serif;
    font-weight: 500;
    letter-spacing: -0.015em;
    line-height: 1.2;
    color: var(--text-secondary);
    white-space: nowrap;
    user-select: none;
    cursor: default;
    padding: 8px 14px;
    border-radius: 999px;
    border: 1px solid var(--border);
    background: linear-gradient(160deg, var(--bg-card-h) 0%, var(--bg-card) 55%, var(--bg-card) 100%);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    transform: translateZ(0);
    animation:
        wc-pill-float 5s ease-in-out infinite,
        wc-pill-shimmer 5s ease-in-out infinite;
    transition:
        border-color 0.25s ease,
        z-index 0s linear 0s;
}

.weight-section--v3 .wc:hover {
    z-index: 4;
    border-color: var(--primary-dim);
}

.weight-section--v3 .weight-wordcloud .wc:nth-child(5n + 1) {
    animation-delay: 0s, 0s;
}
.weight-section--v3 .weight-wordcloud .wc:nth-child(5n + 2) {
    animation-delay: 0.35s, 0.35s;
}
.weight-section--v3 .weight-wordcloud .wc:nth-child(5n + 3) {
    animation-delay: 0.7s, 0.7s;
}
.weight-section--v3 .weight-wordcloud .wc:nth-child(5n + 4) {
    animation-delay: 1.05s, 1.05s;
}
.weight-section--v3 .weight-wordcloud .wc:nth-child(5n) {
    animation-delay: 1.4s, 1.4s;
}

.weight-section--v3 .wc--xl {
    padding: 11px 18px;
    font-size: clamp(1.02rem, 1.85vw, 1.42rem);
    font-weight: 700;
    color: var(--text);
}

.weight-section--v3 .wc--lg {
    padding: 10px 16px;
    font-size: clamp(0.92rem, 1.45vw, 1.18rem);
    font-weight: 600;
    color: var(--text);
}

.weight-section--v3 .wc--md {
    padding: 8px 14px;
    font-size: clamp(0.82rem, 1.15vw, 1.02rem);
    font-weight: 600;
}

.weight-section--v3 .wc--sm {
    padding: 7px 12px;
    font-size: clamp(0.72rem, 0.95vw, 0.88rem);
    font-weight: 500;
    color: var(--primary-dim);
}

/* scatter: position + rotation via --wc-rot (used inside keyframes) */
.weight-section--v3 .weight-wordcloud .wc:nth-child(1) {
    top: 4%;
    left: 3%;
    --wc-rot: -7deg;
}
.weight-section--v3 .weight-wordcloud .wc:nth-child(2) {
    top: 2%;
    left: 38%;
    --wc-rot: 4deg;
}
.weight-section--v3 .weight-wordcloud .wc:nth-child(3) {
    top: 10%;
    left: 72%;
    --wc-rot: -3deg;
}
.weight-section--v3 .weight-wordcloud .wc:nth-child(4) {
    top: 22%;
    left: 8%;
    --wc-rot: 6deg;
}
.weight-section--v3 .weight-wordcloud .wc:nth-child(5) {
    top: 26%;
    left: 48%;
    --wc-rot: -5deg;
}
.weight-section--v3 .weight-wordcloud .wc:nth-child(6) {
    top: 18%;
    left: 68%;
    --wc-rot: -9deg;
}
.weight-section--v3 .weight-wordcloud .wc:nth-child(7) {
    top: 40%;
    left: 2%;
    --wc-rot: 3deg;
}
.weight-section--v3 .weight-wordcloud .wc:nth-child(8) {
    top: 44%;
    left: 42%;
    --wc-rot: -4deg;
}
.weight-section--v3 .weight-wordcloud .wc:nth-child(9) {
    top: 38%;
    left: 72%;
    --wc-rot: 5deg;
}
.weight-section--v3 .weight-wordcloud .wc:nth-child(10) {
    top: 54%;
    left: 22%;
    --wc-rot: -6deg;
}
.weight-section--v3 .weight-wordcloud .wc:nth-child(11) {
    top: 58%;
    left: 55%;
    --wc-rot: 7deg;
}
.weight-section--v3 .weight-wordcloud .wc:nth-child(12) {
    top: 52%;
    left: 78%;
    --wc-rot: -2deg;
}
.weight-section--v3 .weight-wordcloud .wc:nth-child(13) {
    top: 68%;
    left: 6%;
    --wc-rot: 4deg;
}
.weight-section--v3 .weight-wordcloud .wc:nth-child(14) {
    top: 72%;
    left: 38%;
    --wc-rot: -8deg;
}
.weight-section--v3 .weight-wordcloud .wc:nth-child(15) {
    top: 66%;
    left: 62%;
    --wc-rot: 8deg;
}
.weight-section--v3 .weight-wordcloud .wc:nth-child(16) {
    top: 82%;
    left: 12%;
    --wc-rot: -3deg;
}
.weight-section--v3 .weight-wordcloud .wc:nth-child(17) {
    top: 78%;
    left: 48%;
    --wc-rot: 5deg;
}
.weight-section--v3 .weight-wordcloud .wc:nth-child(18) {
    top: 86%;
    left: 68%;
    --wc-rot: -5deg;
}
.weight-section--v3 .weight-wordcloud .wc:nth-child(19) {
    top: 30%;
    left: 28%;
    --wc-rot: 2deg;
}
.weight-section--v3 .weight-wordcloud .wc:nth-child(20) {
    top: 14%;
    left: 18%;
    --wc-rot: -4deg;
}
.weight-section--v3 .weight-wordcloud .wc:nth-child(21) {
    top: 8%;
    left: 58%;
    --wc-rot: 9deg;
}
.weight-section--v3 .weight-wordcloud .wc:nth-child(22) {
    top: 62%;
    left: 88%;
    --wc-rot: -7deg;
}
.weight-section--v3 .weight-wordcloud .wc:nth-child(23) {
    top: 92%;
    left: 36%;
    --wc-rot: 3deg;
}

@media (max-width: 900px) {
    .weight-section--v3 .weight-wordcloud {
        min-height: 540px;
    }

    .weight-section--v3 .weight-wordcloud .wc:nth-child(n) {
        white-space: normal;
        max-width: 12em;
    }
}

@media (max-width: 640px) {
    .weight-section--v3 .weight-viz--wordcloud {
        padding-left: 0;
        padding-right: 0;
    }

    .weight-section--v3 .weight-wordcloud {
        position: static;
        min-height: 0;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-content: flex-start;
        gap: 12px 12px;
        padding: 8px 0 12px;
    }

    .weight-section--v3 .weight-wordcloud .wc {
        position: static;
        --wc-rot: 0deg !important;
        white-space: normal;
        max-width: 100%;
        text-align: center;
        animation: wc-pill-mobile 4.2s ease-in-out infinite;
    }

    .weight-section--v3 .weight-wordcloud .wc:nth-child(5n + 1) {
        animation-delay: 0s;
    }
    .weight-section--v3 .weight-wordcloud .wc:nth-child(5n + 2) {
        animation-delay: 0.3s;
    }
    .weight-section--v3 .weight-wordcloud .wc:nth-child(5n + 3) {
        animation-delay: 0.6s;
    }
    .weight-section--v3 .weight-wordcloud .wc:nth-child(5n + 4) {
        animation-delay: 0.9s;
    }
    .weight-section--v3 .weight-wordcloud .wc:nth-child(5n) {
        animation-delay: 1.2s;
    }

    .weight-section--v3 .wc--xl {
        font-size: 0.95rem;
    }

    .weight-section--v3 .wc--lg {
        font-size: 0.88rem;
    }

    .weight-section--v3 .wc--md {
        font-size: 0.82rem;
    }

    .weight-section--v3 .wc--sm {
        font-size: 0.76rem;
    }
}

@keyframes wc-pill-mobile {
    0%,
    100% {
        transform: translateY(0);
        box-shadow:
            0 2px 0 rgba(255, 255, 255, 0.04) inset,
            0 3px 14px rgba(0, 0, 0, 0.18);
    }
    50% {
        transform: translateY(-3px);
        box-shadow:
            0 2px 0 rgba(255, 255, 255, 0.05) inset,
            0 8px 22px rgba(0, 0, 0, 0.22),
            0 0 18px rgba(0, 200, 200, 0.1);
    }
}

@media (min-width: 641px) {
    [data-theme="light"] .weight-section--v3 .weight-wordcloud .wc {
        animation-name: wc-pill-float-light, wc-pill-shimmer;
    }
}

@media (prefers-reduced-motion: reduce) {
    .weight-section--v3 .wc,
    .weight-section--v3 .weight-wordcloud .wc {
        animation: none !important;
    }

    .weight-section--v3 .weight-wordcloud .wc:nth-child(n) {
        transform: translateY(0) rotate(var(--wc-rot, 0deg)) !important;
        box-shadow:
            0 2px 0 rgba(255, 255, 255, 0.04) inset,
            0 4px 16px rgba(0, 0, 0, 0.15) !important;
    }

    @media (max-width: 640px) {
        .weight-section--v3 .weight-wordcloud .wc:nth-child(n) {
            transform: none !important;
        }
    }
}