/* ==========================================================================
   Custom CSS Modifications
   ========================================================================== */

/* 1. Alignment & Font Sizes inside Page Header */
.entry-header .post-tags {
  text-align: center;
}

.entry-header .post-tags a {
  font-size: 12px !important;
  line-height: 24px !important;
}

.entry-header .post-categories a {
  font-size: 12px !important;
}

/* 2. Reduced Header Heights (80% of original values) */
.entry-header {
  height: 400px; /* Desktop */
}

@media screen and (max-width: 1280px) {
  .entry-header {
    height: 340px !important;
  }
}
@media screen and (max-width: 1080px) {
  .entry-header {
    height: 280px !important;
  }
}
@media screen and (max-width: 880px) {
  .entry-header {
    height: 230px !important;
  }
}
@media screen and (max-width: 750px) {
  .entry-header {
    height: 200px !important;
  }
}
@media screen and (max-width: 690px) {
  .entry-header {
    height: 170px !important;
  }
}
@media screen and (max-width: 640px) {
  #page-header .entry-header {
    height: auto !important;
    padding: 55px 0 !important;
  }
}
@media screen and (max-width: 550px) {
  .entry-header {
    height: auto !important;
    padding: 40px 0 !important;
  }
}

/* 3. White Post Title Option */
.white-post-header .post-title,
.white-post-header .post-meta,
.white-post-header .post-meta span,
.white-post-header .post-meta a,
.white-post-header .post-categories a,
.white-post-header .post-tags a {
  color: #ffffff !important;
  border-color: rgba(255, 255, 255, 0.3) !important;
}

.white-post-header a:hover {
  opacity: 0.8 !important;
  color: #ffffff !important;
}

/* 4. Desktop Typography Scaling (+50%, Tablets & Mobile excluded) */
@media screen and (min-width: 1025px) {
  /* Fließtext, Absätze & Formularelemente (15px -> 22.5px) */
  body,
  .post-content,
  .entry-content,
  .entry-content p,
  .comment-content,
  input,
  textarea,
  select {
    font-size: 22.5px;
    line-height: 37px;
  }

  /* Beitrags- & Seitentitel (40px -> 60px) */
  .post-title,
  .page-title,
  .post-title a {
    font-size: 60px !important;
    line-height: 66px !important;
  }

  /* HTML-Überschriften h1 bis h6 */
  h1 {
    font-size: 60px;
    line-height: 1.2;
  }
  h2 {
    font-size: 54px;
    line-height: 1.25;
  }
  h3 {
    font-size: 45px;
    line-height: 1.3;
  }
  h4 {
    font-size: 36px;
    line-height: 1.35;
  }
  h5 {
    font-size: 33px;
    line-height: 1.4;
  }
  h6 {
    font-size: 30px;
    line-height: 1.4;
  }

  /* Hauptmenü & Top-Bar */
  #main-menu li a {
    font-size: 22.5px;
  }
  #main-menu .sub-menu > li > a {
    font-size: 19.5px;
    line-height: 36px;
  }
  #top-menu li a {
    font-size: 18px;
  }
  #top-menu .sub-menu > li > a {
    font-size: 16.5px;
  }

  /* Beitrags-Metadaten & "Read More"-Button */
  .post-meta,
  .post-meta a,
  .post-author,
  .post-share {
    font-size: 21px;
    line-height: 38px;
  }
  .read-more a {
    font-size: 19.5px;
    line-height: 48px;
    padding: 0 32px;
  }

  /* Header Tags & Kategorien */
  .entry-header .post-tags a,
  .entry-header .post-categories a {
    font-size: 18px !important;
    line-height: 32px !important;
  }

  /* Sidebar & Widgets */
  .widget-title h2 {
    font-size: 24px;
    line-height: 38px;
  }
  .ashe-widget,
  .ashe-widget p,
  .ashe-widget ul li {
    font-size: 21px;
    line-height: 32px;
  }

  /* Footer & Copyright */
  .page-footer,
  .copyright-info {
    font-size: 19.5px;
  }

  /* maps und elevation */
  .elevation-control {
    padding-top: 1em !important;
  }
  .elevation-summary > span {
    padding-right: 1em !important;
  }
}

/* 5. Blog List */
.header-logo h1 {
  font-family: "Open Sans";
  display: block;
  margin: 0 auto;
  text-transform: uppercase;
  font-size: 100px;
  line-height: 1;
}

.main-container {
  width: 100% !important;
}

.entry-header.blog {
  background-image: url(https://moontools.ch/wp-content/themes/ashe_custom/assets/images/mondalpenlandschaft_kl.jpg) !important;
}
