/* The four terms share one type size, baseline and transition. */
.negotiation-brief{position:relative;isolation:isolate;padding-top:70px;padding-bottom:100px;overflow-x:clip}
.negotiation-brief h1,.negotiation-brief h2{margin:0;font:clamp(30px,3vw,43px)/1.2 var(--serif);letter-spacing:-.025em}
.negotiation-stage{position:relative;container-type:inline-size;height:365px;margin:30px 8% 0}
.negotiation-display{--term-size:min(17cqw,190px);--question-size:clamp(38px,8.8cqw,96px);position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .2s ease,visibility 0s linear .2s}
.negotiation-display[data-active='true']{opacity:1;visibility:visible;transition:opacity .2s ease,visibility 0s}
.negotiation-word{position:absolute;left:0;top:20px;font:var(--term-size)/1.15 var(--serif);letter-spacing:-.045em;white-space:nowrap}
.negotiation-question{position:absolute;left:22%;top:calc(var(--term-size) * 1.08 + 22px);font:var(--question-size)/1.15 Caveat,cursive;color:var(--ink);background:linear-gradient(transparent 55%,var(--lime) 55% 87%,transparent 87%);transform:rotate(-7deg);transform-origin:0 50%;white-space:nowrap}
.terms-seen .negotiation-question{animation:terms-ink .7s cubic-bezier(.22,.61,.36,1) both}
@keyframes terms-ink{from{clip-path:inset(-35% 105% -35% -12%)}to{clip-path:inset(-35% -15% -35% -12%)}}
.negotiation-response{max-width:820px;margin:12px 5% 0 16%}
.negotiation-topics{display:flex;flex-wrap:wrap;gap:8px 25px;align-items:center}
.negotiation-topics button{position:relative;background:none;border:0;min-height:44px;padding:5px 0 12px;color:var(--muted);font:22px/1.3 var(--serif);letter-spacing:-.02em;white-space:nowrap}
.negotiation-topics button:hover,.negotiation-topics button[aria-pressed='true']{color:var(--ink)}
.negotiation-topics button:after{content:'';position:absolute;left:-2px;right:-2px;bottom:4px;height:4px;border-bottom:3px solid var(--lime);border-radius:50%;transform:rotate(-2deg);opacity:0;transition:opacity .2s}
.negotiation-topics button[aria-pressed='true']:after{opacity:1}
.negotiation-topics button:focus-visible{outline:0;color:var(--ink)}
.negotiation-topics button:focus-visible:after{opacity:1;border-width:4px}
.negotiation-details{display:grid;font:26px/1.5 var(--serif);letter-spacing:-.01em;margin-top:24px}
.negotiation-details>p{margin:0;grid-area:1/1;opacity:0;visibility:hidden;transition:opacity .2s ease,visibility 0s linear .2s}
.negotiation-details>p[aria-hidden='false']{opacity:1;visibility:visible;transition:opacity .2s ease,visibility 0s}
@media(max-width:1050px){
 .negotiation-brief h1,.negotiation-brief h2{font-size:36px}
 .negotiation-stage{height:300px;margin-inline:5%}
 .negotiation-response{margin-left:10%;margin-right:0}.negotiation-details{font-size:25px}
 .negotiation-topics{max-width:700px;gap:7px 24px}
}
@media(max-width:700px){
 .negotiation-brief{padding-top:55px;padding-bottom:70px}.negotiation-brief h1,.negotiation-brief h2{font-size:30px;max-width:340px}
 .negotiation-stage{height:190px;margin:25px 0 0}
 .negotiation-question{left:20%}
 .negotiation-response{margin:12px 0 0}
 .negotiation-topics{display:grid;grid-template-columns:max-content max-content;justify-content:start;gap:4px 22px;max-width:none}
 .negotiation-topics button{font-size:18px;width:fit-content}
 .negotiation-details{font-size:23px;line-height:1.45;margin-top:22px}
}
@media(max-width:360px){.negotiation-brief h1,.negotiation-brief h2{font-size:27px}.negotiation-details{font-size:21px}.negotiation-topics{gap:4px 17px}.negotiation-topics button{font-size:16px}}
@media(prefers-reduced-motion:reduce){.negotiation-display,.negotiation-details>p{transition:none!important}.negotiation-question{animation:none!important}}
@media(hover:none){.negotiation-topics button:hover:not([aria-pressed='true']):not(:focus-visible){color:var(--muted)}}
