/* "A growing shelf of play": two slow drifting rows (see shelf-drift.js) */
.sec-calm .inside .obj, .sec-calm .inside .spark { display: none !important; }
.sec-calm .inside .wrap { width: 100% !important; max-width: none !important; padding-inline: 0 !important; }
.sec-calm .inside .head { width: var(--colw); margin-left: auto !important; margin-right: auto !important; }
.drift-band { overflow: hidden; display: grid; gap: 26px; }
.dr { display: flex; gap: 22px; width: max-content; animation: drift 95s linear infinite; }
.dr.rev { animation-direction: reverse; animation-duration: 115s; }
.drift-band:hover .dr { animation-play-state: paused; }
@keyframes drift { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .dr { animation: none; } .drift-band { overflow-x: auto; } }
.dt { width: 196px; display: grid; gap: 10px; }
.dt-th { position: relative; aspect-ratio: 1; border-radius: 22px; overflow: hidden; background: #EDE3D3; }
.dt-th img { width: 100%; height: 100%; object-fit: cover; display: block; }
.dt-nm { font: 400 17.5px/1.25 p22-mackinac-pro, "Fraunces", Georgia, serif; color: var(--teal); }
.dt.soon .dt-th img { opacity: .38; filter: saturate(.6); }
.dt.soon .dt-nm { color: #8E9A9A; }
.dt-soon { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); white-space: nowrap; font: 600 12.5px/1 "Outfit", sans-serif; letter-spacing: .04em; color: #5A3A00; background: #F0B429; padding: 8px 13px; border-radius: 99px; box-shadow: 0 6px 14px -6px rgba(90,58,0,.4); }
.dt-new { position: absolute; left: 12px; top: 12px; font: 600 12px/1 "Outfit", sans-serif; letter-spacing: .04em; color: #fff; background: var(--rust); padding: 7px 11px; border-radius: 99px; transform: rotate(-6deg); box-shadow: 0 6px 12px -6px rgba(120,30,10,.5); }
.drift-cta { margin-top: 52px; display: flex; justify-content: center; align-items: center; gap: 16px; flex-wrap: wrap; }
.drift-btn { font: 600 16px/1 "Outfit", sans-serif; color: #fff; background: var(--rust); border: 0; padding: 17px 28px; border-radius: 10px; cursor: pointer; }
.drift-cta span { color: #4A5656; font-size: 15px; }
/* the full grid, only when opened */
.sec-calm .inside .gallery.gal-hidden { display: none !important; }
.sec-calm .inside .gallery.gal-open { display: grid !important; width: var(--colw); margin: 64px auto 0 !important; grid-template-columns: repeat(8, 1fr) !important; gap: 32px 20px !important; max-width: none !important; }
.sec-calm .inside .gallery.gal-open .tags { display: none !important; }
.sec-calm .inside .gallery.gal-open .tile.soon img { opacity: .38; }
@media (max-width: 900px) { .dt { width: 140px; } .dt-nm { font-size: 15px; } .sec-calm .inside .gallery.gal-open { grid-template-columns: repeat(3, 1fr) !important; } }
/* what each one brings, on hover (like option A) */
.dt-tg { position: absolute; left: 8px; right: 8px; bottom: 8px; display: flex; flex-wrap: wrap; gap: 4px; justify-content: center; opacity: 0; transform: translateY(6px); transition: opacity .3s, transform .3s; }
.dt-tg i { font: 500 11.5px/1 "Outfit", sans-serif; font-style: normal; background: rgba(255,255,255,.95); color: #1F2A2B; padding: 5px 8px; border-radius: 99px; }
.dt:hover .dt-tg { opacity: 1; transform: none; }
.dt:hover .dt-th { transform: translateY(-4px); }
.dt-th { transition: transform .4s cubic-bezier(.2,.7,.2,1); }
.drift-note { margin: 48px auto 0; width: var(--colw); display: flex; justify-content: center; align-items: center; gap: 12px; font: 400 22px/1.4 p22-mackinac-pro, "Fraunces", Georgia, serif; color: var(--teal); text-align: center; }
.drift-note svg { width: 22px; height: 22px; flex: none; fill: #F0B429; animation: twk 4.5s ease-in-out infinite; }
@keyframes twk { 0%, 100% { opacity: 1; transform: scale(1); } 50% { opacity: .5; transform: scale(.8); } }
@media (max-width: 900px) { .drift-note { font-size: 18px; } }
.dt-nm { text-align: center; }
/* names always sit 10px under their card, even next to a two-line name */
.dr { align-items: flex-start; } .dt { align-content: start; }
/* the closing line as a cream pill led by the New badge */
.drift-note { font: inherit; }
.dn-pill { display: inline-flex; align-items: center; gap: 14px; padding: 10px 24px 10px 10px; border-radius: 99px; background: #F6F2EC; font: 500 16.5px/1.3 "Outfit", sans-serif; color: #1F2A2B; text-align: left; }
.dn-pill i { font-style: normal; font: 600 12px/1 "Outfit", sans-serif; letter-spacing: .04em; color: #fff; background: var(--rust); padding: 7px 11px; border-radius: 99px; transform: rotate(-6deg); flex: none; box-shadow: 0 6px 12px -6px rgba(120,30,10,.5); }
@media (max-width: 600px) { .dn-pill { font-size: 14.5px; border-radius: 22px; } }
.dt-nm { font: 500 16px/1.3 "Outfit", sans-serif; color: var(--teal); letter-spacing: -.005em; }