/* Her Moment Treasure Chest — scoped to its dedicated page and private access page. */
html:has(body.page-id-1902),
body.page-id-1902,
body.page-id-1902 #page,
body.page-id-1902 #content,
body.page-id-1902 .site,
body.page-id-1902 .site-content,
body.page-id-1902 .content-area,
body.page-id-1902 .site-main,
body.page-id-1902 .page-content,
body.page-id-1902 .entry-content,
body.page-id-1902 .article-content,
body.page-id-1902 .entry-content > .elementor,
body.page-id-1902 .article-content > .elementor {
	background: linear-gradient(130deg, #ffe7a2 0%, #fff9ed 45%, #f6d27b 100%) !important;
}

body.page-id-1902 .entry-header,
body.page-id-1902 .page-header,
body.page-id-1902 h1.entry-title,
body.page-id-1902 .entry-title {
	display: none !important;
}

body.page-id-1902 .site-logo,
body.page-template-default:has(.hm-access) .site-logo {
	max-width: 136px !important;
	height: auto !important;
}

body.page-id-1902 .entry-content,
body.page-id-1902 .article-content,
body.page-id-1902 .entry-content > .elementor,
body.page-id-1902 .article-content > .elementor {
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
}

.hm-treasure,
.hm-access {
	--ink: #2e1c0d;
	--muted: #6d5336;
	--cream: #fff9ec;
	--gold: #c48a31;
	--gold-light: #f8d889;
	--gold-deep: #6f4013;
	--line: rgba(109, 75, 31, .22);
	position: relative;
	isolation: isolate;
	overflow: hidden;
	margin: 0;
	padding: clamp(1.15rem, 3.2vw, 2.6rem) clamp(1.1rem, 4vw, 4.5rem) clamp(4rem, 8vw, 7rem);
	background:
		radial-gradient(circle at 6% 4%, rgba(255, 232, 167, .96) 0 1%, transparent 20%),
		radial-gradient(circle at 96% 19%, rgba(255, 222, 132, .66) 0 1%, transparent 18%),
		linear-gradient(130deg, #ffe7a2 0%, #fff9ed 42%, #f6d27b 100%);
	color: var(--ink);
	font-family: inherit;
}

.hm-treasure::before,
.hm-access::before {
	position: absolute;
	z-index: -1;
	inset: 0;
	content: '';
	opacity: .24;
	background-image: radial-gradient(rgba(113, 73, 25, .38) .55px, transparent .72px);
	background-size: 8px 8px;
	pointer-events: none;
}

.hm-treasure__glow {
	position: absolute;
	z-index: -1;
	width: 31rem;
	aspect-ratio: 1;
	border-radius: 50%;
	pointer-events: none;
}

.hm-treasure__glow--one { top: 3%; left: -19rem; background: rgba(255, 251, 224, .86); }
.hm-treasure__glow--two { right: -20rem; bottom: 1%; background: rgba(208, 144, 39, .16); }

.hm-treasure__hero,
.hm-treasure__heading,
.hm-treasure__grid,
.hm-access > * {
	position: relative;
	z-index: 1;
	max-width: 1120px;
	margin-right: auto;
	margin-left: auto;
}

.hm-treasure__hero {
	max-width: 790px;
	padding: clamp(1.35rem, 2.7vw, 2.35rem) clamp(1.1rem, 4vw, 3.5rem) clamp(1.8rem, 3.5vw, 3rem);
	border: 1px solid rgba(105, 68, 18, .23);
	border-radius: 30px;
	background: rgba(255, 253, 244, .74);
	box-shadow: 0 24px 54px rgba(93, 55, 13, .13), inset 0 1px rgba(255,255,255,.75);
	text-align: center;
}

.hm-treasure__hero::before {
	position: absolute;
	top: .8rem;
	left: 8%;
	right: 8%;
	height: 7px;
	content: '';
	border-top: 1px solid rgba(160, 104, 23, .34);
	border-bottom: 1px solid rgba(160, 104, 23, .18);
	background: repeating-linear-gradient(90deg, transparent 0 8px, rgba(194, 138, 49, .48) 8px 10px, transparent 10px 18px);
	opacity: .8;
	pointer-events: none;
}

.hm-treasure__wordmark {
	display: block;
	width: min(330px, 76%);
	height: auto;
	margin: 0 auto 1.55rem;
	border: 1px solid rgba(151, 66, 82, .13);
	border-radius: 4px;
	box-shadow: 0 9px 20px rgba(94, 40, 16, .11);
}

.hm-treasure__hero .hm-treasure__title-a11y {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	min-width: 0 !important;
	min-height: 0 !important;
	margin: -1px !important;
	padding: 0 !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	clip-path: inset(50%) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

.hm-treasure__hero .hm-treasure__kicker {
	font-size: clamp(.82rem, 1.25vw, 1rem);
	letter-spacing: .18em;
}

.hm-treasure__kicker,
.hm-resource-card__eyebrow {
	margin: 0 0 .75rem;
	color: var(--gold-deep);
	font-size: .72rem;
	font-weight: 800;
	letter-spacing: .15em;
	line-height: 1.35;
	text-transform: uppercase;
}

.hm-treasure h2,
.hm-treasure h3,
.hm-access h1,
.hm-access h2 {
	margin: 0;
	color: var(--ink);
	font-family: Georgia, 'Times New Roman', serif;
	letter-spacing: -.035em;
}

.hm-access h1 { font-size: clamp(3.1rem, 7.2vw, 6.4rem); font-weight: 600; line-height: .97; }

.hm-treasure__intro,
.hm-access__intro {
	max-width: 650px;
	margin: 1rem auto 0;
	font-size: clamp(1.02rem, 1.8vw, 1.22rem);
	line-height: 1.68;
}

.hm-treasure__coins--corner {
	position: absolute;
	top: 1.15rem;
	right: 1.5rem;
	width: clamp(74px, 10vw, 112px);
	height: auto;
	opacity: .88;
	filter: drop-shadow(0 9px 12px rgba(107, 67, 14, .16));
	transform: rotate(16deg);
	pointer-events: none;
}

.hm-treasure__coins--hero {
	display: block;
	width: clamp(95px, 13vw, 138px);
	height: auto;
	margin: 1.05rem auto -1.8rem;
	filter: drop-shadow(0 10px 12px rgba(107, 67, 14, .18));
	transform: rotate(-4deg);
}

.hm-treasure__heading { margin-top: clamp(2.4rem, 5vw, 4rem); text-align: center; }
.hm-treasure__heading h2 { max-width: 760px; margin-right: auto; margin-left: auto; font-size: clamp(2rem, 4.1vw, 3.4rem); line-height: 1.08; text-align: center; }

.hm-treasure__grid,
.hm-access__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1.45rem;
	margin-top: clamp(2rem, 5vw, 3.25rem);
}

.hm-resource-card,
.hm-access-card {
	display: flex;
	position: relative;
	flex-direction: column;
	min-width: 0;
	border: 1px solid rgba(109, 75, 31, .24);
	border-radius: 24px;
	background: rgba(255, 253, 245, .88);
	box-shadow: 0 15px 34px rgba(84, 47, 6, .13), inset 0 1px rgba(255,255,255,.9);
	overflow: hidden;
	transition: transform .25s ease, box-shadow .25s ease;
}

.hm-resource-card::before {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
	width: 100%;
	height: 6px;
	content: '';
	background: var(--card-accent, #c98a28);
}

.hm-resource-card:hover {
	transform: translateY(-6px);
	box-shadow: 0 25px 44px rgba(84, 47, 6, .18), inset 0 1px rgba(255,255,255,.9);
}

.hm-resource-card--berry { --card-accent: #a64e55; }
.hm-resource-card--rose { --card-accent: #c97772; }
.hm-resource-card--violet { --card-accent: #7d6397; }

.hm-resource-card__visual {
	position: relative;
	display: grid;
	min-height: clamp(235px, 23vw, 330px);
	place-items: center;
	overflow: hidden;
	background: linear-gradient(145deg, #fbf4df, #f0cf8a);
}

.hm-resource-card__visual img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
	transition: transform .5s ease;
}

.hm-resource-card:hover .hm-resource-card__visual img { transform: scale(1.015); }

.hm-resource-card__visual-wash { display: none; }

.hm-resource-card__content {
	display: flex;
	flex: 1;
	flex-direction: column;
	padding: 1.6rem 1.65rem 1.7rem;
}

.hm-resource-card h3,
.hm-access-card h2 { font-size: clamp(1.68rem, 2.4vw, 2.18rem); line-height: 1.05; }
.hm-resource-card__description,
.hm-access-card p { margin: 1.1rem 0 0; color: #58432d; font-size: .98rem; line-height: 1.62; }

.hm-resource-card__bottom {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-end;
	gap: .7rem;
	margin-top: auto;
	padding-top: 1.55rem;
}

.hm-resource-card__format { color: #775a35; font-size: .8rem; font-weight: 700; }

.hm-resource-card__button,
.hm-treasure-form button,
.hm-access-card a,
.hm-access__return {
	appearance: none;
	border: 0;
	border-radius: 999px;
	background: var(--ink);
	color: #fffdf7 !important;
	cursor: pointer;
	font: inherit;
	font-size: .88rem;
	font-weight: 800;
	line-height: 1.2;
	padding: .85rem 1.1rem;
	text-decoration: none !important;
	transition: background .2s ease, transform .2s ease;
}

.hm-resource-card__button:hover,
.hm-treasure-form button:hover,
.hm-access-card a:hover,
.hm-access__return:hover { background: var(--gold-deep); color: #fffdf7; transform: translateY(-1px); }
.hm-resource-card__button span,
.hm-treasure-form button span,
.hm-access-card a span,
.hm-access__return span { margin-left: .3rem; font-size: 1.1em; }

.hm-treasure-modal { position: fixed; z-index: 999999; inset: 0; display: none; align-items: center; justify-content: center; padding: 1.25rem; }
.hm-treasure-modal.is-open { display: flex; }
.hm-treasure-modal__shade { position: absolute; inset: 0; background: rgba(37, 21, 4, .72); backdrop-filter: blur(6px); }
.hm-treasure-modal__panel { position: relative; width: min(100%, 560px); padding: clamp(2rem, 6vw, 3.3rem); border: 1px solid rgba(139, 92, 23, .35); border-radius: 26px; background: #fffaf0; box-shadow: 0 22px 70px rgba(0,0,0,.31); }
.hm-treasure-modal__close { position: absolute; top: .85rem; right: .95rem; width: 36px; height: 36px; border: 0; border-radius: 50%; background: #f4e2b9; color: var(--ink); cursor: pointer; font-size: 1.7rem; line-height: 1; }
.hm-treasure-modal h2 { margin-top: .1rem; font-family: Georgia, 'Times New Roman', serif; font-size: clamp(2rem, 4vw, 3rem); line-height: 1.04; }
.hm-treasure-modal__panel > p:not(.hm-treasure__kicker) { margin: 1rem 0 0; color: #5e482e; font-size: 1rem; line-height: 1.6; }

.hm-treasure-form { display: grid; gap: .68rem; margin-top: 1.75rem; }
.hm-treasure-form label { font-size: .8rem; font-weight: 800; }
.hm-treasure-form input { width: 100%; min-height: 50px; box-sizing: border-box; border: 1px solid rgba(96, 64, 18, .36); border-radius: 12px; background: #fffefa; color: var(--ink); font: inherit; padding: .8rem 1rem; }
.hm-treasure-form input:focus { outline: 3px solid rgba(201, 146, 47, .28); border-color: var(--gold-deep); }
.hm-treasure-form button { width: 100%; min-height: 51px; margin-top: .45rem; background: #a66b1e; }
.hm-treasure-form button[disabled] { cursor: wait; opacity: .7; }
.hm-treasure-form__message { min-height: 1.4em; margin: .25rem 0 0; color: #7b351d; font-size: .84rem; line-height: 1.45; }
.hm-treasure-form__message.is-success { color: #285b3f; }

.hm-access { min-height: 65vh; }
.hm-access > .hm-treasure__kicker,
.hm-access > h1,
.hm-access > .hm-access__intro { max-width: 800px; text-align: center; }
.hm-access__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.hm-access-card { min-height: 325px; padding: 2.05rem; }
.hm-access-card a { align-self: flex-start; margin-top: auto; padding-top: .86rem; }
.hm-access__return { display: table; margin: 2rem auto 0; }

@media (max-width: 940px) {
	.hm-treasure__grid,
	.hm-access__grid { grid-template-columns: 1fr; max-width: 630px; }
	.hm-resource-card__visual { aspect-ratio: 1.52 / 1; }
}

@media (max-width: 600px) {
	body.page-id-1902 .site-logo { max-width: 112px !important; }
	.hm-treasure,
	.hm-access { padding-right: 1rem; padding-left: 1rem; }
	.hm-treasure__hero { border-radius: 22px; }
	.hm-treasure__wordmark { width: min(285px, 88%); margin-bottom: 1.25rem; }
		.hm-treasure__coins--corner { top: .8rem; right: .8rem; width: 68px; }
		.hm-treasure__coins--hero { width: 98px; margin-bottom: -1.45rem; }
	.hm-resource-card,
	.hm-access-card { border-radius: 19px; }
	.hm-resource-card__content { padding: 1.4rem; }
	.hm-resource-card__bottom { align-items: flex-start; flex-direction: column; }
	.hm-treasure-modal__panel { padding: 2.15rem 1.35rem 1.55rem; border-radius: 20px; }
}

@media (prefers-reduced-motion: reduce) {
	.hm-resource-card,
	.hm-resource-card__visual img,
	.hm-resource-card__button,
	.hm-treasure-form button,
	.hm-access-card a,
	.hm-access__return { transition: none; }
}


/* v4 editorial hero refinement: a lighter, clearer introduction that lets the resource cards arrive sooner. */
.hm-treasure {
	padding-top: clamp(.7rem, 1.8vw, 1.55rem);
}

.hm-treasure__hero {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(176px, 230px);
	align-items: center;
	gap: clamp(1.35rem, 4vw, 4.5rem);
	max-width: 1060px;
	padding: clamp(1.25rem, 3.8vw, 3.5rem) clamp(1.2rem, 4.5vw, 4.75rem) clamp(1.1rem, 2.2vw, 1.9rem);
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	text-align: left;
}

.hm-treasure__hero::before {
	top: 0;
	left: 0;
	right: auto;
	width: min(130px, 28%);
	height: 1px;
	border: 0;
	background: linear-gradient(90deg, rgba(111,64,19,.18), rgba(111,64,19,.78), transparent);
	opacity: 1;
}

.hm-treasure__hero-copy { position: relative; z-index: 1; max-width: 675px; }

.hm-treasure__wordmark {
	width: min(180px, 58%);
	margin: 0 0 .95rem;
	border: 0;
	border-radius: 0;
	box-shadow: none;
}

.hm-treasure__hero .hm-treasure__kicker {
	margin-bottom: .55rem;
	font-size: clamp(.68rem, 1vw, .78rem);
	letter-spacing: .19em;
}

.hm-treasure__title {
	margin: 0;
	color: var(--ink);
	font-family: Georgia, 'Times New Roman', serif;
	font-size: clamp(3rem, 6.4vw, 5.9rem);
	font-weight: 500;
	letter-spacing: -.065em;
	line-height: .88;
}

.hm-treasure__intro {
	max-width: 610px;
	margin: 1.25rem 0 0;
	color: #513b26;
	font-size: clamp(1rem, 1.55vw, 1.18rem);
	line-height: 1.62;
}

.hm-treasure__hero-notes {
	display: flex;
	flex-wrap: wrap;
	gap: .55rem 1.05rem;
	margin-top: 1.4rem;
	color: #654822;
	font-size: .72rem;
	font-weight: 700;
	letter-spacing: .06em;
	line-height: 1.3;
	text-transform: uppercase;
}

.hm-treasure__hero-notes span {
	display: inline-flex;
	align-items: center;
	gap: .32rem;
	padding-bottom: .27rem;
	border-bottom: 1px solid rgba(111,64,19,.28);
}

.hm-treasure__hero-notes strong { color: var(--gold-deep); }

.hm-treasure__hero-mark {
	display: grid;
	width: min(100%, 205px);
	aspect-ratio: 1;
	align-self: center;
	place-content: center;
	justify-self: end;
	border: 1px solid rgba(111,64,19,.43);
	border-radius: 50%;
	background: radial-gradient(circle at 34% 26%, #fffdf6 0 7%, #f6db98 35%, #bd7d27 100%);
	box-shadow: 0 16px 28px rgba(103,62,12,.17), inset 0 0 0 8px rgba(255,250,230,.42);
	color: #56330d;
	text-align: center;
	transform: rotate(-4deg);
}

.hm-treasure__hero-mark span {
	font-family: Georgia, 'Times New Roman', serif;
	font-size: clamp(3rem, 6.2vw, 5.3rem);
	font-weight: 600;
	letter-spacing: -.1em;
	line-height: .72;
}

.hm-treasure__hero-mark small {
	margin-top: .9rem;
	font-size: .57rem;
	font-weight: 800;
	letter-spacing: .17em;
	text-transform: uppercase;
}

.hm-treasure__coins--corner {
	top: .55rem;
	right: clamp(.15rem, 1.7vw, 1.8rem);
	width: clamp(58px, 7vw, 88px);
	opacity: .73;
	transform: rotate(12deg);
}

.hm-treasure__heading {
	max-width: 900px;
	margin-top: clamp(.6rem, 1.2vw, 1rem);
	padding-top: clamp(.7rem, 1.4vw, 1.1rem);
	border-top: 1px solid rgba(111,64,19,.19);
}

.hm-treasure__heading h2 {
	max-width: 690px;
	font-size: clamp(1.95rem, 3.6vw, 3.15rem);
	line-height: 1.03;
}

.hm-treasure__grid { margin-top: clamp(1.45rem, 3vw, 2.25rem); }

@media (max-width: 720px) {
	.hm-treasure { padding-top: .65rem; }
	.hm-treasure__hero {
		grid-template-columns: 1fr;
		gap: 1.05rem;
		padding: 1.25rem .7rem 1.45rem;
		text-align: center;
	}
	.hm-treasure__hero::before { left: 50%; width: 100px; transform: translateX(-50%); }
	.hm-treasure__hero-copy { max-width: 580px; margin: 0 auto; }
	.hm-treasure__wordmark { width: min(165px, 58%); margin-right: auto; margin-left: auto; }
	.hm-treasure__intro { margin-right: auto; margin-left: auto; }
	.hm-treasure__hero-notes { justify-content: center; margin-top: 1.15rem; }
	.hm-treasure__hero-mark { width: 118px; justify-self: center; box-shadow: 0 11px 22px rgba(103,62,12,.16), inset 0 0 0 6px rgba(255,250,230,.42); }
	.hm-treasure__hero-mark span { font-size: 3rem; }
	.hm-treasure__hero-mark small { margin-top: .45rem; font-size: .47rem; }
	.hm-treasure__coins--corner { top: .05rem; right: .2rem; width: 54px; }
	.hm-treasure__heading { margin-top: .65rem; padding-top: 1.15rem; }
}

/* Tighter hero-copy rhythm: neutralize theme paragraph margins, pull elements closer */
.hm-treasure__hero-copy .hm-treasure__wordmark { margin-bottom: .55rem !important; }
.hm-treasure__hero-copy .hm-treasure__kicker { margin: 0 0 .35rem !important; }
.hm-treasure__hero-copy .hm-treasure__title { margin: 0 !important; }
.hm-treasure__hero-copy .hm-treasure__intro { margin: .85rem 0 0 !important; }
.hm-treasure__hero-copy .hm-treasure__hero-notes { margin-top: 1rem !important; }

/* v7 layout correction: the theme navigation is fixed on the left at desktop widths.
   Do not make this section viewport-wide, or the first card in each row can slide under it. */
body.potter-treasure-chest .hm-treasure {
	width: auto !important;
	max-width: none !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	box-sizing: border-box !important;
}

/* v8 polish: keep the page and footer within the desktop content canvas. */
html:has(body.potter-treasure-chest),
body.potter-treasure-chest {
	max-width: 100vw !important;
	overflow-x: hidden !important;
}

body.potter-treasure-chest #footer,
body.potter-treasure-chest .potter-page-footer {
	width: 100% !important;
	max-width: none !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	box-sizing: border-box !important;
}

/* Give the wordmark a little more breathing room before the library label. */
body.potter-treasure-chest .hm-treasure__hero-copy .hm-treasure__wordmark {
	margin-bottom: .95rem !important;
}

/* Replace the theme-width divider with a short centered rule above the heading. */
body.potter-treasure-chest .hm-treasure__heading {
	position: relative;
	border-top: 0 !important;
}

body.potter-treasure-chest .hm-treasure__heading::before {
	position: absolute;
	top: 0;
	left: 50%;
	width: min(150px, 28%);
	height: 1px;
	content: '';
	background: rgba(111, 64, 19, .42);
	transform: translateX(-50%);
}

/* v9 polish: keep the mark label out of the favicon and make image spacing reliable
   when the image optimizer wraps the wordmark in a <picture> element. */
body.potter-treasure-chest .hm-treasure__hero-mark {
	position: relative !important;
}

body.potter-treasure-chest .hm-treasure__hero-mark small {
	position: absolute !important;
	left: 18px !important;
	bottom: 18px !important;
	z-index: 2 !important;
	margin: 0 !important;
	transform: rotate(4deg) !important;
	white-space: nowrap !important;
}

body.potter-treasure-chest .hm-treasure__hero-copy > picture {
	display: block !important;
	margin: 0 0 1.25rem !important;
	line-height: 0 !important;
}

body.potter-treasure-chest .hm-treasure__hero-copy > picture .hm-treasure__wordmark {
	margin-bottom: 0 !important;
}

body.potter-treasure-chest .hm-treasure__hero-copy > .hm-treasure__wordmark {
	margin-bottom: 1.25rem !important;
}

/* v10 polish: separate the mark label from the favicon and add clearer hero rhythm. */
body.potter-treasure-chest .hm-treasure__hero-mark small {
	left: 9px !important;
	bottom: 9px !important;
}

body.potter-treasure-chest .hm-treasure__hero-copy > picture {
	margin-bottom: 1.6rem !important;
}

body.potter-treasure-chest .hm-treasure__hero-copy > .hm-treasure__wordmark {
	margin-bottom: 1.6rem !important;
}

/* v11 polish: keep the label on the logo artwork while retaining its slight tilt. */
body.potter-treasure-chest .hm-treasure__hero-mark small {
	left: 22px !important;
	bottom: 28px !important;
	transform: rotate(4deg) !important;
}

/* v12 polish: raise the label toward the right and move it 6px inward. */
body.potter-treasure-chest .hm-treasure__hero-mark small {
	left: 28px !important;
	bottom: 28px !important;
	transform: rotate(-35deg) !important;
	transform-origin: center center !important;
}

/* v13 polish: retain the requested 35-degree rise and 6px right shift,
   while keeping the rotated label inside the artwork on desktop. */
body.potter-treasure-chest .hm-treasure__hero-mark small {
	left: 28px !important;
	bottom: 40px !important;
	transform: rotate(-35deg) !important;
	transform-origin: center center !important;
}

/* v14 polish: move the label 4px right and set the upward tilt to 20 degrees. */
body.potter-treasure-chest .hm-treasure__hero-mark small {
	left: 32px !important;
	bottom: 40px !important;
	transform: rotate(-20deg) !important;
	transform-origin: center center !important;
}

/* v15 polish: move the label 4px farther right; retain the 20-degree tilt. */
body.potter-treasure-chest .hm-treasure__hero-mark small {
	left: 36px !important;
	transform: rotate(-20deg) !important;
}

/* v16 polish: move the label 10px farther right; retain the 20-degree tilt. */
body.potter-treasure-chest .hm-treasure__hero-mark small {
	left: 46px !important;
	transform: rotate(-20deg) !important;
}

/* v17 mobile: show complete portrait covers instead of clipping them inside a short window. */
@media (max-width: 720px) {
	body.potter-treasure-chest .hm-resource-card__visual {
		 aspect-ratio: auto !important;
		 min-height: 0 !important;
		height: auto !important;
		overflow: hidden !important;
	}

	body.potter-treasure-chest .hm-resource-card__visual img {
		display: block !important;
		width: 100% !important;
		height: auto !important;
		max-width: none !important;
		object-fit: contain !important;
	}

	/* Mobile-only: 30px left and 30px down from the current label position. */
	body.potter-treasure-chest .hm-treasure__hero-mark small {
		left: 16px !important;
		bottom: 10px !important;
		transform: rotate(-20deg) !important;
	}

	/* Keep the gold canvas directly against the mobile navigation. */
	body.potter-treasure-chest #content,
	body.potter-treasure-chest #inner-content,
	body.potter-treasure-chest #main,
	body.potter-treasure-chest .entry-content {
		margin-top: 0 !important;
		padding-top: 0 !important;
	}

	body.potter-treasure-chest .hm-treasure {
		margin-top: 0 !important;
	}
}

/* v18 mobile: remove the unused header tail below the navigation. */
@media (max-width: 720px) {
	body.potter-treasure-chest #header {
		height: 72px !important;
		min-height: 72px !important;
	}

	/* Center all guide copy and the download action. */
	body.potter-treasure-chest .hm-resource-card__content {
		align-items: center !important;
		text-align: center !important;
	}

	body.potter-treasure-chest .hm-resource-card__eyebrow,
	body.potter-treasure-chest .hm-resource-card h3,
	body.potter-treasure-chest .hm-resource-card__description {
		margin-right: auto !important;
		margin-left: auto !important;
		text-align: center !important;
	}

	body.potter-treasure-chest .hm-resource-card__bottom {
		align-items: center !important;
		width: 100% !important;
		text-align: center !important;
	}

	body.potter-treasure-chest .hm-resource-card__format {
		text-align: center !important;
	}

	body.potter-treasure-chest .hm-resource-card__button {
		margin-right: auto !important;
		margin-left: auto !important;
	}

	/* Four pixels left from the previous mobile position. */
	body.potter-treasure-chest .hm-treasure__hero-mark small {
		left: 12px !important;
	}
}