/* HLAVNE */
:root { --bs-main-rgb: 248, 128, 3; --bs-scnd-rgb: 0, 80, 155; --review-avatar-size: 48px; }
html { scroll-behavior: smooth; scroll-padding-top: 60px; }

/* FARBY POZADIA, BTN A TEXTOV */
.bg-main { background-color: rgba(var(--bs-main-rgb), var(--bs-bg-opacity)); color: white; }
.bg-scnd { background-color: rgba(var(--bs-scnd-rgb), var(--bs-bg-opacity)); color: white; }
.btn-main, .btn-outline-main:focus, .btn-outline-main:hover { background-color: rgb(var(--bs-main-rgb)); color: white; }
.btn-main:focus, .btn-main:hover { background-color: rgba(var(--bs-main-rgb), 0.9); color: white; }
.btn-outline-main { border-color: rgb(var(--bs-main-rgb)); color: rgb(var(--bs-main-rgb)); }
.btn-outline-scnd { border-color: rgb(var(--bs-scnd-rgb)); color: rgb(var(--bs-scnd-rgb)); }
.btn-scnd, .btn-outline-scnd:focus, .btn-outline-scnd:hover { background-color: rgb(var(--bs-scnd-rgb)); color: white; }
.btn-scnd:focus, .btn-scnd:hover { background-color: rgba(var(--bs-scnd-rgb), 0.9); color: white; }
.link-main, .text-main { color: rgba(var(--bs-main-rgb), var(--bs-text-opacity)); }
.link-scnd, .text-scnd { color: rgba(var(--bs-scnd-rgb), var(--bs-text-opacity)); }

/* OBRAZKOVE POZADIA */
.bg-hero { background: url('/content/images/background-hero.jpg?v=0.0') top/cover no-repeat; position: relative; }
.bg-img { background: url("/content/images/background.jpg") top/cover no-repeat; }
.bg-img-light { background: url("/content/images/background-light.jpg") top/cover no-repeat; }

/* RECAPTCHA */
.grecaptcha-badge { visibility: hidden; }

/* RECENZIE */
.review-avatar { align-items: center; border-radius: 50%; display: inline-flex; font-weight: 700; height: var(--review-avatar-size); justify-content: center; line-height: 1; text-transform: uppercase; width: var(--review-avatar-size); }

/* ZNACKY CAROUSEL */
.brand-logos img { filter: grayscale(100%); opacity: .5; }
.brand-logos img:hover { filter: grayscale(0%); opacity: 1;}

/* ANIMACIE */
@keyframes fadeIn {
	0% { opacity: 0; transform: translateY(20px); }
	100% { opacity: 1; transform: translateY(0); }
}

@keyframes fadeInLeft {
	0% { opacity: 0; transform: translateX(-20px); }
	100% { opacity: 1; transform: translateX(0); }
}

@keyframes flipIn {
	0% { opacity: 0; transform: perspective(600px) rotateY(90deg); }
	100% { opacity: 1; transform: perspective(600px) rotateY(0); }
}

@keyframes pulse {
	0% { transform: scale(1); }
	50% { transform: scale(1.15); }
	100% { transform: scale(1); }
}

@keyframes rotateIn {
  0% { opacity: 0; transform: rotate(-15deg); }
  100% { opacity: 1; transform: rotate(0); }
}

@keyframes slideDown {
	0% { opacity: 0; transform: translateY(-20px); }
	100% { opacity: 1; transform: translateY(0); }
}

@keyframes slideInLeft {
	0% { opacity: 0; transform: translateX(-40px); }
	100% { opacity: 1; transform: translateX(0); }
}

@keyframes slideUp {
	0% { opacity: 0; transform: translateY(40px); }
	100% { opacity: 1; transform: translateY(0); }
}

@keyframes zoomIn {
	0% { opacity: 0; transform: scale(0.8); }
	100% { opacity: 1; transform: scale(1); }
}

.animate { animation-fill-mode: forwards; animation-play-state: paused; opacity: 0; transform-origin: center center; }
.animate-delay-1 { animation-delay: 0.25s; }
.animate-delay-2 { animation-delay: 0.5s; }
.animate-delay-3 { animation-delay: 0.75s; }
.animate-delay-4 { animation-delay: 1s; }
.fade-in { animation-duration: 0.75s; animation-name: fadeIn; }
.fade-in-left { animation-duration: 1s; animation-name: fadeInLeft; }
.flip-in { animation-duration: 1s; animation-name: flipIn; }
.pulse-icon { animation: pulse 2s infinite; display: inline-block; }
.rotate-in { animation-duration: 0.75s; animation-name: rotateIn; }
.slide-down { animation-duration: 0.75s; animation-name: slideDown; }
.slide-in-left { animation-duration: 0.75s; animation-name: slideInLeft; }
.slide-up { animation-duration: 0.75s; animation-name: slideUp; }
.zoom-in { animation-duration: 0.75s; animation-name: zoomIn; }