/*
Theme Name: World Trip Guide
Theme URI: https://wordpress.bilalbentoumi.com/
Author: Bilal Bentoumi
Author URI: https://wordpress.bilalbentoumi.com/
Description: A field-guide block theme for travel writing — warm paper ground, deep ink, a terracotta route line and a display serif with real character. Built for long destination guides, with CLS-safe AdSense placements, reading times and a generated ads.txt.
Requires at least: 6.5
Tested up to: 6.7
Requires PHP: 7.4
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: world-trip-guide
Tags: blog, news, one-column, two-columns, block-patterns, full-site-editing, custom-colors, custom-logo, custom-menu, featured-images, editor-style, translation-ready, wide-blocks
*/

/* ==========================================================================
   Bundled type — all SIL Open Font License 1.1, see assets/fonts/LICENSE.md
   Fraunces (display) · Plus Jakarta Sans (text) · IBM Plex Mono (labels)
   Declared as @font-face by theme.json; this file only uses them.
   ========================================================================== */

:root {
	--wtg-ease: var(--wp--custom--ease, cubic-bezier(0.22, 0.61, 0.36, 1));
	--wtg-rule: var(--wp--preset--color--rule, #e4ded2);
	--wtg-ink: var(--wp--preset--color--ink, #15202b);
	--wtg-clay: var(--wp--preset--color--clay, #b4512f);
	--wtg-paper: var(--wp--preset--color--paper, #fbf8f3);
	--wtg-radius: var(--wp--custom--radius--md, 6px);
	--wtg-radius-lg: var(--wp--custom--radius--lg, 14px);
	--wtg-header-h: 68px;
}

html {
	scroll-behavior: smooth;
	/* Stop in-page anchors landing under the sticky header. */
	scroll-padding-top: calc(var(--wtg-header-h) + 20px);
}

body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
}

/* Fraunces carries optical sizing and a soft axis; let the browser use them. */
.wp-site-blocks :is(h1, h2, h3, h4, .wtg-display) {
	font-optical-sizing: auto;
	font-variation-settings: "SOFT" 20, "WONK" 1;
}

img { max-width: 100%; height: auto; }

::selection { background: var(--wp--preset--color--clay-soft); color: var(--wtg-ink); }

/* ==========================================================================
   Accessibility
   ========================================================================== */

.screen-reader-text {
	border: 0;
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
	white-space: nowrap;
}
.screen-reader-text:focus {
	clip-path: none;
	height: auto;
	width: auto;
	margin: 0;
	padding: 14px 22px;
	position: fixed;
	top: 12px;
	left: 12px;
	z-index: 1000;
	background: var(--wtg-ink);
	color: #fff;
	border-radius: var(--wtg-radius);
}

:where(a, button, input, select, textarea, summary):focus-visible {
	outline: 2px solid var(--wtg-clay);
	outline-offset: 3px;
	border-radius: 2px;
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}
}

/* ==========================================================================
   Shared ornaments — the kicker and the route line carry the field-guide idea
   ========================================================================== */

.wtg-kicker {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--micro);
	font-weight: 500;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--wtg-clay);
	margin: 0 0 14px;
	display: flex;
	align-items: center;
	gap: 10px;
}
.wtg-kicker::before {
	content: "";
	width: 26px;
	height: 1px;
	background: currentColor;
	flex: 0 0 auto;
}
.wtg-kicker.has-text-align-center { justify-content: center; }

/* A dashed run with a stop at each end, like a leg on a route map. */
.wtg-route {
	display: flex;
	align-items: center;
	gap: 0;
	margin-block: var(--wp--preset--spacing--40);
}
.wtg-route::before,
.wtg-route::after {
	content: "";
	width: 7px;
	height: 7px;
	border-radius: 50%;
	border: 1.5px solid var(--wtg-clay);
	flex: 0 0 auto;
}
.wtg-route__line {
	flex: 1 1 auto;
	height: 0;
	border-top: 1.5px dashed var(--wtg-rule);
}

.wtg-section-head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: var(--wp--preset--spacing--30);
	margin-bottom: var(--wp--preset--spacing--40);
}
.wtg-section-head__text { max-width: 44ch; }
.wtg-section-head h2 { margin: 0; }
.wtg-section-head__sub {
	margin: 14px 0 0;
	color: var(--wp--preset--color--body);
	font-size: var(--wp--preset--font-size--base);
}
.wtg-section-head__link {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--micro);
	letter-spacing: 0.14em;
	text-transform: uppercase;
	white-space: nowrap;
	padding-bottom: 6px;
	border-bottom: 1px solid var(--wtg-rule);
	transition: border-color 0.25s var(--wtg-ease), color 0.25s var(--wtg-ease);
}
.wtg-section-head__link:hover { border-bottom-color: var(--wtg-clay); }

/* ==========================================================================
   Header
   ========================================================================== */

.wtg-utility {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--micro);
	letter-spacing: 0.12em;
	text-transform: uppercase;
}
.wtg-utility__row { min-height: 38px; gap: 18px; }
.wtg-utility p { margin: 0; }
/* Derived from the bar's own text colour rather than hardcoded white, so a
   style variation that flips the palette keeps this readable. */
.wtg-utility a { color: color-mix(in srgb, currentColor 82%, transparent); }
.wtg-utility a:hover { color: currentColor; }
.wtg-utility .wp-block-social-link { margin: 0; }
.wtg-utility .wp-block-social-link-anchor { padding: 5px; }
.wtg-utility .wp-block-social-link:hover { transform: none; opacity: 0.75; }

.wtg-masthead {
	position: sticky;
	top: 0;
	z-index: 100;
	background: color-mix(in srgb, var(--wtg-paper) 88%, transparent);
	backdrop-filter: saturate(1.4) blur(10px);
	-webkit-backdrop-filter: saturate(1.4) blur(10px);
	border-bottom: 1px solid var(--wtg-rule);
}
@supports not (backdrop-filter: blur(4px)) {
	.wtg-masthead { background: var(--wtg-paper); }
}
.wtg-masthead__row {
	min-height: var(--wtg-header-h);
	gap: var(--wp--preset--spacing--30);
}
.wtg-masthead .wp-block-site-logo img { display: block; }

/* The wordmark gets a terracotta full stop — small, but it makes the
   lettering read as a mark rather than as plain text. */
.wtg-brand .wp-block-site-title a::after {
	content: ".";
	color: var(--wtg-clay);
}
.wtg-brand .wp-block-site-title a { text-decoration: none; }

.wtg-nav .wp-block-navigation-item__content {
	font-weight: 500;
	color: var(--wtg-ink);
	padding: 8px 0;
	position: relative;
}
.wtg-nav .wp-block-navigation-item__content::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 1.5px;
	background: var(--wtg-clay);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.3s var(--wtg-ease);
}
.wtg-nav .wp-block-navigation-item__content:hover::after,
.wtg-nav .current-menu-item > .wp-block-navigation-item__content::after { transform: scaleX(1); }
.wtg-nav .wp-block-navigation__submenu-container {
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wtg-rule);
	border-radius: var(--wtg-radius);
	box-shadow: var(--wp--preset--shadow--raise);
	padding: 8px 0;
	min-width: 220px;
}
.wtg-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content { padding: 9px 18px; }
.wtg-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content::after { display: none; }

.wtg-search .wp-block-search__inside-wrapper {
	border: 1px solid var(--wtg-rule);
	border-radius: 999px;
	background: var(--wp--preset--color--surface);
	padding: 2px 4px 2px 16px;
	transition: border-color 0.25s var(--wtg-ease);
}
.wtg-search .wp-block-search__inside-wrapper:focus-within { border-color: var(--wtg-ink); }
.wtg-search .wp-block-search__input {
	border: 0;
	background: transparent;
	font-size: var(--wp--preset--font-size--small);
	padding: 8px 0;
	min-width: 0;
}
.wtg-search .wp-block-search__input:focus { outline: none; }
.wtg-search .wp-block-search__button {
	background: var(--wtg-ink);
	color: var(--wtg-paper);
	border: 0;
	border-radius: 999px;
	padding: 9px;
	margin: 0;
	min-width: 0;
	display: grid;
	place-items: center;
	transition: background-color 0.25s var(--wtg-ease);
}
.wtg-search .wp-block-search__button:hover { background: var(--wtg-clay); }
.wtg-search .wp-block-search__button svg { width: 18px; height: 18px; fill: currentColor; }

/* ==========================================================================
   Hero
   ========================================================================== */

.wtg-hero { margin-block: var(--wp--preset--spacing--40) var(--wp--preset--spacing--50); }
.wtg-hero__cols { gap: var(--wp--preset--spacing--30); align-items: stretch; }

.wtg-lede { position: relative; height: 100%; }
.wtg-lede .wp-block-post-featured-image {
	margin: 0;
	height: 100%;
	border-radius: var(--wtg-radius-lg);
	overflow: hidden;
	background: var(--wp--preset--color--sand);
}
.wtg-lede .wp-block-post-featured-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.9s var(--wtg-ease);
}
.wtg-lede:hover .wp-block-post-featured-image img { transform: scale(1.04); }
.wtg-lede__body {
	position: absolute;
	inset: auto 0 0 0;
	padding: clamp(24px, 4vw, 48px);
	background: var(--wp--preset--gradient--ink-fade);
	border-radius: 0 0 var(--wtg-radius-lg) var(--wtg-radius-lg);
	pointer-events: none;
}
.wtg-lede__body > * { pointer-events: auto; }
.wtg-lede__body .wtg-kicker { color: #fff; opacity: 0.95; }
.wtg-lede__title { margin: 0 0 14px; max-width: 18ch; }
.wtg-lede__title,
.wtg-lede__title a {
	color: #fff;
	font-size: var(--wp--preset--font-size--display-sm);
	line-height: 1.04;
	letter-spacing: -0.03em;
	text-decoration: none;
	text-wrap: balance;
}
.wtg-lede__title a:hover { color: var(--wp--preset--color--clay-soft); }
.wtg-lede__meta { color: rgba(255, 255, 255, 0.82); }
.wtg-lede__meta .wp-block-post-date,
.wtg-lede__meta .wtg-readtime { color: inherit; }

/* The stacked column beside the lede. */
.wtg-stack { display: flex; flex-direction: column; gap: 0; height: 100%; }
.wtg-stack__item {
	display: flex;
	gap: 18px;
	align-items: center;
	padding: 20px 0;
	border-bottom: 1px dashed var(--wtg-rule);
}
.wtg-stack__item:first-child { padding-top: 0; }
.wtg-stack__item:last-child { border-bottom: 0; padding-bottom: 0; }
.wtg-stack__item .wp-block-post-featured-image {
	margin: 0;
	flex: 0 0 96px;
	border-radius: var(--wtg-radius);
	overflow: hidden;
	background: var(--wp--preset--color--sand);
}
.wtg-stack__item .wp-block-post-featured-image img {
	width: 96px;
	height: 76px;
	object-fit: cover;
	transition: transform 0.7s var(--wtg-ease);
}
.wtg-stack__item:hover .wp-block-post-featured-image img { transform: scale(1.07); }
.wtg-stack__text { min-width: 0; }
.wtg-stack__title { margin: 6px 0 6px; }
.wtg-stack__title,
.wtg-stack__title a {
	font-size: var(--wp--preset--font-size--title-sm);
	line-height: 1.26;
	text-decoration: none;
	text-wrap: balance;
}

/* ==========================================================================
   Guide cards
   ========================================================================== */

.wtg-grid__items { gap: var(--wp--preset--spacing--40) var(--wp--preset--spacing--30); }

.wtg-card { height: 100%; display: flex; flex-direction: column; }
.wtg-card__media {
	margin: 0 0 20px;
	border-radius: var(--wtg-radius-lg);
	overflow: hidden;
	position: relative;
	background: var(--wp--preset--color--sand);
}
.wtg-card__media img {
	width: 100%;
	display: block;
	transition: transform 0.8s var(--wtg-ease);
}
.wtg-card:hover .wtg-card__media img { transform: scale(1.05); }

.wtg-card__terms { margin: 0 0 10px; }
.wtg-card__title { margin: 0 0 12px; }
.wtg-card__title,
.wtg-card__title a {
	font-size: var(--wp--preset--font-size--title-sm);
	line-height: 1.24;
	text-decoration: none;
	text-wrap: balance;
	transition: color 0.2s var(--wtg-ease);
}
.wtg-card__excerpt { margin: 0 0 18px; }
.wtg-card__excerpt p { margin: 0; }

.wtg-card__meta,
.wtg-lede__meta,
.wtg-stack__meta {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 14px;
	margin-top: auto;
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--micro);
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--wp--preset--color--muted);
}
.wtg-card__meta > *, .wtg-stack__meta > * { margin: 0; }

/* ==========================================================================
   Reading time
   ========================================================================== */

.wtg-readtime {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--micro);
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--wp--preset--color--muted);
}
.wtg-readtime__dot {
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: var(--wtg-clay);
	flex: 0 0 auto;
}

/* ==========================================================================
   Destination tiles
   ========================================================================== */

.wtg-places { gap: var(--wp--preset--spacing--20); }
.wtg-place {
	position: relative;
	border-radius: var(--wtg-radius-lg);
	overflow: hidden;
	min-height: 300px;
	background: var(--wp--preset--color--sand);
	isolation: isolate;
}
.wtg-place .wp-block-cover__image-background { transition: transform 0.9s var(--wtg-ease); }
.wtg-place:hover .wp-block-cover__image-background { transform: scale(1.06); }
.wtg-place .wp-block-cover__inner-container { align-self: flex-end; width: 100%; }
.wtg-place__name {
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--title-sm);
	font-weight: 600;
	letter-spacing: -0.02em;
	line-height: 1.2;
	color: #fff;
	margin: 0 0 4px;
}
.wtg-place__count {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--micro);
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.78);
	margin: 0;
}

/* ==========================================================================
   Ad slots — space is reserved before the unit arrives, so filling it does
   not push the article down the page.
   ========================================================================== */

.wtg-ad {
	display: block;
	margin-block: var(--wp--preset--spacing--40);
	text-align: center;
	min-height: calc(var(--wtg-ad-reserve, 280px) + 24px);
}
@media (min-width: 782px) {
	.wtg-ad { min-height: calc(var(--wtg-ad-reserve-lg, 280px) + 24px); }
}
.wtg-ad__label {
	display: block;
	font-family: var(--wp--preset--font-family--mono);
	font-size: 10px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--wp--preset--color--muted);
	margin-bottom: 10px;
}
.wtg-ad .adsbygoogle { display: block; }

.wtg-ad.is-placeholder {
	display: grid;
	place-content: center;
	gap: 6px;
	border: 1px dashed var(--wtg-rule);
	border-radius: var(--wtg-radius);
	background: color-mix(in srgb, var(--wp--preset--color--sand) 40%, transparent);
	padding: 24px;
}
.wtg-ad.is-placeholder .wtg-ad__label {
	color: var(--wtg-clay);
	margin: 0;
}
.wtg-ad__hint {
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--muted);
	max-width: 42ch;
	line-height: 1.5;
}

.wtg-ad--sidebar {
	position: sticky;
	top: calc(var(--wtg-header-h) + 24px);
	margin-block: 0;
}

/* Editor-side preview of the ad block. */
.wtg-ad-editor {
	display: grid;
	place-items: center;
	gap: 6px;
	text-align: center;
	padding: 36px 24px;
	border: 1px dashed var(--wtg-rule);
	border-radius: var(--wtg-radius);
	background: color-mix(in srgb, var(--wp--preset--color--sand) 40%, transparent);
}
.wtg-ad-editor__kicker {
	font-family: var(--wp--preset--font-family--mono);
	font-size: 10px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--wtg-clay);
}
.wtg-ad-editor__name {
	font-family: var(--wp--preset--font-family--display);
	font-size: 20px;
	color: var(--wtg-ink);
}
.wtg-ad-editor__note {
	font-size: 13px;
	color: var(--wp--preset--color--muted);
	max-width: 44ch;
	line-height: 1.5;
}

/* ==========================================================================
   Single guide
   ========================================================================== */

.wtg-article__head { padding-top: var(--wp--preset--spacing--40); }
.wtg-article__title { margin: 0 0 20px; text-wrap: balance; }
.wtg-article__meta {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 16px;
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--micro);
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--wp--preset--color--muted);
	padding-bottom: var(--wp--preset--spacing--30);
	border-bottom: 1px solid var(--wtg-rule);
}
.wtg-article__meta > * { margin: 0; }
.wtg-article__meta .wp-block-avatar img { border-radius: 50%; }
.wtg-article__standfirst {
	font-size: var(--wp--preset--font-size--lead);
	line-height: 1.6;
	color: var(--wtg-ink);
	margin-block: var(--wp--preset--spacing--30);
}
.wtg-article__media {
	margin-block: var(--wp--preset--spacing--30) var(--wp--preset--spacing--40);
}
.wtg-article__media img { border-radius: var(--wtg-radius-lg); width: 100%; }

.wtg-content { font-size: var(--wp--preset--font-size--body); line-height: 1.78; }
.wtg-content > * { margin-block: 1.5em; }
.wtg-content > :first-child { margin-top: 0; }
.wtg-content h2 {
	margin-top: 2.2em;
	margin-bottom: 0.6em;
	scroll-margin-top: calc(var(--wtg-header-h) + 24px);
}
.wtg-content h3 {
	margin-top: 1.9em;
	margin-bottom: 0.5em;
	scroll-margin-top: calc(var(--wtg-header-h) + 24px);
}
.wtg-content h4 { margin-top: 1.7em; margin-bottom: 0.4em; }

/* Body links keep an underline — in a guide full of place names, colour
   alone is not a reliable signal that something is clickable. */
.wtg-content a:where(:not(.wp-element-button)) {
	color: var(--wtg-ink);
	text-decoration: underline;
	text-decoration-color: var(--wp--preset--color--clay-soft);
	text-decoration-thickness: 2px;
	text-underline-offset: 3px;
	transition: text-decoration-color 0.2s var(--wtg-ease), color 0.2s var(--wtg-ease);
}
.wtg-content a:where(:not(.wp-element-button)):hover {
	color: var(--wtg-clay);
	text-decoration-color: var(--wtg-clay);
}

.wtg-content ul, .wtg-content ol { padding-left: 1.3em; }
.wtg-content li { margin-bottom: 0.55em; }
.wtg-content li::marker { color: var(--wtg-clay); }
.wtg-content img { border-radius: var(--wtg-radius); }
.wtg-content figure { margin-block: 2em; }
.wtg-content figcaption {
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--muted);
	margin-top: 12px;
	line-height: 1.6;
}
.wtg-content hr { border: 0; border-top: 1px solid var(--wtg-rule); margin-block: 2.6em; }

.wtg-content blockquote {
	border-left: 2px solid var(--wtg-clay);
	padding-left: 26px;
	margin-left: 0;
	font-style: italic;
}
.wtg-content blockquote cite {
	display: block;
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--micro);
	letter-spacing: 0.12em;
	text-transform: uppercase;
	font-style: normal;
	color: var(--wp--preset--color--muted);
	margin-top: 14px;
}

.wtg-tags { margin-block: var(--wp--preset--spacing--40); }
.wtg-tags a {
	display: inline-block;
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--micro);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	border: 1px solid var(--wtg-rule);
	border-radius: 999px;
	padding: 7px 15px;
	margin: 0 7px 7px 0;
	transition: border-color 0.2s var(--wtg-ease), color 0.2s var(--wtg-ease);
}
.wtg-tags a:hover { border-color: var(--wtg-clay); color: var(--wtg-clay); }

.wtg-postnav { margin-block: var(--wp--preset--spacing--40); gap: var(--wp--preset--spacing--30); }
.wtg-postnav a {
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--title-sm);
	line-height: 1.26;
}
.wtg-postnav .post-navigation-link-next { text-align: right; margin-left: auto; }

/* Sidebar rail on single guides. */
.wtg-rail { align-items: flex-start; gap: var(--wp--preset--spacing--50); }
.wtg-rail__aside { position: sticky; top: calc(var(--wtg-header-h) + 24px); }

/* ==========================================================================
   Block styles (editor sidebar → Styles)
   ========================================================================== */

.wp-block-group.is-style-wtg-note,
.wp-block-group.is-style-wtg-warning {
	border-radius: var(--wtg-radius);
	padding: 26px 30px;
	position: relative;
}
.wp-block-group.is-style-wtg-note {
	background: color-mix(in srgb, var(--wp--preset--color--sand) 55%, transparent);
	border-left: 3px solid var(--wp--preset--color--sea);
}
.wp-block-group.is-style-wtg-warning {
	background: color-mix(in srgb, var(--wp--preset--color--clay-soft) 60%, transparent);
	border-left: 3px solid var(--wtg-clay);
}
.wp-block-group.is-style-wtg-note > :last-child,
.wp-block-group.is-style-wtg-warning > :last-child { margin-bottom: 0; }
.wp-block-group.is-style-wtg-note > :first-child,
.wp-block-group.is-style-wtg-warning > :first-child { margin-top: 0; }

.wp-block-group.is-style-wtg-card {
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wtg-rule);
	border-radius: var(--wtg-radius-lg);
	padding: 30px;
	box-shadow: var(--wp--preset--shadow--lift);
}

.wp-block-list.is-style-wtg-checklist { list-style: none; padding-left: 0; }
.wp-block-list.is-style-wtg-checklist li {
	position: relative;
	padding-left: 32px;
	margin-bottom: 0.7em;
}
.wp-block-list.is-style-wtg-checklist li::before {
	content: "";
	position: absolute;
	left: 2px;
	top: 0.46em;
	width: 11px;
	height: 6px;
	border-left: 2px solid var(--wtg-clay);
	border-bottom: 2px solid var(--wtg-clay);
	transform: rotate(-45deg);
}

.wp-block-list.is-style-wtg-steps { list-style: none; padding-left: 0; counter-reset: wtg-step; }
.wp-block-list.is-style-wtg-steps li {
	position: relative;
	padding-left: 46px;
	margin-bottom: 1em;
	counter-increment: wtg-step;
	min-height: 30px;
}
.wp-block-list.is-style-wtg-steps li::before {
	content: counter(wtg-step, decimal-leading-zero);
	position: absolute;
	left: 0;
	top: 0;
	width: 30px;
	height: 30px;
	display: grid;
	place-items: center;
	border-radius: 50%;
	background: var(--wtg-ink);
	color: var(--wtg-paper);
	font-family: var(--wp--preset--font-family--mono);
	font-size: 11px;
	font-weight: 500;
}

.wp-block-image.is-style-wtg-postcard img {
	background: #fff;
	border: 1px solid var(--wtg-rule);
	padding: 12px;
	border-radius: 2px;
	box-shadow: var(--wp--preset--shadow--lift);
}

.wp-block-separator.is-style-wtg-route {
	border: 0;
	border-top: 1.5px dashed var(--wtg-rule);
	opacity: 1;
	max-width: 100%;
	position: relative;
	margin-block: var(--wp--preset--spacing--40);
}
.wp-block-separator.is-style-wtg-route::before,
.wp-block-separator.is-style-wtg-route::after {
	content: "";
	position: absolute;
	top: 50%;
	width: 7px;
	height: 7px;
	margin-top: -4px;
	border-radius: 50%;
	border: 1.5px solid var(--wtg-clay);
	background: var(--wtg-paper);
}
.wp-block-separator.is-style-wtg-route::before { left: 0; }
.wp-block-separator.is-style-wtg-route::after { right: 0; }

.wp-block-table.is-style-wtg-fares table { border-collapse: collapse; width: 100%; }
.wp-block-table.is-style-wtg-fares th {
	background: var(--wtg-ink);
	color: var(--wtg-paper);
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--micro);
	letter-spacing: 0.12em;
	text-transform: uppercase;
	font-weight: 500;
	text-align: left;
	padding: 13px 16px;
	border: 0;
}
.wp-block-table.is-style-wtg-fares td {
	padding: 13px 16px;
	border: 0;
	border-bottom: 1px solid var(--wtg-rule);
}
.wp-block-table.is-style-wtg-fares tr:last-child td { border-bottom: 0; }
.wp-block-table.is-style-wtg-fares td:last-child,
.wp-block-table.is-style-wtg-fares th:last-child {
	text-align: right;
	font-variant-numeric: tabular-nums;
	font-feature-settings: "tnum";
}
.wp-block-table.is-style-wtg-fares tbody tr:nth-child(even) { background: color-mix(in srgb, var(--wp--preset--color--sand) 32%, transparent); }

.wp-block-quote.is-style-wtg-field {
	border: 0;
	background: color-mix(in srgb, var(--wp--preset--color--sand) 45%, transparent);
	border-radius: var(--wtg-radius);
	padding: 28px 32px;
	font-style: normal;
	position: relative;
}
.wp-block-quote.is-style-wtg-field::before {
	content: "Field note";
	display: block;
	font-family: var(--wp--preset--font-family--mono);
	font-size: 10px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--wtg-clay);
	margin-bottom: 12px;
}
.wp-block-quote.is-style-wtg-field p { font-size: var(--wp--preset--font-size--base); }

/* ==========================================================================
   Newsletter
   ========================================================================== */

.wtg-signup {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	max-width: 480px;
	margin-inline: auto;
}
.wtg-signup__input {
	flex: 1 1 260px;
	min-width: 0;
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wtg-rule);
	border-radius: 999px;
	padding: 14px 22px;
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--small);
	color: var(--wtg-ink);
	transition: border-color 0.25s var(--wtg-ease);
}
.wtg-signup__input::placeholder { color: var(--wp--preset--color--muted); }
.wtg-signup__input:focus { outline: none; border-color: var(--wtg-ink); }
.wtg-signup__submit {
	flex: 0 0 auto;
	background: var(--wtg-ink);
	color: var(--wtg-paper);
	border: 0;
	border-radius: 999px;
	padding: 14px 30px;
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	cursor: pointer;
	transition: background-color 0.25s var(--wtg-ease);
}
.wtg-signup__submit:hover { background: var(--wtg-clay); }
.wtg-signup__note {
	flex: 1 0 100%;
	text-align: center;
	font-size: var(--wp--preset--font-size--tiny);
	color: var(--wp--preset--color--muted);
	margin: 4px 0 0;
}

/* ==========================================================================
   Footer
   ========================================================================== */

/* Everything below tints the footer's own text colour instead of naming a
   literal, so flipping the palette in a style variation still works. */
.wtg-footer__index { gap: var(--wp--preset--spacing--40); }
.wtg-footer :is(h2, h3) { color: currentColor; }
.wtg-footer__heading {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--micro);
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: color-mix(in srgb, currentColor 55%, transparent);
	margin: 0 0 18px;
}
.wtg-footer p, .wtg-footer li { color: color-mix(in srgb, currentColor 78%, transparent); }
.wtg-footer a { color: color-mix(in srgb, currentColor 88%, transparent); }
.wtg-footer a:hover { color: currentColor; }
.wtg-footer ul { list-style: none; padding: 0; margin: 0; }
.wtg-footer li { margin-bottom: 11px; font-size: var(--wp--preset--font-size--small); }
.wtg-footer .wtg-brand .wp-block-site-title a { color: currentColor; }
.wtg-footer__bottom {
	border-top: 1px solid color-mix(in srgb, currentColor 16%, transparent);
	margin-top: var(--wp--preset--spacing--40);
	padding-top: var(--wp--preset--spacing--30);
}
.wtg-footer__legal {
	font-family: var(--wp--preset--font-family--mono);
	font-size: 10px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: color-mix(in srgb, currentColor 52%, transparent);
	margin: 0;
}
.wtg-footer .wp-block-social-link:hover { transform: translateY(-2px); }

/* ==========================================================================
   Pagination, comments, search, 404
   ========================================================================== */

.wtg-pagination {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--micro);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	gap: 10px;
	margin-block: var(--wp--preset--spacing--50);
}
.wtg-pagination .page-numbers {
	display: inline-grid;
	place-items: center;
	min-width: 38px;
	height: 38px;
	padding: 0 10px;
	border: 1px solid var(--wtg-rule);
	border-radius: 999px;
	color: var(--wp--preset--color--muted);
	transition: border-color 0.2s var(--wtg-ease), color 0.2s var(--wtg-ease);
}
.wtg-pagination .page-numbers:hover { border-color: var(--wtg-ink); color: var(--wtg-ink); }
.wtg-pagination .page-numbers.current {
	background: var(--wtg-ink);
	border-color: var(--wtg-ink);
	color: var(--wtg-paper);
}

.wtg-comments { margin-block: var(--wp--preset--spacing--50); }
.wtg-comments .wp-block-comment-author-name {
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 600;
	font-size: var(--wp--preset--font-size--small);
}
.wtg-comments .wp-block-comment-date {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--micro);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--wp--preset--color--muted);
}
.wtg-comments .wp-block-avatar img { border-radius: 50%; }
.wtg-comments :is(input[type="text"], input[type="email"], input[type="url"], textarea) {
	width: 100%;
	border: 1px solid var(--wtg-rule);
	border-radius: var(--wtg-radius);
	background: var(--wp--preset--color--surface);
	padding: 12px 15px;
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--small);
}
.wtg-comments :is(input, textarea):focus { outline: none; border-color: var(--wtg-ink); }

.wtg-404__code {
	font-family: var(--wp--preset--font-family--mono);
	font-size: clamp(64px, 16vw, 140px);
	line-height: 1;
	color: var(--wp--preset--color--clay-soft);
	margin: 0 0 12px;
	letter-spacing: -0.04em;
}

/* ==========================================================================
   Responsive
   ========================================================================== */

@media (max-width: 1100px) {
	.wtg-lede__title, .wtg-lede__title a { font-size: var(--wp--preset--font-size--title-lg); }
}

@media (max-width: 900px) {
	.wtg-rail { flex-wrap: wrap; }
	.wtg-rail > .wp-block-column { flex-basis: 100% !important; }
	.wtg-rail__aside { position: static; }
	.wtg-ad--sidebar { position: static; }
}

@media (max-width: 781px) {
	:root { --wtg-header-h: 60px; }
	.wtg-hero__cols { flex-wrap: wrap; }
	.wtg-hero__cols > .wp-block-column { flex-basis: 100% !important; }
	.wtg-lede__body { position: static; background: none; padding: 20px 0 0; }
	.wtg-lede__body .wtg-kicker { color: var(--wtg-clay); }
	.wtg-lede__title, .wtg-lede__title a { color: var(--wtg-ink); }
	.wtg-lede__meta { color: var(--wp--preset--color--muted); }
	.wtg-lede .wp-block-post-featured-image { border-radius: var(--wtg-radius-lg); height: auto; }
	.wtg-section-head { flex-wrap: wrap; align-items: flex-start; }
	.wtg-places { flex-wrap: wrap !important; }
	.wtg-places > .wp-block-column { flex-basis: calc(50% - 8px) !important; }
}

@media (max-width: 600px) {
	.wtg-utility__row { justify-content: center; }
	.wtg-places > .wp-block-column { flex-basis: 100% !important; }
	.wtg-postnav .post-navigation-link-next { text-align: left; margin-left: 0; }
	.wtg-signup__submit { width: 100%; }
	.wtg-stack__item .wp-block-post-featured-image { flex-basis: 76px; }
	.wtg-stack__item .wp-block-post-featured-image img { width: 76px; height: 64px; }
}

/* ==========================================================================
   Print — readers do print trip guides before they travel
   ========================================================================== */

@media print {
	.wtg-masthead, .wtg-utility, .wtg-footer, .wtg-ad, .wtg-signup,
	.wtg-pagination, .wtg-comments, .wtg-postnav { display: none !important; }
	.wtg-content { font-size: 11pt; line-height: 1.5; }
	.wtg-content a::after { content: " (" attr(href) ")"; font-size: 9pt; color: #555; }
	.wtg-article__media img { max-height: 8cm; object-fit: cover; }
}
