/*
Theme Name: In terris Gryphi
Theme URI: https://tegrys.geo.uni-greifswald.de/
Author: In terris Gryphi project
Author URI: https://www.uni-greifswald.de/
Description: Block theme for the "In terris Gryphi" Pomerania heritage project — Lato typography, navy/teal/griffin-red palette, editorial heroes, teal bands and an interactive multilingual tour-map block (Leaflet). Built from the Claude Design handoff; every section is composed of core Gutenberg blocks so all text stays editable in the Site Editor.
Requires at least: 6.4
Tested up to: 6.7
Requires PHP: 7.4
Version: 1.0.3
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: in-terris-gryphi
Tags: block-patterns, full-site-editing, block-styles, custom-colors, editor-style
*/

/* =====================================================================
   In terris Gryphi — utility classes used by templates & patterns.
   Every section is core Gutenberg blocks + a className; the classes below
   carry the visual design from the handoff prototypes. Removing a class
   can never "break" a block — text always stays editable.
   ===================================================================== */

::selection { background: #e5332a; color: #fff; }
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }

@keyframes itgUp {
	from { opacity: 0; transform: translateY(16px); }
	to { opacity: 1; transform: translateY(0); }
}

/* ---------------- Kicker / eyebrow ---------------- */
.itg-kicker {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-weight: 700;
	font-size: 12px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: #e5332a;
}
.itg-kicker::before,
.itg-kicker.is-both::after {
	content: "";
	width: 24px;
	height: 1px;
	background: currentColor;
	display: inline-block;
}
.itg-kicker.is-salmon { color: #f0a89e; }
.itg-kicker.is-light { color: #a9d2e4; }

/* ---------------- Headings ---------------- */
.itg-h-upper { text-transform: uppercase; letter-spacing: 0.01em; }
.itg-h-teal { color: #2b6e92 !important; }
.itg-h-white { color: #ffffff !important; }

/* ---------------- Hero (blue atlas background) ---------------- */
.itg-hero {
	position: relative;
	background: #e4edf3;
	overflow: hidden;
}
.itg-hero.is-gradient { background: linear-gradient(#eef4f8, #e1ebf2); }
.itg-hero > .itg-hero-art {
	position: absolute;
	inset: 0;
	margin: 0 !important;
	pointer-events: none;
}
.itg-hero > .itg-hero-art svg { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0.16; }
.itg-hero > .itg-hero-art.is-skyline svg { top: auto; height: 160px; bottom: 0; opacity: 0.36; }
.itg-hero > .itg-hero-art::after {
	content: "";
	position: absolute;
	inset: 0;
	background: radial-gradient(120% 80% at 50% 0%, transparent 45%, rgba(228, 237, 243, 0.88) 100%);
}
.itg-hero.is-gradient > .itg-hero-art::after {
	background: linear-gradient(transparent 30%, rgba(225, 235, 242, 0.92));
}
.itg-hero > *:not(.itg-hero-art) { position: relative; }
.itg-hero .itg-anim { animation: itgUp 0.7s ease both; }

.itg-hero-title { color: #2b6e92 !important; line-height: 0.99 !important; }
.itg-hero-sub { color: #56707e !important; font-size: clamp(17px, 1.5vw, 20px) !important; line-height: 1.6 !important; }

/* hero stats row */
.itg-stats { gap: 30px !important; }
.itg-stat-num { font-size: 30px !important; font-weight: 900 !important; color: #173a52 !important; line-height: 1.1; margin: 0 !important; }
.itg-stat-label { font-weight: 700 !important; font-size: 11px !important; letter-spacing: 0.12em; text-transform: uppercase; color: #8a99a3 !important; margin: 3px 0 0 !important; }
.itg-stat-sep { width: 1px; align-self: stretch; background: #cdd9e2; }

/* framed map graphic (hero right) */
.itg-frame {
	position: relative;
	transform: rotate(-1.6deg);
	background: #fff;
	border: 1px solid #dde6ec;
	border-radius: 6px;
	padding: 14px;
	box-shadow: 0 30px 60px -24px rgba(23, 58, 82, 0.4);
}
.itg-frame img { border-radius: 3px; }
.itg-grid-paper {
	min-height: 440px;
	border-radius: 3px;
	background-color: #dbe6ee;
	background-image: linear-gradient(#c8d8e3 1px, transparent 1px),
		linear-gradient(90deg, #c8d8e3 1px, transparent 1px);
	background-size: 34px 34px, 34px 34px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 700;
	font-size: 12px;
	color: #6a8595;
}

/* ---------------- Buttons ---------------- */
.wp-block-button .wp-block-button__link { padding: 15px 28px; }
.itg-btn-red .wp-block-button__link {
	background: #e5332a !important;
	color: #fff !important;
	box-shadow: 0 10px 24px rgba(229, 51, 42, 0.28);
	transition: background 0.15s ease, transform 0.15s ease;
}
.itg-btn-red .wp-block-button__link:hover { background: #cb2a22 !important; transform: translateY(-2px); }
.itg-btn-navy .wp-block-button__link { background: #173a52 !important; color: #fff !important; transition: background 0.15s ease; }
.itg-btn-navy .wp-block-button__link:hover { background: #102a3c !important; }
.itg-btn-white .wp-block-button__link { background: #fff !important; color: #173a52 !important; font-weight: 900 !important; padding: 11px 22px; }
.itg-btn-white .wp-block-button__link:hover { background: #eaf2f6 !important; }

/* underlined red-arrow link */
.itg-link-red a,
a.itg-link-red {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: inherit !important;
	font-weight: 900;
	font-size: 16px;
	text-decoration: none !important;
	border-bottom: 2px solid #e5332a;
	padding-bottom: 4px;
	transition: gap 0.15s ease;
}
.itg-link-red a:hover, a.itg-link-red:hover { gap: 14px; }

/* ---------------- Bands ---------------- */
.itg-band-teal { background: #1b6d93; color: #eaf2f6; }
.itg-band-teal p { color: rgba(234, 242, 246, 0.9); }
.itg-band-teal h1, .itg-band-teal h2, .itg-band-teal h3 { color: #fff; }
.itg-band-navy { background: #173a52; color: #eaf2f6; }
.itg-band-grey { background: #eef2f5; }
.itg-band-blue { background: #e4edf3; }

/* ---------------- Cards ---------------- */
.itg-card {
	background: #f4f7f9;
	border: 1px solid #e6ecf1;
	border-radius: 14px;
	padding: 34px 30px;
	transition: transform 0.2s ease, border-color 0.2s ease;
}
.itg-card:hover { border-color: #1b6d93; transform: translateY(-4px); }
.itg-card.is-teal { background: #1b6d93; border-color: #1b6d93; }
.itg-card.is-teal h3 { color: #fff !important; }
.itg-card.is-teal p { color: rgba(234, 242, 246, 0.85) !important; }
.itg-card-no { font-size: 13px; font-weight: 900 !important; color: #1b6d93 !important; margin: 0 !important; }
.itg-card.is-teal .itg-card-no { color: #a9d2e4 !important; }
.itg-card-h {
	font-size: 15px !important;
	font-weight: 900 !important;
	letter-spacing: 0.14em !important;
	text-transform: uppercase;
	color: #173a52;
	margin: 14px 0 12px !important;
}
.itg-card p { font-size: 16px; line-height: 1.6; color: #5a6a72; }

/* glassy card on teal band (digital libraries) */
.itg-glass {
	background: rgba(255, 255, 255, 0.07);
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: 16px;
	padding: 32px;
	transition: transform 0.2s ease, border-color 0.2s ease;
	height: 100%;
	display: flex;
	flex-direction: column;
}
.itg-glass:hover { border-color: #f0a89e; transform: translateY(-4px); }
.itg-glass-icon {
	width: 60px;
	height: 60px;
	border-radius: 12px;
	background: rgba(255, 255, 255, 0.1);
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 900;
	font-size: 20px;
	color: #cfe3ee;
	margin: 0 0 22px !important;
}
.itg-glass h3 { font-size: 24px !important; margin: 0 0 10px !important; }
.itg-glass p { font-size: 15px !important; color: rgba(234, 242, 246, 0.72) !important; margin: 0 0 24px !important; }
.itg-glass .wp-block-buttons { margin-top: auto; }

/* featured "digitisation of the month" */
.itg-featured {
	background: #173a52;
	border: 1px solid rgba(255, 255, 255, 0.2);
	border-radius: 16px;
	padding: 30px;
	text-align: center;
}
.itg-featured-label {
	font-weight: 700 !important;
	font-size: 12px !important;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: #f0a89e !important;
	margin: 0 !important;
}
.itg-featured-frame {
	margin: 20px auto 0;
	max-width: 300px;
	padding: 12px;
	background: #0f2c40;
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: 6px;
}
.itg-featured h3 { font-style: italic; font-weight: 700 !important; font-size: 22px !important; margin: 22px 0 6px !important; }
.itg-featured p:last-child { font-size: 14px !important; color: rgba(234, 242, 246, 0.66) !important; margin: 0 !important; }

/* placeholder hatch surfaces */
.itg-ph {
	position: relative;
	border-radius: 10px;
	overflow: hidden;
	background-color: #dbe6ee;
	background-image: repeating-linear-gradient(135deg, #cdd9e2 0 2px, transparent 2px 15px);
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 700;
	font-size: 11px;
	color: #6a8595;
	letter-spacing: 0.05em;
	min-height: 230px;
}
.itg-ph.is-parchment { background-color: #d7c3a8; background-image: repeating-linear-gradient(135deg, #c9b496 0 2px, transparent 2px 14px); color: #7d6b50; }
.itg-ph.is-postcard { background-color: #cbbd9c; background-image: repeating-linear-gradient(135deg, #bfb08b 0 2px, transparent 2px 12px); color: #7a6f55; min-height: 230px; border-radius: 3px; }
.itg-ph.is-tall { min-height: 480px; border-radius: 8px; border: 1px solid rgba(255, 255, 255, 0.2); }
.itg-ph-tag {
	position: absolute;
	left: 16px;
	bottom: 16px;
	background: rgba(23, 58, 82, 0.92);
	color: #fff;
	font-weight: 700;
	font-size: 11px;
	padding: 7px 12px;
	border-radius: 5px;
}

/* white partner card on teal band (About) */
.itg-partner-card {
	background: #fff;
	border-radius: 16px;
	padding: 32px;
	box-shadow: 0 24px 50px -30px rgba(15, 40, 60, 0.5);
	transition: transform 0.2s ease;
	text-align: center;
	height: 100%;
}
.itg-partner-card:hover { transform: translateY(-5px); }
.itg-partner-card h3 { font-size: 23px !important; line-height: 1.2 !important; color: #173a52 !important; margin: 0 0 22px !important; }
.itg-partner-card p { font-size: 15.5px; line-height: 1.65; color: #566671; margin: 22px 0 0; }

/* staff card (About) */
.itg-staff-card { text-align: left; }
.itg-staff-card h3 { font-size: 19px !important; line-height: 1.25 !important; margin: 0 !important; }
.itg-staff-role {
	font-weight: 700 !important;
	font-size: 11px !important;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: #1b6d93 !important;
	margin: 6px 0 18px !important;
}
.itg-staff-role.is-red { color: #e5332a !important; }
.itg-staff-names { font-size: 15.5px !important; font-style: italic; color: #46555f !important; line-height: 1.7 !important; }
.itg-staff-contact {
	margin-top: 18px !important;
	padding-top: 16px;
	border-top: 1px solid #e2e9ee;
	font-size: 13.5px !important;
	color: #6b7a84 !important;
	line-height: 1.6 !important;
}
.itg-staff-contact a { color: #1b6d93; font-weight: 700; word-break: break-all; }

/* partner logo tile */
.itg-logo-tile {
	min-height: 84px;
	border: 1px solid #e6ecf1;
	border-radius: 10px;
	background: #f4f7f9;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 700;
	font-size: 12px;
	color: #8a99a3;
	text-align: center;
	padding: 0 12px;
}

/* ---------------- Blog teaser list (front page) ---------------- */
.itg-blog-list .wp-block-post {
	background: #fff;
	border: 1px solid #d8e3ec;
	border-radius: 14px;
	padding: 30px;
	transition: transform 0.15s ease, border-color 0.15s ease;
	position: relative;
}
.itg-blog-list .wp-block-post:hover { transform: translateY(-3px); border-color: #1b6d93; }
.itg-blog-list .wp-block-post-date {
	font-weight: 700;
	font-size: 12px;
	color: #8a99a3;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}
.itg-blog-list .wp-block-post-title { font-size: clamp(22px, 2.4vw, 30px) !important; line-height: 1.15 !important; margin: 8px 0 !important; }
.itg-blog-list .wp-block-post-title a { color: #173a52 !important; text-decoration: none; }
.itg-blog-list .wp-block-post-title a::after { content: ""; position: absolute; inset: 0; }
.itg-blog-list .wp-block-post-excerpt { font-size: 16px; line-height: 1.6; color: #5a6a72; }
.itg-blog-list .wp-block-post-excerpt__more-text { display: none; }

/* ---------------- Blog grid ("Field.notes") ---------------- */
.itg-masthead-rule { display: flex; align-items: center; gap: 18px; }
.itg-masthead-rule .rule { flex: 1; height: 2px; background: #173a52; }
.itg-masthead-left { font-weight: 900 !important; font-size: 13px !important; letter-spacing: 0.28em; text-transform: uppercase; color: #173a52 !important; margin: 0 !important; white-space: nowrap; }
.itg-masthead-right { font-weight: 700 !important; font-size: 13px !important; letter-spacing: 0.16em; text-transform: uppercase; color: #1b6d93 !important; margin: 0 !important; white-space: nowrap; }
.itg-masthead-title {
	font-size: clamp(64px, 13vw, 168px) !important;
	line-height: 0.82 !important;
	letter-spacing: -0.05em !important;
	color: #173a52 !important;
	margin: 30px 0 0 !important;
}
.itg-masthead-title .dot { color: #e5332a; }
.itg-masthead-title em { font-style: italic; font-weight: 400; letter-spacing: -0.015em; color: #1b6d93; }
.itg-masthead-title .dash { display: inline-block; vertical-align: middle; height: 0.08em; width: clamp(70px, 18vw, 300px); background: #e5332a; margin: 0 0 0.22em 0.22em; }

.itg-post-grid .wp-block-post-template {
	display: grid !important;
	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
	gap: 0 !important;
	border-top: 1px solid #dce4ea;
	border-left: 1px solid #dce4ea;
}
.itg-post-grid .wp-block-post {
	border-right: 1px solid #dce4ea;
	border-bottom: 1px solid #dce4ea;
	background: #fff;
	display: flex;
	flex-direction: column;
	transition: background 0.2s ease;
	position: relative;
	margin: 0 !important;
}
.itg-post-grid .wp-block-post:hover { background: #f6fafb; }
.itg-post-grid .wp-block-post-featured-image { aspect-ratio: 1 / 1; margin: 0 !important; overflow: hidden; background-color: #dbe6ee; background-image: repeating-linear-gradient(135deg, #cdd9e2 0 2px, transparent 2px 13px); }
.itg-post-grid .wp-block-post-featured-image img { width: 100%; height: 100%; object-fit: cover; }
.itg-post-grid .itg-grid-body { padding: 26px 26px 30px; display: flex; flex-direction: column; flex: 1; }
.itg-post-grid .wp-block-post-date { font-weight: 700; font-size: 12px; letter-spacing: 0.12em; text-transform: uppercase; color: #e5332a; margin-bottom: 14px; }
.itg-post-grid .wp-block-post-title { font-size: 24px !important; line-height: 1.18 !important; letter-spacing: -0.01em !important; margin: 0 0 12px !important; }
.itg-post-grid .wp-block-post-title a { color: #173a52 !important; text-decoration: none; }
.itg-post-grid .wp-block-post-title a::after { content: ""; position: absolute; inset: 0; }
.itg-post-grid .wp-block-post-excerpt { font-size: 15.5px; line-height: 1.6; color: #56666f; margin: 0 0 18px; }
.itg-post-grid .wp-block-post-excerpt__more-text { display: none; }
.itg-post-grid .itg-read-more { margin-top: auto !important; font-weight: 900 !important; font-size: 14px !important; color: #1b6d93 !important; }

/* pagination */
.itg-pagination { justify-content: center; margin-top: 42px; font-weight: 900; }
.itg-pagination a, .itg-pagination .wp-block-query-pagination-numbers { color: #173a52; }

/* ---------------- Single post ---------------- */
.itg-post-meta {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 18px;
	flex-wrap: wrap;
	font-weight: 700 !important;
	font-size: 13px !important;
	letter-spacing: 0.06em;
	color: #6b7a84 !important;
}
.itg-post-meta > * { display: flex; align-items: center; gap: 18px; }
.itg-dot-sep { width: 4px; height: 4px; border-radius: 50%; background: #e5332a; display: inline-block; }

.itg-article { font-size: 18px; line-height: 1.75; color: #46555f; }
.itg-article > p:first-child,
.itg-article .itg-lede { font-size: 22px !important; line-height: 1.6 !important; color: #173a52 !important; font-weight: 700; }
.itg-article figure { margin: 36px 0; }
.itg-article figcaption { font-weight: 700; font-size: 13px; color: #8a99a3; margin-top: 12px; letter-spacing: 0.02em; text-align: left; }
.itg-article blockquote, .itg-article .wp-block-quote {
	margin: 40px 0;
	padding: 8px 0 8px 28px;
	border-left: 4px solid #e5332a;
	font-size: 25px;
	line-height: 1.4;
	font-style: italic;
	color: #173a52;
	font-weight: 700;
}
.itg-article .wp-block-quote p { margin: 0; }
.itg-source-box { background: #f4f7f9; border: 1px solid #e6ecf1; padding: 24px 26px; }
.itg-source-box .itg-source-label { font-weight: 900 !important; font-size: 11px !important; letter-spacing: 0.16em; text-transform: uppercase; color: #1b6d93 !important; margin: 0 0 8px !important; }
.itg-source-box p { font-size: 15px !important; line-height: 1.6 !important; color: #56666f !important; margin: 0 !important; }

/* sidebar: latest dispatches */
.itg-sidebar { border: 1px solid #e6ecf1; background: #fff; position: sticky; top: 96px; }
.itg-sidebar-head { padding: 22px 24px !important; border-bottom: 2px solid #173a52; display: flex; align-items: baseline; justify-content: space-between; }
.itg-sidebar-head h2 { font-size: 20px !important; letter-spacing: -0.01em !important; margin: 0 !important; }
.itg-sidebar-no { font-weight: 900; font-size: 12px; color: #e5332a; }
.itg-sidebar .wp-block-post { padding: 16px 24px; border-bottom: 1px solid #eef2f5; margin: 0 !important; position: relative; transition: background 0.15s ease; display: flex; gap: 14px; align-items: center; }
.itg-sidebar .wp-block-post:hover { background: #f6fafb; }
.itg-sidebar .wp-block-post-featured-image { flex: 0 0 64px; width: 64px; height: 64px; margin: 0 !important; background-color: #dbe6ee; background-image: repeating-linear-gradient(135deg, #cdd9e2 0 2px, transparent 2px 9px); }
.itg-sidebar .wp-block-post-featured-image img { width: 64px; height: 64px; object-fit: cover; }
.itg-sidebar .wp-block-post-title { font-size: 15px !important; line-height: 1.25 !important; font-weight: 700 !important; margin: 0 !important; }
.itg-sidebar .wp-block-post-title a { color: #173a52 !important; text-decoration: none; }
.itg-sidebar .wp-block-post-title a::after { content: ""; position: absolute; inset: 0; }
.itg-sidebar .wp-block-post-date { font-weight: 700; font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; color: #9aa8b1; margin-top: 4px; }

/* ---------------- Header ---------------- */
.itg-header {
	position: sticky;
	top: 0;
	z-index: 50;
	backdrop-filter: saturate(140%) blur(10px);
	background: rgba(255, 255, 255, 0.9);
	border-bottom: 1px solid #e6ecf1;
}
.itg-logo-text { line-height: 1.05; }
.itg-logo-text .site-title, .itg-logo-text .wp-block-site-title a {
	font-weight: 900 !important;
	font-size: 20px !important;
	color: #173a52 !important;
	letter-spacing: -0.01em;
	text-decoration: none;
	white-space: nowrap;
}
.itg-logo-tagline { font-size: 11px !important; letter-spacing: 0.04em; color: #7d8b94 !important; margin: 0 !important; }
.itg-nav a { color: #46555f !important; font-size: 15px; font-weight: 700; text-decoration: none; }
.itg-nav a:hover { color: #1b6d93 !important; }
.itg-nav .current-menu-item > a { color: #1b6d93 !important; font-weight: 900; }
.itg-header .itg-btn-navy .wp-block-button__link { padding: 10px 18px; font-size: 14px; border-radius: 24px; white-space: nowrap; }

/* EU-funding (Interreg) badge — divider before it on the wide one-row header */
@media (min-width: 1024px) {
	.itg-header figure.wp-block-image {
		border-left: 1px solid #dfe6ec;
		padding-left: 22px;
		margin-left: 6px !important;
	}
}

/* ---- Mobile nav overlay: escape the sticky header's backdrop-filter ----
   backdrop-filter on .itg-header creates a containing block that would trap
   the navigation overlay's position:fixed inside the header box. Drop it while
   the menu is open so the navy panel covers the whole viewport. */
.itg-header:has(.wp-block-navigation__responsive-container.is-menu-open) {
	backdrop-filter: none !important;
	-webkit-backdrop-filter: none !important;
	background: transparent !important;
	border-bottom-color: transparent !important;
}
/* the overlay menu links must be light on the navy panel (override .itg-nav a) */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content,
.wp-block-navigation__responsive-container.is-menu-open .itg-nav a {
	color: #ffffff !important;
	font-size: 22px;
	font-weight: 800;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:hover {
	color: #f0a89e !important;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	flex-direction: column !important;
	align-items: center !important;
	justify-content: center !important;
	width: 100%;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content > .wp-block-navigation__container,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	order: 1;
	flex-direction: column !important;
	align-items: center !important;
	justify-content: center !important;
	width: 100% !important;
	gap: 8px;
	text-align: center;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
	justify-content: center;
}
/* nicer, inset close (X) button on the navy overlay */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
	top: 18px;
	right: 18px;
	width: 44px;
	height: 44px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	border: 1px solid rgba(255, 255, 255, 0.28);
	border-radius: 50%;
	transition: background 0.15s ease, border-color 0.15s ease;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close:hover {
	background: rgba(255, 255, 255, 0.12);
	border-color: rgba(255, 255, 255, 0.55);
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close svg {
	width: 22px;
	height: 22px;
	fill: currentColor;
}
/* language switcher the plugin injects into the open menu — sit below the links,
   centred, legible on the navy panel */
.wp-block-navigation__responsive-container.is-menu-open .itg-mobile-lang-wrap {
	order: 2;
	width: auto !important;
	justify-content: center !important;
	margin: 22px 0 0 !important;
	padding-top: 20px !important;
	border-top-color: rgba(255, 255, 255, 0.18) !important;
}
.wp-block-navigation__responsive-container.is-menu-open .itg-mobile-lang-wrap .itg-lang-switcher {
	margin: 0 !important;
}
.wp-block-navigation__responsive-container.is-menu-open .itg-mobile-lang-wrap .itg-lang-switcher__trigger {
	color: #ffffff !important;
	font-size: 17px !important;
	margin: 0 !important;
}

/* ---------------- Header — phone layout (burger breakpoint) ----------------
   One tidy top row: logo (left) · language + burger (right); the EU-funding
   badge drops to its own centred row beneath a divider. */
@media (max-width: 599.98px) {
	.itg-header > .wp-block-group {
		flex-wrap: wrap !important;
		align-items: center;
		justify-content: flex-start !important;
		column-gap: 10px !important;
		row-gap: 0 !important;
		padding: 8px 16px !important;
	}
	/* dissolve the right-hand wrapper so nav/lang/badge join the same flex row */
	.itg-header > .wp-block-group > .wp-block-group:last-child { display: contents; }
	.itg-header > .wp-block-group > .wp-block-group:first-child { order: 1; flex: 1 1 auto; min-width: 0; }
	.itg-header .itg-lang-switcher:not(.itg-lang-switcher--mobile) { order: 2; flex: 0 0 auto; margin-left: auto; }
	.itg-header .itg-nav { order: 3; flex: 0 0 auto; }
	.itg-header figure.wp-block-image {
		order: 4;
		flex: 0 0 100%;
		margin: 10px 0 0 !important;
		padding-top: 10px;
		border-top: 1px solid #e6ecf1;
		border-left: 0;
		display: flex;
		justify-content: center;
	}
	.itg-header figure.wp-block-image img { max-height: 54px; width: auto; max-width: 78vw; }
	/* trim the wasted logo padding and scale the mark down on phones */
	.itg-header .wp-block-group:has(> .wp-block-site-logo) { padding-left: 0 !important; padding-right: 0 !important; }
	.itg-header .custom-logo { width: 44px !important; height: auto !important; }
	.itg-logo-text .site-title, .itg-logo-text .wp-block-site-title a { font-size: 17px !important; }
	.itg-logo-tagline { font-size: 10px !important; }
	.itg-header .wp-block-navigation__responsive-container-open { padding: 6px; color: #173a52; }
}

/* ---------------- Footer ---------------- */
/* remove the 24px root block-gap that leaves a white strip above the footer */
.wp-site-blocks > footer.wp-block-template-part { margin-top: 0 !important; }

.itg-footer { background: #173a52; color: #eaf2f6; }
.itg-footer a { color: rgba(234, 242, 246, 0.82) !important; font-size: 15px; text-decoration: none; }
.itg-footer a:hover { color: #fff !important; }
.itg-footer .itg-foot-h {
	font-weight: 700 !important;
	font-size: 11px !important;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: #7fa7bd !important;
	margin: 0 0 16px !important;
}
.itg-footer .itg-logo-text .site-title, .itg-footer .wp-block-site-title a { color: #fff !important; }
.itg-footer .itg-logo-tagline { color: #7fa7bd !important; }
.itg-interreg {
	display: inline-flex !important;
	align-items: center;
	gap: 12px;
	background: rgba(255, 255, 255, 0.07);
	border: 1px solid rgba(255, 255, 255, 0.16);
	border-radius: 8px;
	padding: 12px 16px;
}
.itg-interreg .brand { font-size: 13px !important; font-weight: 900 !important; color: #fff !important; margin: 0 !important; }
.itg-interreg .region { font-size: 10px !important; color: #7fa7bd !important; line-height: 1.4 !important; margin: 0 !important; }
.itg-foot-bottom {
	border-top: 1px solid rgba(255, 255, 255, 0.14);
	font-size: 12px;
	color: #6f97ad;
}
.itg-foot-bottom p { font-size: 12px !important; color: #6f97ad !important; margin: 0 !important; }

/* ---------------- Misc ---------------- */
.itg-hatch-cap { position: relative; }
.itg-fig-tag {
	position: absolute;
	bottom: 0;
	left: 0;
	background: #173a52;
	color: #fff;
	font-weight: 900;
	font-size: 12px;
	letter-spacing: 0.06em;
	padding: 8px 13px;
	white-space: nowrap;
}

/* ---------------- Additions: masthead helpers, contact rows ---------------- */
.itg-masthead-rule p { margin: 0 !important; }
.itg-masthead-rule .rule { min-height: 2px; }
.itg-masthead-place {
	font-weight: 700 !important;
	font-size: 13px !important;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: #7d8b94 !important;
	white-space: nowrap;
	margin: 0 !important;
}

/* skyline silhouette on hero (used by blog masthead) */
.itg-hero.is-skyline::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 180px;
	pointer-events: none;
	opacity: 0.42;
	background-repeat: repeat-x;
	background-position: bottom center;
	background-size: auto 100%;
	background-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1280 260'%3E%3Cg fill='%23c3d5e3'%3E%3Crect x='40' y='170' width='120' height='90'/%3E%3Cpolygon points='60,170 100,120 140,170'/%3E%3Crect x='190' y='150' width='60' height='110'/%3E%3Cpolygon points='190,150 220,110 250,150'/%3E%3Crect x='215' y='70' width='10' height='50'/%3E%3Crect x='300' y='160' width='150' height='100'/%3E%3Cpolygon points='320,160 360,120 400,160'/%3E%3Cpolygon points='400,160 425,130 450,160'/%3E%3Crect x='500' y='120' width='40' height='140'/%3E%3Cpolygon points='500,120 520,70 540,120'/%3E%3Crect x='517' y='40' width='6' height='32'/%3E%3Crect x='580' y='150' width='90' height='110'/%3E%3Cpolygon points='595,150 625,110 655,150'/%3E%3Crect x='720' y='100' width='46' height='160'/%3E%3Cpolygon points='720,100 743,50 766,100'/%3E%3Crect x='740' y='22' width='6' height='30'/%3E%3Crect x='820' y='140' width='120' height='120'/%3E%3Cpolygon points='840,140 880,95 920,140'/%3E%3Crect x='990' y='155' width='80' height='105'/%3E%3Cpolygon points='990,155 1030,115 1070,155'/%3E%3Crect x='1120' y='160' width='60' height='100'/%3E%3Crect x='1200' y='90' width='44' height='170'/%3E%3Cpolygon points='1200,90 1222,55 1244,90'/%3E%3C/g%3E%3C/svg%3E");
}
.itg-hero.is-skyline > * { position: relative; z-index: 1; }

/* logo tiles — taller variant (About page) */
.itg-logo-tile.is-tall { min-height: 96px; background: #fff; border-color: #e0e7ed; }

/* contact rows (About page) */
.itg-contact-row { text-align: left; padding: 22px 26px !important; transition: border-color 0.15s ease; }
.itg-contact-row:hover { border-color: #1b6d93; }
.itg-contact-row p { margin: 0 !important; }
.itg-contact-row .itg-staff-role { margin-bottom: 4px !important; }
.itg-contact-row a { color: #1b6d93; text-decoration: none; }

/* back link on single hero */
.itg-back-link { margin-bottom: 20px !important; }
.itg-back-link a { font-weight: 900; font-size: 13px; letter-spacing: 0.06em; color: #1b6d93; text-decoration: none; }
.itg-back-link a:hover { color: #173a52; }

/* sidebar list heading spacing */
.itg-sidebar .wp-block-post-date { font-weight: 700; font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: #e5332a; }
.itg-sidebar h3.itg-sidebar-head { font-size: 20px !important; }
.itg-sidebar h4 { margin: 4px 0 0 !important; }

/* blog teaser lede width (was a child-layout attr; plain CSS is more robust) */
.itg-blog-lede { max-width: 640px; }

/* ---------------- Atlas hero (centered variant) ---------------- */
.itg-hero-title.is-huge {
	font-size: clamp(48px, 8vw, 104px) !important;
	letter-spacing: -0.02em !important;
	font-weight: 900 !important;
}
.itg-hero-atlas .itg-hero-sub {
	font-size: clamp(19px, 2.4vw, 26px) !important;
	line-height: 1.4 !important;
	max-width: 600px;
	margin-left: auto !important;
	margin-right: auto !important;
	margin-top: 22px !important;
}
.itg-coord {
	position: absolute !important;
	margin: 0 !important;
	font-size: 11px !important;
	font-weight: 700 !important;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: #90a6b4 !important;
	z-index: 2;
}
.itg-coord.is-tl { top: 24px; left: 32px; }
.itg-coord.is-tr { top: 24px; right: 32px; }
.itg-coord.is-bl { bottom: 24px; left: 32px; letter-spacing: 0.16em; }
/* in the editor canvas the absolute chip must not swallow clicks of siblings */
.itg-coord { pointer-events: auto; max-width: 40%; }

/* ---------------- Replaceable images ---------------- */
.itg-img { margin: 0 !important; }
.itg-img img { width: 100%; height: auto; border-radius: 16px; display: block; }
.itg-img.is-frame img { border-radius: 12px; border: 1px solid rgba(23, 58, 82, 0.12); box-shadow: 0 22px 44px rgba(16, 42, 60, 0.16); }
.itg-img.is-postcard img { border-radius: 4px; box-shadow: 0 18px 38px rgba(0, 0, 0, 0.35); transform: rotate(-1.2deg); }
.itg-img figcaption {
	text-align: center;
	font-size: 12px !important;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: #8a99a3;
	margin-top: 14px;
}
.itg-band-teal .itg-img figcaption { color: #bcd4e0; }
.itg-partner-card .itg-img { margin: 18px 0 !important; }
.itg-partner-card .itg-img img { border-radius: 10px; }