/* Full-width customer stories, with whole cards at each breakpoint. */
.home-content .home-feedback { width: 100%; max-width: none; margin: 0; padding: 2.5rem 1rem; background: #fff; overflow: hidden; font-family: Raleway, sans-serif; }
.home-feedback .feedback-heading { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1rem; margin-bottom: 1.5rem; }
.home-content .home-feedback .feedback-title { margin: 0; color: #0066cc; font: 400 clamp(1.8rem, 4vw, 3rem)/1.3 Anton, sans-serif; }
.home-feedback .feedback-intro { margin: .5rem 0 0; color: #536579; font-size: .9rem; line-height: 1.6; }
.home-content .home-feedback .carousel-controls { position: static; width: auto; transform: none; display: flex; align-items: center; gap: .5rem; }
.home-content .home-feedback .carousel-controls button { display: grid; place-items: center; width: 44px; height: 44px; min-width: 44px; padding: 0; border: 1px solid #cbdcf0; border-radius: 50%; background: #fff; color: #0066cc; cursor: pointer; }
.home-content .home-feedback .carousel-controls button:hover { background: #e4efff; }
.home-feedback .feedback-position { color: #536579; font-size: .8rem; min-width: 3.5rem; text-align: center; }
.home-content .home-feedback .feedback-cards { display: flex; gap: 1rem; width: 100%; max-width: none; margin: 0; padding: .25rem 0 .75rem; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding: 0; scrollbar-width: none; transform: none; perspective: none; transform-style: flat; transition: none; }
.home-feedback .feedback-cards::-webkit-scrollbar { display: none; }
.home-content .home-feedback .feedback-card { display: flex; flex-direction: column; flex: 0 0 100%; min-width: 0; max-width: none; height: auto; margin: 0; padding: 1.5rem; border: 1px solid #e0e7f0; border-radius: 16px; background: #fff; box-shadow: 0 3px 8px #19314e14; filter: none; transform: none; transform-style: flat; scroll-snap-align: start; scroll-snap-stop: always; transition: none; }
.home-content .home-feedback .feedback-card::before { content: none; }
.home-content .home-feedback .feedback-author { display: flex; align-items: center; gap: .75rem; margin: 0 0 1rem; }
.home-content .home-feedback .feedback-icon { display: grid; place-items: center; flex: 0 0 42px; width: 42px; height: 42px; margin: 0; border-radius: 50%; background: #eaf3ff; color: #0066cc; }
.home-content .home-feedback .feedback-name { color: #24364b; font-size: 1rem; font-weight: 800; }
.home-content .home-feedback .feedback-text { margin: 0; color: #43556a; font: 400 1rem/1.8 Raleway, sans-serif; overflow-wrap: anywhere; }
@media (min-width: 650px) { .home-content .home-feedback .feedback-card { flex-basis: calc((100% - 1rem) / 2); } }
@media (min-width: 1000px) { .home-content .home-feedback { padding: 3rem 2rem; } .home-content .home-feedback .feedback-card { flex-basis: calc((100% - 2rem) / 3); padding: 2rem; } }
@media (min-width: 1600px) { .home-content .home-feedback .feedback-card { flex-basis: calc((100% - 3rem) / 4); } }

.home-content .home-feedback .feedback-card .feedback-author .feedback-icon { display: grid; place-items: center; flex: 0 0 42px; width: 42px; height: 42px; margin: 0; border-radius: 50%; background: #eaf3ff; color: #0066cc; font: 800 1rem/1 Raleway, sans-serif; }

/* Navigation belongs at the ends of the review row. */
.home-feedback .feedback-stage { position: relative; }
.home-content .home-feedback .feedback-stage .carousel-controls { position: absolute; inset: 0; width: 100%; z-index: 2; transform: none; justify-content: space-between; pointer-events: none; }
.home-content .home-feedback .feedback-stage .carousel-controls button { pointer-events: auto; background: #fff; box-shadow: 0 3px 12px #19314e1f; }
.home-feedback .feedback-position { position: absolute; top: calc(100% + .35rem); left: 50%; transform: translateX(-50%); white-space: nowrap; }
.home-content .home-feedback .feedback-cards { padding-inline: 52px; scroll-padding-inline: 52px; }
.home-feedback .feedback-stage::before, .home-feedback .feedback-stage::after { content: ""; position: absolute; top: 0; bottom: .5rem; width: 44px; z-index: 1; pointer-events: none; backdrop-filter: blur(3px); background: #ffffff70; }
.home-feedback .feedback-stage::before { left: 0; }
.home-feedback .feedback-stage::after { right: 0; }
.home-content .home-feedback { padding-bottom: 3rem; }


/* Brand movement adds warmth without competing with the review text. */
.home-content .home-feedback .feedback-card { position: relative; padding-top: 2rem; background: linear-gradient(145deg, #fff 65%, #f6faff); box-shadow: 0 4px 12px #19314e12; transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease; }
.home-content .home-feedback .feedback-card::before { content: ""; position: absolute; inset: 0 0 auto; width: 100%; height: 4px; background: linear-gradient(110deg, #0066cc, #0099ff, #ff7d00, #0066cc); background-size: 300% 100%; animation: feedbackAccentFlow 9s ease-in-out infinite; transform: none; transition: none; }
.home-content .home-feedback .feedback-author { margin-bottom: .9rem; }
.home-content .home-feedback .feedback-name { color: #173c64; }
.home-content .home-feedback .feedback-cards { padding-top: .75rem; padding-bottom: 1.25rem; }
.home-feedback .feedback-title::after { content: ""; display: block; width: 64px; height: 4px; margin-top: .65rem; border-radius: 4px; background: linear-gradient(90deg, #0066cc, #ff7d00); }
.home-feedback .feedback-position { display: none; }
@keyframes feedbackAccentFlow { 0%, 100% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } }
@media (hover: hover) and (pointer: fine) {
    .home-content .home-feedback .feedback-card:hover { transform: translateY(-4px); border-color: #b7d4f5; box-shadow: 0 7px 18px #0066cc1a, 0 3px 9px #ff7d0012; }
}
@media (hover: none) and (pointer: coarse) {
    .home-content .home-feedback .feedback-card.is-featured { border-color: #b7d4f5; box-shadow: 0 6px 16px #0066cc20, 0 3px 9px #ff7d0015; }
}
@media (prefers-reduced-motion: reduce) {
    .home-content .home-feedback .feedback-card::before { animation: none; }
    .home-content .home-feedback .feedback-card { transition: none; }
    .home-content .home-feedback .feedback-card:hover { transform: none; }
}

/* Keep feedback free of decorative rules and colored border strips. */
.home-feedback .feedback-title::after,
.home-content .home-feedback .feedback-card::before { content: none; display: none; animation: none; }
.home-content .home-feedback .feedback-card { border: 0; background: #fff; box-shadow: 0 3px 12px #19314e16; }
@media (hover: hover) and (pointer: fine) {
    .home-content .home-feedback .feedback-card:hover { box-shadow: 0 7px 20px #19314e24; }
}
@media (hover: none) and (pointer: coarse) {
    .home-content .home-feedback .feedback-card.is-featured { box-shadow: 0 6px 18px #19314e24; }
}


/* Let the cards carry the personality, without extra icons or border strips. */
.home-content .home-feedback .feedback-card { isolation: isolate; border: 0; background: #f0f6fd; box-shadow: 0 4px 12px #19314e16; transition: transform .35s ease, box-shadow .35s ease; }
.home-content .home-feedback .feedback-card:nth-child(even) { background: #fff5e9; }
.home-content .home-feedback .feedback-card::after { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; background: linear-gradient(135deg, #0066cc, #526d87, #e78320); background-size: 250% 250%; opacity: 0; transition: opacity .4s ease; animation: feedbackCardColor 10s ease-in-out infinite; pointer-events: none; }
.home-content .home-feedback .feedback-name, .home-content .home-feedback .feedback-text { transition: color .35s ease; }
@keyframes feedbackCardColor { 0%,100% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } }
@media (hover: hover) and (pointer: fine) {
    .home-content .home-feedback .feedback-card:hover::after { opacity: 1; }
    .home-content .home-feedback .feedback-card:hover .feedback-name,
    .home-content .home-feedback .feedback-card:hover .feedback-text { color: #fff; }
}
@media (hover: none) and (pointer: coarse) {
    .home-content .home-feedback .feedback-card.is-featured::after { opacity: 1; }
    .home-content .home-feedback .feedback-card.is-featured .feedback-name,
    .home-content .home-feedback .feedback-card.is-featured .feedback-text { color: #fff; }
}
@media (prefers-reduced-motion: reduce) {
    .home-content .home-feedback .feedback-card::after { animation: none; transition: none; }
    .home-content .home-feedback .feedback-name, .home-content .home-feedback .feedback-text { transition: none; }
}

/* Conversation artwork lives inside each review, away from its text. */
.home-content .home-feedback .feedback-card { padding-bottom: 5rem; }
.home-feedback .feedback-card-art { position: absolute; right: 1.25rem; bottom: .75rem; width: 64px; height: 52px; pointer-events: none; transition: transform .4s ease; }
.feedback-art-back { fill: #ffcf98; }
.feedback-art-front { fill: #d3e7fc; stroke: #82b3e5; stroke-width: 1.5; }
.feedback-art-dot { fill: #397dbd; }
@media (hover: hover) and (pointer: fine) { .home-feedback .feedback-card:hover .feedback-card-art { transform: translateY(-3px) rotate(-4deg); } }
@media (hover: none) and (pointer: coarse) { .home-feedback .feedback-card.is-featured .feedback-card-art { transform: translateY(-3px) rotate(-4deg); } }
@media (prefers-reduced-motion: reduce) { .home-feedback .feedback-card-art { transition: none; transform: none !important; } }

/* Neutral cards and monochrome conversation artwork; one active review. */
.home-content .home-feedback .feedback-card,
.home-content .home-feedback .feedback-card:nth-child(even) { background: #fff; }
.home-feedback .feedback-art-back { fill: none; stroke: currentColor; stroke-width: 1.5; opacity: .5; }
.home-feedback .feedback-art-front { fill: none; stroke: currentColor; stroke-width: 1.5; }
.home-feedback .feedback-art-dot { fill: currentColor; }
.home-feedback .feedback-card-art { color: #7a8795; }
.home-content .home-feedback .feedback-card.is-featured::after { opacity: 1; }
.home-content .home-feedback .feedback-card.is-featured .feedback-name,
.home-content .home-feedback .feedback-card.is-featured .feedback-text,
.home-content .home-feedback .feedback-card.is-featured .feedback-card-art { color: #fff; }
@media (hover: hover) and (pointer: fine) {
    .home-content .home-feedback .feedback-card:hover .feedback-card-art { color: #fff; }
}

.home-content .home-feedback .feedback-cards { padding-top: 1rem; padding-bottom: 1.5rem; }
.home-content .home-feedback .feedback-card.is-featured { transform: translateY(-3px) scale(1.025); box-shadow: 0 9px 22px #19314e26; z-index: 1; }
.home-feedback .feedback-card-art { width: 46px; height: 46px; }
@media (prefers-reduced-motion: reduce) { .home-content .home-feedback .feedback-card.is-featured { transform: none; } }

/* Match the solid Font Awesome family already used by cart and account. */
.home-feedback .feedback-card-art { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; font-size: 30px; line-height: 1; }

/* Make the featured customer's words the expressive focal point. */
.home-content .home-feedback .feedback-cards { padding-top: 1.75rem; padding-bottom: 2rem; gap: 1.5rem; }
.home-content .home-feedback .feedback-card { flex-basis: 100%; padding: 1.75rem 1.5rem 4.75rem; transition: transform .5s cubic-bezier(.2,.8,.2,1), box-shadow .5s ease; }
.home-content .home-feedback .feedback-card.is-featured { transform: translateY(-5px) rotate(-1.2deg) scale(1.045); box-shadow: 0 14px 26px #153d6833; z-index: 1; }
.home-content .home-feedback .feedback-card:nth-child(even).is-featured { transform: translateY(-5px) rotate(1.2deg) scale(1.045); }
.home-content .home-feedback .feedback-card.is-featured .feedback-text { font-weight: 600; }
.home-content .home-feedback .feedback-card.is-featured .feedback-name { font-size: 1.1rem; }
.home-content .home-feedback .feedback-card.is-featured .feedback-card-art { transform: rotate(-12deg) scale(1.15); }
.home-feedback .feedback-card-art { right: 1.5rem; bottom: 1.15rem; font-size: 32px; opacity: .8; }
@media (min-width: 650px) { .home-content .home-feedback .feedback-card { flex-basis: calc((100% - 1.5rem) / 2); } }
@media (min-width: 1000px) { .home-content .home-feedback .feedback-card { flex-basis: calc((100% - 3rem) / 3); padding: 2rem 2rem 5rem; } }
@media (max-width: 649px) {
    .home-content .home-feedback .feedback-card.is-featured,
    .home-content .home-feedback .feedback-card:nth-child(even).is-featured { transform: translateY(-3px) rotate(-.6deg) scale(1.02); }
}
@media (prefers-reduced-motion: reduce) {
    .home-content .home-feedback .feedback-card.is-featured,
    .home-content .home-feedback .feedback-card:nth-child(even).is-featured { transform: none; transition: none; }
}

/* A short star burst emerges from behind the active review. */
.home-content .home-feedback .feedback-card { overflow: visible; }
.home-feedback .feedback-sparks { position: absolute; inset: 0; z-index: -2; pointer-events: none; color: #7c8998; }
.home-feedback .feedback-sparks i { position: absolute; opacity: 0; font-size: 17px; }
.home-feedback .feedback-sparks i:nth-child(1) { left: 4%; top: 3%; --spark-x: -22px; --spark-y: -30px; --spark-turn: -25deg; }
.home-feedback .feedback-sparks i:nth-child(2) { right: 5%; top: 6%; --spark-x: 24px; --spark-y: -28px; --spark-turn: 30deg; animation-delay: .1s; font-size: 13px; }
.home-feedback .feedback-sparks i:nth-child(3) { left: 1%; bottom: 10%; --spark-x: -23px; --spark-y: 12px; --spark-turn: -35deg; animation-delay: .18s; font-size: 12px; }
.home-feedback .feedback-sparks i:nth-child(4) { right: 1%; bottom: 8%; --spark-x: 25px; --spark-y: 17px; --spark-turn: 25deg; animation-delay: .26s; }
.home-feedback .feedback-card.is-featured .feedback-sparks i { animation-name: feedbackStarBurst; animation-duration: 1.5s; animation-timing-function: ease-out; animation-fill-mode: both; }
@keyframes feedbackStarBurst { 0% { opacity: 0; transform: translate(0,0) scale(.3); } 25% { opacity: .85; } 65% { opacity: .65; } 100% { opacity: 0; transform: translate(var(--spark-x),var(--spark-y)) rotate(var(--spark-turn)) scale(1); } }
@media (prefers-reduced-motion: reduce) { .home-feedback .feedback-card.is-featured .feedback-sparks i { animation: none; } }

/* Reserve room around the cards for a complete golden burst. */
.home-content .home-feedback .feedback-cards { padding-top: 3.5rem; padding-bottom: 3.5rem; }
.home-feedback .feedback-sparks { color: #f5b400; z-index: 3; }
.home-feedback .feedback-sparks i { filter: drop-shadow(0 1px 1px #98630026); }
.home-feedback .feedback-sparks i:nth-child(1) { left: 9%; top: -4px; --spark-x: -18px; --spark-y: -28px; }
.home-feedback .feedback-sparks i:nth-child(2) { right: 10%; top: -4px; --spark-x: 18px; --spark-y: -30px; }
.home-feedback .feedback-sparks i:nth-child(3) { left: -4px; bottom: 22%; --spark-x: -14px; --spark-y: 7px; }
.home-feedback .feedback-sparks i:nth-child(4) { right: -4px; bottom: 23%; --spark-x: 14px; --spark-y: 9px; }
.home-feedback .feedback-sparks i:nth-child(5) { left: 28%; top: -5px; --spark-x: -9px; --spark-y: -35px; --spark-turn: -30deg; animation-delay: .08s; font-size: 11px; }
.home-feedback .feedback-sparks i:nth-child(6) { right: 30%; top: -5px; --spark-x: 8px; --spark-y: -30px; --spark-turn: 25deg; animation-delay: .2s; font-size: 16px; }
.home-feedback .feedback-sparks i:nth-child(7) { left: -4px; top: 25%; --spark-x: -16px; --spark-y: -12px; --spark-turn: -20deg; animation-delay: .12s; font-size: 10px; }
.home-feedback .feedback-sparks i:nth-child(8) { right: -4px; top: 28%; --spark-x: 15px; --spark-y: -10px; --spark-turn: 40deg; animation-delay: .3s; font-size: 14px; }
.home-feedback .feedback-sparks i:nth-child(9) { left: 15%; bottom: -4px; --spark-x: -10px; --spark-y: 28px; --spark-turn: 35deg; animation-delay: .18s; font-size: 13px; }
.home-feedback .feedback-sparks i:nth-child(10) { right: 18%; bottom: -4px; --spark-x: 12px; --spark-y: 30px; --spark-turn: -25deg; animation-delay: .28s; font-size: 11px; }
.home-feedback .feedback-sparks i:nth-child(11) { left: 45%; top: -5px; --spark-x: -3px; --spark-y: -38px; --spark-turn: 45deg; animation-delay: .32s; font-size: 9px; }
.home-feedback .feedback-sparks i:nth-child(12) { left: 48%; bottom: -4px; --spark-x: 4px; --spark-y: 32px; --spark-turn: -40deg; animation-delay: .1s; font-size: 16px; }

/* A quick celebration rises from the top edge only. */
.home-feedback .feedback-sparks i,
.home-feedback .feedback-sparks .feedback-confetti { position: absolute; top: -3px !important; bottom: auto !important; right: auto !important; left: var(--burst-left) !important; opacity: 0; pointer-events: none; }
.home-feedback .feedback-sparks i:nth-child(1) { --burst-left: 8%; --spark-x: -12px; --spark-y: -31px; }
.home-feedback .feedback-sparks i:nth-child(2) { --burst-left: 17%; --spark-x: -9px; --spark-y: -42px; }
.home-feedback .feedback-sparks i:nth-child(3) { --burst-left: 25%; --spark-x: -6px; --spark-y: -28px; }
.home-feedback .feedback-sparks i:nth-child(4) { --burst-left: 33%; --spark-x: -4px; --spark-y: -45px; }
.home-feedback .feedback-sparks i:nth-child(5) { --burst-left: 41%; --spark-x: -3px; --spark-y: -34px; }
.home-feedback .feedback-sparks i:nth-child(6) { --burst-left: 49%; --spark-x: 0px; --spark-y: -47px; }
.home-feedback .feedback-sparks i:nth-child(7) { --burst-left: 56%; --spark-x: 3px; --spark-y: -30px; }
.home-feedback .feedback-sparks i:nth-child(8) { --burst-left: 63%; --spark-x: 5px; --spark-y: -43px; }
.home-feedback .feedback-sparks i:nth-child(9) { --burst-left: 70%; --spark-x: 7px; --spark-y: -33px; }
.home-feedback .feedback-sparks i:nth-child(10) { --burst-left: 77%; --spark-x: 9px; --spark-y: -46px; }
.home-feedback .feedback-sparks i:nth-child(11) { --burst-left: 84%; --spark-x: 11px; --spark-y: -29px; }
.home-feedback .feedback-sparks i:nth-child(12) { --burst-left: 91%; --spark-x: 13px; --spark-y: -40px; }
.home-feedback .feedback-card.is-featured .feedback-sparks i { animation-duration: .75s; animation-delay: 0s; }
.home-feedback .feedback-sparks .feedback-confetti { width: 4px; height: 8px; border-radius: 1px; background: #ffb600; --spark-turn: 190deg; }
.home-feedback .feedback-confetti:nth-of-type(1) { --burst-left: 12%; --spark-x: -10px; --spark-y: -42px; }
.home-feedback .feedback-confetti:nth-of-type(2) { --burst-left: 20%; --spark-x: -7px; --spark-y: -27px; background: #ff7d00; }
.home-feedback .feedback-confetti:nth-of-type(3) { --burst-left: 29%; --spark-x: -6px; --spark-y: -47px; background: #0066cc; }
.home-feedback .feedback-confetti:nth-of-type(4) { --burst-left: 37%; --spark-x: -3px; --spark-y: -32px; }
.home-feedback .feedback-confetti:nth-of-type(5) { --burst-left: 45%; --spark-x: -1px; --spark-y: -42px; background: #ff7d00; }
.home-feedback .feedback-confetti:nth-of-type(6) { --burst-left: 54%; --spark-x: 2px; --spark-y: -28px; background: #0066cc; }
.home-feedback .feedback-confetti:nth-of-type(7) { --burst-left: 62%; --spark-x: 4px; --spark-y: -46px; }
.home-feedback .feedback-confetti:nth-of-type(8) { --burst-left: 71%; --spark-x: 6px; --spark-y: -31px; background: #ff7d00; }
.home-feedback .feedback-confetti:nth-of-type(9) { --burst-left: 80%; --spark-x: 8px; --spark-y: -42px; background: #0066cc; }
.home-feedback .feedback-confetti:nth-of-type(10) { --burst-left: 88%; --spark-x: 10px; --spark-y: -30px; }
.home-feedback .feedback-card.is-featured .feedback-confetti { animation: feedbackStarBurst .7s .04s ease-out both; }
@media (prefers-reduced-motion: reduce) {
    .home-feedback .feedback-card.is-featured .feedback-sparks i,
    .home-feedback .feedback-card.is-featured .feedback-confetti { animation: none; }
}


/* A fan-shaped celebration: quick launch, then a lingering flutter. */
.home-content .home-feedback .feedback-cards { padding-top: 6.5rem; }
.home-feedback .feedback-sparks i,
.home-feedback .feedback-sparks .feedback-confetti { left: 50% !important; top: 0 !important; transform-origin: center; }
.home-feedback .feedback-card.is-featured .feedback-sparks i { animation: feedbackCelebration 2.2s ease-out both; }
.home-feedback .feedback-card.is-featured .feedback-confetti { animation: feedbackCelebration 2.5s .06s ease-out both; }
@keyframes feedbackCelebration {
    0% { opacity: 0; transform: translate(-50%, 4px) scale(.25) rotate(0deg); }
    12% { opacity: 1; }
    32% { opacity: 1; transform: translate(calc(-50% + var(--spark-x)), var(--spark-y)) scale(1) rotate(var(--spark-turn, 40deg)); }
    68% { opacity: .95; }
    100% { opacity: 0; transform: translate(calc(-50% + var(--spark-x) * 1.15), calc(var(--spark-y) + 40px)) scale(.85) rotate(calc(var(--spark-turn, 40deg) + 100deg)); }
}
.home-feedback .feedback-sparks i:nth-child(1) { --spark-x: -115px; --spark-y: -48px; }
.home-feedback .feedback-sparks i:nth-child(2) { --spark-x: -93px; --spark-y: -65px; }
.home-feedback .feedback-sparks i:nth-child(3) { --spark-x: -72px; --spark-y: -57px; }
.home-feedback .feedback-sparks i:nth-child(4) { --spark-x: -52px; --spark-y: -80px; }
.home-feedback .feedback-sparks i:nth-child(5) { --spark-x: -31px; --spark-y: -66px; }
.home-feedback .feedback-sparks i:nth-child(6) { --spark-x: -12px; --spark-y: -87px; }
.home-feedback .feedback-sparks i:nth-child(7) { --spark-x: 14px; --spark-y: -70px; }
.home-feedback .feedback-sparks i:nth-child(8) { --spark-x: 34px; --spark-y: -83px; }
.home-feedback .feedback-sparks i:nth-child(9) { --spark-x: 55px; --spark-y: -64px; }
.home-feedback .feedback-sparks i:nth-child(10) { --spark-x: 76px; --spark-y: -72px; }
.home-feedback .feedback-sparks i:nth-child(11) { --spark-x: 96px; --spark-y: -56px; }
.home-feedback .feedback-sparks i:nth-child(12) { --spark-x: 116px; --spark-y: -45px; }
.home-feedback .feedback-confetti:nth-of-type(1) { --spark-x: -106px; --spark-y: -66px; }
.home-feedback .feedback-confetti:nth-of-type(2) { --spark-x: -82px; --spark-y: -80px; }
.home-feedback .feedback-confetti:nth-of-type(3) { --spark-x: -61px; --spark-y: -58px; }
.home-feedback .feedback-confetti:nth-of-type(4) { --spark-x: -40px; --spark-y: -89px; }
.home-feedback .feedback-confetti:nth-of-type(5) { --spark-x: -20px; --spark-y: -76px; }
.home-feedback .feedback-confetti:nth-of-type(6) { --spark-x: 21px; --spark-y: -92px; }
.home-feedback .feedback-confetti:nth-of-type(7) { --spark-x: 43px; --spark-y: -59px; }
.home-feedback .feedback-confetti:nth-of-type(8) { --spark-x: 64px; --spark-y: -82px; }
.home-feedback .feedback-confetti:nth-of-type(9) { --spark-x: 85px; --spark-y: -68px; }
.home-feedback .feedback-confetti:nth-of-type(10) { --spark-x: 107px; --spark-y: -75px; }
.home-feedback .feedback-confetti:nth-of-type(odd) { width: 7px; height: 8px; clip-path: polygon(0 0, 100% 0, 50% 100%); border-radius: 0; }
@media (max-width: 649px) {
    .home-feedback .feedback-sparks { width: 80%; left: 10%; }
}
@media (prefers-reduced-motion: reduce) {
    .home-feedback .feedback-card.is-featured .feedback-sparks i,
    .home-feedback .feedback-card.is-featured .feedback-confetti { animation: none; }
}


/* Scale the fan to the review width instead of a fixed pixel spread. */
.home-content .home-feedback .feedback-card { container-type: inline-size; }
.home-feedback .feedback-sparks i:nth-child(1) { --spark-x: -46cqw; }
.home-feedback .feedback-sparks i:nth-child(2) { --spark-x: -38cqw; }
.home-feedback .feedback-sparks i:nth-child(3) { --spark-x: -29cqw; }
.home-feedback .feedback-sparks i:nth-child(4) { --spark-x: -21cqw; }
.home-feedback .feedback-sparks i:nth-child(5) { --spark-x: -13cqw; }
.home-feedback .feedback-sparks i:nth-child(6) { --spark-x: -5cqw; }
.home-feedback .feedback-sparks i:nth-child(7) { --spark-x: 6cqw; }
.home-feedback .feedback-sparks i:nth-child(8) { --spark-x: 14cqw; }
.home-feedback .feedback-sparks i:nth-child(9) { --spark-x: 22cqw; }
.home-feedback .feedback-sparks i:nth-child(10) { --spark-x: 30cqw; }
.home-feedback .feedback-sparks i:nth-child(11) { --spark-x: 39cqw; }
.home-feedback .feedback-sparks i:nth-child(12) { --spark-x: 46cqw; }
.home-feedback .feedback-confetti:nth-of-type(1) { --spark-x: -43cqw; }
.home-feedback .feedback-confetti:nth-of-type(2) { --spark-x: -34cqw; }
.home-feedback .feedback-confetti:nth-of-type(3) { --spark-x: -25cqw; }
.home-feedback .feedback-confetti:nth-of-type(4) { --spark-x: -16cqw; }
.home-feedback .feedback-confetti:nth-of-type(5) { --spark-x: -8cqw; }
.home-feedback .feedback-confetti:nth-of-type(6) { --spark-x: 9cqw; }
.home-feedback .feedback-confetti:nth-of-type(7) { --spark-x: 17cqw; }
.home-feedback .feedback-confetti:nth-of-type(8) { --spark-x: 26cqw; }
.home-feedback .feedback-confetti:nth-of-type(9) { --spark-x: 35cqw; }
.home-feedback .feedback-confetti:nth-of-type(10) { --spark-x: 43cqw; }


/* Phone layout gives the review the width; navigation sits below it. */
@media (max-width: 649px) {
    .home-content .home-feedback { padding: 1.75rem 1rem 1.25rem; }
    .home-feedback .feedback-heading { display: block; margin-bottom: .5rem; }
    .home-content .home-feedback .feedback-title { text-align: left; font-size: 1.8rem; }
    .home-feedback .feedback-intro { text-align: left; font-size: .85rem; line-height: 1.6; }
    .home-feedback .feedback-stage { padding-bottom: 3.25rem; }
    .home-content .home-feedback .feedback-cards { padding: 3.5rem 8px 1.25rem; scroll-padding-inline: 8px; gap: 1rem; align-items: stretch; }
    .home-content .home-feedback .feedback-card { flex-basis: 100%; padding: 1.25rem 1.25rem 3.75rem; border-radius: 14px; }
    .home-content .home-feedback .feedback-text { font-size: .95rem; line-height: 1.7; }
    .home-content .home-feedback .feedback-card.is-featured .feedback-name { font-size: 1rem; }
    .home-content .home-feedback .feedback-card.is-featured,
    .home-content .home-feedback .feedback-card:nth-child(even).is-featured { transform: translateY(-2px) rotate(-.4deg) scale(1.01); }
    .home-content .home-feedback .feedback-stage .carousel-controls { inset: auto 8px 0; width: auto; justify-content: space-between; height: 44px; }
    .home-feedback .feedback-stage::before, .home-feedback .feedback-stage::after { display: none; }
    .home-feedback .feedback-card-art { width: 32px; height: 32px; font-size: 26px; right: 1.25rem; bottom: .75rem; }
    .home-feedback .feedback-sparks { left: 0; width: 100%; }
    .home-feedback .feedback-card.is-featured .feedback-sparks i,
    .home-feedback .feedback-card.is-featured .feedback-confetti { animation-name: feedbackCelebrationCompact; }
}
@keyframes feedbackCelebrationCompact {
    0% { opacity: 0; transform: translate(-50%, 2px) scale(.25); }
    12% { opacity: 1; }
    32% { opacity: 1; transform: translate(calc(-50% + var(--spark-x)), calc(var(--spark-y) * .5)) scale(.8) rotate(var(--spark-turn, 40deg)); }
    68% { opacity: .95; }
    100% { opacity: 0; transform: translate(calc(-50% + var(--spark-x) * 1.05), calc(var(--spark-y) * .5 + 20px)) scale(.65) rotate(calc(var(--spark-turn, 40deg) + 100deg)); }
}

/* A warm smile belongs to the highlighted customer story. */
.home-content .home-feedback .feedback-card .feedback-card-art { opacity: 0; transform: scale(.85); transition: opacity .3s ease, transform .3s ease; }
.home-content .home-feedback .feedback-card.is-featured .feedback-card-art { opacity: .9; color: #fff; transform: rotate(-8deg) scale(1); }
@media (prefers-reduced-motion: reduce) { .home-content .home-feedback .feedback-card .feedback-card-art { transition: none; } }

/* The highlighted review receives a smiling stamp on its left corner. */
.home-feedback .feedback-smile-stamp { position: absolute; left: -13px; top: -17px; z-index: 4; display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; background: #704c0b; color: #ffd34d; box-shadow: 0 3px 7px #5236002e; opacity: 0; transform: rotate(-18deg) scale(.7); pointer-events: none; transition: opacity .25s ease, transform .35s cubic-bezier(.2,.8,.2,1.2); }
.home-feedback .feedback-smile-stamp i { font-size: 47px; line-height: 1; }
.home-feedback .feedback-card.is-featured .feedback-smile-stamp { opacity: 1; transform: rotate(-12deg) scale(1); }
@media (max-width: 649px) { .home-feedback .feedback-smile-stamp { left: -6px; top: -15px; width: 40px; height: 40px; } .home-feedback .feedback-smile-stamp i { font-size: 39px; } }
@media (prefers-reduced-motion: reduce) { .home-feedback .feedback-smile-stamp { transition: none; } }

.home-feedback .feedback-smile-stamp { top: auto; bottom: -15px; background: transparent; color: #ffc928; box-shadow: none; }
@media (max-width: 649px) { .home-feedback .feedback-smile-stamp { top: auto; bottom: -12px; } }

/* Larger open smile, still a single yellow stamp on the lower-left corner. */
.home-feedback .feedback-smile-stamp { width: 68px; height: 68px; left: -18px; bottom: -23px; }
.home-feedback .feedback-smile-stamp svg { display: block; width: 100%; height: 100%; }
@media (max-width: 649px) { .home-feedback .feedback-smile-stamp { width: 56px; height: 56px; left: -5px; bottom: -19px; } }

.home-feedback .feedback-smile-stamp { top: -24px; bottom: auto; }
@media (max-width: 649px) { .home-feedback .feedback-smile-stamp { top: -20px; bottom: auto; } }

/* Use the same solid icon family as the navigation. */
.home-feedback .feedback-smile-stamp i { display: block; font-size: 68px; line-height: 1; }
@media (max-width: 649px) { .home-feedback .feedback-smile-stamp i { font-size: 56px; } }

/* The excited face becomes a quiet silhouette inside the left side of the card. */
.home-feedback .feedback-smile-stamp { inset: 0; width: auto; height: auto; border-radius: inherit; overflow: hidden; background: transparent; box-shadow: none; color: #fff; opacity: 0; transform: none; z-index: 0; }
.home-feedback .feedback-card.is-featured .feedback-smile-stamp { opacity: .1; transform: none; }
.home-feedback .feedback-smile-stamp i { position: absolute; left: -.28em; top: 50%; font-size: 240px; line-height: 1; transform: translateY(-50%) rotate(-12deg); }
.home-content .home-feedback .feedback-author,
.home-content .home-feedback .feedback-text { position: relative; z-index: 1; }
@media (max-width: 649px) {
    .home-feedback .feedback-smile-stamp { inset: 0; width: auto; height: auto; }
    .home-feedback .feedback-smile-stamp i { font-size: 210px; }
}

/* Keep the section introduction aligned with the other home-page headings. */
.home-feedback .feedback-heading { display: block; text-align: center; margin-bottom: 0; }
.home-content .home-feedback .feedback-title,
.home-feedback .feedback-intro { text-align: center; }
.home-feedback .feedback-intro { margin-top: .5rem; }
.home-content .home-feedback .feedback-cards { padding-top: 5.5rem; }
@media (max-width: 649px) {
    .home-feedback .feedback-heading { margin-bottom: 0; }
    .home-content .home-feedback .feedback-title,
    .home-feedback .feedback-intro { text-align: center; }
    .home-content .home-feedback .feedback-cards { padding-top: 3rem; }
}


/* Each particle gets a fresh trajectory whenever its review is highlighted. */
.home-feedback .feedback-card.is-featured .feedback-sparks > * { animation-name: feedbackRandomCelebration; animation-duration: var(--particle-duration, 2.2s); animation-delay: var(--particle-delay, 0s); animation-timing-function: cubic-bezier(.15,.65,.35,1); animation-fill-mode: both; }
.home-feedback .feedback-sparks { --burst-height-scale: 1; }
@keyframes feedbackRandomCelebration {
    0% { opacity: 0; transform: translate(-50%, 3px) rotate(0deg) scale(.2); }
    10% { opacity: 1; }
    32% { opacity: 1; transform: translate(calc(-50% + var(--spark-x)), calc(var(--spark-y) * var(--burst-height-scale))) rotate(var(--spark-turn)) scale(var(--particle-size)); }
    65% { opacity: .9; transform: translate(calc(-50% + var(--spark-x) + var(--particle-drift) * .4), calc((var(--spark-y) + var(--particle-fall) * .35) * var(--burst-height-scale))) rotate(calc(var(--spark-turn) + 60deg)) scale(var(--particle-size)); }
    100% { opacity: 0; transform: translate(calc(-50% + var(--spark-x) + var(--particle-drift)), calc((var(--spark-y) + var(--particle-fall)) * var(--burst-height-scale))) rotate(calc(var(--spark-turn) + 180deg)) scale(calc(var(--particle-size) * .8)); }
}
@media (max-width: 649px) { .home-feedback .feedback-sparks { --burst-height-scale: .5; } }
@media (prefers-reduced-motion: reduce) { .home-feedback .feedback-card.is-featured .feedback-sparks > * { animation: none; } }

/* Allow for the highest particle, card lift, tilt and star size. */
.home-content .home-feedback .feedback-cards { padding-top: 8rem; }
@media (max-width: 649px) { .home-content .home-feedback .feedback-cards { padding-top: 5rem; } }

/* A continuous ballistic arc avoids a suspended pause at the apex. */
.home-feedback .feedback-card.is-featured .feedback-sparks > * { animation-timing-function: linear; }
@keyframes feedbackRandomCelebration {
    0% { opacity: 0; transform: translate(-50%, 3px) rotate(0deg) scale(.3); }
    12% { opacity: 1; transform: translate(calc(-50% + var(--spark-x) * .27), calc(var(--spark-y) * var(--burst-height-scale) * .63)) rotate(calc(var(--spark-turn) * .2)) scale(var(--particle-size)); }
    26% { opacity: 1; transform: translate(calc(-50% + var(--spark-x) * .55), calc(var(--spark-y) * var(--burst-height-scale) * .94)) rotate(calc(var(--spark-turn) * .5)) scale(var(--particle-size)); }
    38% { opacity: 1; transform: translate(calc(-50% + var(--spark-x) * .75), calc(var(--spark-y) * var(--burst-height-scale))) rotate(var(--spark-turn)) scale(var(--particle-size)); }
    52% { opacity: .95; transform: translate(calc(-50% + var(--spark-x) * .91 + var(--particle-drift) * .15), calc((var(--spark-y) + var(--particle-fall) * .22) * var(--burst-height-scale))) rotate(calc(var(--spark-turn) + 55deg)) scale(var(--particle-size)); }
    72% { opacity: .8; transform: translate(calc(-50% + var(--spark-x) + var(--particle-drift) * .5), calc((var(--spark-y) + var(--particle-fall) * .7) * var(--burst-height-scale))) rotate(calc(var(--spark-turn) + 120deg)) scale(calc(var(--particle-size) * .9)); }
    100% { opacity: 0; transform: translate(calc(-50% + var(--spark-x) + var(--particle-drift)), calc((var(--spark-y) + var(--particle-fall) * 1.8) * var(--burst-height-scale))) rotate(calc(var(--spark-turn) + 230deg)) scale(calc(var(--particle-size) * .8)); }
}
@media (prefers-reduced-motion: reduce) { .home-feedback .feedback-card.is-featured .feedback-sparks > * { animation: none; } }

/* Particle motion is sampled from gravity in carousel.js, rather than CSS stages. */
.home-feedback .feedback-card.is-featured .feedback-sparks > * { animation: none; }

/* Extend the phone's scroll viewport so the card shadow has room to fade. */
@media (max-width: 649px) {
    .home-content .home-feedback .feedback-cards { width: calc(100% + 32px); max-width: none; margin-inline: -16px; padding-inline: 24px; padding-bottom: 2rem; scroll-padding-inline: 24px; }
}
