/* ============================================================
   EDILSON SBK SUPERBIKES — folha única consolidada
   Ordem: 00 tokens · 01 base · 02 utilitários · 03 faixa+nav
   04 hero · 05 dor · 06 diagnóstico · 07 serviços
   09 sobre · 10 galeria · 11 vídeo · 12 avaliações · 13 CTA final
   14 localização · 15 rodapé · 16 WhatsApp flutuante
   17 responsivo · 18 movimento reduzido · 19 rodada R5 · 20–22 hero
   23 rodada R6 (desktop: hero, revisão+moto animada, diagnóstico, serviços,
   oficina+vídeo, avaliações em trilho, fechamento+rodapé)
   24 refino da hero (cápsula de navegação, copy mais alta)
   Cada bloco é isolado: trocar uma seção não exige mexer em outra.
   ============================================================ */

/* 00 · TOKENS ------------------------------------------------ */
:root{
  /* paleta aprovada — não alterar */
  --bg:#09090B; --bg2:#111114; --bg3:#18181C;
  --gold:#F5C000; --gold-soft:#f7d15c; --gold-dim:rgba(245,192,0,.10); --border-gold:rgba(245,192,0,.22);
  --red:#C0392B; --red-hover:#E74C3C;
  --fg:#FAFAFA; --fg2:rgba(250,250,250,.62); --fg3:rgba(250,250,250,.48);
  --steel:rgba(217,222,232,.12);
  --border:rgba(255,255,255,.07); --whats:#25D366;
  --ease:cubic-bezier(.4,0,.2,1);
  /* tipografia aprovada */
  --font-display:'Bebas Neue',sans-serif;
  --font-body:'Inter',system-ui,sans-serif;
  --text-min:12px;
  /* raios: 3 valores + pílula */
  --r-sm:16px; --r-md:24px; --r-lg:32px; --r-pill:999px;
  /* escala de espaçamento */
  --sp-1:8px; --sp-2:12px; --sp-3:16px; --sp-4:24px; --sp-5:32px; --sp-6:40px; --sp-7:56px; --sp-8:80px; --sp-9:120px;
  --gap-cards:var(--sp-3);
  --section-y:var(--sp-9);
  --wrap-x:var(--sp-5);
  /* cabeçalho fixo */
  --ribbonH:40px; --navH:56px; --headH:calc(var(--ribbonH) + var(--navH));
  /* painéis */
  --panel-bg:linear-gradient(180deg,rgba(18,18,22,.94),rgba(8,8,10,.98));
  --panel-shadow:0 24px 70px rgba(0,0,0,.34),0 0 0 1px rgba(255,255,255,.025) inset;
}

/* 01 · BASE -------------------------------------------------- */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--headH) + 8px);overflow-x:clip}
body{background:radial-gradient(circle at 20% 0%,rgba(245,192,0,.06),transparent 32%),var(--bg);color:var(--fg);font-family:var(--font-body);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:clip}
img,video,svg{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-decoration:none}
a:focus-visible,button:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
section{position:relative}

/* 02 · UTILITÁRIOS ------------------------------------------- */
.wrap{width:100%;max-width:1200px;margin:0 auto;padding:0 var(--wrap-x)}
.section-pad{padding:var(--section-y) 0}
.bg1{background:var(--bg)}
.bg2{background:radial-gradient(circle at 80% 10%,rgba(217,222,232,.06),transparent 30%),var(--bg2)}
.label{font-weight:700;text-transform:uppercase;letter-spacing:3px;font-size:var(--text-min);color:var(--fg3)}
.gold{background:linear-gradient(180deg,#fff1a4,#F5C000 52%,#ff8a18);-webkit-background-clip:text;background-clip:text;color:transparent}
.checker-strip{height:5px;width:100%;background:repeating-linear-gradient(90deg,var(--gold) 0,var(--gold) 12px,var(--bg) 12px,var(--bg) 24px)}
.sec-head{margin-bottom:14px}
.sec-head--gap{margin-bottom:var(--sp-6)}
.sec-kicker{display:inline-flex;align-items:center;gap:12px;margin-bottom:22px}
/* títulos de seção: a aparência vem da classe, não da tag (h2/h3 livres para a hierarquia) */
.sec-h2{font-family:var(--font-display);font-weight:400;text-transform:uppercase;font-size:clamp(40px,10vw,56px);letter-spacing:1px;line-height:.95}
.sub-title{font-family:var(--font-display);font-weight:400;text-transform:uppercase;letter-spacing:.5px;line-height:.95;margin:16px 0 20px}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:var(--font-body);font-weight:700;font-size:14px;letter-spacing:.5px;padding:17px 30px;min-height:48px;border:2px solid transparent;border-radius:var(--r-pill);cursor:pointer;touch-action:manipulation;box-shadow:0 14px 32px rgba(0,0,0,.22);transition:background .3s var(--ease),border-color .3s var(--ease),color .3s var(--ease),transform .3s var(--ease)}
.btn:hover{transform:translateY(-1px)}
.btn-red{background:var(--red);color:#fff;border-color:var(--red)}
.btn-red:hover{background:var(--red-hover);border-color:var(--red-hover)}
.btn-ghost{background:rgba(255,255,255,.035);color:var(--fg);border-color:rgba(255,255,255,.16)}
.btn-ghost:hover{border-color:var(--border-gold);color:var(--gold);background:var(--gold-dim)}

.reveal{opacity:0;transform:translateY(24px);transition:opacity .65s var(--ease),transform .65s var(--ease)}
.reveal.in{opacity:1;transform:none}
.no-js .reveal{opacity:1;transform:none}

/* 03 · CABEÇALHO — faixa em loop com a marca (PROTEGIDA) + nav fina com a CTA ---- */
/* estado: no hero a faixa fica oculta (fora da tela, letreiro pausado); da 2ª seção em diante html.ribbon-on a traz fixa
   e a nav desce junto por transform — tudo position:fixed, nada empurra o conteúdo. Sem JS, a faixa fica sempre visível. */
.sbk-ribbon{position:fixed;top:0;left:0;right:0;height:var(--ribbonH);z-index:980;overflow:hidden;transform:translateY(-100%);opacity:0;visibility:hidden;transition:transform .25s var(--ease),opacity .25s var(--ease),visibility .25s;border-bottom:1px solid rgba(245,192,0,.34);box-shadow:0 12px 34px rgba(0,0,0,.55);
  background:linear-gradient(90deg,rgba(245,192,0,.10),transparent 18%,transparent 82%,rgba(245,192,0,.10)),repeating-linear-gradient(45deg,rgba(255,255,255,.10) 0 10px,rgba(255,255,255,.02) 10px 20px),#030304}
.sbk-ribbon::before,.sbk-ribbon::after{content:"";position:absolute;top:0;bottom:0;width:80px;z-index:2;pointer-events:none}
.sbk-ribbon::before{left:0;background:linear-gradient(90deg,#030304,transparent)}
.sbk-ribbon::after{right:0;background:linear-gradient(270deg,#030304,transparent)}
.sbk-ribbon-track{display:flex;align-items:center;gap:18px;padding:0 18px;width:max-content;height:100%;animation:marquee 20s linear infinite;animation-play-state:paused}
.ribbon-on .sbk-ribbon,.no-js .sbk-ribbon{transform:none;opacity:1;visibility:visible}
.ribbon-on .sbk-ribbon-track,.no-js .sbk-ribbon-track{animation-play-state:running}
.ribbon-item{display:inline-flex;align-items:center;gap:9px;flex:0 0 auto;line-height:1;white-space:nowrap;text-transform:uppercase;letter-spacing:1.4px;text-shadow:0 0 16px rgba(245,192,0,.24)}
.ribbon-item strong{font-family:var(--font-display);font-weight:400;font-size:26px;letter-spacing:2px;color:#fff}
.ribbon-item b{font-family:var(--font-display);font-weight:400;font-size:28px;letter-spacing:2.5px;color:var(--gold)}
.ribbon-item em{font-style:normal;font-size:var(--text-min);font-weight:800;color:rgba(255,255,255,.82);letter-spacing:2.2px}
.ribbon-sep{color:rgba(245,192,0,.72);font-size:var(--text-min);flex:0 0 auto}
@keyframes marquee{to{transform:translateX(-50%)}}

.nav{position:fixed;top:0;left:0;right:0;z-index:900;overflow:hidden;border-bottom:1px solid rgba(255,255,255,.055);background:linear-gradient(180deg,rgba(6,6,8,.92),rgba(7,7,9,.78));-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);transition:background .3s,transform .25s var(--ease)}
.ribbon-on .nav,.no-js .nav{transform:translateY(var(--ribbonH))}
.nav.scrolled{background:rgba(9,9,11,.82)}
.nav-inner{display:flex;align-items:center;justify-content:flex-end;height:var(--navH);min-width:0}
.nav-cta{padding:9px 22px;min-height:44px;font-size:13px;box-shadow:0 15px 34px rgba(192,57,43,.20)}

/* 04 · HERO --------------------------------------------------- */
.hero{position:relative;min-height:100vh;min-height:100svh;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;overflow:clip}
.hero-bg{position:absolute;inset:0;z-index:0}
.hero-bg img{width:100%;height:100%;object-fit:cover;object-position:center 30%}
.hero-video{position:absolute;inset:0;z-index:1;background:#070708}
.hero-video video{width:100%;height:100%;object-fit:cover;object-position:center;pointer-events:none}
.hero-overlay{position:absolute;inset:0;z-index:2;background:
  linear-gradient(90deg,rgba(4,4,5,.62) 0%,rgba(4,4,5,.34) 32%,rgba(4,4,5,.10) 62%,rgba(4,4,5,.34) 100%),
  linear-gradient(to bottom,rgba(9,9,11,.02) 0%,rgba(9,9,11,.10) 42%,rgba(9,9,11,.42) 78%,#09090B 100%)}
.hero-content{position:relative;z-index:4;width:100%}
.hero-inner{padding:calc(var(--navH) + 72px) 0 var(--sp-6)}
.eyebrow{display:inline-flex;align-items:center;gap:8px;background:rgba(217,222,232,.065);border:2px solid rgba(217,222,232,.22);color:rgba(255,255,255,.72);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:8px 16px;font-weight:700;font-size:var(--text-min);letter-spacing:2px;text-transform:uppercase;margin-bottom:28px}
.hero-h1{font-family:var(--font-display);font-weight:400;text-transform:uppercase;font-size:clamp(54px,12vw,78px);letter-spacing:.5px;line-height:.92;margin-bottom:var(--sp-4);color:#fff;max-width:740px;text-shadow:0 10px 42px rgba(0,0,0,.82),0 2px 10px rgba(0,0,0,.72)}
.hero-sub{font-size:var(--text-min);letter-spacing:2.5px;text-transform:uppercase;color:rgba(255,255,255,.74);margin-bottom:36px;line-height:1.8;max-width:560px}
.hero-ctas{display:flex;flex-wrap:wrap;gap:var(--sp-3);align-items:flex-start}
.micro{font-size:var(--text-min);color:rgba(255,255,255,.48);margin-top:10px;line-height:1.6;max-width:320px}
/* barra de números — valores dependem de D2/D3, não alterar aqui */
.stats{border-top:1px solid rgba(217,222,232,.14);background:linear-gradient(180deg,rgba(16,16,19,.72),rgba(7,7,8,.88));-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.stats-inner{display:flex;justify-content:space-around;padding:28px 0}
.stat{text-align:center}
.num{font-family:var(--font-display);font-size:clamp(28px,5vw,38px);letter-spacing:1px;color:var(--gold-soft);line-height:1}
.cap{font-size:var(--text-min);letter-spacing:2.5px;text-transform:uppercase;color:rgba(217,222,232,.46);margin-top:4px}

/* 05 · DOR ---------------------------------------------------- */
.pain .inner{max-width:790px;margin:0 auto;text-align:center}
.pain .lead{font-family:var(--font-display);font-weight:400;font-size:clamp(32px,6vw,44px);letter-spacing:1px;line-height:.95;text-transform:uppercase;color:#fff;margin-bottom:var(--sp-4)}
.pain p{color:var(--fg2);font-size:18px;line-height:1.75}
.pain .lead + p{margin-top:30px}
.pain strong{color:#fff}
.pain-proof{margin-top:var(--sp-5);display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap-cards)}
.pain-proof div{border:1px solid rgba(217,222,232,.13);background:linear-gradient(180deg,rgba(217,222,232,.055),rgba(245,192,0,.035));border-radius:var(--r-md);padding:18px;text-align:left}
.pain-proof b{display:block;color:#f6cc3f;font-size:13px;text-transform:uppercase;letter-spacing:1.5px;margin-bottom:6px}
.pain-proof span{display:block;color:rgba(255,255,255,.62);font-size:13px;line-height:1.55}

/* 06 · DIAGNÓSTICO  (título depende de D1) -------------------- */
.diag{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-7);align-items:center;position:relative;z-index:1;padding:var(--sp-5);border:1px solid rgba(245,192,0,.14);border-radius:var(--r-lg);box-shadow:0 34px 100px rgba(0,0,0,.42),0 0 0 1px rgba(255,255,255,.025) inset;
  background:radial-gradient(circle at 8% 12%,rgba(245,192,0,.08),transparent 34%),radial-gradient(circle at 100% 88%,rgba(192,57,43,.08),transparent 34%),var(--panel-bg)}
.diag-photo{position:relative;aspect-ratio:4/3;overflow:hidden;border:2px solid var(--border-gold);border-radius:var(--r-md);box-shadow:0 24px 70px rgba(0,0,0,.36)}
.diag-photo img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.diag-photo:hover img{transform:scale(1.04)}
.diag-tag{position:absolute;bottom:0;left:0;background:rgba(9,9,11,.85);border-top:2px solid var(--gold);padding:10px 18px;font-weight:700;font-size:var(--text-min);letter-spacing:2px;text-transform:uppercase;color:var(--fg3)}
.diag-copy{padding:10px 4px}
.diag-title{font-size:clamp(28px,5vw,38px)}
.diag-copy p{color:var(--fg2);margin-bottom:var(--sp-4);line-height:1.75}
.benefits{list-style:none;display:grid;gap:var(--sp-2);margin:26px 0 34px}
.benefits li{position:relative;overflow:hidden;padding:16px 18px 16px 22px;border:1px solid rgba(255,255,255,.045);border-left:3px solid rgba(245,192,0,.72);border-radius:var(--r-sm);font-size:15px;color:#cfd4dc;box-shadow:0 14px 38px rgba(0,0,0,.20);transition:transform .25s var(--ease);
  background:linear-gradient(90deg,rgba(245,192,0,.065),rgba(255,255,255,.018) 36%,rgba(255,255,255,.008)),linear-gradient(180deg,rgba(24,24,28,.86),rgba(10,10,12,.94))}
.benefits li:hover{transform:translateX(4px)}
.benefits b{color:#fff}

/* 07 · SERVIÇOS ----------------------------------------------- */
/* grade de 6 colunas: destaque ocupa a linha inteira, depois 3 + 2 cards — nenhuma linha fica com card órfão */
.svc-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:var(--gap-cards);margin-top:var(--sp-7)}
.card{grid-column:span 2;position:relative;overflow:hidden;padding:40px 32px;border:2px solid rgba(217,222,232,.11);border-radius:var(--r-md);background:linear-gradient(180deg,rgba(24,24,28,.88),rgba(9,9,11,.98));transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.card:nth-last-child(-n+2){grid-column:span 3}
.card::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--gold),var(--red));transform:scaleX(0);transform-origin:left;transition:transform .4s var(--ease)}
.card:hover{transform:translateY(-5px);box-shadow:0 20px 60px rgba(0,0,0,.5)}
.card:hover::before{transform:scaleX(1)}
.card:hover h3{color:var(--gold)}
.card h3{font-family:var(--font-display);font-weight:400;font-size:22px;text-transform:uppercase;letter-spacing:.5px;margin-bottom:12px;transition:color .3s}
.card p{font-size:14px;color:var(--fg2);line-height:1.65}
.ico{width:48px;height:48px;display:flex;align-items:center;justify-content:center;margin-bottom:var(--sp-4);color:var(--gold);border:2px solid var(--border-gold);background:linear-gradient(180deg,rgba(245,192,0,.16),rgba(245,192,0,.045));box-shadow:0 12px 28px rgba(0,0,0,.22);transition:transform .3s,border-color .3s}
.ico svg{width:29px;height:29px;stroke:currentColor;fill:none;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.card:hover .ico{transform:translateY(-2px);border-color:var(--gold)}
/* card prioritário em destaque — preservar */
.card.service-priority{grid-column:1 / -1;background:linear-gradient(135deg,rgba(245,192,0,.13),rgba(217,222,232,.08) 34%,rgba(9,9,11,.98));border-color:rgba(245,192,0,.36);box-shadow:0 24px 80px rgba(245,192,0,.06)}
.service-priority h3{font-size:30px;color:#fff}
.service-priority p{font-size:15px;color:rgba(255,255,255,.72);max-width:760px}
.service-priority .ico{background:linear-gradient(145deg,rgba(245,192,0,.25),rgba(192,57,43,.12))}

.prevention{margin-top:var(--sp-6);padding:var(--sp-6);border:1px solid rgba(217,222,232,.13);border-radius:var(--r-lg);box-shadow:0 24px 70px rgba(0,0,0,.28);background:linear-gradient(135deg,rgba(217,222,232,.075),rgba(245,192,0,.055) 45%,rgba(192,57,43,.045))}
.prevention-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:var(--sp-5);align-items:center}
.prevention-title{font-size:clamp(34px,7vw,52px);letter-spacing:1px;line-height:.94;margin:0}
.prevention p{color:rgba(255,255,255,.66);margin-top:14px}
.prevention ul{list-style:none;display:grid;gap:10px}
.prevention li{border-left:2px solid rgba(245,192,0,.72);padding:10px 0 10px 14px;color:rgba(255,255,255,.72)}

/* 09 · SOBRE  (D2 "mais de 10 anos" pendente) ----------------- */
.about-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:var(--sp-7);align-items:center}
.about-photos{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:var(--gap-cards);min-width:0}
.about-photo{aspect-ratio:4/5;overflow:hidden;border:2px solid var(--border-gold);border-radius:var(--r-md);box-shadow:0 24px 70px rgba(0,0,0,.4);background:#050507}
.about-photo img{width:100%;height:100%;object-fit:cover}
.about-badge{position:absolute;left:16px;bottom:16px;z-index:2;max-width:calc(100% - 32px);background:rgba(9,9,11,.72);border:1px solid var(--border-gold);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:var(--gold);font-size:var(--text-min);font-weight:800;letter-spacing:1.6px;text-transform:uppercase;padding:10px 14px;border-radius:var(--r-pill)}
.about-title{font-size:clamp(34px,6vw,46px)}
.about-copy p{color:var(--fg2);margin-bottom:var(--sp-3);line-height:1.75}
.about-copy p:last-child{margin-bottom:0}

/* 10 · GALERIA — mosaico (G1) + legenda abaixo (G3) + ampliação em <dialog> */
/* 3 colunas; a foto em paisagem ocupa 2. Cada célula segue a proporção da própria foto
   (img com width/height + height:auto), então não existe faixa escura. --nw é a largura
   nativa do arquivo: a foto nunca é ampliada além dela. */
.gal-mosaic{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap-cards);align-items:start}
.gal-item{max-width:var(--nw,100%);overflow:hidden;border:2px solid var(--steel);border-radius:var(--r-md);background:linear-gradient(180deg,#0d0d10,#060608);box-shadow:0 22px 60px rgba(0,0,0,.32);transition:border-color .3s var(--ease),transform .3s var(--ease)}
.gal-item:hover{border-color:var(--border-gold);transform:translateY(-3px)}
.gal-item.gal-wide{grid-column:span 2;max-width:100%}
.gal-open{display:block;width:100%;padding:0;border:0;background:none;cursor:zoom-in;touch-action:manipulation}
.gal-open img{width:100%;height:auto;transition:transform .6s var(--ease)}
.gal-item:hover .gal-open img{transform:scale(1.03)}
.gal-cap{padding:16px 18px 18px;border-top:1px solid var(--border-gold)}
.ct{display:block;font-family:var(--font-display);font-weight:400;font-size:22px;text-transform:uppercase;letter-spacing:.5px;line-height:1.1}
.cs{display:block;font-family:var(--font-body);font-size:var(--text-min);color:var(--fg2);letter-spacing:1px;margin-top:4px;line-height:1.5}

/* ampliação: dialog nativo, foto em tamanho nativo sobre fundo escuro */
.lb{width:100%;max-width:100%;max-height:100%;height:100%;padding:0;border:0;background:rgba(3,3,4,.96);color:var(--fg);overflow:hidden}
.lb::backdrop{background:rgba(3,3,4,.92)}
.lb-stage{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;width:100%;height:100%;padding:72px 68px}
.lb-img{width:auto;height:auto;max-width:100%;max-height:calc(100% - 64px);border:1px solid var(--border-gold);border-radius:var(--r-sm);background:#09090B}
.lb-cap{text-align:center;max-width:620px}
.lb-btn{position:absolute;z-index:2;width:48px;height:48px;min-width:48px;display:flex;align-items:center;justify-content:center;border:2px solid var(--border-gold);border-radius:50%;background:rgba(9,9,11,.88);color:var(--fg);font-family:var(--font-body);font-size:24px;line-height:1;cursor:pointer;touch-action:manipulation;box-shadow:0 10px 26px rgba(0,0,0,.55);transition:background .3s,color .3s,border-color .3s}
.lb-btn:hover{background:var(--gold-dim);color:var(--gold);border-color:var(--gold)}
.lb-close{top:16px;right:16px}
.lb-prev{left:16px;top:50%;transform:translateY(-50%)}
.lb-next{right:16px;top:50%;transform:translateY(-50%)}

/* 11 · VÍDEO DE PROVA ----------------------------------------- */
.video-proof{overflow:hidden;overflow:clip;background:radial-gradient(circle at 76% 18%,rgba(245,192,0,.08),transparent 28%),radial-gradient(circle at 12% 84%,rgba(192,57,43,.08),transparent 30%),linear-gradient(180deg,#0d0d10,#070708)}
.video-proof::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.13;background:linear-gradient(135deg,rgba(255,255,255,.06) 0 1px,transparent 1px 22px)}
.video-proof-grid{position:relative;z-index:1;display:grid;grid-template-columns:.94fr 1.06fr;gap:var(--sp-7);align-items:center}
.video-copy-panel{padding:var(--sp-5);border:1px solid rgba(245,192,0,.14);border-radius:var(--r-lg);background:linear-gradient(180deg,rgba(22,22,26,.76),rgba(9,9,11,.92));box-shadow:var(--panel-shadow)}
.video-title{font-size:clamp(44px,7vw,72px);letter-spacing:.4px;line-height:.92;margin:16px 0 18px}
.video-copy-panel p{color:var(--fg2);font-size:17px;line-height:1.75}
.video-device{position:relative;margin:0 auto;max-width:430px;width:100%;padding:14px;border-radius:var(--r-lg);background:linear-gradient(135deg,rgba(245,192,0,.40),rgba(255,255,255,.08) 26%,rgba(192,57,43,.30) 100%);box-shadow:0 36px 110px rgba(0,0,0,.58),0 0 80px rgba(245,192,0,.08)}
.video-screen{position:relative;overflow:hidden;border-radius:var(--r-md);background:#050506;aspect-ratio:478/850;border:1px solid rgba(255,255,255,.10)}
.video-screen video{width:100%;height:100%;object-fit:cover;background:#050506}
.video-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:3;display:flex;align-items:center;gap:10px;min-height:48px;padding:16px 22px 16px 18px;border:0;border-radius:var(--r-pill);background:linear-gradient(135deg,var(--red),#ea4938);color:#fff;font-family:var(--font-body);font-weight:800;font-size:14px;letter-spacing:.2px;white-space:nowrap;cursor:pointer;box-shadow:0 18px 46px rgba(192,57,43,.36);transition:opacity .3s,transform .3s}
.video-play span{width:34px;height:34px;border-radius:50%;background:#fff;color:var(--red);display:grid;place-items:center;font-size:15px;line-height:1}
.video-badge{position:absolute;left:22px;top:22px;z-index:2;border:1px solid rgba(245,192,0,.36);border-radius:var(--r-pill);background:rgba(9,9,11,.62);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:8px 12px;color:var(--gold);font-size:var(--text-min);font-weight:800;letter-spacing:1.5px;text-transform:uppercase;transition:opacity .3s}
/* depois do play: some o botão e o selo (o vídeo tem legenda embutida) e entram os controles nativos */
.video-screen.playing .video-play,.video-screen.playing .video-badge{opacity:0;pointer-events:none}
.video-screen.playing .video-play{transform:translate(-50%,-50%) scale(.92)}
.video-note{font-size:var(--text-min);color:var(--fg3);letter-spacing:1px;text-transform:uppercase;margin-top:14px;text-align:center}

/* 12 · AVALIAÇÕES (bloco antigo; o layout atual está em 25.3) */
/* cabeçalho agregado do Google (D1) — valores pendentes de D3, iguais aos da barra do hero */

/* 13 · CTA FINAL  (D6/D11 pendentes) -------------------------- */
.cta-box{position:relative;overflow:hidden;max-width:720px;margin:0 auto;text-align:center;padding:60px 48px;border:2px solid rgba(245,192,0,.26);border-radius:var(--r-lg);background:linear-gradient(135deg,rgba(217,222,232,.07),rgba(9,9,11,.96));box-shadow:0 35px 90px rgba(0,0,0,.45)}
.cta-box > *{position:relative;z-index:1}
.checker-bg{position:absolute;inset:0;z-index:0;pointer-events:none;background-image:linear-gradient(45deg,rgba(245,192,0,.03) 25%,transparent 25%),linear-gradient(-45deg,rgba(245,192,0,.03) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,rgba(245,192,0,.03) 75%),linear-gradient(-45deg,transparent 75%,rgba(245,192,0,.03) 75%);background-size:20px 20px}
.cta-box .checker-bg{position:absolute}
.cta-title{font-family:var(--font-display);font-weight:400;font-size:clamp(36px,8vw,52px);text-transform:uppercase;letter-spacing:1px;color:#fff}
.cta-box .sub{color:rgba(255,255,255,.66);font-size:15px;margin:16px 0 24px;line-height:1.7}
.cta-offer{display:inline-block;background:rgba(245,192,0,.10);border:1px solid var(--border-gold);border-radius:var(--r-pill);padding:8px 20px;font-size:var(--text-min);font-weight:600;letter-spacing:1px;color:var(--gold);margin-bottom:28px}
.cta-phone{display:block;font-family:var(--font-display);font-size:28px;letter-spacing:2px;line-height:48px;color:var(--gold);margin-bottom:var(--sp-3)}
.cta-phone:hover{color:var(--fg)}
.cta-phone2{display:inline-block;font-size:var(--text-min);color:rgba(255,255,255,.42);margin-top:6px;padding:16px 12px}

/* 14 · LOCALIZAÇÃO  (D8 embed do mapa e D11 NAP pendentes) ----- */
.loc-grid{display:grid;grid-template-columns:1fr 1.5fr;gap:var(--sp-5);align-items:stretch}
.loc-info{position:relative;overflow:hidden;min-width:0;padding:18px 26px;border:1px solid rgba(245,192,0,.14);border-radius:var(--r-lg);background:linear-gradient(180deg,rgba(18,18,22,.92),rgba(9,9,11,.98));box-shadow:var(--panel-shadow)}
.loc-info::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at top right,rgba(245,192,0,.10),transparent 34%),radial-gradient(circle at bottom left,rgba(192,57,43,.10),transparent 32%)}
.loc-info dl{position:relative;z-index:1;display:flex;flex-direction:column}
.loc-info .row{display:grid;grid-template-columns:112px 1fr;gap:var(--sp-3);align-items:start;padding:18px;margin:8px 0;border:1px solid rgba(255,255,255,.05);border-radius:var(--r-sm);background:linear-gradient(180deg,rgba(255,255,255,.025),rgba(255,255,255,.012));transition:border-color .28s var(--ease)}
.loc-info .row:hover{border-color:rgba(245,192,0,.22)}
.loc-info dt{font-size:var(--text-min);font-weight:700;text-transform:uppercase;letter-spacing:2px;color:rgba(245,192,0,.78);padding-top:3px}
.loc-info dd{color:#d8dde6;font-size:16px;line-height:1.6}
.loc-info a{color:#fff;transition:color .2s}
.loc-info a:hover{color:var(--gold)}
/* links de telefone/Instagram com área de toque ≥44px sem mudar o tamanho do texto */
.loc-info dd a{display:inline-block;padding:10px 0;line-height:24px}
.loc-info .row--links{align-items:center}
.loc-info .row--links dt{padding-top:0}
.map{display:flex;min-width:0;max-width:100%;min-height:420px;padding:8px;overflow:hidden;border:1px solid rgba(245,192,0,.16);border-radius:var(--r-lg);background:linear-gradient(180deg,rgba(18,18,22,.96),rgba(9,9,11,.98));box-shadow:var(--panel-shadow)}
.map iframe{flex:1;display:block;width:100%;max-width:100%;min-width:0;height:auto;min-height:404px;border:0;border-radius:var(--r-md);background:#111}

/* 15 · RODAPÉ -------------------------------------------------- */
.footer{background:linear-gradient(180deg,#09090B,#050506);padding:60px 0 40px;text-align:center}
.flogo{font-family:var(--font-display);font-size:28px;letter-spacing:4px;margin-bottom:8px}
.flogo .sbk{color:var(--gold)}
.fsub{font-size:var(--text-min);letter-spacing:3px;text-transform:uppercase;color:var(--fg3);margin-bottom:var(--sp-3)}
.flinks{display:flex;justify-content:center;gap:var(--sp-2);margin-bottom:var(--sp-4);flex-wrap:wrap}
.flinks a{display:inline-flex;align-items:center;min-height:44px;padding:0 10px;font-size:13px;font-weight:600;color:var(--fg2);transition:color .2s}
.flinks a:hover{color:var(--gold)}
.copyright{font-size:var(--text-min);color:var(--fg3)}

/* 16 · WHATSAPP FLUTUANTE ------------------------------------- */

/* 17 · RESPONSIVO --------------------------------------------- */
@media(max-width:900px){
  :root{--section-y:var(--sp-8)}
  .diag,.about-grid,.loc-grid,.video-proof-grid,.prevention-grid{grid-template-columns:1fr}
  .diag{padding:var(--sp-4);gap:var(--sp-5);border-radius:var(--r-md)}
  .about-grid,.video-proof-grid{gap:var(--sp-5)}
  .svc-grid{grid-template-columns:repeat(2,1fr)}
  .card,.card:nth-last-child(-n+2){grid-column:auto}
  .card.service-priority{grid-column:1 / -1}
  .pain-proof{grid-template-columns:1fr}
  .gal-mosaic{grid-template-columns:repeat(2,1fr)}
  .gal-item.gal-wide{grid-column:span 2}
  .hero-inner{padding-bottom:30px}
  .video-copy-panel{padding:28px;border-radius:var(--r-md)}
  .video-device{max-width:390px}
}
@media(max-width:560px){
  :root{--ribbonH:36px;--navH:52px;--wrap-x:18px;--section-y:64px}
  .sbk-ribbon-track{gap:14px;padding:0 14px;animation-duration:15s}
  .ribbon-item{gap:7px;letter-spacing:1px}
  .ribbon-item strong{font-size:22px;letter-spacing:1.5px}
  .ribbon-item b{font-size:24px;letter-spacing:2px}
  .ribbon-item em{letter-spacing:1.4px}
  .nav-cta{padding:8px 18px}
  .hero-overlay{background:
    linear-gradient(90deg,rgba(4,4,5,.78) 0%,rgba(4,4,5,.58) 55%,rgba(4,4,5,.34) 100%),
    linear-gradient(to bottom,rgba(9,9,11,.30) 0%,rgba(9,9,11,.36) 30%,rgba(9,9,11,.62) 70%,#09090B 100%)}
  .hero-video video{object-position:62% center}
  .hero-inner{padding-top:calc(var(--navH) + 32px)}
  .eyebrow{letter-spacing:1.2px;padding:8px 12px}
  .hero-h1{font-size:clamp(42px,12vw,54px);line-height:.94;margin-bottom:18px}
  .hero-sub{line-height:1.65;letter-spacing:1.6px;margin-bottom:var(--sp-4)}
  .stats-inner{display:grid;grid-template-columns:1fr 1fr;gap:18px 12px;padding:20px 0}
  .hero-ctas{flex-direction:column;gap:10px;width:100%}
  .hero-ctas > div{width:100%}
  .hero-ctas .btn{width:100%;white-space:normal;text-align:center}
  .hero-ctas .btn-ghost{display:none}
  .micro{max-width:100%}
  .pain p{font-size:16px}
  .diag{padding:20px 16px;gap:var(--sp-4)}
  .diag-copy p{font-size:16px;line-height:1.7}
  .benefits{gap:10px}
  .benefits li{padding:15px 15px 15px 18px;line-height:1.55}
  .svc-grid{grid-template-columns:1fr}
  .card.service-priority{grid-column:auto}
  .ico{width:56px;height:56px}
  .ico svg{width:30px;height:30px}
  .prevention{padding:var(--sp-4) 20px;border-radius:var(--r-md)}
  .about-badge{left:12px;right:12px;bottom:12px;max-width:none;text-align:center;letter-spacing:1px;padding:9px 10px}
  .gal-item,.cta-box,.loc-info,.map{border-radius:var(--r-md)}
  .gal-cap{padding:11px 12px 13px}
  .ct{font-size:17px;letter-spacing:.3px}
  .cs{letter-spacing:.4px;margin-top:3px}
  .lb-stage{padding:66px 14px 24px}
  .lb-btn{width:44px;height:44px;min-width:44px;font-size:22px}
  .lb-close{top:10px;right:10px}
  .lb-prev{left:10px}
  .lb-next{right:10px}
  .video-proof-grid{gap:var(--sp-4)}
  .video-copy-panel{padding:24px 20px}
  .video-title{font-size:clamp(42px,13vw,58px)}
  .video-copy-panel p{font-size:16px;line-height:1.68}
  .video-device{max-width:330px;padding:10px;border-radius:var(--r-md)}
  .video-screen{border-radius:var(--r-sm)}
  .video-play{padding:14px 18px 14px 14px;font-size:13px}
  .video-play span{width:31px;height:31px}
  .video-badge{left:16px;top:16px;padding:7px 10px;letter-spacing:1px}
  .cta-box{padding:42px 22px}
  .cta-box .btn{width:100%;padding-left:18px;padding-right:18px;white-space:normal;text-align:center}
  .loc-grid{gap:var(--sp-3)}
  .loc-info{padding:14px}
  .loc-info .row{grid-template-columns:96px 1fr;gap:12px;padding:15px 14px;margin:6px 0}
  .loc-info dt{letter-spacing:1.2px}
  .map{min-height:320px;padding:6px}
  .map iframe{min-height:308px;border-radius:var(--r-sm)}
  .footer{padding-bottom:84px}
}

/* 18 · MOVIMENTO REDUZIDO — cobre todas as animações e transições */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .reveal{opacity:1;transform:none}
  .btn:hover,.card:hover,.benefits li:hover,.diag-photo:hover img,.card:hover .ico,.gal-item:hover,.gal-item:hover .gal-open img{transform:none}
  .lb-prev,.lb-next{transform:translateY(-50%)}
}

/* ============================================================
   19 · RODADA R5 — sete blocos, menos dourado, duas animações principais
   Bloco acrescentado ao final: sobrepõe as regras anteriores das seções
   refeitas. Regras de seções que saíram do HTML (dor, prevention, sobre,
   mosaico) ficaram acima sem uso e podem ser limpas depois.
   ============================================================ */
body{background:var(--bg)}
.only-narrow{display:none}
.alias{position:absolute;top:0;left:0;width:0;height:0;overflow:hidden}
.sec-kicker{margin-bottom:14px;gap:0}
.fade-once{opacity:0;transition:opacity .7s var(--ease)}
.fade-once.in,.no-js .fade-once{opacity:1}
.btn-sm{padding:10px 20px;min-height:44px;font-size:13px;box-shadow:none}

/* 19.1 · HERO — vídeo real perceptível; escurecimento só atrás do texto */
.hero{min-height:480px;min-height:clamp(480px,min(88vh,62vw),840px);min-height:clamp(480px,min(88svh,62vw),840px)}
.hero-bg img{object-position:center}
.hero-video{background:transparent}
.hero-overlay{background:
  linear-gradient(90deg,rgba(4,4,5,.74) 0%,rgba(4,4,5,.48) 30%,rgba(4,4,5,.10) 58%,transparent 100%),
  linear-gradient(to bottom,transparent 58%,rgba(9,9,11,.55) 88%,#09090B 100%)}
.hero-inner{padding:calc(var(--navH) + 40px) 0 var(--sp-5)}
.eyebrow{margin-bottom:18px;border-width:1px}
.hero-h1{font-size:clamp(52px,6.6vw,88px);max-width:640px;margin-bottom:var(--sp-3)}
.hero-sub{font-size:18px;letter-spacing:0;text-transform:none;line-height:1.5;color:rgba(255,255,255,.86);margin-bottom:var(--sp-4);max-width:620px;text-shadow:0 2px 12px rgba(0,0,0,.7)}
.hero-ctas{align-items:center}
.stats{background:linear-gradient(180deg,rgba(9,9,11,.30),rgba(9,9,11,.72));border-top:1px solid rgba(217,222,232,.12)}
.stats-inner{list-style:none;justify-content:flex-start;gap:var(--sp-7);padding:18px 0}
.stat{display:flex;align-items:baseline;gap:10px;text-align:left}
.num{font-size:clamp(26px,3vw,34px);white-space:nowrap}
.cap{margin-top:0;letter-spacing:1.6px;color:rgba(217,222,232,.66)}

/* 19.2 · REVISÃO — esquema que se desenha + checklist com marca */
.rev-layout{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-7);align-items:center}
.rev .sec-h2{font-size:clamp(36px,5vw,54px)}
.rev-text{color:var(--fg2);font-size:18px;line-height:1.7;margin:var(--sp-4) 0;max-width:520px}
.rev-check{list-style:none;display:grid;gap:10px;max-width:520px}
.rev-check li{display:flex;align-items:center;gap:14px;padding:14px 16px;border:1px solid var(--border);border-radius:var(--r-sm);background:rgba(255,255,255,.02);font-weight:600;font-size:16px;color:var(--fg)}
.chk{width:26px;height:26px;flex:0 0 26px;fill:none;stroke-linecap:round;stroke-linejoin:round}
.chk-box{stroke:rgba(217,222,232,.30);stroke-width:1.5}
.chk-mark{stroke:var(--gold);stroke-width:2.4;stroke-dasharray:1;stroke-dashoffset:0}
.rev-scheme svg{width:100%;height:auto;fill:none;stroke-linecap:round;stroke-linejoin:round;overflow:visible}
.sch-line > *{stroke:rgba(217,222,232,.58);stroke-width:2;stroke-dasharray:1;stroke-dashoffset:0}
.sch-pin path{stroke:var(--gold);stroke-width:1.5;stroke-dasharray:1;stroke-dashoffset:0}
.sch-dot circle{fill:var(--gold);stroke:none}
.sch-num{display:none}
.rev-scheme-note{font-size:var(--text-min);letter-spacing:2px;text-transform:uppercase;color:var(--fg3);text-align:right;margin-top:8px}
/* estado armado: só existe com JS, IntersectionObserver e movimento permitido */
.rev.armed .sch-line > *,.rev.armed .sch-pin path,.rev.armed .chk-mark{stroke-dashoffset:1}
.rev.armed .sch-dot{opacity:0}
.rev.armed.drawn .sch-line > *{stroke-dashoffset:0;transition:stroke-dashoffset 1.1s var(--ease)}
.rev.armed.drawn .sch-line > *:nth-child(n+5){transition-delay:.25s}
.rev.armed.drawn .sch-line > *:nth-child(n+9){transition-delay:.5s}
.rev.armed.drawn .sch-pin path{stroke-dashoffset:0;transition:stroke-dashoffset .6s var(--ease) 1.3s}
.rev.armed.drawn .sch-dot{opacity:1;transition:opacity .4s var(--ease) 1.5s}
.rev.armed.drawn .chk-mark{stroke-dashoffset:0;transition:stroke-dashoffset .45s var(--ease)}
.rev.armed.drawn .rev-check li:nth-child(1) .chk-mark{transition-delay:1.7s}
.rev.armed.drawn .rev-check li:nth-child(2) .chk-mark{transition-delay:2.0s}
.rev.armed.drawn .rev-check li:nth-child(3) .chk-mark{transition-delay:2.3s}
.rev.armed.drawn .rev-check li:nth-child(4) .chk-mark{transition-delay:2.6s}

/* 19.3 · DIAGNÓSTICO — compacto, sem brilho dourado */
.diag{border-color:var(--steel);background:var(--panel-bg);box-shadow:0 24px 70px rgba(0,0,0,.34);align-items:center}
.diag-photo{border:1px solid var(--steel);box-shadow:none}
.diag-photo:hover img{transform:none}
.diag-title{margin-top:0}
.diag-copy p{font-size:17px}
.benefits{margin:20px 0 28px}
.benefits li{border-left:2px solid rgba(245,192,0,.6);background:rgba(255,255,255,.02);box-shadow:none;padding:13px 16px;font-size:16px}
.benefits li:hover{transform:none}

/* 19.4 · SERVIÇOS — Revisão e Motor com o mesmo peso; demais compactos */
.svc-top{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap-cards);margin-top:var(--sp-6)}
.svc-top .card{grid-column:auto;padding:32px;border:1px solid var(--steel);border-top:3px solid var(--gold)}
.card::before{display:none}
.card:hover{transform:translateY(-3px);box-shadow:0 18px 50px rgba(0,0,0,.45)}
.card:hover h3{color:inherit}
.svc-top .card h3{font-size:30px;color:#fff}
.svc-top .card p{font-size:16px;color:rgba(255,255,255,.76);line-height:1.6}
.ico{width:auto;height:auto;justify-content:flex-start;margin-bottom:var(--sp-3);border:0;background:none;box-shadow:none;color:var(--gold-soft)}
.ico svg{width:34px;height:34px}
.card:hover .ico{transform:none}
.svc-list{list-style:none;display:grid;grid-template-columns:repeat(2,1fr);gap:0 var(--sp-5);margin-top:var(--sp-4)}
.svc-list li{padding:18px 0;border-bottom:1px solid var(--border)}
.svc-list h3{font-family:var(--font-display);font-weight:400;font-size:21px;text-transform:uppercase;letter-spacing:.5px;line-height:1.15}
.svc-list p{font-size:16px;color:var(--fg2);margin-top:4px;line-height:1.55}
.svc-cta{margin-top:var(--sp-5)}

/* 19.5 · OFICINA — só as duas fotos novas; recorte único no desktop, trilho manual no mobile */
.ofi-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:var(--sp-7);align-items:center}
.ofi-copy p{color:var(--fg2);font-size:18px;line-height:1.7;margin-top:var(--sp-4);max-width:440px}
.ofi-photos{display:grid;grid-template-columns:1fr 1.1fr;gap:var(--gap-cards);align-items:end}
.ofi-photos:focus-visible{outline:2px solid var(--gold);outline-offset:6px}
.ofi-b{margin-bottom:var(--sp-7)}
.ofi .gal-item{max-width:none;border:1px solid var(--steel)}
.ofi .gal-item:hover{transform:none;border-color:rgba(217,222,232,.26)}
.ofi .gal-item:hover .gal-open img{transform:none}
.ofi .gal-cap{border-top:1px solid var(--border);padding:12px 16px 14px}
.ofi .cs{font-size:14px;letter-spacing:0;color:var(--fg2);margin:0}
.ofi-ctrl{display:none}
.ofi-btn{width:48px;height:48px;display:flex;align-items:center;justify-content:center;border:1px solid rgba(217,222,232,.24);border-radius:50%;background:rgba(255,255,255,.04);color:var(--fg);font-family:var(--font-body);font-size:24px;line-height:1;cursor:pointer;touch-action:manipulation}
.ofi-btn[disabled]{opacity:.32;cursor:default}
.ofi-count{min-width:44px;text-align:center;font-weight:700;font-size:14px;letter-spacing:2px;color:var(--fg2)}
@media(min-width:901px){
  .ofi-photos.armed .gal-open img{clip-path:inset(0 0 100% 0)}
  .ofi-photos.armed.in .gal-open img{clip-path:inset(0 0 0 0);transition:clip-path 1s var(--ease)}
  .ofi-photos.armed.in .ofi-b .gal-open img{transition-delay:.25s}
}
/* vídeo da oficina (preservado), agora dentro da seção */
.ofi .video-proof-grid{margin-top:var(--sp-8);grid-template-columns:1fr 320px;gap:var(--sp-7)}
.video-copy-panel{padding:0;border:0;background:none;box-shadow:none}
.video-title{font-size:clamp(32px,4.4vw,48px);margin:0 0 12px}
.video-device{max-width:320px;padding:8px;background:rgba(255,255,255,.06);box-shadow:0 24px 70px rgba(0,0,0,.5)}
.video-badge{border-color:rgba(217,222,232,.28);color:var(--fg)}

/* 19.6 · AVALIAÇÕES — grade estática, sem carrossel */

/* 19.7 · FECHAMENTO + LOCALIZAÇÃO — um bloco, compacto */
.cta-box{padding:44px 40px;border:1px solid var(--steel);box-shadow:none}
.cta-btns{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--sp-3);margin-top:var(--sp-4)}
.cta-box .sub{margin:var(--sp-3) 0 0;font-size:16px}
.loc{margin-top:var(--sp-7);position:relative}
.loc-title{font-size:clamp(30px,5vw,40px);margin:0 0 var(--sp-4)}
.loc-grid{grid-template-columns:1fr 1.2fr;gap:var(--sp-4)}
.loc-info{padding:24px;border-color:var(--steel)}
.loc-info::before{display:none}
.loc-name{font-weight:700;font-size:17px;color:#fff}
.loc-addr a{display:inline-block;padding:10px 0;line-height:1.5;text-decoration:underline;text-underline-offset:4px}
.loc-go{margin:4px 0 var(--sp-3)}
.loc-info .loc-go a{color:var(--fg)}
.loc-info .row{grid-template-columns:96px 1fr;gap:var(--sp-3);padding:8px 0;margin:0;border:0;border-top:1px solid var(--border);border-radius:0;background:none;align-items:center}
.loc-info .row:hover{border-color:var(--border)}
.loc-info dt{color:var(--fg3);padding-top:0}
.loc-area{margin-top:var(--sp-3);color:var(--fg2);font-size:16px}
.map{min-height:0;padding:6px;border-color:var(--steel)}
.map iframe{min-height:300px}

@media(max-width:900px){
  .rev-layout,.ofi-grid,.loc-grid{grid-template-columns:1fr}
  .rev-layout{gap:var(--sp-5)}
  .rev-scheme{order:-1;max-width:520px}
  .ofi-grid{gap:var(--sp-5)}
  /* O2: trilho horizontal manual */
  .ofi-photos{display:flex;align-items:center;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:2px}
  .ofi-photos::-webkit-scrollbar{display:none}
  .ofi-photos .gal-item{flex:0 0 68%;scroll-snap-align:center}
  .ofi-photos .ofi-b{flex-basis:88%;margin-bottom:0}
  .ofi-ctrl{display:flex;align-items:center;justify-content:center;gap:var(--sp-3);margin-top:12px}
  .ofi .video-proof-grid{grid-template-columns:1fr;gap:var(--sp-4);margin-top:var(--sp-7)}
  .video-device{margin:0}
  .map iframe{min-height:260px}
}
@media(max-width:700px){
  .only-wide{display:none}
  .only-narrow{display:inline}
  /* hero mobile: o vídeo 9:16 aparece inteiro; o texto fica sobre a área escura que o próprio vídeo já traz */
  .hero{min-height:0;aspect-ratio:9/16;max-height:100vh;max-height:100svh}
  .hero-bg img,.hero-video video{object-position:center top}
  .hero-overlay{background:linear-gradient(to bottom,transparent 62%,rgba(9,9,11,.55) 88%,#09090B 100%)}
  .hero-inner{padding:0 0 14px}
  .eyebrow{margin-bottom:10px;padding:6px 12px;letter-spacing:1.4px}
  .hero-h1{font-size:clamp(38px,11.4vw,52px);line-height:.94;margin-bottom:8px}
  .hero-sub{font-size:16px;margin-bottom:14px}
  .hero-ctas{flex-direction:column;gap:10px;width:100%}
  .hero-ctas .btn{width:100%}
  .hero-ctas .btn-ghost{display:none}
  .stats-inner{display:grid;grid-template-columns:auto auto auto;justify-content:space-between;gap:8px;padding:12px 0}
  .stat{flex-direction:column;align-items:flex-start;gap:2px}
  .num{font-size:24px}
  .cap{letter-spacing:.6px}
  .svc-list{grid-template-columns:1fr}
}
@media(max-width:560px){
  .rev-text,.ofi-copy p{font-size:16px}
  .svc-top{grid-template-columns:1fr}
  .svc-top .card{padding:24px 22px}
  .svc-top .card h3{font-size:26px}
  .ico{width:auto;height:auto}
  .ico svg{width:30px;height:30px}
  .ofi-photos .gal-item{flex-basis:72%}
  .ofi-photos .ofi-b{flex-basis:90%}
  .video-device{max-width:260px}
  .cta-box{padding:32px 20px}
  .cta-btns{flex-direction:column}
  .loc{margin-top:var(--sp-6)}
  .loc-info{padding:18px}
  .loc-info .row{grid-template-columns:88px 1fr;padding:8px 0;margin:0}
  .map{min-height:0}
  .map iframe{min-height:220px}
}
@media(prefers-reduced-motion:reduce){
  .fade-once{opacity:1}
}

/* ============================================================
   20 · HERO v2 (refino de 11/10/2026) — título no alto, centro livre para o vídeo,
   localização simples + CTA embaixo, indicadores integrados ao fundo.
   Nenhum backdrop-filter sobre o vídeo (custo de composição a cada quadro).
   ============================================================ */
:root{--navH:50px}
.nav{background:linear-gradient(180deg,rgba(6,6,8,.62),rgba(6,6,8,0));border-bottom:0;-webkit-backdrop-filter:none;backdrop-filter:none}
.nav.scrolled{background:linear-gradient(180deg,rgba(6,6,8,.62),rgba(6,6,8,0))}
.ribbon-on .nav,.ribbon-on .nav.scrolled,.no-js .nav{background:rgba(9,9,11,.92);border-bottom:1px solid rgba(255,255,255,.055);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.nav-cta{padding:6px 18px;min-height:44px;font-size:13px;box-shadow:none}
.hero-content{flex:1;display:flex;flex-direction:column}
.hero-top{margin-top:auto;padding-top:calc(var(--navH) + 24px)}
.hero-bottom{padding-bottom:var(--sp-4)}
.hero-h1{margin-bottom:var(--sp-2)}
.hero-sub{margin-bottom:var(--sp-3)}
.hero-loc{font-size:var(--text-min);font-weight:700;letter-spacing:2.6px;text-transform:uppercase;color:rgba(255,255,255,.82);margin-bottom:14px;text-shadow:0 1px 8px rgba(0,0,0,.8)}
.hero-overlay{background:
  linear-gradient(90deg,rgba(4,4,5,.72) 0%,rgba(4,4,5,.46) 30%,rgba(4,4,5,.08) 58%,transparent 100%),
  linear-gradient(to bottom,transparent 72%,rgba(9,9,11,.62) 100%)}
.stats{background:none;border-top:0;-webkit-backdrop-filter:none;backdrop-filter:none}
.stats-inner{padding:6px 0 20px}
.star{color:var(--gold)}
.cap{display:inline-flex;align-items:center;gap:6px}
.g-ico{width:14px;height:14px;flex:0 0 14px}
@media(max-width:700px){
  :root{--navH:48px}
  .nav-cta{padding:5px 15px;font-size:12.5px}
  /* três áreas: alto (H1 + apoio), centro livre, baixo (localização + CTA). O vídeo 9:16 aparece inteiro;
     a faixa preta de baixo é do próprio MP4, então o site não soma gradiente inferior. */
  .hero{max-height:calc(100vh + 40px);max-height:calc(100svh + 40px)}
  .hero-overlay{background:linear-gradient(to bottom,rgba(4,4,5,.60) 0%,rgba(4,4,5,.36) 16%,rgba(4,4,5,0) 34%)}
  .hero-top{margin-top:0;margin-bottom:auto;padding-top:calc(var(--navH) + 14px);text-align:center}
  .hero-h1{font-size:clamp(34px,10.2vw,46px);line-height:.95;max-width:9.5em;margin:0 auto 6px}
  .hero-sub{font-size:16px;margin:0 auto;max-width:none}
  .hero-bottom{text-align:center;padding-bottom:10px}
  .hero-loc{margin-bottom:10px;letter-spacing:2.2px}
  .hero-ctas{align-items:center}
  .hero-ctas .btn{width:auto;min-width:210px;min-height:46px;padding:12px 26px;font-size:14px}
  .stats-inner{grid-template-columns:repeat(3,auto);justify-content:space-around;gap:6px;padding:4px 0 12px}
  .stat{align-items:center;text-align:center}
  .num{font-size:22px}
  .cap{font-size:var(--text-min);letter-spacing:.4px}
}

/* ============================================================
   21 · HERO v3 (11/10/2026, DEC-016) — assinatura no canto, indicadores maiores lado a lado,
   pista "Conheça a oficina", sem CTA no topo do mobile, transição inferior curta.
   ============================================================ */
.hero{min-height:480px;min-height:clamp(480px,min(94vh,62vw),900px);min-height:clamp(480px,min(94svh,62vw),900px)}
.hero-overlay{background:
  linear-gradient(90deg,rgba(4,4,5,.72) 0%,rgba(4,4,5,.46) 30%,rgba(4,4,5,.08) 58%,transparent 100%),
  linear-gradient(to bottom,transparent 84%,rgba(9,9,11,.42) 100%)}
.hero-sig-wrap{position:absolute;top:0;left:0;right:0;z-index:2;pointer-events:none}
.hero-sig{display:inline-flex;flex-direction:column;padding-top:14px;line-height:1;text-transform:uppercase;color:#fff;text-shadow:0 2px 10px rgba(0,0,0,.75)}
.sig-a{font-family:var(--font-display);font-size:26px;letter-spacing:2px}
.sig-a b{font-weight:400;color:var(--gold)}
.sig-b{font-family:var(--font-body);font-size:10px;font-weight:800;letter-spacing:4.6px;margin-top:3px;color:rgba(255,255,255,.86)}
.hero-top{padding-top:calc(var(--navH) + 40px)}
.hero-sub{max-width:560px}
.hero-bottom{display:flex;flex-wrap:wrap;align-items:center;gap:0 var(--sp-5);padding-bottom:var(--sp-3)}
.hero-loc{flex:0 0 100%}
.hero-next{display:inline-flex;align-items:center;gap:8px;min-height:44px;margin-left:auto;font-size:13px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;color:rgba(255,255,255,.86);text-shadow:0 1px 8px rgba(0,0,0,.8)}
.hero-next:hover{color:var(--gold-soft)}
.hero-next span{display:inline-block;animation:nextbob 1.6s var(--ease) 1.2s 3}
@keyframes nextbob{0%,100%{transform:none}50%{transform:translateY(5px)}}
.stats-inner{gap:var(--sp-8);padding:4px 0 22px}
.stat{flex-direction:column;align-items:flex-start;gap:4px}
.num{font-size:clamp(34px,3.4vw,46px);line-height:1}
.cap{font-size:var(--text-min);letter-spacing:2px}
@media(max-width:700px){
  :root{--navH:0px}
  /* sem CTA no topo do mobile: a nav deixa de existir nessa largura (a faixa segue da 2ª seção em diante
     e o WhatsApp flutuante aparece depois da hero) */
  .nav{display:none}
  /* o vídeo 9:16 aparece sempre inteiro: sem teto de altura, logo sem corte nem zoom em telas baixas */
  .hero{min-height:0;max-height:none}
  .hero-overlay{background:linear-gradient(to bottom,rgba(4,4,5,.58) 0%,rgba(4,4,5,.32) 17%,rgba(4,4,5,0) 33%)}
  .hero-sig{padding-top:12px}
  .sig-a{font-size:21px;letter-spacing:1.6px}
  .sig-b{font-size:8.5px;letter-spacing:3.8px}
  .hero-top{padding-top:64px}
  .hero-h1{font-size:clamp(34px,10.2vw,46px)}
  .hero-sub{font-size:16px;max-width:19em;margin:0 auto}
  .hero-bottom{display:block;padding-bottom:0}
  .hero-ctas .btn{min-width:200px;min-height:46px;padding:11px 24px}
  .hero-next{margin:2px auto 0;font-size:12px;letter-spacing:1px}
  .stats-inner{grid-template-columns:repeat(3,auto);justify-content:space-around;gap:6px;padding:2px 0 14px}
  .stat{align-items:center;text-align:center;gap:3px}
  .num{font-size:clamp(28px,8.4vw,36px)}
  .cap{font-size:var(--text-min);letter-spacing:.3px}
}
@media(prefers-reduced-motion:reduce){.hero-next span{animation:none}}
/* nav sobre a hero: só o botão, sem véu (não apaga a assinatura); o topo da hero ganha um gradiente curto */
.nav,.nav.scrolled{background:none}
.ribbon-on .nav,.ribbon-on .nav.scrolled,.no-js .nav{background:rgba(9,9,11,.92)}
@media(min-width:701px){
  .hero-overlay{background:
    linear-gradient(to bottom,rgba(4,4,5,.50) 0%,rgba(4,4,5,0) 15%),
    linear-gradient(90deg,rgba(4,4,5,.72) 0%,rgba(4,4,5,.46) 30%,rgba(4,4,5,.08) 58%,transparent 100%),
    linear-gradient(to bottom,transparent 84%,rgba(9,9,11,.42) 100%)}
}

/* ============================================================
   22 · HERO MOBILE — ajuste cirúrgico (11/10/2026). SÓ dentro da media query mobile;
   fora dela há apenas a regra que esconde o ícone novo, para o desktop não mudar.
   ============================================================ */
.next-ico{display:none}
@media(max-width:700px){
  /* --hero-keep = fração da ALTURA do vídeo 9:16 que a hero mostra. A imagem do arquivo termina em ~70,8%
     (linha 906 de 1280); o que fica de fora com .85 são só linhas 100% pretas do próprio MP4 (R7: .88 → .85; .84 punha localização e CTA sobre a roda da moto).
     Para voltar ao vídeo inteiro: --hero-keep:1 */
  :root{--hero-keep:.85}
  .hero{aspect-ratio:9 / calc(16 * var(--hero-keep));overflow:visible;z-index:2}
  .hero-bg,.hero-video{overflow:hidden}
  .hero-bg img,.hero-video video{height:calc(100% / var(--hero-keep));object-position:center top}
  .hero-top{padding-top:58px}
  .hero-h1{margin-bottom:8px}
  .hero-loc{margin-bottom:8px}
  .hero-next{margin-top:0;gap:10px}
  .hero-bottom{padding-bottom:26px}
  /* dois indicadores, centralizados, a cavalo na transição hero → próxima seção */
  .stats{position:absolute;left:0;right:0;bottom:0;transform:translateY(62%)}
  .stats-inner{grid-template-columns:repeat(2,auto);justify-content:center;gap:44px;padding:0}
  .stat-reviews{display:none}
  .rev{padding-top:calc(var(--section-y) + 6px)}
  /* pista de rolagem: ícone com um ponto que desce três vezes e para */
  .hero-next .next-arrow{display:none}
  .next-ico{display:block;width:14px;height:22px;overflow:visible}
  .next-ico rect{fill:none;stroke:rgba(255,255,255,.72);stroke-width:1.4}
  .next-ico circle{fill:var(--gold);animation:nextdot 1.9s var(--ease) 1s 3}
  /* xadrez em "EDILSON": versão discreta, branco × cinza muito claro em quadros de 2,5 px. O xadrez de alto contraste
     (branco × cinza médio, 3,5 px) foi testado e quebrava a leitura das letras; preto some sobre o vídeo escuro. */
  .sig-ed{background:conic-gradient(#fff 25%,#c9ced6 0 50%,#fff 0 75%,#c9ced6 0) 0 0/5px 5px;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;text-shadow:none}
}
@keyframes nextdot{0%{transform:translateY(0);opacity:0}20%{opacity:1}70%{transform:translateY(8.5px);opacity:1}100%{transform:translateY(8.5px);opacity:0}}

/* ============================================================
   23 · RODADA R6 — DESKTOP (12/10/2026)
   Todo o layout novo vive em @media(min-width:1024px). Abaixo disso o bloco só
   esconde o que é novo (moto grande, molduras monitor/celular, controles do
   trilho, ícones extras dos serviços) para o mobile ficar como antes.
   Única exceção fora de 1024px: a CTA do topo (nav) deixa de acompanhar a
   rolagem a partir de 701px (no mobile ela já não existia).
   ============================================================ */

/* 23.0 · neutro abaixo de 1024px */
.mon-line,.ph-line,.svc-ico{display:none}
.svc-list li:last-child p{display:none}

/* 23.1 · HERO e CTA do topo (a CTA fica só sobre o hero; depois dele a faixa da marca segue sozinha) */
@media(min-width:701px){
  :root{--navH:64px}
  html{scroll-padding-top:calc(var(--ribbonH) + 8px)}
  .ribbon-on .nav,.no-js .nav{display:none}
}
@media(min-width:1024px){
  /* origem da "massa preta": o MP4 desktop não tem faixa (1280x720 útil em todos os quadros). A massa vinha do layout:
     hero mais baixo que a janela (94vh / 62vw) + 120px de respiro da seção seguinte + degradê inferior forte. */
  .hero{min-height:560px;min-height:clamp(560px,min(100vh,80vw),1100px);min-height:clamp(560px,min(100svh,80vw),1100px)}
  .hero-overlay{background:
    linear-gradient(to bottom,rgba(4,4,5,.50) 0%,rgba(4,4,5,0) 15%),
    linear-gradient(90deg,rgba(4,4,5,.72) 0%,rgba(4,4,5,.46) 30%,rgba(4,4,5,.08) 58%,transparent 100%),
    linear-gradient(to bottom,transparent 92%,rgba(9,9,11,.28) 100%)}
}

/* 23.2 · REVISÃO + MOTO ANIMADA */
@media(min-width:1024px){
  .rev{padding-top:var(--sp-8)}
  .rev-layout{grid-template-columns:minmax(0,.5fr) minmax(0,1.5fr);gap:var(--sp-5);align-items:center}
  /* explicação em UM bloco: moldura única, linhas separadas por filete */
  .rev-check{max-width:460px;gap:0;border:1px solid var(--steel);border-radius:var(--r-md);background:rgba(255,255,255,.02);overflow:hidden}
  .rev-check li{border:0;border-top:1px solid var(--border);border-radius:0;background:none;padding:14px 20px;transition:background .4s var(--ease)}
  .rev-check li:first-child{border-top:0}
  .rev-check li.on{background:rgba(245,192,0,.055)}
  .rev-check li.on .chk-box{stroke:var(--gold)}
  .chk-box{transition:stroke .4s var(--ease)}
}

/* moto e chamadas: valem em todas as larguras (R7; antes só 1024px+) */
  .mt-stage{display:block;position:relative;aspect-ratio:960/540}
  .mt-svg{width:100%;height:100%;fill:none;stroke-linecap:round;stroke-linejoin:round;overflow:visible}
  .mt-body path{stroke:rgba(217,222,232,.62);stroke-width:2.2;stroke-dasharray:1;stroke-dashoffset:0}
  .mt-lead{stroke:var(--gold);stroke-width:1.6;stroke-dasharray:1;stroke-dashoffset:0}
  .mt-dot{fill:var(--gold);stroke:none;transform-box:fill-box;transform-origin:center}
  .mt-ping{fill:none;stroke:var(--gold);stroke-width:1.6;opacity:0;transform-box:fill-box;transform-origin:center}
  .mt-lbl{--tx:0px;--ty:0px;position:absolute;left:var(--x);top:var(--y);font-size:14px;font-weight:700;letter-spacing:1.3px;text-transform:uppercase;line-height:1;white-space:nowrap;color:var(--fg2);padding:9px 12px;border:1px solid transparent;border-radius:var(--r-pill);transform:translate(var(--tx),var(--ty));transition:color .45s var(--ease),border-color .45s var(--ease),background .45s var(--ease)}
  .mt-lbl.l-c{--tx:-50%}
  .mt-lbl.l-l{--ty:-50%}
  .mt-lbl.on{color:#fff;border-color:rgba(245,192,0,.5);background:rgba(245,192,0,.08)}
  .rev [data-k="0"]{--k:0}.rev [data-k="1"]{--k:1}.rev [data-k="2"]{--k:2}.rev [data-k="3"]{--k:3}
  .rev-moto .rev-scheme-note{margin-top:0}

  /* armado (só com JS + IntersectionObserver + movimento permitido). Linha-base: moto → chamadas em sequência */
  .rev.armed .mt-body path,.rev.armed .mt-lead{stroke-dashoffset:1}
  .rev.armed .mt-dot{opacity:0;transform:scale(.2)}
  .rev.armed .mt-lbl{opacity:0;transform:translate(var(--tx),calc(var(--ty) + 10px))}
  .rev.armed.drawn .mt-body path{stroke-dashoffset:0;transition:stroke-dashoffset 1.25s var(--ease) calc(var(--i) * 70ms)}
  .rev.armed.drawn .mt-lead{stroke-dashoffset:0;transition:stroke-dashoffset .55s var(--ease) calc(2.7s + var(--k) * .6s)}
  .rev.armed.drawn .mt-dot{opacity:1;transform:none;transition:opacity .3s var(--ease) calc(3.2s + var(--k) * .6s),transform .5s cubic-bezier(.3,1.6,.5,1) calc(3.2s + var(--k) * .6s)}
  .rev.armed.drawn .mt-lbl{opacity:1;transform:translate(var(--tx),var(--ty));transition:opacity .5s var(--ease) calc(3.35s + var(--k) * .6s),transform .5s var(--ease) calc(3.35s + var(--k) * .6s),color .45s var(--ease),border-color .45s var(--ease),background .45s var(--ease)}
  .rev.armed.drawn .rev-check li[data-k] .chk-mark{transition-delay:calc(3.4s + var(--k) * .6s)}
  /* microativação em loop: só opacity/transform (anel que se expande + pulso do ponto) */
  .mt-call.on .mt-ping{animation:mtping 1.7s var(--ease) 1}
  .mt-call.on .mt-dot{animation:mtdot 1.7s var(--ease) 1}
@keyframes mtping{0%{opacity:.9;transform:scale(1)}100%{opacity:0;transform:scale(3.8)}}
@keyframes mtdot{0%,100%{transform:scale(1)}35%{transform:scale(1.6)}}

/* 23.3 · DIAGNÓSTICO — CTA com destaque e respiro, no fim do conteúdo técnico */
@media(min-width:1024px){
  .diag{grid-template-columns:.92fr 1.08fr;padding:var(--sp-6);gap:var(--sp-7)}
  .diag-copy{display:flex;flex-direction:column;align-items:flex-start;padding:0}
  .diag-copy .benefits{width:100%;margin:20px 0 0}
  .diag-copy .btn{margin-top:var(--sp-6);min-height:56px;padding:18px 38px;font-size:15px;background:var(--red);border-color:var(--red);color:#fff;box-shadow:0 18px 40px rgba(192,57,43,.28)}
  .diag-copy .btn:hover{background:var(--red-hover);border-color:var(--red-hover);color:#fff}
}

/* 23.4 · SERVIÇOS — seis especialidades em cards equivalentes */
@media(min-width:1024px){
  .svc-wrap{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap-cards);margin-top:var(--sp-6)}
  .svc-top,.svc-list{display:contents}
  .svc-top .card,.svc-list li{grid-column:auto;position:relative;padding:32px 30px;border:1px solid var(--steel);border-radius:var(--r-md);background:linear-gradient(180deg,rgba(24,24,28,.88),rgba(9,9,11,.98))}
  .svc-top .card{border-top:1px solid var(--steel)}
  .svc-list li{transition:box-shadow .3s var(--ease)}
  .svc-list li:hover{box-shadow:0 18px 50px rgba(0,0,0,.45)}
  .svc-top .card h3,.svc-list h3{font-size:26px;line-height:1.05;color:#fff;margin-bottom:10px}
  .svc-top .card p,.svc-list p{display:block;margin-top:0;font-size:16px;line-height:1.6;color:var(--fg2)}
  .svc-list li:last-child p{display:block}
  .svc-ico{display:flex;margin-bottom:var(--sp-3)}
  .svc-ico svg{width:34px;height:34px;stroke:currentColor;fill:none;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
  /* revelação suave em cascata: a lista inteira entra pelo próprio .reveal, os cards pela ordem */
  .svc-list.reveal{opacity:1;transform:none;transition:none}
  .svc-list li{opacity:0;transform:translateY(24px)}
  .svc-list.in li{opacity:1;transform:none;transition:opacity .65s var(--ease),transform .65s var(--ease),box-shadow .3s var(--ease)}
  .svc-list.in li:nth-child(1){transition-delay:.12s,.12s,0s}.svc-list.in li:nth-child(2){transition-delay:.2s,.2s,0s}.svc-list.in li:nth-child(3){transition-delay:.28s,.28s,0s}.svc-list.in li:nth-child(4){transition-delay:.36s,.36s,0s}
  .no-js .svc-list li{opacity:1;transform:none}
  .svc-cta{margin-top:var(--sp-5)}
}

/* 23.5 · OFICINA + VÍDEO — monitor + celular */
@media(min-width:1024px){
  .ofi > .wrap{display:grid;grid-template-columns:300px minmax(0,1fr);column-gap:56px;row-gap:var(--sp-5);align-items:start}
  .ofi-grid,.ofi-photos-wrap,.ofi-photos,.video-proof-grid{display:contents}
  .ofi-copy{grid-area:1 / 1 / 2 / 2;align-self:end}
  .ofi .ofi-a{display:none} /* direção de 12/10: no desktop só monitor + celular; a foto do cavalete segue nos assets e no trilho abaixo de 1024px */
  .ofi .ofi-b{grid-area:1 / 2 / 2 / 3;justify-self:start;align-self:center;position:relative;z-index:1;width:min(100%,600px);aspect-ratio:640/428;overflow:visible;border:0;border-radius:0;background:none;box-shadow:none}
  .ofi .video-device{grid-area:1 / 2 / 2 / 3;justify-self:end;align-self:start;position:relative;z-index:2;width:250px;max-width:250px;margin:0 0 64px;padding:10px;background:none;box-shadow:none}
  .ofi .video-copy-panel{grid-area:1 / 2 / 2 / 3;justify-self:end;align-self:end;z-index:2;width:250px;padding:0}
  .ofi .video-title{font-size:26px;margin:0 0 2px}
  .ofi .video-copy-panel p{font-size:14px;line-height:1.5}
  .ofi .video-proof-grid .reveal{opacity:1;transform:none;transition:none}
  /* molduras desenhadas por linha */
  .mon-line,.ph-line{display:block;position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:rgba(250,250,250,.62);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;overflow:visible;pointer-events:none;z-index:2}
  .mon-line path,.ph-line path{stroke-dasharray:1;stroke-dashoffset:0}
  .ph-line{stroke-width:2.2}
  /* tela do monitor: 16:9 exato dentro da moldura (640x428, margem 14) */
  .ofi .gal-open.mon-scr{position:absolute;left:2.1875%;top:3.271%;width:95.625%;height:80.42%;overflow:hidden;border-radius:7px;background:#050507}
  .ofi .mon-scr img{width:100%;height:100%;object-fit:cover;object-position:30% 45%}
  .ofi .ofi-b .gal-cap{position:absolute;z-index:3;left:calc(2.1875% + 12px);top:calc(83.7% - 44px);padding:7px 14px;border:0;border-radius:var(--r-pill);background:rgba(9,9,11,.66);pointer-events:none}
  .ofi .ofi-b .cs{font-size:13px;color:#fff}
  .ofi .video-screen{border-radius:26px}
  /* clip-path de recorte do R5 não vale mais aqui */
  .ofi .ofi-photos.armed .gal-open img,.ofi .ofi-photos.armed.in .ofi-b .gal-open img,.ofi .ofi-photos.armed.in .gal-open img{clip-path:none;transition:none}
  /* sequência: monitor desenha → foto aparece → celular desenha → vídeo aparece */
  .ofi.armed .mon-line path,.ofi.armed .ph-line path{stroke-dashoffset:1}
  .ofi.armed .mon-scr{opacity:0;transform:scale(1.035)}
  .ofi.armed .ofi-b .gal-cap{opacity:0}
  .ofi.armed .video-screen,.ofi.armed .video-copy-panel{opacity:0;transform:translateY(10px)}
  .ofi.armed.go .mon-line path{stroke-dashoffset:0;transition:stroke-dashoffset 1.3s var(--ease)}
  .ofi.armed.go .mon-line path:nth-child(2){transition-delay:1.1s;transition-duration:.6s}
  .ofi.armed.go .mon-scr{opacity:1;transform:none;transition:opacity .8s var(--ease) 1.2s,transform 1.1s var(--ease) 1.2s}
  .ofi.armed.go .ofi-b .gal-cap{opacity:1;transition:opacity .6s var(--ease) 2.1s}
  .ofi.armed.go .ph-line path{stroke-dashoffset:0;transition:stroke-dashoffset 1.1s var(--ease) 1.9s}
  .ofi.armed.go .ph-line path:nth-child(2){transition-delay:2.8s;transition-duration:.3s}
  .ofi.armed.go .video-screen{opacity:1;transform:none;transition:opacity .8s var(--ease) 2.9s,transform .9s var(--ease) 2.9s}
  .ofi.armed.go .video-copy-panel{opacity:1;transform:none;transition:opacity .6s var(--ease) 3.3s,transform .6s var(--ease) 3.3s}
}

/* 23.7 · FECHAMENTO + LOCALIZAÇÃO + RODAPÉ — um encerramento só */
@media(min-width:1024px){
  .cta-block{padding-bottom:var(--sp-7)}
  .cta-block > .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.95fr) 300px;column-gap:var(--sp-6);align-items:start}
  .cta-block .cta-box{grid-column:1;grid-row:1 / 3;align-self:center;max-width:none;margin:0;padding:0;text-align:left;border:0;background:none;box-shadow:none;overflow:visible}
  .cta-block .cta-title{font-size:clamp(40px,4.6vw,60px);line-height:.96}
  .cta-block .cta-btns{justify-content:flex-start;margin-top:var(--sp-4)}
  .cta-block .cta-box .sub{display:none}
  .cta-block .loc{display:contents}
  .cta-block .loc-title{grid-column:2;grid-row:1;margin:0 0 var(--sp-1);font-family:var(--font-body);font-size:var(--text-min);font-weight:700;letter-spacing:3px;color:var(--fg3);line-height:1.2}
  .cta-block .loc-grid{display:contents}
  .cta-block .loc-info{grid-column:2;grid-row:2;padding:0;border:0;background:none;box-shadow:none;overflow:visible}
  .cta-block .loc-info .row:last-of-type{border-bottom:1px solid var(--border)}
  .cta-block .map{grid-column:3;grid-row:1 / 3;align-self:end;height:320px;min-height:0}
  .cta-block .map iframe{min-height:0;height:100%}
  /* rodapé fino no mesmo fundo; marca e título já estão acima (faixa, endereço) */
  .footer{background:var(--bg2);padding:18px 0;text-align:left}
  .footer .wrap{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-4);flex-wrap:wrap}
  .flogo,.fsub{display:none}
  .flinks{order:2;margin:0}
  .copyright{order:1}
}
@media(prefers-reduced-motion:reduce){
  .svc-list li{opacity:1;transform:none}
}

/* ============================================================
   24 · HERO — REFINO R6 (12/10/2026)
   Cápsula de navegação central (1024px+), bloco de copy ~40–60 px mais alto.
   Abaixo de 1024px nada muda (a cápsula não existe; no mobile já não havia nav).
   A cápsula vive dentro de .nav, que some quando a faixa da marca entra (R6 23.1).
   ============================================================ */
.nav-pill{display:none}
@media(min-width:1024px){
  :root{--navH:76px}
  .nav-inner{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(max-content,1fr);align-items:center;column-gap:var(--sp-4)}
  .nav-inner .nav-cta{grid-column:3;justify-self:end}
  .nav-pill{grid-column:2;display:flex;align-items:center;gap:2px;list-style:none;padding:6px;border:1px solid rgba(255,255,255,.17);border-radius:var(--r-pill);background:rgba(8,8,10,.5);-webkit-backdrop-filter:blur(10px) saturate(1.1);backdrop-filter:blur(10px) saturate(1.1);box-shadow:0 10px 30px rgba(0,0,0,.28)}
  .nav-pill a{position:relative;display:inline-flex;align-items:center;min-height:44px;padding:0 20px;border-radius:var(--r-pill);font-family:var(--font-body);font-size:14.5px;font-weight:600;letter-spacing:.2px;color:rgba(255,255,255,.9);text-shadow:0 1px 6px rgba(0,0,0,.6);transition:background .25s var(--ease),color .25s var(--ease)}
  .nav-pill a:hover{color:#fff;background:rgba(255,255,255,.1)}
  .nav-pill a[aria-current]{color:#fff;background:linear-gradient(180deg,rgba(192,57,43,.38),rgba(192,57,43,.14));box-shadow:inset 0 0 0 1px rgba(231,76,60,.5),inset 0 1px 0 rgba(255,255,255,.14)}
  .nav-pill a[aria-current]::after{content:"";position:absolute;top:-1px;left:32%;right:32%;height:2px;border-radius:2px;background:var(--red-hover)}
  .nav-pill a:focus-visible{outline:2px solid var(--gold);outline-offset:1px}
  /* bloco da esquerda (copy, CTAs, indicadores) sobe com a altura da janela: 36 px em telas baixas, ~60 px em 1080 */
  .hero-content{padding-bottom:clamp(36px,5.5vh,60px)}
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .nav-pill{background:rgba(8,8,10,.78)}
}

/* ============================================================
   25 · RODADA R6.2 (12/10/2026)
   25.1 revisão compacta · 25.2 CTAs de conversão (xadrez) · 25.3 avaliações em perspectiva 3D · 25.4 (fechamento: ajuste no 23.7)
   Congelados: #oficina, hero (exceto botões), cápsula, vídeo a 0.90.
   ============================================================ */

/* 25.1 · REVISÃO — título em até 3 linhas, lista discreta (sem caixa), moto maior */
.rev-cta-wrap{margin-top:var(--sp-4)}
@media(min-width:1024px){
  .rev-layout{grid-template-columns:340px minmax(0,1fr);gap:var(--sp-5)}
  .rev .sec-h2{font-size:44px;line-height:.96}
  .rev-text{font-size:16px;line-height:1.6;margin:var(--sp-2) 0 var(--sp-3);max-width:none}
  .rev-check{max-width:none;border:0;border-radius:0;background:none;overflow:visible}
  .rev-check li{padding:11px 0;border:0;border-top:1px solid rgba(255,255,255,.08);border-radius:0;background:none;font-size:15px}
  .rev-check li:last-child{border-bottom:1px solid rgba(255,255,255,.08)}
  .rev-check li.on{background:none;color:var(--gold-soft)}
  .rev-moto{margin-right:clamp(-56px,-3.5vw,0px)}
}

/* 25.2 · CTAs de CONVERSÃO — VARIAÇÃO 4 (decisão de Guilherme, 12/10/2026): fundo preto, bandeira quadriculada à ESQUERDA,
   borda dourada, texto branco e seta dourada à direita. Vale em desktop e mobile, nos 6 pontos de conversão.
   Sem asset externo: bandeira = conic-gradient em ::before; seta = ::after. Hover: fundo com leve tom dourado, bandeira invertida, seta avança.
   Foco: anel BRANCO afastado 4 px (a borda é dourada, então o anel dourado se confundiria com ela). Contraste branco/#0a0a0b ≈ 19:1. */
.btn.btn-cta{position:relative;overflow:hidden;gap:0;padding:0 20px 0 0;min-height:52px;background:#0a0a0b;color:#fff;border:2px solid var(--gold);font-size:14px;font-weight:800;letter-spacing:.4px;text-align:center;box-shadow:0 18px 44px rgba(0,0,0,.6),0 0 0 1px rgba(245,192,0,.10);transition:background .25s var(--ease),border-color .25s var(--ease),color .25s var(--ease),transform .25s var(--ease),box-shadow .25s var(--ease)}
.btn.btn-cta::before{content:"";align-self:stretch;flex:0 0 36px;width:36px;background:conic-gradient(#fff 25%,#0a0a0b 0 50%,#fff 0 75%,#0a0a0b 0) 0 0/12px 12px;transition:background .25s var(--ease)}
.btn.btn-cta > span{flex:1 1 auto;padding:0 12px 0 20px}
.btn.btn-cta::after{content:"→";content:"→" / "";flex:0 0 auto;color:var(--gold);font-size:20px;font-weight:700;line-height:1;letter-spacing:0;transition:transform .25s var(--ease),color .25s var(--ease)}
@media(hover:hover) and (pointer:fine){
.btn.btn-cta:hover{background:#15130a;color:#fff;border-color:var(--gold-soft);transform:translateY(-2px) scale(1.03);box-shadow:0 22px 48px rgba(0,0,0,.66),0 0 0 3px rgba(245,192,0,.24)}
.btn.btn-cta:hover::before{background:conic-gradient(#0a0a0b 25%,#fff 0 50%,#0a0a0b 0 75%,#fff 0) 0 0/12px 12px}
.btn.btn-cta:hover::after{transform:translateX(4px);color:var(--gold-soft)}
.btn.btn-cta.nav-cta:hover{transform:translateY(-2px) scale(1.01)}
}
.btn.btn-cta:active{transform:translateY(1px);box-shadow:0 6px 16px rgba(0,0,0,.45)}
.btn.btn-cta:focus-visible{outline:3px solid #fff;outline-offset:4px}
.btn.btn-cta.nav-cta{min-height:44px;padding:0 16px 0 0;font-size:13px;white-space:nowrap}
.btn.btn-cta.nav-cta > span{padding:0 10px 0 16px}
.btn.btn-cta.nav-cta::before{flex-basis:30px;width:30px;background-size:10px 10px}
.btn.btn-cta.nav-cta:hover::before{background-size:10px 10px}
.btn.btn-cta.nav-cta::after{font-size:18px}
.diag-copy .btn.btn-cta{background:#0a0a0b;border-color:var(--gold);color:#fff;box-shadow:0 18px 44px rgba(0,0,0,.6),0 0 0 1px rgba(245,192,0,.10)}
@media(hover:hover) and (pointer:fine){.diag-copy .btn.btn-cta:hover{background:#15130a;border-color:var(--gold-soft);color:#fff;box-shadow:0 22px 48px rgba(0,0,0,.66),0 0 0 3px rgba(245,192,0,.24)}}
@media(hover:none),(pointer:coarse){.btn.btn-cta:hover{transform:none}}
@media(prefers-reduced-motion:reduce){.btn.btn-cta,.btn.btn-cta::after{transition:none}.btn.btn-cta:hover,.btn.btn-cta.nav-cta:hover,.btn.btn-cta:active,.btn.btn-cta:hover::after{transform:none}}


/* 25.3 · AVALIAÇÕES — marquee 3D vertical (porta do TESTIMONIALS_3D_LAB aprovado, sem React/Tailwind).
   Estrutura: .t3d-stage (perspective 300px) > .t3d-cluster (transform 3D fixo) > .t3d-col (coluna) > .t3d-blk (bloco repetido x4) > .t3d-card.
   Loop: translateY(calc(-100% - gap)) linear infinito, 41,4 px/s (duração por coluna medida no JS). Sem touch-action; reduced-motion para a animação. */
.t3d{position:relative;display:flex;align-items:center;justify-content:center;height:100vh;min-height:640px;max-height:1000px;overflow:hidden;background:var(--bg);color:var(--fg)}
.t3d-data{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;list-style:none}
.t3d-stage{position:absolute;inset:0;z-index:0;isolation:isolate;display:flex;flex-direction:row;align-items:center;justify-content:center;overflow:hidden;perspective:300px}
.t3d:not(.t3d-live) .t3d-stage{display:none}
.t3d-cluster{display:flex;flex-direction:row;align-items:center;gap:16px;transform:translateX(-100px) translateY(0px) translateZ(-100px) rotateX(20deg) rotateY(-10deg) rotateZ(20deg)}
.t3d-col{--gap:1rem;--duration:40s;display:flex;flex-direction:column;gap:var(--gap);padding:8px;overflow:visible}
.t3d-blk{display:flex;flex-direction:column;flex-shrink:0;justify-content:space-around;gap:var(--gap);animation:t3d-up var(--duration) linear infinite}
.t3d-rev .t3d-blk{animation-direction:reverse}
@media(hover:hover){.t3d-col:hover .t3d-blk{animation-play-state:paused}}
.t3d-col[data-paused] .t3d-blk,.t3d-off .t3d-blk{animation-play-state:paused}
@keyframes t3d-up{from{transform:translateY(0)}to{transform:translateY(calc(-100% - var(--gap)))}}
@media(prefers-reduced-motion:reduce){.t3d-blk{animation:none}}
.t3d-card{position:relative;width:200px;display:flex;flex-direction:column;gap:24px;overflow:hidden;padding:24px 0;border-radius:14px;background:#151821;color:#FAFAFA;font:400 14px/20px var(--font-body);box-shadow:0 0 0 1px rgba(245,192,0,.22),0 1px 2px rgba(0,0,0,.05)}
.t3d-card::before{content:"";position:absolute;top:0;left:24px;width:30px;height:2px;background:var(--gold);opacity:.65;pointer-events:none}
.t3d-cc{padding:0 24px}
.t3d-row{display:flex;align-items:center;gap:10px}
.t3d-av{position:relative;display:flex;flex:0 0 36px;width:36px;height:36px;border-radius:50%;align-items:center;justify-content:center;background:rgba(255,255,255,.06);color:rgba(250,250,250,.62);font:400 18px/1 var(--font-display);letter-spacing:1px;user-select:none}
.t3d-av::after{content:"";position:absolute;inset:0;border-radius:50%;border:.8px solid rgba(255,255,255,.08);mix-blend-mode:darken}
.t3d-av img{width:100%;height:100%;border-radius:50%;object-fit:cover;aspect-ratio:1/1}
.t3d-who{display:flex;flex-direction:column;min-width:0}
.t3d-name{font:500 14px/20px var(--font-body);color:#FAFAFA}
.t3d-src{margin:0;font:500 12px/16px var(--font-body);color:rgba(217,222,232,.5)}
.t3d-stars{font:400 12px/16px var(--font-body);letter-spacing:2px;color:var(--gold)}
.t3d-q{margin:12px 0 0;font:400 14px/20px var(--font-body);color:#d1d5db}
.t3d-fade{position:absolute;inset:0;z-index:10;pointer-events:none;background-repeat:no-repeat;background-image:linear-gradient(120deg,color-mix(in srgb,var(--bg) 50%,transparent) 0%,transparent 36%),linear-gradient(to bottom,var(--bg) 0%,var(--bg) calc(var(--t3d-title-h,160px) + 20px),transparent calc(var(--t3d-title-h,160px) + 20px + 9%)),linear-gradient(to top,#111114 0,#111114 4px,var(--bg) 30px,transparent 25%),linear-gradient(to right,var(--bg) 0%,transparent 25%),linear-gradient(to left,var(--bg) 0%,transparent 25%)}
.t3d-title{position:absolute;z-index:20;top:0;left:0;right:0;max-width:640px;margin:0 auto;padding:48px 24px 0;display:flex;flex-direction:column;align-items:center;text-align:center;pointer-events:none}
@media(min-width:640px){.t3d-title{padding-top:64px}}
@media(min-width:1024px){.t3d-title{padding-top:100px}}
.t3d-kicker{margin:0 0 12px;font:700 12px/16px var(--font-body);text-transform:uppercase;letter-spacing:3px;color:var(--fg3)}
.t3d-h2{margin:0;font-family:var(--font-display);font-size:clamp(40px,10vw,56px);font-weight:400;line-height:.95;letter-spacing:1px;text-transform:uppercase;color:#fff}
.t3d-rating{margin-top:16px;display:flex;align-items:center;gap:12px;color:inherit;text-decoration:none;pointer-events:auto}
.t3d-google{display:block;flex:0 0 24px;width:24px;height:24px;object-fit:contain}
.t3d-rating:focus-visible{outline:2px solid var(--gold);outline-offset:6px;border-radius:6px}
.t3d-score{font-family:var(--font-display);font-size:36px;line-height:1;letter-spacing:1px;color:#f7d15c}
.t3d-rstars{font-size:17px;line-height:1;letter-spacing:3px;color:var(--gold)}

/* ============================================================
   26 · RODADA R7 (12/10/2026) — desktop + mobile numa passada
   26.1 revisão (moto e lista no mobile) · 26.2 CTA no mobile · 26.3 serviços no mobile (+ cascata)
   (hero mobile: ajustes no bloco 22; depoimentos: 25.3)
   ============================================================ */

/* o botão-bandeira não tem texto no ::before: deixa de alinhar por linha de base (evita +6 px de altura nos contêineres) */
.rev-cta-wrap,.svc-cta{display:flex}

/* 26.1 · REVISÃO — a moto vale em todas as larguras; o esquema antigo (.rev-scheme) não aparece mais */
.rev-scheme{display:none}
.rev-moto{display:block;min-width:0}
.mt-lbl .ls{display:none}
.m-only{display:inline}.d-only{display:none}
@media(min-width:1024px){.m-only{display:none}.d-only{display:inline}}
@media(max-width:1023px){
  .rev-layout{display:flex;flex-direction:column;align-items:stretch;gap:0}
  .rev-copy{display:contents}
  .rev .sec-h2{order:1}
  .rev-text{order:2;margin:var(--sp-3) 0 0;max-width:none}
  .rev-moto{order:3;margin:var(--sp-4) 0 var(--sp-3)}
  .rev-check{order:4}
  .rev-cta-wrap{order:5;margin-top:var(--sp-5);display:flex;justify-content:center}
  .rev-moto .rev-scheme-note{margin-top:24px}
  /* moto mais "grossa": o viewBox 960 encolhe para ~350 px, então os traços sobem */
  .mt-body path{stroke-width:4.4}
  .mt-lead{stroke-width:3.4}
  .mt-ping{stroke-width:3.2}
  .mt-dot{stroke:var(--gold);stroke-width:5px}
  .mt-lbl{left:var(--xm);top:var(--ym);font-size:12px;letter-spacing:.8px;padding:6px 9px}
  /* lista C1 (sem caixa, só filetes), 2 colunas compactas */
  .rev-check{display:grid;grid-template-columns:1fr 1fr;gap:0 22px;max-width:none;border:0;border-radius:0;background:none;overflow:visible}
  .rev-check li{padding:10px 0;gap:10px;border:0;border-top:1px solid rgba(255,255,255,.08);border-radius:0;background:none;font-size:13.5px;line-height:1.3;transition:color .4s var(--ease)}
  .rev-check li:nth-last-child(-n+2){border-bottom:1px solid rgba(255,255,255,.08)}
  .rev-check li.on{color:var(--gold-soft)}
  .rev-check li.on .chk-box{stroke:var(--gold)}
  .chk{width:22px;height:22px;flex-basis:22px}
  .chk-box{transition:stroke .4s var(--ease)}
}

/* rótulos curtos até ~1300 px (o longo continua no DOM, só para leitor de tela); em ≤380 px "Transmissão" recua 3% e a pílula encolhe */
@media(max-width:1299px){
  .mt-lbl .lw{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
  .mt-lbl .ls{display:inline}
}
@media(max-width:380px){
  .mt-lbl{padding:6px 7px}
  .mt-lbl[data-k="2"]{left:calc(var(--xm) - 3%)}
}

/* 26.2 · CTA no mobile (variação 4 proporcionalmente menor, centralizada no CTA principal da seção) */
@media(max-width:1023px){
  .nav{display:none}
  .rev-cta-wrap,.svc-cta,.cta-btns{display:flex;justify-content:center;align-items:center}
  .diag-copy .btn.btn-cta{display:flex;width:fit-content;margin:var(--sp-5) auto 0}
  .cta-box .btn.btn-cta{width:auto;white-space:normal}
}
@media(max-width:700px){
  .btn.btn-cta{min-height:48px;font-size:13.5px;min-width:236px;width:auto;padding:0 18px 0 0}
  .btn.btn-cta::before{flex-basis:33px;width:33px;background-size:11px 11px}
  .btn.btn-cta:hover::before{background-size:11px 11px}
  .btn.btn-cta > span{padding:0 10px 0 16px}
}

/* 26.3 · SERVIÇOS — mobile compacto e leve + cascata dos itens (também fora do desktop) */
@media(max-width:1023px){
  .svc-list.reveal{opacity:1;transform:none;transition:none}
  .svc-list li{opacity:0;transform:translateY(14px)}
  .svc-list.in li{opacity:1;transform:none;transition:opacity .6s var(--ease),transform .6s var(--ease)}
  .svc-list.in li:nth-child(1){transition-delay:.05s}.svc-list.in li:nth-child(2){transition-delay:.13s}.svc-list.in li:nth-child(3){transition-delay:.21s}.svc-list.in li:nth-child(4){transition-delay:.29s}
  .no-js .svc-list li{opacity:1;transform:none}
}
@media(max-width:700px){
  #servicos .sec-head{margin-bottom:0}
  .svc-top{gap:12px;margin-top:var(--sp-5)}
  .svc-top .card{display:grid;grid-template-columns:auto 1fr;column-gap:16px;align-items:center;padding:18px;border:1px solid var(--steel);border-top:2px solid var(--gold)}
  .svc-top .card .ico{grid-row:1 / 3;margin:0}
  .svc-top .card .ico svg{width:30px;height:30px}
  .svc-top .card h3{font-size:22px;margin:0 0 4px}
  .svc-top .card p{font-size:15px;line-height:1.5}
  .svc-list{margin-top:var(--sp-4)}
  .svc-list li{display:grid;grid-template-columns:22px 1fr;column-gap:14px;align-items:start;padding:12px 0}
  .svc-list .svc-ico{display:flex;grid-row:1 / 3;margin:2px 0 0;width:22px;height:22px}
  .svc-list .svc-ico svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
  .svc-list h3{font-size:18px;line-height:1.15}
  .svc-list p{font-size:14px;margin-top:2px;line-height:1.5}
  .svc-list li:last-child{align-items:center}
  .svc-cta{margin-top:var(--sp-6)}
}
@media(prefers-reduced-motion:reduce){
  .svc-list li{opacity:1;transform:none}
}

/* sem JS a faixa da marca fica fixa no topo: a hero inteira desce a altura dela (assinatura, título e botões mantêm as posições relativas) */
.no-js .hero{margin-top:var(--ribbonH)}

/* a moto avança até 56 px sobre a margem em 1024px+: a nota recua o mesmo tanto para não encostar na borda da janela */
@media(min-width:1024px){.rev-moto .rev-scheme-note{padding-right:clamp(0px,3.5vw,56px)}}

/* ============================================================
   27 · RODADA R7M — REFINAMENTO MOBILE (13/10/2026)
   Tudo dentro de @media(max-width:700px), exceto o carrossel de avaliações (<1024px, como o bloco que ele substitui) e o estado-base dos elementos
   só-mobile (display:none fora do mobile). Seção 2 (#revisao/.rev) congelada: nenhuma regra dela foi tocada.
   27.1 hero · 27.2 diagnóstico · 27.3 serviços · 27.4 oficina oculta + WhatsApp flutuante oculto · 27.5 avaliações · 27.6 fechamento + rodapé
   ============================================================ */
.cta-contacts{display:none}


@media(max-width:700px){
  /* 27.1 · HERO — o conjunto inferior (indicadores + pista) desce para uma faixa própria abaixo da área do vídeo; a hero passa a ocupar a primeira tela inteira
     (nunca menos), então o título da seção 2 só aparece ao rolar. Vídeo, overlay, assinatura, H1, apoio, localização e CTA ficam exatamente onde estavam:
     o vídeo/pôster/overlay mantêm a MESMA altura de antes (proporção 9:16 × --hero-keep da largura), sem zoom nem corte novo. */
  .hero{aspect-ratio:auto;min-height:100vh;min-height:100svh;padding-bottom:100px;justify-content:flex-start}
  .hero-bg,.hero-video,.hero-overlay{inset:0 0 auto 0;height:auto;aspect-ratio:9 / calc(16 * var(--hero-keep))}
  .hero-content{position:static;flex:0 0 auto;align-self:stretch;aspect-ratio:9 / calc(16 * var(--hero-keep))}
  /* R7M-2 · localização + CTA descem para a faixa preta: o topo da localização fica 10 px abaixo do fim da imagem do MP4 (que termina em ~70,8% da altura do arquivo: 100vw × 16/9 × .708 ≈ 1,259 × largura) */
  .hero-bottom{position:absolute;inset:0;z-index:4;padding-top:calc(100vw * 16 / 9 * .708 + 10px);padding-bottom:0;pointer-events:none}
  .hero-bottom .hero-ctas,.hero-bottom .hero-next{pointer-events:auto}
  .hero-next{position:absolute;z-index:5;left:50%;bottom:4px;width:max-content;margin:0;transform:translateX(-50%)}
  .stats{z-index:5;bottom:50px;transform:none}

  /* 27.2 · DIAGNÓSTICO — título centralizado, subtítulo curto, dois benefícios sem caixa, seção mais baixa */
  #diagnostico{padding:44px 0}
  .diag{padding:16px 14px;gap:16px}
  .diag-photo{aspect-ratio:3/2}
  .diag-title{text-align:center;text-wrap:balance;font-size:clamp(28px,8.6vw,34px);margin:0 0 10px}
  .diag-copy{padding:0}
  .diag-copy p{text-align:center;font-size:16px;line-height:1.55;margin-bottom:10px}
  .benefits{gap:0;margin:0 0 18px;justify-items:center}
  .benefits li{padding:7px 0;border:0;border-radius:0;background:none;box-shadow:none;font-size:15px;line-height:1.4;text-align:center;color:#d6dae1}
  .benefits li::before{content:"";display:inline-block;width:6px;height:6px;margin:0 10px 2px 0;background:var(--gold);transform:rotate(45deg)}
  .diag-copy .btn.btn-cta{margin:0 auto}

  /* 27.3 · SERVIÇOS — os 6 numa lista uniforme e compacta (mesmo ícone, tipografia e filetes); microdescrição de uma linha */
  #servicos{padding:48px 0 52px}
  #servicos .sec-head{margin-bottom:0}
  .svc-top{display:block;margin-top:var(--sp-4)}
  .svc-list{margin-top:0}
  .svc-top .card,.svc-list li{display:grid;grid-template-columns:24px 1fr;column-gap:14px;align-items:center;align-content:center;min-height:64px;padding:10px 0;border:0;border-bottom:1px solid var(--border);border-radius:0;background:none;box-shadow:none;overflow:visible}
  .svc-top .card:first-child{border-top:1px solid var(--border)}
  .svc-top .card.reveal{transform:translateY(14px)}
  .svc-top .card.reveal.in{transform:none}
  .svc-top .card:hover{box-shadow:none}
  .svc-top .card .ico,.svc-list .svc-ico{display:flex;grid-row:1 / 3;align-items:center;justify-content:center;width:24px;height:24px;margin:0;color:var(--gold-soft)}
  .svc-top .card .ico svg,.svc-list .svc-ico svg{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
  .svc-top .card h3,.svc-list h3{font-size:19px;line-height:1.1;margin:0;color:#fff}
  .svc-top .card p,.svc-list p{font-size:14px;line-height:1.4;margin:2px 0 0;color:var(--fg2)}
  .svc-list li:last-child{align-items:center}
  .svc-cta{margin-top:var(--sp-5)}

  /* 27.4 · OFICINA ("Na bancada") não existe no celular; WhatsApp flutuante também não (o contato fica no fechamento) */
  #oficina{display:none}

  /* 27.6 · FECHAMENTO + RODAPÉ — um bloco único: título, CTA, linha de contatos, horário, endereço em linha fina */
  .cta-block{padding:44px 0 12px}
  .cta-block .cta-box{max-width:none;padding:0;border:0;border-radius:0;background:none;box-shadow:none;overflow:visible}
  .cta-title{font-size:clamp(36px,10.6vw,44px);line-height:.98;text-align:center}
  .cta-btns{margin-top:20px}
  .cta-contacts{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:16px}
  .cta-contacts a{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;border:1px solid rgba(255,255,255,.18);border-radius:var(--r-pill);background:rgba(255,255,255,.035);color:#fff;transition:border-color .25s var(--ease),background .25s var(--ease)}
  .cta-contacts a:hover{border-color:var(--border-gold);background:var(--gold-dim)}
  .cta-contacts svg{display:block;width:22px;height:22px}
  .cta-contacts .cc-wa{gap:8px;padding:0 16px 0 12px;font-size:15px;font-weight:700;letter-spacing:.2px;white-space:nowrap}
  .cta-contacts .cc-wa svg{width:20px;height:20px}
  .cta-contacts .cc-map svg{width:auto;height:24px}
  .cta-box .sub{margin:14px 0 0;font-size:15px;line-height:1.4;white-space:nowrap}
  .loc{margin-top:0}
  .loc-title,.loc-name,.loc-go,.loc-info dl,.loc-area,.map{display:none}
  .loc-info{padding:0;border:0;border-radius:0;background:none;box-shadow:none;text-align:center}
  .loc-addr a{display:block;text-wrap:balance;padding:12px 8px;font-size:14px;line-height:1.45;color:var(--fg2);text-decoration:none}
  .fsub,.flinks{display:none}
  .footer{padding:14px 0 18px}
  .flogo{font-size:20px;letter-spacing:3px;margin-bottom:2px}
  .copyright{font-size:12px;line-height:1.5;color:var(--fg2)}
}

@media(min-width:1024px){
 .r8-after-reviews .sbk-ribbon{transform:translateY(-100%);opacity:0;visibility:hidden;transition:none}
 .r8-after-reviews .sbk-ribbon-track{animation-play-state:paused}
}
/* Faixa some suave (transição .25s da .sbk-ribbon) enquanto #avaliacoes está na janela, em todas as larguras. */
.ribbon-reviews .sbk-ribbon{transform:translateY(-100%);opacity:0;visibility:hidden}
.ribbon-reviews .sbk-ribbon-track{animation-play-state:paused}
/* O brilho pertence a um span vazio; texto, seta, botão e medidas não se animam. */
.btn.r8-energy > .r8-border-light{position:absolute;inset:0;padding:2px;border-radius:inherit;pointer-events:none;background:linear-gradient(105deg,transparent 38%,#fff4 47%,#fff9 50%,#fff4 53%,transparent 62%);background-size:300% 100%;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;animation:r8-border 7s linear infinite;animation-play-state:paused}
.btn.r8-energy-visible > .r8-border-light{animation-play-state:running}
@keyframes r8-border{from{background-position:150% 0}to{background-position:-150% 0}}
@media(prefers-reduced-motion:reduce){.btn.r8-energy > .r8-border-light{animation:none;display:none}}

/* R9 bounded refinements: geometry/content of protected sections remain unchanged. */
.r9-sequence .r9-step{opacity:0;transform:translateY(16px);transition:opacity .85s var(--ease),transform .85s var(--ease);transition-delay:var(--r9-delay,0ms)}
.r9-sequence.r9-entered .r9-step{opacity:1;transform:none}
@media(max-width:700px){
 .cta-block{padding:64px 0 30px}
 .cta-btns{margin-top:28px}
 .cta-contacts{margin-top:28px}
 .cta-box .sub{margin-top:24px}
 .loc-addr a{padding:22px 12px 28px}
 .footer{padding:28px 0 34px}
 .flogo{margin-bottom:10px}
 #diagnostico .diag-copy.reveal{opacity:1;transform:none;transition:none}
}
@media(min-width:1024px){
 .ofi.armed.go .mon-line path{transition-duration:1.75s}
 .ofi.armed.go .mon-line path:nth-child(2){transition-delay:1.5s;transition-duration:.8s}
 .ofi.armed.go .mon-scr{transition:opacity 1s var(--ease) 1.65s,transform 1.4s var(--ease) 1.65s}
 .ofi.armed.go .ofi-b .gal-cap{transition-delay:2.7s;transition-duration:.8s}
 .ofi .mon-scr .mon-alt{position:absolute;inset:0;object-fit:contain;object-position:center;background:#09090b;opacity:0;transition:opacity 1.2s var(--ease)}
 .ofi .mon-scr.mon-alt-on .mon-alt{opacity:1}
}
@media(max-width:1023px){.mon-alt{display:none}}
@media(prefers-reduced-motion:reduce){.r9-sequence .r9-step{opacity:1;transform:none;transition:none}.ofi .mon-scr .mon-alt{display:none}}

/* R9 item4: Guilherme confirmed red line means headline; mobile timing only. */
@media(max-width:700px){.hero-h1.reveal{transition-duration:.9s}}

/* Mobile refinement: client-approved contact hierarchy, no individual capsules. */
@media(max-width:700px){
 #agendar.mobile-footer-active{padding:64px 0 32px}
 #agendar.mobile-footer-active > .wrap > .cta-box,#agendar.mobile-footer-active > .wrap > .loc{display:none}
 .mobile-close{display:flex;flex-direction:column;align-items:center;text-align:center;gap:0}
 .mobile-close .cta-title{margin:0 0 32px}
 .mobile-close .mobile-close-cta{margin-bottom:34px}
.mobile-close-map{display:flex;align-items:center;justify-content:flex-start;gap:10px;max-width:320px;text-align:left;font-size:14px;line-height:1.6;color:#d1d5db;min-height:44px;margin-bottom:26px;text-wrap:balance}
 .mobile-close-map svg{width:21px;height:30px;flex-shrink:0}
 .mobile-close-wa{display:flex;align-items:center;justify-content:center;gap:10px;min-height:44px;font-size:15px;font-weight:500;color:#ededf0;margin-bottom:20px;border:0;background:none;border-radius:0;padding:0}
 .mobile-close-wa svg{width:22px;height:22px}
 .mobile-close-hours{font-size:14px;line-height:1.7;color:#b8bac1;margin:0 0 26px}
 .mobile-close-ig{display:flex;align-items:center;justify-content:center;gap:10px;min-height:48px;font-size:14px;color:#dedee4;padding:0;border:0;background:none;border-radius:0}
 .mobile-close-ig img{display:block;width:40px;height:40px;object-fit:contain}
 .mobile-close a:focus-visible{outline:2px solid var(--gold);outline-offset:5px}
 .footer{padding:30px 0 38px}
}

/* Final refinement: mobile testimonials keep their four-column geometry and loop. */
@media(max-width:700px){
 .t3d-cluster{transform:translateX(-88px) translateY(0px) translateZ(-100px) rotateX(20deg) rotateY(-10deg) rotateZ(20deg)}
 .t3d-fade{background-image:linear-gradient(120deg,color-mix(in srgb,var(--bg) 36%,transparent) 0%,transparent 30%),linear-gradient(to bottom,var(--bg) 0%,var(--bg) calc(var(--t3d-title-h,160px) + 2px),transparent calc(var(--t3d-title-h,160px) + 24px)),linear-gradient(to top,#111114 0%,#111114 8%,transparent 40%),linear-gradient(to right,var(--bg) 0%,transparent 11%),linear-gradient(to left,var(--bg) 0%,transparent 11%)}
}

/* CHARACTER CASCADE · títulos e subtítulos das seções (assets/js/char-cascade.js). Letras ficam em opacity 0 até a classe .cc-go (aplicada pelo JS); sem JS nada é ocultado. */
@keyframes characterRise{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}
[data-cc].cc-pre{opacity:0!important;transition:none!important}
/* alvo ou wrapper-só-do-título com .reveal: a cascata substitui o fade/translate (nunca entrada simultânea) */
[data-cc].cc-nr,.reveal.cc-nr{opacity:1;transform:none;transition:none}
.cc .cc-w{display:inline-block;white-space:nowrap}
.cc .cc-c{display:inline-block;opacity:0}
.cc.cc-go .cc-c{animation:characterRise 1.05s cubic-bezier(.16,1,.3,1) forwards}
.cc.cc-done .cc-c{opacity:1;animation:none}
.cc .cc-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
/* fallback com métrica da Bebas Neue: enquanto a webfont carrega, o h1 quebra nas mesmas linhas (sem salto de layout na troca) */
@font-face{font-family:'Bebas Neue Fallback';src:local('Arial'),local('ArialMT'),local('Helvetica'),local('Roboto');size-adjust:58.5%;ascent-override:153.8%;descent-override:51.3%;line-gap-override:0%}
.hero-h1{font-family:'Bebas Neue','Bebas Neue Fallback',sans-serif}
/* cascata: o reveal do wrapper misto (.reveal.cc-nr) é transferido para os filhos que não são alvo, com o mesmo efeito do .reveal */
.cc-rv{opacity:0;transform:translateY(24px);transition:opacity .65s var(--ease),transform .65s var(--ease)}
.cc-rv.cc-rv-in{opacity:1;transform:none}
@media(max-width:700px){#diagnostico .diag-copy .cc-rv:not(.r9-step){opacity:1;transform:none;transition:none}}
.btn.cc-rv{transition:opacity .65s var(--ease),transform .65s var(--ease)}