/* ==========================================================================
   RESPONSIVE — Media Queries
   ========================================================================== */

/* --- Container ------------------------------------------------------------ */

@media (max-width: 1279px) {
  :root {
    --container-max: 100%;
  }
}

/* ==========================================================================
   TABLET (768–1023px)
   ========================================================================== */

@media (max-width: 1023px) {

  /* Typografia */
  :root {
    --font-h1: clamp(2.25rem, 4vw, 2.75rem);
    --font-h2: clamp(1.75rem, 3vw, 2rem);
  }

  /* Hero */
  .hero-section {
    min-height: 60vh;
  }

  .hero-slide__title {
    font-size: clamp(1.75rem, 3vw, 2.25rem);
  }

  /* Gridy sekcji */
  .category-grid--layout-a {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
  }

  .category-grid--layout-a .card--large {
    grid-column: 1 / -1;
  }

  .category-grid--layout-b,
  .category-grid--layout-c {
    grid-template-columns: 1fr 1fr;
  }

  .category-grid--layout-b .card--large {
    grid-column: 1 / -1;
  }
}

/* ==========================================================================
   MOBILE (<768px)
   ========================================================================== */

@media (max-width: 767px) {

  /* Typografia */
  :root {
    --font-h1: clamp(1.75rem, 6vw, 2.25rem);
    --font-h2: clamp(1.5rem, 5vw, 1.75rem);
    --font-h3: 1.375rem;
    --section-gap: var(--space-xl);
  }

  /* Hero — 1 post zamiast slidera */
  .hero-slider__btn,
  .hero-slider__deco {
    display: none;
  }

  .hero-slider__pagination {
    justify-content: center;
  }

  .hero-slide:not(.hero-slide--active) {
    display: none;
  }

  /* Gridy — 1 kolumna */
  .category-grid--layout-a,
  .category-grid--layout-b,
  .category-grid--layout-c {
    grid-template-columns: 1fr;
  }

  .category-grid--layout-a .card--large,
  .category-grid--layout-b .card--large {
    grid-column: auto;
  }

  /* Stopka */
  .site-footer__top {
    padding-block: var(--space-xl) var(--space-lg);
  }

  /* Breadcrumby — skróć na mobile */
  .breadcrumbs__item:not(:last-child):not(:first-child) {
    display: none;
  }

  /* Paginacja slidera */
  .hero-slider__dot-num {
    font-size: 0.75rem;
  }

  /* Przyciski */
  .btn {
    min-height: 48px;
    width: 100%;
    justify-content: center;
  }

  .btn.site-header__cta {
    width: auto;
    display: none;
  }
}

/* ==========================================================================
   MAŁE MOBILE (<480px)
   ========================================================================== */

@media (max-width: 479px) {

  :root {
    --card-padding: var(--space-sm);
  }

  .hero-slide__title {
    font-size: 1.625rem;
  }

  .section-header__inner {
    flex-direction: column;
    gap: var(--space-xs);
  }

  .section-header {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* ==========================================================================
   DUŻE EKRANY (>1440px)
   ========================================================================== */

@media (min-width: 1440px) {
  :root {
    --section-gap: 8rem;
    --font-h1: 4rem;
    --font-h2: 3rem;
  }
}

/* ==========================================================================
   SINGLE ARTICLE — RESPONSIVE
   ========================================================================== */

@media (max-width: 1023px) {
  /* Ukryj sidebar na tablecie — pełna szerokość */
  .single-article__layout {
    grid-template-columns: 1fr;
  }

  .single-article__sidebar {
    display: none;
  }

  /* Hero single — mniejsza wysokość */
  .single-hero {
    aspect-ratio: 16 / 7;
    max-height: 420px;
  }
}

@media (max-width: 767px) {
  /* Treść artykułu — mniejszy padding */
  .single-article {
    padding-block: var(--space-lg);
  }

  /* Przyciski share — stack */
  .single-article__share {
    flex-wrap: wrap;
    gap: var(--space-xs);
  }

  /* Powiązane posty — 1 kolumna */
  .related-posts__grid {
    grid-template-columns: 1fr;
  }

  /* Biogram autora — pionowo */
  .author-bio {
    flex-direction: column;
    text-align: center;
    align-items: center;
  }

  /* Hero single */
  .single-hero {
    aspect-ratio: 4 / 3;
    max-height: 300px;
  }

  /* Tagi na mobile — wrap */
  .single-article__tags {
    flex-wrap: wrap;
  }
}

/* ==========================================================================
   ARCHIVE / CATEGORY — RESPONSIVE
   ========================================================================== */

@media (max-width: 767px) {
  /* Grid archiwum — 1 kolumna */
  .archive-grid {
    grid-template-columns: 1fr;
  }

  /* Nagłówek archiwum — kompakt */
  .archive-header {
    padding-block: var(--space-xl) var(--space-lg);
  }

  .archive-header__title {
    font-size: clamp(2rem, 8vw, 2.5rem);
  }
}

@media (min-width: 768px) and (max-width: 1023px) {
  /* Grid archiwum — 2 kolumny */
  .archive-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* ==========================================================================
   SEARCH / 404 — RESPONSIVE
   ========================================================================== */

@media (max-width: 767px) {
  .error-404__big {
    font-size: clamp(6rem, 30vw, 10rem);
  }

  .error-cats-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .search-header .search-form {
    flex-direction: column;
  }
}

/* ==========================================================================
   PREFERS-REDUCED-MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }

  .hero-slide {
    transition: none !important;
  }
}

/* ==========================================================================
   PRINT
   ========================================================================== */

@media print {
  .site-header,
  .site-footer,
  .hero-slider__controls,
  .mobile-menu,
  .mobile-menu__overlay {
    display: none !important;
  }

  body {
    font-size: 12pt;
    color: #000;
  }

  a::after {
    content: ' (' attr(href) ')';
    font-size: 0.75em;
    color: #666;
  }
}