/* ==========================================================================
   OffGridMag — Main Stylesheet
   Rustic-modern, 2026 clean. Earthy palette + confident typography.
   ========================================================================== */

/* ---------- Reset & base ------------------------------------------------- */
*,*::before,*::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
	margin: 0;
	background: var(--omg-cream, #F4ECDC);
	color: var(--omg-ink, #1A1714);
	font-family: 'Inter', system-ui, -apple-system, sans-serif;
	font-size: 17px;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
}

img, svg { max-width: 100%; height: auto; display: block; }
button { font: inherit; cursor: pointer; }
a { color: var(--omg-rust, #B85A2B); text-decoration: none; }
a:hover { text-decoration: underline; }

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

.skip-link {
	position: absolute; top: -40px; left: 8px;
	background: var(--omg-ink); color: var(--omg-cream);
	padding: 8px 12px; z-index: 1000;
}
.skip-link:focus { top: 8px; }

/* ---------- Layout helpers ---------------------------------------------- */
.omg-container { max-width: 1240px; margin: 0 auto; padding: 0 24px; }
.omg-container--narrow { max-width: 760px; }

.omg-section-h {
	font-family: 'Bebas Neue', sans-serif;
	font-size: clamp(2rem, 5vw, 3.5rem);
	letter-spacing: 0.02em;
	margin: 0 0 .5rem;
	line-height: 1;
	color: var(--omg-ink);
}
.omg-section-dek {
	font-family: 'Lora', serif;
	font-size: 1.125rem;
	color: var(--omg-smoke);
	max-width: 60ch;
	margin: 0 0 2rem;
}
.omg-section-eyebrow {
	font-family: 'Inter', sans-serif;
	font-size: .75rem;
	font-weight: 600;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--omg-rust);
	margin: 0 0 .75rem;
}

/* ---------- Header ------------------------------------------------------- */
.omg-site-header {
	background: var(--omg-cream);
	border-bottom: 1px solid rgba(26,23,20,.08);
	position: sticky; top: 0; z-index: 50;
	backdrop-filter: blur(10px);
	background: rgba(244,236,220,.92);
}
.omg-site-header__inner {
	display: flex; align-items: center; justify-content: space-between;
	padding: 14px 24px;
}
.omg-site-header__brand img,
.omg-site-header__brand .custom-logo-link img { max-height: 44px; width: auto; }
.omg-wordmark { display: flex; flex-direction: column; line-height: 1; text-decoration: none; color: var(--omg-ink); }
.omg-wordmark__top { font-family: 'Bebas Neue', sans-serif; font-size: 1.6rem; letter-spacing: 0.04em; }
.omg-wordmark__bot { font-family: 'Inter', sans-serif; font-size: .65rem; letter-spacing: 0.15em; color: var(--omg-rust); margin-top: 2px; }
.omg-wordmark__bot em { font-style: italic; color: var(--omg-smoke); }

.omg-nav {
	list-style: none; display: flex; gap: 1.75rem; margin: 0; padding: 0;
	font-size: .92rem; font-weight: 500;
}
.omg-nav a { color: var(--omg-ink); text-decoration: none; }
.omg-nav a:hover { color: var(--omg-rust); }
.omg-nav__login {
	border: 1px solid rgba(26,23,20,.2);
	padding: 6px 14px; border-radius: 999px;
}
.omg-nav__login:hover { background: var(--omg-ink); color: var(--omg-cream); border-color: var(--omg-ink); }

@media (max-width: 720px) {
	.omg-nav { display: none; }
}

/* ---------- Hero --------------------------------------------------------- */
.omg-hero {
	background-size: cover;
	background-position: center;
	color: var(--omg-cream);
	padding: clamp(80px, 14vw, 180px) 0 clamp(80px, 14vw, 160px);
	border-bottom: 8px solid var(--omg-rust);
}
.omg-hero__inner { max-width: 980px; }
.omg-hero__eyebrow {
	font-size: .8rem; font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase;
	color: var(--omg-rust);
	margin: 0 0 1rem;
}
.omg-hero__h1 {
	font-family: 'Bebas Neue', sans-serif;
	font-size: clamp(3.5rem, 11vw, 8.5rem);
	letter-spacing: 0.01em;
	line-height: .92;
	margin: 0 0 1.25rem;
	color: var(--omg-cream);
	text-shadow: 0 2px 30px rgba(0,0,0,.4);
}
.omg-hero__h1 span { display: block; }
.omg-hero__dek {
	font-family: 'Lora', serif;
	font-size: clamp(1.125rem, 2.4vw, 1.45rem);
	max-width: 38ch;
	margin: 0 0 2.25rem;
	color: rgba(244,236,220,.92);
	line-height: 1.4;
}
.omg-hero__ctas { display: flex; align-items: center; gap: 1.5rem; flex-wrap: wrap; }

/* ---------- Buttons ------------------------------------------------------ */
.omg-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
	font-family: 'Inter', sans-serif; font-weight: 600;
	font-size: .95rem; letter-spacing: 0.01em;
	padding: 14px 22px;
	border-radius: 4px; border: 1.5px solid transparent;
	background: transparent; color: inherit;
	text-decoration: none;
	transition: transform .15s, background .15s, color .15s, border-color .15s;
	cursor: pointer; line-height: 1.2;
}
.omg-btn:hover { text-decoration: none; transform: translateY(-1px); }
.omg-btn--primary { background: var(--omg-rust); color: #fff; }
.omg-btn--primary:hover { background: #9d4a23; color: #fff; }
.omg-btn--secondary { background: var(--omg-ink); color: var(--omg-cream); }
.omg-btn--secondary:hover { background: #2a221c; color: var(--omg-cream); }
.omg-btn--ghost { background: transparent; color: var(--omg-ink); border-color: rgba(26,23,20,.25); }
.omg-btn--ghost:hover { background: var(--omg-ink); color: var(--omg-cream); border-color: var(--omg-ink); }
.omg-btn--full { width: 100%; }
.omg-btn--sm { padding: 8px 14px; font-size: .85rem; }
.omg-btn--lg { padding: 18px 32px; font-size: 1.05rem; }
.omg-btn--xl { padding: 22px 44px; font-size: 1.2rem; }
.omg-btn__strike { font-size: .8em; opacity: .8; text-decoration: line-through; margin-left: .5rem; font-weight: 400; }
.omg-link--ghost {
	color: var(--omg-cream); text-decoration: underline; opacity: .85;
	font-size: 1rem;
}
.omg-link--ghost:hover { opacity: 1; color: var(--omg-cream); }

/* ---------- Pricing strip ------------------------------------------------ */
.omg-pricing { background: var(--omg-bone); padding: 72px 0; border-bottom: 1px solid rgba(26,23,20,.06); }
.omg-pricing .omg-section-h, .omg-pricing .omg-section-dek { text-align: center; }
.omg-pricing .omg-section-dek { margin-left: auto; margin-right: auto; }
.omg-pricing__cards {
	display: grid; grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem; margin-top: 2.5rem;
}
@media (max-width: 860px) { .omg-pricing__cards { grid-template-columns: 1fr; } }

.omg-card {
	background: var(--omg-cream);
	border: 1px solid rgba(26,23,20,.08);
	border-radius: 6px;
	padding: 32px 28px 28px;
	display: flex; flex-direction: column;
	position: relative;
}
.omg-card--featured {
	background: var(--omg-ink); color: var(--omg-cream);
	border: 2px solid var(--omg-rust);
	transform: scale(1.02);
	box-shadow: 0 16px 40px rgba(26,23,20,.18);
}
.omg-card__badge {
	position: absolute; top: -12px; left: 50%; transform: translateX(-50%);
	background: var(--omg-rust); color: #fff;
	font-size: .7rem; font-weight: 700; letter-spacing: 0.18em;
	padding: 5px 12px; border-radius: 3px;
}
.omg-card__title { font-family: 'Bebas Neue', sans-serif; font-size: 1.6rem; letter-spacing: 0.04em; margin: 0 0 .25rem; }
.omg-card__price { font-family: 'Bebas Neue', sans-serif; font-size: 3rem; line-height: 1; margin: .5rem 0 1rem; }
.omg-card__strike { font-size: 1.25rem; color: var(--omg-smoke); text-decoration: line-through; margin-left: .75rem; vertical-align: super; }
.omg-card--featured .omg-card__strike { color: rgba(244,236,220,.5); }
.omg-card__list { list-style: none; padding: 0; margin: 0 0 1.5rem; flex: 1; }
.omg-card__list li {
	padding: 8px 0; border-top: 1px solid rgba(26,23,20,.08);
	font-size: .95rem;
}
.omg-card__list li:first-child { border-top: 0; }
.omg-card--featured .omg-card__list li { border-color: rgba(244,236,220,.12); }
.omg-card__note { font-size: .8rem; color: var(--omg-smoke); margin: .75rem 0 0; text-align: center; }
.omg-card--featured .omg-card__note { color: rgba(244,236,220,.7); }

/* ---------- Issues section ---------------------------------------------- */
.omg-issues { padding: 96px 0 80px; }
.omg-issues__head {
	display: flex; align-items: flex-end; justify-content: space-between;
	gap: 1.5rem; margin-bottom: 2.5rem; flex-wrap: wrap;
}
.omg-issues__head h2 { margin-bottom: .25rem; }
.omg-issues__head .omg-section-dek { margin-bottom: 0; }

.omg-issues__view-toggle {
	display: inline-flex; gap: 4px;
	background: var(--omg-bone);
	border: 1px solid rgba(26,23,20,.08);
	padding: 4px; border-radius: 6px;
}
.omg-toggle {
	display: inline-flex; align-items: center; gap: .5rem;
	background: transparent; border: 0;
	padding: 8px 14px; border-radius: 4px;
	font-size: .85rem; font-weight: 600;
	color: var(--omg-smoke); cursor: pointer;
}
.omg-toggle svg { fill: currentColor; opacity: .7; }
.omg-toggle.is-active { background: var(--omg-ink); color: var(--omg-cream); }
.omg-toggle.is-active svg { opacity: 1; }

/* Visibility toggling between grid and list */
.omg-issues__wrap[data-view="grid"] .omg-list { display: none; }
.omg-issues__wrap[data-view="list"] .omg-grid { display: none; }

/* GRID view */
.omg-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 56px 36px;
}
@media (max-width: 1000px) { .omg-grid { grid-template-columns: repeat(2, 1fr); gap: 40px 24px; } }
@media (max-width: 600px)  { .omg-grid { grid-template-columns: 1fr; } }

.omg-tile { display: flex; flex-direction: column; }
.omg-tile--grid .omg-tile__media {
	width: 100%;
	aspect-ratio: 3 / 4;
	background: var(--omg-bone);
	border: 1px solid rgba(26,23,20,.08);
	border-radius: 4px;
	overflow: hidden; position: relative;
	padding: 0;
	cursor: pointer;
	transition: transform .25s ease, box-shadow .25s ease;
}
.omg-tile--grid .omg-tile__media img {
	width: 100%; height: 100%; object-fit: cover;
	transition: transform .35s ease;
}
.omg-tile--grid .omg-tile__media:hover { transform: translateY(-4px); box-shadow: 0 18px 40px rgba(26,23,20,.18); }
.omg-tile--grid .omg-tile__media:hover img { transform: scale(1.04); }

.omg-tile__hover {
	position: absolute; left: 12px; bottom: 12px;
	background: rgba(26,23,20,.85); color: var(--omg-cream);
	font-size: .7rem; font-weight: 600; letter-spacing: 0.15em; text-transform: uppercase;
	padding: 6px 12px; border-radius: 3px;
	opacity: 0; transform: translateY(4px);
	transition: opacity .2s, transform .2s;
}
.omg-tile--grid .omg-tile__media:hover .omg-tile__hover { opacity: 1; transform: translateY(0); }

.omg-tile__media-fallback {
	display: flex; align-items: center; justify-content: center;
	width: 100%; height: 100%;
	font-family: 'Bebas Neue', sans-serif; font-size: 2rem; color: var(--omg-smoke);
}

.omg-tile__body { padding: 16px 0 0; }
.omg-tile__date { font-size: .78rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--omg-rust); margin: 0 0 .35rem; }
.omg-tile__title { font-family: 'Lora', serif; font-size: 1.05rem; font-weight: 600; line-height: 1.3; margin: 0 0 .85rem; color: var(--omg-ink); }
.omg-tile__summary { font-size: .92rem; color: var(--omg-smoke); margin: 0 0 1rem; line-height: 1.5; }
.omg-tile__actions { display: flex; flex-wrap: wrap; gap: 6px; }
.omg-tile__actions .omg-btn { flex: 1 1 auto; min-width: 0; }

/* LIST view */
.omg-list { display: flex; flex-direction: column; gap: 1px; background: rgba(26,23,20,.08); border-radius: 6px; overflow: hidden; }
.omg-tile--list {
	display: grid;
	grid-template-columns: 100px 1fr auto;
	gap: 24px; align-items: center;
	background: var(--omg-cream);
	padding: 18px 20px;
}
@media (max-width: 760px) { .omg-tile--list { grid-template-columns: 80px 1fr; } .omg-tile--list .omg-tile__actions { grid-column: 1 / -1; margin-top: 8px; } }

.omg-tile--list .omg-tile__media {
	width: 100px; aspect-ratio: 3 / 4;
	background: var(--omg-bone); border: 0;
	overflow: hidden; border-radius: 3px;
	padding: 0;
}
@media (max-width: 760px) { .omg-tile--list .omg-tile__media { width: 80px; } }
.omg-tile--list .omg-tile__media img { width: 100%; height: 100%; object-fit: cover; }
.omg-tile--list .omg-tile__hover { display: none; }
.omg-tile--list .omg-tile__body { padding: 0; }
.omg-tile--list .omg-tile__title { font-size: 1.05rem; margin-bottom: .25rem; }
.omg-tile--list .omg-tile__actions { margin-top: 0; }

/* ---------- About strip -------------------------------------------------- */
.omg-about { background: var(--omg-moss); color: var(--omg-cream); padding: 96px 0; }
.omg-about .omg-section-h, .omg-about .omg-section-eyebrow { color: var(--omg-cream); }
.omg-about .omg-section-eyebrow { color: rgba(244,236,220,.7); }
.omg-about__inner { display: grid; grid-template-columns: 1.4fr 1fr; gap: 80px; align-items: center; }
@media (max-width: 900px) { .omg-about__inner { grid-template-columns: 1fr; gap: 40px; } }
.omg-about__body p {
	font-family: 'Lora', serif; font-size: 1.15rem; line-height: 1.6; color: rgba(244,236,220,.92);
	margin: 0 0 1rem;
}
.omg-about__stats { display: grid; grid-template-columns: repeat(2,1fr); gap: 16px; }
.omg-stat { padding: 24px; background: rgba(244,236,220,.06); border: 1px solid rgba(244,236,220,.1); border-radius: 4px; text-align: center; }
.omg-stat__num { display: block; font-family: 'Bebas Neue', sans-serif; font-size: 3rem; line-height: 1; color: var(--omg-rust); }
.omg-stat__lbl { display: block; font-size: .8rem; letter-spacing: 0.12em; text-transform: uppercase; color: rgba(244,236,220,.7); margin-top: .25rem; }
/* Hero stat — spans both columns, larger number, slightly stronger background */
.omg-stat--hero { grid-column: 1 / -1; background: rgba(184,90,43,.14); border-color: rgba(184,90,43,.35); padding: 28px 24px; }
.omg-stat--hero .omg-stat__num { font-size: 4.5rem; letter-spacing: -.01em; }
.omg-stat--hero .omg-stat__lbl { color: rgba(244,236,220,.85); font-size: .85rem; }

/* ---------- Testimonials ------------------------------------------------- */
.omg-testimonials { padding: 96px 0; }
.omg-testimonials__grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 40px; margin-top: 2rem; }
@media (max-width: 760px) { .omg-testimonials__grid { grid-template-columns: 1fr; gap: 24px; } }
.omg-quote {
	background: var(--omg-bone); padding: 28px;
	border-left: 3px solid var(--omg-rust);
	margin: 0;
}
.omg-quote__body { margin: 0; }
.omg-quote__body p { font-family: 'Lora', serif; font-size: 1.15rem; line-height: 1.5; margin: 0; font-style: italic; color: var(--omg-ink); }
.omg-quote__by { margin-top: 12px; font-size: .85rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--omg-smoke); }

/* ---------- FAQ ---------------------------------------------------------- */
.omg-faq { padding: 80px 0; background: var(--omg-bone); }
.omg-faq__list { display: flex; flex-direction: column; gap: 4px; margin-top: 2rem; }
.omg-faq__item {
	background: var(--omg-cream);
	border: 1px solid rgba(26,23,20,.08); border-radius: 4px;
	padding: 18px 22px;
}
.omg-faq__item summary {
	cursor: pointer; font-weight: 600; font-size: 1.05rem;
	list-style: none; display: flex; justify-content: space-between; align-items: center;
}
.omg-faq__item summary::after { content: '+'; font-size: 1.3rem; color: var(--omg-rust); }
.omg-faq__item[open] summary::after { content: '−'; }
.omg-faq__a { margin-top: 12px; color: var(--omg-smoke); line-height: 1.6; }

/* ---------- Email capture ------------------------------------------------ */
.omg-capture { padding: 96px 0; }
.omg-capture__inner {
	background: var(--omg-ink); color: var(--omg-cream);
	padding: 56px 48px; border-radius: 6px;
	text-align: center;
}
@media (max-width: 600px) { .omg-capture__inner { padding: 40px 24px; } }
.omg-capture__inner .omg-section-eyebrow { color: var(--omg-rust); }
.omg-capture__h { font-family: 'Bebas Neue', sans-serif; font-size: clamp(2rem,5vw,3rem); letter-spacing: 0.02em; margin: 0 0 .75rem; line-height: 1; }
.omg-capture__dek { font-family: 'Lora', serif; font-size: 1.1rem; color: rgba(244,236,220,.85); max-width: 50ch; margin: 0 auto 2rem; }
.omg-capture__form {
	display: flex; gap: 10px; max-width: 480px; margin: 0 auto;
	flex-wrap: wrap;
}
.omg-capture__form input[type="email"] {
	flex: 1 1 240px; min-width: 240px;
	padding: 14px 18px; font-size: 1rem; font-family: inherit;
	background: var(--omg-cream); color: var(--omg-ink);
	border: 0; border-radius: 4px;
}
.omg-capture__form > .omg-btn { flex: 0 0 auto; }

/* Stack vertically on phones — button always wraps under the field, full-width */
@media (max-width: 540px) {
	.omg-capture__form { flex-direction: column; }
	.omg-capture__form input[type="email"],
	.omg-capture__form > .omg-btn { width: 100%; flex-basis: auto; }
}
.omg-capture__msg { width: 100%; margin: 8px 0 0; font-size: .9rem; min-height: 1.2em; }
.omg-capture__msg.is-success { color: #8FBF8E; }
.omg-capture__msg.is-error { color: #E8A484; }

.omg-capture__success {
	width: 100%;
	display: flex; flex-direction: column; align-items: center;
	gap: 14px; padding: 20px 8px;
	color: var(--omg-cream);
}
.omg-capture__check { color: #8FBF8E; margin-bottom: 4px; }
.omg-capture__success-h {
	margin: 0; font-family: 'Bebas Neue', sans-serif;
	font-size: clamp(1.5rem, 3vw, 2rem); letter-spacing: .03em; line-height: 1;
}
.omg-capture__success-dek {
	margin: 0; font-family: 'Lora', serif; font-size: 1rem;
	color: rgba(244,236,220,.85); line-height: 1.4;
	max-width: 38ch; text-align: center;
}
.omg-capture__success .omg-btn { margin-top: 4px; }
.omg-capture__success-note {
	margin: 6px 0 0; font-size: .82rem; color: rgba(244,236,220,.6);
	line-height: 1.4; max-width: 42ch; text-align: center;
}
.omg-capture__success-note em { font-style: italic; color: rgba(244,236,220,.85); }

.omg-capture__optin {
	width: 100%; margin-top: 14px;
	display: flex; align-items: flex-start; gap: 10px;
	font-size: .82rem; color: rgba(244,236,220,.78);
	line-height: 1.45; text-align: left;
	cursor: pointer;
}
.omg-capture__optin input[type="checkbox"] {
	width: 18px; height: 18px; margin: 1px 0 0; flex-shrink: 0;
	accent-color: var(--omg-rust);
	cursor: pointer;
}
.omg-capture__optin em { font-style: italic; color: rgba(244,236,220,.95); }

/* ---------- Final CTA ---------------------------------------------------- */
.omg-final { padding: 96px 0; background: var(--omg-cream); border-top: 1px solid rgba(26,23,20,.08); }
.omg-final__h { font-family: 'Bebas Neue', sans-serif; font-size: clamp(2.5rem,6vw,4.5rem); letter-spacing: 0.02em; line-height: 1; margin: 0 0 1rem; }
.omg-final__dek { font-family: 'Lora', serif; font-size: 1.2rem; color: var(--omg-smoke); margin: 0 0 2rem; }
.omg-final__note { font-size: .9rem; color: var(--omg-smoke); margin-top: 1.25rem; }

/* ---------- Thanks banner (post-purchase landing) ------------------------ */
.omg-thanks-banner {
	background: linear-gradient(180deg, var(--omg-moss) 0%, color-mix(in oklab, var(--omg-moss) 92%, black) 100%);
	color: var(--omg-cream); padding: 28px 0;
	border-bottom: 4px solid var(--omg-rust);
}
.omg-thanks-banner__inner {
	display: grid; grid-template-columns: auto 1fr auto; gap: 20px; align-items: center;
}
@media (max-width: 720px) {
	.omg-thanks-banner__inner { grid-template-columns: 1fr; text-align: center; }
}
.omg-thanks-banner__icon { color: #B5DCB1; }
.omg-thanks-banner__h {
	font-family: 'Bebas Neue', sans-serif; font-size: 1.6rem;
	letter-spacing: 0.03em; line-height: 1; margin: 0;
}
.omg-thanks-banner__sub {
	margin: 4px 0 0; font-size: .92rem;
	color: rgba(244,236,220,.85); line-height: 1.4;
}
.omg-thanks-banner .omg-btn {
	background: var(--omg-cream); color: var(--omg-ink); border-color: var(--omg-cream);
}
.omg-thanks-banner .omg-btn:hover { background: #fff; color: var(--omg-ink); border-color: #fff; }

/* ---------- Member bar --------------------------------------------------- */
.omg-member-bar { background: var(--omg-moss); color: var(--omg-cream); padding: 32px 0; }
.omg-member-bar__inner { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; flex-wrap: wrap; }
.omg-member-bar__hi { font-family: 'Bebas Neue',sans-serif; font-size: 1.6rem; letter-spacing: 0.02em; margin: 0; }
.omg-member-bar__tier { font-size: .85rem; letter-spacing: 0.15em; text-transform: uppercase; color: rgba(244,236,220,.7); margin: 0; }
.omg-member-bar--bottom { background: var(--omg-ink); }

/* ---------- Footer ------------------------------------------------------- */
.omg-site-footer { background: var(--omg-ink); color: rgba(244,236,220,.7); padding: 56px 0 40px; margin-top: 0; }
.omg-site-footer__inner {
	display: grid; grid-template-columns: 1fr auto 1fr; gap: 24px; align-items: center;
}
@media (max-width: 760px) { .omg-site-footer__inner { grid-template-columns: 1fr; text-align: center; } }
.omg-site-footer__brand strong { display: block; font-family: 'Bebas Neue',sans-serif; font-size: 1.4rem; letter-spacing: 0.02em; color: var(--omg-cream); }
.omg-site-footer__brand span { font-size: .85rem; }
.omg-foot-nav { list-style: none; display: flex; gap: 24px; padding: 0; margin: 0; font-size: .85rem; flex-wrap: wrap; justify-content: center; }
.omg-foot-nav a { color: rgba(244,236,220,.7); }
.omg-foot-nav a:hover { color: var(--omg-cream); }
.omg-site-footer__copy { text-align: right; font-size: .8rem; }
@media (max-width: 760px) { .omg-site-footer__copy { text-align: center; } }

/* ---------- Modal -------------------------------------------------------- */
.omg-modal { position: fixed; inset: 0; z-index: 200; display: none; }
.omg-modal[aria-hidden="false"], .omg-modal:not([hidden]) { display: block; }
.omg-modal__backdrop { position: absolute; inset: 0; background: rgba(26,23,20,.86); backdrop-filter: blur(4px); }
.omg-modal__panel {
	position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);
	background: var(--omg-cream);
	width: min(1080px, 94vw); max-height: 92vh; overflow: hidden;
	border-radius: 6px; box-shadow: 0 30px 80px rgba(0,0,0,.5);
	display: flex; flex-direction: column;
}
.omg-modal__close {
	position: absolute; top: 14px; right: 14px; z-index: 2;
	background: rgba(26,23,20,.85); color: var(--omg-cream);
	border: 0; width: 38px; height: 38px; border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
}
.omg-modal__close:hover { background: var(--omg-rust); }

.omg-modal__body {
	display: grid; grid-template-columns: 320px 1fr;
	height: 100%; overflow: hidden;
}
@media (max-width: 800px) { .omg-modal__body { grid-template-columns: 1fr; max-height: 92vh; } }

.omg-modal__sidebar {
	padding: 32px 28px; background: var(--omg-bone);
	border-right: 1px solid rgba(26,23,20,.08);
	overflow-y: auto;
}
.omg-modal__date { font-size: .8rem; font-weight: 600; letter-spacing: 0.15em; text-transform: uppercase; color: var(--omg-rust); margin: 0 0 .5rem; }
.omg-modal__title { font-family: 'Bebas Neue', sans-serif; font-size: 1.8rem; letter-spacing: 0.02em; line-height: 1.05; margin: 0 0 .75rem; color: var(--omg-ink); }
.omg-modal__meta { font-size: .85rem; color: var(--omg-smoke); margin: 0 0 1.25rem; }
.omg-modal__summary { font-family: 'Lora', serif; font-size: 1rem; color: var(--omg-ink); margin: 0 0 1.75rem; line-height: 1.5; }
.omg-modal__cta { display: flex; flex-direction: column; gap: 8px; }
.omg-modal__note { font-size: .78rem; color: var(--omg-smoke); margin: .5rem 0 0; text-align: center; }

.omg-modal__pages {
	background: var(--omg-ink);
	overflow-y: auto; padding: 24px;
	display: flex; flex-direction: column; gap: 12px;
}
.omg-modal__pages img {
	width: 100%; height: auto; border-radius: 3px;
	box-shadow: 0 8px 24px rgba(0,0,0,.4);
}

/* ---------- Empty / 404 / page ------------------------------------------ */
.omg-empty { padding: 60px; text-align: center; background: var(--omg-bone); border-radius: 6px; color: var(--omg-smoke); }
.omg-section--page { padding: 80px 0; }
.omg-page__title { font-family: 'Bebas Neue', sans-serif; font-size: clamp(2.5rem,5vw,4rem); letter-spacing: 0.02em; margin: 0 0 1.5rem; }
.omg-page__content { font-family: 'Lora', serif; font-size: 1.1rem; line-height: 1.6; }
.omg-page__content h2 { font-family: 'Bebas Neue', sans-serif; letter-spacing: 0.02em; margin-top: 2.5rem; }

/* ---------- Featured section (between pricing strip & library) -------- */
/* Pale, very subtle mint-green wash so the section stands out from the
   surrounding cream without shouting. Three distinct soft column-header
   colors (sage / honey / leaf) give each slot its own personality without
   straying from the earthy palette. */
.omg-featured {
	padding: 64px 0 56px;
	background: #EEF3E8; /* pale mint, ~5% green over off-white */
	border-top: 1px solid rgba(122, 158, 110, .22);
	border-bottom: 1px solid rgba(122, 158, 110, .22);
	position: relative;
}
.omg-featured__head { text-align: center; margin-bottom: 36px; }
.omg-featured__head .omg-section-h { margin: 0 0 6px; }
.omg-featured__head .omg-section-dek { margin: 0 auto; max-width: 540px; }

.omg-featured__grid {
	display: grid;
	gap: 28px;
	align-items: stretch;
}
.omg-featured__grid--cols-1 { grid-template-columns: minmax(260px, 420px); justify-content: center; }
.omg-featured__grid--cols-2 { grid-template-columns: repeat(2, minmax(260px, 1fr)); max-width: 820px; margin: 0 auto; }
.omg-featured__grid--cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 860px) {
	.omg-featured__grid--cols-2,
	.omg-featured__grid--cols-3 { grid-template-columns: 1fr; max-width: 420px; margin: 0 auto; }
}

.omg-featured__col {
	display: flex;
	flex-direction: column;
	gap: 14px;
}
.omg-featured__label {
	display: flex; flex-direction: column; align-items: flex-start;
	padding: 12px 16px;
	border-radius: 4px 4px 0 0;
	box-shadow: 0 2px 0 rgba(0,0,0,.04);
	color: #fff;
}
.omg-featured__label-text {
	font-family: 'Bebas Neue', sans-serif;
	font-size: 1.2rem;
	letter-spacing: 0.09em;
	line-height: 1;
}
.omg-featured__label-tag {
	font-family: 'Inter', sans-serif;
	font-size: .72rem;
	letter-spacing: 0.04em;
	opacity: .9;
	margin-top: 4px;
	font-weight: 500;
}

/* Three distinct, relaxed earth-tone header colors:
     • NEW         — soft teal-sage  (#7FA89C) — fresh, calm
     • FEATURED    — warm honey-tan  (#C29A5C) — premium, inviting
     • FREE SAMPLE — muted leaf      (#8FAA66) — generous, gift-like
*/
.omg-featured__col--new         .omg-featured__label { background: #7FA89C; }
.omg-featured__col--featured    .omg-featured__label { background: #C29A5C; }
.omg-featured__col--free_sample .omg-featured__label { background: #8FAA66; }

/* Make the tile inside a featured column visually pop a bit more. */
.omg-featured__col .omg-tile { box-shadow: 0 4px 18px rgba(26,23,20,.10); }

/* ---------- Compact free-sample form inside the FREE SAMPLE tile ----- */
.omg-fs-tile__form {
	display: flex;
	flex-direction: column;
	gap: 10px;
	width: 100%;
}
.omg-fs-tile__form input[type="email"] {
	width: 100%;
	padding: 10px 12px;
	font: inherit;
	font-size: .95rem;
	border: 1px solid rgba(26,23,20,.18);
	border-radius: 4px;
	background: #fff;
	color: var(--omg-ink);
}
.omg-fs-tile__form input[type="email"]:focus {
	outline: none;
	border-color: #8FAA66;
	box-shadow: 0 0 0 3px rgba(143,170,102,.22);
}
.omg-fs-tile__optin {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	font-size: .78rem;
	line-height: 1.4;
	color: var(--omg-smoke);
}
.omg-fs-tile__optin input[type="checkbox"] {
	margin-top: 2px;
	flex-shrink: 0;
	accent-color: #8FAA66;
}
.omg-fs-tile__optin em { font-style: italic; }
.omg-fs-tile__msg {
	min-height: 1.2em;
	margin: 0;
	font-size: .82rem;
	color: var(--omg-smoke);
}
.omg-fs-tile__msg.is-error { color: #c12c1f; }
.omg-fs-tile__success {
	text-align: center;
	padding: 16px 8px 8px;
}
.omg-fs-tile__success-h {
	font-family: 'Bebas Neue', sans-serif;
	font-size: 1.1rem;
	letter-spacing: 0.06em;
	margin: 8px 0 12px;
	color: var(--omg-ink);
}
.omg-fs-tile__success-note {
	font-size: .78rem;
	color: var(--omg-smoke);
	margin: 10px 0 0;
}

/* The actions wrapper inside an issue tile is row-flex by default; the
   email form needs to take the full width and stack vertically. */
.omg-tile .omg-tile__actions:has(.omg-fs-tile__form) {
	flex-direction: column;
	align-items: stretch;
	gap: 0;
}

/* ---------- Reduce motion ---------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: 0s !important; transition-duration: 0s !important; }
	html { scroll-behavior: auto; }
}
