/* English editorial layouts; the shared storefront stylesheet owns all chrome. */
.qer-main {
	color: var(--q-ink);
	background: var(--q-paper);
	font-size: 18px;
	line-height: 1.6;
}

.qer-main a { color: inherit; }
.qer-main a:focus-visible,
.qer-main summary:focus-visible {
	outline: 3px solid var(--q-blue);
	outline-offset: 5px;
}
.qer-main h1,
.qer-main h2 { color: inherit; font-family: var(--q-font); }
.qer-main h1 {
	max-width: 12ch;
	margin: 0 0 25px;
	font-size: clamp(34px, 4.1vw, 61px);
	font-weight: 800;
	line-height: 1.05;
	letter-spacing: -.045em;
}
.qer-main h2 {
	max-width: 18ch;
	margin: 0;
	font-size: clamp(25px, 2.6vw, 34px);
	font-weight: 750;
	line-height: 1.15;
	letter-spacing: -.025em;
}
.qer-hero {
	display: grid;
	grid-template-columns: 1.04fr 1fr;
	max-width: 1600px;
	margin: auto;
}
.qer-hero-copy {
	align-self: center;
	padding: clamp(32px, 5vw, 80px) clamp(20px, 4vw, 60px);
}
.qer-eyebrow {
	margin: 0 0 20px;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: .11em;
	text-transform: uppercase;
}
.qer-intro {
	max-width: 40ch;
	margin: 0 0 28px;
	font-size: 21px;
	line-height: 1.5;
}
.qer-hero-image {
	display: block;
	width: 100%;
	height: 100%;
	min-height: 500px;
	object-fit: cover;
}
.qer-hero.qer-no-image { grid-template-columns: 1fr; background: var(--q-mint); }
.qer-no-image h1 { max-width: 20ch; }
.qer-no-image .qer-hero-copy { padding-right: 25vw; }
.qer-main a.qer-button {
	display: inline-flex;
	align-items: center;
	gap: 24px;
	padding: 15px 24px;
	background: var(--q-orange);
	font-size: 16px;
	font-weight: 750;
	text-decoration: none;
}
.qer-main a.qer-button:hover { background: #ef891a; }
.qer-content { max-width: 1280px; margin: auto; padding: 0 clamp(20px, 4vw, 60px) 50px; }
.qer-chapter {
	display: grid;
	grid-template-columns: 1fr 1.65fr;
	gap: clamp(25px, 6vw, 90px);
	padding: 58px 0;
	border-bottom: 1px solid var(--q-line);
}
.qer-chapter p { max-width: 66ch; }
.qer-chapter p:first-child { margin-top: 0; }
.qer-chapter p:last-child { margin-bottom: 0; }
.qer-chapter p a { text-decoration: underline; text-underline-offset: 4px; }
.qer-main .qer-text-link {
	display: inline-block;
	margin: 8px 25px 5px 0;
	font-size: 16px;
	font-weight: 700;
	text-decoration: underline;
	text-underline-offset: 5px;
}
.qer-rows { margin: 0; }
.qer-rows > div {
	display: grid;
	grid-template-columns: 135px 1fr;
	gap: 25px;
	padding: 18px 0;
	border-top: 1px solid var(--q-line);
}
.qer-rows > div:first-child { border-top: 0; padding-top: 0; }
.qer-rows dt { font-weight: 800; }
.qer-rows dd { margin: 0; }
.qer-faq details { border-top: 1px solid var(--q-line); padding: 18px 0; }
.qer-faq details:last-child { border-bottom: 1px solid var(--q-line); }
.qer-faq summary { cursor: pointer; font-weight: 750; }
.qer-faq p { padding-top: 12px; }
.qer-feature-photo {
	display: grid;
	grid-template-columns: 1fr 1fr;
	margin: 50px 0;
	background: var(--q-mist);
}
.qer-feature-photo img { width: 100%; height: 100%; object-fit: cover; }
.qer-feature-photo > div { padding: 40px; }
.qer-feature-photo h2 { max-width: 20ch; }
.qer-preferences-unavailable { padding: 20px; background: var(--q-oat); }
.qer-main :is(input, select, textarea) { max-width: 100%; }

@media (max-width: 860px) {
	/* The common mobile header places its 43px navigation row below its own box. */
	.qer-main { padding-top: 43px; }
}

@media (max-width: 760px) {
	.qer-hero { grid-template-columns: 1fr; }
	.qer-hero-copy { padding-block: 35px; }
	.qer-hero-image { height: auto; min-height: 0; max-height: 400px; aspect-ratio: 1.25; }
	.qer-main h1 { max-width: 16ch; }
	.qer-main h2 { max-width: 25ch; }
	.qer-intro { font-size: 19px; }
	.qer-chapter { grid-template-columns: 1fr; gap: 24px; padding: 35px 0; }
	.qer-rows > div { grid-template-columns: 1fr; gap: 5px; }
	.qer-feature-photo { grid-template-columns: 1fr; }
	.qer-feature-photo > div { padding: 25px; }
	.qer-no-image .qer-hero-copy { padding-right: 20px; }
}