:root{
  --brand:#1488C8;--brand-700:#0F6CA3;--brand-deep:#16457E;--sky:#EAF4FB;--sky-2:#F5FAFE;
  --paper:#FFFFFF;--ink:#1B2A3A;--haze:#4F6175;--line:rgba(20,45,75,.12);
  --accent:#FB7A52;--accent-700:#E5663F;--ok:#1f7a4d;--err:#B23A1B;
  --fd:"Bricolage Grotesque",system-ui,sans-serif;--fb:"Hanken Grotesk",system-ui,sans-serif;
}
*{box-sizing:border-box}
body{margin:0;font-family:var(--fb);color:var(--ink);background:var(--sky-2);line-height:1.6}
.ahead{background:rgba(255,255,255,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:10}
.ahead .in{max-width:1000px;margin:0 auto;padding:12px 22px;display:flex;align-items:center;justify-content:space-between;gap:1rem}
.ahead .logo{height:28px;width:auto}
.ahead nav a{color:var(--ink);text-decoration:none;font-weight:600;font-size:.92rem;margin-left:1.1rem}
.ahead nav a:hover{color:var(--brand-700)}
.awrap{max-width:560px;margin:0 auto;padding:clamp(28px,5vw,52px) 22px}
.awrap.wide{max-width:840px}
h1{font-family:var(--fd);font-weight:700;font-size:clamp(1.7rem,3vw,2.2rem);letter-spacing:-.01em;margin:0 0 .3rem}
.lead{color:var(--haze);margin:0 0 1.4rem}
.card{background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:clamp(22px,3vw,30px);box-shadow:0 14px 36px -24px rgba(22,69,126,.5);margin-bottom:18px}
label{display:block;font-weight:600;font-size:.92rem;margin:14px 0 5px}
input[type=text],input[type=email],input[type=password],input[type=date],textarea{
  width:100%;padding:11px 13px;border:1px solid rgba(20,45,75,.22);border-radius:10px;font:inherit;background:#fff}
input:focus,textarea:focus{outline:3px solid var(--brand);outline-offset:1px;border-color:var(--brand)}
textarea{min-height:100px;resize:vertical}
.row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.consent{display:flex;gap:10px;align-items:flex-start;margin-top:14px;font-size:.92rem;color:var(--haze)}
.consent input{margin-top:3px;width:18px;height:18px;flex:none;accent-color:var(--brand)}
.req{color:var(--accent-700)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;min-height:50px;width:100%;
  padding:.8em 1.6em;border:0;border-radius:999px;background:var(--brand-deep);color:#fff;
  font-family:var(--fb);font-weight:600;font-size:1rem;cursor:pointer;text-decoration:none;margin-top:18px}
.btn:hover{background:#103A66}
.btn.accent{background:var(--accent)}.btn.accent:hover{background:var(--accent-700)}
.btn.ghost{background:#fff;color:var(--brand-deep);border:2px solid var(--brand)}
.muted{color:var(--haze);font-size:.92rem}
.links{margin-top:16px;font-size:.92rem;display:flex;flex-wrap:wrap;gap:6px 16px}
.links a{color:var(--brand-700)}
.flash{padding:12px 15px;border-radius:10px;margin-bottom:16px;font-size:.95rem}
.flash.ok{background:#DDF0E7;color:var(--ok)}
.flash.err{background:#FDECE6;color:var(--err)}
.flash.info{background:var(--sky);color:var(--brand-deep)}
a{color:var(--brand-700)}
/* Dashboard */
.acct-grid{display:grid;grid-template-columns:1fr;gap:18px}
.kv{display:grid;grid-template-columns:140px 1fr;gap:6px 14px;margin:0}
.kv dt{color:var(--haze)}
table.orders{width:100%;border-collapse:collapse;font-size:.95rem}
table.orders th,table.orders td{padding:12px 12px;text-align:left;border-bottom:1px solid var(--line)}
table.orders th{font-size:.74rem;text-transform:uppercase;letter-spacing:.04em;color:var(--haze)}
table.orders a{font-weight:600;text-decoration:none}
.badge{display:inline-block;padding:2px 9px;border-radius:999px;font-size:.76rem;font-weight:600}
.badge.paid{background:#DDF0E7;color:var(--ok)}
.badge.pending{background:#FFF1D6;color:#8A5A00}
.badge.shipped{background:#DCEBF7;color:var(--brand-deep)}
.badge.cancelled,.badge.refunded{background:#FBE3DB;color:var(--err)}
.empty{padding:28px;text-align:center;color:var(--haze)}
.afoot{background:var(--sky);border-top:1px solid var(--line);padding:24px 0;font-size:.9rem;color:var(--haze);margin-top:40px}
.afoot .in{max-width:1000px;margin:0 auto;padding:0 22px;display:flex;flex-wrap:wrap;gap:14px;justify-content:space-between}
.afoot a{color:var(--brand-700);text-decoration:none;margin-right:14px}
:where(a,button,input):focus-visible{outline:3px solid var(--brand);outline-offset:2px;border-radius:8px}
@media(max-width:560px){.row{grid-template-columns:1fr}.kv{grid-template-columns:1fr}}

/* Header-CTA nicht in voller Breite (überschreibt Formular-.btn) */
header.site .nav-cta .btn{width:auto;min-height:50px;margin:0;background:var(--accent);color:#fff;border:2px solid transparent}
header.site .nav-cta .btn:hover{background:var(--accent-700)}
