/* v8 - ritmo de fundos por setor (como a Apple: cada assunto tem o seu fundo) e botoes a serio.
   Ordem das seccoes: hero (escuro) > loja (areia) > O QUE FAZEMOS (preto) > TAMBEM NA LOJA (claro)
   > TINTEIROS (tinta) > BANCADA (carvao com grelha) > ATELIER (areia) > PICK-UP (preto com brilho) > contacto (vermelho). */

/* --- 02 TAMBEM NA LOJA: papel claro --- */
.loja-faixa{background:#f1efe9;color:#232620;position:relative}
.loja-faixa .eyebrow{color:#a8322b}
.loja-faixa .loja-extra-head{margin-top:0}
.loja-faixa .loja-extra-head h3,.loja-faixa .service h3{color:#1c1f1b}
.loja-faixa .loja-extra-head h3 em{color:#b43a32}
.loja-faixa .loja-extra-head p,.loja-faixa .service p,.loja-faixa .loja-nota{color:#5b5d54}
.loja-faixa .service-grid.loja-extra{border-color:#dcd8cc;background:transparent}
.loja-faixa .service{background:#fff;border-color:#e2ded2;color:#232620}
.loja-faixa .service-number{color:#8b8e85}
.loja-faixa .service-number span{color:#8b8e85}
.loja-faixa .loja-ico{color:#b43a32;filter:none}
.loja-faixa .loja-ico svg,.loja-faixa .loja-ico *{stroke:currentColor}
.loja-faixa .service:hover{background:#fff;box-shadow:0 10px 30px rgba(35,38,32,.10)}

/* --- TINTEIROS: fundo "tinta" (azul-noite), com toques de ciano e magenta --- */
.tinteiros-faixa{background:radial-gradient(900px 420px at 85% 20%,rgba(0,174,239,.12),transparent 60%),radial-gradient(700px 380px at 10% 90%,rgba(236,0,140,.10),transparent 60%),#0b1118;color:var(--ink);position:relative}
.tinteiros-faixa .tinta{margin-top:0}
.tinteiros-faixa .eyebrow{color:#6fc6ee}
.tinteiros-faixa .tinta-marcas li{border-color:#2a3a4c}

/* --- A LINHA DA NOSSA BANCADA: carvao com grelha de laboratorio --- */
.maintenance.section{background-color:#191b19;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:56px 56px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}

/* --- 03 PICK-UP & REPAIR: preto com um brilho vermelho ao de leve --- */
.method.section{background:radial-gradient(900px 380px at 50% 0,rgba(255,68,68,.11),transparent 65%),#111211}

/* --- botoes a serio (antes eram ligacoes de texto) --- */
.service-link{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:46px;padding:12px 24px;border:1px solid var(--red);border-radius:999px;background:rgba(255,68,68,.08);color:var(--ink);font:inherit;font-size:14px;font-weight:600;letter-spacing:.01em;cursor:pointer;transition:background .2s,color .2s,box-shadow .2s}
.service-link:hover,.service-link:focus-visible{background:var(--red);color:#111211;box-shadow:0 8px 24px rgba(255,68,68,.25)}
.service-link:focus-visible{outline:2px solid var(--ink);outline-offset:3px}

/* o botao nao estica pela linha toda */
.service-link{width:auto;max-width:100%}
.maintenance .service-link,.cleaning-panel .service-link{justify-self:end;margin-left:auto;min-width:240px}
@media(max-width:760px){.maintenance .service-link,.cleaning-panel .service-link{justify-self:stretch;margin-left:0;width:100%}}