c18b9e5b87
All checks were successful
Build and deploy / Validate source (push) Successful in 1m45s
Build and deploy / Integration suite on a real stack (push) Successful in 4m48s
Build and deploy / Secret scan and release gate (push) Successful in 11s
Build and deploy / Publish images and notify Portainer (push) Has been skipped
Week 2 work that did not need client inputs. Print files (1.4): each paid item gets a PDF the width of the film and the length of the approved layout, with every copy at its reviewed position, rotation and mirror. Sources are embedded once at original resolution; JPEG bytes pass through and PNG alpha becomes a soft mask. Artwork the generator cannot reproduce goes to hand preparation with the reason. The worker renders outside any transaction, and the operator approves the generated file as the final one through the existing review. Delivery address (3.8): required for any non-pickup quote, bound to the quoted CEP, carried into the order snapshot, the Kanban card and Tiny. Kanban (1.5): print-file status per item, and a panel of payment events that need a person (money without an order, refunds after an order) until an operator records the resolution. Mercado Pago and Tiny (1.1, 1.3): adapters written from the public API documentation and tested against fake transports only. Selectable for sandbox testing with their credentials; the production preflight still blocks release. Adds payment intents and a PIX step on the Site. MinIO: Docker Hub and quay.io now refuse anonymous pulls, so local and CI storage use Chainguard's MinIO build, pinned by digest. Verified with the full CI integration sequence on a fresh local build, including the new print_file_test and both browser suites. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
1414 lines
79 KiB
HTML
1414 lines
79 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="pt-BR">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||
<title>DTF Dropstar · mande sua arte e veja a qualidade</title>
|
||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&family=Roboto:wght@300;400;500;700&display=swap" rel="stylesheet">
|
||
<style>
|
||
:root{
|
||
/* tokens do site institucional */
|
||
--font-family-base:"Roboto",sans-serif; --font-family-title:"Inter",sans-serif;
|
||
--font-color-base:#03060b; --font-color-title:#03060b;
|
||
--font-weight-base:400; --font-weight-title:700; --font-weight-subtitle:600; --font-weight-button:600;
|
||
--font-size-title:3rem; --font-size-subtitle:2rem; --font-size-button:1.4rem;
|
||
--font-size-small:1.2rem; --font-size-base:1.4rem; --font-size-medium:1.6rem; --font-size-big:1.8rem;
|
||
--line-height:1.5;
|
||
--white:#fff; --black:#03060b;
|
||
--gray-1:#f9f9f9; --gray-2:#c3c3c3; --gray-3:#707070; --gray-4:#363636;
|
||
--primary-color:#ffa81a; --secondary-color:#ff7f0a;
|
||
--white-transparency:#ffffffb3; --transition:all .4s ease;
|
||
/* apelidos usados nesta pagina, mapeados nos tokens acima */
|
||
--marinho:var(--black); --papel:var(--white); --cinza:var(--gray-1);
|
||
--tx:var(--font-color-base); --fraco:var(--gray-3); --linha:#e6e6e6;
|
||
--laranja:var(--primary-color); --laranja2:var(--secondary-color);
|
||
--vermelho:#D94A28; --verde:#2E9E5B; --verde-ml:#00A650; --verde-claro:#57D68A;
|
||
--sombra:0 1px 2px rgba(3,6,11,.05), 0 4px 14px rgba(3,6,11,.05);
|
||
--sombra-alta:0 2px 6px rgba(3,6,11,.07), 0 10px 30px rgba(3,6,11,.11)}
|
||
*{box-sizing:border-box;margin:0;padding:0}
|
||
html{scroll-behavior:smooth;font-size:62.5%}
|
||
body{background:var(--white);color:var(--font-color-base);font-family:var(--font-family-base);
|
||
font-size:var(--font-size-base);font-weight:var(--font-weight-base);line-height:var(--line-height);
|
||
-webkit-font-smoothing:antialiased}
|
||
h1,h2,h3{font-family:var(--font-family-title);color:var(--font-color-title);
|
||
font-weight:var(--font-weight-title);letter-spacing:normal;line-height:1.15}
|
||
.w{max-width:1020px;margin:0 auto;padding:0 22px}
|
||
section{padding:clamp(34px,5vw,56px) 0}
|
||
section+section{border-top:1px solid var(--linha)}
|
||
.prova+section{border-top:0}
|
||
|
||
/* tarja rotativa, como no site */
|
||
.tarja{background:var(--laranja);color:#111;text-align:center;padding:8px 16px;
|
||
font-family:"Inter",sans-serif;font-weight:700;font-size:12px;letter-spacing:.02em}
|
||
.tarja a{color:#111;text-decoration:none}
|
||
|
||
/* topo */
|
||
.topo{background:#fff;border-bottom:1px solid var(--linha);position:sticky;top:0;z-index:60}
|
||
.topo .w{display:flex;align-items:center;gap:22px;padding-top:15px;padding-bottom:15px}
|
||
.logo{display:flex;align-items:center;text-decoration:none;white-space:nowrap;flex:none}
|
||
.logo img{height:26px;width:auto;display:block}
|
||
.logotexto{font-family:"Inter",sans-serif;font-weight:700;font-size:19px;color:var(--black);
|
||
letter-spacing:-.03em}
|
||
.logotexto i{font-style:normal;color:var(--laranja)}
|
||
.busca{flex:1;max-width:420px;position:relative}
|
||
.busca input{width:100%;padding:9px 14px 9px 36px;border:1px solid var(--linha);border-radius:22px;
|
||
font-family:inherit;font-size:13px;background:var(--cinza);color:var(--tx)}
|
||
.busca input:focus{outline:none;border-color:var(--laranja);background:#fff}
|
||
.busca .lupa{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--fraco);font-size:13px}
|
||
.acts{margin-left:auto;display:flex;gap:18px;align-items:center;font-size:12.5px}
|
||
.acts a{color:var(--tx);text-decoration:none;display:flex;align-items:center;gap:6px}
|
||
.acts a:hover{color:var(--laranja)}
|
||
|
||
/* menu */
|
||
.menu{background:#fff;border-bottom:1px solid var(--linha)}
|
||
.menu .w{display:flex;gap:0;flex-wrap:wrap}
|
||
.mi{position:relative}
|
||
.mi>a{display:block;padding:13px 16px;font-family:"Inter",sans-serif;font-weight:600;
|
||
font-size:12.5px;color:var(--tx);text-decoration:none;white-space:nowrap}
|
||
.mi:hover>a{color:var(--laranja)}
|
||
.mi.on>a{color:var(--laranja);box-shadow:inset 0 -2px 0 var(--laranja)}
|
||
.sub{display:none;position:absolute;top:100%;left:0;background:#fff;border:1px solid var(--linha);
|
||
border-radius:0 0 9px 9px;min-width:224px;padding:7px 0;z-index:70;
|
||
box-shadow:0 10px 26px rgba(0,0,0,.09)}
|
||
.mi:hover .sub,.mi:focus-within .sub{display:block}
|
||
.sub a{display:block;padding:8px 17px;font-size:12.5px;color:var(--fraco);text-decoration:none}
|
||
.sub a:hover{color:var(--laranja);background:var(--cinza)}
|
||
@media(max-width:820px){
|
||
.menu .w{overflow-x:auto;flex-wrap:nowrap}
|
||
.sub{display:none!important}
|
||
.busca{display:none}
|
||
}
|
||
|
||
.hero{background:#000;color:#fff;position:relative;overflow:hidden}
|
||
.hero .fundo{position:absolute;inset:0;pointer-events:none}
|
||
.hero .fundo svg{width:100%;height:100%;display:block;opacity:.22}
|
||
/* escurece do lado do texto, para o título não competir com o fundo */
|
||
.hero .fundo::after{content:"";position:absolute;inset:0;
|
||
background:linear-gradient(100deg,#000 0%,#000 32%,rgba(0,0,0,.85) 52%,rgba(0,0,0,.55) 100%)}
|
||
.hero .w{position:relative;z-index:2}
|
||
.hgrid{display:grid;grid-template-columns:1.15fr auto;gap:38px;align-items:center;
|
||
padding:clamp(26px,3.6vw,40px) 0}
|
||
@media(max-width:940px){.hgrid{grid-template-columns:1fr;gap:22px}}
|
||
h1{font-size:clamp(24px,3.6vw,38px);font-weight:700;max-width:20ch;line-height:1.08}
|
||
h1 em{font-style:normal;color:var(--laranja)}
|
||
.hero .sub2{color:#B7C1D2;font-size:14px;max-width:56ch;margin-top:10px}
|
||
.hero .sub2 b{color:#fff}
|
||
.hcta{display:flex;gap:12px;margin-top:16px;flex-wrap:wrap;align-items:center}
|
||
.btn1{background:var(--laranja);color:#241703;border:0;border-radius:9px;padding:12px 24px;
|
||
font-family:"Inter",sans-serif;font-weight:700;font-size:14.5px;cursor:pointer;text-decoration:none}
|
||
.btn1:hover{background:var(--laranja2)}
|
||
.mini{font-size:12px;color:#8D9AB0}
|
||
|
||
/* preços lado a lado, em faixa */
|
||
.pfaixa{display:flex;gap:10px;flex-wrap:wrap}
|
||
@media(max-width:940px){.pfaixa{flex-wrap:wrap}}
|
||
.pcard{flex:1 1 44%;min-width:128px;background:rgba(255,255,255,.055);
|
||
border:1px solid rgba(255,255,255,.13);border-radius:11px;padding:13px 15px;
|
||
text-decoration:none;position:relative;transition:.15s}
|
||
.pcard:hover{background:rgba(255,168,26,.12);border-color:rgba(255,168,26,.45)}
|
||
.pcard.dest{border-color:rgba(255,168,26,.5);background:rgba(255,168,26,.09)}
|
||
.pcard .marc{position:absolute;top:-8px;left:13px;background:var(--verde);color:#fff;
|
||
font-family:"Inter",sans-serif;font-size:8.5px;font-weight:700;letter-spacing:.09em;
|
||
text-transform:uppercase;padding:2px 8px;border-radius:4px;white-space:nowrap}
|
||
.pcard .apartir{display:block;font-size:9.5px;color:var(--verde-claro);letter-spacing:.09em;
|
||
text-transform:uppercase;font-family:"Inter",sans-serif;font-weight:700;margin-bottom:2px}
|
||
.pcard .vl{font-family:"Inter",sans-serif;font-size:20px;font-weight:700;color:var(--laranja);
|
||
line-height:1;display:block;margin-bottom:3px}
|
||
.pcard .vl small{font-size:11px;font-weight:600;color:#8D9AB0}
|
||
.pcard .nm{font-family:"Inter",sans-serif;font-size:12.5px;font-weight:700;color:#fff;display:block}
|
||
.pcard .dsc{font-size:10.5px;color:#8D9AB0;display:block;margin-top:1px}
|
||
|
||
/* selos e barra */
|
||
.selos1{display:flex;gap:7px;flex-wrap:wrap;align-items:center;margin-bottom:11px}
|
||
.sel{font-family:"Inter",sans-serif;font-size:9.5px;font-weight:700;letter-spacing:.09em;
|
||
text-transform:uppercase;padding:3px 9px;border-radius:5px}
|
||
.sel.top{background:var(--laranja);color:#241703}
|
||
.sel.novo{background:rgba(46,158,91,.18);color:#7FD4A0;border:1px solid rgba(46,158,91,.4)}
|
||
.sel.pos{background:rgba(255,255,255,.09);color:#B7C1D2;border:1px solid rgba(255,255,255,.16)}
|
||
.barrah{border-top:1px solid rgba(255,255,255,.1);padding:11px 0 14px;
|
||
display:flex;gap:24px;flex-wrap:wrap;font-size:12px;color:#B7C1D2}
|
||
.barrah span{display:flex;align-items:center;gap:7px}
|
||
.barrah b{color:#fff;font-family:"Inter",sans-serif}
|
||
.barrah i{color:var(--laranja);font-style:normal;font-size:9px}
|
||
|
||
|
||
/* aviso do topo do envio */
|
||
|
||
/* escolha em 3 cards */
|
||
.escolha{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:24px;
|
||
align-items:stretch}
|
||
.escolha .ec{display:flex;flex-direction:column}
|
||
.escolha .ec .in{flex:1}
|
||
@media(max-width:1000px){.escolha{grid-template-columns:repeat(2,1fr)}}
|
||
@media(max-width:600px){.escolha{grid-template-columns:1fr}}
|
||
.ec{border:1px solid var(--linha);border-radius:14px;background:#fff;padding:0;
|
||
cursor:pointer;text-align:left;font-family:inherit;overflow:hidden;
|
||
box-shadow:var(--sombra);transition:var(--transition);
|
||
display:block;width:100%;position:relative}
|
||
/* marca d'agua dos cards · mesma da foto de produto: curva de nivel + sacola Dropstar
|
||
(a sacola e uma reconstrucao; trocar pelo arquivo oficial do designer) */
|
||
.ec::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
|
||
background-repeat:no-repeat;background-position:right -60px center;background-size:auto 150%;
|
||
background-image:url("data:image/svg+xml;utf8,\
|
||
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 300'>\
|
||
<g fill='none' stroke='%23000000' stroke-opacity='.055' stroke-width='1.6'>\
|
||
<path d='M200 46c66 0 138 40 138 104s-72 104-138 104S62 214 62 150 134 46 200 46z'/>\
|
||
<path d='M200 46c66 0 138 40 138 104s-72 104-138 104S62 214 62 150 134 46 200 46z' transform='translate(200 150) scale(.86) translate(-200 -150)'/>\
|
||
<path d='M200 46c66 0 138 40 138 104s-72 104-138 104S62 214 62 150 134 46 200 46z' transform='translate(200 150) scale(.72) translate(-200 -150)'/>\
|
||
<path d='M200 46c66 0 138 40 138 104s-72 104-138 104S62 214 62 150 134 46 200 46z' transform='translate(200 150) scale(.58) translate(-200 -150)'/>\
|
||
<path d='M200 46c66 0 138 40 138 104s-72 104-138 104S62 214 62 150 134 46 200 46z' transform='translate(200 150) scale(.44) translate(-200 -150)'/>\
|
||
<path d='M200 46c66 0 138 40 138 104s-72 104-138 104S62 214 62 150 134 46 200 46z' transform='translate(200 150) scale(.30) translate(-200 -150)'/>\
|
||
<path d='M200 46c66 0 138 40 138 104s-72 104-138 104S62 214 62 150 134 46 200 46z' transform='translate(200 150) scale(1.16) translate(-200 -150)'/>\
|
||
<path d='M200 46c66 0 138 40 138 104s-72 104-138 104S62 214 62 150 134 46 200 46z' transform='translate(200 150) scale(1.34) translate(-200 -150)'/>\
|
||
</g></svg>")}
|
||
.ec::after{content:"";position:absolute;right:16px;bottom:14px;width:104px;height:26px;
|
||
opacity:.16;pointer-events:none;z-index:0;background-repeat:no-repeat;
|
||
background-position:right bottom;background-size:contain;
|
||
background-image:url("https://cdn.vnda.com.br/dropstar/2025/12/17/logo-header-15125700-16129080.png?v=1766009286")}
|
||
.ec .top,.ec .in{position:relative;z-index:1}
|
||
.ec:hover{border-color:var(--laranja);box-shadow:var(--sombra-alta);transform:translateY(-2px)}
|
||
.ec .marc{display:block;background:var(--verde-ml);color:#fff;text-align:center;
|
||
font-family:"Inter",sans-serif;font-size:9px;font-weight:700;letter-spacing:.14em;
|
||
text-transform:uppercase;padding:5px 8px;position:relative;z-index:2}
|
||
.ec.f{border-color:var(--verde-ml)}
|
||
.ec.f:hover{border-color:var(--verde-ml)}
|
||
/* anéis verdes por trás do card destacado, mesma família dos selos */
|
||
.ec.f::before{background-image:url("data:image/svg+xml;utf8,\
|
||
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 300'>\
|
||
<g fill='none' stroke='%2300A650' stroke-opacity='.10' stroke-width='1.6'>\
|
||
<path d='M200 46c66 0 138 40 138 104s-72 104-138 104S62 214 62 150 134 46 200 46z'/>\
|
||
<path d='M200 46c66 0 138 40 138 104s-72 104-138 104S62 214 62 150 134 46 200 46z' transform='translate(200 150) scale(.82) translate(-200 -150)'/>\
|
||
<path d='M200 46c66 0 138 40 138 104s-72 104-138 104S62 214 62 150 134 46 200 46z' transform='translate(200 150) scale(.64) translate(-200 -150)'/>\
|
||
<path d='M200 46c66 0 138 40 138 104s-72 104-138 104S62 214 62 150 134 46 200 46z' transform='translate(200 150) scale(.46) translate(-200 -150)'/>\
|
||
<path d='M200 46c66 0 138 40 138 104s-72 104-138 104S62 214 62 150 134 46 200 46z' transform='translate(200 150) scale(.28) translate(-200 -150)'/>\
|
||
<path d='M200 46c66 0 138 40 138 104s-72 104-138 104S62 214 62 150 134 46 200 46z' transform='translate(200 150) scale(1.2) translate(-200 -150)'/>\
|
||
</g></svg>")}
|
||
.ec .top{padding:17px 20px;display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
|
||
.ec.f .top{background:#FFF4E3} .ec.a .top{background:var(--cinza)} .ec.u .top{background:#EEF4FB}
|
||
.ec .top h3{font-family:"Inter",sans-serif;font-size:17px;font-weight:700;color:var(--tx)}
|
||
|
||
|
||
.ec .top .p{font-family:"Inter",sans-serif;font-weight:700;font-size:15px;white-space:nowrap;
|
||
color:var(--tx);text-align:right;line-height:1.15}
|
||
.ec .top .p i{display:block;font-style:normal;font-family:"Roboto",sans-serif;font-size:10px;
|
||
font-weight:500;color:var(--fraco);margin-bottom:1px;letter-spacing:0;
|
||
text-transform:uppercase;letter-spacing:.1em}
|
||
.chama2{background:#F1FBF5;border-top:1px solid #BFE6CE;border-bottom:1px solid #BFE6CE;
|
||
padding:9px 20px;font-size:11.5px;color:#1F5C3A;line-height:1.45;position:relative;z-index:1}
|
||
.chama2 b{font-family:"Inter",sans-serif;font-weight:700;color:var(--verde-ml);font-size:12.5px}
|
||
.ec .top .p small{font-size:11px;font-weight:600;color:var(--fraco)}
|
||
.ec .in{padding:18px 20px 20px}
|
||
.ec .in p{font-size:13px;color:var(--fraco);margin-bottom:13px}
|
||
.ec ul{list-style:none;font-size:12.5px;margin-bottom:15px}
|
||
.ec li{padding:4px 0 4px 19px;position:relative;color:var(--fraco)}
|
||
.ec li::before{content:"✓";position:absolute;left:2px;color:var(--verde);font-size:11px}
|
||
.ec .go{font-family:"Inter",sans-serif;font-weight:700;font-size:13.5px;color:var(--laranja);display:block}
|
||
.ec .lg{display:block;font-size:10.5px;color:var(--fraco);letter-spacing:.1em;
|
||
text-transform:uppercase;font-family:"Inter",sans-serif;font-weight:700;margin-bottom:5px}
|
||
|
||
/* painel focado */
|
||
.foco{display:none}
|
||
.foco.on{display:block}
|
||
.focoGrid{display:grid;grid-template-columns:minmax(0,1fr) 264px;gap:16px;align-items:start}
|
||
.focoGrid>*{min-width:0}
|
||
@media(max-width:820px){.focoGrid{grid-template-columns:1fr}}
|
||
.voltar{display:inline-flex;align-items:center;gap:7px;background:#fff;
|
||
border:1px solid var(--linha);border-radius:8px;padding:8px 14px 8px 11px;
|
||
font-family:"Inter",sans-serif;font-weight:600;font-size:12.5px;color:var(--tx);
|
||
cursor:pointer;margin-bottom:14px;box-shadow:var(--sombra);transition:var(--transition)}
|
||
.voltar span{font-size:15px;line-height:1;color:var(--fraco)}
|
||
.voltar:hover{border-color:var(--laranja);color:var(--laranja)}
|
||
.voltar:hover span{color:var(--laranja)}
|
||
.cat{border:1px solid var(--linha);border-radius:14px;background:#fff;overflow:hidden;
|
||
box-shadow:var(--sombra)}
|
||
.cat.file{border-color:var(--laranja);border-width:2px}
|
||
.cabfoco{display:flex;justify-content:space-between;align-items:baseline;gap:14px;
|
||
flex-wrap:wrap;border-bottom:1px solid var(--linha);background:var(--cinza);padding:18px 22px}
|
||
.cat.file .cabfoco{background:#FFF4E3}
|
||
.cabfoco h3{font-family:"Inter",sans-serif;font-size:20px;font-weight:700}
|
||
.cabfoco .pr2{font-family:"Inter",sans-serif;font-weight:700;font-size:17px;white-space:nowrap}
|
||
.cabfoco p{font-size:12.5px;color:var(--fraco);width:100%;margin-top:4px}
|
||
.cabfoco .lg{font-size:10.5px;color:var(--fraco);letter-spacing:.1em;text-transform:uppercase;
|
||
font-family:"Inter",sans-serif;font-weight:700}
|
||
|
||
/* upload */
|
||
/* o cliente escolhe o caminho antes de subir · a declaração orienta,
|
||
mas quem decide o preço é o arquivo que chegar */
|
||
.caminhos{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:13px}
|
||
@media(max-width:620px){.caminhos{grid-template-columns:1fr}}
|
||
.caminhos>*{min-width:0}
|
||
.cam{display:flex;gap:9px;align-items:flex-start;text-align:left;background:#fff;
|
||
border:1px solid var(--linha);border-radius:10px;padding:11px 12px;cursor:pointer;
|
||
font-family:inherit;color:var(--tx);transition:var(--transition);
|
||
min-width:0;overflow:hidden}
|
||
.cam:hover{border-color:var(--gray-3)}
|
||
.cam.on{border-color:var(--verde-ml);background:#F4FCF7;box-shadow:0 0 0 1px var(--verde-ml)}
|
||
.cam .mk2{flex:none;width:15px;height:15px;border-radius:50%;margin-top:2px;
|
||
border:2px solid var(--gray-2);background:#fff}
|
||
.cam.on .mk2{border-color:var(--verde-ml);
|
||
background:radial-gradient(circle,var(--verde-ml) 0 3px,#fff 4px)}
|
||
.cam div{flex:1;min-width:0;overflow-wrap:anywhere}
|
||
.cam b{display:block;font-family:"Inter",sans-serif;font-size:12.5px;margin-bottom:2px}
|
||
.cam span{display:block;font-size:10.5px;color:var(--fraco);line-height:1.45}
|
||
.cam em{display:block;margin-top:6px;font-style:normal;font-family:"Inter",sans-serif;
|
||
font-weight:700;font-size:12px;color:var(--verde-ml);line-height:1.3}
|
||
.cam em.cheio{color:var(--vermelho)}
|
||
.trocouCam{margin-top:-4px;margin-bottom:11px;padding:10px 12px;border-radius:9px;
|
||
background:#FFF6E8;border:1px solid #F0D9AE;font-size:11.5px;color:#7A5A16;line-height:1.5}
|
||
.trocouCam b{color:#B07A18;font-family:"Inter",sans-serif;font-weight:700}
|
||
.trocarModo{margin:-4px 0 11px;padding:10px 12px;border-radius:9px;background:#F1FBF5;
|
||
border:1px solid #BFE6CE;font-size:11.5px;color:#1F5C3A;line-height:1.5}
|
||
.trocarModo b{font-family:"Inter",sans-serif;font-weight:700}
|
||
.trocarModo label{display:block;margin-top:7px;cursor:pointer}
|
||
.zona{border:2px dashed var(--laranja);border-radius:13px;padding:44px 20px;text-align:center;
|
||
cursor:pointer;margin-bottom:14px;background:#FFF6E8;transition:var(--transition)}
|
||
.zona:hover,.zona.sobre{border-color:var(--laranja2);background:#FFEFD6;
|
||
box-shadow:0 6px 22px rgba(255,168,26,.22)}
|
||
.zona .ico{width:46px;height:46px;margin:0 auto 12px;border-radius:50%;
|
||
background:var(--laranja);color:#fff;font-size:22px;line-height:46px;font-weight:700;
|
||
box-shadow:0 0 0 7px rgba(255,168,26,.18)}
|
||
.zona:hover .ico,.zona.sobre .ico{background:var(--laranja2)}
|
||
.zona b{display:block;font-family:"Inter",sans-serif;font-size:18px;font-weight:700;
|
||
margin-bottom:5px;color:var(--tx);line-height:1.2}
|
||
.zona span{font-size:12px;color:#8A6A2E;display:block;max-width:30ch;margin:0 auto;line-height:1.5}
|
||
.zona .bt{display:inline-block;margin-top:13px;background:var(--laranja);color:#241703;
|
||
font-family:"Inter",sans-serif;font-weight:700;font-size:13px;border-radius:8px;
|
||
padding:9px 18px}
|
||
.zona:hover .bt{background:var(--laranja2)}
|
||
.recusa{margin-top:11px;padding:11px 13px;border-radius:9px;background:#FFF3F0;
|
||
border:1px solid #F0C4B8;font-size:11.5px;color:#8C3B22;line-height:1.5}
|
||
.recusa b{font-family:"Inter",sans-serif;font-weight:700;color:#8C3B22}
|
||
.aoVivo{margin-top:11px;padding:11px 13px;border-radius:9px;background:var(--cinza);
|
||
border:1px solid var(--linha);font-size:12px;color:var(--fraco);line-height:1.45;
|
||
display:flex;align-items:center;gap:9px}
|
||
.aoVivo b{font-family:"Inter",sans-serif;font-weight:700;color:var(--tx);font-size:12.5px}
|
||
.aoVivo .pt2{flex:none;width:8px;height:8px;border-radius:50%;background:var(--gray-2)}
|
||
.aoVivo.pronto{background:#F1FBF5;border-color:#BFE6CE;color:#2A6B45}
|
||
.aoVivo.pronto .pt2{background:var(--verde-ml)}
|
||
.aoVivo.pronto b{color:#1F5C3A}
|
||
.b2{width:100%;padding:13px;border-radius:9px;border:1px solid var(--marinho);background:#fff;
|
||
color:var(--tx);font-family:"Inter",sans-serif;font-weight:600;font-size:14.5px;cursor:pointer}
|
||
.cat.file .b2{background:var(--laranja);border-color:var(--laranja);color:#241703}
|
||
.b2:hover{background:#111;color:#fff}
|
||
.cat.file .b2:hover{background:var(--laranja2);color:#241703}
|
||
.it{display:flex;justify-content:space-between;gap:9px;padding:10px 13px;background:var(--cinza);
|
||
border-radius:8px;margin-bottom:7px;align-items:center;font-size:12.5px}
|
||
.it b{font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
|
||
.it span{color:var(--fraco);font-size:11px;flex:none}
|
||
.it button{border:0;background:none;color:var(--fraco);cursor:pointer;font-size:15px}
|
||
|
||
/* repetição do FILE */
|
||
.rep{background:var(--cinza);border-radius:9px;padding:12px 14px;margin-top:8px}
|
||
.somaF{margin-top:10px;padding:11px 13px;border-radius:9px;background:#F1FBF5;
|
||
border:1px solid #BFE6CE;display:flex;flex-wrap:wrap;align-items:baseline;gap:8px}
|
||
.somaF span{font-size:11.5px;color:#2A6B45}
|
||
.somaF b{font-family:"Inter",sans-serif;font-weight:700;font-size:15px;color:#1F5C3A;
|
||
margin-left:auto}
|
||
.somaF em{flex-basis:100%;font-style:normal;font-size:10.5px;color:#4A7A5E}
|
||
.rep .l1{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:9px}
|
||
.rep .l1 b{font-weight:500;font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
|
||
.rep .l1 button{border:0;background:none;color:var(--fraco);cursor:pointer;font-size:15px;flex:none}
|
||
.prog{height:5px;border-radius:4px;background:#E4E7EC;overflow:hidden;margin:9px 0 5px}
|
||
.prog i{display:block;height:100%;background:var(--laranja);border-radius:4px;
|
||
transition:width .35s ease}
|
||
.progT{display:block;font-size:10.5px;color:var(--fraco)}
|
||
.progF{margin:9px 0 4px;padding:9px 11px;border-radius:7px;background:#FFF6E8;
|
||
border:1px solid #F0D9AE;font-size:11px;color:#7A5A16;line-height:1.5}
|
||
.progF b{font-family:"Inter",sans-serif;font-weight:700;color:#B07A18}
|
||
.rep .cps{display:grid;grid-template-columns:120px 1fr;gap:10px;align-items:end}
|
||
.rep label{display:block;font-size:10px;color:var(--fraco);margin-bottom:3px}
|
||
.rep input{width:100%;padding:7px 9px;border:1px solid var(--linha);border-radius:6px;
|
||
font-family:inherit;font-size:13px;background:#fff;color:var(--tx)}
|
||
.rep input:focus{outline:none;border-color:var(--laranja)}
|
||
.rep .conta{font-size:11.5px;color:var(--fraco);line-height:1.4}
|
||
.rep .conta b{color:var(--tx);font-family:"Inter",sans-serif}
|
||
.med{background:#fff;border:1px solid var(--linha);border-radius:8px;padding:10px 12px;margin-top:9px}
|
||
.med b{display:block;font-family:"Inter",sans-serif;font-size:15px;font-weight:700;color:var(--tx)}
|
||
.med span{display:block;font-size:11px;color:var(--fraco);margin-top:2px}
|
||
.med em{display:block;font-style:normal;font-size:11.5px;color:#B07A18;margin-top:7px;line-height:1.45}
|
||
.med.alerta{border-color:#E8A796;background:#FFF3F0}
|
||
.med.alerta b{color:#8C3B22}
|
||
.med.alerta em{color:#8C3B22}
|
||
.med.pede{border-color:var(--laranja);background:#FFFAF2}
|
||
.med.pede b{font-size:12.5px;color:#B07A18}
|
||
.conf{margin-top:9px;padding:9px 11px;border-radius:7px;background:#F1FBF5;
|
||
border:1px solid #BFE6CE;line-height:1.5}
|
||
.conf b{display:block;font-family:"Inter",sans-serif;font-size:11.5px;color:#1F5C3A;
|
||
margin-bottom:3px}
|
||
.conf span{display:block;font-size:10.5px;color:#2A6B45}
|
||
.med .troca{margin-top:9px;padding:9px 11px;border-radius:7px;background:#F1FBF5;
|
||
border:1px solid #BFE6CE;font-size:11.5px;color:#1F5C3A;line-height:1.5}
|
||
.med .troca b{display:inline;font-size:11.5px;color:#1F5C3A;font-weight:700}
|
||
.med input{width:100%;margin-top:8px;padding:8px 10px;border:1px solid var(--linha);
|
||
border-radius:6px;font-family:inherit;font-size:13px;background:#fff;color:var(--tx)}
|
||
.med input:focus{outline:none;border-color:var(--laranja)}
|
||
|
||
/* fila de artes ao lado da montagem */
|
||
.foco2{display:grid;grid-template-columns:minmax(340px,1fr) 320px;gap:20px;
|
||
align-items:start;margin-top:2px}
|
||
.foco2>*{min-width:0}
|
||
.foco2.sofila{grid-template-columns:1fr}
|
||
.foco2.sofila .mont{display:none}
|
||
@media(max-width:1360px){.foco2{grid-template-columns:1fr}}
|
||
.mont{position:sticky;top:104px;border:1px solid var(--linha);border-radius:11px;
|
||
background:var(--cinza);padding:12px;box-shadow:var(--sombra)}
|
||
.montcab{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:9px}
|
||
.montcab b{font-family:"Inter",sans-serif;font-size:12.5px;font-weight:700}
|
||
.zoomB{display:flex;align-items:center;gap:4px;margin-left:auto}
|
||
.zoomB button{width:22px;height:22px;border-radius:6px;border:1px solid var(--linha);
|
||
background:#fff;color:var(--tx);cursor:pointer;font-size:14px;line-height:1;padding:0}
|
||
.zoomB button:hover{border-color:var(--laranja);color:var(--laranja)}
|
||
.zoomB button:disabled{opacity:.35;cursor:not-allowed}
|
||
.zoomB span{font-family:"Inter",sans-serif;font-size:10.5px;font-weight:700;
|
||
color:var(--fraco);min-width:34px;text-align:center}
|
||
#vArea.ampliado{overflow:auto}
|
||
.montcab span{font-family:"Inter",sans-serif;font-weight:700;font-size:16px;color:var(--tx)}
|
||
#vArea{max-height:min(56vh,560px);min-height:200px;overflow-y:auto;overscroll-behavior:contain;
|
||
border:1px solid var(--linha);border-radius:8px;background:#fff}
|
||
#vArea::-webkit-scrollbar{width:8px}
|
||
#vArea::-webkit-scrollbar-thumb{background:var(--gray-2);border-radius:6px;
|
||
border:2px solid #fff}
|
||
#vArea::-webkit-scrollbar-track{background:transparent}
|
||
#vArea canvas{max-width:100%;height:auto;display:block;background:#fff}
|
||
#vArea.ampliado canvas{max-width:none}
|
||
#vArea .folhaPrevias{min-height:200px;padding:10px;display:grid;gap:12px;background:#F8F9FA}
|
||
#vArea .folhaPrevia{margin:0;background:#fff;border:1px solid var(--linha);border-radius:6px;overflow:hidden}
|
||
#vArea .folhaPrevia img{width:100%;height:auto;max-height:520px;object-fit:contain;display:block;background:#fff}
|
||
#vArea .folhaPrevia figcaption{padding:7px 9px;font-size:10.5px;color:var(--fraco);border-top:1px solid var(--linha)}
|
||
#vArea .semmont{border:0;min-height:200px;display:flex;flex-direction:column;
|
||
align-items:center;justify-content:center}
|
||
#vUso:empty{display:none}
|
||
.semmont{border:1px dashed var(--linha);border-radius:8px;background:#fff;
|
||
padding:30px 14px;text-align:center}
|
||
.semmont b{display:block;font-family:"Inter",sans-serif;font-size:13px;margin-bottom:4px}
|
||
.semmont span{font-size:11.5px;color:var(--fraco);line-height:1.4;display:block}
|
||
.montpe{font-size:10.5px;color:var(--fraco);margin-top:9px;line-height:1.45}
|
||
|
||
/* caixa de requisitos · o que a máquina aceita */
|
||
.req{position:sticky;top:104px;background:#fff;border:1px solid var(--linha);
|
||
border-radius:14px;box-shadow:var(--sombra);padding:16px 16px 6px}
|
||
@media(max-width:820px){.req{position:static}}
|
||
.reqcab{font-family:"Inter",sans-serif;font-size:18px;font-weight:700;line-height:1.15;
|
||
letter-spacing:normal;color:var(--tx);margin-bottom:12px}
|
||
.req details{border-top:1px solid var(--linha)}
|
||
.req details:first-of-type{border-top:0}
|
||
.req summary{cursor:pointer;list-style:none;padding:9px 0;font-family:"Inter",sans-serif;
|
||
font-size:13px;font-weight:700;color:var(--tx);display:flex;align-items:center;gap:8px}
|
||
.req summary::-webkit-details-marker{display:none}
|
||
.req summary::before{content:"+";flex:none;width:16px;height:16px;border-radius:50%;
|
||
border:1px solid rgba(0,166,80,.45);background:#fff;color:var(--verde-ml);font-size:11px;
|
||
line-height:14px;text-align:center;font-weight:700}
|
||
.req summary:hover::before{background:#F1FBF5}
|
||
.req details[open] summary::before{content:"−";background:var(--verde-ml);
|
||
border-color:var(--verde-ml);color:#fff}
|
||
.req ul{list-style:none;padding:0 0 9px;margin:0}
|
||
.req li{position:relative;padding:4px 0 4px 17px;font-size:11.5px;color:var(--fraco);
|
||
line-height:1.5}
|
||
.req li b{color:var(--tx);font-weight:700;font-family:"Inter",sans-serif}
|
||
.req li::before{position:absolute;left:0;top:4px;font-size:11px;font-weight:700}
|
||
.req li.s::before{content:"✓";color:var(--verde-ml)}
|
||
.req li.a::before{content:"!";color:var(--laranja)}
|
||
.req li.n::before{content:"×";color:var(--vermelho)}
|
||
.req .obs2{font-size:10.5px;color:var(--fraco);padding:0 0 9px;line-height:1.45;
|
||
font-style:italic}
|
||
.mont .usoBom,.mont .usoRuim{margin-top:8px;font-size:11px;line-height:1.4}
|
||
|
||
/* artes avulsas */
|
||
.art{background:var(--cinza);border-radius:9px;padding:11px 12px;margin-bottom:7px;
|
||
transition:box-shadow .3s,background .3s}
|
||
.art.nova{background:#FFF6E8;box-shadow:inset 0 0 0 1px rgba(255,168,26,.55)}
|
||
.art.nova .l1 b::after{content:"nova";font-family:"Inter",sans-serif;font-size:9px;
|
||
font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#B07A18;
|
||
background:#FFE9C4;border-radius:3px;padding:1px 5px;margin-left:7px;vertical-align:1px}
|
||
.art .l1{display:flex;justify-content:space-between;gap:8px;align-items:center;margin-bottom:8px}
|
||
.art .l1 b{font-weight:500;font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
|
||
.art .l1 button{border:0;background:none;color:var(--fraco);cursor:pointer;font-size:15px;flex:none}
|
||
.art .cps{display:grid;grid-template-columns:1fr 1fr;gap:8px}
|
||
.atalhos{display:flex;flex-wrap:wrap;gap:5px;align-items:center;margin-top:9px}
|
||
.atalhos .tm,.atalhos .gr{border:1px solid var(--linha);background:#fff;border-radius:6px;
|
||
padding:5px 9px;font-family:"Inter",sans-serif;font-size:11px;font-weight:600;
|
||
color:var(--tx);cursor:pointer;transition:var(--transition)}
|
||
.atalhos .tm:hover,.atalhos .gr:hover{border-color:var(--laranja);color:var(--laranja)}
|
||
.atalhos .tm.on{background:var(--verde-ml);border-color:var(--verde-ml);color:#fff}
|
||
.atalhos .gr{font-size:14px;line-height:1;padding:4px 9px}
|
||
.atalhos .gr.on{background:var(--laranja);border-color:var(--laranja);color:#241703}
|
||
.atalhos .sep{flex:1;min-width:4px}
|
||
.art label{display:block;font-size:10px;color:var(--fraco);margin-bottom:3px}
|
||
.art input{width:100%;padding:7px 9px;border:1px solid var(--linha);border-radius:6px;
|
||
font-family:inherit;font-size:13px;background:#fff;color:var(--tx)}
|
||
.art input:focus{outline:none;border-color:var(--laranja)}
|
||
.qb2{height:7px;border-radius:5px;background:#E4E7EC;overflow:hidden;margin-top:9px}
|
||
.qb2 i{display:block;height:100%;border-radius:5px}
|
||
.qb2 i.ok{background:var(--verde)}.qb2 i.av{background:var(--laranja)}.qb2 i.er{background:var(--vermelho)}
|
||
.calc{font-size:10.5px;margin-top:6px;display:flex;justify-content:space-between;gap:8px;color:var(--fraco)}
|
||
.calc .ok{color:var(--verde)}.calc .av{color:var(--laranja)}.calc .er{color:var(--vermelho)}
|
||
.dica{margin-top:9px;background:#FFF8EE;border:1px solid #F0D9AE;border-radius:8px;
|
||
padding:10px 12px;font-size:11.5px;color:#7A5A16;line-height:1.45}
|
||
.dica b{display:block;font-family:"Inter",sans-serif;color:#B07A18;font-size:12px;margin-bottom:3px}
|
||
.dica button{display:block;width:100%;margin-top:10px;padding:10px 14px;border-radius:7px;
|
||
border:1px solid var(--verde-ml);background:var(--verde-ml);color:#fff;
|
||
font-family:"Inter",sans-serif;font-weight:700;font-size:13px;letter-spacing:.01em;
|
||
cursor:pointer;box-shadow:0 2px 8px rgba(0,166,80,.28);transition:var(--transition)}
|
||
.dica button:hover{background:#00934A;border-color:#00934A;box-shadow:0 4px 14px rgba(0,166,80,.38)}
|
||
.dicaok{margin-top:8px;font-size:11px;color:var(--verde)}
|
||
|
||
/* cota em escala da peça dentro da largura do filme */
|
||
.viz{margin-top:10px;max-width:100%}
|
||
.vizL{display:flex;align-items:center;gap:7px;margin-bottom:5px}
|
||
.vizL i{flex:1;height:1px;background:var(--gray-2);position:relative}
|
||
.vizL i::before{content:"";position:absolute;top:-3px;width:1px;height:7px;background:var(--gray-2)}
|
||
.vizL i:first-child::before{left:0} .vizL i:last-child::before{right:0}
|
||
.vizL b{font-family:"Inter",sans-serif;font-size:9.5px;font-weight:700;letter-spacing:.08em;
|
||
text-transform:uppercase;color:var(--fraco)}
|
||
.vizRow{display:flex;gap:7px;align-items:flex-end}
|
||
.vizTira{flex:none;max-width:100%}
|
||
.vizH{flex:none;display:flex;align-items:center;justify-content:center;padding-left:4px;
|
||
border-left:1px solid var(--gray-2);min-height:22px}
|
||
.vizH span{writing-mode:vertical-rl;font-family:"Inter",sans-serif;font-size:9.5px;
|
||
font-weight:700;color:var(--fraco);white-space:nowrap}
|
||
.tira{display:flex;background:#fff;border:1px solid var(--linha);border-radius:4px;
|
||
padding:2px;overflow:hidden;min-height:22px;width:100%}
|
||
.pc{flex:none;overflow:hidden;display:flex;align-items:center;justify-content:center;
|
||
background:#F2F2F2;border-radius:2px}
|
||
.pc img{width:100%;height:100%;object-fit:contain;display:block}
|
||
.pc span{font-family:"Inter",sans-serif;font-size:9px;font-weight:700;color:var(--fraco)}
|
||
.folga{flex:1;min-width:0;display:flex;align-items:center;justify-content:center;border-radius:2px;
|
||
background:repeating-linear-gradient(45deg,#FBFBFB,#FBFBFB 4px,#F0F0F0 4px,#F0F0F0 8px)}
|
||
.folga span{font-size:8.5px;color:var(--fraco);white-space:nowrap;overflow:hidden}
|
||
.vizPe{font-size:10.5px;color:var(--fraco);margin-top:6px;line-height:1.4}
|
||
.vizPe b{color:var(--tx);font-family:"Inter",sans-serif;font-weight:700}
|
||
.resumoA{background:#fff;border:1px solid var(--linha);border-radius:9px;padding:11px 13px;
|
||
font-size:12px;margin-bottom:12px;display:none}
|
||
.resumoA.on{display:block}
|
||
.resumoA .r{display:flex;justify-content:space-between;padding:2px 0}
|
||
.resumoA .r b{font-family:"Inter",sans-serif}
|
||
|
||
/* nota de qualidade */
|
||
.qual{background:#fff;border:1px solid var(--linha);border-radius:13px;padding:22px;margin-top:16px;display:none}
|
||
.qual.on{display:block}
|
||
.qh{display:flex;justify-content:space-between;align-items:flex-end;gap:14px;flex-wrap:wrap;margin-bottom:14px}
|
||
.qh h3{font-family:"Inter",sans-serif;font-size:17px;font-weight:700}
|
||
.qh .pct{font-family:"Inter",sans-serif;font-weight:700;font-size:38px;line-height:1;color:var(--verde)}
|
||
.qh .pct small{font-size:14px;color:var(--fraco)}
|
||
.qbar{height:13px;border-radius:8px;background:var(--cinza);overflow:hidden}
|
||
.qbar i{display:block;height:100%;border-radius:8px;background:var(--verde)}
|
||
.qitens{display:grid;grid-template-columns:repeat(auto-fit,minmax(178px,1fr));gap:7px;margin-top:13px}
|
||
.qi{display:flex;gap:8px;align-items:center;border:1px solid var(--linha);border-radius:8px;
|
||
padding:7px 10px;font-size:11.5px}
|
||
.qi .c{width:15px;height:15px;border-radius:50%;display:grid;place-items:center;font-size:8.5px;
|
||
flex:none;color:#fff;font-family:"Inter",sans-serif;font-weight:700}
|
||
.qi b{display:block;font-family:"Inter",sans-serif;font-size:11.5px}
|
||
.qi span{color:var(--fraco);font-size:10.5px}
|
||
.qi.ok .c{background:var(--verde)}.qi.av .c{background:var(--laranja);color:#241703}
|
||
.qi.er .c{background:var(--vermelho)}
|
||
.qi.fix{border-color:#BBD9E8;background:#F2F9FC}
|
||
.qi.fix .c{background:#2F7FA8}
|
||
.ciente{background:#FFF8EE;border:1px solid #F0D9AE;border-radius:10px;padding:14px 17px;
|
||
margin-top:14px;display:none}
|
||
.ciente.on{display:block}
|
||
.ciente.recusa{background:#FFF3F0;border-color:#E8A796}
|
||
.ciente.recusa h4{color:#8C3B22}
|
||
.ciente.recusa label{display:none}
|
||
.ciente.recusa .lista{color:#8C3B22}
|
||
.ciente h4{font-family:"Inter",sans-serif;font-size:14px;font-weight:700;color:#B07A18;margin-bottom:5px}
|
||
.ciente p{font-size:12.5px;color:#7A5A16;line-height:1.5}
|
||
.ciente .lista{margin:10px 0 0;font-size:12px;color:#7A5A16}
|
||
.ciente .lista div{padding:3px 0 3px 15px;position:relative}
|
||
.ciente .lista div::before{content:"·";position:absolute;left:4px;font-weight:700}
|
||
.ciente label{display:flex;gap:9px;align-items:flex-start;margin-top:12px;padding-top:11px;
|
||
border-top:1px solid #F0D9AE;cursor:pointer;font-size:12.5px;color:#5E4512}
|
||
.ciente input{margin-top:2px;width:16px;height:16px;flex:none;accent-color:#B07A18}
|
||
@keyframes pulsa{0%,100%{transform:scale(1);box-shadow:0 0 0 0 rgba(217,74,40,.55)}
|
||
50%{transform:scale(1.04);box-shadow:0 0 0 12px rgba(217,74,40,0)}}
|
||
.qbts{display:flex;gap:9px;flex-wrap:wrap;margin-top:16px}
|
||
.qbts .qb{flex:1;min-width:220px}
|
||
.qb{padding:11px 17px;border-radius:8px;border:1px solid var(--linha);background:#fff;
|
||
font-family:"Inter",sans-serif;font-weight:600;font-size:13.5px;cursor:pointer;color:var(--tx)}
|
||
.qb.p{background:var(--laranja);border-color:var(--laranja);color:#241703}
|
||
.qb.chama{background:var(--vermelho);border-color:var(--vermelho);color:#fff;
|
||
animation:pulsa 1.6s ease-in-out infinite}
|
||
.qb.chama:hover{background:#C1421F;animation:none}
|
||
.qb:disabled{opacity:.45;cursor:not-allowed}
|
||
@media(prefers-reduced-motion:reduce){.qb.chama{animation:none}}
|
||
|
||
/* prévia */
|
||
.prev{background:#fff;border:1px solid var(--linha);border-radius:13px;padding:22px;margin-top:16px;display:none}
|
||
.prev.on{display:block}
|
||
.prev .ph{display:flex;justify-content:space-between;align-items:flex-end;gap:14px;flex-wrap:wrap;margin-bottom:14px}
|
||
.prev .ph h3{font-family:"Inter",sans-serif;font-size:17px;font-weight:700}
|
||
.prev .ph p{font-size:12.5px;color:var(--fraco)}
|
||
.prev .ph .mt{font-family:"Inter",sans-serif;font-weight:700;font-size:22px;white-space:nowrap}
|
||
.prev .ph .mt small{font-size:12px;color:var(--fraco);font-weight:600}
|
||
.pgrid{display:grid;grid-template-columns:300px 1fr;gap:18px;align-items:start}
|
||
@media(max-width:760px){.pgrid{grid-template-columns:1fr}}
|
||
.pfolha{background:var(--cinza);border:1px solid var(--linha);border-radius:10px;padding:12px}
|
||
.pfolha canvas,.pfolha img{width:100%;height:auto;display:block;border-radius:6px;background:#fff}
|
||
.pfolha .semprev,.pfolha .carregando{padding:40px 16px;text-align:center;color:var(--fraco);
|
||
font-size:12px;background:#fff;border-radius:6px}
|
||
.pfolha .semprev b{display:block;font-family:"Inter",sans-serif;color:var(--tx);font-size:13px;margin-bottom:4px}
|
||
.usoBom,.usoRuim{margin-top:10px;border-radius:8px;padding:9px 12px;font-size:11.5px;line-height:1.45}
|
||
.usoBom{background:#F1F8F3;border:1px solid #CDE6D6;color:#2A6B45}
|
||
.usoRuim{background:#FFF8EE;border:1px solid #F0D9AE;color:#7A5A16}
|
||
.usoBom b,.usoRuim b{display:block;font-family:"Inter",sans-serif;font-size:12.5px;margin-bottom:2px}
|
||
.pinfo .li{display:flex;gap:10px;align-items:flex-start;padding:7px 0;font-size:12.5px;
|
||
border-bottom:1px solid var(--linha)}
|
||
.pinfo .li:last-child{border:0}
|
||
.pinfo .li .c{width:19px;height:19px;border-radius:50%;display:grid;place-items:center;flex:none;
|
||
margin-top:1px;font-size:10px;color:#fff;font-family:"Inter",sans-serif;font-weight:700}
|
||
.pinfo .li b{display:block;font-family:"Inter",sans-serif;font-size:12.5px}
|
||
.pinfo .li span{color:var(--fraco);font-size:11.5px}
|
||
.pcta{display:flex;gap:9px;flex-wrap:wrap;margin-top:16px;padding-top:15px;border-top:1px solid var(--linha)}
|
||
.pb{padding:11px 18px;border-radius:8px;border:1px solid var(--linha);background:#fff;
|
||
font-family:"Inter",sans-serif;font-weight:600;font-size:13.5px;cursor:pointer;color:var(--tx)}
|
||
.pb.p{background:var(--laranja);border-color:var(--laranja);color:#241703}
|
||
.pb:hover{border-color:#111}
|
||
|
||
/* carrinho */
|
||
/* faixa de prova · cinco motivos logo abaixo do topo */
|
||
.prova{padding:clamp(22px,3vw,34px) 0}
|
||
.prova .w{display:grid;grid-template-columns:repeat(auto-fit,minmax(178px,1fr));gap:14px}
|
||
.p1{border-left:2px solid var(--laranja);padding:2px 0 2px 13px}
|
||
.p1 b{display:block;font-family:"Inter",sans-serif;font-size:14px;font-weight:700;
|
||
line-height:1.25;color:var(--tx);margin-bottom:5px}
|
||
.p1 b em{font-style:normal;color:var(--laranja)}
|
||
.p1 span{display:block;font-size:11.5px;color:var(--fraco);line-height:1.5}
|
||
|
||
/* ── Carrinho no padrão de checkout: entrega à esquerda, resumo fixo à direita ── */
|
||
.carr{display:none;margin-top:18px}
|
||
.checkout{margin-top:14px}
|
||
.checkout #checkoutStatus:empty{display:none}
|
||
.carr.on{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:18px;align-items:start}
|
||
@media(max-width:900px){.carr.on{grid-template-columns:1fr}}
|
||
.carr h3{font-family:"Inter",sans-serif;font-size:19px;font-weight:700;margin-bottom:12px}
|
||
.cxE{background:#fff;border:1px solid var(--linha);border-radius:12px;
|
||
box-shadow:var(--sombra);padding:17px 18px;margin-bottom:14px}
|
||
.cxE h4{font-family:"Inter",sans-serif;font-size:15px;font-weight:700;margin-bottom:11px}
|
||
|
||
/* itens do pedido */
|
||
.item{display:flex;gap:11px;align-items:flex-start;padding:11px 0;border-top:1px solid var(--linha)}
|
||
.item:first-child{border-top:0;padding-top:2px}
|
||
.item .nm2{flex:1;min-width:0}
|
||
.item .nm2 b{display:block;font-family:"Inter",sans-serif;font-size:13.5px;color:var(--tx)}
|
||
.item .nm2 span{font-size:11.5px;color:var(--fraco)}
|
||
.item .vl2{font-family:"Inter",sans-serif;font-weight:700;font-size:14px;color:var(--tx);
|
||
white-space:nowrap}
|
||
.item .x{border:0;background:none;color:var(--gray-2);cursor:pointer;font-size:17px;
|
||
line-height:1;padding:0 0 0 4px}
|
||
.item .x:hover{color:var(--vermelho)}
|
||
.rot{font-family:"Inter",sans-serif;font-size:10px;font-weight:700;letter-spacing:.12em;
|
||
text-transform:uppercase;color:var(--fraco);margin:0 0 7px}
|
||
.carr .l{display:flex;justify-content:space-between;font-size:12.5px;padding:5px 0;
|
||
color:var(--fraco);gap:14px}
|
||
.carr .l b{color:var(--tx);font-family:"Inter",sans-serif;font-weight:700;white-space:nowrap}
|
||
|
||
/* identificação do cliente */
|
||
.subC{font-size:11.5px;color:var(--fraco);line-height:1.5;margin:-4px 0 12px}
|
||
.campos{display:grid;grid-template-columns:1fr 1fr;gap:11px}
|
||
@media(max-width:620px){.campos{grid-template-columns:1fr}}
|
||
.cp.larga{grid-column:1/-1}
|
||
.cp label{display:block;font-size:10.5px;color:var(--fraco);margin-bottom:5px}
|
||
.cp input{width:100%;padding:11px 12px;border-radius:8px;border:1px solid var(--linha);
|
||
background:#fff;font-family:inherit;font-size:13.5px;color:var(--tx)}
|
||
.cp input:focus{outline:none;border-color:var(--laranja)}
|
||
.cp input.ruim{border-color:var(--vermelho);background:#FFF6F4}
|
||
.cp input.bom{border-color:var(--verde-ml)}
|
||
.cp .err{display:block;font-size:10.5px;color:var(--vermelho);margin-top:4px;min-height:13px}
|
||
|
||
/* forma de entrega, como no checkout do marketplace */
|
||
.entrega{display:grid;gap:9px}
|
||
.opE{display:flex;gap:11px;align-items:flex-start;text-align:left;width:100%;
|
||
background:#fff;border:1px solid var(--linha);border-radius:10px;padding:13px 14px;
|
||
cursor:pointer;font-family:inherit;color:var(--tx);transition:var(--transition)}
|
||
.opE:hover{border-color:var(--gray-3)}
|
||
.opE.on{border-color:var(--verde-ml);background:#F4FCF7;box-shadow:0 0 0 1px var(--verde-ml)}
|
||
.opE .mk{flex:none;width:17px;height:17px;border-radius:50%;margin-top:2px;
|
||
border:2px solid var(--gray-2);background:#fff}
|
||
.opE.on .mk{border-color:var(--verde-ml);
|
||
background:radial-gradient(circle,var(--verde-ml) 0 4px,#fff 5px)}
|
||
.opE div{flex:1;min-width:0}
|
||
.opE b{display:block;font-family:"Inter",sans-serif;font-size:13.5px;margin-bottom:2px}
|
||
.opE span{font-size:11.5px;color:var(--fraco);line-height:1.5}
|
||
.opE em{flex:none;font-style:normal;font-family:"Inter",sans-serif;font-weight:700;
|
||
font-size:13px;color:var(--verde-ml);white-space:nowrap}
|
||
.cep{display:none;margin-top:10px;padding:12px;background:var(--cinza);border-radius:9px}
|
||
.cep.on{display:block}
|
||
.cep label{display:block;font-size:10.5px;color:var(--fraco);margin-bottom:6px}
|
||
.cepL{display:flex;gap:8px}
|
||
.cepL input{flex:1;min-width:0;padding:10px 12px;border-radius:8px;background:#fff;
|
||
border:1px solid var(--linha);font-family:inherit;font-size:13px;color:var(--tx)}
|
||
.cepL input:focus{outline:none;border-color:var(--laranja)}
|
||
.cepL button{flex:none;width:auto;padding:10px 18px;border-radius:8px;
|
||
border:1px solid var(--linha);cursor:pointer;background:#fff;color:var(--tx);
|
||
font-family:"Inter",sans-serif;font-weight:600;font-size:12.5px}
|
||
.cepL button:hover{border-color:var(--laranja);color:var(--laranja)}
|
||
.cep p{font-size:11.5px;color:var(--fraco);margin-top:9px;line-height:1.5}
|
||
.cep .endereco{margin-top:12px}
|
||
.cep .err{color:var(--vermelho)}
|
||
.avisoE:empty{display:none}
|
||
.avisoE{font-size:11.5px;color:#1F5C3A;background:#F1FBF5;border:1px solid #BFE6CE;
|
||
border-radius:8px;padding:10px 12px;line-height:1.5;margin-top:9px}
|
||
|
||
/* resumo da compra */
|
||
.resumo{position:sticky;top:104px;background:#fff;border:1px solid var(--linha);
|
||
border-radius:12px;box-shadow:var(--sombra);padding:17px 18px}
|
||
@media(max-width:900px){.resumo{position:static}}
|
||
.resumo h4{font-family:"Inter",sans-serif;font-size:16px;font-weight:700;margin-bottom:12px}
|
||
.resumo .l{padding:6px 0}
|
||
.carr .tot{display:flex;justify-content:space-between;align-items:baseline;gap:12px;
|
||
font-family:"Inter",sans-serif;font-size:15px;font-weight:700;padding-top:12px;margin-top:8px;
|
||
border-top:1px solid var(--linha);color:var(--tx)}
|
||
.carr .tot b{font-size:23px;color:var(--tx)}
|
||
.cbts{display:grid;gap:9px;margin-top:14px}
|
||
.cbts button{width:100%;padding:13px;border-radius:9px;border:0;background:var(--laranja);
|
||
color:#241703;font-family:"Inter",sans-serif;font-weight:700;font-size:14.5px;cursor:pointer;
|
||
transition:var(--transition)}
|
||
.cbts button:hover{background:var(--laranja2)}
|
||
.cbts button:disabled{opacity:.4;cursor:not-allowed}
|
||
.cbts .sec{background:#fff;color:var(--tx);border:1px solid var(--linha);font-weight:600}
|
||
.cbts .sec:hover{background:#fff;border-color:var(--laranja);color:var(--laranja)}
|
||
.carr .obs{font-size:11px;color:var(--fraco);margin-top:11px;line-height:1.5}
|
||
|
||
.carro{position:relative;margin-top:22px}
|
||
.trilho{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;
|
||
scroll-behavior:smooth;padding-bottom:6px;-webkit-overflow-scrolling:touch}
|
||
.trilho::-webkit-scrollbar{height:0}
|
||
.slide{flex:0 0 clamp(244px,76%,316px);scroll-snap-align:start;
|
||
background:var(--cinza);border:1px solid var(--linha);border-radius:13px;padding:17px 18px}
|
||
.slide .et2{font-family:"Inter",sans-serif;font-size:9.5px;font-weight:700;letter-spacing:.14em;
|
||
text-transform:uppercase;color:var(--laranja);margin-bottom:8px;display:block}
|
||
.slide h3{font-family:"Inter",sans-serif;font-size:16px;font-weight:700;margin-bottom:6px;line-height:1.18}
|
||
.slide p{font-size:12.5px;color:var(--fraco);line-height:1.5}
|
||
/* selo circular · o benefício em número, com os anéis da marca em volta */
|
||
.slide{position:relative;overflow:hidden}
|
||
.stop{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
|
||
.sinfo{min-width:0;flex:1}
|
||
.selo{flex:none;position:relative;width:74px;height:74px;border-radius:50%;
|
||
display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
|
||
background:#fff;border:2px solid var(--verde-ml);margin:2px 4px 0 0}
|
||
.selo i{position:absolute;inset:-6px;border-radius:50%;border:1px solid rgba(0,166,80,.34)}
|
||
.selo::before,.selo::after{content:"";position:absolute;border-radius:50%;pointer-events:none}
|
||
.selo::before{inset:-13px;border:1px solid rgba(0,166,80,.18)}
|
||
.selo::after{inset:-21px;border:1px solid rgba(0,166,80,.09)}
|
||
.selo b{font-family:"Inter",sans-serif;font-weight:700;font-size:19px;line-height:1;
|
||
color:var(--verde-ml);letter-spacing:-.01em}
|
||
.selo b em{font-style:normal;font-size:11px;margin-left:1px}
|
||
.selo span{font-family:"Inter",sans-serif;font-weight:700;font-size:8px;line-height:1.2;
|
||
letter-spacing:.07em;text-transform:uppercase;color:var(--fraco);margin-top:4px;padding:0 5px}
|
||
.slide .num{font-family:"Inter",sans-serif;font-weight:700;font-size:26px;
|
||
color:var(--laranja);line-height:1;margin-bottom:6px}
|
||
.slide ul{list-style:none;font-size:12px;margin-top:9px}
|
||
.slide li{padding:4px 0 4px 19px;position:relative;color:var(--fraco)}
|
||
.slide li::before{content:"✓";position:absolute;left:2px;color:var(--verde);font-size:11px}
|
||
.slide li.no::before{content:"!";color:var(--laranja);font-weight:700}
|
||
.slide table{width:100%;font-size:12px;margin-top:9px;border-collapse:collapse}
|
||
.slide td{padding:5px 0;border-bottom:1px solid #E3E3E3;color:var(--fraco)}
|
||
.slide td+td{text-align:right;font-family:"Inter",sans-serif;font-weight:700;color:var(--tx)}
|
||
.slide td.cab{font-family:"Inter",sans-serif;font-size:9.5px;font-weight:700;letter-spacing:.1em;
|
||
text-transform:uppercase;color:var(--fraco)}
|
||
.slide tr:last-child td{border:0}
|
||
.slide .dest{background:#fff;border-radius:8px;padding:9px 11px;margin-top:9px;
|
||
font-size:11.5px;color:var(--tx)}
|
||
.navc{display:flex;gap:8px;align-items:center;margin-top:14px}
|
||
.navc button{width:32px;height:32px;border-radius:50%;border:1px solid var(--linha);
|
||
background:#fff;color:var(--tx);cursor:pointer;font-size:15px;line-height:1}
|
||
.navc button:hover{border-color:var(--laranja);color:var(--laranja)}
|
||
.pontos{display:flex;gap:5px;margin-left:auto}
|
||
.pt{width:20px;height:3px;border-radius:2px;background:var(--linha);border:0;padding:0;cursor:pointer}
|
||
.pt.on{background:var(--laranja)}
|
||
@media(prefers-reduced-motion:reduce){.trilho{scroll-behavior:auto}}
|
||
|
||
h2{font-size:clamp(23px,3.6vw,34px);font-weight:700;max-width:20ch}
|
||
h2 em{font-style:normal;color:var(--laranja)}
|
||
.et{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--laranja);
|
||
font-family:"Inter",sans-serif;font-weight:700;margin-bottom:10px}
|
||
.lead{color:var(--fraco);font-size:15px;max-width:56ch;margin-top:12px}
|
||
.dor{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:13px;margin-top:24px}
|
||
.dc{background:#fff;border:1px solid var(--linha);border-radius:12px;padding:18px 19px}
|
||
.dc .ic{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;
|
||
font-family:"Inter",sans-serif;font-weight:700;font-size:14px;margin-bottom:11px;
|
||
background:#FBEEEA;color:var(--vermelho)}
|
||
.dc h3{font-size:15px;font-weight:700;margin-bottom:4px}
|
||
.dc p{font-size:12.5px;color:var(--fraco)}
|
||
.nota{background:var(--cinza);border-radius:11px;padding:14px 18px;margin-top:15px;font-size:13px;color:var(--fraco)}
|
||
.nota b{color:var(--tx);font-family:"Inter",sans-serif}
|
||
|
||
footer{background:#000;color:#8D9AB0;padding:26px 0 20px;font-size:12.5px}
|
||
.frow{display:flex;gap:26px;align-items:flex-start;flex-wrap:wrap;padding-bottom:18px}
|
||
.fmarca{display:flex;align-items:center;gap:9px;font-family:"Inter",sans-serif;
|
||
font-weight:700;font-size:13px;color:var(--laranja);letter-spacing:.06em;white-space:nowrap}
|
||
.fmarca img{height:22px;width:auto;display:block;filter:brightness(0) invert(1)}
|
||
footer a{color:#8D9AB0;text-decoration:none}
|
||
footer a:hover{color:var(--laranja2)}
|
||
.flinks{display:flex;gap:18px;flex-wrap:wrap;font-size:12.5px}
|
||
.fcont{margin-left:auto;text-align:right;font-size:12.5px;line-height:1.7}
|
||
@media(max-width:720px){.fcont{margin-left:0;text-align:left}}
|
||
.fbase{border-top:1px solid rgba(255,255,255,.1);padding-top:14px;display:flex;
|
||
justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:11px;color:#5A6570}
|
||
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto}}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
|
||
<div class="tarja">
|
||
ENVIE SEU ARQUIVO DTF PELO SITE · DTF TÊXTIL COM O MENOR PREÇO DO METRO EM FRANCA-SP
|
||
</div>
|
||
|
||
<header class="topo"><div class="w">
|
||
<a class="logo" href="https://www.dropstaratacado.com.br" aria-label="Dropstar Atacado"><img src="https://cdn.vnda.com.br/dropstar/2025/12/17/logo-header-15125700-16129080.png?v=1766009286" alt="Dropstar"></a>
|
||
<div class="busca">
|
||
<span class="lupa">⌕</span>
|
||
<input type="search" placeholder="Buscar" aria-label="Buscar">
|
||
</div>
|
||
<div class="acts">
|
||
<a href="/portal.html">Minha conta</a>
|
||
<a href="#carr" id="cartLink">Carrinho (0)</a>
|
||
</div>
|
||
</div></header>
|
||
|
||
<nav class="menu"><div class="w">
|
||
<div class="mi">
|
||
<a href="https://www.dropstaratacado.com.br/camiseta" target="_blank" rel="noopener">Vestuários</a>
|
||
<div class="sub">
|
||
<a href="https://www.dropstaratacado.com.br/camiseta/modelo-blcs" target="_blank" rel="noopener">Camiseta Premium</a>
|
||
<a href="https://www.dropstaratacado.com.br/camiseta/modelo-blos" target="_blank" rel="noopener">Camiseta Oversized</a>
|
||
<a href="https://www.dropstaratacado.com.br/moletom-canguru/modelo-blmc" target="_blank" rel="noopener">Moletom Canguru</a>
|
||
<a href="https://www.dropstaratacado.com.br/camiseta/modelo-blmp" target="_blank" rel="noopener">Camiseta Pima</a>
|
||
<a href="https://www.dropstaratacado.com.br/camiseta/modelo-blcp" target="_blank" rel="noopener">Camiseta Poliamida</a>
|
||
<a href="https://www.dropstaratacado.com.br/camiseta/modelo-blcd" target="_blank" rel="noopener">Camiseta Dry Fit</a>
|
||
<a href="https://www.dropstaratacado.com.br/camiseta/modelo-blci" target="_blank" rel="noopener">Camiseta Infantil</a>
|
||
<a href="https://www.dropstaratacado.com.br/camiseta/modelo-blrm" target="_blank" rel="noopener">Regata Machão</a>
|
||
<a href="https://www.dropstaratacado.com.br/camiseta/modelo-blgp" target="_blank" rel="noopener">Camisa Polo</a>
|
||
<a href="https://www.dropstaratacado.com.br/modelo-blmi" target="_blank" rel="noopener">Moletom Canguru Infantil</a>
|
||
</div>
|
||
</div>
|
||
<div class="mi on">
|
||
<a href="#envio">Impressão DTF</a>
|
||
<div class="sub">
|
||
<a href="#envio">DTF Têxtil · 57 cm</a>
|
||
<a href="#envio">DTF UV · 28,5 cm</a>
|
||
</div>
|
||
</div>
|
||
<div class="mi">
|
||
<a href="https://www.dropstaratacado.com.br/modelo-emb" target="_blank" rel="noopener">Embalagens</a>
|
||
<div class="sub">
|
||
<a href="https://www.dropstaratacado.com.br/modelo-emb/modelo-sacseg" target="_blank" rel="noopener">Saco de Segurança</a>
|
||
<a href="https://www.dropstaratacado.com.br/modelo-emb/fit-adesiva" target="_blank" rel="noopener">Fita Adesiva</a>
|
||
<a href="https://www.dropstaratacado.com.br/modelo-emb/modelo-etiqtermica" target="_blank" rel="noopener">Etiqueta Térmica</a>
|
||
</div>
|
||
</div>
|
||
<div class="mi">
|
||
<a href="https://www.dropstaratacado.com.br/modelo-acessorios" target="_blank" rel="noopener">Acessórios</a>
|
||
<div class="sub">
|
||
<a href="https://www.dropstaratacado.com.br/modelo-acessorios/modelo-bon" target="_blank" rel="noopener">Boné Trucker</a>
|
||
<a href="https://www.dropstaratacado.com.br/chinelo-tradicional-unissex" target="_blank" rel="noopener">Chinelo Tradicional Unissex</a>
|
||
</div>
|
||
</div>
|
||
<div class="mi">
|
||
<a href="https://www.dropstaratacado.com.br/insumos" target="_blank" rel="noopener">Insumos</a>
|
||
<div class="sub">
|
||
<a href="https://www.dropstaratacado.com.br/filme-dtf" target="_blank" rel="noopener">Filme DTF</a>
|
||
<a href="https://www.dropstaratacado.com.br/poliamida-dtf" target="_blank" rel="noopener">Poliamida DTF</a>
|
||
<a href="https://www.dropstaratacado.com.br/tinta-dtf" target="_blank" rel="noopener">Tinta DTF</a>
|
||
<a href="https://www.dropstaratacado.com.br/fluido-limpeza" target="_blank" rel="noopener">Fluído Limpeza</a>
|
||
<a href="https://www.dropstaratacado.com.br/primer-limpeza" target="_blank" rel="noopener">Primer Limpeza</a>
|
||
</div>
|
||
</div>
|
||
<div class="mi">
|
||
<a href="https://www.dropstaratacado.com.br/produto/personalizacao-premium-sua-estampa-aqui-envie-a-estampa-16-99230-2546-59" target="_blank" rel="noopener">Personalizados</a>
|
||
</div>
|
||
</div></nav>
|
||
|
||
<header class="hero">
|
||
<div class="fundo" aria-hidden="true">
|
||
<svg viewBox="0 0 1400 300" preserveAspectRatio="xMidYMid slice">
|
||
<g fill="#fff">
|
||
<rect x="20" y="16" width="118" height="140" rx="5"/>
|
||
<rect x="150" y="16" width="118" height="140" rx="5"/>
|
||
<rect x="280" y="16" width="76" height="66" rx="5"/>
|
||
<rect x="368" y="16" width="76" height="66" rx="5"/>
|
||
<rect x="280" y="94" width="164" height="62" rx="5"/>
|
||
<rect x="456" y="16" width="96" height="96" rx="5"/>
|
||
<rect x="564" y="16" width="96" height="96" rx="5"/>
|
||
<rect x="456" y="124" width="204" height="32" rx="5"/>
|
||
<rect x="672" y="16" width="118" height="140" rx="5"/>
|
||
<rect x="802" y="16" width="112" height="66" rx="5"/>
|
||
<rect x="802" y="94" width="112" height="62" rx="5"/>
|
||
<rect x="926" y="16" width="150" height="140" rx="5"/>
|
||
<rect x="1088" y="16" width="86" height="86" rx="5"/>
|
||
<rect x="1186" y="16" width="86" height="86" rx="5"/>
|
||
<rect x="1088" y="114" width="184" height="42" rx="5"/>
|
||
<rect x="1284" y="16" width="96" height="140" rx="5"/>
|
||
<rect x="20" y="168" width="76" height="76" rx="5"/>
|
||
<rect x="108" y="168" width="76" height="76" rx="5"/>
|
||
<rect x="196" y="168" width="76" height="76" rx="5"/>
|
||
<rect x="284" y="168" width="160" height="76" rx="5"/>
|
||
<rect x="456" y="168" width="104" height="118" rx="5"/>
|
||
<rect x="572" y="168" width="104" height="118" rx="5"/>
|
||
<rect x="688" y="168" width="226" height="54" rx="5"/>
|
||
<rect x="688" y="234" width="108" height="52" rx="5"/>
|
||
<rect x="808" y="234" width="106" height="52" rx="5"/>
|
||
<rect x="926" y="168" width="150" height="118" rx="5"/>
|
||
<rect x="1088" y="168" width="184" height="56" rx="5"/>
|
||
<rect x="1088" y="236" width="86" height="50" rx="5"/>
|
||
<rect x="1186" y="236" width="86" height="50" rx="5"/>
|
||
<rect x="1284" y="168" width="96" height="118" rx="5"/>
|
||
<rect x="20" y="256" width="424" height="30" rx="5"/>
|
||
</g>
|
||
</svg>
|
||
</div>
|
||
|
||
<div class="w">
|
||
<div class="hgrid">
|
||
<div>
|
||
<div class="selos1">
|
||
<span class="sel top">Metro a partir de R$ 14,90</span>
|
||
<span class="sel novo">Revisão inclusa</span>
|
||
<span class="sel pos">Franca · SP</span>
|
||
</div>
|
||
<h1>A gente encaixa sua folha<br><em>e você paga menos metro</em></h1>
|
||
<p class="sub2">Mande a arte, veja a nota em segundos e a folha montada antes de fechar.
|
||
<b>Revisão e remanejamento por nossa conta.</b></p>
|
||
<div class="hcta">
|
||
<a href="#envio" class="btn1">Enviar minha arte</a>
|
||
<span class="mini">sem cadastro · resposta em segundos</span>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="pfaixa">
|
||
<a class="pcard dest" href="#envio">
|
||
<span class="marc">mais vendido</span>
|
||
<span class="apartir">com arte boa</span>
|
||
<span class="vl">R$ 14,90<small> /m</small></span>
|
||
<span class="nm">Arquivo por metro</span>
|
||
<span class="dsc">têxtil · 57 cm</span>
|
||
</a>
|
||
<a class="pcard" href="#envio">
|
||
<span class="apartir">com arte boa</span>
|
||
<span class="vl">R$ 24,90<small> /m</small></span>
|
||
<span class="nm">Artes avulsas</span>
|
||
<span class="dsc">têxtil · montamos a folha</span>
|
||
</a>
|
||
<a class="pcard" href="#envio">
|
||
<span class="apartir">com arte boa</span>
|
||
<span class="vl">R$ 69,90<small> /m</small></span>
|
||
<span class="nm">Arquivo UV</span>
|
||
<span class="dsc">rígido · 28,5 cm</span>
|
||
</a>
|
||
<a class="pcard" href="#envio">
|
||
<span class="apartir">com arte boa</span>
|
||
<span class="vl">R$ 83,90<small> /m</small></span>
|
||
<span class="nm">Artes avulsas UV</span>
|
||
<span class="dsc">rígido · montamos a folha</span>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="barrah">
|
||
<span><i>◆</i> Revisão de <b>5 pontos</b> sem custo</span>
|
||
<span><i>◆</i> Cobrança por <b>proporção</b>, a cada 10 cm</span>
|
||
<span><i>◆</i> Filme de <b>57 cm</b>, o dobro do padrão</span>
|
||
<span><i>◆</i> Prévia da folha <b>antes de pagar</b></span>
|
||
</div>
|
||
</div>
|
||
</header>
|
||
|
||
|
||
<!-- PROVA -->
|
||
<section class="prova"><div class="w">
|
||
<div class="p1"><b>Quanto melhor sua arte,<br><em>menor o preço do metro</em></b>
|
||
<span>Têxtil de R$ 19,90 a R$ 14,90 · UV de R$ 99,90 a R$ 69,90.
|
||
A nota aparece na tela antes de você pagar.</span></div>
|
||
<div class="p1"><b>Filme de 57 cm,<br><em>o dobro do padrão</em></b>
|
||
<span>Cabe o dobro de arte por metro. E reencaixamos sua folha sem cobrar.</span></div>
|
||
<div class="p1"><b>Você paga só<br><em>o que usa</em></b>
|
||
<span>Cobrança a cada 10 cm. Folha de 2,75 m custa 2,80 — não 3.</span></div>
|
||
<div class="p1"><b>Erro pego<br><em>antes de imprimir</em></b>
|
||
<span>5 pontos conferidos e a nota na tela. Sem custo.</span></div>
|
||
<div class="p1"><b>Envio em<br><em>até 24 horas</em></b>
|
||
<span>E avisamos por WhatsApp a cada etapa do pedido.</span></div>
|
||
</div></section>
|
||
|
||
<!-- ENVIO -->
|
||
<section id="envio"><div class="w">
|
||
|
||
<!-- 3 cards -->
|
||
<div id="cards">
|
||
<div class="et">Comece por aqui</div>
|
||
<h2>Qual é o seu <em>caso</em>?</h2>
|
||
<div class="escolha">
|
||
<button class="ec f" data-modo="file">
|
||
<span class="marc">Mais vendido</span>
|
||
<div class="top"><h3>Arquivo por metro</h3>
|
||
<span class="p"><i>tabela</i>R$ 19,90<small>/m</small></span></div>
|
||
<div class="chama2">Quer pagar <b>R$ 14,90</b>? Arte em 300 DPI, em arquivo que a gente confere.</div>
|
||
<div class="in">
|
||
<span class="lg">DTF têxtil · 57 cm</span>
|
||
<p>Você monta a folha e manda pronta. Revisamos, corrigimos e reencaixamos.</p>
|
||
<ul><li>Remanejamos e sua folha encolhe</li><li>Arquivo bom paga o mínimo</li>
|
||
<li>Você continua no controle do layout</li></ul>
|
||
<span class="go">Enviar minha folha ›</span>
|
||
</div>
|
||
</button>
|
||
|
||
<button class="ec a" data-modo="avulsa">
|
||
<div class="top"><h3>Artes avulsas</h3><span class="p"><i>tabela</i>R$ 29,90<small>/m</small></span></div>
|
||
<div class="chama2">Quer pagar <b>R$ 24,90</b>? Arte em 300 DPI, em arquivo que a gente confere.</div>
|
||
<div class="in">
|
||
<span class="lg">DTF têxtil · 57 cm</span>
|
||
<p>Cada arte num arquivo. Montamos a folha com o melhor encaixe.</p>
|
||
<ul><li>Sugerimos a largura que rende mais</li><li>Sobreposição não acontece</li>
|
||
<li>Montagem inclusa · R$ 10,00 no metro</li></ul>
|
||
<span class="go">Enviar minhas artes ›</span>
|
||
</div>
|
||
</button>
|
||
|
||
<button class="ec u" data-modo="uvfile">
|
||
<div class="top"><h3>Arquivo por metro · UV</h3><span class="p"><i>tabela</i>R$ 85,90<small>/m</small></span></div>
|
||
<div class="chama2">Quer pagar <b>R$ 69,90</b>? Arte em 300 DPI, em arquivo que a gente confere.</div>
|
||
<div class="in">
|
||
<span class="lg">Adesivo UV · 28,5 cm</span>
|
||
<p>Sua folha de UV montada. Revisamos, corrigimos e reencaixamos.</p>
|
||
<ul><li>Arquivo bom paga o mínimo</li><li>Remanejamos e sua folha encolhe</li>
|
||
<li>Rígido: caneca, garrafa, case</li></ul>
|
||
<span class="go">Enviar minha folha de UV ›</span>
|
||
</div>
|
||
</button>
|
||
|
||
<button class="ec u" data-modo="uv">
|
||
<div class="top"><h3>Artes avulsas · UV</h3><span class="p"><i>tabela</i>R$ 99,90<small>/m</small></span></div>
|
||
<div class="chama2">Quer pagar <b>R$ 83,90</b>? Arte em 300 DPI, em arquivo que a gente confere.</div>
|
||
<div class="in">
|
||
<span class="lg">Adesivo UV · 28,5 cm</span>
|
||
<p>Cada arte num arquivo. Montamos a folha de UV com o melhor encaixe.</p>
|
||
<ul><li>Sugerimos a largura que rende mais</li><li>Montagem inclusa</li>
|
||
<li>Não precisa de prensa</li></ul>
|
||
<span class="go">Enviar minhas artes de UV ›</span>
|
||
</div>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- painel focado -->
|
||
<div class="foco" id="foco">
|
||
<button class="voltar" id="bVoltar"><span>‹</span>Trocar de produto</button>
|
||
<div class="focoGrid">
|
||
<div class="cat" id="catFoco">
|
||
<div class="cabfoco" style="padding:20px 22px 14px;margin:0">
|
||
<div><h3 id="fTit">—</h3><span class="lg" id="fLg" style="display:block"></span></div>
|
||
<span class="pr2" id="fPreco"></span>
|
||
<p id="fSub"></p>
|
||
</div>
|
||
<div class="in" style="padding:0 22px 22px">
|
||
<div class="foco2" id="foco2">
|
||
<div class="fila">
|
||
<div class="trocouCam" id="trocouCam" style="display:none"></div>
|
||
<div class="caminhos" id="tipoEnvio" hidden>
|
||
<button type="button" class="cam on" data-tipo="folha">
|
||
<span class="mk2"></span>
|
||
<div><b>Já é uma folha montada</b>
|
||
<span>a imagem ocupa a largura inteira do filme de
|
||
<span id="larguraFolhaPronta">57</span> cm</span>
|
||
<em id="tipoFolhaPreco">—</em></div>
|
||
</button>
|
||
<button type="button" class="cam" data-tipo="avulsa">
|
||
<span class="mk2"></span>
|
||
<div><b>São artes separadas</b>
|
||
<span>você informa a largura de cada uma e nós montamos a folha</span>
|
||
<em id="tipoAvulsaPreco">—</em></div>
|
||
</button>
|
||
</div>
|
||
<div class="trocouCam" id="avisoTipo" style="display:none"></div>
|
||
<div class="caminhos" id="caminhos">
|
||
<button class="cam on" data-cam="auto">
|
||
<span class="mk2"></span>
|
||
<div><b>PNG, JPG ou PDF</b>
|
||
<span>Conferimos sozinhos e a nota desconta no metro</span>
|
||
<em id="camA">—</em></div>
|
||
</button>
|
||
<button class="cam" data-cam="tabela">
|
||
<span class="mk2"></span>
|
||
<div><b>CDR, AI, PSD ou TIFF</b>
|
||
<span>Ninguém consegue conferir · alguém abre na mão</span>
|
||
<em id="camB" class="cheio">—</em></div>
|
||
</button>
|
||
</div>
|
||
<div class="zona" id="zona" tabindex="0" role="button">
|
||
<div class="ico">↑</div>
|
||
<b id="zTit">Arraste aqui</b><span id="zSub"></span>
|
||
<span id="zLimite">Até 128 MB por arquivo enquanto a verificação de segurança para arquivos grandes é preparada.</span>
|
||
<span class="bt">ou escolher no computador</span>
|
||
</div>
|
||
<div class="recusa" id="recusa" style="display:none"></div>
|
||
<div id="lista"></div>
|
||
<div class="resumoA" id="rA" style="display:none"></div>
|
||
<input type="file" id="inp" hidden>
|
||
<div class="aoVivo" id="aoVivo"></div>
|
||
</div>
|
||
<aside class="mont" id="mont">
|
||
<div class="montcab"><b id="montcabTit">Montagem ao vivo</b>
|
||
<div class="zoomB"><button id="zMenos" title="Diminuir">−</button>
|
||
<span id="zTxt">100%</span>
|
||
<button id="zMais" title="Aumentar">+</button></div>
|
||
<span id="vMt">—</span></div>
|
||
<div id="vArea"></div>
|
||
<div id="vUso"></div>
|
||
<p class="montpe">Prévia aproximada. No servidor o encaixe é refeito do zero —
|
||
o resultado sai igual ou melhor, nunca pior.</p>
|
||
|
||
</aside>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<aside class="req" id="req">
|
||
<h3 class="reqcab">O que devo saber<br>sobre a arte</h3>
|
||
|
||
<details open>
|
||
<summary>Como pagar o menor metro</summary>
|
||
<ul>
|
||
<li class="s"><b>300 DPI no tamanho que vai imprimir.</b> É a nota máxima
|
||
e o menor preço da tabela</li>
|
||
<li class="s"><b>O tamanho manda mais que o arquivo.</b> A mesma arte passa
|
||
em 20 cm e não passa em 40. Reduzir um pouco costuma pular uma faixa
|
||
de preço inteira</li>
|
||
<li class="s"><b>Larguras parecidas rendem mais.</b> Se as suas artes têm
|
||
medidas próximas, cabem mais por fileira e a folha encolhe</li>
|
||
</ul>
|
||
<p class="obs2">Resolução é a única coisa que mexe no preço — porque é a
|
||
única que a gente não consegue melhorar por você.</p>
|
||
</details>
|
||
|
||
<details>
|
||
<summary>O que arrumamos sem cobrar</summary>
|
||
<ul>
|
||
<li class="s"><b>Artes coladas.</b> Separamos com 5 mm, sem você refazer nada</li>
|
||
<li class="s"><b>Encaixe mal aproveitado.</b> Remanejamos e a sua folha
|
||
encolhe — você paga menos metro do que enviou</li>
|
||
<li class="s"><b>Peça passando da largura.</b> Remanejamos em vez de cortar</li>
|
||
<li class="s"><b>Margem.</b> Não precisa deixar. Só respeitar a largura do filme</li>
|
||
</ul>
|
||
</details>
|
||
|
||
<details>
|
||
<summary>Manda em PNG e sai na hora</summary>
|
||
<ul>
|
||
<li class="s"><b>PNG ou JPG</b> com fundo transparente entram direto, sem passar
|
||
por ninguém, e não têm limite de comprimento. Só que a gente lê a resolução
|
||
<b>do arquivo</b>: se a arte foi ampliada antes de exportar, isso não aparece
|
||
para nós — e sai serrilhado no filme do mesmo jeito</li>
|
||
<li class="s"><b>PDF é o que conferimos melhor.</b> Nele medimos a resolução de
|
||
cada imagem dentro da folha, uma por uma. Se a sua arte é boa, é onde a nota
|
||
aparece com mais precisão</li>
|
||
<li class="a"><b>PDF grande.</b> Sem UserUnit, a página passa do limite de 508 cm
|
||
do formato; divida a folha ou mande PNG. Envie um PDF de uma página por folha.</li>
|
||
<li class="a"><b>TIFF, PSD, AI e CDR</b> a gente aceita, mas ninguém consegue
|
||
conferir sozinho: alguém abre na mão, sai mais devagar e o metro vai pela
|
||
tabela, sem desconto de nota</li>
|
||
<li class="a">Em <b>artes avulsas</b> só PNG e JPG: a montagem precisa
|
||
enxergar a sua arte para encaixar pela forma</li>
|
||
</ul>
|
||
</details>
|
||
|
||
<details>
|
||
<summary>O que só você resolve</summary>
|
||
<ul>
|
||
<li class="n"><b>Fundo branco ou colorido.</b> Precisa ser transparente de
|
||
verdade — branco parecendo transparente sai branco no filme</li>
|
||
<li class="n"><b>Pontinho de recorte.</b> A impressora enxerga qualquer
|
||
resíduo e imprime. Não existe pequeno demais</li>
|
||
<li class="n"><b>Cópias sobrepostas.</b> Duas iguais com 1 mm de diferença
|
||
saem duplicadas</li>
|
||
<li class="n"><b>Menos de 96 DPI.</b> Abaixo disso não imprimimos: sai
|
||
serrilhado a ponto de não valer o filme</li>
|
||
<li class="n"><b>Degradê de transparência</b>, comum em arte de IA. O branco
|
||
por baixo sai irregular e sai assim mesmo</li>
|
||
</ul>
|
||
</details>
|
||
</aside>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- nota -->
|
||
<div class="qual" id="qual">
|
||
<div class="qh">
|
||
<div><h3 id="qNome">sua folha</h3>
|
||
<span style="font-size:12px;color:var(--fraco)" id="qSub"></span></div>
|
||
<div style="text-align:right"><div class="pct" id="pct">—</div>
|
||
<span style="font-size:11px;color:var(--fraco)">qualidade</span></div>
|
||
</div>
|
||
<div class="qbar"><i id="qbi" style="width:0%"></i></div>
|
||
<div class="qitens" id="qitens"></div>
|
||
<div class="ciente" id="ciente">
|
||
<h4 id="cienteTit">Ressalva de resolução</h4>
|
||
<div id="cienteTxt"></div>
|
||
<label><input type="checkbox" id="cienteOk">
|
||
<span>Li e entendi. Quero imprimir assim mesmo.</span></label>
|
||
</div>
|
||
<div class="qbts">
|
||
<button class="qb chama" id="qOk">Seguir para o pedido</button>
|
||
</div>
|
||
<div id="qmsg" style="margin-top:12px;font-size:12.5px;display:none"></div>
|
||
</div>
|
||
|
||
<!-- prévia da montagem -->
|
||
<div class="prev" id="prev">
|
||
<div class="ph">
|
||
<div><h3>Como sua folha vai sair</h3>
|
||
<p id="pSub">confira antes de fechar o pedido</p></div>
|
||
<div style="text-align:right">
|
||
<div class="mt" id="pMt">—</div>
|
||
<span style="font-size:11px;color:var(--fraco)">cobrado por proporção</span></div>
|
||
</div>
|
||
<div class="pgrid">
|
||
<div class="pfolha"><div id="pArea"></div></div>
|
||
<div class="pinfo" id="pInfo"></div>
|
||
</div>
|
||
<div class="pcta">
|
||
<button class="pb p" id="pOk">Está certo, fechar o pedido</button>
|
||
<button class="pb" id="pMais">Adicionar mais artes</button>
|
||
<button class="pb" id="pVolta">Trocar o arquivo</button>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- carrinho -->
|
||
<div class="carr" id="carr">
|
||
|
||
<div>
|
||
<h3>Seu pedido</h3>
|
||
|
||
<div class="cxE">
|
||
<h4>Itens</h4>
|
||
<div id="itens"></div>
|
||
<div id="atual">
|
||
<div class="rot" style="margin-top:12px">Item que você está montando</div>
|
||
<div id="carrLin"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="cxE">
|
||
<h4>Seus dados</h4>
|
||
<p class="subC">A conta nasce aqui, no pagamento. O CNPJ é o mesmo da nota fiscal,
|
||
e é por ele que suas artes ficam guardadas para o próximo pedido.</p>
|
||
<div class="campos">
|
||
<div class="cp"><label>CNPJ</label>
|
||
<input id="fCnpj" inputmode="numeric" maxlength="18" placeholder="00.000.000/0000-00">
|
||
<span class="err" id="eCnpj"></span></div>
|
||
<div class="cp"><label>WhatsApp</label>
|
||
<input id="fZap" inputmode="numeric" maxlength="15" placeholder="(16) 99999-9999">
|
||
<span class="err" id="eZap"></span></div>
|
||
<div class="cp larga"><label>E-mail para a nota</label>
|
||
<input id="fMail" type="email" placeholder="voce@empresa.com.br">
|
||
<span class="err" id="eMail"></span></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="cxE">
|
||
<h4>Forma de entrega</h4>
|
||
<div class="entrega" id="entrega">
|
||
<button class="opE on" data-ent="retira">
|
||
<span class="mk"></span>
|
||
<div>
|
||
<b>Retirar em Franca</b>
|
||
<span>Av. Major Elias Motta, 1281 · Jardim São Luís<br>
|
||
Segunda a sexta, das 7h às 17h</span>
|
||
</div>
|
||
<em>Grátis</em>
|
||
</button>
|
||
<button class="opE" data-ent="frete">
|
||
<span class="mk"></span>
|
||
<div>
|
||
<b>Receber em casa</b>
|
||
<span>Cotamos com a transportadora pelo seu CEP</span>
|
||
</div>
|
||
<em id="vFrete">—</em>
|
||
</button>
|
||
<div class="cep" id="cep">
|
||
<label>CEP de entrega</label>
|
||
<div class="cepL">
|
||
<input id="cepIn" inputmode="numeric" maxlength="9" placeholder="00000-000">
|
||
<button id="bCep">Calcular</button>
|
||
</div>
|
||
<p id="cepMsg"></p>
|
||
<div class="campos endereco" id="endereco">
|
||
<div class="cp larga"><label>Quem recebe</label>
|
||
<input id="eNome" maxlength="120" autocomplete="name" placeholder="Nome ou empresa"></div>
|
||
<div class="cp larga"><label>Rua / avenida</label>
|
||
<input id="eRua" maxlength="160" autocomplete="address-line1"></div>
|
||
<div class="cp"><label>Número</label>
|
||
<input id="eNum" maxlength="20" placeholder="123 ou S/N"></div>
|
||
<div class="cp"><label>Complemento (opcional)</label>
|
||
<input id="eComp" maxlength="80" autocomplete="address-line2"></div>
|
||
<div class="cp"><label>Bairro</label>
|
||
<input id="eBairro" maxlength="80"></div>
|
||
<div class="cp"><label>Cidade</label>
|
||
<input id="eCidade" maxlength="80" autocomplete="address-level2"></div>
|
||
<div class="cp"><label>UF</label>
|
||
<input id="eUf" maxlength="2" autocomplete="address-level1" placeholder="SP"></div>
|
||
</div>
|
||
<p class="err" id="eEnd"></p>
|
||
</div>
|
||
<p class="avisoE" id="avisoE"></p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<aside class="resumo">
|
||
<h4>Resumo da compra</h4>
|
||
<div id="resLin"></div>
|
||
<div class="tot"><span>Total</span><b id="carrTot">R$ 0,00</b></div>
|
||
<div class="cbts">
|
||
<button id="bPagar">Ir para o pagamento</button>
|
||
<button id="bMais" class="sec">Adicionar outro produto</button>
|
||
</div>
|
||
<p class="obs">A nota fiscal sai no CNPJ informado. O arquivo fica guardado por 30 dias;
|
||
depois disso, um novo pedido precisa do arquivo de novo. O histórico do pedido
|
||
continua disponível na sua conta.</p>
|
||
</aside>
|
||
|
||
</div>
|
||
<!-- Fora de #carr de propósito: o pedido pago esvazia o carrinho, e a
|
||
confirmação não pode sumir junto com o painel. -->
|
||
<div class="checkout">
|
||
<p id="checkoutStatus" class="avisoE" role="status" aria-live="polite"></p>
|
||
<div id="checkoutActions"></div>
|
||
</div>
|
||
</div></section>
|
||
|
||
<!-- INFORMAÇÃO EM CARROSSEL -->
|
||
<section id="info"><div class="w">
|
||
<div class="et">Como funciona</div>
|
||
<h2>Tudo o que você precisa saber, <em>em cinco cartões</em></h2>
|
||
|
||
<div class="carro">
|
||
<div class="trilho" id="trilho">
|
||
|
||
<div class="slide">
|
||
<div class="stop">
|
||
<div class="sinfo"><span class="et2">Preço</span><h3>Arte melhor,<br>metro mais barato</h3></div>
|
||
<div class="selo"><i></i><b>−25<em>%</em></b><span>no metro</span></div>
|
||
</div>
|
||
<p>Vale nos quatro produtos. Preço da folha que você monta:</p>
|
||
<table>
|
||
<tr><td class="cab">nota</td><td class="cab">têxtil</td><td class="cab">UV</td></tr>
|
||
<tr><td>90–100</td><td>R$ 14,90</td><td>R$ 69,90</td></tr>
|
||
<tr><td>75–89</td><td>R$ 16,20</td><td>R$ 73,90</td></tr>
|
||
<tr><td>60–74</td><td>R$ 17,50</td><td>R$ 77,90</td></tr>
|
||
<tr><td>40–59</td><td>R$ 18,70</td><td>R$ 81,90</td></tr>
|
||
<tr><td>abaixo de 40</td><td>R$ 19,90</td><td>R$ 85,90</td></tr>
|
||
</table>
|
||
<div class="dest">Se a montagem for nossa, some <b>R$ 10,00</b> no têxtil e
|
||
<b>R$ 14,00</b> no UV — mesma escada, em qualquer faixa</div>
|
||
</div>
|
||
|
||
<div class="slide">
|
||
<div class="stop">
|
||
<div class="sinfo"><span class="et2">Largura</span><h3>O dobro do<br>filme padrão</h3></div>
|
||
<div class="selo"><i></i><b>57<em>cm</em></b><span>de filme</span></div>
|
||
</div>
|
||
<p>A maioria trabalha com 28,5 cm. Na nossa largura cabe o dobro de arte
|
||
por metro corrido — e o metro sai mais barato por peça.</p>
|
||
<ul>
|
||
<li>Duas artes de 28 cm lado a lado</li>
|
||
<li>Menos emenda, menos corte</li>
|
||
<li>DTF UV também disponível, em 28,5 cm</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<div class="slide">
|
||
<div class="stop">
|
||
<div class="sinfo"><span class="et2">Encaixe</span><h3>Reencaixamos<br>sua folha de graça</h3></div>
|
||
<div class="selo"><i></i><b>grátis</b><span>reencaixe</span></div>
|
||
</div>
|
||
<p>Se a sua montagem deixa espaço sobrando, refazemos o encaixe com o mesmo
|
||
motor que usamos nas nossas montagens.</p>
|
||
<ul>
|
||
<li>Artes que se tocam, separadas com 5 mm</li>
|
||
<li>Giramos as peças para aproveitar a largura</li>
|
||
<li>A folha encolhe e a sua conta diminui</li>
|
||
</ul>
|
||
<div class="dest">Refazemos o encaixe <b>antes de imprimir</b>, sem cobrar nada</div>
|
||
</div>
|
||
|
||
<div class="slide">
|
||
<div class="stop">
|
||
<div class="sinfo"><span class="et2">Cobrança</span><h3>Você paga<br>o que usa</h3></div>
|
||
<div class="selo"><i></i><b>10<em>cm</em></b><span>de cada vez</span></div>
|
||
</div>
|
||
<p>Arredondamos a cada 10 cm. Uma folha de 2,75 m custa 2,80 m — quem cobra
|
||
metro cheio cobraria 3.</p>
|
||
<ul>
|
||
<li>Pedido mínimo de 1 metro</li>
|
||
<li>A identificação do pedido é por nossa conta</li>
|
||
<li>Sem taxa de arquivo, sem taxa de revisão</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<div class="slide">
|
||
<div class="stop">
|
||
<div class="sinfo"><span class="et2">Sem burocracia</span><h3>Conta só na<br>hora de pagar</h3></div>
|
||
<div class="selo"><i></i><b>0</b><span>conta e senha</span></div>
|
||
</div>
|
||
<p>Sobe a arte e vê o preço sem conta nenhuma. A conta nasce no pagamento, junto com o CNPJ da nota — e o próximo pedido já vem com suas artes anteriores. A revisão de 5 pontos vem junto —
|
||
há quem cobre R$ 19,90 por pedido só por isso.</p>
|
||
<ul>
|
||
<li>Sem cadastro para subir e ver o preço</li>
|
||
<li>Envio em até 24 horas</li>
|
||
<li>WhatsApp a cada etapa do pedido</li>
|
||
<li>Arquivo guardado 30 dias · histórico do pedido na conta</li>
|
||
</ul>
|
||
</div>
|
||
|
||
</div>
|
||
<div class="navc">
|
||
<button id="cAnt" aria-label="Anterior">‹</button>
|
||
<button id="cPro" aria-label="Próximo">›</button>
|
||
<div class="pontos" id="cPontos"></div>
|
||
</div>
|
||
</div>
|
||
</div></section>
|
||
|
||
<footer><div class="w">
|
||
<div class="frow">
|
||
<span class="fmarca"><img src="https://cdn.vnda.com.br/dropstar/2025/12/17/logo-header-15125700-16129080.png?v=1766009286" alt="Dropstar">DTF</span>
|
||
<div class="flinks">
|
||
<a href="https://www.dropstaratacado.com.br" target="_blank" rel="noopener">Loja de atacado</a>
|
||
<a href="https://www.dropstaratacado.com.br/p/termos" target="_blank" rel="noopener">Trocas e privacidade</a>
|
||
<a href="https://www.dropstaratacado.com.br/p/atendimento" target="_blank" rel="noopener">Fale conosco</a>
|
||
<a href="https://www.instagram.com/dropstar.ofc/" target="_blank" rel="noopener">Instagram</a>
|
||
</div>
|
||
<div class="fcont">
|
||
<a href="https://wa.me/message/NJ76CLIOUGXLB1" target="_blank" rel="noopener">16 99428-0056</a>
|
||
· arquivos 16 99230-2546<br>
|
||
<a href="mailto:atendimentodropstar@gmail.com">atendimentodropstar@gmail.com</a><br>
|
||
Segunda a sexta, 07h às 17h
|
||
</div>
|
||
</div>
|
||
<div class="fbase">
|
||
<span>© Dropstar Atacado · CNPJ 55.786.635/0001-58 · Franca-SP</span>
|
||
<span>Visa · Master · Elo · Amex · Pix · Boleto</span>
|
||
<span>têxtil 57 cm · UV 28,5 cm</span>
|
||
</div>
|
||
</div></footer>
|
||
|
||
<!-- The Site's behaviour, split by responsibility. Classic scripts on purpose:
|
||
they share one global scope and run in this order, which is exactly how the
|
||
single inline script this replaces behaved. Order is therefore significant. -->
|
||
<script src="/site-config.js"></script>
|
||
<script src="/site-modes.js"></script>
|
||
<script src="/site-upload.js"></script>
|
||
<script src="/site-sheet.js"></script>
|
||
<script src="/site-pdf.js"></script>
|
||
<script src="/site-quality.js"></script>
|
||
<script src="/site-packing.js"></script>
|
||
<script src="/site-cart.js"></script>
|
||
<script src="/site-flow.js"></script>
|
||
<script src="/privacy.js"></script>
|
||
<script src="/upload.js"></script>
|
||
<script src="/checkout.js"></script>
|
||
<script src="/cart.js"></script>
|
||
|
||
</body>
|
||
</html>
|