/* Stage 3 Phase 2: contact page, ported verbatim from the Stage 2 prototype (site_src/pages_other.py) */
.c-grid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:clamp(32px,6vw,96px);align-items:start}
@media (max-width:900px){.c-grid{grid-template-columns:1fr}}
.form{display:grid;grid-template-columns:1fr 1fr;gap:22px 24px}
.form .full{grid-column:1/-1}
.form label{display:block;font-weight:700;font-size:15px;margin-bottom:8px}
.form input,.form textarea{width:100%;font:inherit;font-size:17px;padding:14px 16px;border:1.5px solid var(--line-2);border-radius:10px;background:#fff;color:var(--ink)}
.form textarea{min-height:170px;resize:vertical}
.form input:focus,.form textarea:focus{outline:0;border-color:var(--blue);box-shadow:0 0 0 4px rgba(39,79,255,.14)}
.form [aria-invalid="true"]{border-color:var(--red-deep)}
@media (max-width:600px){.form{grid-template-columns:1fr}}
.side{border-top:2px solid var(--ink);padding-top:24px}
.side dl{margin:0}
.side dt{font-size:13px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--grey);margin-top:22px}
.side dt:first-child{margin-top:0}
.side dd{margin:6px 0 0;font-size:18px}
.side .alt{margin-top:36px;padding:22px;background:var(--sand-2);border-radius:12px}
.side .alt p{font-family:var(--f-voice);font-style:italic;font-size:24px;line-height:1.15;margin-bottom:14px}
/* live handler messages, and the form's own pieces (the prototype form was a demo) */
.alert{border-radius:10px;padding:16px 18px;font-weight:600;margin-bottom:24px;max-width:46em}
.alert-ok{background:var(--green-tint);color:var(--green-deep)}
.alert-err{background:var(--red-tint);color:var(--red-deep)}
.c-grid .note{margin-bottom:24px}
.form input::placeholder,.form textarea::placeholder{color:#9AA1AE}
.side dd a{text-decoration:none}
.side dd a:hover{text-decoration:underline}