/* numeros — comida de verdade, em números (agente 4) */
.nu-topo{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);column-gap:clamp(24px,5vw,80px);align-items:end}
.nu-topo .wf-cab,.nu-topo .wf-titulo{grid-column:1}
.nu-intro{grid-column:2;grid-row:2;margin:0 0 clamp(18px,2.4vh,28px)}

/* abas */
.nu-abas{display:flex;flex-wrap:wrap;gap:10px;margin:clamp(28px,5vh,56px) 0 clamp(40px,7vh,88px)}
.nu-aba{font:500 1rem/1 var(--sans);letter-spacing:.01em;min-height:48px;padding:0 1.35em;border-radius:999px;cursor:pointer;
  color:rgb(var(--tinta-rgb));background:transparent;border:1px solid rgb(var(--tinta-rgb) / .3);
  transition:background .4s var(--ease),color .4s var(--ease),border-color .4s}
.nu-aba:hover{border-color:rgb(var(--tinta-rgb) / .7)}
.nu-aba[aria-selected="true"]{background:rgb(var(--tinta-rgb));color:var(--c0);border-color:transparent}
.nu-aba:focus-visible{outline:2px solid rgb(var(--tinta-rgb));outline-offset:3px}

.nu-painel{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:clamp(32px,6vw,104px);align-items:start}
.js .nu-painel:not(.nu-ativo){display:none}

/* o número grande (momento de impacto) */
.nu-fig{padding-top:4px}
.nu-grande{margin:0;font-family:var(--serifa);font-size:clamp(6rem, 1rem + 12vw, 13.5rem);line-height:.82;letter-spacing:-.045em;
  display:flex;align-items:baseline;gap:.08em;white-space:nowrap}
.nu-u{font-family:var(--sans);font-weight:300;font-size:.26em;letter-spacing:0}
.nu-de{margin:1.1em 0 0;max-width:20em;color:rgb(var(--suave-rgb))}
.nu-de b{display:block;font:400 clamp(1.6rem,1.1rem + 1.2vw,2.3rem)/1.1 var(--serifa);color:rgb(var(--tinta-rgb));margin:.15em 0 .1em;letter-spacing:-.01em}
.nu-nota{margin:clamp(32px,5vh,52px) 0 0;max-width:24em;padding-left:22px;border-left:1px solid rgb(var(--tinta-rgb) / .25)}
.nu-nota p{margin:0;font-family:var(--serifa);font-size:1.32rem;line-height:1.32}
.nu-nota cite{display:block;margin-top:.8em;font:500 var(--t-rot)/1.4 var(--sans);letter-spacing:.16em;text-transform:uppercase;font-style:normal;color:rgb(var(--suave-rgb))}

/* a régua: o fio do dia vira barra fina */
.nu-lista{list-style:none;margin:0;padding:0}
.nu-item{all:unset;box-sizing:border-box;cursor:pointer;width:100%;display:grid;grid-template-columns:minmax(0,11.5em) minmax(0,1fr);
  align-items:center;column-gap:24px;min-height:64px;padding:8px 10px;margin-inline:-10px;width:calc(100% + 20px);border-radius:6px;
  transition:background .3s}
.nu-item:hover{background:rgb(var(--tinta-rgb) / .035)}
.nu-nome{font-size:var(--t-corpo);line-height:1.2}
.nu-nome small{display:block;font-size:.9rem;color:rgb(var(--suave-rgb));margin-top:2px}
.nu-regua{--w:calc(100% - 6.6rem);position:relative;height:28px}
.nu-regua::before{content:"";position:absolute;left:0;width:var(--w);top:13px;height:1px;opacity:.4;
  background:repeating-linear-gradient(90deg, rgb(var(--tinta-rgb)) 0 5px, transparent 5px 9px);
  -webkit-mask:linear-gradient(90deg,#000 calc(var(--p) * 100%),transparent 0 calc(var(--p) * 100% + 6.2rem),#000 0);
          mask:linear-gradient(90deg,#000 calc(var(--p) * 100%),transparent 0 calc(var(--p) * 100% + 6.2rem),#000 0)}
.nu-regua i{position:absolute;left:0;top:12px;height:3px;border-radius:2px;width:calc(var(--w) * var(--p));background:rgb(var(--tinta-rgb) / .42);
  transition:width 1.2s var(--ease) calc(var(--i) * 110ms), background .35s}
.nu-regua i::after{content:"";position:absolute;right:-5px;top:-3px;width:9px;height:9px;border-radius:50%;background:inherit;
  box-shadow:0 0 0 2px var(--c0)}
.nu-doce .nu-regua i::after{box-shadow:0 0 0 2px var(--c0),0 0 0 3px var(--acento)}
.nu-valor{position:absolute;top:50%;translate:0 -50%;left:calc(var(--w) * var(--p) + 16px);white-space:nowrap;
  font-family:var(--serifa);font-size:1.25rem;letter-spacing:-.01em;
  transition:left 1.2s var(--ease) calc(var(--i) * 110ms), opacity .6s var(--ease) calc(var(--i) * 110ms + .5s)}
.nu-item[aria-pressed="true"] .nu-regua i{background:rgb(var(--tinta-rgb))}
.nu-item[aria-pressed="true"] .nu-nome{font-weight:500}
.nu-doce .nu-regua i::after{background:var(--acento)}
.nu-item:focus-visible{outline:2px solid currentColor;outline-offset:2px}

.js .nu-painel:not(.nu-visto) .nu-regua i{width:0}
.js .nu-painel:not(.nu-visto) .nu-valor{left:16px;opacity:0}

/* origem (ômega-3 e ferro: a frase dela explica a diferença) */
.nu-orig{font-style:normal;display:inline-flex;align-items:center;gap:6px;margin-left:.7em;letter-spacing:.02em}
.nu-orig::before{content:"";width:6px;height:6px;border-radius:50%;border:1px solid currentColor}
.nu-orig-a::before{background:currentColor}
.nu-pos{margin:0 0 1.4em;display:flex;align-items:center;gap:.5em}
.nu-pos-n{font-family:var(--serifa);font-size:1.25rem;letter-spacing:0;text-transform:none;color:rgb(var(--tinta-rgb))}
.nu-fig .nu-grande,.nu-fig .nu-de{transition:opacity .45s var(--ease), translate .6s var(--ease)}
.nu-fig.nu-troca .nu-grande,.nu-fig.nu-troca .nu-de{opacity:0;translate:0 8px}

/* fecho */
.nu-fecho{margin:clamp(88px,14vh,160px) auto 0;max-width:820px;text-align:center}
.nu-fecho .wf-voz p{margin:0}
.nu-zap{margin-top:clamp(20px,3vh,32px)}

@media (min-width:900px) and (max-width:1180px){
  .nu-painel{grid-template-columns:minmax(0,4fr) minmax(0,8fr);column-gap:40px}
  .nu-item{grid-template-columns:minmax(0,10em) minmax(0,1fr);column-gap:16px}
  .nu-grande{font-size:clamp(5.5rem, 1rem + 9vw, 8rem)}
}
@media (max-width:899px){
  .nu-topo,.nu-painel{grid-template-columns:minmax(0,1fr)}
  .nu-intro{grid-column:1;grid-row:auto}
  .nu-fig{position:static;margin-bottom:36px}
  .nu-grande{font-size:clamp(5.6rem, 2rem + 18vw, 9rem)}
  .nu-abas{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:44px}
  .nu-aba{padding:0 .4em;font-size:.95rem}
  .nu-item{grid-template-columns:minmax(0,1fr);row-gap:2px;padding-block:10px}
}
@media (prefers-reduced-motion:reduce){
  .nu-regua i,.nu-valor{transition:none}
  .js .nu-painel:not(.nu-visto) .nu-regua i{width:calc(var(--w) * var(--p))}
  .js .nu-painel:not(.nu-visto) .nu-valor{left:calc(var(--w) * var(--p) + 16px);opacity:1}
}