/* First homepage only. Reuse the journal's typography, palette and spacing tokens. */
.jg-home .jg-brand { padding-top: 5rem; padding-bottom: 5rem; scroll-margin-top: 6rem; }
.jg-home .jg-brand + .jg-brand { border-top: 1px solid rgb(var(--jg-border-soft)); }
.jg-brand__header { display: flex; align-items: end; justify-content: space-between; gap: 3rem; margin-bottom: 3rem; }
.jg-home .jg-brand h2 { font-size: clamp(2.1rem, 4vw, 3.65rem); font-weight: 300; line-height: 1.18; letter-spacing: .075em; margin: 0; }
.jg-home .jg-brand h3 { font-size: 1rem; font-weight: 400; letter-spacing: .075em; line-height: 1.6; margin: .7rem 0; }
.jg-brand p { font-size: .875rem; line-height: 1.9; margin: 0 0 1rem; }
.jg-brand__header > p, .jg-brand__intro { max-width: 27rem; }
.jg-brand__header > p { margin-bottom: .25rem; }
.jg-brand .jg-eyebrow { font-size: .625rem; letter-spacing: .18em; line-height: 1.8; margin-bottom: 1rem; }
.jg-brand .jg-brand__note { color: rgb(var(--jg-muted)); font-size: .75rem; line-height: 1.75; margin: 1rem 0 0; }
.jg-home .jg-brand__link { display: inline-block; color: rgb(var(--jg-ink)); font-size: .75rem; line-height: 1.8; padding: .5rem 0; text-decoration: underline; text-underline-offset: .4em; text-decoration-thickness: 1px; }
.jg-brand__link span { margin-left: .5rem; }
.jg-brand__edits { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2.5rem; }
.jg-brand__picture { display: block; aspect-ratio: 3 / 4; overflow: hidden; margin-bottom: 1.7rem; background: rgb(var(--jg-sand) / .15); }
.jg-brand__picture img, .jg-brand__look-image img, .jg-brand__guide-picture img { width: 100%; height: 100%; object-fit: cover; display: block; }
.jg-brand__story > p:not(.jg-eyebrow) { max-width: 24rem; margin-bottom: .4rem; }
.jg-brand__story .jg-eyebrow { margin: 0; }
.jg-brand__looks { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2.5rem; }
.jg-brand__look-image { aspect-ratio: 1; overflow: hidden; margin-bottom: 1.75rem; }
.jg-brand__look .jg-eyebrow { margin: 0; }
.jg-brand--finish { display: grid; grid-template-columns: 1.08fr 1fr; gap: 6rem; align-items: center; }
.jg-brand__finish-photo > img { width: 100%; height: auto; display: block; }
.jg-brand__detail-photo { width: 65%; margin: 2rem 0 0 auto; }
.jg-brand__detail-photo > div { aspect-ratio: 2.2; overflow: hidden; }
.jg-brand__detail-photo img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 68%; transform: scale(1.6); transform-origin: 50% 65%; }
.jg-brand__finish-copy > h2 { margin-bottom: 1.6rem !important; }
.jg-brand__finish-copy > p { max-width: 28rem; }
.jg-brand__details { margin: 1.6rem 0 1rem; }
.jg-brand__details > div { border-top: 1px solid rgb(var(--jg-border-soft)); padding: 1rem 0; }
.jg-brand__details dt { font-weight: 400; font-size: .6875rem; text-transform: uppercase; letter-spacing: .12em; margin-bottom: .5rem; }
.jg-brand__details dd { font-size: .8125rem; line-height: 1.85; margin: 0; }
.jg-brand__guides { display: flex; flex-wrap: wrap; gap: 3rem 2.5rem; }
.jg-brand__guide { flex: 1 1 17rem; min-width: 0; }
.jg-brand__guide-picture { display: block; aspect-ratio: 4 / 3; overflow: hidden; margin-bottom: 1.5rem; background: rgb(var(--jg-sand) / .15); }
.jg-brand__guide .jg-eyebrow { margin: 0; }
.jg-brand__guide h3 { max-width: 29rem; }
@media (min-width: 1100px) {
	.jg-home .jg-brand { padding-top: 6rem; padding-bottom: 6rem; }
	.jg-brand__story:nth-child(2) { padding-top: 3rem; }
	.jg-brand__story:nth-child(3) { padding-top: 6rem; }
}
@media (max-width: 1099px) {
	.jg-brand__header { gap: 2rem; }
	.jg-brand__header > p, .jg-brand__intro { max-width: 22rem; }
	.jg-brand__edits, .jg-brand__looks { gap: 1.5rem; }
	.jg-brand--finish { gap: 2.5rem; }
}
@media (max-width: 699px) {
	.jg-home .jg-brand { padding-top: 3.5rem; padding-bottom: 3.5rem; }
	.jg-brand__header { display: block; margin-bottom: 2rem; }
	.jg-brand__header > p, .jg-brand__intro { margin-top: 1.25rem; max-width: none; }
	.jg-brand__edits, .jg-brand__looks, .jg-brand--finish { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2.75rem; }
	.jg-brand__picture { aspect-ratio: 1; margin-bottom: 1.25rem; }
	.jg-brand__story > p:not(.jg-eyebrow) { max-width: none; }
	.jg-brand--finish .jg-brand__finish-copy { order: -1; }
	.jg-brand__detail-photo { width: 80%; }
	.jg-brand__look-image { margin-bottom: 1.25rem; }
	.jg-brand__guides { gap: 2.75rem; }
	.jg-brand__guide { flex-basis: 100%; }
}
