/* Encaderno · sistema de design "Prova de gráfica" (ver DESIGN.md). Tokens, fontes e componentes base.
   Carregado pela página de venda, pelo painel (conta.html), pela página do cliente (pedido.html) e pela privacidade.
   Fontes (servidas de /fonts, display=swap): Bricolage Grotesque (títulos), Instrument Sans (texto), IBM Plex Mono (registro, números),
   Baloo 2 só na marca. */
/* Fontes servidas pelo próprio site (/fonts, licença SIL OFL em fonts/LICENCAS-OFL.txt), sem depender do Google */
@font-face{font-family:'Bricolage Grotesque';src:url('/fonts/bricolage-grotesque.woff2') format('woff2');font-weight:200 800;font-stretch:100%;font-display:swap}
@font-face{font-family:'Instrument Sans';src:url('/fonts/instrument-sans.woff2') format('woff2');font-weight:400 700;font-style:normal;font-display:swap}
@font-face{font-family:'Instrument Sans';src:url('/fonts/instrument-sans-italic.woff2') format('woff2');font-weight:400 700;font-style:italic;font-display:swap}
@font-face{font-family:'IBM Plex Mono';src:url('/fonts/ibm-plex-mono-400.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'IBM Plex Mono';src:url('/fonts/ibm-plex-mono-500.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'IBM Plex Mono';src:url('/fonts/ibm-plex-mono-600.woff2') format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:'Baloo 2';src:url('/fonts/baloo-2-700.woff2') format('woff2');font-weight:700;font-display:swap}

:root{
  --bg:#fffcf6;--sup:#ffffff;--sup2:#f6f1e7;--sup3:#efe8da;--ink:#1d1b17;--mut:#615b50;--line:#e6dfd1;--line2:#d3c9b5;
  --brand:#0f6b61;--brand-ink:#ffffff;--brand-soft:#dcf2ee;--brand-deep:#0a4d46;--brand-viva:#2ec4b6;--brand-viva2:#1fa294;
  --c:#00a0d6;--m:#e5157a;--y:#f7c600;--k:#1d1b17;            /* barra de cor CMYK: só decoração, nunca texto */
  --ajuste:#b0175f;--ajuste-bg:#fbe3ee;
  --ok:#17703f;--ok-bg:#dff1e6;--warn:#865500;--warn-bg:#fbefd2;--bad:#b3261e;--bad-bg:#f9e0dc;--info:#1f5aa6;--info-bg:#e3ecf8;
  --focus:#1f5aa6;
  --sh1:0 1px 0 rgba(60,45,20,.05),0 1px 2px rgba(60,45,20,.06);
  --sh2:0 1px 0 rgba(60,45,20,.04),0 14px 28px -16px rgba(60,45,20,.30),0 40px 70px -40px rgba(60,45,20,.35);
  --sh-papel:0 1px 1px rgba(60,45,20,.08),0 3px 6px -2px rgba(60,45,20,.10),0 26px 46px -24px rgba(60,45,20,.38);
  --band:#0d2e2a;--band-ink:#eaf6f3;--band-mut:#a9c9c3;
  --f-disp:'Bricolage Grotesque','Instrument Sans',system-ui,sans-serif;--f-txt:'Instrument Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  --f-mono:'IBM Plex Mono',ui-monospace,'SF Mono',Menlo,Consolas,monospace;--f-marca:'Baloo 2','Instrument Sans',system-ui,sans-serif;
  --r1:10px;--r2:16px;--r3:24px;
  color-scheme:light;
  /* nomes do neg.css (portal comum) apontando para os mesmos tokens */
  --fundo:var(--bg);--tinta:var(--ink);--sec:var(--mut);--linha:var(--line);--linha2:var(--line2);--sombra:var(--sh1);
  --n-cor:var(--brand);--n-cor-t:var(--brand-ink);--n-fundo:var(--bg);--n-tinta:var(--ink);--n-linha:var(--line);--n-sec:var(--mut);--n-fonte:var(--f-txt);--n-titulo:var(--f-disp);
}
@media(prefers-color-scheme:dark){:root:not([data-tema="claro"]){
  --bg:#121413;--sup:#1a1d1c;--sup2:#222625;--sup3:#2a2f2d;--ink:#f2eee6;--mut:#aba597;--line:#2e3331;--line2:#414845;
  --brand:#4fd1c1;--brand-ink:#0b1715;--brand-soft:#173430;--brand-deep:#8fe6da;--brand-viva:#4fd1c1;--brand-viva2:#2ec4b6;
  --ajuste:#f48fb8;--ajuste-bg:#3a1828;
  --ok:#72d39f;--ok-bg:#15301f;--warn:#f0bd62;--warn-bg:#3a2a0d;--bad:#ff9b90;--bad-bg:#411a16;--info:#9cbcf5;--info-bg:#18273f;
  --focus:#8ab4ff;--sh1:0 0 0 1px rgba(255,255,255,.03);--sh2:0 1px 0 rgba(255,255,255,.03) inset,0 24px 50px -24px rgba(0,0,0,.75);
  --sh-papel:0 0 0 1px rgba(255,255,255,.04),0 30px 60px -30px rgba(0,0,0,.8);
  --band:#0a1e1b;--band-ink:#eaf6f3;--band-mut:#9cbdb7;color-scheme:dark}}
:root[data-tema="escuro"]{
  --bg:#121413;--sup:#1a1d1c;--sup2:#222625;--sup3:#2a2f2d;--ink:#f2eee6;--mut:#aba597;--line:#2e3331;--line2:#414845;
  --brand:#4fd1c1;--brand-ink:#0b1715;--brand-soft:#173430;--brand-deep:#8fe6da;--brand-viva:#4fd1c1;--brand-viva2:#2ec4b6;
  --ajuste:#f48fb8;--ajuste-bg:#3a1828;
  --ok:#72d39f;--ok-bg:#15301f;--warn:#f0bd62;--warn-bg:#3a2a0d;--bad:#ff9b90;--bad-bg:#411a16;--info:#9cbcf5;--info-bg:#18273f;
  --focus:#8ab4ff;--sh1:0 0 0 1px rgba(255,255,255,.03);--sh2:0 1px 0 rgba(255,255,255,.03) inset,0 24px 50px -24px rgba(0,0,0,.75);
  --sh-papel:0 0 0 1px rgba(255,255,255,.04),0 30px 60px -30px rgba(0,0,0,.8);
  --band:#0a1e1b;--band-ink:#eaf6f3;--band-mut:#9cbdb7;color-scheme:dark}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--ink);font-family:var(--f-txt);transition:background-color .35s,color .35s}
:focus-visible{outline:3px solid var(--focus);outline-offset:2px;border-radius:6px}
::selection{background:var(--brand-viva);color:#0b1715}
.mono{font-family:var(--f-mono);font-variant-numeric:tabular-nums}

/* marca: caderno com espiral (o mesmo desenho do logo) + "encaderno" em Baloo 2 */
.marca{display:inline-flex;align-items:center;gap:10px;font:700 1.55rem/1 var(--f-marca);letter-spacing:-.01em;color:var(--ink);text-decoration:none}
.marca .ic-cad{width:30px;height:30px;flex:none}
.ic-cad .capa{fill:var(--brand-viva)}.ic-cad .lomb{fill:var(--brand-viva2)}.ic-cad .furo{fill:var(--bg)}

/* botões */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--brand);color:var(--brand-ink);border:1px solid transparent;border-radius:12px;padding:13px 22px;font:650 16px/1.1 var(--f-txt);min-height:48px;cursor:pointer;text-decoration:none;
  box-shadow:0 1px 0 rgba(255,255,255,.22) inset,0 10px 20px -12px color-mix(in srgb,var(--brand) 85%,#000);transition:transform .15s,filter .15s,box-shadow .15s}
.btn:hover{filter:brightness(1.08);transform:translateY(-1px)}.btn:active{transform:none}
.btn.sec{background:transparent;color:var(--ink);border-color:var(--line2);box-shadow:none}.btn.sec:hover{background:var(--sup2);filter:none}

/* rótulo de seção: régua com marca de corte */
.marcador{display:inline-flex;align-items:center;gap:10px;font:500 12px/1 var(--f-mono);letter-spacing:.09em;text-transform:uppercase;color:var(--mut)}
.marcador::before{content:"";width:16px;height:16px;flex:none;background:
  linear-gradient(var(--ink),var(--ink)) 50% 0/1px 6px no-repeat,linear-gradient(var(--ink),var(--ink)) 50% 100%/1px 6px no-repeat,
  linear-gradient(var(--ink),var(--ink)) 0 50%/6px 1px no-repeat,linear-gradient(var(--ink),var(--ink)) 100% 50%/6px 1px no-repeat,
  radial-gradient(circle,transparent 3.2px,var(--ink) 3.4px,var(--ink) 4.2px,transparent 4.4px);opacity:.75}
.marcador b{color:var(--brand);font-weight:600}

/* barra de cor CMYK (decoração das "provas") */
.cmyk{display:flex;height:8px;border-radius:2px;overflow:hidden}
.cmyk i{flex:1}.cmyk i:nth-child(1){background:var(--c)}.cmyk i:nth-child(2){background:var(--m)}.cmyk i:nth-child(3){background:var(--y)}.cmyk i:nth-child(4){background:var(--k)}
.cmyk i:nth-child(5){background:color-mix(in srgb,var(--c) 50%,#fff)}.cmyk i:nth-child(6){background:color-mix(in srgb,var(--m) 50%,#fff)}.cmyk i:nth-child(7){background:color-mix(in srgb,var(--y) 50%,#fff)}.cmyk i:nth-child(8){background:color-mix(in srgb,var(--k) 50%,#fff)}

/* marcas de corte nos 4 cantos de um elemento (.corte) */
.corte{position:relative}
.corte>.mc{position:absolute;width:18px;height:18px;pointer-events:none}
.corte>.mc::before,.corte>.mc::after{content:"";position:absolute;background:var(--ink);opacity:.55}
.corte>.mc::before{width:14px;height:1px}.corte>.mc::after{width:1px;height:14px}
.mc.tl{left:-22px;top:-22px}.mc.tl::before{left:0;bottom:4px}.mc.tl::after{right:4px;top:0}
.mc.tr{right:-22px;top:-22px}.mc.tr::before{right:0;bottom:4px}.mc.tr::after{left:4px;top:0}
.mc.bl{left:-22px;bottom:-22px}.mc.bl::before{left:0;top:4px}.mc.bl::after{right:4px;bottom:0}
.mc.br{right:-22px;bottom:-22px}.mc.br::before{right:0;top:4px}.mc.br::after{left:4px;bottom:0}

/* carimbo de aprovação (o registro) */
.carimbo{display:inline-grid;gap:2px;padding:10px 16px 9px;border:2.5px solid currentColor;border-radius:10px;color:var(--brand);font:600 11px/1.25 var(--f-mono);letter-spacing:.05em;text-transform:uppercase;
  transform:rotate(-6deg);background:color-mix(in srgb,var(--sup) 82%,transparent);box-shadow:0 0 0 4px color-mix(in srgb,currentColor 12%,transparent) inset;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
.carimbo b{font:800 22px/1 var(--f-disp);letter-spacing:.06em}
.carimbo.ajuste{color:var(--ajuste)}

/* selos de situação */
.selo{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:3px 10px;font:600 12.5px/1.4 var(--f-txt);background:var(--sup2);color:var(--mut);white-space:nowrap}
.selo::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.selo.ok{background:var(--ok-bg);color:var(--ok)}.selo.aviso{background:var(--warn-bg);color:var(--warn)}.selo.nao{background:var(--bad-bg);color:var(--bad)}
.selo.info{background:var(--info-bg);color:var(--info)}.selo.ajuste{background:var(--ajuste-bg);color:var(--ajuste)}.selo.marca{background:var(--brand-soft);color:var(--brand)}

/* textura de papel (grão) para fundos */
.grao{position:relative;isolation:isolate}
.grao::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.35;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .35 0 0 0 0 .3 0 0 0 0 .2 0 0 0 .09 0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E")}
:root[data-tema="escuro"] .grao::after{mix-blend-mode:screen;opacity:.18}
@media(prefers-color-scheme:dark){:root:not([data-tema="claro"]) .grao::after{mix-blend-mode:screen;opacity:.18}}

@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
/* "Mostrar senha" (neg.js comum) com alvo de 44 px; mais específico que o neg.css */
.senha-caixa .neg-ver-senha{min-height:44px!important}

/* alvo de toque de 44 px também nos links no meio do texto e nos rodapés, sem mudar a altura da linha */
:where(p, li, dd, td, footer, footer span, footer p) > a:not([class]){display:inline-flex;align-items:center;min-height:44px;margin-block:-13px}
a.marca, a.tb-marca{min-height:44px}