/* Wappie – moderný vzhľad (načítava sa ako posledný štýl, prepisuje šablónu aj wappie.css).
   Menšie nadpisy, karty s jemným okrajom, ikony v zaoblených štvorcoch, čistý úvod bez dekorácií. */

/* ---------- písmo a nadpisy ---------- */
body {
	color: #565b73;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
h2 {
	font-size: 3rem;
	line-height: 1.25;
	letter-spacing: -.02em;
}
h3 {
	font-size: 1.8rem;
	line-height: 1.35;
	letter-spacing: -.01em;
	margin-bottom: 1rem;
}
p {
	margin-top: 1.2rem;
	line-height: 1.65;
}
.home_box h1 {
	font-size: 4.4rem;
	line-height: 1.15;
	letter-spacing: -.025em;
	font-weight: 700;
	margin-top: 1.8rem;
}
.home_box p {
	font-size: 1.7rem;
	max-width: 52rem;
}
.section_padd {
	padding: 5rem 0 8rem 0;
}

/* štítok nad nadpisom sekcie */
.wp_stitok {
	display: inline-block;
	margin-bottom: 1.4rem;
	padding: .5rem 1.4rem;
	border-radius: 3rem;
	background: #eef1ff;
	color: #1f54f3;
	font-size: 1.3rem;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
}

/* ---------- hlavička ---------- */
header {
	padding: 1.6rem 0;
}
header.sticky {
	background: rgba(255, 255, 255, .88);
	-webkit-backdrop-filter: saturate(180%) blur(14px);
	backdrop-filter: saturate(180%) blur(14px);
	box-shadow: 0 .1rem 0 rgba(39, 18, 115, .08);
}
#menu li a {
	font-size: 1.5rem;
	font-weight: 500;
}
.logo {
	max-width: 13.5rem;
}

/* ---------- tlačidlá ---------- */
.button {
	min-width: 0;
	height: 4.8rem;
	padding: 0 2.6rem;
	border-radius: 1.2rem;
	font-size: 1.5rem;
	font-weight: 600;
	box-shadow: 0 .8rem 2rem rgba(31, 84, 243, .22);
	transition: transform .2s, box-shadow .2s, filter .2s;
}
.button:hover {
	color: #fff;
	transform: translateY(-.2rem);
	box-shadow: 0 1.2rem 2.6rem rgba(31, 84, 243, .3);
	filter: brightness(1.05);
}
.wp_button_svetle,
.wp_button_svetle:hover {
	color: #1f54f3;
	box-shadow: inset 0 0 0 .15rem #cfd9ff;
	filter: none;
}
.home_box .button,
.getfe_second .button,
.wp_kontakt_btn .button,
.wp_form .button,
.wp_form_done .button {
	padding-left: 2.6rem;
	padding-right: 2.6rem;
}
.watch_btn {
	font-size: 1.5rem;
	color: #1f54f3;
}

/* ---------- úvod ---------- */
.home_wrapper {
	background-image: radial-gradient(60rem 40rem at 85% 10%, rgba(161, 87, 231, .13), transparent 70%),
		radial-gradient(50rem 36rem at 5% 90%, rgba(31, 84, 243, .10), transparent 70%),
		linear-gradient(180deg, #f7f8ff 0%, #fff 100%) !important;
	padding-top: 13rem;
	padding-bottom: 7rem;
}
.home_shape {
	display: none;
}
.homefirst_txt {
	background: #fff;
	border: .1rem solid #e6e9f5;
	border-radius: 3rem;
	box-shadow: 0 .4rem 1.4rem rgba(39, 18, 115, .06);
}
.homefirst_txt span {
	background: linear-gradient(135deg, #a157e7, #1f54f3);
	padding: .8rem;
	font-size: 100%;
	margin: .3rem;
	border-radius: 50%;
}
.homefirst_txt p {
	font-size: 1.4rem;
	padding: 0 1.8rem 0 .8rem;
}

/* pás s oblasťami */
.client_wrapper.section_padd {
	padding: 3rem 0 5rem;
}
.client_head p {
	font-size: 1.7rem;
	margin-bottom: 3rem;
}
.wp_chips span {
	background: #fff;
	border: .1rem solid #e6e9f5;
	font-size: 1.4rem;
	padding: .9rem 1.8rem;
}

/* ---------- pás „Vedeli ste?“ ---------- */
.wp_vedeli {
	padding: 0 0 2rem;
}
.wp_vedeli_box {
	position: relative;
	display: flex;
	align-items: center;
	gap: 4rem;
	padding: 4rem 5rem;
	border-radius: 2.4rem;
	background: linear-gradient(120deg, #271273 0%, #1f54f3 70%, #7a56ec 100%);
	color: #dfe5ff;
	overflow: hidden;
}
.wp_vedeli_box::after {
	content: "";
	position: absolute;
	right: -8rem;
	top: -10rem;
	width: 32rem;
	height: 32rem;
	border-radius: 50%;
	background: rgba(255, 255, 255, .07);
}
.wp_vedeli_cislo {
	position: relative;
	z-index: 1;
	flex: none;
	width: 15rem;
	height: 15rem;
	border-radius: 2.4rem;
	background: rgba(255, 255, 255, .12);
	border: .1rem solid rgba(255, 255, 255, .25);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	color: #fff;
	line-height: 1;
}
.wp_vedeli_cislo strong {
	font-size: 7rem;
	font-weight: 700;
	letter-spacing: -.04em;
}
.wp_vedeli_cislo span {
	font-size: 1.8rem;
	font-weight: 600;
	margin-top: .4rem;
}
.wp_vedeli_text {
	position: relative;
	z-index: 1;
	flex: 1;
}
.wp_vedeli_text small {
	display: block;
	font-size: 1.3rem;
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: #c9d4ff;
	margin-bottom: .8rem;
}
.wp_vedeli_text h2 {
	color: #fff;
	font-size: 2.6rem;
}
.wp_vedeli_text p {
	margin-top: 1rem;
	max-width: 62rem;
}
.wp_vedeli_box .button {
	position: relative;
	z-index: 1;
	flex: none;
	background: #fff;
	color: #1f54f3;
	box-shadow: 0 1rem 2.4rem rgba(9, 5, 40, .3);
	white-space: nowrap;
}
.wp_vedeli_box .button:hover {
	color: #1f54f3;
}

/* ---------- ikony v zaoblených štvorcoch ---------- */
.appimg_bg {
	width: 6.4rem;
	min-width: 6.4rem;
	height: 6.4rem;
	padding: 0;
	border-radius: 1.8rem;
}
.appimg_bg > span,
.appimg_bg > i {
	font-size: 2.6rem;
}
.app_item {
	margin-bottom: 3.6rem;
}
.app_subitem {
	margin-left: 2.2rem;
}
.appfeature_head p {
	margin-bottom: 4rem;
}
.default_color1 h3,
.default_color2 h3,
.default_color3 h3 {
	color: #271273;
}

/* ---------- karty ---------- */
.chooseapp_item,
.smartjack_wrapper .smartjact_item,
.ultimatefe_wrapper .smartjact_item {
	height: 100%;
	padding: 3rem 2.6rem;
	border: .1rem solid #e9ecf6;
	border-radius: 1.8rem;
	background: #fff;
	text-align: left;
	transition: transform .25s, box-shadow .25s, border-color .25s;
}
.chooseapp_item:hover,
.smartjack_wrapper .smartjact_item:hover,
.ultimatefe_wrapper .smartjact_item:hover {
	transform: translateY(-.4rem);
	border-color: #cfd9ff;
	box-shadow: 0 1.6rem 4rem rgba(39, 18, 115, .09);
}
.chooseapp_item .appimg_bg {
	margin: 0;
}
.chooseapp_item h3 {
	margin-top: 2rem;
}
.chooseapp_item p,
.smartjact_item p,
.app_subitem p {
	margin: 0;
	max-width: none;
	font-size: 1.5rem;
}
.chooseourapp_wrapper .mt_40,
.wp_eshop .mt_40 {
	margin-top: 3rem;
}
.smartjact_item {
	margin-top: 3rem;
}
.smartjact_item .mb_30 {
	margin-bottom: 2rem;
}
.ultimatefe_wrapper .row .row > div,
.smartjack_wrapper .row > div {
	display: flex;
	flex-direction: column;
}
.chooseourapp_head p,
.getfe_head p,
.frequently_head p {
	padding-bottom: 1rem;
}
.smartjack_subhead p {
	height: auto;
	min-height: 9rem;
	border-left: .2rem solid #e3e7f7;
	padding-left: 3rem;
}
.wp_eshop {
	background: #fafbff;
}

/* postup */
.getfe_item {
	border: .1rem solid #e9ecf6;
	border-radius: 1.8rem;
	box-shadow: none;
	transition: transform .25s, box-shadow .25s;
}
.getfe_item:hover {
	transform: translateY(-.4rem);
	box-shadow: 0 1.6rem 4rem rgba(39, 18, 115, .09);
}
.getfe_border {
	border: .2rem solid #1f54f3;
}
.getfe_txt {
	background: #f7f8ff;
	padding: 3.2rem 2rem;
}
.getfe_txt h2 {
	font-size: 4.6rem;
}
.getfe_txt h3 {
	font-size: 1.9rem;
}
.getfe_second {
	padding: 3rem 2.5rem 3.4rem;
}
.getfe_second ul li {
	margin-bottom: 1.1rem;
	font-size: 1.5rem;
}

/* napojenia */
.wp_api > div {
	border: .1rem solid #e9ecf6;
	border-radius: 1.6rem;
	box-shadow: none;
	transition: transform .25s, box-shadow .25s;
}
.wp_api > div:hover {
	transform: translateY(-.3rem);
	box-shadow: 0 1.4rem 3.4rem rgba(39, 18, 115, .09);
}
.wp_api strong {
	font-size: 1.7rem;
}

/* ukážka dopytu */
.wd_krok {
	border-radius: 1.4rem;
	padding: 1.3rem 1.8rem;
}
.wd_txt strong {
	font-size: 1.5rem;
}

/* z praxe */
.friendcustomize_box h3 {
	font-size: 1.9rem;
}
.wp_ico {
	border-radius: 1.4rem;
}

/* otázky */
.accordion .card {
	background: #fff;
	border: .1rem solid #e9ecf6 !important;
	border-radius: 1.4rem !important;
	overflow: hidden;
	transition: border-color .2s, box-shadow .2s;
}
.accordion .card:hover {
	border-color: #cfd9ff !important;
}
.accordion .card button {
	font-size: 1.7rem;
	padding: 2rem 5.5rem 2rem 2.4rem;
}
.accordion .card-body {
	padding: 0 2.4rem 2.2rem;
	font-size: 1.5rem;
}
.accordion button::before,
.accordion button[aria-expanded="true"]::before {
	color: #1f54f3;
	font-weight: 500;
}

/* kontakt */
.download_wrapper {
	background: linear-gradient(180deg, #f7f8ff 0%, #fff 100%);
}
.wp_kontakt a {
	font-size: 2rem;
}
.wp_kontakt .appimg_bg {
	width: 5.6rem;
	min-width: 5.6rem;
	height: 5.6rem;
	border-radius: 1.6rem;
}

/* okná */
.wp_okno .modal-title {
	font-size: 2.4rem;
}
.wp_form legend {
	font-size: 1.6rem;
}

/* podstránky */
.wp_text h1 {
	font-size: 3.4rem;
	letter-spacing: -.02em;
}
.wp_text h2 {
	font-size: 2.1rem;
	margin-top: 4rem;
}

/* ---------- menšie obrazovky ---------- */
@media (max-width: 1199.98px) {
	.home_box h1 { font-size: 3.9rem; }
	#menu li a { font-size: 1.4rem; padding: 0 .7rem; }
}
@media (max-width: 991.98px) {
	.section_padd { padding: 2.5rem 0 5.5rem 0; }
	.home_wrapper { padding-top: 10rem; }
	#menu li a { font-size: 1.9rem; }
	.wp_vedeli_box { flex-direction: column; text-align: center; padding: 3.5rem 3rem; gap: 2.4rem; }
	.wp_vedeli_text p { margin-left: auto; margin-right: auto; }
	.smartjack_subhead p { border-left: none; padding-left: 0; min-height: 0; }
}
@media (max-width: 767.98px) {
	.chooseapp_item,
	.smartjack_wrapper .smartjact_item,
	.ultimatefe_wrapper .smartjact_item { padding: 2.4rem 2rem; }
}
@media (max-width: 575.98px) {
	h2 { font-size: 2.6rem; }
	.home_box h1 { font-size: 3.3rem; line-height: 1.2; }
	.home_box p { font-size: 1.6rem; }
	.wp_vedeli_text h2 { font-size: 2.2rem; }
	.wp_vedeli_cislo { width: 12rem; height: 12rem; }
	.wp_vedeli_cislo strong { font-size: 5.6rem; }
	.appimg_bg { margin-left: 0; margin-right: 0; margin-bottom: 0; }
	.app_item .appimg_bg { margin-bottom: 0; }
	.smartjact_item { text-align: left; }
	.designbuild_box, .ultimate_box, .meet_head, .smartjack_head { text-align: left; }
	.button { height: 4.8rem; width: auto; font-size: 1.5rem; }
	.accordion .card button { font-size: 1.6rem; padding: 1.7rem 4.6rem 1.7rem 1.8rem; }
	.accordion .card-body { padding: 0 1.8rem 1.8rem; }
}

/* Obrázky sekcií Katalóg, Z praxe a Kontakt: šablóna ich ukotvuje k okraju okna, na širokých
   obrazovkách tak utekajú od textu. Tu sú bežnými stĺpcami mriežky vedľa textu. */
.ultimate_ab,
.meetimg_ab,
.download_ab {
	position: static;
	top: auto;
	right: auto;
	bottom: auto;
	left: auto;
	transform: none;
}
.ultimate_image,
.meetclient_img,
.download_img {
	text-align: center;
}
.ultimate_image img {
	width: 100%;
	max-width: 52rem;
}
.meetclient_img img {
	width: 100%;
	max-width: 46rem;
}
.download_wrapper .row {
	align-items: center;
}
.meetclient_box {
	padding-left: 2rem;
}
@media (max-width: 991.98px) {
	.meetclient_box { padding-left: 0; }
	.ultimate_ab { margin-left: auto; margin-right: auto; }
}

/* ---------- široké rozloženie a úvod na celú obrazovku (ako net-media.sk) ---------- */
@media (min-width: 1400px) {
	.container { max-width: 1320px; }
}
@media (min-width: 1700px) {
	.container { max-width: 1480px; }
	html { font-size: 66%; }
}

/* dve logá v hlavičke: biele nad farebným úvodom, farebné po posunutí a na podstránkach */
.wp_logo_farebne { display: none; }
header.sticky .wp_logo_biele,
.wp_uvodna.wp_menu_otvorene .wp_logo_biele { display: none; }
header.sticky .wp_logo_farebne,
.wp_uvodna.wp_menu_otvorene .wp_logo_farebne { display: block; }

.wp_uvodna .home_wrapper {
	min-height: 100vh;
	display: flex;
	align-items: center;
	padding-top: 11rem;
	padding-bottom: 9rem;
	background-image: radial-gradient(70rem 50rem at 88% 12%, rgba(255, 255, 255, .16), transparent 70%),
		radial-gradient(60rem 46rem at 0% 100%, rgba(39, 18, 115, .35), transparent 70%),
		linear-gradient(180deg, #a157e7 0%, #6a55ec 45%, #1f54f3 100%) !important;
}
.wp_uvodna .home_wrapper > .container { position: relative; z-index: 1; }
.wp_uvodna .home_wrapper::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: -.1rem;
	height: 7rem;
	background: #fff;
	-webkit-clip-path: ellipse(60% 100% at 50% 100%);
	clip-path: ellipse(60% 100% at 50% 100%);
}
.wp_uvodna .home_box h1 {
	color: #fff;
	font-size: 5rem;
}
.wp_uvodna .home_box p {
	color: rgba(255, 255, 255, .88);
	max-width: 56rem;
}
.wp_uvodna .homefirst_txt {
	background: rgba(255, 255, 255, .14);
	border-color: rgba(255, 255, 255, .28);
	box-shadow: none;
}
.wp_uvodna .homefirst_txt p { color: #fff; }
.wp_uvodna .homefirst_txt span { background: #fff; color: #1f54f3; }
.wp_uvodna .home_box .button {
	background: #fff;
	color: #1f54f3;
	box-shadow: 0 1.2rem 3rem rgba(23, 11, 71, .28);
}
.wp_uvodna .home_box .button:hover { color: #1f54f3; }
.wp_uvodna .watch_btn,
.wp_uvodna .watch_btn:hover { color: #fff; }
.wp_uvodna .wp_hero img {
	max-width: 88rem;
	filter: drop-shadow(0 3rem 5rem rgba(23, 11, 71, .35));
}

/* hlavička nad úvodom: biele odkazy, po posunutí tmavé */
.wp_uvodna header:not(.sticky) #menu li a { color: #fff; }
.wp_uvodna header:not(.sticky) #menu > li > a.active,
.wp_uvodna header:not(.sticky) #menu > li > a:hover { color: #fff; opacity: .75; }
.wp_uvodna header:not(.sticky) .try_btn .button {
	background: rgba(255, 255, 255, .16);
	box-shadow: inset 0 0 0 .15rem rgba(255, 255, 255, .6);
	color: #fff;
}
.wp_uvodna header:not(.sticky) .hamburger-menu span { background: #fff; }

@media (min-width: 992px) {
	.wp_uvodna .home_wrapper .row > .col-lg-6:first-child { flex: 0 0 46%; max-width: 46%; }
	.wp_uvodna .home_wrapper .row > .col-lg-6:last-child { flex: 0 0 54%; max-width: 54%; }
}
@media (max-width: 1199.98px) {
	.wp_uvodna .home_box h1 { font-size: 4.2rem; }
}
@media (max-width: 991.98px) {
	.wp_uvodna .home_wrapper { min-height: 0; display: block; padding-top: 11rem; padding-bottom: 8rem; }
	/* otvorené mobilné menu je biely panel – odkazy a ikona musia byť tmavé */
	.wp_uvodna header #menu li a,
	.wp_uvodna header:not(.sticky) #menu li a { color: #271273; opacity: 1; }
	.wp_uvodna.wp_menu_otvorene header:not(.sticky) .hamburger-menu span { background: #1f54f3; }
}
@media (max-width: 575.98px) {
	.wp_uvodna .home_box h1 { font-size: 3.4rem; }
	.wp_uvodna .home_wrapper::after { height: 3.5rem; }
}

/* lišta cookies so súhlasom */
.wp_cookies_btn {
	display: flex;
	gap: 1rem;
	flex: none;
}
.wp_cookies .button {
	min-width: 0;
	white-space: nowrap;
	box-shadow: none;
}
.wp_cookies .wp_button_svetle,
.wp_cookies .wp_button_svetle:hover {
	background: transparent;
	color: #fff;
	box-shadow: inset 0 0 0 .15rem rgba(255, 255, 255, .45);
}
@media (max-width: 575.98px) {
	.wp_cookies_btn { width: 100%; justify-content: center; flex-wrap: wrap; }
}
.wp_text a.button,
.wp_text a.button:hover {
	color: #fff;
}