.hc-page{
    max-width:1380px;
    margin:auto;
    padding:55px 30px 100px;
}


.hc-hero{
    margin-bottom:20px;
    padding:34px;

    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:30px;

    border-radius:24px;

    color:#fff;

    background:
        linear-gradient(
            135deg,
            #0c3428,
            #19503a
        );

    box-shadow:
        0 22px 60px
        rgba(9,40,28,.15);
}


.hc-hero h1{
    margin:7px 0;

    font-size:
        clamp(
            2.2rem,
            4vw,
            3.7rem
        );

    line-height:.95;

    letter-spacing:-.05em;
}


.hc-hero p{
    margin:0;
    color:#bdd0c4;
}


.hc-hero-actions{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
}


.hc-hero-actions .secondary{
    color:#fff!important;
    border-color:rgba(255,255,255,.20)!important;
    background:rgba(255,255,255,.08)!important;
}


.hc-flash{
    margin-bottom:18px;
    padding:14px 17px;
    border-radius:12px;
    font-weight:750;
}


.hc-flash.success{
    color:#145033;
    border:1px solid #acd2ba;
    background:#edf9f1;
}


.hc-flash.error{
    color:#862f29;
    border:1px solid #dfb2ae;
    background:#fff1ef;
}


.hc-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:17px;
}


.hc-card{
    overflow:hidden;

    border:1px solid #dbe3dc;
    border-radius:21px;

    background:#fff;

    box-shadow:
        0 13px 40px
        rgba(15,43,30,.06);
}


.hc-preview{
    position:relative;
    height:255px;
    overflow:hidden;
    background:#dfe6e0;
}


.hc-preview img{
    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
}


.hc-preview::after{
    content:"";
    position:absolute;
    inset:0;

    background:
        linear-gradient(
            transparent 40%,
            rgba(6,25,17,.75)
        );
}


.hc-preview>div{
    position:absolute;
    z-index:2;
    left:20px;
    bottom:17px;

    display:flex;
    flex-direction:column;
}


.hc-preview span{
    color:#dff25c;
    font-size:.59rem;
    font-weight:850;
    letter-spacing:.13em;
}


.hc-preview strong{
    margin-top:5px;
    color:#fff;
    font-size:1.15rem;
}


.hc-form{
    padding:22px;

    display:flex;
    flex-direction:column;
    gap:14px;
}


.hc-form label{
    display:flex;
    flex-direction:column;
    gap:7px;
}


.hc-form label>span{
    color:#355342;
    font-size:.70rem;
    font-weight:800;
}


.hc-form input,
.hc-form textarea{
    width:100%;

    border:1px solid #d5ded7;
    border-radius:10px;

    background:#fbfcfa;
}


.hc-form input{
    min-height:44px;
}


.hc-form textarea{
    padding:12px;
    resize:vertical;
}


.hc-form small{
    color:#808a84;
    font-size:.64rem;
    line-height:1.45;
}


.hc-file{
    padding:14px;

    border:1px dashed #cbd7cd;
    border-radius:12px;

    background:#f5f8f5;
}


.hc-save{
    margin-top:3px;
}


@media(max-width:900px){

    .hc-grid{
        grid-template-columns:1fr;
    }

}


@media(max-width:650px){

    .hc-page{
        padding:30px 15px 70px;
    }

    .hc-hero{
        align-items:flex-start;
        flex-direction:column;
    }

    .hc-preview{
        height:220px;
    }

}