/* ============================================================
   Responsive overrides. Keep section rules with their section;
   keep breakpoint changes here so they are auditable in one place.
   ============================================================ */
@media(max-width:1200px){
  .pf__grid{grid-template-columns:repeat(3, minmax(0, 1fr))}
  .pf__item--featured{grid-column:span 2;grid-row:auto}
}

@media(max-width:980px){
  .nav__links{display:none}
  .nav__burger{display:block}
  .pf__grid{grid-template-columns:repeat(2, minmax(0, 1fr));gap:10px}
  .pf__item--featured{grid-column:span 2;grid-row:auto}
  .cl__wall{grid-template-columns:repeat(2,1fr)}
  .cl__wall li:nth-child(4n){border-right:1px solid var(--color-line)}
  .cl__wall li:nth-child(2n){border-right:0}
}

@media(max-width:900px){
  .lb__prev{left:8px;top:-60px}
  .lb__next{left:70px;top:-60px;right:auto}
  .ct__grid{grid-template-columns:1fr}
  .frow{grid-template-columns:1fr}
  .ab__grid{grid-template-columns:1fr}
  .ab__media{min-height:0;height:74vw;max-height:480px}
  .stats{grid-template-columns:1fr 1fr;border-top:0}
  .stat:nth-child(odd){border-left:0;padding-left:0}
  .stat{border-top:1px solid var(--color-line);padding-top:22px}
}

@media(max-width:760px){
  .foot__grid{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    border-top:1px solid var(--color-line);
    padding-top:14px;
    gap:16px;
  }
  .foot__col{
    border-top:0;
    padding-top:0;
  }
  .foot__col--mid{
    display:none;
  }
  .svc__row{grid-template-columns:44px minmax(0,1fr) 44px}
  .svc__hint{display:none}
  .svc__title{font-size:clamp(1.15rem,5.2vw,2rem)}
  .svc__cnt{padding-left:0}
}

@media(max-width:640px){
  .pf__grid,
  body[data-category] .pf__grid{grid-template-columns:1fr;gap:12px}
  .pf__item--featured{grid-column:auto;grid-row:auto}
  .pf__head{margin-bottom:14px}
  .pf__tabs{gap:2px 14px}
  .tst{grid-template-columns:1fr}
}

@media(max-width:420px){
  .page-bar{font-size:9.5px}
}

@media(max-width:380px){
  .cl__wall{grid-template-columns:1fr}
  .cl__wall li{border-right:0}
}

@media(max-width:350px){
  .sec__title,
  .ct__big{font-size:2rem}
}

@media(prefers-reduced-motion:reduce){
  *,
  *::before,
  *::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
}
