/* Test-site photography: full-frame images and concise descriptions. */
.about-test-sites { scroll-margin-top:90px; }
.test-sites-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; }
.test-site-card { min-width:0; overflow:hidden; border:1px solid #e0e6ef; border-radius:14px; background:#fff; }
.test-site-photo { display:block; overflow:hidden; background:#f3f6fa; cursor:zoom-in; }
.test-site-photo img { display:block; width:100%; height:auto; object-fit:contain; }
.test-site-copy { padding:24px 26px 26px; }
.test-site-copy h3 { margin:0 0 8px; color:var(--ink,#172c48); font-size:21px; font-weight:600; line-height:1.5; }
.test-site-copy p { margin:0; color:var(--muted,#76849b); font-size:14px; line-height:1.9; }
.test-site-copy .test-site-type { margin:0 0 12px; color:#526b8c; font-size:14px; font-weight:500; line-height:1.7; }
.test-site-photo:focus-visible { outline:3px solid #668dd3; outline-offset:-3px; }
@media(max-width:760px) {
  .test-sites-grid { grid-template-columns:1fr; gap:22px; }
  .test-site-copy { padding:20px; }
  .test-site-copy h3 { font-size:20px; }
}

/* One venue per page, with the full original photograph and its introduction. */
.about-test-sites .test-sites-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; }
.test-sites-controls { display:flex; align-items:center; gap:10px; flex:none; }
.test-sites-controls[hidden] { display:none; }
.test-sites-controls>span { min-width:42px; margin-right:8px; color:#8492a6; font-size:12px; font-variant-numeric:tabular-nums; }
.test-sites-controls button { display:grid; place-items:center; width:40px; height:40px; padding:0; border:1px solid #dce4ef; border-radius:50%; background:#fff; color:#526781; cursor:pointer; }
.test-sites-controls button:hover:not(:disabled) { background:#f1f5fd; border-color:#bfd0ec; }
.test-sites-controls button:disabled { opacity:.35; cursor:default; }
.test-sites-grid { display:flex; gap:24px; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; overscroll-behavior-x:contain; }
.test-sites-grid::-webkit-scrollbar { display:none; }
.test-sites-grid>.test-site-card { box-sizing:border-box; flex:0 0 100%; display:grid; grid-template-columns:minmax(0,3fr) minmax(0,2fr); scroll-snap-align:start; scroll-snap-stop:always; }
.test-sites-grid .test-site-photo { align-self:center; }
.test-sites-grid .test-site-copy { align-self:center; padding:32px; }
.test-sites-grid .test-site-copy h3 { font-size:24px; margin-bottom:12px; }
.test-sites-grid .test-site-copy .test-site-type { margin-bottom:16px; }
.test-sites-grid>.test-site-future { display:flex; flex-direction:column; justify-content:center; align-items:center; min-height:320px; padding:40px 24px; text-align:center; border-style:dashed; background:linear-gradient(145deg,#fafbfe,#f0f4fa); }
.test-site-future-mark { color:#a2b4cf; font-size:44px; letter-spacing:.2em; line-height:1; }
.test-site-future h3 { margin:22px 0 10px; color:#8b99ac; font-size:22px; font-weight:500; }
.test-site-future p { margin:0; color:#8b99ac; font-size:14px; line-height:1.8; }
.about-test-sites :is(button,[tabindex]):focus-visible { outline:2px solid #4d79ce; outline-offset:-3px; }
@media(max-width:760px) {
 .about-test-sites .test-sites-heading { align-items:center; gap:12px; }
 .test-sites-controls { gap:6px; }
 .test-sites-controls>span { min-width:30px; margin-right:0; }
 .test-sites-controls button { width:36px; height:36px; }
 .test-sites-grid>.test-site-card { grid-template-columns:1fr; grid-template-rows:auto 1fr; }
 .test-sites-grid .test-site-copy { padding:20px; }
 .test-sites-grid .test-site-copy h3 { font-size:20px; margin-bottom:8px; }
 .test-sites-grid .test-site-copy .test-site-type { margin-bottom:12px; }
 .test-sites-grid>.test-site-future { min-height:400px; }
}
