@import url('https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@300;400&family=Open+Sans:wght@400;600&display=swap');
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:#fff;color:#333;font-family:"Open Sans",Arial,sans-serif;font-size:13px;line-height:1.48}
.site{width:min(920px,calc(100% - 40px));margin:0 auto}
header{text-align:center;padding:28px 0 27px}
.brand{font-family:"Josefin Sans",Arial,sans-serif;font-weight:300;font-size:42px;letter-spacing:7px;color:#555;line-height:1.1}
.tagline{margin-top:9px;color:#999;font-family:Georgia,serif;font-style:italic;font-size:12px}
.tagline:before,.tagline:after{content:"";display:inline-block;width:28px;border-top:1px solid #ddd;margin:0 9px 4px}
nav{border-top:1px solid #555;border-bottom:1px solid #999;display:flex;justify-content:center}
nav a{color:#333;text-decoration:none;text-transform:uppercase;letter-spacing:1.3px;font-size:11px;padding:17px 24px;white-space:nowrap}
nav a:hover,nav a.active{background:#f1f1f1}
main{padding:34px 0 48px;border-bottom:1px solid #999}
.layout{display:grid;grid-template-columns:minmax(0,1fr) 214px;gap:28px}
h1{font-family:"Josefin Sans",Arial,sans-serif;font-weight:400;font-size:21px;letter-spacing:1px;margin:5px 0 9px;color:#222}
p{margin:0 0 11px}ul{margin:7px 0 13px;padding-left:22px}li{margin:1px 0}
.sidebar img{display:block;width:100%;height:auto;margin:0 0 27px}
.hero{display:block;width:100%;height:auto}
.gallery{display:grid;grid-template-columns:repeat(5,1fr);gap:3px}
.gallery a{display:block;line-height:0}.gallery img{width:100%;aspect-ratio:1.65/1;object-fit:cover}
footer{text-align:center;padding:39px 0 45px;color:#777;font-size:11px}
.contact-map{display:block;width:100%;max-width:500px;margin-top:14px}.contact-map img{width:100%;height:auto;display:block}
.booking{margin-top:18px}.booking iframe{width:100%;border:0;min-height:460px}
@media(max-width:760px){
.site{width:min(100% - 24px,620px)}
header{padding:18px 0 16px}
.brand{font-size:23px;letter-spacing:3px;white-space:nowrap}
.tagline{margin-top:7px;font-size:11px}
.tagline:before,.tagline:after{width:20px;margin:0 7px 4px}

nav{
display:block;
position:relative;
overflow:visible;
}
nav .mobile-menu-toggle{
display:block;
width:100%;
border:0;
background:#f1f1f1;
color:#333;
font-family:"Open Sans",Arial,sans-serif;
font-size:11px;
letter-spacing:1.5px;
padding:13px 15px;
cursor:pointer;
text-align:center;
}
nav a{
display:none;
padding:13px 15px;
font-size:10px;
text-align:center;
border-top:1px solid #e5e5e5;
}
nav.mobile-open a{
display:block;
}
nav a:hover,nav a.active{
background:#f1f1f1;
}
.layout{grid-template-columns:1fr}
.sidebar{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.sidebar img{margin:0}
.gallery{grid-template-columns:repeat(2,1fr)}
}

@media(min-width:761px){
nav .mobile-menu-toggle{display:none}
}
@media(max-width:460px){.gallery{grid-template-columns:repeat(2,1fr)}body{font-size:13px}}

/* Lightbox galerie */
body.lightbox-open{overflow:hidden}
.lightbox{
  position:fixed;
  inset:0;
  z-index:9999;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:55px 75px;
  background:rgba(0,0,0,.88);
  opacity:0;
  visibility:hidden;
  transition:opacity .25s ease,visibility .25s ease;
}
.lightbox.is-open{opacity:1;visibility:visible}
.lightbox-figure{
  margin:0;
  max-width:min(92vw,1200px);
  max-height:88vh;
  display:flex;
  align-items:center;
  justify-content:center;
}
.lightbox-figure img{
  display:block;
  max-width:100%;
  max-height:88vh;
  width:auto;
  height:auto;
  object-fit:contain;
  opacity:0;
  transform:scale(.96);
  transition:opacity .28s ease,transform .28s ease;
  box-shadow:0 4px 35px rgba(0,0,0,.45);
}
.lightbox-figure img.is-visible{opacity:1;transform:scale(1)}
.lightbox-figure img.slide-left{transform:translateX(-22px) scale(.97)}
.lightbox-figure img.slide-right{transform:translateX(22px) scale(.97)}
.lightbox-close,.lightbox-prev,.lightbox-next{
  position:absolute;
  z-index:2;
  border:0;
  background:transparent;
  color:#fff;
  cursor:pointer;
  font-family:Arial,sans-serif;
  font-weight:300;
  text-shadow:0 1px 4px rgba(0,0,0,.5);
  transition:opacity .2s ease,transform .2s ease;
}
.lightbox-close{
  top:10px;
  right:20px;
  font-size:42px;
  line-height:1;
  width:48px;
  height:48px;
}
.lightbox-prev,.lightbox-next{
  top:50%;
  transform:translateY(-50%);
  font-size:64px;
  line-height:1;
  width:60px;
  height:90px;
}
.lightbox-prev{left:15px}
.lightbox-next{right:15px}
.lightbox-close:hover,.lightbox-prev:hover,.lightbox-next:hover{
  opacity:.7;
}
.lightbox-counter{
  position:absolute;
  bottom:17px;
  left:50%;
  transform:translateX(-50%);
  color:#fff;
  font-size:12px;
  letter-spacing:1px;
  opacity:.8;
}
@media(max-width:760px){
  .lightbox{padding:45px 38px}
  .lightbox-figure,.lightbox-figure img{max-width:100%;max-height:82vh}
  .lightbox-prev,.lightbox-next{font-size:48px;width:42px}
  .lightbox-prev{left:0}.lightbox-next{right:0}
  .lightbox-close{right:8px;top:6px;font-size:36px}
}
@media(prefers-reduced-motion:reduce){
  .lightbox,.lightbox-figure img{transition:none}
}

.reservation-title{
  font-family:"Josefin Sans",Arial,sans-serif;
  font-weight:400;
  font-size:18px;
  letter-spacing:1px;
  color:#222;
  margin:28px 0 14px;
}
.reservation-form{
  min-height:180px;
  width:100%;
}
.reservation-form:empty{
  min-height:0;
}

.layout a{color:#555;text-decoration:underline}.layout a:hover{color:#222}