body { background-color: #0a090a; }
center { max-width: 960px; margin: 0 auto; }
img {
 width: 100%;
 max-width: 600px;
 height: auto;
}
p, li {
 font-family: "Open Sans", sans-serif;
 font-optical-sizing: auto;
 font-style: normal;
 font-variation-settings: "wdth" 100;
 color: #e0e0e0;
}
.news-post p { text-align: left; }
.news-post .post-meta, .news-post .post-footer { text-align: center; }
.news-post > img { width: 400px; max-width: 100%; }
h1, h2, h3, h4 {
 font-family: "Open Sans", sans-serif;
 font-optical-sizing: auto;
 font-style: normal;
 font-variation-settings: "wdth" 100;
 color: #f5f5f5;
}
ul {
 display: inline-block;
 text-align: left;
 max-width: 600px;
}
a:link { color: #c586ff; text-decoration: underline; }
a:hover { color: #d9aeff; }
header {
 display: flex;
 align-items: center;
 justify-content: center;
 gap: 24px;
 padding: 12px 0;
 width: 100%;
}
header img { width: 200px; max-width: 200px; height: auto; }
nav { display: flex; gap: 20px; font-family: "Open Sans", sans-serif; }
nav a { text-decoration: none; font-weight: bold; font-size: 1.25em; }
main a { text-decoration: underline; }
hr { border: none; border-top: 2px solid #555; margin: 0 0 24px 0; }
.footer { color: #949494; }
.cta {
 display: inline-block;
 margin: 8px 0 16px 0;
 padding: 10px 24px;
 border: 1px solid #b84cff;
 border-radius: 4px;
 text-decoration: none;
 font-family: "Open Sans", sans-serif;
}
.cta:link, .cta:visited { color: #b84cff; }
.cta:hover {
 color: #c67bff;
 border-color: #c67bff;
}
.carousel-wrap {
 display: flex;
 align-items: center;
 gap: 12px;
 max-width: 960px;
 margin: 0 auto;
}
.carousel {
 display: flex;
 overflow-x: auto;
 scroll-snap-type: x mandatory;
 scrollbar-width: none;
}
.carousel::-webkit-scrollbar { display: none; }
.carousel img {
 flex: 0 0 100%;
 scroll-snap-align: center;
 max-width: none;
 border-radius: 4px;
}
.carousel-btn {
 flex: 0 0 auto;
 background: none;
 border: 1px solid #b84cff;
 color: #b84cff;
 border-radius: 4px;
 font-size: 1.5em;
 line-height: 1;
 padding: 8px 14px;
 cursor: pointer;
}
.carousel-btn:hover { color: #c67bff; border-color: #c67bff; }
.carousel-btn:disabled {
 color: #555;
 border-color: #555;
 cursor: default;
}