/* ==========================================
   CONTACT PAGE
========================================== */

.contact-section{
    max-width:1200px;
    margin:0 auto;
    padding:4rem 1rem;
    display:grid;
    grid-template-columns:2fr 1fr;
    gap:2rem;
}

.contact-card,
.profile-card{
    border:1px solid var(--line);
    border-radius:var(--radius);

    background:linear-gradient(
        145deg,
        rgba(255,255,255,.05),
        rgba(255,255,255,.015)
    );

    backdrop-filter:blur(12px);

    padding:2rem;
}

.contact-title{
    margin-bottom:1rem;
    font-size:clamp(2.5rem,5vw,4rem);
    line-height:1;
}

.contact-intro{
    margin-bottom:2rem;
    color:var(--muted);
    line-height:1.7;
}

.contact-form{
    display:flex;
    flex-direction:column;
    gap:1rem;
}

.contact-row{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:1rem;
}

.contact-form input,
.contact-form textarea{

    width:100%;

    padding:1rem;

    border:1px solid var(--line);
    border-radius:var(--radius);

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

    color:var(--text);

    font:inherit;
}

.contact-form input:focus,
.contact-form textarea:focus{

    outline:none;

    border-color:rgba(2,166,180,.6);

    box-shadow:
        0 0 0 1px rgba(2,166,180,.4);
}

.contact-form textarea{
    resize:vertical;
    min-height:180px;
}

.contact-form button{
    align-self:flex-start;
    min-width:220px;
}

.contact-warning{
    margin-top:1.5rem;
    color:#ff8b8b;
    line-height:1.6;
}

.profile-card{
    text-align:center;
}

.profile-photo{
    width:180px;
    height:180px;

    border-radius:50%;

    object-fit:cover;

    display:block;

    margin:0 auto 1.5rem;

    border:2px solid rgba(2,166,180,.3);
}

.profile-card h2{
    margin-bottom:1rem;
}

.profile-card p{
    color:var(--muted);
    line-height:1.8;
}

.profile-links{
    display:flex;
    justify-content:center;
    gap:.75rem;
    margin-top:1.5rem;
}

@media (max-width:900px){

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

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

}

@media (max-width:560px){

    .contact-card,
    .profile-card{
        padding:1.25rem;
    }

    .contact-form button{
        width:100%;
    }

}

.contact-toast{

    position:fixed;

    right:24px;
    bottom:24px;

    padding:14px 18px;

    border-radius:8px;

    background:#1a3321;

    border:1px solid #2e7d32;

    color:#d7ffd9;

    z-index:9999;

    opacity:0;

    transform:translateY(12px);

    pointer-events:none;

    transition:
        opacity .25s ease,
        transform .25s ease;
}

.contact-toast.show{

    opacity:1;

    transform:translateY(0);
}

body[data-page="trial"] .contact-section{
    max-width:800px;
}

body[data-page="trial"] .contact-card{
    margin:auto;
}

body[data-page="trial"] .contact-title{
    font-size: clamp(1.25rem,2.5vw,2rem);
}





/* ==========================================
   FREE TRIAL PAGE OVERRIDES
========================================== */

body[data-page="trial"] .contact-section{
    display:flex;
    justify-content:center;
    max-width:1200px;
    margin:0 auto;
    padding:4rem 1rem;
}

body[data-page="trial"] .contact-card{
    width:800px;
    max-width:100%;
    margin:0 auto;
}

body[data-page="trial"] .contact-title{
    font-size:clamp(2rem,4vw,3.2rem);
    line-height:1.05;
    max-width:none;
}

body[data-page="trial"] .contact-intro{
    max-width:none;
}

body[data-page="trial"]{
    min-height:100vh;
    display:flex;
    flex-direction:column;
}

body[data-page="trial"] main{
    flex:1;
}