/* Provence Vaucluse, statische Fassung, V1.0 */

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  padding-top:94px;
  background:#eeeeee;
  color:#616161;
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif;
  font-size:16px;
  line-height:1.65;
  min-height:100vh;
  display:flex;
  flex-direction:column;
}
#content-wrap{flex:1 0 auto}
#footer-bottom{flex-shrink:0}
img{border:0;max-width:100%;height:auto;display:block}
a{color:#570be5;text-decoration:none}
a:hover{text-decoration:underline}

.container{width:980px;max-width:90%;margin:0 auto}

/* Kopfbereich */
#site-header{position:fixed;top:0;left:0;right:0;z-index:100;background:#c7c7f9;padding:30px 0}
#site-header-inner{display:flex;align-items:center;justify-content:space-between;gap:20px}
#site-logo img{width:203px;height:34px}
#site-navigation ul{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:29px}
#site-navigation a{display:block;padding:0 4px;font-size:16px;color:#616161;font-weight:400;white-space:nowrap}
#site-navigation a:hover{color:#570be5;text-decoration:none}
#site-navigation .current-menu-item a{color:#570be5;font-weight:700}
@media (max-width:1060px){#site-navigation ul{gap:18px}}

/* Inhalt */
#content-wrap{margin-top:40px}
#content-wrap .container{padding:30px 0}
.single-page-content h1{font-size:28px;font-weight:400;color:#4a4a4a;line-height:1.3;margin:0 0 18px}
.single-page-content h2{font-size:24px;font-weight:400;color:#4a4a4a;line-height:1.3;margin:32px 0 16px}
.single-page-content h2:first-child{margin-top:0}
.single-page-content h3{font-size:20px;font-weight:400;color:#4a4a4a;line-height:1.35;margin:26px 0 10px}
.single-page-content h4{font-size:17px;font-weight:700;color:#4a4a4a;line-height:1.4;margin:20px 0 8px}
.single-page-content p{margin:0 0 20px}
.single-page-content ul{margin:0 0 24px;padding-left:46px}
.single-page-content ul li{margin:0 0 2px}
.single-page-content ul.kreis{list-style:circle}

/* Bildfolge */
.bildfolge{position:relative;width:100%;aspect-ratio:980/735;overflow:hidden;background:#000;margin:0 0 20px}
.bildfolge.quer{aspect-ratio:1.41}
.bildfolge figure{position:absolute;inset:0;margin:0;opacity:0;transition:opacity .8s ease}
.bildfolge figure.aktiv{opacity:1}
.bildfolge img{width:100%;height:100%;object-fit:cover}
.bildfolge .steuerung{position:absolute;left:0;right:0;bottom:14px;display:flex;align-items:center;justify-content:center;gap:9px}
.bildfolge button{appearance:none;background:none;border:0;padding:0;cursor:pointer;color:#fff;line-height:1;font-family:inherit}
.bildfolge .weiter{font-size:19px;margin-right:6px;opacity:.85}
.bildfolge .pause{font-size:13px;letter-spacing:1px;margin-left:6px;opacity:.85}
.bildfolge .weiter:hover,.bildfolge .pause:hover{opacity:1}
.bildfolge .punkt{width:9px;height:9px;border-radius:50%;border:1px solid rgba(255,255,255,.9);background:transparent}
.bildfolge .punkt[aria-current="true"]{background:#fff}

/* Zwei Spalten, Räume und Ausstattung */
.raeume{display:grid;grid-template-columns:1fr 1fr;gap:0 40px}
.raeume .raum p{margin:0 0 20px}
@media (max-width:820px){.raeume{grid-template-columns:1fr}}

/* Karte */
figure.karte-block{margin:0 0 20px}
svg.karte{width:100%;height:auto;display:block}
figure.karte-block figcaption{font-size:14px;color:#8a8a8a;padding-top:8px}

/* Fußbereich */
#footer-bottom{background:#e6e6fa;color:#9e9e9e;text-align:center;padding:20px 0;font-size:14.77px;margin-top:30px}
#footer-bottom a{color:#777777}
#footer-bottom a:hover{color:#570be5}

#site-scroll-top{position:fixed;right:20px;bottom:20px;width:35px;height:35px;border-radius:9999px;background:#f7f7f7;color:#9e9e9e;display:flex;align-items:center;justify-content:center;font-size:15px;box-shadow:0 1px 3px rgba(0,0,0,.18)}
#site-scroll-top:hover{text-decoration:none}

@media (max-width:820px){
  body{padding-top:0}
  #site-header{position:static;padding:18px 0}
  #site-header-inner{flex-direction:column;gap:14px}
  #site-navigation ul{flex-wrap:wrap;justify-content:center;gap:8px 20px}
}
