html {
    scroll-behavior: smooth;
    box-sizing: border-box;
}

*, *::before, *::after {
  box-sizing: inherit;
}

body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  font-size: 16px;  
  line-height: 1.5; 
  color: #333; 
}

.hd {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    font-size: 36px;  
    font-weight: 700;
    line-height: 36px;
    color: #111111;
}

.w-100p {
    width: 100%;
}

.ha {
    height: auto;
}

.ta-c {
    text-align: center;
}

.fl {
    float: left;
}

.d-ib {
    display: inline-block;
}

.w-1200 {
    width: 1200px;
}

.cl1 {
    transition: all 0.3s ease; 
    font-size: 14px;
    color: #fff;
    letter-spacing: 2px;
    font-weight: 600;
    cursor: pointer; 
    background-color: #0081bb;
    user-select: none;
}

.cl1:not(.active):hover {
  background-color: #39ac1d; /* ваш зелёный */
}

/* Активный пункт — всегда зелёный, наведение не меняет */
.cl1.active {
  background-color: #39ac1d;
}

.w-400 {
    width: 400px;
}

.logo {
    background-image: url('img/logo.jpg');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}

.book {
    background-image: url('img/book.jpg');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}

.oh {
    overflow: hidden;
}

.h-60 {
    height: 60px;
}

.w-100 {
    width: 100px;
}

.lh-60 {
    line-height: 60px;
}

.pl-10 {
    padding-left: 10px;
}

.pr-10 {
    padding-right: 10px;
}

.ml-2 {
    margin-left: 2px;
}



.w-406 {
    width: 406px;
}

.w-486 {
    width:486px;
}

.w-120 {
    width: 120px;
}

.w-150 {
    width: 150px;
}

.w-314 {
    width: 314px;
}

.fs-20 {
    font-size: 20px;
}

.fw-600 {
    font-weight: 600;
}

#id6 dn {
    
}

.dn {
    display: none;
}

.mt-80 {
    margin-top: 80px;
}

.bg_c {
    background-color: #f0f4f8;
}

.h-500 {
    height: 500px;
}

.p-20 {
    padding: 20px;
}

.w-318 {
    width: 318px;
}

.h-480 {
    height: 480px;
}

.h-460 {
    height: 460px;
}

.w-305 {
    width: 305px;
}

.ml-80 {
    margin-left: 80px;
}

.ml-40 {
    margin-left: 40px;
}

.ml-120 {
    margin-left: 120px;
}

.w-243 {
    width: 243px;
}

.ta-r {
    text-align: right;
}

.w-725 {
    width: 725px;
}

.c-blue {
    color: #0081bb;
}

.h-16 {
    height: 16px;
}

.mt-16 {
    margin-top: 16px;
}

.ta-l {
    text-align: left;
}

.w-775 {
    width: 775px;
}

.w-735 {
    width: 735px;
}

.h-36 {
    height: 36px;
}

.lh-16 {
    line-height: 16px;
}

.mt-24 {
    margin-top: 24px;
}

.btn {
    transition: all 0.3s ease; 
  /* Внутренние отступы: 16px сверху/снизу и 40px слева/справа */
  padding: 10px 40px; 
  
  /* Типографика внутри кнопки */
  font-family: 'Inter', sans-serif;
  font-size: 18px;         /* Текст должен быть чуть крупнее базового (16px) */
  font-weight: 600;        /* Полужирное начертание, чтобы буквы читались четко */
  line-height: 1.2;
  
  /* Внешний вид */
  background-color: #27ae60; 
  color: #ffffff;
  border: none;
  border-radius: 6px;      /* Современное легкое скругление углов */
  cursor: pointer;
  
  /* Чтобы кнопка не растягивалась на весь экран, а занимала место по тексту */
  display: inline-block; 
}

.btn:hover {
    transition: all 0.3s ease; 
    background-color: #0081bb; 
}

.lh {
    line-height: 1.5;
}

.lh_2 {
    line-height: 2;
}

.ml-10 {
    margin-left: 10px;
}

.h-42 {
    height: 42px;
}

.lh-42 {
    line-height: 42px;
}

.hd2 {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    font-size: 24px;  
    font-weight: 700;
    line-height: 1.5;
    text-align: left;
}

.mt-8 {
    margin-top: 8px;
}

.h-400 {
    height: 400px;
}

.h-200 {
    height: 200px;
}

.h-100 {
    height: 100px;
}

.mt-20 {
    margin-top: 20px;
}

.cp {
    cursor: pointer;
}

#id12:hover {
    text-decoration: underline;
}

.lh-24 {
    line-height: 24px;
}

.h-24 {
    height: 24px;
}

.prc {
    font-size: 24px;
    font-weight: 600;
    color: #39ac1d;
}

.c-green {
    color: #39ac1d;
}
