/* ROSWO / RADAR — Five curated signals, one editorial note after Selected Work. */
.work:has(+ .roswo-radar) {
  padding-bottom: clamp(1.6rem, 3.2vw, 2.8rem);
}
.roswo-radar {
  --radar-blue:#55a9c3;
  margin: 0 var(--gutter);
  padding: clamp(1.2rem,2.3vw,1.8rem) 0 clamp(1.4rem,2.7vw,2rem);
  border-top: 1px solid rgba(255,255,255,.19);
  border-bottom: 1px solid rgba(255,255,255,.14);
  background:#000;
  color:var(--paper);
  scroll-margin-top:3rem;
}
.roswo-radar + .studio {
  padding-top:clamp(3rem,5vw,4.6rem);
}
.roswo-radar .radar-label {
  display:flex;
  align-items:center;
  gap:.65rem;
  margin:0 0 clamp(.82rem,1.6vw,1.12rem);
  font:500 .7rem/1.4 'Inter',Arial,sans-serif;
  text-transform:uppercase;
  letter-spacing:.125em;
  color:#b2b8bb;
}
.roswo-radar .radar-dot {
  display:grid;
  place-items:center;
  width:10px;
  height:10px;
  flex:0 0 auto;
  border:1px solid var(--radar-blue);
  border-radius:50%;
}
.roswo-radar .radar-dot::after {
  content:"";
  display:block;
  width:5px;
  height:5px;
  border-radius:50%;
  background:transparent;
  box-shadow:none;
}
.roswo-radar .radar-dot.is-flashing::after {
  animation:roswo-radar-dot-fill .55s ease-out 1;
}
@keyframes roswo-radar-dot-fill {
  0% {background:transparent;box-shadow:none;}
  34% {background:#64bbd6;box-shadow:0 0 9px 2px rgba(100,187,214,.34);}
  100% {background:transparent;box-shadow:none;}
}
.roswo-radar .radar-viewport {
  min-width:0;
  overflow:hidden;
  isolation:isolate;
}
.roswo-radar .radar-list {
  display:grid;
  grid-template-columns:minmax(0,1fr);
  align-items:center;
  margin:0;
  padding:0;
  list-style:none;
}
.roswo-radar .radar-item {
  grid-area:1 / 1;
  min-width:0;
  visibility:hidden;
  pointer-events:none;
  transform:translate3d(-104%,0,0);
}
.roswo-radar .radar-item.is-active {
  visibility:visible;
  pointer-events:auto;
  transform:translate3d(0,0,0);
}
.roswo-radar .radar-item.is-entering {
  visibility:visible;
  pointer-events:auto;
  animation:roswo-radar-enter .47s cubic-bezier(.24,.75,.21,1) both;
}
.roswo-radar .radar-item.is-leaving {
  visibility:visible;
  pointer-events:none;
  animation:roswo-radar-leave .47s cubic-bezier(.24,.75,.21,1) both;
}
@keyframes roswo-radar-enter {
  from {transform:translate3d(-104%,0,0);}
  to {transform:translate3d(0,0,0);}
}
@keyframes roswo-radar-leave {
  from {transform:translate3d(0,0,0);}
  to {transform:translate3d(104%,0,0);}
}
.roswo-radar .radar-link {
  display:grid;
  grid-template-columns:minmax(0,1fr) 21px;
  align-items:center;
  gap:clamp(1rem,3vw,2rem);
  width:100%;
  min-height:clamp(56px,5vw,67px);
  padding:.2rem 0;
  text-decoration:none;
  color:var(--paper);
}
.roswo-radar .radar-link:focus-visible {
  outline:2px solid var(--radar-blue);
  outline-offset:-2px;
}
.roswo-radar .radar-link h3 {
  max-width:55ch;
  min-width:0;
  font:450 clamp(1.15rem,2.15vw,1.6rem)/1.3 'Inter',Arial,sans-serif;
  letter-spacing:-.035em;
  margin:0;
  text-wrap:pretty;
}
.roswo-radar .radar-link svg {
  width:20px;
  height:20px;
  display:block;
  color:var(--radar-blue);
  transition:transform .18s ease;
}
@media(hover:hover){
  .roswo-radar .radar-link:hover h3 {color:#d5f2f8;}
  .roswo-radar .radar-link:hover svg {transform:translate(2px,-2px);}
}
@media(max-width:650px){
  .work:has(+ .roswo-radar) {padding-bottom:1.35rem;}
  .roswo-radar {
    padding-top:1.25rem;
    padding-bottom:1.4rem;
  }
  .roswo-radar + .studio {padding-top:clamp(2.7rem,9vw,3.65rem);}
  .roswo-radar .radar-label {font-size:.68rem;margin-bottom:.95rem;}
  .roswo-radar .radar-link {
    grid-template-columns:minmax(0,1fr) 19px;
    min-height:68px;
    gap:1.15rem;
    padding:.15rem 0;
  }
  .roswo-radar .radar-link h3 {
    max-width:27ch;
    font-size:clamp(1.06rem,4.65vw,1.36rem);
    line-height:1.34;
    letter-spacing:-.03em;
  }
  .roswo-radar .radar-link svg {width:19px;height:19px;}
}
@media(max-width:365px){
  .roswo-radar .radar-link h3 {font-size:1.02rem;}
  .roswo-radar .radar-link {gap:.7rem;}
}
@media(prefers-reduced-motion:reduce){
  .roswo-radar .radar-item.is-entering,
  .roswo-radar .radar-item.is-leaving,
  .roswo-radar .radar-dot.is-flashing::after {animation:none!important;}
  .roswo-radar .radar-link svg {transition:none;}
}