/* VM Reference – zobrazení referencí (mřížka / karusel). Sladěno s webem vit-masaze.cz. */
.vmref-block{ margin:32px 0; }
.vmref{ font-family: Roboto, Helvetica, Arial, sans-serif; color:#555; }
.vmref-block *{ box-sizing:border-box; }

/* --- patička: odkaz na všechny recenze na Googlu --- */
.vmref-foot{ text-align:center; margin-top:22px; }
.vmref-google-link{
	display:inline-flex; align-items:center; gap:9px;
	font-family:Roboto, Helvetica, Arial, sans-serif; font-weight:600; font-size:15px;
	color:#3c4043; text-decoration:none;
	background:#fff; border:1px solid #dadce0; border-radius:4px; padding:11px 22px;
	transition:box-shadow .15s, border-color .15s;
}
.vmref-google-link:hover{ border-color:#98B348; box-shadow:0 2px 8px rgba(40,45,20,.12); color:#3c4043; }
.vmref-google-link .vmref-google{ width:18px; height:18px; }

/* --- karta --- */
.vmref-card{
	background:#fff; border:1px solid #e7e6dd; border-radius:6px;
	padding:22px 22px 20px;
	box-shadow:0 1px 2px rgba(40,45,20,.04), 0 6px 18px rgba(40,45,20,.05);
}
.vmref-card__head{ display:flex; align-items:center; gap:12px; margin-bottom:12px; }
.vmref-avatar{
	flex:0 0 auto; width:46px; height:46px; border-radius:50%; overflow:hidden;
	display:inline-flex; align-items:center; justify-content:center;
	background:#98B348; color:#fff;
}
.vmref-avatar-img{ width:100%; height:100%; object-fit:cover; display:block; }
.vmref-avatar-fallback{ font-weight:700; font-size:18px; letter-spacing:.5px; }
.vmref-idn{ display:flex; flex-direction:column; line-height:1.3; min-width:0; flex:1; }
.vmref-name{ font-weight:700; color:#0c0c0c; font-size:16px; }
.vmref-date{ font-size:13px; color:#999; }
.vmref-google{ flex:0 0 auto; }
.vmref-stars{ font-size:17px; letter-spacing:2px; line-height:1; margin-bottom:11px; }
.vmref-star{ color:#dcdcd2; }
.vmref-star.is-on{ color:#F5B301; }
.vmref-text{ font-size:15px; line-height:1.65; }
.vmref-text p{ margin:0 0 .6em; }
.vmref-text p:last-child{ margin-bottom:0; }

/* --- mřížka (masonry přes CSS columns) --- */
.vmref-grid{ columns: var(--vmref-cols, 3); column-gap:24px; }
.vmref-grid .vmref-card{
	break-inside:avoid; -webkit-column-break-inside:avoid; page-break-inside:avoid;
	margin:0 0 24px; display:inline-block; width:100%;
}
@media (max-width:900px){ .vmref-grid{ columns:2; } }
@media (max-width:600px){ .vmref-grid{ columns:1; } }

/* --- karusel --- */
.vmref-carousel-wrap{ position:relative; }
.vmref-carousel{
	display:flex; gap:22px; overflow-x:auto; scroll-snap-type:x mandatory;
	-webkit-overflow-scrolling:touch; padding:4px 2px 16px; scrollbar-width:thin;
}
.vmref-carousel .vmref-card{ flex:0 0 auto; width:340px; max-width:82vw; scroll-snap-align:start; }
.vmref-nav{
	position:absolute; top:42%; transform:translateY(-50%); z-index:2;
	width:42px; height:42px; border-radius:50%; border:1px solid #e0e0d6;
	background:#fff; color:#98B348; font-size:26px; line-height:1; cursor:pointer;
	box-shadow:0 2px 8px rgba(0,0,0,.12); display:flex; align-items:center; justify-content:center;
	transition:background .15s, color .15s;
}
.vmref-nav:hover{ background:#98B348; color:#fff; border-color:#98B348; }
.vmref-nav--prev{ left:-14px; }
.vmref-nav--next{ right:-14px; }
@media (max-width:600px){ .vmref-nav{ display:none; } }

.vmref-empty{ color:#999; font-style:italic; }