:root{
  --sand:#FFF4E6; --cream:#FFFFFF; --moss:#1F63B5; --forest:#12284A; --leaf:#E3EFFB;
  --clay:#F7872B; --btn:#F7872B; --btn-hover:#E4710F; --sky:#2B7FD8;
  --ink:#1B2A3F; --muted:#445267; --line:#E3E9F2; --err:#B3261E;
  --radius:16px; --shadow:0 8px 28px rgba(18,40,74,.10);
}
*{box-sizing:border-box}
body{margin:0;font-family:"Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;font-size:1.0625rem;line-height:1.6;color:var(--ink);background:linear-gradient(180deg,#EAF3FC 0,#FFFFFF 420px)}
a{color:var(--moss)}
img{max-width:100%;height:auto}
.container{width:min(920px,100% - 2rem);margin-inline:auto}
.container.narrow{width:min(640px,100% - 2rem)}
.skip{position:absolute;left:-999px;top:0;background:var(--forest);color:#fff;padding:.7rem 1rem;z-index:100}
.skip:focus{left:1rem;top:1rem;border-radius:8px}
:focus-visible{outline:3px solid var(--sky);outline-offset:2px;border-radius:6px}

header.site{background:#fff;border-bottom:1px solid var(--line)}
.bar{display:flex;align-items:center;justify-content:space-between;padding:.8rem 0}
.brand{display:block;line-height:0}
.logo{height:46px;width:auto;display:block}

h1{font-size:clamp(1.8rem,4vw,2.5rem);line-height:1.15;margin:.2rem 0 .6rem;color:var(--forest)}
h2{font-size:1.25rem;margin:0 0 1rem;color:var(--forest);display:flex;align-items:center;gap:.6rem}
.num{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--moss);color:#fff;font-weight:700;font-size:1rem}
.eyebrow{display:inline-block;background:var(--leaf);color:var(--forest);font-weight:600;font-size:.9rem;padding:.25rem .8rem;border-radius:999px;margin:1.6rem 0 .4rem}
.lead{font-size:1.12rem;color:var(--muted);margin:0 0 1.5rem;max-width:640px}
.hint{color:var(--muted);font-size:.95rem;margin:.6rem 0 0}

.booking{display:grid;gap:1.2rem;margin-bottom:3rem}
.panel{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.5rem;box-shadow:var(--shadow)}
.panel[hidden]{display:none}
.chosen{font-weight:700;color:var(--forest);background:var(--sand);display:inline-block;padding:.35rem .8rem;border-radius:10px;margin:0 0 1rem}

/* Kalender */
.cal-nav{display:flex;align-items:center;justify-content:space-between;margin-bottom:.8rem}
.icon-btn{width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:#fff;font-size:1.5rem;line-height:1;cursor:pointer;color:var(--forest)}
.icon-btn:hover:not(:disabled){background:var(--leaf)}
.icon-btn:disabled{opacity:.35;cursor:default}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:.35rem}
.cal-head span{text-align:center;font-size:.85rem;font-weight:600;color:var(--muted);padding-bottom:.2rem}
.day{height:52px;min-height:44px;border:1px solid transparent;border-radius:12px;background:#F3F5F9;color:#8793A6;font:inherit;font-weight:600;cursor:default}
.day.free{background:var(--leaf);color:var(--forest);border-color:#BBD6F1;cursor:pointer}
.day.free:hover{background:#CFE3F8}
.day.selected{background:var(--forest);color:#fff;border-color:var(--forest)}

.times{display:flex;flex-wrap:wrap;gap:.6rem}
.time{border:2px solid var(--moss);background:#fff;color:var(--forest);font:inherit;font-weight:700;padding:.6rem 1rem;border-radius:999px;cursor:pointer;min-height:44px}
.time:hover{background:var(--leaf)}
.time.selected{background:var(--moss);color:#fff}

/* Formular */
.field{margin-bottom:1rem;border:0;padding:0}
label,legend{font-weight:600;display:block;margin-bottom:.3rem;color:var(--forest);padding:0}
input[type=text],input[type=email],input[type=tel],input[type=password],input[type=date],input[type=time],input[type=number],input[type=url],select,textarea{
  width:100%;font:inherit;padding:.7rem .85rem;border:1.5px solid #B7C3D4;border-radius:12px;background:#fff;color:var(--ink)}
textarea{resize:vertical}
input:focus,select:focus,textarea:focus{border-color:var(--sky)}
.choice{display:flex;align-items:flex-start;gap:.6rem;font-weight:500;color:var(--ink);margin-bottom:.4rem;cursor:pointer}
.choice input{margin-top:.35rem;width:1.1rem;height:1.1rem;flex:none}
.consent .choice{font-size:.95rem;font-weight:400}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.err,.error{color:var(--err);font-size:.95rem;margin:.25rem 0 0;font-weight:600}
.ok{color:#1D6B33;font-weight:600}

.btn{display:inline-block;background:var(--btn);color:var(--forest);text-decoration:none;font:inherit;font-weight:700;padding:.8rem 1.5rem;border-radius:999px;border:2px solid var(--btn);cursor:pointer}
.btn:hover{background:var(--btn-hover);border-color:var(--btn-hover)}
.btn:disabled{opacity:.6;cursor:wait}
.btn.ghost{background:transparent;color:var(--forest);border-color:var(--forest)}
.btn.ghost:hover{background:var(--forest);color:#fff}
.btn.small{padding:.4rem .9rem;font-size:.95rem}
.btn.danger{background:#fff;color:var(--err);border-color:var(--err)}
.btn.danger:hover{background:var(--err);color:#fff}

.success .big{font-size:1.35rem;font-weight:700;color:var(--forest)}
.success:focus{outline:none}

footer.site{background:#0D1F3A;color:#D3DFF0;padding:1.5rem 0;font-size:.95rem;margin-top:2rem}
footer.site a{color:#fff;margin-left:1rem}
.foot{display:flex;flex-wrap:wrap;gap:.6rem 2rem;justify-content:space-between}

/* Admin */
.admin-tabs{display:flex;flex-wrap:wrap;gap:.5rem;margin:1.2rem 0}
.admin-tabs a{padding:.5rem 1rem;border-radius:999px;border:1.5px solid var(--forest);text-decoration:none;color:var(--forest);font-weight:600}
.admin-tabs a[aria-current=page]{background:var(--forest);color:#fff}
table.list{width:100%;border-collapse:collapse;font-size:.97rem}
table.list th,table.list td{text-align:left;padding:.6rem .5rem;border-bottom:1px solid var(--line);vertical-align:top}
table.list th{color:var(--muted);font-weight:600;font-size:.88rem}
.pill{display:inline-block;padding:.1rem .6rem;border-radius:999px;background:var(--leaf);color:var(--forest);font-size:.85rem;font-weight:600}
.pill.off{background:#F6DEDC;color:var(--err)}
.row{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.8rem}
.week{display:grid;grid-template-columns:110px 1fr;gap:.6rem 1rem;align-items:center}
.week .times2{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
.week input{width:auto}
.stack>*+*{margin-top:1.2rem}
small.muted{color:var(--muted)}

@media (max-width:560px){
  .panel{padding:1.1rem}
  .cal-grid{gap:.25rem}
  .week{grid-template-columns:1fr}
  table.list{font-size:.9rem}
}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
.scroll{overflow-x:auto}
.gap-top{margin-top:2rem}
.sr{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.stack{padding-top:1.2rem}