.call{
  --side:clamp(1.25rem,4vw,3.5rem);
  position:relative;
  background:var(--background);color:var(--foreground);
  padding:clamp(4.5rem,10vh,8rem) var(--side) clamp(4.5rem,10vh,8rem);
}
.call .kicker{color:color-mix(in oklch,var(--foreground) 50%,transparent);}
.call-top{
  display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);
  align-items:end;gap:clamp(2rem,5vw,4.5rem);
  padding-bottom:clamp(2.5rem,5vh,3.5rem);
}
.call h2{
  margin:0;color:var(--foreground);
  font-size:clamp(1.875rem,4.4vw,3.5rem);
  font-weight:600;line-height:1.02;
  letter-spacing:-.032em;text-transform:uppercase;
}
.call h2 .dim{color:color-mix(in oklch,var(--foreground) 45%,transparent);}
.call-note{
  margin:0;max-width:44ch;color:color-mix(in oklch,var(--foreground) 60%,transparent);
  font-size:clamp(.9375rem,1.3vw,1.0625rem);line-height:1.6;
}

/* --- the player panel --- */
.player{
  display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);
  gap:clamp(1.5rem,3vw,3rem);
  padding:clamp(1.5rem,3vw,2.5rem);
  border-radius:var(--r-4xl);
  background:var(--foreground);color:oklch(0.985 0 0);
}

.player-meta{
  display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;
  padding-bottom:1.5rem;
}
.pill{
  display:inline-flex;align-items:center;gap:.4375rem;
  padding:.3125rem .75rem;border-radius:9999px;
  border:1px solid oklch(1 0 0 / 0.2);
  font-size:.625rem;font-weight:600;
  text-transform:uppercase;letter-spacing:.09em;
  color:oklch(1 0 0 / 0.72);
}
.pill.solid{background:#fff;color:var(--foreground);border-color:transparent;}
.pill i{
  width:.375rem;height:.375rem;border-radius:9999px;
  background:currentColor;flex-shrink:0;
}

/* industry tabs (replace the old meta pills): pick which recording to hear */
.call-tabs{display:flex;flex-wrap:wrap;gap:.5rem;padding-bottom:1.5rem;}
.call-tab{
  display:inline-flex;align-items:center;cursor:pointer;
  padding:.375rem .8125rem;border-radius:9999px;
  border:1px solid oklch(1 0 0 / 0.2);background:transparent;font-family:inherit;
  font-size:.625rem;font-weight:600;text-transform:uppercase;letter-spacing:.09em;
  color:oklch(1 0 0 / 0.72);
  transition:background .2s,color .2s,border-color .2s;
}
.call-tab:hover{color:#fff;border-color:oklch(1 0 0 / 0.4);}
.call-tab.active{background:#fff;color:var(--foreground);border-color:transparent;}

.deck{display:flex;flex-direction:column;}
.wave-row{display:flex;align-items:center;gap:clamp(1rem,2vw,1.5rem);}
.play{
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
  width:clamp(3.25rem,5vw,4rem);height:clamp(3.25rem,5vw,4rem);
  border:0;border-radius:9999px;cursor:pointer;
  background:#fff;color:var(--foreground);
  transition:transform .2s,opacity .2s;
}
.play:hover{transform:scale(1.05);}
.play:active{transform:scale(.98);}
.play svg{width:1.125rem;height:1.125rem;}
.play .ico-pause{display:none;}
.call.playing .play .ico-play{display:none;}
.call.playing .play .ico-pause{display:block;}

.wave{
  position:relative;flex:1;
  display:flex;align-items:center;gap:2px;
  height:clamp(3rem,6vh,4.25rem);cursor:pointer;
}
.wb{
  flex:1;min-width:1px;border-radius:9999px;
  background:oklch(1 0 0 / 0.22);
  transition:background .12s linear,transform .25s;
}
.wb.past{background:oklch(1 0 0 / 0.85);}
.wb.now{background:#fff;}
.call.playing .wb.now{animation:wbPulse .5s ease-in-out infinite;}
@keyframes wbPulse{0%,100%{transform:scaleY(1)}50%{transform:scaleY(1.35)}}

.times{
  display:flex;align-items:center;justify-content:space-between;
  padding-top:1rem;
  font-size:.6875rem;font-variant-numeric:tabular-nums;
  color:oklch(1 0 0 / 0.48);letter-spacing:.04em;
}
.times b{color:#fff;font-weight:600;}

.outcome{
  margin-top:auto;padding-top:clamp(1.5rem,3vh,2rem);
  display:flex;flex-wrap:wrap;gap:.5rem 1.75rem;
  border-top:1px solid oklch(1 0 0 / 0.16);
}
.oc{display:block;}
.oc-v{
  display:block;font-size:clamp(1.125rem,1.8vw,1.4375rem);
  font-weight:600;letter-spacing:-.025em;color:#fff;
}
.oc-l{
  display:block;margin-top:.1875rem;
  font-size:.625rem;font-weight:500;
  text-transform:uppercase;letter-spacing:.1em;
  color:oklch(1 0 0 / 0.5);
}

/* --- transcript (one .script block per industry, only the active one shows) --- */
.script{
  display:none;flex-direction:column;gap:.5rem;
  max-height:clamp(15rem,32vh,20rem);
  overflow-y:auto;scrollbar-width:none;
  padding-right:.25rem;
}
.script.show{display:flex;}
.script::-webkit-scrollbar{display:none;}
.ln-row{
  display:flex;gap:.75rem;
  padding:.625rem .875rem;border-radius:var(--r-2xl);
  opacity:.42;transition:opacity .35s,background .35s;
}
.ln-row.on{opacity:1;background:oklch(1 0 0 / 0.08);}
.ln-who{
  flex-shrink:0;width:4.25rem;
  font-size:.625rem;font-weight:600;
  text-transform:uppercase;letter-spacing:.08em;
  color:oklch(1 0 0 / 0.5);padding-top:.125rem;
}
.ln-row.ai .ln-who{color:#fff;}
.ln-txt{font-size:.8125rem;line-height:1.5;color:oklch(1 0 0 / 0.82);}
.script-cap{
  margin:0 0 .875rem;
  font-size:.625rem;font-weight:600;
  text-transform:uppercase;letter-spacing:.12em;
  color:oklch(1 0 0 / 0.45);
}

@media (prefers-reduced-motion:reduce){
  .call.playing .wb.now{animation:none;}
}
@media (max-width:940px){
  .call-top{grid-template-columns:1fr;align-items:start;gap:1.5rem;}
  .player{grid-template-columns:1fr;gap:1.75rem;}
  .outcome{padding-top:1.5rem;}
}
@media (max-width:560px){
  .wb:nth-child(2n){display:none;}
  .ln-who{width:3.5rem;}
}