
:root { --bg:#ffffff; --ink:#1a1a1a; --accent:#ff7f00; --border:#e5e5e5; }
*{ box-sizing:border-box; }
body{ font-family: system-ui, -apple-system, 'Segoe UI', 'Roboto', 'Ubuntu', 'Noto Sans', 'Arial', sans-serif; background:var(--bg); color:var(--ink); margin:0; }
header{ padding:1rem 1rem; border-bottom:4px solid var(--accent); display:flex; align-items: center; justify-content:space-between;}
header .brand1, .brand2, .aktetekst { flex: 1;text-align: center; }
.brand1 {text-align: center;}
.aktetekst {text-align: center;}
.brand2 {text-align: center;}
header img{ height:150px; }
h1{ margin:.5rem 0 0; font-size:1.8rem; }
.subtitle{ margin:.25rem 0 0; color:#555; }
main{ padding:1rem; max-width:1000px; margin:0 auto; }
form{ background:#fff; border:1px solid var(--border); border-radius:12px; padding:1rem; box-shadow:0 4px 18px rgba(0,0,0,.06); }
.grid{ display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap:1rem; }
.field{ display:flex; flex-direction:column; gap:.25rem; }
.field.full{ grid-column:1 / -1; }
label{ font-weight:600; }
.static{ padding:.6rem .7rem; border:1px solid var(--border); border-radius:8px; background:#f7f7f7; }
input[type=text], input[type=email], input[type=date]{ padding:.6rem .7rem; border:1px solid var(--border); border-radius:8px; }
input:invalid{ border-color:#c62828; }
input:valid{ border-color:#2e7d32; }
.info p{ background:#fff7ef; border:1px solid #ffd7b3; padding:.75rem; border-radius:8px; }
.signatures{ display:grid; grid-template-columns:1fr; gap:1rem; }
.sig{ border:1px dashed var(--border); border-radius:8px; padding:.75rem; }
canvas{ width:100%; background:#fafafa; border:1px solid var(--border); border-radius:6px; }
.sig-actions{ display:flex; gap:.5rem; margin-top:.5rem; }
.actions{ display:flex; gap:.75rem; margin-top:1rem; flex-wrap:wrap; }
button{ padding:.7rem 1rem; border-radius:8px; border:none; background:var(--accent); color:#fff; font-weight:700; cursor:pointer; }
button.secondary{ background:#777; }
footer.org{ margin-top:1rem; font-size:.9rem; color:#444; text-align:center;}
@media(min-width:900px){ .signatures{ grid-template-columns:1fr 1fr; } }
.sig.penningmeester { display: none; }
