/* ==========================================================================
   Golden Retire Memo — main.css
   Design: warm cream (#e6e3dc) light mode, near-black (#0f0f10) dark sections,
           Inter (body) + Fraunces (headings/display).
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. DESIGN TOKENS
   -------------------------------------------------------------------------- */
:root {
	/* Colours */
	--grm-cream:       #e6e3dc;
	--grm-cream-dark:  #d9d5cc;
	--grm-dark:        #0f0f10;
	--grm-dark-2:      #1a1a1c;
	--grm-muted-l:     #8c8a85;
	--grm-muted-d:     rgba(255, 255, 255, 0.65);
	--grm-border-l:    rgba(15, 15, 16, 0.08);
	--grm-border-d:    rgba(255, 255, 255, 0.1);
	--grm-up:          #2d9e5c;
	--grm-down:        #c7372f;

	/* Typography */
	--grm-font-body:    'Inter', sans-serif;
	--grm-font-display: 'Fraunces', Georgia, serif;

	/* Layout */
	--grm-max-w:   1280px;
	--grm-gutter:  24px;
	--grm-radius:  12px;

	/* Transitions */
	--grm-t: 0.18s ease;
}


/* --------------------------------------------------------------------------
   2. RESET & BASE
   -------------------------------------------------------------------------- */
*, *::before, *::after {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}

html { scroll-behavior: smooth; }

body {
	font-family: var(--grm-font-body);
	font-size: 15px;
	line-height: 1.65;
	color: var(--grm-dark);
	background-color: var(--grm-cream);
	-webkit-font-smoothing: antialiased;
}

img, svg { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
ul, ol { list-style: none; }
button { font-family: inherit; cursor: pointer; border: none; background: none; }
input, textarea { font: inherit; }

h1, h2, h3, h4 {
	font-family: var(--grm-font-display);
	font-weight: 400;
	line-height: 1.1;
}

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

/* Page wrapper */
.grm-page-wrap {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}

/* Inner container */
.grm-inner {
	max-width: var(--grm-max-w);
	margin-inline: auto;
	padding-inline: var(--grm-gutter);
	width: 100%;
}


/* --------------------------------------------------------------------------
   3. TICKER BAR
   -------------------------------------------------------------------------- */
.grm-ticker-bar {
	width: 100%;
	overflow: hidden;
	border-bottom: 1px solid var(--grm-border-l);
	background: var(--grm-cream);
}

.grm-ticker-track {
	display: flex;
	align-items: center;
	gap: 0;
	white-space: nowrap;
	animation: grm-ticker-scroll 40s linear infinite;
	width: max-content;
}

@keyframes grm-ticker-scroll {
	from { transform: translateX(0); }
	to   { transform: translateX(-25%); }
}

.grm-ticker-item {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 6px 20px;
	border-right: 1px solid var(--grm-border-l);
	font-size: 11px;
	font-family: var(--grm-font-body);
	color: var(--grm-dark);
}

.grm-ticker-name {
	font-weight: 500;
	color: var(--grm-muted-l);
	letter-spacing: 0.01em;
}

.grm-ticker-value {
	font-weight: 600;
}

.grm-ticker-up   { color: var(--grm-up); }
.grm-ticker-down { color: var(--grm-down); }


/* --------------------------------------------------------------------------
   4. SITE HEADER / NAV
   -------------------------------------------------------------------------- */
.grm-site-header {
	position: sticky;
	top: 0;
	z-index: 200;
	background: var(--grm-cream);
	border-bottom: 1px solid var(--grm-border-l);
}

.grm-nav {
	border-top: none;
}

.grm-nav-inner {
	max-width: var(--grm-max-w);
	margin-inline: auto;
	padding: 0 var(--grm-gutter);
	height: 56px;
	display: flex;
	align-items: center;
	gap: 32px;
}

/* Logo */
.grm-logo {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	flex-shrink: 0;
	color: var(--grm-dark);
	text-decoration: none;
}

.grm-logo-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	color: inherit;
	flex-shrink: 0;
}

.grm-logo-name {
	font-family: var(--grm-font-display);
	font-size: 18px;
	font-weight: 400;
	letter-spacing: -0.02em;
	line-height: 1;
}

.grm-logo--light {
	color: #fff;
}

.grm-logo-img {
	display: block;
	height: 40px;
	width: auto;
	max-width: 200px;
	object-fit: contain;
}

/* Nav links (desktop) */
.grm-nav-links {
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 32px;
	list-style: none;
}

.grm-nav-links li a {
	font-size: 14px;
	font-weight: 400;
	color: var(--grm-dark);
	transition: opacity var(--grm-t);
}

.grm-nav-links li a:hover { opacity: 0.6; }

/* Desktop dropdown */
.grm-nav-links li { position: relative; }

.grm-nav-links .menu-item-has-children > a::after {
	content: '';
	display: inline-block;
	width: 0;
	height: 0;
	border-left: 4px solid transparent;
	border-right: 4px solid transparent;
	border-top: 4px solid currentColor;
	margin-left: 5px;
	vertical-align: middle;
	opacity: 0.55;
	transition: opacity var(--grm-t);
}

.grm-nav-links .sub-menu {
	position: absolute;
	top: 100%; /* flush — no gap so cursor can reach the panel */
	left: 50%;
	transform: translateX(-50%);
	min-width: 190px;
	background: #fff;
	border: 1px solid var(--grm-border-l);
	border-radius: 10px;
	box-shadow: 0 8px 28px rgba(0, 0, 0, 0.10);
	padding: 8px 0 6px; /* top padding creates the visual gap instead */
	list-style: none;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity 0.18s ease, visibility 0.18s ease;
	z-index: 200;
}

.grm-nav-links li:hover > .sub-menu,
.grm-nav-links li:focus-within > .sub-menu {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
}

.grm-nav-links .sub-menu li a {
	display: block;
	padding: 9px 18px;
	font-size: 13px;
	white-space: nowrap;
	color: var(--grm-dark);
}

.grm-nav-links .sub-menu li a:hover {
	background: var(--grm-cream);
	opacity: 1;
}

/* Right actions */
.grm-nav-actions {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-shrink: 0;
}

.grm-nav-search-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 6px;
	color: var(--grm-dark);
	transition: background var(--grm-t);
}

.grm-nav-search-btn:hover {
	background: var(--grm-border-l);
}

.grm-nav-subscribe-btn {
	display: inline-flex;
	align-items: center;
	padding: 8px 18px;
	background: var(--grm-dark);
	color: #fff;
	font-size: 13px;
	font-weight: 500;
	border-radius: 8px;
	transition: opacity var(--grm-t);
}

.grm-nav-subscribe-btn:hover { opacity: 0.85; }

/* Search icon toggle */
.grm-nav-search-btn .icon-search { display: flex; }
.grm-nav-search-btn .icon-close  { display: none;  }
.grm-nav-search-btn[aria-expanded="true"] .icon-search { display: none; }
.grm-nav-search-btn[aria-expanded="true"] .icon-close  { display: flex; }

/* Hamburger — hidden on desktop */
.bl-menu-toggle {
	display: none;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	color: var(--grm-dark);
}


/* --------------------------------------------------------------------------
   5. MOBILE NAV
   -------------------------------------------------------------------------- */
.bl-mobile-nav-bg {
	display: none;
	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, 0.45);
	z-index: 299;
	opacity: 0;
	transition: opacity 0.25s ease;
}

.bl-mobile-nav-bg.is-open {
	display: block;
	opacity: 1;
}

.bl-mobile-nav {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	width: min(320px, 85vw);
	z-index: 300;
	background: #fff;
	display: flex;
	flex-direction: column;
	padding: 0 0 24px;
	transform: translateX(100%);
	transition: transform 0.3s ease;
	overflow-y: auto;
}

.bl-mobile-nav.is-open {
	transform: translateX(0);
}

.bl-mobile-nav-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 16px 20px;
	border-bottom: 1px solid var(--grm-border-l);
}

.bl-mobile-nav-head .grm-logo-name { color: var(--grm-dark); }
.bl-mobile-nav-head .grm-logo-icon { color: var(--grm-dark); }

.bl-mobile-nav-close {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	color: var(--grm-dark);
	border-radius: 6px;
	transition: background var(--grm-t);
}

.bl-mobile-nav-close:hover { background: var(--grm-border-l); }

.bl-mobile-nav-list {
	flex: 1;
	padding: 8px 0;
}

.bl-mobile-nav-list li a {
	display: block;
	padding: 12px 20px;
	font-size: 15px;
	color: var(--grm-dark);
	font-weight: 500;
	border-bottom: 1px solid var(--grm-border-l);
	transition: background var(--grm-t);
}

.bl-mobile-nav-list li a:hover { background: var(--grm-cream); }

/* Mobile dropdown sub-menu — indented, lightly tinted */
.bl-mobile-nav-list .sub-menu {
	list-style: none;
}

.bl-mobile-nav-list .sub-menu li a {
	padding-left: 36px;
	font-size: 14px;
	font-weight: 400;
	background: var(--grm-cream);
}

.bl-mobile-nav-list .sub-menu li a:hover { background: #d5d0c8; }

.bl-mobile-nav-subscribe {
	display: block;
	margin: 16px 20px 0;
	padding: 12px;
	background: var(--grm-dark);
	color: #fff;
	font-size: 14px;
	font-weight: 500;
	text-align: center;
	border-radius: 8px;
}

body.bl-menu-open { overflow: hidden; }


/* --------------------------------------------------------------------------
   6. HERO SECTION
   -------------------------------------------------------------------------- */
.grm-hero-section {
	padding-block: 12px 0;
}

.grm-hero-container {
	max-width: var(--grm-max-w);
	margin-inline: auto;
	padding-inline: var(--grm-gutter);
}

.grm-hero {
	position: relative;
	border-radius: var(--grm-radius);
	overflow: hidden;
}

.grm-hero-bg {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center top;
	background-color: var(--grm-dark);
}

.grm-hero-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(150deg,
		rgba(0,0,0,0.08) 0%,
		rgba(0,0,0,0.30) 40%,
		rgba(0,0,0,0.75) 100%
	);
}

.grm-hero-inner {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	gap: 16px;
	min-height: 560px;
	padding: 24px 16px 16px;
}

/* Main article card */
.grm-hero-card-row {
	display: flex;
	justify-content: flex-end;
}

.grm-hero-card {
	width: 100%;
	max-width: 420px;
	background: var(--grm-dark);
	border-radius: var(--grm-radius);
	padding: 20px;
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.grm-hero-badge {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-family: var(--grm-font-body);
	font-size: 12px;
	font-weight: 500;
	color: var(--grm-muted-d);
}

.grm-hero-badge-icon { flex-shrink: 0; }

.grm-hero-title {
	font-family: var(--grm-font-display);
	font-size: 36px;
	font-weight: 400;
	line-height: 1.15;
	letter-spacing: -0.02em;
	color: #fff;
}

.grm-hero-title a { color: inherit; }
.grm-hero-title a:hover { opacity: 0.85; }

.grm-hero-arrow {
	display: flex;
	align-items: center;
	justify-content: center;
	align-self: flex-end;
	width: 32px;
	height: 32px;
	background: var(--grm-dark-2);
	border: 1px solid var(--grm-border-d);
	border-radius: 6px;
	transition: background var(--grm-t);
}

.grm-hero-arrow:hover { background: #2a2a2e; }

/* Mini posts strip */
.grm-hero-mini-strip {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 8px;
	margin-top: auto;
}

.grm-hero-mini {
	background: var(--grm-dark);
	border: 1px solid var(--grm-border-d);
	border-radius: var(--grm-radius);
	overflow: hidden;
	display: flex;
	flex-direction: row;
	align-items: stretch;
}

.grm-hero-mini-img-wrap {
	flex: 0 0 110px;
	display: block;
	overflow: hidden;
}

.grm-hero-mini-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.grm-hero-mini-content {
	flex: 1;
	padding: 10px 12px;
	display: flex;
	flex-direction: column;
	gap: 6px;
	justify-content: center;
	min-width: 0;
}

.grm-hero-mini-badge {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: 11px;
	font-weight: 500;
	color: var(--grm-muted-d);
}

.grm-hero-mini-title {
	font-family: var(--grm-font-body);
	font-size: 13px;
	font-weight: 500;
	line-height: 1.35;
	color: #fff;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.grm-hero-mini-title a { color: inherit; }
.grm-hero-mini-title a:hover { opacity: 0.8; }


/* --------------------------------------------------------------------------
   7. SECTION COMMON
   -------------------------------------------------------------------------- */
.grm-section {
	padding-block: 80px;
}

.grm-section-inner {
	max-width: var(--grm-max-w);
	margin-inline: auto;
	padding-inline: var(--grm-gutter);
	display: flex;
	flex-direction: column;
	gap: 32px;
}

.grm-section-header {
	display: flex;
	align-items: center;
	gap: 8px;
}

.grm-section-label {
	font-family: var(--grm-font-body);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--grm-dark);
}

.grm-section-label-sub {
	font-family: var(--grm-font-body);
	font-size: 13px;
	font-weight: 400;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--grm-muted-l);
}


/* --------------------------------------------------------------------------
   8. TOP STORIES GRID
   -------------------------------------------------------------------------- */
.grm-section--stories { background: var(--grm-cream); }

.grm-stories-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
}

/* Story card */
.grm-story-card {
	background: var(--grm-dark);
	border-radius: var(--grm-radius);
	overflow: hidden;
	display: flex;
	flex-direction: column;
}

.grm-story-card-img-wrap {
	position: relative;
	display: block;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	flex-shrink: 0;
}

.grm-story-card-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.4s ease;
}

.grm-story-card:hover .grm-story-card-img {
	transform: scale(1.04);
}

.grm-story-card-img-placeholder {
	width: 100%;
	height: 100%;
	background: var(--grm-dark-2);
}

/* Category badge — now in card body above title */
.grm-story-badge {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: 11px;
	font-weight: 500;
	color: var(--grm-muted-d);
	padding: 0;
	border-radius: 0;
	background: none;
}

/* Arrow button inside image */
.grm-story-arrow {
	position: absolute;
	top: 10px;
	right: 10px;
	display: none;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	background: var(--grm-dark-2);
	border: 1px solid var(--grm-border-d);
	border-radius: 6px;
}

.grm-story-card:hover .grm-story-arrow {
	display: flex;
}

/* Card body (below image) */
.grm-story-card-body {
	padding: 14px 16px 16px;
	display: flex;
	flex-direction: column;
	gap: 8px;
	flex: 1;
}

.grm-story-card-title {
	font-family: var(--grm-font-body);
	font-size: 16px;
	font-weight: 500;
	line-height: 1.35;
	color: #fff;
}

.grm-story-card-title a { color: inherit; }
.grm-story-card-title a:hover { opacity: 0.8; }

.grm-story-card-meta {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 11px;
	font-weight: 500;
	color: var(--grm-muted-d);
}

.grm-story-card-meta time { color: var(--grm-muted-d); }

.grm-story-meta-divider {
	display: inline-block;
	width: 1px;
	height: 10px;
	background: var(--grm-border-d);
}

.grm-story-card-meta-icon { flex-shrink: 0; }


/* --------------------------------------------------------------------------
   9. MARKETS SECTION
   -------------------------------------------------------------------------- */
.grm-section--markets {
	background: transparent;
	padding-block: 0 80px;
}

.grm-section--markets .grm-section-inner {
	gap: 0;
	padding-inline: var(--grm-gutter);
}

/* Dark card wrapping heading + grid */
.grm-markets-card {
	background: var(--grm-dark);
	border-radius: var(--grm-radius);
	padding: 40px;
	display: flex;
	flex-direction: column;
	gap: 28px;
}

.grm-section--markets .grm-section-inner { gap: 0; }

.grm-markets-header {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 24px;
	flex-wrap: wrap;
}

.grm-markets-heading {
	font-family: var(--grm-font-display);
	font-size: 36px;
	font-weight: 400;
	letter-spacing: -0.03em;
	color: #fff;
	line-height: 1.1;
}

.grm-markets-heading em {
	font-style: italic;
}

.grm-markets-desc {
	font-family: var(--grm-font-body);
	font-size: 14px;
	color: var(--grm-muted-d);
	line-height: 1.6;
	max-width: 320px;
}

.grm-markets-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 8px;
}

/* Individual market card */
.grm-market-card {
	background: var(--grm-dark-2);
	border: 1px solid var(--grm-border-d);
	border-radius: var(--grm-radius);
	padding: 16px;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.grm-market-name {
	font-family: var(--grm-font-body);
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.03em;
	color: var(--grm-muted-d);
	text-transform: uppercase;
}

.grm-market-value {
	font-family: var(--grm-font-display);
	font-size: 26px;
	font-weight: 400;
	letter-spacing: -0.02em;
	color: #fff;
	line-height: 1;
}

.grm-market-chart {
	height: 36px;
	width: 100%;
	opacity: 0.85;
}

.grm-market-change {
	display: flex;
	align-items: center;
	gap: 5px;
	font-family: var(--grm-font-body);
	font-size: 12px;
	font-weight: 500;
}

.grm-market-arrow {
	font-size: 9px;
	line-height: 1;
}

.grm-market-up  { color: var(--grm-up); }
.grm-market-down { color: var(--grm-down); }


/* --------------------------------------------------------------------------
   10. SUBSCRIBE SECTION (mid-page, dark, with photo column)
   -------------------------------------------------------------------------- */
.grm-section--subscribe {
	background: transparent;
	padding-block: 0 80px;
}

.grm-section--subscribe .grm-section-inner {
	gap: 0;
	padding-inline: var(--grm-gutter);
}

/* Dark card wrapping the subscribe content + photo */
.grm-subscribe-card {
	background: var(--grm-dark);
	border-radius: var(--grm-radius);
	overflow: hidden;
}

.grm-subscribe-inner {
	display: grid;
	grid-template-columns: 1fr 1fr;
	min-height: 480px;
}

.grm-subscribe-content {
	padding: 48px 48px 48px;
	display: flex;
	flex-direction: column;
	gap: 18px;
	justify-content: center;
}

.grm-subscribe-eyebrow {
	display: inline-block;
	align-self: flex-start;
	font-family: var(--grm-font-body);
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-decoration: none;
	color: #fff;
	padding: 9px 17px;
	border: 1px solid var(--grm-border-d);
	border-radius: 7px;
}

.grm-subscribe-heading {
	font-family: var(--grm-font-display);
	font-size: 36px;
	font-weight: 400;
	letter-spacing: -0.03em;
	color: #fff;
	line-height: 1.15;
}

.grm-subscribe-heading em { font-style: italic; }

.grm-subscribe-desc {
	font-size: 14px;
	color: var(--grm-muted-d);
	line-height: 1.65;
}

.grm-subscribe-fine-print {
	font-size: 12px;
	color: rgba(255, 255, 255, 0.4);
	line-height: 1.6;
}

/* Photo column (right) */
.grm-subscribe-photo {
	background: var(--grm-dark);
	padding: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 300px;
}
.grm-subscribe-photo-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: var(--grm-radius);
	display: block;
}


/* --------------------------------------------------------------------------
   11. CF7 FORM STYLES (subscribe + footer newsletter)
   Matches reference: inline pill row with email icon + Submit + checkbox row.
   -------------------------------------------------------------------------- */
/* Global CF7 reset */
.wpcf7 { margin: 0; }
.wpcf7 form { display: flex; flex-direction: column; gap: 0; }
.wpcf7-spinner { display: none !important; }
.wpcf7-response-output { display: none !important; }
.wpcf7-response-output.wpcf7-mail-sent-ok,
.wpcf7-response-output.wpcf7-validation-errors {
	display: block !important;
	margin-top: 10px;
	padding: 8px 12px;
	border-radius: 6px;
	font-size: 12px;
	border: 0;
}
.wpcf7-response-output.wpcf7-mail-sent-ok { color: #4ade80; }
.wpcf7-response-output.wpcf7-validation-errors { color: #f87171; }

/* ---- Email + Submit pill row ---- */
/* Targets the <p> wrapping email + submit inside CF7 .form-fields */
.grm-subscribe-form .wpcf7-form .form-fields p:first-of-type,
.grm-footer-newsletter-form .wpcf7-form .form-fields p:first-of-type {
	display: flex;
	align-items: center;
	gap: 0;
	background: rgba(255, 255, 255, 0.08);
	border: 1px solid rgba(255, 255, 255, 0.15);
	border-radius: 10px;
	overflow: hidden;
	margin: 0;
	/* Envelope icon via pseudo-element */
	padding-left: 14px;
}

/* Envelope icon */
.grm-subscribe-form .wpcf7-form .form-fields p:first-of-type::before,
.grm-footer-newsletter-form .wpcf7-form .form-fields p:first-of-type::before {
	content: '';
	flex-shrink: 0;
	width: 16px;
	height: 12px;
	margin-right: 0;
	background-image: url("data:image/svg+xml,%3Csvg width='16' height='12' viewBox='0 0 16 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='0.5' y='0.5' width='15' height='11' rx='1.5' stroke='rgba(255,255,255,0.45)' stroke-width='1'/%3E%3Cpath d='M1 1.5L8 7L15 1.5' stroke='rgba(255,255,255,0.45)' stroke-width='1' stroke-linecap='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	opacity: 1;
}

/* CF7 span.wpcf7-form-control-wrap must not add width/flex issues */
.grm-subscribe-form .wpcf7-form-control-wrap,
.grm-footer-newsletter-form .wpcf7-form-control-wrap {
	flex: 1;
	min-width: 0;
}

/* Email input */
.grm-subscribe-form .wpcf7-email,
.grm-footer-newsletter-form .wpcf7-email {
	width: 100%;
	padding: 13px 12px;
	background: transparent;
	border: none;
	outline: none;
	color: #fff;
	font-size: 14px;
	font-family: var(--grm-font-body);
}

.grm-subscribe-form .wpcf7-email.wpcf7-not-valid {

}

.grm-subscribe-form .wpcf7-email::placeholder,
.grm-footer-newsletter-form .wpcf7-email::placeholder {
	color: rgba(255, 255, 255, 0.4);
}

/* Submit button */
.grm-subscribe-form .wpcf7-submit,
.grm-footer-newsletter-form .wpcf7-submit {
	flex-shrink: 0;
	padding: 10px 22px;
	margin: 5px;
	background: rgba(255, 255, 255, 0.18);
	color: rgba(255, 255, 255, 0.9);
	font-family: var(--grm-font-body);
	font-size: 13px;
	font-weight: 500;
	border-radius: 7px;
	border: none;
	cursor: pointer;
	transition: background var(--grm-t);
}

.grm-subscribe-form .wpcf7-submit:hover,
.grm-footer-newsletter-form .wpcf7-submit:hover {
	background: rgba(255, 255, 255, 0.26);
}

/* Validation tip */
.grm-subscribe-form .wpcf7-not-valid-tip,
.grm-footer-newsletter-form .wpcf7-not-valid-tip {
	display: none;
	font-size: 11px;
	color: #f87171;
	margin-top: 4px;
}

/* ---- Acceptance / Checkbox row ---- */
.grm-subscribe-form .wpcf7-form .form-privacy,
.grm-footer-newsletter-form .wpcf7-form .form-privacy,
.grm-subscribe-form .wpcf7-form .form-fields p:not(:first-of-type),
.grm-footer-newsletter-form .wpcf7-form .form-fields p:not(:first-of-type) {
	margin-top: 12px;
}

.grm-subscribe-form .wpcf7-acceptance .wpcf7-list-item,
.grm-footer-newsletter-form .wpcf7-acceptance .wpcf7-list-item {
	margin: 0;
}

.grm-subscribe-form .wpcf7-acceptance .wpcf7-list-item label,
.grm-footer-newsletter-form .wpcf7-acceptance .wpcf7-list-item label {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	cursor: pointer;
}

.grm-subscribe-form .wpcf7-acceptance input[type="checkbox"],
.grm-footer-newsletter-form .wpcf7-acceptance input[type="checkbox"] {
	-webkit-appearance: none;
	appearance: none;
	width: 16px;
	height: 16px;
	min-width: 16px;
	border: 1px solid rgba(255, 255, 255, 0.15);
	border-radius: 3px;
	background-color: #0f0f10;
	margin-top: 2px;
	cursor: pointer;
	flex-shrink: 0;
	position: relative;
}
.grm-subscribe-form .wpcf7-acceptance input[type="checkbox"]:checked,
.grm-footer-newsletter-form .wpcf7-acceptance input[type="checkbox"]:checked {
	background-color: #fff;
	border-color: #fff;
}
.grm-subscribe-form .wpcf7-acceptance input[type="checkbox"]:checked::after,
.grm-footer-newsletter-form .wpcf7-acceptance input[type="checkbox"]:checked::after {
	content: '';
	position: absolute;
	left: 4px;
	top: 1px;
	width: 5px;
	height: 9px;
	border: 2px solid #0f0f10;
	border-top: 0;
	border-left: 0;
	transform: rotate(45deg);
}

.grm-subscribe-form .wpcf7-acceptance .wpcf7-list-item-label,
.grm-footer-newsletter-form .wpcf7-acceptance .wpcf7-list-item-label {
	font-size: 12px;
	color: rgba(255, 255, 255, 0.5);
	line-height: 1.55;
}

.grm-subscribe-form .wpcf7-acceptance .wpcf7-list-item-label a,
.grm-footer-newsletter-form .wpcf7-acceptance .wpcf7-list-item-label a {
	color: rgba(255, 255, 255, 0.75);
	text-decoration: underline;
	text-underline-offset: 2px;
}

/* Mobile: stack pill row */
@media (max-width: 600px) {
	.grm-subscribe-form .wpcf7-form .form-fields p:first-of-type,
	.grm-footer-newsletter-form .wpcf7-form .form-fields p:first-of-type {
		flex-wrap: wrap;
		flex-direction: column;
		padding-left: 0;
		gap: 8px;
		background: none;
		border: none;
		border-radius: 0;
	}
	.form-fields br {
		display: none;
	}
	.form-fields .wpcf7-form-control-wrap {
		width: 100%;
	}
	.grm-subscribe-form .wpcf7-form .form-fields p:first-of-type::before,
	.grm-footer-newsletter-form .wpcf7-form .form-fields p:first-of-type::before {
		display: none;
	}
	.grm-subscribe-form .wpcf7-email,
	.grm-footer-newsletter-form .wpcf7-email {
		background: rgba(255, 255, 255, 0.08);
		border: 1px solid rgba(255, 255, 255, 0.15);
		border-radius: 8px;
		padding: 12px 14px;
	}
	.grm-subscribe-form .wpcf7-submit,
	.grm-footer-newsletter-form .wpcf7-submit {
		width: 100%;
		margin: 0;
		border-radius: 8px;
		background: rgba(255, 255, 255, 0.15);
	}
}


/* --------------------------------------------------------------------------
   12. FOOTER (newsletter + bottom bar, contained dark card like markets)
   -------------------------------------------------------------------------- */
.grm-footer {
	background: transparent;
}

.grm-footer-inner {
	max-width: var(--grm-max-w);
	margin-inline: auto;
	padding-inline: var(--grm-gutter);
}

.grm-footer-card {
	background: var(--grm-dark);
	border-radius: var(--grm-radius);
	overflow: hidden;
}

.grm-footer-newsletter {
	padding-block: 56px;
}

.grm-footer-newsletter-inner {
	padding-inline: var(--grm-gutter);
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 64px;
	align-items: center;
}

.grm-footer-newsletter-label {
	display: flex;
	align-items: center;
	gap: 10px;
	font-family: var(--grm-font-body);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--grm-muted-d);
	margin-bottom: 20px;
}

.grm-footer-newsletter-dash {
	display: inline-block;
	width: 20px;
	height: 1.5px;
	background: var(--grm-muted-d);
}

.grm-footer-newsletter-heading {
	font-family: var(--grm-font-display);
	font-size: 40px;
	font-weight: 400;
	letter-spacing: -0.03em;
	color: #fff;
	line-height: 1.1;
}

.grm-footer-newsletter-heading em { font-style: italic; }

.grm-footer-newsletter-form {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.grm-footer-newsletter-disclaimer {
	font-size: 12px;
	color: rgba(255, 255, 255, 0.4);
	line-height: 1.6;
}

.grm-footer-newsletter-disclaimer a {
	color: rgba(255, 255, 255, 0.65);
	text-decoration: underline;
}


/* --------------------------------------------------------------------------
   13. FOOTER BOTTOM BAR
   -------------------------------------------------------------------------- */
.grm-footer-bottom {
	border-top: 1px solid var(--grm-border-d);
	padding-block: 24px;
}

.grm-footer-bottom-inner {
	padding-inline: var(--grm-gutter);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	flex-wrap: wrap;
}

.grm-footer-nav {
	display: flex;
	align-items: center;
	gap: 20px;
	flex-wrap: wrap;
}

.grm-footer-nav a {
	font-size: 13px;
	color: var(--grm-muted-d);
	transition: color var(--grm-t);
}

.grm-footer-nav a:hover { color: #fff; }

.grm-footer-copy {
	font-size: 12px;
	color: rgba(255, 255, 255, 0.35);
	max-width: 354px;
}


/* --------------------------------------------------------------------------
   14. SEARCH OVERLAY
   Dark panel drops from the header bottom — header stays visible.
   -------------------------------------------------------------------------- */
.bl-search-overlay {
	position: fixed;
	top: 88px; /* ticker (~32px) + nav (56px) */
	left: 0;
	right: 0;
	height: 400px;
	z-index: 190; /* behind header (200) so header stays on top */
	background: var(--grm-dark);
	display: flex;
	align-items: center;
	overflow: hidden;
}

/* [hidden] attribute hides it */
.bl-search-overlay[hidden] { display: none; }

/* Transparent backdrop — fill entire dark area; click closes */
.bl-search-overlay__backdrop {
	position: absolute;
	inset: 0;
	z-index: 0;
	cursor: default;
}

/* Centered content panel */
.bl-search-overlay__panel {
	position: relative;
	z-index: 1;
	width: 100%;
	max-width: var(--grm-max-w);
	margin-inline: auto;
	padding-inline: var(--grm-gutter);
}

/* The form (acts as the visual container) */
.bl-search-overlay__bar {
	width: 100%;
}

/* Input + submit icon row */
.bl-search-overlay__row {
	display: flex;
	align-items: center;
	gap: 16px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.25);
	padding-bottom: 20px;
}

.bl-search-overlay__input {
	flex: 1;
	background: transparent;
	border: none;
	outline: none;
	font-family: var(--grm-font-display);
	font-size: clamp(20px, 2.5vw, 32px);
	font-weight: 300;
	color: rgba(255, 255, 255, 0.88);
	caret-color: #fff;
	line-height: 1.1;
}

.bl-search-overlay__input::placeholder {
	color: rgba(255, 255, 255, 0.45);
}

.bl-search-overlay__submit {
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	color: rgba(255, 255, 255, 0.6);
	padding: 4px;
	transition: color var(--grm-t);
}

.bl-search-overlay__submit:hover {
	color: #fff;
}

.bl-search-overlay__hint {
	margin-top: 16px;
	font-size: 13px;
	color: rgba(255, 255, 255, 0.4);
	letter-spacing: 0.01em;
}

/* Body-level class applied when overlay open (locks scroll) */
body.bl-search-open { overflow: hidden; }


/* --------------------------------------------------------------------------
   15. SINGLE POST
   -------------------------------------------------------------------------- */

/* Breadcrumb */
.grm-breadcrumb {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 6px;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--grm-muted-l);
	margin-bottom: 24px;
}

.grm-breadcrumb a { color: var(--grm-muted-l); transition: color var(--grm-t); }
.grm-breadcrumb a:hover { color: var(--grm-dark); }
.grm-breadcrumb span:last-child,
.grm-breadcrumb a:last-of-type { color: var(--grm-dark); }
.grm-breadcrumb__sep { opacity: 0.4; }
.grm-breadcrumb__dash { opacity: 0.4; margin-inline: 2px; }

/* Post header: breadcrumb + title + meta */
.grm-single-header { padding-top: 48px; }

.grm-single-header__inner {
	max-width: var(--grm-max-w);
	margin-inline: auto;
	padding-inline: var(--grm-gutter);
}

/* Title */
.grm-single-title {
	font-family: var(--grm-font-display);
	font-size: clamp(32px, 4vw, 52px);
	font-weight: 400;
	line-height: 1.08;
	letter-spacing: -0.03em;
	color: var(--grm-dark);
	margin-bottom: 24px;
}

/* Meta row: date · read-time · author */
.grm-single-meta {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 12px;
	font-size: 13px;
	color: var(--grm-muted-l);
	padding-bottom: 48px;
	border-bottom: 1px solid var(--grm-border-l);
}

.grm-single-meta-sep {
	width: 3px;
	height: 3px;
	border-radius: 50%;
	background: currentColor;
	flex-shrink: 0;
	opacity: 0.4;
}

/* Featured image */
.grm-single-thumb-wrap {
	max-width: var(--grm-max-w);
	margin-inline: auto;
	padding-inline: var(--grm-gutter);
	margin-top: 48px;
	border-radius: var(--grm-radius);
	overflow: hidden;
	aspect-ratio: 16 / 9;
}

.grm-single-thumb {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	border-radius: var(--grm-radius);
}

/* Body content column */
.grm-single-content {
	max-width: 780px;
	margin-inline: auto;
	padding: 48px var(--grm-gutter) 16px;
}

/* Post body — shared with page.php */
.bl-post-body {
	font-size: 17px;
	line-height: 1.8;
	color: var(--grm-dark);
}

.bl-post-body p { margin-bottom: 1.4em; }

.bl-post-body h2,
.bl-post-body h3,
.bl-post-body h4 {
	font-family: var(--grm-font-display);
	font-weight: 400;
	letter-spacing: -0.02em;
	margin-top: 1.4em;
	margin-bottom: 0.4em;
	line-height: 1.15;
}

.bl-post-body h2 { font-size: 32px; }
.bl-post-body h3 { font-size: 24px; }
.bl-post-body h4 { font-size: 20px; }

.bl-post-body a { color: var(--grm-dark); text-decoration: underline; text-underline-offset: 2px; }
.bl-post-body ul,
.bl-post-body ol { padding-left: 1.5em; margin-bottom: 1.4em; }
.bl-post-body ul { list-style: disc; }
.bl-post-body ol { list-style: decimal; }
.bl-post-body li { margin-bottom: 0.4em; }

.bl-post-body blockquote {
	border-left: 3px solid var(--grm-dark);
	padding: 12px 0 12px 24px;
	margin: 1.6em 0;
	font-style: italic;
	font-size: 19px;
	color: var(--grm-muted-l);
}

.bl-post-body img {
	width: 100%;
	border-radius: 8px;
	margin-block: 1.6em;
}

.bl-post-body figure { margin-block: 1.6em; }

.bl-post-body figcaption {
	font-size: 13px;
	color: var(--grm-muted-l);
	margin-top: 8px;
	text-align: center;
}

/* Tags row */
.grm-single-tags {
	display: flex;
	align-items: flex-start;
	flex-wrap: wrap;
	gap: 16px;
	max-width: 780px;
	margin-inline: auto;
	padding: 32px var(--grm-gutter) 64px;
	border-top: 1px solid var(--grm-border-l);
}

.grm-single-tags__label {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--grm-muted-l);
	padding-top: 6px;
	flex-shrink: 0;
}

.grm-single-tags__list {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.grm-tag-chip {
	display: inline-flex;
	align-items: center;
	padding: 5px 14px;
	border: 1.5px solid var(--grm-border-l);
	border-radius: 999px;
	font-size: 13px;
	font-weight: 500;
	color: var(--grm-dark);
	transition: border-color var(--grm-t), background var(--grm-t), color var(--grm-t);
}

.grm-tag-chip:hover {
	border-color: var(--grm-dark);
	background: var(--grm-dark);
	color: #fff;
}

/* Related / Popular posts section */
.grm-related {
	padding-block: 72px 80px;
	border-top: 1px solid var(--grm-border-l);
}

.grm-related__inner {
	max-width: var(--grm-max-w);
	margin-inline: auto;
	padding-inline: var(--grm-gutter);
}

.grm-related__header {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 24px;
	margin-bottom: 40px;
	flex-wrap: wrap;
}

.grm-related__eyebrow {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--grm-muted-l);
	margin-bottom: 10px;
}

.grm-related__eyebrow::before {
	content: '';
	display: block;
	width: 24px;
	height: 1px;
	background: var(--grm-muted-l);
	flex-shrink: 0;
}

.grm-related__title {
	font-family: var(--grm-font-display);
	font-size: clamp(32px, 4vw, 48px);
	font-weight: 400;
	line-height: 1.05;
	letter-spacing: -0.03em;
	color: var(--grm-dark);
}

.grm-related__title em { font-style: italic; }

.grm-related__view-all {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 13px;
	font-weight: 600;
	color: var(--grm-dark);
	white-space: nowrap;
	flex-shrink: 0;
	padding: 9px 18px;
	border: 1.5px solid var(--grm-dark);
	border-radius: 999px;
	transition: background var(--grm-t), color var(--grm-t);
}

.grm-related__view-all:hover {
	background: var(--grm-dark);
	color: #fff;
}

.grm-related__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
}

.grm-related__grid .grm-story-card { background: var(--grm-dark); }


/* --------------------------------------------------------------------------
   16. ARCHIVE / CATEGORY
   -------------------------------------------------------------------------- */
.grm-archive-wrap {
	max-width: var(--grm-max-w);
	margin-inline: auto;
	padding: 48px var(--grm-gutter) 80px;
}

.grm-archive-header {
	margin-bottom: 40px;
	padding-bottom: 24px;
	border-bottom: 1px solid var(--grm-border-l);
}

.grm-archive-eyebrow {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--grm-muted-l);
	margin-bottom: 12px;
}

.grm-archive-eyebrow::before {
	content: '';
	display: block;
	width: 24px;
	height: 1px;
	background: var(--grm-muted-l);
	flex-shrink: 0;
}

.grm-archive-title {
	font-family: var(--grm-font-display);
	font-size: clamp(32px, 4vw, 48px);
	font-weight: 400;
	letter-spacing: -0.03em;
	color: var(--grm-dark);
}

.grm-archive-title em { font-style: italic; }

.grm-archive-description {
	margin-top: 12px;
	font-size: 15px;
	color: var(--grm-muted-l);
	max-width: 600px;
}

.grm-archive-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
}

.grm-archive-grid .grm-story-card { background: var(--grm-dark); }

.grm-no-posts {
	grid-column: 1 / -1;
	text-align: center;
	padding: 80px 0;
	color: var(--grm-muted-l);
	font-size: 16px;
}

/* Pagination */
.grm-pagination {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 64px;
}

.grm-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding-inline: 12px;
	border-radius: 999px;
	font-size: 14px;
	font-weight: 500;
	color: var(--grm-muted-l);
	border: 1px solid var(--grm-border-l);
	background: transparent;
	transition: background var(--grm-t), color var(--grm-t), border-color var(--grm-t);
}

.grm-pagination .page-numbers:hover {
	background: var(--grm-dark);
	color: #fff;
	border-color: var(--grm-dark);
}

.grm-pagination .page-numbers.current {
	background: var(--grm-dark);
	color: #fff;
	border-color: var(--grm-dark);
}

.grm-pagination .prev,
.grm-pagination .next { min-width: auto; padding-inline: 20px; }


/* --------------------------------------------------------------------------
   17. SEARCH RESULTS PAGE
   -------------------------------------------------------------------------- */
.grm-search-wrap {
	max-width: var(--grm-max-w);
	margin-inline: auto;
	padding: 48px var(--grm-gutter) 80px;
}

.grm-search-header {
	margin-bottom: 40px;
}

.grm-search-title {
	font-family: var(--grm-font-display);
	font-size: 32px;
	font-weight: 400;
	letter-spacing: -0.02em;
}


/* --------------------------------------------------------------------------
   18. PAGE (generic, About Us etc.)
   -------------------------------------------------------------------------- */
.grm-page-wrap {
	max-width: var(--grm-max-w);
	margin-inline: auto;
	padding-block: 0 80px;
}

.grm-page-header {
	padding: 48px var(--grm-gutter) 40px;
	border-bottom: 1px solid var(--grm-border-l);
	margin-bottom: 48px;
}

.grm-page-title {
	font-family: var(--grm-font-display);
	font-size: clamp(32px, 4vw, 52px);
	font-weight: 400;
	letter-spacing: -0.03em;
	line-height: 1.08;
	color: var(--grm-dark);
}

.grm-page-content {
	max-width: 780px;
	margin-inline: auto;
	padding-inline: var(--grm-gutter);
}


/* --------------------------------------------------------------------------
   19. 404
   -------------------------------------------------------------------------- */
.grm-404-wrap {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 80px var(--grm-gutter);
	text-align: center;
}

.grm-404-code {
	font-family: var(--grm-font-display);
	font-size: 120px;
	line-height: 1;
	color: var(--grm-cream-dark);
}

.grm-404-wrap h1 { font-size: 32px; margin-bottom: 12px; }
.grm-404-wrap p { color: var(--grm-muted-l); margin-bottom: 24px; }

.grm-404-btn {
	display: inline-flex;
	padding: 12px 28px;
	background: var(--grm-dark);
	color: #fff;
	font-size: 14px;
	font-weight: 500;
	border-radius: 8px;
}


/* --------------------------------------------------------------------------
   20. RESPONSIVE
   -------------------------------------------------------------------------- */

/* ≤1100px: shrink hero mini cards */
@media (max-width: 1100px) {
	:root { --grm-gutter: 32px; }

	.grm-markets-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ≤1100px: copyright wraps to its own centred row */
@media (max-width: 1100px) {
	.grm-footer-copy {
		flex-basis: 100%;
		max-width: none;
		text-align: center;
	}
}

/* ≤900px: 2-column stories, show hamburger */
@media (max-width: 900px) {
	.grm-nav-links { display: none; }
	.grm-nav-subscribe-btn { display: none; }
	.bl-menu-toggle { display: flex; }
	.grm-nav-inner { justify-content: space-between; }

	.grm-stories-grid { grid-template-columns: repeat(2, 1fr); }

	.grm-footer-newsletter-inner {
		grid-template-columns: 1fr;
		gap: 32px;
	}

	.grm-subscribe-inner {
		grid-template-columns: 1fr;
	}

	.grm-subscribe-photo { display: none; }

	.grm-markets-desc { text-align: left; }
	.grm-markets-header { flex-direction: column; align-items: flex-start; }

	/* Tablet mini-strip: 2 posts, hide 3rd */
	.grm-hero-mini-strip { grid-template-columns: repeat(2, 1fr); }
	.grm-hero-mini:nth-child(3) { display: none; }

	/* Single + archive: 2-col */
	.grm-related__grid { grid-template-columns: repeat(2, 1fr); }
	.grm-archive-grid  { grid-template-columns: repeat(2, 1fr); }
}

/* ≤720px: ticker scrolls, 1-col stories, hidden mini-strip */
@media (max-width: 720px) {
	:root { --grm-gutter: 20px; }

	.grm-hero-inner { min-height: 420px; justify-content: flex-end; }
    .grm-hero-title { font-size: 22px; }
	.grm-hero-mini-strip { display: none; }

	.grm-stories-grid { grid-template-columns: 1fr; }

	.grm-markets-card { padding: 24px; }
	.grm-markets-heading { font-size: 30px; }

	.grm-subscribe-content { padding: 32px 24px; }
	.grm-subscribe-heading { font-size: 30px; }

	.grm-footer-newsletter-heading { font-size: 30px; }
	.grm-footer-newsletter-inner { text-align: center; }
	.grm-footer-newsletter-label { justify-content: center; }

	.grm-footer-bottom-inner {
		flex-direction: column;
		align-items: center;
		gap: 16px;
		text-align: center;
	}

	.grm-footer-copy { text-align: center; max-width: none; }

	.grm-archive-grid { grid-template-columns: 1fr; }

	.grm-related__grid { grid-template-columns: 1fr; }
	.grm-related__header { flex-direction: column; align-items: flex-start; }

	.grm-single-thumb-wrap { border-radius: 0; }
	.grm-single-header__inner { max-width: 100%; }
	.grm-single-content { max-width: 100%; }
	.grm-single-tags { max-width: 100%; }

	.grm-markets-grid { grid-template-columns: repeat(2, 1fr); }

	.grm-section { padding-block: 48px; }

	.grm-footer-nav {
		flex-direction: column;
		align-items: center;
		gap: 10px;
	}

	.bl-search-overlay { top: 56px; height: 360px; } /* no ticker on mobile */
}

/* ≤480px */
@media (max-width: 480px) {
	/* Main post card: push to bottom of hero image */
	.grm-hero-card { max-width: 100%; }
	.grm-hero-card-row { justify-content: stretch; }

	/* Markets: keep border-radius, 2-col grid */
	.grm-markets-grid { grid-template-columns: repeat(2, 1fr); }
	.grm-markets-card { padding: 20px; }
	.grm-markets-heading { font-size: 26px; }

	/* Subscribe: keep border-radius */
	.grm-subscribe-heading { font-size: 26px; }

	.grm-post-title { font-size: 28px; }
	.grm-footer-newsletter-heading { font-size: 26px; }

	.bl-search-overlay { padding-top: 40px; }
	.bl-search-overlay__input { font-size: 24px; }
}

/* ============================================================
   ABOUT US PAGE  (grm-about-*)
   ============================================================ */

/* Hero */
.grm-about-hero { background: var(--grm-cream); padding: 80px var(--grm-gutter) 100px; border-bottom: 1px solid var(--grm-border-l); }
.grm-about-hero__inner { max-width: var(--grm-max-w); margin-inline: auto; padding-inline: var(--grm-gutter); display: flex; flex-direction: column; gap: 24px; }
.grm-about-eyebrow { font-size: 13px; font-weight: 600; letter-spacing: 0.52px; text-transform: uppercase; color: var(--grm-muted-l); }
.grm-about-hero__title { font-family: var(--grm-font-display); font-size: 47px; font-weight: 400; line-height: .95; letter-spacing: -0.04em; color: var(--grm-dark); }
.grm-about-hero__title em { font-style: italic; }
.grm-about-hero__sub { max-width: 720px; font-size: 18px; line-height: 1.55; color: #5a5a5a; }

/* Sections */
.grm-about-sec { border-top: 1px solid var(--grm-border-l); padding-block: 80px; background: var(--grm-cream); }
.grm-about-sec--gray { background: #dad6cc; }
.grm-about-sec--owner { padding-bottom: 120px; margin-bottom: 64px; }
.grm-about-sec__inner { max-width: var(--grm-max-w); margin-inline: auto; padding-inline: var(--grm-gutter); display: grid; grid-template-columns: 300px 1fr; gap: 80px; align-items: start; }

/* Label column */
.grm-about-label { display: flex; flex-direction: column; gap: 12px; position: sticky; top: 80px; }
.grm-about-label__num { color: var(--grm-muted-l); font-size: 13px; font-weight: 600; letter-spacing: 0.52px; text-transform: uppercase; }
.grm-about-label__h { font-family: var(--grm-font-display); font-size: 36px; font-weight: 400; line-height: 1.05; letter-spacing: -0.015em; color: var(--grm-dark); }
.grm-about-label__h em { font-style: italic; }

/* Body column */
.grm-about-body { min-width: 0; }
.grm-about-body--prose { display: flex; flex-direction: column; gap: 16px; color: var(--grm-dark); font-size: 14px; line-height: 1.7; }
.grm-about-intro { color: var(--grm-dark); font-size: 14px; line-height: 1.7; margin-bottom: 24px; }
.grm-about-pullquote { max-width: 640px; padding: 4px 0 4px 24px; border-left: 3px solid var(--grm-dark); font-family: var(--grm-font-display); font-size: 22px; font-weight: 400; line-height: 1.5; color: var(--grm-dark); }
.grm-about-link { color: var(--grm-dark); text-decoration: underline; text-underline-offset: 2px; }

/* Coverage grid — border-top divider, 2 columns, no card boxes */
.grm-about-coverage-grid { display: grid; grid-template-columns: 1fr 1fr; column-gap: 48px; row-gap: 32px; }
.grm-about-coverage-card { padding-top: 24px; border-top: 1px solid var(--grm-border-l); display: flex; flex-direction: column; gap: 4px; }
.grm-about-coverage-card__num { color: var(--grm-muted-l); font-size: 13px; font-style: italic; }
.grm-about-coverage-card__title { font-family: var(--grm-font-display); font-size: 26px; font-weight: 400; letter-spacing: -0.26px; color: var(--grm-dark); margin-top: 2px; }
.grm-about-coverage-card__text { margin-top: 8px; color: var(--grm-dark); font-size: 14px; line-height: 1.6; }

/* Team grid — border-top divider, 2 columns, no card boxes */
.grm-about-team-grid { display: grid; grid-template-columns: 1fr 1fr; column-gap: 48px; row-gap: 32px; }
.grm-about-editor-card { padding-top: 24px; border-top: 1px solid var(--grm-border-l); display: flex; flex-direction: column; }
.grm-about-editor-card__avatar { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; background: var(--grm-dark); border-radius: 50%; color: #fff; font-size: 13px; font-weight: 600; letter-spacing: 0.52px; flex-shrink: 0; }
.grm-about-editor-card__name { margin-top: 12px; color: var(--grm-dark); font-family: var(--grm-font-display); font-size: 18px; font-weight: 400; }
.grm-about-editor-card__role { color: var(--grm-muted-l); font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.48px; }
.grm-about-editor-card__bio { margin-top: 12px; color: var(--grm-dark); font-size: 14px; line-height: 1.6; }

/* Contact */
.grm-about-contact { display: flex; flex-direction: column; gap: 8px; }
.grm-about-contact-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.grm-about-contact-card { background: #dad6cc; border: 1px solid var(--grm-border-l); border-radius: 12px; padding: 20px 24px 24px; display: flex; flex-direction: column; gap: 8px; }
.grm-about-contact-card__label { color: var(--grm-muted-l); font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.48px; }
.grm-about-contact-card__value { color: var(--grm-dark); font-family: var(--grm-font-display); font-size: 18px; font-weight: 400; border-bottom: 1px solid var(--grm-border-l); padding-bottom: 8px; }
.grm-about-contact-card__hint { color: var(--grm-muted-l); font-size: 12px; line-height: 1.5; }
.grm-about-address { background: var(--grm-dark); border-radius: 12px; padding: 24px 32px; display: grid; grid-template-columns: 160px 1fr; gap: 16px; align-items: start; }
.grm-about-address__label { color: rgba(255,255,255,0.65); font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.48px; line-height: 1.5; }
.grm-about-address__value { color: rgba(255,255,255,0.75); font-family: var(--grm-font-display); font-size: 18px; line-height: 1.45; }
.grm-about-address__value strong { color: #fff; font-weight: 400; }

/* Responsive — tablet */
@media (max-width: 960px) {
	.grm-about-hero { padding: 60px var(--grm-gutter) 80px; }
	.grm-about-sec__inner { grid-template-columns: 1fr; gap: 40px; }
	.grm-about-label { position: static; }
	.grm-about-contact-cards { grid-template-columns: 1fr; }
	.grm-about-address { grid-template-columns: 1fr; gap: 8px; }
}

/* Responsive — mobile */
@media (max-width: 600px) {
	.grm-about-hero { padding: 48px var(--grm-gutter) 56px; }
	.grm-about-sec { padding-block: 48px; }
	.grm-about-sec--owner { padding-bottom: 80px; margin-bottom: 48px; }
	.grm-about-label__h { font-size: 28px; }
	.grm-about-label h2 br { display: none; }
	.grm-about-coverage-grid { grid-template-columns: 1fr; }
	.grm-about-team-grid { grid-template-columns: 1fr; }
	.grm-about-address { grid-template-columns: 1fr; gap: 8px; padding: 20px 24px; }
}

/* ============================================================
   TRADING TOOLS PAGE  (grm-tt-*)
   ============================================================ */

/* Hero */
.grm-tt-hero { background: var(--grm-cream); padding: 80px var(--grm-gutter); border-bottom: 1px solid var(--grm-border-l); }
.grm-tt-hero__inner { max-width: var(--grm-max-w); margin-inline: auto; padding-inline: var(--grm-gutter); display: flex; flex-direction: column; gap: 24px; }
.grm-tt-hero__title { font-family: var(--grm-font-display); font-size: 47px; font-weight: 400; line-height: .96; letter-spacing: -0.04em; color: var(--grm-dark); }
.grm-tt-hero__title em { font-style: italic; }
.grm-tt-hero__sub { max-width: 720px; font-size: 18px; line-height: 1.55; color: #5a5a5a; }
.grm-tt-hero__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; padding-top: 17px; border-top: 1px solid var(--grm-border-l); font-size: 12px; color: var(--grm-muted-l); letter-spacing: 0.24px; }
.grm-tt-hero__meta-item--strong { font-weight: 600; color: var(--grm-dark); }
.grm-tt-hero__meta-sep { width: 3px; height: 3px; border-radius: 50%; background: var(--grm-muted-l); flex-shrink: 0; }

/* Sections */
.grm-tt-sections { display: flex; flex-direction: column; }
.grm-tt-sec { border-top: 1px solid var(--grm-border-l); padding-block: 64px; background: var(--grm-cream); }
.grm-tt-sec--tint { background: #dad6cc; }
.grm-tt-sec__inner { max-width: var(--grm-max-w); margin-inline: auto; padding-inline: var(--grm-gutter); display: grid; grid-template-columns: 320px 1fr; gap: 64px; align-items: start; }

/* Label */
.grm-tt-label { display: flex; flex-direction: column; gap: 10px; position: sticky; top: 80px; }
.grm-tt-label__num { color: var(--grm-muted-l); font-size: 13px; font-weight: 600; letter-spacing: 0.52px; }
.grm-tt-label__h { font-family: var(--grm-font-display); font-size: 36px; font-weight: 400; line-height: 1.05; letter-spacing: -0.015em; color: var(--grm-dark); }
.grm-tt-label__h em { font-style: italic; }

/* Tool list */
.grm-tt-list { display: flex; flex-direction: column; list-style: none; margin: 0; padding: 0; }
.grm-tt-card { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; padding-block: 20px; border-bottom: 1px solid var(--grm-border-l); }
.grm-tt-card:first-child { padding-top: 0; }
.grm-tt-card--last { border-bottom: none; padding-bottom: 0; }
.grm-tt-card__info { display: flex; flex-direction: column; gap: 6px; flex: 1; min-width: 0; }
.grm-tt-card__domain { color: var(--grm-muted-l); font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.48px; }
.grm-tt-card__name { font-family: var(--grm-font-display); font-size: 18px; font-weight: 400; letter-spacing: -0.18px; color: var(--grm-dark); }
.grm-tt-card__desc { color: #5a5a5a; font-size: 14px; line-height: 1.55; max-width: 560px; }
.grm-tt-card__visit { display: inline-flex; align-items: center; gap: 6px; flex-shrink: 0; margin-top: 4px; padding: 8px 14px; border: 1px solid var(--grm-border-l); border-radius: 8px; background: transparent; color: var(--grm-dark); font-size: 13px; font-weight: 500; text-decoration: none; transition: border-color var(--grm-t); }
.grm-tt-card__visit:hover { border-color: var(--grm-dark); }
.grm-tt-card__visit svg { flex-shrink: 0; }

/* Disclaimer */
.grm-tt-disclaimer { max-width: var(--grm-max-w); margin-inline: auto; margin-block: 64px; padding-inline: var(--grm-gutter); }
.grm-tt-disclaimer__inner { background: var(--grm-dark); border-radius: 16px; overflow: hidden; padding: 48px var(--grm-gutter); display: grid; grid-template-columns: 200px 1fr; gap: 48px; }
.grm-tt-disclaimer__label { font-family: var(--grm-font-display); font-size: 18px; color: #fff; }
.grm-tt-disclaimer__body { display: flex; flex-direction: column; gap: 12px; color: rgba(255,255,255,0.55); font-size: 14px; line-height: 1.65; }
.grm-tt-disclaimer__link { color: rgba(255,255,255,0.55); text-decoration: underline; }

/* Responsive — tablet */
@media (max-width: 960px) {
	.grm-tt-sec__inner { grid-template-columns: 1fr; gap: 40px; }
	.grm-tt-label { position: static; }
	.grm-tt-disclaimer__inner { grid-template-columns: 1fr; gap: 24px; }
}

/* Responsive — mobile */
@media (max-width: 600px) {
	.grm-tt-hero { padding: 48px var(--grm-gutter) 56px; }
	.grm-tt-sec { padding-block: 48px; }
	.grm-tt-label__h { font-size: 28px; }
	.grm-tt-label h2 br { display: none; }
	.grm-tt-card { flex-direction: column; gap: 16px; }
	.grm-tt-disclaimer { padding-inline: 12px; margin-block: 48px; }
	.grm-tt-disclaimer__inner { padding: 32px 24px; }
}