/* PinProof Bauhaus UI — geometric, brutalist, playful */
:root{
  --red:#E30613; --blue:#0066B3; --yellow:#FFCC00;
  --ink:#111111; --paper:#F4F1EA; --card:#FFFFFF;
  --line:3px solid var(--ink);
  --shadow:6px 6px 0 var(--ink);
  --radius:14px;
}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);
  font-family:"Archivo","Space Grotesk",Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;}
a{color:inherit}
.topbar{position:sticky;top:0;z-index:50;background:var(--paper);border-bottom:var(--line);}
.topbar-inner{max-width:1180px;margin:0 auto;display:flex;align-items:center;gap:16px;padding:14px 20px;}
.logo{display:flex;align-items:center;gap:10px;font-weight:900;letter-spacing:.5px;font-size:22px;text-decoration:none}
.logo-marks{display:flex;gap:4px}
.sq{width:18px;height:18px;border:3px solid var(--ink);display:inline-block}
.sq.r{background:var(--red);border-radius:50%}
.sq.b{background:var(--blue)}
.sq.y{background:var(--yellow);clip-path:polygon(50% 0,100% 100%,0 100%);border:none;width:22px;height:18px}
.nav{margin-left:auto;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.btn{border:var(--line);background:#fff;padding:10px 16px;font-weight:800;border-radius:999px;
  box-shadow:4px 4px 0 var(--ink);cursor:pointer;text-decoration:none;display:inline-block;transition:transform .08s}
.btn:hover{transform:translate(-1px,-1px);box-shadow:5px 5px 0 var(--ink)}
.btn:active{transform:translate(3px,3px);box-shadow:1px 1px 0 var(--ink)}
.btn.red{background:var(--red);color:#fff}
.btn.blue{background:var(--blue);color:#fff}
.btn.yellow{background:var(--yellow)}
.btn.ink{background:var(--ink);color:#fff}
.btn.small{padding:7px 12px;font-size:13px;box-shadow:3px 3px 0 var(--ink)}
.wrap{max-width:1180px;margin:0 auto;padding:28px 20px 80px}
.card{background:var(--card);border:var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:22px}
.grid{display:grid;gap:18px}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:900px){.g2,.g3{grid-template-columns:1fr}}
.hero{display:grid;grid-template-columns:1.1fr .9fr;gap:26px;align-items:center;margin-top:18px}
@media(max-width:900px){.hero{grid-template-columns:1fr}}
.kicker{display:inline-block;border:var(--line);border-radius:999px;padding:6px 14px;font-weight:900;
  background:var(--yellow);box-shadow:3px 3px 0 var(--ink);font-size:13px;letter-spacing:.6px;text-transform:uppercase}
h1{font-size:clamp(38px,6vw,68px);line-height:.95;margin:16px 0;letter-spacing:-1px}
h1 .hl-r{background:var(--red);color:#fff;padding:0 10px;border:var(--line);display:inline-block;transform:rotate(-1.5deg)}
h1 .hl-b{background:var(--blue);color:#fff;padding:0 10px;border:var(--line);display:inline-block;transform:rotate(1deg)}
.lead{font-size:18px;line-height:1.55;max-width:56ch}
.bau-art{border:var(--line);border-radius:20px;overflow:hidden;box-shadow:var(--shadow);background:#fff}
.bau-row{display:grid;grid-template-columns:1fr 1fr 1fr;height:120px}
.c-red{background:var(--red)} .c-blue{background:var(--blue)} .c-yellow{background:var(--yellow)}
.bau-mid{padding:18px;border-top:var(--line);display:flex;gap:12px;align-items:center}
.dot{width:34px;height:34px;border:var(--line);border-radius:50%}
.pill{border:var(--line);border-radius:999px;padding:8px 14px;font-weight:800;background:#fff}
.quote{border-left:10px solid var(--red);padding:6px 14px;font-style:italic;background:#fff;border-top:var(--line);border-right:var(--line);border-bottom:var(--line)}
.feat{border:var(--line);border-radius:16px;box-shadow:var(--shadow);padding:18px;background:#fff}
.feat h3{margin:6px 0 8px}
.tag{display:inline-block;font-size:12px;font-weight:900;border:2px solid var(--ink);border-radius:999px;padding:3px 10px;margin-bottom:8px}
.tag.r{background:var(--red);color:#fff}.tag.b{background:var(--blue);color:#fff}.tag.y{background:var(--yellow)}
input,select,textarea{width:100%;border:var(--line);border-radius:12px;padding:12px 14px;font-size:15px;background:#fff;font-family:inherit}
textarea{min-height:120px;resize:vertical}
label{font-weight:800;font-size:13px;text-transform:uppercase;letter-spacing:.5px;display:block;margin:14px 0 6px}
.flash{border:var(--line);border-radius:12px;padding:12px 16px;margin:14px 0;font-weight:700;box-shadow:4px 4px 0 var(--ink)}
.flash.ok{background:#D6F5D6}.flash.error{background:#FFD2D2}.flash.warn{background:#FFF1B8}
table{width:100%;border-collapse:collapse;background:#fff;border:var(--line);border-radius:12px;overflow:hidden}
th,td{padding:10px 12px;border-bottom:2px solid var(--ink);text-align:left;font-size:14px}
th{background:var(--ink);color:#fff;text-transform:uppercase;font-size:12px;letter-spacing:.6px}
.kanban{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
@media(max-width:900px){.kanban{grid-template-columns:1fr}}
.col{background:#fff;border:var(--line);border-radius:16px;box-shadow:var(--shadow);min-height:300px;display:flex;flex-direction:column}
.col-h{padding:12px 14px;border-bottom:var(--line);font-weight:900;display:flex;justify-content:space-between;align-items:center}
.col-h.todo{background:var(--yellow)} .col-h.prog{background:var(--blue);color:#fff} .col-h.done{background:#111;color:#fff}
.col-b{padding:12px;display:flex;flex-direction:column;gap:12px;min-height:200px}
.ticket{border:3px solid var(--ink);border-radius:12px;background:var(--paper);padding:10px;cursor:grab}
.ticket img,.ticket video{width:100%;border:2px solid var(--ink);border-radius:8px;background:#000;max-height:180px;object-fit:cover}
.ticket .meta{font-size:12px;margin-top:6px;line-height:1.4}
.badge{display:inline-block;border:2px solid var(--ink);border-radius:999px;padding:2px 9px;font-size:11px;font-weight:900;background:#fff;color:var(--ink)}
.meter{height:18px;border:var(--line);border-radius:999px;overflow:hidden;background:#fff}
.meter > div{height:100%;background:repeating-linear-gradient(90deg,var(--red) 0 12px,var(--blue) 12px 24px,var(--yellow) 24px 36px)}
code.snip{display:block;white-space:pre-wrap;background:#111;color:#FFE45E;border:var(--line);border-radius:12px;padding:14px;font-size:13px}
.footer{border-top:var(--line);padding:26px 20px;text-align:center;background:#fff}
.shapes{display:flex;gap:8px;justify-content:center;margin-bottom:10px}
.muted{color:#555}.small{font-size:13px}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.divider{height:3px;background:var(--ink);margin:26px 0;border-radius:99px}
.price-card{position:relative}
.price{font-size:52px;font-weight:900}
.stars{letter-spacing:2px}
form.inline{display:inline}
