/*======================================================
    CONTACT FORM
======================================================*/

form{
    width:100%;
}

.form-step{

    display:none;

    padding:40px;

    border-radius:28px;

    background:rgba(255,255,255,.035);

    border:1px solid rgba(255,255,255,.07);

    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);

    transition:.35s ease;

}

.form-step.active{
    display:block;
}

.form-step:hover{

    border-color:rgba(184,115,51,.24);

    box-shadow:0 25px 70px rgba(0,0,0,.30);

}

/*======================================================
    STEP HEADER
======================================================*/

.step-header{

    text-align:center;

    margin-bottom:42px;

}

.step-number{

    display:inline-flex;

    align-items:center;
    justify-content:center;

    width:64px;
    height:64px;

    margin-bottom:22px;

    border-radius:50%;

    background:rgba(184,115,51,.12);

    border:1px solid rgba(184,115,51,.35);

    color:#fff;

    font-weight:700;

}

.step-header h2{

    color:var(--primary);

    font-size:clamp(2rem,2.5vw,3rem);

    margin-bottom:18px;

}

.step-header p{

    max-width:620px;

    margin:auto;

    color:rgba(255,255,255,.70);

}

/*======================================================
    GRID
======================================================*/

.form-grid{

    display:grid;

    grid-template-columns:repeat(2,minmax(0,1fr));

    gap:26px;

}

/*======================================================
    FIELDS
======================================================*/

.field,
.input-group{

    margin-bottom:24px;

}

.field label,
.input-group label{

    display:block;

    margin-bottom:10px;

    color:#fff;

    font-size:.9rem;

    font-weight:600;

}

/*======================================================
    INPUTS
======================================================*/

.contact-page input,
.contact-page select,
.contact-page textarea{

    width:100%;

    border:none;

    border-radius:18px;

    background:rgba(255,255,255,.05);

    border:1px solid rgba(255,255,255,.08);

    color:#fff;

    font-size:15px;

    transition:.3s;

}

.contact-page input,
.contact-page select{

    height:60px;

    padding:0 18px;

}

.contact-page textarea{

    min-height:220px;

    padding:18px;

    resize:vertical;

}

.contact-page input:focus,
.contact-page select:focus,
.contact-page textarea:focus{

    outline:none;

    border-color:rgba(184,115,51,.55);

    box-shadow:0 0 0 4px rgba(184,115,51,.12);

}

.contact-page input::placeholder,
.contact-page textarea::placeholder{

    color:rgba(255,255,255,.45);

}

/*======================================================
    PHONE
======================================================*/

.phone-wrapper{

    display:flex;

    align-items:center;

    border-radius:18px;

    overflow:hidden;

    background:rgba(255,255,255,.05);

    border:1px solid rgba(255,255,255,.08);

}

.phone-code{

    min-width:90px;

    height:60px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-right:1px solid rgba(255,255,255,.08);

    color:var(--primary);

    font-weight:700;

}

.phone-wrapper input{

    border:none !important;

    background:transparent !important;

    box-shadow:none !important;

}

/*======================================================
    BUTTONS
======================================================*/

.buttons,
.step-actions{

    display:flex;

    justify-content:center;

    gap:18px;

    margin-top:36px;

}

.next-btn,
.button{

    min-width:180px;

    height:58px;

    border-radius:18px;

    transition:.3s;

}

.next-btn:hover,
.button:hover{

    transform:translateY(-4px);

}

/*======================================================
    REVIEW
======================================================*/

.review-card{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:18px;

    margin-bottom:34px;

}

.review-item{

    padding:18px;

    border-radius:20px;

    background:rgba(255,255,255,.04);

    border:1px solid rgba(255,255,255,.08);

    transition:.3s;

}

.review-item:hover{

    transform:translateY(-4px);

    border-color:rgba(184,115,51,.35);

}

.review-item span{

    display:block;

    margin-bottom:8px;

    color:rgba(255,255,255,.55);

    font-size:.78rem;

    text-transform:uppercase;

}

.review-item strong{

    color:#fff;

}

.project-review{

    padding:22px;

    border-radius:22px;

    background:rgba(255,255,255,.04);

    border:1px solid rgba(255,255,255,.08);

}

.review-message{

    margin-top:14px;

    color:rgba(255,255,255,.75);

    line-height:1.8;

}

/*======================================================
    PRIVACY CONSENT — CONTACT FORM
======================================================*/

.privacy-consent-block{
    width:100%;
    margin:28px 0 26px;
    text-align:left;
}

.privacy-note{
    margin:0 0 18px !important;
    text-align:left !important;

    color:rgba(255,255,255,.78);

    font-size:.92rem;
    line-height:1.65;
    font-weight:500;
}

.privacy-note a{
    color:#B87333;
    text-decoration:none;
}

.privacy-note a:hover{
    text-decoration:underline;
}

.privacy-custom-checkbox{
    width:100% !important;

    display:grid !important;
    grid-template-columns:22px minmax(0,1fr) !important;
    column-gap:14px !important;
    align-items:flex-start !important;

    margin:0 !important;
    padding:0 !important;

    position:relative !important;

    text-align:left !important;

    cursor:pointer;
}

.privacy-custom-checkbox input[type="checkbox"]{
    position:absolute !important;
    left:0 !important;
    top:0 !important;

    width:22px !important;
    height:22px !important;

    margin:0 !important;
    padding:0 !important;

    opacity:0 !important;

    cursor:pointer;

    z-index:2;
}

.privacy-box{
    width:20px;
    height:20px;

    margin-top:3px;

    display:block;

    border-radius:6px;

    background:rgba(255,255,255,.06);
    border:1px solid rgba(255,255,255,.28);

    box-shadow:inset 0 1px rgba(255,255,255,.10);

    transition:.2s ease;
}

.privacy-text{
    display:block !important;

    width:100% !important;

    margin:0 !important;
    padding:0 !important;

    color:rgba(255,255,255,.84);

    font-size:.88rem;
    line-height:1.65;
    font-weight:600;

    text-align:left !important;
    white-space:normal !important;
}

.privacy-custom-checkbox input[type="checkbox"]:checked + .privacy-box{
    background:#B87333;
    border-color:#B87333;
}

.privacy-custom-checkbox input[type="checkbox"]:checked + .privacy-box::after{
    content:"";
    display:block;

    width:5px;
    height:10px;

    margin:3px auto 0;

    border:solid #fff;
    border-width:0 2px 2px 0;

    transform:rotate(45deg);
}