/* Gemeinsame Hülle aller Seiten (Design v2): Basis, Kopf, Fuß, Hauptknopf, Fokus, Bogen, Reifen.
   Quelle: docs/design-v2/mock.html. Nur Variablen aus tokens.css verwenden. Eigentümer: Reviewer (Paket F). */
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--schnee);color:var(--tinte);font:400 17px/1.55 var(--text);min-width:320px}
img{display:block;max-width:100%;height:auto}
h1,h2,h3{font-family:var(--anzeige);font-weight:600;letter-spacing:-.02em;line-height:1.04;margin:0;color:inherit;text-wrap:balance}
p{margin:0}
a{color:inherit}
button{font:inherit;color:inherit;cursor:pointer}
:focus-visible{outline:3px solid var(--nacht);outline-offset:3px;box-shadow:0 0 0 3px #fff}
.kopf :focus-visible,.hero :focus-visible,.fuss :focus-visible,.leiste :focus-visible,.wizard-aktionen :focus-visible{outline-color:#fff;box-shadow:none}
.vh,.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.wrap{width:min(1120px,calc(100% - 40px));margin-inline:auto}
.sprunglink{position:absolute;z-index:100;top:8px;left:8px;transform:translateY(-300%);padding:10px 16px;border-radius:8px;background:var(--schnee);color:var(--nacht);font-weight:700}
.sprunglink:focus{transform:translateY(0)}

/* Kopf */
.kopf{position:sticky;top:0;z-index:30;background:var(--nacht);color:var(--schnee)}
.kopf__in{display:flex;align-items:center;gap:14px;min-height:60px}
.marke{display:flex;align-items:center;gap:10px;text-decoration:none;margin-right:auto}
.marke img{width:auto;height:32px;flex:none;display:block}
.marke span{font:600 20px/1 var(--anzeige);letter-spacing:-.01em;white-space:nowrap}
.kopf nav{display:flex;align-items:center;gap:4px}
.kopf nav a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 10px;text-decoration:none;font-size:16px;border-radius:10px}
.kopf nav a:hover{background:var(--fichte)}
.kopf nav a[aria-current]{text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:2px}
.kopf nav a.anruf{display:grid;place-items:center;width:44px;height:44px;padding:0;border-radius:50%;background:var(--fichte);color:#fff;border:1.5px solid #5C8574}
.kopf nav a.anruf:hover{background:var(--fichte-hell)}
.anruf svg{width:22px;height:22px}
.kopf .nav-sauna{display:none}
@media(min-width:900px){.kopf .nav-sauna{display:inline-flex}}
@media(max-width:359px){.kopf nav a.nav-gutschein{display:none}.marke span{font-size:18px}}

/* Hauptknopf (Bernstein: nur hier und in der Aktionsleiste) */
.knopf{display:flex;align-items:center;justify-content:center;width:100%;min-height:56px;margin-top:12px;border:0;border-radius:16px;background:var(--glut);color:var(--nacht);font-weight:700;font-size:19px;text-decoration:none;transition:transform .12s,background .12s}
.knopf:hover:not(:disabled){background:#F0B14E}
.knopf:active:not(:disabled){transform:translateY(1px)}
.knopf:disabled,.knopf[aria-disabled=true]{background:var(--nebel);color:#51625A;border:1.5px dashed var(--linie);cursor:not-allowed}
.knopf[hidden]{display:none}
.knopf--zweit{background:var(--weiss);color:var(--fichte);border:1.5px solid var(--fichte)}
.knopf--zweit:hover:not(:disabled){background:var(--schnee)}

/* Bogen und Reifen */
/* Foto-Rahmen: ruhiges Rechteck mit weichen Ecken (Klassenname .bogen bleibt aus Gründen der Vorlage) */
.bogen{border-radius:20px;overflow:hidden;aspect-ratio:4/3;background:var(--nebel)}
.bogen img{width:100%;height:100%;object-fit:cover}
.reifen{height:9px;border-block:1.5px solid var(--rand);margin:0}

/* Fuß */
.fuss{background:var(--nacht);color:var(--schnee);padding:56px 0 28px}
.fuss__raster{display:grid;gap:34px}
.fuss h2{font-size:28px;margin-bottom:12px}
.fuss .bogen{max-width:320px;aspect-ratio:4/3;margin-top:18px}
.fuss a{display:inline-flex;align-items:center;min-height:44px}
.fuss ul{list-style:none;margin:0;padding:0}
.fuss__recht{display:flex;flex-wrap:wrap;gap:0 18px;margin-top:34px;padding-top:18px;border-top:1px solid var(--fichte-hell);font-size:15px}
.fuss__recht a,.fuss__recht button{min-height:44px;background:none;border:0;padding:0;text-decoration:underline;color:inherit}
.klein-text{margin-top:10px;font-size:14px;color:#B9CCC3}
@media(min-width:900px){.fuss__raster{grid-template-columns:1.3fr 1fr 1fr}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}