/*
 * SlightlyOffPath main stylesheet.
 * Colors, fonts and sizes are CSS variables (--sop-*) printed from the
 * Customizer, so nothing here hard-codes a brand color.
 */

:root {
	--sop-gutter: clamp(20px, 4vw, 48px);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
	margin: 0;
	background: var(--sop-bg);
	color: var(--sop-ink);
	font-family: var(--sop-font-body);
	font-size: var(--sop-base);
	line-height: 1.6;
	overflow-x: clip;
	-webkit-font-smoothing: antialiased;
}
img, svg, video { max-width: 100%; }
img { height: auto; }
a { color: var(--sop-link); text-underline-offset: 0.18em; text-decoration-thickness: 0.08em; }
a:hover { color: var(--sop-link-hover); }
:focus-visible { outline: 3px solid var(--sop-ink); outline-offset: 3px; }
.sop-band :focus-visible { outline-color: var(--sop-on-band); }

h1, h2, h3, h4, h5, h6 {
	font-family: var(--sop-font-head);
	font-weight: var(--sop-head-weight);
	line-height: 1.12;
	letter-spacing: -0.015em;
	margin: 0 0 0.5em;
}

.screen-reader-text {
	border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%);
	height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px;
	word-wrap: normal !important;
}
.screen-reader-text:focus, .skip-link:focus {
	background: var(--sop-bg); color: var(--sop-ink); clip: auto; clip-path: none;
	display: block; height: auto; width: auto; left: 8px; top: 8px; z-index: 100000;
	padding: 12px 20px; font-weight: 700; border-radius: 8px; text-decoration: none;
}

/* ---------- Layout ---------- */
.sop-wrap {
	width: 100%;
	max-width: var(--sop-wrap);
	margin-inline: auto;
	padding-inline: var(--sop-gutter);
}
.sop-prose {
	width: 100%;
	max-width: calc(var(--sop-prose) + var(--sop-gutter) * 2);
	margin-inline: auto;
	padding-inline: var(--sop-gutter);
}
.sop-section { padding-top: clamp(56px, 8vw, 88px); }
.sop-section--hero { padding-top: 0; }
.sop-section__head {
	display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between;
	gap: 8px 24px; margin-bottom: 32px;
}
.sop-section__title { margin: 0; font-size: clamp(1.9rem, 2.2vw + 1rem, 2.5rem); }
.sop-more { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; }
.sop-icon { flex: none; }
.sop-notice {
	margin: 0; padding: 16px 20px; border: 2px dashed var(--sop-line);
	border-radius: var(--sop-radius); color: var(--sop-muted);
}

/* ---------- Header ---------- */
.sop-header { background: var(--sop-bg); }
.sop-sticky-header .sop-header {
	position: sticky; top: 0; z-index: 50;
	border-bottom: 1px solid color-mix(in srgb, var(--sop-ink) 14%, var(--sop-bg));
}
.admin-bar.sop-sticky-header .sop-header { top: 32px; }
@media (max-width: 782px) { .admin-bar.sop-sticky-header .sop-header { top: 46px; } }

.sop-header__inner {
	display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
	gap: 16px 32px; padding-block: 20px;
}
.sop-brand {
	display: inline-flex; align-items: center; gap: 12px;
	color: var(--sop-ink); text-decoration: none;
}
.sop-brand:hover { color: var(--sop-ink); text-decoration: none; }
.sop-brand__logo { height: var(--sop-logo-h); width: auto; max-width: min(100%, 320px); object-fit: contain; }
.sop-brand__text { display: flex; flex-direction: column; }
.sop-brand__name {
	font-family: var(--sop-font-head); font-weight: 700; font-size: 1.65rem;
	letter-spacing: -0.01em; line-height: 1.1;
}
.sop-brand__tag { font-size: 0.8125rem; color: var(--sop-muted); }

.sop-compass { height: var(--sop-logo-h); width: auto; aspect-ratio: 1; flex: none; }
.sop-compass__ring { fill: var(--sop-bg); stroke: var(--sop-ink); stroke-width: 2.5; }
.sop-compass__n { fill: var(--sop-accent); }
.sop-compass__w { fill: var(--sop-ink); }
.sop-compass__s { fill: #d8d0c2; fill: color-mix(in srgb, var(--sop-ink) 22%, var(--sop-bg)); }
.sop-compass__hub { fill: var(--sop-ink); }
.sop-compass__needle {
	transform-box: fill-box; transform-origin: center;
	transform: rotate(var(--sop-compass));
}
.sop-compass--spin .sop-compass__needle { animation: sop-swing 1.4s cubic-bezier(0.2, 0.8, 0.2, 1) both; }
@keyframes sop-swing {
	from { transform: rotate(-140deg); }
	55% { transform: rotate(calc(var(--sop-compass) + 14deg)); }
	to { transform: rotate(var(--sop-compass)); }
}

.sop-header__right { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 28px; }
.sop-header__tools { display: flex; align-items: center; gap: 12px; }
.sop-menu {
	list-style: none; margin: 0; padding: 0;
	display: flex; flex-wrap: wrap; gap: 8px 28px; font-weight: 500;
}
.sop-menu li { position: relative; }
.sop-menu a {
	color: var(--sop-ink); text-decoration: none; display: inline-block; padding-block: 6px;
}
.sop-menu a:hover, .sop-menu .current-menu-item > a, .sop-menu .current_page_item > a {
	color: var(--sop-ink); text-decoration: underline; text-decoration-color: var(--sop-accent);
	text-decoration-thickness: 3px; text-underline-offset: 6px;
}
.sop-menu .sub-menu {
	list-style: none; margin: 0; padding: 12px 16px; display: none; position: absolute; left: -16px; top: 100%;
	min-width: 200px; background: var(--sop-bg); border: 2px solid var(--sop-line);
	border-radius: var(--sop-radius); z-index: 20;
}
.sop-menu li:hover > .sub-menu, .sop-menu li:focus-within > .sub-menu { display: block; }

.sop-nav-toggle, .sop-search-toggle {
	display: none; align-items: center; justify-content: center; width: 48px; height: 48px;
	background: none; color: var(--sop-ink); cursor: pointer;
	border: 2px solid var(--sop-line); border-radius: calc(var(--sop-radius) * 0.6);
}
.sop-js .sop-search-toggle { display: inline-flex; }
.sop-nav-toggle__close { display: none; }
.sop-nav-toggle[aria-expanded="true"] .sop-nav-toggle__open { display: none; }
.sop-nav-toggle[aria-expanded="true"] .sop-nav-toggle__close { display: inline-flex; }
.sop-header__search { padding-bottom: 16px; }

@media (max-width: 820px) {
	.sop-js .sop-nav-toggle { display: inline-flex; }
	.sop-js .sop-header__right { display: none; width: 100%; flex-direction: column; align-items: flex-start; }
	.sop-js .sop-header__right.is-open { display: flex; }
	.sop-menu { flex-direction: column; gap: 4px; }
	.sop-menu .sub-menu { display: block; position: static; border: 0; padding: 0 0 0 16px; }
}

/* ---------- Buttons, chips, forms ---------- */
.sop-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	min-height: 48px; padding: 0 24px; border: 0; cursor: pointer;
	border-radius: calc(var(--sop-radius) * 0.75);
	font: inherit; font-weight: 700; font-size: 1rem; line-height: 1.1; text-decoration: none;
	transition: filter 0.15s ease;
}
.sop-btn:hover { filter: brightness(0.94); text-decoration: none; }
.sop-btn--accent, .sop-btn--accent:hover { background: var(--sop-accent); color: var(--sop-on-accent); }
.sop-btn--ink, .sop-btn--ink:hover { background: var(--sop-ink); color: var(--sop-bg); }
.sop-btn--small { min-height: 44px; padding: 0 18px; font-size: 0.9375rem; }

.sop-chip {
	display: inline-flex; align-items: center; gap: 8px; align-self: flex-start;
	font-size: 0.875rem; font-weight: 500; line-height: 1.2;
	background: var(--sop-soft); color: var(--sop-ink); border-radius: 999px; padding: 6px 14px 6px 10px;
}
.sop-chip .sop-icon { width: 16px; height: 16px; }
.sop-chip--solid { background: var(--sop-bg); color: var(--sop-ink); }
.sop-chip--plain { background: none; color: var(--sop-muted); padding: 0; }
.sop-chip--plain .sop-icon { color: var(--sop-link); }

.sop-searchform { display: flex; gap: 10px; max-width: 520px; }
.sop-searchform input[type="search"],
.sop-hero__search input[type="search"],
.sop-news-form input[type="email"],
.sop-news input[type="email"],
.sop-news input[type="text"] {
	flex: 1 1 220px; min-width: 0; height: 52px; border: 2px solid transparent;
	border-radius: calc(var(--sop-radius) * 0.75); padding: 0 18px;
	font: inherit; background: var(--sop-bg); color: var(--sop-ink);
}
.sop-searchform input[type="search"] { border-color: var(--sop-line); }
.sop-searchform .sop-btn { width: 52px; padding: 0; }
.sop-news input[type="submit"], .sop-news button[type="submit"] {
	min-height: 52px; padding: 0 26px; border: 0; cursor: pointer; font: inherit; font-weight: 700;
	border-radius: calc(var(--sop-radius) * 0.75); background: var(--sop-ink); color: var(--sop-bg);
}

/* ---------- Hero ---------- */
.sop-hero {
	position: relative; min-height: var(--sop-hero-h); overflow: hidden;
	display: flex; flex-direction: column; justify-content: flex-end;
	padding: clamp(24px, 5vw, 56px);
	border-radius: calc(var(--sop-radius) * 1.25);
	background: var(--sop-hero-bg); color: var(--sop-on-hero-solid);
}
.sop-hero--photo { color: var(--sop-on-hero); }
.sop-hero--center { justify-content: center; align-items: center; text-align: center; }
.sop-hero__img {
	position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
	object-position: var(--sop-hero-x) var(--sop-hero-y);
}
.sop-hero__scrim { position: absolute; inset: 0; background: var(--sop-overlay); opacity: var(--sop-hero-dim); }
.sop-hero__content {
	position: relative; display: flex; flex-direction: column; align-items: flex-start;
	gap: 20px; max-width: 720px; width: 100%;
}
.sop-hero--center .sop-hero__content { align-items: center; }
.sop-hero__title {
	margin: 0; color: inherit; line-height: 1.04; letter-spacing: -0.02em;
	font-size: clamp(2.25rem, 4.4vw + 1rem, 4rem);
}
.sop-hero__text { margin: 0; color: inherit; font-size: 1.1875rem; max-width: 560px; }
.sop-hero__search { display: flex; flex-wrap: wrap; gap: 10px; width: 100%; margin-top: 8px; }
.sop-hero--center .sop-hero__search { justify-content: center; }
.sop-hero__post { margin: 0; }
.sop-hero a { color: inherit; }

/* ---------- Cards and grids ---------- */
.sop-grid { display: grid; gap: 32px; grid-template-columns: repeat(var(--cols, 3), minmax(0, 1fr)); }
.sop-grid--2 { --cols: 2; }
.sop-grid--3 { --cols: 3; }
.sop-grid--4 { --cols: 4; }
@media (max-width: 1000px) { .sop-grid--3, .sop-grid--4 { --cols: 2; } }
@media (max-width: 640px) { .sop-grid { --cols: 1; } }

.sop-card { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.sop-card__media {
	display: block; aspect-ratio: 800 / 520; overflow: hidden;
	border-radius: var(--sop-radius); background: var(--sop-soft);
}
.sop-card__img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 0.4s ease; }
.sop-card:hover .sop-card__img { transform: scale(1.03); }
.sop-card__ph { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; }
.sop-card__ph .sop-compass { height: 56px; }
.sop-card__body { display: flex; flex-direction: column; gap: 8px; }
.sop-card__title { margin: 0; font-size: 1.625rem; line-height: 1.2; }
.sop-card__title a { color: var(--sop-ink); text-decoration: none; }
.sop-card__title a:hover { color: var(--sop-link); text-decoration: underline; }
.sop-card__excerpt { margin: 0; color: var(--sop-muted); }
.sop-card__meta { margin: 0; font-size: 0.875rem; color: var(--sop-muted); }

.nav-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 48px; }
.page-numbers {
	display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px;
	padding: 0 14px; border: 2px solid var(--sop-line); border-radius: calc(var(--sop-radius) * 0.6);
	color: var(--sop-ink); font-weight: 700; text-decoration: none;
}
.page-numbers.current { background: var(--sop-accent); border-color: var(--sop-accent); color: var(--sop-on-accent); }
a.page-numbers:hover { background: var(--sop-soft); color: var(--sop-ink); }

.sop-page-head { margin-bottom: 40px; display: flex; flex-direction: column; gap: 16px; }
.sop-page-head__title { margin: 0; font-size: clamp(2rem, 3vw + 1rem, 3rem); }
.sop-page-head__desc { color: var(--sop-muted); max-width: 640px; }
.sop-empty { display: flex; flex-direction: column; gap: 16px; align-items: flex-start; }
.sop-notfound { text-align: center; display: flex; flex-direction: column; align-items: center; gap: 20px; max-width: 640px; }
.sop-notfound .sop-compass { height: 88px; }
.sop-notfound .sop-searchform { width: 100%; }

/* ---------- Maps ---------- */
.sop-map-wrap { position: relative; }
.sop-map {
	position: relative; z-index: 0; isolation: isolate; overflow: hidden;
	height: var(--sop-map-h, 420px);
	border-radius: calc(var(--sop-radius) * 1.25); background: var(--sop-soft);
}
.sop-map__meta {
	margin: 12px 0 0; font-size: 0.9375rem; color: var(--sop-muted);
	display: flex; flex-wrap: wrap; gap: 6px 16px; align-items: center;
}
.sop-map__place { display: inline-flex; align-items: center; gap: 6px; color: var(--sop-ink); font-weight: 500; }
.sop-post-map, .sop-photo-map { margin-block: 2.25em; }
.sop-photo-map__title { margin: 0 0 16px; font-size: 1.75rem; }

.leaflet-container { font-family: var(--sop-font-body); color: var(--sop-ink); }
.leaflet-popup-content-wrapper { background: var(--sop-bg); color: var(--sop-ink); border-radius: var(--sop-radius); overflow: hidden; padding: 0; }
.leaflet-popup-tip { background: var(--sop-bg); }
.leaflet-popup-content { margin: 0; width: 240px !important; }
.leaflet-popup-close-button { color: var(--sop-bg) !important; background: var(--sop-ink); border-radius: 50%; width: 28px !important; height: 28px !important; right: 8px !important; top: 8px !important; font-size: 18px !important; padding: 4px 0 0 0 !important; text-align: center; }
.sop-popup__img { display: block; width: 100%; height: auto; aspect-ratio: 8 / 5; object-fit: cover; }
.sop-popup__body { padding: 12px 14px 14px; display: flex; flex-direction: column; gap: 2px; }
.sop-popup__place { font-size: 0.8125rem; color: var(--sop-muted); }
.sop-popup__title { font-family: var(--sop-font-head); font-weight: 700; font-size: 1.0625rem; line-height: 1.25; }
.sop-map .sop-popup a.sop-popup__link { margin-top: 6px; font-weight: 700; color: var(--sop-link); }

.sop-pin span {
	display: block; width: 100%; height: 100%; border-radius: 50%;
	background: var(--sop-accent); border: 2.5px solid var(--sop-ink);
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.35);
}
.sop-pin--photo span { border-radius: 4px; background: var(--sop-bg); border: 2px solid var(--sop-accent); }
.sop-pin--current span { border-width: 3px; box-shadow: 0 0 0 6px rgba(255, 255, 255, 0.55), 0 1px 4px rgba(0, 0, 0, 0.35); }
.sop-cluster span {
	display: flex; align-items: center; justify-content: center; width: 38px; height: 38px;
	border-radius: 50%; background: var(--sop-ink); color: var(--sop-bg);
	border: 3px solid var(--sop-accent); font-weight: 700; font-size: 0.9rem;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.35);
}

/* ---------- Map band ---------- */
.sop-band {
	margin-top: clamp(64px, 8vw, 96px); padding-block: clamp(48px, 7vw, 80px);
	background: var(--sop-band); color: var(--sop-on-band);
}
.sop-section__head--band { align-items: flex-end; }
.sop-band__intro { max-width: 620px; }
.sop-band__intro p { margin: 8px 0 0; }
.sop-band .sop-section__head a:not(.sop-btn) { color: inherit; }
.sop-band .sop-map__meta { color: var(--sop-on-band); }

/* ---------- Browse tiles ---------- */
.sop-tiles { display: grid; gap: 20px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 360px), 1fr)); }
.sop-tile {
	display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 28px;
	border: 2px solid var(--sop-line); border-radius: var(--sop-radius);
	background: var(--sop-bg); color: var(--sop-ink); text-decoration: none;
	transition: background-color 0.15s ease;
}
.sop-tile__label { font-family: var(--sop-font-head); font-weight: var(--sop-head-weight); font-size: 1.625rem; line-height: 1.15; }
.sop-tile__arrow { display: inline-flex; transition: transform 0.2s ease; }
.sop-tile__arrow .sop-icon { width: 24px; height: 24px; }
.sop-tile:hover { background: var(--sop-soft); color: var(--sop-ink); text-decoration: none; }
.sop-tile:hover .sop-tile__arrow { transform: translateX(4px); }
.sop-tiles--filled .sop-tile { background: var(--sop-accent); border-color: var(--sop-accent); color: var(--sop-on-accent); }
.sop-tiles--filled .sop-tile:hover { background: var(--sop-accent); color: var(--sop-on-accent); filter: brightness(0.94); }

/* ---------- About + newsletter ---------- */
.sop-closer__row { display: flex; flex-wrap: wrap; gap: 48px; }
.sop-about { flex: 1 1 420px; min-width: 0; display: flex; flex-wrap: wrap; gap: 28px; align-items: flex-start; }
.sop-about__photo {
	flex: none; width: 160px; height: 160px; border-radius: 50%; overflow: hidden;
	background: var(--sop-soft); display: flex; align-items: center; justify-content: center;
}
.sop-about__img { width: 100%; height: 100%; object-fit: cover; }
.sop-about__photo .sop-compass { height: 72px; }
.sop-about__body { flex: 1 1 240px; min-width: 0; display: flex; flex-direction: column; gap: 12px; align-items: flex-start; }
.sop-about__title { margin: 0; font-size: 2rem; }
.sop-about__body p { margin: 0; color: var(--sop-muted); }
.sop-news {
	flex: 1 1 420px; min-width: 0; display: flex; flex-direction: column; gap: 16px;
	padding: clamp(24px, 4vw, 40px); border-radius: calc(var(--sop-radius) * 1.25);
	background: var(--sop-news-bg); color: var(--sop-on-news);
}
.sop-news__title { margin: 0; font-size: 2rem; }
.sop-news p { margin: 0; }
.sop-news a { color: inherit; }
.sop-news-form { display: flex; flex-wrap: wrap; gap: 10px; }
.sop-news__hint { font-weight: 500; }

/* ---------- Posts and pages ---------- */
.sop-post__header { padding-top: clamp(24px, 5vw, 48px); margin-bottom: 32px; display: flex; flex-direction: column; align-items: flex-start; }
.sop-post__cats { margin: 0 0 12px; font-size: 0.875rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; }
.sop-post__cats a { color: var(--sop-link); text-decoration: none; }
.sop-post__title { margin: 0 0 20px; font-size: clamp(2.2rem, 4vw + 1rem, 3.5rem); }
.sop-post__meta { margin: 16px 0 0; color: var(--sop-muted); font-size: 0.9375rem; display: flex; flex-wrap: wrap; gap: 4px 10px; }
.sop-post__media { margin: 0 auto 40px; }
.sop-post__img { display: block; width: 100%; height: auto; border-radius: calc(var(--sop-radius) * 1.25); }
.sop-post__media figcaption { margin-top: 8px; font-size: 0.875rem; color: var(--sop-muted); }

.entry-content > * {
	width: 100%; max-width: calc(var(--sop-prose) + var(--sop-gutter) * 2);
	margin: 0 auto 1.4em; padding-inline: var(--sop-gutter);
}
.entry-content > .alignwide { max-width: var(--sop-wrap); }
.entry-content > .alignfull { max-width: none; padding-inline: 0; }
.entry-content > h2 { margin-top: 2em; font-size: 2rem; }
.entry-content > h3 { margin-top: 1.6em; font-size: 1.5rem; }
.entry-content img { border-radius: calc(var(--sop-radius) * 0.75); }
.entry-content figure { margin-inline: auto; }
.entry-content figcaption, .wp-caption-text { font-size: 0.875rem; color: var(--sop-muted); margin-top: 8px; }
.entry-content blockquote { font-family: var(--sop-font-head); font-size: 1.5rem; line-height: 1.3; margin-block: 2em; border: 0; }
.entry-content blockquote p { margin: 0 0 0.6em; }
.entry-content blockquote cite { font-family: var(--sop-font-body); font-size: 0.9375rem; color: var(--sop-muted); font-style: normal; }
.entry-content .wp-block-image img { height: auto; }
.alignleft { float: left; margin: 0.4em 1.5em 1em 0; }
.alignright { float: right; margin: 0.4em 0 1em 1.5em; }
.aligncenter { display: block; margin-inline: auto; }
.sop-pagelinks { display: flex; gap: 12px; }

.sop-tags { list-style: none; margin: 32px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.sop-tags a {
	display: inline-block; padding: 6px 14px; border: 2px solid var(--sop-line); border-radius: 999px;
	color: var(--sop-ink); font-size: 0.9rem; text-decoration: none;
}
.sop-tags a:hover { background: var(--sop-soft); color: var(--sop-ink); }
.sop-authorbox { display: flex; gap: 20px; align-items: flex-start; margin-top: 48px; padding-block: 24px; border-top: 2px solid var(--sop-line); }
.sop-authorbox__avatar { border-radius: 50%; flex: none; }
.sop-authorbox p { margin: 0; }
.sop-authorbox__name { font-family: var(--sop-font-head); font-weight: 700; font-size: 1.25rem; }
.sop-authorbox__bio { color: var(--sop-muted); }

.sop-comments { margin-top: 56px; }
.sop-comments__title { font-size: 1.75rem; }
.sop-comments__list { list-style: none; margin: 0 0 32px; padding: 0; }
.sop-comments__list .comment { padding: 20px 0; border-top: 1px solid color-mix(in srgb, var(--sop-ink) 16%, var(--sop-bg)); }
.sop-comments__list .children { list-style: none; padding-left: 24px; }
.sop-comments .comment-author img { border-radius: 50%; vertical-align: middle; margin-right: 10px; }
.sop-comments .comment-metadata { font-size: 0.875rem; color: var(--sop-muted); }
.sop-comments input[type="text"], .sop-comments input[type="email"], .sop-comments input[type="url"], .sop-comments textarea {
	width: 100%; font: inherit; padding: 12px 14px; color: var(--sop-ink); background: var(--sop-bg);
	border: 2px solid var(--sop-line); border-radius: calc(var(--sop-radius) * 0.6);
}
.sop-comments input[type="submit"] {
	min-height: 48px; padding: 0 24px; border: 0; cursor: pointer; font: inherit; font-weight: 700;
	background: var(--sop-accent); color: var(--sop-on-accent); border-radius: calc(var(--sop-radius) * 0.75);
}

/* ---------- Footer ---------- */
.sop-footer {
	margin-top: clamp(64px, 8vw, 96px); padding-block: 32px 48px;
	border-top: 2px solid var(--sop-line); font-size: 0.9375rem; color: var(--sop-muted);
}
.sop-footer p { margin: 0; }
.sop-footer a { color: var(--sop-ink); }
.sop-footer__row { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-start; gap: 16px 32px; }
.sop-footer__menu, .sop-social { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 24px; }
.sop-footer__widgets { display: grid; gap: 24px; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); margin-bottom: 32px; }
.sop-footer .widget-title { font-size: 1.125rem; }

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after { animation: none !important; transition: none !important; }
}

/* ======================================================================
 * 1.1: adventures, photo map, lightbox
 * ==================================================================== */

.sop-btn--ghost, .sop-btn--ghost:hover { background: transparent; color: var(--sop-ink); box-shadow: inset 0 0 0 2px var(--sop-ink); }

/* Trip pins on the site map: a square-ish diamond so they read differently from posts. */
.sop-pin--trip span { border-radius: 6px; transform: rotate(45deg) scale(0.82); background: var(--sop-ink); border-color: var(--sop-accent); }
.sop-pin--photo.sop-pin--stack span {
	display: flex; align-items: center; justify-content: center; border-radius: 50%;
	background: var(--sop-bg); color: var(--sop-ink); border: 2.5px solid var(--sop-accent);
	font-weight: 800; font-size: 0.8125rem; line-height: 1;
}

/* Popups with several photos */
.sop-popup__open, .sop-popup__thumb { display: block; padding: 0; border: 0; background: none; cursor: zoom-in; width: 100%; }
.sop-popup__thumbs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin-top: 8px; }
.sop-popup__thumb { border-radius: 6px; overflow: hidden; aspect-ratio: 3 / 2; }
.sop-popup__thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
.sop-popup__more { align-self: flex-start; background: none; border: 0; padding: 4px 0; cursor: pointer; font: inherit; color: var(--sop-link); font-weight: 700; text-decoration: underline; }
.sop-popup--group .leaflet-popup-content { width: 280px; }

/* Legend on route maps */
.sop-legend {
	background: rgba(255, 255, 255, 0.92); color: #1e2428; padding: 6px 10px; border-radius: 8px;
	font-size: 0.8125rem; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25); display: flex; flex-direction: column; gap: 2px;
}
.sop-legend__row { display: flex; align-items: center; gap: 8px; }
.sop-map.is-locked { cursor: default; }

/* Facts bar */
.sop-facts {
	display: flex; flex-wrap: wrap; gap: 0; margin: 0 0 clamp(24px, 4vw, 40px); padding: 0;
	border-block: 2px solid var(--sop-line);
}
.sop-facts__item { flex: 1 1 160px; padding: 14px 20px 14px 0; margin: 0; }
.sop-facts dt { font-size: 0.75rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--sop-muted); }
.sop-facts dd { margin: 2px 0 0; font-family: var(--sop-font-head); font-weight: 700; font-size: 1.25rem; line-height: 1.25; }

/* Trip page layout */
.sop-trip__layout { display: grid; gap: clamp(24px, 4vw, 48px); align-items: start; }
.sop-trip__layout--side { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }
.sop-trip__layout--side .sop-trip__map { order: 2; position: sticky; top: 96px; }
.sop-trip__layout--side .sop-trip__story { order: 1; }
.sop-trip__layout--top, .sop-trip__layout--none { grid-template-columns: minmax(0, 1fr); }
.sop-trip__layout--none .sop-trip__story, .sop-trip__layout--top .sop-trip__story { max-width: var(--sop-prose, 720px); }
.sop-trip__layout--top .sop-trip__story { margin-inline: auto; width: 100%; }
.sop-trip__map .sop-map-wrap { margin: 0; }
.sop-trip__lead { margin: 0 0 28px; }
.sop-trip__story .entry-content { margin-inline: 0; max-width: none; padding-inline: 0; }
.sop-trip__photos { margin-top: clamp(40px, 6vw, 72px); }
@media (max-width: 900px) {
	.sop-trip__layout--side { grid-template-columns: minmax(0, 1fr); }
	.sop-trip__layout--side .sop-trip__map { order: -1; position: static; }
}

/* Trip cards, filters */
.sop-card__media { position: relative; }
.sop-card__badge {
	position: absolute; left: 12px; top: 12px; padding: 4px 10px; border-radius: 999px;
	background: var(--sop-bg); color: var(--sop-ink); font-size: 0.75rem; font-weight: 700;
	letter-spacing: 0.04em; text-transform: uppercase; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
}
.sop-filters { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 28px; }
.sop-filter {
	display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 18px;
	border-radius: 999px; border: 2px solid var(--sop-line); color: var(--sop-ink);
	text-decoration: none; font-weight: 700; font-size: 0.9375rem;
}
.sop-filter:hover { border-color: var(--sop-ink); color: var(--sop-ink); }
.sop-filter.is-current { background: var(--sop-ink); border-color: var(--sop-ink); color: var(--sop-bg); }
.sop-filter__n { font-weight: 500; opacity: 0.7; }
.sop-trips-overview { margin-bottom: clamp(28px, 4vw, 48px); }

/* Photo grid under a photo map */
.sop-photo-area__status { margin: 16px 0 12px; color: var(--sop-muted); font-size: 0.9375rem; min-height: 1.5em; }
.sop-photo-grid { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); }
.sop-photo-grid li[hidden] { display: none; }
.sop-photo-grid li { margin: 0; }
.sop-photo-grid__link { display: block; aspect-ratio: 3 / 2; overflow: hidden; border-radius: calc(var(--sop-radius) * 0.6); background: var(--sop-line); }
.sop-photo-grid__link img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 0.3s ease; }
.sop-photo-grid__link:hover img { transform: scale(1.04); }
.sop-photo-area__more-wrap { text-align: center; margin: 20px 0 0; }
.sop-photomap__intro { margin-bottom: 32px; }

/* Lightbox */
.sop-lightbox {
	border: 0; padding: 0; background: transparent; color: #fff; max-width: 100vw; max-height: 100vh;
	width: 100vw; height: 100vh; overflow: hidden;
}
.sop-lightbox::backdrop { background: rgba(10, 12, 14, 0.9); }
.sop-lightbox[open] { display: grid; grid-template-columns: 64px minmax(0, 1fr) 64px; align-items: center; }
.sop-lightbox__fig { grid-column: 2; margin: 0; display: flex; flex-direction: column; align-items: center; gap: 12px; max-height: 100vh; padding: 56px 0 24px; }
.sop-lightbox__img { display: block; max-width: 100%; max-height: calc(100vh - 150px); width: auto; height: auto; object-fit: contain; border-radius: 6px; }
.sop-lightbox__cap { display: flex; flex-wrap: wrap; gap: 4px 20px; justify-content: center; align-items: baseline; font-size: 0.9375rem; text-align: center; max-width: 90%; }
.sop-lightbox__place { margin-left: 10px; opacity: 0.8; }
.sop-lightbox__links { display: inline-flex; gap: 16px; }
.sop-lightbox a { color: #fff; font-weight: 700; }
.sop-lightbox__count { opacity: 0.7; font-size: 0.8125rem; }
.sop-lightbox__btn {
	background: rgba(255, 255, 255, 0.14); color: #fff; border: 0; cursor: pointer;
	width: 48px; height: 48px; border-radius: 50%; font-size: 2rem; line-height: 1; display: flex; align-items: center; justify-content: center;
}
.sop-lightbox__btn:hover { background: rgba(255, 255, 255, 0.28); }
.sop-lightbox__btn:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
.sop-lightbox__btn[hidden] { display: none; }
.sop-lightbox__prev { grid-column: 1; grid-row: 1; justify-self: center; }
.sop-lightbox__next { grid-column: 3; grid-row: 1; justify-self: center; }
.sop-lightbox__close { position: absolute; right: 16px; top: 12px; z-index: 2; font-size: 1.75rem; }
@media (max-width: 640px) {
	.sop-lightbox[open] { grid-template-columns: 44px minmax(0, 1fr) 44px; }
	.sop-lightbox__btn { width: 40px; height: 40px; }
}
.sop-trip__story .entry-content > * { max-width: none; margin-inline: 0; padding-inline: 0; }