/*==================================================
LEGANZA — DESIGNER PHOTO UPLOAD
==================================================*/

.designer-upload{
    position:relative;
    padding:120px 0;
    overflow:hidden;
    background:
        radial-gradient(circle at 14% 18%, rgba(185,141,79,.12), transparent 32%),
        #101010;
    color:#fff;
}

.designer-upload::before{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background:
        linear-gradient(115deg, rgba(255,255,255,.025), transparent 35%),
        linear-gradient(to bottom, rgba(255,255,255,.025), transparent 1px);
    background-size:auto, 100% 68px;
}

.designer-upload .container{
    position:relative;
    z-index:1;
}

.designer-upload-grid{
    display:grid;
    grid-template-columns:minmax(0,.9fr) minmax(520px,1.1fr);
    gap:76px;
    align-items:start;
}

.designer-upload-intro{
    max-width:640px;
}

.designer-upload-kicker{
    display:block;
    margin-bottom:22px;
    color:#c59a5c;
    font-size:12px;
    letter-spacing:.28em;
}

.designer-upload h2{
    margin:0 0 26px;
    color:#fff;
    font-size:clamp(42px,4.4vw,68px);
    line-height:1.02;
    font-weight:400;
}

.designer-upload-intro > p{
    max-width:590px;
    margin:0;
    color:rgba(255,255,255,.68);
    font-size:16px;
    line-height:1.75;
}

.designer-upload-notes{
    display:grid;
    gap:0;
    margin-top:54px;
    border-top:1px solid rgba(255,255,255,.14);
}

.designer-upload-notes > div{
    display:grid;
    grid-template-columns:46px 1fr;
    gap:18px;
    align-items:start;
    padding:19px 0;
    border-bottom:1px solid rgba(255,255,255,.14);
}

.designer-upload-notes strong{
    color:#c59a5c;
    font-size:12px;
    letter-spacing:.12em;
}

.designer-upload-notes span{
    color:rgba(255,255,255,.76);
    font-size:14px;
    line-height:1.55;
}

.designer-upload-panel{
    padding:38px;
    border:1px solid rgba(255,255,255,.12);
    background:rgba(255,255,255,.035);
    box-shadow:0 24px 80px rgba(0,0,0,.24);
    backdrop-filter:blur(8px);
    -webkit-backdrop-filter:blur(8px);
}

.designer-upload-form{
    display:grid;
    gap:18px;
}

.designer-fields-row{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px;
}

.designer-upload-form input[type="text"],
.designer-upload-form input[type="tel"],
.designer-upload-form input[type="email"],
.designer-upload-form textarea{
    box-sizing:border-box;
    width:100%;
    min-width:0;
    padding:16px 0;
    border:0;
    border-bottom:1px solid rgba(255,255,255,.22);
    outline:0;
    background:transparent;
    color:#fff;
    font:inherit;
}

.designer-upload-form textarea{
    min-height:94px;
    resize:vertical;
}

.designer-upload-form input::placeholder,
.designer-upload-form textarea::placeholder{
    color:rgba(255,255,255,.45);
}

.designer-upload-form input:focus,
.designer-upload-form textarea:focus{
    border-bottom-color:#c59a5c;
}

.designer-file-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px;
    margin-top:8px;
}

.designer-file{
    position:relative;
    min-height:210px;
    padding:24px;
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
    border:1px dashed rgba(255,255,255,.26);
    background:rgba(255,255,255,.025);
    cursor:pointer;
    transition:border-color .2s ease, background .2s ease, transform .2s ease;
}

.designer-file:hover{
    border-color:#c59a5c;
    background:rgba(197,154,92,.07);
    transform:translateY(-2px);
}

.designer-file.has-files{
    border-style:solid;
    border-color:rgba(197,154,92,.75);
    background:rgba(197,154,92,.06);
}

.designer-file input{
    position:absolute;
    width:1px;
    height:1px;
    opacity:0;
    pointer-events:none;
}

.designer-file-icon{
    margin-bottom:auto;
    color:#c59a5c;
    font-size:34px;
    font-weight:200;
    line-height:1;
}

.designer-file strong{
    margin-bottom:8px;
    color:#fff;
    font-size:17px;
    font-weight:500;
}

.designer-file small{
    color:rgba(255,255,255,.45);
    font-size:11px;
    line-height:1.5;
}

.designer-file-name{
    display:block;
    margin-top:14px;
    color:#c59a5c;
    font-size:12px;
}

.designer-upload-limit{
    margin:0;
    color:rgba(255,255,255,.42);
    font-size:11px;
    line-height:1.5;
}

.designer-upload-form .btn{
    width:100%;
    margin-top:4px;
}

.designer-upload-form .form-message{
    margin-top:4px;
}

/* iPad Air / large tablets */
@media (min-width:769px) and (max-width:1200px){
    .designer-upload{
        padding:90px 0;
    }

    .designer-upload-grid{
        grid-template-columns:1fr;
        gap:48px;
    }

    .designer-upload-intro{
        max-width:760px;
    }

    .designer-upload h2{
        max-width:780px;
        font-size:48px;
    }
}

/* Mobile */
@media (max-width:768px){
    .designer-upload{
        padding:76px 0;
    }

    .designer-upload-grid{
        grid-template-columns:1fr;
        gap:38px;
    }

    .designer-upload-panel{
        padding:24px 18px;
    }

    .designer-upload h2{
        font-size:34px;
    }

    .designer-fields-row,
    .designer-file-grid{
        grid-template-columns:1fr;
    }

    .designer-file{
        min-height:170px;
    }

    .designer-upload-notes{
        margin-top:36px;
    }
}

@media (max-width:390px){
    .designer-upload{
        padding:64px 0;
    }

    .designer-upload h2{
        font-size:30px;
    }

    .designer-upload-panel{
        padding:20px 14px;
    }
}