/*Цвет выделения текста*/

::selection {
    color: #FF3D3D;      /* цвет текста */
    background: #EAEAEA; /* фон выделения */
    
}

/* Для Firefox (иногда требуется отдельно) */
::-moz-selection {
    color: #FF3D3D;
    background: #EAEAEA;
    
}

/*Цвет бг*/

body {
    background-color: #F111111;
  }
  
  
:root {
    /* Duration */
    --duration-instant: 120ms;
    --duration-fast: 200ms;
    --duration-normal: 300ms;
    --duration-slow: 450ms;
    --duration-xslow: 600ms;
    --duration-hero: 800ms;
    --duration-xlslow: 1000ms;
  
    /* Easing */
    --ease-default: cubic-bezier(.25, .1, .25, 1);
    --ease-smooth: cubic-bezier(.22, 0, .36, 1);
    --ease-enter: cubic-bezier(.16, 1, .3, 1);
    --ease-exit: cubic-bezier(0, 0, .58, 1);
    --ease-fluid: cubic-bezier(.65, 0, .35, 1);
    --ease-expressive: cubic-bezier(.74, 0, 0, 1);
  
    /* Tokens */

    /*Image zoom*/
    --image-hover-scale: 1.05;
    --image-hover-duration: var(--duration-xlslow);
    --image-hover-easing: var(--ease-smooth);

    /*Popup transition*/
    --popup-transition-duration: var(--duration-slow);
    --popup-transition-enter-easing: var(--ease-enter);
    --popup-transition-exit-easing: var(--ease-exit);

    /*Button Hover*/
    --button-hover-duration: var(--duration-slow);
    --button-hover-easing: var(--ease-expressive);

    /* Faq Expand*/
    --faq-expand-enter-duration: var(--duration-slow);
    --faq-expand-exit-duration: var(--duration-fast);
    --faq-expand-enter-easing: var(--ease-enter);
    --faq-expand-exit-easing: var(--ease-exit);



  }
  



/* Hover кнопок*/


/* === BASE === */
.btn,
.btn .tn-atom {
  border-radius: 30px !important;

  transition:
    border-radius var(--duration-slow, 450ms) var(--ease-expressive, cubic-bezier(.74, 0, 0, 1)),
    background-color var(--duration-slow, 450ms) var(--ease-expressive, cubic-bezier(.74, 0, 0, 1)),
    color var(--duration-slow, 450ms) var(--ease-expressive, cubic-bezier(.74, 0, 0, 1)),
    border-color var(--duration-slow, 450ms) var(--ease-expressive, cubic-bezier(.74, 0, 0, 1)) !important;
}

.btn .tn-atom {
  overflow: hidden;
}

/* === HOVER === */
.btn:hover,
.btn:hover .tn-atom {
  border-radius: 8px !important;
}

/* === TOUCH DEVICES === */
@media (hover: none) and (pointer: coarse) {
  .btn,
  .btn .tn-atom {
    transition: none !important;
  }

  .btn:hover,
  .btn:hover .tn-atom {
    border-radius: 30px !important;
  }
}