/* ==========================================================
   Site extras (2026-11-12): header search, search results,
   homepage events message and "Stories from the island".
   ========================================================== */

/* ---------- Header search ---------- */
.icp-nav { margin-left: auto; }
.icpx-search-toggle {
	display: inline-grid;
	place-items: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 2px solid var(--icp-navy, #14275A);
	border-radius: 50%;
	background: #fff;
	color: var(--icp-navy, #14275A);
	cursor: pointer;
	flex: none;
}
.icpx-search-toggle:hover,
.icpx-search-toggle[aria-expanded="true"] { background: var(--icp-navy, #14275A); color: #fff; }
.icpx-search-panel {
	position: absolute;
	top: 100%;
	right: clamp(16px, 3vw, 48px);
	z-index: 60;
	width: min(560px, calc(100vw - 32px));
	margin-top: 8px;
	padding: 14px;
	border-radius: 18px;
	background: #fff;
	box-shadow: 0 18px 50px rgba(20, 39, 90, 0.22);
}
.icpx-search-panel[hidden] { display: none; }

.icpx-search-form { display: flex; gap: 8px; margin: 0; }
.icpx-search-form input[type="search"] {
	flex: 1;
	min-width: 0;
	min-height: 48px;
	padding: 10px 16px;
	border: 1.5px solid #CBD5E1;
	border-radius: 999px;
	background: #F8FAFC;
	font: 600 16px "Nunito", system-ui, sans-serif;
	color: #14275A;
}
.icpx-search-form input[type="search"]:focus { outline: 3px solid rgba(28, 111, 214, 0.2); border-color: #1C6FD6; background: #fff; }
.icpx-search-form button {
	min-height: 48px;
	padding: 0 22px;
	border: 0;
	border-radius: 999px;
	background: #F0561B;
	color: #fff;
	font: 800 16px "Nunito", system-ui, sans-serif;
	cursor: pointer;
}

@media (max-width: 1360px) {
	.icp-brand { order: 0; }
	.icpx-search-toggle { order: 1; margin-left: auto; }
	.icp-nav-toggle { order: 2; margin-left: 0 !important; }
	.icp-nav { order: 3; margin-left: 0; }
	.icpx-search-panel { right: 14px; }
}

/* ---------- Search results page ---------- */
body:has(.icpx-results) #page,
body:has(.icpx-results) .site-content { max-width: 100% !important; padding: 0 !important; }
.icpx-results {
	flex: 1 1 100%;
	width: 100%;
	min-width: 0;
	background: #F6F9FC;
	color: #2B3A55;
	font-family: "Nunito", system-ui, sans-serif;
	padding-bottom: clamp(48px, 7vw, 90px);
}
.icpx-results * { box-sizing: border-box; }
.icpx-wrap { max-width: 1240px; margin: 0 auto; padding: 0 clamp(18px, 4vw, 40px); }
.icpx-results__hero {
	padding: clamp(36px, 6vw, 64px) 0 clamp(26px, 4vw, 40px);
	background: linear-gradient(180deg, #DDEBFA 0%, #F6F9FC 100%);
}
.icpx-eyebrow {
	display: inline-block;
	margin: 0 0 10px;
	font-size: 13px;
	font-weight: 900;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: #F0561B;
}
.icpx-results h1 {
	margin: 0 0 18px;
	font-family: "Fraunces", Georgia, serif;
	font-weight: 800;
	font-size: clamp(30px, 4.5vw, 50px);
	line-height: 1.08;
	color: #14275A;
}
.icpx-search-form--big { max-width: 720px; }
.icpx-results__count { margin: 14px 0 0; font-weight: 800; color: #64748B; }
.icpx-results__jump { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.icpx-results__jump a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 7px 14px;
	border-radius: 999px;
	background: #fff;
	border: 1.5px solid #E3EAF3;
	color: #14275A;
	font-weight: 800;
	font-size: 14px;
	text-decoration: none;
}
.icpx-results__jump a span { padding: 0 7px; border-radius: 999px; background: var(--c); color: #fff; font-size: 12px; }

.icpx-group { padding-top: clamp(26px, 4vw, 40px); scroll-margin-top: 20px; }
.icpx-group h2 {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 16px;
	font-family: "Fraunces", Georgia, serif;
	font-weight: 800;
	font-size: clamp(22px, 2.4vw, 28px);
	color: #14275A;
}
.icpx-group h2::before { content: ""; width: 12px; height: 12px; border-radius: 50%; background: var(--c); }
.icpx-group__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 14px; }
.icpx-hit {
	display: grid;
	grid-template-columns: 110px minmax(0, 1fr);
	gap: 14px;
	align-items: center;
	padding: 10px;
	border-radius: 16px;
	background: #fff;
	border: 1px solid #E3EAF3;
	text-decoration: none !important;
	transition: border-color 0.2s, box-shadow 0.2s;
}
.icpx-hit:hover { border-color: var(--c); box-shadow: 0 10px 26px rgba(20, 39, 90, 0.1); }
.icpx-hit__media { display: block; aspect-ratio: 4 / 3; border-radius: 12px; overflow: hidden; background: color-mix(in srgb, var(--c) 15%, #fff); }
.icpx-hit__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.icpx-hit__ph { display: block; width: 100%; height: 100%; background: linear-gradient(135deg, var(--c), color-mix(in srgb, var(--c) 50%, #14275A)); }
.icpx-hit__body { display: grid; gap: 4px; min-width: 0; }
.icpx-hit__title { font-family: "Fraunces", Georgia, serif; font-weight: 800; font-size: 18px; line-height: 1.25; color: #14275A; }
.icpx-hit__text { font-size: 14.5px; line-height: 1.45; color: #475569; }

.icpx-empty { max-width: 640px; margin: clamp(30px, 5vw, 50px) auto 0; padding: clamp(26px, 4vw, 40px); text-align: center; border-radius: 22px; background: #fff; border: 1px solid #E3EAF3; }
.icpx-empty h2 { margin: 0 0 8px; font-family: "Fraunces", Georgia, serif; font-weight: 800; color: #14275A; }
.icpx-empty p { margin: 0 0 14px; line-height: 1.6; }
.icpx-empty__links { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.icpx-empty__links a { padding: 8px 16px; border-radius: 999px; background: #EEF5FD; color: #1A56B0; font-weight: 800; text-decoration: none; }

/* ---------- Homepage: no upcoming events ---------- */
.icpx-noevents {
	max-width: 620px;
	margin: 10px auto 40px;
	padding: clamp(24px, 4vw, 36px);
	text-align: center;
	border-radius: 22px;
	background: #fff;
	border: 1.5px dashed #F6B39A;
}
.icpx-noevents__icon { display: inline-grid; place-items: center; width: 64px; height: 64px; margin-bottom: 10px; border-radius: 50%; background: #FFF1EB; color: #F0561B; }
.icpx-noevents h3 { margin: 0 0 8px; font-family: "Fraunces", Georgia, serif; font-weight: 800; font-size: 24px; color: #14275A; }
.icpx-noevents p { margin: 0 0 18px; line-height: 1.6; color: #475569; }
.icpx-btn {
	display: inline-flex;
	align-items: center;
	min-height: 48px;
	padding: 0 26px;
	border-radius: 999px;
	background: #F0561B;
	color: #fff !important;
	font-weight: 800;
	text-decoration: none !important;
}

/* ---------- Homepage: Stories from the island ---------- */
.icpx-stories {
	max-width: 1240px;
	margin: clamp(30px, 5vw, 60px) auto clamp(40px, 6vw, 70px);
	padding: 0 clamp(18px, 4vw, 40px);
	font-family: "Nunito", system-ui, sans-serif;
}
.icpx-stories__head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 12px 24px; margin-bottom: 20px; }
.icpx-stories__head h2 { margin: 0; font-family: "Fraunces", Georgia, serif; font-weight: 800; font-size: clamp(28px, 3.4vw, 40px); color: #14275A; }
.icpx-stories__head .icpx-eyebrow { color: #E2558B; }
.icpx-stories__links { display: flex; flex-wrap: wrap; gap: 8px 18px; }
.icpx-stories__links a { color: var(--c) !important; font-weight: 800; text-decoration: none; }
.icpx-stories__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.icpx-story { display: flex; flex-direction: column; border-radius: 18px; overflow: hidden; background: #fff; border: 1px solid #E3EAF3; box-shadow: 0 10px 28px rgba(20, 39, 90, 0.07); }
.icpx-story__media { position: relative; display: block; aspect-ratio: 16 / 10; overflow: hidden; background: #1B1033; }
.icpx-story__media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.4s; }
.icpx-story:hover .icpx-story__media img { transform: scale(1.04); }
.icpx-story__ph { display: block; width: 100%; height: 100%; background: linear-gradient(135deg, var(--c), #14275A); }
.icpx-story__play { position: absolute; left: 50%; top: 50%; display: grid; place-items: center; width: 48px; height: 48px; margin: -24px 0 0 -24px; border-radius: 50%; background: var(--c); box-shadow: 0 0 0 6px rgba(255, 255, 255, 0.25); }
.icpx-story__play svg { margin-left: 2px; }
.icpx-story__body { display: flex; flex-direction: column; gap: 6px; padding: 14px 16px 16px; }
.icpx-story__cat { align-self: flex-start; padding: 3px 10px; border-radius: 999px; background: color-mix(in srgb, var(--c) 14%, #fff); color: var(--c); font-size: 12px; font-weight: 900; letter-spacing: 0.06em; text-transform: uppercase; }
.icpx-story h3 { margin: 0; font-family: "Fraunces", Georgia, serif; font-weight: 800; font-size: 18px; line-height: 1.25; }
.icpx-story h3 a { color: #14275A !important; text-decoration: none; }
.icpx-story h3 a:hover { color: var(--c) !important; }
.icpx-story p { margin: 0; font-size: 14px; font-weight: 700; color: #64748B; }

@media (max-width: 1024px) { .icpx-stories__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) {
	.icpx-stories__grid { grid-template-columns: 1fr; }
	.icpx-hit { grid-template-columns: 90px minmax(0, 1fr); }
	.icpx-group__grid { grid-template-columns: 1fr; }
}