/*
Theme Name: HelpINeedHelp Deals
Author: HelpINeedHelp
Description: Consumer-advice layout for a discount code directory. Renders merchant pages, category hubs and a today's-board index from the Coupon Engine plugin. Requires that plugin.
Version: 1.2.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: hinh
Tags: two-columns, custom-menu, featured-images, translation-ready
*/

/* ==========================================================================
   Design direction

   The site answers a question someone typed in a hurry, so the page is
   built like a reference desk rather than a shop window: ruled rows, a
   left-hand rail that stays put, and a short answer before the long one.

   Nothing floats. There are no drop shadows and no rounded cards — depth
   is carried by hairlines and by a 3px indigo rule that marks the start
   of every section. Panels sit flat on a cool grey ground so the white
   of a data table reads as the surface that matters.

   Fraunces sets the headings. A serif is the point: this is editorial
   advice, not retail. Inter carries the body at a slightly tighter size
   than a blog would use, because these pages are scanned for one fact.
   JetBrains Mono sets codes, dates and the small uppercase labels, and
   it is a functional choice for the codes specifically — readers retype
   them, and a face that separates 0/O and 1/l/I prevents failed
   checkouts.

   Indigo is the interface colour. Rust is reserved for time pressure:
   expiry dates and nothing else. There is deliberately no green here.

   1.1 — type and spacing moved onto fluid scales, tables gained zebra
   striping and tabular figures, interactive rows gained a hover rule so
   a long list stays trackable, and merchant pages print cleanly.
   ========================================================================== */

:root {
	/* --- colour ---------------------------------------------------- */
	--hin-ground: #eceff4;
	--hin-panel: #ffffff;
	--hin-panel-alt: #f6f7fa;
	--hin-panel-tint: #f0f2f7;
	--hin-ink: #131722;
	--hin-ink-soft: #3f4657;
	--hin-muted: #767d8e;
	--hin-line: #d7dbe4;
	--hin-line-soft: #e6e9f0;
	--hin-accent: #4c2fd6;
	--hin-accent-deep: #33209a;
	--hin-accent-wash: #eeebfc;
	--hin-hot: #b0500e;
	--hin-hot-wash: #fbf0e6;
	--hin-radius: 3px;

	/* --- type ------------------------------------------------------ */
	--hin-display: "Fraunces", "Iowan Old Style", Georgia, serif;
	--hin-body: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
	--hin-mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;

	--fs-micro: .68rem;
	--fs-fine: .74rem;
	--fs-small: .87rem;
	--fs-base: 1rem;
	--fs-lede: clamp(1rem, .96rem + .2vw, 1.08rem);
	--fs-h3: clamp(1rem, .95rem + .3vw, 1.12rem);
	--fs-h2: clamp(1.3rem, 1.14rem + .7vw, 1.72rem);
	--fs-h1: clamp(1.65rem, 1.3rem + 1.5vw, 2.4rem);
	--fs-hero: clamp(1.95rem, 1.3rem + 2.9vw, 3.1rem);

	/* --- spacing --------------------------------------------------- */
	--sp-1: .35rem;
	--sp-2: .65rem;
	--sp-3: 1rem;
	--sp-4: 1.45rem;
	--sp-5: 2.1rem;
	--sp-6: clamp(2.2rem, 1.4rem + 2.6vw, 3.4rem);

	--hin-wrap: 1240px;
	--hin-gutter: clamp(1rem, 3.5vw, 2.25rem);
	--hin-rail: 268px;

	--hin-ease: cubic-bezier(.2, .7, .3, 1);
}

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

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}

body {
	margin: 0;
	font-family: var(--hin-body);
	font-size: var(--fs-base);
	line-height: 1.62;
	color: var(--hin-ink);
	background: var(--hin-ground);
	-webkit-font-smoothing: antialiased;
	font-feature-settings: "kern" 1;
}

img, svg, video { max-width: 100%; height: auto; }

a { color: var(--hin-accent); text-underline-offset: 2px; }
a:hover { color: var(--hin-accent-deep); }

::selection { background: var(--hin-accent); color: #fff; }

:focus-visible {
	outline: 2px solid var(--hin-accent);
	outline-offset: 2px;
	border-radius: 1px;
}

h1, h2, h3, h4 {
	font-family: var(--hin-display);
	font-weight: 600;
	line-height: 1.18;
	letter-spacing: -.005em;
	color: var(--hin-ink);
	margin: 0 0 var(--sp-2);
	text-wrap: balance;
}

p { margin: 0 0 var(--sp-3); }

code, kbd, samp { font-family: var(--hin-mono); font-size: .9em; }

/* Figures line up in columns wherever they are compared. */
.hin-board, .hin-table, .hin-ledger, .hin-verdict, .gce-coupon__meta { font-variant-numeric: tabular-nums; }

.wrap {
	width: min(var(--hin-wrap), 100%);
	margin-inline: auto;
	padding-inline: var(--hin-gutter);
}

.skip-link {
	position: absolute;
	left: -9999px;
	background: var(--hin-ink);
	color: #fff;
	padding: .7rem 1.1rem;
	z-index: 999;
}
.skip-link:focus { left: 1rem; top: 1rem; }

/* Shared micro-label. Eyebrows, table heads, meta rows. */
.hin-label,
.gce-eyebrow {
	font-family: var(--hin-mono);
	font-size: var(--fs-micro);
	font-weight: 500;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--hin-muted);
	margin: 0 0 var(--sp-1);
	display: block;
}
.hin-label--accent { color: var(--hin-accent); }

/* Section heading with the indigo start-rule. Every H2 on the site
   begins at the same tick mark; that repetition is the structure. */
.hin-h2,
.gce-h2 {
	font-family: var(--hin-display);
	font-size: var(--fs-h2);
	font-weight: 600;
	margin: 0 0 var(--sp-3);
	padding-left: .85rem;
	border-left: 3px solid var(--hin-accent);
}

.hin-lede {
	font-size: var(--fs-lede);
	color: var(--hin-ink-soft);
	max-width: 64ch;
}

.hin-fine {
	font-family: var(--hin-mono);
	font-size: var(--fs-fine);
	line-height: 1.55;
	color: var(--hin-muted);
}

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

.hin-topbar {
	background: var(--hin-ink);
	color: #cfd4e0;
	font-family: var(--hin-mono);
	font-size: .72rem;
	letter-spacing: .04em;
}
.hin-topbar .wrap {
	display: flex;
	flex-wrap: wrap;
	gap: .4rem 1.4rem;
	align-items: center;
	justify-content: space-between;
	min-height: 34px;
}
.hin-topbar a { color: #fff; text-decoration: none; border-bottom: 1px solid rgba(255, 255, 255, .35); }
.hin-topbar a:hover { border-bottom-color: #fff; }
.hin-topbar__note { margin: 0; }

.site-header {
	background: var(--hin-panel);
	border-bottom: 1px solid var(--hin-line);
	position: sticky;
	top: 0;
	z-index: 60;
}

.header-inner {
	display: flex;
	align-items: center;
	gap: 1.25rem;
	min-height: 76px;
}

.brand {
	display: flex;
	align-items: center;
	gap: .6rem;
	text-decoration: none;
	color: var(--hin-ink);
	font-family: var(--hin-display);
	font-size: 1.24rem;
	font-weight: 700;
	letter-spacing: -.015em;
	margin-right: auto;
}
.brand__mark {
	width: 30px;
	height: 30px;
	flex: none;
	border-radius: 50%;
	background: var(--hin-accent);
	position: relative;
	transition: transform .18s var(--hin-ease);
}
.brand:hover .brand__mark { transform: rotate(-8deg) scale(1.05); }
.brand__mark::after {
	content: "?";
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
	color: #fff;
	font-family: var(--hin-display);
	font-size: 1.05rem;
	font-weight: 700;
}
.brand__tag {
	display: block;
	font-family: var(--hin-mono);
	font-size: .63rem;
	font-weight: 400;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--hin-muted);
}

.nav-toggle {
	display: none;
	font-family: var(--hin-mono);
	font-size: var(--fs-fine);
	letter-spacing: .1em;
	text-transform: uppercase;
	background: none;
	border: 1px solid var(--hin-line);
	border-radius: var(--hin-radius);
	padding: .5rem .8rem;
	cursor: pointer;
	color: var(--hin-ink);
}
.nav-toggle:hover { border-color: var(--hin-accent); color: var(--hin-accent); }

.nav-primary ul {
	display: flex;
	gap: 1.4rem;
	list-style: none;
	margin: 0;
	padding: 0;
}
.nav-primary a {
	text-decoration: none;
	color: var(--hin-ink-soft);
	font-size: .92rem;
	font-weight: 500;
	padding: .35rem 0;
	border-bottom: 2px solid transparent;
	display: block;
	transition: color .12s var(--hin-ease), border-color .12s var(--hin-ease);
}
.nav-primary a:hover,
.nav-primary .current-menu-item > a {
	color: var(--hin-ink);
	border-bottom-color: var(--hin-accent);
}

.header-search { width: min(300px, 34vw); }
.header-search .gce-search { margin: 0; }

@media (max-width: 900px) {
	.header-search { display: none; }
	.nav-toggle { display: block; }
	.nav-primary {
		position: absolute;
		left: 0;
		right: 0;
		top: 100%;
		background: var(--hin-panel);
		border-bottom: 1px solid var(--hin-line);
		display: none;
		padding: .6rem var(--hin-gutter) 1.1rem;
	}
	.nav-primary.is-open { display: block; }
	.nav-primary ul { flex-direction: column; gap: 0; }
	.nav-primary li { border-bottom: 1px solid var(--hin-line-soft); }
	.nav-primary a { padding: .75rem 0; border: 0; }
	.header-inner { position: relative; }
}

/* --------------------------------------------------------- disclosure */

.gce-disclosure-bar {
	background: var(--hin-accent-wash);
	border-bottom: 1px solid var(--hin-line);
	font-family: var(--hin-mono);
	font-size: .72rem;
	color: var(--hin-accent-deep);
	text-align: center;
	padding: .5rem var(--hin-gutter);
}
.gce-disclosure-bar a { color: inherit; }

.gce-disclosure,
.hin-disclosure {
	font-family: var(--hin-mono);
	font-size: .72rem;
	line-height: 1.55;
	color: var(--hin-muted);
	background: var(--hin-panel-alt);
	border-left: 2px solid var(--hin-line);
	padding: .55rem .8rem;
	margin: 0 0 var(--sp-4);
}

/* ------------------------------------------------------------ shell */

.site-main { padding: 0 0 var(--sp-6); }
.hin-page { padding-top: var(--sp-4); }

.crumbs {
	font-family: var(--hin-mono);
	font-size: .72rem;
	color: var(--hin-muted);
	padding: var(--sp-3) 0 .2rem;
}
.crumbs ol {
	display: flex;
	flex-wrap: wrap;
	gap: .4rem;
	list-style: none;
	margin: 0;
	padding: 0;
}
.crumbs li + li::before { content: "/"; margin-right: .4rem; color: var(--hin-line); }
.crumbs a { color: var(--hin-muted); text-decoration: none; }
.crumbs a:hover { color: var(--hin-accent); }

.hin-panel {
	background: var(--hin-panel);
	border: 1px solid var(--hin-line);
	border-radius: var(--hin-radius);
	padding: var(--sp-4);
}

.notice-box {
	background: var(--hin-panel);
	border: 1px solid var(--hin-line);
	border-left: 3px solid var(--hin-hot);
	border-radius: var(--hin-radius);
	padding: var(--sp-3) var(--sp-4);
	color: var(--hin-ink-soft);
	font-size: .95rem;
}

.hin-block { margin: 0 0 var(--sp-6); }
.hin-block:last-child { margin-bottom: 0; }

/* ==========================================================================
   Homepage
   ========================================================================== */

.hin-masthead {
	background: var(--hin-panel);
	border-bottom: 1px solid var(--hin-line);
	padding: var(--sp-6) 0 0;
	position: relative;
	overflow: hidden;
}

/* A faint ruled ground, like the pad the notes were taken on. Sits under
   the text at low contrast, and disappears on small screens where it
   would only add noise. */
.hin-masthead::before {
	content: "";
	position: absolute;
	inset: 0;
	background-image: repeating-linear-gradient(
		to bottom,
		transparent 0,
		transparent 31px,
		var(--hin-line-soft) 31px,
		var(--hin-line-soft) 32px
	);
	opacity: .5;
	pointer-events: none;
}
.hin-masthead > .wrap { position: relative; }

@media (max-width: 700px) {
	.hin-masthead::before { display: none; }
}

.hin-masthead__h1 {
	font-size: var(--fs-hero);
	max-width: 19ch;
	margin: 0 0 var(--sp-3);
	letter-spacing: -.02em;
}
.hin-masthead__h1 em {
	font-style: italic;
	color: var(--hin-accent);
	position: relative;
	white-space: nowrap;
}
.hin-masthead__h1 em::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: .04em;
	height: .1em;
	background: var(--hin-accent);
	opacity: .22;
}

.hin-masthead__lede {
	font-size: var(--fs-lede);
	color: var(--hin-ink-soft);
	max-width: 56ch;
	margin: 0 0 var(--sp-5);
}

.hin-masthead__search { max-width: 620px; }

.hin-masthead__aside {
	border-left: 1px solid var(--hin-line);
	padding-left: var(--sp-5);
}
.hin-masthead__aside ol {
	margin: 0;
	padding: 0;
	list-style: none;
	counter-reset: ask;
}
.hin-masthead__aside li {
	counter-increment: ask;
	display: flex;
	gap: .7rem;
	align-items: baseline;
	padding: .55rem 0;
	border-bottom: 1px solid var(--hin-line-soft);
	font-size: .9rem;
}
.hin-masthead__aside li::before {
	content: counter(ask, decimal-leading-zero);
	font-family: var(--hin-mono);
	font-size: .7rem;
	color: var(--hin-accent);
}
.hin-masthead__aside a { text-decoration: none; color: var(--hin-ink); font-weight: 500; }
.hin-masthead__aside a:hover { color: var(--hin-accent); }
.hin-masthead__aside .val {
	margin-left: auto;
	font-family: var(--hin-mono);
	font-size: .72rem;
	color: var(--hin-muted);
	white-space: nowrap;
	padding-left: .5rem;
}

.hin-masthead__grid {
	display: grid;
	grid-template-columns: 1.35fr .85fr;
	gap: var(--sp-6);
	align-items: start;
}

@media (max-width: 900px) {
	.hin-masthead__grid { grid-template-columns: 1fr; gap: var(--sp-5); }
	.hin-masthead__aside {
		border-left: 0;
		padding-left: 0;
		border-top: 1px solid var(--hin-line);
		padding-top: var(--sp-4);
	}
}

/* --- the ledger line ------------------------------------------------ */

.hin-ledger {
	margin-top: var(--sp-6);
	border-top: 2px solid var(--hin-ink);
	display: flex;
	flex-wrap: wrap;
}
.hin-ledger__cell {
	flex: 1 1 190px;
	padding: var(--sp-3) var(--sp-4) var(--sp-4) 0;
	border-right: 1px solid var(--hin-line-soft);
}
.hin-ledger__cell:last-child { border-right: 0; }
.hin-ledger__v {
	display: block;
	font-family: var(--hin-display);
	font-size: 1.7rem;
	font-weight: 700;
	line-height: 1.05;
	letter-spacing: -.02em;
}
.hin-ledger__l {
	font-family: var(--hin-mono);
	font-size: var(--fs-micro);
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--hin-muted);
}
.hin-ledger__s {
	display: block;
	font-size: .8rem;
	color: var(--hin-muted);
	margin-top: .2rem;
	max-width: 26ch;
}

/* --- the board ------------------------------------------------------ */

.hin-board {
	width: 100%;
	border-collapse: collapse;
	background: var(--hin-panel);
	border: 1px solid var(--hin-line);
	border-radius: var(--hin-radius);
	font-size: .93rem;
	overflow: hidden;
}
.hin-board caption {
	caption-side: bottom;
	text-align: left;
	padding: var(--sp-2) .2rem 0;
	font-family: var(--hin-mono);
	font-size: var(--fs-fine);
	line-height: 1.5;
	color: var(--hin-muted);
}
.hin-board th,
.hin-board td {
	text-align: left;
	padding: .75rem .95rem;
	border-bottom: 1px solid var(--hin-line-soft);
	vertical-align: middle;
}
.hin-board thead th {
	font-family: var(--hin-mono);
	font-size: .66rem;
	font-weight: 500;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--hin-muted);
	background: var(--hin-panel-alt);
	border-bottom: 1px solid var(--hin-line);
	white-space: nowrap;
}
.hin-board tbody tr { transition: background .12s var(--hin-ease); }
.hin-board tbody tr:nth-child(even) { background: var(--hin-panel-tint); }
.hin-board tbody tr:last-child td { border-bottom: 0; }
.hin-board tbody tr:hover { background: var(--hin-accent-wash); }

/* A rule that appears on the row being read. Long lists are easier to
   track across when the eye has something anchoring the line. */
.hin-board tbody tr td:first-child { position: relative; }
.hin-board tbody tr td:first-child::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	width: 3px;
	background: var(--hin-accent);
	opacity: 0;
	transition: opacity .12s var(--hin-ease);
}
.hin-board tbody tr:hover td:first-child::before { opacity: 1; }

.hin-board__store {
	font-weight: 600;
	text-decoration: none;
	color: var(--hin-ink);
}
.hin-board__store:hover { color: var(--hin-accent); }
.hin-board__what { color: var(--hin-ink-soft); }
.hin-board__when {
	font-family: var(--hin-mono);
	font-size: var(--fs-fine);
	color: var(--hin-muted);
	white-space: nowrap;
}
.hin-board__type {
	font-family: var(--hin-mono);
	font-size: .64rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	padding: .22rem .45rem;
	border: 1px solid var(--hin-line);
	border-radius: var(--hin-radius);
	color: var(--hin-muted);
	white-space: nowrap;
	display: inline-block;
}
.hin-board__type.is-code {
	color: var(--hin-accent-deep);
	border-color: var(--hin-accent);
	background: var(--hin-accent-wash);
}

/* Stacked rows on small screens, with the column name carried through
   from the data-label attribute so the figures stay readable. */
@media (max-width: 780px) {
	.hin-board thead { display: none; }
	.hin-board, .hin-board tbody, .hin-board tr, .hin-board td { display: block; width: 100%; }
	.hin-board tr {
		border-bottom: 1px solid var(--hin-line);
		padding: .75rem .95rem;
	}
	.hin-board tr:last-child { border-bottom: 0; }
	.hin-board td { border: 0; padding: .18rem 0; }
	.hin-board td[data-label]::before {
		content: attr(data-label) " ";
		font-family: var(--hin-mono);
		font-size: .62rem;
		letter-spacing: .1em;
		text-transform: uppercase;
		color: var(--hin-muted);
		display: inline-block;
		min-width: 5.5rem;
	}
	.hin-board tbody tr td:first-child::before { display: none; }
}

/* --- browse by need -------------------------------------------------- */

.hin-needs {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(310px, 1fr));
	gap: 0 var(--sp-6);
	background: var(--hin-panel);
	border: 1px solid var(--hin-line);
	border-radius: var(--hin-radius);
	padding: .4rem var(--sp-4) var(--sp-3);
}
.hin-need {
	display: block;
	text-decoration: none;
	color: inherit;
	padding: var(--sp-3) 0;
	border-bottom: 1px solid var(--hin-line-soft);
}
.hin-need:last-child { border-bottom: 0; }
.hin-need__top { display: flex; align-items: baseline; gap: .6rem; }
.hin-need__name {
	font-family: var(--hin-display);
	font-size: var(--fs-h3);
	font-weight: 600;
	transition: color .12s var(--hin-ease);
}
.hin-need__name::after {
	content: " →";
	font-family: var(--hin-mono);
	font-size: .8em;
	opacity: 0;
	transition: opacity .12s var(--hin-ease), transform .12s var(--hin-ease);
	display: inline-block;
	transform: translateX(-4px);
}
.hin-need:hover .hin-need__name { color: var(--hin-accent); }
.hin-need:hover .hin-need__name::after { opacity: 1; transform: translateX(0); }
.hin-need__n {
	margin-left: auto;
	font-family: var(--hin-mono);
	font-size: .7rem;
	color: var(--hin-muted);
	white-space: nowrap;
}
.hin-need__desc {
	font-size: var(--fs-small);
	color: var(--hin-muted);
	margin: .25rem 0 0;
	display: block;
	max-width: 52ch;
}

/* --- the walkthrough ------------------------------------------------- */

.hin-walk {
	counter-reset: walk;
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
	gap: 1px;
	background: var(--hin-line);
	border: 1px solid var(--hin-line);
	border-radius: var(--hin-radius);
	overflow: hidden;
}
.hin-walk li {
	counter-increment: walk;
	background: var(--hin-panel);
	padding: var(--sp-4);
	border-top: 3px solid transparent;
	transition: border-color .14s var(--hin-ease);
}
.hin-walk li:hover { border-top-color: var(--hin-accent); }
.hin-walk li::before {
	content: counter(walk, decimal-leading-zero);
	display: block;
	font-family: var(--hin-mono);
	font-size: .72rem;
	letter-spacing: .1em;
	color: var(--hin-accent);
	margin-bottom: var(--sp-1);
}
.hin-walk b {
	display: block;
	font-family: var(--hin-display);
	font-size: var(--fs-h3);
	font-weight: 600;
	margin-bottom: .25rem;
}
.hin-walk p { margin: 0; font-size: var(--fs-small); color: var(--hin-muted); }

/* --- store strip ----------------------------------------------------- */

.hin-stores {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(205px, 1fr));
	gap: 1px;
	background: var(--hin-line);
	border: 1px solid var(--hin-line);
	border-radius: var(--hin-radius);
	overflow: hidden;
}
.hin-store-row {
	background: var(--hin-panel);
	padding: .8rem .95rem;
	text-decoration: none;
	color: var(--hin-ink);
	display: flex;
	flex-direction: column;
	gap: .12rem;
	border-left: 3px solid transparent;
	transition: background .12s var(--hin-ease), border-color .12s var(--hin-ease);
}
.hin-store-row:hover {
	background: var(--hin-accent-wash);
	border-left-color: var(--hin-accent);
	color: var(--hin-accent-deep);
}
.hin-store-row__n { font-weight: 600; font-size: .93rem; }
.hin-store-row__v { font-family: var(--hin-mono); font-size: .7rem; color: var(--hin-muted); }
.hin-store-row:hover .hin-store-row__v { color: var(--hin-accent); }

/* --- plain answers grid ---------------------------------------------- */

.hin-qa {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
	gap: var(--sp-5) var(--sp-6);
	counter-reset: qa;
}
.hin-qa > div { counter-increment: qa; }
.hin-qa__q {
	font-family: var(--hin-display);
	font-size: var(--fs-h3);
	font-weight: 600;
	margin: 0 0 var(--sp-1);
	padding-top: var(--sp-2);
	border-top: 2px solid var(--hin-ink);
	display: flex;
	gap: .55rem;
	align-items: baseline;
}
.hin-qa__q::before {
	content: counter(qa, decimal-leading-zero);
	font-family: var(--hin-mono);
	font-size: .66rem;
	font-weight: 400;
	letter-spacing: .1em;
	color: var(--hin-accent);
	flex: none;
}
.hin-qa__a { font-size: .93rem; color: var(--hin-ink-soft); margin: 0; max-width: 48ch; }

/* ==========================================================================
   Merchant page
   ========================================================================== */

.merchant {
	display: grid;
	grid-template-columns: var(--hin-rail) minmax(0, 1fr);
	gap: var(--sp-6);
	align-items: start;
	padding-top: var(--sp-2);
}

.merchant__rail { position: sticky; top: 96px; }

@media (max-width: 1000px) {
	.merchant { grid-template-columns: 1fr; gap: var(--sp-5); }
	.merchant__rail { position: static; }
}

.rail-card {
	background: var(--hin-panel);
	border: 1px solid var(--hin-line);
	border-radius: var(--hin-radius);
	padding: var(--sp-3);
	margin-bottom: var(--sp-3);
}
.rail-card__logo {
	width: 100%;
	height: 88px;
	display: grid;
	place-items: center;
	background: var(--hin-panel-alt);
	border: 1px solid var(--hin-line-soft);
	border-radius: var(--hin-radius);
	margin-bottom: var(--sp-2);
	overflow: hidden;
	padding: .5rem;
}
.rail-card__logo img { max-height: 66px; width: auto; object-fit: contain; }
.rail-card__initial {
	font-family: var(--hin-display);
	font-size: 2.1rem;
	font-weight: 700;
	color: var(--hin-accent);
}
.rail-card__name {
	font-family: var(--hin-display);
	font-size: 1.12rem;
	font-weight: 700;
	margin: 0 0 .2rem;
}
.rail-card__best {
	font-family: var(--hin-mono);
	font-size: var(--fs-fine);
	color: var(--hin-accent-deep);
	background: var(--hin-accent-wash);
	display: inline-block;
	padding: .22rem .48rem;
	border-radius: var(--hin-radius);
	margin-bottom: var(--sp-2);
}

/* ------------------------------------------------------------- buttons */

.hin-btn,
.gce-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .45rem;
	font-family: var(--hin-body);
	font-size: var(--fs-small);
	font-weight: 600;
	line-height: 1.2;
	padding: .74rem 1.05rem;
	border-radius: var(--hin-radius);
	border: 1px solid var(--hin-accent);
	background: var(--hin-accent);
	color: #fff;
	text-decoration: none;
	cursor: pointer;
	transition: background .12s var(--hin-ease), transform .08s var(--hin-ease);
}
.hin-btn:hover,
.gce-btn:hover { background: var(--hin-accent-deep); border-color: var(--hin-accent-deep); color: #fff; }
.hin-btn:active,
.gce-btn:active { transform: translateY(1px); }
.hin-btn--block { width: 100%; }
.hin-btn--ghost,
.gce-btn--deal {
	background: transparent;
	color: var(--hin-accent);
	border-color: var(--hin-accent);
}
.hin-btn--ghost:hover,
.gce-btn--deal:hover { background: var(--hin-accent-wash); color: var(--hin-accent-deep); }
.gce-btn--dead {
	background: var(--hin-panel-alt);
	border-color: var(--hin-line);
	color: var(--hin-muted);
	cursor: default;
}
.gce-btn--dead:hover { background: var(--hin-panel-alt); color: var(--hin-muted); border-color: var(--hin-line); }
.gce-btn--dead:active { transform: none; }

/* ------------------------------------------------------------ rail nav */

.rail-nav ol {
	list-style: none;
	margin: 0;
	padding: 0;
	counter-reset: rail;
}
.rail-nav li { counter-increment: rail; }
.rail-nav a {
	display: flex;
	gap: .55rem;
	padding: .42rem 0;
	font-size: var(--fs-small);
	text-decoration: none;
	color: var(--hin-ink-soft);
	border-bottom: 1px solid var(--hin-line-soft);
	transition: color .12s var(--hin-ease);
}
.rail-nav li:last-child a { border-bottom: 0; }
.rail-nav a::before {
	content: counter(rail, decimal-leading-zero);
	font-family: var(--hin-mono);
	font-size: .68rem;
	color: var(--hin-muted);
	padding-top: .18rem;
}
.rail-nav a:hover { color: var(--hin-accent); }
.rail-nav a[aria-current] { color: var(--hin-accent); font-weight: 600; }
.rail-nav a[aria-current]::before { color: var(--hin-accent); }

/* ------------------------------------------------------- merchant head */

.m-head { margin-bottom: var(--sp-4); }
.m-head__h1 { font-size: var(--fs-h1); margin: 0 0 var(--sp-1); letter-spacing: -.018em; }
.m-head__tagline { font-size: var(--fs-lede); color: var(--hin-ink-soft); margin: 0 0 .2rem; max-width: 60ch; }

/* --------------------------------------------------- the short answer */

.hin-verdict {
	background: var(--hin-panel);
	border: 1px solid var(--hin-line);
	border-top: 3px solid var(--hin-accent);
	border-radius: var(--hin-radius);
	padding: var(--sp-4);
	margin: 0 0 var(--sp-5);
}
.hin-verdict__h {
	font-family: var(--hin-mono);
	font-size: var(--fs-micro);
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--hin-accent);
	margin: 0 0 var(--sp-3);
}
.hin-verdict__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(158px, 1fr));
	gap: 0;
	margin: 0 0 var(--sp-3);
	border-top: 1px solid var(--hin-line-soft);
}
.hin-verdict__cell {
	padding: .8rem var(--sp-3) .8rem 0;
	border-bottom: 1px solid var(--hin-line-soft);
}
.hin-verdict__cell dt {
	font-family: var(--hin-mono);
	font-size: .65rem;
	letter-spacing: .11em;
	text-transform: uppercase;
	color: var(--hin-muted);
	margin-bottom: .22rem;
}
.hin-verdict__cell dd {
	margin: 0;
	font-family: var(--hin-display);
	font-size: 1.1rem;
	font-weight: 600;
	line-height: 1.25;
}
.hin-verdict__cell dd small {
	display: block;
	font-family: var(--hin-mono);
	font-size: .67rem;
	font-weight: 400;
	color: var(--hin-muted);
	line-height: 1.4;
	margin-top: .15rem;
}
.hin-verdict__why {
	margin: 0;
	font-size: .94rem;
	color: var(--hin-ink-soft);
	padding-top: .3rem;
	max-width: 66ch;
}

/* ------------------------------------------------------- offer ledger */

.hin-offers {
	border: 1px solid var(--hin-line);
	border-radius: var(--hin-radius);
	background: var(--hin-panel);
	overflow: hidden;
}
.gce-coupon,
.hin-offer {
	display: grid;
	grid-template-columns: 96px minmax(0, 1fr) 210px;
	gap: 0 1.15rem;
	align-items: center;
	padding: var(--sp-3) var(--sp-4);
	border-bottom: 1px solid var(--hin-line-soft);
	border-left: 3px solid transparent;
	background: var(--hin-panel);
	transition: background .12s var(--hin-ease), border-color .12s var(--hin-ease);
}
.gce-coupon:last-child { border-bottom: 0; }
.gce-coupon:hover { background: var(--hin-panel-tint); border-left-color: var(--hin-line); }
.gce-coupon.is-expired { background: var(--hin-panel-alt); }
.gce-coupon.is-exclusive,
.gce-coupon.is-exclusive:hover { border-left-color: var(--hin-accent); }

.gce-coupon__stub {
	text-align: center;
	border-right: 1px dashed var(--hin-line);
	padding-right: var(--sp-3);
	align-self: stretch;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: .1rem;
}
.gce-coupon__value {
	font-family: var(--hin-display);
	font-size: 1.4rem;
	font-weight: 700;
	line-height: 1.02;
	letter-spacing: -.02em;
	color: var(--hin-accent);
	word-break: break-word;
}
.gce-coupon.is-expired .gce-coupon__value { color: var(--hin-muted); }
.gce-coupon__kind {
	font-family: var(--hin-mono);
	font-size: .59rem;
	letter-spacing: .11em;
	text-transform: uppercase;
	color: var(--hin-muted);
}

.gce-coupon__title {
	font-family: var(--hin-display);
	font-size: var(--fs-h3);
	font-weight: 600;
	margin: 0 0 .2rem;
	line-height: 1.3;
}
.gce-coupon__desc { font-size: var(--fs-small); color: var(--hin-muted); margin: 0 0 .35rem; max-width: 60ch; }
.gce-coupon__flags { margin: 0 0 .3rem; display: flex; gap: .4rem; flex-wrap: wrap; }
.gce-flag {
	font-family: var(--hin-mono);
	font-size: .59rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	padding: .18rem .42rem;
	border-radius: var(--hin-radius);
	background: var(--hin-accent-wash);
	color: var(--hin-accent-deep);
}
.gce-flag--expired { background: var(--hin-panel-alt); color: var(--hin-muted); border: 1px solid var(--hin-line); }

.gce-coupon__meta {
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	gap: .3rem .9rem;
	font-family: var(--hin-mono);
	font-size: .69rem;
	color: var(--hin-muted);
}
.gce-verified { color: var(--hin-accent-deep); }
.gce-expires { color: var(--hin-hot); }
.gce-rate { color: var(--hin-ink-soft); }

.gce-coupon__terms { margin-top: .45rem; }
.gce-coupon__terms summary {
	font-family: var(--hin-mono);
	font-size: .67rem;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--hin-muted);
	cursor: pointer;
}
.gce-coupon__terms summary:hover { color: var(--hin-accent); }
.gce-coupon__terms p { font-size: .85rem; color: var(--hin-muted); margin: .4rem 0 0; max-width: 60ch; }

.gce-coupon__action { display: flex; flex-direction: column; gap: .5rem; align-items: stretch; }

/* The reveal button reads as a code waiting to be uncovered: masked
   characters on the left, the instruction on the right. */
.gce-btn--reveal {
	justify-content: space-between;
	padding-inline: .55rem .8rem;
	gap: .6rem;
}
.gce-btn__peek {
	font-family: var(--hin-mono);
	font-size: .76rem;
	letter-spacing: .08em;
	background: rgba(255, 255, 255, .16);
	border: 1px dashed rgba(255, 255, 255, .45);
	border-radius: 2px;
	padding: .18rem .4rem;
}
.gce-btn__label { font-weight: 600; }

.gce-vote {
	display: flex;
	align-items: center;
	gap: .35rem;
	font-family: var(--hin-mono);
	font-size: .66rem;
	color: var(--hin-muted);
	justify-content: flex-end;
}
.gce-vote__btn {
	font-family: var(--hin-mono);
	font-size: .66rem;
	background: none;
	border: 1px solid var(--hin-line);
	border-radius: var(--hin-radius);
	padding: .18rem .42rem;
	cursor: pointer;
	color: var(--hin-ink-soft);
	transition: border-color .12s var(--hin-ease), color .12s var(--hin-ease);
}
.gce-vote__btn:hover { border-color: var(--hin-accent); color: var(--hin-accent); }
.gce-vote__done { color: var(--hin-accent-deep); }

@media (max-width: 720px) {
	.gce-coupon { grid-template-columns: 78px minmax(0, 1fr); gap: .6rem .9rem; padding: var(--sp-3); }
	.gce-coupon__action { grid-column: 1 / -1; }
	.gce-vote { justify-content: flex-start; }
	.gce-coupon__value { font-size: 1.2rem; }
}

/* -------------------------------------------------- steps and warnings */

.hin-steps {
	counter-reset: step;
	list-style: none;
	margin: 0 0 var(--sp-5);
	padding: 0;
}
.hin-steps li {
	counter-increment: step;
	position: relative;
	padding: .6rem 0 .6rem 2.6rem;
	border-bottom: 1px solid var(--hin-line-soft);
	font-size: .96rem;
	max-width: 72ch;
}
.hin-steps li:last-child { border-bottom: 0; }
.hin-steps li::before {
	content: counter(step);
	position: absolute;
	left: 0;
	top: .55rem;
	width: 1.7rem;
	height: 1.7rem;
	display: grid;
	place-items: center;
	border: 1px solid var(--hin-accent);
	border-radius: 50%;
	font-family: var(--hin-mono);
	font-size: .72rem;
	color: var(--hin-accent);
	background: var(--hin-panel);
}

.hin-watch {
	list-style: none;
	margin: 0;
	padding: 0;
	border-top: 2px solid var(--hin-ink);
}
.hin-watch li {
	padding: .75rem 0 .75rem 1.35rem;
	border-bottom: 1px solid var(--hin-line-soft);
	position: relative;
	font-size: .94rem;
	color: var(--hin-ink-soft);
	max-width: 72ch;
}
.hin-watch li::before {
	content: "—";
	position: absolute;
	left: 0;
	color: var(--hin-accent);
	font-family: var(--hin-mono);
}

/* ------------------------------------------------------------- tables */

.hin-table {
	width: 100%;
	border-collapse: collapse;
	background: var(--hin-panel);
	border: 1px solid var(--hin-line);
	border-radius: var(--hin-radius);
	font-size: .93rem;
	overflow: hidden;
}
.hin-table caption {
	caption-side: bottom;
	text-align: left;
	padding: var(--sp-2) .1rem 0;
	font-family: var(--hin-mono);
	font-size: var(--fs-fine);
	line-height: 1.5;
	color: var(--hin-muted);
	max-width: 80ch;
}
.hin-table th,
.hin-table td {
	text-align: left;
	padding: .75rem .95rem;
	border-bottom: 1px solid var(--hin-line-soft);
	vertical-align: top;
}
.hin-table thead th {
	font-family: var(--hin-mono);
	font-size: .65rem;
	font-weight: 500;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--hin-muted);
	background: var(--hin-panel-alt);
	border-bottom: 1px solid var(--hin-line);
}
.hin-table tbody tr:last-child td,
.hin-table tbody tr:last-child th { border-bottom: 0; }
.hin-table tbody tr:nth-child(even) { background: var(--hin-panel-tint); }
.hin-table tbody th {
	font-family: var(--hin-body);
	font-weight: 600;
	width: 34%;
}
.hin-table td.num,
.hin-table .price {
	font-family: var(--hin-mono);
	font-size: .89rem;
	white-space: nowrap;
}
.hin-table tr.is-self { background: var(--hin-accent-wash) !important; }
.hin-table tr.is-self th { color: var(--hin-accent-deep); }

@media (max-width: 620px) {
	.hin-table tbody th { width: auto; display: block; border-bottom: 0; padding-bottom: 0; }
	.hin-table tbody td { display: block; }
}

/* --------------------------------------------------------- timing note */

.hin-timing {
	background: var(--hin-panel);
	border: 1px solid var(--hin-line);
	border-left: 3px solid var(--hin-hot);
	border-radius: var(--hin-radius);
	padding: var(--sp-4);
}
.hin-timing p { max-width: 72ch; }
.hin-timing p:last-child { margin-bottom: 0; }
.hin-timing__tag {
	font-family: var(--hin-mono);
	font-size: .66rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--hin-hot);
	background: var(--hin-hot-wash);
	padding: .2rem .48rem;
	border-radius: var(--hin-radius);
	display: inline-block;
	margin-bottom: var(--sp-2);
}

/* ------------------------------------------------------------- retired */

.hin-retired {
	border: 1px solid var(--hin-line);
	border-radius: var(--hin-radius);
	background: var(--hin-panel);
	padding: 0 var(--sp-3);
}
.hin-retired > summary {
	cursor: pointer;
	padding: var(--sp-3) 0;
	font-family: var(--hin-mono);
	font-size: var(--fs-fine);
	letter-spacing: .09em;
	text-transform: uppercase;
	color: var(--hin-muted);
	list-style: none;
}
.hin-retired > summary:hover { color: var(--hin-accent); }
.hin-retired > summary::-webkit-details-marker { display: none; }
.hin-retired > summary::before { content: "+ "; color: var(--hin-accent); }
.hin-retired[open] > summary::before { content: "– "; }
.hin-retired .hin-offers { border: 0; margin-bottom: var(--sp-3); }
.hin-retired .gce-coupon { padding-inline: 0; }

/* ---------------------------------------------------------------- FAQ */

.gce-faq { margin: 0; }
.gce-faq__list {
	border: 1px solid var(--hin-line);
	border-radius: var(--hin-radius);
	background: var(--hin-panel);
	overflow: hidden;
}
.gce-faq__item { border-bottom: 1px solid var(--hin-line-soft); }
.gce-faq__item:last-child { border-bottom: 0; }
.gce-faq__item[open] { background: var(--hin-panel-tint); }
.gce-faq__q {
	cursor: pointer;
	padding: var(--sp-3) var(--sp-4);
	list-style: none;
	display: flex;
	align-items: flex-start;
	gap: .7rem;
	transition: background .12s var(--hin-ease);
}
.gce-faq__q:hover { background: var(--hin-accent-wash); }
.gce-faq__q::-webkit-details-marker { display: none; }
.gce-faq__q::before {
	content: "?";
	font-family: var(--hin-mono);
	font-size: .8rem;
	color: var(--hin-accent);
	flex: none;
	padding-top: .12rem;
}
.gce-faq__q h3 {
	font-family: var(--hin-display);
	font-size: var(--fs-h3);
	font-weight: 600;
	margin: 0;
}
.gce-faq__a { padding: 0 var(--sp-4) var(--sp-3) 2.75rem; }
.gce-faq__a p { margin: 0; font-size: .94rem; color: var(--hin-ink-soft); max-width: 72ch; }

/* --------------------------------------------------------- newsletter */

.gce-newsletter,
.hin-signup {
	background: var(--hin-ink);
	color: #e7eaf1;
	border-radius: var(--hin-radius);
	border-top: 3px solid var(--hin-accent);
	padding: var(--sp-5);
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(280px, 400px);
	gap: var(--sp-3) var(--sp-5);
	align-items: center;
}
.gce-newsletter__h,
.hin-signup h2 {
	font-family: var(--hin-display);
	font-size: 1.24rem;
	color: #fff;
	margin: 0 0 .3rem;
	padding: 0;
	border: 0;
	max-width: 32ch;
}
.gce-newsletter__p { margin: 0; font-size: .91rem; color: #b9c0cf; max-width: 52ch; }
.gce-newsletter__form { display: flex; gap: .5rem; flex-wrap: wrap; }
.gce-newsletter__form input[type="email"] {
	flex: 1;
	min-width: 0;
	font-family: var(--hin-body);
	font-size: .93rem;
	padding: .72rem .8rem;
	border: 1px solid #3a4152;
	border-radius: var(--hin-radius);
	background: #1c2130;
	color: #fff;
}
.gce-newsletter__form input[type="email"]:focus { border-color: var(--hin-accent); outline: none; }
.gce-newsletter__form input::placeholder { color: #7a8296; }
.gce-newsletter__fine {
	grid-column: 1 / -1;
	font-family: var(--hin-mono);
	font-size: .67rem;
	line-height: 1.55;
	color: #838b9d;
	margin: 0;
	padding-top: var(--sp-2);
	border-top: 1px solid #262c3b;
}
.gce-newsletter__fine a { color: #b9c0cf; }
.gce-newsletter__msg { flex-basis: 100%; font-size: .85rem; margin: 0; color: #cdd3e0; }

@media (max-width: 780px) {
	.gce-newsletter, .hin-signup { grid-template-columns: 1fr; }
}

/* ------------------------------------------------------------- search */

.gce-search { position: relative; display: flex; gap: .5rem; }
.gce-search input[type="search"],
.gce-search input[type="text"] {
	flex: 1;
	min-width: 0;
	font-family: var(--hin-body);
	font-size: .96rem;
	padding: .75rem .9rem;
	border: 1px solid var(--hin-line);
	border-radius: var(--hin-radius);
	background: var(--hin-panel);
	color: var(--hin-ink);
	transition: border-color .12s var(--hin-ease);
}
.gce-search input:focus { border-color: var(--hin-accent); outline: none; }
.gce-search button {
	flex: none;
	font-family: var(--hin-body);
	font-size: var(--fs-small);
	font-weight: 600;
	padding: .74rem 1.05rem;
	border: 1px solid var(--hin-accent);
	background: var(--hin-accent);
	color: #fff;
	border-radius: var(--hin-radius);
	cursor: pointer;
}
.gce-search button:hover { background: var(--hin-accent-deep); border-color: var(--hin-accent-deep); }

/* --------------------------------------------------------- store tiles */

.gce-store-grid,
.hin-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(212px, 1fr));
	gap: 1px;
	background: var(--hin-line);
	border: 1px solid var(--hin-line);
	border-radius: var(--hin-radius);
	overflow: hidden;
}
.gce-store-card {
	background: var(--hin-panel);
	padding: var(--sp-3);
	text-decoration: none;
	color: var(--hin-ink);
	display: flex;
	flex-direction: column;
	gap: .25rem;
	min-height: 120px;
	border-top: 3px solid transparent;
	transition: background .12s var(--hin-ease), border-color .12s var(--hin-ease);
}
.gce-store-card:hover { background: var(--hin-accent-wash); border-top-color: var(--hin-accent); }
.gce-store-card__logo { height: 34px; display: flex; align-items: center; margin-bottom: .3rem; }
.gce-store-card__logo img { max-height: 34px; width: auto; }
.gce-store-card__initial {
	font-family: var(--hin-display);
	font-size: 1.35rem;
	font-weight: 700;
	color: var(--hin-accent);
}
.gce-store-card__name { font-family: var(--hin-display); font-size: 1.02rem; font-weight: 600; }
.gce-store-card__best { font-family: var(--hin-mono); font-size: .72rem; color: var(--hin-accent-deep); }
.gce-store-card__count,
.gce-store-card__ver { font-family: var(--hin-mono); font-size: .68rem; color: var(--hin-muted); }
.gce-store-grid--sm { grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); }
.gce-store-grid--sm .gce-store-card { min-height: 0; padding: .82rem .9rem; }

/* ------------------------------------------- plugin category and index */

.gce-cats {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: 0 var(--sp-6);
}
.gce-cat {
	display: block;
	padding: var(--sp-3) 0;
	border-bottom: 1px solid var(--hin-line-soft);
	text-decoration: none;
	color: inherit;
}
.gce-cat__head { display: flex; align-items: baseline; gap: .6rem; }
.gce-cat__name { font-family: var(--hin-display); font-size: var(--fs-h3); font-weight: 600; }
.gce-cat__count { margin-left: auto; font-family: var(--hin-mono); font-size: .7rem; color: var(--hin-muted); }
.gce-cat__desc { font-size: var(--fs-small); color: var(--hin-muted); margin: .25rem 0 0; max-width: 56ch; }

.gce-index__jump {
	display: flex;
	flex-wrap: wrap;
	gap: .3rem;
	margin: 0 0 var(--sp-5);
	padding: 0;
	list-style: none;
}
.gce-index__jump a {
	font-family: var(--hin-mono);
	font-size: .78rem;
	text-decoration: none;
	border: 1px solid var(--hin-line);
	border-radius: var(--hin-radius);
	padding: .3rem .58rem;
	color: var(--hin-ink-soft);
	background: var(--hin-panel);
}
.gce-index__jump a:hover { border-color: var(--hin-accent); color: var(--hin-accent); background: var(--hin-accent-wash); }
.gce-index__group { margin-bottom: var(--sp-5); }
.gce-index__letter {
	font-family: var(--hin-mono);
	font-size: .82rem;
	letter-spacing: .12em;
	color: var(--hin-accent);
	border-bottom: 2px solid var(--hin-ink);
	padding-bottom: .3rem;
	margin: 0 0 var(--sp-2);
}
.gce-index__list {
	list-style: none;
	margin: 0;
	padding: 0;
	columns: 4 180px;
	column-gap: var(--sp-5);
}
.gce-index__list li { padding: .22rem 0; font-size: .91rem; break-inside: avoid; }
.gce-index__list a { text-decoration: none; color: var(--hin-ink-soft); }
.gce-index__list a:hover { color: var(--hin-accent); }

/* ------------------------------------------------ shortcode leftovers */

.gce-section { margin: 0 0 var(--sp-6); }
.gce-section__head {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: .6rem 1.2rem;
	margin-bottom: var(--sp-3);
}
.gce-section__head .gce-h2 { margin-bottom: 0; }

.gce-coupon-list {
	border: 1px solid var(--hin-line);
	border-radius: var(--hin-radius);
	background: var(--hin-panel);
	overflow: hidden;
}

.gce-cats .gce-cat { border-bottom: 1px solid var(--hin-line); padding: var(--sp-4) 0; }
.gce-cats .gce-cat .gce-store-grid { margin-top: var(--sp-2); }

.gce-cards {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 1px;
	background: var(--hin-line);
	border: 1px solid var(--hin-line);
	border-radius: var(--hin-radius);
	overflow: hidden;
}
.gce-card { background: var(--hin-panel); padding: var(--sp-3) var(--sp-4); }
.gce-card--wide { grid-column: 1 / -1; }

.gce-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 1px;
	background: var(--hin-line);
	border: 1px solid var(--hin-line);
	border-radius: var(--hin-radius);
	overflow: hidden;
}
.gce-chip { background: var(--hin-panel); padding: var(--sp-3) var(--sp-4); flex: 1 1 170px; }
.gce-chip__value { display: block; font-family: var(--hin-display); font-size: 1.4rem; font-weight: 700; }
.gce-chip__label {
	font-family: var(--hin-mono);
	font-size: var(--fs-micro);
	letter-spacing: .11em;
	text-transform: uppercase;
	color: var(--hin-muted);
}
.gce-chip__sub { display: block; font-size: .79rem; color: var(--hin-muted); }

.gce-byline {
	font-family: var(--hin-mono);
	font-size: .72rem;
	color: var(--hin-muted);
	border-top: 1px solid var(--hin-line-soft);
	border-bottom: 1px solid var(--hin-line-soft);
	padding: .58rem 0;
	margin: 0 0 var(--sp-3);
	display: flex;
	flex-wrap: wrap;
	gap: .3rem .9rem;
}
.gce-byline__who { color: var(--hin-ink); font-weight: 500; }

.gce-link-arrow {
	font-family: var(--hin-mono);
	font-size: .77rem;
	letter-spacing: .06em;
	text-decoration: none;
	border-bottom: 1px solid currentColor;
	padding-bottom: .1rem;
	display: inline-block;
}
.gce-link-arrow::after { content: " →"; transition: transform .12s var(--hin-ease); display: inline-block; }
.gce-link-arrow:hover::after { transform: translateX(3px); }

.gce-steps { counter-reset: gstep; list-style: none; margin: 0; padding: 0; }
.gce-steps li {
	counter-increment: gstep;
	padding: .55rem 0 .55rem 2.5rem;
	position: relative;
	border-bottom: 1px solid var(--hin-line-soft);
}
.gce-steps li::before {
	content: counter(gstep);
	position: absolute;
	left: 0;
	top: .5rem;
	width: 1.7rem;
	height: 1.7rem;
	display: grid;
	place-items: center;
	border: 1px solid var(--hin-accent);
	border-radius: 50%;
	font-family: var(--hin-mono);
	font-size: .72rem;
	color: var(--hin-accent);
}

.gce-pricing {
	width: 100%;
	border-collapse: collapse;
	background: var(--hin-panel);
	border: 1px solid var(--hin-line);
}
.gce-pricing th, .gce-pricing td { text-align: left; padding: .72rem .95rem; border-bottom: 1px solid var(--hin-line-soft); }
.gce-plan__price { font-family: var(--hin-mono); white-space: nowrap; }
.gce-pricing__caveat { font-family: var(--hin-mono); font-size: .71rem; color: var(--hin-muted); }

.gce-method {
	background: var(--hin-panel);
	border: 1px solid var(--hin-line);
	border-radius: var(--hin-radius);
	padding: var(--sp-4) var(--sp-5);
}
.gce-method__steps {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: var(--sp-4);
	list-style: none;
	margin: var(--sp-3) 0 0;
	padding: 0;
}
.gce-method__num { font-family: var(--hin-mono); font-size: .72rem; color: var(--hin-accent); display: block; margin-bottom: .3rem; }
.gce-method__st { font-family: var(--hin-display); font-weight: 600; display: block; margin-bottom: .2rem; }
.gce-method__sd { font-size: var(--fs-small); color: var(--hin-muted); }

.gce-pill {
	font-family: var(--hin-mono);
	font-size: .66rem;
	letter-spacing: .08em;
	text-transform: uppercase;
	padding: .18rem .44rem;
	border-radius: var(--hin-radius);
	background: var(--hin-panel-alt);
	border: 1px solid var(--hin-line);
}
.gce-pill--ok { color: var(--hin-accent-deep); background: var(--hin-accent-wash); border-color: var(--hin-accent); }
.gce-pill--warn { color: var(--hin-hot); background: var(--hin-hot-wash); border-color: var(--hin-hot); }

.gce-note { font-family: var(--hin-mono); font-size: .73rem; color: var(--hin-muted); }
.gce-dim { color: var(--hin-muted); }
.gce-inline { display: inline-flex; gap: .5rem; align-items: center; }
.gce-wrap { width: min(var(--hin-wrap), 100%); margin-inline: auto; padding-inline: var(--hin-gutter); }

/* ---------------------------------------------------------------- modal */

.gce-modal { position: fixed; inset: 0; z-index: 200; display: grid; place-items: center; padding: 1.2rem; }
.gce-modal[hidden] { display: none; }
.gce-modal__scrim { position: absolute; inset: 0; background: rgba(19, 23, 34, .7); }
.gce-modal__panel {
	position: relative;
	background: var(--hin-panel);
	border: 1px solid var(--hin-line);
	border-top: 4px solid var(--hin-accent);
	border-radius: var(--hin-radius);
	padding: var(--sp-5);
	width: min(460px, 100%);
}
.gce-modal__x {
	position: absolute;
	top: .5rem;
	right: .7rem;
	background: none;
	border: 0;
	font-size: 1.5rem;
	line-height: 1;
	cursor: pointer;
	color: var(--hin-muted);
}
.gce-modal__x:hover { color: var(--hin-ink); }
.gce-modal__eyebrow {
	font-family: var(--hin-mono);
	font-size: var(--fs-micro);
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--hin-muted);
	margin: 0 0 .35rem;
}
.gce-modal__h { font-size: 1.28rem; margin: 0 0 var(--sp-4); }
.gce-modal__code {
	display: flex;
	align-items: center;
	gap: .6rem;
	border: 1px dashed var(--hin-accent);
	background: var(--hin-accent-wash);
	border-radius: var(--hin-radius);
	padding: .85rem .9rem;
	margin-bottom: var(--sp-2);
}
.gce-modal__code code {
	font-family: var(--hin-mono);
	font-size: 1.14rem;
	font-weight: 600;
	letter-spacing: .06em;
	color: var(--hin-accent-deep);
	flex: 1;
	word-break: break-all;
}
.gce-modal__copy {
	font-family: var(--hin-mono);
	font-size: .72rem;
	letter-spacing: .06em;
	text-transform: uppercase;
	background: var(--hin-accent);
	color: #fff;
	border: 0;
	border-radius: var(--hin-radius);
	padding: .52rem .72rem;
	cursor: pointer;
	white-space: nowrap;
}
.gce-modal__copy:hover { background: var(--hin-accent-deep); }
.gce-modal__hint { font-size: .88rem; color: var(--hin-muted); margin: 0 0 var(--sp-3); }
.gce-modal__go { display: inline-block; font-family: var(--hin-mono); font-size: .78rem; color: var(--hin-accent); }
body.gce-modal-open { overflow: hidden; }

/* -------------------------------------------------- archives and pages */

.arch-head {
	padding: var(--sp-4) 0 var(--sp-3);
	border-bottom: 2px solid var(--hin-ink);
	margin-bottom: var(--sp-5);
}
.arch-head h1 { font-size: var(--fs-h1); margin: 0 0 .3rem; }
.arch-head .count { font-family: var(--hin-mono); font-size: var(--fs-fine); color: var(--hin-muted); }
.arch-head p { max-width: 66ch; color: var(--hin-ink-soft); margin: var(--sp-2) 0 0; }

.page-body {
	background: var(--hin-panel);
	border: 1px solid var(--hin-line);
	border-radius: var(--hin-radius);
	padding: clamp(1.4rem, 4vw, 2.8rem);
	max-width: 78ch;
}
.page-body h1 { font-size: var(--fs-h1); margin-bottom: var(--sp-3); }
.page-body h2 { font-size: 1.36rem; margin-top: var(--sp-5); padding-left: .8rem; border-left: 3px solid var(--hin-accent); }
.page-body h3 { font-size: 1.12rem; margin-top: var(--sp-4); }
.page-body ul, .page-body ol { padding-left: 1.2rem; }
.page-body li { margin-bottom: .4rem; }
.page-body table { width: 100%; border-collapse: collapse; margin: var(--sp-4) 0; }
.page-body th, .page-body td { text-align: left; padding: .62rem .8rem; border-bottom: 1px solid var(--hin-line-soft); }
.page-body blockquote {
	margin: var(--sp-4) 0;
	padding-left: var(--sp-3);
	border-left: 3px solid var(--hin-accent);
	font-family: var(--hin-display);
	font-size: 1.1rem;
}

.pagination {
	display: flex;
	flex-wrap: wrap;
	gap: .35rem;
	margin: var(--sp-5) 0 0;
	font-family: var(--hin-mono);
	font-size: .82rem;
}
.pagination .page-numbers {
	padding: .42rem .72rem;
	border: 1px solid var(--hin-line);
	border-radius: var(--hin-radius);
	text-decoration: none;
	color: var(--hin-ink-soft);
	background: var(--hin-panel);
}
.pagination .page-numbers:hover { border-color: var(--hin-accent); color: var(--hin-accent); }
.pagination .current { background: var(--hin-accent); color: #fff; border-color: var(--hin-accent); }

.widget {
	background: var(--hin-panel);
	border: 1px solid var(--hin-line);
	border-radius: var(--hin-radius);
	padding: var(--sp-3);
	margin-bottom: var(--sp-3);
}
.widget__title {
	font-family: var(--hin-mono);
	font-size: var(--fs-micro);
	letter-spacing: .13em;
	text-transform: uppercase;
	color: var(--hin-muted);
	margin: 0 0 var(--sp-2);
}
.widget ul { list-style: none; margin: 0; padding: 0; }
.widget li { padding: .34rem 0; border-bottom: 1px solid var(--hin-line-soft); font-size: var(--fs-small); }
.widget li:last-child { border-bottom: 0; }
.widget a { text-decoration: none; color: var(--hin-ink-soft); }
.widget a:hover { color: var(--hin-accent); }

/* --------------------------------------------------------------- footer */

.site-footer {
	background: var(--hin-ink);
	color: #aeb6c6;
	padding: var(--sp-6) 0 var(--sp-5);
	font-size: .91rem;
}
.site-footer h2 {
	font-family: var(--hin-mono);
	font-size: var(--fs-micro);
	letter-spacing: .13em;
	text-transform: uppercase;
	color: #7d859a;
	margin: 0 0 var(--sp-2);
}
.site-footer a { color: #dfe4ee; text-decoration: none; }
.site-footer a:hover { color: #fff; text-decoration: underline; }
.site-footer ul { list-style: none; margin: 0; padding: 0; }
.site-footer li { padding: .24rem 0; }
.footer-grid {
	display: grid;
	grid-template-columns: 1.5fr 1fr 1fr 1fr;
	gap: var(--sp-5);
	padding-bottom: var(--sp-5);
	border-bottom: 1px solid #2a3040;
}
.footer-about .brand { color: #fff; margin-bottom: var(--sp-2); }
.footer-about .brand__mark { background: #fff; }
.footer-about .brand__mark::after { color: var(--hin-accent); }
.footer-about p { color: #8d95a8; font-size: .87rem; max-width: 42ch; }
.footer-disclosure {
	font-family: var(--hin-mono);
	font-size: .71rem;
	line-height: 1.65;
	color: #7d859a;
	max-width: 82ch;
	padding: var(--sp-4) 0 0;
	margin: 0;
}
.footer-bottom {
	display: flex;
	flex-wrap: wrap;
	gap: var(--sp-3);
	justify-content: space-between;
	align-items: center;
	padding-top: var(--sp-3);
	margin-top: var(--sp-3);
	border-top: 1px solid #2a3040;
	font-family: var(--hin-mono);
	font-size: .72rem;
	color: #7d859a;
}

@media (max-width: 860px) { .footer-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .footer-grid { grid-template-columns: 1fr; } }

/* --------------------------------------------- accessibility plumbing */

/* These belong to the plugin's markup. Because this theme does not load
   the plugin stylesheet they have to live here — dropping .gce-hp in
   particular puts a visible honeypot field in every signup form. */
.gce-hp {
	position: absolute !important;
	left: -9999px !important;
	width: 1px;
	height: 1px;
	opacity: 0;
}

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

.gce-newsletter__msg.is-ok { color: #a9d4c4; }
.gce-newsletter__msg.is-error { color: #f0b3a0; }
.gce-vote.is-busy { opacity: .55; pointer-events: none; }

/* ------------------------------------------------------------ utilities */

.hin-stack > * + * { margin-top: var(--sp-3); }
.hin-mt { margin-top: var(--sp-6); }

/* ---------------------------------------------------------------- print

   Merchant pages get printed and screenshotted more than anything else
   here, usually to carry a code to another machine. Strip the furniture,
   keep the terms visible, and drop the parts that cannot be acted on
   from paper. */

@media print {
	.hin-topbar,
	.site-header,
	.gce-disclosure-bar,
	.site-footer,
	.merchant__rail,
	.gce-newsletter,
	.gce-vote,
	.pagination,
	.hin-retired,
	.crumbs { display: none !important; }

	body { background: #fff; font-size: 11pt; }
	.merchant { display: block; }
	.hin-offers, .hin-table, .hin-board, .hin-verdict { border-color: #999; }
	.gce-coupon { break-inside: avoid; border-bottom: 1px solid #ccc; }
	.gce-coupon__terms p { display: block; }
	.gce-btn { border: 1px solid #333; color: #000; background: none; }
	.gce-btn__peek { border: 0; background: none; }
}