/* eshtarynow — main stylesheet (mobile-first, no framework) */

/* ---------- Buttons ---------- */
.eshn-btn {
	display: inline-block;
	border: none;
	border-radius: var(--eshn-radius-sm);
	padding: .7em 1.4em;
	cursor: pointer;
	font: inherit;
	font-weight: 600;
	text-decoration: none;
	text-align: center;
	transition: transform .15s var(--eshn-ease), box-shadow .15s var(--eshn-ease), background-color .15s var(--eshn-ease);
	box-shadow: var(--eshn-shadow-sm);
}
.eshn-btn:hover { transform: translateY(-2px); box-shadow: var(--eshn-shadow-md); }
.eshn-btn:active { transform: translateY(0); box-shadow: var(--eshn-shadow-sm); }
.eshn-btn-primary { background: var(--eshn-primary); color: #fff; }
.eshn-btn-primary:hover { background: var(--eshn-primary-dark); }
.eshn-btn-accent { background: var(--eshn-accent); color: #fff; }
.eshn-btn-light { background: var(--eshn-surface); color: var(--eshn-text); border: 1px solid var(--eshn-border); }
.eshn-btn-light:hover { background: var(--eshn-surface-2); border-color: var(--eshn-text-muted); }

/* ---------- Header ---------- */
.eshn-header { background: var(--eshn-surface); }
.eshn-header-row { display: flex; align-items: center; gap: 1rem; padding: .85rem 1rem; flex-wrap: wrap; position: sticky; top: 0; z-index: 50; background: var(--eshn-surface); box-shadow: var(--eshn-shadow-sm); }
.eshn-logo { display: inline-flex; align-items: center; font-size: 1.5rem; font-weight: 800; color: var(--eshn-primary); text-decoration: none; letter-spacing: -.02em; }
.eshn-logo img { height: 42px; width: auto; display: block; }
.eshn-search-form { flex: 1 1 260px; display: flex; min-width: 180px; max-width: 480px; box-shadow: var(--eshn-shadow-sm); border-radius: 999px; transition: box-shadow .15s var(--eshn-ease); }
.eshn-search-form:focus-within { box-shadow: 0 0 0 3px rgba(53, 89, 233, .15), var(--eshn-shadow-sm); }
.eshn-search-form input { flex: 1; padding: .6em .9em; border: 1px solid var(--eshn-border); border-inline-end: none; border-radius: 999px 0 0 999px; font: inherit; min-width: 0; background: var(--eshn-surface); }
.eshn-search-form input:focus { outline: none; }
[dir="rtl"] .eshn-search-form input { border-radius: 0 999px 999px 0; }
.eshn-search-form button { border: 1px solid var(--eshn-border); border-inline-start: none; background: var(--eshn-surface-2); border-radius: 0 999px 999px 0; padding: 0 1.1em; cursor: pointer; transition: background-color .15s var(--eshn-ease); }
.eshn-search-form button:hover { background: var(--eshn-border); }
[dir="rtl"] .eshn-search-form button { border-radius: 999px 0 0 999px; }
.eshn-header-actions { display: flex; align-items: center; gap: 1.1rem; margin-inline-start: auto; flex-wrap: wrap; }
.eshn-post-btn { white-space: nowrap; }
.eshn-badge { background: var(--eshn-accent); color: #fff; font-size: .7em; font-weight: 700; border-radius: 999px; padding: .1em .5em; margin-inline-start: .2em; }
.eshn-nav-toggle { display: none; background: none; border: none; font-size: 1.4rem; cursor: pointer; color: var(--eshn-text); }
.eshn-header-account-menu { display: none; }
.eshn-mobile-tools { display: none; }

/* ---------- Notification bell ---------- */
.eshn-notif-bell-wrap { position: relative; }
.eshn-notif-bell { position: relative; background: none; border: none; font-size: 1.25rem; line-height: 1; cursor: pointer; color: var(--eshn-text); padding: .3em; }
.eshn-notif-badge { position: absolute; top: -.1em; inset-inline-end: -.1em; margin-inline-start: 0; }
.eshn-notif-dropdown { display: none; position: absolute; top: calc(100% + .5rem); inset-inline-end: 0; width: 320px; max-width: 90vw; max-height: 70vh; overflow-y: auto; background: var(--eshn-surface); border-radius: var(--eshn-radius); box-shadow: var(--eshn-shadow-lg); z-index: 60; }
.eshn-notif-bell-wrap.is-open .eshn-notif-dropdown { display: block; }
.eshn-notifications-list { list-style: none; margin: 0; padding: 0; }
.eshn-notification a { display: flex; align-items: flex-start; gap: .7em; padding: .8em 1rem; text-decoration: none; color: var(--eshn-text); transition: background-color .15s var(--eshn-ease); }
.eshn-notification a:hover { background: var(--eshn-surface-2); }
.eshn-notification.is-unread a { background: var(--eshn-primary-light); }
.eshn-notification + .eshn-notification { border-top: 1px solid var(--eshn-border); }
.eshn-notification-icon { flex: 0 0 auto; font-size: 1.1em; }
.eshn-notification-body { display: flex; flex-direction: column; gap: .15em; min-width: 0; }
.eshn-notification-text { font-size: .9em; font-weight: 600; }
.eshn-notification-time { font-size: .78em; color: var(--eshn-text-muted); }
.eshn-notif-viewall { display: block; text-align: center; padding: .75em; font-size: .85em; font-weight: 700; color: var(--eshn-primary); text-decoration: none; border-top: 1px solid var(--eshn-border); }
.eshn-notif-viewall:hover { background: var(--eshn-surface-2); }
.eshn-notifications-empty { color: var(--eshn-text-muted); padding: 1.5rem 1rem; text-align: center; font-size: .9em; }
.eshn-account-main .eshn-notifications-list { background: var(--eshn-surface); border-radius: var(--eshn-radius); box-shadow: var(--eshn-shadow-sm); overflow: hidden; }
.eshn-account-main .eshn-notification-text { font-size: .95em; }

/* ---------- Top bar (registration + language) ---------- */
.eshn-topbar { background: var(--eshn-primary-dark); }
.eshn-topbar-row { display: flex; align-items: center; gap: 1.1rem; padding: .45rem 1rem; font-size: .82em; }
.eshn-topbar-account { display: inline-flex; align-items: center; gap: .45em; color: #fff; text-decoration: none; font-weight: 700; opacity: .95; transition: opacity .15s var(--eshn-ease); }
.eshn-topbar-account:hover,
.eshn-topbar-account:focus,
.eshn-topbar-account:visited { color: #fff; opacity: 1; text-decoration: underline; }
/* Deliberately reads as a distinct "feature" chip rather than another plain
   account link — a light pill (the site's own body background color)
   floating on the dark topbar, with blue text, instead of plain white text
   like Log In / Create a New Account, so it doesn't get lost next to them. */
.eshn-topbar-news {
	display: inline-flex;
	align-items: center;
	gap: .35em;
	background: var(--eshn-bg);
	color: var(--eshn-primary);
	font-weight: 700;
	text-decoration: none;
	padding: .3em .85em;
	border-radius: 999px;
	transition: filter .15s var(--eshn-ease), transform .15s var(--eshn-ease);
}
.eshn-topbar-news::before { content: "📰"; font-size: .95em; }
.eshn-topbar-news:hover,
.eshn-topbar-news:focus,
.eshn-topbar-news:visited { color: var(--eshn-primary); filter: brightness(.96); transform: translateY(-1px); }
.eshn-topbar-lang { margin-inline-start: auto; display: inline-flex; align-items: center; }
.eshn-topbar-lang .trp-language-switcher, .eshn-topbar-lang .trp-ls-shortcode-current-language { color: #fff; }

/* ---------- Language switcher ---------- */
.eshn-lang-switch { display: inline-flex; align-items: center; gap: .2em; background: rgba(255, 255, 255, .12); border-radius: 999px; padding: .2em; }
.eshn-lang-btn { color: rgba(255, 255, 255, .8); text-decoration: none; font-size: .82em; font-weight: 700; padding: .3em .7em; border-radius: 999px; transition: all .15s var(--eshn-ease); }
.eshn-lang-btn:hover { color: #fff; }
.eshn-lang-btn.is-active { background: #fff; color: var(--eshn-primary-dark); }
.eshn-footer-about .eshn-lang-switch { background: var(--eshn-surface-2); margin-top: 1rem; }
.eshn-footer-about .eshn-lang-btn { color: var(--eshn-text-muted); }
.eshn-footer-about .eshn-lang-btn.is-active { background: var(--eshn-primary); color: #fff; }

/* ---------- Free-to-post note (header, between search and post-ad button) ---------- */
.eshn-free-note {
	display: inline-flex;
	align-items: center;
	gap: .55em;
	white-space: nowrap;
	background: linear-gradient(135deg, #16a34a, #0d8a3d);
	color: #fff;
	font-size: .82em;
	font-weight: 700;
	padding: .5em 1em .5em .55em;
	border-radius: 999px;
	box-shadow: 0 3px 10px rgba(22, 163, 74, .3);
}
.eshn-free-note-icon {
	flex: 0 0 auto;
	width: 1.7em;
	height: 1.7em;
	border-radius: 999px;
	background: rgba(255, 255, 255, .22);
	display: flex;
	align-items: center;
	justify-content: center;
}
.eshn-free-note svg { flex: 0 0 auto; }

/* ---------- Category sidebar + two-column listing layout ---------- */
.eshn-cat-layout { display: grid; grid-template-columns: 264px 1fr; gap: 1.75rem; align-items: start; padding-bottom: .5rem; }
.eshn-cat-sidebar { background: var(--eshn-surface); border-radius: var(--eshn-radius); box-shadow: var(--eshn-shadow-sm); padding: 1rem 0; position: sticky; top: 90px; max-height: calc(100vh - 110px); overflow-y: auto; }
.eshn-cat-sidebar-title { font-size: 1rem; font-weight: 800; margin: 0 1.1rem .6rem; }
.eshn-cat-sidebar-list { list-style: none; margin: 0; padding: 0; }
.eshn-cat-sidebar-row { display: flex; align-items: center; }
.eshn-cat-sidebar-link { flex: 1; display: flex; align-items: center; gap: .6em; padding: .6em 1.1rem; text-decoration: none; color: var(--eshn-text); font-weight: 600; font-size: .9em; min-width: 0; transition: background-color .15s var(--eshn-ease), color .15s var(--eshn-ease); }
.eshn-cat-sidebar-link:hover { background: var(--eshn-surface-2); }
.eshn-cat-sidebar-link.is-active { color: var(--eshn-primary); background: var(--eshn-primary-light); }
.eshn-cat-sidebar-icon { font-size: 1.1em; width: 1.4em; flex: 0 0 auto; text-align: center; }
.eshn-cat-sidebar-toggle { flex: 0 0 auto; background: none; border: none; cursor: pointer; font-size: 1.1rem; color: var(--eshn-text-muted); width: 2.5em; height: 2.5em; display: flex; align-items: center; justify-content: center; transition: transform .2s var(--eshn-ease), color .15s var(--eshn-ease); }
.eshn-cat-sidebar-node.is-expanded > .eshn-cat-sidebar-row .eshn-cat-sidebar-toggle { transform: rotate(90deg); color: var(--eshn-primary); }
.eshn-cat-sidebar-children { list-style: none; margin: 0; padding: 0; display: none; }
.eshn-cat-sidebar-node.is-expanded > .eshn-cat-sidebar-children { display: block; }
/* Nested levels (Jobs > Vacancies > Full-Time Jobs, etc.) step in and shrink,
   recursively, however deep a branch goes — no per-depth PHP bookkeeping needed. */
.eshn-cat-sidebar-children .eshn-cat-sidebar-link { padding-inline-start: 2.3rem; font-size: .85em; color: var(--eshn-text-muted); font-weight: 500; }
.eshn-cat-sidebar-children .eshn-cat-sidebar-children .eshn-cat-sidebar-link { padding-inline-start: 3.5rem; font-size: .82em; }
.eshn-cat-sidebar-children .eshn-cat-sidebar-link.is-active { color: var(--eshn-primary); font-weight: 700; background: var(--eshn-primary-light); }
.eshn-cat-sidebar-children .eshn-cat-sidebar-icon { display: none; }
.eshn-cat-sidebar-children .eshn-cat-sidebar-toggle { width: 2.1em; height: 2.1em; font-size: 1em; }
.eshn-cat-main { min-width: 0; }
.eshn-cat-choose { color: var(--eshn-text-muted); margin: -.75rem 0 1.5rem; font-size: .9em; }

/* ---------- Avatar (topbar, seller card, messages) ----------
   Shared with the account sidebar's own bespoke avatar above: same fallback
   pattern (uploaded photo, else first-initial bubble) wherever a username is
   shown, via eshtarynow_avatar() in the plugin's helpers.php. */
.eshn-avatar { flex: 0 0 auto; border-radius: 999px; background: var(--eshn-primary); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; text-transform: uppercase; line-height: 1; }
.eshn-avatar-img { object-fit: cover; }
.eshn-avatar-sm { width: 1.7em; height: 1.7em; font-size: .85em; }
.eshn-avatar-md { width: 2.4em; height: 2.4em; font-size: 1rem; }

/* ---------- Account area (My Account / My Listings / Saved / Messages) ---------- */
.eshn-account-layout { display: grid; grid-template-columns: 240px 1fr; gap: 1.75rem; align-items: start; }
.eshn-account-main { min-width: 0; }
.eshn-account-sidebar { background: var(--eshn-surface); border-radius: var(--eshn-radius); box-shadow: var(--eshn-shadow-sm); position: sticky; top: 90px; max-height: calc(100vh - 110px); overflow-y: auto; }
.eshn-account-sidebar-user { display: flex; align-items: center; gap: .7em; padding: 1.1rem; border-bottom: 1px solid var(--eshn-border); font-weight: 700; }
.eshn-account-sidebar-avatar { flex: 0 0 auto; width: 2.4em; height: 2.4em; border-radius: 999px; background: var(--eshn-primary); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 1rem; text-transform: uppercase; }
.eshn-account-sidebar-avatar-img { object-fit: cover; }
.eshn-account-avatar-preview { display: block; width: 4em; height: 4em; object-fit: cover; border-radius: 999px; margin-bottom: .5em; box-shadow: var(--eshn-shadow-sm); }
.eshn-account-sidebar-list { list-style: none; margin: 0; padding: .5rem; display: flex; flex-direction: column; gap: .2rem; }
.eshn-account-sidebar-list a { display: flex; align-items: center; gap: .65em; padding: .65em .8em; border-radius: var(--eshn-radius-sm); text-decoration: none; color: var(--eshn-text); font-weight: 600; font-size: .92em; transition: background-color .15s var(--eshn-ease), color .15s var(--eshn-ease); }
.eshn-account-sidebar-list a:hover { background: var(--eshn-surface-2); }
.eshn-account-sidebar-list a.is-active { background: var(--eshn-primary-light); color: var(--eshn-primary); }
.eshn-account-sidebar-icon { flex: 0 0 auto; font-size: 1.05em; width: 1.3em; text-align: center; }
.eshn-account-sidebar-logout { color: var(--eshn-danger) !important; }
.eshn-account-settings-title { font-size: 1.05rem; font-weight: 800; margin: 1.75rem 0 1rem; padding-top: 1.5rem; border-top: 1px solid var(--eshn-border); }
@media (max-width: 900px) {
	.eshn-account-layout { grid-template-columns: 1fr; }
}

/* ---------- Filter bar (replaces the old plain category links bar) ---------- */
.eshn-filter-bar-wrap { background: var(--eshn-surface-2); border-top: 1px solid var(--eshn-border); }
.eshn-filter-bar { display: flex; flex-wrap: wrap; align-items: end; gap: .85rem; padding: .85rem 1rem; }
.eshn-filter-field { display: flex; flex-direction: column; gap: .3em; flex: 1 1 150px; min-width: 130px; }
.eshn-filter-field-narrow { flex: 0 1 100px; min-width: 90px; }
.eshn-filter-field label { font-size: .75em; font-weight: 600; color: var(--eshn-text-muted); }
.eshn-filter-field select, .eshn-filter-field input {
	padding: .55em .7em;
	border: 1px solid var(--eshn-border);
	border-radius: var(--eshn-radius-sm);
	font: inherit;
	font-size: .9em;
	background: var(--eshn-surface);
	transition: border-color .15s var(--eshn-ease), box-shadow .15s var(--eshn-ease);
}
.eshn-filter-field select:focus, .eshn-filter-field input:focus { outline: none; border-color: var(--eshn-primary); box-shadow: 0 0 0 3px rgba(53, 89, 233, .12); }
.eshn-filter-submit { flex: 0 0 auto; white-space: nowrap; }

/* Language switcher (TranslatePress) tidy-up */
.trp-language-switcher { display: inline-flex; align-items: center; }

/* ---------- Hero ---------- */
.eshn-hero {
	position: relative;
	background:
		linear-gradient(160deg, rgba(16, 22, 43, .88) 0%, rgba(16, 22, 43, .72) 45%, rgba(53, 89, 233, .55) 100%),
		url('../img/hero-bg-mobile.jpg');
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	color: #fff;
	padding: 3.5rem 0 3rem;
	text-align: center;
}
@media (min-width: 700px) {
	.eshn-hero { background-image:
		linear-gradient(160deg, rgba(16, 22, 43, .88) 0%, rgba(16, 22, 43, .7) 45%, rgba(53, 89, 233, .5) 100%),
		url('../img/hero-bg.jpg');
	padding: 5rem 0 4rem; }
}
.eshn-hero-inner { position: relative; }
.eshn-hero-eyebrow { display: inline-block; background: rgba(255, 255, 255, .14); border: 1px solid rgba(255, 255, 255, .25); padding: .4em 1.1em; border-radius: 999px; font-size: .8em; font-weight: 700; letter-spacing: .02em; margin-bottom: 1.1rem; backdrop-filter: blur(4px); }
.eshn-hero h1 { font-size: 2.35rem; margin: 0 0 .6rem; font-weight: 800; text-shadow: 0 2px 10px rgba(0, 0, 0, .25); letter-spacing: -.02em; }
.eshn-hero p { opacity: .95; max-width: 40em; margin: 0 auto 2rem; font-size: 1.08em; text-shadow: 0 1px 4px rgba(0, 0, 0, .2); }

.eshn-hero-search {
	background: var(--eshn-surface);
	border-radius: var(--eshn-radius-lg);
	padding: .6rem;
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
	box-shadow: var(--eshn-shadow-lg);
	max-width: 900px;
	margin: 0 auto;
	text-align: start;
}
.eshn-hero-search-field { flex: 1 1 160px; min-width: 140px; display: flex; align-items: center; border-inline-end: 1px solid var(--eshn-border); }
.eshn-hero-search-field:last-of-type { border-inline-end: none; }
.eshn-hero-search-field select, .eshn-hero-search-field input {
	width: 100%;
	border: none;
	background: transparent;
	font: inherit;
	color: var(--eshn-text);
	padding: .75em .9em;
}
.eshn-hero-search-field select:focus, .eshn-hero-search-field input:focus { outline: none; }
.eshn-hero-search-btn { flex: 0 0 auto; font-size: 1em; padding: .85em 2em; border-radius: var(--eshn-radius); }
@media (max-width: 700px) {
	.eshn-hero-search { flex-direction: column; padding: .75rem; }
	.eshn-hero-search-field { border-inline-end: none; border-bottom: 1px solid var(--eshn-border); }
	.eshn-hero-search-btn { width: 100%; }
}

.eshn-hero-stats { display: flex; justify-content: center; flex-wrap: wrap; gap: 2.25rem; margin-top: 2.25rem; }
.eshn-hero-stat { display: flex; flex-direction: column; align-items: center; gap: .1rem; }
.eshn-hero-stat strong { font-size: 1.4rem; font-weight: 800; }
.eshn-hero-stat span { font-size: .78em; opacity: .85; text-transform: uppercase; letter-spacing: .04em; }

/* ---------- Section heads ---------- */
.eshn-section-head { text-align: center; max-width: 40em; margin: 0 auto 2rem; }
.eshn-section-head h2 { font-size: 1.6rem; font-weight: 800; margin: 0 0 .4rem; letter-spacing: -.01em; }
.eshn-section-head p { color: var(--eshn-text-muted); margin: 0; }
.eshn-latest .eshn-section-head, .eshn-related .eshn-section-head { text-align: start; margin: 0 0 1.5rem; max-width: none; }

/* ---------- Economy News (homepage strip) ---------- */
.eshn-economy-news { padding: 2rem 0 0; }

/* ---------- Category tiles ---------- */
.eshn-categories { padding: 3.5rem 0 1rem; }
.eshn-cat-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 1.1rem; }
.eshn-cat-tile {
	background: var(--eshn-surface);
	border-radius: var(--eshn-radius);
	padding: 1.6rem 1rem 1.4rem;
	text-align: center;
	text-decoration: none;
	color: var(--eshn-text);
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: .55rem;
	box-shadow: var(--eshn-shadow-sm);
	border: 1px solid var(--eshn-border);
	transition: transform .18s var(--eshn-ease), box-shadow .18s var(--eshn-ease), border-color .18s var(--eshn-ease);
}
.eshn-cat-tile:hover { transform: translateY(-5px); box-shadow: var(--eshn-shadow-lg); border-color: transparent; }
.eshn-cat-icon {
	font-size: 1.7rem;
	width: 58px;
	height: 58px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--eshn-primary-light);
	color: var(--eshn-primary);
	border-radius: 999px;
	transition: transform .18s var(--eshn-ease);
}
.eshn-cat-tile:hover .eshn-cat-icon { transform: scale(1.08); }
.eshn-cat-name { font-size: .88em; font-weight: 700; }
.eshn-cat-count { font-size: .75em; color: var(--eshn-text-muted); }
/* Rotating accent palette so the grid reads as colorful, not monochrome */
.eshn-cat-tile:nth-child(6n+1) .eshn-cat-icon { background: #eaefff; color: #3559e9; }
.eshn-cat-tile:nth-child(6n+2) .eshn-cat-icon { background: #fff1e9; color: #ff6a3d; }
.eshn-cat-tile:nth-child(6n+3) .eshn-cat-icon { background: #eafbf3; color: #0f9d5e; }
.eshn-cat-tile:nth-child(6n+4) .eshn-cat-icon { background: #f3eeff; color: #8b5cf6; }
.eshn-cat-tile:nth-child(6n+5) .eshn-cat-icon { background: #ffeef0; color: #f43f5e; }
.eshn-cat-tile:nth-child(6n+6) .eshn-cat-icon { background: #e8fbfb; color: #0891b2; }

/* ---------- Listing grid / cards ---------- */
.eshn-latest { padding: 1.5rem 0 3.5rem; }
.eshn-featured { padding: 1rem 0 1rem; }
.eshn-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 1.4rem; }
.eshn-card {
	position: relative;
	background: var(--eshn-surface);
	border-radius: var(--eshn-radius);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	box-shadow: var(--eshn-shadow-sm);
	border: 1px solid var(--eshn-border);
	transition: transform .2s var(--eshn-ease), box-shadow .2s var(--eshn-ease), border-color .2s var(--eshn-ease);
}
.eshn-card:hover { transform: translateY(-5px); box-shadow: var(--eshn-shadow-lg); border-color: transparent; }
.eshn-card-featured { border-color: var(--eshn-accent); box-shadow: 0 0 0 1px var(--eshn-accent), var(--eshn-shadow-sm); }
.eshn-card-featured:hover { box-shadow: 0 0 0 1px var(--eshn-accent), var(--eshn-shadow-lg); }
.eshn-card-media { position: relative; display: block; aspect-ratio: 4/3; background: var(--eshn-surface-2); overflow: hidden; }
.eshn-card-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s var(--eshn-ease); }
.eshn-card:hover .eshn-card-media img { transform: scale(1.06); }
.eshn-card-placeholder { object-fit: contain !important; padding: 12%; box-sizing: border-box; background: var(--eshn-surface-2); }
.eshn-card-badges { position: absolute; top: .65em; inset-inline-start: .65em; display: flex; flex-direction: column; gap: .35em; align-items: flex-start; }
.eshn-card-badge { display: inline-block; font-size: .68em; font-weight: 800; letter-spacing: .02em; text-transform: uppercase; padding: .3em .65em; border-radius: 5px; color: #fff; box-shadow: var(--eshn-shadow-sm); }
.eshn-card-badge-featured { background: var(--eshn-accent); }
.eshn-card-badge-new { background: var(--eshn-primary); }
.eshn-card-badge-sold { background: #64748b; }
.eshn-card-fav { position: absolute; top: .65em; inset-inline-end: .65em; z-index: 2; }
.eshn-fav-btn-compact { padding: 0; width: 32px; height: 32px; border-radius: 999px; border: none; background: rgba(255, 255, 255, .92); backdrop-filter: blur(2px); justify-content: center; box-shadow: var(--eshn-shadow-sm); }
.eshn-fav-btn-compact .eshn-fav-label, .eshn-fav-btn-compact .eshn-fav-count { display: none; }
.eshn-fav-btn-compact .eshn-fav-icon { font-size: 1.05em; }
.eshn-status-pill { display: inline-block; font-size: .72em; font-weight: 700; padding: .25em .7em; border-radius: 999px; box-shadow: var(--eshn-shadow-sm); }
.eshn-status-pill-sold { background: #b02a1c; color: #fff; }
.eshn-status-pill-available { background: var(--eshn-success); color: #fff; }
.eshn-status-pill-lg { font-size: .9em; padding: .4em 1em; }
.eshn-status-badge { position: absolute; top: .6em; inset-inline-start: .6em; }
.eshn-card-body { padding: .9rem 1rem 1.1rem; display: flex; flex-direction: column; gap: .3rem; }
.eshn-card-cat { color: var(--eshn-primary); font-weight: 700; font-size: .72em; text-transform: uppercase; letter-spacing: .03em; }
.eshn-card-title { font-weight: 700; text-decoration: none; color: var(--eshn-text); font-size: .98em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-top: .1em; }
.eshn-card-price { color: var(--eshn-secondary); font-weight: 800; font-size: 1.15em; margin-top: .1em; }
.eshn-card-addr { display: flex; align-items: center; gap: .35em; font-size: .78em; color: var(--eshn-text-muted); margin-top: .3em; }
.eshn-card-addr svg { flex: 0 0 auto; opacity: .7; }
.eshn-card-meta { display: flex; justify-content: space-between; align-items: center; gap: .5em; font-size: .78em; color: var(--eshn-text-muted); margin-top: .15em; }
/* ---------- Economy News cards ----------
   Same card language as .eshn-card (listings) but a simpler body — just a
   title and a "Read More" link, matching a news-widget layout rather than
   an ad card. .eshn-news-grid-compact (homepage strip) shrinks the media
   height and type scale; the plain .eshn-news-grid (News page) stays full
   size. */
.eshn-news-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 1.4rem; }
.eshn-news-card {
	position: relative;
	background: var(--eshn-surface);
	border-radius: var(--eshn-radius);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	box-shadow: var(--eshn-shadow-sm);
	border: 1px solid var(--eshn-border);
	border-top: 3px solid var(--eshn-primary);
	transition: transform .2s var(--eshn-ease), box-shadow .2s var(--eshn-ease), border-color .2s var(--eshn-ease);
}
/* border-top-color stays blue on hover — only the other three sides fade
   into the box-shadow the way every other card on the site already does. */
.eshn-news-card:hover { transform: translateY(-5px); box-shadow: var(--eshn-shadow-lg); border-color: transparent; border-top-color: var(--eshn-primary); }
.eshn-news-card-media { display: block; aspect-ratio: 16/9; background: var(--eshn-surface-2); overflow: hidden; }
.eshn-news-card-media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .35s var(--eshn-ease); }
.eshn-news-card:hover .eshn-news-card-media img { transform: scale(1.06); }
.eshn-news-card-noimg { display: flex; align-items: center; justify-content: center; font-size: 2.4rem; }
.eshn-news-card-body { padding: 1.1rem 1.2rem 1.3rem; display: flex; flex-direction: column; gap: .6rem; flex: 1; }
.eshn-news-card-title { margin: 0; font-size: 1.05rem; font-weight: 700; line-height: 1.4; }
.eshn-news-card-title a { color: var(--eshn-text); text-decoration: none; }
.eshn-news-card-title a:hover { color: var(--eshn-primary); }

/* News page (plain .eshn-news-grid, not the homepage's -compact variant):
   no thumbnail/icon block at all, just the text card. */
.eshn-news-grid:not(.eshn-news-grid-compact) .eshn-news-card-media { display: none; }
.eshn-news-card-more { margin-top: auto; align-self: flex-start; display: inline-flex; align-items: center; gap: .4em; font-weight: 700; font-size: .88em; color: var(--eshn-primary); }
.eshn-news-card-more:hover { text-decoration: underline; }

/* Compact homepage strip: a horizontal card (icon/thumb beside the text,
   not stacked above it) keeps the whole row short regardless of column
   width. The round icon badge reuses .eshn-cat-icon's exact treatment
   (size, tint, pill shape) so this strip reads as the same design system
   as the category tiles just above it, rather than a bolted-on component. */
.eshn-news-grid-compact {
	/* auto-fit instead of the base rule's auto-fill: with exactly 3 cards,
	   auto-fill reserves empty phantom tracks on wide screens and the real
	   cards never stretch past their minmax minimum, leaving them bunched
	   short of the full container width. auto-fit collapses those empty
	   tracks and stretches the 3 real cards to fill the row edge-to-edge,
	   while still wrapping down to fewer columns on narrow viewports. */
	grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
	gap: 1rem;
}
.eshn-news-grid-compact .eshn-news-card {
	flex-direction: row;
	align-items: center;
	gap: .85rem;
	padding: .85rem 1.1rem;
}
.eshn-news-grid-compact .eshn-news-card-media {
	flex: 0 0 auto;
	width: 52px;
	height: 52px;
	aspect-ratio: auto;
	border-radius: 999px;
	background: var(--eshn-primary-light);
}
.eshn-news-grid-compact .eshn-news-card-media img { border-radius: 999px; }
.eshn-news-grid-compact .eshn-news-card-noimg { font-size: 1.3rem; color: var(--eshn-primary); }
.eshn-news-grid-compact .eshn-news-card-body { padding: 0; gap: .3rem; min-width: 0; flex: 1; }
.eshn-news-grid-compact .eshn-news-card-title {
	font-size: .86rem;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.eshn-news-grid-compact .eshn-news-card-more { font-size: .74em; }

/* ---------- Single Economy News article ----------
   A dedicated reading layout distinct from the listing pages: a centered,
   readable column rather than the site's usual wide grid. */
.eshn-news-single { max-width: 46em; padding-top: 2rem; padding-bottom: 1rem; }
.eshn-news-single-title {
	font-size: 2rem;
	line-height: 1.3;
	margin: 0 0 .5rem;
	padding-bottom: 1rem;
	border-bottom: 3px solid var(--eshn-primary);
}
.eshn-news-single-date { color: var(--eshn-text-muted); font-size: .9em; margin: 1rem 0 1.5rem; }
.eshn-news-single-media { border-radius: var(--eshn-radius); overflow: hidden; margin-bottom: 1.5rem; }
.eshn-news-single-media img { width: 100%; height: auto; display: block; }
.eshn-news-single-content { font-size: 1.05em; line-height: 1.85; color: var(--eshn-text); }
.eshn-news-single-content p { margin: 0 0 1.3em; }

.eshn-empty { color: var(--eshn-text-muted); padding: 3rem 0; text-align: center; font-size: 1.05em; }

/* ---------- Listing results (archive/category/search) ---------- */
.eshn-listing-results { padding: 0 0 3.5rem; }
.eshn-listing-results h1 { font-size: 1.5rem; font-weight: 800; margin: .5rem 0 1.5rem; }
.eshn-breadcrumbs { font-size: .85em; color: var(--eshn-text-muted); padding-top: 1.25rem; }
.eshn-breadcrumbs a { color: var(--eshn-text-muted); text-decoration: none; }
.eshn-breadcrumbs a:hover { color: var(--eshn-primary); }
.eshn-pagination ul { list-style: none; display: flex; gap: .5em; padding: 0; margin: 2rem 0 0; flex-wrap: wrap; }
.eshn-pagination a, .eshn-pagination span { display: inline-block; padding: .5em .9em; border-radius: var(--eshn-radius-sm); text-decoration: none; color: var(--eshn-text); background: var(--eshn-surface); box-shadow: var(--eshn-shadow-sm); transition: all .15s var(--eshn-ease); }
.eshn-pagination a:hover { transform: translateY(-2px); box-shadow: var(--eshn-shadow-md); }
.eshn-pagination .current { background: var(--eshn-primary); color: #fff; box-shadow: none; }

/* ---------- Single listing ---------- */
.eshn-single-layout { display: grid; grid-template-columns: 1fr 300px; gap: 2rem; padding: 1.25rem 0 2.5rem; align-items: start; }
.eshn-gallery-main { position: relative; aspect-ratio: 4/3; background: var(--eshn-surface-2); border-radius: var(--eshn-radius); overflow: hidden; display: flex; align-items: center; justify-content: center; box-shadow: var(--eshn-shadow-sm); }
.eshn-gallery-main img { width: 100%; height: 100%; object-fit: cover; }
.eshn-gallery-thumbs { display: flex; gap: .6rem; margin-top: .7rem; flex-wrap: wrap; }
.eshn-gallery-thumbs img { width: 74px; height: 74px; object-fit: cover; border-radius: var(--eshn-radius-sm); box-shadow: var(--eshn-shadow-sm); cursor: pointer; transition: transform .15s var(--eshn-ease); }
.eshn-gallery-thumbs img:hover { transform: translateY(-2px); }
.eshn-single-title { margin: 1.25rem 0 .35rem; font-size: 1.6rem; font-weight: 800; }
.eshn-single-price { color: var(--eshn-primary); font-size: 1.5rem; font-weight: 800; margin-bottom: 1.25rem; }
.eshn-single-actions { display: flex; align-items: center; gap: 1.5rem; margin-bottom: 1.75rem; flex-wrap: wrap; }
.eshn-details-table { width: 100%; border-collapse: collapse; margin-bottom: 1.75rem; background: var(--eshn-surface); border-radius: var(--eshn-radius); overflow: hidden; box-shadow: var(--eshn-shadow-sm); }
.eshn-details-table th, .eshn-details-table td { text-align: start; padding: .75em .9em; border-bottom: 1px solid var(--eshn-border); }
.eshn-details-table tr:last-child th, .eshn-details-table tr:last-child td { border-bottom: none; }
.eshn-details-table th { color: var(--eshn-text-muted); font-weight: 600; width: 40%; }
.eshn-single-description { line-height: 1.75; }
.eshn-seller-card { background: var(--eshn-surface); border-radius: var(--eshn-radius); padding: 1.35rem; position: sticky; top: 90px; box-shadow: var(--eshn-shadow-md); }
.eshn-seller-name { display: inline-flex; align-items: center; gap: .5em; font-weight: 700; margin: .2em 0; font-size: 1.05em; }
.eshn-seller-phone { margin: .5em 0 1.1em; }
.eshn-related { padding-bottom: 3.5rem; }

/* ---------- Narrow content (forms, account) ---------- */
.eshn-narrow { max-width: 640px; padding-top: 1.75rem; padding-bottom: 3.5rem; }
.eshn-narrow h1 { font-size: 1.55rem; font-weight: 800; }
.eshn-legal-page { max-width: 760px; line-height: 1.8; }
.eshn-legal-updated { color: var(--eshn-text-muted); font-size: .88em; margin: -.5rem 0 2rem; }
.eshn-legal-page h2 { font-size: 1.15rem; font-weight: 800; margin: 2rem 0 .6rem; }
.eshn-legal-page p { margin: 0 0 1rem; color: var(--eshn-text); }
.eshn-legal-page ul { margin: 0 0 1rem; padding-inline-start: 1.4rem; }
.eshn-legal-page li { margin-bottom: .4rem; }

/* ---------- Ad zones (only rendered when explicitly enabled) ---------- */
.eshn-ad-zone { margin: 1rem 0; }
.eshn-ad-slot { border: 1px dashed var(--eshn-border); border-radius: var(--eshn-radius-sm); padding: 1rem; text-align: center; color: var(--eshn-text-muted); font-size: .8em; background: var(--eshn-surface-2); }

/* ---------- Latest Ads bar (one per category) ---------- */
.eshn-latest-ads-bar { background: var(--eshn-surface); border-top: 1px solid var(--eshn-border); border-bottom: 1px solid var(--eshn-border); padding: 2.25rem 0; }
.eshn-latest-ads-bar h2 { font-size: 1.25rem; margin: 0 0 1.25rem; font-weight: 700; }
.eshn-latest-ads-wrap { position: relative; display: flex; align-items: center; gap: .5rem; }
.eshn-latest-ads-row { display: flex; gap: 1rem; overflow-x: auto; padding: .1rem .1rem 1rem; scroll-snap-type: x proximity; scroll-behavior: smooth; flex: 1; scrollbar-width: none; }
.eshn-latest-ads-row::-webkit-scrollbar { display: none; }
.eshn-ads-arrow {
	flex: 0 0 auto;
	width: 40px;
	height: 40px;
	border-radius: 999px;
	border: 1px solid var(--eshn-border);
	background: var(--eshn-surface);
	color: var(--eshn-text);
	font-size: 1.3rem;
	line-height: 1;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: var(--eshn-shadow-sm);
	transition: all .15s var(--eshn-ease);
}
.eshn-ads-arrow:hover { background: var(--eshn-primary); border-color: var(--eshn-primary); color: #fff; box-shadow: var(--eshn-shadow-md); transform: translateY(-2px); }
/* No RTL transform needed: ‹ › are Unicode bidi-mirrored characters, so browsers
   already flip their glyph automatically inside an RTL context — combined with
   flexbox's automatic start/end reversal in RTL, this alone makes the prev button
   (first in DOM, placed on the visual right in RTL) point right/outward, and the
   next button (last in DOM, placed on the visual left) point left/outward. */
.eshn-latest-ad-card { flex: 0 0 165px; scroll-snap-align: start; background: var(--eshn-surface); border-radius: var(--eshn-radius); overflow: hidden; text-decoration: none; color: var(--eshn-text); display: flex; flex-direction: column; box-shadow: var(--eshn-shadow-sm); transition: transform .18s var(--eshn-ease), box-shadow .18s var(--eshn-ease); }
.eshn-latest-ad-card:hover { transform: translateY(-3px); box-shadow: var(--eshn-shadow-md); }
.eshn-latest-ad-media { display: block; aspect-ratio: 4/3; background: var(--eshn-surface-2); overflow: hidden; }
.eshn-latest-ad-media img { width: 100%; height: 100%; object-fit: cover; }
.eshn-latest-ad-cat { font-size: .72em; color: var(--eshn-text-muted); padding: .6em .7em 0; font-weight: 500; }
.eshn-latest-ad-title { font-size: .85em; font-weight: 700; padding: .15em .7em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.eshn-latest-ad-price { font-size: .8em; color: var(--eshn-primary); font-weight: 800; padding: 0 .7em .7em; }

/* ---------- CTA band ---------- */
.eshn-cta-band { background: var(--eshn-gradient); color: #fff; padding: 3.5rem 0; margin-top: 1rem; }
.eshn-cta-band-inner { text-align: center; }
.eshn-cta-band-text { max-width: 34em; margin: 0 auto; }
.eshn-cta-band h2 { font-size: 1.7rem; font-weight: 800; margin: 0 0 .6rem; }
.eshn-cta-band p { opacity: .92; margin: 0 0 1.25rem; }
.eshn-cta-band-points { list-style: none; margin: 0 0 1.75rem; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 1.25rem; font-size: .88em; font-weight: 600; }
.eshn-cta-band-points li { display: flex; align-items: center; gap: .4em; }
.eshn-cta-band-points li::before { content: "✓"; display: inline-flex; align-items: center; justify-content: center; width: 1.3em; height: 1.3em; border-radius: 999px; background: rgba(255, 255, 255, .18); font-size: .85em; }
.eshn-cta-band .eshn-btn { font-size: 1.05em; padding: .85em 2em; box-shadow: var(--eshn-shadow-lg); }

/* ---------- Footer ---------- */
.eshn-footer { padding: 3.5rem 0 1.5rem; background: var(--eshn-secondary); color: rgba(255, 255, 255, .82); }
.eshn-footer-grid { display: grid; grid-template-columns: 1.3fr 1fr 1fr 1.1fr 1.1fr; gap: 2.25rem; padding-bottom: 2.5rem; }
.eshn-footer-col h3 { color: #fff; font-size: .95em; font-weight: 700; margin: 0 0 1rem; }
.eshn-footer-about p { font-size: .9em; line-height: 1.7; margin: .9rem 0 0; max-width: 30em; }
.eshn-footer .eshn-logo-footer { color: #fff; background: #fff; padding: .5em .9em; border-radius: var(--eshn-radius-sm); box-shadow: var(--eshn-shadow-sm); }
.eshn-footer .eshn-logo-footer img { height: 34px; }
.eshn-footer-hero { padding: 2rem 0; background: var(--eshn-bg); }
.eshn-footer-col ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .65rem; }
.eshn-footer-col ul a { color: rgba(255, 255, 255, .78); text-decoration: none; font-size: .9em; transition: color .15s var(--eshn-ease); }
.eshn-footer-col ul a:hover { color: #fff; }
.eshn-footer-note { font-size: .88em; line-height: 1.6; margin: 0 0 1.1rem; }
.eshn-footer-contact li { display: flex; align-items: center; gap: .65em; }
.eshn-footer-contact a, .eshn-footer-contact span:not(.eshn-footer-contact-icon) { color: rgba(255, 255, 255, .78); text-decoration: none; font-size: .9em; }
.eshn-footer-contact a:hover { color: #fff; }
.eshn-footer-contact-icon {
	flex: 0 0 auto;
	width: 2em;
	height: 2em;
	border-radius: 999px;
	background: rgba(255, 255, 255, .12);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
}
.eshn-footer-bottom { text-align: center; padding-top: 1.5rem; margin-top: 0; border-top: 1px solid rgba(255, 255, 255, .12); }
.eshn-footer-bottom p { color: rgba(255, 255, 255, .6); font-size: .8em; margin: 0; }

/* "Submit a Complaint" — inside Technical Support, but deliberately not
   styled like its plain icon links, so it still reads as its own thing. */
.eshn-footer-complaint {
	display: flex;
	width: fit-content;
	align-items: center;
	gap: .55em;
	margin-top: 1.1rem;
	padding: .6em 1.2em;
	border: none;
	border-radius: 999px;
	background: #fff;
	color: var(--eshn-primary);
	text-decoration: none;
	font-size: .85em;
	font-weight: 700;
	box-shadow: var(--eshn-shadow-sm);
	transition: background-color .15s var(--eshn-ease), color .15s var(--eshn-ease), transform .15s var(--eshn-ease);
}
.eshn-footer-complaint:hover { background: var(--eshn-primary-light); color: var(--eshn-primary-dark); transform: translateY(-1px); }
.eshn-footer-complaint-icon { display: flex; }

/* ---------- Country picker modal (first visit) ---------- */
body.eshn-modal-open { overflow: hidden; }
.eshn-modal-overlay {
	position: fixed;
	inset: 0;
	background: rgba(16, 22, 43, .55);
	backdrop-filter: blur(2px);
	z-index: 200;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 1.25rem;
}
.eshn-modal-overlay[hidden] { display: none; }
.eshn-modal {
	position: relative;
	background: var(--eshn-surface);
	border-radius: var(--eshn-radius-lg);
	box-shadow: var(--eshn-shadow-lg);
	padding: 2.25rem 2rem;
	max-width: 560px;
	width: 100%;
	max-height: 85vh;
	overflow-y: auto;
	text-align: center;
}
.eshn-modal-close {
	position: absolute;
	top: 1rem;
	inset-inline-end: 1rem;
	width: 2.2em;
	height: 2.2em;
	border-radius: 999px;
	border: none;
	background: var(--eshn-surface-2);
	color: var(--eshn-text-muted);
	font-size: 1.3rem;
	line-height: 1;
	cursor: pointer;
	transition: background-color .15s var(--eshn-ease), color .15s var(--eshn-ease);
}
.eshn-modal-close:hover { background: var(--eshn-border); color: var(--eshn-text); }
.eshn-modal-icon { font-size: 2.4rem; display: block; margin-bottom: .5rem; }
.eshn-modal h2 { font-size: 1.35rem; font-weight: 800; margin: 0 0 .4rem; }
.eshn-modal p { color: var(--eshn-text-muted); margin: 0 0 1.5rem; }
.eshn-country-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: .7rem; text-align: start; }
.eshn-country-option {
	display: flex;
	align-items: center;
	gap: .55em;
	padding: .65em .8em;
	border: 1px solid var(--eshn-border);
	border-radius: var(--eshn-radius-sm);
	background: var(--eshn-surface);
	cursor: pointer;
	font: inherit;
	font-size: .88em;
	font-weight: 600;
	color: var(--eshn-text);
	transition: border-color .15s var(--eshn-ease), background-color .15s var(--eshn-ease), transform .15s var(--eshn-ease);
}
.eshn-country-option:hover { border-color: var(--eshn-primary); background: var(--eshn-primary-light); transform: translateY(-2px); }
.eshn-country-flag { width: 24px; height: 18px; object-fit: cover; border-radius: 3px; box-shadow: 0 0 0 1px rgba(0,0,0,.08); flex: 0 0 auto; }
.eshn-country-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 500px) {
	.eshn-country-grid { grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); }
}

/* ---------- 404 ---------- */
.eshn-404 { text-align: center; padding: 4rem 0; }

/* ---------- Responsive ---------- */
@media (max-width: 900px) {
	.eshn-single-layout { grid-template-columns: 1fr; }
	.eshn-seller-card { position: static; }
	.eshn-cat-layout { grid-template-columns: 1fr; }
	.eshn-cat-sidebar { position: static; max-height: none; }
}
@media (max-width: 900px) {
	.eshn-footer-grid { grid-template-columns: 1fr 1fr; }
}
/* Icon toolbar + collapsible nav: tablet gets the same treatment as phone,
   since the inline nav/search bar is too cramped from here down. */
@media (max-width: 900px) {
	/* nav-toggle gets a low order so it always lands right after the logo on
	   the header's first line — every panel it opens (order 3+) wraps onto
	   later lines below it, so opening/closing one never moves the toggle
	   itself. */
	.eshn-header-actions { display: none; width: 100%; flex-direction: column; align-items: stretch; gap: .5rem; order: 5; }
	.eshn-header-actions.is-open { display: flex; }
	.eshn-nav-toggle { display: block; order: 1; margin-inline-start: auto; }
	.eshn-search-form { display: none; order: 4; flex-basis: 100%; margin-top: .5rem; }
	.eshn-search-form.is-open { display: flex; }
	.eshn-mobile-tools { display: flex; gap: .5rem; order: 3; flex-basis: 100%; }
	.eshn-mobile-tool {
		flex: 1;
		display: flex;
		align-items: center;
		justify-content: center;
		gap: .4em;
		padding: .6em .5em;
		border: 1px solid var(--eshn-border);
		border-radius: var(--eshn-radius-sm);
		background: var(--eshn-surface);
		font: inherit;
		font-size: .82em;
		font-weight: 600;
		color: var(--eshn-text);
		cursor: pointer;
	}
	.eshn-mobile-tool[aria-expanded="true"] { border-color: var(--eshn-primary); color: var(--eshn-primary); background: var(--eshn-primary-light); }
	.eshn-cat-sidebar { display: none; }
	.eshn-cat-sidebar.is-open { display: block; }
	.eshn-filter-bar-wrap { display: none; }
	.eshn-filter-bar-wrap.is-open { display: block; }

	/* "My Account" menu: desktop keeps it out of the header entirely (see the
	   bare .eshn-header-account-menu rule); from here down it's the only
	   place it appears, reusing the account page's own sidebar design, so
	   drop the sticky/scroll behavior that only makes sense pinned beside
	   page content. */
	.eshn-header-account-menu { display: block; }
	.eshn-header-account-menu .eshn-account-sidebar { position: static; max-height: none; overflow: visible; }
	.eshn-account-layout .eshn-account-sidebar { display: none; }
}
@media (max-width: 700px) {
	.eshn-hero { padding: 2.75rem 0; }
	.eshn-hero h1 { font-size: 1.7rem; }
	.eshn-hero-stats { gap: 1.4rem; }
	.eshn-filter-bar { flex-direction: column; align-items: stretch; }
	.eshn-filter-field, .eshn-filter-field-narrow { flex: 1 1 auto; min-width: 0; }
	.eshn-filter-submit { width: 100%; }
	.eshn-topbar-row { font-size: .78em; gap: .8rem; flex-wrap: wrap; }
	.eshn-cat-bar-arrow { display: none; }
	.eshn-cta-band-points { flex-direction: column; align-items: center; gap: .6rem; }
	.eshn-footer-grid { grid-template-columns: 1fr; text-align: center; gap: 2rem; }
	.eshn-footer-col ul { align-items: center; }
	.eshn-footer-about p { margin-inline: auto; }
	.eshn-footer-complaint { margin-inline: auto; }
	.eshn-lang-switch { justify-content: center; }
}