/* Tidy list, 4 Nov 2026 (Paul). Loads after the component's own CSS, so these rules win. */

/* Blog index: the newest post sits alone across the full width and its picture is shown WHOLE, never cropped: it often carries writing. */
@media (min-width: 640px) { .gs-blogcard--first { grid-column: 1 / -1; } }
.gs-blogcard--first .gs-blogcard__pic { aspect-ratio: auto; background: transparent; }
.gs-blogcard--first .gs-blogcard__pic img { height: auto; object-fit: contain; }
@media (min-width: 1000px) {
  .gs-blogcard--first { flex-direction: row; align-items: center; }
  .gs-blogcard--first .gs-blogcard__pic { flex: 0 0 58%; }
  .gs-blogcard--first .gs-blogcard__body { padding: 2rem 2.4rem; justify-content: center; flex: 1; }
}

/* Curious Photography page: no hand-drawn "Curious Photography" labels on the pictures, the page already says it (Paul). To bring them back, delete this rule. */
.gs-grid__item a .gs-hl.gs-hl--shoot, .gs-hl--shoot { display: none !important; }

/* Packages page (Paul, 4 Nov 2026) --------------------------------------------------------------------------------------------------- */
/* Top strip: two packages across (2 x 2) with the picture large beside its words; one picture-and-words card per row on a narrow phone. */
.gs-pkgs { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.4rem; max-width: 64rem; }
.gs-pkg { display: grid; grid-template-columns: minmax(0, 48%) minmax(0, 1fr); column-gap: 1.2rem; row-gap: .5rem; align-content: start; }
.gs-pkg__pic { grid-column: 1; grid-row: 1 / span 6; }
.gs-pkg > :not(.gs-pkg__pic) { grid-column: 2; }
.gs-pkg__pic img { width: 100%; }
@media (max-width: 760px) { .gs-pkgs { grid-template-columns: minmax(0, 1fr); } }

/* "Details" lands with the package title in view, under the sticky header. */
.gs-pkgsec { scroll-margin-top: 7rem; }

/* Thumbnail galleries: every picture shown WHOLE (never cropped) in justified rows: each keeps its own shape and the row is stretched to fit. tidy.js sets --r (width / height). */
.gs-thumbs { display: flex; flex-wrap: wrap; gap: .6rem; }
.gs-thumbs::after { content: ""; flex-grow: 1000000; }
.gs-thumbs .gs-inline { --r: 1.5; flex: calc(var(--r) * 100) 1 calc(var(--r) * 10.5rem); min-width: 0; }
.gs-thumbs .gs-inline img { aspect-ratio: var(--r); object-fit: initial; width: 100%; height: auto; display: block; }
.gs-thumbs .gs-inline.gs-zoom { cursor: zoom-in; }
/* ?thumbs=cols (a preview, not the default): a staggered wall of columns instead of rows. */
.gs-thumbs--cols { display: block; columns: 3 11rem; column-gap: .6rem; }
.gs-thumbs--cols::after { display: none; }
.gs-thumbs--cols .gs-inline { display: block; margin: 0 0 .6rem; break-inside: avoid; }

/* Previous / Next under blog posts: Crossings Dartmoor lettering with an arrow, as buttons (Paul, 4 Nov 2026). The arrow is a loose pen line; to use one Paul draws, replace --gs-arrow. */
.pagenavigation { --gs-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12.3C7 11.6 13 12.6 21.5 12M15 5.2C17.6 8.2 19.6 10.2 21.8 12 19.6 13.9 17.6 15.8 15 19'/%3E%3C/svg%3E"); margin: 2.4rem 0 1rem; }
.pagenavigation a.previous, .pagenavigation a.next { display: inline-flex; align-items: center; gap: .55rem; padding: .55rem 1.2rem; border: 2px solid currentColor; border-radius: 3px; text-decoration: none;
  font: 400 1.35rem/1 var(--f-title); letter-spacing: .03em; color: var(--ink); transition: background .2s, color .2s, border-color .2s; }
.pagenavigation a.previous:hover, .pagenavigation a.next:hover, .pagenavigation a.previous:focus-visible, .pagenavigation a.next:focus-visible { background: var(--ink); color: var(--paper, #fff); border-color: var(--ink); }
.pagenavigation a > span:not(.visually-hidden) { display: none; }       /* the plain "Prev" / "Next" words and the missing icon-font arrows */
.pagenavigation a.previous::after { content: "Previous"; order: 2; }
.pagenavigation a.next::before { content: "Next"; order: 1; }
.pagenavigation a.previous::before, .pagenavigation a.next::after { content: ""; width: 1.7rem; height: 1.7rem; background: currentColor; flex: none;
  -webkit-mask: var(--gs-arrow) center / contain no-repeat; mask: var(--gs-arrow) center / contain no-repeat; }
.pagenavigation a.previous::before { order: 1; transform: scaleX(-1); }
.pagenavigation a.next::after { order: 2; }

/* Share buttons under pages and posts (Paul, 4 Nov 2026). The buttons themselves are the component's .gs-share set. */
.gs-share-wrap { max-width: 46rem; margin: 2.6rem auto 1.2rem; padding: 1.1rem 1rem 0; border-top: 1px solid var(--line, rgba(0,0,0,.15)); }
.gs-share-wrap .gs-share { margin: 0; }
.gs-share-wrap .gs-share .gs-share__label { font: 400 1.35rem/1 var(--f-title); letter-spacing: .03em; }

/* Galleries inside blog posts and pages: every picture shown WHOLE. A portrait used to be cut to a landscape box. Rows are justified: each picture keeps its shape (--r, set by tidy.js)
   and the row stretches to the page width. The side-scrolling strips and the Packages thumbnails have their own rules. */
.gs-gallery:not(.gs-gallery--side):not(.gs-gallery--rows) { display: flex; flex-wrap: wrap; justify-content: center; gap: .9rem; align-items: flex-start; }
.gs-gallery:not(.gs-gallery--side):not(.gs-gallery--rows) .gs-inline { --r: 1.5; flex: calc(var(--r) * 100) 1 calc(var(--r) * 13rem); min-width: 0; max-width: calc(var(--r) * 26rem); }   /* never taller than about 26rem, so a lone portrait does not fill the page */
.gs-gallery:not(.gs-gallery--side):not(.gs-gallery--rows) .gs-inline img { aspect-ratio: var(--r); object-fit: initial; width: 100%; height: auto; display: block; }

/* Share buttons: square blocks like the site's other buttons, no rounded pills (Paul, 4 Nov 2026). Applies to every share bar, including the photograph pages. */
.gs-share { gap: .5rem; }
.gs-share .gs-share__btn { border: 2px solid currentColor; border-radius: 0; padding: .4rem .9rem; font: 600 .92rem/1.2 var(--f-ui); text-decoration: none; color: var(--ink); background: transparent; cursor: pointer;
  transition: background .2s, color .2s, border-color .2s; }
.gs-share .gs-share__btn:hover, .gs-share .gs-share__btn:focus-visible { background: var(--ink); color: var(--paper, #fff); border-color: var(--ink); }

/* Share bar: the word "Share" on its own line, the buttons together on the next (Paul, 4 Nov 2026). */
.gs-share-wrap .gs-share .gs-share__label { flex: 0 0 100%; margin: 0 0 .15rem; }