.contact-fab * {
    box-sizing: border-box;
}
.contact-fab {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 1000;
    --button-size: 44px;
    --icon-size: 18px;
}
/* Главная кнопка */
.fab-main {
    width: var(--button-size);
    height: var(--button-size);
    border-radius: 50%;
    background: linear-gradient(135deg, rgb(156, 132, 0) 0%, rgb(135, 115, 0) 100%);
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: 0 4px 15px gold(0, 0, 0, 0.2);
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    z-index: 2;
    border: 3px solid gold;
}
.fab-main:hover {
    transform: scale(1.1);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.3);
}
/* Подсказка */
.fab-main::before,
.fab-child::before {
    content: attr(data-tooltip);
    position: absolute;
    right: calc(var(--button-size) + 10px);
    background: linear-gradient(135deg, #292920 0%, #2a2a2a 100%);
    color: white;
    padding: 8px 15px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    white-space: nowrap;
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    will-change: transform;
}
.fab-main::after,
.fab-child::after {
    content: '';
    position: absolute;
    right: calc(var(--button-size) + 4px);
    width: 0;
    height: 0;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    border-left: 6px solid #2d3748;
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none;
}
.fab-main:hover::before,
.fab-main:hover::after,
.fab-child:hover::before,
.fab-child:hover::after {
    opacity: 0.8;
}
/* Иконка главной кнопки - конверт */
.fab-main svg {
    width: var(--icon-size);
    height: var(--icon-size);
    transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
    fill: white;
    position: absolute;
}
/* Конверт (обычное состояние) */
.fab-main .envelope-icon {
    opacity: 1;
    transform: scale(1) rotate(0deg);
}
/* Крестик (скрыто в обычном состоянии) */
.fab-main .close-icon {
    opacity: 0;
    transform: scale(0) rotate(45deg);
}
/* Анимация при открытии */
.fab-main.active .envelope-icon {
    opacity: 0;
    transform: scale(0) rotate(-45deg);
}
.fab-main.active .close-icon {
    opacity: 1;
    transform: scale(1) rotate(0deg);
}
/* Контейнер дочерних кнопок */
.fab-children {
    position: absolute;
    bottom: calc(var(--button-size) + 15px);
    right: 0;
    display: flex;
    flex-direction: column;
    gap: 15px;
    opacity: 0;
    transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
    pointer-events: none;
    z-index: 1;
}
.fab-children.active {
    opacity: 1;
    pointer-events: all;
}
/* Дочерние кнопки */
.fab-child {
    width: var(--button-size);
    height: var(--button-size);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
    cursor: pointer;
    transition: all 0.5s cubic-bezier(0.34, 1.56, 0.64, 1) var(--delay), box-shadow 0.5s cubic-bezier(0.34, 1.56, 0.64, 1) 0s;           
    position: relative;
    border: 3px solid gold;
    transform: translateY(200px) scale(2); 
    text-decoration: none;
    opacity: 0;
}
.fab-children.active .fab-child {
    transform: translateY(0) scale(1);
    opacity: 1;
}
/* Просто задержки для всей анимации */
.fab-child:nth-child(1) { --delay: 0.2s; }
.fab-child:nth-child(2) { --delay: 0.1s; }
.fab-child:nth-child(3) { --delay: 0s; }
.fab-children.active .fab-child:hover {
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.3);
}
/* Иконки дочерних кнопок */
.fab-child svg {
    width: var(--icon-size);
    height: var(--icon-size);
    fill: white;
    transition: 0.5s;
    will-change: transform;
}      
.fab-children.active .fab-child:hover svg {
    transform: scale(1.1);
}
/* Цвета кнопок */
.fab-child.phone {
    background: linear-gradient(135deg, #4CAF50 0%, #2E7D32 100%);
}
.fab-child.telegram {
    background: linear-gradient(135deg, #2CA9DC 0%, #1C7EB6 100%);
}
.fab-child.max {
    background: linear-gradient(135deg, #3E5CFC 0%, #8043D9 100%);
}
/* Адаптивность */
@media (max-width: 768px) {
    .contact-fab {
        --button-size: 44px;
        --icon-size: 18px;
        bottom: 15px;
        right: 15px;
    }           
    .fab-children {
        bottom: calc(var(--button-size) + 10px);
        gap: 10px;
    }
}
@media (max-width: 480px) { 
    .contact-fab {
        --button-size: 38px;
        --icon-size: 14px;
        bottom: 10px;
        right: 10px;
    }           
    .fab-main::before,
    .fab-child::before {
        font-size: 13px;
        padding: 6px 12px;
    }
}