/* Travelo AI Writer – bestemmingspagina's (enkel op productcategorieën geladen) */
.travelo-cat-intro { font-size: 1.05em; max-width: 46em; }

.travelo-guide { clear: both; margin: 0 0 2.5em; padding-top: 3.5em; }
.travelo-guide__inner { padding: 0; }
.travelo-guide__body { font-size: 1.1em; line-height: 1.75; color: #222; }
.travelo-guide__body h2 { margin: 1.8em 0 .55em; font-size: 1.75em; font-weight: 800; line-height: 1.25; color: #111; scroll-margin-top: 90px; }
.travelo-guide__body h2:first-child { margin-top: 0; }
.travelo-guide__body h3 { margin: 1.4em 0 .4em; font-size: 1.3em; font-weight: 800; color: #111; }
.travelo-guide__body p { margin: 0 0 1.1em; }
.travelo-guide__body ul { margin: 0 0 1.2em 1.25em; }

.travelo-faq__item { background: #fff; border: 1px solid #e3e8ee; border-radius: 8px; margin: 0 0 .6em; padding: 0; }
.travelo-faq__item summary { cursor: pointer; font-weight: 600; padding: .8em 1em; list-style: none; position: relative; padding-right: 2.5em; }
.travelo-faq__item summary::-webkit-details-marker { display: none; }
.travelo-faq__item summary::after { content: "+"; position: absolute; right: 1em; top: .7em; font-size: 1.2em; }
.travelo-faq__item[open] summary::after { content: "–"; }
.travelo-faq__item p { margin: 0; padding: 0 1em 1em; }

.travelo-links { clear: both; margin: 4em 0 2.5em; padding-top: 2.5em; border-top: 1px solid #e3e8ee; }
.travelo-links > h2:first-child { margin-top: 0; }
.travelo-links h2 { font-size: 1.5em; font-weight: 800; color: #111; margin: 1.5em 0 .7em; }
.travelo-links__back { margin-top: .8em; }

.travelo-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 12px; }
.travelo-card { display: flex; flex-direction: column; gap: 2px; padding: .9em 1em; border: 1px solid #e3e8ee; border-radius: 8px; background: #fff; text-decoration: none; transition: box-shadow .15s, border-color .15s; }
.travelo-card:hover, .travelo-card:focus { border-color: #b9c6d3; box-shadow: 0 2px 8px rgba(0,0,0,.06); }
.travelo-card__name { font-weight: 700; }
.travelo-card__meta { font-size: .88em; color: #5b6770; }
.travelo-card__price { font-size: .92em; font-weight: 600; color: #e46f00; }

.travelo-hotels { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 16px; }
.travelo-hotel { display: flex; flex-direction: column; border: 1px solid #e3e8ee; border-radius: 10px; overflow: hidden; background: #fff; text-decoration: none; transition: box-shadow .15s; }
.travelo-hotel:hover, .travelo-hotel:focus { box-shadow: 0 3px 12px rgba(0,0,0,.08); }
.travelo-hotel__img img { display: block; width: 100%; height: 160px; object-fit: cover; margin: 0; }
.travelo-hotel__body { display: flex; flex-direction: column; gap: 3px; padding: .8em 1em 1em; }
.travelo-hotel__name { font-weight: 700; line-height: 1.3; }
.travelo-hotel__stars { color: #f0a500; letter-spacing: 1px; font-size: .9em; }
.travelo-hotel__price { font-weight: 600; color: #e46f00; }

.travelo-pills { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.travelo-pills a { display: inline-flex; align-items: center; gap: 6px; padding: .35em .9em; border: 1px solid #d5dde5; border-radius: 999px; background: #fff; text-decoration: none; font-size: .92em; }
.travelo-pills a:hover, .travelo-pills a:focus { border-color: #9fb0c0; }
.travelo-pills span { background: #eef2f6; border-radius: 999px; padding: 0 .5em; font-size: .85em; color: #5b6770; }

@media (max-width: 600px) {
	.travelo-guide__body { font-size: 1.02em; }
	.travelo-guide__body h2 { font-size: 1.45em; }
	.travelo-hotel__img img { height: 140px; }
}

/* Regiokaarten met foto (categorie-afbeelding) */
.travelo-card { overflow: hidden; }
.travelo-card__img { display: block; width: calc(100% + 2em); max-width: none; margin: -.9em -1em .6em; aspect-ratio: 16/10; height: auto; object-fit: cover; }
.travelo-card__img--leeg { background: linear-gradient(135deg, #dcecef, #f4f8f9); }
.travelo-card__name { color: #13212c; }
.travelo-card__price { color: #0d4a57; font-weight: 800; }

/* Mobiel: platte lijstkaart, foto links en info rechts */
@media (max-width: 600px) {
	.travelo-cards { grid-template-columns: 1fr; gap: 8px; }
	.travelo-card { display: grid; grid-template-columns: 96px 1fr; grid-auto-rows: min-content; column-gap: 12px; row-gap: 1px; padding: 0; align-content: center; min-height: 76px; }
	.travelo-card__img { grid-column: 1; grid-row: 1 / span 3; width: 96px; height: 100%; min-height: 76px; margin: 0; aspect-ratio: auto; }
	.travelo-card__name, .travelo-card__meta, .travelo-card__price { grid-column: 2; padding-right: 10px; }
	.travelo-card__name { padding-top: 10px; }
	.travelo-card > :last-child { padding-bottom: 10px; }
}
@media (max-width: 600px) {
	.travelo-card { min-height: 80px; }
	.travelo-card__img { height: 80px !important; min-height: 0; align-self: center; }
}

/* Leesbaarheid: minimale lettergroottes (rem) */
.travelo-hotel__name { font-size: 1.05rem; color: #13212c; }
.travelo-hotel__stars { font-size: .95rem; }
.travelo-hotel__price { font-size: 1rem; color: #0d4a57; font-weight: 800; }
.travelo-pills a { font-size: 1rem; color: #13212c; }
.travelo-pills span { font-size: .85rem; }
.travelo-card__meta { font-size: .92rem; }
.travelo-card__price { font-size: 1rem; }
