/* Shared blog chrome (inc/blog.php): breadcrumbs, title card, Browse by
   category, post cards, the post header, full-bleed featured photo, older and
   newer links, related posts and paging. Colours, type and surfaces come from
   the look's variables; a look may set the --sc-blog-* ones below.
   Widths: phone up to 640px, tablet to 1024px, desktop above. */
:where(:root) {
  --sc-blog-card-tint: var(--sc-band);
  --sc-blog-soft: var(--sc-band);
  --sc-blog-current: var(--sc-band);
  --sc-blog-current-line: var(--sc-line);
  --sc-blog-button: var(--sc-heading);
  --sc-blog-button-ink: #fff;
}
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.sc-blog-wrap { width: min(var(--sc-wide), calc(100% - 2 * var(--sc-gutter))); margin-inline: auto; }
.sc-blog-sep { margin-inline: 8px; color: var(--sc-muted); opacity: .6; }
.sc-blog-main { overflow-x: clip; }

/* Breadcrumbs sit under the floating header. */
.sc-breadcrumbs { padding-top: 92px; color: var(--sc-muted); font-size: 14px; line-height: 1.5; }
.admin-bar .sc-breadcrumbs { padding-top: 124px; }
.sc-breadcrumbs p { display: flex; flex-wrap: wrap; align-items: center; column-gap: 8px; margin: 0; }
.sc-breadcrumbs a { color: var(--sc-muted); text-decoration: none; }
.sc-breadcrumbs a:hover { color: var(--sc-heading); text-decoration: underline; }
.sc-breadcrumbs [aria-current] { color: var(--sc-text); }
.sc-breadcrumbs__sep { opacity: .6; }
/* A slider placed under the menu (ShootCal Slider) opens the page behind the floating
   header, so the breadcrumbs that follow it need no room for the header. */
.sc-page-opening > .natural-photo-slider { margin-top: 0; }
.sc-page-opening:has(+ .sc-breadcrumbs) > .natural-photo-slider { margin-bottom: 24px; }
.sc-page-opening + .sc-breadcrumbs, .admin-bar .sc-page-opening + .sc-breadcrumbs { padding-top: 0; margin-bottom: 32px; }

/* Rounded title card (lists and posts). */
.sc-title-card-wrap { padding-top: 24px; }
.sc-title-card {
  position: relative; overflow: hidden; padding: 56px; border-radius: 32px; text-align: center;
  background: linear-gradient(110deg, var(--sc-paper) 0%, var(--sc-blog-card-tint) 100%);
  box-shadow: 0 0 0 1px var(--sc-line), var(--sc-shadow);
}
.sc-managed-site .sc-title-card__eyebrow { margin: 0 0 16px; color: var(--sc-accent); font: 500 13px/1.5 var(--sc-sans); letter-spacing: .16em; text-transform: uppercase; }
.sc-title-card__eyebrow a { color: inherit; text-decoration: none; }
.sc-title-card__eyebrow a:hover { text-decoration: underline; text-underline-offset: 3px; }
.sc-managed-site .sc-title-card__title { max-width: 900px; margin: 0 auto; font-size: clamp(32px, 2vw + 16px, 52px); line-height: 1.08; text-wrap: balance; }
.sc-title-card__title::after { content: ""; display: block; width: 56px; height: 1px; margin: 24px auto 0; background: var(--sc-accent); }
.sc-managed-site .sc-title-card__meta, .sc-managed-site .sc-title-card__powered { margin: 24px 0 0; color: var(--sc-muted); font-size: 15px; letter-spacing: .04em; }
.sc-managed-site .sc-title-card__powered { margin-top: 16px; font-size: 14px; }
.sc-title-card__meta a, .sc-title-card__powered a { color: var(--sc-muted); }
.sc-title-card__meta a { text-decoration: none; }
.sc-title-card__meta a:hover, .sc-title-card__powered a:hover { color: var(--sc-heading); }
.sc-title-card__intro { max-width: 720px; margin: 24px auto 0; color: var(--sc-muted); font-size: 17px; }
.sc-title-card__intro > :last-child { margin-bottom: 0; }

/* Browse by category: a native disclosure, no script. */
.sc-browse { margin-top: 32px; }
.sc-browse__summary { display: block; cursor: pointer; list-style: none; }
.sc-browse__summary::-webkit-details-marker { display: none; }
.sc-browse__face {
  display: flex; min-height: 64px; align-items: center; gap: 16px; padding: 8px 8px 8px 24px; border-radius: 999px;
  background: var(--sc-glass); box-shadow: 0 0 0 1px var(--sc-line), var(--sc-shadow);
  -webkit-backdrop-filter: blur(24px) saturate(1.5); backdrop-filter: blur(24px) saturate(1.5);
}
.sc-browse__label { display: flex; min-width: 0; flex: 1; flex-direction: column; line-height: 1.25; }
.sc-browse__kicker { color: var(--sc-accent); font-size: 11.5px; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; }
.sc-browse__current { overflow: hidden; padding-top: 2px; color: var(--sc-heading); font: 400 19px/1.25 var(--sc-serif); text-overflow: ellipsis; white-space: nowrap; }
.sc-browse__total { color: var(--sc-muted); font: 400 14px/1.25 var(--sc-sans); }
.sc-browse__button {
  display: inline-flex; min-height: 48px; flex-shrink: 0; align-items: center; gap: 8px; padding-inline: 20px; border-radius: 999px;
  background: var(--sc-blog-button); color: var(--sc-blog-button-ink); font-size: 15px; font-weight: 600; transition: filter .15s;
}
.sc-browse__summary:hover .sc-browse__button { filter: brightness(1.25); }
.sc-browse__icon, .sc-chevron { width: 17px; height: 17px; flex-shrink: 0; }
.sc-chevron { transition: rotate .3s var(--sc-ease); }
.sc-browse__menu[open] .sc-browse__chevron, .sc-browse__group[open] .sc-browse__group-chevron { rotate: 180deg; }
.sc-browse__sheet { margin-top: 16px; padding: 28px; border-radius: 28px; background: var(--sc-bg); box-shadow: 0 0 0 1px var(--sc-line), var(--sc-shadow); }
.sc-browse__pinned, .sc-browse__list { margin: 0; padding: 0; list-style: none; }
.sc-browse__pinned { display: grid; gap: 12px; }
.sc-browse__groups { display: grid; align-items: start; gap: 12px; margin-top: 20px; }
.sc-browse__group { min-width: 0; border-radius: 20px; background: color-mix(in srgb, var(--sc-blog-soft) 60%, transparent); box-shadow: 0 0 0 1px var(--sc-line); }
.sc-browse__group-toggle { display: flex; min-height: 56px; align-items: center; gap: 12px; padding: 8px 12px; border-radius: 20px; color: var(--sc-heading); cursor: pointer; list-style: none; }
.sc-browse__group-toggle::-webkit-details-marker { display: none; }
.sc-browse__group-toggle:hover { background: rgb(0 0 0 / .04); }
.sc-browse__group-title { min-width: 0; flex: 1; font-size: 15px; font-weight: 600; line-height: 1.375; }
.sc-browse__group--primary .sc-browse__group-title { font-size: 17px; }
.sc-browse__list { padding: 0 8px 8px; }
.sc-browse__list--primary, .sc-browse__group--primary .sc-browse__list { display: grid; column-gap: 12px; }
.sc-browse__count { flex-shrink: 0; color: var(--sc-muted); font-size: 13px; font-variant-numeric: tabular-nums; }
.sc-browse__thumb { width: 44px; height: 44px; flex-shrink: 0; border-radius: 12px; background: var(--sc-blog-soft); }
img.sc-browse__thumb { object-fit: cover; }
.sc-managed-site .sc-browse__item { display: flex; min-height: 48px; align-items: center; gap: 12px; padding: 6px 12px 6px 6px; border-radius: 16px; color: var(--sc-text); text-decoration: none; }
.sc-managed-site .sc-browse__item:hover { background: rgb(0 0 0 / .05); }
.sc-browse__item--nested { margin-left: 20px; }
.sc-browse__item--pinned { background: var(--sc-blog-soft); box-shadow: 0 0 0 1px var(--sc-line); }
.sc-managed-site .sc-browse__item.is-current, .sc-managed-site .sc-browse__item.is-current:hover { background: var(--sc-blog-current); box-shadow: 0 0 0 1px var(--sc-blog-current-line); }
.sc-browse__name { min-width: 0; flex: 1; font-size: 15.5px; line-height: 1.375; }

/* Post cards: the whole card is one title link. */
.sc-blog-list { margin-top: 56px; }
.sc-card-grid { display: grid; grid-template-columns: minmax(0, 1fr); column-gap: 32px; row-gap: 56px; }
.sc-card-grid--after-lead { margin-top: 64px; padding-top: 64px; border-top: 1px solid var(--sc-line); }
.sc-card { position: relative; display: flex; flex-direction: column; }
.sc-card-media { position: relative; overflow: hidden; border-radius: 22px; background: var(--sc-blog-soft); box-shadow: var(--sc-shadow); }
.sc-managed-site .sc-card-image { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; transition: scale .7s var(--sc-ease); }
.sc-card:hover .sc-card-image { scale: 1.03; }
.sc-card-tag {
  position: absolute; top: 16px; left: 16px; display: inline-flex; min-height: 32px; align-items: center; padding-inline: 14px; border-radius: 999px;
  background: var(--sc-glass); color: var(--sc-heading); font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase;
  box-shadow: var(--sc-shadow); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
}
.sc-card-copy { display: flex; flex-direction: column; gap: 12px; padding-top: 20px; }
.sc-card--lead .sc-card-copy { padding-top: 24px; }
.sc-managed-site .sc-card-meta { margin: 0; color: var(--sc-muted); font-size: 14px; letter-spacing: .04em; }
.sc-managed-site .sc-card-title { margin: 0; font-size: clamp(22px, .5vw + 18px, 26px); line-height: 1.15; text-wrap: balance; }
/* Blog list cards (lead and grid) carry the large story title; related cards keep the small one. */
.sc-managed-site .sc-blog-list .sc-card-title { font-size: clamp(32px, 2.2vw + 14px, 48px); line-height: 1.08; }
.sc-managed-site .sc-card-link { color: var(--sc-heading); text-decoration: none; }
.sc-card-link::after { content: ""; position: absolute; inset: 0; }
.sc-managed-site .sc-card:hover .sc-card-link { color: var(--sc-accent); }
.sc-managed-site .sc-card-summary { margin: 0; color: var(--sc-muted); font-size: 15.5px; display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.sc-managed-site .sc-card--lead .sc-card-summary { font-size: 17px; display: block; }
.sc-blog-empty { color: var(--sc-muted); text-align: center; }

/* Single posts. */
.sc-managed-site .sc-post-hero { width: min(1600px, calc(100% - 12px)); margin: 40px auto 0; }
.sc-managed-site .sc-post-hero__image { display: block; width: 100%; height: auto; }
.sc-single .sc-post-body { margin-top: 48px; }
.sc-post-neighbors { display: grid; gap: 16px; margin-top: 64px; }
.sc-managed-site .sc-post-step {
  display: flex; flex-direction: column; gap: 6px; padding: 24px 28px; border-radius: 22px; background: var(--sc-paper);
  text-decoration: none; box-shadow: 0 0 0 1px var(--sc-line), var(--sc-shadow); transition: translate .3s var(--sc-ease);
}
.sc-post-step:hover { translate: 0 -2px; }
.sc-post-step__label { color: var(--sc-muted); font-size: 13px; letter-spacing: .14em; text-transform: uppercase; }
.sc-post-step__title { color: var(--sc-heading); font: 400 21px/1.375 var(--sc-serif); }
.sc-related { margin-top: 96px; }
.sc-managed-site .sc-related__title { margin: 0; text-align: center; }
.sc-related__title::after { content: ""; display: block; width: 56px; height: 1px; margin: 22px auto 0; background: var(--sc-accent); }
.sc-related .sc-card-grid { margin-top: 48px; }

/* Paging. */
.sc-pager { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px; margin-top: 80px; }
.sc-managed-site .sc-pager__pill { display: inline-flex; min-width: 44px; min-height: 44px; align-items: center; justify-content: center; padding-inline: 16px; border-radius: 999px; color: var(--sc-text); font-size: 15px; text-decoration: none; }
.sc-managed-site a.sc-pager__pill:hover { background: rgb(0 0 0 / .05); }
.sc-pager__step { box-shadow: 0 0 0 1px var(--sc-line); }
.sc-managed-site .sc-pager__current { background: var(--sc-blog-button); color: var(--sc-blog-button-ink); }
.sc-pager__gap { padding-inline: 4px; color: var(--sc-muted); }

/* Not found (404.php): a search box and starting links inside the title card. */
.sc-managed-site .sc-not-found__intro { max-width: 560px; margin: 20px auto 0; color: var(--sc-muted); font-size: 17px; }
.sc-not-found__search { position: relative; width: 100%; max-width: 640px; margin: 32px auto 0; }
.sc-not-found__search input { width: 100%; min-height: 56px; padding: 0 128px 0 24px; border: 1px solid var(--sc-line); border-radius: 999px; background: var(--sc-paper); color: var(--sc-text); font: inherit; font-size: 17px; box-shadow: var(--sc-shadow); appearance: none; }
.sc-not-found__search input:focus { border-color: var(--sc-accent); outline: none; }
.sc-not-found__search button { position: absolute; top: 6px; right: 6px; bottom: 6px; padding: 0 24px; border: 0; border-radius: 999px; background: var(--sc-blog-button); color: var(--sc-blog-button-ink); font: inherit; font-size: 15px; font-weight: 600; cursor: pointer; }
.sc-not-found__search button:hover { filter: brightness(1.15); }
.sc-not-found__links { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin: 32px 0 0; padding: 0; list-style: none; }
.sc-managed-site .sc-not-found__links a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 20px; border: 1px solid var(--sc-line); border-radius: 999px; background: var(--sc-paper); color: var(--sc-text); font-size: 15px; font-weight: 500; text-decoration: none; }
.sc-managed-site .sc-not-found__links a:hover { border-color: var(--sc-accent); color: var(--sc-accent); }
.sc-not-found .sc-related { margin-top: 56px; }

@media (min-width: 641px) {
  .sc-card-grid, .sc-post-neighbors, .sc-browse__pinned, .sc-browse__groups { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sc-browse__group--primary { grid-column: 1 / -1; }
  .sc-browse__group--primary .sc-browse__list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .sc-browse__narrow { display: none; }
  .sc-post-step--newer { grid-column-start: 2; text-align: right; }
}
@media (min-width: 1025px) {
  .sc-card--lead { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); align-items: center; gap: 48px; }
  .sc-card--lead .sc-card-copy { padding-top: 0; }
}
@media (max-width: 1024px) {
  .sc-title-card { padding-inline: 40px; }
}
@media (max-width: 640px) {
  .sc-breadcrumbs { padding-top: 76px; }
  .admin-bar .sc-breadcrumbs { padding-top: 122px; }
  .sc-title-card-wrap { padding-top: 16px; }
  .sc-title-card { padding: 40px 20px; border-radius: 24px; }
  .sc-blog-list { margin-top: 40px; }
  .sc-card-grid--after-lead { margin-top: 48px; padding-top: 48px; }
  .sc-browse { margin-top: 24px; }
  .sc-browse__face { min-height: 56px; gap: 12px; padding-left: 16px; }
  .sc-browse__current { font-size: 17px; }
  .sc-browse__total, .sc-browse__wide { display: none; }
  .sc-browse__button { min-height: 44px; padding-inline: 16px; }
  .sc-browse__sheet { padding: 16px; border-radius: 22px; }
  .sc-browse__item--nested { margin-left: 16px; }
  .sc-managed-site .sc-post-hero { width: 100%; margin-top: 24px; }
  .sc-single .sc-post-body { margin-top: 32px; }
  .sc-related { margin-top: 64px; }
  .sc-pager { margin-top: 56px; }
  .sc-not-found__search input { min-height: 48px; padding: 0 96px 0 20px; font-size: 16px; }
  .sc-not-found__search button { padding: 0 16px; }
  .sc-not-found .sc-related { margin-top: 40px; }
}
@media (prefers-reduced-motion: reduce) {
  .sc-card-image, .sc-post-step, .sc-chevron { transition: none; }
}

/* Post photos (inc/blog-photos.php), ported from the live Ryan Smith
   Photography blog. Photos run the full width of the screen (up to 1600px)
   with a thin 6px gutter, a 1px hairline between photos; two upright photos
   share a row; a lone upright photo fits the screen's height. Captions are
   visually hidden and show in the lightbox (the Lightbox with PhotoSwipe plugin). */
.sc-single .sc-post-body > :is(.sc-photo, .sc-photo-pair) { width: min(1600px, 100% - 12px); max-width: none; margin-inline: auto; }
.sc-single .sc-post-body > * + :is(.sc-photo, .sc-photo-pair),
.sc-single .sc-post-body > :is(.sc-photo, .sc-photo-pair) + * { margin-top: 40px; }
.sc-single .sc-post-body > :is(.sc-photo, .sc-photo-pair) + :is(.sc-photo, .sc-photo-pair) { margin-top: 1px; }
.sc-single .sc-post-body > :is(.sc-photo, .sc-photo-pair):has(+ *) { margin-bottom: 0; }
.sc-photo { margin-block: 0; }
.sc-photo > a, .sc-post-hero__link { display: block; overflow: hidden; background: var(--sc-blog-soft); cursor: zoom-in; }
.sc-photo a:not([data-lbwps-width]) { cursor: pointer; }
.sc-photo a:focus-visible, .sc-post-hero__link:focus-visible { outline: 2px solid var(--kit-focus, var(--sc-accent)); outline-offset: 3px; }
.sc-managed-site .sc-photo img { display: block; width: 100%; height: auto; border-radius: 0; box-shadow: none; }
.sc-photo-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; align-items: start; }
.sc-photo-pair > .sc-photo { width: auto; margin: 0; }
/* A native Gallery with its own caption keeps its figure around the photos. */
.sc-photo.wp-block-gallery { display: block; }
.sc-photo.wp-block-gallery > .sc-photo + .sc-photo, .sc-photo.wp-block-gallery > .sc-photo-pair, .sc-photo.wp-block-gallery > .sc-photo + .sc-photo-pair { margin-top: 1px; }
@media (min-width: 641px) {
  .sc-photo--tall a { width: fit-content; max-width: 100%; margin-inline: auto; }
  .sc-managed-site .sc-photo--tall img { width: auto; max-width: 100%; max-height: calc(100svh - 12px); }
}
@media (max-width: 640px) {
  .sc-single .sc-post-body > :is(.sc-photo, .sc-photo-pair) { width: 100%; }
  .sc-single .sc-post-body > * + :is(.sc-photo, .sc-photo-pair),
  .sc-single .sc-post-body > :is(.sc-photo, .sc-photo-pair) + * { margin-top: 28px; }
  .sc-single .sc-post-body > :is(.sc-photo, .sc-photo-pair) + :is(.sc-photo, .sc-photo-pair) { margin-top: 1px; }
}