/* URGSTOA Regensburg | Startseite „Einmal rum.“: eine Fahrt vom Schaufenster ins Gewölbe, durch die Brezn,
   über die Steinerne Brücke und durch den Brückturm zurück ans Fenster. Ohne Bewegung stehen die Stationen untereinander.
   Grund ist Teig, weil der Putz in den Bildern genau diesen Ton hat. */
@font-face{font-family:"Grenze";font-style:normal;font-weight:100 900;font-display:swap;src:url("../fonts/grenze-latin.woff2") format("woff2")}
@font-face{font-family:"Schibsted Grotesk";font-style:normal;font-weight:400 900;font-display:swap;src:url("../fonts/schibsted-latin.woff2") format("woff2")}

:root{
  --tusche:#23201D;--tafel:#35373A;--stoa:#6B645C;--putz:#E6E0D4;--kalk:#F3EFE6;
  --senf:#C29E4F;--senfkorn:#5C4718;--ocker:#D9BF84;--schaum:#F2E7C9;--teig:#F0DFCB;--brezn:#7A3F27;--lauge:#B47648;--kruste:#4A2416;
  --grund:var(--teig);--linie:rgba(35,32,29,.14);--kreide-linie:rgba(243,239,230,.3);
  --keller:#3E3935;--wasser:#8F8372;
  --f-titel:"Grenze",Georgia,"Times New Roman",serif;
  --f-text:"Schibsted Grotesk","Helvetica Neue",Arial,sans-serif;
  --kopf:64px;--hinweis:0px;--oben:calc(var(--kopf) + var(--hinweis));
  --rand:clamp(20px,4.4vw,72px);
  --aus:cubic-bezier(.16,1,.3,1);
  color-scheme:light;
}
.mit-hinweis{--hinweis:34px}

*,*::before,*::after{box-sizing:border-box}
html{background:var(--grund);color:var(--tusche);-webkit-text-size-adjust:100%;scrollbar-color:var(--stoa) var(--grund)}
body{margin:0;font:400 1.0625rem/1.55 var(--f-text);background:var(--grund);color:var(--tusche);caret-color:var(--tusche);-webkit-font-smoothing:antialiased}
::selection{background:var(--senf);color:var(--tusche)}
a{color:inherit;text-underline-offset:.2em;text-decoration-thickness:1.5px}
:focus-visible{outline:3px solid var(--tusche);outline-offset:3px}
[hidden]{display:none!important}
img,video,svg{display:block;max-width:100%}
p{margin:0}
h1,h2,h3{margin:0;text-wrap:balance}
.sr{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.sprung{position:absolute;left:12px;top:-60px;z-index:60;background:var(--tusche);color:var(--kalk);padding:10px 16px;font-weight:600;text-decoration:none}
.sprung:focus{top:calc(10px + env(safe-area-inset-top,0px))}
.ic{width:1.25em;height:1.25em;flex:none;fill:none;stroke:currentColor;stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round}
.platzhalter{display:inline-block;font:650 .8125rem/1.3 var(--f-text);letter-spacing:.02em;padding:.25em .55em;border:1.5px dashed currentColor;vertical-align:.12em}

/* Entwurfs-Hinweis, nur in Vorschau und Artifact */
.hinweis{height:var(--hinweis);display:flex;align-items:center;justify-content:center;padding-inline:16px;background:var(--tusche);color:var(--kalk);font-size:.8125rem;text-align:center;line-height:1.2}

/* ---------- Knöpfe ---------- */
.knopf{display:inline-flex;align-items:center;justify-content:center;gap:.6em;min-height:52px;padding:.85em 1.35em;font:700 1rem/1.1 var(--f-text);letter-spacing:.01em;text-decoration:none;color:var(--tusche);background:var(--senf);border:2px solid var(--senf);border-radius:0;cursor:pointer;
  transition:transform .5s var(--aus),background-color .3s,border-color .3s,color .3s,box-shadow .5s var(--aus)}
.knopf:hover{transform:translateY(-2px);box-shadow:0 10px 22px -12px rgba(35,32,29,.55)}
.knopf:active{transform:none;box-shadow:none}
.knopf.linie{background:transparent;border-color:var(--tusche)}
.knopf.linie:hover{background:var(--tusche);color:var(--kalk)}
.knopf.klein{min-height:44px;padding:.55em 1.05em;font-size:.9375rem}
.knopf .ic{width:1.15em;height:1.15em}

/* ---------- Kopf ---------- */
.kopf{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;height:var(--kopf);display:flex;align-items:center;gap:clamp(14px,2vw,30px);
  padding-inline:max(var(--rand),env(safe-area-inset-left,0px)) max(var(--rand),env(safe-area-inset-right,0px));
  background:var(--grund);border-bottom:1px solid var(--linie)}
.marke{margin-right:auto;display:block;padding-block:6px}
.signet{height:40px;width:auto;color:var(--tusche)}
.nav{display:flex;gap:clamp(14px,1.8vw,26px);font-weight:600;font-size:.9375rem}
.nav a{text-decoration:none;padding-block:10px;background:linear-gradient(currentColor,currentColor) 0 calc(100% - 6px)/0 2px no-repeat;transition:background-size .4s var(--aus)}
.nav a:hover{background-size:100% 2px}
.status{display:flex;align-items:center;gap:.55em;font-size:.9375rem;font-weight:600;white-space:nowrap}
.punkt{width:10px;height:10px;border-radius:50%;background:var(--stoa);flex:none}
.status.offen .punkt{background:var(--senf);box-shadow:0 0 0 2px var(--tusche)}
.telefon{display:inline-flex;align-items:center;gap:.45em;font-weight:600;font-size:.9375rem;text-decoration:none;min-height:44px}
.telefon:hover{text-decoration:underline}
.telefon .ic{width:20px;height:20px}

/* ---------- Erzählkästen wie im Comic ---------- */
.kasten{background:var(--kalk);border:3px solid var(--tusche);padding:clamp(18px,1.6vw + 8px,30px) clamp(18px,1.8vw + 8px,34px);display:grid;gap:.8rem;justify-items:start;max-width:31rem}
.kasten h2{font:800 clamp(1.75rem,1.2rem + 1.7vw,2.6rem)/1.02 var(--f-titel);letter-spacing:-.005em}
.kasten p{max-width:44ch}
.kasten .knopf{margin-top:.3rem}

/* ---------- Fenster: Hero und Ankunft ---------- */
.hero,.ankunft{position:relative;overflow:hidden;background:var(--grund)}
.titel{line-height:1}
.titel-wm{width:100%;height:auto;color:var(--tusche)}
.titel-rg{width:54%;height:auto;margin:.35em 0 0 auto;color:var(--tusche)}
.ankunft h2{font:800 clamp(3rem,2rem + 4.2vw,6rem)/.95 var(--f-titel);letter-spacing:-.01em}
.lead{font-size:clamp(1.25rem,.95rem + .85vw,1.75rem);line-height:1.3;font-weight:500;max-width:22ch;margin-top:clamp(1.25rem,.8rem + 1.6vw,2.25rem);text-wrap:balance}
.an-status{margin-top:1rem;font-weight:700;display:flex;align-items:center;gap:.55em}
.an-status::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--senf);box-shadow:0 0 0 2px var(--tusche)}
.knoepfe{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:clamp(1.5rem,1rem + 1.4vw,2.25rem)}
.fakten{display:flex;flex-wrap:wrap;gap:.2rem 1.4rem;margin-top:1.4rem;font-size:.9375rem;color:var(--senfkorn)}
.hero-bild>*{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

@media (min-width:880px){
  :root{--hb:max(520px,min(56.25vw,calc(100svh - var(--oben))));--vb:calc(var(--hb) * 16 / 9)}
  .hero,.ankunft{height:var(--hb)}
  /* Bild bündig oben rechts: Himmel und Turmspitzen reichen bis an den Bildrand. Links und unten läuft der Putz weich aus. */
  .hero-bild{position:absolute;top:0;right:0;height:100%;aspect-ratio:16/9;
    -webkit-mask-image:linear-gradient(to right,transparent 0,#000 9%),linear-gradient(to top,transparent 0,#000 4%);
    -webkit-mask-composite:source-in;mask-image:linear-gradient(to right,transparent 0,#000 9%),linear-gradient(to top,transparent 0,#000 4%);mask-composite:intersect}
  .hero-bild>*{object-position:100% 0}
  /* Textspalte endet vor dem Steinrahmen des Fensters, der bei 42,3 % der Bildbreite beginnt */
  .hero-text{position:relative;z-index:1;height:100%;display:flex;flex-direction:column;justify-content:center;
    padding-left:max(var(--rand),env(safe-area-inset-left,0px));width:calc(100% - var(--vb) * .577 - 3vw);max-width:700px}
  .leiste{display:none}
}

@media (max-width:879.98px){
  :root{--kopf:56px}
  .signet{height:34px}
  .nav,.telefon span,.kopf-knopf{display:none}
  .telefon{width:44px;justify-content:center}
  .status{font-size:.875rem}
  .hero,.ankunft{display:flex;flex-direction:column}
  .hero-text{padding:clamp(24px,6vw,44px) max(var(--rand),env(safe-area-inset-right,0px)) 0 max(var(--rand),env(safe-area-inset-left,0px))}
  .titel-wm{max-width:560px}
  .titel-rg{max-width:300px}
  .hero .knoepfe,.ankunft .knoepfe{display:none}
  .fakten{flex-direction:column;font-size:.875rem;margin-top:1rem}
  .hero-bild{position:relative;width:100%;aspect-ratio:16/15;max-height:64svh;margin-top:clamp(12px,4vw,28px);
    -webkit-mask-image:linear-gradient(to right,transparent 0,#000 6%),linear-gradient(to bottom,transparent 0,#000 6%);
    -webkit-mask-composite:source-in;mask-image:linear-gradient(to right,transparent 0,#000 6%),linear-gradient(to bottom,transparent 0,#000 6%);mask-composite:intersect}
  .hero-bild>*{object-position:100% 0}
  body{padding-bottom:calc(70px + env(safe-area-inset-bottom,0px))}
  .leiste{position:fixed;left:0;right:0;bottom:0;z-index:25;display:grid;grid-template-columns:1fr 1fr;gap:8px;
    padding:10px max(16px,env(safe-area-inset-right,0px)) calc(10px + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px));
    background:var(--grund);border-top:1px solid var(--linie)}
  .leiste .knopf{min-height:48px;padding-inline:.6em;font-size:.9375rem}
}
@media (max-width:359.98px){.status [data-status-text] .lang{display:none}}

/* ---------- Stationen ohne Fahrt: untereinander ---------- */
.dunkel,.schnitt,.brezn-szene,.turm-szene{display:none}
.gewoelbe{position:relative;overflow:hidden;height:clamp(600px,calc(100svh - var(--kopf)),960px);background:#E9DCC6}
.gw-raum{position:absolute;inset:0}
.gw-raum img{width:100%;height:100%;object-fit:cover;object-position:50% 42%}
.gw-figur{position:absolute;bottom:0;height:96%;width:auto;max-width:none}
.gw-madl{left:-4%}
.gw-urg{right:-4%}
.gw-text{position:absolute;left:50%;bottom:6%;transform:translateX(-50%);width:min(31rem,calc(100% - 2 * var(--rand)))}
.bruecke{position:relative;overflow:hidden;background:var(--wasser);padding:calc(clamp(420px,70svh,760px) + 28px) max(var(--rand),env(safe-area-inset-right,0px)) 48px max(var(--rand),env(safe-area-inset-left,0px));
  display:flex;flex-wrap:wrap;gap:24px}
.bruecke>.br-hinten,.bruecke>.br-wasser,.bruecke>.br-steg,.bruecke>.br-gehen{position:absolute;left:0;right:0}
.br-hinten{top:0;height:calc(clamp(420px,70svh,760px) * .62);overflow:hidden}
.br-hinten img{height:100%;width:100%;max-width:none;object-fit:cover;object-position:35% 0}
.br-wasser{top:calc(clamp(420px,70svh,760px) * .58);height:calc(clamp(420px,70svh,760px) * .42);background:var(--wasser)}
.br-steg{top:calc(clamp(420px,70svh,760px) * .5);height:calc(clamp(420px,70svh,760px) * .5);display:flex;overflow:hidden}
.br-steg img{height:100%;width:auto;max-width:none;flex:none}
.br-steg img:nth-child(even){transform:scaleX(-1)}
.br-gehen{top:0;height:clamp(420px,70svh,760px)}
.geher{position:absolute;bottom:33%;height:36%;aspect-ratio:520/798}
.geher-madl{left:34%}
.geher-urg{left:calc(34% + 15vh);aspect-ratio:520/836}
.geher img{position:absolute;inset:0;height:100%;width:100%}
.geher img+img{display:none}
.br-karte{position:relative;flex:1 1 320px}
.ankunft{border-top:1px solid var(--linie)}
.an-bild{z-index:0}

/* ---------- Fahrt: alles auf einer festen Bühne ---------- */
.mit-fahrt .buehne{position:sticky;top:var(--kopf);height:calc(100svh - var(--kopf));overflow:hidden;background:var(--grund);isolation:isolate}
.mit-fahrt .szene{position:absolute;left:0;top:0;width:100%;visibility:hidden}
.mit-fahrt .hero{z-index:4;visibility:visible;transform-origin:0 0;will-change:transform}
.mit-fahrt .ankunft{z-index:1;border-top:0}
.mit-fahrt .bruecke{z-index:2;height:100%;padding:0;display:block}
.mit-fahrt .turm-szene{z-index:3;display:block;height:100%;overflow:hidden}
.mit-fahrt .dunkel{z-index:5;display:grid;place-items:center;height:100%;background:var(--keller);opacity:0}
.mit-fahrt .gewoelbe{z-index:6;height:100%;clip-path:inset(100% 0 0 0)}
.mit-fahrt .schnitt{z-index:7;display:block;position:absolute;left:0;top:0;width:100%;height:var(--schnitt-h,110px);transform:translateY(120vh);pointer-events:none}
.mit-fahrt .brezn-szene{z-index:8;display:block;height:100%;overflow:hidden;pointer-events:none}
.zwischen{font:800 clamp(2.4rem,1.6rem + 3.6vw,5rem)/1 var(--f-titel);color:var(--kalk);text-align:center;padding-inline:var(--rand);opacity:0}
.schnitt svg{width:100%;height:100%}
.mit-fahrt .gw-raum{inset:auto;left:0;top:0;transform-origin:0 0;will-change:transform}
.mit-fahrt .gw-raum img{width:100%;height:100%}
.mit-fahrt .gw-figur{left:0;top:0;bottom:auto;right:auto;transform-origin:0 0;will-change:transform}
.mit-fahrt .gw-text{bottom:6%;opacity:0}
.mit-fahrt .brezn{position:absolute;left:0;top:0;width:1000px;height:auto;max-width:none;will-change:transform,opacity;opacity:0}
.mit-fahrt .bruecke>.br-hinten,.mit-fahrt .bruecke>.br-wasser,.mit-fahrt .bruecke>.br-steg,.mit-fahrt .bruecke>.br-gehen{right:auto}
.mit-fahrt .br-hinten{top:0;height:var(--alt-h);width:var(--alt-w);overflow:visible;will-change:transform}
.mit-fahrt .br-hinten img{width:100%;height:100%}
.mit-fahrt .br-wasser{top:calc(var(--alt-h) - 12px);bottom:0;height:auto;right:0}
.mit-fahrt .br-steg{top:auto;bottom:0;height:var(--steg-h);overflow:visible;will-change:transform}
.mit-fahrt .br-gehen{inset:0;height:auto}
.mit-fahrt .geher{left:0;top:0;bottom:auto;height:var(--geh-h);will-change:transform}
.mit-fahrt .geher img+img{display:block}
.mit-fahrt .geher img{opacity:0}
.mit-fahrt .geher img.an{opacity:1}
.mit-fahrt .br-karte{position:absolute;opacity:0;width:min(31rem,calc(100% - 2 * var(--rand)))}
.mit-fahrt .br-karte-1{left:max(var(--rand),env(safe-area-inset-left,0px));top:clamp(20px,6%,64px)}
.mit-fahrt .br-karte-2{right:max(var(--rand),env(safe-area-inset-right,0px));top:clamp(20px,6%,64px)}
.mit-fahrt .turm{position:absolute;left:0;top:0;width:2000px;height:auto;max-width:none;transform-origin:0 0;will-change:transform,opacity}
@media (max-width:879.98px){
  /* Bühne endet über der Knopfleiste; das Fenster füllt den Platz unter dem Text */
  .mit-fahrt .buehne{height:calc(100svh - var(--kopf) - 70px - env(safe-area-inset-bottom,0px))}
  .mit-fahrt .hero,.mit-fahrt .ankunft{height:100%}
  .mit-fahrt .hero-bild{flex:1 1 auto;aspect-ratio:auto;max-height:none;min-height:180px}
  .mit-fahrt .br-karte-1,.mit-fahrt .br-karte-2{left:16px;right:16px;width:auto;top:14px}
  .mit-fahrt .gw-text{bottom:4%}
}

/* ---------- Tafel ---------- */
.tafel-abschnitt{padding:clamp(3rem,2rem + 4vw,6rem) max(var(--rand),env(safe-area-inset-right,0px)) clamp(3.5rem,2rem + 5vw,7rem) max(var(--rand),env(safe-area-inset-left,0px))}
.brett{max-width:1160px;margin-inline:auto;position:relative;background:var(--tafel);color:var(--kalk);border:clamp(8px,1.4vw,14px) solid var(--lauge);box-shadow:inset 0 0 0 3px var(--kruste),0 30px 60px -40px rgba(35,32,29,.7);padding:clamp(1.75rem,1rem + 3.4vw,4rem) clamp(1.25rem,.6rem + 3.4vw,4rem)}
.brett-kopf{display:grid;gap:14px;max-width:60ch}
.brett h2{font:800 clamp(2.4rem,1.7rem + 2.8vw,4rem)/1 var(--f-titel);color:var(--kalk)}
.brett-kopf p{font-size:clamp(1.0625rem,1rem + .3vw,1.25rem);line-height:1.45}
.karte{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(2rem,1.2rem + 3vw,4.5rem);margin-top:clamp(2rem,1.5rem + 2vw,3.25rem)}
.karte h3{font:700 clamp(1.5rem,1.3rem + .8vw,1.875rem)/1.1 var(--f-titel);color:var(--ocker)}
.karte h3 small{display:block;margin-top:.35em;font:400 .9375rem/1.4 var(--f-text);color:#D8D1C5}
.posten{list-style:none;margin:1.1rem 0 0;padding:0;display:grid}
.posten li{display:grid;grid-template-columns:auto 1fr auto;align-items:baseline;column-gap:.7em;padding:.62em 0;border-bottom:1px solid rgba(243,239,230,.08)}
.posten .name{font-weight:600}
.posten .strich{border-bottom:2px dotted var(--kreide-linie);transform:translateY(-.3em);min-width:1.5em}
.posten .preis{font-weight:700;color:var(--ocker);white-space:nowrap}
.posten .zusatz{grid-column:1 / -1;font-size:.9375rem;color:#D3CCC0;margin-top:.1em}
.brett-fuss{margin-top:clamp(2rem,1.5rem + 1.5vw,3rem);padding-top:1.25rem;border-top:1px solid var(--kreide-linie);display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;font-size:.9375rem;color:var(--ocker)}
.brett-fuss .gruss{font:700 1.5rem/1.2 var(--f-titel);color:var(--kalk);margin-right:auto}
@media (max-width:760px){.karte{grid-template-columns:minmax(0,1fr)}}

/* ---------- Fuß ---------- */
.fuss{background:var(--tusche);color:var(--kalk);padding:clamp(3rem,2rem + 3vw,5rem) max(var(--rand),env(safe-area-inset-right,0px)) 2rem max(var(--rand),env(safe-area-inset-left,0px))}
.fuss-innen{max-width:1160px;margin-inline:auto;display:grid;grid-template-columns:1.1fr 1fr 1fr 1fr;gap:clamp(1.75rem,1rem + 2.5vw,3.5rem)}
.fuss h2{font:700 1.375rem/1.1 var(--f-titel);color:var(--ocker);margin-bottom:.8rem}
.fuss p+p{margin-top:.5rem}
.fuss-weg{color:#CFC8BC;font-size:.9375rem}
.fuss .knopf{margin-top:1rem;border-color:var(--kalk);color:var(--kalk)}
.fuss .knopf:hover{background:var(--kalk);color:var(--tusche)}
.fuss-signet{width:84px;height:auto;color:var(--senf)}
.claim{font:800 1.75rem/1.05 var(--f-titel);margin-top:1rem;max-width:9ch}
.zeiten{border-collapse:collapse;font-size:.9375rem;width:100%;max-width:18rem}
.zeiten th,.zeiten td{text-align:left;font-weight:400;padding:.28em 0}
.zeiten td{text-align:right;font-variant-numeric:tabular-nums}
.zeiten tr.heute{color:var(--ocker);font-weight:700}
.zeiten tr.heute th,.zeiten tr.heute td{font-weight:700}
.fuss-klein{max-width:1160px;margin:clamp(2.5rem,2rem + 2vw,4rem) auto 0;padding-top:1.25rem;border-top:1px solid rgba(243,239,230,.16);font-size:.875rem;color:#CFC8BC;display:flex;flex-wrap:wrap;gap:.4rem 1.4rem}
.fuss ::selection{background:var(--senf);color:var(--tusche)}
@media (max-width:980px){.fuss-innen{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.fuss-innen{grid-template-columns:minmax(0,1fr)}}

/* Ohne Bewegung: kein Video, keine Fahrt */
@media (prefers-reduced-motion:reduce){
  .lauf{display:none}
  .knopf,.knopf:hover{transition:none;transform:none}
  .nav a{transition:none}
}

/* ---------- Gewölbe anfragen, als Fenster über der Seite ---------- */
.anfrage{width:min(680px,calc(100vw - 24px));max-height:calc(100svh - 24px);padding:0;border:2px solid var(--tusche);background:var(--kalk);color:var(--tusche);overflow:auto;overscroll-behavior:contain}
.anfrage::backdrop{background:rgba(35,32,29,.6)}
html:has(.anfrage[open]){overflow:hidden}
.anfrage-innen{position:relative;display:grid;gap:1rem;padding:clamp(22px,4vw,44px)}
.anfrage-innen>*,.formular>*{min-width:0}
.anfrage h2{padding-right:48px;font:800 clamp(2rem,1.55rem + 1.8vw,2.9rem)/1 var(--f-titel)}
.anfrage-innen>p{max-width:56ch}
.zu{position:absolute;top:10px;right:10px;width:44px;height:44px;display:grid;place-items:center;background:none;border:0;color:var(--tusche);cursor:pointer}
.zu svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round}
.zu:hover{background:var(--putz)}
.anruf-zeile{font-size:.9375rem}
.anruf-zeile a{font-weight:700;display:inline-block;padding-block:8px}
.formular{display:grid;gap:1rem;margin-top:.4rem}
.feldgruppe{display:grid;gap:1rem}
@media (min-width:560px){.feldgruppe.zwei{grid-template-columns:1fr 1fr}.feldgruppe.drei{grid-template-columns:1.3fr 1fr .8fr}}
.feld{display:grid;gap:.4rem;min-width:0}
.feld label{font:650 .9375rem/1.2 var(--f-text)}
.feld label span{font-weight:400;color:var(--stoa)}
.feld input,.feld select,.feld textarea{width:100%;font:400 1rem/1.4 var(--f-text);color:var(--tusche);background:#FBF9F4;border:2px solid var(--tusche);border-radius:0;padding:.75em .85em;min-height:50px;transition:border-color .2s,box-shadow .3s var(--aus)}
.feld textarea{min-height:96px;resize:vertical}
.feld select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--tusche) 50%),linear-gradient(135deg,var(--tusche) 50%,transparent 50%);background-position:calc(100% - 22px) 52%,calc(100% - 16px) 52%;background-size:6px 6px;background-repeat:no-repeat;padding-right:2.5em}
.feld input:focus-visible,.feld select:focus-visible,.feld textarea:focus-visible{outline:none;border-color:var(--senfkorn);box-shadow:0 0 0 4px rgba(194,158,79,.45)}
.feld input::placeholder,.feld textarea::placeholder{color:#7A7268}
.feld [aria-invalid="true"]{border-color:var(--brezn);box-shadow:0 0 0 3px rgba(122,63,39,.18)}
.fehler{font-size:.9375rem;color:var(--brezn);font-weight:600}
.fehler:empty{display:none}
.honig{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.formular .knopf{justify-self:start}
.formular .knopf[disabled]{opacity:.55;cursor:progress;transform:none;box-shadow:none}
.formular-hinweis{font-size:.8125rem;color:var(--stoa)}
.antwort{padding:1rem 1.1rem;background:var(--schaum);outline:2px solid var(--senf);font-size:.9375rem}
.antwort b{font-family:var(--f-titel);font-size:1.3rem;font-weight:800;display:block;margin-bottom:.2rem}