/* Carousel adapted from tfsc-insta; scoped to avoid dashboard styles. */
.technology-carousel { margin: 2rem auto 3rem; max-width: 100rem; }
.technology-carousel .kicker { display: flex; justify-content: center; align-items: center; gap: 1rem; padding: 0 1.25rem; margin-bottom: 1.5rem; }
.technology-carousel .kicker h2 { margin: 0; font-size: .7rem; font-weight: 500; letter-spacing: .1rem; color: #68745f; text-align: center; }
.technology-carousel .kicker i { width: 2.75rem; height: .0625rem; background: var(--line); }
.technology-carousel .carousel { overflow: hidden; mask-image: linear-gradient(90deg, transparent, #000 9%, #000 91%, transparent); padding: .2rem 0; }
.technology-carousel .marquee { display: flex; width: max-content; animation: technology-marquee var(--duration, 65s) linear infinite; margin-bottom: .75rem; }
.technology-carousel .marquee:nth-child(2) { animation-direction: reverse; }
.technology-carousel .tech-group { display: flex; gap: .75rem; padding-right: .75rem; }
.technology-carousel .tech-chip { width: 9.4375rem; height: 3.5625rem; display: flex; align-items: center; gap: .75rem; padding: 0 1.1875rem; background: #f1f3ee; border: .0625rem solid #e8ece2; border-radius: .5625rem; font-size: .75rem; color: #535d4f; white-space: nowrap; }
.technology-carousel .tech-chip img { width: 1.625rem; height: 1.625rem; object-fit: contain; }
@keyframes technology-marquee { to { transform: translateX(-50%); } }
.technology-carousel .carousel:hover .marquee, .technology-carousel .carousel.is-paused .marquee { animation-play-state: paused; }
.technology-carousel .carousel-bottom { position: relative; max-width: 67rem; margin: .625rem auto 0; padding: 0 1.5rem; text-align: center; }
.technology-carousel .carousel-bottom p { font-size: .75rem; color: #68745f; }
.technology-carousel .carousel-bottom code { color: #638054; }
.technology-carousel #motion-toggle { position: absolute; right: 1.5rem; top: -.25rem; font-size: .75rem; border: 0; background: transparent; color: #68745f; padding: .25rem .375rem; }
@media (max-width: 48rem) { .technology-carousel #motion-toggle { position: static; } .technology-carousel .tech-chip { width: 8.4375rem; height: 3.25rem; padding: 0 .9375rem; } }
@media (prefers-reduced-motion: reduce) { .technology-carousel .marquee { animation: none; } .technology-carousel #motion-toggle { display: none; } .technology-carousel .carousel { overflow-x: auto; mask-image: none; } .technology-carousel [aria-hidden=true] { display: none; } }