.home-guide { margin-block: clamp(45px, 7vw, 88px); }
.home-guide h2 { font-size: clamp(26px, 4vw, 42px); line-height: 1.1; margin: 8px 0 16px; }
.home-guide > p:not(.eyebrow) { max-width: 74ch; color: var(--muted); line-height: 1.65; }
.home-guide-grid, .home-gallery { display: grid; gap: 14px; margin-top: 22px; }
.home-guide-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.home-guide-steps { padding: 0; list-style: none; counter-reset: workflow; }
.home-guide-steps li::before { counter-increment: workflow; content: "0" counter(workflow); color: #537361; font-size: 13px; font-weight: 750; }
.home-guide-grid > *, .home-gallery > article { padding: 18px; background: #fff; border: 1px solid #dce5d7; border-radius: 14px; }
.home-guide h3 { margin: 7px 0; font-size: 18px; }
.home-guide-grid p, .home-gallery p, .home-faq p { margin: 0; line-height: 1.55; color: var(--muted); }
.home-gallery { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.home-gallery > article { padding: 0; overflow: hidden; }
.home-gallery img { display: block; width: 100%; height: auto; aspect-ratio: 1; object-fit: contain; background: #e9efe6; }
.home-gallery article > div { padding: 14px; }
.home-gallery article a:last-child { display: inline-block; margin-top: 10px; font-size: 13px; }
.home-gallery a:hover, .home-gallery-credit a:hover { text-decoration: underline; }
.home-gallery-credit { font-size: 13px; }
.home-faq details { border-top: 1px solid #dce5d7; max-width: 78ch; }
.home-faq details:last-child { border-bottom: 1px solid #dce5d7; }
.home-faq summary { padding: 13px 2px; cursor: pointer; font-weight: 700; }
.home-faq summary:hover { color: #386b54; }
.home-faq p { padding: 0 2px 15px; }
@media (max-width: 760px) { .home-guide-grid, .home-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 500px) { .home-guide-grid { grid-template-columns: 1fr; } }
.home-gallery-category { color: #496c59; font-size: 12px; font-weight: 750; text-transform: uppercase; letter-spacing: .07em; }
.home-gallery-actions { display: flex; flex-wrap: wrap; gap: 5px 14px; margin-top: 10px; font-size: 13px; font-weight: 650; }
.home-gallery article .home-gallery-actions a { margin: 0; }
@media (max-width: 500px) { .home-gallery { grid-template-columns: 1fr; } }
.home-gallery > article { display: flex; flex-direction: column; }
.home-gallery article > div { display: flex; flex: 1; flex-direction: column; }
.home-gallery .home-gallery-actions { padding-top: 14px; margin-top: auto; }
.home-gallery .home-gallery-actions a {
	padding: 7px 10px;
	border: 1px solid #cad9c9;
	border-radius: 8px;
	color: #234039;
	transition: background-color .16s ease;
}
.home-gallery .home-gallery-actions a:is(:hover, :focus-visible) { background: #edf4e8; text-decoration: none; }
.home-gallery article > .home-gallery-preview {
	position: relative;
	display: block;
	flex: none;
	aspect-ratio: 1;
	padding: 0;
	background: #eef2e9;
}
.home-gallery-preview > button {
	position: absolute;
	inset: 0;
	width: 100%;
	padding: 0;
	border: 0;
	background: transparent;
}
.home-gallery-preview > button > span, .home-gallery .home-gallery-status {
	position: absolute;
	inset-inline: 12px;
	bottom: 12px;
	z-index: 1;
	width: fit-content;
	max-width: calc(100% - 24px);
	margin-inline: auto;
	padding: 7px 12px;
	border-radius: 999px;
	background: #234039;
	color: #fff;
	font-size: 13px;
	font-weight: 650;
}
.home-gallery-preview > button:enabled:is(:hover, :focus-visible) > span { background: #142c26; }
.home-gallery-preview > button:disabled > span { visibility: hidden; }
.home-gallery-preview model-viewer {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	pointer-events: none;
}
.home-gallery-preview[data-ready="true"] model-viewer { opacity: 1; pointer-events: auto; }
.home-gallery-tabs { display: flex; flex-wrap: wrap; gap: 6px; margin-block: 20px 12px; }
.home-gallery-tabs > button {
	padding: 9px 14px;
	border: 1px solid #cad9c9;
	border-radius: 9px;
	background: #fff;
	color: #234039;
	font-weight: 650;
}
.home-gallery-tabs > button:hover { background: #edf4e8; }
.home-gallery-tabs > button[aria-selected="true"] { background: #234039; color: #fff; border-color: #234039; }
.home-gallery-tabs > button:focus-visible, .home-gallery-favorite:focus-visible { outline: 2px solid #537361; outline-offset: 2px; }
.home-gallery .home-gallery-actions { align-items: center; justify-content: space-between; }
.home-gallery-favorite {
	width: 36px;
	height: 36px;
	border: 1px solid #cad9c9;
	border-radius: 8px;
	background: #fff;
	color: #234039;
	font-size: 21px;
	line-height: 1;
}
.home-gallery-favorite:hover, .home-gallery-favorite[aria-pressed="true"] { background: #edf4e8; }
.home-gallery-empty, .home-gallery-feedback { padding: 12px 0; color: var(--muted); }
.home-gallery-empty > button { margin-inline-start: 6px; }
.home-gallery-preview > button:not(:has(img)) > span { bottom: auto; top: 50%; transform: translateY(-50%); }
.home-gallery article > .home-gallery-no-preview { display: grid; place-items: center; color: var(--muted); }
.home-gallery article > .home-gallery-private-preview:not([data-ready="true"]) {
	aspect-ratio: auto;
	min-height: 58px;
	background: transparent;
}
.home-gallery-private-preview:not([data-ready="true"]) > button {
	position: relative;
	min-height: 58px;
}
.home-gallery-private-preview:not([data-ready="true"]) > .home-gallery-status {
	bottom: 50%;
	transform: translateY(50%);
}
.home-gallery-preview > img[hidden] { display: none; }
.home-gallery-private-preview:not([data-ready="true"]) > .home-gallery-status { margin-block: 0; }
.home-gallery-actions [data-download-model] {
	padding: 7px 10px;
	border: 1px solid #cad9c9;
	border-radius: 8px;
	background: #fff;
	color: #234039;
	font: inherit;
}
.home-gallery-actions [data-download-model]:enabled:is(:hover, :focus-visible) { background: #edf4e8; }
