:root {
   --color-primary: #EF406B;
   --font-family-normal: "Roboto", sans-serif;
}




.faicon {
   width: 1em;
   height: 1em;
   vertical-align: -0.125em;
}



.hcontainer {
   margin: 0 16px;
}
@media( min-width: 512px ) {
   .hcontainer {
      margin: 0 32px;
   }
}
@media( min-width: 1088px ) {
   .hcontainer {
      margin: 0 auto;
      width: 1024px;
   }
}



body {
   margin: 0;
   padding: 0;
   background: white;
   color: black;
   font-family: var(--font-family-normal);
   font-size: 16pt;
   font-weight: 400;
   line-height: 1.2;
}


h1, h2, h3, h4, h5, h6 {
   font-family: "Playfair Display", serif;
   font-optical-sizing: auto;
   font-weight: 700; /* 400-900 */
   font-style: normal;
}


/*
body > header {
   height: 128px;
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
}
body > header > .headerwrapper {
   width: 1280px;
   margin: 0 auto;
}


body > header figure {
   margin: 0;
}
body > header figure img {
   display: block;
}
*/



.mainslideshow {
   height: 100vh;
}
@media( min-height: 600px ) {
   .mainslideshow {
      height: 600px;
   }
}
.mainslideshow > ul,
.mainslideshow > ul > li {
   margin: 0;
   padding: 0;
}
.mainslideshow > ul,
.mainslideshow > ul > li,
.mainslideshow > ul > li > img {
   height: 100%;
}
.mainslideshow > ul {
   list-style: none;
}
.mainslideshow > ul > li > img {
   display: block;
   width: 100%;
   aspect-ratio: 1 / 1;
   object-fit: cover;
}



.categories {
   margin-top: 6em;
   display: flex;
   flex-wrap: wrap;
   justify-content: space-evenly;
   row-gap: 48px;
}
.categories > ul,
.categories > ul > li {
   margin: 0;
   padding: 0;
}
.categories > ul {
   list-style: none;
   display: flex;
   flex-wrap: wrap;
   justify-content: space-evenly;
   row-gap: 56px;
}
.categories > ul > li {
   flex: 0 0 100%;
}
@media( min-width: 640px ) {
   .categories > ul > li {
      flex: 0 0 47%;
   }
}
@media( min-width: 768px ) {
   .categories > ul > li {
      flex: 0 0 43%;
   }
}
@media( min-width: 1024px ) {
   .categories > ul > li {
      flex: 0 0 30%;
   }
}
.categories > ul > li figure {
   margin: 0;
   position: relative;
   cursor: pointer;
}
.categories > ul > li figcaption {
   position: absolute;
   bottom: 0;
   background: rgb(255 255 255 / 75%);
   padding: 8px 0;
   width: 100%;
}
.categories > ul > li h2 {
   text-align: center;
   font-weight: 500;
   margin: 0;
   font-size: 1.3em;
}
.categories > ul > li h2 a {
   color: black;
   text-decoration: none;
}
.categories > ul > li img {
   display: block;
   width: 100%;
   height: 100%;
   aspect-ratio: 1/1;
   object-fit: cover;
}
.categories > ul > li p {
   margin: 16px 0 0;
   text-align: center;
   font-weight: 300;
}



.catlayer {

}



footer {
   margin-top: 56px;
   background-color: #666666;
}
footer ul {
   margin: 0;
   padding: 72px 0 32px;
   list-style: none;
   display: flex;
   column-gap: 32px;
   justify-content: center;
}
footer li {
   margin: 0;
   padding: 0;
}

footer p {
   margin: 0;
   padding: 16px 0;
   text-align: center;
   font-size: .75em;
}