:root{
  --COLORE_BLACK: #14181B;
  --COLORE_Text: #FFFFFF;
  --COLORE_UIText: #E5E5E5;
  --COLORE_GREY: #757575;
  --COLORE_GREEN: #4D574E;
  --COLORE_YELLOW: #B78B4C;
  --COLORE_RED: #EC221F;
}
*{
  scroll-behavior: smooth;
}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
}

ol, ul {
  list-style: none;
}

body{
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  background-color: var(--COLORE_BLACK);
}
.body-scroll{
  overflow-x: hidden;
  overflow-y: auto;
}

a{
  text-decoration: none;
}

.container {
  min-width: 320px;
  max-width: 100%;
  box-sizing: border-box;
  margin: 0 auto;
  overflow-x: hidden;
}

.wrap {
  min-width: 320px;
  max-width: 1360px;
  box-sizing: border-box;
  margin: 0 auto;
}

.main__btn {
  padding: 10px 45px;
  border: 1px solid var(--COLORE_YELLOW);
  border-radius: 8px;
  color: var(--COLORE_UIText);
  background-color: var(--COLORE_BLACK);
  font-family: "Jost-Regular";
  font-weight: 400;
  font-size: 19px;
  letter-spacing: 0.05em;
}
.main__btn:hover{
  cursor: pointer;
  background-color: var(--COLORE_GREEN);
}
.main__btn:focus{
  background-color: var(--COLORE_GREEN);
}

.main-input{
  height: 39px;
  outline: none;
  border: 1px solid var(--COLORE_YELLOW);
  border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    -khtml-border-radius: 8px;
  background-color: var(--COLORE_BLACK);
  text-align: center;
  color: var(--COLORE_UIText);
  font-family: "Jost-Regular";
  font-weight: 400;
  font-size: 13px;
  letter-spacing: 0.05em;
}
.main-input::placeholder{
  text-align: center;
  color: var(--COLORE_UIText);
  font-family: "Jost-Regular";
  font-weight: 400;
  font-size: 13px;
  letter-spacing: 0.05em;
}
.main-input:hover{
  background-color: var(--COLORE_GREEN);
}
.main-input:focus{
  background-color: var(--COLORE_GREEN);
}

.input-btn{
  color: var(--COLORE_BLACK);
  background-color: var(--COLORE_YELLOW);
  box-shadow: 0 4px 4px -4px rgba(183, 139, 76, 0.1), 0 16px 16px -8px rgba(183, 139, 76, 0.2);
}



.flex-line{
  display: flex;
  flex-direction: row;
}
.flex-column{
  display: flex;
  flex-direction: column;
}
.flex-title{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 45px;
}
.title-section{
  text-align: center;
  color: var(--COLORE_YELLOW);
  font-family: "Jost-Regular";
  font-weight: 400;
  font-size: 32px;
  letter-spacing: 0.05em;
}
.padding-section{
  padding-top: 56px;
  padding-bottom: 56px;
}

/* Модальное окно */
.services-modal, .aboutme-modal{
  position: fixed;
  display: none;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  background: rgb(68 69 71 / 70%);
  /*background: rgba(20, 24, 27, 0.70);*/
  z-index: 2;
}
.modal-show{
  display: flex;
}
.modal-close{
  position: absolute;
  right: -5px;
  cursor: pointer;
  padding: none;
  border: none;
  width: 14px;
  height: 14px;
}
.modal-window{
  position: relative;
  margin: auto;
  width: 804px;
  height: 650px;
  border-radius: 64px;
  background: var(--COLORE_BLACK);
}
.services-modal__img{
  width: 376px;
  height: 650px;
  border-radius: 36px 0px 0px 36px;
}
.services-modal__main{
  gap: 36px;
  padding: 10px 30px 25px 30px;
}
.services-modal__title{
  text-align: center;
  color: var(--COLORE_Text);
  font-family: "Jost-Regular";
  font-weight: 400;
  font-size: 32px;
  letter-spacing: 0.05em;
}
.services-modal__description, .services-modal__description ol li{
  color: var(--COLORE_Text);
  font-family: "Jost-Regular";
  font-weight: 400;
  font-size: 18px;
  letter-spacing: -0.02em;
  overflow: hidden;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  -ms-overflow-style: none;  /* IE и Edge */
  scrollbar-width: none;  /* Firefox */
}
.services-modal__description::-webkit-scrollbar {
  display: none;
}

.aboutme-modal__window{
  gap: 10px;
}
