/* WordPress-only adjustments. The variant stylesheets are untouched exports of
   the static designs; everything that exists because this is WordPress lives
   here, so a design tweak never has to be made in two places. */

/* The admin bar is 32px tall (46px on small screens) and is fixed, so anything
   the variants pin to the top of the viewport has to move down for logged-in
   users. */
.admin-bar .cy-lb,
.admin-bar .detail,
.admin-bar .peek,
.admin-bar .scrim {
  top: 32px;
}
@media screen and (max-width: 782px) {
  .admin-bar .cy-lb,
  .admin-bar .detail,
  .admin-bar .peek,
  .admin-bar .scrim {
    top: 46px;
  }
}

/* Server-rendered pages: single project, page, archive, 404. These reuse the
   variant's .cy-d-* typography, so they only need spacing. */
.cy-single {
  padding-top: clamp(24px, 4vw, 48px);
  padding-bottom: clamp(60px, 9vw, 120px);
}
.cy-single-back {
  margin: 0 0 clamp(18px, 3vw, 30px);
  font-size: 12px;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.cy-single-back a {
  text-decoration: none;
  opacity: .75;
}
.cy-single-back a:hover {
  opacity: 1;
}
.cy-single-content {
  max-width: 68ch;
}
.cy-single-content img,
.cy-single-content iframe {
  max-width: 100%;
  height: auto;
}
.cy-single .cy-d-gal a.cy-d-shot {
  display: block;
}
.cy-single .cy-d-nav a {
  text-decoration: none;
}
.cy-single-entry + .cy-single-entry {
  margin-top: clamp(32px, 5vw, 64px);
}

/* No-JS floor. The variants build their grids client-side; this list is what
   is left when that cannot run, and what a crawler reads. */
.cy-noscript {
  padding: clamp(24px, 4vw, 48px) 0;
}
.cy-noscript ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.cy-noscript li {
  padding: 10px 0;
  border-bottom: 1px solid rgba(128, 128, 128, .25);
}
.cy-noscript li span {
  opacity: .6;
  font-size: 12px;
  margin-left: 10px;
}

/* WordPress core markup that can appear inside page/post content. */
.alignwide,
.alignfull {
  max-width: 100%;
}
.wp-caption img,
.wp-block-image img {
  max-width: 100%;
  height: auto;
}
.screen-reader-text {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  white-space: nowrap;
}
