/* ==========================================================================
   JKC Fixes
   Uses the theme's own custom properties where they exist, with fallbacks so
   nothing turns into unstyled text if this is ever run under another theme.
   ========================================================================== */

/* --------------------------------------------------------------------------
   "Hello <affix>" — the bar above the masthead
   -------------------------------------------------------------------------- */

.jkcfix-hello {
	background: var(--green-deep, #16391d);
	color: var(--on-green, #eef3e9);
	font-family: var(--body, system-ui, sans-serif);
	font-size: 13px;
	line-height: 1.4;
	border-bottom: 1px solid rgba(255, 255, 255, .1);
}

.jkcfix-hello__wrap {
	max-width: var(--max, 1240px);
	margin: 0 auto;
	padding-block: 9px;
	padding-inline: var(--gutter, 24px);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	flex-wrap: wrap;
}

.jkcfix-hello__text { margin: 0; letter-spacing: .01em; }
.jkcfix-hello__text strong { font-weight: 600; }

.jkcfix-hello__tag {
	display: inline-block;
	margin-left: 9px;
	font-family: var(--mono, ui-monospace, monospace);
	font-size: 9.5px;
	letter-spacing: .12em;
	text-transform: uppercase;
	opacity: .62;
	vertical-align: 1px;
}

.jkcfix-hello__side {
	margin: 0;
	display: flex;
	align-items: center;
	gap: 16px;
}

.jkcfix-hello__standing {
	font-family: var(--mono, ui-monospace, monospace);
	font-size: 9.5px;
	letter-spacing: .12em;
	text-transform: uppercase;
	opacity: .72;
}

.jkcfix-hello__side a {
	color: inherit;
	text-decoration: none;
	border-bottom: 1px solid rgba(255, 255, 255, .32);
	padding-bottom: 1px;
}
.jkcfix-hello__side a:hover { border-bottom-color: currentColor; }

@media (max-width: 560px) {
	.jkcfix-hello__wrap { padding-block: 8px; gap: 8px; }
	.jkcfix-hello__tag { display: none; }
	.jkcfix-hello__standing { display: none; }
	.jkcfix-hello__side { gap: 14px; }
}

/* --------------------------------------------------------------------------
   "Check your email" — after applying
   -------------------------------------------------------------------------- */

.jkcfix-done {
	font-family: var(--body, system-ui, sans-serif);
	color: var(--ink, #1a1d17);
	background: var(--paper, #fff);
	border: 1px solid var(--rule, #d9ddd1);
	border-top: 3px solid var(--green, #2e6b33);
	border-radius: 4px;
	padding: clamp(24px, 4vw, 40px);
	max-width: 62ch;
	box-shadow: var(--shadow, 0 8px 24px rgba(20, 30, 15, .06));
}

.jkcfix-done--warn { border-top-color: var(--gold, #9a7420); }

.jkcfix-done__mark {
	width: 46px;
	height: 46px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--tint, #dfe8da);
	color: var(--green, #2e6b33);
	margin-bottom: 18px;
}
.jkcfix-done--warn .jkcfix-done__mark {
	background: var(--gold-tint, #f2e9d6);
	color: var(--gold, #9a7420);
}

.jkcfix-done__head {
	font-family: var(--display, Georgia, serif);
	font-weight: 600;
	font-size: clamp(23px, 3.2vw, 31px);
	line-height: 1.15;
	margin: 0 0 14px;
	color: var(--ink, #1a1d17);
}

.jkcfix-done__to {
	margin: 0 0 18px;
	font-size: 16px;
	color: var(--ink-2, #4d5449);
}
.jkcfix-done__to strong {
	display: block;
	margin-top: 5px;
	font-family: var(--mono, ui-monospace, monospace);
	font-size: 15px;
	font-weight: 500;
	color: var(--ink, #1a1d17);
	word-break: break-all;
}

.jkcfix-done__body {
	margin: 0 0 14px;
	font-size: 15px;
	line-height: 1.6;
	color: var(--ink-2, #4d5449);
}

.jkcfix-done__act { margin: 22px 0 0; }

.jkcfix-btn {
	display: inline-block;
	background: var(--green, #2e6b33);
	color: #fff;
	text-decoration: none;
	font-weight: 600;
	font-size: 14px;
	letter-spacing: .01em;
	padding: 11px 22px;
	border-radius: 3px;
}
.jkcfix-btn:hover { background: var(--green-mid, #245229); color: #fff; }

.jkcfix-done__aside {
	margin-top: 28px;
	padding-top: 20px;
	border-top: 1px solid var(--rule-2, #e7eae1);
}

.jkcfix-done__aside h3 {
	font-family: var(--mono, ui-monospace, monospace);
	font-size: 10.5px;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--ink-3, #7b8276);
	margin: 0 0 12px;
	font-weight: 600;
}

.jkcfix-done__aside ul { margin: 0; padding-left: 18px; }
.jkcfix-done__aside li,
.jkcfix-done__aside p {
	font-size: 14px;
	line-height: 1.6;
	color: var(--ink-2, #4d5449);
	margin: 0 0 8px;
}
.jkcfix-done__aside li:last-child,
.jkcfix-done__aside p:last-child { margin-bottom: 0; }

.jkcfix-done__aside a { color: var(--green, #2e6b33); }

/* --------------------------------------------------------------------------
   Events and activities — the three-up row at the foot of the written page
   -------------------------------------------------------------------------- */

.jkcfix-eventgrid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
	gap: 18px;
	margin: 26px 0 8px;
	padding: 0;
	list-style: none;
}

.jkcfix-eventgrid li {
	margin: 0;
	padding: 18px;
	background: var(--sunk, #eceee5);
	border-radius: 4px;
}

.jkcfix-eventgrid strong {
	display: block;
	font-family: var(--mono, ui-monospace, monospace);
	font-size: 10.5px;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--ink-3, #7b8276);
	margin-bottom: 7px;
	font-weight: 600;
}

.jkcfix-eventgrid span {
	font-size: 14.5px;
	line-height: 1.5;
	color: var(--ink-2, #4d5449);
	display: block;
}
