.service__page-service-architecture-tabs {
margin-bottom: 12px;
}
.service__page-service-architecture-tabs-slider .swiper-slide {
width: auto !important;
}
.service__page-service-architecture-btn {
padding: clamp(
9px,
calc(9px + (11 - 9) * (100cqw - 1280px) / (1600 - 1280)),
11px
)
clamp(
15px,
calc(15px + (19 - 15) * (100cqw - 1280px) / (1600 - 1280)),
19px
);
border-radius: 12px;
border: 1px solid var(--blue-white-color);
color: var(--black-color);
font-size: 15px;
line-height: 140%;
cursor: pointer;
}
.service__page-service-architecture-tabs
.swiper-slide-thumb-active
.service__page-service-architecture-btn {
background-color: var(--blue-color);
color: var(--white-color);
font-weight: 700;
font-size: clamp(
15px,
calc(15px + (16 - 15) * (100cqw - 1280px) / (1600 - 1280)),
16px
);
}
.service__page-service-architecture-slider-wrap {
position: relative;
overflow: hidden;
background-color: var(--blue-white-color);
border-radius: 30px;
}
.service__page-service-architecture-slide-card {
padding: clamp(24px, calc(24px + (30 - 24) * (100cqw - 1280px) / (1600 - 1280)), 30px);
display: grid;
grid-template-columns: 44fr 46fr;
gap: clamp(
20px,
calc(20px + (40 - 20) * (100cqw - 1280px) / (1600 - 1280)),
40px
);
}
.service__page-service-architecture-slide-img-wrap {
background-color: var(--white-color);
height: clamp(
355px,
calc(355px + (450 - 355) * (100cqw - 1280px) / (1600 - 1280)),
450px
);
border-radius: 12px;
overflow: hidden;
}
.service__page-service-architecture-slide-img {
width: 100%;
height: 100%;
object-fit: cover;
}
.service__page-service-architecture-slide-content {
padding-top: clamp(10px, calc(10px + (20 - 10) * (100cqw - 1280px) / (1600 - 1280)), 20px);
display: flex;
flex-direction: column;
gap: clamp(16px, calc(16px + (24 - 16) * (100cqw - 1280px) / (1600 - 1280)), 24px);
}
.service__page-service-architecture-slide-title {
font-family: "Unbounded", sans-serif;
font-size: clamp(
22px,
calc(22px + (24 - 22) * (100cqw - 1280px) / (1600 - 1280)),
24px
);
font-weight: 600;
line-height: 126%;
}
.service__page-service-architecture-slide-body {
display: flex;
flex-direction: column;
gap: clamp(
12px,
calc(12px + (16 - 12) * (100cqw - 1280px) / (1600 - 1280)),
16px
);
}
.service__page-service-architecture-slide-body-item {
display: flex;
flex-direction: column;
gap: clamp(
12px,
calc(12px + (16 - 12) * (100cqw - 1280px) / (1600 - 1280)),
16px
);
overflow: hidden;
} .service__page-service-architecture-slide-body-item.now {
background-color: var(--white-color);
}
.service__page-service-architecture-slide-body-item-title {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
color: var(--blue-white-color-second);
font-family: "Unbounded", sans-serif;
font-size: clamp(
19px,
calc(19px + (21 - 19) * (100cqw - 1280px) / (1600 - 1280)),
21px
);
font-weight: 600;
line-height: 152%;
}
.service__page-service-architecture-slide-body-item-title::after {
content: "";
display: block;
width: clamp(
25px,
calc(25px + (28.3 - 25) * (100cqw - 1280px) / (1600 - 1280)),
28.3px
);
height: clamp(
25px,
calc(25px + (28.3 - 25) * (100cqw - 1280px) / (1600 - 1280)),
28.3px
);
background-image: url(//almond-medical.ru/wp-content/themes/amclinic/assets/svg/x-circle.svg);
background-size: contain;
background-repeat: no-repeat;
background-position: center;
transform: scale(1.2);
}
.service__page-service-architecture-slide-body-item.now
.service__page-service-architecture-slide-body-item-title {
flex-direction: row-reverse;
}
.service__page-service-architecture-slide-body-item.now
.service__page-service-architecture-slide-body-item-title::after {
background-image: url(//almond-medical.ru/wp-content/themes/amclinic/assets/svg/dark-blue-yes.svg);
transform: scale(1);
}
.service__page-service-architecture-slide-body-item-title > span {
opacity: 0.6;
}
.service__page-service-architecture-slide-body-item-bot {
color: var(--gray-color-second);
font-size: clamp(
17px,
calc(17px + (18 - 17) * (100cqw - 1280px) / (1600 - 1280)),
18px
);
line-height: 140%;
}
.service__page-service-architecture-arrows {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
gap: 40px;
border-top: 1px solid var(--white-color);
padding: clamp(
12px,
calc(12px + (16 - 12) * (100cqw - 1280px) / (1600 - 1280)),
16px
)
clamp(
24px,
calc(24px + (30 - 24) * (100cqw - 1280px) / (1600 - 1280)),
30px
);
}
.service__page-service-architecture-arr {
font-size: clamp(
15px,
calc(15px + (16 - 15) * (100cqw - 1280px) / (1600 - 1280)),
16px
);
line-height: 140%;
cursor: pointer;
display: flex;
flex-direction: row;
gap: 12px;
align-items: center;
color: var(--black-color);
font-weight: 700;
text-transform: lowercase;
transition: var(--transition);
}
.service__page-service-architecture-arr.prev::before {
content: "";
display: block;
width: clamp(
22px,
calc(22px + (32 - 22) * (100cqw - 1280px) / (1600 - 1280)),
32px
);
height: clamp(
22px,
calc(22px + (32 - 22) * (100cqw - 1280px) / (1600 - 1280)),
32px
);
mask-image: url(//almond-medical.ru/wp-content/themes/amclinic/assets/svg/arr-line-left.svg);
mask-size: contain;
mask-repeat: no-repeat;
mask-position: center;
background-color: var(--black-color);
transition: var(--transition);
}
.service__page-service-architecture-arr.next::after {
content: "";
display: block;
width: clamp(
22px,
calc(22px + (32 - 22) * (100cqw - 1280px) / (1600 - 1280)),
32px
);
height: clamp(
22px,
calc(22px + (32 - 22) * (100cqw - 1280px) / (1600 - 1280)),
32px
);
mask-image: url(//almond-medical.ru/wp-content/themes/amclinic/assets/svg/arr-line-right.svg);
mask-size: contain;
mask-repeat: no-repeat;
mask-position: center;
background-color: var(--black-color);
transition: var(--transition);
}
.service__page-service-architecture-arr:hover {
color: var(--blue-color);
}
.service__page-service-architecture-arr:hover::before,
.service__page-service-architecture-arr:hover::after {
background-color: var(--blue-color);
}
.service__page-service-architecture-arr:hover::before {
transform: translateX(-5px);
}
.service__page-service-architecture-arr:hover::after {
transform: translateX(5px);
}
.service__page-service-architecture-arr.swiper-button-disabled {
opacity: 0.2;
pointer-events: none;
}
.service__page-service-architecture-pagination {
display: flex;
flex-direction: row;
align-items: center;
gap: clamp(
8px,
calc(8px + (12 - 8) * (100cqw - 1280px) / (1600 - 1280)),
12px
);
width: fit-content !important;
}
.service__page-service-architecture-pagination .swiper-pagination-bullet {
width: clamp(
6px,
calc(6px + (8 - 6) * (100cqw - 1280px) / (1600 - 1280)),
8px
);
height: clamp(
6px,
calc(6px + (8 - 6) * (100cqw - 1280px) / (1600 - 1280)),
8px
);
background-color: #b2b1b6;
border-radius: 100%;
opacity: 1;
transition: var(--transition);
}
.service__page-service-architecture-pagination .swiper-pagination-bullet:hover {
transform: scale(1.3);
}
.service__page-service-architecture-pagination
.swiper-pagination-bullet-active {
background-color: var(--blue-color);
pointer-events: none;
}
@media(max-width: 1366px) {
.service__page-service-architecture-slide-card {
grid-template-columns: 1fr 1fr;
}
.service__page-service-architecture-slide-title {
line-height: 133%;
}
.service__page-service-architecture-slide-body-item-bot {
line-height: 135%;
}
}
@media(max-width: 992px) {
.service__page-service-architecture-btn {
padding: 10px 15px;
font-size: 14px;
line-height: 140%;
}
.service__page-service-architecture-slide-card {
grid-template-columns: 1fr 1fr;
padding: 20px 20px;
gap: 20px;
}
.service__page-service-architecture-tabs .swiper-slide-thumb-active .service__page-service-architecture-btn {
font-size: 14px;
}
.service__page-service-architecture-slide-img-wrap {
height: 312px;
}
.service__page-service-architecture-slide-content {
gap: 12px;
}
.service__page-service-architecture-slide-title {
font-size: 19px;
line-height: 140%;
}
.service__page-service-architecture-slide-body-item-title {
font-size: 17px;
line-height: 146%;
}
.service__page-service-architecture-slide-body-item-bot {
font-size: 16px;
line-height: 137%;
}
.service__page-service-architecture-slide-body-item-title::after {
width: 21px;
height: 21px;
}
}
@media(max-width: 650px) {
.service__page-service-architecture-slide-card {
grid-template-columns: 1fr;
gap: 20px;
}
.service__page-service-architecture-slide-img-wrap {
height: 298px;
}
.service__page-service-architecture-slide-content {
padding-top: 0;
}
}.service__table-pro-wrap {
border-radius: 40px;
outline: 1px solid var(--blue-white-color);
overflow: hidden;
}
.service__table-pro-head {
padding: clamp(
18px,
calc(18px + (24 - 18) * (100cqw - 1280px) / (1600 - 1280)),
24px
)
clamp(
20px,
calc(20px + (30 - 20) * (100cqw - 1280px) / (1600 - 1280)),
30px
);
background-color: var(--blue-white-color);
display: grid;
grid-template-columns:
clamp(
64px,
calc(64px + (74 - 64) * (100cqw - 1280px) / (1600 - 1280)),
74px
)
1fr;
gap: clamp(
16px,
calc(16px + (24 - 16) * (100cqw - 1280px) / (1600 - 1280)),
24px
);
align-items: center;
}
.service__table-pro-head-img-wrap {
height: clamp(
64px,
calc(64px + (74 - 64) * (100cqw - 1280px) / (1600 - 1280)),
74px
);
}
.service__table-pro-head-img-wrap > img {
width: 100%;
height: 100%;
object-fit: contain;
}
.service__table-pro-head-subtitle {
font-family: "Onest", sans-serif;
font-size: 16px;
font-weight: 400;
line-height: 140%;
color: var(--gray-color);
}
.service__table-pro-head-title {
display: flex;
flex-direction: row;
gap: 12px;
flex-wrap: wrap;
align-items: center;
font-family: "Unbounded", sans-serif;
font-size: clamp(
19px,
calc(19px + (21 - 19) * (100cqw - 1280px) / (1600 - 1280)),
21px
);
font-weight: 600;
line-height: 133%;
}
.service__table-pro-head-title-mark {
padding: clamp(
2px,
calc(2px + (5 - 2) * (100cqw - 1280px) / (1600 - 1280)),
5px
)
clamp(8px, calc(8px + (12 - 8) * (100cqw - 1280px) / (1600 - 1280)), 12px);
font-family: "Onest", sans-serif;
background-color: var(--pink-white-color);
color: var(--pink-color);
font-size: 15px;
font-weight: 700;
line-height: 140%;
text-align: center;
border-radius: 40px;
}
.service__table-pro-body-item {
padding: clamp(
18px,
calc(18px + (26 - 18) * (100cqw - 1280px) / (1600 - 1280)),
26px
)
clamp(
30px,
calc(30px + (40 - 30) * (100cqw - 1280px) / (1600 - 1280)),
40px
);
display: flex;
flex-direction: column;
gap: clamp(
12px,
calc(12px + (16 - 12) * (100cqw - 1280px) / (1600 - 1280)),
16px
);
}
.service__table-pro-body-item:not(:first-child) {
border-top: 1px solid var(--blue-white-color);
}
.service__table-pro-body-item-title {
position: relative;
padding-left: clamp(
18px,
calc(18px + (22 - 18) * (100cqw - 1280px) / (1600 - 1280)),
22px
);
display: flex;
flex-direction: row;
gap: clamp(
10px,
calc(10px + (14 - 10) * (100cqw - 1280px) / (1600 - 1280)),
14px
);
align-items: center;
font-family: "Unbounded", sans-serif;
font-size: clamp(
19px,
calc(19px + (22 - 19) * (100cqw - 1280px) / (1600 - 1280)),
22px
);
font-weight: 600;
line-height: 130%;
}
.service__table-pro-body-item-title::before {
content: "";
position: absolute;
top: clamp(
9px,
calc(9px + (10.5 - 9) * (100cqw - 1280px) / (1600 - 1280)),
10.5px
);
left: 0;
display: block;
width: 8px;
aspect-ratio: 1 / 1;
border-radius: 50%;
background-color: var(--pink-color);
}
.service__table-pro-body-item-title-mark {
padding: clamp(
2px,
calc(2px + (4 - 2) * (100cqw - 1280px) / (1600 - 1280)),
4px
)
clamp(8px, calc(8px + (10 - 8) * (100cqw - 1280px) / (1600 - 1280)), 10px);
font-family: Onest;
font-size: 16px;
font-weight: 700;
line-height: 140%;
text-align: center;
background-color: var(--pink-white-color);
color: var(--pink-color);
border-radius: 40px;
}
.service__table-pro-body-item-text {
font-size: clamp(
18px,
calc(18px + (20 - 18) * (100cqw - 1280px) / (1600 - 1280)),
20px
);
line-height: 149%;
color: var(--gray-color-second);
}
.service__table-pro-body-item-text *:first-child {
margin-top: 0;
}
.service__table-pro-body-item-text *:last-child {
margin-bottom: 0;
}
.service__table-pro-bot {
padding: clamp(
18px,
calc(18px + (24 - 18) * (100cqw - 1280px) / (1600 - 1280)),
24px
)
clamp(
20px,
calc(20px + (30 - 20) * (100cqw - 1280px) / (1600 - 1280)),
30px
);
background-color: var(--pink-color);
color: var(--white-color);
display: grid;
grid-template-columns:
clamp(
64px,
calc(64px + (74 - 64) * (100cqw - 1280px) / (1600 - 1280)),
74px
)
1fr auto;
gap: clamp(
16px,
calc(16px + (24 - 16) * (100cqw - 1280px) / (1600 - 1280)),
24px
);
align-items: center;
}
.service__table-pro-bot-img-wrap {
height: clamp(
64px,
calc(64px + (74 - 64) * (100cqw - 1280px) / (1600 - 1280)),
74px
);
}
.service__table-pro-bot-img-wrap > img {
width: 100%;
height: 100%;
object-fit: contain;
}
.service__table-pro-bot-text {
display: flex;
flex-direction: column;
gap: 4px;
}
.service__table-pro-bot-subtitle {
font-size: 16px;
font-weight: 400;
line-height: 140%;
}
.service__table-pro-bot-title {
font-family: "Unbounded", sans-serif;
font-size: clamp(
19px,
calc(19px + (21 - 19) * (100cqw - 1280px) / (1600 - 1280)),
21px
);
font-weight: 600;
line-height: 133%;
}
.service__table-pro-bot-mark {
padding: clamp(
2px,
calc(2px + (5 - 2) * (100cqw - 1280px) / (1600 - 1280)),
5px
)
clamp(8px, calc(8px + (12 - 8) * (100cqw - 1280px) / (1600 - 1280)), 12px);
background-color: var(--white-color);
color: var(--pink-color);
border-radius: 40px;
font-family: "Onest", sans-serif;
font-size: clamp(
16px,
calc(16px + (18 - 16) * (100cqw - 1280px) / (1600 - 1280)),
18px
);
font-weight: 700;
line-height: 140%;
text-align: center;
height: fit-content;
width: fit-content;
}
@media(max-width: 1366px) {
.service__table-pro-body-item-title {
line-height: 140%;
}
.service__table-pro-body-item-text {
line-height: 135%;
}
.service__table-pro-bot {
align-items: self-start;
}
.service__table-pro-bot-subtitle {
line-height: 145%;
}
}
@media(max-width: 992px) {
.service__table-pro-wrap {
border-radius: 30px;
}
.service__table-pro-head {
padding: 14px 16px;
gap: 12px;
grid-template-columns: 54px 1fr;
}
.service__table-pro-head-img-wrap {
height: 54px;
}
.service__table-pro-head-subtitle {
font-size: 15px;
line-height: 144%;
}
.service__table-pro-head-title {
font-size: 17px;
}
.service__table-pro-head-title-mark {
font-size: 14px;
}
.service__table-pro-body-item {
padding: 14px 20px;
}
.service__table-pro-body-item-title {
gap: 8px;
padding-left: 14px;
font-size: 17px;
line-height: 128%;
}
.service__table-pro-body-item-title::before {
width: 6px;
}
.service__table-pro-body-item-text {
font-size: 16px;
line-height: 127%;
}
.service__table-pro-body-item-title-mark {
font-size: 15px;
line-height: 123%;
}
.service__table-pro-bot {
padding: 12px 16px 16px 16px;
grid-template-columns: 54px 1fr;
column-gap: 12px;
row-gap: 0px;
}
.service__table-pro-bot-img-wrap {
height: 54px;
}
.service__table-pro-bot-mark {
grid-column: 2;
}
.service__table-pro-bot-subtitle {
font-size: 15px;
}
.service__table-pro-bot-title {
font-size: 17px;
line-height: 111%;
}
.service__table-pro-bot-mark {
font-size: 14px;
}
}
@media(max-width: 650px) {
.service__table-pro-head-title {
flex-direction: column;
align-items: flex-start;
gap: 4px;
}
.service__table-pro-body-item-title {
flex-direction: column;
align-items: flex-start;
gap: 10px;
}
.service__table-pro-body-item-title-mark {
margin-left: -14px;
}
}.tariffs__grid-wrap {
position: relative;
padding: 80px 0;
margin: 100px 0;
width: 100%;
}
.tariffs__grid-wrap .service__badge {
background-color: var(--white-color);
}
.tariffs__grid-wrap .service__page-content-subtitle {
color: var(--gray-color-second);
}
.tariffs__grid-wrap::after {
content: "";
position: absolute;
top: 0;
left: calc(
-1 *
(
max(
0px,
calc(
(
100vw - var(--container-max-width) - 2 *
var(--content-padding)
) /
2
)
) +
var(--content-padding)
)
);
width: 100vw;
height: 100%;
background-color: var(--blue-white-color);
border-radius: 80px;
z-index: -1;
}
.tariffs__grid-inner {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
gap: clamp(
20px,
calc(20px + (30 - 20) * (100cqw - 1280px) / (1600 - 1280)),
30px
);
margin-bottom: clamp(
20px,
calc(20px + (30 - 20) * (100cqw - 1280px) / (1600 - 1280)),
30px
);
align-items: center;
}
.tariff__grid-card {
position: relative;
display: flex;
flex-direction: column;
background-color: var(--white-color);
border-radius: 32px;
}
.tariff__grid-card-badge {
position: absolute;
padding: 6.4px 16px;
top: -14.5px;
left: 50%;
transform: translateX(-50%);
width: max-content;
font-family: "Unbounded", sans-serif;
font-size: clamp(
12px,
calc(12px + (13 - 12) * (100cqw - 1280px) / (1600 - 1280)),
13px
);
line-height: 128%;
font-weight: 500;
background-color: var(--pink-color);
color: var(--white-color);
border-radius: 12px;
}
.tariff__grid-card.white,
.tariff__grid-card.gray {
min-height: 93.5%;
}
.tariff__grid-card.gray {
border: 1px solid var(--white-color);
background-color: var(--blue-white-color);
}
.tariff__grid-card.blue {
background-color: var(--blue-color);
color: var(--white-color);
}
.tariff__grid-card-top {
padding: clamp(
24px,
calc(24px + (28 - 24) * (100cqw - 1280px) / (1600 - 1280)),
28px
);
padding-bottom: clamp(
20px,
calc(20px + (28 - 20) * (100cqw - 1280px) / (1600 - 1280)),
28px
);
display: flex;
flex-direction: column;
gap: clamp(
12px,
calc(12px + (18 - 12) * (100cqw - 1280px) / (1600 - 1280)),
18px
);
}
.tariff__grid-card-type {
padding: 6px 12px;
background-color: var(--blue-white-color);
font-size: clamp(
14px,
calc(14px + (15 - 14) * (100cqw - 1280px) / (1600 - 1280)),
15px
);
line-height: 128%;
border-radius: 16px;
width: fit-content;
height: fit-content;
}
.tariff__grid-card.blue .tariff__grid-card-type {
background-color: #6182d5;
font-weight: 700;
}
.tariff__grid-card-title {
font-family: "Unbounded", sans-serif;
font-size: clamp(
18px,
calc(18px + (19 - 18) * (100cqw - 1280px) / (1600 - 1280)),
19px
);
line-height: 138%;
font-weight: 600;
}
.tariff__grid-card.blue .tariff__grid-card-title {
font-size: clamp(
19px,
calc(19px + (21 - 19) * (100cqw - 1280px) / (1600 - 1280)),
21px
);
line-height: 132%;
}
.tariff__grid-card-price-wrap {
display: flex;
flex-direction: row;
align-items: flex-end;
gap: clamp(
8px,
calc(8px + (12 - 8) * (100cqw - 1280px) / (1600 - 1280)),
12px
);
flex-wrap: wrap;
}
.tariff__grid-card-price-pre {
font-size: clamp(
17px,
calc(17px + (18 - 17) * (100cqw - 1280px) / (1600 - 1280)),
18px
);
line-height: 140%;
color: #4d4c56;
}
.tariff__grid-card.blue .tariff__grid-card-price-pre {
color: var(--blue-white-color);
line-height: 195%;
}
.tariff__grid-card-price {
font-family: "Unbounded";
font-size: clamp(
19px,
calc(19px + (22 - 19) * (100cqw - 1280px) / (1600 - 1280)),
22px
);
font-weight: 600;
line-height: 130%;
color: var(--black-color);
}
.tariff__grid-card.blue .tariff__grid-card-price {
font-size: clamp(
32px,
calc(32px + (38 - 32) * (100cqw - 1280px) / (1600 - 1280)),
38px
);
line-height: 140%;
color: var(--white-color);
}
.tariff__grid-card-desc {
font-size: clamp(
14px,
calc(14px + (15 - 14) * (100cqw - 1280px) / (1600 - 1280)),
15px
);
line-height: 152%;
color: #4d4c56;
}
.tariff__grid-card.blue .tariff__grid-card-desc {
color: var(--blue-white-color);
}
.tariff__grid-card-bot {
display: flex;
flex-direction: column;
height: 100%;
padding: clamp(
20px,
calc(20px + (24 - 20) * (100cqw - 1280px) / (1600 - 1280)),
24px
)
clamp(
24px,
calc(24px + (28 - 24) * (100cqw - 1280px) / (1600 - 1280)),
28px
);
border-top: 1px solid var(--blue-white-color);
}
.tariff__grid-card-bot *:last-child {
margin-bottom: 0;
}
.tariff__grid-card.gray .tariff__grid-card-bot {
border-color: var(--white-color);
}
.tariff__grid-card.blue .tariff__grid-card-bot {
border-color: #4b71cf;
padding: clamp(
20px,
calc(20px + (28 - 20) * (100cqw - 1280px) / (1600 - 1280)),
28px
)
clamp(
24px,
calc(24px + (28 - 24) * (100cqw - 1280px) / (1600 - 1280)),
28px
);
padding-bottom: clamp(
18px,
calc(18px + (26 - 18) * (100cqw - 1280px) / (1600 - 1280)),
26px
);
}
.tariff__grid-card-list.tariff__grid-card-list {
display: flex;
flex-direction: column;
gap: 12px;
list-style: none;
padding-inline-start: 0;
font-size: clamp(
16px,
calc(16px + (17 - 16) * (100cqw - 1280px) / (1600 - 1280)),
17px
);
line-height: 135%;
margin-bottom: 24px;
}
.tariff__grid-card-list.tariff__grid-card-list > li.tariff__grid-card-list-item {
position: relative;
padding-left: clamp(
26px,
calc(26px + (28 - 26) * (100cqw - 1280px) / (1600 - 1280)),
28px
);
}
.tariff__grid-card-bot li.tariff__grid-card-list-item::before {
content: "";
position: absolute;
top: 0;
left: 0;
display: block;
width: clamp(
18px,
calc(18px + (20 - 18) * (100cqw - 1280px) / (1600 - 1280)),
20px
);
height: clamp(
18px,
calc(18px + (20 - 18) * (100cqw - 1280px) / (1600 - 1280)),
20px
);
background-image: url(//almond-medical.ru/wp-content/themes/amclinic/assets/svg/ok-circle-blue2.svg);
background-position: center;
background-size: contain;
background-repeat: no-repeat;
}
.tariff__grid-card-bot li.tariff__grid-card-list-item.minus::before {
background-image: url(//almond-medical.ru/wp-content/themes/amclinic/assets/svg/minus-circle.svg) !important;
}
.tariff__grid-card.blue li.tariff__grid-card-list-item::before {
background-image: url(//almond-medical.ru/wp-content/themes/amclinic/assets/svg/ok-circle-white2.svg);
}
.tariff__grid-card-action {
padding: 18px;
font-family: "Unbounded", sans-serif;
font-size: 14px;
font-weight: 600;
line-height: 142%;
color: var(--white-color);
background-color: var(--pink-color);
width: 100%;
text-align: center;
cursor: pointer;
border-radius: 21px;
transition: var(--transition);
margin-top: auto;
margin-bottom: 12px;
}
.tariff__grid-card-action:hover {
box-shadow: 0 0 20px var(--pink-color);
}
.tariff__grid-card-quote {
text-align: center;
font-size: clamp(
14px,
calc(14px + (15 - 14) * (100cqw - 1280px) / (1600 - 1280)),
15px
);
line-height: 140%;
color: #4d4c56;
}
.tariff__grid-card.blue .tariff__grid-card-quote {
color: var(--blue-white-color);
}
.tariffs__grid-bot-wrap {
display: grid;
grid-template-columns: 1fr 1fr;
gap: clamp(
20px,
calc(20px + (30 - 20) * (100cqw - 1280px) / (1600 - 1280)),
30px
);
}
.tariffs__grid-bot-full {
grid-column: 1/-1;
padding: clamp(
24px,
calc(24px + (30 - 24) * (100cqw - 1280px) / (1600 - 1280)),
30px
)
clamp(
28px,
calc(28px + (32 - 28) * (100cqw - 1280px) / (1600 - 1280)),
32px
);
display: flex;
flex-direction: column;
gap: clamp(
20px,
calc(20px + (24 - 20) * (100cqw - 1280px) / (1600 - 1280)),
24px
);
border-radius: 30px;
border: 1px solid #9ba4ba;
}
.tariffs__grid-bot-full-title {
font-family: "Unbounded", sans-serif;
font-weight: 600;
font-size: clamp(
21px,
calc(21px + (24 - 21) * (100cqw - 1280px) / (1600 - 1280)),
24px
);
line-height: 128%;
}
.tariffs__grid-bot-full-list {
font-size: clamp(
17px,
calc(17px + (18 - 17) * (100cqw - 1280px) / (1600 - 1280)),
18px
);
line-height: 130%;
}
.tariffs__grid-bot-full-list.tariffs__grid-bot-full-list ul {
display: grid;
grid-template-columns: 1fr 1fr;
column-gap: clamp(
20px,
calc(20px + (30 - 20) * (100cqw - 1280px) / (1600 - 1280)),
30px
);
row-gap: clamp(
10px,
calc(10px + (12 - 10) * (100cqw - 1280px) / (1600 - 1280)),
12px
);
list-style: none;
padding: 0;
margin: 0;
}
.tariffs__grid-bot-full-list.tariffs__grid-bot-full-list ul > li {
position: relative;
padding-left: clamp(
20px,
calc(20px + (30 - 20) * (100cqw - 1280px) / (1600 - 1280)),
30px
);
}
.tariffs__grid-bot-full-list.tariffs__grid-bot-full-list ul > li::before {
content: "";
position: absolute;
top: 5px;
left: 2px;
transform: rotate(45deg);
width: clamp(
8px,
calc(8px + (10 - 8) * (100cqw - 1280px) / (1600 - 1280)),
10px
);
height: clamp(
8px,
calc(8px + (10 - 8) * (100cqw - 1280px) / (1600 - 1280)),
10px
);
background-color: var(--blue-color);
}
.tariffs__grid-bot-white,
.tariffs__grid-bot-pink {
display: flex;
flex-direction: column;
padding: clamp(
22px,
calc(22px + (28 - 22) * (100cqw - 1280px) / (1600 - 1280)),
28px
)
clamp(
26px,
calc(26px + (32 - 26) * (100cqw - 1280px) / (1600 - 1280)),
32px
);
border-radius: 32px;
}
.tariffs__grid-bot-white {
background-color: var(--white-color);
gap: 12px;
}
.tariffs__grid-bot-pink {
position: relative;
background-color: var(--pink-white-color);
}
.tariffs__grid-bot-pink-inner {
position: relative;
padding-left: clamp(
88px,
calc(88px + (94 - 88) * (100cqw - 1280px) / (1600 - 1280)),
94px
);
display: flex;
flex-direction: column;
row-gap: clamp(
12px,
calc(12px + (16 - 12) * (100cqw - 1280px) / (1600 - 1280)),
16px
);
}
.tariffs__grid-bot-white-title,
.tariffs__grid-bot-pink-title {
font-family: "Unbounded", sans-serif;
font-size: clamp(
19px,
calc(19px + (21 - 19) * (100cqw - 1280px) / (1600 - 1280)),
21px
);
font-weight: 600;
line-height: 133%;
}
.tariffs__grid-bot-white-text,
.tariffs__grid-bot-pink-text {
font-size: clamp(
14px,
calc(14px + (15 - 14) * (100cqw - 1280px) / (1600 - 1280)),
15px
);
line-height: 140%;
}
.tariffs__grid-bot-white-text {
color: #4d4c56;
}
.tariffs__grid-bot-action {
padding: 14px 27px;
font-family: "Unbounded", sans-serif;
font-size: 14px;
font-weight: 600;
line-height: 142%;
width: fit-content;
border: 2px solid var(--blue-white-color);
border-radius: 21px;
color: var(--blue-color);
transition: var(--transition);
}
.tariffs__grid-bot-white .tariffs__grid-bot-action {
margin-top: auto;
}
.tariffs__grid-bot-white .tariffs__grid-bot-action:hover {
background-color: var(--blue-color);
color: var(--white-color);
}
.tariffs__grid-bot-pink .tariffs__grid-bot-action {
padding: 15px 28px;
border: 1px solid var(--pink-color);
color: var(--pink-color);
}
.tariffs__grid-bot-pink .tariffs__grid-bot-action:hover {
background-color: var(--pink-color);
color: var(--white-color);
}
.tariffs__grid-bot-pink-img {
position: absolute;
top: 0;
left: 0;
width: 64px;
height: 64px;
object-fit: contain;
}
.tariffs__grid-bot-pink-text {
color: var(--gray-color);
}
.tariffs__grid-bot-pink-uptitle {
color: #a498a2;
font-size: clamp(
15px,
calc(15px + (16 - 15) * (100cqw - 1280px) / (1600 - 1280)),
16px
);
line-height: 140%;
margin-bottom: 3px;
}
.tariff__grid-card-opener {
display: none;
}
@media (max-width: 992px) {
.tariffs__grid-wrap {
position: relative;
padding: 40px 0;
margin: 60px 0;
width: 100%;
}
.tariffs__grid-wrap::after {
border-radius: 60px;
}
.tariffs__grid-inner {
gap: 20px;
grid-template-columns: 1fr 1fr;
align-items: start;
}
.tariff__grid-card:nth-child(2) {
order: 1;
grid-row: 1 / 3;
}
.tariff__grid-card:nth-child(1) {
order: 2;
}
.tariff__grid-card:nth-child(3) {
order: 3;
}
.tariff__grid-card-top {
padding: 18px 20px 14px 20px;
gap: 10px;
}
.tariff__grid-card-title {
word-break: break-word;
}
.tariff__grid-card.blue .tariff__grid-card-top {
gap: 12px;
}
.tariff__grid-card-title {
font-size: 16px;
}
.tariff__grid-card.blue .tariff__grid-card-title {
font-size: 18px;
}
.tariff__grid-card.blue {
font-size: 18px;
}
.tariff__grid-card-price {
font-size: 17px;
}
.tariff__grid-card.blue .tariff__grid-card-price {
font-size: 24px;
}
.tariff__grid-card-bot {
padding: 18px 20px;
}
.tariff__grid-card.blue .tariff__grid-card-bot {
padding-bottom: 16px;
}
.tariff__grid-card-list.tariff__grid-card-list {
font-size: 14px;
margin-bottom: 20px;
gap: 10px;
}
.tariff__grid-card.blue .tariff__grid-card-list {
margin-bottom: 14px;
}
.tariff__grid-card-list.tariff__grid-card-list > li.tariff__grid-card-list-item {
padding-left: 22px;
}
.tariff__grid-card.blue
.tariff__grid-card-list.tariff__grid-card-list
> li.tariff__grid-card-list-item {
padding-left: 26px;
}
li.tariff__grid-card-list-item::before {
width: 16px;
height: 16px;
}
.tariff__grid-card.blue li.tariff__grid-card-list-item::before {
width: 18px;
height: 18px;
}
.tariff__grid-card.blue .tariff__grid-card-list {
font-size: 15px;
}
.tariff__grid-card-action {
padding: 16px;
margin-bottom: 12px;
font-size: 14px;
}
.tariff__grid-card.blue .tariff__grid-card-list li:nth-child(n + 5) {
display: none;
}
.tariff__grid-card.blue.opened .tariff__grid-card-list li:nth-child(n + 5) {
display: block;
}
.tariff__grid-card-opener {
position: relative;
padding-right: 20px;
display: block;
margin-bottom: 20px;
cursor: pointer;
font-family: "Unbounded", sans-serif;
font-size: 12px;
font-weight: 500;
line-height: 133%;
width: fit-content;
}
.tariff__grid-card-opener::after {
content: "";
position: absolute;
top: 50%;
right: 0;
display: block;
width: 12px;
height: 12px;
mask-image: url(//almond-medical.ru/wp-content/themes/amclinic/assets/svg/arr-line-right.svg);
mask-size: contain;
mask-repeat: no-repeat;
mask-position: center;
background-color: var(--white-color);
transform: translateY(-50%) rotate(90deg);
}
.tariff__grid-card.blue.opened .tariff__grid-card-opener {
display: none;
}
.tariffs__grid-bot-full {
gap: 16px;
}
.tariffs__grid-bot-full-title {
font-size: 19px;
}
.tariffs__grid-bot-full-list.tariffs__grid-bot-full-list ul {
font-size: 16px;
grid-template-columns: 1fr;
gap: 10px;
}
.tariffs__grid-bot-white,
.tariffs__grid-bot-pink {
padding: 20px 24px;
}
.tariffs__grid-bot-white-title,
.tariffs__grid-bot-pink-title {
font-size: 18px;
}
.tariffs__grid-bot-white-text,
.tariffs__grid-bot-pink-text {
font-size: 14px;
}
.tariffs__grid-bot-pink-inner {
padding-top: 60px;
padding-left: 0;
}
.tariffs__grid-bot-pink-img {
width: 46px;
height: 46px;
}
}
@media (max-width: 650px) {
.tariffs__grid-inner {
gap: 5px;
}
.tariff__grid-card:nth-child(2) {
grid-column: 1 / 3;
}
.tariff__grid-card-type {
padding: 2px 8px;
font-size: 12px;
border-radius: 60px;
}
.tariff__grid-card.blue .tariff__grid-card-type {
font-size: 14px;
}
.tariff__grid-card-top {
padding: 18px 15px 14px 15px;
}
.tariff__grid-card.blue .tariff__grid-card-top {
padding: 28px 20px 14px 20px;
}
.tariff__grid-card-title {
font-size: 16px;
}
.tariff__grid-card-bot {
padding: 18px 10px;
}
.tariff__grid-card.blue .tariff__grid-card-bot {
padding: 18px 20px 16px 20px;
}
.tariffs__grid-bot-wrap {
grid-template-columns: 1fr;
}
.tariffs__grid-bot-full {
padding: 20px 24px;
}
.tariffs__grid-bot-white .tariffs__grid-bot-action {
margin-top: 4px;
}
}
@media (max-width: 379px) {
.tariffs__grid-inner {
display: flex;
flex-direction: column;
gap: 5px;
}
}