.page-contact .contact-hero-grid{
display:grid;
grid-template-columns:1.2fr 0.9fr;
gap:36px;
align-items:start;
}

.page-contact .contact-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:14px;
}

.page-contact .contact-card{
border:1px solid var(--line);
border-radius:var(--radius);
background:var(--bg-soft);
padding:18px;
}

.page-contact .contact-card p{
color:var(--text-soft);
font-size:14px;
margin-bottom:10px;
}

.page-contact .contact-form{
display:flex;
flex-direction:column;
gap:16px;
}

.page-contact .form-row{
display:grid;
grid-template-columns:1fr 1fr;
gap:12px;
}

.page-contact .form-field{
display:flex;
flex-direction:column;
gap:6px;
}

.page-contact .form-field label{
font-size:13px;
color:var(--text-soft);
}

.page-contact input,
.page-contact textarea{
background:var(--panel);
border:1px solid var(--line);
border-radius:6px;
padding:10px;
color:var(--text);
}

.page-contact textarea{
resize:vertical;
}

.page-contact input:focus,
.page-contact textarea:focus{
outline:none;
border-color:var(--accent);
}

.form-status {
    margin-top: 10px;
    font-size: 14px;
    color: var(--text-soft);
}

.form-status.success {
    color: var(--accent);
}

.form-status.error {
    color: var(--danger);
}

.cta-icon-file {
    width: 20px;
    height: 20px;
    display: block;
    flex: 0 0 auto;
    filter: brightness(0) invert(1);
    transition: filter 0.2s ease;
}

.icon-btn:hover .cta-icon-file,
.icon-btn:focus-visible .cta-icon-file {
    filter: brightness(0) saturate(100%) invert(75%) sepia(66%) saturate(515%) hue-rotate(3deg) brightness(98%) contrast(95%);
}

.maintainer-links {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 12px;
}

.maintainer-photo {
    width: 100px;
    height: 100px;
    object-fit: cover;
    object-position: center;
    display: block;
    border-radius: 20%;
    border: 1px solid var(--line);
    margin-bottom: 12px;
}

.maintainer-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    height: 100%;
}

.maintainer-card h3 {
    margin: 0 0 6px;
}

.maintainer-role {
    margin: 0 0 10px;
    color: var(--accent);
    font-size: 13px;
    font-weight: 600;
}

.maintainer-card p:last-of-type {
    margin-bottom: 0;
}

.maintainer-links {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: auto;
    padding-top: 14px;
}


@media(max-width:960px){

.page-contact .contact-hero-grid{
grid-template-columns:1fr;
}

.page-contact .contact-grid{
grid-template-columns:1fr;
}

.page-contact .form-row{
grid-template-columns:1fr;
}

}