/* Базовые стили для кнопок (компьютеры и планшеты) */
.js-store-prod-text a {
    display: inline-block;
    padding: 12px 12px;
    margin-right: 20px;
    margin-top: 10px;
    border-radius: 30px;
    border: 1px solid #bdbdbd;
    font-weight: 600;
    box-sizing: border-box; /* Чтобы padding не раздувал кнопку больше 100% */
    text-align: center;      /* Выравниваем текст по центру */
    
    /* Эффект легкой фирменной тени Tilda */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.06), 0 1px 3px rgba(0, 0, 0, 0.1);
    transition: transform 0.2s ease, box-shadow 0.2s ease; /* Плавность для красоты */
}

/* Стили для первой кнопки */
.js-store-prod-text a:first-of-type {
    background-color: #f1efef;
    color: #414141; /* ИСПРАВЛЕНО: вместо font-color используем color */
}

/* Адаптив для смартфонов в вертикальном режиме (экран до 560px) */
@media screen and (max-width: 560px) {
    .js-store-prod-text a {
        display: block;       /* Переводим в блочный режим, чтобы кнопка заняла всю ширину */
        width: 100%;          /* Растягиваем на 100% ширины экрана */
        padding: 11px 12px;   /* Уменьшили верхний/нижний отступ (сделали чуть уже) */
        margin-right: 0;      /* Сбрасываем правый отступ, так как кнопки теперь друг под другом */
        margin-top: 10px;     /* Делаем одинаковый отступ сверху для обеих кнопок */
    }
}