/* Allgemeinmedizin Wolfurt - Minimalism nach Apple. Weisser Raum, grosse ruhige Schrift, randlose Bilder, ein Gelb nur im Pin. */
:root{
  --weiss:#FFFFFF;--hell:#F5F5F7;--tinte:#1D1D1F;--grau:#6E6E73;--grau-2:#86868B;--linie:#D2D2D7;--gelb:#FFBA02;
  --sans:'Inter Tight',-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;
  --breite:1180px;--rand:clamp(20px,4vw,44px);--rund:clamp(18px,2vw,28px);--kurve:cubic-bezier(.25,.1,.25,1)
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{overflow-x:clip}
body{background:var(--weiss);color:var(--tinte);font:400 clamp(16px,.35vw + 12px,19px)/1.5 var(--sans);letter-spacing:-.01em;-webkit-font-smoothing:antialiased;overflow-x:clip}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
button{font:inherit;color:inherit;cursor:pointer;border:0;background:none}
h1,h2{font-weight:600;letter-spacing:-.035em;line-height:1.04}
h2{font-size:clamp(40px,5.6vw,80px);margin-bottom:22px}
h3{font-size:clamp(22px,1.8vw,30px);font-weight:600;letter-spacing:-.025em;line-height:1.12;margin-bottom:10px}
.grau{color:var(--grau-2)}
.augenbraue{font-size:clamp(15px,1.1vw,19px);font-weight:600;letter-spacing:-.01em;margin-bottom:12px;color:var(--tinte)}
.mitte{text-align:center;max-width:900px;margin:0 auto clamp(40px,6vh,70px)}
.sprung{position:absolute;left:-999px;top:8px;z-index:200;padding:10px 16px;background:#fff;border-radius:10px}
.sprung:focus{left:8px}
:focus-visible{outline:2px solid #0071E3;outline-offset:3px}
html.js.wow [data-auf]{opacity:0;transform:translateY(30px)}
section,.raeume{padding-inline:var(--rand)}

/* Pillen */
.knoepfe{display:flex;flex-wrap:wrap;gap:12px}
.pille{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 22px;border-radius:999px;background:var(--tinte);color:#fff;font:500 16px var(--sans);text-decoration:none;white-space:nowrap;transition:background .2s,transform .2s var(--kurve)}
.pille:hover{background:#3A3A3C}
.pille:active{transform:scale(.97)}
.pille--hell{background:var(--hell);color:var(--tinte)}
.pille--hell:hover{background:#E8E8ED}
.pille--klein{min-height:32px;padding:0 14px;font-size:13px}

/* Kopf: lokale Apple-Leiste */
.kopf{position:fixed;z-index:50;top:0;left:0;right:0;background:rgba(255,255,255,.72);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);border-bottom:1px solid rgba(0,0,0,.08)}
.kopf__innen{max-width:var(--breite);margin:0 auto;height:52px;padding:0 var(--rand);display:flex;align-items:center;justify-content:space-between;gap:20px}
.kopf__marke{display:flex;align-items:center;gap:9px;text-decoration:none;font-size:clamp(16px,1.5vw,21px);font-weight:600;letter-spacing:-.02em}
.pin{width:10px;height:10px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:var(--gelb)}
.kopf__links{display:flex;gap:clamp(16px,2.4vw,30px);font-size:13px;margin-left:auto}
.kopf__links a{text-decoration:none;color:var(--tinte);opacity:.8}
.kopf__links a:hover{opacity:1}

/* Status */
.status{display:inline-flex;align-items:center;gap:8px;font-size:15px;color:var(--grau)}
.status i{width:8px;height:8px;border-radius:50%;background:var(--grau-2)}
.status[data-offen="ja"] i{background:#30D158;box-shadow:0 0 0 4px rgba(48,209,88,.18)}

/* I Anflug */
.anflug{position:relative;padding:0}
html.wow .anflug{height:320svh}
.anflug__buehne{position:relative;padding:calc(52px + clamp(30px,6vh,70px)) var(--rand) var(--rand)}
html.wow .anflug__buehne{position:sticky;top:0;height:100svh;overflow:hidden}
.anflug__kopf{max-width:var(--breite);margin:0 auto clamp(22px,4vh,40px);display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:24px 40px;position:relative;z-index:2}
.anflug h1{font-size:clamp(44px,6.4vw,96px)}
.zeile{display:block}
.anflug__aktion{display:flex;flex-direction:column;align-items:flex-start;gap:16px;padding-bottom:8px}
.rahmen{position:relative;height:clamp(300px,52svh,640px);border-radius:var(--rund);overflow:hidden;background:var(--hell)}
html.wow .rahmen{position:absolute;inset:0;height:auto;border-radius:0}
.rahmen img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.rahmen__luft{object-position:68.5% 42%;transform-origin:68.5% 64.5%}
.rahmen__tuer{opacity:0}
html:not(.wow) .rahmen__tuer{display:none}
.rahmen__schild{position:absolute;left:var(--rand);bottom:var(--rand);max-width:min(420px,calc(100% - 2 * var(--rand)));padding:20px 24px;border-radius:20px;background:rgba(255,255,255,.78);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);font-size:15px;color:var(--grau)}
.rahmen__schild b{display:block;font-size:clamp(22px,2vw,30px);font-weight:600;letter-spacing:-.025em;color:var(--tinte);margin-bottom:4px}
html.wow .rahmen__schild{opacity:0}

/* Zahlen */
.zahlen{max-width:var(--breite);margin:0 auto;padding-block:clamp(70px,12vh,140px);display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(20px,3vw,50px);box-sizing:content-box}
.zahl{border-top:1px solid var(--linie);padding-top:20px}
.zahl__klein{font-size:14px;color:var(--grau);line-height:1.35}
.zahl__gross{font-size:clamp(30px,3.4vw,54px);white-space:nowrap;font-weight:600;letter-spacing:-.04em;line-height:1.05;margin:6px 0}

/* II Aerzte */
.aerzte{background:var(--hell);padding-block:clamp(80px,14vh,160px)}
.schieber{position:relative;max-width:var(--breite);margin:0 auto;aspect-ratio:1860/1193;border-radius:var(--rund);overflow:hidden;touch-action:pan-y;user-select:none;cursor:ew-resize;background:#e5e5ea}
.schieber__bild{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}
.schieber__oben{position:absolute;inset:0;clip-path:inset(0 calc(100% - var(--teil)) 0 0)}
.schieber__griff{position:absolute;top:0;bottom:0;left:var(--teil);width:2px;margin-left:-1px;background:rgba(255,255,255,.9)}
.schieber__griff span{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:rgba(255,255,255,.85);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 6px 24px rgba(0,0,0,.18)}
.schieber__griff svg{width:22px;height:22px;fill:none;stroke:var(--tinte);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.schieber__name{position:absolute;bottom:clamp(14px,2vw,26px);padding:7px 14px;border-radius:999px;background:rgba(255,255,255,.82);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);font-size:clamp(12px,1vw,15px);font-weight:500}
.schieber__name--l{left:clamp(14px,2vw,26px)}
.schieber__name--r{right:clamp(14px,2vw,26px)}
.aerzte__hinweis{text-align:center;font-size:14px;color:var(--grau);margin:18px 0 0}
.lebenslauf{max-width:var(--breite);margin:clamp(50px,8vh,90px) auto 0;display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,80px)}
.lebenslauf .grau{margin-bottom:18px}
.lebenslauf ul{list-style:none}
.lebenslauf li{padding:12px 0;border-top:1px solid var(--linie);font-size:16px}

/* III Leistungen */
.leistungen{padding-block:clamp(80px,14vh,160px)}
.kacheln{max-width:var(--breite);margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.6vw,22px)}
.kachel{background:var(--hell);border-radius:var(--rund);padding:clamp(26px,2.8vw,44px);min-height:clamp(220px,20vw,300px);display:flex;flex-direction:column;justify-content:flex-end}
.kachel .augenbraue{color:var(--grau);font-size:14px;margin-bottom:auto;padding-bottom:30px}
.kachel h3{font-size:clamp(24px,2.2vw,36px)}
.kachel p:not(.augenbraue){color:var(--grau);font-size:16px}
.kachel--breit{grid-column:span 2}
.kachel--dunkel{background:var(--tinte);color:#F5F5F7}
.kachel--dunkel .augenbraue,.kachel--dunkel p:not(.augenbraue){color:#A1A1A6}

/* IV Team: steht, Text laeuft darueber */
.team{position:relative;padding:0}
.team__buehne{position:relative;height:100svh;overflow:hidden}
html.wow .team__buehne{position:sticky;top:0}
.team__buehne img{width:100%;height:100%;object-fit:cover;object-position:50% 35%}
.team__text{position:relative;max-width:560px;margin:-40svh var(--rand) 40svh auto;padding:clamp(28px,3vw,48px);border-radius:var(--rund);background:rgba(255,255,255,.8);-webkit-backdrop-filter:saturate(180%) blur(24px);backdrop-filter:saturate(180%) blur(24px);z-index:2}
html.wow .team__text{margin-top:-60svh;margin-bottom:60svh}
.team__text h2{font-size:clamp(36px,4vw,60px)}
.team__text p:not(.augenbraue){color:var(--grau)}
.raeume{max-width:var(--breite);box-sizing:content-box;margin:clamp(30px,6vh,70px) auto clamp(80px,14vh,160px);display:grid;grid-template-columns:1fr 1fr;gap:clamp(14px,1.6vw,22px)}
.raeume img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--rund)}
.raeume figcaption{font-size:14px;color:var(--grau);margin-top:12px}

/* V Rezept */
.rezept{background:var(--hell);padding-block:clamp(80px,14vh,160px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(30px,6vw,100px);align-items:start}
.rezept > *{max-width:560px}
.rezept__text{justify-self:end}
.rezept__text p:not(.augenbraue){color:var(--grau)}
.regeln{list-style:none;margin-top:26px}
.regeln li{padding:14px 0;border-top:1px solid var(--linie);font-size:15px}
.formular{background:var(--weiss);border-radius:var(--rund);padding:clamp(24px,2.8vw,44px);display:grid;gap:16px;width:100%}
.formular__zwei{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.formular label{display:grid;gap:6px;font-size:13px;font-weight:500;color:var(--grau)}
.formular input:not([type=checkbox]),.formular textarea{width:100%;padding:13px 14px;border:1px solid var(--linie);border-radius:12px;background:var(--weiss);font:400 17px var(--sans);color:var(--tinte);resize:vertical;transition:border-color .2s,box-shadow .2s}
.formular input:focus,.formular textarea:focus{outline:none;border-color:#0071E3;box-shadow:0 0 0 4px rgba(0,113,227,.15)}
.formular [aria-invalid="true"]{border-color:#E30000}
.formular__schema{font-size:13px;color:var(--grau-2);margin-top:-6px}
.haken{display:flex!important;align-items:flex-start;gap:10px!important;font-size:14px!important;line-height:1.45}
.haken input{width:20px;height:20px;flex:none;accent-color:var(--tinte);margin-top:1px}
.formular .pille{justify-self:start}
.formular__antwort{padding:14px 16px;border-radius:12px;background:var(--hell);font-size:15px}

/* VI Zeiten */
.zeiten{padding-block:clamp(80px,14vh,160px)}
.zeiten .status{margin-top:4px}
.tabelle{list-style:none;max-width:760px;margin:0 auto}
.tabelle li{display:flex;justify-content:space-between;gap:20px;padding:20px 4px;border-top:1px solid var(--linie);font-size:clamp(17px,1.4vw,22px)}
.tabelle li:last-child{border-bottom:1px solid var(--linie)}
.tabelle b{font-weight:600}
.tabelle span{color:var(--grau);text-align:right}
.tabelle li.zu span,.tabelle li.zu b{color:var(--grau-2);font-weight:400}
.tabelle li[data-heute="ja"] b::after{content:"Heute";margin-left:12px;padding:3px 10px;border-radius:999px;background:var(--tinte);color:#fff;font-size:12px;font-weight:500;vertical-align:middle}
.tabelle li[data-heute="ja"] span{color:var(--tinte)}
.zeiten__fuss{text-align:center;margin-top:22px;font-size:14px;color:var(--grau)}

/* VII Kontakt */
.kontakt{max-width:var(--breite);box-sizing:content-box;margin:0 auto;padding-block:0 clamp(80px,14vh,160px);display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,2vw,30px)}
.kontakt__karte,.kontakt__seite{background:var(--hell);border-radius:var(--rund);padding:clamp(28px,3.4vw,56px)}
.kontakt__karte h2{font-size:clamp(34px,3.8vw,56px)}
.kontakt__karte .grau{margin-bottom:28px}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:34px}
.chips button{min-height:40px;padding:0 18px;border-radius:999px;background:var(--weiss);font-size:15px;font-weight:500;border:1px solid var(--linie);transition:border-color .2s}
.chips button:hover{border-color:var(--tinte)}
.links{list-style:none}
.links a{display:block;padding:12px 0;border-top:1px solid var(--linie);text-decoration:none;color:#0066CC;font-size:16px}
.links a:hover{text-decoration:underline}

/* Fuss */
.fuss{background:var(--hell);border-top:1px solid var(--linie)}
.fuss__innen{max-width:var(--breite);margin:0 auto;padding:26px var(--rand) 40px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:14px;font-size:12px;line-height:1.6;color:var(--grau)}
.fuss b{color:var(--tinte);font-weight:600}

/* Chat */
[data-bot]{position:fixed;z-index:60;right:max(18px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom))}
.bot__auf{display:flex;align-items:center;gap:10px;min-height:50px;padding:0 20px 0 16px;border-radius:999px;background:var(--tinte);color:#fff;font:500 15px var(--sans);box-shadow:0 10px 30px rgba(0,0,0,.2);transition:opacity .3s,transform .3s var(--kurve)}
.bot__auf i{position:relative;width:10px;height:10px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:var(--gelb)}
html.im-held .bot__auf{opacity:0;transform:translateY(130%);pointer-events:none}
[data-bot][data-offen="ja"] .bot__auf{display:none}
.bot__fenster{position:absolute;right:0;bottom:0;width:min(400px,calc(100vw - 36px));height:min(620px,calc(100svh - 36px));display:flex;flex-direction:column;overflow:hidden;border-radius:24px;background:rgba(255,255,255,.92);-webkit-backdrop-filter:saturate(180%) blur(24px);backdrop-filter:saturate(180%) blur(24px);box-shadow:0 24px 70px rgba(0,0,0,.22)}
.bot__fenster[hidden]{display:none!important}
.bot__kopf{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid rgba(0,0,0,.08)}
.bot__wer{display:flex;flex-direction:column;gap:2px}
.bot__wer b{font-size:17px;font-weight:600}
.bot__wer small{font-size:12px;color:var(--grau)}
.bot__zu{width:32px;height:32px;border-radius:50%;background:var(--hell);font-size:20px;line-height:1}
.bot__lauf{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:16px;display:flex;flex-direction:column;gap:8px}
.bot__blase{max-width:84%;padding:10px 14px;border-radius:18px;font-size:15px;line-height:1.45}
.bot__blase--bot{align-self:flex-start;background:#E9E9EB;border-bottom-left-radius:6px}
.bot__blase--ich{align-self:flex-end;background:#0071E3;color:#fff;border-bottom-right-radius:6px}
.bot__blase a{color:inherit}
.bot__blase small{display:block;margin-top:8px;color:var(--grau)}
.bot__zettel{display:block;margin:8px 0 4px;padding:12px 14px;border-radius:12px;background:#fff;line-height:1.6}
.bot__punkte{display:inline-flex;gap:5px}
.bot__punkte i{width:6px;height:6px;border-radius:50%;background:var(--grau-2);animation:tippen 1s infinite ease-in-out}
.bot__punkte i:nth-child(2){animation-delay:.15s}.bot__punkte i:nth-child(3){animation-delay:.3s}
@keyframes tippen{0%,100%{opacity:.3}50%{opacity:1}}
.bot__chips{display:flex;flex-wrap:wrap;gap:8px}
.bot__chips button{padding:8px 14px;border-radius:999px;border:1px solid #0071E3;color:#0071E3;background:#fff;font-size:14px;font-weight:500}
.bot__chips button:hover{background:#0071E3;color:#fff}
.bot__fuss{display:flex;gap:8px;padding:10px 12px;border-top:1px solid rgba(0,0,0,.08)}
.bot__eingabe{flex:1;min-width:0;height:40px;padding:0 16px;border-radius:999px;border:1px solid var(--linie);background:#fff;font:400 16px var(--sans)}
.bot__senden{width:40px;height:40px;border-radius:50%;background:#0071E3;color:#fff;font-size:17px}
.bot__hinweis{margin:0;padding:0 16px 12px;font-size:12px;color:var(--grau)}

/* Unterseiten */
body > main:not(#inhalt){max-width:760px;margin:0 auto;padding:130px var(--rand) 80px}
body > main:not(#inhalt) h1{font-size:clamp(44px,6vw,80px);margin-bottom:30px}
body > main:not(#inhalt) h2{font-size:26px;margin:30px 0 8px}
body > main:not(#inhalt) p{margin-bottom:14px}

@media (max-width:1000px){
  .zahlen{grid-template-columns:repeat(2,1fr)}
  .kacheln{grid-template-columns:repeat(2,1fr)}
  .kachel--breit{grid-column:span 2}
}
@media (max-width:760px){
  .kopf__links{display:none}
  .anflug h1{font-size:clamp(38px,11vw,56px)}
  .anflug__aktion{width:100%}
  .lebenslauf,.raeume,.rezept,.kontakt,.formular__zwei{grid-template-columns:1fr}
  .rezept__text{justify-self:stretch}
  .kacheln{grid-template-columns:1fr}
  .kachel--breit{grid-column:auto}
  .kachel{min-height:0}
  .schieber{aspect-ratio:4/5}
  .team__text{margin:-30svh var(--rand) 40px}
  html.wow .team__text{margin-top:-60svh;margin-bottom:60svh}
  .tabelle li{flex-direction:column;gap:2px}
  .tabelle span{text-align:left}
  .bot__fenster{position:fixed;inset:0;width:100%;height:100dvh;border-radius:0}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
