/* Photo-led headlines with a compact news selection strip. */
.spotlight-section {
    background: #fff;
    border: 1px solid #dce4db;
    border-top: 4px solid #285b46;
    border-radius: 12px;
    padding: 22px;
    margin-bottom: 30px;
    color: #243c32;
    min-width: 0;
}
.spotlight-header { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 18px; }
.spotlight-eyebrow { display: inline-flex; align-items: center; gap: 7px; margin-bottom: 7px; color: #285b46; font-size: .62rem; font-weight: 800; letter-spacing: .14em; }
.spotlight-eyebrow > span { width: 7px; height: 7px; border-radius: 50%; background: #d47039; }
.spotlight-header h2 { color: #203c30; font-size: clamp(1.3rem, 2vw, 1.75rem); font-weight: 800; letter-spacing: -.04em; }
.spotlight-header p { margin: 7px 0 0; font-size: .78rem; color: #647166; }
.spotlight-emblem { color: #285b46; font-size: 1.6rem; }
.spotlight-controls { display: flex; gap: 7px; flex-shrink: 0; }
.spotlight-controls button { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 1px solid #d3ded5; border-radius: 6px; background: #f5f7f2; color: #285b46; transition: background-color .18s; }
.spotlight-controls button:hover { background: #e5eddf; }
.spotlight-track { overflow: hidden; border-radius: 8px; background: #18392c; }
.spotlight-card { position: relative; display: flex; align-items: flex-end; min-height: 390px; width: 100%; overflow: hidden; color: #fff; background: #18392c; text-decoration: none; isolation: isolate; }
.spotlight-card:hover { color: #fff; text-decoration: none; }
.spotlight-visual { position: absolute; inset: 0; z-index: -2; background: #244b3b; }
.spotlight-visual > img { width: 100%; height: 100%; display: block; object-fit: cover; transition: transform .45s; }
.spotlight-card:hover .spotlight-visual > img { transform: scale(1.035); }
.spotlight-card::before { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(8, 24, 18, .12) 0%, rgba(8, 24, 18, .3) 28%, rgba(8, 24, 18, .9) 72%, #081c14 100%); }
.spotlight-placeholder { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 12px; color: #acc2a7; background: radial-gradient(ellipse at 75% 10%, #50765a, #18392c 75%); }
.spotlight-placeholder i { font-size: 5rem; }
.spotlight-placeholder span { font-size: .8rem; }
.spotlight-seal { position: absolute; top: 20px; left: 24px; display: inline-flex; align-items: center; gap: 7px; padding: 7px 11px; background: #f1c777; color: #283c29; border-radius: 4px; font-size: .66rem; font-weight: 800; }
.spotlight-card-content { width: 100%; min-width: 0; padding: 90px 26px 24px; }
.spotlight-card-category { font-size: .62rem; letter-spacing: .14em; font-weight: 700; color: #f1c777; }
.spotlight-card h3 { margin: 10px 0 12px; color: #fff; font-weight: 800; font-size: clamp(1.5rem, 2.6vw, 2.25rem); line-height: 1.18; letter-spacing: -.035em; overflow-wrap: anywhere; }
.spotlight-location { display: flex; align-items: center; gap: 6px; color: #e0e9df; font-size: .78rem; margin: 0 0 18px; }
.spotlight-card-bottom { padding-top: 14px; border-top: 1px solid #ffffff40; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; }
.spotlight-proof { display: inline-flex; align-items: center; gap: 7px; color: #e0e9df; font-size: .75rem; }
.spotlight-card-link { display: inline-flex; align-items: center; gap: 10px; font-size: .78rem; font-weight: 700; color: #fff; }
.spotlight-arrow { display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 50%; background: #ffffff20; }
.spotlight-pagination { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.spotlight-dots { display: flex; flex: 0 0 100%; gap: 8px; overflow-x: auto; padding: 3px 3px 9px; scroll-snap-type: x proximity; }
.spotlight-dots button { display: flex; align-items: center; gap: 9px; flex: 0 0 calc((100% - 16px) / 3); min-width: 165px; text-align: left; background: #f5f7f2; color: #304535; border: 1px solid #e0e6db; border-bottom: 3px solid transparent; border-radius: 5px; padding: 8px; scroll-snap-align: start; }
.spotlight-dots button:hover { background: #eaf0e5; }
.spotlight-dots button[aria-current] { background: #e8efe3; border-color: #9fb399; border-bottom-color: #285b46; }
.spotlight-thumb { position: relative; display: flex; align-items: center; justify-content: center; width: 48px; height: 52px; flex-shrink: 0; border-radius: 3px; overflow: hidden; background: #d7e2d2; }
.spotlight-thumb img { width: 100%; height: 100%; object-fit: cover; }
.spotlight-thumb-number { position: absolute; bottom: 0; left: 0; padding: 1px 4px; background: #18392c; color: #fff; font-size: .6rem; font-weight: 800; }
.spotlight-thumb-title { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; font-size: .7rem; font-weight: 700; line-height: 1.45; }
.spotlight-position { color: #637060; font-size: .7rem; }
.spotlight-playback { display: inline-flex; align-items: center; gap: 5px; min-height: 44px; border: 0; border-radius: 4px; background: transparent; padding: 6px 8px; color: #50654d; font-size: .7rem; }
.spotlight-playback i { font-size: 1.1rem; }
.spotlight-footer { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; border-top: 1px solid #e2e8dd; margin-top: 12px; padding-top: 15px; font-size: .72rem; }
.spotlight-footer > span { display: inline-flex; align-items: center; gap: 7px; color: #637060; }
.spotlight-footer > span i { color: #285b46; font-size: 1rem; }
.yc-site .spotlight-footer a { display: inline-flex; align-items: center; gap: 8px; color: #285b46; font-weight: 700; text-decoration: none; }
.yc-site .spotlight-footer a:hover { text-decoration: underline; }
.yc-site .spotlight-section :is(a, button):focus-visible { outline: 3px solid #b26a24; outline-offset: 2px; }
.spotlight-card:focus-visible { outline-offset: -4px !important; }
@media (max-width: 575.98px) {
    .spotlight-section { padding: 14px; border-radius: 9px; }
    .spotlight-header { gap: 10px; }
    .spotlight-header h2 { font-size: 1.2rem; }
    .spotlight-header p { font-size: .7rem; line-height: 1.5; }
    .spotlight-eyebrow { font-size: .56rem; }
    .spotlight-controls { gap: 5px; }
    .spotlight-controls button { width: 44px; }
    .spotlight-card { min-height: 350px; }
    .spotlight-card-content { padding: 85px 18px 20px; }
    .spotlight-card h3 { font-size: 1.55rem; }
    .spotlight-seal { top: 16px; left: 18px; }
    .spotlight-dots button { flex-basis: 76%; min-width: 0; }
    .spotlight-thumb { width: 58px; }
    .spotlight-thumb-title { font-size: .75rem; }
    .spotlight-footer { font-size: .68rem; }
}
@media (prefers-reduced-motion: reduce) {
    .spotlight-section .carousel-item, .spotlight-visual > img { transition: none; }
}