@font-face{font-family:Ubuntu;font-weight:400;font-display:swap;src:url(/static/ubuntu-400.woff2) format("woff2")}
@font-face{font-family:Ubuntu;font-weight:700;font-display:swap;src:url(/static/ubuntu-700.woff2) format("woff2")}

/* hospital-concepts.de: Blau #003893, Gold #B4965F */
:root{
  --bg:#fff;--paper:#f3f5fa;--ink:#1b2233;--muted:#4a5266;--line:#cfd5e2;
  --brand:#003893;--on-brand:#fff;--gold:#b4965f;--gold-soft:#f4eee3;--bad:#b00020;--ok:#0a6b2a;
  color-scheme:light
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:400 1.0625rem/1.55 Ubuntu,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
.page{max-width:46rem;margin:0 auto;padding:0 1rem}
a{color:var(--brand)}
:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

/* Kopf: Veranstaltungslogo, dann Titel; Goldlinie wie auf hospital-concepts.de */
.masthead{padding:2.5rem 0 1.5rem;border-bottom:4px solid var(--gold)}
.event-logo{display:block;width:min(19rem,80%);height:auto}
.masthead h1{margin:1.6rem 0 .2rem;font-size:clamp(1.55rem,4.6vw,2.1rem);line-height:1.2;color:var(--brand)}
.meta{margin:0;color:var(--muted)}
.intro{padding:1.4rem 0 .4rem}
.intro p{margin:0 0 .9rem;max-width:40rem}

/* Abschnitte des Fragebogens */
.sec{padding:2rem 0 .5rem}
.sec>h2{display:flex;align-items:baseline;gap:.7rem;margin:0 0 1.3rem;font-size:1.35rem;line-height:1.25;color:var(--brand)}
.sec>h2 .num{flex:none;font-size:2.6rem;line-height:1;color:var(--gold);font-variant-numeric:tabular-nums}
@media (min-width:56rem){.sec{position:relative}.sec>h2 .num{position:absolute;right:calc(100% + 1.2rem);top:1.75rem;font-size:3.4rem}}
.q{margin:0 0 2.2rem;padding:0;border:0;min-width:0}
.q>legend,.q>.qtext{display:block;padding:0;margin:0 0 .25rem;font-weight:700;font-size:1.0625rem;line-height:1.4}
.hint{margin:0 0 .9rem;color:var(--muted);font-size:.9375rem}
.q-err{outline:2px solid var(--bad);outline-offset:.6rem;border-radius:.2rem}

/* Matrix: je Zeile Beschriftung + Segmentleiste */
.mrow{padding:.85rem 0;border-top:1px solid var(--line)}
.mrow:last-child{border-bottom:1px solid var(--line)}
.mlabel{margin:0 0 .55rem}
.segs{display:flex;gap:.35rem}
.seg{flex:1 1 0;position:relative;min-width:0}
.seg input{position:absolute;inset:0;width:100%;height:100%;opacity:0;margin:0;cursor:pointer}
.seg span{display:flex;align-items:center;justify-content:center;text-align:center;min-height:2.9rem;padding:.3rem .25rem;
  border:1.5px solid var(--line);border-radius:.45rem;background:var(--bg);font-weight:700;font-size:1.05rem;line-height:1.15;
  font-variant-numeric:tabular-nums;color:var(--ink)}
.wordy .seg span{font-weight:400;font-size:.875rem}
.seg span,.opt{transition:background-color .12s,border-color .12s,color .12s}
@media (prefers-reduced-motion:reduce){.seg span,.opt{transition:none}}
.seg input:hover+span{border-color:var(--brand)}
.seg input:checked+span{background:var(--brand);border-color:var(--brand);color:var(--on-brand)}
.seg input:focus-visible+span{outline:3px solid var(--gold);outline-offset:2px}
@media (min-width:44rem){
  .mrow{display:grid;grid-template-columns:1fr 20.5rem;gap:1.2rem;align-items:center}
  .mrow.wordy{grid-template-columns:1fr 25rem}
  .mlabel{margin:0}
}

/* Einfach- und Mehrfachauswahl */
.opts{display:grid;gap:.45rem}
.opt{position:relative;display:flex;gap:.75rem;align-items:flex-start;padding:.75rem .9rem;border:1.5px solid var(--line);border-radius:.45rem;cursor:pointer;background:var(--bg)}
.opt input{flex:none;width:1.25rem;height:1.25rem;margin:.12rem 0 0;accent-color:var(--brand)}
.opt:hover{border-color:var(--brand)}
.opt:has(input:checked){border-color:var(--brand);background:var(--paper)}
.opt:has(input:disabled){opacity:.5;cursor:not-allowed}
.counter{margin:.5rem 0 0;color:var(--muted);font-size:.875rem}

textarea{width:100%;min-height:8rem;padding:.7rem .8rem;font:inherit;color:var(--ink);background:var(--bg);border:1.5px solid var(--line);border-radius:.45rem;resize:vertical}
textarea:focus{border-color:var(--brand)}

/* Absenden */
.submit{margin:1rem 0 0;padding:1.6rem 0 0;border-top:4px solid var(--gold)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;min-height:3rem;padding:.6rem 1.4rem;font-family:inherit;font-weight:700;font-size:1rem;line-height:1.2;
  color:var(--on-brand);background:var(--brand);border:2px solid var(--brand);border-radius:.5rem;cursor:pointer;text-decoration:none}
.btn.big{width:100%;min-height:3.6rem;font-size:1.125rem}
.btn.quiet{background:transparent;color:var(--brand)}
.btn:disabled{opacity:.55;cursor:wait}
.fine{margin:.8rem 0 0;color:var(--muted);font-size:.875rem}
@media (min-width:44rem){.btn.big{width:auto;min-width:18rem}}

.errors{margin:1.2rem 0 0;padding:1rem 1.1rem;border-left:5px solid var(--bad);background:var(--paper)}
.errors p{margin:0 0 .4rem;font-weight:700;color:var(--bad)}
.errors ul{margin:0;padding-left:1.2rem}
.preview-note{margin:1rem 0 0;padding:.7rem 1rem;background:var(--gold-soft);border-left:5px solid var(--gold);font-weight:700}

/* Meldeseiten (Danke, ungültig, beendet) */
.message{padding:2.2rem 0 1rem}
.message h1{margin:0 0 .6rem;font-size:clamp(1.45rem,4.4vw,1.9rem);line-height:1.25;color:var(--brand)}
.message p{margin:0 0 .9rem;max-width:38rem}

footer{display:flex;flex-wrap:wrap;gap:.6rem 1.4rem;align-items:center;justify-content:space-between;margin-top:3.5rem;padding:1.4rem 0 2.5rem;border-top:1px solid var(--line);color:var(--muted);font-size:.875rem}
footer .emtec{height:1.5rem;width:auto}
footer nav{display:flex;gap:1.2rem}
footer a{color:var(--muted)}

/* Admin */
.admin h1{margin:1.6rem 0 .3rem;color:var(--brand);font-size:1.6rem}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 0;border-bottom:4px solid var(--gold)}
.topbar img{height:1.6rem;width:auto}
.topbar form{margin:0}
.card{margin:1.6rem 0;padding:1.2rem 1.2rem 1.4rem;background:var(--paper);border-radius:.6rem}
.card h2{margin:0 0 .2rem;font-size:1.25rem}
.card h3{margin:1.4rem 0 .5rem;font-size:1rem}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(7rem,1fr));gap:.6rem;margin:1rem 0 0}
.stats div{background:var(--bg);border-radius:.45rem;padding:.6rem .75rem}
.stats dt{font-size:.8125rem;color:var(--muted)}
.stats dd{margin:0;font-size:1.5rem;font-weight:700;font-variant-numeric:tabular-nums;color:var(--brand)}
.actions{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
.actions form{margin:0}
.mt{margin-top:.8rem}
.btn.small{min-height:2.5rem;padding:.4rem .9rem;font-size:.9375rem}
input[type=email],input[type=text],input[type=password],input[type=file]{font:inherit;color:var(--ink);background:var(--bg);border:1.5px solid var(--line);border-radius:.45rem;padding:.5rem .7rem;min-height:2.5rem;max-width:100%}
.field{display:grid;gap:.25rem;margin:0 0 .9rem}
.field label{font-weight:700;font-size:.9375rem}
.notice{margin:1.2rem 0;padding:.9rem 1.1rem;border-left:5px solid var(--ok);background:var(--paper);white-space:pre-line}
.notice.error{border-color:var(--bad)}
.job{margin:.8rem 0 0;font-weight:700}
.login{max-width:24rem;margin:0 auto;padding:3rem 0}
.login .event-logo{margin-bottom:2rem}
.login input{width:100%}