/* RE.CREATE v7 — ajustes do PDF de outubro/2026.
   Usa os tokens de styles.css (--accent, --display, --line-d, espaçamentos 8/12/16/24/32/48). */

/* ---------- Trilha sonora: botão flutuante, acima do Instagram e do WhatsApp ---------- */
.fab--music { cursor: pointer; }
.fab--music .ic--pause { display: none; }
.fab--music.is-playing .ic--play { display: none; }
.fab--music.is-playing .ic--pause { display: block; }
.fab--music.is-playing { border-color: rgba(255, 255, 255, .45); }
.fab--music.is-waiting { border-color: var(--accent); }
.fab--music.is-hint { animation: musicBlink .8s ease-in-out 3; }
@keyframes musicBlink { 0%, 100% { color: #fff; border-color: rgba(255,255,255,.22); box-shadow: none; } 45% { color: var(--accent); border-color: var(--accent); box-shadow: 0 0 0 7px rgba(255,106,43,.28), 0 0 22px rgba(255,106,43,.6); } }
@keyframes musicHint { 0% { box-shadow: 0 0 0 0 rgba(255, 106, 43, .5); } 70%, 100% { box-shadow: 0 0 0 10px rgba(255, 106, 43, 0); } }
@media (prefers-reduced-motion: reduce) { .fab--music.is-hint { animation: none; color: var(--accent); border-color: var(--accent); } }

/* ---------- Faixa de logos (home) ---------- */
.client--logo { height: 88px; padding-inline: clamp(20px, 2.6vw, 40px); }
.client--logo img { width: auto; height: auto; max-height: 54px; max-width: 170px; filter: none; opacity: .82; }
.client--logo:hover img { opacity: 1; }
.marquee__track { animation-duration: var(--dur, 120s); }
@media (prefers-reduced-motion: reduce) {
  .marquee { overflow-x: auto; mask-image: none; -webkit-mask-image: none; }
  .marquee__track { animation: none; }
  .marquee__track > li[aria-hidden="true"] { display: none; }
}

/* ---------- Sobre: 4 faixas de logos deslizando para o lado ---------- */
.lcol { padding-block: clamp(56px, 7vw, 96px); border-top: 1px solid var(--line-d); background: radial-gradient(60% 90% at 100% 0%, rgba(255, 106, 43, .08), transparent 60%); display: grid; gap: clamp(32px, 4vw, 56px); }
.lcol__head { display: grid; gap: var(--s3); justify-items: start; }
.lcol__head .h2 { max-width: 24ch; }
.lrows { display: grid; gap: var(--s2); overflow: hidden; mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.lrow { display: flex; width: max-content; animation: lrowL var(--dur, 120s) linear infinite; }
.lrow--rev { animation-name: lrowR; }
.lrows:hover .lrow, .lrows:focus-within .lrow, .lrows:focus .lrow { animation-play-state: paused; }
.lrow__item { flex: none; width: clamp(150px, 15vw, 210px); height: 96px; margin-right: var(--s2); display: grid; place-items: center; padding: 0 var(--s4); border: 1px solid rgba(255, 255, 255, .08); border-radius: var(--r-m); background: linear-gradient(180deg, #121212, #0a0a0a); transition: border-color .3s, background .3s; }
.lrow__item img { width: auto; height: auto; max-height: 48px; max-width: 100%; object-fit: contain; opacity: .8; transition: opacity .25s, transform .35s var(--ease); }
.lrow__item:hover { border-color: rgba(255, 106, 43, .45); }
.lrow__item:hover img { opacity: 1; transform: scale(1.06); }
@keyframes lrowL { to { transform: translateX(-50%); } }
@keyframes lrowR { from { transform: translateX(-50%); } to { transform: translateX(0); } }
@media (max-width: 640px) { .lrow__item { width: 140px; height: 80px; padding: 0 var(--s3); } .lrow__item img { max-height: 40px; } }
@media (prefers-reduced-motion: reduce) {
  .lrows { overflow-x: auto; mask-image: none; -webkit-mask-image: none; }
  .lrow { animation: none; }
  .lrow__item[aria-hidden="true"] { display: none; }
}

/* ---------- Home: portfólio em mosaico ---------- */
.pfm { padding-block: clamp(64px, 8vw, 112px); border-top: 1px solid var(--line-d); }
.pfm__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: clamp(150px, 17vw, 236px); gap: var(--s2); }
.pfm__t { position: relative; border-radius: var(--r-m); overflow: hidden; background: #111; border: 1px solid var(--line-d); }
.pfm__t a { position: absolute; inset: 0; display: block; text-decoration: none; }
.pfm__t img { width: 100%; height: 100%; object-fit: cover; transition: transform .9s var(--ease), filter .5s; filter: saturate(.92) brightness(.94); }
.pfm__img--hover { position: absolute; inset: 0; opacity: 0; transition: opacity .55s var(--ease), transform .9s var(--ease); }
.pfm__t::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 52%, rgba(0, 0, 0, .78)); pointer-events: none; transition: opacity .4s; }
.pfm__cap { position: absolute; z-index: 1; left: var(--s3); right: var(--s3); bottom: var(--s3); display: grid; gap: 2px; }
.pfm__cap b { font-family: var(--display); font-variation-settings: "wdth" 112; font-weight: 600; font-size: clamp(.95rem, 1.3vw, 1.15rem); letter-spacing: -.01em; line-height: 1.15; }
.pfm__cap small { font-size: .72rem; letter-spacing: .12em; text-transform: uppercase; color: #d0d0d0; }
.pfm__t a:focus-visible { outline-offset: -4px; }
.pfm__t--1 { grid-column: 1 / span 2; grid-row: 1 / span 2; }
.pfm__t--2 { grid-column: 3; grid-row: 1; }
.pfm__t--3 { grid-column: 4; grid-row: 1 / span 2; }
.pfm__t--4 { grid-column: 3; grid-row: 2; }
.pfm__t--5 { grid-column: 1; grid-row: 3; }
.pfm__t--6 { grid-column: 2; grid-row: 3; }
.pfm__t--7 { grid-column: 3 / span 2; grid-row: 3; }
.pfm__t--1 .pfm__cap b { font-size: clamp(1.15rem, 1.9vw, 1.6rem); }
@media (hover: hover) {
  .pfm__t:hover img { transform: scale(1.05); filter: none; }
  .pfm__t:hover { border-color: rgba(255, 106, 43, .55); }
  .pfm__t:hover .pfm__img--hover, .pfm__t:focus-within .pfm__img--hover { opacity: 1; }
}
@media (max-width: 760px) {
  .pfm__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 150px; }
  .pfm__t--1 { grid-column: 1 / span 2; grid-row: auto / span 2; }
  .pfm__t--2, .pfm__t--4, .pfm__t--5, .pfm__t--6 { grid-column: auto; grid-row: auto; }
  .pfm__t--3 { grid-column: auto; grid-row: auto / span 2; }
  .pfm__t--7 { grid-column: 1 / span 2; grid-row: auto; }
}
@media (prefers-reduced-motion: reduce) { .pfm__t img { transition: none; } .pfm__img--hover { transition: opacity .2s; } }

/* ---------- Home: como funciona em linha do tempo ---------- */
.hw5__l { --pct: 0%; position: relative; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--s3); counter-reset: hw; }
.hw5__l::before, .hw5__l::after { content: ""; position: absolute; left: 10%; right: 10%; top: 21px; height: 1px; }
.hw5__l::before { background: rgba(255, 255, 255, .16); }
.hw5__l::after { background: var(--accent); transform-origin: left; transform: scaleX(0); transition: transform 1.6s var(--ease) .2s; box-shadow: 0 0 10px rgba(255, 106, 43, .6); }
.hw5__l.is-in::after { transform: scaleX(1); }
.hw5__l li { position: relative; display: grid; gap: 8px; justify-items: center; text-align: center; padding-inline: var(--s1); align-content: start; }
.hw5__n { position: relative; z-index: 1; width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: #0b0b0b; border: 1px solid rgba(255, 106, 43, .55); color: var(--accent); font-family: var(--display); font-weight: 600; font-size: .78rem; letter-spacing: .08em; transition: background .4s, color .4s, box-shadow .4s; }
.hw5__l.is-in .hw5__n { background: var(--accent); color: #000; box-shadow: 0 0 0 6px rgba(255, 106, 43, .14); transition-delay: calc(var(--i) * 260ms + 200ms); }
.hw5__l b { margin-top: var(--s1); font-family: var(--display); font-variation-settings: "wdth" 112; font-weight: 600; font-size: 1.05rem; line-height: 1.2; letter-spacing: -.01em; max-width: 16ch; }
.hw5__l li > span:last-child { color: #a9a9a9; font-size: .88rem; line-height: 1.5; max-width: 22ch; }
@media (max-width: 860px) {
  .hw5__l { grid-template-columns: 1fr; gap: var(--s4); }
  .hw5__l::before, .hw5__l::after { left: 21px; right: auto; top: 22px; bottom: 22px; width: 1px; height: auto; }
  .hw5__l::after { transform-origin: top; transform: scaleY(0); }
  .hw5__l.is-in::after { transform: scaleY(1); }
  .hw5__l li { grid-template-columns: 44px 1fr; justify-items: start; text-align: left; column-gap: var(--s3); row-gap: 2px; align-items: center; }
  .hw5__n { grid-row: span 2; }
  .hw5__l b { margin-top: 0; max-width: none; }
  .hw5__l li > span:last-child { max-width: none; }
}
@media (prefers-reduced-motion: reduce) { .hw5__l::after, .hw5__n { transition: none; } .hw5__l::after { transform: none; } }

/* ---------- Loja: introdução ---------- */
.lintro { padding-block: clamp(48px, 6vw, 80px); border-bottom: 1px solid var(--line-d); background: radial-gradient(60% 100% at 0% 0%, rgba(255, 106, 43, .07), transparent 60%); }
.lintro__in { display: grid; gap: var(--s5); }
.lintro__head { display: grid; gap: var(--s2); max-width: 760px; }
.lintro__head .h2 { max-width: 20ch; }
.lintro__head .lead { color: #cfcfcf; }
.lintro__cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s3); }
.lintro__card { position: relative; display: grid; gap: var(--s1); align-content: start; padding: var(--s5); border-radius: var(--r-m); border: 1px solid var(--line-d); background: linear-gradient(180deg, #151515, #0b0b0b); text-decoration: none; transition: transform .35s var(--ease), border-color .3s, box-shadow .35s; }
.lintro__card--b { border-color: rgba(255, 106, 43, .4); background: linear-gradient(180deg, #1a120d, #0d0907); }
.lintro__card b { font-family: var(--display); font-variation-settings: "wdth" 118; font-weight: 600; font-size: clamp(1.4rem, 2.2vw, 1.9rem); letter-spacing: -.025em; line-height: 1.05; }
.lintro__card > span:not(.lintro__k):not(.lintro__go) { color: #bdbdbd; max-width: 46ch; }
.lintro__k { font-size: .72rem; letter-spacing: .16em; text-transform: uppercase; color: var(--accent); }
.lintro__go { display: inline-flex; align-items: center; gap: 8px; margin-top: var(--s2); font-weight: 500; }
.lintro__card:hover { transform: translateY(-3px); border-color: rgba(255, 106, 43, .6); box-shadow: 0 24px 60px -30px rgba(255, 106, 43, .35); }
.lintro__card:hover .ax { transform: translateX(3px); }
.lintro__steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s3); }
.lintro__steps li { display: grid; grid-template-columns: 32px 1fr; column-gap: var(--s2); row-gap: 2px; align-items: start; }
.lintro__n { grid-row: span 2; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; border: 1px solid rgba(255, 106, 43, .55); color: var(--accent); font-size: .8rem; font-weight: 600; }
.lintro__steps b { font-weight: 600; }
.lintro__steps li > span:last-child { color: #a9a9a9; font-size: .9rem; line-height: 1.5; }
@media (max-width: 760px) { .lintro__cols, .lintro__steps { grid-template-columns: 1fr; } .lintro__card { padding: var(--s4); } }
@media (prefers-reduced-motion: reduce) { .lintro__card { transition: none; } .lintro__card:hover { transform: none; } }

/* ---------- Agentes: escolha por necessidade em blocos lado a lado ---------- */
.need-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s2); margin-top: var(--s2); }
.need { position: relative; display: grid; gap: var(--s1); align-content: start; text-align: left; padding: var(--s3); min-height: 176px; border-radius: var(--r-m); border: 1px solid var(--line-d); background: linear-gradient(180deg, #151515, #0b0b0b); cursor: pointer; transition: transform .3s var(--ease), border-color .3s, box-shadow .35s, background .3s; }
.need::before { content: ""; position: absolute; inset: 0 0 auto; height: 1px; background: linear-gradient(90deg, transparent, var(--accent), transparent); opacity: 0; transition: opacity .35s; }
.need__ic { width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; border: 1px solid var(--line-d); color: var(--accent); background: rgba(255, 106, 43, .08); }
.need__ic svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.need b { font-family: var(--display); font-variation-settings: "wdth" 112; font-weight: 600; font-size: 1.02rem; line-height: 1.15; letter-spacing: -.01em; margin-top: var(--s1); }
.need__t { color: #a9a9a9; font-size: .84rem; line-height: 1.45; }
.need__n { margin-top: auto; padding-top: var(--s1); font-size: .72rem; letter-spacing: .12em; text-transform: uppercase; color: var(--mute-d); }
.need:hover { transform: translateY(-3px); border-color: rgba(255, 255, 255, .3); }
.need:hover::before, .need[aria-pressed="true"]::before { opacity: 1; }
.need[aria-pressed="true"] { border-color: var(--accent); background: linear-gradient(180deg, #1c130e, #0d0907); box-shadow: 0 18px 50px -28px rgba(255, 106, 43, .55); }
.need[aria-pressed="true"] .need__n { color: var(--accent); }
.need--all { grid-column: span 2; background: linear-gradient(180deg, #1b1b1b, #0e0e0e); }
@media (max-width: 960px) { .need-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .need { min-height: 0; padding: var(--s2) var(--s2); } .need__t { display: none; } }
@media (prefers-reduced-motion: reduce) { .need { transition: none; } .need:hover { transform: none; } }

/* ---------- Squad Re.Create ---------- */
.sq { position: relative; overflow: hidden; margin-block: 0 clamp(32px, 5vw, 64px); }
.sq__in { position: relative; display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: clamp(32px, 5vw, 72px); align-items: center; padding-block: clamp(40px, 6vw, 80px); padding-inline: clamp(24px, 4vw, 56px); border: 1px solid rgba(255, 106, 43, .38); border-radius: calc(var(--r-m) + 6px); background: radial-gradient(70% 120% at 0% 0%, rgba(255, 106, 43, .2), transparent 62%), radial-gradient(60% 100% at 100% 100%, rgba(169, 112, 255, .12), transparent 60%), #0a0a0a; box-shadow: 0 40px 100px -50px rgba(255, 106, 43, .5); overflow: hidden; }
.sq__main { display: grid; gap: var(--s3); justify-items: start; }
.sq__t { font-family: var(--display); font-variation-settings: "wdth" 125; font-weight: 700; font-size: clamp(2.6rem, 7vw, 5.6rem); line-height: .9; letter-spacing: -.05em; text-transform: uppercase; text-wrap: balance; }
.sq__p { color: #d6d6d6; font-size: clamp(1.02rem, 1.3vw, 1.2rem); max-width: 50ch; }
.sq__pts { display: flex; flex-wrap: wrap; gap: var(--s1) var(--s2); }
.sq__pts li { display: inline-flex; align-items: center; gap: 8px; height: 32px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--line-d); background: rgba(255, 255, 255, .04); font-size: .88rem; }
.sq__pts li::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 8px var(--accent); }
.sq__acts { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s2) var(--s3); margin-top: var(--s1); }
.sq__link { color: #d0d0d0; text-underline-offset: 4px; }
.sq__link:hover { color: #fff; }
.sq__note { color: var(--mute-d); font-size: .84rem; }
.sq__vis { display: grid; gap: var(--s2); mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); min-width: 0; overflow: hidden; }
.sq__row { display: flex; gap: var(--s1); width: max-content; animation: sqL var(--dur, 60s) linear infinite; }
.sq__row--rev { animation-name: sqR; }
.sq__row li { flex: none; height: 44px; display: inline-flex; align-items: center; padding: 0 var(--s3); border-radius: 12px; border: 1px solid var(--line-d); background: rgba(255, 255, 255, .05); font-family: var(--display); font-variation-settings: "wdth" 112; font-weight: 560; font-size: .92rem; letter-spacing: .02em; text-transform: uppercase; }
.sq__row li:nth-child(3n) { border-color: rgba(255, 106, 43, .5); color: #ffb08a; }
@keyframes sqL { to { transform: translateX(-50%); } }
@keyframes sqR { from { transform: translateX(-50%); } to { transform: translateX(0); } }
@media (max-width: 900px) { .sq__in { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) {
  .sq__row { animation: none; width: auto; flex-wrap: wrap; }
  .sq__row li[aria-hidden="true"] { display: none; }
  .sq__vis { mask-image: none; -webkit-mask-image: none; }
}

/* ---------- Serviços: categorias com o que inclui ao passar o mouse ---------- */
.sv-jump__row { border-bottom: 1px solid var(--hair, rgba(255, 255, 255, .14)); }
.sv-jump__row > a { border-bottom: 0 !important; }
.sv-jump__row.is-open > a { padding-left: 14px; background: rgba(255, 255, 255, .04); color: #fff; }
.sv-jump__inc { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .4s var(--ease); }
.sv-jump__inc > div { overflow: hidden; min-height: 0; }
.sv-jump__row.is-open .sv-jump__inc { grid-template-rows: 1fr; }
.sv-jump__list { display: grid; gap: var(--s1); padding: var(--s1) 4px var(--s3) calc(2rem + 18px); }
.sv-jump__lead { color: #a9a9a9; font-size: .88rem; max-width: 52ch; }
.sv-jump__chips { display: flex; flex-wrap: wrap; gap: 8px; }
.sv-jump__chips li { display: inline-flex; align-items: baseline; gap: 8px; padding: 6px 12px; border-radius: 999px; border: 1px solid var(--line-d); background: rgba(255, 255, 255, .04); font-size: .84rem; color: #e6e6e6; }
.sv-jump__chips small { color: var(--mute-d); font-size: .72rem; }
.sv-jump__row:not(.is-open) .sv-jump__list { visibility: hidden; }
@media (hover: none) { .sv-jump__inc { grid-template-rows: 1fr; } .sv-jump__row:not(.is-open) .sv-jump__list { visibility: visible; } }
@media (hover: none) { .client img, .client--logo img, .lrow__item img { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .sv-jump__inc { transition: none; } }

/* ---------- Serviços: categoria Direcionamento ---------- */
.sv-dir { padding: clamp(64px, 9vw, 120px) 0; border-top: 1px solid var(--line-d); background: radial-gradient(60% 100% at 100% 0%, rgba(138, 166, 255, .1), transparent 60%); }

/* ---------- Diagnóstico exclusivo: resultado completo ---------- */
.dq__note { margin-top: var(--s2); padding: var(--s2) var(--s3); border-left: 2px solid var(--c, var(--accent)); background: rgba(255, 255, 255, .04); border-radius: 0 12px 12px 0; color: #d6d6d6; font-size: .92rem; }
.dq__note a { color: #fff; text-underline-offset: 3px; }
.dq__tips { margin-top: var(--s4); padding: 18px 20px; border: 1px solid var(--line-d); border-radius: 16px; background: #171717; }
.dq__tips h4 { font-size: .7rem; letter-spacing: .14em; text-transform: uppercase; color: var(--mute-d); font-weight: 500; margin-bottom: var(--s2); }
.dq__tips ul { display: grid; gap: 10px; }
.dq__tips li { display: grid; grid-template-columns: 18px 1fr; gap: 10px; align-items: start; color: #e0e0e0; font-size: .94rem; line-height: 1.5; }
.dq__tips svg { width: 16px; height: 16px; margin-top: 3px; fill: none; stroke: var(--c, var(--accent)); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.dq__more { display: grid; gap: var(--s2); margin-top: var(--s2); }
.dq__more li { padding-top: var(--s2); border-top: 1px solid rgba(255, 255, 255, .08); }
.dq__more li:first-child { padding-top: 0; border-top: 0; }
.dq__more b { display: block; margin-top: 0 !important; }
.dq__more a { display: inline-flex; align-items: center; gap: 6px; margin-top: 6px; font-size: .86rem; color: #fff; text-underline-offset: 3px; }
.dq__pack { margin-top: var(--s3); display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s3); padding: 18px 20px; border-radius: 16px; border: 1px dashed rgba(255, 255, 255, .28); background: rgba(255, 255, 255, .03); }
.dq__pack h4 { font-family: var(--display); font-variation-settings: "wdth" 112; font-weight: 600; font-size: 1.05rem; line-height: 1.25; }
.dq__pack p { margin-top: 4px; color: #bdbdbd; font-size: .9rem; max-width: 46ch; }
.dq__pack > div { flex: 1 1 280px; }

/* ---------- Home: título da escolha (A/B) mais enxuto ---------- */
#escolha .pick2__t { max-width: 20ch; font-size: clamp(2.2rem, 5.2vw, 4.4rem); }
.pfm__t--3 img { object-position: 22% center; }

/* ---------- Agentes: capas em retrato ---------- */
.agc__foto img { object-position: center top; }
@media (max-width: 520px) { .agc__foto { aspect-ratio: 4 / 5; max-height: 460px; } }

/* ---------- Squad: computador com os agentes trocando mensagens ---------- */
.sq__vis { mask-image: none; -webkit-mask-image: none; overflow: visible; }
.sqpc { border: 1px solid var(--line-d); border-radius: 14px; background: linear-gradient(180deg, #0f0f0f, #080808); box-shadow: 0 30px 80px -40px rgba(255, 106, 43, .45), inset 0 1px 0 rgba(255, 255, 255, .05); overflow: hidden; }
.sqpc__bar { display: flex; align-items: center; gap: 6px; height: 34px; padding: 0 12px; border-bottom: 1px solid var(--line-d); background: #121212; font-size: .72rem; color: var(--mute-d); }
.sqpc__bar i { width: 9px; height: 9px; border-radius: 50%; background: #2a2a2a; }
.sqpc__bar span { margin-left: 8px; font-family: ui-monospace, Menlo, monospace; }
.sqpc__live { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; font-weight: 500; color: var(--accent); text-transform: uppercase; letter-spacing: .12em; font-size: .62rem; }
.sqpc__live::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 8px var(--accent); animation: sqBlink 1.4s ease-in-out infinite; }
.sqpc__net { display: block; width: 100%; height: auto; padding: 12px 6px 4px; }
.sqpc__ln { stroke: rgba(255, 255, 255, .09); stroke-width: 1; }
.sqpc__ln--o { stroke-dasharray: 2 4; }
.sqpc__hub circle { fill: #140c08; stroke: var(--accent); stroke-width: 1.2; }
.sqpc__hub text { fill: #fff; font: 600 7.5px var(--display); text-anchor: middle; letter-spacing: .1em; }
.sqpc__node circle { fill: #1a1a1a; stroke: rgba(255, 255, 255, .5); stroke-width: 1; transition: fill .3s, stroke .3s; }
.sqpc__node text { fill: #a9a9a9; font: 600 8px var(--display); text-anchor: middle; letter-spacing: .03em; transition: fill .3s; }
.sqpc__node.is-send circle { fill: var(--accent); stroke: var(--accent); }
.sqpc__node.is-recv circle { fill: #fff; stroke: #fff; }
.sqpc__node.is-send text, .sqpc__node.is-recv text { fill: #fff; }
.sqpc__pkt { fill: var(--accent); filter: drop-shadow(0 0 4px var(--accent)); }
.sqpc__log { display: grid; align-content: start; gap: 4px; min-height: 136px; padding: 10px 14px 14px; border-top: 1px solid var(--line-d); font-size: .74rem; font-family: ui-monospace, Menlo, monospace; }
.sqpc__log li { display: flex; flex-wrap: wrap; gap: 0 6px; align-items: baseline; color: #7d7d7d; animation: sqIn .4s var(--ease); }
.sqpc__log li:first-child { color: #d6d6d6; }
.sqpc__log b { color: #fff; font-weight: 600; }
.sqpc__log span { color: var(--accent); }
.sqpc__log em { font-style: normal; }
.sqpc__log code { color: #ffb08a; }
@keyframes sqIn { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
@keyframes sqBlink { 50% { opacity: .35; } }
@media (max-width: 560px) { .sqpc__log li:nth-child(n+4) { display: none; } .sqpc__log { min-height: 0; } }
@media (prefers-reduced-motion: reduce) { .sqpc__log li, .sqpc__live::before { animation: none; } }

/* ---------- Squad: capa com os 30 agentes no topo do quadro ---------- */
.sq__in { padding-top: 0; }
.sq__cover { grid-column: 1 / -1; position: relative; margin: 0 calc(clamp(24px, 4vw, 56px) * -1); aspect-ratio: 3 / 1; overflow: hidden; }
.sq__cover img { width: 100%; height: 100%; object-fit: cover; object-position: center 30%; filter: saturate(.9) contrast(1.05); }
.sq__cover::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(10,10,10,.15) 0%, transparent 35%, rgba(10,10,10,.55) 75%, #0a0a0a 100%); pointer-events: none; }
@media (max-width: 640px) { .sq__cover { aspect-ratio: 16 / 9; } .sq__cover img { object-position: center 25%; } }

/* ---------- Botão principal do Squad: brilho pulsante ---------- */
.btn--glow { position: relative; overflow: hidden; isolation: isolate; font-weight: 600; background: linear-gradient(90deg, #ff6a2b, #ff8a4c, #ff6a2b); background-size: 200% 100%; box-shadow: 0 0 0 0 rgba(255, 106, 43, .6), 0 10px 30px -8px rgba(255, 106, 43, .7); animation: glowPulse 1.8s ease-out infinite, glowShift 3s linear infinite; }
.btn--glow::after { content: ""; position: absolute; top: 0; bottom: 0; left: -60%; width: 40%; background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .75), transparent); transform: skewX(-20deg); animation: glowShine 2.6s ease-in-out infinite; z-index: -1; pointer-events: none; }
.btn--glow:hover { background-color: #ff8550; box-shadow: 0 0 0 4px rgba(255, 106, 43, .25), 0 14px 40px -6px rgba(255, 106, 43, .95); }
@keyframes glowPulse { 0% { box-shadow: 0 0 0 0 rgba(255, 106, 43, .65), 0 10px 30px -8px rgba(255, 106, 43, .7); } 70%, 100% { box-shadow: 0 0 0 16px rgba(255, 106, 43, 0), 0 10px 30px -8px rgba(255, 106, 43, .7); } }
@keyframes glowShift { to { background-position: 200% 0; } }
@keyframes glowShine { 0% { left: -60%; } 55%, 100% { left: 130%; } }
@media (max-width: 560px) { .btn--glow { white-space: normal; text-align: left; height: auto; min-height: 48px; padding-block: 12px; } }
@media (prefers-reduced-motion: reduce) { .btn--glow, .btn--glow::after { animation: none; } .btn--glow::after { display: none; } }

/* ---------- Agentes: "O que você precisa?" como índice + prévia viva ---------- */
.ns { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(24px, 4vw, 64px); align-items: start; margin-top: var(--s2); }
.ns__list { border-top: 1px solid var(--line-d); counter-reset: none; }
.ns__list li { border-bottom: 1px solid var(--line-d); }
.ns__row { position: relative; width: 100%; display: grid; grid-template-columns: 2.4rem 1fr auto; align-items: baseline; gap: var(--s2); padding: 15px 4px; background: none; border: 0; text-align: left; color: #9a9a9a; cursor: pointer; transition: color .3s, padding .4s var(--ease); }
.ns__row::before { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 1px; background: var(--accent); transform: scaleX(0); transform-origin: left; transition: transform .5s var(--ease); }
.ns__i { font-family: ui-monospace, Menlo, monospace; font-size: .72rem; color: #5f5f5f; transition: color .3s; }
.ns__n { font-family: var(--display); font-variation-settings: "wdth" 112; font-weight: 560; font-size: clamp(1.05rem, 1.6vw, 1.35rem); letter-spacing: -.015em; line-height: 1.2; }
.ns__c { font-family: ui-monospace, Menlo, monospace; font-size: .74rem; color: #6f6f6f; min-width: 2ch; text-align: right; }
.ns__row:hover, .ns__row:focus-visible { color: #fff; padding-left: 12px; }
.ns__row:hover::before, .ns__row[aria-pressed="true"]::before { transform: scaleX(1); }
.ns__row[aria-pressed="true"] { color: #fff; padding-left: 12px; }
.ns__row[aria-pressed="true"] .ns__i, .ns__row:hover .ns__i { color: var(--accent); }
.ns__row[aria-pressed="true"] .ns__c { color: #fff; }
.ns__panel { position: sticky; top: calc(var(--nav-h) + 24px); min-height: 460px; border: 1px solid var(--line-d); border-radius: calc(var(--r-m) + 4px); background: radial-gradient(90% 60% at 100% 0%, rgba(255, 106, 43, .1), transparent 60%), linear-gradient(180deg, #111, #090909); padding: clamp(24px, 3vw, 40px); overflow: hidden; }
.ns__in { display: grid; gap: var(--s3); animation: nsIn .45s var(--ease); }
.ns__k { font-size: .72rem; letter-spacing: .16em; text-transform: uppercase; color: var(--mute-d); }
.ns__k span { color: var(--accent); font-family: ui-monospace, Menlo, monospace; margin-right: 6px; }
.ns__q { font-family: var(--display); font-variation-settings: "wdth" 115; font-weight: 600; font-size: clamp(1.5rem, 2.6vw, 2.2rem); line-height: 1.08; letter-spacing: -.03em; max-width: 22ch; text-wrap: balance; }
.ns__who { margin-top: var(--s2); font-size: .74rem; letter-spacing: .14em; text-transform: uppercase; color: var(--mute-d); }
.ns__ag { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s1); }
.ns__ag li { display: grid; grid-template-columns: 44px 1fr; gap: var(--s2); align-items: center; padding: 8px; border-radius: 12px; border: 1px solid rgba(255, 255, 255, .07); background: rgba(255, 255, 255, .025); opacity: 0; transform: translateY(8px); animation: nsAg .5s var(--ease) forwards; animation-delay: calc(var(--k) * 60ms + 120ms); }
.ns__ph { width: 44px; height: 44px; border-radius: 10px; overflow: hidden; background: #1a1a1a; }
.ns__ph img { width: 100%; height: 100%; object-fit: cover; object-position: center top; }
.ns__ag b { display: block; font-family: var(--display); font-weight: 600; font-size: .86rem; letter-spacing: .02em; }
.ns__ag small { display: block; color: #9a9a9a; font-size: .78rem; line-height: 1.3; }
.ns__acts { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s2) var(--s3); margin-top: var(--s2); }
.ns__all { background: none; border: 0; color: #cfcfcf; text-decoration: underline; text-underline-offset: 4px; cursor: pointer; }
.ns__all:hover { color: #fff; }
@keyframes nsIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@keyframes nsAg { to { opacity: 1; transform: none; } }
@media (max-width: 900px) { .ns { grid-template-columns: 1fr; } .ns__panel { position: static; min-height: 0; } }
@media (max-width: 520px) { .ns__ag { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { .ns__in, .ns__ag li { animation: none; opacity: 1; transform: none; } .ns__row, .ns__row::before { transition: none; } }

/* ---------- Home: faixa de logos com tamanho padronizado e aceleração no hover ---------- */
.clients__label { font-family: var(--display); font-variation-settings: "wdth" 112; font-weight: 560; font-size: clamp(1.05rem, 1.6vw, 1.35rem); color: #e6e6e6; letter-spacing: -.01em; }
.client--logo img { max-height: none; max-width: none; object-fit: contain; }
.marquee:hover .marquee__track { animation-play-state: running; }
.client--logo { transition: transform .3s var(--ease); }
.client--logo:hover { transform: scale(1.08); }
@media (max-width: 640px) { .client--logo img { transform: scale(.82); } }

/* ---------- Home: marca completa como camadas sendo construídas ---------- */
.brandx__in { align-items: start; }
.bx { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: var(--s3); align-items: stretch; }
.bx__steps { display: grid; border-top: 1px solid var(--line-d); }
.bx__steps li { border-bottom: 1px solid var(--line-d); }
.bx__st { position: relative; width: 100%; display: grid; grid-template-columns: 2rem 1fr; column-gap: var(--s2); row-gap: 2px; padding: 16px 4px 18px; background: none; border: 0; text-align: left; color: #8a8a8a; cursor: pointer; transition: color .3s; }
.bx__n { grid-row: span 2; font-family: ui-monospace, Menlo, monospace; font-size: .72rem; color: #5f5f5f; padding-top: 4px; transition: color .3s; }
.bx__st b { font-family: var(--display); font-variation-settings: "wdth" 112; font-weight: 600; font-size: 1.12rem; letter-spacing: -.01em; }
.bx__t { font-size: .86rem; line-height: 1.5; max-height: 0; opacity: 0; overflow: hidden; transition: max-height .5s var(--ease), opacity .4s; }
.bx__bar { position: absolute; left: 0; bottom: -1px; height: 1px; width: 100%; background: var(--accent); transform: scaleX(0); transform-origin: left; }
.bx__st[aria-pressed="true"] { color: #fff; }
.bx__st[aria-pressed="true"] .bx__n, .bx__st.is-done .bx__n { color: var(--accent); }
.bx__st[aria-pressed="true"] .bx__t { max-height: 80px; opacity: 1; color: #bdbdbd; margin-top: 4px; }
.bx__st[aria-pressed="true"] .bx__bar { animation: bxBar 4.2s linear forwards; animation-play-state: var(--run, running); }
.bx__st:hover { color: #fff; }
@keyframes bxBar { to { transform: scaleX(1); } }
.bx__stage { position: relative; min-height: 380px; border: 1px solid var(--line-d); border-radius: calc(var(--r-m) + 4px); background: radial-gradient(80% 70% at 70% 20%, rgba(255, 106, 43, .1), transparent 60%), repeating-linear-gradient(90deg, rgba(255,255,255,.025) 0 1px, transparent 1px 40px), repeating-linear-gradient(0deg, rgba(255,255,255,.025) 0 1px, transparent 1px 40px), #090909; overflow: hidden; }
.bx__cap { position: absolute; top: 14px; left: 16px; z-index: 2; font-family: ui-monospace, Menlo, monospace; font-size: .68rem; letter-spacing: .1em; color: var(--mute-d); text-transform: uppercase; }
.bx__cap b { color: var(--accent); font-weight: 500; }
.bx__scene { position: absolute; inset: 0; display: grid; place-items: center; padding: 44px 24px 24px; opacity: 0; transform: scale(.97); transition: opacity .6s var(--ease), transform .7s var(--ease); pointer-events: none; }
.bx__scene.is-on { opacity: 1; transform: none; }
.bxs { width: 100%; display: grid; gap: var(--s3); justify-items: center; }
.bxs__map { position: relative; width: min(100%, 300px); aspect-ratio: 1.3; }
.bxs__ax { position: absolute; background: rgba(255,255,255,.25); }
.bxs__ax--x { left: 0; right: 0; top: 50%; height: 1px; }
.bxs__ax--y { top: 0; bottom: 0; left: 50%; width: 1px; }
.bxs__map i { position: absolute; left: var(--x); top: var(--y); width: 9px; height: 9px; margin: -4px; border-radius: 50%; background: #3a3a3a; }
.bxs__map b { position: absolute; left: var(--x); top: var(--y); transform: translate(-50%, -50%); padding: 4px 10px; border-radius: 999px; background: var(--accent); color: #000; font-size: .72rem; white-space: nowrap; box-shadow: 0 0 0 6px rgba(255,106,43,.18); }
.is-on .bxs__map b { animation: bxPing 2s ease-out infinite; }
.bxs__l { position: absolute; font-style: normal; font-size: .64rem; letter-spacing: .1em; text-transform: uppercase; color: #6f6f6f; }
.bxs__l--t { top: -18px; left: 50%; transform: translateX(-50%); }
.bxs__l--b { bottom: -18px; left: 50%; transform: translateX(-50%); }
.bxs__l--l { left: 0; top: calc(50% + 6px); }
.bxs__l--r { right: 0; top: calc(50% + 6px); }
.bxs__tags { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin-top: var(--s3); }
.bxs__tags li { padding: 4px 10px; border-radius: 999px; border: 1px solid var(--line-d); font-size: .72rem; color: #cfcfcf; }
.bxs__logo { width: min(80%, 300px); height: auto; clip-path: inset(0 100% 0 0); }
.is-on .bxs__logo { animation: bxWipe 1.1s var(--ease) .1s forwards; }
.bxs__sw { display: flex; gap: 8px; }
.bxs__sw li { width: 64px; padding-top: 52px; padding-bottom: 6px; border-radius: 10px; border: 1px solid var(--line-d); background: linear-gradient(var(--c), var(--c)) top / 100% 48px no-repeat; font-family: ui-monospace, Menlo, monospace; font-size: .6rem; color: #9a9a9a; text-align: center; opacity: 0; transform: translateY(8px); }
.is-on .bxs__sw li { animation: bxUp .5s var(--ease) forwards; }
.is-on .bxs__sw li:nth-child(2) { animation-delay: .1s; }
.is-on .bxs__sw li:nth-child(3) { animation-delay: .2s; }
.is-on .bxs__sw li:nth-child(4) { animation-delay: .3s; }
.bxs__type { display: flex; align-items: baseline; gap: 12px; }
.bxs__type span { font-family: var(--display); font-size: 2.4rem; font-weight: 700; line-height: 1; }
.bxs__type small { color: var(--mute-d); font-size: .74rem; }
.bxs--3 { position: relative; height: 300px; width: min(100%, 420px); display: block; }
.bxs--3 figure { position: absolute; margin: 0; width: 58%; aspect-ratio: 4 / 3; border-radius: 12px; overflow: hidden; border: 1px solid rgba(255,255,255,.14); box-shadow: 0 24px 50px -20px #000; opacity: 0; transform: translateY(20px) rotate(var(--r)); }
.bxs--3 figure:nth-child(1) { left: 0; top: 18px; }
.bxs--3 figure:nth-child(2) { right: 0; top: 0; }
.bxs--3 figure:nth-child(3) { left: 21%; bottom: 0; }
.bxs--3 img { width: 100%; height: 100%; object-fit: cover; }
.is-on .bxs--3 figure { animation: bxCard .7s var(--ease) forwards; animation-delay: var(--d); }
.bxs__sheet { position: relative; width: min(100%, 320px); padding: 34px 36px; border: 1px dashed rgba(255,106,43,.6); border-radius: 6px; }
.bxs__sheet img { width: 100%; height: auto; }
.bxs__m { position: absolute; display: grid; place-items: center; font-family: ui-monospace, Menlo, monospace; font-size: .62rem; color: var(--accent); width: 36px; height: 34px; }
.bxs__m--h { left: 0; top: 0; border-right: 1px solid rgba(255,106,43,.5); }
.bxs__m--v { right: 0; bottom: 0; border-left: 1px solid rgba(255,106,43,.5); }
.bxs__m em { font-style: normal; }
.bxs__rules { display: grid; gap: 6px; width: min(100%, 340px); }
.bxs__rules li { display: flex; justify-content: space-between; gap: 12px; padding: 7px 10px; border-radius: 8px; background: rgba(255,255,255,.035); font-size: .74rem; opacity: 0; transform: translateX(-8px); }
.bxs__rules b { font-weight: 600; }
.bxs__rules span { color: #9a9a9a; text-align: right; }
.is-on .bxs__rules li { animation: bxUp .5s var(--ease) forwards; }
.is-on .bxs__rules li:nth-child(2) { animation-delay: .12s; }
.is-on .bxs__rules li:nth-child(3) { animation-delay: .24s; }
@keyframes bxWipe { to { clip-path: inset(0 0 0 0); } }
@keyframes bxUp { to { opacity: 1; transform: none; } }
@keyframes bxCard { to { opacity: 1; transform: rotate(var(--r)); } }
@keyframes bxPing { 0% { box-shadow: 0 0 0 0 rgba(255,106,43,.5); } 100% { box-shadow: 0 0 0 14px rgba(255,106,43,0); } }
@media (max-width: 1100px) { .bx { grid-template-columns: 1fr; } }
@media (max-width: 520px) { .bx__stage { min-height: 340px; } .bxs__sw li { width: 54px; } }
@media (prefers-reduced-motion: reduce) {
  .bx__scene { transition: none; }
  .bx__st[aria-pressed="true"] .bx__bar { animation: none; transform: scaleX(1); }
  .bxs__logo { clip-path: none; }
  .bxs__sw li, .bxs__rules li { opacity: 1; transform: none; animation: none; }
  .bxs--3 figure { opacity: 1; transform: rotate(var(--r)); animation: none; }
  .is-on .bxs__map b, .is-on .bxs__logo, .is-on .bxs__sw li, .is-on .bxs--3 figure, .is-on .bxs__rules li { animation: none; }
}
.brandx__in:has(.bx) { grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); }
.bx { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); }
.bx__stage { min-height: 420px; }
@media (max-width: 1100px) { .brandx__in:has(.bx) { grid-template-columns: 1fr; } .bx { grid-template-columns: 1fr; } }

/* ---------- Quem está por trás: nome e cargo ---------- */
.quem__role { display: grid; gap: 2px; padding-left: 14px; border-left: 2px solid var(--accent); margin-block: var(--s1); }
.quem__role b { font-family: var(--display); font-variation-settings: "wdth" 112; font-weight: 600; font-size: 1.15rem; letter-spacing: -.01em; }
.quem__role span { color: #bdbdbd; font-size: .9rem; }

/* ---------- Números da home: "mil" na mesma linha ---------- */
.nums b { white-space: nowrap; letter-spacing: -.045em; font-size: clamp(1.35rem, 2.15vw, 2.05rem); }
@media (max-width: 900px) { .nums b { font-size: clamp(1.35rem, 4.4vw, 1.8rem); } }

/* ---------- Trilha: aviso enquanto o som não foi liberado pelo navegador ---------- */
.fab--music { position: relative; }
.fab--music.is-waiting::after { content: "Toque para ouvir"; position: absolute; right: calc(100% + 12px); top: 50%; transform: translateY(-50%); padding: 7px 12px; border-radius: 999px; background: var(--accent); color: #000; font-size: .78rem; font-weight: 600; white-space: nowrap; box-shadow: 0 10px 30px -10px rgba(255,106,43,.8); pointer-events: none; animation: musicTip 2.2s ease-in-out infinite; }
@keyframes musicTip { 50% { transform: translateY(-50%) translateX(-4px); } }
@media (max-width: 560px) { .fab--music.is-waiting::after { font-size: .72rem; padding: 6px 10px; } }
@media (prefers-reduced-motion: reduce) { .fab--music.is-waiting::after { animation: none; } }

/* ---------- Trilha: ícone de música pequeno no menu, junto dos outros ---------- */
.nav__music { width: 32px; height: 32px; margin-left: -10px; }
.nav__music svg { width: 16px; height: 16px; }
.nav__music .slash { display: none; }
.nav__music:not(.is-playing) .slash { display: block; }
.nav__music.is-playing { color: var(--accent); border-color: rgba(255,106,43,.55); }
.nav__music.is-waiting { border-color: var(--accent); }
.nav__music.is-waiting::after { content: none; }
.nav__music.is-hint { animation: musicBlink .8s ease-in-out 3; }

/* ---------- Trilha: ícone de som sempre branco e discreto; só 1 piscada laranja ao abrir ---------- */
.nav__music, .nav__music.is-playing, .nav__music.is-waiting { color: #fff; border-color: var(--line-d); box-shadow: none; }
.nav__music.is-hint { animation: musicBlink .8s ease-in-out 1; }

/* ---------- Home: serviços em 3 categorias, com destaque ao passar o mouse ---------- */
.sgs { display: grid; gap: var(--s4); }
.sg { padding: clamp(16px, 2.2vw, 28px); border-radius: calc(var(--r-m) + 6px); border: 1px solid var(--line-d); background: linear-gradient(180deg, #181818, #101010); }
.sg__h { display: grid; grid-template-columns: auto auto 1fr; align-items: baseline; gap: 4px var(--s2); margin-bottom: var(--s3); }
.sg__n { font-family: ui-monospace, Menlo, monospace; font-size: .74rem; color: var(--accent); }
.sg__h h3 { font-family: var(--display); font-variation-settings: "wdth" 114; font-weight: 600; font-size: clamp(1.15rem, 1.8vw, 1.5rem); letter-spacing: -.02em; }
.sg__h p { color: #9a9a9a; font-size: .9rem; }
.sg__grid { grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); }
.sg--marca .sg__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.sg .sblock__in { position: relative; background: #0c0c0c; transition: border-color .35s, box-shadow .45s var(--ease), transform .45s var(--ease); }
.sg .sblock__in::after { content: ""; position: absolute; inset: -1px; border-radius: inherit; pointer-events: none; opacity: 0; box-shadow: 0 0 0 1px var(--c, var(--accent)), 0 0 26px -2px var(--c, var(--accent)), inset 0 0 26px -14px var(--c, var(--accent)); transition: opacity .4s; }
.sg .sblock__in:hover, .sg .sblock__in:focus-visible { border-color: var(--c, var(--accent)); transform: translateY(-5px); box-shadow: 0 22px 50px -24px var(--c, var(--accent)); }
.sg .sblock__in:hover::after, .sg .sblock__in:focus-visible::after { opacity: 1; animation: sbGlow 2.2s ease-in-out infinite; }
@keyframes sbGlow { 50% { opacity: .55; } }
@media (max-width: 900px) { .sg__h { grid-template-columns: auto 1fr; } .sg__h p { grid-column: 1 / -1; } .sg--marca .sg__grid { grid-template-columns: none; } }
@media (prefers-reduced-motion: reduce) { .sg .sblock__in, .sg .sblock__in::after { transition: none; } .sg .sblock__in:hover { transform: none; } .sg .sblock__in:hover::after { animation: none; } }
.sg .sg__grid > li:last-child:nth-child(n) { grid-column: auto; }
.sg .sg__grid > li:last-child:nth-child(n) .sblock__in { grid-template-rows: auto 1fr; grid-template-columns: none; }

/* ---------- Hero: letras do logo com texturas ao passar o mouse ---------- */
.hlogo { position: relative; max-width: 1200px; cursor: default; }
.hlogo .hero__logo { position: relative; z-index: 1; transition: -webkit-mask-image .2s, mask-image .2s; }
@media all { .hlogo__cv { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 2; pointer-events: none; filter: drop-shadow(0 10px 24px rgba(0,0,0,.6)); } }
.hlogo__l { position: absolute; inset: 0; z-index: 2; pointer-events: none; opacity: 0; transform: scale(.985); transition: opacity .35s var(--ease), transform .45s var(--ease); }
.hlogo__l img { position: absolute; left: .07%; top: .48%; width: 99.86%; height: 99.04%; object-fit: fill; filter: drop-shadow(0 10px 24px rgba(0,0,0,.6)); }
.hlogo__l.is-on { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .hlogo__l { transition: opacity .15s; transform: none; } }
/* hero: palavra em hover */
.hero__title .hw { display: inline-block; transition: color .45s var(--ease), font-variation-settings .45s var(--ease), font-weight .45s var(--ease), transform .45s var(--ease), letter-spacing .45s var(--ease); }
.hero__title .hw.is-serif { font-family: "Instrument Serif", Georgia, serif; font-style: italic; font-weight: 400; letter-spacing: -0.01em; transform: translateY(-2px); }
.hero__title .hw.is-bold { font-weight: 820; font-variation-settings: "wdth" 116; }
.hero__title .hw.is-accent { color: var(--accent-color, var(--accent)); text-shadow: 0 0 22px color-mix(in srgb, var(--accent-color, var(--accent)) 35%, transparent); }
.hero__title .hw.is-italic { font-style: italic; font-weight: 340; transform: skewX(-2deg); }
@media (prefers-reduced-motion: reduce) { .hero__title .hw { transition: color .15s; transform: none !important; } }

/* Como funciona: cena animada acima de cada etapa */
.hw5__scene { display: grid; place-items: center; width: 118px; height: 90px; margin-bottom: var(--s2); border-radius: 22px; border: 1px solid rgba(255,255,255,.1); background: radial-gradient(90% 90% at 50% 0%, rgba(255,106,43,.14), transparent 70%), rgba(255,255,255,.03); opacity: 0; translate: 0 14px; transition: opacity .7s var(--ease), translate .7s var(--ease); transition-delay: calc(var(--i) * 260ms); }
.hw5__l.is-in .hw5__scene { opacity: 1; translate: 0 0; }
.hw5__art { width: 84px; height: 63px; overflow: visible; fill: none; stroke: rgba(255,255,255,.85); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.hw5__art .a-pulse, .hw5__art .a-lens circle { stroke: var(--accent); }
.hw5__art .a-q, .hw5__art .a-qd { stroke: var(--accent); fill: var(--accent); }
.hw5__art .a-q { fill: none; }
.hw5__l.is-in .a-bub { animation: a-bob 2.6s ease-in-out infinite; transform-box: fill-box; transform-origin: 30% 100%; }
.hw5__l.is-in .a-pulse { animation: a-pulse 2.6s ease-in-out infinite; transform-box: fill-box; transform-origin: center; }
@keyframes a-bob { 0%, 100% { translate: 0 0; } 50% { translate: 0 -3px; } }
@keyframes a-pulse { 0%, 100% { scale: 1; } 50% { scale: 1.08; } }
.hw5__art .a-item { fill: var(--accent); stroke: none; opacity: 0; }
.hw5__l.is-in .a-item { animation: a-drop 2.8s ease-in-out infinite; }
@keyframes a-drop { 0%, 38% { opacity: 0; translate: 22px -18px; } 55%, 85% { opacity: 1; translate: 0 0; } 100% { opacity: 0; translate: 0 0; } }
.hw5__art .a-click { fill: #fff; stroke: #0a0a0a; stroke-width: 1.2; }
.hw5__l.is-in .a-click { animation: a-mouse 2.8s ease-in-out infinite; }
@keyframes a-mouse { 0%, 100% { translate: 8px -4px; } 40% { translate: -22px 6px; } 50% { translate: -22px 9px; } 70% { translate: -22px 6px; } }
.hw5__art .a-ping { stroke: var(--accent); opacity: 0; transform-box: fill-box; transform-origin: center; }
.hw5__art .a-line { fill: rgba(255,255,255,.22); stroke: none; transform-box: fill-box; transform-origin: left; transform: scaleX(0); }
.hw5__l.is-in .a-line { animation: a-fill 3.6s ease-in-out infinite; }
.hw5__l.is-in .a-line.l2 { animation-delay: .5s; } .hw5__l.is-in .a-line.l3 { animation-delay: 1s; }
@keyframes a-fill { 0% { transform: scaleX(0); } 22%, 80% { transform: scaleX(1); fill: var(--accent); } 100% { transform: scaleX(1); } }
.hw5__art .a-tick { stroke: #4ade80; stroke-dasharray: 30; stroke-dashoffset: 30; }
.hw5__l.is-in .a-tick { animation: a-tick 3.6s ease-in-out infinite; }
@keyframes a-tick { 0%, 55% { stroke-dashoffset: 30; } 70%, 92% { stroke-dashoffset: 0; } 100% { stroke-dashoffset: 30; } }
.hw5__art .a-caret { fill: var(--accent); stroke: none; }
.hw5__l.is-in .a-caret { animation: a-blink 1s steps(2) infinite; }
@keyframes a-blink { 50% { opacity: 0; } }
.hw5__art .a-tab { fill: rgba(10,10,10,.9); }
.hw5__l.is-in .a-tab.t1 { animation: a-tab 3.4s ease-in-out infinite; }
.hw5__l.is-in .a-tab.t2 { animation: a-tab 3.4s ease-in-out .3s infinite; }
.hw5__l.is-in .a-tab.t3 { animation: a-tab 3.4s ease-in-out .6s infinite; }
@keyframes a-tab { 0%, 100% { translate: 0 0; } 50% { translate: -3px 3px; } }
.hw5__art .a-lens { fill: rgba(255,106,43,.1); }
.hw5__l.is-in .a-lens { animation: a-scan 3.4s ease-in-out infinite; }
@keyframes a-scan { 0%, 100% { translate: 0 0; } 33% { translate: -26px -14px; } 66% { translate: -8px -22px; } }
.hw5__art .a-file { fill: rgba(255,255,255,.1); opacity: 0; }
.hw5__l.is-in .a-file { animation: a-fly 3.2s ease-in infinite; }
.hw5__l.is-in .a-file.f2 { animation-delay: .35s; } .hw5__l.is-in .a-file.f3 { animation-delay: .7s; }
@keyframes a-fly { 0% { opacity: 0; translate: 0 -8px; } 20% { opacity: 1; } 70% { opacity: 1; translate: calc(var(--fx, 0) * 1px) 34px; } 100% { opacity: 0; translate: calc(var(--fx, 0) * 1px) 40px; } }
.hw5__art .a-file.f1 { --fx: 8; } .hw5__art .a-file.f2 { --fx: -4; } .hw5__art .a-file.f3 { --fx: -16; }
.hw5__art .a-ok { stroke: #4ade80; stroke-dasharray: 40; stroke-dashoffset: 40; }
.hw5__l.is-in .a-ok { animation: a-tick 3.2s ease-in-out infinite; }
@media (max-width: 860px) { .hw5__scene { grid-column: 2; grid-row: 1; justify-self: start; } }
@media (prefers-reduced-motion: reduce) {
  .hw5__scene { transition: none; opacity: 1; translate: 0 0; }
  .hw5__l.is-in .hw5__art *, .hw5__art * { animation: none !important; }
  .hw5__art .a-item, .hw5__art .a-file { opacity: 1; } .hw5__art .a-line { transform: scaleX(1); } .hw5__art .a-tick, .hw5__art .a-ok { stroke-dashoffset: 0; }
}

@media (min-width: 861px) { .hw5__l::before, .hw5__l::after { top: 131px; } }

/* título "Uma marca completa": letras entram da esquerda para a direita */
.lt-w { display: inline-block; white-space: nowrap; }
.lt { display: inline-block; opacity: 0; translate: -14px 0; filter: blur(6px); transition: opacity .5s var(--ease), translate .6s var(--ease), filter .6s var(--ease); transition-delay: calc(var(--i) * 42ms); }
.is-in > .lt-w .lt, .is-in .lt { opacity: 1; translate: 0 0; filter: blur(0); }
/* selo "serviços principais" no bloco Criação de marca */
.sg__h { position: relative; }
.sg__badge { grid-column: 1 / -1; justify-self: start; display: inline-flex; align-items: center; gap: 8px; height: 30px; padding: 0 14px; border-radius: 999px; font-size: .7rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: #fff; border: 1px solid rgba(255,106,43,.55); background: linear-gradient(90deg, rgba(255,106,43,.18), rgba(255,106,43,.04)); box-shadow: 0 0 24px -8px rgba(255,106,43,.6); order: -1; }
.sg__badge i { width: 7px; height: 7px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 10px var(--accent); animation: sg-bl 2s ease-in-out infinite; }
@keyframes sg-bl { 50% { opacity: .35; } }
@media (min-width: 900px) { .sg--marca .sg__h { grid-template-columns: auto auto 1fr auto; } .sg--marca .sg__badge { grid-column: auto; order: 0; justify-self: end; align-self: center; } }
/* moldura colorida ao passar o mouse, uma cor por serviço */
.sblock[style*="--hc"] .sblock__in { transition: border-color .3s, box-shadow .4s var(--ease), transform .4s var(--ease); }
.sblock[style*="--hc"] .sblock__in:hover, .sblock[style*="--hc"] .sblock__in:focus-visible { border-color: var(--hc); box-shadow: 0 0 0 1px var(--hc), 0 18px 46px -18px var(--hc); }
.sblock[style*="--hc"] .sblock__in:hover .sblock__price { color: var(--hc); }
@media (prefers-reduced-motion: reduce) { .lt { transition: none; opacity: 1; translate: 0 0; filter: none; } .sg__badge i { animation: none; } }

.pfm__t--nocover { background: radial-gradient(90% 80% at 20% 0%, rgba(255,106,43,.12), transparent 70%), #101010; }
.pfm__t--nocover::after { background: none; }
.pfm__t--nocover:has(.pfm__img--hover)::after { background: linear-gradient(180deg, transparent 52%, rgba(0, 0, 0, .78)); opacity: 0; transition: opacity .4s; }
.pfm__t--nocover:has(.pfm__img--hover):hover::after, .pfm__t--nocover:has(.pfm__img--hover):focus-within::after { opacity: 1; }
.pfm__t--nocover .pfm__cap { top: auto; }