/* ROUND 65 — Subdivisions pages + the staff House & Land order form.
   Scoped to .sh-r65 wrappers; nothing here touches the locked homepage or the
   approved inner-page styles. Tokens are the round-63 ones. */

/* ------------------------------------------------------------ Subdivisions */

.sh-sub-page .sh-sub-hero {
	padding: 120px 0 48px;
	background: var(--cream, #F6F1E7);
}
.sh-sub-hero__eyebrow { opacity: .7; margin-bottom: 8px; }
.sh-sub-hero__intro { max-width: 720px; margin-top: 16px; }

.sh-sub-list { padding: 8px 0 96px; background: var(--cream, #F6F1E7); }
.sh-sub-card {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
	gap: 0;
	margin-bottom: 32px;
	background: #fff;
	border-radius: 18px;
	overflow: hidden;
	text-decoration: none;
	color: inherit;
	transition: transform .4s ease, box-shadow .4s ease;
}
.sh-sub-card:hover { transform: translateY(-4px); box-shadow: 0 18px 40px rgba(0, 0, 0, .10); }
.sh-sub-card__media { display: block; min-height: 280px; }
.sh-sub-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sh-sub-card__logo {
	position: absolute;
	left: 24px; top: 24px;
	max-width: 132px; max-height: 64px;
	/* The developers supply these logos white-on-transparent for photo overlay, so
	   the chip is charcoal rather than white. */
	background: rgba(37, 42, 38, .82);
	padding: 10px 14px;
	border-radius: 10px;
	object-fit: contain;
}
.sh-sub-card__copy { display: flex; flex-direction: column; gap: 10px; padding: 36px 40px; justify-content: center; }
.sh-sub-card__region { opacity: .7; }
.sh-sub-card__intro { display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden; }
.sh-sub-card__pkgs { color: var(--sage, #6C7A5B); }
.sh-sub-card__cta { margin-top: 6px; }

.sh-sub-single__hero {
	min-height: 52vh;
	display: flex;
	align-items: flex-end;
	padding: 140px 0 48px;
	background-size: cover;
	background-position: center;
	color: #fff;
	position: relative;
}
.sh-sub-single__hero::after {
	content: "";
	position: absolute; inset: 0;
	background: linear-gradient(180deg, rgba(0, 0, 0, .35) 0%, rgba(0, 0, 0, .10) 40%, rgba(0, 0, 0, .55) 100%);
}
.sh-sub-single__hero .container { position: relative; z-index: 1; }
.sh-sub-single__logo { max-width: 170px; margin-top: 20px; background: rgba(37, 42, 38, .72); padding: 12px 16px; border-radius: 10px; object-fit: contain; }
.sh-sub-single__intro { padding: 56px 0 8px; }
.sh-sub-single__intro .body-lg { max-width: 760px; }
.sh-sub-single__pkgs { padding: 48px 0; }
.sh-sub-single__pkg-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 24px; margin-top: 24px; }
.sh-sub-pkg { background: #fff; border-radius: 14px; overflow: hidden; text-decoration: none; color: inherit; display: block; }
.sh-sub-pkg img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; }
.sh-sub-pkg__copy { display: flex; flex-direction: column; gap: 6px; padding: 20px 22px 24px; }
.sh-sub-single__body { padding: 32px 0 8px; }
.sh-sub-single__body .sh-rich { max-width: 780px; }
.sh-sub-single__map { padding: 40px 0; }
.sh-sub-single__map img { width: 100%; height: auto; border-radius: 14px; display: block; margin-top: 20px; }
.sh-sub-single__photos { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 16px; padding-bottom: 64px; }
.sh-sub-single__photos img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 12px; display: block; }

@media (max-width: 860px) {
	.sh-sub-card { grid-template-columns: 1fr; }
	.sh-sub-card__media { min-height: 200px; }
	.sh-sub-card__copy { padding: 24px 22px 28px; }
	.sh-sub-page .sh-sub-hero { padding: 96px 0 32px; }
	.sh-sub-single__hero { min-height: 40vh; padding: 110px 0 32px; }
}

/* ------------------------------------------- Ideas Gallery: “Show more” button */
/* Its own class: .gal__more already belongs to the left filter column's
   "Show all N" toggles in inner.css, and styling it here restyled those too. */

.gal__showmore {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin: 28px auto 8px;
	min-width: 220px;
}
.gal__showmore[hidden] { display: none; }

/* -------------------------------------------------- staff order form (/staff/) */

.sh-order { margin-top: 56px; padding-top: 40px; border-top: 1px solid rgba(0, 0, 0, .12); }
.sh-order__intro, .sh-order__office { max-width: 680px; }
.sh-order__office { opacity: .8; margin-top: 4px; }
.sh-order__grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap: 18px 20px;
	margin: 28px 0 8px;
}
.sh-order__f { display: flex; flex-direction: column; gap: 6px; }
.sh-order__f--wide { grid-column: 1 / -1; }
.sh-order__f > span { font-size: 13px; letter-spacing: .04em; text-transform: uppercase; opacity: .75; }
.sh-order__f input,
.sh-order__f select,
.sh-order__f textarea,
.sh-order__search {
	width: 100%;
	padding: 12px 14px;
	border: 1px solid rgba(0, 0, 0, .18);
	border-radius: 10px;
	background: #fff;
	font: inherit;
	color: inherit;
}
.sh-order__f textarea { resize: vertical; }
.sh-order__f input:focus-visible,
.sh-order__f textarea:focus-visible,
.sh-order__search:focus-visible { outline: 2px solid var(--amber, #C98A2B); outline-offset: 2px; }

.sh-order__bullets, .sh-order__media { border: 0; padding: 24px 0 0; margin: 0; }
.sh-order__bullets legend, .sh-order__media legend { padding: 0 0 10px; }
.sh-order__bullet { display: flex; gap: 10px; align-items: flex-start; padding: 6px 0; max-width: 620px; }
.sh-order__bullet input { margin-top: 3px; }
.sh-order__bullet.is-full span { opacity: .45; }

.sh-order__slots { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 20px; margin-top: 12px; }
.sh-order__slot { display: flex; flex-direction: column; gap: 8px; }
.sh-order__results {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 6px;
	max-height: 210px;
	overflow: auto;
	padding: 6px;
	background: rgba(0, 0, 0, .04);
	border-radius: 10px;
}
.sh-order__results button { border: 0; padding: 0; background: none; cursor: pointer; }
.sh-order__results img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 6px; display: block; }
.sh-order__picked { min-height: 4px; }
.sh-order__picked img { width: 100%; max-width: 180px; border-radius: 8px; display: block; }
.sh-order__picked button { margin-top: 6px; font-size: 13px; background: none; border: 0; text-decoration: underline; cursor: pointer; }

.sh-order__actions { display: flex; align-items: center; gap: 16px; margin-top: 28px; flex-wrap: wrap; }
.sh-order__msg { margin: 0; }
.sh-order__msg.is-err { color: #A6382B; }
.sh-order__msg.is-ok { color: var(--sage, #6C7A5B); }

@media (max-width: 560px) {
	.sh-order__grid { grid-template-columns: 1fr; }
	.sh-order__slots { grid-template-columns: 1fr; }
}