/* Cheff de Casa · v3: mesma identidade (creme, laranja, Gelica, comida flutuando), sistema refeito com o Livro de Regras */
@font-face { font-family: Gelica; src: url(fonts/gelica-regular.woff2) format('woff2'); font-weight: 400; font-display: swap; }
@font-face { font-family: Gelica; src: url(fonts/gelica-medium.woff2) format('woff2'); font-weight: 500; font-display: swap; }
@font-face { font-family: Gelica; src: url(fonts/gelica-semibold.woff2) format('woff2'); font-weight: 600; font-display: swap; }

/* ---------- primitivos ---------- */
:root {
  --n50: #fafaf9; --n100: #f5f5f4; --n150: #eeedeb; --n200: #e7e5e4; --n300: #d6d3d1; --n400: #a8a29e; --n500: #78716c; --n600: #57534e; --n800: #292524; --n850: #231f1d; --n900: #1c1917;
  --p50: #fff7ed; --p100: #ffedd5; --p200: #fed7aa; --p400: #fb923c; --p500: #f97316; --p600: #ea580c; --p650: #cc480b; --p700: #c2410c; --p800: #a93a0b;
  --r300: #b91c1c; --g300: #15803d; --star: #fbbf24;
  --quart: cubic-bezier(.165, .84, .44, 1); --quad: cubic-bezier(.25, .46, .45, .94);
}
/* ---------- tokens por tela: desktop / tablet / celular (RSP-01) ---------- */
:root {
  --m: max(5vw, calc((100vw - 1280px) / 2));
  --hd-top: 32px; --hd-h: 64px; --sec-y: 112px; --cab-gap: 48px; --gap: 24px; --raio: 24px; --raio-in: 16px; --pad: 24px;
  --fs-h1: clamp(48px, 4.6vw, 72px); --fs-h2: 56px; --fs-h3: 32px; --fs-h4: 24px; --fs-lead: 20px;
}
@media (max-width: 1024px) { :root { --hd-top: 24px; --hd-h: 56px; --sec-y: 96px; --cab-gap: 40px; --gap: 16px; --fs-h1: 56px; --fs-h2: 44px; --fs-h3: 28px; } }
@media (max-width: 640px) { :root { --m: 16px; --hd-top: 16px; --sec-y: 64px; --cab-gap: 32px; --raio: 20px; --raio-in: 12px; --fs-h1: 40px; --fs-h2: 32px; --fs-h3: 24px; --fs-h4: 20px; --fs-lead: 16px; } }

/* ---------- base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: calc(var(--hd-top) + var(--hd-h) + 24px); color-scheme: light; }
body { margin: 0; background: var(--n50); color: var(--n900); font: 400 16px/1.45 Gelica, Georgia, serif; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; overflow-x: clip; }
h1, h2, h3, p, ul, ol, dl, dd, figure, blockquote { margin: 0; padding: 0; }
ul, ol { list-style: none; }
img, video, svg { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
::selection { background: var(--p200); color: var(--n900); }
:focus-visible { outline: 2px solid var(--p700); outline-offset: 3px; }
[data-tema=escuro] :focus-visible { outline-color: var(--p200); }
@media (forced-colors: active) { :focus-visible { outline: 2px solid CanvasText; } .bt, .seta, .rede { border: 1px solid ButtonText; } }
.ic { width: 24px; height: 24px; flex: none; stroke-width: 1.75; transition: stroke-width .25s var(--quad); }
.ic--p { width: 16px; height: 16px; stroke-width: 2.25; }
.pular { position: fixed; left: 16px; top: -60px; z-index: 100; background: var(--p700); color: #fff; padding: 12px 16px; border-radius: 999px; }
.pular:focus { top: 16px; }
.wrap { width: 100%; max-width: calc(1280px + var(--m) * 2); margin-inline: auto; padding-inline: var(--m); }
.so-m { display: none; }
@media (max-width: 640px) { .nao-cel { display: none; } }
@media (max-width: 1199px) { .so-d { display: none; } .so-m { display: inline; } }
h1, h2, h3, p, li, dd, dt, blockquote, summary { text-wrap: pretty; }

/* ---------- tipografia: um estilo por nível (TIP-02) ---------- */
.h1 { font-size: var(--fs-h1); font-weight: 500; line-height: 1.06; letter-spacing: -.022em; text-wrap: balance; }
.h1 em { font-style: normal; color: var(--p700); }
.h2 { font-size: var(--fs-h2); font-weight: 500; line-height: 1.08; letter-spacing: -.02em; text-wrap: balance; }
.h3 { font-size: var(--fs-h3); font-weight: 500; line-height: 1.15; letter-spacing: -.012em; text-wrap: balance; }
.t-lead { font-size: var(--fs-lead); line-height: 1.45; color: var(--n600); }
.t-corpo { font-size: 16px; line-height: 1.45; color: var(--n600); }

/* ---------- botões: pílula, seta que atravessa e volta pelo outro lado (MOT-05) ---------- */
.bt { display: inline-flex; align-items: center; justify-content: center; gap: 8px; border-radius: 999px; font-weight: 500; line-height: 1; white-space: nowrap; letter-spacing: -.003em;
  transition: background-color .25s var(--quad), color .25s var(--quad), transform .1s var(--quad); }
.bt--g { height: 48px; padding: 0 24px; font-size: 16px; }
.bt--m { height: 40px; padding: 0 16px; font-size: 15px; }
.bt--pri { background: var(--p650); color: #fff; }
.bt--pri:hover { background: var(--p800); }
.bt--sec { background: var(--n150); color: var(--n900); }
.bt--sec:hover { background: var(--n200); }
.bt--claro { background: var(--n50); color: var(--p800); }
.bt--claro:hover { background: #fff; }
.bt:active { transform: scale(.98); }
.bt--cheio { width: 100%; }
.bt__s { position: relative; width: 16px; height: 16px; overflow: clip; flex: none; }
.bt__s svg { position: absolute; inset: 0; transition: transform .35s var(--quart); }
.bt__s svg:last-child { transform: translateX(-120%); }
@media (hover: hover) { .bt:hover .bt__s svg:first-child { transform: translateX(120%); } .bt:hover .bt__s svg:last-child { transform: none; } }

/* ---------- tags: pílula sem contorno (FOR-06) ---------- */
.tags { display: flex; flex-wrap: wrap; gap: 8px; }
.tag { display: inline-flex; align-items: center; height: 32px; padding: 0 12px; border-radius: 999px; background: var(--n150); color: var(--n600); font-size: 14px; font-weight: 500; line-height: 1; white-space: nowrap; width: max-content; }
.tag--sec { background: var(--p100); color: var(--p700); }
.tag--esc { background: rgb(255 255 255 / .08); color: var(--p200); }

/* ---------- mídia: zoom por dentro da moldura (IMG-01) ---------- */
.moldura { position: relative; overflow: hidden; border-radius: var(--raio); background: var(--n100); isolation: isolate; }
.moldura > img, .moldura > video { width: 100%; height: 100%; object-fit: cover; transition: transform .9s var(--quart); }
@media (hover: hover) { .moldura:hover > img, .moldura:hover > video { transform: scale(1.04); } }

/* ---------- header: pílula de vidro do Studio, logo completa, navegação no centro ---------- */
.hd { position: fixed; top: var(--hd-top); left: 50%; translate: -50% 0; z-index: 50; width: min(1280px, calc(100vw - var(--m) * 2)); height: var(--hd-h); padding: 0 12px 0 24px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 16px; border-radius: 999px;
  background: rgb(255 255 255 / .72); border: 1px solid rgb(0 0 0 / .05); -webkit-backdrop-filter: blur(24px) saturate(180%); backdrop-filter: blur(24px) saturate(180%); transition: width .7s var(--quart), background-color .4s var(--quad), color .4s var(--quad); }
@media (min-width: 641px) { .hd.sobre-hero { width: 90vw; } }
.hd.no-escuro { background: rgb(41 37 36 / .72); border-color: rgb(255 255 255 / .06); color: var(--n50); }
.marca { position: relative; display: block; width: 200px; height: 28px; justify-self: start; }
.marca img { position: absolute; inset: 0; width: 100%; height: 100%; transition: opacity .4s var(--quad); }
.marca__c { opacity: 0; }
.no-escuro .marca__e { opacity: 0; } .no-escuro .marca__c { opacity: 1; }
.hd__nav { display: flex; gap: 4px; }
.hd__nav a { display: inline-flex; align-items: center; height: 40px; padding: 0 12px; border-radius: 999px; font-size: 15px; font-weight: 500; line-height: 1; color: var(--n600); transition: color .25s var(--quad); }
.hd__nav a:hover { color: var(--n900); }
.no-escuro .hd__nav a { color: var(--n300); } .no-escuro .hd__nav a:hover { color: #fff; }
.hd__bts { display: grid; justify-self: end; justify-items: end; align-items: center; }
.hd__bts > .bt { grid-area: 1 / 1; transition: opacity .25s var(--quad), visibility 0s, background-color .25s var(--quad), color .25s var(--quad); }
.hd__cta { opacity: 0; visibility: hidden; }
.hd.tem-cta .hd__cta { opacity: 1; visibility: visible; }
.hd.tem-cta .hd__membros { opacity: 0; visibility: hidden; }
.no-escuro .hd__membros { background: rgb(255 255 255 / .1); color: var(--n50); }
.hd__menu { display: none; position: relative; width: 40px; height: 40px; border-radius: 999px; }
.hd__menu span { position: absolute; left: 11px; right: 11px; top: 50%; height: 1.5px; margin-top: -.75px; border-radius: 2px; background: currentColor; transition: transform .25s var(--quart); }
.hd__menu span:first-child { transform: translateY(-3.5px); } .hd__menu span:last-child { transform: translateY(3.5px); }
.hd__menu[aria-expanded=true] span:first-child { transform: rotate(45deg); } .hd__menu[aria-expanded=true] span:last-child { transform: rotate(-45deg); }
.gav { position: fixed; inset: 0; z-index: 49; background: var(--n50); overflow-y: auto; animation: sobe .25s var(--quart); }
.gav[hidden] { display: none; }
.gav__in { min-height: 100%; display: flex; flex-direction: column; justify-content: space-between; gap: 32px; padding: calc(var(--hd-top) + var(--hd-h) + 24px) var(--m) 24px; }
.gav li + li { border-top: 1px solid var(--n200); }
.gav li a { display: flex; align-items: center; height: 56px; font-size: 20px; font-weight: 500; }
.gav__acoes { display: flex; flex-direction: column; gap: 8px; }
.gav__acoes .bt { width: 100%; }
html.gav-aberta { overflow: hidden; }
@media (max-width: 1199px) {
  .hd { grid-template-columns: 1fr auto; padding-right: 8px; }
  .hd__nav { display: none; }
  .hd__bts { display: flex; gap: 8px; }
  .hd__bts > .bt { display: none; }
  .hd__menu { display: block; }
}
@media (max-width: 640px) { .hd { padding-left: 16px; } .marca { width: 171px; height: 24px; } }

/* ---------- 1 · hero: texto em cima, sanfona de vídeos ocupa o resto da tela ---------- */
.hero { min-height: 100svh; padding: calc(var(--hd-top) + var(--hd-h) + 32px) 0 32px; display: flex; }
.hero__in { width: 90vw; flex: 0 0 90vw; margin-inline: auto; display: flex; flex-direction: column; gap: 32px; min-width: 0; }
.hero__txt { display: flex; flex-direction: column; gap: 16px; }
.hero__tags { margin-bottom: 4px; }
.hero__base { display: flex; align-items: center; justify-content: space-between; gap: 48px; margin-top: 8px; }
.hero__sub { font-size: var(--fs-lead); line-height: 1.4; color: var(--n600); max-width: 560px; }
.hero__acao { display: flex; align-items: center; gap: 24px; flex: none; }

/* a altura da sanfona vem da tela; o vídeo aberto mantém 1,54:1 e nunca achata */
.sanf { --alt: max(360px, calc(100svh - 478px)); --vao: 12px; position: relative; display: flex; gap: var(--vao); flex: 1; min-height: var(--alt); min-width: 0; }
.sanf__i { position: relative; flex: 1 1 0; min-width: 0; overflow: hidden; border-radius: var(--raio); background: var(--p200); isolation: isolate; transition: flex-grow .7s var(--quart), flex-basis .7s var(--quart); }
.sanf__i.is-ativo { flex: 0 0 min(calc(var(--alt) * 1.54), calc(100% - (96px + var(--vao)) * 3)); }
.sanf__i video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.sanf__bt { position: absolute; inset: 0; z-index: 1; border-radius: inherit; }
.sanf__bt:focus-visible { outline-offset: -4px; }
.sanf__leg { position: absolute; left: 16px; bottom: 16px; z-index: 2; pointer-events: none; display: flex; align-items: center; height: 40px; padding: 0 16px; border-radius: 999px; font-size: 15px; font-weight: 500; line-height: 1; white-space: nowrap; color: var(--n900); background: rgb(250 250 249 / .72); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); opacity: 0; transition: opacity .2s var(--quad); }
.sanf__i.is-ativo .sanf__leg { opacity: 1; transition: opacity .4s var(--quad) .3s; }
.pausa { width: 40px; height: 40px; border-radius: 999px; display: grid; place-items: center; color: var(--n900); background: rgb(250 250 249 / .72); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); transition: background-color .25s var(--quad); }
.pausa:hover { background: rgb(250 250 249 / .92); }
.sanf__pausa { position: absolute; right: 16px; top: 16px; z-index: 3; }
.dep__img .pausa { position: absolute; right: 16px; bottom: 16px; z-index: 2; }

@keyframes sobe { from { opacity: .01; translate: 0 12px; } }
@media (prefers-reduced-motion: no-preference) {
  .hero__tags, .hero .h1, .hero__base { animation: sobe .8s var(--quart) both; }
  .hero .h1 { animation-delay: .07s; } .hero__base { animation-delay: .14s; }
  .sanf__i { animation: sobe .9s var(--quart) both; }
  .sanf__i:nth-child(1) { animation-delay: .14s; } .sanf__i:nth-child(2) { animation-delay: .21s; } .sanf__i:nth-child(3) { animation-delay: .28s; } .sanf__i:nth-child(4) { animation-delay: .35s; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } .sanf__i { transition: none; } }
@media (max-height: 800px) and (min-width: 1200px) { .hero__tags { display: none; } .sanf { --alt: max(320px, calc(100svh - 424px)); } }
@media (max-width: 1199px) {
  .hero__base { flex-direction: column; align-items: flex-start; gap: 24px; }
  .sanf { --alt: max(360px, calc(100svh - 452px)); }
}
/* tablet em pé e celular: sanfona em pé; tocar abre a faixa */
@media (max-width: 900px) {
  .sanf { --vao: 8px; flex-direction: column; min-height: 0; }
  .sanf__i { flex: 0 0 56px; min-height: 56px; }
  .sanf__i.is-ativo { flex: 1 0 min(56vw, 460px); }
  .sanf__leg { left: 8px; bottom: 8px; }
  .sanf__pausa { top: 8px; left: 8px; right: auto; }
}
@media (max-width: 640px) {
  .hero { padding-top: calc(var(--hd-top) + var(--hd-h) + 24px); padding-bottom: 24px; }
  .hero__in { width: 100%; flex: 1 1 100%; padding-inline: var(--m); gap: 24px; }
  .hero__tags { display: none; }
  .hero__base { gap: 16px; margin-top: 0; }
  .hero__acao { flex-direction: column-reverse; align-items: stretch; gap: 16px; width: 100%; }
  .hero__cta { width: 100%; }
}

/* ---------- seções ---------- */
.sec { padding-block: var(--sec-y); }
.sec--cinza { background: var(--n100); }
.cab { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; max-width: 960px; }
.cab--centro { align-items: center; text-align: center; margin-inline: auto; }

/* ---------- 2 · antes e depois ---------- */
.ad { display: grid; grid-template-columns: 5fr 7fr; gap: var(--gap); margin-top: var(--cab-gap); align-items: stretch; }
.ad__lista { display: flex; flex-direction: column; gap: 8px; }
.ad__lista li { display: flex; flex: 1 0 auto; }
.ad__item { width: 100%; display: flex; flex-direction: column; justify-content: center; padding: 20px 24px; border-radius: var(--raio-in); text-align: left; transition: background-color .4s var(--quad); }
.ad__item:hover { background: var(--n150); }
.ad__item[aria-pressed=true] { background: #fff; }
.ad__tit { font-size: var(--fs-h4); font-weight: 500; line-height: 1.2; letter-spacing: -.008em; color: var(--n500); transition: color .25s var(--quad); }
.ad__item:hover .ad__tit, .ad__item[aria-pressed=true] .ad__tit { color: var(--n900); }
.ad__det { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .4s var(--quart); }
.ad__item[aria-pressed=true] .ad__det { grid-template-rows: 1fr; }
.ad__det-in { overflow: hidden; display: flex; flex-direction: column; gap: 12px; min-height: 0; }
.ad__p { display: block; padding-top: 12px; font-size: 16px; line-height: 1.45; color: var(--n600); }
.nq { white-space: nowrap; }
.ad__s { display: flex; gap: 8px; font-size: 16px; font-weight: 500; line-height: 1.45; color: var(--p700); }
.ad__s .ic { margin-top: 3px; }
.ad__palco { position: relative; aspect-ratio: 4 / 3; overflow: hidden; border-radius: var(--raio); background: var(--p200); isolation: isolate; --corte: 50%; }
.ad__dep, .ad__ant { position: absolute; inset: 0; }
.ad__ant { clip-path: inset(0 calc(100% - var(--corte)) 0 0); z-index: 1; background: var(--n300); }
.ad__dep video, .ad__ant img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity .4s var(--quad); }
.ad__dep video.on, .ad__ant img.on { opacity: 1; }
.ad__linha { position: absolute; top: 0; bottom: 0; left: var(--corte); z-index: 2; width: 2px; margin-left: -1px; background: #fff; pointer-events: none; }
.ad__alca { position: absolute; top: 50%; left: 50%; translate: -50% -50%; width: 48px; height: 48px; border-radius: 999px; display: grid; place-items: center; background: #fff; color: var(--n900); }
.ad__range { position: absolute; inset: 0; z-index: 3; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: ew-resize; touch-action: pan-y; }
.ad__palco:has(.ad__range:focus-visible) .ad__alca { outline: 2px solid var(--p700); outline-offset: 2px; }
.ad__chip { position: absolute; top: 16px; z-index: 2; display: flex; align-items: center; height: 32px; padding: 0 12px; border-radius: 999px; font-size: 14px; font-weight: 500; line-height: 1; white-space: nowrap; color: var(--n900); background: rgb(250 250 249 / .72); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); transition: opacity .25s var(--quad); }
.ad__chip--ant { left: 16px; } .ad__chip--dep { right: 16px; }
.ad__chip.off { opacity: 0; }
.ad__pausa { position: absolute; right: 16px; bottom: 16px; z-index: 4; }
.faixa { position: relative; overflow: hidden; display: flex; align-items: center; justify-content: space-between; gap: 32px; margin-top: var(--gap); padding: 48px; border-radius: var(--raio); background: var(--p700); color: #fff; isolation: isolate; }
.faixa__marca { position: absolute; right: -24px; top: 24px; width: 560px; aspect-ratio: 632 / 545; z-index: -1; background: #cc4a10; -webkit-mask: url(img/union-1.svg) center / contain no-repeat; mask: url(img/union-1.svg) center / contain no-repeat; }
.faixa__txt { display: flex; flex-direction: column; gap: 8px; }
.faixa__sub { font-size: var(--fs-lead); line-height: 1.4; color: var(--p100); }
.faixa__bt { flex: none; }
@media (max-width: 1024px) {
  .ad { grid-template-columns: 1fr; }
  .ad__palco { order: -1; }
  .ad__lista li { flex: none; }
  .faixa { flex-direction: column; align-items: flex-start; padding: 40px; }
  .faixa__marca { right: -80px; }
}
@media (max-width: 640px) {
  .ad__item { padding: 16px; }
  .ad__chip { top: 8px; } .ad__chip--ant { left: 8px; } .ad__chip--dep { right: 8px; }
  .ad__pausa { right: 8px; bottom: 8px; }
  .ad__alca { width: 40px; height: 40px; }
  .faixa { padding: 24px; gap: 24px; }
  .faixa__marca { display: none; }
  .faixa__bt { width: 100%; }
}

/* ---------- 3 · módulos: sem script é um trilho comum; a partir de 1025px os cards passam com a rolagem (SEC-05) ---------- */
.pin { padding-block: var(--sec-y); }
.pin__cab { display: flex; align-items: flex-end; justify-content: space-between; gap: 32px; }
.pin__cab .cab { flex: 1; min-width: 0; }
.nums { display: flex; flex: none; }
.nums li { display: flex; flex-direction: column; gap: 4px; padding-inline: 24px; font-size: 14px; font-weight: 500; line-height: 1; color: var(--n600); white-space: nowrap; }
.nums li + li { border-left: 1px solid var(--n200); }
.nums li:first-child { padding-left: 0; } .nums li:last-child { padding-right: 0; }
.nums b { font-size: var(--fs-h3); font-weight: 500; letter-spacing: -.012em; color: var(--n900); font-variant-numeric: tabular-nums; }
.pista { display: flex; gap: var(--gap); margin-top: var(--cab-gap); padding-inline: var(--m); scroll-padding-inline: var(--m); overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: none; cursor: grab; }
.pista::-webkit-scrollbar { display: none; }
.pista.is-arrasto { cursor: grabbing; scroll-snap-type: none; user-select: none; }
.pista.is-arrasto * { pointer-events: none; }
.pista:focus-visible { outline-offset: -2px; }
.mod { --mod-w: 400px; flex: none; width: var(--mod-w); display: flex; flex-direction: column; padding: 8px; border-radius: var(--raio); background: var(--n100); scroll-snap-align: start; }
.mod__img { aspect-ratio: 4 / 4.4; border-radius: var(--raio-in); }
.mod__n, .mod__tag { position: absolute; top: 12px; z-index: 1; display: flex; align-items: center; height: 32px; padding: 0 12px; border-radius: 999px; font-size: 14px; font-weight: 500; line-height: 1; color: var(--n900); background: rgb(250 250 249 / .72); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); }
.mod__n { left: 12px; font-variant-numeric: tabular-nums; } .mod__tag { right: 12px; }
.mod__det { display: flex; flex-direction: column; gap: 8px; padding: 16px; }
.mod__tit { font-size: var(--fs-h4); font-weight: 500; line-height: 1.2; letter-spacing: -.008em; min-height: 2.4em; text-wrap: balance; }
.setas { display: none; gap: 8px; flex: none; }
.seta { width: 40px; height: 40px; border-radius: 999px; display: grid; place-items: center; background: var(--n150); color: var(--n900); transition: background-color .25s var(--quad), opacity .25s var(--quad); }
.seta:hover:not(:disabled) { background: var(--n200); }
.seta:hover:not(:disabled) .ic { stroke-width: 3; }
.seta:disabled { opacity: .4; cursor: default; }
.pin:not(.is-pin) .setas { display: flex; }
/* preso à rolagem */
.pin.is-pin { padding-block: 0; }
.is-pin .pin__tela { position: sticky; top: 0; height: 100svh; overflow: clip; display: flex; flex-direction: column; justify-content: center; gap: 32px; padding-top: calc(var(--hd-top) + var(--hd-h) + 24px); padding-bottom: 24px; }
.is-pin .pin__cab { flex: none; }
.is-pin .pista { flex: 1 1 0; min-height: 0; width: max-content; margin-top: 0; overflow: visible; scroll-snap-type: none; cursor: auto; will-change: transform; }
.is-pin .mod { --mod-w: clamp(320px, calc((100svh - 372px) * .72), 520px); }
.is-pin .mod__img { aspect-ratio: auto; flex: 1 1 0; min-height: 0; }
.is-pin .pin__cab .h2 { --fs-h2: 48px; }
@media (max-height: 760px) { .is-pin .pin__cab .tag, .is-pin .nums { display: none; } .is-pin .mod__det { padding: 12px; } .is-pin .mod__tit { min-height: 0; } .is-pin .mod .t-corpo { display: none; } }
@media (max-width: 1024px) { .nums { display: none; } }
@media (max-width: 640px) { .pin__cab { flex-wrap: wrap; gap: 16px; } .pin__cab .cab { flex: 1 1 100%; } .mod { --mod-w: 280px; } }

/* ---------- 4 · depoimentos (aprovado: só o acabamento novo) ---------- */
.deps { display: flex; gap: var(--gap); align-items: flex-start; margin-top: var(--cab-gap); }
.dep { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: 24px; }
.dep--1 .dep__img { height: 479px; } .dep--2 .dep__img { height: 634px; } .dep--3 .dep__img { height: 529px; }
.dep__img > img { object-position: center 30%; }
.dep__txt { display: flex; flex-direction: column; gap: 12px; }
.dep__cit { font-size: 20px; line-height: 1.45; color: var(--n600); }
.dep__nome { font-size: 15px; font-weight: 500; line-height: 1.4; color: var(--p700); }
@media (max-width: 1024px) {
  .deps { flex-direction: column; gap: 24px; }
  .dep { flex-direction: row; gap: 32px; width: 100%; }
  .dep__img { flex: 1 1 0; } .dep__txt { flex: 1 1 0; justify-content: center; }
  .dep--1 .dep__img, .dep--2 .dep__img, .dep--3 .dep__img { height: 440px; }
}
@media (max-width: 640px) {
  .deps { gap: 40px; }
  .dep { flex-direction: column; gap: 16px; }
  .dep__img { flex: none; width: 100%; }
  .dep--1 .dep__img, .dep--2 .dep__img, .dep--3 .dep__img { height: 400px; }
  .dep__cit { font-size: 18px; }
}

/* ---------- 5 · a conta do ano ---------- */
.dif { color: var(--p700); font-variant-numeric: tabular-nums; }
.calc { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--gap); margin-top: var(--cab-gap); }
.calc__ctl { display: flex; flex-direction: column; gap: 32px; padding: 24px; border-radius: var(--raio); background: var(--p50); }
.ctl { display: flex; flex-direction: column; gap: 16px; }
.ctl__top { display: flex; flex-direction: column; gap: 8px; font-size: 16px; line-height: 1.3; color: var(--n600); }
.ctl__top output { font-size: var(--fs-h3); font-weight: 500; line-height: 1; letter-spacing: -.012em; color: var(--n900); font-variant-numeric: tabular-nums; }
.reg { --v: 50%; -webkit-appearance: none; appearance: none; width: 100%; height: 24px; margin: 0; background: none; cursor: pointer; touch-action: pan-y; }
.reg::-webkit-slider-runnable-track { height: 4px; border-radius: 999px; background: linear-gradient(90deg, var(--p650) var(--v), var(--p200) var(--v)); }
.reg::-moz-range-track { height: 4px; border-radius: 999px; background: linear-gradient(90deg, var(--p650) var(--v), var(--p200) var(--v)); }
.reg::-webkit-slider-thumb { -webkit-appearance: none; width: 24px; height: 24px; margin-top: -10px; border: 0; border-radius: 50%; background: var(--p650); transition: background-color .25s var(--quad); }
.reg::-moz-range-thumb { width: 24px; height: 24px; border: 0; border-radius: 50%; background: var(--p650); }
.reg:hover::-webkit-slider-thumb { background: var(--p800); }
.calc__sobra { display: flex; flex-direction: column; gap: 8px; margin-top: auto; padding-top: 24px; border-top: 1px solid var(--p200); font-size: 16px; line-height: 1.3; color: var(--n600); }
.calc__sobra b { font-size: var(--fs-h2); font-weight: 500; line-height: 1; letter-spacing: -.02em; color: var(--p700); font-variant-numeric: tabular-nums; }
.calc__nota { font-size: 14px; line-height: 1.45; color: var(--n600); }
.cmp { display: flex; flex-direction: column; padding: 8px; border-radius: var(--raio); background: var(--n100); }
.cmp__img { aspect-ratio: 16 / 10; border-radius: var(--raio-in); }
.cmp__txt { display: flex; flex-direction: column; gap: 16px; padding: 16px; flex: 1; }
.cmp__tit { font-size: var(--fs-h4); font-weight: 500; line-height: 1.2; letter-spacing: -.008em; }
.cmp__l { display: flex; flex-direction: column; }
.cmp__l > div { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-block: 12px; font-size: 16px; line-height: 1; }
.cmp__l > div:first-child { padding-top: 0; } .cmp__l > div:last-child { padding-bottom: 0; }
.cmp__l > div + div { border-top: 1px solid var(--n200); }
.cmp__l dt { color: var(--n600); } .cmp__l dd { font-weight: 500; font-variant-numeric: tabular-nums; }
.total { display: flex; align-items: center; gap: 8px; margin-top: auto; padding-top: 8px; font-size: 16px; line-height: 1; }
.total b { font-size: var(--fs-h3); font-weight: 500; letter-spacing: -.012em; font-variant-numeric: tabular-nums; }
.total--mal { color: var(--r300); } .total--bem { color: var(--g300); }
@media (max-width: 1024px) {
  .calc { grid-template-columns: 1fr 1fr; }
  .calc__ctl { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; gap: 24px 32px; }
  .calc__sobra, .calc__nota { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
  .calc { grid-template-columns: 1fr; }
  .calc__ctl { grid-template-columns: 1fr; padding: 16px; }
}

/* ---------- 6 · oferta: a comanda sobre a quebra escura ---------- */
.oferta { padding-block: var(--sec-y); background: var(--n900); color: var(--n50); }
.oferta__g { display: grid; grid-template-columns: 1fr 520px; gap: 80px; align-items: center; }
.oferta__txt { display: flex; flex-direction: column; gap: 40px; }
.prova { display: flex; align-items: center; gap: 12px; }
.prova__av { display: flex; flex: none; }
.prova__av li { width: 40px; height: 40px; margin-right: -8px; border-radius: 50%; background: var(--n200); outline: 2px solid var(--n50); position: relative; }
.prova__av li:last-child { margin-right: 0; }
.prova__av img { width: 100%; height: 100%; border-radius: 50%; }
.prova__txt { display: flex; flex-direction: column; gap: 8px; }
.prova__est { display: flex; gap: 2px; color: var(--star); }
.prova__n { font-size: 14px; font-weight: 500; line-height: 1; color: var(--n600); white-space: nowrap; }
.oferta .prova__av li { outline-color: var(--n900); background: var(--n800); }
.oferta .prova__n { color: var(--n300); }
.selos { display: flex; flex-direction: column; }
.selos li { display: flex; gap: 16px; padding-block: 24px; }
.selos li:first-child { padding-top: 0; } .selos li:last-child { padding-bottom: 0; }
.selos li + li { border-top: 1px solid rgb(255 255 255 / .08); }
.selos .ic { color: var(--p400); margin-top: 2px; }
.selos h3 { font-size: var(--fs-h4); font-weight: 500; line-height: 1.2; letter-spacing: -.008em; }
.selos p { margin-top: 8px; font-size: 16px; line-height: 1.45; color: var(--n300); max-width: 520px; }
.comanda { display: flex; flex-direction: column; padding: 32px 32px 48px; background: var(--p50); color: var(--n900); border-radius: var(--raio) var(--raio) 0 0;
  -webkit-mask: conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) 50% / 20px 100%; mask: conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) 50% / 20px 100%; }
.comanda__topo { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.comanda__topo img { width: 171px; height: 24px; }
.comanda__topo p { font-size: 14px; font-weight: 500; line-height: 1; color: var(--n600); }
.comanda__tit { margin-top: 32px; font-size: var(--fs-h4); font-weight: 500; line-height: 1.2; letter-spacing: -.008em; }
.comanda__l { display: flex; flex-direction: column; gap: 12px; margin-top: 16px; font-size: 16px; line-height: 1.2; color: var(--n600); }
.comanda__l li { display: flex; align-items: baseline; gap: 8px; }
.comanda__l i { flex: 1; min-width: 16px; border-bottom: 1.5px dotted var(--n400); translate: 0 -3px; }
.comanda__l span:last-child { flex: none; font-weight: 500; color: var(--p700); }
.comanda__tot { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; margin-top: 24px; padding-top: 24px; border-top: 1.5px dashed var(--n400); }
.comanda__de { font-size: 16px; font-weight: 500; line-height: 1; color: var(--n600); }
.comanda__de s { text-decoration-thickness: 1.5px; }
.comanda__num { font-size: 80px; font-weight: 600; line-height: 1; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.comanda .bt { margin-top: 24px; }
.comanda__nota { margin-top: 12px; font-size: 14px; font-weight: 500; line-height: 1; color: var(--n600); }
@media (min-width: 1025px) { .oferta .h2 { --fs-h2: clamp(40px, 3.4vw, 56px); } }
@media (max-width: 1199px) { .oferta__g { grid-template-columns: 1fr 460px; gap: 48px; } }
@media (max-width: 1024px) { .oferta__g { grid-template-columns: 1fr; gap: 40px; } .comanda { max-width: 520px; width: 100%; } }
@media (max-width: 640px) {
  .comanda { padding: 24px 16px 40px; }
  .comanda__num { font-size: 64px; }
  .comanda__l { font-size: 15px; }
}
@media (max-width: 374px) { :root { --fs-h1: 32px; } .prova__av li { width: 32px; height: 32px; } }
@media (max-width: 400px) { .rod .rod__cols { grid-template-columns: 1fr; } .rod .rod__col--redes { grid-column: auto; } }

/* ---------- 7 · dúvidas: lista à direita, imagem acompanha a pergunta ---------- */
.duv { display: grid; grid-template-columns: 5fr 7fr; gap: 80px; align-items: start; }
.faq + .faq { border-top: 1px solid var(--n200); }
.faq__q { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-block: 24px; font-size: var(--fs-h4); font-weight: 500; line-height: 1.25; letter-spacing: -.008em; cursor: pointer; list-style: none; transition: color .25s var(--quad); }
.faq__q::-webkit-details-marker { display: none; }
.faq:first-child .faq__q { padding-top: 0; }
.faq__q:hover { color: var(--p700); }
.faq__ic { flex: none; color: var(--p700); transition: transform .25s var(--quart); }
.faq__ic .ic { display: block; }
.faq[open] .faq__ic { transform: rotate(45deg); }
.faq__r { padding-bottom: 24px; padding-right: 48px; font-size: 18px; line-height: 1.5; color: var(--n600); }
.faq:last-child[open] .faq__r { padding-bottom: 0; }
.faq:last-child:not([open]) .faq__q { padding-bottom: 0; }
@keyframes faq-sobe { from { opacity: 0; translate: 0 6px; } }
@media (prefers-reduced-motion: no-preference) { .faq[open] .faq__r { animation: faq-sobe .25s var(--quart); } }
@media (max-width: 1024px) { .duv { grid-template-columns: 1fr; gap: 40px; } }
@media (max-width: 640px) { .faq__r { font-size: 16px; padding-right: 0; } .faq__q { gap: 16px; padding-block: 20px; } }

/* ---------- rodapé: mapa em colunas + logo gigante sangrando (BLO-13) ---------- */
.rod { position: relative; overflow: clip; background: var(--n900); color: var(--n50); padding-top: 80px; }
.rod__cta { display: flex; align-items: center; justify-content: space-between; gap: 32px; padding: 48px; border-radius: var(--raio); background: var(--n850); }
.rod__cta .bt { flex: none; }
.rod__cols { display: grid; grid-template-columns: repeat(4, 1fr); gap: 32px; padding-block: 64px 48px; }
.rod__col { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; font-size: 16px; line-height: 1.2; }
.rod__col h2 { margin-bottom: 4px; font-size: 14px; font-weight: 500; line-height: 1; color: var(--n400); }
.rod__col a { color: var(--n200); transition: color .25s var(--quad); }
.rod__col a:hover { color: #fff; }
.rod__redes { display: flex; gap: 8px; }
.rede { width: 48px; height: 48px; border-radius: 12px; display: grid; place-items: center; background: var(--n800); color: var(--n50); transition: background-color .25s var(--quad); }
.rede:hover { background: #38322f; }
.rede:hover .ic { stroke-width: 2.25; }
.rod__base { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-block: 24px; border-top: 1px solid rgb(255 255 255 / .08); font-size: 14px; line-height: 1.2; color: var(--n400); }
.credito { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 12px; max-width: 100%; color: var(--n200); transition: color .25s var(--quad); }
.credito span { color: var(--n400); }
.credito:hover { color: #fff; }
.credito img { width: 288px; max-width: 100%; height: auto; transition: opacity .25s var(--quad); }
.credito:hover img { opacity: .8; }
.rod__logo { width: 100%; aspect-ratio: 228 / 32; margin-top: 16px; margin-bottom: -1.2vw; background: var(--n850); -webkit-mask: url(img/logo.svg) center / 100% auto no-repeat; mask: url(img/logo.svg) center / 100% auto no-repeat; }
@media (max-width: 1024px) { .rod__cols { grid-template-columns: repeat(3, 1fr); } .rod__col--redes { grid-column: 1 / -1; } .rod__cta { padding: 40px; } }
@media (max-width: 640px) {
  .rod { padding-top: 40px; }
  .rod__cta { flex-direction: column; align-items: stretch; padding: 24px; gap: 24px; }
  .rod__cols { grid-template-columns: 1fr 1fr; gap: 32px 16px; padding-block: 40px 32px; }
  .rod__col--redes { grid-column: 1 / -1; }
  .rod__base { flex-direction: column; align-items: flex-start; gap: 16px; }
}

/* ---------- entrada ao rolar: sobe 12px, em cascata (MOV-04) ---------- */
@media (prefers-reduced-motion: no-preference) {
  .js .rv { opacity: 0; translate: 0 12px; transition: opacity .8s var(--quart) var(--atraso, 0s), translate .8s var(--quart) var(--atraso, 0s); }
  .js .rv.in { opacity: 1; translate: 0 0; }
}
@media (max-width: 640px) { .js .rv { translate: 0 8px; } }

/* ---------- aviso de demonstração ---------- */
.aviso { border: 0; padding: 0; background: none; color: var(--n900); max-width: calc(100vw - 32px); }
.aviso::backdrop { background: rgb(28 25 23 / .45); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
@keyframes av-entra { from { opacity: 0; transform: translateY(12px); } }
.aviso[open] .aviso__in { animation: av-entra .25s var(--quart); }
.aviso__in { position: relative; width: 440px; max-width: 100%; display: flex; flex-direction: column; gap: 24px; padding: 32px; border-radius: var(--raio); background: var(--p50); }
.aviso__txt { display: flex; flex-direction: column; gap: 12px; }
.aviso__tit { font-size: 24px; font-weight: 500; line-height: 1.2; }
.aviso__acoes { display: flex; flex-wrap: wrap; gap: 8px; }
.aviso__x { position: absolute; top: 20px; right: 20px; width: 40px; height: 40px; border-radius: 999px; display: grid; place-items: center; color: var(--n600); transition: background-color .25s var(--quad); }
.aviso__x:hover { background: var(--p100); }
@media (max-width: 640px) { .aviso__in { padding: 24px; } .aviso__acoes .bt { width: 100%; } }

/* imagem só aparece inteira (imagem-inteira.js) */
.img-esp img:not(.img-ok):not([src$=".svg"]) { visibility: hidden; }

/* área de toque de 40px nos links do rodapé, sem mudar o desenho (CTL-09) */
@media (max-width: 767px) {
  .rod__col a { position: relative; }
  .rod__col a::after { content: ""; position: absolute; inset: -12px 0; }
}