/* Today in pictures: the homepage's day-of art carousel. Uses the tokens from /v2.css. */
.day-carousel{margin:64px 0 72px}
.day-carousel[hidden]{display:none}
.day-carousel-head{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:28px;align-items:end;margin-bottom:24px}
.day-carousel-head .eyebrow{color:var(--blue);margin-bottom:12px}
.day-carousel-head>p{color:var(--muted);font-size:15px;max-width:520px}
.day-carousel-head>p a{color:var(--navy);font-weight:600;white-space:nowrap}
.day-carousel-frame{position:relative}
.day-carousel-track{position:relative;display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scroll-padding:0;scrollbar-width:none;padding:2px 0 6px}
.day-carousel-track::-webkit-scrollbar{display:none}
.day-carousel-track:focus-visible{outline:3px solid var(--red);outline-offset:5px}
.day-carousel-slide{flex:0 0 min(80%,880px);scroll-snap-align:start;scroll-snap-stop:always;background:var(--paper);border:1px solid var(--line);min-width:0}
.day-carousel-slide figure{display:flex;flex-direction:column;height:100%}
.day-carousel-slide img{width:100%;aspect-ratio:16/10;object-fit:cover;background:var(--navy)}
.day-carousel-slide img[data-focus="20"]{object-position:center 20%}
.day-carousel-slide img[data-focus="25"]{object-position:center 25%}
.day-carousel-slide img[data-focus="30"]{object-position:center 30%}
.day-carousel-slide img[data-focus="35"]{object-position:center 35%}
.day-carousel-slide img[data-focus="40"]{object-position:center 40%}
.day-carousel-slide img[data-focus="45"]{object-position:center 45%}
.day-carousel-slide img[data-focus="55"]{object-position:center 55%}
.day-carousel-slide img[data-focus="60"]{object-position:center 60%}
.day-carousel-slide img[data-focus="65"]{object-position:center 65%}
.day-carousel-slide img[data-focus="70"]{object-position:center 70%}
.day-carousel-slide img[data-focus="75"]{object-position:center 75%}
.day-carousel-slide img[data-focus="80"]{object-position:center 80%}
.day-carousel-slide figcaption{display:grid;gap:6px;padding:16px 18px 18px}
.day-carousel-count{color:var(--blue);font-size:9px;font-weight:700;letter-spacing:.14em}
.day-carousel-slide figcaption p{font-family:var(--head);font-size:20px;line-height:1.25;letter-spacing:-.02em;margin:0}
.day-carousel-slide figcaption small{color:var(--muted);font-size:11px;line-height:1.5}
.day-carousel-slide figcaption small a{white-space:nowrap;margin-left:4px}
.day-carousel-controls{display:flex;align-items:center;gap:14px;margin-top:16px}
.day-carousel-controls[hidden]{display:none}
.day-carousel-arrow{width:48px;height:48px;border:0;background:var(--navy);color:var(--cream);font-size:22px;line-height:1;display:grid;place-items:center}
.day-carousel-arrow:hover:not(:disabled){background:var(--blue)}
.day-carousel-dots{display:flex;flex-wrap:wrap;gap:2px}
.day-carousel-dots button{width:28px;height:28px;border:0;padding:0;background:none;display:grid;place-items:center}
.day-carousel-dots button::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--line);transition:transform .2s ease,background .2s ease}
.day-carousel-dots button[aria-current="true"]::before{background:var(--navy);transform:scale(1.3)}
.day-carousel .visual-credit{margin-top:14px}
.day-carousel .visual-credit a{margin-left:8px}
@media(max-width:760px){
  .day-carousel{margin:44px 0 52px}
  .day-carousel-head{grid-template-columns:1fr;gap:10px;margin-bottom:18px}
  .day-carousel-head h2{font-size:30px}
  /* Run the pictures edge to edge on a phone; .page pads 5vw each side. */
  .day-carousel-track{gap:10px;margin:0 -5vw;padding:2px 5vw 6px;scroll-padding:0 5vw}
  .day-carousel-slide{flex-basis:86%}
  .day-carousel-slide img{aspect-ratio:4/3}
  .day-carousel-slide figcaption{padding:13px 14px 15px}
  .day-carousel-slide figcaption p{font-size:17px}
  .day-carousel-controls{gap:8px}
  .day-carousel-arrow{width:44px;height:44px}
}
@media(prefers-reduced-motion:reduce){.day-carousel-dots button::before{transition:none}}