/* RANKO Ads — affichage côté visiteur. */

.rk-slot {
	text-align: center;
	margin: 18px auto;
	max-width: 100%;
}
.rk-slot-header { margin-top: 0; }
.rk-link {
	display: inline-block;
	line-height: 0;
	max-width: 100%;
}
.rk-img {
	max-width: 100%;
	height: auto;
	display: inline-block;
}

/* ---- Pop-up ---- */
.rk-pop { position: fixed; z-index: 99995; }
.rk-pop[hidden] { display: none; }
.rk-pop-inner { position: relative; max-width: calc( 100vw - 28px ); }
.rk-pop-inner .rk-slot { margin: 0; }
.rk-pop .rk-img { width: 100%; height: auto; display: block; }

/* Position */
.rk-pop-pos-center {
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba( 0, 0, 0, 0.55 );
	animation: rk-fade 0.2s ease;
}
.rk-pop-pos-bottom-right { bottom: 22px; right: 22px; }
.rk-pop-pos-bottom-left  { bottom: 22px; left: 22px; }

/* Effet d'apparition du pop-up */
.rk-pop-fx-fade .rk-pop-inner   { animation: rk-fade 0.3s ease; }
.rk-pop-fx-slide .rk-pop-inner  { animation: rk-fx-slide 0.4s cubic-bezier( .22, 1, .36, 1 ); }
.rk-pop-fx-zoom .rk-pop-inner   { animation: rk-fx-zoom 0.35s ease; }
.rk-pop-fx-bounce .rk-pop-inner { animation: rk-fx-bounce 0.6s cubic-bezier( .28, .84, .42, 1 ); }
/* Mouvement régulier pour attirer l'attention */
.rk-pop .rk-slot.rk-nudge { animation: rk-nudge 0.7s ease; }

/* Taille */
.rk-pop-sz-sm .rk-pop-inner { width: 320px; }
.rk-pop-sz-md .rk-pop-inner { width: 460px; }
.rk-pop-sz-lg .rk-pop-inner { width: 620px; }

/* Style « classic » : image seule */
.rk-pop-st-classic .rk-pop-inner {
	border-radius: 6px;
	overflow: hidden;
	box-shadow: 0 14px 44px rgba( 0, 0, 0, 0.42 );
}
/* Style « card » : cadre blanc avec liseré couleur */
.rk-pop-st-card .rk-pop-inner {
	background: #fff;
	border-radius: 14px;
	padding: 14px;
	border-top: 4px solid var( --rkc, #2271b1 );
	box-shadow: 0 16px 48px rgba( 0, 0, 0, 0.38 );
}
.rk-pop-st-card .rk-img { border-radius: 8px; }
/* Style « frame » : bordure couleur */
.rk-pop-st-frame .rk-pop-inner {
	border: 5px solid var( --rkc, #2271b1 );
	border-radius: 10px;
	overflow: hidden;
	box-shadow: 0 14px 44px rgba( 0, 0, 0, 0.42 );
}

/* Bouton fermer */
.rk-pop-x {
	position: absolute;
	top: -12px;
	right: -12px;
	width: 30px;
	height: 30px;
	border: 0;
	border-radius: 50%;
	background: #fff;
	color: #222;
	font-size: 19px;
	line-height: 1;
	cursor: pointer;
	box-shadow: 0 2px 8px rgba( 0, 0, 0, 0.3 );
	z-index: 2;
}
.rk-pop-st-card .rk-pop-x {
	top: 8px;
	right: 8px;
	box-shadow: none;
	background: rgba( 0, 0, 0, 0.08 );
}

@keyframes rk-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes rk-fx-slide { from { opacity: 0; transform: translateY( 40px ); } to { opacity: 1; transform: none; } }
@keyframes rk-fx-zoom { from { opacity: 0; transform: scale( 0.8 ); } to { opacity: 1; transform: scale( 1 ); } }
@keyframes rk-fx-bounce {
	0% { opacity: 0; transform: translateY( 60px ); }
	60% { opacity: 1; transform: translateY( -12px ); }
	80% { transform: translateY( 5px ); }
	100% { transform: translateY( 0 ); }
}
@keyframes rk-nudge {
	0%, 100% { transform: translateY( 0 ) rotate( 0deg ); }
	25% { transform: translateY( -9px ) rotate( -2deg ); }
	50% { transform: translateY( 0 ) rotate( 2deg ); }
	75% { transform: translateY( -4px ) rotate( -1deg ); }
}

/* Responsive */
@media ( max-width: 600px ) {
	.rk-pop-sz-sm .rk-pop-inner,
	.rk-pop-sz-md .rk-pop-inner,
	.rk-pop-sz-lg .rk-pop-inner { width: calc( 100vw - 28px ); }
	.rk-pop-pos-bottom-right,
	.rk-pop-pos-bottom-left { left: 14px; right: 14px; bottom: 14px; }
}