/* AlbaVoyage Core — cards, city-page jump nav, item detail pages, flight search box. */

/* ---------- City pages: jump nav ---------- */
html { scroll-behavior: smooth; }
[id="overview"], [id="food"], [id="things-to-do"], [id="culture"] { scroll-margin-top: 90px; }

.av-jumpnav {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 10px 0 40px;
}
.av-jumpnav a {
	padding: 9px 18px;
	border: 1px solid #000;
	color: #000;
	font-family: Montserrat, sans-serif;
	font-size: 13px;
	text-transform: lowercase;
	transition: background-color .2s, color .2s;
}
.av-jumpnav a:hover { background: #ffe500; }

/* ---------- Cards ---------- */
.av-cards {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: 24px;
	margin-top: 30px;
}
.av-card {
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid #ececec;
	transition: box-shadow .2s, transform .2s;
}
.av-card:hover { box-shadow: 0 10px 30px rgba(0, 0, 0, .08); transform: translateY(-2px); }
a.av-card--link, a.av-card--link:hover { color: inherit; text-decoration: none; }
a.av-card--link:focus-visible { outline: 2px solid #000; outline-offset: 3px; }
.av-card-img { aspect-ratio: 4 / 3; overflow: hidden; background: #f6f6f6; }
.av-card-img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s; }
a.av-card--link:hover .av-card-img img { transform: scale(1.04); }
.av-card--noimg { border-top: 4px solid #ffe500; }
.av-card-body { padding: 20px 22px 24px; display: flex; flex-direction: column; flex: 1; }
.av-card-body h3, .av-card-body h4 { margin: 0 0 8px; font-size: 18px; line-height: 1.3; }
.av-card-body p { margin: 0 0 14px; font-size: 14px; line-height: 1.6; }
.av-card-tag {
	align-self: flex-start;
	margin-bottom: 10px;
	padding: 3px 10px;
	background: #ffe500;
	color: #000;
	font-size: 11px;
	letter-spacing: .04em;
	text-transform: uppercase;
}
.av-card-link { margin-top: auto; font-weight: 600; color: #000; }
a.av-card--link:hover .av-card-link, .av-card-link:hover { text-decoration: underline; }

.av-photo-credit { font-size: 12px; color: #9a9a9a; }
.av-photo-credit a { color: #6f6f6f; }

/* ---------- Item detail pages ---------- */
/* Header photo (theme title area): show the middle of the city photo, not just the sky. */
body.single-av_food .qodef-title-holder,
body.single-av_place .qodef-title-holder { background-size: cover !important; background-position: center 55% !important; }

.av-detail { padding: 40px 0 80px; }
.av-breadcrumb { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 30px; font-size: 13px; color: #9a9a9a; }
.av-breadcrumb a { color: #000; }
.av-breadcrumb a:hover { text-decoration: underline; }

.av-detail-head {
	display: grid;
	grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
	gap: 50px;
	align-items: start;
	margin-bottom: 50px;
}
.av-detail-head--noimg { grid-template-columns: 1fr; max-width: 800px; }
.av-detail-main { aspect-ratio: 4 / 3; background: #f6f6f6; overflow: hidden; }
.av-detail-main img { width: 100%; height: 100%; object-fit: cover; display: block; }
.av-detail-thumbs { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 10px; }
.av-thumb {
	width: 84px;
	height: 64px;
	padding: 0;
	border: 2px solid transparent;
	background: #f6f6f6;
	cursor: pointer;
	overflow: hidden;
}
.av-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.av-thumb.is-active { border-color: #ffe500; }

.av-detail-title { margin: 6px 0 16px; }
.av-detail-lead { font-size: 18px; line-height: 1.6; color: #333; }
.av-detail-facts { list-style: none; margin: 24px 0 0; padding: 20px 0 0; border-top: 1px solid #ececec; }
.av-detail-facts li { margin-bottom: 8px; }
.av-detail-facts a { color: #000; font-weight: 600; }

.av-detail-body { max-width: 820px; }
.av-detail-body h3 { margin: 40px 0 14px; }
.av-detail-body p { line-height: 1.8; }
.av-detail-body figure { margin: 10px 0 24px; }
.av-detail-body figure img { width: 100%; max-height: 520px; object-fit: cover; display: block; }
.av-detail-body figcaption { margin-top: 8px; font-size: 13px; color: #9a9a9a; }

.av-ingredients { margin: 40px 0 0; padding: 26px 30px; background: #f6f6f6; border-left: 4px solid #ffe500; }
.av-ingredients h3 { margin-top: 0; }

.av-map { margin: 50px 0 0; }
.av-map iframe { width: 100%; height: 380px; border: 0; display: block; }

.av-detail-more { margin-top: 70px; }
.av-more-link { display: inline-block; margin-top: 24px; font-weight: 600; color: #000; }
.av-detail-cta { margin: 70px 0 30px; padding: 40px; background: #ffe500; }
.av-detail-cta h3 { margin-top: 0; }

@media (max-width: 900px) {
	.av-detail-head { grid-template-columns: 1fr; gap: 30px; }
	.av-detail-cta { padding: 28px 22px; }
	.av-map iframe { height: 300px; }
}

/* ---------- Travel Deals: flight search ---------- */
.av-flight-search { max-width: 1100px; margin: 0 auto; min-height: 220px; }

/* ---------- Contact form: honeypot field (hidden from people, filled only by bots) ---------- */
.av-hp { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }

/* ---------- Homepage: latest blog posts ---------- */
.av-latest-posts { margin: 0; }
.av-latest-posts > h2 { margin-bottom: 0; }
.av-latest-posts .av-more-link { display: inline-block; margin-top: 26px; font-weight: 600; color: #000; }

/* ---------- Homepage hero slider ([av_hero]) ---------- */
.av-hero { position: relative; height: clamp(460px, 82vh, 760px); overflow: hidden; background: #1f2d38; color: #fff; }
.av-hero-track, .av-hero-slide { position: absolute; inset: 0; }
.av-hero-slide { opacity: 0; visibility: hidden; transition: opacity .9s ease, visibility 0s linear .9s; }
.av-hero-slide.is-active { opacity: 1; visibility: visible; transition: opacity .9s ease; }
.av-hero-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.av-hero-slide::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0, 0, 0, .12) 0%, rgba(0, 0, 0, .34) 100%); }
.av-hero-content { position: absolute; inset: 0; z-index: 2; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 0 24px; text-align: center; }
.av-hero-title { margin: 0; color: #fff; font-family: Montserrat, 'Montserrat Fallback', sans-serif; font-size: clamp(44px, 8vw, 96px); line-height: 1.05; letter-spacing: 0; text-shadow: 0 2px 16px rgba(0, 0, 0, .4); }
.av-hero-bold { font-weight: 800; }
.av-hero-light { font-weight: 300; }
.av-hero-sub { margin: 14px 0 0; color: #fff; font-family: Montserrat, 'Montserrat Fallback', sans-serif; font-size: clamp(16px, 2vw, 20px); font-weight: 600; text-shadow: 0 1px 10px rgba(0, 0, 0, .45); }
.av-hero-btn { display: inline-block; margin-top: 30px; padding: 16px 38px; background: #ffe500; color: #000; font-family: Montserrat, sans-serif; font-size: 15px; font-weight: 500; text-decoration: none; transition: background-color .2s; }
.av-hero-btn:hover, .av-hero-btn:focus { background: #fff; color: #000; }
.av-hero-arrow { position: absolute; top: 50%; z-index: 3; width: 44px; height: 44px; padding: 0; border: 0; background: #ffe500; color: #000; font-size: 30px; line-height: 40px; cursor: pointer; transform: translateY(-50%); }
.av-hero-prev { left: 0; }
.av-hero-next { right: 0; }
.av-hero-dots { position: absolute; right: 0; bottom: 18px; left: 0; z-index: 3; display: flex; justify-content: center; gap: 6px; }
.av-hero-dot { position: relative; width: 26px; height: 26px; padding: 0; border: 0; background: transparent; cursor: pointer; }
.av-hero-dot::before { content: ''; position: absolute; top: 7px; left: 7px; width: 12px; height: 12px; border: 2px solid #fff; border-radius: 50%; box-sizing: border-box; }
.av-hero-dot.is-active::before { background: #fff; }
.av-hero :focus-visible { outline: 3px solid #ffe500; outline-offset: 3px; }
@media (max-width: 680px) {
	.av-hero { height: 470px; }
	.av-hero-light { display: block; }
	.av-hero-arrow { display: none; }
}
@media (prefers-reduced-motion: reduce) {
	.av-hero-slide, .av-hero-slide.is-active { transition: none; }
}
.av-visually-hidden { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

/* Flight search: room for the widget before it loads (no jump when it appears). */
.av-flight-search { min-height: 490px; }
@media only screen and (min-width: 1025px) { .av-flight-search { min-height: 220px; } }

/* Photo credit links: underlined so they are recognisable as links without relying on colour. */
.av-photo-credit a { text-decoration: underline; }