@font-face {
  font-family: 'roboto';

  src: url('../fonts/roboto-regular.woff2') format('woff2');

  font-weight: normal;

  font-style: normal;

  font-display: swap;
}

@font-face {
  font-family: 'roboto';

  src: url('../fonts/roboto-bold.woff2') format('woff2');

  font-weight: bold;

  font-style: normal;

  font-display: swap;
}

@font-face {
  font-family: 'hvn';

  src: url('../fonts/275e1e1e-08b1-4fe8-952b-5484d602fa4e.woff2') format('woff2');

  font-weight: normal;

  font-style: normal;

  font-display: swap;
}

:root {
  font-size: 16px;
}

@media screen and (min-width: 1900px) {
  :root {
    font-size: 18px;
  }
}

@media screen and (min-width: 2400px) {
  :root {
    font-size: 22px;
  }
}

h1, h2, h3, h4, h5, h6, p, ul {
  margin-top: 0;
}

a {
  color: #f3a;
  text-decoration: none;
}

a:hover {
  color: #f3a;
  /*  color: rgba(23,24,37);*/
  text-decoration: underline;
}

a:visited {
  color: #f3a;
}

body {
  --tw-bg-opacity: 1;
  background-color: rgb(229 231 235 / var(--tw-bg-opacity));
  color: rgba(23,24,37,0.9);
  line-height: 1.5;
  margin: 0;
}

body, button, input, select, optgroup, textarea {
  font-family: roboto, sans-serif;
}

p, ul {
  margin-bottom: 1.61rem;
}

header#masthead {
  background: rgba(255,255,255,0.61);
}

main#primary {
  overflow: hidden;
  /*  max-width: 1200px;*/
  /*  margin: 0 auto;*/
  background: rgba(255,255,255,0.39);
}

header#masthead .site-title {
  font-family: hvn, sans-serif;
  font-weight: normal;
  padding-top: 2.61rem;
  margin: 0;
  /*  text-shadow: 4px -3px white;*/
  text-shadow: 0.061em -0.061em white;
}

header#masthead .site-title a {
  color: inherit;
  text-decoration: none;
}

header#masthead .site-description {
  display: inline-block;
  padding: 0 0.161rem;
  margin-top: 0;
  margin-left: -0.2rem;
  /*  border-bottom: solid 2px rgba(23,24,37,0.9);*/
  text-decoration: underline;
  text-underline-offset: 0.39rem;
  line-height: 1.61rem;
}

header#masthead .site-description > mark {
  background: transparent;
}

header#masthead .site-description > mark:nth-child(1) {
  background: #f3a;
  color: white;
}

nav.main-navigation ul {
  margin: 0;
  padding: 0;
  display: none;
}

nav.main-navigation button.menu-toggle,
nav.main-navigation.toggled ul {
  display: block;
}

@media screen and (min-width: 37.5em) {
  nav.main-navigation button.menu-toggle {
    display: none;
  }

  nav.main-navigation ul,
  nav.main-navigation.toggled ul {
    display: flex;
  }
}

nav.main-navigation li {
  margin-right: 0.61rem;
  margin-bottom: 0.61rem;
  list-style: none;
}

nav.main-navigation a,
nav.main-navigation button.menu-toggle {
  font-size: 1.161rem;
  line-height: 1.5;
  border: solid 1px rgba(23,24,37,0.9);
  border-radius: 1rem;
  padding: 0.161rem 0.61rem;
  color: white;
  background: rgba(23,24,37,0.9);
  cursor: pointer;
}

nav.main-navigation button.menu-toggle {
  margin-bottom: 1.61rem;
  border-color: #f3a;
  background: #f3a;
}

nav.main-navigation button.menu-toggle:hover,
nav.main-navigation.toggled button.menu-toggle {
  color: white;
  border-color: rgba(23,24,37,0.9);
  background: rgba(23,24,37,0.9);
}

nav.main-navigation a {
  display: inline-block;
}

nav.main-navigation a[href*='twitter.com'],
nav.main-navigation a[href*='instagram.com'],
nav.main-navigation a[href*='facebook.com'] {
  text-indent: -999px;
  display: inline-block;
  width: 1.61rem;
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  border-radius: 0;
  vertical-align: center;
  margin-left: 0.39rem;
}

nav.main-navigation a[href*='twitter.com'] {
  -webkit-mask-image: url('../icons/twitter-brands.svg');
  mask-image: url('../icons/twitter-brands.svg');
}

nav.main-navigation a[href*='instagram.com'] {
  -webkit-mask-image: url('../icons/instagram-brands.svg');
  mask-image: url('../icons/instagram-brands.svg');
}

nav.main-navigation a[href*='facebook.com'] {
  -webkit-mask-image: url('../icons/facebook-brands.svg');
  mask-image: url('../icons/facebook-brands.svg');
}

body.blog nav.main-navigation li.current_page_parent > a,
body.single nav.main-navigation li.current_page_parent > a,
nav.main-navigation li.current-menu-item > a,
nav.main-navigation li.current-menu-parent > a {
  color: white;
  border-color: #f3a;
  background: #f3a;
  transform: rotate(-1.61deg);
}

nav.main-navigation li:hover > a {
  color: white;
  border-color: #f3a;
  background: #f3a;
  text-decoration: none;
  /*  transform: rotate(1.61deg);*/
}

/* Archive pages, Search pages */

body.search header.page-header,
body.archive header.page-header {
  background-color: #f3a;
  color: white;
  padding: 1.61rem;
  margin-bottom: 1.61rem;
}

body.search header.page-header h1.page-title,
body.archive header.page-header h1.page-title {
  text-transform: uppercase;
  font-size: 1.61rem;
  font-weight: normal;
  /*  border-radius: 0.161rem;*/
  hyphens: auto;
  -ms-hyphens: auto;
  -webkit-hyphens: auto;
}

body.search header.page-header h1.page-title span,
body.archive header.page-header h1.page-title span {
  font-family: hvn, sans-serif;
  font-weight: normal;
  font-size: 1.161em;
  /* [sic] */
}

body.archive header.page-header .archive-description {
  font-size: 1.16rem;
}

/* "keine Suchergebnisse" content */

body.search .page-content {
  padding: 1.61rem;
}

/* Blog posts + General pages */

article.page,
article.post {
  background: white;
  font-size: 1.16rem;
}

article.page header.entry-header .entry-title,
article.post header.entry-header .entry-title {
  font-family: hvn, sans-serif;
  font-weight: normal;
  hyphens: auto;
  -ms-hyphens: auto;
  -webkit-hyphens: auto;
}

/* Blog posts */

article.post {
  background: white;
  font-size: 1.16rem;
}

article.post .post-thumbnail .wp-post-image {
  display: none;
}

article.post:first-of-type .post-thumbnail .wp-post-image {
  display: block;
  /* transform: scale(100%+100px)\); */
  /*  transform: scale(350%) translate(-10%);*/
  position: fixed;
  left: 0;
  top: 0;
  z-index: -1;
  width: 100vw;
  height: 100vh;
  min-height: 100vh;
  filter: blur(100px) opacity(16%) saturate(16);
  /*;*/
  /*blur(39vw)*/
  /*  opacity: 0.61;*/
}

article.post header.entry-header {
  margin-bottom: 0.61rem;
}

article.post header.entry-header .entry-meta {
  font-size: 1rem;
}

article.post header.entry-header .entry-title a {
  color: inherit;
  text-decoration: none;
}

article.post .entry-header,
article.post .post-thumbnail,
article.post .entry-content,
article.post .entry-footer {
  max-width: 50rem;
}

article.post .entry-footer {
  clear: both;
  font-size: 1rem;
}

article.post .entry-footer > span {
  display: block;
}

html {
  margin-top: 1.39rem;
  scroll-padding-top: 3.61rem;
}

@media screen and (min-width: 768px) {
  html {
    margin-top: 1.61rem;
  }
}

@media screen and (min-width: 1024px) {
  html {
    margin-top: 2.61rem;
  }
}

header#masthead {
  padding: 0 1.61rem 1.61rem 1.61rem;
}

main#primary {
  padding: 0.61rem 0.39rem;
}

article.post,
article.page {
  padding: 1rem;
}

body.home main.site-main .posts-navigation {
  /*  padding: 1rem;*/
}

aside.widget-area {
  padding: 1.61rem;
}

footer.site-footer {
  padding: 1rem 1.61rem;
}

@media screen and (min-width: 768px) {
  main#primary {
    padding: 2.61rem;
  }

  article.post,
  article.page {
    padding: 2.61rem;
  }

  body.home main.site-main .posts-navigation {
    padding-left: 1.61rem;
    padding-right: 1.61rem;
  }
}

@media screen and (min-width: 1024px) {
  header#masthead {
    padding: 1rem 4.61rem 3rem 4.61rem;
  }

  main#primary {
    padding: 4.61rem 4.61rem 4.61rem 4.61rem;
  }

  article.post,
  article.page {
    padding-top: 3.61rem;
    padding-bottom: 3.61rem;
    padding-left: 4.61rem;
    padding-right: 4.61rem;
  }

  body.home main.site-main .posts-navigation {
    padding-left: 2.61rem;
    padding-right: 2f.61rem;
  }

  aside.widget-area {
    padding: 4.61rem;
  }

  footer.site-footer {
    padding: 1rem 4.61rem;
  }
}

@media screen and (min-width: 1600px) {
  main#primary {
    padding-right: 16%;
  }

  main#primary > header,
  article.post,
  article.page,
  nav.post-navigation,
  nav.posts-navigation,
  div.comments-area {
    max-width: 1500px;
  }
}

header#masthead .site-title {
  font-size: 2.61rem;
}

header#masthead .site-title mark {
  background: transparent;
  color: #f3a;
  margin-left: 0.061em;
}

h1 {
  font-size: 1.61rem;
}

@media screen and (min-width: 768px) {
  header#masthead .site-title {
    font-size: 3.61rem;
  }

  h1 {
    font-size: 2rem;
  }
}

body.home main.site-main {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 0.39rem;
}

body.home main.site-main .posts-navigation {
  margin: 0;
}

body.home article.post {
  margin-bottom: 0;
}

body.home article.post.type-post:nth-of-type(n+2) {
  font-size: 0.86rem;
}

body.home article.post.type-post:nth-of-type(n+2) > * {
  display: none;
}

body.home article.post.type-post:nth-of-type(n+2) > header.entry-header {
  display: block;
}

body.home article.post.type-post:nth-of-type(n+6) {
  font-size: 0.61rem;
  padding-top: 1rem;
  padding-bottom: 1rem;
}

body.home article.post.type-post:nth-of-type(n+6) > header.entry-header {
  margin-bottom: 0;
}

body.home article.post.type-post:nth-of-type(n+6) > header.entry-header h2 {
  /*  margin-bottom: 0;*/
}

body.home article.post.type-post:nth-of-type(n+6) > header.entry-header .entry-meta {
  /*  display: none;*/
}

@media screen and (min-width: 768px) {
  body.home main.site-main {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
  }

  body.home article.post.type-post:nth-of-type(1) {
    grid-column: 1 / span 2;
  }

  /*  body.home article.post:nth-child(4) {
    grid-row-start: 3;
    grid-row-end: 8;
  }
*/

  body.home article.post.type-post:nth-of-type(n+2) {
    padding-top: 1.61rem;
    padding-bottom: 1.61rem;
    padding-left: 2.61rem;
    padding-right: 2.61rem;
  }

  body.home article.post.type-post:nth-of-type(n+6) {
    font-size: 0.61rem;
  }

  body.home nav.posts-navigation {
    grid-column: 1 / span 2;
  }

  body.home article.post.type-post:nth-of-type(n+2) > header.entry-header {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
  }
}

@media screen and (min-width: 1400px) {
  body.home main.site-main {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  body.home article.post.type-post:nth-of-type(1) {
    grid-column: 1 / span 2;
    grid-row: span 2;
  }

  body.home.paged article.post.type-post:nth-of-type(1) {
    grid-row: span 5;
  }

  body.home article.post.type-post:nth-of-type(n+2) {
    /*    grid-column-start: 3;*/
  }

  body.home nav.posts-navigation {
    grid-column: 3 / span 1;
  }

  /*body.home nav.posts-navigation {
    grid-column: 1 / span 3;
  }

  body.home.paged nav.posts-navigation {
    grid-column: 3 / span 1;
  }*/
}

article.post.category-feature {
  background: #f3a;
  color: white;
  font-size: 1rem;
}

article.post.category-feature header.entry-header .entry-title {
  text-transform: uppercase;
  font-size: 1.39rem;
  font-family: roboto, sans-serif;
  font-weight: normal;
}

article.post.category-feature header.entry-header .entry-title span {
  font-size: 1.161em;
  /* [sic] */
  font-family: hvn, sans-serif;
}

article.post.category-feature a {
  color: inherit;
}

article.post.category-feature a:hover {
  text-decoration: none;
}

nav.post-navigation,
nav.posts-navigation {
  /*  @apply bg-white;*/
  background-color: rgba(255,255,255,0.61);
  padding: 1.61rem 1.61rem;
}

nav.post-navigation .nav-links,
nav.posts-navigation .nav-links {
  display: grid;
  height: 100%;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: end;
}

nav.post-navigation .nav-previous,
nav.posts-navigation .nav-previous {
  grid-column: 2 / span 1;
  grid-row: 1 / span 1;
  text-align: right;
}

nav.post-navigation .nav-next,
nav.posts-navigation .nav-next {
  grid-column: 1 / span 1;
  grid-row: 1 / span 1;
  text-align: left;
}

nav.post-navigation [rel=next] .nav-subtitle {
  /*  display: block;
  width: 1.61rem;
  height: 1.61rem;
  text-indent: -9999px;
  background: #f3a;
  border-radius: 50%;
  color: white;
*/
}

div.comments-area {
  /*  @apply bg-gray-200;*/
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
  padding: 1rem 1.61rem;
}

aside.widget-area {
  background: rgba(255,255,255,0.61);
}

aside.widget-area .widget_search {
  max-width: 26rem;
}

footer.site-footer {
  background-color: rgba(23,24,37,0.16);
  line-height: 1rem;
}

footer.site-footer a {
  color: inherit;
}

footer.site-footer .site-title {
  font-family: hvn, sans-serif;
  font-weight: normal;
  text-shadow: 0.061em -0.061em white;
}

footer.site-footer .site-title mark {
  background: transparent;
  color: #f3a;
  margin-left: 0.061em;
}

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

footer.site-footer .site-description {
  font-size: 0.72rem;
  text-decoration: underline;
  text-underline-offset: 0.16rem;
}

.wp-block-latest-posts {
  list-style: none;
  padding: 0;
  margin: 0;
}

.wp-block-latest-comments {
  list-style: none;
  padding: 0;
  margin: 0;
}

@media screen and (min-width: 600px) {
  .wp-block-archives-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .wp-block-categories-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media screen and (min-width: 1024px) {
  .wp-block-archives-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .wp-block-categories-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media screen and (min-width: 1400px) {
  .wp-block-archives-list {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }

  .wp-block-categories-list {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}

.wp-block-archives-list {
}

.wp-block-categories-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.wp-block-group h2 {
  font-family: hvn, sans-serif;
  font-weight: normal;
}

aside.widget-area .widget_nav_menu h2.widget-title {
  font-family: hvn, sans-serif;
  font-weight: normal;
}

aside.widget-area .widget_nav_menu ul.menu {
  list-style: none;
  padding: 0;
  margin: 0;
}

@media screen and (min-width: 768px) {
  aside.widget-area {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  aside.widget-area .widget_block {
    grid-column: 1 / span 2;
  }

  aside.widget-area .widget_tag_cloud + .widget_block, /* Neuste Beiträge */
  aside.widget-area .widget_tag_cloud + .widget_block + .widget_block, /* Archiv */
  aside.widget-area .widget_search,
  aside.widget-area .widget_nav_menu {
    grid-column: auto / span 1;
  }
}

@media screen and (min-width: 1024px) {
  aside.widget-area {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  aside.widget-area .widget_block {
    grid-column: 1 / span 3;
  }

  aside.widget-area .widget_tag_cloud + .widget_block, /* Neuste Beiträge */
  aside.widget-area .widget_tag_cloud + .widget_block + .widget_block, /* Archiv */
  aside.widget-area .widget_search,
  aside.widget-area .widget_nav_menu {
    grid-column: auto / span 1;
  }
}
