:root {
    --font: "Roboto", serif;
    --black: #1F1E1E;
    --white: #fff;
    --gray: #3C3C3C;
}

body, html {
    font-family: var(--font);
    font-size: 10px;
    font-weight: 400;
    color: var(--gray);
    background-color: var(--white);

    width: 100%;
    margin: 0;
    padding: 0;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

.container {
    max-width: 1200px;
    margin-right: auto;
    margin-left: auto;
}

/* main */

main {
    margin: 8px;
    background-image: url(../images/main.jpg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 100vh;
}

header {
    display: flex;
    align-items: center;
    justify-content: space-between;

    padding-top: 23px;
    padding-right: 42px;
    padding-left: 42px;
}

.header-link a {
    text-decoration: none;
    color: var(--white);
    padding-right: 17px;
    text-transform: uppercase;
}

.main-inner {
    padding-top: 69px;
    padding-left: 42px;
}

.main-inner h1 {
    font-size: 63px;
    line-height: 65px;
    color: var(--white);
    font-weight: 400;

    margin-bottom: 36px;
}

.main-inner a {
    background-color: var(--black);
    padding: 15px 57px;
    text-align: center;
    text-decoration: none;
    color: var(--white);
    text-transform: uppercase;
    border-radius: 4.17px;
}

.main-cookies {
    position: absolute;
    bottom: 74px;
    right: 74px;
    width: 286px;

    text-transform: uppercase;
    color: var(--gray);
}

.main-cookies h2 {
    text-transform: uppercase;
    margin-bottom: 18px;
    font-size: 9px;
}

.main-cookies p {
    line-height: 13.75px;
    margin-bottom: 18px;
}

.main-cookies-buttons {
    display: flex;
    justify-content: space-around;
}

.main-cookies-buttons a:first-of-type {
    text-decoration: none;
    color: var(--gray);
}

.main-cookies-buttons a:last-of-type {
    text-decoration: none;
    color: var(--white);
}


/* catalog */

.catalog {
    margin-top: 59px;
    padding-bottom: 100px;
}

.catalog-start {
    display: flex;
    align-items: center;
    justify-content: space-around;

    margin-bottom: 40px;
}

.catalog-start-item {
    display: flex;
    align-items: center;
}

.catalog-start-item span {
    margin-right: 17px;
    font-weight: 400;
    font-size: 18px;
    color: var(--gray);
}

.catalog-start-item h3,
.catalog-start-item p {
    font-weight: 400;
    font-size: 9px;
    color: var(--gray);
    text-transform: uppercase;
}

.catalog-title {
    margin-bottom: 76px;
    font-weight: 400;
    font-size: 125px;
    line-height: 131.25px;

    text-align: center;
}

.catalog-inner {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
}

.catalog-item {
    width: 20%;
    margin-bottom: 37px;
    text-align: center;
}

.catalog-item img {
    width: 167px;
    height: 167px;
    margin-bottom: 20px;
}

.catalog-item h3 {
    font-weight: 400;
    font-size: 9px;
    color: var(--gray);
    line-height: 9.17px;
    text-transform: uppercase;
}

.catalog-item span {
    font-weight: 400;
    font-size: 9px;
    color: var(--gray);
    line-height: 13.75px;
    text-transform: uppercase;
}

.catalog-button {
    font-family: var(--font);
    text-transform: uppercase;
    border: none;
    outline: none;
    background-color: var(--black);
    padding: 15px 26px;
    border-radius: 4.17px;
    color: var(--white);
    font-size: 9px;
    font-weight: 400;

    margin-right: auto;
    margin-left: auto;
    display: block;

    cursor: pointer;
}


/* mission */

.mission {
    padding-bottom: 95.84px;
    margin-right: 50px;
    margin-left: 50px;
    border-bottom: 1px rgba(31, 30, 30, 0.1) solid;
    margin-bottom: 49.16px;
    text-align: center;
}

.mission h2 {
    margin-bottom: 16px;
    font-weight: 400;
    font-size: 9px;
    line-height: 13.75px;
}

.mission p {
    font-weight: 400;
    font-size: 38px;
    line-height: 45.83px;

    width: 681px;
    margin-right: auto;
    margin-left: auto;
}


/* mebel */

.mebel-inner {
    display: flex;
    align-items: center;
    justify-content: center;

    margin-bottom: 35px;
}

.mebel-inner img {
    width: 546px;
    height: 546px;
}

.mebel-inner div {
    height: 546px;
    width: 546px;
    margin-left: 8px;
    background-color: #F4EDE6;

    border-radius: 8.33px;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.mebel-inner div h3 {
    color: #425E44;
    font-weight: 400;
    font-size: 52px;
    line-height: 58.33px;

    width: 439px;
    text-align: center;

    margin-bottom: 157px;
    margin-top: 150px;
}

.mebel-inner div p {
    color: #425E44;
    font-size: 9px;
    font-weight: 400;
    line-height: 13.75px;
}

/* nothing */

.nothing-title {
    text-align: center;
    margin-bottom: 39px;
    font-size: 192px;
    font-weight: 400;
    color: var(--black);
}

.nothing-text {
    text-align: center;
    font-weight: 400;
    font-size: 21px;
    line-height: 29.17px;
    margin-bottom: 24px;
    color: var(--black);
}

.nothing button {
    padding: 15px 26px;
    font-weight: 400;
    line-height: 9.17px;
    font-size: 9px;
    font-family: var(--font);
    background-color: var(--black);
    color: var(--white);
    border-radius: 4.17px;
    border: none;
    outline: none;

    margin-right: auto;
    margin-left: auto;
    display: block;

    margin-bottom: 50px;

    transition: all .5s ease;
}

.nothing button:hover {
    opacity: 0.5;
    cursor: pointer;
}


.nothing-inner {
    margin-bottom: 235px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.nothing-inner div {
    width: 546px;
    height: 546px;
    margin-right: 8px;

    background-image: url(../images/no-img.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.nothing-inner div {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.nothing-inner div p {
    margin-bottom: 28px;
    font-size: 46px;
    line-height: 50px;
    font-weight: 400;
    color: var(--black);
    text-align: center;
    width: 330px;
}

.nothing-inner img {
    width: 546px;
    height: 546px;
}


/* put */

.put {
    margin-bottom: 65px;
}

.put-inner {
    display: flex;
    gap: 8px;
    justify-content: space-between;
}

.put-inner-left {
    width: 50%;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.put-inner-left div {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;

    width: 49%;
    height: 269px;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.put-inner-left div span {
    display: block;
    width: 150px;
    height: 150px;
    border-radius: 150px;
}

.put-inner-right {
    width: 50%;
    background: #c6bc8a;
    border-radius: 8px;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: end;
    padding-bottom: 49px;
}

.put-inner-right__wrapper div h2 {
    font-weight: 400;
    font-size: 52px;
    line-height: 112%;
    text-align: center;
    color: #425e44;

    margin-bottom: 25px;
}

.put-inner-right__wrapper div p {
    font-weight: 400;
    font-size: 20px;
    line-height: 104%;
    text-align: center;
    color: #425e44;
}

.put-inner-right__wrapper span {
    font-weight: 400;
    font-size: 9px;
    line-height: 153%;
    text-transform: uppercase;
    text-align: center;
    display: block;
    color: #425e44;

    margin-top: 163px;
}


/* sign */

.sign-inner {
    display: flex;
    justify-content: space-between;

    border-top: 1px rgba(31, 30, 30, 0.1) solid;
    border-bottom: 1px rgba(31, 30, 30, 0.1) solid;
    padding: 16px 0px;
    margin-bottom: 24px;
}

.sign-left {
    width: 70%;
    border-right: 1px rgba(31, 30, 30, 0.1) solid;
    padding-top: 34px;
    padding-bottom: 34px;
}

.sign-left h2 {
    font-weight: 400;
    font-size: 38px;
    line-height: 121%;
    color: #1f1e1e;

    margin-bottom: 8px;
}

.sign-left form {
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    display: flex;
    align-items: center;

    width: fit-content;
    padding-right: 12px;

    margin-bottom: 65px;
}

.sign-left form input {
    border: none;
    outline: none;
    font-family: var(--font);
    padding: 10px;
}

.sign-left form button {
    background-color: transparent;
    border: none;
    outline: none;
    cursor: pointer;
}

.sign-left p {
    font-weight: 400;
    font-size: 9px;
    line-height: 153%;
    text-transform: uppercase;
    color: #3c3c3c;
}

.sign-right {
    width: 30%;
    padding-left: 34px;
    padding-top: 34px;
    padding-bottom: 34px;

    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.sign-right-top {
    display: flex;
    justify-content: space-between;
}

.sign-right-top div {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.sign-right-top div h2 {
    margin-bottom: 7px;

    font-weight: 400;
    font-size: 9px;
    line-height: 153%;
    text-transform: uppercase;
    color: #3c3c3c;
}

.sign-right-top div a {
    font-weight: 400;
    font-size: 9px;
    line-height: 116%;
    text-transform: uppercase;
    color: #1f1e1e;
    text-decoration: none;
}

.sign-right-bottom {
    display: flex;
    gap: 18px;
    justify-content: center;
}

.sign-right-bottom a {
    font-weight: 400;
    font-size: 9px;
    line-height: 116%;
    text-transform: uppercase;
    color: #1f1e1e;
    text-decoration: none;
}


/* footer */

footer {
    margin-bottom: 55px;
}

.footer-inner-logo {
    width: 100%;
}

.footer-inner-last {
    display: flex;
    align-items: center;
    justify-content: space-between;

    margin-top: 32px;
}

.footer-inner-last div:first-of-type {
    gap: 100px;
}

.footer-inner-last div {
    display: flex;
    align-items: center;
    gap: 17px;
}

.footer-inner-last div p {
    font-weight: 400;
    font-size: 8px;
    line-height: 104%;
    color: #1f1e1e;
}

.footer-inner-last div a {
    font-weight: 400;
    font-size: 9px;
    line-height: 116%;
    text-transform: uppercase;
    color: #1f1e1e;
    text-decoration: none;
}


















