/* fa · A família junto */
.fa { --m1: var(--manteiga); --m2: var(--rosa-nevoa); --m3: var(--lilas-nevoa); --m4: var(--pessego); }
.fa-grade { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); gap: clamp(40px, 6vw, 110px); align-items: start; }
.fa-figura { position: relative; }
.fa-arco { position: relative; aspect-ratio: 4 / 5; border-radius: 999px 999px 32px 32px; overflow: hidden;
  background: radial-gradient(120% 90% at 50% 20%, color-mix(in oklab, var(--manteiga) 80%, var(--papel)), color-mix(in oklab, var(--pessego) 70%, var(--manteiga))); }
.fa-arco img { position: absolute; left: 50%; bottom: 0; width: 118%; height: auto; transform: translateX(-50%); }
.fa-mae { position: relative; width: min(330px, 80%); margin: -90px -10px 0 auto; z-index: 2; }

.fa-p3 { margin: clamp(26px, 3vw, 40px) 0 clamp(22px, 2.6vw, 32px); padding-left: 22px; border-left: 3px solid var(--lilas); }
.fa-perto { position: relative; white-space: nowrap; }
.fa .giz.fa-sub { left: 0; bottom: -10px; width: 100%; height: 16px; }
.fa-sub path { stroke: var(--framboesa); stroke-width: 4; }
.fa-p3 p { margin: 0; font-size: clamp(1.6rem, 1rem + 1.7vw, 2.6rem); line-height: 1.22; color: var(--framboesa-escura); }
.fa-p3 footer { margin-top: 10px; font-size: var(--t-mini); color: var(--tinta-2); }
.fa-texto .wf-texto { margin: 0; }

.fa-lista { list-style: none; margin: clamp(28px, 3vw, 40px) 0 0; padding: 0; display: grid; gap: clamp(22px, 2.4vw, 30px); }
.fa-item { display: grid; grid-template-columns: 52px minmax(0, 1fr); gap: 18px; align-items: start; }
.fa .giz.fa-caixa { position: relative; width: 48px; height: 48px; }
.fa-caixa path { stroke: var(--framboesa); stroke-width: 4.5; }
.fa-caixa path:first-child { stroke: var(--lilas); stroke-width: 3.5; }
.fa-nome { margin: 4px 0 6px; font-family: var(--f-titulo); font-weight: 650; font-size: clamp(1.2rem, 1rem + .6vw, 1.55rem); line-height: 1.15; color: var(--tinta); }
.fa-item p { margin: 0; font-size: var(--t-corpo); line-height: 1.55; color: var(--tinta-2); }

.fa-aviso { margin: clamp(28px, 3vw, 40px) 0 0; padding: 14px 0 0 70px; border-top: 2px dashed color-mix(in oklab, var(--lilas) 45%, transparent); font-size: var(--t-mini); line-height: 1.5; color: var(--tinta); }
.fa-conversa { display: grid; grid-template-columns: 1.2fr 1fr; gap: 22px; margin-top: 40px; align-items: end; }
.fa-b2 { background:
    linear-gradient(90deg, transparent 30px, oklch(80% .07 10 / .45) 30px 31.5px, transparent 31.5px),
    repeating-linear-gradient(180deg, transparent 0 27px, oklch(78% .05 290 / .5) 27px 28px),
    color-mix(in oklab, var(--lilas-nevoa) 70%, var(--papel)); background-position: 0 0, 0 10px, 0 0; margin-bottom: -18px; }

@media (max-width: 900px) {
  .fa-grade { grid-template-columns: 1fr; }
  .fa-figura { width: min(100%, 440px); margin: 0 auto; }
  .fa-mae { width: min(290px, 82%); margin: -40px -4px 0 auto; }
  .fa-aviso { padding-left: 0; }
  .fa-conversa { grid-template-columns: 1fr; }
  .fa-b2 { margin: 0 0 0 auto; max-width: 300px; }
}
/* rodada 2 */
.fa-caixa path:first-child { display: none; }
.fa .giz.fa-caixa { width: 52px; height: 52px; margin-top: -6px; }
.fa-caixa path { stroke-width: 6; }
.fa-conversa { grid-template-columns: 1fr; gap: 0; }
.fa-b1 { width: 78%; }
.fa-b2 { width: 60%; justify-self: end; margin: -26px 0 0; z-index: 2; }
@media (max-width: 900px) {
  .fa-grade { display: flex; flex-direction: column; gap: 0; }
  .fa-figura { display: contents; }
  .fa-arco { order: 1; width: min(100%, 420px); align-self: center; }
  .fa-mae { order: 2; align-self: flex-end; margin: -50px -4px 0 auto; }
  .fa-texto { order: 3; margin-top: 56px; }
  .fa-conversa { order: 4; margin-top: 48px; }
  .fa-b1 { width: 92%; }
  .fa-b2 { width: 80%; margin: -14px 0 0 auto; max-width: none; }
}
.fa-b2 { margin-top: 6px; }
@media (max-width: 900px) { .fa-b2 { margin-top: 18px; } }