/* ============================= */
/* TABLET ≤ 1024px               */
/* ============================= */

@media (max-width: 1024px) {

  /* ---------- HEADER ---------- */

  .site-header {
    display: flex;
    flex-direction: column;
  }

  .top-banner {
    height: 16px;
  }

  .main-nav {
    height: 45px;
    padding: 0 1rem;
    display: flex;
    align-items: center;
  }

  /* Owl + hamburger left */
  .logomark {
    display: flex;
    align-items: center;
    gap: 0.75rem;
  }

  .logomark img {
    height: 2.5rem;
  }

  .nav-toggle {
    display: block;
  }

  /* Wordmark centered */
  .wordmark {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
  }

  .wordmark img {
    width: 16rem;
  }

  /* Right icons */
  .nav-links {
    display: none;
  }

  .nav-recht {
    margin-left: auto;
  }

  .nav-icon {
    font-size: 0;
  }

  .nav-icon svg {
    width: 1rem;
    height: 1rem;
  }

  /* ---------- MAIN FLOW ---------- */

  .main-grid {
    display: flex;
    flex-direction: column;
  }

  .highlights        { order: 1; }
  .featured-release  { order: 2; }
  .magazines-link    { order: 3; }
  .essay-im-fokus    { order: 4; }
  .email-signup      { order: 5; }

  /* ---------- HIGHLIGHTS ---------- */

  .highlights {
    background: #d9d9d9;
    padding: 1.25rem;
  }

  .highlights::before {
    position: static;
    display: block;
    margin-bottom: 0.75rem;
  }

  .highlights-title {
    position: static;
    margin-bottom: 0.75rem;
  }

  .aktuelle-highlights-list {
    position: static;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem 1.5rem;
  }

  /* ---------- FEATURED RELEASE ---------- */

  .featured-release {
    padding: 2rem 1.5rem;
  }

  .featured-release img {
    position: static;
    width: 100%;
    height: auto;
    margin-top: 1.5rem;
  }

  .featured-release-title,
  .featured-release-text,
  .new-releases-button {
    position: static;
    text-align: left;
  }

  .featured-release-title {
    font-size: 2.25rem;
    margin-bottom: 1rem;
  }

  .featured-release-text {
    font-size: 1.1rem;
    margin-bottom: 1.5rem;
  }

  /* ---------- ESSAY ---------- */

  .essay-im-fokus {
    padding: 2rem 1.5rem;
  }

  .essay-im-fokus-inner {
    width: 100%;
  }

  .essay-im-fokus-line {
    width: 100%;
  }

  /* ---------- MAGAZINES ---------- */

  .magazines-link {
    min-height: 260px;
  }

  /* ---------- FOOTER ---------- */

  .site-footer {
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
    padding: 3rem 1.5rem;
  }
}