@media (max-width: 900px) {
  .nav-links { display: none; }
  .hero-grid, .problem, .duo-grid, .fatigue-grid, .fit { grid-template-columns: 1fr; }
  .hero-grid { min-height: auto; padding: 80px 0 50px; }
  .hero-product { order: -1; }
  .hero-product img { max-width: 210px; }
  .hero-product.hero-product-desktop { display: none; }
  .hero-product.hero-product-mobile { display: flex; margin: 18px 0 8px; }
  .hero-product-mobile img { max-width: 210px; }
  .product-grid, .steps { grid-template-columns: 1fr; }
  .product-card.featured { transform: none; }
  .product-body p { min-height: 0; }
  .stats-grid { grid-template-columns: repeat(2, 1fr); }
  .stat:nth-child(2) { border-right: 0; }
  .stat:nth-child(-n + 2) { border-bottom: 1px solid rgba(0, 0, 0, .14); }
  .section { padding: 70px 0; }
  .problem { gap: 35px; }
  .noise-box { min-height: 330px; }
}

@media (max-width: 600px) {
  html, body { max-width: 100%; }
  body { overflow-x: hidden; padding-bottom: 70px; }
  .container { width: calc(100% - 24px); }
  .topbar { display: none; }
  .nav-inner { height: 58px; }
  .nav .btn { padding: 11px 12px; font-size: 12px; }
  .hero-grid { padding-top: 64px; }
  .hero h1 { font-size: clamp(38px, 12vw, 46px); overflow-wrap: anywhere; }
  .hero p { font-size: 17px; }
  .hero-product { margin-bottom: -15px; }
  .hero-product-mobile { margin: 14px 0 8px; }
  .hero-product-mobile img { max-width: 190px; }
  .hero-actions, .hero-actions .btn { width: 100%; }
  .btn { max-width: 100%; padding-inline: 16px; text-align: center; white-space: normal; }
  .stat { padding: 18px 10px; }
  .stat strong { font-size: 20px; }
  .section { padding: 58px 0; }
  .section-head { margin-bottom: 32px; }
  h2 { font-size: clamp(32px, 10vw, 42px); }
  .product-img { min-height: 270px; }
  .product-img img { height: 245px; }
  .product-body { padding: 22px 18px; }
  .noise-box { padding: 28px; }
  .noise-number { font-size: clamp(112px, 43vw, 165px); }
  .noise-caption { right: 28px; bottom: 25px; left: 28px; }

  /* Turn the wide product matrix into readable, full-width cards. */
  .compare { margin-top: 32px; overflow: visible; }
  .compare table, .compare tbody, .compare tr, .compare td {
    display: block;
    width: 100%;
    min-width: 0;
  }
  .compare thead { display: none; }
  .compare tr {
    margin-bottom: 14px;
    overflow: hidden;
    background: #141414;
    border: 1px solid var(--line);
    border-radius: 10px;
  }
  .compare td {
    display: grid;
    grid-template-columns: minmax(86px, .8fr) minmax(0, 1.2fr);
    gap: 12px;
    align-items: center;
    padding: 11px 13px;
    overflow-wrap: anywhere;
    border-bottom: 1px solid var(--line);
  }
  .compare td:last-child { border-bottom: 0; }
  .compare td:first-child {
    display: block;
    padding: 13px;
    color: #111;
    background: var(--yellow);
    font-size: 14px;
  }
  .compare td:not(:first-child)::before {
    color: #fff;
    font-size: 12px;
    font-weight: 800;
  }
  .compare td:nth-child(2)::before { content: "Tour"; }
  .compare td:nth-child(3)::before { content: "Sport"; }
  .compare td:nth-child(4)::before { content: "Duo Pack"; }

  /* Keep the risk data readable instead of squeezing three desktop columns. */
  .db-table { overflow: visible; background: transparent; }
  .db-row.db-head { display: none; }
  .db-row:not(.db-head) {
    display: grid;
    grid-template-columns: 1fr 1fr;
    margin-bottom: 10px;
    overflow: hidden;
    background: #111;
    border: 0;
    border-radius: 10px;
  }
  .db-row:not(.db-head) > * {
    display: flex;
    gap: 8px;
    justify-content: space-between;
    padding: 11px 13px;
    font-size: 14px;
  }
  .db-row:not(.db-head) > *::before {
    color: #999;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
  }
  .db-row:not(.db-head) > :nth-child(1)::before { content: "Sebesség"; }
  .db-row:not(.db-head) > :nth-child(2)::before { content: "Szélzaj"; }
  .db-row:not(.db-head) > :nth-child(3) {
    grid-column: 1 / -1;
    border-top: 1px solid var(--line);
  }
  .db-row:not(.db-head) > :nth-child(3)::before { content: "Kockázat nélkül"; }

  .footer-inner { flex-direction: column; }
  .footer-links { gap: 12px 18px; }
  .mobile-cta { display: block; }
  .cookie-banner {
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 16px;
    border-radius: 14px 14px 0 0;
    transform: translateY(100%);
  }
  .cookie-banner.visible { transform: translateY(0); }
  .cookie-banner-wrap, .cookie-banner-actions, .cookie-modal-footer {
    flex-direction: column;
    align-items: stretch;
  }
  .cookie-banner-actions .cookie-btn, .cookie-modal-footer .cookie-btn { width: 100%; }
  .cookie-modal-backdrop { padding: 12px; }
  .cookie-modal-body { padding: 16px; }
  .cookie-details-table-wrap {
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .cookie-details-table { min-width: 420px; table-layout: fixed; }
  .cookie-details-table code { overflow-wrap: anywhere; }
  .cookie-floating-btn { bottom: 74px; left: 14px; width: 38px; height: 38px; }
}

@media (max-width: 360px) {
  .logo { font-size: 18px; }
  .nav .btn { font-size: 11px; }
  .kicker { font-size: 10px; }
  .hero h1 { font-size: 38px; }
  .product-body h3 { font-size: 25px; }
  .price { font-size: 26px; }
}