/*
@font-face {
	font-family: 'VelaSans';
	src: url('fonts/VelaSans.ttf')  format('truetype');
}
*/
:root {
	--light: #FFFFFF;
	--gray: #E9EEF8;
	--dark: #081D47;
	--black: #000000;
	--blue: #1838ED;
	--mint: #00D0FF;
	--hover: rgb(184, 186, 255);
	--red: #E71717;
	--green: #436545;
	--softred: #FBE9E9;
	--softgreen: #D7F8D9;
}

:root, body {font-size: 10px;}

@media screen and (min-width: 576px) {
	:root, body {font-size: 12px;}
}
@media screen and (min-width: 768px) {
	:root, body {font-size: 12px;}
}
@media screen and (min-width: 992px) {
	:root, body {font-size: 14px;}
}
@media screen and (min-width: 1200px) {
	:root, body {font-size: 16px;}
}

/* Элементы */
html {width: calc(100% + calc(100vw - 100%)); overflow-x: hidden;}
body {display: flex; flex-direction: column; margin: 0 auto; max-width: 1920px; font-family: 'Arial', sans-serif; color: var(--dark); outline: 1px solid var(--dark); background-color: var(--light); overflow-x: hidden;}
#middle main  {overflow: inherit;}
*::before {pointer-events: none;}
@media (min-width: 1680px) {.container {max-width: 1296px;}}
@media (min-width: 1920px) {.bg-color::before {margin-left: -50vw;}}

h1, .h1 {font-size: 4rem;}
h2, .h2 {font-size: 2.25rem;}
h3, .h3 {font-size: 2rem;}
h4, .h4 {font-size: 1.5rem;}
h5, .h5 {font-size: 1.25rem;}
h6, .h6 {font-size: 1rem;}

a {text-decoration: none; color:var(--dark);}
a:hover {color: var(--blue);}

/* Общие классы */

::-webkit-scrollbar {width: .65rem;}
::-webkit-scrollbar-track {background: transparent; border-radius: 2rem;}
::-webkit-scrollbar-thumb {background-color: var(--blue); border-radius: 2rem; border: 0.125rem solid var(--light);}

.moduletable {position: relative;}

.z-b {z-index: -1;}

.full-img {position: absolute;max-width: 1920px;width: 100vw;transform: translate(-50%, -50%);z-index: -2;}

.swiper-button-next, .swiper-button-prev {position: static!important; margin-top: 0!important; width: 2.75rem;}
.swiper-button-next:after, .swiper-button-prev:after {display: none;}

.text-last {text-align-last: end;}
.text-truncate {display: -webkit-box;-webkit-line-clamp: 7;-webkit-box-orient: vertical;overflow: hidden;text-overflow: ellipsis;word-break: break-word;white-space: normal;}

.emblem {height: 4rem; width: 4rem;}

.nav-item.divider {margin-bottom: .5rem !important;}

/* Переопределения Bootstrap */

.btn {--bs-btn-border-width: 1px;}
.btn-light {--bs-btn-color: #000;--bs-btn-bg: #f8f9fa;--bs-btn-border-color: transparent;--bs-btn-hover-color: var(--light);--bs-btn-hover-bg: var(--blue);--bs-btn-hover-border-color: transparent;--bs-btn-focus-shadow-rgb: 211, 212, 213;--bs-btn-active-color: #000;--bs-btn-active-bg: #c6c7c8;--bs-btn-active-border-color: transparent;--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color: #000;--bs-btn-disabled-bg: #f8f9fa;--bs-btn-disabled-border-color: transparent;}
.btn-primary {--bs-btn-color: #fff;--bs-btn-bg: var(--blue);--bs-btn-border-color: transparent;--bs-btn-hover-color: #fff;--bs-btn-hover-bg: #001CBF;--bs-btn-hover-border-color: transparent;--bs-btn-focus-shadow-rgb: unset;--bs-btn-active-color: #fff;--bs-btn-active-bg: #001CBF;--bs-btn-active-border-color: transparent;--bs-btn-active-shadow: inset 0 15px 30px rgb(184, 186, 255);--bs-btn-disabled-color: #fff;--bs-btn-disabled-bg: var(--blue);--bs-btn-disabled-border-color: transparent;}
.btn-dark {--bs-btn-color: var(--light);--bs-btn-bg: var(--black);--bs-btn-border-color: transparent;--bs-btn-hover-color: var(--light);--bs-btn-hover-bg: var(--blue);--bs-btn-hover-border-color: transparent;--bs-btn-focus-shadow-rgb: 255, 255, 255;--bs-btn-active-color: var(--light);--bs-btn-active-bg: var(--blue);--bs-btn-active-border-color: transparent;--bs-btn-active-shadow: inset 0 3px 5px rgba(255, 255, 255, 1);;--bs-btn-disabled-color: var(--light);--bs-btn-disabled-bg: var(--black);--bs-btn-disabled-border-color: transparent;}

.form-control:focus {color: var(--bs-body-color);background-color: var(--bs-body-bg);border-color: var(--bs-border-color);outline: 0;box-shadow: unset;}
.form-check-input:checked {background-color: var(--black);border-color: var(--black);}
.form-check-input[type=checkbox] {border-radius: 0em;}
.form-check-input:focus {border-color: var(--bs-border-color);outline: 0;box-shadow: unset;}

.accordion-button::after {width: 20px;height: 20px;background-image: url(/images/icons/arrow.svg);transition: all .1s linear; background-position: center;}
.accordion-button:not(.collapsed)::after {background-image: url(/images/icons/arrow.svg);transform: scaleY(-1);}

.modal-header {border-bottom: none;}

.text-primary {color: var(--blue)!important;}
.text-danger {color: var(--red)!important;}
.text-success {color: var(--green)!important;}

.bg-light {background-color: var(--light) !important;}
.bg-primary {background-color: var(--blue) !important;}
.bg-secondary {background-color: var(--gray) !important;}
.bg-danger {background-color: var(--softred) !important;}
.bg-success {background-color: var(--softgreen) !important;}

.p-4 {padding: 2rem !important;}

/* Шапка */

header li {padding-left: 0rem;margin-bottom: 0rem;}
header li::before {display: none;}
header .mod-menu .separator {display: none;}

/* Подвал */

footer li {padding-left: 0rem;margin-bottom: 0rem;}
footer li::before {display: none;}
footer .mod-menu-footer .nav-item.item-101 {display: none;}

/* БАННЕР */

.mod-banner .banner-content {height: 30rem;}

/* ПУКТЫ МЕНЮ */

.mod-points .point-item {min-height: 18rem;}
.mod-points .point-item .img-wrap img {filter: opacity(1);}
.mod-points .point-item:hover {background-color: var(--blue)!important; color: var(--light)!important; transition: all .2s ease-in-out;}
.mod-points .point-item:hover .img-wrap img {filter: opacity(.3); transition: all .2s ease-in-out;}

.mod-points.osago-points .col-12:nth-child(1) .point-item {background-color: var(--blue)!important; color: var(--light)!important; transition: all .2s ease-in-out;}
.mod-points.osago-points .col-12:nth-child(1) .point-item .img-wrap img {filter: opacity(.3); transition: all .2s ease-in-out;}

/* Почему именно мы */

.mod-why .why-title:hover {-webkit-box-shadow: 0 1rem 2rem 0 rgb(184, 186, 255);-moz-box-shadow: 0 1rem 2rem 0 rgb(184, 186, 255);box-shadow: 0 1rem 2rem 0 rgb(184, 186, 255);transition: all .2s ease-in-out;}

/* QR */

.mod-qr .qr-content::after {content: "";position: absolute;left: -10%;bottom: -30%;width: 30rem;transform: rotate(-10deg);height: 30rem;background: var(--mint);opacity: 1;border-radius: 100%;pointer-events: none;z-index: 0;filter: blur(8rem);}
.mod-qr .qr-content::before {content: "";position: absolute;left: 50%;top: -50%;width: 40rem;transform: rotate(-10deg);height: 30rem;background: var(--mint);opacity: 1;border-radius: 100%;pointer-events: none;z-index: 0;filter: blur(8rem);}

/* FOS */

.mod-fos .img-wrap img {transform: translateX(-50%);}

/* Почему нужно оформить КАСКО */ 

.mod-casco .casco-item {perspective: 150rem;}
.mod-casco .casco-item .casco-item-outer {backface-visibility: hidden;transition: transform 0.6s; display: block;}
.mod-casco .casco-item .casco-item-inner {min-height: 100%;backface-visibility: hidden;transform: rotateY(180deg);transition: transform 0.5s;}
.mod-casco .casco-item .casco-item-inner .casco-content {overflow-y: scroll;}
.mod-casco .casco-item .casco-item-inner ::-webkit-scrollbar {width: .35rem;}
.mod-casco .casco-item .casco-item-inner ::-webkit-scrollbar-track {background: transparent;}
.mod-casco .casco-item .casco-item-inner ::-webkit-scrollbar-thumb {background-color: var(--softgreen); border-radius: 2rem; border: unset;}
.mod-casco .casco-item:hover .casco-item-outer {transform: rotateY(180deg);}
.mod-casco .casco-item:hover .casco-item-inner {transform: rotateY(0);}

/* Почему важно застраховать ИФЛ */ 

.mod-ifl .ifl-main-item {min-height: 25rem;}
.mod-ifl .ifl-item {min-height: 18rem;}
.mod-ifl .ifl-main-item .img-wrap {width: 115%; z-index: -1;}
.mod-ifl .ifl-item .img-wrap {height: 85%; right: -15%;}
/* Контейнер */
.form-pageIfi {display: none;}
.form-pageIfi.active {display: block;}

/* Форма */
.formGroupIfl{display: flex; flex-direction: column; margin-bottom: 1rem;}
.sendformbutt { display: inline-block; font-weight: 600; line-height: 1.5; color: #fff; text-align: center; cursor: pointer; background-color: #0d6efd; border: 1px solid #0d6efd; padding: 0.75rem 1.5rem; font-size: 1rem; border-radius: 1rem; transition: 0.15s; }
.sendformbutt:active {background-color: #0a58ca; border-color: #0a53be;}

/* Блок компаний */
#companies-list {margin-top: 2rem;}
#companies-container div {border: 1px solid #ccc; border-radius: 5px; margin: 10px 0; padding: 10px;}
#companies-container a {text-decoration: underline; color: #0d6efd;}
/* Ошибочные утверждения */

.mod-mistakes .mis-item {perspective: 150rem;}
.mod-mistakes .mis-item .mis-item-outer {backface-visibility: hidden;transition: transform 0.6s; display: block;}
.mod-mistakes .mis-item .mis-item-inner {min-height: 100%;backface-visibility: hidden;transform: rotateY(180deg);transition: transform 0.5s;}
.mod-mistakes .mis-item .mis-item-inner .mis-content {overflow-y: scroll;}
.mod-mistakes .mis-item .mis-item-inner ::-webkit-scrollbar {width: .35rem;}
.mod-mistakes .mis-item .mis-item-inner ::-webkit-scrollbar-track {background: transparent;}
.mod-mistakes .mis-item .mis-item-inner ::-webkit-scrollbar-thumb {background-color: var(--softgreen); border-radius: 2rem; border: unset;}
.mod-mistakes .mis-item:hover .mis-item-outer {transform: rotateY(180deg);}
.mod-mistakes .mis-item:hover .mis-item-inner {transform: rotateY(0);}

/* Риски покупки дешевого страхового полиса */

.mod-osago .osago-main-item {min-height: 25rem;}
.mod-osago .osago-card {min-height: 18rem;}
.mod-osago .osago-main-item .img-wrap {width: 115%; z-index: -1;}
.mod-osago .osago-main-item .img-wrap img {object-position: top;}

/* Рекомендуем также оформить */

.mod-recs .recs-item {height: 18rem;}
.mod-recs .recs-item a {color: var(--light); text-decoration: underline;}
.mod-recs .recs-item a:hover {color: var(--blue); transition: all .2s ease-in-out;}

/* Отзывы */

.mod-reviews .review-header .img-wrap {height: 4rem;}

/* Калькуляторы */

.mod-casko .casko-items .casko-item:nth-last-child(n), .mod-osago .osago-items .osago-item:nth-last-child(n), .mod-ifl-calc .ifl-items .ifl-item:nth-last-child(n) {padding-bottom: 1.5rem; border-bottom: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important;}
.mod-casko .casko-items .casko-item:nth-last-child(1), .mod-osago .osago-items .osago-item:nth-last-child(1), .mod-ifl-calc .ifl-items .ifl-item:nth-last-child(1) {padding-bottom: 0rem; border-bottom: unset !important;}

.mod-casko .offer-item {border-bottom: 1px solid #eee;padding: 15px 0;}
.mod-casko .offer-company {font-weight: bold;font-size: 1.1rem;}
.mod-casko .offer-row {display: flex;justify-content: space-between;align-items: center;margin-top: 5px;}
.mod-casko .offer-title {margin-left: 2rem;flex-grow: 1;}
.mod-casko .offer-price {color: green;font-weight: bold;margin-right: 15px;}
.mod-casko .btn-select-offer {background-color: #007bff;color: white;border: none;padding: 5px 15px;border-radius: 4px;cursor: pointer;font-size: 0.9rem;}
.mod-casko .btn-select-offer:hover {background-color: #0056b3;}

/* ифл */
#mf-calc-wrapper .bg-gradient-light { background: linear-gradient(135deg, #ffffff, #edf4ff); }
#mf-calc-wrapper .border-start-primary { border-left-color: #0d6efd !important; }
.form-check-input[type=checkbox] { border-radius: 8px; }
.ifl-hand .form-check-input:checked { background-color: var(--blue); border-color: var(--blue); border-radius: 8px !important; }

@media (max-width: 768px) { #mf-calc-wrapper .display-6 { font-size: 1.75rem; } }


/* каско */
.form-page { display: none; }
.form-page.active { display: block; }
.button-group { display: flex; gap: 1rem; margin-top: 2rem; }
button[data-action="prev"]:disabled { opacity: 0.5; cursor: not-allowed; }
.form-message { border-radius: 1rem; padding: 1rem; margin-top: 1rem; }
.form-control.is-invalid,
.form-select.is-invalid { border: 2px solid #dc3545 !important; background-color: #fff5f5; }
.field-error { color: #dc3545; font-size: 0.875rem; margin-top: -8px; margin-bottom: 10px; }
/* Стили для кастомной кнопки "Далее" (копия btn-primary) */
.btn-next-custom { display: inline-block; font-weight: 600; line-height: 1.5; color: #fff; text-align: center; text-decoration: none; vertical-align: middle; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; user-select: none; background-color: #0d6efd; border: 1px solid #0d6efd; padding: 0.75rem 1.5rem; font-size: 1rem; border-radius: 1rem; transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out; }
.btn-next-custom:hover { color: #fff; background-color: #0b5ed7; border-color: #0a58ca; }
.btn-next-custom:focus { color: #fff; background-color: #0b5ed7; border-color: #0a58ca; box-shadow: 0 0 0 0.25rem rgba(49,132,253,.5); }
.btn-next-custom:active { color: #fff; background-color: #0a58ca; border-color: #0a53be; }
.btn-next-custom:disabled { pointer-events: none; opacity: 0.65; }

/* Адаптация */

@media screen and (max-width: 1400px) {
	.mod-casco .text-success {font-size: 16px;}
}

@media screen and (max-width: 1199px) {

	h1, .h1 {font-size: 3.25rem;}
	h2, .h2 {font-size: 2.25rem;}
	h3, .h3 {font-size: 2rem;}
	h4, .h4 {font-size: 1.75rem;}
	h5, .h5 {font-size: 1.5rem;}
	h6, .h6 {font-size: 1.35rem;}

	header #logo {max-width: 60%;}
	header .nav-item.item-101 {display: none;}

	/* ПУКТЫ МЕНЮ */
	.mod-points .point-item {min-height: 15rem;}
	/* Почему важно застраховать ИФЛ */
	.mod-ifl .ifl-main-item {min-height: 22rem;}
	.mod-ifl .ifl-item {min-height: 15rem;}
	/* Риски покупки дешевого страхового полиса */
	.mod-osago .osago-main-item {min-height: 22rem;}
	/*.mod-osago .osago-item {min-height: 15rem;}*/
	.mod-casco .text-success {font-size: 14px;}

}

@media screen and (max-width: 992px) {
	.mod-casco .text-success {font-size: 12px;}
}

@media screen and (max-width: 576px) {
	/* Почему важно застраховать ИФЛ */
	.mod-ifl .ifl-item .img-wrap {height: 85%; right: -3%;}	
}

/* Телефон Свой полис */

.sp-phone {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
}

.sp-phone-label {
  font-size: 12px;
  color: #555;
}

.sp-phone-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 22px;
  background: #2040ed;
  color: #fff !important;
  border-radius: 30px;
  font-size: 18px;
  font-weight: 700;
  text-decoration: none !important;
  white-space: nowrap;
}

.sp-phone-link:hover {
  background: #142dbb;
  color: #fff !important;
}

@media (max-width: 767px) {
  .sp-phone-link {
    font-size: 16px;
    padding: 10px 16px;
  }
}
