/* Problems and their corresponding solutions. */
.audiences.diagnosis{display:block;margin-top:88px;padding:0;background:transparent;color:var(--ink)}
.diagnosis .audience-heading{display:grid;grid-template-columns:1.3fr 1fr;gap:48px;align-items:end;margin-bottom:32px}
.diagnosis .audience-heading h3{font-size:clamp(32px,3.8vw,54px);letter-spacing:-.035em;line-height:1.08;max-width:700px;margin:0}
.diagnosis .audience-heading p{margin:0;max-width:350px;justify-self:end;font-size:16px}
.diagnosis .audience-rows{border:1px solid var(--ink)}
.diagnosis .audience-rows article{display:grid;grid-template-columns:1fr 1fr;gap:0;padding:0;border:0}
.diagnosis .audience-rows article+article{border-top:1px solid #55564e}
.diagnosis-problem{display:flex;align-items:center;gap:24px;background:var(--ink);color:var(--paper);padding:32px;min-width:0}
.diagnosis-index{display:flex;align-items:center;gap:10px;font-size:13px;font-variant-numeric:tabular-nums;color:#ffac79;flex-shrink:0}
.diagnosis-index:before{content:"";width:7px;height:7px;background:#ffac79}
.diagnosis .audience-rows h4{font-size:clamp(20px,2vw,27px);line-height:1.2;letter-spacing:-.02em;margin:0;max-width:330px}
.diagnosis-solution{display:flex;align-items:center;gap:24px;background:var(--paper-alt);padding:32px;transition:background .3s}
.diagnosis-arrow{display:grid;place-items:center;width:42px;height:42px;flex-shrink:0;background:var(--accent);color:var(--ink);transition:transform .35s cubic-bezier(.16,1,.3,1)}
.diagnosis-arrow svg{width:24px;height:24px}
.diagnosis .audience-rows p{font-size:16px;line-height:1.55;margin:0;max-width:390px}
@media(hover:hover) and (pointer:fine){.diagnosis article:hover .diagnosis-solution{background:var(--paper)}.diagnosis article:hover .diagnosis-arrow{transform:translateX(5px)}}
@media(max-width:900px){.diagnosis-problem,.diagnosis-solution{padding:24px;gap:18px}.diagnosis .audience-heading{gap:28px}}
@media(max-width:700px){.audiences.diagnosis{margin-top:56px}.diagnosis .audience-heading{grid-template-columns:1fr;gap:18px;margin-bottom:24px}.diagnosis .audience-heading p{justify-self:start;max-width:none}.diagnosis .audience-rows{border:0}.diagnosis .audience-rows article{grid-template-columns:1fr;border:1px solid var(--ink)}.diagnosis .audience-rows article+article{margin-top:16px;border-top:1px solid var(--ink)}.diagnosis-problem,.diagnosis-solution{padding:24px;gap:18px}.diagnosis .audience-rows h4{max-width:none;font-size:23px}.diagnosis-arrow{width:36px;height:36px}.diagnosis-arrow svg{transform:rotate(90deg)}.diagnosis .audience-rows p{font-size:15px}}
@media(prefers-reduced-motion:reduce){.diagnosis-arrow,.diagnosis-solution{transition:none}.diagnosis article:hover .diagnosis-arrow{transform:none}}