/*
 * Content pages: about, trade, careers, lookbooks, design studio, Signature,
 * the policy and FAQ pages, gift cards, Zip, Latitude, contact, order
 * tracking and the store finder. Loaded only on those pages (functions.php).
 *
 * Measured off the reference renders in the scratch refshots: a 1440px page
 * with content held to ~930px for copy, banners at the container's width,
 * grey bands of #ededed, uppercase letterspaced small headings in the sans
 * and mixed-case headings in the serif.
 */

/* ─── Shared ──────────────────────────────────────────────────────────────── */

.site-main--page {
	padding-block-end: 80px;
}

.site-main--page .page-title {
	padding-block: 40px 16px;
}

.page-banner {
	margin-block-start: 10px;
}

.page-banner--full {
	margin-block-start: 0;
}

.page-banner__image {
	display: block;
	width: 100%;
	height: auto;
}

.page-intro {
	max-width: 930px;
	margin: 0 auto 50px;
	font-size: var(--fs-body);
	line-height: 1.6;
	text-align: center;
}

.page-intro p {
	margin: 0 0 0.8em;
}

.page-intro--wide {
	max-width: 930px;
}

.page-intro--clamp .page-intro__body {
	display: -webkit-box;
	overflow: hidden;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

.page-intro--clamp.is-open .page-intro__body {
	display: block;
}

.page-intro__more {
	padding: 0;
	border: 0;
	background: none;
	color: var(--color-ink);
	font: inherit;
	text-decoration: underline;
	text-underline-offset: 3px;
	cursor: pointer;
}

.page-prose {
	max-width: 1100px;
	margin-inline: auto;
	font-size: var(--fs-body);
	line-height: 1.65;
}

.page-prose h2 {
	margin: 1.8em 0 0.6em;
	font-family: var(--font-body);
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.page-prose h3 {
	margin: 1.4em 0 0.5em;
	font-size: 15px;
	font-weight: 600;
}

.page-prose p,
.page-prose ul,
.page-prose ol {
	margin: 0 0 1em;
}

.page-prose a {
	color: var(--color-ink);
	text-decoration: underline;
}

.page-prose table {
	display: block;
	width: 100%;
	margin: 0 0 1.4em;
	overflow-x: auto;
	overflow-y: hidden;
	border-collapse: collapse;
}

.page-prose td,
.page-prose th {
	padding: 8px 12px;
	border: 1px solid var(--color-border);
	text-align: start;
	vertical-align: top;
}

.page-prose--about h2 {
	margin-block-start: 1.2em;
	text-align: center;
}

.page-prose--about p {
	text-align: center;
}

.page-figure {
	margin: 30px 0 40px;
}

.page-figure img {
	display: block;
	width: 100%;
	height: auto;
}

/* Grey slab button — Latitude's offers and the careers table. */
.btn--grey {
	min-height: 40px;
	padding: 10px 16px;
	background: #878787;
	color: var(--color-white);
	font-size: 13px;
}

.btn--grey:hover {
	background: var(--color-charcoal);
	color: var(--color-white);
}

/* ─── Grouped accordions (FAQs, material care, Signature terms, Latitude) ─── */

.page-sections {
	max-width: 930px;
	margin-inline: auto;
}

.info-group {
	margin-block-end: 50px;
}

.info-group__title {
	margin: 0 0 18px;
	font-family: var(--font-heading);
	font-size: var(--fs-section);
	font-weight: 400;
	letter-spacing: 0.04em;
	text-align: center;
	text-transform: uppercase;
}

.info-group__title:empty,
.page-sections .description:empty {
	display: none;
}

.info-group__intro {
	margin-block-end: 20px;
	line-height: 1.6;
}

.accordion {
	border-block-start: 1px solid var(--color-border);
}

.accordion:empty {
	border: 0;
}

.accordion__item {
	border-block-end: 1px solid var(--color-border);
}

.accordion__summary {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	padding: 18px 0;
	font-size: 15px;
	font-weight: 500;
	list-style: none;
	cursor: pointer;
}

.accordion__summary::-webkit-details-marker {
	display: none;
}

/* A drawn plus that loses its upright when open. */
.accordion__sign {
	position: relative;
	flex: 0 0 12px;
	width: 12px;
	height: 12px;
}

.accordion__sign::before,
.accordion__sign::after {
	position: absolute;
	top: 50%;
	left: 0;
	width: 12px;
	height: 1px;
	background: currentColor;
	content: "";
	transition: transform 0.2s ease;
}

.accordion__sign::after {
	transform: rotate(90deg);
}

.accordion__item[open] .accordion__sign::after {
	transform: rotate(0deg);
}

.accordion__body {
	padding: 0 0 20px;
	line-height: 1.65;
}

.accordion__body p {
	margin: 0 0 0.9em;
}

.accordion__body img {
	max-width: 100%;
	height: auto;
}

.accordion--caps .accordion__summary {
	padding-block: 22px;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

/* ─── Careers ─────────────────────────────────────────────────────────────── */

.careers-intro {
	max-width: 930px;
	margin: 0 auto 50px;
	line-height: 1.6;
	text-align: center;
}

.careers-table-wrap {
	max-width: 1100px;
	margin-inline: auto;
	overflow-x: auto;
	overflow-y: hidden;
}

.careers-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 15px;
}

.careers-table th {
	padding: 14px 12px;
	border-block-end: 1px solid var(--color-ink);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-align: start;
	text-transform: uppercase;
}

.careers-table td {
	padding: 14px 12px;
	border-block-end: 1px solid var(--color-border);
	vertical-align: middle;
}

.careers-table__role {
	font-weight: 500;
}

.careers-table__action {
	text-align: end;
}

/* ─── Lookbooks ───────────────────────────────────────────────────────────── */

.looks-count {
	margin: 0 0 20px;
	color: var(--color-text-muted);
	font-size: 14px;
	text-align: center;
}

/*
 * The editorial pattern, nine to a set: a large look spanning two columns and
 * two rows with two small beside it, a row of three, then two small and a
 * large on the other side.
 */
.looks-grid {
	display: grid;
	grid-auto-flow: dense;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.looks-grid__item:nth-child(9n + 1) {
	grid-column: 1 / span 2;
	grid-row: span 2;
}

.looks-grid__item:nth-child(9n + 9) {
	grid-column: 2 / span 2;
	grid-row: span 2;
}

.looks-grid__link {
	height: 100%;
}

.looks-grid__image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	aspect-ratio: 1;
}

.looks-progress {
	margin: 40px 0 0;
	color: var(--color-text-muted);
	font-size: 14px;
	text-align: center;
}

/* ─── Contact ─────────────────────────────────────────────────────────────── */

.contact-help {
	max-width: 930px;
	margin: 0 auto 60px;
	line-height: 1.6;
	text-align: center;
}

.contact-help__title,
.contact-team__title {
	margin: 0 0 14px;
	font-family: var(--font-body);
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.contact-help a,
.contact-team a {
	color: var(--color-ink);
	text-decoration: underline;
}

.contact-help .contact-help__cta {
	margin-block-start: 10px;
	text-decoration: none;
	color: var(--color-white);
}

.contact-teams {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 40px;
	max-width: 1100px;
	margin-inline: auto;
	padding-block-start: 40px;
	border-block-start: 1px solid var(--color-border);
	text-align: center;
}

.contact-team__copy {
	margin: 0;
	line-height: 1.6;
	overflow-wrap: anywhere;
}

/* ─── Track order ─────────────────────────────────────────────────────────── */

.track-intro {
	max-width: 930px;
	margin: 0 auto 40px;
	line-height: 1.6;
	text-align: center;
}

.track-intro a {
	color: var(--color-ink);
}

.track-form {
	max-width: 460px;
	margin-inline: auto;
}

.track-form__fields {
	display: grid;
	gap: 16px;
}

.track-form .btn {
	width: 100%;
}

/* ─── Gift cards ──────────────────────────────────────────────────────────── */

.giftcards-options {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
	align-items: center;
	gap: 40px;
	max-width: 1100px;
	margin: 0 auto 70px;
	text-align: center;
}

.giftcards-or {
	margin: 0;
	font-family: var(--font-heading);
	font-size: 22px;
}

.giftcards-option__photo {
	margin-block-end: 20px;
}

.giftcards-option__image {
	display: block;
	width: 100%;
	height: auto;
}

.giftcards-option__title,
.giftcards-balance__title,
.giftcards-terms__title {
	margin: 0 0 12px;
	font-family: var(--font-body);
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.giftcards-option__copy {
	margin: 0 0 20px;
	line-height: 1.6;
}

.giftcards-balance {
	max-width: 460px;
	margin: 0 auto 60px;
	text-align: center;
}

.giftcards-balance__subtitle {
	margin: 0 0 18px;
}

.giftcards-balance__form {
	display: grid;
	gap: 14px;
}

.giftcards-terms {
	max-width: 930px;
	margin-inline: auto;
	line-height: 1.6;
	text-align: center;
}

/* ─── Trade ───────────────────────────────────────────────────────────────── */

.trade-intro {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 70px;
	max-width: 930px;
	margin: 0 auto 60px;
}

.trade-intro__image {
	display: block;
	width: 100%;
	height: auto;
}

.trade-benefits {
	text-align: center;
}

.trade-benefits__title,
.trade-form__title {
	margin: 0 0 14px;
	font-family: var(--font-body);
	font-size: 16px;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.trade-benefits__lead {
	margin: 0 0 20px;
	line-height: 1.6;
}

.trade-benefits__list {
	margin: 0 0 30px;
	padding: 0;
	list-style: none;
}

.trade-benefits__item {
	margin-block-end: 22px;
}

.trade-benefits__item p {
	margin: 10px 0 0;
	line-height: 1.6;
}

.trade-benefits__icon {
	width: auto;
	height: 40px;
	margin-inline: auto;
}

.trade-benefits__signin strong {
	margin-inline-end: 8px;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.trade-benefits__signin a {
	color: var(--color-ink);
}

.trade-form {
	max-width: 930px;
	margin-inline: auto;
}

.trade-form__title {
	margin-block-end: 30px;
}

.trade-form__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 16px 30px;
}

.trade-form__field {
	grid-column: span 2;
	margin: 0;
}

.trade-form__field--full {
	grid-column: 1 / -1;
}

.trade-form__field--quarter {
	grid-column: span 1;
}

.trade-form__consent {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	margin-block-start: 8px;
	font-size: 11px;
	line-height: 1.4;
}

.trade-form__consent input {
	flex: 0 0 auto;
	margin: 1px 0 0;
}

.trade-form__consent a {
	color: var(--color-ink);
}

.trade-form__strength {
	margin: 0;
	padding: 12px 15px;
	background: #f4f4f4;
	font-size: 14px;
}

.trade-form__strength[data-score="1"] {
	background: #ffe4e1;
}

.trade-form__strength[data-score="2"] {
	background: #ffefcf;
}

.trade-form__strength[data-score="3"],
.trade-form__strength[data-score="4"] {
	background: #e3f1d5;
}

.trade-form__shopped {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px 40px;
	margin-block-start: 10px;
	padding: 0;
	border: 0;
}

.trade-form__shopped legend {
	float: left;
	margin-inline-end: 10px;
	padding: 0;
	font-weight: 600;
	letter-spacing: 0.04em;
}

.trade-form__shopped label {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	cursor: pointer;
}

.trade-form__shopped input {
	width: 20px;
	height: 20px;
	margin: 0;
	accent-color: var(--color-charcoal);
}

.trade-form__actions {
	margin: 60px 0 0;
	text-align: center;
}

.trade-form__submit {
	min-width: 330px;
}

/* ─── Design Studio ───────────────────────────────────────────────────────── */

.studio-steps {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	align-items: center;
	gap: 40px;
	max-width: 930px;
	margin: 0 auto 50px;
}

.studio-steps__image {
	display: block;
	width: 100%;
	height: auto;
}

.studio-steps__body {
	text-align: center;
}

.studio-steps__list {
	margin: 0 0 24px;
	padding: 0;
	list-style: none;
	counter-reset: studio-step;
}

.studio-steps__item {
	margin-block-end: 14px;
	font-size: 14px;
	line-height: 1.6;
	counter-increment: studio-step;
}

.studio-steps__item::before {
	display: block;
	font-family: var(--font-heading);
	font-size: 30px;
	line-height: 1.2;
	content: counter(studio-step) ".";
}

.studio-steps__cta {
	min-width: 230px;
}

.studio-band {
	padding-block: 30px 30px;
	background: var(--color-surface);
	text-align: center;
}

.studio-band--closing {
	margin-block-start: 40px;
	padding-block: 34px 34px;
}

.studio-band__copy {
	max-width: 930px;
	margin: 0 auto 20px;
	font-size: 14px;
	line-height: 1.6;
}

.studio-eyebrow {
	margin: 0 0 6px;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.studio-heading {
	margin: 0 0 24px;
	font-family: var(--font-heading);
	font-size: clamp(22px, 2.3vw, 32px);
	font-weight: 400;
	letter-spacing: 0.02em;
}

.studio-services {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 30px;
	max-width: 930px;
	margin-inline: auto;
}

.studio-services__image,
.studio-features__image {
	display: block;
	width: 100%;
	height: auto;
}

.studio-services__photo {
	aspect-ratio: 1.17;
}

.studio-services__photo .studio-services__image {
	height: 100%;
	object-fit: cover;
}

.studio-services__title {
	margin: 16px 0 10px;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.studio-services__copy,
.studio-features__copy {
	margin: 0;
	font-size: 14px;
	line-height: 1.6;
}

.studio-features {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 30px;
	max-width: 930px;
	margin: 50px auto 0;
	text-align: center;
}

.studio-features__photo {
	margin-block-end: 18px;
}

.studio-features__copy {
	max-width: 420px;
	margin: 0 auto 20px;
}

.studio-features .btn {
	min-width: 230px;
}

/* ─── Signature Loyalty ───────────────────────────────────────────────────── */

.signature-hero {
	position: relative;
	overflow: hidden;
	margin-block-start: 10px;
	background: #1d1d1d;
}

.signature-hero__image {
	display: block;
	width: 100%;
	height: auto;
}

.signature-hero__overlay {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 20px;
	color: var(--color-white);
	text-align: center;
}

.signature-hero__eyebrow {
	margin: 0;
	font-size: clamp(11px, 1vw, 14px);
	font-weight: 500;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.signature-script {
	display: block;
	margin: 0;
	font-family: var(--font-script);
	font-size: 44px;
	font-weight: 400;
	line-height: 1.1;
	letter-spacing: 0;
	text-transform: none;
}

.signature-script--hero {
	font-size: clamp(64px, 11vw, 160px);
}

.signature-invite {
	max-width: 800px;
	margin-inline: auto;
	padding-block: 50px;
	line-height: 1.6;
	text-align: center;
}

.signature-invite p {
	margin: 0 0 24px;
}

.signature-invite__actions {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 16px 30px;
}

.signature-invite__actions .btn,
.signature-benefits > .btn {
	min-width: 220px;
}

.signature-story {
	padding-block: 40px;
	background: var(--color-surface);
}

.signature-story__inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	align-items: center;
	gap: 30px;
	max-width: 960px;
}

.signature-story__image {
	display: block;
	width: 100%;
	max-width: 450px;
	height: auto;
}

.signature-story__body {
	font-size: 14px;
	line-height: 1.7;
	text-align: center;
}

.signature-story__title {
	margin: 0 0 20px;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.signature-benefits {
	padding-block: 50px 40px;
	text-align: center;
}

.signature-benefits__title {
	margin: 0 0 20px;
	font-weight: 400;
}

.signature-benefits__eyebrow {
	display: block;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.signature-benefits__list {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 20px;
	max-width: 900px;
	margin: 0 auto 30px;
	padding: 0;
	list-style: none;
}

.signature-benefits__photo {
	aspect-ratio: 0.8;
}

.signature-benefits__image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.signature-benefits__name {
	margin: 12px 0 8px;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.signature-benefits__copy {
	margin: 0;
	font-size: 14px;
	line-height: 1.55;
}

.signature-gallery {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	max-width: var(--container-max);
	margin-inline: auto;
	padding-inline: var(--container-pad);
}

.signature-gallery__image {
	display: block;
	width: 100%;
	height: auto;
}

/* ─── Zip ─────────────────────────────────────────────────────────────────── */

.zip-page {
	--zip-ink: #1a0826;
	--zip-lilac: #aa8fff;
	--zip-purple: #411361;
	--zip-cream: #fffffa;
	--zip-panel: #f5f3ee;
	margin-block-start: 30px;
	background: var(--zip-cream);
	color: var(--zip-ink);
	font-family: system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
}

.zip-hero {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	justify-content: space-between;
	gap: 30px;
	overflow: hidden;
	padding: 70px 12% 90px;
	background:
		linear-gradient(100deg, transparent 72%, var(--zip-lilac) 72%) no-repeat,
		var(--zip-ink);
	color: var(--color-white);
}

.zip-hero::before {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 8%;
	height: 38%;
	background: var(--zip-lilac);
	clip-path: polygon(0 0, 80% 0, 100% 100%, 0 100%);
	content: "";
}

.zip-hero__copy {
	position: relative;
}

.zip-hero__logo {
	margin: 0;
	font-size: 44px;
	font-weight: 900;
	line-height: 1;
	letter-spacing: -0.02em;
}

.zip-hero__title {
	max-width: 9.5ch;
	margin: 10px 0 18px;
	font-size: clamp(38px, 4.4vw, 60px);
	font-weight: 900;
	line-height: 1.05;
}

.zip-hero__product {
	margin: 0;
	font-size: 15px;
	font-weight: 800;
	text-transform: uppercase;
}

.zip-hero__lead {
	margin: 4px 0 20px;
	font-size: 16px;
}

.zip-hero__rating {
	margin: 0;
	font-size: 13px;
}

.zip-stars {
	color: var(--zip-lilac);
	letter-spacing: 0.08em;
}

.zip-calc {
	position: relative;
	width: 300px;
	max-width: 100%;
	padding: 22px 26px;
	background: var(--color-white);
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
	color: var(--zip-ink);
}

.zip-calc__label {
	display: block;
	margin-block-end: 8px;
	font-size: 13px;
}

.zip-calc__field {
	display: flex;
	align-items: center;
	gap: 4px;
	padding: 0 10px;
	border: 1px solid #cfcad6;
	border-radius: 4px;
}

.zip-calc__field input {
	width: 100%;
	height: 36px;
	border: 0;
	outline: none;
	background: transparent;
	font: inherit;
}

.zip-calc__help {
	margin: 10px 0 14px;
	font-size: 11px;
	line-height: 1.4;
}

.zip-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 130px;
	padding: 8px 24px;
	border-radius: 4px;
	background: var(--zip-purple);
	color: var(--color-white);
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
}

.zip-calc .zip-button {
	width: 100%;
}

.zip-button:hover {
	background: var(--zip-ink);
	color: var(--color-white);
}

.zip-body {
	padding: 60px 6% 60px;
}

.zip-panels {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
}

.zip-panel {
	padding: 30px 14%;
	background: var(--zip-panel);
}

.zip-panel__title,
.zip-heading {
	margin: 0 0 14px;
	font-size: clamp(20px, 1.8vw, 24px);
	font-weight: 500;
}

.zip-heading--center {
	text-align: center;
}

.zip-panel__list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.zip-panel__list li {
	position: relative;
	margin-block-end: 12px;
	padding-inline-start: 24px;
	font-size: 14px;
	line-height: 1.4;
}

.zip-panel__list li::before {
	position: absolute;
	top: 3px;
	left: 0;
	width: 14px;
	height: 11px;
	background: var(--zip-lilac);
	clip-path: polygon(0 0, 100% 0, 88% 100%, 0 100%);
	content: "";
}

.zip-reasons {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 12px;
	margin: 54px 0 0;
	padding: 0;
	list-style: none;
}

.zip-reasons__item {
	padding: 30px 26px;
	background: var(--zip-panel);
}

.zip-reasons__icon {
	width: 48px;
	height: 48px;
	margin-block-end: 20px;
}

.zip-reasons__title {
	margin: 0 0 12px;
	font-size: 17px;
	font-weight: 500;
}

.zip-reasons__copy {
	margin: 0;
	font-size: 14px;
	line-height: 1.45;
}

.zip-cta {
	margin: 54px 0;
	text-align: center;
}

.zip-reviews__source {
	margin: -6px 0 20px;
	font-size: 12px;
}

.zip-reviews__list {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 30px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.zip-reviews__item + .zip-reviews__item {
	padding-inline-start: 30px;
	border-inline-start: 1px solid #ebe8e1;
}

.zip-reviews__title {
	margin: 10px 0 8px;
	font-size: 15px;
	font-weight: 500;
}

.zip-reviews__copy {
	margin: 0 0 12px;
	font-size: 13px;
	line-height: 1.45;
}

.zip-reviews__verified {
	margin: 0;
	font-size: 12px;
}

.zip-reviews__verified::before {
	margin-inline-end: 6px;
	color: var(--zip-lilac);
	content: "✓";
}

.zip-faqs {
	max-width: 560px;
	margin: 70px auto 60px;
}

.zip-faqs__item {
	margin-block-end: 16px;
	border: 1px solid #d8d4dd;
	border-radius: 2px;
	background: var(--color-white);
}

.zip-faqs__item[open] {
	border: 2px solid var(--zip-purple);
}

.zip-faqs__question {
	position: relative;
	padding: 14px 44px 14px 16px;
	font-size: 14px;
	font-weight: 500;
	list-style: none;
	cursor: pointer;
}

.zip-faqs__question::-webkit-details-marker {
	display: none;
}

.zip-faqs__question::after {
	position: absolute;
	top: 50%;
	right: 20px;
	width: 8px;
	height: 8px;
	border-right: 1.5px solid var(--zip-purple);
	border-bottom: 1.5px solid var(--zip-purple);
	content: "";
	transform: translateY(-70%) rotate(45deg);
}

.zip-faqs__item[open] .zip-faqs__question::after {
	transform: translateY(-20%) rotate(-135deg);
}

.zip-faqs__answer {
	margin: 0;
	padding: 0 16px 16px;
	font-size: 14px;
	line-height: 1.45;
}

.zip-disclosure {
	margin: 0;
	color: #6b6570;
	font-size: 11px;
	line-height: 1.5;
}

/* ─── Latitude ────────────────────────────────────────────────────────────── */

.page-title--mixed {
	padding-block-end: 10px;
	text-transform: none;
}

.latitude-lead {
	margin: 0 0 40px;
	font-size: 14px;
	text-align: center;
}

.latitude-steps {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 30px;
	max-width: 1130px;
	margin: 0 auto 40px;
	padding: 0;
	list-style: none;
	text-align: center;
}

.latitude-steps__icon {
	width: 100%;
	max-width: 190px;
	height: auto;
	margin-inline: auto;
}

.latitude-steps__title,
.latitude-offers__title,
.latitude-subheading {
	margin: 14px 0 10px;
	font-family: var(--font-body);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.latitude-steps__copy {
	margin: 0;
	font-size: 14px;
	line-height: 1.6;
}

.latitude-steps__copy a {
	color: var(--color-ink);
}

.latitude-offers {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 100px;
	max-width: 1280px;
	margin: 0 auto 60px;
}

.latitude-offers__card {
	padding: 50px 30px 50px;
	background: #f0f0f0; /* the card photographs' own ground, so they sit seamlessly */
	text-align: center;
}

.latitude-offers__image {
	display: block;
	width: auto;
	max-width: 100%;
	height: 300px;
	margin-inline: auto;
	object-fit: contain;
}

.latitude-offers__title {
	margin-block-start: 40px;
}

.latitude-offers__copy {
	margin: 0 0 20px;
	font-size: 14px;
}

.latitude-section {
	max-width: 1100px;
	margin-inline: auto;
	padding-block: 10px 30px;
	font-size: 14px;
	line-height: 1.6;
	text-align: center;
}

.latitude-section p {
	margin: 0 0 0.9em;
}

.latitude-section--ruled {
	padding-block-start: 40px;
	border-block-start: 1px solid var(--color-border);
}

.latitude-heading {
	margin: 0 0 10px;
	font-family: var(--font-heading);
	font-size: clamp(24px, 2.4vw, 34px);
	font-weight: 400;
	line-height: 1.15;
}

.latitude-heading--caps {
	margin-block-end: 24px;
	text-transform: uppercase;
}

.latitude-subheading {
	margin-block: 0 30px;
}

.latitude-smallprint {
	margin-block-start: 40px;
	font-size: 12px;
}

.latitude-section .accordion {
	max-width: 760px;
	margin-inline: auto;
	text-align: start;
}

/* ─── Store finder ────────────────────────────────────────────────────────── */

.store-finder {
	display: grid;
	grid-template-columns: minmax(0, 455px) minmax(0, 1fr);
	align-items: start;
	gap: 65px;
}

.store-search {
	position: relative;
}

.store-search__input {
	width: 100%;
	height: 45px;
	padding: 0 50px 0 20px;
	border: 1px solid var(--color-ink);
	border-radius: 0;
	background: var(--color-white);
	font: inherit;
	font-size: 16px;
	appearance: none;
}

.store-search__input:focus {
	outline: 2px solid var(--focus-ring);
	outline-offset: 1px;
}

.store-search__button {
	position: absolute;
	top: 0;
	right: 0;
	display: grid;
	width: 48px;
	height: 45px;
	padding: 0;
	border: 0;
	background: none;
	color: var(--color-ink);
	cursor: pointer;
	place-items: center;
}

.store-finder__count {
	margin: 30px 0;
	color: var(--color-text-muted);
	font-size: 14px;
	text-align: center;
}

.store-finder__cards {
	margin: 0;
	padding: 0;
	list-style: none;
}

/* Beside the map, the list scrolls in its own column rather than making the
   page forty stores long. */
@media (min-width: 900px) {
	.store-finder__cards {
		max-height: 520px;
		overflow-x: hidden;
		overflow-y: auto;
		padding-inline-end: 8px;
		overscroll-behavior: contain;
	}
}

.store-card {
	margin-block-end: 30px;
	padding: 30px 20px 26px;
	border: 1px solid var(--color-border);
	text-align: center;
}

.store-card__name {
	margin: 0 auto 18px;
	padding-block-end: 16px;
	max-width: 300px;
	border-block-end: 1px solid var(--color-border);
	font-family: var(--font-body);
	font-size: 16px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.store-card__address {
	margin: 0 0 16px;
	font-size: 15px;
	line-height: 1.6;
}

.store-card__contact {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2px;
	margin: 0 0 12px;
	font-size: 15px;
	overflow-wrap: anywhere;
}

.store-card__contact a,
.store-card__directions {
	color: var(--color-ink);
	text-decoration: underline;
}

.store-card__toggle {
	display: inline-flex;
	align-items: center;
	gap: 16px;
	padding: 8px;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	list-style: none;
	cursor: pointer;
}

.store-card__toggle::-webkit-details-marker {
	display: none;
}

.store-card__sign {
	position: relative;
	width: 16px;
	height: 16px;
}

.store-card__sign::before,
.store-card__sign::after {
	position: absolute;
	top: 50%;
	left: 0;
	width: 16px;
	height: 1px;
	background: currentColor;
	content: "";
}

.store-card__sign::after {
	transform: rotate(90deg);
}

.store-card__details[open] .store-card__sign::after {
	transform: none;
}

.store-card__more {
	padding-block-start: 12px;
}

.store-card__hours {
	margin: 0 auto 18px;
	border-collapse: collapse;
	font-size: 14px;
}

.store-card__hours th,
.store-card__hours td {
	padding: 3px 12px;
	font-weight: 400;
	text-align: start;
}

.store-card__photo {
	margin: 0 0 16px;
}

.store-card__image {
	display: block;
	width: 100%;
	height: auto;
}

.store-card__actions {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px 24px;
	margin: 0;
	font-size: 14px;
}

.store-card__map {
	padding: 0;
	border: 0;
	background: none;
	color: var(--color-ink);
	font: inherit;
	text-decoration: underline;
	cursor: pointer;
}

.store-finder__empty {
	margin: 0;
	text-align: center;
}

.store-finder__map {
	position: sticky;
	top: 20px;
}

.store-finder__frame {
	display: block;
	width: 100%;
	height: 670px;
	border: 0;
	background: var(--color-surface);
}

/* ─── Narrow screens ──────────────────────────────────────────────────────── */

@media (max-width: 899px) {
	.site-main--page {
		padding-block-end: 50px;
	}

	.site-main--page .page-title {
		padding-block: 28px 12px;
	}

	.trade-intro,
	.studio-steps,
	.studio-features,
	.signature-story__inner,
	.giftcards-options,
	.latitude-offers,
	.store-finder {
		grid-template-columns: minmax(0, 1fr);
		gap: 30px;
	}

	.store-finder {
		display: flex;
		flex-direction: column-reverse;
		align-items: stretch;
	}

	.store-finder__map {
		position: static;
	}

	.store-finder__frame {
		height: 320px;
	}

	.signature-story__image {
		margin-inline: auto;
	}

	.studio-services,
	.contact-teams {
		grid-template-columns: minmax(0, 1fr);
	}

	.signature-benefits__list,
	.latitude-steps {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.trade-form__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 14px 16px;
	}

	.trade-form__field {
		grid-column: 1 / -1;
	}

	.trade-form__field--quarter {
		grid-column: span 1;
	}

	.trade-form__submit {
		width: 100%;
		min-width: 0;
	}

	.looks-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 10px;
	}

	.looks-grid__item:nth-child(9n + 1),
	.looks-grid__item:nth-child(9n + 9) {
		grid-column: 1 / -1;
		grid-row: auto;
	}

	.zip-hero {
		padding: 40px 24px 50px;
		background: var(--zip-ink);
	}

	.zip-hero::before {
		display: none;
	}

	.zip-body {
		padding: 30px 16px;
	}

	.zip-panels,
	.zip-reasons,
	.zip-reviews__list {
		grid-template-columns: minmax(0, 1fr);
	}

	.zip-reviews__item + .zip-reviews__item {
		padding-block-start: 20px;
		padding-inline-start: 0;
		border-block-start: 1px solid #ebe8e1;
		border-inline-start: 0;
	}

	.zip-panel {
		padding: 24px;
	}

	/* The careers table becomes a stack of labelled cards. */
	.careers-table thead {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip: rect(0 0 0 0);
	}

	.careers-table,
	.careers-table tbody,
	.careers-table tr,
	.careers-table td {
		display: block;
		width: 100%;
	}

	.careers-table tr {
		padding-block: 12px;
		border-block-end: 1px solid var(--color-border);
	}

	.careers-table td {
		display: flex;
		justify-content: space-between;
		gap: 16px;
		padding: 4px 0;
		border: 0;
	}

	.careers-table td::before {
		color: var(--color-text-muted);
		content: attr(data-label);
	}

	.careers-table__action {
		justify-content: flex-start;
		padding-block-start: 10px;
	}

	.careers-table__action::before {
		display: none;
	}
}

@media (max-width: 480px) {
	.signature-benefits__list {
		grid-template-columns: minmax(0, 1fr);
	}

	.giftcards-or {
		margin-block: -10px;
	}
}