/*
Theme Name:   Grammar Simplified
Theme URI:    https://grammarsimplified.com
Description:  Child theme of Kadence built for Grammar Simplified — a reference-style front page that surfaces the category tree and reads well whether or not a post has a featured image.
Author:       Grammar Simplified
Template:     kadence
Version:      1.0.0
Text Domain:  grammarsimplified
*/

/* ==========================================================================
   Tokens
   ========================================================================== */

:root {
	--gs-paper:      #FBFAF8;
	--gs-surface:    #FFFFFF;
	--gs-surface-2:  #F3F1EC;
	--gs-ink:        #1A1F26;
	--gs-ink-soft:   #3C4551;
	--gs-muted:      #5C6672;
	--gs-rule:       #E4E2DC;
	--gs-rule-soft:  #EFEDE8;
	--gs-navy:       #1E3A5F;
	--gs-navy-deep:  #142942;
	--gs-navy-tint:  #EAEFF5;
	--gs-amber:      #C77D2E;
	--gs-amber-tint: #FBF1E3;

	--gs-serif: "Source Serif 4", ui-serif, Georgia, "Times New Roman", serif;
	--gs-sans:  "Source Sans 3", ui-sans-serif, system-ui, "Segoe UI", Helvetica, Arial, sans-serif;

	--gs-max:   1180px;
	--gs-gap:   clamp(20px, 3vw, 32px);
	--gs-radius: 4px;
}

/* ==========================================================================
   Shared layout
   ========================================================================== */

#gs-home {
	background: var(--gs-paper);
	color: var(--gs-ink);
	font-family: var(--gs-sans);
	font-size: 17px;
	line-height: 1.6;
}

#gs-home *,
#gs-home *::before,
#gs-home *::after { box-sizing: border-box; }

.gs-wrap {
	max-width: var(--gs-max);
	margin: 0 auto;
	padding-left: clamp(18px, 4vw, 32px);
	padding-right: clamp(18px, 4vw, 32px);
}

.gs-section { padding: clamp(48px, 7vw, 80px) 0; }
.gs-section--tint { background: var(--gs-surface-2); }
.gs-section--rule { border-top: 1px solid var(--gs-rule); }

.gs-head { margin-bottom: clamp(24px, 4vw, 38px); }

.gs-eyebrow {
	font-family: var(--gs-sans);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.13em;
	text-transform: uppercase;
	color: var(--gs-amber);
	margin: 0 0 10px;
}

.gs-h2 {
	font-family: var(--gs-serif);
	font-weight: 600;
	font-size: clamp(1.65rem, 3.6vw, 2.3rem);
	line-height: 1.18;
	letter-spacing: -0.015em;
	color: var(--gs-ink);
	text-wrap: balance;
	margin: 0 0 10px;
}

.gs-sub {
	color: var(--gs-muted);
	font-size: 16.5px;
	max-width: 60ch;
	margin: 0;
}

.gs-head--split {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-end;
	gap: 16px;
}

.gs-more {
	font-family: var(--gs-sans);
	font-size: 15px;
	font-weight: 600;
	color: var(--gs-navy);
	text-decoration: none;
	border-bottom: 2px solid var(--gs-amber);
	padding-bottom: 2px;
	white-space: nowrap;
	flex: none;
}
.gs-more:hover { color: var(--gs-amber); }

#gs-home a:focus-visible,
#gs-home button:focus-visible,
#gs-home input:focus-visible {
	outline: 3px solid var(--gs-amber);
	outline-offset: 2px;
	border-radius: 2px;
}

/* ==========================================================================
   Hero
   ========================================================================== */

.gs-hero {
	background: var(--gs-navy);
	color: #fff;
	padding: clamp(52px, 8vw, 92px) 0 clamp(48px, 7vw, 78px);
	position: relative;
	overflow: hidden;
}

/* faint ruled-paper texture, drawn not downloaded */
.gs-hero::after {
	content: "";
	position: absolute;
	inset: 0;
	background-image: repeating-linear-gradient(
		to bottom,
		transparent 0 31px,
		rgba(255, 255, 255, 0.045) 31px 32px
	);
	pointer-events: none;
}

.gs-hero__inner { position: relative; z-index: 1; max-width: 760px; }

.gs-hero h1 {
	font-family: var(--gs-serif);
	font-weight: 600;
	font-size: clamp(2.1rem, 5.6vw, 3.4rem);
	line-height: 1.1;
	letter-spacing: -0.022em;
	text-wrap: balance;
	color: #fff;
	margin: 0 0 18px;
}
.gs-hero h1 em {
	font-style: italic;
	color: #F0C48A;
}

.gs-hero p {
	font-size: clamp(1.02rem, 2vw, 1.18rem);
	line-height: 1.6;
	color: rgba(255, 255, 255, 0.86);
	max-width: 58ch;
	margin: 0 0 30px;
}

.gs-search {
	display: flex;
	gap: 10px;
	max-width: 560px;
	margin: 0 0 22px;
}
.gs-search input[type="search"] {
	flex: 1 1 auto;
	min-width: 0;
	font-family: var(--gs-sans);
	font-size: 16.5px;
	padding: 14px 18px;
	border: 2px solid transparent;
	border-radius: var(--gs-radius);
	background: #fff;
	color: var(--gs-ink);
}
.gs-search input[type="search"]::placeholder { color: #8A929C; }
.gs-search button {
	flex: none;
	font-family: var(--gs-sans);
	font-size: 16px;
	font-weight: 700;
	padding: 14px 26px;
	border: none;
	border-radius: var(--gs-radius);
	background: var(--gs-amber);
	color: #23180B;
	cursor: pointer;
	transition: background 0.15s ease;
}
.gs-search button:hover { background: #E09A45; }

.gs-hero__stats {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 26px;
	font-size: 14.5px;
	color: rgba(255, 255, 255, 0.72);
	margin: 0;
	padding: 0;
	list-style: none;
}
.gs-hero__stats li {
	display: flex;
	align-items: baseline;
	gap: 7px;
}
.gs-hero__stats strong {
	font-family: var(--gs-serif);
	font-size: 1.22rem;
	font-weight: 600;
	color: #fff;
	font-variant-numeric: tabular-nums;
}

/* ==========================================================================
   Pillars — the two top-level libraries
   ========================================================================== */

.gs-pillars {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: var(--gs-gap);
}

.gs-pillar {
	display: flex;
	flex-direction: column;
	background: var(--gs-surface);
	border: 1px solid var(--gs-rule);
	border-top: 3px solid var(--gs-navy);
	border-radius: var(--gs-radius);
	padding: clamp(24px, 3.4vw, 34px);
	text-decoration: none;
	color: inherit;
	transition: border-color 0.16s ease, transform 0.16s ease, box-shadow 0.16s ease;
}
.gs-pillar:hover {
	border-top-color: var(--gs-amber);
	transform: translateY(-2px);
	box-shadow: 0 10px 28px rgba(30, 58, 95, 0.09);
}

.gs-pillar__count {
	font-family: var(--gs-sans);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--gs-amber);
	margin: 0 0 12px;
	font-variant-numeric: tabular-nums;
}

.gs-pillar h3 {
	font-family: var(--gs-serif);
	font-weight: 600;
	font-size: clamp(1.4rem, 2.6vw, 1.75rem);
	line-height: 1.2;
	letter-spacing: -0.015em;
	color: var(--gs-navy);
	margin: 0 0 12px;
}

.gs-pillar p {
	color: var(--gs-ink-soft);
	font-size: 16px;
	margin: 0 0 20px;
	flex: 1 1 auto;
}

.gs-pillar__cta {
	font-weight: 700;
	font-size: 15px;
	color: var(--gs-navy);
	display: inline-flex;
	align-items: center;
	gap: 8px;
}
.gs-pillar:hover .gs-pillar__cta { color: var(--gs-amber); }
.gs-pillar__cta svg { transition: transform 0.16s ease; }
.gs-pillar:hover .gs-pillar__cta svg { transform: translateX(3px); }

/* ==========================================================================
   Topic grid
   ========================================================================== */

.gs-topics {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(232px, 1fr));
	gap: 14px;
}

.gs-topic {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	min-height: 150px;
	padding: 16px 18px;
	border-radius: var(--gs-radius);
	overflow: hidden;
	text-decoration: none;
	color: #fff;
	background: var(--gs-navy-deep);
	isolation: isolate;
}

.gs-topic img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	z-index: -2;
	transition: transform 0.35s ease;
}
.gs-topic:hover img { transform: scale(1.045); }

.gs-topic::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(
		to top,
		rgba(11, 25, 43, 0.92) 0%,
		rgba(11, 25, 43, 0.72) 45%,
		rgba(11, 25, 43, 0.34) 100%
	);
}

.gs-topic__name {
	font-family: var(--gs-serif);
	font-weight: 600;
	font-size: 1.08rem;
	line-height: 1.25;
	margin: 0 0 4px;
	text-wrap: balance;
}
.gs-topic__count {
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.04em;
	color: rgba(255, 255, 255, 0.78);
	font-variant-numeric: tabular-nums;
}

/* ==========================================================================
   Article cards
   ========================================================================== */

.gs-cards {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(268px, 1fr));
	gap: var(--gs-gap);
}

.gs-card {
	display: flex;
	flex-direction: column;
	background: var(--gs-surface);
	border: 1px solid var(--gs-rule);
	border-radius: var(--gs-radius);
	overflow: hidden;
	transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease;
}
.gs-card:hover {
	transform: translateY(-3px);
	border-color: #D5D2C9;
	box-shadow: 0 12px 30px rgba(26, 31, 38, 0.08);
}

.gs-card__media {
	position: relative;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	background: var(--gs-surface-2);
	display: block;
}
.gs-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.35s ease;
}
.gs-card:hover .gs-card__media img { transform: scale(1.04); }

/* Typographic stand-in for the 91% of posts with no featured image.
   Hue comes from the category so a section reads as one family. */
.gs-fallback {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 6px;
	background:
		radial-gradient(120% 130% at 22% 8%, hsl(var(--gs-hue) 34% 96%) 0%, hsl(var(--gs-hue) 26% 89%) 58%, hsl(var(--gs-hue) 24% 84%) 100%);
	color: hsl(var(--gs-hue) 42% 27%);
	overflow: hidden;
}
.gs-fallback::before {
	content: "";
	position: absolute;
	inset: 0;
	background-image: repeating-linear-gradient(
		to bottom,
		transparent 0 25px,
		hsl(var(--gs-hue) 30% 96% / 0.55) 25px 26px
	);
}
.gs-fallback__glyph {
	position: relative;
	font-family: var(--gs-serif);
	font-weight: 600;
	font-size: clamp(2.6rem, 7vw, 3.4rem);
	line-height: 1;
	letter-spacing: -0.03em;
}
.gs-fallback__label {
	position: relative;
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: 0.15em;
	text-transform: uppercase;
	opacity: 0.72;
	padding: 0 14px;
	text-align: center;
}

.gs-card__body {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	padding: 18px 20px 20px;
	gap: 9px;
}

.gs-card__cat {
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--gs-amber);
	text-decoration: none;
	align-self: flex-start;
}
.gs-card__cat:hover { color: var(--gs-navy); }

.gs-card__title {
	font-family: var(--gs-serif);
	font-weight: 600;
	font-size: 1.16rem;
	line-height: 1.28;
	letter-spacing: -0.011em;
	margin: 0;
	text-wrap: balance;
}
.gs-card__title a { color: var(--gs-ink); text-decoration: none; }
.gs-card__title a:hover { color: var(--gs-navy); }

.gs-card__excerpt {
	font-size: 15px;
	line-height: 1.55;
	color: var(--gs-muted);
	margin: 0;
	flex: 1 1 auto;
}

.gs-card__meta {
	font-size: 13px;
	color: var(--gs-muted);
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin-top: 2px;
	padding-top: 12px;
	border-top: 1px solid var(--gs-rule-soft);
	font-variant-numeric: tabular-nums;
}
.gs-card__meta .sep { color: var(--gs-rule); }

/* Compact list variant for "most read" */
.gs-list { display: grid; gap: 2px; }
.gs-list__item {
	display: grid;
	grid-template-columns: 46px 1fr;
	gap: 16px;
	align-items: baseline;
	padding: 15px 4px;
	border-bottom: 1px solid var(--gs-rule);
	text-decoration: none;
}
.gs-list__item:first-child { border-top: 1px solid var(--gs-rule); }
.gs-list__num {
	font-family: var(--gs-serif);
	font-size: 1.3rem;
	font-weight: 600;
	color: var(--gs-amber);
	font-variant-numeric: tabular-nums;
	line-height: 1;
}
.gs-list__title {
	font-family: var(--gs-serif);
	font-size: 1.08rem;
	font-weight: 600;
	line-height: 1.3;
	color: var(--gs-ink);
	margin: 0 0 4px;
	text-wrap: balance;
}
.gs-list__item:hover .gs-list__title { color: var(--gs-navy); }
.gs-list__cat {
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.07em;
	text-transform: uppercase;
	color: var(--gs-muted);
}

.gs-split {
	display: grid;
	grid-template-columns: 1.35fr 1fr;
	gap: clamp(30px, 5vw, 56px);
	align-items: start;
}
@media (max-width: 860px) {
	.gs-split { grid-template-columns: 1fr; }
}

/* ==========================================================================
   Trust strip — the part AdSense reviewers actually read
   ========================================================================== */

.gs-trust {
	background: var(--gs-navy-deep);
	color: #fff;
}
.gs-trust .gs-eyebrow { color: #F0C48A; }
.gs-trust .gs-h2 { color: #fff; }
.gs-trust .gs-sub { color: rgba(255, 255, 255, 0.76); }

.gs-trust__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 1px;
	background: rgba(255, 255, 255, 0.14);
	border: 1px solid rgba(255, 255, 255, 0.14);
	border-radius: var(--gs-radius);
	overflow: hidden;
	margin-top: clamp(24px, 4vw, 34px);
}
.gs-trust__cell {
	background: var(--gs-navy-deep);
	padding: 24px 24px 26px;
}
.gs-trust__cell h3 {
	font-family: var(--gs-serif);
	font-size: 1.14rem;
	font-weight: 600;
	color: #fff;
	margin: 0 0 8px;
}
.gs-trust__cell p {
	font-size: 14.5px;
	line-height: 1.6;
	color: rgba(255, 255, 255, 0.74);
	margin: 0 0 12px;
}
.gs-trust__cell a {
	font-size: 14px;
	font-weight: 700;
	color: #F0C48A;
	text-decoration: none;
	border-bottom: 1px solid rgba(240, 196, 138, 0.45);
}
.gs-trust__cell a:hover { border-bottom-color: #F0C48A; }

/* ==========================================================================
   Motion
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {
	#gs-home *,
	#gs-home *::before,
	#gs-home *::after {
		transition: none !important;
		animation: none !important;
	}
}

/* ==========================================================================
   SITE-WIDE
   The front page is only the doorway; almost all traffic lands on a single
   post. Everything below dresses those pages in the same system.
   ========================================================================== */

/* Kadence reads its typography from these, so setting them is cleaner than
   fighting its selectors. Direct rules follow as a belt-and-braces backup. */
:root {
	--global-body-font-family: "Source Sans 3", ui-sans-serif, system-ui, "Segoe UI", Helvetica, Arial, sans-serif;
	--global-heading-font-family: "Source Serif 4", ui-serif, Georgia, "Times New Roman", serif;
	--global-primary-nav-font-family: "Source Sans 3", ui-sans-serif, system-ui, sans-serif;
}

body,
button,
input,
select,
optgroup,
textarea,
.entry-content {
	font-family: var(--gs-sans);
}

h1, h2, h3, h4, h5, h6,
.entry-title,
.site-title {
	font-family: var(--gs-serif);
	letter-spacing: -0.015em;
	text-wrap: balance;
}

body {
	background: var(--gs-paper);
	color: var(--gs-ink);
}

.content-bg,
.entry.content-bg {
	background: var(--gs-surface);
}

/* --------------------------------------------------------------- Header -- */

.site-header,
.site-header-wrap {
	border-bottom: 1px solid var(--gs-rule);
}

.site-title {
	font-weight: 600;
	letter-spacing: -0.02em;
	color: var(--gs-navy);
}

.header-navigation .menu > .menu-item > .menu-link {
	font-size: 15.5px;
	font-weight: 600;
	letter-spacing: 0.005em;
}

.header-navigation .menu-item .sub-menu {
	border: 1px solid var(--gs-rule);
	box-shadow: 0 14px 34px rgba(20, 41, 66, 0.11);
}
.header-navigation .menu-item .sub-menu .menu-link {
	font-size: 14.5px;
	font-weight: 400;
}

/* ---------------------------------------------------------- Entry header -- */

.entry-header {
	border-bottom: 1px solid var(--gs-rule);
	padding-bottom: 20px;
	margin-bottom: 26px;
}

.entry-title {
	font-weight: 600;
	font-size: clamp(1.85rem, 4.2vw, 2.6rem);
	line-height: 1.16;
	color: var(--gs-ink);
	margin-bottom: 14px;
}

.entry-taxonomies,
.entry-taxonomies a {
	font-family: var(--gs-sans);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.11em;
	text-transform: uppercase;
	color: var(--gs-amber);
	text-decoration: none;
}
.entry-taxonomies a:hover { color: var(--gs-navy); }

.entry-meta {
	font-family: var(--gs-sans);
	font-size: 14px;
	color: var(--gs-muted);
	font-variant-numeric: tabular-nums;
}

.post-thumbnail img {
	border-radius: var(--gs-radius);
}

/* -------------------------------------------------------------- Content -- */

.entry-content {
	font-size: 17.5px;
	line-height: 1.72;
	color: var(--gs-ink-soft);
}

.entry-content > p,
.entry-content > ul,
.entry-content > ol {
	max-width: 68ch;
}

.entry-content h2 {
	font-size: clamp(1.4rem, 3vw, 1.75rem);
	font-weight: 600;
	line-height: 1.22;
	color: var(--gs-ink);
	margin: 2.1em 0 0.55em;
	padding-top: 0.5em;
	border-top: 1px solid var(--gs-rule-soft);
}
.entry-content h2:first-child { border-top: none; padding-top: 0; margin-top: 0; }

.entry-content h3 {
	font-size: clamp(1.16rem, 2.3vw, 1.35rem);
	font-weight: 600;
	color: var(--gs-navy);
	margin: 1.7em 0 0.45em;
}

.entry-content h4 {
	font-family: var(--gs-sans);
	font-size: 15px;
	font-weight: 700;
	letter-spacing: 0.07em;
	text-transform: uppercase;
	color: var(--gs-muted);
	margin: 1.5em 0 0.5em;
}

.entry-content p { margin: 0 0 1.15em; }

.entry-content a {
	color: var(--gs-navy);
	text-decoration: underline;
	text-decoration-color: rgba(30, 58, 95, 0.32);
	text-decoration-thickness: 1px;
	text-underline-offset: 2px;
}
.entry-content a:hover {
	color: var(--gs-amber);
	text-decoration-color: currentColor;
}

.entry-content strong,
.entry-content b { font-weight: 600; color: var(--gs-ink); }

.entry-content ul,
.entry-content ol { margin: 0 0 1.3em; padding-left: 1.35em; }
.entry-content li { margin-bottom: 0.45em; }
.entry-content li::marker { color: var(--gs-amber); }

.entry-content blockquote {
	margin: 1.6em 0;
	padding: 4px 0 4px 22px;
	border-left: 3px solid var(--gs-amber);
	font-family: var(--gs-serif);
	font-size: 1.08em;
	font-style: italic;
	color: var(--gs-ink);
}

.entry-content img { border-radius: var(--gs-radius); height: auto; }

/* ---------------------------------------------------------------- Tables --
   These posts are mostly word tables — eight or more per guide — so this is
   the single most-read element on the site, not an afterthought. */

.gs-table-scroll {
	overflow-x: auto;
	margin: 1.6em 0;
	border: 1px solid var(--gs-rule);
	border-radius: var(--gs-radius);
	background: var(--gs-surface);
	-webkit-overflow-scrolling: touch;
}

.entry-content table {
	border-collapse: collapse;
	width: 100%;
	min-width: 460px;
	margin: 0;
	font-size: 15.5px;
	line-height: 1.5;
	border: none;
}

/* These guides ship tables without a <thead> — the header cells sit as <th>
   in the first body row — so target th directly rather than through thead. */
.entry-content th,
.entry-content thead td {
	background: var(--gs-navy);
	color: #fff;
	font-family: var(--gs-sans);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.09em;
	text-transform: uppercase;
	text-align: left;
	padding: 12px 16px;
	border: none;
	vertical-align: middle;
}

.entry-content tbody td {
	padding: 11px 16px;
	border: none;
	border-bottom: 1px solid var(--gs-rule-soft);
	vertical-align: top;
	text-align: left;
	color: var(--gs-ink-soft);
}

.entry-content tbody tr:nth-child(even):not(:has(th)) { background: #FAF9F6; }
.entry-content tbody tr:last-child td { border-bottom: none; }
.entry-content tbody tr:hover:not(:has(th)) { background: var(--gs-navy-tint); }

/* First column is the headword in these lists — give it weight. */
.entry-content tbody tr:not(:has(th)) td:first-child {
	font-weight: 600;
	color: var(--gs-ink);
	white-space: nowrap;
}

.entry-content table strong,
.entry-content table b { color: var(--gs-navy); }

/* ------------------------------------------------------------ Entry foot -- */

.entry-footer,
.entry-related {
	border-top: 1px solid var(--gs-rule);
	margin-top: 40px;
	padding-top: 26px;
}

.entry-related .entry-related-title,
.comment-reply-title {
	font-family: var(--gs-serif);
	font-size: 1.4rem;
	font-weight: 600;
	color: var(--gs-ink);
}

.entry-related-inner .entry-title {
	font-size: 1.05rem;
	line-height: 1.3;
}

/* Author box — an E-E-A-T signal, so it should look deliberate. */
.author-box {
	background: var(--gs-surface-2);
	border: 1px solid var(--gs-rule);
	border-left: 3px solid var(--gs-amber);
	border-radius: var(--gs-radius);
	padding: 22px 24px;
}
.author-box .author-name {
	font-family: var(--gs-serif);
	font-weight: 600;
	color: var(--gs-navy);
}
.author-box .author-description {
	font-size: 15px;
	color: var(--gs-muted);
}

/* --------------------------------------------------------- Archive pages -- */

.archive .entry-header,
.search .entry-header,
.blog .entry-header { border-bottom: none; }

.archive .loop-entry,
.search .loop-entry,
.blog .loop-entry {
	background: var(--gs-surface);
	border: 1px solid var(--gs-rule);
	border-radius: var(--gs-radius);
	overflow: hidden;
	transition: transform 0.16s ease, box-shadow 0.16s ease;
}
.archive .loop-entry:hover,
.search .loop-entry:hover,
.blog .loop-entry:hover {
	transform: translateY(-3px);
	box-shadow: 0 12px 30px rgba(26, 31, 38, 0.08);
}

.loop-entry .entry-title {
	font-size: 1.18rem;
	line-height: 1.3;
	margin-bottom: 8px;
}
.loop-entry .entry-title a { color: var(--gs-ink); text-decoration: none; }
.loop-entry .entry-title a:hover { color: var(--gs-navy); }

.loop-entry .entry-summary {
	font-size: 15px;
	color: var(--gs-muted);
	line-height: 1.55;
}

/* Archive intro — the category description, which doubles as SEO copy. */
.archive .page-title,
.search .page-title {
	font-size: clamp(1.9rem, 4.4vw, 2.5rem);
	font-weight: 600;
	color: var(--gs-ink);
}
.archive .archive-description,
.taxonomy-description {
	font-size: 17px;
	line-height: 1.65;
	color: var(--gs-muted);
	max-width: 66ch;
}

/* ---------------------------------------------------------------- Footer -- */

.site-footer {
	background: var(--gs-navy-deep);
	color: rgba(255, 255, 255, 0.78);
	border-top: none;
}
.site-footer a { color: rgba(255, 255, 255, 0.86); }
.site-footer a:hover { color: #F0C48A; }
.site-footer h2,
.site-footer h3,
.site-footer .widget-title { color: #fff; font-family: var(--gs-serif); }
.site-footer .footer-navigation .menu-link { font-size: 14.5px; font-weight: 600; }

/* ----------------------------------------------------------- Pagination -- */

.pagination .page-numbers {
	font-family: var(--gs-sans);
	font-weight: 600;
	font-variant-numeric: tabular-nums;
	border: 1px solid var(--gs-rule);
	border-radius: var(--gs-radius);
	color: var(--gs-navy);
}
.pagination .page-numbers.current {
	background: var(--gs-navy);
	border-color: var(--gs-navy);
	color: #fff;
}

/* -------------------------------------------------------------- A11y --- */

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
	outline: 3px solid var(--gs-amber);
	outline-offset: 2px;
}

.screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
	}
}

/* ==========================================================================
   Fixes from the first live review
   ========================================================================== */

/* The logo image already carries the wordmark and its alt text — printing the
   site title beside it said the name twice. */
.site-branding .brand.has-logo-image .site-title-wrap {
	display: none;
}
.site-branding .brand.has-logo-image img.custom-logo {
	max-height: 46px;
	width: auto;
}

/* "Most read" list: the title and its meta line are spans, so the margin
   between them was collapsing and the two ran together. */
.gs-list__title,
.gs-list__cat {
	display: block;
}
.gs-list__item > span:last-child { min-width: 0; }

/* --------------------------------------------------------------- Sitemap -- */

.gs-sitemap {
	background: var(--gs-navy-deep);
	color: rgba(255, 255, 255, 0.76);
	font-family: var(--gs-sans);
	font-size: 15px;
	line-height: 1.6;
	padding: clamp(40px, 6vw, 64px) clamp(18px, 4vw, 32px) clamp(32px, 4vw, 46px);
	border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.gs-sitemap__inner {
	max-width: var(--gs-max);
	margin: 0 auto;
	display: grid;
	grid-template-columns: 1.5fr 1fr 1fr 1fr;
	gap: clamp(24px, 3.5vw, 44px);
	align-items: start;
}
@media (max-width: 900px) {
	.gs-sitemap__inner { grid-template-columns: 1fr 1fr; }
	.gs-sitemap__col--lead { grid-column: 1 / -1; }
	.gs-sitemap__head--ghost { display: none; }
}
@media (max-width: 520px) {
	.gs-sitemap__inner { grid-template-columns: 1fr; }
}

.gs-sitemap__brand {
	font-family: var(--gs-serif);
	font-size: 1.3rem;
	font-weight: 600;
	color: #fff;
	margin: 0 0 10px;
	letter-spacing: -0.015em;
}

.gs-sitemap__blurb {
	margin: 0 0 16px;
	max-width: 42ch;
	font-size: 14.5px;
	color: rgba(255, 255, 255, 0.66);
}

.gs-sitemap__cta {
	font-weight: 700;
	font-size: 14.5px;
	color: #F0C48A;
	text-decoration: none;
	border-bottom: 1px solid rgba(240, 196, 138, 0.4);
	padding-bottom: 2px;
}
.gs-sitemap__cta:hover { border-bottom-color: #F0C48A; }

.gs-sitemap__head {
	font-family: var(--gs-sans);
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: 0.13em;
	text-transform: uppercase;
	color: #F0C48A;
	margin: 0 0 14px;
	padding-bottom: 10px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.14);
}

.gs-sitemap__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 1px;
}
.gs-sitemap__list a {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 12px;
	padding: 5px 0;
	font-size: 14.5px;
	color: rgba(255, 255, 255, 0.8);
	text-decoration: none;
}
.gs-sitemap__list a:hover { color: #fff; }
.gs-sitemap__list a span {
	font-size: 12px;
	color: rgba(255, 255, 255, 0.42);
	font-variant-numeric: tabular-nums;
	flex: none;
}
.gs-sitemap__list a:hover span { color: #F0C48A; }

/* Kadence's own strip now only carries the copyright line — keep it quiet
   so it reads as a footnote to the map above rather than a second footer. */
.site-footer .site-info {
	font-size: 13.5px;
	color: rgba(255, 255, 255, 0.5);
	border-top: 1px solid rgba(255, 255, 255, 0.1);
}

/* ==========================================================================
   Author identity
   ========================================================================== */

/* Kadence's own author box — the earlier rules aimed at .author-box, which is
   the stylesheet's filename, not the element's class. */
.entry-author.entry-author-style-normal {
	background: var(--gs-surface-2);
	border: 1px solid var(--gs-rule);
	border-left: 3px solid var(--gs-amber);
	border-radius: var(--gs-radius);
	padding: 24px 26px;
	margin-top: 34px;
}
.entry-author-avatar img {
	border-radius: 50%;
	width: 72px;
	height: 72px;
}
.entry-author-name,
.entry-author-name a {
	font-family: var(--gs-serif);
	font-size: 1.18rem;
	font-weight: 600;
	color: var(--gs-navy);
	text-decoration: none;
}
.entry-author-description {
	font-size: 15px;
	line-height: 1.62;
	color: var(--gs-muted);
	margin-top: 6px;
}

/* Standards line under every guide — a small, constant trust signal. */
.gs-standards {
	margin: 30px 0 0;
	padding: 14px 18px;
	background: var(--gs-navy-tint);
	border-radius: var(--gs-radius);
	font-size: 14.5px;
	line-height: 1.6;
	color: var(--gs-ink-soft);
}
.gs-standards strong { color: var(--gs-navy); font-weight: 600; }
.gs-standards a { color: var(--gs-navy); }

/* ------------------------------------------------------- Author archive -- */

.gs-authorintro {
	background: var(--gs-navy);
	color: #fff;
	padding: clamp(34px, 5vw, 54px) clamp(18px, 4vw, 32px);
	margin-bottom: clamp(24px, 4vw, 40px);
}
.gs-authorintro__inner {
	max-width: var(--gs-max);
	margin: 0 auto;
	display: flex;
	gap: clamp(18px, 3vw, 30px);
	align-items: flex-start;
	flex-wrap: wrap;
}
.gs-authorintro__avatar {
	width: 96px;
	height: 96px;
	border-radius: 50%;
	flex: none;
	border: 2px solid rgba(240, 196, 138, 0.5);
}
.gs-authorintro__eyebrow {
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: #F0C48A;
	margin: 0 0 6px;
}
.gs-authorintro__name {
	font-family: var(--gs-serif);
	font-size: clamp(1.7rem, 4vw, 2.3rem);
	font-weight: 600;
	line-height: 1.15;
	color: #fff;
	margin: 0 0 12px;
	letter-spacing: -0.02em;
}
.gs-authorintro__bio {
	font-size: 16px;
	line-height: 1.65;
	color: rgba(255, 255, 255, 0.8);
	max-width: 68ch;
	margin: 0 0 14px;
}
.gs-authorintro__count {
	font-size: 14px;
	color: rgba(255, 255, 255, 0.62);
	margin: 0;
}
.gs-authorintro__count strong {
	font-family: var(--gs-serif);
	font-size: 1.1rem;
	color: #fff;
	font-variant-numeric: tabular-nums;
}

/* The archive's own default title is redundant next to the intro above. */
.author .page-title { display: none; }

/* ==========================================================================
   Single post
   ========================================================================== */

/* Reading progress — a hairline, not a feature. */
.gs-progress {
	position: fixed;
	inset: 0 0 auto 0;
	height: 3px;
	background: transparent;
	z-index: 60;
	pointer-events: none;
}
.gs-progress span {
	display: block;
	height: 100%;
	background: var(--gs-amber);
	transform: scaleX(0);
	transform-origin: 0 50%;
	will-change: transform;
}

/* ------------------------------------------------------------ TOC rail -- */

.gs-rail { display: none; }

@media (min-width: 1220px) {
	.gs-rail {
		display: block;
		position: fixed;
		top: 120px;
		left: max(20px, calc((100vw - 1290px) / 2 + 10px));
		width: 210px;
		max-height: calc(100vh - 180px);
		overflow-y: auto;
		overscroll-behavior: contain;
		padding-right: 10px;
		z-index: 5;
	}
	/* Hide the post's own contents block; the rail replaces it here. */
	.single-entry .entry-content h2[data-gs-section="contents"],
	.single-entry .entry-content h2[data-gs-section="contents"] + ul,
	.single-entry .entry-content h2[data-gs-section="contents"] + ol {
		display: none;
	}
}

@media (min-width: 1560px) {
	.gs-rail { left: calc((100vw - 1290px) / 2 - 130px); width: 240px; }
}

.gs-rail__label {
	font-family: var(--gs-sans);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--gs-muted);
	margin: 0 0 12px;
	padding-bottom: 10px;
	border-bottom: 1px solid var(--gs-rule);
}

.gs-rail__list {
	list-style: none;
	margin: 0 0 18px;
	padding: 0;
	display: grid;
	gap: 1px;
	counter-reset: gsrail;
}
.gs-rail__list a {
	display: block;
	padding: 6px 0 6px 14px;
	border-left: 2px solid var(--gs-rule);
	font-size: 13.5px;
	line-height: 1.4;
	color: var(--gs-muted);
	text-decoration: none;
	transition: color 0.15s ease, border-color 0.15s ease;
}
.gs-rail__list a:hover { color: var(--gs-navy); border-left-color: var(--gs-muted); }
.gs-rail__list li.is-current > a {
	color: var(--gs-navy);
	border-left-color: var(--gs-amber);
	font-weight: 600;
}

.gs-rail__back {
	display: inline-block;
	font-size: 13px;
	font-weight: 600;
	color: var(--gs-navy);
	text-decoration: none;
	padding-top: 12px;
	border-top: 1px solid var(--gs-rule);
	width: 100%;
}
.gs-rail__back:hover { color: var(--gs-amber); }

/* ------------------------------------------------- Sectional treatments -- */

/* Each recurring section reads as what it is. The marker sits in the gutter
   so it never pushes the heading text out of alignment. */
.entry-content h2[data-gs-section] {
	position: relative;
}
.entry-content h2[data-gs-section]::before {
	font-family: var(--gs-sans);
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	display: block;
	margin-bottom: 6px;
}
.entry-content h2[data-gs-section="mistake"]::before  { content: "Watch out";  color: var(--gs-mark, #A62B1F); }
.entry-content h2[data-gs-section="practice"]::before { content: "Try it";     color: var(--gs-good, #2F6B52); }
.entry-content h2[data-gs-section="rules"]::before    { content: "The rules";  color: var(--gs-amber); }
.entry-content h2[data-gs-section="faq"]::before      { content: "Questions";  color: var(--gs-amber); }

:root { --gs-mark: #A62B1F; --gs-good: #2F6B52; --gs-mark-bg: #FBF0EE; --gs-good-bg: #EDF4F0; }

/* Common mistakes: the tables in this section are wrong-vs-right pairs. */
.entry-content h2[data-gs-section="mistake"] ~ .gs-table-scroll:first-of-type th {
	background: var(--gs-mark);
}

/* Practice exercises read as a worksheet, not more prose. */
.entry-content h2[data-gs-section="practice"] {
	margin-top: 2.4em;
}

/* The post's own contents list, shown when the rail is not. */
.entry-content h2[data-gs-section="contents"] {
	font-size: 13px !important;
	font-family: var(--gs-sans) !important;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--gs-muted) !important;
	border-top: none !important;
	padding-top: 0 !important;
	margin-bottom: 0.6em !important;
}
.entry-content h2[data-gs-section="contents"] + ul,
.entry-content h2[data-gs-section="contents"] + ol {
	background: var(--gs-surface-2);
	border-radius: var(--gs-radius);
	padding: 16px 20px 16px 38px;
	margin-bottom: 2em;
	font-size: 15.5px;
}
.entry-content h2[data-gs-section="contents"] + ul li,
.entry-content h2[data-gs-section="contents"] + ol li { margin-bottom: 0.3em; }

/* ------------------------------------------------------- Prev / next --- */

.gs-prevnext {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
	margin-top: 36px;
	padding-top: 26px;
	border-top: 1px solid var(--gs-rule);
}
@media (max-width: 640px) { .gs-prevnext { grid-template-columns: 1fr; } }

.gs-prevnext__item {
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 16px 18px;
	background: var(--gs-surface);
	border: 1px solid var(--gs-rule);
	border-radius: var(--gs-radius);
	text-decoration: none;
	transition: border-color 0.16s ease, transform 0.16s ease;
}
.gs-prevnext__item:hover { border-color: var(--gs-amber); transform: translateY(-2px); }
.gs-prevnext__item--next { text-align: right; }

.gs-prevnext__dir {
	font-family: var(--gs-sans);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--gs-amber);
}
.gs-prevnext__title {
	font-family: var(--gs-serif);
	font-size: 1.02rem;
	font-weight: 600;
	line-height: 1.3;
	color: var(--gs-ink);
	text-wrap: balance;
}

/* ------------------------------------------------------ Post furniture -- */

.single-entry .entry-header { border-bottom: 1px solid var(--gs-rule); }

.kadence-breadcrumbs {
	font-family: var(--gs-sans);
	font-size: 13px;
	color: var(--gs-muted);
}
.kadence-breadcrumbs a { color: var(--gs-navy); text-decoration: none; }
.kadence-breadcrumbs a:hover { text-decoration: underline; }

/* Give long guides a comfortable measure without starving the tables. */
.single-entry .entry-content > p,
.single-entry .entry-content > ul,
.single-entry .entry-content > ol { max-width: 68ch; }
.single-entry .entry-content > .gs-table-scroll { max-width: none; }

/* ==========================================================================
   Archive intro
   ========================================================================== */

.gs-archintro {
	max-width: var(--gs-max);
	margin: 0 auto clamp(22px, 3vw, 34px);
	padding: 0 0 clamp(20px, 3vw, 28px);
	border-bottom: 1px solid var(--gs-rule);
}
.gs-archintro__eyebrow {
	font-family: var(--gs-sans);
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: 0.13em;
	text-transform: uppercase;
	color: var(--gs-amber);
	margin: 0 0 10px;
}
.gs-archintro__title {
	font-family: var(--gs-serif);
	font-weight: 600;
	font-size: clamp(1.9rem, 4.4vw, 2.6rem);
	line-height: 1.14;
	letter-spacing: -0.02em;
	color: var(--gs-ink);
	margin: 0 0 14px;
	text-wrap: balance;
}
.gs-archintro__desc {
	font-size: 17px;
	line-height: 1.65;
	color: var(--gs-muted);
	max-width: 66ch;
	margin: 0;
}
.gs-archintro__kids {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 20px 0 0;
	padding: 0;
}
.gs-archintro__kids a {
	display: inline-flex;
	align-items: baseline;
	gap: 7px;
	padding: 6px 13px;
	border: 1px solid var(--gs-rule);
	border-radius: 100px;
	background: var(--gs-surface);
	font-size: 14px;
	font-weight: 600;
	color: var(--gs-navy);
	text-decoration: none;
	transition: border-color 0.15s ease, color 0.15s ease;
}
.gs-archintro__kids a:hover { border-color: var(--gs-amber); color: var(--gs-amber); }
.gs-archintro__kids span {
	font-size: 12px;
	font-weight: 400;
	color: var(--gs-muted);
	font-variant-numeric: tabular-nums;
}

/* Fallback plate inside an archive card */
.gs-loop-fallback { position: relative; aspect-ratio: 16 / 9; overflow: hidden; }
.gs-loop-fallback .post-thumbnail-inner { display: block; position: absolute; inset: 0; }

/* ==========================================================================
   Internal linking
   ========================================================================== */

/* Auto-inserted links are underlined like any other, but marked in the DOM so
   they can be found, counted or removed without guessing. */
.entry-content a.gs-autolink {
	text-decoration-color: rgba(199, 125, 46, 0.5);
}
.entry-content a.gs-autolink:hover {
	text-decoration-color: currentColor;
}

.gs-next {
	display: grid;
	grid-template-columns: 1.15fr 1fr;
	gap: clamp(20px, 3vw, 36px);
	margin-top: 40px;
	padding-top: 28px;
	border-top: 1px solid var(--gs-rule);
}
@media (max-width: 700px) { .gs-next { grid-template-columns: 1fr; gap: 26px; } }

.gs-next__label {
	font-family: var(--gs-sans);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.13em;
	text-transform: uppercase;
	color: var(--gs-amber);
	margin: 0 0 12px;
}

.gs-next__list {
	list-style: none;
	margin: 0 0 14px;
	padding: 0;
	display: grid;
	gap: 1px;
}
.gs-next__list li { border-bottom: 1px solid var(--gs-rule-soft); }
.gs-next__list li:first-child { border-top: 1px solid var(--gs-rule-soft); }
.gs-next__list a {
	display: block;
	padding: 10px 0;
	font-family: var(--gs-serif);
	font-size: 1.02rem;
	line-height: 1.32;
	color: var(--gs-ink);
	text-decoration: none;
	text-wrap: balance;
}
.gs-next__list a:hover { color: var(--gs-navy); }

.gs-next__all {
	font-family: var(--gs-sans);
	font-size: 14px;
	font-weight: 600;
	color: var(--gs-navy);
	text-decoration: none;
}
.gs-next__all:hover { color: var(--gs-amber); }

.gs-next__col--pillar {
	background: var(--gs-surface-2);
	border-radius: var(--gs-radius);
	padding: 20px 22px 22px;
	align-self: start;
}
.gs-next__pillar {
	font-family: var(--gs-serif);
	font-size: 1.16rem;
	font-weight: 600;
	line-height: 1.26;
	margin: 0 0 8px;
	text-wrap: balance;
}
.gs-next__pillar a { color: var(--gs-ink); text-decoration: none; }
.gs-next__pillar a:hover { color: var(--gs-navy); }
.gs-next__excerpt {
	font-size: 14.5px;
	line-height: 1.55;
	color: var(--gs-muted);
	margin: 0;
}

/* ==========================================================================
   Editorial pages — About, Contact
   ==========================================================================
   These render in the wide layout (about 1,180px) while the site-wide measure
   caps prose at 68ch, which left roughly 590px of empty column on every
   paragraph. Rather than widen the prose — unreadable at that measure — these
   pages use the width deliberately: full-bleed bands, stat rows and card
   grids, with running text still held to a comfortable line length.
   ========================================================================== */

.gs-page { margin: 0; }

/* Running prose inside these pages keeps its measure but is no longer the
   only thing on the row, so the empty column disappears. */
.gs-page .gs-prose { max-width: 66ch; }
.gs-page p { margin: 0 0 1.05em; }
.gs-page p:last-child { margin-bottom: 0; }

/* --------------------------------------------------------------- Hero --- */

.gs-phero {
	background: var(--gs-navy);
	color: #fff;
	border-radius: var(--gs-radius);
	padding: clamp(30px, 5vw, 54px) clamp(24px, 4vw, 48px);
	margin-bottom: clamp(28px, 4vw, 44px);
	position: relative;
	overflow: hidden;
}
.gs-phero::after {
	content: "";
	position: absolute;
	inset: 0;
	background-image: repeating-linear-gradient(to bottom, transparent 0 31px, rgba(255,255,255,.05) 31px 32px);
	pointer-events: none;
}
.gs-phero > * { position: relative; z-index: 1; }
.gs-phero__eyebrow {
	font-family: var(--gs-sans);
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: #F0C48A;
	margin: 0 0 12px;
}
.gs-phero h2,
.gs-phero .gs-phero__title {
	font-family: var(--gs-serif);
	font-weight: 600;
	font-size: clamp(1.7rem, 4vw, 2.5rem);
	line-height: 1.14;
	letter-spacing: -.02em;
	color: #fff;
	margin: 0 0 14px;
	max-width: 24ch;
	border: none;
	padding: 0;
}
.gs-phero p {
	color: rgba(255,255,255,.84);
	font-size: 1.06rem;
	line-height: 1.6;
	max-width: 62ch;
}
.gs-phero em { color: #F0C48A; font-style: italic; }

/* --------------------------------------------------------------- Stats -- */

.gs-stats {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: 1px;
	background: var(--gs-rule);
	border: 1px solid var(--gs-rule);
	border-radius: var(--gs-radius);
	overflow: hidden;
	margin: 0 0 clamp(28px, 4vw, 44px);
}
.gs-stats > div { background: var(--gs-surface); padding: 20px 22px 22px; }
.gs-stats .n {
	font-family: var(--gs-serif);
	font-size: clamp(1.8rem, 3.6vw, 2.4rem);
	font-weight: 600;
	line-height: 1;
	letter-spacing: -.02em;
	color: var(--gs-navy);
	font-variant-numeric: tabular-nums;
	margin: 0 0 6px;
}
.gs-stats .l {
	font-family: var(--gs-sans);
	font-size: 12.5px;
	color: var(--gs-muted);
	line-height: 1.4;
	margin: 0;
}

/* --------------------------------------------------------------- Cards -- */

.gs-cards2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 18px; margin: 0 0 clamp(28px, 4vw, 44px); }
.gs-cards3 { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 16px; margin: 0 0 clamp(28px, 4vw, 44px); }
.gs-cards4 { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 14px; margin: 0 0 clamp(28px, 4vw, 44px); }

.gs-card2 {
	background: var(--gs-surface);
	border: 1px solid var(--gs-rule);
	border-top: 3px solid var(--gs-navy);
	border-radius: var(--gs-radius);
	padding: 22px 24px 24px;
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.gs-card2--amber { border-top-color: var(--gs-amber); }
.gs-card2 h3 {
	font-family: var(--gs-serif);
	font-size: 1.2rem;
	font-weight: 600;
	line-height: 1.25;
	color: var(--gs-navy);
	margin: 0;
	border: none;
	padding: 0;
}
.gs-card2 .k {
	font-family: var(--gs-sans);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--gs-amber);
	margin: 0;
}
.gs-card2 p { font-size: 15px; line-height: 1.6; color: var(--gs-ink-soft); margin: 0; }
.gs-card2 a.more { font-size: 14.5px; font-weight: 600; color: var(--gs-navy); text-decoration: none; margin-top: auto; padding-top: 6px; }
.gs-card2 a.more:hover { color: var(--gs-amber); }

/* Numbered process steps */
.gs-step {
	background: var(--gs-surface-2);
	border-radius: var(--gs-radius);
	padding: 20px 22px 22px;
	counter-increment: gsstep;
}
.gs-steps { counter-reset: gsstep; }
.gs-step::before {
	content: counter(gsstep, decimal-leading-zero);
	display: block;
	font-family: var(--gs-mono, var(--gs-sans));
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .1em;
	color: var(--gs-amber);
	margin-bottom: 10px;
}
.gs-step h3 {
	font-family: var(--gs-serif);
	font-size: 1.05rem;
	font-weight: 600;
	line-height: 1.3;
	color: var(--gs-ink);
	margin: 0 0 6px;
	border: none;
	padding: 0;
}
.gs-step p { font-size: 14.5px; line-height: 1.55; color: var(--gs-muted); margin: 0; }

/* Authority / reference cards */
.gs-auth {
	background: var(--gs-surface);
	border: 1px solid var(--gs-rule);
	border-radius: var(--gs-radius);
	padding: 18px 20px 20px;
}
.gs-auth .t {
	font-family: var(--gs-serif);
	font-size: 1rem;
	font-weight: 600;
	color: var(--gs-navy);
	margin: 0 0 5px;
	line-height: 1.25;
}
.gs-auth p { font-size: 13.5px; line-height: 1.5; color: var(--gs-muted); margin: 0; }

/* --------------------------------------------------------- Author card -- */

.gs-authorcard {
	display: grid;
	grid-template-columns: 96px 1fr;
	gap: 22px;
	align-items: start;
	background: var(--gs-surface);
	border: 1px solid var(--gs-rule);
	border-left: 3px solid var(--gs-amber);
	border-radius: var(--gs-radius);
	padding: 24px 26px;
	margin: 0 0 clamp(28px, 4vw, 44px);
}
@media (max-width: 560px) { .gs-authorcard { grid-template-columns: 1fr; } }
.gs-authorcard img { width: 96px; height: 96px; border-radius: 50%; display: block; }
.gs-authorcard .nm {
	font-family: var(--gs-serif);
	font-size: 1.3rem;
	font-weight: 600;
	color: var(--gs-navy);
	margin: 0 0 2px;
}
.gs-authorcard .ro {
	font-family: var(--gs-sans);
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--gs-amber);
	margin: 0 0 10px;
}
.gs-authorcard p { font-size: 15px; line-height: 1.6; color: var(--gs-ink-soft); margin: 0 0 10px; max-width: 62ch; }
.gs-authorcard a { font-size: 14.5px; font-weight: 600; color: var(--gs-navy); text-decoration: none; }
.gs-authorcard a:hover { color: var(--gs-amber); }

/* ------------------------------------------------------------- Split ---- */

.gs-split2 {
	display: grid;
	grid-template-columns: 1.25fr 1fr;
	gap: clamp(22px, 3vw, 40px);
	align-items: start;
	margin: 0 0 clamp(28px, 4vw, 44px);
}
@media (max-width: 820px) { .gs-split2 { grid-template-columns: 1fr; } }

.gs-panel {
	background: var(--gs-surface-2);
	border-radius: var(--gs-radius);
	padding: 22px 24px 24px;
}
.gs-panel h3 {
	font-family: var(--gs-serif);
	font-size: 1.12rem;
	font-weight: 600;
	color: var(--gs-ink);
	margin: 0 0 10px;
	border: none;
	padding: 0;
}
.gs-panel ul { margin: 0; padding-left: 1.15em; }
.gs-panel li { font-size: 14.5px; line-height: 1.55; color: var(--gs-ink-soft); margin-bottom: .45em; }
.gs-panel li::marker { color: var(--gs-amber); }
.gs-panel p { font-size: 14.5px; line-height: 1.6; color: var(--gs-ink-soft); }

/* Section heading inside a page */
.gs-page h2.gs-sec {
	font-family: var(--gs-serif);
	font-size: clamp(1.35rem, 2.8vw, 1.75rem);
	font-weight: 600;
	line-height: 1.2;
	color: var(--gs-ink);
	margin: 0 0 6px;
	border-top: none;
	padding-top: 0;
}
.gs-page .gs-seclede {
	color: var(--gs-muted);
	font-size: 15.5px;
	max-width: 62ch;
	margin: 0 0 20px;
}

/* --------------------------------------------------------- Contact form -- */

.gs-formwrap {
	background: var(--gs-surface);
	border: 1px solid var(--gs-rule);
	border-radius: var(--gs-radius);
	padding: 24px 26px 26px;
}
.gs-formwrap .wpcf7 { margin: 0; }
.gs-formwrap label { display: block; font-family: var(--gs-sans); font-size: 13.5px; font-weight: 600; color: var(--gs-ink); margin-bottom: 14px; }
.gs-formwrap input[type=text],
.gs-formwrap input[type=email],
.gs-formwrap input[type=tel],
.gs-formwrap textarea {
	width: 100%;
	font-family: var(--gs-sans);
	font-size: 15.5px;
	padding: 11px 14px;
	margin-top: 6px;
	border: 1px solid var(--gs-rule);
	border-radius: var(--gs-radius);
	background: var(--gs-paper);
	color: var(--gs-ink);
}
.gs-formwrap input:focus,
.gs-formwrap textarea:focus { outline: 2px solid var(--gs-amber); outline-offset: 1px; border-color: transparent; }
.gs-formwrap input[type=submit] {
	font-family: var(--gs-sans);
	font-size: 15.5px;
	font-weight: 700;
	padding: 12px 28px;
	border: none;
	border-radius: var(--gs-radius);
	background: var(--gs-navy);
	color: #fff;
	cursor: pointer;
	width: auto;
	margin-top: 4px;
}
.gs-formwrap input[type=submit]:hover { background: var(--gs-amber); color: #23180B; }

/* Contact method tiles */
.gs-method {
	background: var(--gs-surface);
	border: 1px solid var(--gs-rule);
	border-radius: var(--gs-radius);
	padding: 18px 20px 20px;
	display: flex;
	flex-direction: column;
	gap: 6px;
}
.gs-method .k {
	font-family: var(--gs-sans);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--gs-amber);
	margin: 0;
}
.gs-method h3 { font-family: var(--gs-serif); font-size: 1.08rem; font-weight: 600; color: var(--gs-ink); margin: 0; border: none; padding: 0; }
.gs-method p { font-size: 14.5px; line-height: 1.55; color: var(--gs-muted); margin: 0; }

/* A quiet "we don't do this" strip */
.gs-nolist {
	border: 1px solid var(--gs-rule);
	border-left: 3px solid var(--gs-muted);
	border-radius: var(--gs-radius);
	padding: 20px 24px;
	background: var(--gs-surface);
	margin: 0 0 clamp(28px, 4vw, 44px);
}
.gs-nolist h3 { font-family: var(--gs-serif); font-size: 1.1rem; font-weight: 600; color: var(--gs-ink); margin: 0 0 10px; border: none; padding: 0; }
.gs-nolist ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 6px 22px; }
.gs-nolist li { font-size: 14.5px; color: var(--gs-muted); padding-left: 20px; position: relative; }
.gs-nolist li::before { content: "\00d7"; position: absolute; left: 2px; color: var(--gs-mark); font-weight: 700; }

/* ==========================================================================
   Policy pages — privacy, terms, editorial
   ==========================================================================
   A document layout: hero band across the full width, then a sticky contents
   rail beside the prose. Uses the wide page column instead of leaving it
   empty, and makes a seventeen-section legal page navigable.
   ========================================================================== */

.gs-policyhero {
	background: var(--gs-navy);
	color: #fff;
	border-radius: var(--gs-radius);
	padding: clamp(26px, 4vw, 44px) clamp(22px, 3.5vw, 42px);
	margin-bottom: clamp(24px, 3.5vw, 36px);
	position: relative;
	overflow: hidden;
}
.gs-policyhero::after {
	content: "";
	position: absolute;
	inset: 0;
	background-image: repeating-linear-gradient(to bottom, transparent 0 31px, rgba(255,255,255,.05) 31px 32px);
	pointer-events: none;
}
.gs-policyhero > * { position: relative; z-index: 1; }
.gs-policyhero__eyebrow {
	font-family: var(--gs-sans);
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: .13em;
	text-transform: uppercase;
	color: #F0C48A;
	margin: 0 0 10px;
}
.gs-policyhero__title {
	font-family: var(--gs-serif);
	font-weight: 600;
	font-size: clamp(1.7rem, 4vw, 2.4rem);
	line-height: 1.14;
	letter-spacing: -.02em;
	color: #fff;
	margin: 0 0 12px;
}
.gs-policyhero p:last-child {
	color: rgba(255,255,255,.82);
	font-size: 1.02rem;
	line-height: 1.6;
	max-width: 62ch;
	margin: 0;
}

/* ---------------------------------------------------- Two-column layout -- */

@media (min-width: 900px) {
	.gs-policy .entry-content {
		display: grid;
		/* The prose column is sized to the reading measure rather than to
		   whatever is left over, and the pair is centred — so the slack
		   becomes even margin on both sides instead of a hole on one. */
		grid-template-columns: 240px minmax(0, 68ch);
		justify-content: center;
		gap: clamp(28px, 4vw, 56px);
		align-items: start;
	}
	.gs-policy .entry-content > .gs-policyhero { width: 100%; }
	/* The hero spans both columns and sits above them. */
	.gs-policy .entry-content > .gs-policyhero { grid-column: 1 / -1; }
	/* The rail takes the first column and everything else stacks in the second. */
	.gs-policy .entry-content > .gs-policytoc {
		grid-column: 1;
		grid-row: 2 / 500;
		position: sticky;
		top: 100px;
		max-height: calc(100vh - 140px);
		overflow-y: auto;
		overscroll-behavior: contain;
	}
	.gs-policy .entry-content > *:not(.gs-policyhero):not(.gs-policytoc) { grid-column: 2; }
	/* Prose already has room now; drop the site-wide cap so the column fills. */
	.gs-policy .entry-content > p,
	.gs-policy .entry-content > ul,
	.gs-policy .entry-content > ol { max-width: 68ch; }
}

/* -------------------------------------------------------- Contents rail -- */

.gs-policytoc {
	background: var(--gs-surface-2);
	border-radius: var(--gs-radius);
	padding: 18px 18px 16px;
	margin-bottom: 24px;
}
.gs-policytoc__label {
	font-family: var(--gs-sans);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--gs-muted);
	margin: 0 0 12px;
	padding-bottom: 10px;
	border-bottom: 1px solid var(--gs-rule);
}
.gs-policytoc ol {
	list-style: none;
	counter-reset: gspol;
	margin: 0 0 14px;
	padding: 0;
	display: grid;
	gap: 1px;
}
.gs-policytoc li { counter-increment: gspol; }
.gs-policytoc a {
	display: grid;
	grid-template-columns: 22px 1fr;
	gap: 6px;
	align-items: baseline;
	padding: 5px 0;
	font-size: 13.5px;
	line-height: 1.35;
	color: var(--gs-muted);
	text-decoration: none;
	border-left: 2px solid transparent;
	padding-left: 8px;
	transition: color .15s ease, border-color .15s ease;
}
.gs-policytoc a::before {
	content: counter(gspol, decimal-leading-zero);
	font-family: var(--gs-sans);
	font-size: 10.5px;
	font-variant-numeric: tabular-nums;
	color: var(--gs-rule);
}
.gs-policytoc a:hover { color: var(--gs-navy); }
.gs-policytoc li.is-current > a {
	color: var(--gs-navy);
	font-weight: 600;
	border-left-color: var(--gs-amber);
}
.gs-policytoc li.is-current > a::before { color: var(--gs-amber); }
.gs-policytoc__foot {
	font-size: 13px;
	color: var(--gs-muted);
	margin: 0;
	padding-top: 12px;
	border-top: 1px solid var(--gs-rule);
}
.gs-policytoc__foot a { color: var(--gs-navy); font-weight: 600; text-decoration: none; }
.gs-policytoc__foot a:hover { color: var(--gs-amber); }

/* The page title is already in the hero. */
.gs-policy .entry-header { display: none; }

/* Section headings get a little more air in a long document. */
.gs-policy .entry-content h2 { scroll-margin-top: 100px; }
.gs-policy .entry-content h3 { scroll-margin-top: 100px; }

/* ==========================================================================
   Site index (Archives)
   ========================================================================== */

.gs-indexlist {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
	gap: 1px 26px;
}
.gs-indexlist a {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 16px;
	padding: 11px 0;
	border-bottom: 1px solid var(--gs-rule-soft);
	text-decoration: none;
	transition: border-color .15s ease;
}
.gs-indexlist a:hover { border-bottom-color: var(--gs-amber); }
.gs-indexlist .t {
	font-family: var(--gs-serif);
	font-size: 1.02rem;
	font-weight: 600;
	line-height: 1.3;
	color: var(--gs-ink);
	text-wrap: balance;
}
.gs-indexlist a:hover .t { color: var(--gs-navy); }
.gs-indexlist .m {
	font-family: var(--gs-sans);
	font-size: 12px;
	color: var(--gs-muted);
	white-space: nowrap;
	flex: none;
	font-variant-numeric: tabular-nums;
}

/* The index page reuses the front page wrapper, so give it the same ground. */
#gs-archive-index {
	background: var(--gs-paper);
	padding: clamp(24px, 4vw, 40px) 0 clamp(40px, 6vw, 72px);
}
#gs-archive-index .gs-wrap { max-width: var(--gs-max); }
#gs-archive-index .gs-search { max-width: 560px; }

/* The 404 and index templates share the page furniture. */
#gs-404 {
	background: var(--gs-paper);
	padding: clamp(24px, 4vw, 40px) 0 clamp(40px, 6vw, 72px);
}
#gs-404 .gs-wrap { max-width: var(--gs-max); }
#gs-404 .gs-search { max-width: 560px; }
#gs-404 .gs-panel ul { list-style: none; padding: 0; }
#gs-404 .gs-panel li { padding: 6px 0; border-bottom: 1px solid var(--gs-rule); }
#gs-404 .gs-panel li:last-child { border-bottom: none; }
#gs-404 .gs-panel a { color: var(--gs-navy); font-weight: 600; text-decoration: none; }
#gs-404 .gs-panel a:hover { color: var(--gs-amber); }