/* News & Events — the single-post article view and its photo strip. */

.article { max-width: 860px; }
.article-title { font-size: clamp(1.9rem, 4vw, 3rem); margin-bottom: 26px; }
.article-hero { margin-bottom: 32px; }
.article-body {
  font-size: clamp(1.02rem, 1.3vw, 1.13rem); line-height: 1.78; color: var(--ink-2);
  margin-bottom: 12px;
}

.article-block { margin-top: clamp(32px, 4vw, 52px); }
.article-block-title {
  font-family: var(--f-mono); font-size: .74rem; font-weight: 500;
  letter-spacing: .2em; text-transform: uppercase; color: var(--grey-2);
  display: flex; align-items: center; gap: 10px; margin-bottom: 16px;
}
.article-count {
  display: inline-grid; place-items: center; min-width: 22px; height: 22px;
  padding: 0 7px; border-radius: 100px; background: var(--paper-3);
  color: var(--green-deep); font-size: .7rem; letter-spacing: 0;
}

.news-gallery { position: relative; display: flex; align-items: center; gap: 10px; }
.news-gal-btn {
  flex: 0 0 auto; width: 42px; height: 42px; border-radius: 50%;
  display: grid; place-items: center; cursor: pointer;
  border: 1.4px solid var(--line); background: #fff; color: var(--navy);
  transition: all .35s var(--ease-out);
}
.news-gal-btn:hover:not(:disabled) { background: var(--green); border-color: var(--green); color: #fff; }
.news-gal-btn:disabled { opacity: .3; cursor: default; }
.news-gal-track {
  display: flex; gap: 12px; overflow-x: auto; scroll-behavior: smooth;
  scrollbar-width: none; padding-bottom: 2px;
}
.news-gal-track::-webkit-scrollbar { display: none; }
.news-gal-item {
  flex: 0 0 auto; width: clamp(150px, 22vw, 210px); aspect-ratio: 4/3;
  border-radius: var(--r); overflow: hidden; background: var(--paper-2);
}
.news-gal-item img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ease-out); }
.news-gal-item:hover img { transform: scale(1.07); }

.article-video { width: 100%; border-radius: var(--r-lg); background: #000; margin-bottom: 14px; }

.filerow {
  display: flex; align-items: center; gap: 14px; padding: 14px 18px;
  border: 1px solid var(--line); border-radius: var(--r); margin-bottom: 10px;
  color: var(--navy); transition: all .35s var(--ease-out);
}
.filerow:hover { border-color: var(--green); background: var(--paper-2); transform: translateX(4px); }
.filerow-ext {
  flex: 0 0 auto; display: grid; place-items: center; min-width: 52px; height: 40px;
  border-radius: 10px; background: var(--navy); color: #fff;
  font-family: var(--f-mono); font-size: .68rem; letter-spacing: .06em;
}
.filerow-name { flex: 1; font-weight: 500; font-size: .95rem; word-break: break-word; }
.filerow-size { font-family: var(--f-mono); font-size: .74rem; color: var(--grey-2); }

.article-back { margin-top: clamp(30px, 4vw, 48px); }
