:root {
    --primary: #ffce54;
    --white: #fffaf6;
    --black: #111928;
    --success: rgb(0, 165, 80);
    --secondary: #757575;
    --secondary-50: #d7d7d7;
    --card_shadow: 0 4px 8px rgba(66,71,76,.05),0 4px 40px #eee;
    --lh: 1.4rem;
}

  /*body{
    background: #f5f5f5;*/
    /*font-family: 'Roboto', sans-serif;*/
  /*}*/
  html{
    scroll-behavior: smooth;
  }


  *{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
  }    

    .text__base{
        font-size: 15px;
        line-height: 24px;
    }

    .text__small{
        font-size: 13px;
    }

    .secondary-text{
        color: var(--secondary);
    }

    .primary-text{
        color: var(--primary);
    }

    .accordion{
        display: flex;
        flex-direction: column;
        gap: 1rem;
    }
    
    .accordion-item {
        border: 1px solid var(--secondary-50);
        border-radius: 8px;
    }
    
    .accordion-header {
        padding: 1rem;
        cursor: pointer;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    
    .accordion-content {
    padding: 10px;
    display: none;
    }

    .outline__button{
        background: #fff;
        border-radius: 8px;
        border: 1px solid var(--secondary-50);
        padding: 11px;
        font-family: inherit;
        font-size: 15px;
        font-weight:bold;
        line-height: 16px;
        letter-spacing: .4px;
        color: var(--black);
        transition: 250ms;
    }

    .outline__input{
        font-family: inherit;
        font-weight: 400;
        font-size: 15px;
        line-height: 1;
        border-radius: 6px;
        outline: none;
        box-sizing: border-box;
        border: 1px solid #d7d7d7;
        width: 100%;
        display: inline-block;
        height: 100%;
        padding: 18px;
    }
    

    .primary__text__button{
        color: var(--primary);
        border: none;
        background: transparent;
        font-size: 16px;
        transition: 250ms;
        border-bottom: 1px solid transparent;
        cursor: pointer;
    }

    .primary__text__button:hover{
        border-bottom: 1px solid var(--primary);
    }

    .outline__button:hover{
        color: var(--white);
        background: var(--primary);
    }

    .contain__button{
        background: var(--primary);
        border-radius: 8px;
        font-weight: 400;
        font-family: inherit;
        border: none;
        padding: 12px 28px;
        cursor: pointer;
        transition: 250ms;
        text-decoration: none;
        color: var(--white);
    }

    .w-full{
        width: 100%;
    }

    .centered__button{
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .button__icon{
        margin-right: .5rem;
    }


    .estate__name{
        font-size: 44px;
        color: var(--black);
        line-height: 48px;
    }

    .mb__40{
        margin-bottom: 40px;
    }

    .truncate-text {
        width: 100%; /* Set the width of the container */
        overflow: hidden; /* Hide overflowing content */
        white-space: normal; /* Allow line breaks */
        display: -webkit-box; /* Set display type for WebKit browsers */
        -webkit-line-clamp: 3; /* Limit the number of displayed lines */
        -webkit-box-orient: vertical; /* Set box orientation */
      }

    .estate__contacctUs__card{
        position: sticky;
        top: 110px;
        z-index: 7;
        background: var(--white);
        box-shadow: var(--card_shadow);
        border-radius: 16px;
        padding: 24px;
    }

    .estate__contacctUs__title{
        font-weight: 700;
        font-size: 20px;
        line-height: 24px;
        color: var(--black);
        margin-bottom: .5rem;
    }


    .estate__navigation__panel{
        position: sticky;
        top: 110px;
        z-index: 7;
        background: var(--white);
        box-shadow: var(--card_shadow);
        border-radius: 16px;
        padding: 24px;
        margin-bottom: 60px;
    }

    .estate__navigation__panel .estate__navigation__list{
        line-height: 16px;
        letter-spacing: .4px;
        cursor: pointer;
        display: flex;
        align-items: center;
        text-decoration: none;
        flex-wrap: wrap;
        list-style-type: none;
        gap: 1rem;
    }

    .estate__container{
        display: grid;
        grid-template-columns: 3fr 1fr;
        gap: 1rem;
    }

    .estate__status__list{
        display: flex;
        list-style-type: none;
        flex-wrap: wrap;
        gap: 24px;
    }

    .estate__status__list li{
        display: flex;
        align-items: center;
        gap: .3rem;
    }

    .estate__section__separetor{
        border-bottom: solid 1px var(--secondary-50);
        padding-bottom: 48px;
    }

    .estate__description{
        line-height: 1.5;
        margin-bottom: 1rem;
    }

    .estate__charackteristic{
        display: grid;
        grid-template-columns: repeat(auto-fit, 
            minmax(min(100%, 15em), 2fr)
        );
        gap: 1rem;

    }

    .estate__charackteristic__card{
        display: flex;
        flex-direction: column;
        gap: .5rem;
    }

    .estate__charackteristic__card img{
        max-width: 100%;
    }

    .estate__charackteristic__card__description{
        font-size: 13px;
        color: var(--secondary);
        font-weight: 400;
        line-height: 16px;
        letter-spacing: .4px;
        overflow-wrap: anywhere;
    }

    .estate__charackteristic__card__title{
        font-weight: 700;
        font-size: 15px;
        line-height: 24px;
    }

    .estate__contacctUs__inputList{
        margin: 1rem 0;
        display: flex;
        flex-direction: column;
        gap: .5rem;
    }

    .estate__social__list{
        display: flex;
        gap: 1rem;
        flex-wrap: wrap;
    }

    .social__card{
        display: flex;
        align-items: center;
        gap: .3rem;
        border: 1px solid var(--secondary-50);
        border-radius: 8px;
        padding: 1rem;
    }

    .social__card__title{
        font-size: 15px;
        line-height: 24px;
        font-weight: 500;
    }


    @media screen and (max-width: 1120px) {
        .estate__container{
            grid-template-columns: 1fr;
        }
    }

    @media screen and (max-width: 500px) {
       
        .estate__navigation__panel{
            display:none;
        }
    }

    @media screen and (max-width: 768px) {

        .estate__status__list{
            display:none;
        }
        .slick-slide img {
            display: block;
        }
    }

    .appartment__card{
        border: 1px solid var(--secondary-50);
        border-radius: 8px;
        overflow: hidden;
        width: 250px;
    }

    .appartment__card img{
        width: 100%;
        object-fit: cover;
    }

    .appartment__card__title{
        font-size: 18px;
        margin: 8px 0;
    }

    .appartment__card__body{
        padding: 15px;
    }

    .appartments__list{
        display: flex;
        gap: 18px;
        flex-wrap: wrap;

    }

    .appartment__card__option{
        display: flex;
        justify-content: space-between;
    }