/* RF Reisveiligheid. Accent #b9cf38 = merkgroen travelonbags. */

.rf-rv-melding{background:#fff3cd;border:1px solid #e0c56a;padding:.75em 1em;font-size:.9em}

/* --- tweekolomsopzet: bestemmingen links, kaart rechts --- */
.rf-rv-kaart{display:grid;grid-template-columns:minmax(200px,240px) 1fr;gap:1.8em;align-items:start}

/* --- kaart --- */
.rf-rv-wereld{position:relative}
.rf-rv-map{width:100%;height:min(70vh,560px);border-radius:6px;overflow:hidden;background:#e8eef3}
.maplibregl-ctrl-attrib{font-size:10px}

/* stippen op de kaart */
.rf-rv-punt{display:block;width:16px;height:16px;border-radius:50%;cursor:pointer;
	background:var(--kleur);box-shadow:0 0 0 2.5px #fff,0 1px 4px rgba(0,0,0,.35);
	transition:transform .12s}
.rf-rv-punt:hover,.rf-rv-punt:focus,.rf-rv-punt.is-actief{transform:scale(1.45);z-index:3}
.rf-rv-punt span{position:absolute;left:50%;bottom:calc(100% + 9px);transform:translateX(-50%);
	background:#1d1d1b;color:#fff;padding:.3em .6em;border-radius:3px;font-size:.75rem;
	line-height:1.2;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .12s}
.rf-rv-punt span b{color:#fff}
.rf-rv-punt-nr{width:26px;height:26px;display:flex;align-items:center;justify-content:center}
.rf-rv-punt-nr i{font-style:normal;font-size:.78rem;font-weight:700;color:#fff}
.rf-rv-punt:hover span,.rf-rv-punt:focus span,.rf-rv-punt.is-actief span{opacity:1}

/* legenda onder de kaart */
.rf-rv-legenda{list-style:none;display:flex;flex-wrap:wrap;gap:.2em 1.1em;margin:.7em 0 0;padding:0;
	font-size:.78rem;color:#666}
.rf-rv-legenda li{display:flex;align-items:center;gap:.4em}
.rf-rv-legenda span{width:9px;height:9px;border-radius:50%;background:var(--kleur)}

/* --- lijst --- */
.rf-rv-lijst{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.4em;
	/* ponytail: op ooghoogte van de kaart houden, ook bij 26 bestemmingen */
	max-height:min(620px,70vh);overflow-y:auto}
.rf-rv-lijst a{display:flex;flex-wrap:wrap;align-items:center;gap:.35em .6em;padding:.65em .8em;border:1px solid #e6e6e6;
	border-radius:4px;text-decoration:none;color:inherit;line-height:1.25}
.rf-rv-lijst a:hover{border-color:#b9cf38;background:#fafcf2}
/* Astra onderstreept links in de contentkolom, dat maakt van de knoppen een rommeltje */
.rf-rv-lijst a,.rf-rv-lijst a:hover,.rf-rv-lijst a *{text-decoration:none!important}
.rf-rv-lijst .rf-rv-land{display:block;width:100%;order:3;margin-left:1.6em;margin-top:-.15em}
.rf-rv-vlag{width:10px;height:10px;border-radius:50%;background:var(--kleur);flex:0 0 auto}
.rf-rv-land{color:#777;font-size:.85em}
.rf-rv-score{margin-left:auto;font-weight:700;font-variant-numeric:tabular-nums}

/* --- bestemmingspagina --- */
.rf-rv-bestemming{--rand:#e6e6e6;--zacht:#f7f7f5}

/* hero met stadsfoto */
.rf-rv-hero{margin:0 0 1.6em}
/* badge hoort bij het beeld, niet bij de figure: anders komt hij over het bijschrift */
.rf-rv-hero-beeld{position:relative;border-radius:8px;overflow:hidden}
.rf-rv-hero img{display:block;width:100%;height:clamp(220px,38vw,380px);object-fit:cover}
.rf-rv-hero-badge{position:absolute;left:0;bottom:0;display:flex;align-items:center;gap:.7em;
	padding:.7em 1.1em .7em .9em;background:rgba(255,255,255,.94);border-radius:0 8px 0 0;
	border-left:6px solid var(--kleur)}
.rf-rv-hero-badge strong{font-size:2.1rem;line-height:1;color:var(--kleur)}
.rf-rv-hero-badge span{font-size:.68rem;line-height:1.25;text-transform:uppercase;letter-spacing:.05em;color:#555}
.rf-rv-hero figcaption{padding:.45em .2em 0;font-size:.7rem;color:#8a8a8a}
.rf-rv-hero figcaption a{color:#8a8a8a}

/* het antwoord op de zoekvraag, bewust als eerste tekstblok */
.rf-rv-lead{font-size:1.12rem;line-height:1.6;background:var(--zacht);
	border-left:5px solid var(--kleur);padding:1.1em 1.3em;margin:0 0 1.4em}

.rf-rv-blok-bronnen{background:#fff;border:1px solid var(--rand)}
.rf-rv-bron{border-left:3px solid var(--kleur);margin:0 0 1.1em;padding:.3em 0 .3em 1.1em;font-style:italic;color:#444}
.rf-rv-bron p{margin:0}
.rf-rv-bron cite{display:block;margin-top:.35em;font-size:.78rem;font-style:normal;color:#777}
.rf-rv-onderbouwing{margin:1.1em 0 0;padding-top:.9em;border-top:1px solid var(--rand);font-size:.85rem;color:#555}
.rf-rv-hero-badge span b{font-weight:700;color:var(--kleur)}

/* risicokaartjes naast elkaar */
.rf-rv-risicos{display:grid;gap:1em;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));margin:0 0 2.4em}
.rf-rv-risico{display:flex;flex-direction:column;border:1px solid var(--rand);border-radius:8px;
	padding:1.2em 1.3em;background:#fff}
.rf-rv-chip{align-self:flex-start;background:var(--kleur);color:#fff;font-size:.68rem;font-weight:700;
	text-transform:uppercase;letter-spacing:.05em;padding:.25em .65em;border-radius:99px;margin-bottom:.7em}
.rf-rv-risico h3{margin:0 0 .35em;font-size:1.12rem}
.rf-rv-waar{margin:0 0 .6em;font-size:.82rem;color:#777}
.rf-rv-hoe{margin:0 0 1em}
.rf-rv-oplossing{margin-top:auto;padding-top:.9em;border-top:1px solid var(--rand);font-size:.92rem}
.rf-rv-oplossing p{margin:0 0 .8em}
.rf-rv-cta{display:block;width:fit-content;background:#b9cf38;color:#111;padding:.5em 1em;
	border-radius:4px;text-decoration:none!important;font-weight:600}
.rf-rv-cta:hover{filter:brightness(.94);color:#111}

/* losse blokken: hotspots en faq */
.rf-rv-blok{background:var(--zacht);border-radius:8px;padding:1.4em 1.6em;margin:0 0 1.4em}
.rf-rv-blok h2{margin-top:0}
/* kaart met genummerde hotspots, lijst ernaast */
.rf-rv-stadskaart{display:grid;grid-template-columns:1fr minmax(180px,230px);gap:1.2em;align-items:start}
.rf-rv-map-stad{height:clamp(260px,34vw,360px)}
.rf-rv-hotspots{list-style:none;display:flex;flex-direction:column;gap:.45em;margin:0;padding:0}
.rf-rv-hotspots li{display:flex;align-items:center;gap:.6em;background:#fff;border:1px solid var(--rand);
	border-radius:6px;padding:.5em .7em;font-size:.9rem;line-height:1.25}
.rf-rv-nr{flex:0 0 auto;width:22px;height:22px;border-radius:50%;background:var(--kleur);color:#fff;
	font-size:.75rem;font-weight:700;display:flex;align-items:center;justify-content:center}

.rf-rv-faq{border-bottom:1px solid #e0e0dc;padding:.8em 0}
.rf-rv-faq:last-of-type{border-bottom:0;padding-bottom:0}
.rf-rv-faq summary{cursor:pointer;font-weight:600;list-style:none;padding-right:1.5em;position:relative}
.rf-rv-faq summary::-webkit-details-marker{display:none}
.rf-rv-faq summary::after{content:"+";position:absolute;right:0;top:-.1em;font-size:1.3em;color:var(--kleur)}
.rf-rv-faq[open] summary::after{content:"–"}
.rf-rv-faq p{margin:.6em 0 0}

.rf-rv-meta{font-size:.8rem;color:#777}
.rf-rv-meta a{color:#777}

/* --- smal scherm: onder elkaar, kaart blijft want hij is pan- en zoombaar --- */
@media (max-width:900px){
	.rf-rv-kaart{grid-template-columns:1fr}
	.rf-rv-lijst{max-height:none;overflow:visible;order:2}
	.rf-rv-wereld{order:1}
	.rf-rv-map{height:min(55vh,380px)}
}
@media (max-width:767px){
	.rf-rv-stadskaart{grid-template-columns:1fr}
	.rf-rv-hero-badge{padding:.5em .8em}
	.rf-rv-hero-badge strong{font-size:1.7rem}
	.rf-rv-blok{padding:1.1em 1.2em}
}
.rf-rv-rubriek{margin:0;padding-left:1.2em}
.rf-rv-rubriek li{margin:.4em 0}

/* --- afsluitend blok: brug naar de shop en terug naar de kaart --- */
.rf-rv-shop{background:var(--zacht);border-left:5px solid var(--kleur);border-radius:8px;
	padding:1.5em 1.7em;margin:0 0 1.4em}
.rf-rv-shop h2{margin:0 0 .5em}
.rf-rv-shop p{margin:0 0 1em}
.rf-rv-knoppen{display:flex;flex-wrap:wrap;align-items:center;gap:.8em 1.2em;margin:0}
.rf-rv-cta-groot{padding:.75em 1.4em;font-size:1.02rem}
.rf-rv-terug{font-weight:600;text-decoration:none!important;color:#444;
	border-bottom:2px solid var(--kleur);padding-bottom:.1em}
.rf-rv-terug::before{content:"\2190";margin-right:.4em}
.rf-rv-terug:hover{color:#111}
.rf-rv-faqbron{margin:.5em 0 0;font-size:.75rem;color:#888}
.rf-rv-faqbron a{color:#888}

/* --- concrete tas bij een vraag --- */
.rf-rv-product{display:flex;align-items:center;gap:.9em;margin:.9em 0 0;padding:.7em .9em;
	background:#fff;border:1px solid var(--rand);border-left:4px solid #b9cf38;border-radius:6px;
	text-decoration:none!important;color:inherit}
.rf-rv-product:hover{border-color:#b9cf38;background:#fafcf2}
.rf-rv-product img{width:56px;height:56px;object-fit:cover;border-radius:4px;flex:0 0 auto}
.rf-rv-product-tekst{display:flex;flex-direction:column;gap:.15em;min-width:0}
.rf-rv-product-tekst strong{font-size:.95rem;line-height:1.25}
.rf-rv-product-waarom{font-size:.8rem;color:#666;line-height:1.35}
.rf-rv-product-prijs{margin-left:auto;font-weight:700;white-space:nowrap;color:#111}
@media (max-width:520px){
	.rf-rv-product{flex-wrap:wrap}
	.rf-rv-product-prijs{margin-left:0;width:100%}
}

/* --- introtekst boven de kaart --- */
.rf-rv-intro{max-width:88ch;font-size:1.05rem;line-height:1.55;color:#444;margin:0 0 1.4em}

/* --- tabel met de Eurostat-cijfers op de methodologiepagina --- */
.rf-rv-tabel{width:100%;border-collapse:collapse;margin:.6em 0 1.2em;font-size:.92rem}
.rf-rv-tabel th,.rf-rv-tabel td{text-align:left;padding:.5em .7em;border-bottom:1px solid var(--rand)}
.rf-rv-tabel th{font-size:.78rem;text-transform:uppercase;letter-spacing:.04em;color:#666}
.rf-rv-tabel .rf-rv-getal{text-align:right;font-variant-numeric:tabular-nums;font-weight:600;white-space:nowrap}
.rf-rv-tabel tr:last-child td{border-bottom:0}