/* Samuel Transportes e Mudanças — site de produção
   Espaçamento: valores de celular (390px) crescendo com clamp() até os do design no PC (1440px). */

:root {
  --bg: #0A1424;
  --bg2: #070F1C;
  --navy: #1C3354;
  --steel: #C9D2DC;
  /* destaque em prata metálico, no tom da logo (o nome da variável ficou o mesmo) */
  --amber: #D5DCE4;
  --wa: #25D366;
  --white: #F2F5F8;
  --muted: #AEB9C6;
  --dim: #8B98A8;
  --soft: #DCE3EA;
  --ink: #0A1424;
  --ink2: #2B3B52;
  --line: rgba(201, 210, 220, .2);
  --line-soft: rgba(201, 210, 220, .12);
  --cond: 'Barlow Condensed', 'Arial Narrow', sans-serif;
  --sans: Barlow, system-ui, -apple-system, sans-serif;
  --mono: 'JetBrains Mono', ui-monospace, monospace;
  /* margem lateral: 20px em 390px, ~18px em 360px, 56px no PC */
  --g: clamp(16px, 5.13vw, 56px);
  /* título → texto: 14px no celular, 24px no PC */
  --t-gap: clamp(14px, calc(.952vw + 10.29px), 24px);
  /* entre blocos dentro de uma seção */
  --block: clamp(64px, calc(7.24vw + 35.77px), 140px);
  --hdr-h: 80px;
}

*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; background: var(--bg); color: var(--steel); -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
html { scroll-padding-top: var(--hdr-h); }
body { overflow-x: hidden; font-family: var(--sans); font-size: 16px; line-height: 1.5; -webkit-font-smoothing: antialiased; }
@supports (overflow: clip) { body { overflow-x: clip; } }
img, svg, video, canvas, iframe { display: block; }
img { max-width: 100%; }
a { color: var(--amber); text-decoration: none; -webkit-tap-highlight-color: rgba(213, 220, 228, .2); }
button { -webkit-tap-highlight-color: rgba(213, 220, 228, .2); }
::selection { background: var(--amber); color: var(--ink); }
input, select, button, textarea { font-family: inherit; }
input[type=date] { color-scheme: dark; }
h1, h2, h3 { overflow-wrap: normal; word-break: normal; hyphens: manual; }
[hidden] { display: none !important; }
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain; }
.lenis.lenis-stopped { overflow: hidden; }
:focus-visible { outline: 2px solid var(--amber); outline-offset: 3px; }

.amber { color: var(--amber); }
.dim { color: var(--dim); }
.it { font-style: italic; }
.defs { position: absolute; width: 0; height: 0; overflow: hidden; }
.sr-only { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.skip { position: fixed; left: var(--g); top: 8px; z-index: 300; padding: 14px 18px; background: var(--amber); color: var(--ink); font-weight: 700; transform: translateY(-150%); }
.skip:focus { transform: none; }

.wrap { width: 100%; max-width: calc(1360px + 2 * var(--g)); margin-inline: auto; padding-inline: var(--g); }

.mono-tag { font-family: var(--mono); font-size: 12px; letter-spacing: .2em; color: var(--amber); }
.mono-tag--ink { color: var(--ink); margin: 0; }
.mono-11 { font-family: var(--mono); font-size: 11px; letter-spacing: .18em; }
.mono-xs { font-family: var(--mono); font-size: 11px; letter-spacing: .18em; color: var(--dim); margin-bottom: 6px; }
.mono-sm { font-family: var(--mono); font-size: 12px; letter-spacing: .16em; color: var(--dim); }
.mono-lbl { font-family: var(--mono); font-size: 12px; letter-spacing: .2em; color: var(--dim); }

/* ---------- preloader ---------- */
.pre { display: none; }
.js .pre {
  position: fixed; inset: 0; z-index: 200; background: var(--bg);
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 28px;
  transition: opacity .7s ease, transform .9s cubic-bezier(.7, 0, .2, 1);
  animation: preSafety .6s 10s forwards;
}
.pre.is-done { opacity: 0; transform: translateY(-3%); pointer-events: none; }
@keyframes preSafety { to { opacity: 0; visibility: hidden; } }
.pre-pct { display: flex; align-items: baseline; gap: 10px; font-family: var(--cond); color: var(--steel); }
.pre-pct span:first-child { font-size: 56px; font-weight: 700; letter-spacing: -.01em; min-width: 2.2ch; text-align: right; font-variant-numeric: tabular-nums; }
.pre-pct span:last-child { font-size: 22px; color: var(--amber); }
.pre-bar { width: 160px; height: 1px; background: rgba(201, 210, 220, .18); overflow: hidden; }
.pre-bar div { height: 1px; background: var(--amber); transform-origin: 0 50%; transform: scaleX(0); }
.pre-lbl { font-family: var(--mono); font-size: 11px; letter-spacing: .2em; color: var(--dim); text-transform: uppercase; }

/* ---------- 3D ---------- */
.gl { position: fixed; top: 0; left: 0; width: 100%; height: 100vh; height: 100svh; z-index: 0; pointer-events: none; }

/* ---------- cabeçalho ---------- */
.hdr {
  position: fixed; top: 0; left: 0; right: 0; z-index: 60; isolation: isolate;
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 14px clamp(16px, 5.13vw, 40px);
  background: linear-gradient(#0A1424 30%, rgba(10, 20, 36, 0));
}
.hdr::before { content: ''; position: absolute; inset: 0; z-index: -1; background: #0A1424; box-shadow: 0 6px 24px -10px rgba(0, 0, 0, .65); opacity: 0; transition: opacity .3s; }
.hdr.is-solid::before { opacity: 1; }
.brand { display: flex; align-items: center; gap: 12px; color: var(--steel); min-width: 0; }
.brand-logo { flex: none; height: 52px; width: auto; object-fit: contain; filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .7)); }
.hdr-actions { display: flex; align-items: center; gap: 10px; flex: none; }
.hdr-wa { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 10px 16px; border: 1px solid rgba(37, 211, 102, .7); color: var(--wa); font: 600 13px var(--sans); letter-spacing: .08em; text-transform: uppercase; border-radius: 2px; }
.hdr-wa .ico { display: none; }
.hdr-menu { display: flex; align-items: center; justify-content: center; gap: 10px; height: 40px; padding: 0 14px; background: var(--navy); border: 0; color: var(--steel); font: 600 13px var(--sans); letter-spacing: .12em; text-transform: uppercase; cursor: pointer; border-radius: 2px; }
.bars { display: flex; flex-direction: column; gap: 4px; }
.bars span { display: block; width: 18px; height: 2px; background: var(--steel); }
.bars span + span { width: 12px; background: var(--amber); }
.hdr-wa:active, .hdr-wa:focus-visible { background: var(--wa); color: var(--ink); }
@media (hover: hover) { .hdr-wa:hover { background: var(--wa); color: var(--ink); } .hdr-menu:hover { background: #24406A; } }
.hdr-menu:active { background: #24406A; }

/* ---------- menu ---------- */
.menu { position: fixed; inset: 0; z-index: 80; background: var(--bg); display: flex; flex-direction: column; padding: 20px var(--g); overflow: auto; overscroll-behavior: contain; animation: fadeIn .35s ease; }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
.menu-top { display: flex; justify-content: space-between; align-items: center; }
.menu-close { min-height: 48px; padding: 0 18px; background: var(--amber); color: var(--ink); border: 0; font: 600 13px var(--sans); letter-spacing: .12em; text-transform: uppercase; cursor: pointer; border-radius: 2px; }
.menu-nav { display: flex; flex-direction: column; gap: 2px; margin-top: 6vh; }
.menu-nav a { display: flex; align-items: baseline; gap: 18px; padding: 10px 0; border-bottom: 1px solid var(--line-soft); color: var(--steel); font-family: var(--cond); font-weight: 700; text-transform: uppercase; font-size: clamp(34px, 6vw, 72px); line-height: 1; letter-spacing: -.01em; transition: transform .35s cubic-bezier(.2, .8, .2, 1); }
.menu-nav a span { font-family: var(--mono); font-size: 13px; color: var(--amber); font-weight: 400; }
.menu-nav a:active, .menu-nav a:focus-visible { color: var(--amber); transform: translateX(14px); }
@media (hover: hover) { .menu-nav a:hover { color: var(--amber); transform: translateX(14px); } }
.menu-foot { margin-top: auto; padding-top: 32px; display: flex; flex-wrap: wrap; gap: 12px 32px; font-size: 15px; color: var(--dim); }

/* ---------- botões ---------- */
.btn { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 16px; min-height: 48px; padding: 18px 24px; font: 700 15px var(--sans); letter-spacing: .06em; text-transform: uppercase; border-radius: 2px; transition: transform .3s cubic-bezier(.2, .8, .2, 1); }
.btn::after { content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; opacity: 0; transition: opacity .3s; box-shadow: 0 0 0 6px rgba(213, 220, 228, .16), 0 22px 40px -14px rgba(213, 220, 228, .7); }
.btn-amber { background: var(--amber); color: var(--ink); }
.btn-amber .arr { font-size: 18px; }
.btn.btn-wa { background: var(--wa); color: var(--ink); }
.btn.btn-wa::after { box-shadow: 0 0 0 6px rgba(37, 211, 102, .16), 0 22px 40px -14px rgba(37, 211, 102, .7); }
.btn-ghost { padding: 18px 22px; gap: 12px; border: 1px solid rgba(201, 210, 220, .45); color: var(--steel); font-weight: 600; }
.btn-ghost::after { box-shadow: none; }
.btn-sm { align-self: flex-start; padding: 14px 20px; font-size: 14px; letter-spacing: .08em; }
.btn-dark { padding: 20px 28px; background: var(--ink); color: var(--white); font-size: 16px; }
.btn-dark::after { box-shadow: 0 0 0 6px rgba(10, 20, 36, .18); }
.btn-ink { padding: 20px 24px; border: 1.5px solid var(--ink); color: var(--ink); font-size: 16px; }
.btn-ink::after { box-shadow: none; }
.btn-amber:active, .btn-dark:active, .btn-amber:focus-visible, .btn-dark:focus-visible { transform: translateY(-2px); }
.btn-amber:active::after, .btn-dark:active::after { opacity: 1; }
.btn-ghost:active, .btn-ghost:focus-visible { border-color: var(--amber); color: var(--amber); background: rgba(213, 220, 228, .06); }
.btn-dark:active { color: var(--amber); }
.btn-dark.btn-wa:active { color: var(--ink); }
.btn-ink:active, .btn-ink:focus-visible { background: var(--ink); color: var(--amber); }
@media (hover: hover) {
  .btn-amber:hover, .btn-dark:hover { transform: translateY(-2px); }
  .btn-amber:hover::after, .btn-dark:hover::after { opacity: 1; }
  .btn-ghost:hover { border-color: var(--amber); color: var(--amber); background: rgba(213, 220, 228, .06); }
  .btn-dark:hover { color: var(--amber); }
  .btn-dark.btn-wa:hover { color: var(--ink); }
  .btn-ink:hover { background: var(--ink); color: var(--amber); }
}

/* ---------- hero ---------- */
.hero { position: relative; z-index: 1; height: 210vh; height: 210svh; }
.hero-pin { position: sticky; top: 0; height: 100vh; height: 100svh; overflow: hidden; display: flex; align-items: flex-start; }
.hero-shade { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(165deg, rgba(10, 20, 36, .92) 8%, rgba(10, 20, 36, .45) 45%, rgba(10, 20, 36, 0) 70%); }
.hero-inner { position: relative; padding-top: clamp(96px, 16svh, 170px); padding-bottom: 40px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 520px), 1fr)); }
.hero-slot { display: none; }
.hero-col { min-width: 0; display: flex; flex-direction: column; gap: clamp(16px, calc(.571vw + 13.77px), 22px); max-width: 620px; }
.eyebrow { display: flex; align-items: center; gap: 12px; font-family: var(--mono); font-size: 12px; letter-spacing: .18em; color: var(--amber); text-transform: uppercase; }
.eyebrow .dash { flex: none; width: 28px; height: 1px; background: var(--amber); }
.hero-h1 { margin: 0; font-family: var(--cond); font-weight: 800; text-transform: uppercase; font-size: clamp(52px, 8.4vw, 128px); line-height: .86; letter-spacing: -.015em; color: var(--steel); text-wrap: balance; }
.hero-slogan { margin: 0; font-family: var(--cond); font-weight: 700; font-style: italic; font-size: clamp(22px, 2.2vw, 32px); line-height: 1.1; letter-spacing: .01em; color: var(--white); }
.hero-p { margin: 0; max-width: 470px; font-size: clamp(16px, 1.4vw, 19px); line-height: 1.5; color: var(--muted); text-wrap: pretty; }
.hero-ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 6px; }
.hero-chips { list-style: none; margin: 14px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.hero-chips li { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; min-width: 0; max-width: 100%; padding: 8px 12px; background: rgba(28, 51, 84, .75); border: 1px solid rgba(201, 210, 220, .16); font-size: 14px; color: var(--soft); }
.hero-chips b { font-weight: 600; }
.dot-green { width: 7px; height: 7px; border-radius: 50%; background: #5BD08A; }
.hero-end { position: absolute; left: 0; right: 0; bottom: 7svh; display: flex; justify-content: center; opacity: 0; pointer-events: none; }
.hero-end div { font-family: var(--cond); font-weight: 700; text-transform: uppercase; letter-spacing: .2em; font-size: clamp(14px, 1.4vw, 18px); color: var(--amber); background: rgba(10, 20, 36, .8); padding: 10px 16px; text-align: center; }
.hero-scroll { position: absolute; right: var(--g); bottom: 24px; display: flex; align-items: center; gap: 10px; font-family: var(--mono); font-size: 11px; letter-spacing: .2em; color: var(--dim); }
.hero-scroll span { width: 1px; height: 34px; background: linear-gradient(var(--amber), transparent); }

/* ---------- história na rolagem ---------- */
.story { position: relative; z-index: 1; height: 300vh; height: 300svh; }
.story-pin { position: sticky; top: 0; height: 100vh; height: 100svh; overflow: hidden; background: #020C1C; }
.story-canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
.story-shade { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(170deg, rgba(10, 20, 36, .85) 5%, rgba(10, 20, 36, 0) 50%); }
.story-inner { position: relative; height: 100%; padding-top: clamp(84px, 13svh, 140px); display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 520px), 1fr)); align-content: start; }
.story-col { position: relative; max-width: 520px; }
.story-ticks { display: flex; gap: 6px; margin-bottom: 22px; }
.story-ticks span { flex: 1; height: 2px; background: rgba(201, 210, 220, .18); overflow: hidden; }
.story-ticks i { display: block; height: 100%; background: var(--amber); transform-origin: 0 50%; transform: scaleX(0); }
.story-chs { position: relative; min-height: clamp(230px, 34svh, 330px); }
.story-ch { position: absolute; inset: 0 0 auto 0; opacity: 0; pointer-events: none; }
.story-ch.is-on { opacity: 1; pointer-events: auto; }
.story-ch h2 { margin: 10px 0 0; font-family: var(--cond); font-weight: 800; text-transform: uppercase; font-size: clamp(44px, 6.4vw, 96px); line-height: .88; letter-spacing: -.01em; color: var(--steel); }
.story-ch p { margin: 16px 0 0; max-width: 400px; font-size: 17px; line-height: 1.5; color: var(--muted); }
.story-cta { margin-top: 22px; padding: 16px 22px; gap: 14px; opacity: 0; transform: translateY(14px); pointer-events: none; transition: opacity .5s, transform .5s cubic-bezier(.2, .8, .2, 1); }
.story-cta.is-on { opacity: 1; transform: none; pointer-events: auto; }

/* ---------- seções ---------- */
.sec { position: relative; z-index: 1; background: var(--bg); scroll-margin-top: 60px; }
.head-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); gap: var(--t-gap) 64px; align-items: end; }
.servicos .head-grid { display: flex; flex-wrap: wrap; justify-content: space-between; }
.lead { margin: 0; max-width: 440px; font-size: 18px; line-height: 1.55; color: var(--muted); text-wrap: pretty; }
.lead--ink { max-width: 420px; color: var(--ink2); }
.lead--17 { font-size: 17px; max-width: 430px; }
.h-giant, .h-big, .h-xl, .h-lg, .h-contato { margin: 0; font-family: var(--cond); font-weight: 800; text-transform: uppercase; }
.h-giant { font-size: clamp(64px, 13vw, 200px); line-height: .8; letter-spacing: -.02em; }
.h-big { font-size: clamp(44px, 7vw, 104px); line-height: .85; letter-spacing: -.015em; }
.h-xl { font-size: clamp(52px, 8vw, 124px); line-height: .84; letter-spacing: -.015em; }
.h-lg { font-size: clamp(48px, 6.6vw, 100px); line-height: .85; letter-spacing: -.015em; }
.sign { flex: none; width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid rgba(213, 220, 228, .6); color: var(--amber); font-size: 18px; line-height: 1; }

/* serviços */
.servicos { padding: clamp(40px, calc(11.43vw - 4.57px), 160px) 0 clamp(40px, calc(7.62vw + 10.29px), 120px); }
.serv-list { margin-top: clamp(32px, calc(2.29vw + 23.09px), 56px); border-top: 1px solid var(--line); }
.serv { border-bottom: 1px solid var(--line); }
@media (hover: hover) { .serv:hover { background: rgba(28, 51, 84, .35); } }
.serv-h { margin: 0; font: inherit; }
.serv-btn { display: none; }
.serv-body { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); gap: 12px 36px; padding: 28px 0; }
.serv-head { display: flex; gap: 16px; align-items: baseline; }
.serv-head h3 { margin: 0; font-family: var(--cond); font-weight: 700; text-transform: uppercase; font-size: clamp(26px, 2.6vw, 36px); line-height: .95; color: var(--white); }
.num { font-family: var(--mono); font-size: 12px; color: var(--amber); }
.serv-body p { margin: 0; font-size: 15px; line-height: 1.5; color: var(--steel); }

.cuidado { margin-top: var(--block); display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 360px), 1fr)); gap: 20px; }
.cuidado-head { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 20px; }
.photo { margin: 0; border: 1px solid rgba(213, 220, 228, .6); padding: 5px; }
.photo figcaption { padding: 8px 2px 2px; font-family: var(--mono); font-size: 11px; letter-spacing: .12em; color: var(--muted); text-transform: uppercase; }
.photo--small { width: min(220px, 46vw); }
.tint { position: relative; overflow: hidden; cursor: pointer; }
.tint img, .tint video { width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.12); }
.tint::before { content: ''; position: absolute; inset: 0; z-index: 1; background: linear-gradient(160deg, #1C3354 25%, #8E9AA8 130%); mix-blend-mode: color; opacity: .7; transition: opacity .4s; pointer-events: none; }
.tint::after { content: ''; position: absolute; inset: 0; z-index: 2; background-image: url(../assets/img/grain.svg); opacity: .4; mix-blend-mode: overlay; pointer-events: none; }
.photo--small .tint img { filter: grayscale(1) contrast(1.12) brightness(.95); }
.photo--small .tint::before { opacity: .75; }
.tint.is-on::before { opacity: .2; }
.mosaic .tint video { position: absolute; inset: 0; }
.video-toggle { position: absolute; right: 6px; bottom: 6px; z-index: 3; width: 44px; height: 44px; display: grid; place-items: center; padding: 0; background: rgba(10, 20, 36, .72); border: 1px solid rgba(213, 220, 228, .6); border-radius: 2px; cursor: pointer; transition: background-color .3s; }
.video-toggle span { width: 0; height: 0; margin-left: 3px; border-style: solid; border-width: 7px 0 7px 12px; border-color: transparent transparent transparent var(--amber); }
.video-toggle.is-playing span { width: 12px; height: 14px; margin-left: 0; border-width: 0 4px; border-color: var(--amber); }
.video-toggle.is-bloqueado { inset: 0; width: 64px; height: 64px; margin: auto; }
.video-toggle.is-bloqueado span { margin-left: 5px; border-width: 11px 0 11px 18px; }
.video-toggle:active { background: var(--navy); }
@media (hover: hover) { .video-toggle:hover { background: var(--navy); } }
@media (hover: hover) { .tint:hover::before { opacity: .2; } .photo--small .tint:hover::before { opacity: .25; } }
.card { --pad: clamp(22px, 3vw, 44px); background: var(--navy); padding: var(--pad); display: flex; flex-direction: column; gap: 18px; min-height: 340px; }
.card--line { background: none; border: 1px solid rgba(201, 210, 220, .25); margin-top: clamp(0px, 6vw, 80px); }
/* mídia no topo do card, de borda a borda e em cor real; a proporção larga segura o comprimento da página no celular */
.card-media { position: relative; flex: none; margin: calc(-1 * var(--pad)) calc(-1 * var(--pad)) 0; aspect-ratio: 2.35 / 1; overflow: hidden; background: var(--bg2); }
.card-media video, .card-media img { width: 100%; height: 100%; object-fit: cover; }
.card-media video { object-position: 50% 40%; }
.card-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.card-top h3 { margin: 0; font-family: var(--cond); font-weight: 700; text-transform: uppercase; font-size: clamp(30px, 3vw, 44px); line-height: .92; color: var(--white); }
.card-code { font-family: var(--cond); font-weight: 800; font-size: 64px; line-height: .8; color: rgba(213, 220, 228, .9); }
.card-code--dim { color: rgba(201, 210, 220, .5); }
.card p { margin: 0; font-size: 16px; line-height: 1.55; color: var(--steel); }
.card b { color: var(--white); font-weight: 600; }
.card .card-foot { margin: auto 0 0; padding-top: 16px; border-top: 1px solid var(--line); color: var(--amber); }

.extras { margin-top: var(--block); }
.extras-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 16px; margin-bottom: clamp(20px, calc(.762vw + 17.03px), 28px); }
.extras-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 2px; background: rgba(201, 210, 220, .18); border: 1px solid rgba(201, 210, 220, .18); }
.extra { background: var(--bg); padding: clamp(24px, calc(.381vw + 22.51px), 28px); display: flex; flex-direction: column; gap: 12px; }
.extra h3 { margin: 0; font-family: var(--cond); font-weight: 700; text-transform: uppercase; font-size: 32px; line-height: .95; color: var(--white); }
.extra p { margin: 0; font-size: 15px; line-height: 1.5; color: var(--steel); }
.extra--feat { grid-column: 1 / -1; background: var(--amber); color: var(--ink); padding: clamp(24px, 3vw, 44px); display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 18px 48px; align-items: end; }
.extra--feat h3 { margin: 10px 0 0; font-weight: 800; font-size: clamp(38px, 4.6vw, 68px); line-height: .88; color: var(--ink); }
.extra--feat p { font-size: 17px; font-weight: 500; color: var(--ink); }

/* você não precisa */
.tudo { position: relative; z-index: 1; min-height: 100vh; min-height: 100svh; overflow: hidden; background: var(--bg); display: flex; align-items: center; }
.tudo-video { position: absolute; inset: 0; }
.tudo-video video { width: 100%; height: 100%; object-fit: cover; filter: grayscale(.4) contrast(1.05); }
.tudo-shade { position: absolute; inset: 0; background: rgba(10, 20, 36, .75); }
.grain { position: absolute; inset: 0; background-image: url(../assets/img/grain.svg); opacity: .55; mix-blend-mode: overlay; pointer-events: none; }
.tudo-inner { position: relative; padding-block: clamp(64px, calc(8.19vw + 32.06px), 150px); }
.tudo-pre { margin: 18px 0 10px; font-family: var(--cond); font-weight: 600; text-transform: uppercase; font-size: clamp(24px, 3vw, 40px); color: var(--muted); }
.tudo-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.tudo-list li { position: relative; width: max-content; max-width: 100%; font-family: var(--cond); font-weight: 800; text-transform: uppercase; font-size: clamp(64px, 13vw, 210px); line-height: .92; letter-spacing: -.02em; color: var(--steel); }
.strike { position: absolute; left: -2%; right: -2%; top: 50%; height: clamp(6px, 1vw, 14px); background: var(--amber); transform-origin: 0 50%; }
.js .strike { transform: scaleX(0); }
.tudo-p { margin: clamp(28px, calc(.571vw + 25.77px), 34px) 0 0; max-width: 460px; font-size: 18px; line-height: 1.5; color: var(--soft); }

/* como funciona */
.como { background: var(--white); color: var(--ink); padding: clamp(64px, calc(8.19vw + 32.06px), 150px) 0; }
.passos { list-style: none; margin: clamp(40px, calc(2.29vw + 31.09px), 64px) 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)); gap: 0; border-top: 2px solid var(--ink); }
.passos li { position: relative; padding: 26px 24px 34px 0; border-bottom: 1px solid rgba(10, 20, 36, .15); }
.passos .sq { position: absolute; top: -7px; left: 0; width: 12px; height: 12px; background: var(--amber); }
.passo-n { font-family: var(--cond); font-weight: 800; font-size: clamp(84px, 9vw, 140px); line-height: .8; color: var(--ink); letter-spacing: -.03em; }
.passos h3 { margin: 18px 0 8px; font-family: var(--cond); font-weight: 700; text-transform: uppercase; font-size: 28px; line-height: 1; }
.passos p { margin: 0; max-width: 300px; font-size: 16px; line-height: 1.5; color: var(--ink2); }

/* orçamento */
.orc { padding: clamp(40px, calc(10.48vw - .86px), 150px) 0; scroll-margin-top: 40px; }
.orc-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 400px), 1fr)); gap: clamp(32px, calc(.762vw + 29.03px), 40px) 64px; align-items: start; }
.orc-intro { display: flex; flex-direction: column; gap: var(--t-gap); }
.form { background: var(--navy); padding: clamp(20px, 3vw, 40px); display: flex; flex-direction: column; gap: clamp(20px, calc(.19vw + 19.26px), 22px); }
.f-tipos { margin: 0; padding: 0; border: 0; display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.f-tipos legend { padding: 0; margin-bottom: 10px; font-size: 13px; color: var(--muted); }
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip { position: relative; display: block; }
.chip input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; }
.chip span { display: flex; align-items: center; min-height: 46px; padding: 10px 16px; color: var(--soft); border: 1px solid rgba(201, 210, 220, .3); font: 600 15px var(--sans); border-radius: 2px; cursor: pointer; }
.chip input:checked + span { background: var(--amber); color: var(--ink); border-color: var(--amber); }
.chip input:focus-visible + span { outline: 2px solid var(--amber); outline-offset: 2px; }
.chip input:active + span { border-color: var(--amber); }
@media (hover: hover) { .chip:hover span { border-color: var(--amber); } }
.f-tipos.is-invalid .chip span { border-color: #FFB86B; }
.f-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); gap: 14px; }
.fld { display: flex; flex-direction: column; gap: 6px; font-size: 13px; color: var(--muted); min-width: 0; }
.fld input, .fld textarea { width: 100%; height: 50px; padding: 0 14px; background: var(--bg); border: 1px solid rgba(201, 210, 220, .3); color: var(--white); font-size: 16px; border-radius: 2px; outline-color: var(--amber); -webkit-appearance: none; appearance: none; }
.fld input::placeholder, .fld textarea::placeholder { color: #7A889D; opacity: 1; }
.fld textarea { height: auto; padding: 12px 14px; line-height: 1.45; resize: vertical; }
.fld input[type=date] { display: block; text-align: left; }
.fld input[type=date]::-webkit-date-and-time-value { text-align: left; }
.fld--date { max-width: 260px; }
.fld.is-invalid input { border-color: #FFB86B; }
.err { margin: 0; font-size: 14px; line-height: 1.4; color: #FFB86B; }
.btn-submit { position: relative; min-height: 60px; display: flex; align-items: center; justify-content: center; gap: 14px; padding: 12px 16px; background: var(--wa); color: var(--ink); border: 0; font: 700 16px var(--sans); letter-spacing: .06em; text-transform: uppercase; cursor: pointer; border-radius: 2px; transition: transform .3s cubic-bezier(.2, .8, .2, 1); }
.btn-submit::after { content: ''; position: absolute; inset: 0; border-radius: inherit; box-shadow: 0 0 0 6px rgba(37, 211, 102, .2); opacity: 0; transition: opacity .3s; pointer-events: none; }
.btn-submit:active, .btn-submit:focus-visible { transform: translateY(-2px); }
.btn-submit:active::after { opacity: 1; }
@media (hover: hover) { .btn-submit:hover { transform: translateY(-2px); } .btn-submit:hover::after { opacity: 1; } }
.f-info { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px; }
.f-info p { margin: 0; font-size: 14px; color: var(--soft); }
.pay { list-style: none; margin: 0; padding: 0; display: flex; gap: 6px; }
.pay li { padding: 5px 10px; border: 1px solid rgba(201, 210, 220, .35); font: 600 12px var(--sans); letter-spacing: .06em; text-transform: uppercase; color: var(--soft); }
.f-ok { margin: 0; font-size: 14px; color: var(--muted); }
.f-ok a { color: var(--amber); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.f-priv { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; font-size: 12px; color: #98A8BD; }
.link-btn { padding: 0; background: none; border: 0; color: var(--amber); font: 500 12px var(--sans); cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }

/* caminhão e equipe */
.equipe { padding: clamp(40px, calc(8.57vw + 6.57px), 130px) 0; border-top: 1px solid var(--line-soft); }
.equipe-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); gap: 48px 64px; align-items: start; }
.equipe-txt { display: flex; flex-direction: column; gap: 24px; }
.equipe-bau { display: flex; gap: 20px; align-items: flex-end; flex-wrap: wrap; }
.photo--bau { width: min(200px, 44vw); }
.photo--bau .tint img { aspect-ratio: auto; }
.equipe-bau p { margin: 0; flex: 1 1 200px; font-family: var(--cond); font-weight: 600; font-size: clamp(24px, 2.4vw, 32px); line-height: 1.1; color: var(--white); }
.equipe-p { margin: 0; max-width: 440px; font-size: 16px; line-height: 1.55; color: var(--muted); }
.mosaic { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); grid-auto-rows: clamp(44px, 6vw, 82px); gap: 10px; max-width: 640px; width: 100%; justify-self: end; }
.mosaic .photo { position: relative; border-color: rgba(213, 220, 228, .55); padding: 4px; display: flex; flex-direction: column; min-height: 0; }
.mosaic .tint { flex: 1; min-height: 0; }
.mosaic figcaption { padding: 6px 2px 0; letter-spacing: .04em; }
.m1 { grid-column: 1 / 4; grid-row: 1 / 6; }
.m2 { grid-column: 4 / 7; grid-row: 2 / 5; }
.m3 { grid-column: 2 / 5; grid-row: 6 / 10; }
.m4 { grid-column: 5 / 7; grid-row: 5 / 8; }
.m5 { grid-column: 5 / 7; grid-row: 8 / 10; }

/* onde atendemos */
.atendemos { padding: clamp(40px, calc(9.52vw + 2.86px), 140px) 0; overflow: hidden; }
.atend-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 400px), 1fr)); gap: 40px 64px; align-items: center; }
.atend-txt { display: flex; flex-direction: column; gap: 24px; }
.atend-txt .lead { line-height: 1.55; }
.tags { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.tags li { padding: 10px 14px; border: 1px solid rgba(201, 210, 220, .3); font: 600 15px var(--sans); color: var(--white); }
.tags .tag-on { background: var(--amber); border-color: var(--amber); font-weight: 700; color: var(--ink); }
.rota { display: flex; gap: 16px; align-items: center; padding-top: 20px; border-top: 1px solid rgba(201, 210, 220, .15); }
.rota span { flex: none; width: 44px; height: 3px; background: var(--amber); }
.rota p { margin: 0; font-size: 15px; color: var(--steel); }
.rota b { color: var(--white); font-weight: 600; }
.map-wrap { position: relative; width: 100%; max-width: 640px; justify-self: center; }
.map { width: 100%; height: auto; overflow: visible; }
.map-note { margin: 10px 0 0; font-family: var(--mono); font-size: 11px; letter-spacing: .12em; color: #7A889D; text-align: right; }

/* avaliações */
.aval { padding: clamp(40px, calc(9.52vw + 2.86px), 140px) 0; overflow: hidden; border-top: 1px solid var(--line-soft); }
.aval-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 400px), 1fr)); gap: 32px 64px; align-items: end; }
.aval-nota { display: flex; align-items: flex-start; gap: 12px; font-family: var(--cond); font-weight: 800; color: var(--steel); line-height: .8; }
.aval-num { font-size: clamp(120px, 20vw, 280px); letter-spacing: -.04em; font-variant-numeric: tabular-nums; }
.aval-star { font-size: clamp(48px, 7vw, 96px); color: var(--amber); margin-top: .1em; }
.aval-qtd { margin: 14px 0 0; font-family: var(--cond); font-weight: 600; text-transform: uppercase; font-size: clamp(22px, 2.4vw, 32px); letter-spacing: .02em; color: var(--white); }
.aval-qtd span { font-variant-numeric: tabular-nums; }
.aval-side { display: flex; flex-direction: column; gap: 18px; }
.elogios { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.elogios li { padding: 8px 12px; background: var(--navy); font-size: 15px; color: var(--soft); }
.mq-rows { margin-top: clamp(40px, calc(2.29vw + 31.09px), 64px); display: flex; flex-direction: column; gap: 14px; }
.mq { overflow: hidden; }
.mq-track { display: flex; gap: 14px; width: max-content; }
.rev { margin: 0; width: min(420px, 80vw); flex: none; padding: 24px; background: var(--navy); display: flex; flex-direction: column; justify-content: space-between; gap: 18px; }
.rev--line { background: none; border: 1px solid var(--line); }
.rev blockquote { margin: 0; font-size: 16px; line-height: 1.55; color: #E3E8EE; }
.rev figcaption { display: flex; justify-content: space-between; align-items: center; gap: 12px; font-size: 14px; color: var(--muted); }
.rev b { color: var(--white); font-weight: 600; }
.stars { color: var(--amber); letter-spacing: 2px; }

/* perguntas */
.faq { padding: clamp(40px, calc(9.52vw + 2.86px), 140px) 0; border-top: 1px solid var(--line-soft); }
.faq-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 360px), 1fr)); gap: 40px 64px; align-items: start; }
.h-faq { font-size: clamp(44px, 8vw, 124px); }
.faq-side p { margin: 20px 0 0; max-width: 340px; font-size: 16px; line-height: 1.5; color: var(--muted); }
.ul { color: var(--amber); background-image: linear-gradient(var(--amber), var(--amber)); background-repeat: no-repeat; background-position: 0 100%; background-size: 100% 1px; }
.faq-list { border-top: 1px solid var(--line); }
.faq-item { border-bottom: 1px solid var(--line); }
.faq-item h3 { margin: 0; font: inherit; }
.faq-q { width: 100%; min-height: 64px; display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 18px 0; background: none; border: 0; color: var(--white); font: 600 clamp(18px, 1.6vw, 21px) var(--sans); line-height: 1.3; text-align: left; cursor: pointer; }
.faq-q .sign { width: 30px; height: 30px; }
.faq-q:active .sign { background: rgba(213, 220, 228, .15); }
@media (hover: hover) { .faq-q:hover { color: var(--amber); } }
.faq-a p { margin: 0; padding: 0 50px 24px 0; font-size: 16px; line-height: 1.6; color: var(--muted); text-wrap: pretty; }

/* contato */
.contato { background: var(--amber); color: var(--ink); padding: clamp(64px, calc(7.24vw + 35.77px), 140px) 0; }
.h-contato { margin-top: 18px; font-size: clamp(54px, 10vw, 168px); line-height: .82; letter-spacing: -.02em; text-wrap: balance; }
.contato-grid { margin-top: clamp(32px, calc(2.29vw + 23.09px), 56px); display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: clamp(24px, calc(.762vw + 21.03px), 32px); align-items: end; }
.contato-wa { display: flex; flex-direction: column; gap: 8px; color: var(--ink); align-self: end; }
.contato-k { font-size: 14px; font-weight: 600; }
.contato-tel { position: relative; align-self: flex-start; font-family: var(--cond); font-weight: 800; font-size: clamp(36px, 4vw, 56px); line-height: .9; padding-bottom: 4px; }
.contato-tel::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: var(--ink); transform: scaleX(0); transform-origin: 0 50%; transition: transform .4s; }
.contato-wa:active .contato-tel::after, .contato-wa:focus-visible .contato-tel::after { transform: scaleX(1); }
@media (hover: hover) { .contato-wa:hover .contato-tel::after { transform: scaleX(1); } }
.contato-item { display: flex; flex-direction: column; gap: 6px; font-size: 16px; line-height: 1.45; }
.contato-ctas { margin-top: clamp(32px, calc(2.29vw + 23.09px), 56px); display: flex; flex-wrap: wrap; gap: 12px; }
.contato-map { margin-top: clamp(32px, calc(2.29vw + 23.09px), 56px); width: 100%; max-width: 560px; height: 260px; border: 0; filter: grayscale(1) contrast(1.1); background: #d9822a; }

/* rodapé */
.ftr { position: relative; z-index: 1; background: var(--bg2); padding: clamp(56px, calc(1.52vw + 50.06px), 72px) 0 110px; color: var(--muted); font-size: 15px; }
.ftr-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); gap: 40px; }
.ftr-brand { display: flex; flex-direction: column; gap: 16px; }
.ftr-logo { width: auto; height: 132px; object-fit: contain; align-self: flex-start; }
.ftr-slogan { font-size: 14px; color: var(--dim); }
.ftr-col { display: flex; flex-direction: column; gap: 8px; }
.ftr-h { margin-bottom: 6px; }
.ftr-a { position: relative; align-self: flex-start; color: var(--muted); }
.ftr-a--hi { color: var(--steel); }
.ftr-a::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: var(--amber); transform: scaleX(0); transform-origin: 0 50%; transition: transform .35s; }
.ftr-a:active, .ftr-a:focus-visible { color: var(--white); }
.ftr-a:active::after, .ftr-a:focus-visible::after { transform: scaleX(1); }
@media (hover: hover) { .ftr-a:hover { color: var(--white); } .ftr-a:hover::after { transform: scaleX(1); } }
.ftr-bottom { margin-top: clamp(40px, calc(1.52vw + 34.06px), 56px); padding-top: 20px; border-top: 1px solid var(--line-soft); display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; font-size: 13px; color: #7A889D; }

/* botão fixo do celular */
.wa-bar { display: none; }

/* ================= celular ================= */
@media (max-width: 759.98px) {
  :root { --hdr-h: 68px; }
  .hdr { padding-top: 10px; padding-bottom: 10px; }
  .brand-logo { height: 44px; }
  .hdr-wa, .hdr-menu { min-height: 48px; }
  .video-toggle { width: 48px; height: 48px; }
  .faq-side { position: static; }
  .serv-btn { width: 100%; min-height: 48px; display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 20px 0; background: none; border: 0; color: inherit; text-align: left; cursor: pointer; }
  .serv-btn-txt { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
  .serv-btn-top { display: flex; gap: 12px; align-items: baseline; }
  .serv-btn-nome { font-family: var(--cond); font-weight: 700; text-transform: uppercase; font-size: 26px; line-height: .95; color: var(--white); }
  .serv-btn-resumo { font: 400 16px/1.5 var(--sans); color: var(--muted); }
  .serv-btn:active .sign { background: rgba(213, 220, 228, .15); }
  .serv-head { display: none; }
  .serv-body { display: none; padding: 0 0 24px; gap: 16px; }
  .serv.is-open .serv-body { display: grid; }
  .serv-body p, .extra p, .rota p, .f-info p, .f-ok { font-size: 16px; }
  .card { gap: 16px; min-height: 0; }
  .card--line { margin-top: 0; }
  .story-ch h2 { font-size: clamp(36px, 10.3vw, 44px); line-height: .9; }
  .story-ch p { margin-top: 14px; }
  .story-cta { margin-top: 24px; }
  .story-shade { background: linear-gradient(180deg, rgba(10, 20, 36, .92) 0%, rgba(10, 20, 36, .7) 38%, rgba(10, 20, 36, 0) 56%); }
  /* hero do celular: texto em cima, caminhão 3D inteiro numa área livre logo abaixo dos selos.
     O bloco rola até o fim do caminhão aparecer e só então fica fixo para a câmera subir. */
  .hero { height: auto; }
  .hero::after { content: ''; display: block; height: 110vh; height: 110svh; }
  .hero-pin { height: auto; min-height: 100vh; min-height: 100svh; top: min(0px, calc(100svh - var(--pinh, 100svh))); flex-direction: column; align-items: stretch; }
  .hero-inner { padding-bottom: 0; grid-template-columns: minmax(0, 1fr); }
  /* o caminhão é o fundo do hero; nada de overlay escuro por cima dele (apagaria o logo) */
  .hero-shade { display: none; }
  .hero-h1, .hero-slogan, .hero-p { text-shadow: 0 2px 12px rgba(10, 20, 36, .8); }
  /* faixa livre onde cai a lateral do baú com o escudo STM e o nome SAMUEL */
  .hero-slot { display: block; height: clamp(104px, 31vw, 140px); margin: 4px 0 -4px; }
  .hero-chips { margin-top: 0; }
  .hero-scroll { position: relative; right: auto; bottom: auto; align-self: center; margin: auto 0 18px; padding-top: 20px; }
  .hero-end { bottom: 7svh; }
  .hero-ctas { margin-top: 12px; }
  .hero-ctas .btn { padding-inline: 20px; }
  .hero-ctas .btn-ghost { background: rgba(10, 20, 36, .72); }
  .head-grid { row-gap: 14px; }
  .passos li { padding: 24px 0 28px; }
  .passos h3 { margin: 16px 0 12px; }
  .chip span { min-height: 48px; }
  .f-grid { gap: 16px; }
  .fld { font-size: 14px; }
  .f-tipos legend { font-size: 14px; }
  .fld input { height: 52px; }
  .link-btn { min-height: 48px; display: inline-flex; align-items: center; font-size: 14px; }
  .f-priv { font-size: 14px; }
  .f-ok a { display: inline-block; padding: 12px 2px; margin: -12px 0; }
  .equipe-grid { gap: 40px; }
  .equipe-txt { gap: 20px; }
  .equipe-txt .h-lg { margin-bottom: -6px; }
  .atend-txt { gap: 20px; }
  .atend-txt .lead { margin-top: -6px; }
  .mq-rows, .mq-track { gap: 16px; }
  .faq-grid { gap: 28px; }
  .faq-side p { margin-top: 14px; }
  .faq-side .ul { display: inline-block; padding: 12px 0; margin: -12px 0; background: none; text-decoration: underline; text-underline-offset: 3px; }
  .brand { min-height: 48px; }
  .faq-a p { padding-right: 44px; }
  .h-contato { margin-top: 14px; }
  .contato-ctas .btn { flex: 1 1 auto; }
  .ftr { font-size: 16px; }
  .ftr-grid { gap: 32px; }
  .ftr-col { gap: 0; }
  .ftr-col > span { padding: 4px 0; }
  .ftr-a { display: flex; align-items: center; min-height: 48px; }
  .ftr-a::after { bottom: 10px; }
  .wa-bar {
    position: fixed; left: var(--g); right: var(--g); bottom: max(12px, env(safe-area-inset-bottom)); z-index: 70;
    height: 56px; display: flex; align-items: center; justify-content: center; gap: 12px;
    background: var(--wa); color: var(--ink); font: 700 16px var(--sans); letter-spacing: .06em; text-transform: uppercase;
    border-radius: 2px; box-shadow: 0 14px 30px -10px rgba(0, 0, 0, .6);
  }
  .js .wa-bar { opacity: 0; transform: translateY(140%); pointer-events: none; transition: opacity .35s, transform .45s cubic-bezier(.2, .8, .2, 1); }
  .js .wa-bar.is-on { opacity: 1; transform: none; pointer-events: auto; }
  .wa-bar.is-on:active { transform: translateY(1px); }
  /* espaço no fim da página com a altura do botão fixo, para ele não tapar o rodapé */
  .ftr { padding-bottom: calc(48px + 68px + env(safe-area-inset-bottom)); }
  .wa-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--ink); }
}
@media (min-width: 800px) {
  .faq-side { position: sticky; top: 100px; }
}
@media (max-width: 480px) {
  .hdr-wa .lbl, .hdr-menu .lbl { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .hdr-wa { width: 48px; height: 48px; padding: 0; }
  .hdr-wa .ico { display: block; }
  .hdr-menu { width: 48px; height: 48px; padding: 0; }
  .hdr-actions { gap: 8px; }
  .brand { gap: 10px; }
}
@media (max-width: 420px) {
  .hero-h1 { font-size: clamp(46px, 13.3vw, 52px); }
  .tudo-list li { font-size: clamp(52px, 16.4vw, 64px); }
  .h-giant { font-size: clamp(58px, 16.4vw, 64px); }
  .h-contato { font-size: clamp(48px, 13.8vw, 54px); }
  .aval-num { font-size: clamp(108px, 30.7vw, 120px); }
}

/* movimento reduzido */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-delay: 0s !important; }
  .js .strike { transform: none; }
  .mq { overflow-x: auto; }
}