
.ww-head { max-width: 760px; margin-bottom: clamp(30px, 5vh, 52px); }
.ww-head .section__lead { margin-top: 14px; }
.ww-list { --rail: 28px; list-style: none; margin: 0; padding: 0 0 0 var(--rail); position: relative; display: grid; gap: clamp(36px, 6vh, 64px); }
.ww-list::before { content: ""; position: absolute; left: 6px; top: 10px; bottom: 30px; width: 2px; border-radius: 2px; background: linear-gradient(180deg, #FFAE63, #FF7A1A 40%, #F2541B 80%, rgb(242 84 27 / 0)); box-shadow: 0 0 12px rgb(255 122 26 / calc(.5 * var(--glow-k))); }
.ww-when { position: relative; margin: 0 0 14px; color: var(--ember-text); font-family: var(--font-head); font-size: .9375rem; font-weight: 600; letter-spacing: .01em; }
.ww-dot { position: absolute; left: calc(-1 * var(--rail) + 1px); top: .2em; width: 12px; height: 12px; border-radius: 50%; background: linear-gradient(180deg, #FFAE63, #F2541B); box-shadow: 0 0 0 4px rgb(255 122 26 / .18), 0 0 14px rgb(255 122 26 / .6); }

.ww-card { position: relative; display: grid; gap: 0; overflow: hidden; transition: transform .45s var(--ease-mass), box-shadow .45s var(--ease-mass), border-color .3s; }
@media (min-width: 1024px) {
  .ww-card { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); }
}
.ww-card__shots { display: grid; gap: 10px; padding: 14px; background: rgb(var(--wash) / .02); }
.ww-frame { overflow: hidden; border-radius: 14px; background: #0B0C0E; box-shadow: 0 0 0 1px rgba(255, 255, 255, .1), 0 14px 30px -18px rgba(0, 0, 0, .7); }
.ww-frame__bar { display: flex; align-items: center; justify-content: center; height: 30px; margin: 0; background: #17181D; border-bottom: 1px solid rgba(255, 255, 255, .06); }
.ww-frame__bar span { padding: 2px 12px; border-radius: 99px; background: rgba(255, 255, 255, .06); color: #A5A099; font-size: .75rem; letter-spacing: .01em; }
.ww-frame img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; object-position: top; transition: transform .8s var(--ease-mass); }
.ww-thumbs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: auto; padding-top: 10px; }
.ww-card__body .ww-thumbs + .ww-card__cta { margin-top: 0; padding-top: 4px; }
@media (max-width: 1023.98px) {
  .ww-thumbs { margin-top: 4px; padding-top: 0; }
}
@media (min-width: 1024px) {
  .ww-card__body .ww-thumbs img { aspect-ratio: 1 / 1; }
}
.ww-thumbs img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; object-position: top; border-radius: 10px; box-shadow: 0 0 0 1px rgba(255, 255, 255, .1); background: #0B0C0E; }
.ww-card__body { display: flex; flex-direction: column; gap: 12px; padding: clamp(20px, 3vw, 36px); }
.ww-card__body h3 { margin: 0; font-size: clamp(1.5rem, 1.2rem + 1vw, 2.1rem); font-weight: 600; letter-spacing: -.025em; }
.ww-card__link { color: var(--text); text-decoration: none; }
.ww-card__link::after { content: ""; position: absolute; inset: 0; z-index: 1; border-radius: inherit; }
.ww-card__body p { margin: 0; color: var(--muted); font-size: 1rem; line-height: 1.6; max-width: 44ch; }
.ww-card__body .ww-card__svc { color: var(--text-2); font-size: .875rem; font-weight: 600; }
.ww-card__body .ww-card__cta { margin-top: auto; padding-top: 8px; color: var(--ember-text); font-weight: 600; }
.ww-card:has(.ww-card__link:focus-visible) { outline: 3px solid var(--ember-text); outline-offset: 10px; }
.ww-card__link:focus-visible { outline: none; }
@media (hover: hover) and (pointer: fine) {
  .ww-card:hover { transform: translateY(-3px); border-color: rgb(255 122 26 / .6); box-shadow: inset 0 1px 0 var(--g-hi), 0 0 0 7px var(--g-shell), 0 0 0 8px rgb(255 122 26 / .3), 0 22px 50px -30px rgb(255 122 26 / calc(.6 * var(--glow-k))); }
  .ww-card:hover .ww-frame img { transform: scale(1.02); }
}
@media (prefers-reduced-motion: reduce) {
  .ww-card, .ww-frame img { transition: none; }
  .ww-card:hover, .ww-card:hover .ww-frame img { transform: none; }
}
.ww-top .tempered-top__actions { gap: 10px 12px; }
