/* Блик на кнопке */
.blick-button {
	position: relative;
	overflow: hidden;
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
}

.blick-button:before {
	content: "";
	background-color: rgba(255, 255, 255, 0.5);
	height: 100%;
	width: 3em;
	display: block;
	position: absolute;
	opacity: 1;
	top: 0;
	left: -4.5em;
	-webkit-transform: skewX(-45deg) translateX(0);
	transform: skewX(-45deg) translateX(0);
	-webkit-transition: none;
	transition: none;
	webkit-animation: moving 3s ease-in-out infinite;
	-moz-animation: moving 3s ease-in-out infinite;
	-ms-animation: moving 3s ease-in-out infinite;
	-o-animation: moving 3s ease-in-out infinite;
	animation: moving 3s ease-in-out infinite;
}


@keyframes moving {
	30% {
		webkit-transform: skewX(-45deg) translateX(33.5em);
		transform: skewX(-45deg) translateX(33.5em);
		
	}
	
	100% {
		webkit-transform: skewX(-45deg) translateX(33.5em);
		transform: skewX(-45deg) translateX(33.5em);
		
	}
}

/* Конец */

/* CSS-класс для эффекта увеличения */
.scale-on-hover {
    display: inline-block;
    transition: transform 0.2s ease; /* Плавный переход */
}

.scale-on-hover:hover {
    transform: scale(1.1); /* Увеличение элемента на 10% */
}

/* Класс для текста с эффектом подчёркивания при наведении */
.underline-on-hover {
    text-decoration: none; /* Убираем стандартное подчёркивание */
    transition: text-decoration 0.2s ease; /* Плавный эффект */
}

.underline-on-hover:hover {
    text-decoration: underline; /* Добавляем подчёркивание при наведении */
}

body {
    cursor: url('/images/custom-cursor.png'), auto;
}

@media (max-width: 768px) {
    .mobile-fullwidth {
        width: 100% !important;
        height: auto !important;
        display: block;
        max-width: 100% !important;
    }
}

/* Стиль кнопки */
.pulse-button {
    position: relative;
    display: inline-block;
    padding: 15px 20px;
    font-size: 16px;
    color: #fff; /* Цвет текста */
    background-color: #0088cc; /* Голубой фон как в Telegram */
    border: none; /* Убираем обводку */
    border-radius: 50%; /* Круглая кнопка */
    text-decoration: none;
    text-align: center;
    cursor: pointer;
    overflow: hidden;
    box-shadow: 0 4px 15px rgba(0, 136, 204, 0.75);
    transition: box-shadow 0.3s ease;
}

.pulse-button:hover {
    box-shadow: 0 8px 25px rgba(0, 136, 204, 1);
}

/* Эффект "волны от камня" */
.pulse-button::before, 
.pulse-button::after, 
.pulse-button::nth-wave {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    background: radial-gradient(circle, rgba(0, 136, 204, 0.5) 0%, rgba(0, 136, 204, 0) 80%); /* Голубой градиент волны */
    border-radius: 50%; /* Волны остаются круглыми */
    transform: translate(-50%, -50%) scale(1);
    animation: ripple-animation 2s infinite ease-out;
}

.pulse-button::after {
    animation-delay: 0.5s; /* Вторая волна */
}

.pulse-button::nth-wave {
    animation-delay: 1s; /* Третья волна */
}

/* Анимация эффекта "волны от камня" */
@keyframes ripple-animation {
    0% {
        transform: translate(-50%, -50%) scale(1);
        opacity: 1;
    }
    100% {
        transform: translate(-50%, -50%) scale(4); /* Увеличение радиуса волны */
        opacity: 0;
    }
}

/* Стиль номера телефона */
.phone-number {
    position: relative;
    font-size: 24px;
    font-weight: bold;
    color: #0088cc; /* Цвет текста */
    text-decoration: none;
    cursor: pointer;
    animation: glow-animation 2s infinite, shake-animation 1s infinite ease-in-out;
    display: inline-block;
    text-align: center;
}

/* Свечение текста */
@keyframes glow-animation {
    0%, 100% {
        text-shadow: 0 0 5px #0088cc, 0 0 10px #00ffcc, 0 0 15px #00ffcc, 0 0 20px #0088cc;
    }
    50% {
        text-shadow: 0 0 10px #00ffcc, 0 0 20px #0088cc, 0 0 30px #00ffcc, 0 0 40px #00ffcc;
    }
}

/* Лёгкая вибрация */
@keyframes shake-animation {
    0%, 100% {
        transform: translateX(0);
    }
    25% {
        transform: translateX(-2px);
    }
    75% {
        transform: translateX(2px);
    }
}

/* Основной стиль для изображения */
.image {
    display: block; /* Убираем лишние отступы вокруг изображения */
    max-width: 100%; /* Гарантируем адаптивность */
    height: auto; /* Сохраняем пропорции */
    transition: transform 0.5s cubic-bezier(0.25, 1, 0.5, 1); /* Плавный эффект с более мягкой кривой */
    object-fit: cover; /* Сохраняем содержимое изображения внутри контейнера */
}

/* Увеличение при наведении */
.image:hover {
    transform: scale(1.1); /* Увеличиваем изображение */
}


/* Основной стиль для изображения */
.hover-effect {
    transition: transform 0.3s ease; /* Плавное увеличение */
}

/* Увеличение при наведении */
.hover-effect:hover {
    transform: scale(1.1); /* Первичное увеличение */
    animation: pulse 0.5s infinite alternate; /* Пульсация */
}

/* Анимация пульсации */
@keyframes pulse {
    from {
        transform: scale(1.1); /* Начальное увеличение */
    }
    to {
        transform: scale(1.15); /* Максимальное увеличение */
    }
}


/* Базовый стиль кнопки */
.oval-button {
    display: inline-block;
    padding: 10px 20px; /* Отступы для создания формы */
    font-size: 16px; /* Размер шрифта */
    color: #000; /* Чёрный цвет текста */
    background-color: #fff; /* Белый фон */
    border: 2px solid #0088cc; /* Синий контур */
    border-radius: 50px; /* Скругление для овальной формы */
    text-align: center; /* Центрирование текста */
    cursor: pointer; /* Указатель при наведении */
    transition: background-color 0.3s ease, color 0.3s ease; /* Плавный переход */
    text-decoration: none; /* Убираем подчеркивание */
}

/* Эффект при наведении */
.oval-button:hover {
    background-color: #0088cc; /* Синий фон при наведении */
    color: #fff; /* Белый текст при наведении */
}


/* Базовый стиль для изображения */
.image-blur {
    filter: blur(5px); /* Размытие изображения */
    transition: filter 0.3s ease; /* Плавный переход */
}

/* Эффект при наведении */
.image-blur:hover {
    filter: blur(0); /* Убираем размытие */
}



/* Стиль кнопки */
.wave-button {
    position: relative;
    display: inline-block;
    padding: 15px 30px;
    font-size: 16px;
    color: #fff;
    background-color: #0088cc; /* Голубой фон */
    border: none;
    border-radius: 50px;
    text-align: center;
    cursor: pointer;
    overflow: hidden;
    box-shadow: 0 4px 10px rgba(0, 136, 204, 0.5);
}

/* Создание эффекта волн */
.wave-button::before,
.wave-button::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 80%);
    border-radius: 50%;
    transform: translate(-50%, -50%) scale(1);
    opacity: 0;
    animation: wave-animation 2s infinite ease-out;
}

/* Вторая волна с задержкой */
.wave-button::after {
    animation-delay: 1s;
}

/* Анимация волн */
@keyframes wave-animation {
    0% {
        transform: translate(-50%, -50%) scale(1);
        opacity: 1;
    }
    100% {
        transform: translate(-50%, -50%) scale(2.5);
        opacity: 0;
    }
}



/* Стиль кнопки */
.ripple-effect-button {
    position: relative;
    display: inline-block;
    padding: 15px 30px;
    font-size: 16px;
    color: inherit; /* Оставляет цвет шрифта таким, каким он был */
    background-color: inherit; /* Фон остается неизменным */
    border: inherit; /* Сохраняет любые установленные границы */
    border-radius: 50px;
    text-align: center;
    cursor: pointer;
    overflow: hidden;
}

/* Создание эффекта волн */
.ripple-effect-button::before,
.ripple-effect-button::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 200%;
    height: 200%;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0) 80%);
    border-radius: 50%;
    transform: translate(-50%, -50%) scale(1);
    opacity: 0;
    animation: ripple-wave-animation 2s infinite ease-out;
    pointer-events: none; /* Исключаем взаимодействие с волнами */
}

/* Вторая волна с задержкой */
.ripple-effect-button::after {
    animation-delay: 1s;
}

/* Анимация волн */
@keyframes ripple-wave-animation {
    0% {
        transform: translate(-50%, -50%) scale(1);
        opacity: 1;
    }
    100% {
        transform: translate(-50%, -50%) scale(2.5);
        opacity: 0;
    }
}


/* Стиль кнопки */
.button1 {
    position: relative;
    display: inline-block;
    padding: 15px 20px;
    font-size: 16px;
    color: #000; /* Цвет текста можно задать, если нужно */
    background-color: transparent; /* Без фона */
    border: 2px solid transparent; /* Без рамки */
    border-radius: 30px; /* Скругление углов */
    text-decoration: none;
    text-align: center;
    cursor: pointer;
    overflow: hidden;
}


.highlight-bg {
  background-color: #F5DE22;
  border-radius: 6px;
  height: 100%;
  width: 100%;
}


@media (max-width: 768px) {
    .offcanvas-menu .sp-module-content ul > li > a {
        font-size: 20px !important;      /* Размер шрифта */
        font-weight: 500 !important;     /* Жирность (можно 700 для ещё жирнее) */
        padding: 9px 9px !important;   /* Отступ сверху/снизу между пунктами */
        line-height: 1 !important;     /* Межстрочный интервал */
    }

    .offcanvas-menu .sp-module-content ul > li ul li a {
        font-size: 16px !important;
        font-weight: 400 !important;
        padding: 8px 8px !important;
    }
}

/* ===============================
   MOBILE HORIZONTAL PHOTO SCROLL
   =============================== */

@media (max-width: 768px) {
  .mobile-photo-scroll {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    gap: 14px;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 10px;
  }

  .mobile-photo-scroll > div {
    flex: 0 0 auto;
    width: 75%;
  }

  .mobile-photo-scroll img {
    width: 100%;
    border-radius: 16px;
    display: block;
  }
}



/* ===== Apple UI Button ===== */

.ap-btn{
    display:inline-flex;
    align-items:center;
    gap:10px;

    background:linear-gradient(180deg,#0071e3,#0a84ff);
    color:#fff;

    border:none;
    border-radius:14px;

    padding:14px 20px;

    font-size:16px;
    font-weight:600;

    cursor:pointer;

    box-shadow:0 10px 30px rgba(0,113,227,0.25);

    transition:0.25s ease;
}

.ap-btn:hover{
    transform:translateY(-2px);
    box-shadow:0 15px 40px rgba(0,113,227,0.35);
}

/* ===== Overlay ===== */

.ap-overlay{
    display:none;
    position:fixed;
    inset:0;

    background:rgba(0,0,0,0.55);

    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);

    z-index:99999;

    opacity:0;
    transition:0.25s ease;
}

.ap-overlay.show{
    display:block;
    opacity:1;
}

/* ===== Modal ===== */

.ap-modal{
    max-width:420px;
    margin:10vh auto;

    background:rgba(28,28,30,0.92);

    border-radius:28px;

    padding:28px;

    color:#fff;

    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;

    box-shadow:0 25px 80px rgba(0,0,0,0.45);

    transform:translateY(20px) scale(0.98);

    transition:0.25s ease;
}

.ap-overlay.show .ap-modal{
    transform:translateY(0) scale(1);
}

/* ===== Header ===== */

.ap-header h2{
    margin:0;
    font-size:26px;
    font-weight:700;
}

.ap-header p{
    margin:6px 0 20px;
    font-size:14px;
    color:rgba(255,255,255,0.6);
}

/* ===== Grid ===== */

.ap-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
}

/* ===== Payment items ===== */

.ap-item{
    padding:14px;
    border-radius:16px;

    background:rgba(255,255,255,0.06);

    border:1px solid rgba(255,255,255,0.08);

    text-align:center;

    font-size:14px;

    transition:0.2s ease;
}

.ap-item:hover{
    transform:scale(1.03);
    background:rgba(255,255,255,0.12);
}

/* brand colors subtle */

.ap-item.kaspi{border-color:#ff2d55;}
.ap-item.halyk{border-color:#30d158;}
.ap-item.freedom{border-color:#0a84ff;}
.ap-item.cash{border-color:#ffd60a;}

/* ===== Close ===== */

.ap-close{
    margin-top:22px;
    width:100%;

    padding:14px;

    border:none;
    border-radius:14px;

    background:#ff453a;

    color:#fff;

    font-weight:600;

    cursor:pointer;

    transition:0.2s;
}

.ap-close:hover{
    background:#ff5c52;
}

/* mobile */

@media(max-width:600px){
    .ap-modal{
        margin:8vh 16px;
    }

    .ap-grid{
        grid-template-columns:1fr;
    }
}


/* ===== Apple Status Widget ===== */

.ios-status{
    display:flex;
    align-items:center;
    gap:12px;

    background:rgba(28,28,30,0.92);
    color:#fff;

    padding:12px 16px;

    border-radius:16px;

    width:max-content;

    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;

    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);

    box-shadow:0 10px 30px rgba(0,0,0,0.25);
}

/* dot */

.ios-dot{
    width:12px;
    height:12px;
    border-radius:50%;

    background:#30d158;

    box-shadow:0 0 12px rgba(48,209,88,0.8);

    animation:iosPulse 1.6s infinite;
}

.ios-dot.closed{
    background:#ff453a;
    box-shadow:0 0 12px rgba(255,69,58,0.8);
}

/* text */

.ios-title{
    font-size:15px;
    font-weight:600;
}

.ios-subtitle{
    font-size:12px;
    color:rgba(255,255,255,0.6);
    margin-top:2px;
}

/* animation */

@keyframes iosPulse{
    0%{transform:scale(1); opacity:1;}
    50%{transform:scale(1.2); opacity:0.6;}
    100%{transform:scale(1); opacity:1;}
}



карта

/* ===== BUTTON ===== */

.ap-btn{
    display:inline-flex;
    align-items:center;
    gap:10px;

    background:linear-gradient(180deg,#0071e3,#0a84ff);
    color:#fff;

    border:none;
    border-radius:14px;

    padding:14px 20px;

    font-size:16px;
    font-weight:600;

    cursor:pointer;

    transition:0.25s ease;

    box-shadow:0 10px 30px rgba(0,113,227,0.25);
}

.ap-btn:hover{
    transform:translateY(-2px);
}

/* ===== OVERLAY ===== */

.ap-overlay{

    display:none;

    position:fixed;

    inset:0;

    background:rgba(0,0,0,0.6);

    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);

    z-index:99999;

    opacity:0;

    transition:0.25s ease;

    overflow-y:auto;

    padding:20px;

    overscroll-behavior:contain;

    align-items:center;
    justify-content:center;
}

.ap-overlay.show{
    display:flex;
    opacity:1;
}

/* ===== LOCK BODY ===== */

body.ap-lock{
    overflow:hidden;
    touch-action:none;
}

/* ===== MODAL ===== */

.ap-modal{

    background:rgba(28,28,30,0.94);

    border-radius:32px;

    color:#fff;

    padding:28px;

    width:100%;

    max-width:920px;

    max-height:90vh;

    overflow-y:auto;

    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;

    box-shadow:
    0 30px 80px rgba(0,0,0,0.45),
    inset 0 1px 0 rgba(255,255,255,0.04);

    transform:translateY(20px) scale(0.98);

    transition:0.25s ease;

    scrollbar-width:none;
}

.ap-modal::-webkit-scrollbar{
    display:none;
}

.ap-overlay.show .ap-modal{
    transform:translateY(0) scale(1);
}

/* ===== HEADER ===== */

.ap-header h2{
    margin:0;
    font-size:32px;
    font-weight:700;
}

.ap-header p{
    margin:8px 0 24px;
    color:rgba(255,255,255,0.6);
}

/* ===== GRID ===== */

.ap-pro-grid{
    display:grid;
    grid-template-columns:380px 1fr;
    gap:18px;
}

/* ===== BADGE ===== */

.ap-info-badge{
    display:flex;
    align-items:center;
    gap:10px;

    background:rgba(255,255,255,0.06);

    border:1px solid rgba(255,255,255,0.08);

    padding:14px 16px;

    border-radius:18px;

    margin-bottom:14px;
}

.ap-badge-dot{
    width:10px;
    height:10px;

    border-radius:50%;

    background:#30d158;

    box-shadow:0 0 12px rgba(48,209,88,0.8);
}

/* ===== CARDS ===== */

.ap-card{
    background:rgba(255,255,255,0.06);

    border:1px solid rgba(255,255,255,0.08);

    padding:15px;

    border-radius:18px;

    margin-bottom:12px;

    font-size:15px;
}

/* ===== BUTTONS ===== */

.ap-copy,
.ap-route,
.ap-telegram{

    display:block;

    width:100%;

    text-align:center;

    padding:15px;

    border:none;

    border-radius:18px;

    margin-top:10px;

    text-decoration:none;

    font-weight:600;

    transition:0.25s ease;
}

.ap-copy{
    background:#0071e3;
    color:#fff;
    cursor:pointer;
}

.ap-copy:hover{
    background:#0a84ff;
}

.ap-route{
    background:rgba(255,255,255,0.08);
    color:#fff;
}

.ap-route:hover{
    background:rgba(255,255,255,0.14);
}

.ap-telegram{
    background:#229ED9;
    color:#fff;
}

.ap-telegram:hover{
    background:#37ace5;
}

/* ===== MAP ===== */

.ap-right{
    display:flex;
    align-items:center;
    justify-content:center;
}

.ap-map-frame{

    width:100%;

    min-height:460px;

    border:none;

    border-radius:28px;

    overflow:hidden;

    background:#111;

    box-shadow:
    0 20px 50px rgba(0,0,0,0.35),
    inset 0 1px 0 rgba(255,255,255,0.04);

    transition:0.3s ease;
}

.ap-map-frame:hover{
    transform:scale(1.01);
}

/* ===== CLOSE ===== */

.ap-close{

    width:100%;

    margin-top:22px;

    padding:15px;

    border:none;

    border-radius:18px;

    background:#ff453a;

    color:#fff;

    font-size:15px;
    font-weight:600;

    cursor:pointer;

    transition:0.25s;
}

.ap-close:hover{
    background:#ff5c52;
}

/* ===== MOBILE ===== */

@media(max-width:860px){

    .ap-overlay{
        padding:10px;
    }

    .ap-modal{

        padding:18px;

        border-radius:24px;

        max-height:88vh;
    }

    .ap-header h2{
        font-size:24px;
    }

    .ap-header p{
        margin-bottom:18px;
    }

    .ap-pro-grid{
        grid-template-columns:1fr;
        gap:14px;
    }

    .ap-map-frame{
        min-height:240px;
        border-radius:20px;
    }

    .ap-card{
        padding:13px;
        font-size:14px;
    }

    .ap-copy,
    .ap-route,
    .ap-telegram,
    .ap-close{

        padding:13px;
        border-radius:15px;
    }

}

кнопка

/* ===== GOOGLE FRIENDLY APPLE BUTTON ===== */

.apple-order-btn{

    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:12px;

    background:#000;

    color:#fff !important;

    text-decoration:none !important;

    border:none;

    padding:16px 32px;

    border-radius:14px;

    font-size:18px;
    font-weight:600;

    font-family:
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    Roboto,
    sans-serif;

    cursor:pointer;

    transition:
    transform .3s ease,
    box-shadow .3s ease,
    background .3s ease;

    box-shadow:
    0 4px 15px rgba(0,0,0,.2);

    line-height:1;

    position:relative;

    overflow:hidden;

    -webkit-tap-highlight-color:transparent;
}

/* hover */

.apple-order-btn:hover{

    transform:scale(1.03);

    background:#111;

    box-shadow:
    0 10px 24px rgba(0,0,0,.28);

    color:#fff !important;
}

/* click */

.apple-order-btn:active{

    transform:scale(.98);
}

/* shine effect */

.apple-order-btn::before{

    content:"";

    position:absolute;

    top:0;
    left:-120%;

    width:70%;
    height:100%;

    background:
    linear-gradient(
        90deg,
        transparent,
        rgba(255,255,255,.16),
        transparent
    );

    transform:skewX(-20deg);

    transition:.9s;
}

.apple-order-btn:hover::before{

    left:140%;
}

/* icon */

.apple-order-icon{

    font-size:18px;

    display:flex;
    align-items:center;
    justify-content:center;
}

/* mobile */

@media(max-width:600px){

    .apple-order-btn{

        width:100%;

        padding:15px 22px;

        font-size:17px;

        border-radius:13px;
    }

}

calcul

.is-calculator{
    max-width:640px;
    margin:40px auto;
    padding:30px;
    background:linear-gradient(145deg,#ffffff,#f5f7fb);
    border-radius:28px;
    box-shadow:0 18px 45px rgba(0,0,0,.10);
    box-sizing:border-box;
    font-family:Arial,sans-serif;
    border:1px solid rgba(0,0,0,.06);
}

.is-calculator h2{
    margin:0 0 24px;
    text-align:center;
    font-size:32px;
    font-weight:800;
    color:#111827;
    line-height:1.2;
}

.is-calculator h2:after{
    content:"";
    display:block;
    width:70px;
    height:4px;
    background:#229ED9;
    border-radius:10px;
    margin:14px auto 0;
}

.is-calculator select{
    width:100%;
    min-height:62px;
    padding:17px 52px 17px 20px;
    margin-bottom:16px;
    border:1px solid #d9dde5;
    border-radius:20px;
    background:#fff;
    color:#111827 !important;
    -webkit-text-fill-color:#111827 !important;
    font-size:16px;
    font-weight:600;
    line-height:1.5;
    box-sizing:border-box;
    cursor:pointer;
    appearance:none;
    -webkit-appearance:none;
    -moz-appearance:none;
    box-shadow:0 6px 18px rgba(0,0,0,.04);
    transition:.25s ease;

    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' fill='none' stroke='%23737b8c' stroke-width='2' viewBox='0 0 24 24'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
    background-repeat:no-repeat;
    background-position:right 18px center;
    background-size:20px;
}

.is-calculator select:hover{
    border-color:#229ED9;
}

.is-calculator select:focus{
    outline:none;
    border-color:#229ED9;
    box-shadow:0 0 0 4px rgba(34,158,217,.15);
}

#isResultCalc{
    background:linear-gradient(135deg,#111827,#1f2937);
    padding:24px;
    border-radius:22px;
    text-align:center;
    font-size:30px;
    font-weight:800;
    color:#fff;
    margin:8px 0 22px;
    box-shadow:0 14px 30px rgba(17,24,39,.22);
}

.calc-btn{
    width:100%;
    padding:18px;
    border:none;
    border-radius:22px;
    background:linear-gradient(135deg,#229ED9,#0a84ff);
    color:#fff;
    font-size:18px;
    font-weight:800;
    cursor:pointer;
    transition:.25s ease;
    box-shadow:0 14px 30px rgba(34,158,217,.35);
}

.calc-btn:hover{
    transform:translateY(-2px);
    box-shadow:0 18px 40px rgba(34,158,217,.45);
}

.calc-btn:active{
    transform:scale(.98);
}

@media(max-width:768px){

    .is-calculator{
        margin:25px auto;
        padding:22px;
        border-radius:24px;
    }

    .is-calculator h2{
        font-size:27px;
    }

    .is-calculator select{
        min-height:62px;
        padding:17px 50px 17px 18px;
        font-size:16px;
        border-radius:18px;
    }

    #isResultCalc{
        font-size:25px;
        padding:20px;
        border-radius:20px;
    }

    .calc-btn{
        font-size:16px;
        padding:17px;
        border-radius:18px;
    }
}