/* ---------- 8. PARA QUEM É / NÃO É ---------- */
.pq { position: relative; padding-top: var(--s-9); }
.pq .sec-head { margin-bottom: var(--s-8); }
.aud-lead { margin: var(--s-6) auto 0; max-width: 38rem; font-size: var(--t-lg); color: var(--ink-2); text-wrap: pretty; }
.aud-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(2rem, 6vw, 6rem); }
.aud-card { position: relative; display: grid; gap: var(--s-4); align-content: start; padding-top: var(--s-6); border-top: 1px solid var(--line-strong); }
.aud-card::before { content: ""; position: absolute; left: 0; top: -1px; width: 3.5rem; height: 2px; background: var(--accent); transition: width .8s var(--ease-out); }
@media (hover: hover) { .aud-card:hover::before { width: 100%; } }
.aud-img { margin: 0 0 var(--s-3); border-radius: 1rem; overflow: hidden; border: 1px solid var(--line); }
.aud-img img { width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; }
.ic-body { fill: var(--bg-raised); stroke: var(--line-strong); stroke-width: 2; }
.ic-line, .ic-line2 { fill: var(--line-strong); stroke: none; } .ic-line2 { fill: none; stroke: var(--line-strong); stroke-width: 2; }
.ic-cover { fill: var(--accent-soft); stroke: none; }
.ic-acc { stroke: var(--accent); stroke-width: 3; fill: none; }
.ic-acc-f { fill: var(--accent-soft); stroke: var(--accent); stroke-width: 2.5; }
.ic-tray { stroke: var(--ink-3); stroke-width: 3; fill: none; }
.ic-lid { fill: var(--bg-raised); stroke: var(--accent); stroke-width: 2.5; }
.aud-card h3 { font-family: var(--font-display); font-weight: var(--display-weight); letter-spacing: var(--display-tracking); font-size: var(--t-h3); line-height: 1.1; text-wrap: balance; }
.aud-card .examples { color: var(--ink-3); font-size: var(--t-sm); }
.aud-card p { color: var(--ink-2); text-wrap: pretty; max-width: 34rem; }
.aud-card p b { color: var(--ink); }
.aud-card .solves { padding-top: var(--s-2); }
.aud-card .solves b { color: var(--accent); }

.not { padding-top: var(--s-10); }
.not .mid { font-size: clamp(1.8rem, 1.2rem + 2.4vw, 3rem); text-align: center; margin-bottom: var(--s-8); }
.exclusions { display: grid; max-width: 46rem; margin-inline: auto; }
.exclusions li { display: grid; grid-template-columns: 3.4rem minmax(0, 1fr); gap: var(--s-4); align-items: baseline; padding: var(--s-5) 0; border-top: 1px solid var(--line); font-size: var(--t-lg); color: var(--ink-2); }
.exclusions li:last-child { border-bottom: 1px solid var(--line); }
.exclusions b { color: var(--ink); }
.dots3 { font-family: var(--font-display); font-size: 1.8rem; line-height: 1; color: var(--danger); letter-spacing: -.05em; }
.not-note { margin: var(--s-7) auto 0; max-width: 34rem; text-align: center; color: var(--ink-3); text-wrap: balance; }
.not-note b { color: var(--ink-2); }
@media (max-width: 56rem) { .aud-grid { grid-template-columns: 1fr; } }

/* ---------- 9. CASOS DE USO + COMPARATIVO ---------- */
.uses { position: relative; padding: var(--s-10) 0 var(--s-9); }
.uses .sec-head { margin-bottom: var(--s-8); }
.cases { display: grid; }
.case { display: grid; grid-template-columns: minmax(0, .7fr) minmax(0, 1.3fr); gap: clamp(1.5rem, 5vw, 5rem); padding: var(--s-7) 0; border-top: 1px solid var(--line); }
.case:last-child { border-bottom: 1px solid var(--line); }
.case-head { display: flex; align-items: baseline; gap: var(--s-4); flex-wrap: wrap; }
.case-n { font-size: .75rem; font-weight: 600; letter-spacing: .05em; color: var(--accent); }
.case h3 { font-family: var(--font-display); font-weight: var(--display-weight); letter-spacing: var(--display-tracking); font-size: var(--t-h3); line-height: 1.1; flex-basis: 100%; }
.case-body { display: grid; gap: var(--s-5); }
.case-body p { color: var(--ink-2); text-wrap: pretty; max-width: 40rem; }
.case-body b { color: var(--ink); } .case-body .g { color: var(--accent); }
.flow { display: flex; flex-wrap: wrap; gap: .5rem 0; align-items: center; }
.flow li { --lit: 1; position: relative; display: flex; align-items: center; }
.flow li span { padding: .35rem .8rem; border-radius: 999px; font-size: var(--t-sm); font-weight: 560; border: 1px solid color-mix(in oklab, var(--line-strong) calc((1 - var(--lit)) * 100%), var(--accent) calc(var(--lit) * 100%));
  background: color-mix(in oklab, var(--bg-raised) calc((1 - var(--lit)) * 100%), var(--accent-soft) calc(var(--lit) * 100%)); color: color-mix(in oklab, var(--ink-3) calc((1 - var(--lit)) * 100%), var(--ink) calc(var(--lit) * 100%)); white-space: nowrap; }
.flow li:not(:last-child)::after { content: ""; width: 1.4rem; height: 2px; margin: 0 .15rem; background: linear-gradient(var(--accent), var(--accent)) 0 0 / calc(var(--lit) * 100%) 100% no-repeat, var(--line-strong); border-radius: 2px; }
.cmp { padding-top: var(--s-10); }
.cmp .mid { font-size: clamp(1.8rem, 1.2rem + 2.4vw, 3rem); text-align: center; margin-bottom: var(--s-8); }
.cmp-head, .cmp-row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-6); max-width: 52rem; margin-inline: auto; }
.cmp-head { font-size: var(--t-sm); font-weight: 600; color: var(--ink-3); padding-bottom: var(--s-3); }
.cmp-head span:last-child { color: var(--accent); }
.cmp-list { display: grid; }
.cmp-row { padding: var(--s-5) 0; border-top: 1px solid var(--line); align-items: center; width: 100%; }
.cmp-list li:last-child { border-bottom: 1px solid var(--line); }
.cmp-no { color: color-mix(in oklab, var(--danger) 70%, var(--ink-2)); font-size: var(--t-lg); }
.cmp-yes { display: flex; align-items: center; gap: .7rem; font-size: var(--t-lg); color: var(--ink); font-weight: 560; }
.cmp-yes svg { flex: none; width: 1.5rem; height: 1.5rem; padding: .3rem; border-radius: 50%; background: var(--accent); color: var(--accent-ink); }
.cmp-yes b, .cmp-no b { font-weight: inherit; }
.cmp-no b { color: inherit; }
@media (max-width: 56rem) { .case { grid-template-columns: 1fr; gap: var(--s-4); } .cmp-head, .cmp-row { gap: var(--s-4); } .cmp-no, .cmp-yes { font-size: var(--t-base); } }