:root{
  --red:#a80000;
  --red-dark:#910000;
  --bg:#efefef;
  --text:#4a4a4a;
  --heading:#a80000;
  --line:#dcdde1;
  --white:#fff;
  --content:1020px;
  --narrow:880px;
}

*,
*::before,
*::after{box-sizing:border-box}

html,body{
  margin:0;
  padding:0;
  background:var(--bg);
  color:var(--text);
}

body{
  font-family: Arial, Helvetica, sans-serif;
  font-size:18px;
  line-height:1.75;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
a:hover{text-decoration:underline}

.wrapper{
  max-width:var(--content);
  margin:0 auto;
  padding:0 22px;
}

.narrow{
  max-width:var(--narrow);
  margin:0 auto;
}

.site-header{
  background:var(--red);
  color:var(--white);
  position:sticky;
  top:0;
  z-index:30;
}

.site-header .bar{
  height:74px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
}

.brand a{
  color:var(--white);
  font-size:22px;
  font-weight:400;
  letter-spacing:.01em;
}

.nav{
  display:flex;
  align-items:center;
  gap:30px;
}

.nav-links{
  display:flex;
  align-items:center;
  gap:28px;
}

.nav-links a{
  color:var(--white);
  font-size:18px;
  line-height:1;
  padding-top:2px;
  border-bottom:2px solid transparent;
}

.nav-links a[aria-current="page"]{
  border-bottom-color:var(--white);
}

.reserve-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:138px;
  height:40px;
  padding:0 18px;
  border-radius:4px;
  background:#f4f4f4;
  color:#555;
  font-size:17px;
}
.reserve-btn:hover{text-decoration:none}

.menu-toggle{
  display:none;
  width:40px;
  height:40px;
  background:transparent;
  border:0;
  color:var(--white);
  font-size:28px;
  cursor:pointer;
}

.hero-image img{
  width:100%;
  height:min(430px, 31vw);
  object-fit:cover;
}

main{padding:0}

.content-block{
  padding:62px 0;
}

.content-block h1,
.content-block h2{
  color:var(--heading);
  font-weight:400;
  letter-spacing:.01em;
}

.content-block h1{
  font-size:34px;
  line-height:1.3;
  margin:0 0 30px;
  text-align:center;
}

.content-block h2{
  font-size:22px;
  line-height:1.4;
  margin:0 0 18px;
}

.lead{
  max-width:760px;
  font-size:19px;
  line-height:1.8;
  color:#4f4f4f;
  margin:0 auto;
}

.lead p{margin:0 0 18px}

.intro-cta{
  margin-top:28px;
  text-align:left;
}

.cta{
  display:inline-block;
  background:var(--red);
  color:var(--white);
  padding:12px 18px;
  font-size:14px;
  border-radius:3px;
}
.cta:hover{
  background:var(--red-dark);
  text-decoration:none;
}

.gallery-band{
  background:var(--red);
  color:var(--white);
  padding:28px 0 32px;
}

.gallery-top{
  display:grid;
  grid-template-columns:repeat(5, minmax(0,1fr));
  gap:14px;
}

.gallery-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:12px;
}

.figure{margin:0}

.figure img{
  width:100%;
  object-fit:cover;
  background:#b33;
}

.gallery-top .figure img{aspect-ratio:1 / 0.82}
.gallery-grid .figure img{aspect-ratio:1 / 0.72}

.figure figcaption{
  margin-top:10px;
  font-size:15px;
  line-height:1.45;
  color:var(--white);
}

.info-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:54px;
}

.info-grid p, .contact-grid p{
  margin:0 0 14px;
  font-size:17px;
  line-height:1.8;
}

.info-grid ul{
  margin:6px 0 18px 24px;
  padding:0;
  font-size:17px;
  line-height:1.75;
}

.info-grid li{margin:0 0 4px}
.info-grid strong,
.contact-grid strong,
.text-page strong{font-weight:700}

.contact-grid{
  display:grid;
  grid-template-columns:2fr 1fr 1fr 1fr;
  gap:34px;
  align-items:start;
}

.map-holder{
  grid-column:1 / -1;
  margin:6px 0 14px;
}

.map-holder img,
.map-holder iframe{
  width:100%;
  border:0;
  display:block;
}

.legal-note{
  font-size:14px;
  line-height:1.7;
  color:#666;
  margin:0 0 14px;
}

.page-wrap{
  padding:66px 0 44px;
}

.page-wrap h1{
  color:var(--heading);
  font-weight:400;
  font-size:34px;
  margin:0 0 16px;
}

.page-subtitle{
  font-size:19px;
  line-height:1.7;
  margin:0 0 30px;
}

.rules{
  border-top:1px solid var(--line);
}

.rule-row{
  display:grid;
  grid-template-columns:1fr 1.35fr;
  gap:52px;
  padding:28px 0 24px;
  border-top:1px solid var(--line);
}

.rule-row:first-child{border-top:0}

.rule-title{
  color:var(--heading);
  font-size:24px;
  line-height:1.5;
}

.rule-body{
  font-size:18px;
  line-height:1.85;
}

.rule-body p{margin:0}

.site-footer{
  background:var(--red);
  color:var(--white);
  margin-top:0;
  padding:40px 0 50px;
}

.site-footer .inner{
  display:flex;
  justify-content:space-between;
  gap:24px;
}

.footer-links,
.footer-legal{
  display:flex;
  flex-direction:column;
  gap:14px;
}

.site-footer a{
  font-size:15px;
  color:var(--white);
  text-decoration:underline;
  line-height:1.5;
}

.site-footer a:hover{text-decoration:none}

.text-page{max-width:860px}
.text-page p{
  font-size:18px;
  line-height:1.8;
  margin:0 0 16px;
}
.text-page h3{
  color:var(--heading);
  font-weight:400;
  font-size:22px;
  margin:24px 0 12px;
}

@media (max-width: 1100px){
  body{font-size:17px}
  .brand a{font-size:20px}
  .nav-links a{font-size:16px}
  .reserve-btn{font-size:16px}
  .lead{font-size:18px}
  .info-grid p, .contact-grid p, .info-grid ul, .rule-body, .text-page p{font-size:16px}
  .figure figcaption{font-size:14px}
}

@media (max-width: 900px){
  .gallery-top{grid-template-columns:repeat(3, minmax(0,1fr))}
  .gallery-grid{grid-template-columns:repeat(2, minmax(0,1fr))}
  .contact-grid{grid-template-columns:1fr 1fr}
  .map-holder{grid-column:1 / -1}
  .rule-row{grid-template-columns:1fr}
  .info-grid{gap:34px}
}

@media (max-width: 700px){
  body{
    font-size:16px;
    line-height:1.7;
  }
  .wrapper{padding:0 18px}
  .site-header .bar{height:64px}
  .brand a{font-size:18px}
  .menu-toggle{display:block}
  .nav{
    position:relative;
    gap:12px;
  }
  .nav-links{
    display:none;
    position:absolute;
    right:0;
    top:46px;
    background:var(--red);
    padding:10px 12px 12px;
    flex-direction:column;
    align-items:flex-start;
    gap:12px;
    min-width:170px;
  }
  .nav.is-open .nav-links{display:flex}
  .nav-links a{font-size:16px}
  .reserve-btn{
    min-width:132px;
    height:36px;
    font-size:14px;
  }
  .hero-image img{
    height:40vw;
    min-height:150px;
  }
  .content-block{padding:38px 0}
  .content-block h1, .page-wrap h1{font-size:27px}
  .content-block h2{font-size:20px}
  .lead{
    font-size:16px;
    line-height:1.75;
  }
  .gallery-top,
  .gallery-grid,
  .info-grid,
  .contact-grid{
    grid-template-columns:1fr;
  }
  .figure figcaption{font-size:14px}
  .rule-title{font-size:22px}
  .rule-body,
  .info-grid p, .contact-grid p, .info-grid ul,
  .text-page p{
    font-size:16px;
    line-height:1.75;
  }
  .site-footer .inner{flex-direction:column}
  .site-footer a{font-size:15px}
}