/* Sacred Joanne — pieces theme.json cannot express: print grain, cut-paper
   tiles, chips, notes, engravings, menus, cards, post layout, footer.
   Ad containers never get transforms, clipping or outlines (Mediavine). */

:root {
	--sjt-ink: var(--wp--preset--color--ink);
	--sjt-card: var(--wp--preset--color--card);
	--sjt-paper: var(--wp--preset--color--paper);
	--sjt-lilac: var(--wp--preset--color--lilac);
	--sjt-line: 2px solid var(--sjt-ink);
	--sjt-shadow: 6px 6px 0 var(--sjt-ink);
	--sjt-shadow-sm: 4px 4px 0 var(--sjt-ink);
	--sjt-bricolage: var(--wp--preset--font-family--bricolage);
	--sjt-serif: var(--wp--preset--font-family--instrument);
	--sjt-hand: var(--wp--preset--font-family--gochi);
	--sjt-grain: url(../img/grain-page.svg);
	--sjt-grain-strong: url(../img/grain-strong.svg);
	--sjt-grain-dark: url(../img/grain-dark.svg);
	--sjt-waves: url(../img/waves.svg);
}

/* ---------- Paper and surfaces ---------- */
body {
	background-image: var(--sjt-grain);
	background-size: 160px 160px;
}
.sjt-grain { background-image: var(--sjt-grain); background-size: 160px 160px; }
.sjt-grain-strong { background-image: var(--sjt-grain-strong); background-size: 160px 160px; }
.sjt-card {
	background-color: var(--sjt-card);
	background-image: var(--sjt-grain);
	background-size: 160px 160px;
	border: var(--sjt-line);
	box-shadow: var(--sjt-shadow);
}
.sjt-dark {
	background-color: var(--sjt-ink);
	background-image: var(--sjt-grain-dark), var(--sjt-waves);
	background-size: 160px 160px, 96px 36px;
	color: var(--sjt-paper);
}
.sjt-dark a { color: var(--sjt-paper); }
.sjt-block { border: var(--sjt-line); box-shadow: var(--sjt-shadow); }
.sjt-torn-bottom {
	clip-path: polygon(0 0, 100% 0, 100% 94%, 94% 100%, 88% 95%, 82% 100%, 76% 95%, 70% 100%, 64% 95%, 58% 100%, 52% 95%, 46% 100%, 40% 95%, 34% 100%, 28% 95%, 22% 100%, 16% 95%, 10% 100%, 4% 95%, 0 100%);
}
.sjt-tilt-0 { transform: rotate(-1deg); }
.sjt-tilt-1 { transform: rotate(1deg); }
.sjt-tilt-2 { transform: rotate(-0.5deg); }
.sjt-tilt-3 { transform: rotate(0.8deg); }

/* ---------- Type pieces ---------- */
.sjt-chip-ink {
	display: inline-block;
	background: var(--sjt-ink);
	color: var(--sjt-paper);
	font-family: var(--sjt-bricolage);
	font-weight: 800;
	letter-spacing: -0.03em;
	line-height: 1.05;
	padding: 3px 10px 5px;
	transform: rotate(-2deg);
	text-decoration: none;
}
a.sjt-chip-ink:hover, a.sjt-chip-ink:focus { color: var(--wp--preset--color--sun); }
.sjt-chip-ink--xl { font-size: var(--wp--preset--font-size--huge); padding: 0 0.2em 0.1em; letter-spacing: -0.045em; }
.sjt-note { font-family: var(--sjt-hand); font-weight: 400; }
.sjt-note--red { color: var(--wp--preset--color--note); }
.sjt-serif { font-family: var(--sjt-serif); font-style: italic; font-weight: 400; }

/* ---------- Engravings ---------- */
.sjt-engraving {
	display: block;
	height: auto;
	background-color: var(--sjt-e-color, var(--sjt-ink));
	opacity: var(--sjt-e-opacity, 0.82);
	-webkit-mask: var(--sjt-e) center / contain no-repeat;
	mask: var(--sjt-e) center / contain no-repeat;
	transform: rotate(var(--sjt-e-rot, 0deg));
	pointer-events: none;
}
.sjt-engraving-wrap { display: flex; justify-content: center; }

/* ---------- Buttons ---------- */
.sjt-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 52px;
	padding: 0 22px;
	background: var(--sjt-ink);
	color: var(--sjt-paper);
	box-shadow: 5px 5px 0 var(--wp--preset--color--coral);
	font-weight: 700;
	text-decoration: none;
}
.sjt-button--honey {
	background-color: var(--wp--preset--color--honey);
	background-image: var(--sjt-grain-strong);
	background-size: 160px 160px;
	color: var(--sjt-ink);
	border: var(--sjt-line);
	box-shadow: var(--sjt-shadow-sm);
}

/* ---------- Header and navigation ---------- */
.sjt-header { display: flex; align-items: center; justify-content: space-between; gap: 24px; min-height: 70px; }
.sjt-logo { display: inline-flex; align-items: center; gap: 6px; text-decoration: none; color: var(--sjt-ink); }
.sjt-logo__seal { width: 56px; height: 56px; margin-right: 6px; flex-shrink: 0; }
.sjt-logo__sacred { font-family: var(--sjt-bricolage); font-weight: 800; font-size: 25px; background: var(--sjt-ink); color: var(--sjt-paper); padding: 3px 12px; transform: rotate(-2deg); }
.sjt-logo__joanne { font-family: var(--sjt-serif); font-style: italic; font-size: 33px; line-height: 1.1; background: var(--wp--preset--color--rose); border: var(--sjt-line); padding: 0 12px; transform: rotate(2deg); }

.sjt-nav { position: relative; }
.sjt-nav__desktop { display: flex; align-items: center; gap: 26px; font-size: 16px; font-weight: 700; }
.sjt-nav__link { text-decoration: none; }
.sjt-nav__search {
	display: inline-flex; align-items: center; gap: 8px; height: 46px; padding: 0 18px;
	background: var(--sjt-ink); color: var(--sjt-paper) !important; transform: rotate(-2deg); text-decoration: none;
}
.sjt-menu { position: relative; }
.sjt-menu > summary { list-style: none; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px; border: 2px solid transparent; }
.sjt-menu > summary::-webkit-details-marker { display: none; }
.sjt-menu__caret { font-size: 12px; transition: none; }
.sjt-menu[open] > summary { border-color: var(--sjt-ink); transform: rotate(-2deg); }
.sjt-menu--outer[open] > summary { background: var(--wp--preset--color--peach); }
.sjt-menu--inner[open] > summary { background: var(--wp--preset--color--dusk); }
.sjt-menu[open] .sjt-menu__caret { transform: rotate(180deg); }
.sjt-menu__panel {
	position: absolute; right: -120px; top: calc(100% + 18px); z-index: 50;
	width: min(700px, 92vw); padding: 20px 24px 18px; box-shadow: 8px 8px 0 var(--sjt-ink);
	font-weight: 400;
}
.sjt-menu--inner .sjt-menu__panel { width: min(640px, 92vw); right: -40px; }
.sjt-menu__head { margin: 0 0 6px; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; }
.sjt-menu__head .sjt-chip-ink { font-size: 22px; }
.sjt-menu__head .sjt-note { font-size: 19px; color: var(--wp--preset--color--note); }
.sjt-menu__rows { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 28px; }
.sjt-menu-row { display: flex; align-items: center; gap: 12px; padding: 10px 0; border-top: 2px dashed var(--sjt-ink); text-decoration: none; color: var(--sjt-ink); }
.sjt-menu-row__thumb { position: relative; flex-shrink: 0; width: 52px; height: 52px; border: var(--sjt-line); display: flex; align-items: center; justify-content: center; overflow: hidden; }
.sjt-menu-row__text { display: flex; flex-direction: column; min-width: 0; }
.sjt-menu-row__name { font-family: var(--sjt-bricolage); font-weight: 800; font-size: 23px; letter-spacing: -0.03em; line-height: 1; }
.sjt-menu-row__name--serif { font-family: var(--sjt-serif); font-style: italic; font-weight: 400; letter-spacing: 0; }
.sjt-menu-row__note { font-family: var(--sjt-hand); font-size: 17px; color: var(--wp--preset--color--muted); }
.sjt-menu-row__arrow { margin-left: auto; font-weight: 700; }
.sjt-menu-row:hover .sjt-menu-row__name, .sjt-menu-row:focus .sjt-menu-row__name { text-decoration: underline; }
.sjt-menu__foot { margin: 8px 0 0; padding-top: 10px; border-top: 2px dashed var(--sjt-ink); display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.sjt-menu__foot .sjt-note { font-size: 18px; }
.sjt-menu__foot .sjt-chip-ink { font-size: 16px; transform: none; padding: 4px 12px; }

/* Mobile sheet */
.sjt-sheet { display: none; }
.sjt-sheet > summary {
	list-style: none; cursor: pointer; width: 44px; height: 44px; display: flex; align-items: center; justify-content: center;
	background: var(--sjt-ink); color: var(--sjt-paper); border: var(--sjt-line); transform: rotate(-3deg);
}
.sjt-sheet > summary::-webkit-details-marker { display: none; }
.sjt-sheet__icon-close { display: none; }
.sjt-sheet[open] .sjt-sheet__icon-open { display: none; }
.sjt-sheet[open] .sjt-sheet__icon-close { display: block; }
.sjt-sheet[open] > summary { position: fixed; top: 18px; right: 16px; z-index: 1001; }
.sjt-sheet__panel {
	position: fixed; inset: 0; z-index: 1000; overflow-y: auto;
	background-color: var(--sjt-lilac); background-image: var(--sjt-grain); background-size: 160px 160px;
	padding: 84px 16px 32px; display: flex; flex-direction: column; gap: 20px;
}
.sjt-sheet__panel .sjt-menu__rows { grid-template-columns: 1fr; }
.sjt-sheet__panel .sjt-menu-row__thumb { width: 44px; height: 44px; }
.sjt-sheet__panel .sjt-menu-row__name { font-size: 21px; }
.sjt-sheet__buttons { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }

@media (max-width: 1023px) {
	.sjt-nav__desktop { display: none; }
	.sjt-sheet { display: block; }
	.sjt-logo__seal { width: 42px; height: 42px; }
	.sjt-logo__sacred { font-size: 18px; padding: 3px 8px; }
	.sjt-logo__joanne { font-size: 24px; padding: 0 8px; }
}

/* ---------- Search form ---------- */
.search-form, .wp-block-search__inside-wrapper {
	display: flex; align-items: center; gap: 10px; min-height: 56px; padding: 0 6px 0 14px;
	background: var(--sjt-card); border: var(--sjt-line) !important; box-shadow: var(--sjt-shadow-sm);
}
.search-form label { flex: 1; }
.search-form .search-field, .wp-block-search__input { width: 100%; border: 0 !important; background: transparent; font: inherit; font-size: 16px; font-weight: 600; color: var(--sjt-ink); padding: 10px 0; }
.search-form .search-submit, .wp-block-search__button { background: var(--sjt-ink); color: var(--sjt-paper); border: 0; min-height: 44px; padding: 0 18px; font-weight: 700; font-size: 15px; cursor: pointer; }

/* ---------- Category tiles ---------- */
.sjt-tiles { display: grid; grid-template-columns: repeat(var(--sjt-cols, 4), minmax(0, 1fr)); gap: 22px; }
.sjt-tile {
	position: relative; overflow: hidden; isolation: isolate;
	display: flex; flex-direction: column; justify-content: space-between; gap: 14px;
	min-height: 170px; padding: 16px 18px;
	border: var(--sjt-line); box-shadow: 5px 5px 0 var(--sjt-ink);
	color: var(--sjt-ink); text-decoration: none;
}
.sjt-tile__engraving { position: absolute; top: 12px; right: 12px; z-index: -1; }
.sjt-tile__arrow { font-weight: 700; }
.sjt-tile__text { display: flex; flex-direction: column; }
.sjt-tile__name { font-family: var(--sjt-bricolage); font-weight: 800; letter-spacing: -0.04em; font-size: clamp(26px, 2.6vw, 36px); line-height: 0.95; }
.sjt-tile__name--serif { font-family: var(--sjt-serif); font-style: italic; font-weight: 400; letter-spacing: 0; }
.sjt-tile:hover .sjt-tile__name, .sjt-tile:focus .sjt-tile__name { text-decoration: underline; }
@media (max-width: 781px) {
	.sjt-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
	.sjt-tile { min-height: 150px; padding: 12px 14px; box-shadow: var(--sjt-shadow-sm); }
	.sjt-tile__engraving { top: 10px; right: 10px; max-width: 42% !important; }
}

/* ---------- Listing cards (archives, search) ---------- */
.sjt-card-post {
	display: flex; flex-direction: column; justify-content: space-between; gap: 22px;
	min-height: 250px; height: 100%; box-sizing: border-box; padding: 20px 22px;
	border: var(--sjt-line); box-shadow: 5px 5px 0 var(--sjt-ink);
	color: var(--sjt-ink); text-decoration: none; background-color: var(--wp--preset--color--peach);
}
.sjt-card-post__count { display: flex; flex-direction: column; }
.sjt-card-post__number { font-family: var(--sjt-bricolage); font-weight: 800; font-size: clamp(44px, 4.4vw, 64px); letter-spacing: -0.05em; line-height: 0.9; }
.sjt-card-post__count .sjt-note { font-size: 20px; }
.sjt-card-post__title {
	font-family: var(--sjt-bricolage); font-weight: 800; font-size: clamp(16px, 1.5vw, 21px); letter-spacing: -0.02em; line-height: 1.15;
	display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden;
}
.sjt-card-post:hover .sjt-card-post__title, .sjt-card-post:focus .sjt-card-post__title { text-decoration: underline; }
/* Colours rotate and shift by one per row of four, so neighbours never match. */
.sjt-cards > li:nth-child(16n+1) .sjt-card-post, .sjt-cards > li:nth-child(16n+8) .sjt-card-post, .sjt-cards > li:nth-child(16n+11) .sjt-card-post, .sjt-cards > li:nth-child(16n+14) .sjt-card-post { background-color: var(--wp--preset--color--peach); }
.sjt-cards > li:nth-child(16n+2) .sjt-card-post, .sjt-cards > li:nth-child(16n+5) .sjt-card-post, .sjt-cards > li:nth-child(16n+12) .sjt-card-post, .sjt-cards > li:nth-child(16n+15) .sjt-card-post { background-color: var(--wp--preset--color--honey); }
.sjt-cards > li:nth-child(16n+3) .sjt-card-post, .sjt-cards > li:nth-child(16n+6) .sjt-card-post, .sjt-cards > li:nth-child(16n+9) .sjt-card-post, .sjt-cards > li:nth-child(16n+16) .sjt-card-post { background-color: var(--wp--preset--color--dusk); }
.sjt-cards > li:nth-child(16n+4) .sjt-card-post, .sjt-cards > li:nth-child(16n+7) .sjt-card-post, .sjt-cards > li:nth-child(16n+10) .sjt-card-post, .sjt-cards > li:nth-child(16n+13) .sjt-card-post { background-color: var(--wp--preset--color--rose); }
.sjt-cards > li:nth-child(4n+1) .sjt-card-post { transform: rotate(-1deg); }
.sjt-cards > li:nth-child(4n+2) .sjt-card-post { transform: rotate(0.8deg); }
.sjt-cards > li:nth-child(4n+3) .sjt-card-post { transform: rotate(-0.5deg); }
.sjt-cards > li:nth-child(4n) .sjt-card-post { transform: rotate(1deg); }
@media (max-width: 781px) {
	.sjt-card-post { min-height: 190px; padding: 14px 14px 16px; gap: 14px; box-shadow: var(--sjt-shadow-sm); }
}

/* ---------- Category intro ---------- */
.sjt-intro { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
.sjt-intro > .sjt-note { margin: 0; font-size: clamp(22px, 2vw, 28px); transform: rotate(-1.5deg); }
.sjt-intro__title { margin: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 10px; font-weight: 400; }
.sjt-intro__note { font-family: var(--sjt-serif); font-style: italic; font-size: clamp(30px, 3.2vw, 46px); line-height: 1; letter-spacing: 0; }
.sjt-intro__desc { font-size: clamp(16px, 1.4vw, 20px); line-height: 1.5; max-width: 620px; }
.sjt-intro__desc p { margin: 0; }

/* ---------- Single post ---------- */
.sjt-post-head .wp-block-post-terms a { display: inline-block; background: var(--wp--preset--color--peach); border: var(--sjt-line); padding: 1px 10px; font-size: 13px; font-weight: 800; text-decoration: none; }
.sjt-post-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 48px; }
@media (min-width: 1024px) {
	/* Mediavine: a sidebar of at least 300 px beside the content, as tall as the article. */
	.sjt-post-layout { grid-template-columns: minmax(0, 720px) 300px; justify-content: center; align-items: stretch; }
	/* Mediavine's sticky sidebar unit: see "1.2.0" at the end of this file. */
	.sjt-sidebar { display: flex; flex-direction: column; gap: 28px; min-width: 300px; }
}
.entry-content > * + * { margin-top: 1.1em; }
.entry-content h2 { margin-top: 1.6em; }
img, video, svg { max-width: 100%; }
.entry-content img, .entry-content video, .entry-content embed, .entry-content object { max-width: 100%; height: auto; }
.entry-content iframe { max-width: 100%; }
.entry-content figure { max-width: 100%; }
.entry-content table { display: block; max-width: 100%; overflow-x: auto; }
.entry-content a { text-decoration-color: var(--wp--preset--color--coral); text-decoration-thickness: 2px; text-underline-offset: 3px; }

/* ---------- Pagination ---------- */
.wp-block-query-pagination { gap: 10px; font-weight: 800; }
.wp-block-query-pagination-numbers .page-numbers {
	display: inline-flex; align-items: center; justify-content: center; min-width: 48px; height: 48px; margin: 0 4px;
	border: var(--sjt-line); background: var(--sjt-card); text-decoration: none;
}
.wp-block-query-pagination-numbers .page-numbers.current { background: var(--sjt-ink); color: var(--sjt-paper); transform: rotate(-3deg); }
.wp-block-query-pagination-numbers .page-numbers.dots { border: 0; background: none; font-family: var(--sjt-hand); font-size: 24px; }
.wp-block-query-pagination-next, .wp-block-query-pagination-previous {
	display: inline-flex; align-items: center; height: 48px; padding: 0 18px; border: var(--sjt-line);
	background: var(--wp--preset--color--honey); box-shadow: 3px 3px 0 var(--sjt-ink); text-decoration: none;
}

/* ---------- Footer ---------- */
.sjt-footer { display: flex; justify-content: space-between; align-items: center; gap: 16px 24px; flex-wrap: wrap; padding: 20px 28px; font-size: 14px; font-weight: 600; }
.sjt-footer .sjt-logo__seal { width: 38px; height: 38px; }
.sjt-footer .sjt-logo__sacred { background: var(--sjt-paper); color: var(--sjt-ink); font-size: 19px; transform: none; }
.sjt-footer .sjt-logo__joanne { background: none; border: 0; color: var(--sjt-paper); font-size: 25px; transform: none; }
.sjt-footer__links { display: flex; flex-wrap: wrap; gap: 10px 22px; margin: 0; }
.sjt-footer__links a { text-decoration: none; }
.sjt-footer__links a:hover, .sjt-footer__links a:focus { text-decoration: underline; }

/* ---------- Accessibility ---------- */
:where(a, summary, button, input):focus-visible { outline: 2px solid var(--wp--preset--color--coral); outline-offset: 3px; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- Ransom titles (hand-typed fixed pages only) ---------- */
.sjt-ransom { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 0; font-weight: 400; line-height: 1; letter-spacing: 0; }
.sjt-r { display: inline-block; }
.sjt-r--ink, .sjt-r--dusk, .sjt-r--honey, .sjt-r--rose { font-family: var(--sjt-bricolage); font-weight: 800; letter-spacing: -0.04em; font-size: clamp(42px, 5.2vw, 74px); padding: 0 0.18em 0.08em; }
.sjt-r--ink { background: var(--sjt-ink); color: var(--sjt-paper); transform: rotate(-2deg); }
.sjt-r--dusk { background: var(--wp--preset--color--dusk); border: var(--sjt-line); transform: rotate(3deg); }
.sjt-r--honey { background: var(--wp--preset--color--honey); border: var(--sjt-line); transform: rotate(2deg); }
.sjt-r--rose { background: var(--wp--preset--color--rose); border: var(--sjt-line); box-shadow: var(--sjt-shadow-sm); transform: rotate(2deg); }
.sjt-r--serif { font-family: var(--sjt-serif); font-style: italic; font-size: clamp(50px, 6.1vw, 88px); }
.sjt-r--serif-up { font-family: var(--sjt-serif); font-size: clamp(50px, 6vw, 86px); background: var(--wp--preset--color--peach); border: var(--sjt-line); padding: 0 0.18em; transform: rotate(-1.5deg); }
.sjt-r--hand { font-family: var(--sjt-hand); color: var(--wp--preset--color--note); font-size: clamp(40px, 4.9vw, 71px); }

/* ---------- Home ---------- */
.sjt-note--sun { color: var(--wp--preset--color--sun); }
.wp-block-columns.sjt-home-top, .wp-block-columns.sjt-home-bottom { align-items: stretch; }
.sjt-hero { position: relative; overflow: hidden; isolation: isolate; padding: clamp(20px, 2.4vw, 32px); display: flex; flex-direction: column; justify-content: space-between; gap: 22px; min-height: 440px; }
.sjt-hero__kicker { font-size: clamp(20px, 1.9vw, 26px); margin: 0; transform: rotate(-2deg); }
.sjt-hero__lead { max-width: 480px; margin: 0; }
.sjt-hero .sjt-ransom { max-width: 800px; }
.sjt-hero__engraving { position: absolute; right: 26px; bottom: 22px; z-index: -1; }
.sjt-home-search { padding: 26px; display: flex; flex-direction: column; gap: 14px; }
.sjt-home-search h2 { margin: 0; color: var(--sjt-paper); }
.sjt-home-search .sjt-note { margin: 0; font-size: 22px; }
.wp-block-button.is-style-outline .wp-block-button__link {
	background-color: var(--sjt-card); background-image: var(--sjt-grain); background-size: 160px 160px;
	color: var(--sjt-ink); border: var(--sjt-line); box-shadow: var(--sjt-shadow-sm);
}
.sjt-half { display: grid; grid-template-columns: 3fr 9fr; gap: 22px; align-items: stretch; }
.sjt-half:has(.sjt-thought) { grid-template-columns: 3fr 4fr 5fr; }
.sjt-door {
	position: relative; overflow: hidden; isolation: isolate; display: flex; flex-direction: column; justify-content: flex-end; gap: 4px;
	min-height: 340px; padding: 22px 24px; border: var(--sjt-line); box-shadow: var(--sjt-shadow); transform: rotate(-1deg);
}
.sjt-door + * { min-width: 0; }
.sjt-door .sjt-door__engraving { position: absolute; top: 20px; right: 0; z-index: -1; }
.sjt-door__title { margin: 0; font-size: clamp(40px, 4vw, 56px); letter-spacing: -0.045em; line-height: 0.95; }
.sjt-door__title.sjt-serif { font-size: clamp(46px, 4.6vw, 62px); letter-spacing: 0; }
.sjt-door__link { margin: 8px 0 0; }
.sjt-door__link .sjt-chip-ink { font-size: 16px; transform: none; padding: 3px 10px; }
.sjt-thought { padding: 26px 28px; box-shadow: var(--sjt-shadow); transform: rotate(-1.5deg); display: flex; flex-direction: column; justify-content: center; gap: 12px; }
.sjt-thought > * { margin: 0; }
.sjt-thought .sjt-note { font-size: 22px; }
.sjt-thought__quote { font-family: var(--sjt-serif); font-size: clamp(36px, 3.4vw, 48px); line-height: 1; }
.sjt-newsletter, .sjt-follow { padding: 22px 26px; }
.sjt-follow { border: var(--sjt-line); box-shadow: var(--sjt-shadow); }
.sjt-newsletter > *, .sjt-follow > * { margin-top: 0; }
@media (max-width: 1023px) {
	.sjt-half, .sjt-half:has(.sjt-thought) { grid-template-columns: minmax(0, 1fr); }
	.sjt-door { min-height: 220px; }
	.sjt-hero { min-height: 0; }
	.sjt-hero__engraving { position: static; align-self: flex-end; }
}
@media (max-width: 781px) {
	.sjt-cards.wp-block-post-template.is-layout-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 18px 14px; }
	.sjt-thought, .sjt-door { transform: none; }
}

/* ---------- 404 ---------- */
.sjt-404-paper { position: relative; width: 100%; max-width: 540px; }
.sjt-404-drop { filter: drop-shadow(8px 8px 0 var(--sjt-ink)); }
.sjt-404-sheet { position: relative; aspect-ratio: 540 / 470; }
.sjt-404-seal { position: absolute; left: 20%; top: 12%; width: 60%; aspect-ratio: 1; background: url(../img/seal.svg) center / contain no-repeat; transform: rotate(-5deg); }
.sjt-404-tape { position: absolute; left: 50%; top: -12px; width: 120px; height: 28px; margin-left: -60px; background: rgba(233, 163, 127, 0.55); transform: rotate(-3deg); }

/* ---------- Affiliate text CTAs inside posts (old inline blue/pink styles) ---------- */
.entry-content .sj-clickbank-cta[style*="background"] {
	background-color: var(--wp--preset--color--honey) !important;
	background-image: var(--sjt-grain-strong) !important;
	background-size: 160px 160px !important;
	border: var(--sjt-line) !important;
	border-left: 6px solid var(--wp--preset--color--coral) !important;
}
.entry-content .sj-clickbank-cta a {
	color: var(--sjt-ink) !important;
	text-decoration-color: var(--wp--preset--color--coral) !important;
	text-decoration-thickness: 2px !important;
	text-underline-offset: 4px;
}

/* ---------- Explore ---------- */
.sjt-explore-label { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 12px; margin-bottom: 0; }
.sjt-explore-label .sjt-chip-ink { font-size: clamp(22px, 2vw, 30px); }
.sjt-explore-label .sjt-note { font-size: clamp(19px, 1.7vw, 24px); }

/* ---------- Breadcrumbs ---------- */
.sjt-crumbs ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 4px 10px; font-size: 14px; font-weight: 600; color: var(--wp--preset--color--muted); }
.sjt-crumbs li + li::before { content: "›"; margin-right: 10px; color: var(--wp--preset--color--coral); }
.sjt-crumbs a { text-decoration: none; }
.sjt-crumbs a:hover, .sjt-crumbs a:focus { text-decoration: underline; }

/* ---------- Pillar header ---------- */
.sjt-pillar-head { display: grid; grid-template-columns: minmax(0, 1fr); gap: 22px; align-items: stretch; }
.sjt-pillar-head.has-aside { grid-template-columns: minmax(0, 2fr) minmax(260px, 1fr); }
.sjt-header-card { position: relative; overflow: hidden; isolation: isolate; padding: clamp(20px, 3vw, 34px) clamp(18px, 3vw, 38px); display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
.sjt-header-card__engraving { position: absolute; right: 28px; bottom: 22px; z-index: -1; }
.sjt-header-card__kicker { margin: 0; font-size: clamp(22px, 2vw, 28px); transform: rotate(-1.5deg); }
.sjt-header-card__crumb { font-weight: 700; font-size: 15px; text-decoration: none; }
.sjt-header-card__title { margin: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 10px; font-weight: 400; max-width: 72%; }
.sjt-header-card__note { font-family: var(--sjt-serif); font-style: italic; font-size: clamp(28px, 3vw, 44px); line-height: 1; letter-spacing: 0; }
.sjt-header-card__desc { font-size: clamp(16px, 1.4vw, 20px); line-height: 1.5; max-width: min(620px, 64%); } /* clear of the engraving */
.sjt-header-card__desc p { margin: 0; }
.sjt-start { padding: 22px 24px; box-shadow: var(--sjt-shadow); transform: rotate(1.5deg); display: flex; flex-direction: column; gap: 10px; }
.sjt-start > .sjt-note { margin: 0; font-size: 26px; }
.sjt-start__row {
	display: flex; justify-content: space-between; align-items: center; gap: 10px; min-height: 46px; padding: 0 14px;
	background: var(--sjt-card); border: var(--sjt-line); font-size: 15px; font-weight: 700; text-decoration: none;
}
.sjt-start__count, .sjt-topic__count { font-family: var(--sjt-hand); font-weight: 400; font-size: 17px; color: var(--wp--preset--color--muted); }
.sjt-start__row:hover, .sjt-start__row:focus { background: var(--sjt-paper); }
@media (max-width: 781px) {
	.sjt-pillar-head.has-aside { grid-template-columns: minmax(0, 1fr); }
	.sjt-start { transform: none; }
	.sjt-header-card__title, .sjt-header-card__desc { max-width: 100%; }
	.sjt-header-card__engraving { position: static; align-self: flex-end; margin-top: -8px; }
}

/* ---------- Sub-pillar chips ---------- */
.sjt-topics { display: flex; flex-direction: column; gap: 18px; }
.sjt-topics__heading { margin: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 14px; font-weight: 400; }
.sjt-topics__heading .sjt-chip-ink { font-size: clamp(22px, 2vw, 30px); }
.sjt-topics__heading .sjt-note { font-size: clamp(19px, 1.7vw, 24px); }
.sjt-topics__more { margin-left: auto; font-size: 15px; font-weight: 700; }
.sjt-topics__group { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 8px 20px; align-items: start; }
.sjt-topics__label { margin: 8px 0 0; font-size: 21px; color: var(--wp--preset--color--note); }
.sjt-topics__chips { display: flex; flex-wrap: wrap; gap: 10px 12px; }
.sjt-topic {
	display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 14px;
	border: var(--sjt-line); box-shadow: 3px 3px 0 var(--sjt-ink); color: var(--sjt-ink);
	font-family: var(--sjt-bricolage); font-weight: 800; font-size: 16px; letter-spacing: -0.01em; text-decoration: none;
}
.sjt-topic:nth-child(3n+1) { transform: rotate(-1deg); }
.sjt-topic:nth-child(3n+2) { transform: rotate(0.8deg); }
.sjt-topic:hover, .sjt-topic:focus { text-decoration: underline; }
.sjt-topic.is-current { background: var(--sjt-ink) !important; background-image: none !important; color: var(--sjt-paper); }
.sjt-topic.is-current .sjt-topic__count { color: var(--wp--preset--color--sun); }
@media (max-width: 781px) {
	.sjt-topics__group { grid-template-columns: minmax(0, 1fr); }
	.sjt-topics__label { margin: 0; }
	.sjt-topic { min-height: 40px; font-size: 15px; }
}

/* ---------- Card lists outside the Query Loop ---------- */
.sjt-cards--grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 26px 22px; }
@media (max-width: 1023px) { .sjt-cards--grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 781px) { .sjt-cards--grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 14px; } }
.sjt-related, .sjt-related-pillars { display: flex; flex-direction: column; gap: 22px; }
.sjt-more { margin: 6px 0 0; text-align: center; }
.sjt-more .sjt-chip-ink { font-size: 18px; padding: 6px 16px; }

/* ---------- Reader favorites ---------- */
.sjt-fav { padding: 20px 26px 12px; display: flex; flex-direction: column; gap: 12px; }
.sjt-fav__head { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.sjt-fav__head h2 { margin: 0; display: flex; align-items: center; gap: 10px; font-weight: 400; }
.sjt-fav__head .sjt-chip-ink { font-size: clamp(24px, 2.2vw, 32px); }
.sjt-fav__head .sjt-serif { font-size: clamp(32px, 3vw, 42px); }
.sjt-fav__head > a { font-size: 15px; font-weight: 700; }
.sjt-fav__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 30px; }
.sjt-fav__list a { display: flex; gap: 12px; align-items: center; padding: 12px 0; border-top: 2px dashed var(--sjt-ink); text-decoration: none; }
.sjt-fav__num { flex-shrink: 0; width: 44px; height: 40px; display: flex; align-items: center; justify-content: center; font-family: var(--sjt-bricolage); font-weight: 800; font-size: 20px; background: url(../img/circle.svg) center / contain no-repeat; }
.sjt-fav__text { display: flex; flex-direction: column; min-width: 0; }
.sjt-fav__text .sjt-note { font-size: 16px; }
.sjt-fav__title { font-family: var(--sjt-serif); font-size: 23px; line-height: 1.05; }
.sjt-fav__list a:hover .sjt-fav__title, .sjt-fav__list a:focus .sjt-fav__title { text-decoration: underline; }
@media (max-width: 1023px) { .sjt-fav__list { grid-template-columns: minmax(0, 1fr); } }

/* ---------- Free resources ---------- */
.sjt-resources { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; padding-top: 14px; }
.sjt-resource {
	position: relative; display: flex; flex-direction: column; justify-content: space-between; gap: 10px; min-height: 180px;
	padding: 22px 24px; border: var(--sjt-line); box-shadow: var(--sjt-shadow); color: var(--sjt-ink); text-decoration: none;
}
.sjt-resource .sjt-note { font-size: 19px; padding-right: 64px; } /* room for the sticker in narrow cards */
.sjt-resource__title { font-family: var(--sjt-serif); font-size: clamp(28px, 2.6vw, 34px); line-height: 1; padding-right: 56px; }
.sjt-resource__cta { font-size: 15px; font-weight: 700; }
.sjt-resource:hover .sjt-resource__title, .sjt-resource:focus .sjt-resource__title { text-decoration: underline; }
.sjt-sticker {
	position: absolute; right: 20px; top: -16px; width: 70px; height: 70px; border-radius: 50%; border: var(--sjt-line);
	display: flex; align-items: center; justify-content: center; font-family: var(--sjt-hand); font-size: 21px; transform: rotate(12deg);
}
@media (max-width: 781px) { .sjt-resources { grid-template-columns: minmax(0, 1fr); gap: 28px; } }

/* ---------- About, newsletter, generic page heroes ---------- */
.wp-block-columns.sjt-about-top, .wp-block-columns.sjt-news-top { align-items: stretch; }
.sjt-about-hero, .sjt-news-hero { padding: clamp(22px, 3vw, 38px); }
.sjt-about-hero > *, .sjt-news-hero > * { margin-top: 0; }
.sjt-about-raven { border: var(--sjt-line); box-shadow: var(--sjt-shadow); transform: rotate(1deg); padding: 30px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; }
.sjt-about-raven__seal { display: block; width: min(250px, 70%); aspect-ratio: 1; background: url(../img/seal.svg) center / contain no-repeat; }
.sjt-about-doors { gap: 26px; }
.sjt-about-doors .sjt-door { min-height: 260px; }
.sjt-band { padding: 30px 40px; gap: 24px; }
.sjt-band h2 { margin: 0; color: var(--sjt-paper); }
.sjt-band .sjt-note { margin: 0; }
.sjt-button-sun .wp-block-button__link { background: var(--wp--preset--color--sun); color: var(--sjt-ink); box-shadow: none; }
.sjt-news-form { margin-top: 12px; }
.sjt-letter { padding: 22px 24px; transform: rotate(-3deg); box-shadow: 8px 8px 0 var(--sjt-ink); }
.sjt-letter > * { margin: 0 0 10px; }
.sjt-letter__from { display: flex; justify-content: space-between; font-size: 14px; }
.sjt-letter__from span { color: var(--wp--preset--color--muted); font-size: 12px; }
.sjt-letter-cards { gap: 24px; }
.sjt-letter-card { position: relative; overflow: hidden; isolation: isolate; min-height: 210px; padding: 22px 24px; border: var(--sjt-line); box-shadow: 5px 5px 0 var(--sjt-ink); display: flex; flex-direction: column; justify-content: flex-end; }
.sjt-letter-card > * { margin: 0; }
.sjt-letter-card .sjt-note { font-size: 20px; }
.sjt-letter-card h3 { font-size: clamp(26px, 2.4vw, 32px); }
.sjt-letter-card h3.sjt-serif { font-family: var(--sjt-serif); font-weight: 400; }
.sjt-letter-card__engraving { position: absolute; top: 12px; right: 12px; z-index: -1; }
.sjt-page-hero { position: relative; overflow: hidden; isolation: isolate; padding: clamp(22px, 3vw, 36px) clamp(18px, 3vw, 40px); }
.sjt-page-hero > * { margin-top: 0; }
.sjt-page-hero__engraving { position: absolute; right: 28px; bottom: 18px; z-index: -1; }
@media (max-width: 781px) {
	.sjt-about-doors, .sjt-letter-cards { grid-template-columns: minmax(0, 1fr) !important; }
	.sjt-letter { transform: none; }
	.sjt-page-hero__engraving { position: static; margin-left: auto; }
}

/* Mobile menu: link to each half's pillar page. */
.sjt-sheet__all { margin: 12px 0 0; }
.sjt-sheet__all .sjt-chip-ink { font-size: 15px; padding: 4px 10px; }

/* ---------- 1.2.0: rhythm, doors, tiles, favourites, phone menu, Mediavine ---------- */

/* One vertical rhythm: sections (template blockGap), blocks stacked on phones and
   the space before the footer all use the "section" spacing from theme.json
   (its own slug: core's default presets override theme presets with the same
   numeric slugs, e.g. "50"). */
@media (max-width: 781px) {
	main .wp-block-columns { row-gap: var(--wp--preset--spacing--section); }
}
/* The page already ends with the section gap (main's bottom padding). */
.wp-site-blocks > footer { margin-block-start: 0; }
/* Old page content (Kadence era) ends with its own bottom padding. */
.entry-content > :last-child { margin-bottom: 0; }

/* Doors: engraving and text side by side, never on top of each other. */
.sjt-door .sjt-door__engraving { max-width: 48% !important; }
@media (max-width: 781px) {
	.sjt-door { min-height: 190px; padding: 18px 20px; }
	.sjt-door .sjt-door__engraving { top: 12px; right: 8px; max-width: 42% !important; max-height: 72%; }
	.sjt-door > :not(.sjt-door__engraving) { max-width: 60%; }
	.sjt-door__title { font-size: 40px; }
	.sjt-door__title.sjt-serif { font-size: 46px; }
}

/* Tiles: the name shrinks to fit the tile when its longest word is long
   (--sjt-len is set per tile), so new or long category names never get cut. */
.sjt-tile { container-type: inline-size; }
.sjt-tile__name { font-size: min(clamp(26px, 2.6vw, 36px), max(16px, 100cqi / (var(--sjt-len, 8) * 0.56))); }
.sjt-tile__name--serif { font-size: min(clamp(28px, 2.8vw, 38px), max(17px, 100cqi / (var(--sjt-len, 8) * 0.46))); }
@media (max-width: 781px) {
	.sjt-tile__engraving { max-height: 58%; }
}

/* Reader favourites: tighter on phones; "All articles →" never splits. */
.sjt-fav__head { flex-wrap: wrap; }
.sjt-fav__head > a { white-space: nowrap; }
@media (max-width: 781px) {
	.sjt-fav { padding: 16px 18px 6px; gap: 8px; }
	.sjt-fav__list a { padding: 9px 0; gap: 10px; }
	.sjt-fav__num { width: 38px; height: 34px; font-size: 17px; }
	.sjt-fav__title { font-size: 20px; }
}

/* Phone menu: room at the end so the sticky ad at the bottom of the screen
   never covers the last links. */
.sjt-sheet__panel { padding-bottom: calc(140px + env(safe-area-inset-bottom, 0px)); }

@media (min-width: 1024px) {
	/* Mediavine's site settings put the sticky sidebar unit at the end of
	   .sidebar-inner-wrap and stop it at .site-footer (Kadence's class names,
	   kept in parts/sidebar.html and parts/footer.html). The wrapper stretches
	   to the article's height so the unit stays in view while reading. */
	.sjt-post-layout > .wp-block-template-part { display: flex; flex-direction: column; }
	.sjt-post-layout .sjt-sidebar { flex: 1 1 auto; }
	.sjt-sidebar > .sidebar-inner-wrap { flex: 1 1 auto; display: flex; flex-direction: column; gap: 28px; }
}

/* ---------- 1.3.0: pillars reach their posts quickly on phones ---------- */

/* Topic strip: phones only (from 782px the header's "start with…" box does this). */
.sjt-strip { display: none; }
@media (max-width: 781px) {
	.sjt-strip { display: block; }
	.sjt-strip__row {
		display: flex; align-items: center; gap: 10px; overflow-x: auto; overscroll-behavior-x: contain;
		padding: 4px 48px 10px 2px; scroll-snap-type: x proximity; scrollbar-width: none;
		-webkit-mask-image: linear-gradient(90deg, #000 82%, transparent); mask-image: linear-gradient(90deg, #000 82%, transparent);
	}
	.sjt-strip__row::-webkit-scrollbar { display: none; }
	.sjt-strip .sjt-topic { flex: 0 0 auto; white-space: nowrap; scroll-snap-align: start; }
	.sjt-strip__all { flex: 0 0 auto; font-weight: 700; font-size: 15px; white-space: nowrap; }

	/* Compact header: the engraving sits small at the top right instead of on its own row;
	   "start with…" is replaced by the strip. */
	.sjt-pillar-head .sjt-start { display: none; }
	.sjt-pillar-head .sjt-header-card { gap: 8px; padding-right: 18px; }
	.sjt-pillar-head .sjt-header-card__engraving { position: absolute; top: 12px; right: 12px; bottom: auto; margin: 0; max-width: 30% !important; max-height: 96px; }
	.sjt-pillar-head .sjt-header-card > :is(.sjt-header-card__crumb, .sjt-header-card__kicker) { max-width: 64%; }
	.sjt-pillar-head .sjt-header-card__title { margin-top: 6px; }
	.sjt-pillar-head .sjt-chip-ink--xl { font-size: clamp(30px, 9vw, 40px); } /* long page titles ("INTP Personality Type") */
	.sjt-pillar-head .sjt-header-card__note { font-size: 26px; }
	.sjt-pillar-head .sjt-header-card__desc { font-size: 15px; }
}

/* Pagination: same distance from the posts as between sections (the block's own
   margin setting is not applied by WordPress here). */
.wp-block-query > .wp-block-query-pagination { margin-top: var(--wp--preset--spacing--section); }

/* ---------- 1.4.0: topic pages (signs, types, planets) ---------- */
/* Small facts under the name: dates, element, ruler; the four MBTI letters. */
.sjt-header-card__facts { list-style: none; margin: 2px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.sjt-header-card__facts li { padding: 3px 11px; border: 2px solid var(--sjt-ink); background: var(--sjt-paper); font-size: 14px; font-weight: 700; line-height: 1.4; box-shadow: 2px 2px 0 var(--sjt-ink); }
.sjt-header-card__facts li:nth-child(odd) { transform: rotate(-1deg); }
@media (max-width: 781px) {
	.sjt-header-card__facts li { font-size: 13px; padding: 2px 9px; }
}

/* ---------- 1.5.0: signup forms, related links, free resource pages ---------- */

/* Signup forms (Sacred Joanne Site plugin: .sjs-form). */
.sjs-form { display: flex; flex-direction: column; gap: 10px; margin: 6px 0 0; }
.sjs-form > p { margin: 0; }
.sjs-form__field { display: flex; flex-direction: column; gap: 4px; }
.sjs-form label { font-weight: 700; font-size: 15px; }
.sjs-form__optional { font-weight: 400; color: var(--wp--preset--color--muted); }
.sjs-form input[type="text"], .sjs-form input[type="email"] {
	width: 100%; box-sizing: border-box; min-height: 48px; padding: 0 14px;
	border: var(--sjt-line); border-radius: 0; background: var(--sjt-lilac); color: var(--sjt-ink); font: inherit; font-size: 17px;
}
.sjs-form input:focus-visible { outline: 3px solid var(--wp--preset--color--coral); outline-offset: 2px; }
.sjs-form__button {
	min-height: 50px; padding: 0 24px; border: 0; border-radius: 0; cursor: pointer;
	background: var(--sjt-ink); color: var(--sjt-paper); font: inherit; font-weight: 800; font-size: 17px;
	box-shadow: 4px 4px 0 var(--wp--preset--color--coral);
}
.sjs-form__button:hover, .sjs-form__button:focus-visible { transform: translate(-1px, -1px); box-shadow: 5px 5px 0 var(--wp--preset--color--coral); }
.sjs-form.is-busy .sjs-form__button { opacity: 0.6; cursor: progress; }
.sjs-form__note { font-size: 13px; color: var(--wp--preset--color--muted); }
.sjs-form__note a { color: inherit; }
.sjs-form__message { padding: 10px 14px; border: var(--sjt-line); background: var(--wp--preset--color--sun); font-weight: 700; }
.sjs-form__message.is-error { background: var(--wp--preset--color--rose); }
.sjs-form.is-done .sjs-form__field, .sjs-form.is-done .sjs-form__actions { display: none; }
.sjs-form__trap { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
/* On dark bands. */
.sjt-dark .sjs-form input[type="text"], .sjt-dark .sjs-form input[type="email"] { background: var(--sjt-paper); border-color: var(--sjt-paper); }
.sjt-dark .sjs-form label, .sjt-dark .sjs-form__note { color: var(--sjt-paper); }
.sjt-dark .sjs-form__button { background: var(--wp--preset--color--sun); color: var(--sjt-ink); }
.sjt-dark .sjs-form__message { color: var(--sjt-ink); }
/* Sidebar: compact. */
.sjt-sidebar .sjs-form input[type="email"] { min-height: 44px; font-size: 16px; }
.sjt-sidebar .sjs-form__button { width: 100%; min-height: 46px; font-size: 16px; }

/* Related links that ContentOS adds inside posts (they carry old inline colours). */
.entry-content .sj-internal-link {
	margin: 1.6em 0 !important; padding: 14px 18px !important; border: var(--sjt-line) !important; border-radius: 0 !important;
	background: var(--sjt-card) !important; box-shadow: 4px 4px 0 var(--sjt-ink); line-height: 1.4 !important;
}
.entry-content .sj-internal-link > span:first-child {
	display: block; margin-bottom: 2px; color: var(--wp--preset--color--note) !important;
	font-family: var(--sjt-hand); font-weight: 400 !important; font-size: 19px; text-transform: lowercase;
}
.entry-content .sj-internal-link > a { color: var(--sjt-ink) !important; font-family: var(--sjt-bricolage); font-weight: 800 !important; font-size: 19px; letter-spacing: -0.01em; text-decoration-color: var(--wp--preset--color--coral) !important; text-decoration-thickness: 2px; }

/* Free resource pages (content from site-redesign/theme-dev/resource_pages.py, pattern "Free resource page"). */
.sjt-res-hero { gap: clamp(22px, 3vw, 40px); align-items: stretch; }
.sjt-res-hero__text { padding: clamp(22px, 3.4vw, 44px); display: flex; flex-direction: column; gap: 14px; }
.sjt-res-hero__text > * { margin: 0; }
.sjt-res-title { font-size: clamp(38px, 5vw, 64px); line-height: 0.98; letter-spacing: -0.045em; }
.sjt-res-lede { font-size: clamp(17px, 1.5vw, 20px); line-height: 1.55; }
.sjt-res-hero__cover { position: relative; display: flex; align-items: center; justify-content: center; padding: 18px; }
.sjt-res-cover { margin: 0; }
.sjt-res-cover img { display: block; width: 100%; max-width: 400px; height: auto; margin: 0 auto; border: var(--sjt-line); box-shadow: 8px 8px 0 var(--sjt-ink); transform: rotate(2.5deg); }
.sjt-res-sticker {
	position: absolute; top: 4px; left: 6%; z-index: 2; margin: 0; width: 92px; height: 92px; display: grid; place-items: center;
	border: var(--sjt-line); border-radius: 50%; background: var(--wp--preset--color--sun); box-shadow: 3px 3px 0 var(--sjt-ink);
	font-family: var(--sjt-hand); font-size: 28px; transform: rotate(-10deg);
}
.sjt-res-inside { display: flex; flex-direction: column; gap: 22px; }
.sjt-res-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.sjt-res-step {
	position: relative; padding: 22px 22px 24px; border: var(--sjt-line); box-shadow: 5px 5px 0 var(--sjt-ink);
	background-color: var(--wp--preset--color--honey); background-image: var(--sjt-grain-strong); background-size: 160px 160px;
}
.sjt-res-step--2 { background-color: var(--wp--preset--color--dusk); transform: rotate(0.6deg); }
.sjt-res-step--3 { background-color: var(--wp--preset--color--rose); transform: rotate(-0.6deg); }
.sjt-res-step > * { margin: 0 0 8px; }
.sjt-res-step h3 { font-size: clamp(22px, 2vw, 26px); letter-spacing: -0.02em; }
.sjt-res-step__num {
	width: 46px; height: 42px; display: flex; align-items: center; justify-content: center; margin-bottom: 10px;
	font-family: var(--sjt-bricolage); font-weight: 800; font-size: 22px; background: url(../img/circle.svg) center / contain no-repeat;
}
.sjt-res-split { gap: clamp(22px, 3vw, 40px); align-items: center; }
.sjt-res-preview { margin: 0; }
.sjt-res-preview img { display: block; width: 100%; height: auto; border: var(--sjt-line); box-shadow: 6px 6px 0 var(--sjt-ink); transform: rotate(-1.5deg); }
.sjt-res-split__text { padding: clamp(22px, 3vw, 38px); }
.sjt-res-split__text > * { margin: 0 0 12px; }
.sjt-res-h2 { font-size: clamp(30px, 3.2vw, 44px); line-height: 1.02; letter-spacing: -0.035em; }
.sjt-res-cta { padding: clamp(26px, 4vw, 52px); text-align: left; }
.sjt-res-cta > * { max-width: 620px; margin-left: auto; margin-right: auto; }
.sjt-res-cta .sjt-res-h2 { color: var(--sjt-paper); margin: 4px auto 14px; }
@media (max-width: 781px) {
	.sjt-res-steps { grid-template-columns: minmax(0, 1fr); }
	.sjt-res-step--2, .sjt-res-step--3 { transform: none; }
	.sjt-res-hero__cover { padding: 10px 24px 4px; }
	.sjt-res-cover img { max-width: 260px; }
	.sjt-res-sticker { width: 74px; height: 74px; font-size: 23px; left: 2%; }
}

/* ---------- 1.5.1: resource cards with a cover (Free master guides) ---------- */
/* The tilted cover and its shadow need room before the card title. */
.sjt-res-step > .sjt-res-preview { margin-bottom: 20px; }

/* ---------- 1.6.5: Explore in the menu ---------- */
/* Phone menu: the third button (Explore) takes the full row. */
.sjt-sheet__buttons > :last-child:nth-child(odd) { grid-column: 1 / -1; }
/* Desktop menu labels stay on one line; below 1100px the phone menu takes over
   (with Explore the desktop row no longer fits around 1024px). */
.sjt-nav__desktop .sjt-menu__toggle, .sjt-nav__desktop .sjt-nav__link, .sjt-nav__desktop .sjt-nav__search { white-space: nowrap; }
@media (min-width: 1100px) and (max-width: 1279px) { .sjt-nav__desktop { gap: 18px; } }
@media (min-width: 1024px) and (max-width: 1099px) {
	.sjt-nav__desktop { display: none; }
	.sjt-sheet { display: block; }
}

/* ---------- 1.6.5: season pages (template page-season) ---------- */
/* Sections from the page content, spaced like the pillar pages. */
.sjt-season-sections > .wp-block-group:first-child { margin-top: 0 !important; }
