/* Le-Biko — Contact page. */

/* ==========================================================================
   Contact page
   ========================================================================== */
.lb-contactpage__intro { max-width: 640px; color: var(--lb-ink-soft); font-weight: 300; font-size: 16px; }
.lb-contactpage__intro p { margin: 0 0 8px; }
.lb-contactpage__grid { display: grid; gap: 32px; margin-top: 20px; align-items: start; }
@media (min-width: 900px) { .lb-contactpage__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: 48px; } }
.lb-contactpage__h2 { margin: 0 0 14px; font-size: 18px; font-weight: 500; }
.lb-channels { list-style: none; margin: 0 0 28px; padding: 0; display: grid; gap: 10px; }
.lb-channel { display: flex; align-items: center; gap: 14px; padding: 14px 16px; border: 1px solid var(--lb-line); border-radius: var(--lb-radius); text-decoration: none; transition: border-color .2s; }
.lb-channel:hover { border-color: var(--lb-ink); }
.lb-channel .lb-icon { width: 26px; height: 26px; flex: none; }
.lb-channel > span { display: flex; flex-direction: column; min-width: 0; }
.lb-channel strong { font-weight: 500; }
.lb-channel span span { font-weight: 300; color: var(--lb-ink-soft); text-align: right; overflow-wrap: anywhere; }
.lb-visit { margin-bottom: 28px; }
.lb-visit__address { display: flex; align-items: center; gap: 10px; margin: 0 0 12px; font-weight: 300; }
.lb-visit__address .lb-icon { width: 22px; height: 22px; flex: none; }
.lb-visit__nav { display: flex; flex-wrap: wrap; gap: 8px; }
.lb-visit__nav .lb-btn { margin-top: 0; min-height: 42px; }
.lb-hours p { margin: 0; font-weight: 300; line-height: 1.9; }

.lb-contactpage__form { padding: 22px; border: 1px solid var(--lb-line); border-radius: var(--lb-radius); background: #faf9f7; }
.lb-form { display: flex; flex-wrap: wrap; gap: 0 14px; }
.lb-form__row { width: 100%; margin-bottom: 14px; }
@media (min-width: 560px) { .lb-form__row--half { width: calc(50% - 7px); } }
.lb-form label { display: block; margin-bottom: 5px; font-size: 14px; font-weight: 400; }
.lb-form input, .lb-form select, .lb-form textarea {
	width: 100%; min-height: 46px; padding: 10px 12px;
	border: 1px solid var(--lb-line); border-radius: var(--lb-radius); background: #fff;
	font: inherit; font-size: 15px; color: var(--lb-ink);
}
.lb-form input[dir="ltr"] { text-align: right; }
.lb-form textarea { min-height: 120px; resize: vertical; }
.lb-form input:focus, .lb-form select:focus, .lb-form textarea:focus { outline: none; border-color: var(--lb-ink); box-shadow: 0 0 0 1px var(--lb-ink); }
.lb-req { color: var(--lb-danger); }
.lb-opt { color: var(--lb-muted); font-weight: 300; }
.lb-form__hint { width: 100%; margin: -6px 0 14px; font-size: 13px; color: var(--lb-muted); }
.lb-form__privacy { width: 100%; margin: 0 0 12px; font-size: 13px; color: var(--lb-muted); }
.lb-form__submit { width: 100%; min-height: 50px; margin-top: 0; font-size: 16px; }
.lb-formmsg { margin: 0 0 16px; padding: 12px 14px; border-radius: var(--lb-radius); font-size: 14.5px; }
.lb-formmsg--success { background: #eef5f0; color: var(--lb-success); }
.lb-formmsg--error { background: #f9ecea; color: var(--lb-danger); }