@charset "utf-8";
/* form.css — the enquiry form. lifted out of top.css when the same block
   turned up a second time on request-a-review */

.talk_area { margin-top: 100px; }

.talk_area .title_block { margin-bottom: 34px; }
.talk_area .title_block h2.white_mark { margin-bottom: 12px; }
.talk_area .title_block p { font-size: 14.5px; line-height: 2.1; color: var(--ink_soft); max-width: 640px; }

.talk_wrap { display: grid; grid-template-columns: 1fr; gap: 40px; }

.talk_col { background: var(--white); border: 1px solid var(--rule); padding: 26px 20px 28px; }

.talk_field { margin-bottom: 18px; }

.talk_field label {
	display: block;
	margin-bottom: 7px;
	font-family: var(--latin);
	font-size: 11px;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--ink_faint);
}

.talk_field label .opt { text-transform: none; letter-spacing: .04em; color: var(--rule); }

.talk_in {
	width: 100%;
	padding: 11px 12px;
	background: var(--paper);
	border: 1px solid var(--rule);
	border-radius: 0;
	color: var(--ink);
	font-family: var(--serif);
	font-size: 15px;
	line-height: 1.6;
	-webkit-appearance: none;
	appearance: none;
}

/* appearance:none took the arrow off the two selects and they read as text fields */
select.talk_in {
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%238095b0' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 12px center;
	background-size: 12px 8px;
	padding-right: 34px;
}

.talk_in:focus { outline: none; border-color: var(--blue); background: var(--white); }
.talk_in.is_wrong { border-color: #a2453a; }

textarea.talk_in { min-height: 138px; resize: vertical; }

.talk_pair { display: grid; grid-template-columns: 1fr; gap: 0; }

.talk_trap { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.talk_tick {
	display: flex;
	gap: 10px;
	align-items: flex-start;
	margin: 20px 0 22px;
	font-size: 13px;
	line-height: 1.8;
	color: var(--ink_soft);
}

.talk_tick input { margin-top: 5px; }
.talk_tick a { color: var(--ink); border-bottom: 1px solid var(--rule); }

.talk_send {
	display: inline-block;
	padding: 14px 30px;
	background: none;
	border: 1px solid var(--blue);
	color: var(--blue);
	font-family: var(--latin);
	font-size: 11px;
	letter-spacing: .18em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background .2s ease, color .2s ease;
}

.talk_send:hover { background: var(--blue); color: var(--white); }
.talk_send[disabled] { opacity: .55; cursor: default; }

.talk_shout {
	margin-bottom: 18px;
	padding: 11px 13px;
	background: #fbf1ef;
	border-left: 2px solid #a2453a;
	font-size: 13px;
	line-height: 1.8;
	color: #7c3a31;
}

.talk_done { border-left: 2px solid var(--blue); padding: 4px 0 4px 20px; }
.talk_done h2 { font-size: 18px; font-weight: 400; letter-spacing: .02em; }
.talk_done p { margin-top: 12px; font-size: 14.5px; line-height: 2.05; color: var(--ink_soft); }
.talk_done a { color: var(--blue); border-bottom: 1px solid var(--rule); }

.talk_ref {
	display: inline-block;
	padding: 4px 10px;
	border: 1px solid var(--rule);
	font-family: var(--latin);
	font-size: 13px;
	letter-spacing: .1em;
	color: var(--blue);
}

.talk_side h2 {
	margin-bottom: 16px;
	font-family: var(--latin);
	font-size: 11px;
	font-weight: 500;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--ink_faint);
}

.talk_side li {
	position: relative;
	padding-left: 20px;
	margin-bottom: 14px;
	font-size: 13.5px;
	line-height: 1.95;
	color: var(--ink_soft);
}

.talk_side li:before { content: ""; position: absolute; left: 0; top: 13px; width: 9px; height: 1px; background: var(--blue); }
.talk_side a { color: var(--blue); border-bottom: 1px solid var(--rule); }

@media screen and (min-width: 768px) {
	.talk_area { margin-top: 150px; }
	.talk_area .title_block { display: flex; gap: 40px; align-items: flex-start; }
	.talk_area .title_block h2.white_mark { margin-bottom: 0; order: 2; }
	.talk_area .title_block p { order: 1; }
	.talk_wrap { grid-template-columns: 1fr 300px; gap: 52px; }
	.talk_col { padding: 40px 40px 42px; }
	.talk_pair { grid-template-columns: 1fr 1fr; gap: 0 18px; }
}