/* InforAlvelos · efeitos novos (v5): brasas, vidro nos cartoes, botoes magneticos e servicos da loja. */
#brasas{position:fixed;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none;display:block}
html.efeitos-off #brasas{display:none}

/* vidro: os cartoes de servicos deixam ver as brasas desfocadas por tras */
.service-grid{background:transparent;gap:0}
.service-grid .service{border-right:1px solid var(--line)}
.service-grid .service:last-child{border-right:0}
@media(max-width:1000px){.service-grid .service{border-right:0;border-bottom:1px solid var(--line)}}
.service-grid .service{background:rgba(255,255,255,.022);-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);transition:background .35s,box-shadow .35s}
.service-grid .service:hover{background:linear-gradient(180deg,rgba(201,42,42,.10),rgba(255,255,255,.02));box-shadow:inset 0 0 0 1px rgba(201,42,42,.55),0 18px 50px rgba(0,0,0,.35)}

/* botoes magneticos: so o deslocamento; a transicao suaviza o regresso */
.button,.service-link{will-change:transform}
.button.is-mag,.service-link.is-mag{transition:transform .18s cubic-bezier(.2,.7,.2,1)}

/* servicos da loja */
.loja-extra-head{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;margin:72px 0 28px;flex-wrap:wrap}
.loja-extra-head h3{font-size:clamp(28px,3.2vw,44px);line-height:1.1;margin:14px 0 0;font-weight:400}
.loja-extra-head h3 em{font-style:italic}
.loja-extra-head p{max-width:300px;font-size:14px;color:var(--muted);margin:0}
.service-grid.loja-extra{grid-template-columns:repeat(4,1fr)}
.service-grid.loja-extra .service{min-height:0;padding-bottom:34px}
.loja-ico{height:112px;display:grid;place-items:center;margin:8px 0 18px}
.loja-ico svg{width:92px;height:92px;fill:none;stroke:#c9ccc4;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round;opacity:.9}
.loja-ico svg .r{stroke:#c92a2a}
.service:hover .loja-ico svg{stroke:#eceae2}
.loja-nota{font-size:13px;color:var(--muted);margin:18px 0 0}
@media(max-width:1000px){.service-grid.loja-extra{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.service-grid.loja-extra{grid-template-columns:1fr}.loja-extra-head{margin-top:48px}}
@media(prefers-reduced-motion:reduce){#brasas{display:none}.button.is-mag,.service-link.is-mag{transition:none}}

/* tinteiros */
.tinta{display:grid;grid-template-columns:1.05fr .95fr;gap:32px;align-items:center;margin-top:40px;padding:clamp(24px,4vw,48px);border:1px solid var(--line);background:rgba(255,255,255,.022);-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px)}
.tinta h3{font-size:clamp(28px,3.2vw,44px);line-height:1.1;margin:14px 0 14px;font-weight:400}
.tinta h3 em{font-style:italic}
.tinta p{color:var(--muted);max-width:34em}
.tinta-sw{display:inline-flex;border:1px solid var(--line);margin:8px 0 6px}
.tinta-sw button{background:none;border:0;color:var(--muted);font:inherit;font-size:13px;padding:11px 20px;cursor:pointer;transition:background .2s,color .2s}
.tinta-sw button[aria-pressed="true"]{background:#c92a2a;color:#fff}
.tinta-linha{font-size:14px;min-height:1.6em;margin:10px 0 18px}
.tinta-marcas{list-style:none;display:flex;gap:10px;flex-wrap:wrap;margin:0;padding:0}
.tinta-marcas li{padding:8px 16px;border:1px solid var(--line);font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:#eceae2;transition:border-color .2s,color .2s}
.tinta-marcas li:hover{border-color:#c92a2a;color:#fff}
.tinta-art svg{display:block;width:100%;height:auto;max-width:420px;margin:0 auto;overflow:visible}
.tinta-art .cs{fill:rgba(255,255,255,.04);stroke:#c9ccc4;stroke-width:1.2;stroke-linejoin:round}
.tinta-art .ct{font:700 15px/1 system-ui,sans-serif}
.tinta-art .cart{transform-box:fill-box;animation:tinta-flutua 5s ease-in-out infinite;animation-delay:calc(var(--i)*-1.1s)}
.tinta-art .gota{transform-box:fill-box;transform-origin:50% 0;animation:tinta-gota 3.2s ease-in infinite;animation-delay:calc(var(--i)*-.8s)}
@keyframes tinta-flutua{50%{transform:translateY(-5px)}}
@keyframes tinta-gota{0%{transform:translateY(-8px) scale(.4);opacity:0}15%{opacity:1;transform:translateY(0) scale(1)}85%{opacity:1}100%{transform:translateY(34px) scale(.9);opacity:0}}
@media(max-width:900px){.tinta{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.tinta-art .cart,.tinta-art .gota{animation:none}.tinta-art .gota{opacity:1}}

/* barra "Desmontagem": desenhada por nos, igual em todos os navegadores */
.layer-control input[type=range]{-webkit-appearance:none;appearance:none;background:transparent;height:24px;--p:0%}
.layer-control input[type=range]::-webkit-slider-runnable-track{height:4px;border-radius:2px;background:linear-gradient(90deg,var(--red) var(--p),rgba(255,255,255,.22) var(--p))}
.layer-control input[type=range]::-moz-range-track{height:4px;border-radius:2px;background:rgba(255,255,255,.22)}
.layer-control input[type=range]::-moz-range-progress{height:4px;border-radius:2px;background:var(--red)}
.layer-control input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;margin-top:-6px;border-radius:50%;background:var(--red);border:2px solid #111211;cursor:pointer}
.layer-control input[type=range]::-moz-range-thumb{width:12px;height:12px;border-radius:50%;background:var(--red);border:2px solid #111211;cursor:pointer}
.layer-control input[type=range]:focus-visible{outline:2px solid var(--red);outline-offset:4px}