/* =================================================================
   KS WESOŁA – Responsive Styles
   Media queries for tablet, mobile, and small screens
   ================================================================= */

/* ───────────────────────────────────────────
   LARGE SCREENS (max-width: 1200px)
   ─────────────────────────────────────────── */
@media (max-width: 1200px) {
  .partners-grid {
    grid-template-columns: repeat(3, 1fr);
  }

  .teams-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* Header gets crowded between 1024 and 1280px — keep the phone as icon only */
@media (max-width: 1280px) {
  .header-phone-text {
    display: none;
  }

  .nav-link {
    padding: 0.5rem 0.375rem;
  }

  .site-header :is(:is(:is(.logo-name,
.is-style-logo-name),
.is-style-logo-name),
.is-style-logo-name) {
    font-size: var(--fs-md);
  }

  .header-cta {
    padding: 0.75rem 1.25rem;
  }
}

/* ───────────────────────────────────────────
   TABLET (max-width: 1024px)
   ─────────────────────────────────────────── */
@media (max-width: 1024px) {
  :root {
    --fs-5xl: 2.75rem;
    --fs-4xl: 2.25rem;
    --fs-3xl: 2rem;
  }

  .section {
    padding: var(--space-4xl) 0;
  }

  /* Header — show hamburger */
  .main-nav {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--white);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transition: all var(--transition-slow);
    z-index: 1005;
  }

  .main-nav.open {
    opacity: 1;
    visibility: visible;
  }

  /* Long menus (2 dropdowns × 7 items) must scroll instead of clipping.
     NOTE: .site-header has backdrop-filter,
which makes it the containing
     block for this fixed overlay — so "bottom: 0" would mean the header's
     bottom (72px). Force the real viewport height explicitly. */
  .main-nav {
    bottom: auto;
    height: 100vh;
    height: 100dvh;
    align-items: flex-start;
    padding: calc(var(--header-height) + var(--space-xl)) 0 var(--space-2xl);
    overflow-y: auto;
  }

  .nav-list {
    flex-direction: column;
    gap: var(--space-sm);
    text-align: center;
  }

  .nav-link {
    font-size: var(--fs-lg);
    padding: var(--space-sm) var(--space-lg);
  }

  /* Dropdown: inline accordion on mobile */
  .dropdown-menu {
    position: static;
    transform: none;
    min-width: 0;
    background: none;
    border: none;
    box-shadow: none;
    padding: 0;
    opacity: 1;
    visibility: visible;
    max-height: 0;
    overflow: hidden;
    transition: max-height var(--transition-base);
  }

  .nav-dropdown.open .dropdown-menu {
    max-height: 400px;
  }

  /* Override hover-open on touch devices */
  .nav-dropdown:hover .dropdown-menu {
    max-height: 0;
  }

  .nav-dropdown:hover.open .dropdown-menu {
    max-height: 400px;
  }

  .dropdown-menu li a {
    font-size: var(--fs-base);
    padding: var(--space-sm) var(--space-lg);
    color: var(--muted);
  }

  /* Page header */
  .page-header {
    padding-top: calc(var(--header-height) + var(--space-2xl));
    padding-bottom: var(--space-2xl);
  }

  .header-cta {
    display: none;
  }

  .hamburger {
    display: flex;
  }

  /* Hero */
  .hero-inner {
    grid-template-columns: 1fr;
    text-align: center;
  }

  .hero-content {
    order: 1;
  }

  .hero-visual {
    order: 0;
    min-height: 200px;
  }

  .hero-crest {
    width: 180px;
  }

  :is(:is(:is(.hero-text,
.is-style-hero-text),
.is-style-hero-text),
.is-style-hero-text) {
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
  }

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

  .hero-circle-1 {
    width: 400px;
    height: 400px;
    right: -15%;
  }

  .stats-row {
    gap: var(--space-xl);
    flex-wrap: wrap;
  }

  /* About */
  .about-grid {
    grid-template-columns: 1fr;
    gap: var(--space-2xl);
  }

  /* Advantages */
  .advantages-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Header actions: CTA hidden,
phone stays as icon next to hamburger */
  .header-actions {
    gap: var(--space-sm);
  }

  .nav-mobile-only {
    display: block;
    margin-top: var(--space-lg);
  }

  .nav-mobile-only .btn {
    font-size: var(--fs-base);
    padding: 0.875rem 2rem;
  }

  /* Academy */
  .academy-path {
    grid-template-columns: repeat(3, 1fr);
  }

  .academy-step:not(:nth-child(4n))::before {
    display: none;
  }

  /* Teams */
  .teams-grid {
    grid-template-columns: repeat(2, 1fr);
  }

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

  .specials-grid {
    grid-template-columns: 1fr;
  }

  .seniors-grid {
    grid-template-columns: 1fr;
  }

  .training-schedule {
    grid-template-columns: 1fr;
  }

  .training-days {
    justify-content: flex-start;
  }

  .contact-bottom {
    grid-template-columns: 1fr;
  }

  .info-grid,
.info-grid.reverse {
    grid-template-columns: 1fr;
    gap: var(--space-2xl);
  }

  .info-grid.reverse > .info-media {
    order: 0;
  }

  .cooperation-grid {
    grid-template-columns: 1fr;
  }

  .info-cta {
    grid-template-columns: 1fr;
  }

  /* Coaches */
  .coaches-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .coach-featured {
    grid-column: 1 / -1;
  }

  /* Recruitment */
  .recruitment-grid {
    grid-template-columns: 1fr;
    gap: var(--space-2xl);
  }

  /* Parents */
  .parents-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Events */
  .events-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .events-grid .event-card:last-child {
    grid-column: 1 / -1;
    max-width: 500px;
    margin: 0 auto;
  }

  /* News */
  .news-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .news-grid .news-card:last-child {
    grid-column: 1 / -1;
    max-width: 500px;
    margin: 0 auto;
  }

  /* Funding */
  .funding-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-lg);
  }

  /* Partners */
  .partners-grid {
    grid-template-columns: repeat(3, 1fr);
  }

  /* Boiska */
  .venues-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Contact */
  .contact-grid {
    grid-template-columns: 1fr;
    gap: var(--space-2xl);
  }

  /* Dla rodziców */
  .codex-grid {
    grid-template-columns: 1fr;
  }

  .disability-contact {
    grid-template-columns: 1fr;
    gap: var(--space-2xl);
  }

  /* Footer */
  .footer-grid {
    grid-template-columns: 1fr 1fr;
    gap: var(--space-2xl);
  }

  .footer-brand {
    grid-column: 1 / -1;
  }
}

/* ───────────────────────────────────────────
   MOBILE (max-width: 768px)
   ─────────────────────────────────────────── */
@media (max-width: 768px) {
  :root {
    --fs-5xl: 2.25rem;
    --fs-4xl: 1.875rem;
    --fs-3xl: 1.75rem;
    --fs-2xl: 1.5rem;
    --container-padding: 1.25rem;
    --space-5xl: 5rem;
    --space-4xl: 4rem;
  }

  /* Header */
  :is(:is(:is(.logo-name,
.is-style-logo-name),
.is-style-logo-name),
.is-style-logo-name) {
    font-size: var(--fs-base);
  }

  /* Hero */
  .hero {
    min-height: auto;
    padding-top: calc(var(--header-height) + var(--space-2xl));
  }

  .hero-visual {
    min-height: 160px;
  }

  .hero-crest {
    width: 140px;
  }

  .hero-float-1,
.hero-float-2 {
    display: none;
  }

  /* Coach photos on mobile */
  .coach-photo {
    width: 64px;
    height: 64px;
  }

  .stats-row {
    gap: var(--space-lg);
    padding: var(--space-lg) 0;
  }

  .stat-divider {
    display: none;
  }

  .stats-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    text-align: center;
  }

  :is(:is(:is(.stat-value,
.is-style-stat-value),
.is-style-stat-value),
.is-style-stat-value) {
    font-size: var(--fs-base);
  }

  :is(:is(:is(.stat-label,
.is-style-stat-label),
.is-style-stat-label),
.is-style-stat-label) {
    font-size: var(--fs-xs);
  }

  /* Advantages */
  .advantages-grid {
    grid-template-columns: 1fr;
  }

  /* Academy */
  .academy-path {
    grid-template-columns: 1fr;
    gap: var(--space-lg);
  }

  .academy-step {
    display: flex;
    align-items: flex-start;
    gap: var(--space-lg);
    text-align: left;
  }

  .step-marker {
    margin: 0;
    flex-shrink: 0;
  }

  /* Teams */
  .teams-grid {
    grid-template-columns: 1fr;
  }

  /* Coaches */
  .coaches-grid,
.coaches-grid-lead {
    grid-template-columns: 1fr;
  }

  .groups-grid {
    grid-template-columns: 1fr;
  }

  .trial-banner {
    transform: none;
    padding: var(--space-xl);
  }

  :is(:is(:is(.trial-banner-title,
.is-style-trial-banner-title),
.is-style-trial-banner-title),
.is-style-trial-banner-title) {
    font-size: var(--fs-2xl);
  }

  .recruitment-phones li {
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
  }

  .recruitment-phones svg {
    display: none;
  }

  .coach-modal-header {
    flex-direction: column;
    text-align: center;
  }

  .coach-modal-inner {
    padding: var(--space-xl);
  }

  .info-facts {
    grid-template-columns: 1fr;
  }

  .offer-list {
    grid-template-columns: 1fr;
  }

  .krs-banner {
    grid-template-columns: 1fr;
  }

  .contact-legal dl {
    grid-template-columns: 1fr;
    gap: var(--space-xs);
  }

  .contact-legal dt {
    margin-top: var(--space-sm);
  }

  .senior-team::before {
    font-size: 7rem;
  }

  .coach-featured {
    flex-direction: column;
    text-align: center;
    align-items: center;
  }

  /* Form */
  .form-row {
    flex-direction: column;
    gap: 0;
  }

  /* Parents */
  .parents-grid {
    grid-template-columns: 1fr;
  }

  /* Events */
  .events-grid {
    grid-template-columns: 1fr;
  }

  .events-grid .event-card:last-child {
    grid-column: auto;
    max-width: 100%;
  }

  .event-card {
    display: grid;
    grid-template-columns: 100px 1fr;
  }

  .event-date-badge {
    padding: var(--space-md);
  }

  :is(:is(:is(.event-day,
.is-style-event-day),
.is-style-event-day),
.is-style-event-day) {
    font-size: var(--fs-xl);
  }

  /* News */
  .news-grid {
    grid-template-columns: 1fr;
  }

  .news-grid .news-card:last-child {
    grid-column: auto;
    max-width: 100%;
  }

  /* Funding */
  .funding-grid {
    grid-template-columns: 1fr;
    gap: var(--space-2xl);
  }

  .funding-card img {
    max-height: 120px;
  }

  /* Partners */
  .partners-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .venues-grid {
    grid-template-columns: 1fr;
  }

  /* Dla rodziców */
  .fees-grid {
    grid-template-columns: 1fr;
  }

  .bank-box dl {
    grid-template-columns: 1fr;
    gap: 2px var(--space-lg);
  }

  .bank-box dt {
    margin-top: var(--space-sm);
  }

  /* Wyróżnienia klubu – mniejsze na wąskich ekranach */
  :is(:is(:is(.badge-strip-item,
.is-style-badge-strip-item),
.is-style-badge-strip-item),
.is-style-badge-strip-item) img {
    height: 40px;
  }

  /* Footer */
  .footer-grid {
    grid-template-columns: 1fr;
    gap: var(--space-xl);
  }

  .footer-brand {
    grid-column: auto;
  }

  :is(:is(:is(.footer-tagline,
.is-style-footer-tagline),
.is-style-footer-tagline),
.is-style-footer-tagline) {
    max-width: 100%;
  }
}

/* ───────────────────────────────────────────
   SMALL MOBILE (max-width: 480px)
   ─────────────────────────────────────────── */
@media (max-width: 480px) {
  :root {
    --fs-5xl: 1.875rem;
    --fs-3xl: 1.5rem;
    --container-padding: 1rem;
  }

  .hero-ctas {
    flex-direction: column;
    align-items: stretch;
  }

  .hero-ctas .btn {
    text-align: center;
  }

  .about-numbers {
    flex-direction: column;
    gap: var(--space-lg);
    align-items: center;
  }

  /* w kolumnie auto-margines zepchnąłby logo w prawo */
  .about-partner {
    margin-left: 0;
  }

  .recruitment-form-wrapper {
    padding: var(--space-xl);
  }

  .advantage-card {
    padding: var(--space-xl);
  }

  .event-card {
    grid-template-columns: 80px 1fr;
  }
}

/* ───────────────────────────────────────────
   PRINT STYLES
   ─────────────────────────────────────────── */
@media print {
  .site-header,
.hamburger,
.hero-bg,
.hero-visual,
.hero-floating {
    display: none;
  }

  .section {
    padding: 2rem 0;
    break-inside: avoid;
  }

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

  a {
    color: #000;
    text-decoration: underline;
  }
}