/* ============================================
   Responsive — Tablet 768 / Mobile 380
   ============================================ */

@media (max-width: 1180px) {
  :root { --section-y: 100px; }
  .stats__head { grid-template-columns: 1fr; gap: 16px; }
  .stat-row { gap: 40px; }
  .projects__grid { grid-template-columns: repeat(2, 1fr); }
  .test__grid { grid-template-columns: repeat(2, 1fr); }
  .footer__top { grid-template-columns: 1.4fr 1fr 1fr; }
}

@media (max-width: 1100px) {
  :root { --section-y: 80px; --gutter: 24px; }
  .nav__menu { display: none; }
  .nav__support { display: none; }
  .nav__lang { display: none; }
  .nav-lang { display: none; }
  .stats__rows { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .nav__right > .btn--primary { display: none; }
  .nav__burger {
    display: inline-flex; align-items: center; justify-content: center;
    width: 44px; height: 44px;
    padding: 0;
    margin-right: -8px;
  }
  .nav__burger svg { width: 22px; height: 22px; }
  .nav__right { gap: 4px; margin-left: auto; }
  .hero__grid { grid-template-columns: 1fr; gap: 36px; }
  .hero__visual { aspect-ratio: 5/4; order: -1; }
  .hero__sub { max-width: 100%; }
  .how__flow {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .how__arrow {
    width: 100%;
    padding-top: 0;
    height: 32px;
    justify-self: center;
  }
  .how__arrow svg {
    width: 32px;
    height: 32px;
    transform: rotate(90deg);
  }
  .hero__dotgrid { width: 240px; height: 240px; top: 40px; left: -100px; }
  .hero__blob { width: 360px; height: 360px; top: -100px; right: -150px; }
  .mission__ornament { width: 420px; height: 420px; right: -180px; opacity: 0.7; }
  .cta-section__arcs { transform: translate(-50%, -42%); height: 480px; }
  .serv-banner__grid { grid-template-columns: 1fr; gap: 32px; }
  .serv-banner__cta { justify-self: start; }
  .serv-banner__preview { order: 2; }
  .serv-banner__copy { display: contents; }
  .serv-banner h2 { order: 1; }
  .serv-banner__lead { order: 2; }
  .serv-banner__preview { order: 3; }
  .serv-banner__cta { order: 4; margin-top: 0; }
  .how__grid { grid-template-columns: 1fr; }
  .step { min-height: auto; }
  .mission__layout { grid-template-columns: 1fr; column-gap: 0; row-gap: 28px; }
  .mission__label { margin-bottom: 0; }
  .mission__vision { grid-column: 1; padding-left: 20px; }
  .events__grid { grid-template-columns: repeat(2, 1fr); }
  .blog__grid { grid-template-columns: 1fr; gap: 48px; }
  .faq__grid { grid-template-columns: 1fr; gap: 40px; }
  .faq__title { margin-bottom: 32px; }
  .faq__side { position: static; top: auto; }
  .footer__top { grid-template-columns: 1fr 1fr; }
  .footer__brand { grid-column: 1 / -1; }
  /* Inner-page utility grids: 4/3 columns → 2 on tablets */
  .grid--3, .grid--4, .speakers { grid-template-columns: repeat(2, 1fr); }
  .steps { grid-template-columns: repeat(2, 1fr); }
  .counters { grid-template-columns: repeat(2, 1fr); row-gap: 40px; }
}

@media (max-width: 860px) {
  /* Asymmetric copy/media utility grids stack below tablet width */
  .grid--3-2, .grid--portrait, .grid--2-1, .grid--1-2 { grid-template-columns: 1fr; }
}

@media (max-width: 680px) {
  :root { --section-y: 64px; --gutter: 20px; --container: 100%; }
  body { font-size: 16px; }
  .hero { padding: 32px 0 64px; }
  .front-page .hero { padding: 24px 0 48px; }
  .hero__actions .btn { flex: 1 1 auto; justify-content: center; }
  .hero__meta { gap: 16px; }
  .hero__eyebrow { margin-bottom: 18px; font-size: 12px; }
  .hero__title em::before { bottom: -8px; height: 10px; }
  .hero__dotgrid, .hero__blob { display: none; }
  .mission__ornament { display: none; }
  .event__bar { width: 3px; }
  .event { padding-left: 24px; }
  .testimon__quote { font-size: 64px; height: 28px; }
  .stats__head { flex-direction: column; align-items: flex-start; margin-bottom: 40px; }
  .how__head, .projects__head, .events__head, .test__head, .blog__head, .sec-head {
    flex-direction: column; align-items: flex-start; gap: 16px;
  }
  /* «Шлях у цифрах» → compact 2×2 grid on mobile (client request) */
  .stats__rows {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    border: 0;
    border-radius: 0;
    overflow: visible;
  }
  .stat-line {
    grid-template-columns: 1fr;
    gap: 6px;
    padding: 20px 16px;
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    text-align: left;
  }
  .stat-line--dark { border-color: transparent; }
  .stat-line--dark + .stat-line { border-top-color: var(--line); }
  .stat-line__num { font-size: clamp(24px, 9vw, 40px); letter-spacing: -1.5px; line-height: 0.9; }
  .stat-line__sfx { font-size: 0.4em; margin-left: 3px; }
  .stat-line__label { font-size: 13.5px; line-height: 1.3; margin: 0; max-width: 100%; }
  .stat-line__body { max-width: 100%; }
  .stat-line__note { display: none; }
  .stat-line__chip { display: none; }
  .projects__grid { grid-template-columns: 1fr; }
  .test__grid { grid-template-columns: 1fr; }
  .events__grid { grid-template-columns: 1fr; }
  .footer__top { grid-template-columns: 1fr; gap: 32px; }
  .footer__bottom { flex-direction: column; align-items: flex-start; }
  .partner-logo { height: 48px; max-width: 210px; }
  .partners__track { gap: 56px; }
  .testimon__text { font-size: 15px; }
  .nav__inner { height: 64px; }
  .nav__logo img { height: 30px; }
  /* Inner-page utility grids: single column on phones */
  .grid--2, .grid--3, .grid--4, .steps, .speakers { grid-template-columns: 1fr; }
  /* .how__head is display:grid — the flex override above is a no-op for it */
  .how__head { grid-template-columns: 1fr; }
  /* Document/report rows: date+title on top, meta+action below.
     The donate selector must out-rank its desktop fixed-column rule in style.css. */
  .list-row, .page[data-page="donate"] .list-row { grid-template-columns: auto 1fr; row-gap: 6px; }
}

@media (max-width: 420px) {
  :root { --gutter: 16px; }
  .btn { padding: 12px 18px; font-size: 14px; }
  .btn--lg { padding: 14px 22px; font-size: 15px; }
  .ajax-load-button-wrapper { margin-top: 28px; }
  .ajax-load__pagination { margin-top: 16px; }
  .ajax-load__pagination ul.page-numbers { gap: 6px; }
  .ajax-load__pagination a.page-numbers,
  .ajax-load__pagination span.page-numbers {
    min-width: 36px;
    height: 36px;
    padding: 0 10px;
    font-size: 13px;
  }
  .hero__actions { gap: 10px; }
  .step { padding: 28px 24px; }
  .testimon, .event { padding: 24px 22px; }
}

/* 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;
  }
  .partners__track { animation: none; }
}

/* === Audit fixes (mobile) === */
@media (max-width: 720px) {
  .cert-card { aspect-ratio: auto; min-height: 0; }
}
@media (max-width: 920px) {
  .page[data-page="privacy"] .article-aside { order: -1; }
}
@media (max-width: 860px) {
  .split--text-first .split__media { order: 0; }
}