.conversions-hero{
    padding-top:3rem;
    padding-bottom:2rem;
}

.conversions-hero h1{
    margin:.35rem 0 1rem;
    font-size:clamp(2.6rem,7vw,5rem);
    line-height:.95;
    letter-spacing:-.06em;
}

.conversions-hero p{
    max-width:760px;
}

.conversion-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:1rem;
    margin-bottom:1rem;
}

.conversion-card{
    display:flex;
    flex-direction:column;
    gap:.25rem;
}

.form-group{
    display:flex;
    flex-direction:column;
    gap:.45rem;
    margin-top:.75rem;
}

.form-group label{
    font-size:.92rem;
    font-weight:700;
    opacity:.88;
}

.form-group input,
.form-group select{
    width:100%;
}

.conversion-result{
    margin-top:1rem;
    padding:1rem 1.1rem;
    border-radius:18px;
    background:rgba(122,46,230,.12);
    border:1px solid rgba(122,46,230,.24);
    font-weight:700;
    min-height:58px;
    display:flex;
    align-items:center;
}

.socket-reference-card,
.measurement-notes-card{
    margin-top:1rem;
}

.section-heading{
    margin-bottom:1rem;
}

.section-heading h2{
    margin:0 0 .45rem;
}

.section-heading p{
    margin:0;
    opacity:.82;
}

.conversion-table-wrap{
    overflow-x:auto;
}

.conversion-table{
    width:100%;
    border-collapse:collapse;
}

.conversion-table th,
.conversion-table td{
    padding:1rem;
    text-align:left;
    border-bottom:1px solid rgba(255,255,255,.08);
}

.conversion-table th{
    font-weight:700;
}

.measurement-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:1rem;
}

.measurement-note{
    padding:1rem;
    border-radius:18px;
    background:rgba(255,255,255,.03);
    border:1px solid rgba(255,255,255,.08);
}

.measurement-note h3{
    margin:0 0 .45rem;
    font-size:1rem;
}

.measurement-note p{
    margin:0;
    opacity:.82;
}

@media (max-width:900px){

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

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

@media (max-width:640px){

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

    .conversion-table th,
    .conversion-table td{
        padding:.8rem;
    }
}