/*
Theme Name: Naitrich Financial Blog Theme
Theme URI: https://naitrich.com/
Author: Naitrich
Author URI: https://naitrich.com/
Description: A premium Elementor-compatible WordPress theme for financial news, markets, mining, energy and technology publishers. Built for speed, editorial depth and capital markets coverage.
Version: 1.0.10
Requires at least: 5.6
Tested up to: 6.7
Requires PHP: 7.4
Text Domain: colitco-elementor
Tags: elementor, news, magazine, finance, custom-header, custom-logo, featured-images, threaded-comments, translation-ready
Update URI: false
*/

:root {
  --radius: 0.375rem;
  --navy: #0c1b22;
  --navy-deep: #071218;
  --gold: #f6c177;
  --gold-foreground: #071218;
  --background: #071218;
  --foreground: #f5f7fa;
  --surface: #0c1b22;
  --card: #10232c;
  --card-foreground: #f5f7fa;
  --primary: #0c1b22;
  --primary-foreground: #f5f7fa;
  --secondary: #10232c;
  --secondary-foreground: #f5f7fa;
  --muted: #0e1e27;
  --muted-foreground: #c8d5db;
  --accent: #77f7c5;
  --accent-foreground: #071218;
  --destructive: #ff6b6b;
  --destructive-foreground: #f5f7fa;
  --border: rgba(255,255,255,0.08);
  --bull: #52ffb8;
  --bear: #ff6b6b;
  --font-display: "Poppins", "IBM Plex Sans", ui-sans-serif, system-ui, sans-serif;
  --font-sans: "Inter", ui-sans-serif, system-ui, sans-serif;
  --font-headline: "Playfair Display", Georgia, serif;
  --font-data: "Sora", "IBM Plex Sans", monospace;
}

.dark {
  --gold: #f6c177;
  --gold-foreground: #071218;
  --background: #071218;
  --foreground: #f5f7fa;
  --surface: #0c1b22;
  --card: #10232c;
  --card-foreground: #f5f7fa;
  --primary: #0c1b22;
  --primary-foreground: #f5f7fa;
  --secondary: #10232c;
  --secondary-foreground: #f5f7fa;
  --muted: #0e1e27;
  --muted-foreground: #c8d5db;
  --accent: #77f7c5;
  --accent-foreground: #071218;
  --border: rgba(255,255,255,0.08);
  --bull: #52ffb8;
  --bear: #ff6b6b;
}

/* ─── Light Mode ─────────────────────────────────────────────────────────────── */
html:not(.dark) {
  --navy: #1B1B1B;
  --navy-deep: #151515;
  --background: #F5F5F3;
  --foreground: #151515;
  --surface: #FAFAF8;
  --card: #FFFFFF;
  --card-foreground: #151515;
  --primary: #1B1B1B;
  --primary-foreground: #FFFFFF;
  --secondary: #FFFFFF;
  --secondary-foreground: #151515;
  --muted: #FAFAF8;
  --muted-foreground: #A1A6A3;
  --accent: #67DCCB;
  --accent-foreground: #111111;
  --gold: #D2A458;
  --gold-foreground: #FFFFFF;
  --border: #E5E8E5;
  --bull: #4BC9B5;
  --bear: #D64545;
  --destructive: #D64545;
  --destructive-foreground: #FFFFFF;
}

* { box-sizing: border-box; border-color: var(--border); }
/* Inline SVGs (icons) align to text midline rather than baseline */
svg { vertical-align: middle; }
html { -webkit-font-smoothing: antialiased; scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--background);
  color: var(--foreground);
  font-family: var(--font-sans);
  font-feature-settings: "ss01", "cv11";
  transition: background 0.3s ease, color 0.2s ease;
}
body.admin-bar .site-header { top: 32px; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; height: auto; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; background: transparent; color: inherit; border: 0; }
h1,h2,h3,h4,h5 {
  font-family: var(--font-display); letter-spacing: -0.015em; margin: 0;
  overflow-wrap: break-word; word-break: break-word;
}
h1 { font-size: clamp(2rem, 4vw, 2.625rem); line-height: 1.1; font-weight: 700; }
h2 { font-size: clamp(1.625rem, 2.6vw, 1.875rem); line-height: 1.15; font-weight: 600; }
h3 { font-size: 1.375rem; line-height: 1.25; font-weight: 600; }
p { margin: 0; overflow-wrap: break-word; }

.container-fin { width: 100%; max-width: 1240px; margin-inline: auto; padding-inline: 1.25rem; }
.eyebrow { font-family: var(--font-display); font-size: 11px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--accent); }
/* Category eyebrow rendered as a link to its archive */
a.cat-link { text-decoration: none; cursor: pointer; transition: opacity .15s ease; }
a.cat-link:hover { text-decoration: underline; text-underline-offset: 2px; opacity: .85; }
.meta { font-size: 13px; color: var(--muted-foreground); }
.ticker-pill { display: inline-flex; align-items: center; gap: .375rem; padding: 2px 8px; border: 1px solid var(--border); border-radius: 4px; font-family: var(--font-display); font-size: 11px; font-weight: 600; letter-spacing: .04em; }
.gold-underline { background-image: linear-gradient(var(--gold), var(--gold)); background-size: 100% 2px; background-repeat: no-repeat; background-position: 0 100%; }
.card-fin { background: var(--card); border: 1px solid var(--border); border-radius: var(--radius); transition: box-shadow .25s ease, transform .25s ease, border-color .25s ease; }
.card-fin:hover { box-shadow: 0 10px 30px -12px rgba(7,18,24,.18); border-color: rgba(119,247,197,.5); }
.headline-link { transition: color .2s ease; }
.headline-link:hover, .group:hover .headline-link { color: var(--gold); }
.bg-primary { background: var(--primary); }
.bg-surface { background: var(--surface); }
.text-primary-foreground { color: var(--primary-foreground); }
.text-accent { color: var(--accent); }
.muted { color: var(--muted-foreground); }
.border-y { border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.rounded { border-radius: var(--radius); }
.rounded-lg { border-radius: .5rem; }
/* Visually hidden but available to screen readers & search engines. */
.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.grid { display: grid; }
.flex { display: flex; }
.hidden { display: none; }
.items-center { align-items: center; }
.items-start { align-items: flex-start; }
.items-end { align-items: flex-end; }
.justify-between { justify-content: space-between; }
.text-center { text-align: center; }
.uppercase { text-transform: uppercase; }
.tabular-nums { font-variant-numeric: tabular-nums; }
.line-clamp-2, .line-clamp-3 { display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; }
.line-clamp-2 { -webkit-line-clamp: 2; }
.line-clamp-3 { -webkit-line-clamp: 3; }
.aspect-16-10 { aspect-ratio: 16 / 10; }
.aspect-16-8 { aspect-ratio: 16 / 8; }
.aspect-4-3 { aspect-ratio: 4 / 3; }
.aspect-video { aspect-ratio: 16 / 9; }
.object-cover { width: 100%; height: 100%; object-fit: cover; }

.site-header { position: sticky; top: 0; z-index: 50; background: color-mix(in oklab, var(--background) 95%, transparent); border-bottom: 1px solid var(--border); transition: box-shadow .25s ease; }
/* Elevation once the page is scrolled (class toggled in theme.js) */
.site-header.is-scrolled { box-shadow: 0 6px 24px rgba(0,0,0,.18); }
/* When the header is rendered through Elementor's Theme Builder header location,
   make the location wrapper itself sticky so it pins reliably on scroll. */
.elementor-location-header { position: sticky; top: 0; z-index: 50; }
body.admin-bar .elementor-location-header { top: 32px; }
@media screen and (max-width: 782px) {
  body.admin-bar .elementor-location-header { top: 46px; }
}
/* Blur on ::before so backdrop-filter does NOT create a containing block for
   position:fixed children (the search overlay). */
.site-header::before { content: ""; position: absolute; inset: 0; backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); z-index: -1; pointer-events: none; }
.ticker-bar { background: var(--primary); color: var(--primary-foreground); border-bottom: 1px solid rgba(255,255,255,.1); overflow: hidden; }
.ticker-track { display: flex; white-space: nowrap; padding: .5rem 0; animation: ticker-scroll 60s linear infinite; }
.ticker-item { display: flex; align-items: center; gap: .5rem; padding: 0 1.25rem; font-size: 12px; font-weight: 500; font-family: var(--font-display); }
.ticker-symbol { color: rgba(255,255,255,.6); letter-spacing: .05em; }
.bull { color: var(--bull); }
.bear { color: var(--bear); }
.header-row { height: 5rem; display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; overflow: visible; }
.brand-wrap { display: flex; align-items: center; gap: .75rem; flex-shrink: 0; min-width: 0; }
.brand-logo { height: 3rem !important; max-height: 3rem !important; width: auto !important; max-width: min(220px, 40vw) !important; object-fit: contain; flex-shrink: 0; }
/* Prevent oversized logos from breaking header layout */
.brand-wrap a { display: flex; align-items: center; line-height: 0; }
/* Logo dark/light switching — use !important so Elementor img resets can't interfere */
.logo-light { display: none !important; }
.logo-dark  { display: block !important; }
.dark .logo-dark  { display: none  !important; }
.dark .logo-light { display: block !important; }
.nav-desktop { display: none; align-items: center; gap: 1.5rem; }
.nav-link { position: relative; padding: .5rem 0; color: #fff; font-size: 13px; font-family: var(--font-display); font-weight: 500; letter-spacing: .025em; }
.nav-link:hover, .nav-link.active { color: var(--foreground); }
.header-actions { display: flex; align-items: center; gap: .375rem; flex-shrink: 0; }
.icon-btn { width: 2.25rem; height: 2.25rem; display: inline-flex; align-items: center; justify-content: center; border-radius: 4px; color: inherit; }
.icon-btn:hover { color: var(--accent); }
.theme-toggle { border: 1px solid var(--border); margin-left: .25rem; }
.newsletter-btn { display: none; align-items: center; gap: .5rem; margin-left: .5rem; padding: .5rem 1rem; border: 1px solid var(--accent); color: var(--accent); font-size: 12px; font-family: var(--font-display); font-weight: 600; letter-spacing: .08em; text-transform: uppercase; border-radius: var(--radius); transition: .2s ease; }
.newsletter-btn:hover { background: var(--accent); color: var(--accent-foreground); }
/* Hamburger turns accent when menu is open — gives visual close feedback */
.site-header.menu-open .menu-toggle { color: var(--accent); border-color: var(--accent); }
.mobile-menu { display: none; border-top: 1px solid var(--border); background: var(--background); }
.mobile-menu.open { display: block; }
.mobile-grid { padding-block: .75rem; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .25rem; }
.mobile-grid a { display: block; padding: .625rem .75rem; font-size: .9375rem; font-weight: 500; color: var(--foreground); border-radius: var(--radius); transition: color .15s ease, background .15s ease; }
.mobile-grid a:hover, .mobile-grid a.active { color: var(--accent); background: rgba(119,247,197,.08); }

/* ─── Primary nav dropdowns (desktop) ────────────────────────────────────── */
.nav-item { position: relative; display: inline-flex; align-items: center; }
.nav-item.has-dropdown { padding-bottom: 0; }
/* Invisible bridge so the cursor can travel from the link to the panel */
.nav-item.has-dropdown::after {
  content: ''; position: absolute; top: 100%; left: 0; right: 0; height: 12px;
}
.nav-dropdown {
  position: absolute; top: calc(100% + 10px); left: 0; z-index: 200;
  min-width: 240px; max-width: 340px; padding: .5rem;
  background: var(--card); border: 1px solid var(--border);
  border-radius: var(--radius); box-shadow: 0 16px 38px rgba(0,0,0,.22);
  display: flex; flex-direction: column; gap: .125rem;
  opacity: 0; visibility: hidden; transform: translateY(6px);
  transition: opacity .18s ease, transform .18s ease, visibility .18s;
}
.nav-item:hover .nav-dropdown,
.nav-item:focus-within .nav-dropdown { opacity: 1; visibility: visible; transform: translateY(0); }
.nav-dropdown-link {
  display: block; padding: .5rem .7rem; border-radius: var(--radius);
  font: 500 .8125rem/1.35 var(--font-display); color: var(--foreground);
  white-space: normal; transition: color .15s ease, background .15s ease;
}
.nav-dropdown-link:hover { color: var(--accent); background: rgba(119,247,197,.08); }

/* ─── Primary nav accordion (mobile) ─────────────────────────────────────── */
.mobile-nav { grid-template-columns: 1fr; }
.mobile-nav .m-link {
  display: block; padding: .625rem .75rem; font: 500 .9375rem/1 var(--font-display);
  color: var(--foreground); border-radius: var(--radius);
  transition: color .15s ease, background .15s ease;
}
.mobile-nav .m-link:hover, .mobile-nav .m-link.active { color: var(--accent); background: rgba(119,247,197,.08); }
.m-group { border-radius: var(--radius); }
.m-summary {
  list-style: none; cursor: pointer; padding: .625rem .75rem;
  font: 600 .9375rem/1 var(--font-display); color: var(--foreground);
  display: flex; align-items: center; justify-content: space-between;
}
.m-summary::-webkit-details-marker { display: none; }
.m-summary::after { content: '\25BE'; font-size: 11px; opacity: .7; transition: transform .2s ease; }
.m-group[open] .m-summary::after { transform: rotate(180deg); }
.m-children { display: flex; flex-direction: column; padding: .125rem 0 .5rem .5rem; }
.m-children a {
  display: block; padding: .5rem .75rem; font-size: .875rem;
  color: var(--muted-foreground); border-radius: var(--radius);
  transition: color .15s ease, background .15s ease;
}
.m-children a:hover { color: var(--accent); background: rgba(119,247,197,.08); }

/* ─── Theme Toggle Icon ──────────────────────────────────────────────────── */
.tt-icon { display: flex; align-items: center; justify-content: center; }
/* Dark mode active → show sun (click to go light) */
.dark .tt-moon { display: none !important; }
html:not(.dark) .tt-sun { display: none !important; }

/* ─── Light Mode Component Overrides ────────────────────────────────────── */
html:not(.dark) .site-header { border-bottom-color: var(--border); }
html:not(.dark) .site-topbar { background: #FFFFFF; border-bottom-color: var(--border); }
html:not(.dark) .ticker-bar { background: #1B1B1B; }
html:not(.dark) .mobile-menu { background: #FFFFFF; border-top-color: var(--border); }
html:not(.dark) .search-overlay { background: rgba(245,245,243,0.96); }
html:not(.dark) .search-panel { background: #FFFFFF; border-color: var(--border); }
html:not(.dark) .sp-bar { background: #FAFAF8; border-color: var(--border); }
html:not(.dark) .sp-bar-input { color: var(--foreground); }
html:not(.dark) .site-header .icon-btn { color: #000; }
html:not(.dark) .icon-btn:hover { color: var(--accent); }
html:not(.dark) .theme-toggle { border-color: var(--border); color: #000; }
html:not(.dark) .subscribe-btn { border-color: var(--accent); color: var(--accent); }
html:not(.dark) .subscribe-btn:hover { background: var(--accent); color: var(--accent-foreground); }
html:not(.dark) .nav-link { color: #000; }
html:not(.dark) .nav-link:hover, html:not(.dark) .nav-link.active { color: var(--foreground); }
/* Footer always has dark background (#1B1B1B in light, #0c1b22 in dark) — always white text */
html:not(.dark) .footer-brand p,
html:not(.dark) .footer-contact,
html:not(.dark) .footer-contact a,
html:not(.dark) .footer-links a,
html:not(.dark) .footer-disclaimer p,
html:not(.dark) .footer-bottom-row p { color: #fff !important; }
html:not(.dark) .footer-col-title { color: #fff !important; }
html:not(.dark) .footer-links a:hover { color: var(--accent); }
html:not(.dark) .socials a, html:not(.dark) .socials .icon-btn { color: #fff; }
html:not(.dark) .lmn-breaking-card,
html:not(.dark) .lmn-breaking-time { color: #7A807D; }
html:not(.dark) .lmn-breaking-title { color: var(--foreground); }
html:not(.dark) .lmn-breaking-title:hover { color: var(--accent); }
html:not(.dark) .card-fin { box-shadow: 0 1px 3px rgba(0,0,0,0.06); }
html:not(.dark) .article-card-body .eyebrow { background: rgba(103,220,203,0.12); color: var(--accent); }
/* Topbar text in light — topbar has white background so use black */
html:not(.dark) .site-topbar-marquee-track { color: #000; }
html:not(.dark) .site-topbar-util-link { color: #000; }
html:not(.dark) .site-topbar-util-link:hover { color: var(--accent); }
html:not(.dark) .site-topbar-sep { color: #D8DDDA; }
html:not(.dark) .site-topbar-socials .icon-btn { color: #000; }
html:not(.dark) .menu-toggle { color: #000; }

/* ─── Dark Mode: Gray text → white (readability pass) ───────────────────────
   All selectors below had rgba(255,255,255, <0.8) or low-opacity values that
   rendered as gray on dark backgrounds. Only applies in dark mode (default).
   light mode already overrides what it needs via html:not(.dark) above.       */
.ticker-symbol { color: rgba(255,255,255,.92); }
.breadcrumbs { color: rgba(255,255,255,.88); }
.footer-links a { color: #fff; }
.socials a, .socials .icon-btn { color: #fff; }
/* Ticker market widget */
.colitco-mw-tick-item { color: rgba(255,255,255,.92); }
.colitco-mw-exch { color: rgba(255,255,255,.72); }
/* Breadcrumb trail */
.co-breadcrumb-link { color: rgba(255,255,255,.88); }
.co-breadcrumb-cur { color: rgba(255,255,255,.72); }
/* Company page */
.co-meta-item { color: rgba(255,255,255,.9); }
.co-price-label { color: rgba(255,255,255,.82); }
.co-tab { color: rgba(255,255,255,.88); }
.co-hero-logo-ph { color: rgba(255,255,255,.6); }
/* Article cards */
.rzcard-meta { color: rgba(255,255,255,.88); }
/* Hero section */
.hero-slide-region { color: rgba(255,255,255,.92); }
.hero-slide-byline { color: rgba(255,255,255,.9); }
/* Top stories */
.top-stories-all { color: rgba(255,255,255,.88); }
.top-story-region { color: rgba(255,255,255,.88); }
.top-story-byline { color: rgba(255,255,255,.88); }
/* Company band */
.company-band-desc { color: rgba(255,255,255,.9); }
/* Reserve / insight cards */
.reserved-card-cap { color: rgba(255,255,255,.9); }
.hp-insights-desc { color: rgba(255,255,255,.9); }
.hp-insight-byline { color: rgba(255,255,255,.9); }
/* Editorial cards */
.editorial-card-meta { color: rgb(255 255 255 / .88); }
.editorial-card-excerpt { color: rgb(255 255 255 / .9); }
.editorial-card-byline { color: rgb(255 255 255 / .88); }
/* Footer newsletter */
.footer-newsletter-desc { color: rgb(255 255 255 / .9); }
.footer-nl-input::placeholder { color: rgb(255 255 255 / .55); }
.footer-newsletter-note { color: rgb(255 255 255 / .65); }
/* Mining news dark filter bar */
.mn-bg-dark .mn-filter-label { color: rgba(255,255,255,.88); }
.mn-bg-dark .pill-filter { color: rgba(255,255,255,.92); }

/* ─── Top Bar ─────────────────────────────────────────────────────────────── */
.site-topbar { background: var(--card); border-bottom: 1px solid var(--border); padding: .375rem 0; font-size: 12px; }
.site-topbar-inner { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.site-topbar-left { display: flex; align-items: center; gap: .5rem; overflow: hidden; min-width: 0; flex: 1; }
.site-topbar-trending-label { color: var(--accent); font-weight: 700; font-family: var(--font-display); text-transform: uppercase; letter-spacing: .07em; white-space: nowrap; font-size: 11px; flex-shrink: 0; }
.site-topbar-marquee { overflow: hidden; flex: 1; min-width: 0; mask-image: linear-gradient(to right, transparent, black 4%, black 96%, transparent); -webkit-mask-image: linear-gradient(to right, transparent, black 4%, black 96%, transparent); }
.site-topbar-marquee-track { display: inline-block; white-space: nowrap; animation: topbar-scroll 40s linear infinite; color: #fff; }
@keyframes topbar-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.site-topbar-right { display: flex; align-items: center; gap: .875rem; flex-shrink: 0; }
.site-topbar-util-links { display: none; align-items: center; gap: .4rem; }
.site-topbar-util-link { color: #fff; font-size: 12px; transition: color .15s; white-space: nowrap; }
.site-topbar-util-link:hover { color: var(--foreground); }
.site-topbar-sep { color: var(--border); font-size: 11px; }
.site-topbar-socials { display: flex; align-items: center; gap: .1rem; }
.site-topbar-socials .icon-btn { width: 1.75rem; height: 1.75rem; color: #fff; }
.site-topbar-socials .icon-btn:hover { color: var(--accent); }
/* Logo tagline */
.logo-tagline { font-family: var(--font-display); font-size: 9px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--accent); white-space: nowrap; display: none; padding-left: .5rem; border-left: 1px solid var(--border); margin-left: .25rem; }
/* Nav caret */
.nav-link-caret { font-size: 9px; opacity: .75; margin-left: 2px; vertical-align: middle; }
/* Subscribe / user buttons */
.subscribe-btn { display: none; align-items: center; gap: .375rem; padding: .375rem .875rem; border: 1px solid var(--accent); color: var(--accent); border-radius: 4px; font-family: var(--font-display); font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; transition: background .15s, color .15s; white-space: nowrap; }
.subscribe-btn:hover { background: var(--accent); color: var(--accent-foreground); }
.user-btn { color: color-mix(in oklab, var(--foreground) 88%, transparent); }
.user-btn:hover { color: var(--foreground); }

/* ── Search — Command Palette ────────────────────────────────────────────── */
@keyframes sp-panel-in {
  from { opacity: 0; transform: translateY(-10px) scale(.98); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

.search-overlay {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 400;
  background: rgba(7,18,24,.82);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  align-items: flex-start;
  justify-content: center;
  padding: 5.5rem 1rem 2rem;
}
.search-overlay.open { display: flex; }

.search-panel {
  width: min(660px, 100%);
  background: var(--card);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 16px;
  box-shadow: 0 0 0 1px rgba(255,255,255,.04), 0 32px 80px rgba(0,0,0,.6);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  max-height: calc(100dvh - 7.5rem);
  animation: sp-panel-in .2s cubic-bezier(.22,.68,0,1.15);
}
.dark .search-panel { background: #10232c; border-color: rgba(255,255,255,.1); }

/* Input bar */
.sp-bar-form { flex-shrink: 0; }
.sp-bar {
  display: flex;
  align-items: center;
  gap: .75rem;
  padding: 1.125rem 1.25rem;
  border-bottom: 1px solid var(--border);
}
.sp-bar-icon { color: var(--accent); display: flex; flex-shrink: 0; }
.sp-bar-input {
  flex: 1;
  background: transparent;
  border: 0;
  outline: 0;
  font: 500 1.125rem/1.3 var(--font-sans);
  color: var(--foreground);
  min-width: 0;
  -webkit-appearance: none;
  appearance: none;
}
.sp-bar-input::placeholder { color: var(--muted-foreground); font-weight: 400; }
.sp-bar-input::-webkit-search-cancel-button,
.sp-bar-input::-webkit-search-decoration { display: none; }

.sp-bar-close {
  flex-shrink: 0;
  background: transparent;
  border: 0;
  padding: 0;
  cursor: pointer;
  line-height: 1;
}
.sp-bar-close kbd {
  display: inline-block;
  padding: .25rem .5rem;
  font: 600 .6875rem/1.4 var(--font-sans);
  letter-spacing: .04em;
  color: var(--muted-foreground);
  background: var(--muted);
  border: 1px solid var(--border);
  border-radius: 5px;
  transition: color .15s, border-color .15s;
}
.sp-bar-close:hover kbd { color: var(--accent); border-color: var(--accent); }

/* Scrollable body */
.sp-body { overflow-y: auto; flex: 1; padding: 1.25rem; }

/* Trending chips */
.sp-label {
  font: 600 .6875rem/1 var(--font-display);
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--muted-foreground);
  margin-bottom: .75rem;
}
.sp-chips { display: flex; flex-wrap: wrap; gap: .45rem; }
.sp-chip {
  display: inline-flex;
  align-items: center;
  padding: .375rem .9rem;
  border: 1px solid var(--border);
  border-radius: 999px;
  font: 500 .8125rem/1 var(--font-display);
  color: var(--foreground);
  text-decoration: none;
  transition: border-color .15s, color .15s, background .15s;
}
.sp-chip:hover { border-color: var(--accent); color: var(--accent); background: rgba(119,247,197,.08); }

/* Results */
.sp-results { display: flex; flex-direction: column; }
.sp-result {
  display: grid;
  grid-template-columns: 3.5rem 1fr;
  gap: .875rem;
  align-items: center;
  padding: .75rem .5rem;
  border-radius: 10px;
  text-decoration: none;
  color: var(--foreground);
  transition: background .12s;
}
.sp-result + .sp-result { border-top: 1px solid var(--border); }
.sp-result:hover { background: rgba(119,247,197,.06); }
.dark .sp-result:hover { background: rgba(119,247,197,.1); }
.sp-result-img { width: 3.5rem; height: 3.5rem; object-fit: cover; border-radius: 8px; flex-shrink: 0; }
.sp-result-ph { width: 3.5rem; height: 3.5rem; border-radius: 8px; flex-shrink: 0; background: var(--muted); display: flex; align-items: center; justify-content: center; color: var(--muted-foreground); }
.sp-result-title { font: 600 .9375rem/1.3 var(--font-display); }
.sp-result-meta { font: 400 .8125rem/1.4 var(--font-sans); color: var(--muted-foreground); margin-top: .2rem; }
.sp-loading, .sp-empty { padding: 2rem 1rem; text-align: center; color: var(--muted-foreground); font-size: .875rem; }
.sp-view-all {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  margin-top: .875rem;
  padding: .75rem 1rem;
  background: rgba(119,247,197,.07);
  border: 1px solid rgba(119,247,197,.2);
  border-radius: 10px;
  color: var(--accent);
  font: 600 .875rem/1 var(--font-display);
  text-decoration: none;
  transition: background .15s;
}
.sp-view-all:hover { background: rgba(119,247,197,.14); }

/* Keyboard hints bar */
.sp-hints {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 1.5rem;
  padding: .625rem 1.25rem;
  border-top: 1px solid var(--border);
  background: var(--surface);
}
.dark .sp-hints { background: rgba(0,0,0,.25); }
.sp-hint { font: 400 .75rem/1 var(--font-sans); color: var(--muted-foreground); display: flex; align-items: center; gap: .3rem; }
.sp-hint kbd { padding: .15rem .375rem; font: 600 .65rem/1.4 var(--font-sans); background: var(--card); border: 1px solid var(--border); border-radius: 4px; }

.hero { position: relative; background: var(--primary); color: var(--primary-foreground); overflow: hidden; }
.hero::before, .dot-field::before { content: ""; position: absolute; inset: 0; opacity: .04; background-image: radial-gradient(circle at 20% 20%, white 1px, transparent 1px); background-size: 24px 24px; pointer-events: none; }
/* minmax(0,1fr) — not an implicit `auto` column — so a wide child (the hero
   slider track) can never stretch the grid past the viewport on mobile. */
.home-hero-grid { position: relative; padding: 2rem 0 3rem; display: grid; grid-template-columns: minmax(0, 1fr); gap: 2.5rem; }
.hero-main, .top-stories { min-width: 0; }
.hero-slider { position: relative; overflow: hidden; border-radius: .5rem; }
.hero-slides { display: flex; transition: transform .45s ease; }
.slide { flex: 0 0 100%; min-width: 0; }
/* Block display removes inline-whitespace gap between image div and copy div */
.hero-slider .slide > a { display: block; }
.hero-slide-copy { padding: 1.125rem 1.375rem 1.5rem; background: var(--primary); color: var(--primary-foreground); }
.hero-slide-title { margin-top: .6rem; color: white; font-size: clamp(1.125rem,2.5vw,1.75rem); font-weight: 700; line-height: 1.2; }
.slider-btn { position: absolute; top: 50%; transform: translateY(-50%); width: 2.5rem; height: 2.5rem; border-radius: 999px; background: rgba(0,0,0,.3); color: white; border: 1px solid rgba(255,255,255,.1); display: flex; align-items: center; justify-content: center; opacity: 0; transition: .2s ease; }
.hero-slider:hover .slider-btn, .company-slider:hover .slider-btn, .reserved-slider:hover .slider-btn { opacity: 1; }
.slider-btn:hover { background: var(--accent); color: var(--accent-foreground); }
.slider-prev { left: .75rem; }
.slider-next { right: .75rem; }
.dots { position: absolute; right: 1rem; bottom: .75rem; display: flex; align-items: center; gap: .375rem; }
.dot { height: .25rem; width: .75rem; border-radius: 99px; background: rgba(255,255,255,.3); }
.dot.active { width: 2rem; background: var(--accent); }
.top-stories { padding-left: 0; }
.top-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 1.25rem; }
.top-list li { display: flex; align-items: flex-start; gap: 1rem; padding-bottom: 1.25rem; border-bottom: 1px solid rgba(255,255,255,.1); }
.top-list li:last-child { border-bottom: 0; padding-bottom: 0; }
.story-num { width: 1.75rem; flex: none; color: var(--accent); font: 700 1.5rem/1 var(--font-display); }

.section-pad { padding-top: 5rem; padding-bottom: 5rem; }
.section-pad-sm { padding-top: 3rem; padding-bottom: 3rem; }
.trending-strip { margin-top: 3rem; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); background: var(--surface); }
.trending-row { padding: 1rem 0; display: flex; align-items: center; gap: 1rem; }
.trending-marquee { flex: 1; overflow: hidden; }
.trending-track { display: flex; gap: 2.5rem; white-space: nowrap; width: max-content; animation: ticker-scroll 60s linear infinite; }
.live-dot { width: .375rem; height: .375rem; background: #fff; border-radius: 50%; display: inline-block; animation: pulse 1.2s ease-in-out infinite; }
.category-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.25rem; }
.category-tile { position: relative; overflow: hidden; border-radius: .375rem; aspect-ratio: 4/3; }
.category-tile img { position: absolute; inset: 0; transition: transform .7s ease; }
.category-tile:hover img { transform: scale(1.05); }
.category-tile::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, var(--primary), color-mix(in oklab,var(--primary) 60%, transparent), transparent); }
.category-copy { position: relative; z-index: 1; height: 100%; color: #fff; display: flex; flex-direction: column; justify-content: flex-end; padding: 1.5rem; }
.section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; margin-bottom: 2rem; }
.text-link { display: inline-flex; align-items: center; gap: .5rem; font-size: .875rem; font-family: var(--font-display); font-weight: 500; }
.text-link:hover { color: var(--accent); }
.company-band { position: relative; overflow: hidden; background: linear-gradient(to right, var(--primary), var(--primary), color-mix(in oklab,var(--primary), var(--accent) 25%)); color: var(--primary-foreground); }
.company-band-inner { position: relative; padding: 2.5rem 0 3.5rem; display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; gap: 1.5rem; }
.accent-btn { display: inline-flex; align-items: center; gap: .5rem; padding: .85rem 1.25rem; background: var(--accent); color: var(--accent-foreground); border-radius: var(--radius); font: 600 12px/1 var(--font-display); letter-spacing: .08em; text-transform: uppercase; }
.outline-btn { display: inline-flex; align-items: center; gap: .5rem; padding: .85rem 1.25rem; border: 1px solid var(--border); border-radius: var(--radius); font: 600 12px/1 var(--font-display); letter-spacing: .08em; text-transform: uppercase; }
.outline-btn:hover { border-color: var(--accent); color: var(--accent); }
.company-slider { position: relative; margin-top: -2.5rem; overflow: hidden; }
.company-track { display: flex; gap: 1rem; transition: transform .45s ease; }
.company-slide { flex: 0 0 85%; min-width: 0; }
.reserved-slide { flex: 0 0 100%; min-width: 0; }
.company-card { padding: 1.25rem; min-height: 100%; display: flex; flex-direction: column; }
.company-icon { width: 3rem; height: 3rem; border-radius: var(--radius); background: var(--primary); color: var(--primary-foreground); display: flex; align-items: center; justify-content: center; flex: none; }
.reserved { background: var(--surface); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.reserved-card { position: relative; height: 20rem; border-radius: .5rem; overflow: hidden; background: var(--primary); color: var(--primary-foreground); }
.reserved-card::before { content: ""; position: absolute; inset: 0; opacity: .07; background-image: radial-gradient(circle at 30% 30%, white 1px, transparent 1px); background-size: 18px 18px; }
.reserved-card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(135deg,var(--primary),var(--primary),color-mix(in oklab,var(--primary),var(--accent) 40%)); }
.reserved-card.has-banner::before, .reserved-card.has-banner::after { display: none; }
.reserved-content { position: relative; z-index: 1; height: 100%; padding: 2rem; display: flex; flex-direction: column; justify-content: space-between; }
.article-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.5rem; align-items: stretch; align-content: start; }
.article-grid > * { min-width: 0; }
.commodity-card { display: flex; flex-direction: column; padding: 1.25rem; text-decoration: none; }
.commodity-card-top { display: flex; align-items: center; gap: .75rem; min-width: 0; }
.commodity-card-top img { width: 2.75rem; height: 2.75rem; border-radius: 8px; object-fit: cover; flex-shrink: 0; }
.commodity-card-icon { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border-radius: 8px; background: var(--accent-soft, rgba(103,220,203,.12)); color: var(--accent); flex-shrink: 0; }
.commodity-card-name { font-size: 1.125rem; font-weight: 700; min-width: 0; }
.commodity-card-blurb { margin-top: .5rem; font-size: .875rem; line-height: 1.5; }
.commodity-card-cta { margin-top: auto; padding-top: 1rem; display: inline-flex; align-items: center; gap: .35rem; color: var(--accent); }
.colitco-pagination .nav-links { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; justify-content: center; }
.colitco-pagination .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 2.5rem; height: 2.5rem; padding: 0 .65rem; border: 1px solid var(--border); border-radius: var(--radius); font: 600 .875rem/1 var(--font-display); color: var(--foreground); text-decoration: none; transition: background .2s ease, color .2s ease, border-color .2s ease; }
.colitco-pagination a.page-numbers:hover { border-color: var(--accent); color: var(--accent); }
.colitco-pagination .page-numbers.current { background: var(--primary); color: var(--primary-foreground); border-color: var(--primary); }
.colitco-pagination .page-numbers.dots { border-color: transparent; }
.article-card { overflow: hidden; display: flex; flex-direction: column; }
.article-card-body { padding: 1.25rem; display: flex; flex-direction: column; flex: 1; }
.article-card img { transition: transform .5s ease; }
.article-card:hover img { transform: scale(1.03); }
.article-feature img { transition: transform .5s ease; }
.article-feature:hover img { transform: scale(1.02); }
.article-compact { display: flex; gap: .75rem; padding: .75rem 0; border-bottom: 1px solid var(--border); }
.article-compact:last-child { border-bottom: 0; }
.article-compact img { width: 5rem; height: 5rem; object-fit: cover; border-radius: var(--radius); flex: none; }
.filter-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; padding-bottom: 1rem; margin-bottom: 2rem; border-bottom: 1px solid var(--border); }
/* Category filter row sits directly below the region/sort row */
.cat-filter-row { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; padding-bottom: 1rem; margin-bottom: 2rem; border-bottom: 1px solid var(--border); }
/* When a category row follows, the region row drops its divider so the two read as one group */
.filter-row:has(+ .cat-filter-row) { padding-bottom: 0; margin-bottom: 1rem; border-bottom: 0; }
.pill-filter { padding: .45rem .75rem; border: 1px solid var(--border); border-radius: var(--radius); font: 500 12px/1 var(--font-display); }
.pill-filter.active { background: var(--primary); color: var(--primary-foreground); border-color: var(--primary); }
.page-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2.5rem; align-items: start; }
.page-grid > * { min-width: 0; }
.sidebar { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2rem; align-content: start; min-width: 0; }
.sidebar > * { min-width: 0; }

.newsletter-section { background: var(--surface); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.newsletter-grid { padding: 5rem 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: 2.5rem; align-items: center; }
.newsletter-title { margin-top: .75rem; font-size: clamp(2rem,4vw,3rem); font-weight: 700; line-height: 1.05; }
.newsletter-form { display: flex; flex-direction: column; gap: .75rem; }
.form-control { width: 100%; border: 1px solid var(--border); border-radius: var(--radius); padding: .8rem 1rem; background: var(--background); color: var(--foreground); outline: 0; }
.form-control:focus { border-color: var(--accent); }
.primary-btn { background: var(--primary); color: var(--primary-foreground); border-radius: var(--radius); padding: .8rem 1.25rem; font: 600 12px/1 var(--font-display); letter-spacing: .12em; text-transform: uppercase; }
.primary-btn:hover { opacity: .9; }

/* Semantic class for the author/date/share row inside post hero */
.post-meta-bar { display: flex; align-items: center; flex-wrap: wrap; gap: 1rem; margin-top: 2rem; padding-top: 1.5rem; border-top: 1px solid rgba(255,255,255,.1); }

.post-hero { position: relative; background: var(--primary); color: var(--primary-foreground); overflow: hidden; }
.post-hero-bg { position: absolute; inset: 0; }
.post-hero-bg img { width: 100%; height: 100%; object-fit: cover; opacity: .4; }
.post-hero-bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top,var(--primary),color-mix(in oklab,var(--primary) 85%, transparent),color-mix(in oklab,var(--primary) 40%, transparent)); }
.post-hero-inner { position: relative; padding-top: 2rem; padding-bottom: 5rem; }
.breadcrumbs { display: flex; align-items: center; flex-wrap: wrap; gap: .375rem; margin-bottom: .85rem; color: rgba(255,255,255,.5); font: 600 11px/1 var(--font-display); letter-spacing: .08em; text-transform: uppercase; }
.breadcrumbs a:hover { color: var(--accent); }
.post-title { margin-top: 1.25rem; color: #fff; font-size: clamp(2rem,5vw,3.25rem); font-weight: 700; line-height: 1.05; max-width: 64rem; }
.author-avatar { width: 2.75rem; height: 2.75rem; border-radius: 999px; background: var(--accent); color: var(--accent-foreground); display: flex; align-items: center; justify-content: center; font: 700 .875rem/1 var(--font-display); }
.overlap-image { margin-top: -3.5rem; position: relative; z-index: 10; }
.overlap-image img { width: 100%; height: auto; aspect-ratio: 1200 / 700; object-fit: cover; display: block; border-radius: .5rem; box-shadow: 0 20px 35px rgba(0,0,0,.24); border: 1px solid var(--border); }
.post-body-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 3rem; margin-top: 3rem; }
.post-body-grid > * { min-width: 0; }
.share-rail { display: none; position: sticky; top: 6rem; align-self: start; }
.share-button { width: 2.5rem; height: 2.5rem; border: 1px solid var(--border); border-radius: 999px; display: flex; align-items: center; justify-content: center; }
.share-button:hover { border-color: var(--accent); color: var(--accent); background: color-mix(in oklab,var(--accent) 5%, transparent); }
.prose-fin { font-size: 17px; line-height: 1.8; color: color-mix(in oklab,var(--foreground) 90%, transparent); overflow-wrap: break-word; word-break: break-word; min-width: 0; }
.prose-fin p { margin: 1.25rem 0; }
.prose-fin h2 { margin: 3rem 0 .75rem; font-size: clamp(1.5rem,3vw,1.875rem); font-weight: 700; }
/* Contain WP post content: tables, code, embeds, images */
.prose-fin table { display: block; width: max-content; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.prose-fin pre  { max-width: 100%; overflow-x: auto; white-space: pre-wrap; word-break: break-all; }
.prose-fin code { white-space: pre-wrap; word-break: break-all; }
.prose-fin iframe, .prose-fin embed, .prose-fin object { max-width: 100% !important; }
.prose-fin figure { max-width: 100%; margin: 2rem 0; }
.prose-fin figure img,
.prose-fin .wp-caption img { display: block; width: 100%; height: auto; border-radius: var(--radius); }
.prose-fin .wp-caption { max-width: 100% !important; }
/* Article image captions — small, muted, italic, with a thin accent rule.
   Overrides the inherited body-text size so captions read as captions. */
.prose-fin figcaption,
.prose-fin .wp-caption-text,
.prose-fin .wp-element-caption {
  margin: .7rem 0 0;
  padding: .15rem 0 .15rem .85rem;
  border-left: 2px solid var(--accent);
  color: var(--muted-foreground);
  font-size: .8125rem;
  font-weight: 400;
  font-style: italic;
  line-height: 1.55;
  text-align: left;
}
.prose-fin figcaption a,
.prose-fin .wp-caption-text a { color: var(--accent); }
/* Flex containers inside prose and card-fin: let children shrink properly */
.prose-fin .flex > *, .card-fin .flex > * { min-width: 0; }
.dropcap:first-letter { float: left; font: 700 4.5rem/.8 var(--font-display); color: var(--accent); margin: .45rem .75rem 0 0; }
blockquote { margin: 2.5rem 0; padding: 1.5rem 2rem; border-left: 3px solid var(--accent); background: var(--surface); border-radius: 0 var(--radius) var(--radius) 0; }
.tag-list { display: flex; flex-wrap: wrap; gap: .5rem; }
.tag-list span { padding: .45rem .75rem; border: 1px solid var(--border); border-radius: 999px; font: 500 12px/1 var(--font-display); }

.site-footer { background: var(--primary); color: var(--primary-foreground); margin-top: 5rem; }
.footer-disclaimer { border-bottom: 1px solid rgba(255,255,255,.1); background: rgba(0,0,0,.2); }
.footer-disclaimer-inner { padding: 2.5rem 0; display: flex; align-items: flex-start; gap: .75rem; max-width: 64rem; }
.footer-grid { padding-block: 4rem; display: grid; grid-template-columns: minmax(0, 1fr); gap: 3rem; }
.footer-logo { height: 3rem !important; max-height: 3rem !important; width: auto !important; max-width: min(220px, 60vw) !important; object-fit: contain; display: block !important; }
.footer-links { list-style: none; padding: 0; margin: 1rem 0 0; display: grid; gap: .65rem; color: #fff; font-size: .875rem; }
.footer-links a:hover { color: var(--accent); }
.footer-recent a { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.4; }
.footer-bottom { border-top: 1px solid rgba(255,255,255,.1); }
.footer-bottom-row { padding-block: 1.25rem; display: flex; flex-direction: column; align-items: center; justify-content: space-between; gap: 1rem; }
.author-socials { display: inline-flex; align-items: center; gap: .4rem; }
.author-social { display: inline-flex; align-items: center; justify-content: center; width: 1.75rem; height: 1.75rem; border-radius: 50%; border: 1px solid var(--border); color: var(--muted-foreground); transition: color .2s ease, border-color .2s ease, background .2s ease; }
.author-social:hover { color: var(--accent); border-color: var(--accent); background: rgba(119,247,197,.1); }
.socials { display: flex; align-items: center; gap: .75rem; color: rgba(255,255,255,.9); }
.socials a { display: inline-flex; align-items: center; justify-content: center; width: 2.25rem; height: 2.25rem; border-radius: 6px; transition: color .2s ease, background .2s ease; }
.socials a:hover { color: var(--accent); background: rgba(119,247,197,.12); }

@keyframes ticker-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes pulse { 50% { opacity: .45; } }

@media (min-width: 640px) {
  .category-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .article-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .newsletter-form { flex-direction: row; }
  .newsletter-btn { display: inline-flex; }
  .company-slide { flex-basis: 50%; }
  .reserved-slide { flex-basis: 50%; }
  .footer-bottom-row { flex-direction: row; }
  /* Footer: fills the 640–767 px gap where no column rule was set.
     Brand spans the full row; the 3 link columns sit side-by-side beneath it. */
  .footer-grid  { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .footer-brand { grid-column: 1 / -1; }
}

@media (min-width: 768px) {
  .brand-logo { height: 2.5rem; }
  .company-band-inner { flex-direction: row; align-items: flex-end; }
  .reserved-card { height: 20rem; }
  .newsletter-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (min-width: 1024px) {
  .nav-desktop { display: flex; }
  .menu-toggle { display: none; }
  .site-topbar-util-links { display: flex; }
  .subscribe-btn { display: inline-flex; }
  .logo-tagline { display: block; }
  .home-hero-grid { grid-template-columns: repeat(12,minmax(0,1fr)); padding-top: 3rem; padding-bottom: 4rem; }
  .hero-main { grid-column: span 8 / span 8; }
  .top-stories { grid-column: span 4 / span 4; padding-left: 2rem; border-left: 1px solid rgba(255,255,255,.1); }
  .category-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .article-grid.cols-3 { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .article-grid.cols-4 { grid-template-columns: repeat(4,minmax(0,1fr)); }
  .company-slide { flex-basis: 25%; }
  .reserved-slide { flex-basis: 50%; }
  .page-grid { grid-template-columns: repeat(12,minmax(0,1fr)); }
  .content-8 { grid-column: span 8 / span 8; }
  .content-7 { grid-column: span 7 / span 7; }
  .sidebar { grid-column: span 4 / span 4; position: sticky; top: 6rem; align-self: start; max-height: calc(100vh - 7rem); overflow-y: auto; }
  .share-rail { display: flex; grid-column: span 1 / span 1; flex-direction: column; align-items: center; gap: .75rem; }
  .post-body-grid { grid-template-columns: repeat(12,minmax(0,1fr)); }
  .footer-grid { grid-template-columns: repeat(12,minmax(0,1fr)); }
  .footer-brand { grid-column: span 5 / span 5; }
  .footer-col { grid-column: span 2 / span 2; }
}

@media (max-width: 782px) {
  body.admin-bar .site-header { top: 46px; }
}

/* ─── Market Widget ──────────────────────────────────────────────────────────── */
.colitco-mw { position: relative; }

/* Loading skeleton */
.colitco-mw-loading { padding: 2rem; display: flex; justify-content: center; }
.colitco-mw-pulse {
  width: 100%; height: 64px; border-radius: var(--radius);
  background: linear-gradient(90deg, rgba(255,255,255,.04) 25%, rgba(255,255,255,.09) 50%, rgba(255,255,255,.04) 75%);
  background-size: 200% 100%;
  animation: mw-shimmer 1.4s ease-in-out infinite;
}
@keyframes mw-shimmer { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }

/* Error */
.colitco-mw-err { color: #ef4444; font-size: .875rem; padding: 1rem 0; }

/* ── Ticker ── */
.colitco-mw-ticker-wrap { overflow: hidden; background: var(--primary); padding: .45rem 0; }
.colitco-mw-ticker-track {
  display: flex; align-items: center; white-space: nowrap;
  animation: mw-scroll-l linear infinite; will-change: transform;
}
.colitco-mw-tick-reverse { animation-name: mw-scroll-r; }
@keyframes mw-scroll-l  { from { transform: translateX(0); }         to { transform: translateX(-33.333%); } }
@keyframes mw-scroll-r  { from { transform: translateX(-33.333%); }  to { transform: translateX(0); } }
.colitco-mw-tick-item   { display: inline-flex; align-items: center; gap: .45rem; padding: 0 .9rem; font-size: .8rem; color: rgba(255,255,255,.75); }
.colitco-mw-tick-sym    { font-weight: 700; color: #fff; font-family: var(--font-display); letter-spacing: .02em; }
.colitco-mw-tick-sep    { color: rgba(255,255,255,.18); }

/* ── Shared badges & pills ── */
.colitco-mw-tick-pill {
  display: inline-flex; align-items: center;
  background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12);
  border-radius: 4px; padding: .15rem .5rem;
  font-size: .72rem; font-weight: 700; font-family: var(--font-display);
  color: var(--foreground); letter-spacing: .03em;
}
.colitco-mw-badge {
  display: inline-flex; align-items: center; gap: .2rem;
  font-size: .75rem; font-weight: 600; padding: .2rem .45rem; border-radius: 4px; white-space: nowrap;
}
.colitco-mw-badge.bull { background: rgba(34,197,94,.15);  color: #22c55e; }
.colitco-mw-badge.bear { background: rgba(239,68,68,.15);  color: #ef4444; }
.colitco-mw-cname      { font-size: .78rem; color: var(--muted-foreground); margin-top: .2rem; max-width: 160px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.colitco-mw-card-price { font-size: 1.45rem; font-weight: 700; font-family: var(--font-display); color: var(--foreground); letter-spacing: -.02em; line-height: 1.1; }
.colitco-mw-card-change { font-size: .85rem; font-weight: 500; }
.colitco-mw-exch        { font-size: .7rem; color: rgba(255,255,255,.35); margin-top: auto; padding-top: .4rem; }
.colitco-mw-spark       { display: block; width: 100%; height: 38px; margin: .3rem 0; }
.colitco-mw-meta-row    { display: flex; justify-content: space-between; font-size: .74rem; color: var(--muted-foreground); padding: .18rem 0; border-bottom: 1px solid var(--border); }
.colitco-mw-meta-row:last-of-type { border-bottom: none; }

/* ── Price Block: Cards ── */
.colitco-mw-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(195px, 1fr)); gap: 1rem; }
.colitco-mw-card  {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius); padding: 1.2rem;
  display: flex; flex-direction: column; gap: .35rem;
  transition: border-color .2s;
  overflow: hidden;
}
.colitco-mw-card:hover { border-color: var(--gold); }
.colitco-mw-card.mw-up   { border-top: 2px solid #22c55e; }
.colitco-mw-card.mw-down  { border-top: 2px solid #ef4444; }
.colitco-mw-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: .5rem; }

/* ── Price Block: Table ── */
.colitco-mw-table-wrap { overflow-x: auto; }
.colitco-mw-table { width: 100%; border-collapse: collapse; font-size: .875rem; }
.colitco-mw-table thead th {
  background: var(--surface); padding: .7rem 1rem;
  text-align: left; font-size: .72rem; font-weight: 600;
  color: var(--muted-foreground); border-bottom: 1px solid var(--border); white-space: nowrap;
}
.colitco-mw-table tbody td   { padding: .7rem 1rem; border-bottom: 1px solid var(--border); vertical-align: middle; white-space: nowrap; }
.colitco-mw-table tbody tr:last-child td { border-bottom: none; }
.colitco-mw-table tbody tr:hover { background: rgba(255,255,255,.03); }

/* ── Price Block: Compact ── */
.colitco-mw-compact      { display: flex; flex-wrap: wrap; gap: .5rem; }
.colitco-mw-compact-item {
  display: flex; align-items: center; gap: .5rem;
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius); padding: .5rem .8rem; font-size: .875rem;
}
.colitco-mw-compact-item.mw-up   { border-left: 2px solid #22c55e; }
.colitco-mw-compact-item.mw-down { border-left: 2px solid #ef4444; }

/* ── Chart ── */
.colitco-mw-chart-wrap { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 1.4rem; }
.colitco-mw-chart-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin-bottom: 1.1rem; }
.colitco-mw-chart-meta { display: flex; flex-direction: column; align-items: flex-end; gap: .4rem; }
.colitco-mw-range-tabs  { display: flex; gap: .25rem; flex-wrap: wrap; }
.colitco-mw-rtab {
  background: transparent; border: 1px solid var(--border);
  border-radius: 4px; color: var(--muted-foreground);
  font-size: .72rem; padding: .22rem .5rem; cursor: pointer; transition: all .15s;
}
.colitco-mw-rtab:hover  { border-color: var(--gold); color: var(--gold); }
.colitco-mw-rtab.active { background: var(--gold); border-color: var(--gold); color: var(--gold-foreground); font-weight: 700; }

/* ── Newsletter form ── */
.colitco-nl-form {
  display: flex;
  flex-direction: column;
  gap: .75rem;
  width: 100%;
}
.colitco-nl-form.nl-inline {
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-start;
}
.colitco-nl-form.nl-inline input[type="email"],
.colitco-nl-form.nl-inline input[type="text"] {
  flex: 1 1 220px;
}
.colitco-nl-form input[type="email"],
.colitco-nl-form input[type="text"] {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  color: var(--foreground);
  font-size: .9rem;
  padding: .6rem 1rem;
  width: 100%;
  outline: none;
  transition: border-color .15s;
}
.colitco-nl-form input[type="email"]:focus,
.colitco-nl-form input[type="text"]:focus {
  border-color: var(--gold);
}
.colitco-nl-form input[type="email"]::placeholder,
.colitco-nl-form input[type="text"]::placeholder {
  color: var(--muted-foreground);
}
.nl-submit-btn {
  background: var(--gold);
  border: none;
  border-radius: var(--radius);
  color: var(--gold-foreground, #000);
  cursor: pointer;
  font-size: .875rem;
  font-weight: 600;
  padding: .65rem 1.5rem;
  transition: opacity .15s;
  white-space: nowrap;
}
.nl-submit-btn:hover  { opacity: .85; }
.nl-submit-btn:disabled { opacity: .5; cursor: not-allowed; }

/* Messages */
.colitco-nl-msg {
  border-radius: var(--radius);
  font-size: .85rem;
  margin: 0;
  padding: .5rem .85rem;
}
.colitco-nl-msg--success {
  background: rgba(var(--green-rgb, 34,197,94), .12);
  border: 1px solid rgba(var(--green-rgb, 34,197,94), .35);
  color: #16a34a;
}
.colitco-nl-msg--error {
  background: rgba(var(--red-rgb, 239,68,68), .1);
  border: 1px solid rgba(var(--red-rgb, 239,68,68), .3);
  color: #dc2626;
}
.colitco-nl-msg--loading {
  background: transparent;
  border: none;
  color: var(--muted-foreground);
}

/* Elementor widget wrapper */
.colitco-nl-widget { width: 100%; }
.colitco-nl-widget .nl-eyebrow {
  font-size: .75rem;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: .4rem;
}
.colitco-nl-widget .nl-title {
  font-size: 1.4rem;
  font-weight: 700;
  color: var(--foreground);
  margin-bottom: .3rem;
}
.colitco-nl-widget .nl-desc {
  font-size: .875rem;
  color: var(--muted-foreground);
  margin-bottom: 1rem;
}
.colitco-nl-privacy {
  font-size: .72rem;
  color: var(--muted-foreground);
  margin: 0;
}

/* ── Naitrich Table Maker ────────────────────────────────────────────────── */
.naitrich-table-wrap {
  margin: 2rem 0;
  border-radius: var(--radius);
  overflow: hidden;
  background: var(--card);
  border: 1px solid var(--border);
  box-shadow: 0 1px 3px rgba(0,0,0,.06);
}
.naitrich-table-scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.naitrich-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .9375rem;
  line-height: 1.5;
}
.naitrich-table-caption {
  text-align: left;
  padding: .65rem 1rem;
  font-size: .75rem;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-weight: 600;
  color: var(--muted-foreground);
  border-bottom: 1px solid var(--border);
  caption-side: top;
}
.naitrich-table thead tr {
  background: var(--primary);
}
.naitrich-table thead th {
  padding: .75rem 1.125rem;
  text-align: left;
  font: 600 .8125rem/1.3 var(--font-display);
  color: var(--primary-foreground);
  letter-spacing: .04em;
  white-space: nowrap;
  border: none;
}
.naitrich-table tbody tr {
  border-bottom: 1px solid var(--border);
  transition: background .1s;
}
.naitrich-table tbody tr:last-child {
  border-bottom: none;
}
.naitrich-table td {
  padding: .75rem 1.125rem;
  color: var(--foreground);
  font-size: .875rem;
  line-height: 1.6;
  vertical-align: top;
}

/* Modifier: striped */
.ntw-stripe .naitrich-table tbody tr:nth-child(even) {
  background: var(--surface);
}

/* Modifier: hover */
.ntw-hover .naitrich-table tbody tr:hover {
  background: var(--muted);
}

/* Modifier: border */
.ntw-border .naitrich-table td,
.ntw-border .naitrich-table th {
  border: 1px solid var(--border);
}
.ntw-border .naitrich-table thead th {
  border-color: rgba(255,255,255,.12);
}

/* Modifier: compact */
.ntw-compact .naitrich-table td,
.ntw-compact .naitrich-table th {
  padding: .4rem .75rem;
  font-size: .8125rem;
}

/* Accent first column (bold like a row header) */
.naitrich-table tbody td:first-child {
  font-weight: 600;
  color: var(--primary);
}

/* ─── Reserved Zone: Banner Card ────────────────────────────────────────────── */

/* Slider wrapper */
.rz-slider { position: relative; overflow: hidden; border-radius: var(--radius); }
.rz-track  { display: flex; gap: 1.5rem; transition: transform .5s cubic-bezier(.4,0,.2,1); }
.rz-slide  { flex: 0 0 100%; min-width: 0; }

/* 2-per-view on tablet and desktop */
@media (min-width: 640px) {
  .rz-slide { flex: 0 0 calc(50% - 0.75rem); }
}

/* The card itself — full-bleed landscape banner */
.rzcard {
  position: relative;
  display: block;
  height: 370px;
  overflow: hidden;
  border-radius: var(--radius);
  color: white;
  text-decoration: none;
}

/* Background layer */
.rzcard-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.rzcard-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform .7s ease;
  display: block;
}
.rzcard:hover .rzcard-bg img { transform: scale(1.04); }

/* Fallback gradient when no image */
.rzcard-bg-fallback {
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, var(--navy-deep), var(--navy));
}

/* Gradient overlay — only darkens the bottom text area; top shows the image */
.rzcard-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to top,
    rgba(5, 10, 25, 0.92) 0%,
    rgba(5, 10, 25, 0.70) 28%,
    rgba(5, 10, 25, 0.20) 52%,
    rgba(5, 10, 25, 0.00) 72%
  );
}

/* Content layer */
.rzcard-inner {
  position: relative;
  z-index: 1;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 1.375rem 1.75rem;
}

/* Top row — exchange badge */
.rzcard-top { display: flex; align-items: flex-start; justify-content: space-between; }

.rzcard-exchange {
  display: inline-flex;
  align-items: center;
  background: oklch(0.13 0.04 255 / .72);
  border: 1px solid var(--gold);
  color: var(--gold);
  font: 700 11px/1 var(--font-display);
  letter-spacing: .08em;
  text-transform: uppercase;
  padding: .35rem .75rem;
  border-radius: 4px;
  backdrop-filter: blur(4px);
}

/* Bottom content block */
.rzcard-bottom { display: flex; flex-direction: column; gap: .875rem; }

/* Identity row: ticker box + name/meta */
.rzcard-identity { display: flex; align-items: center; gap: 1rem; }

/* Gold ticker abbreviation box */
.rzcard-ticker-box {
  width: 3rem;
  height: 3rem;
  border-radius: 6px;
  background: var(--gold);
  color: var(--gold-foreground);
  display: flex;
  align-items: center;
  justify-content: center;
  font: 700 .9375rem/1 var(--font-display);
  letter-spacing: .03em;
  flex-shrink: 0;
}

.rzcard-name {
  font-size: clamp(1.25rem, 2.5vw, 1.625rem);
  font-weight: 700;
  color: white;
  line-height: 1.2;
  margin: 0;
  font-family: var(--font-display);
}

.rzcard-meta {
  display: flex;
  align-items: center;
  gap: .375rem;
  color: rgba(255,255,255,.58);
  font-size: .8125rem;
  margin: .3rem 0 0;
  font-family: var(--font-display);
}
.rzcard-meta svg { flex-shrink: 0; opacity: .6; }

/* Blurb line */
.rzcard-blurb {
  color: rgba(255,255,255,.82);
  font-size: .9375rem;
  line-height: 1.5;
  margin: 0;
}

/* CTA text */
.rzcard-cta {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  color: var(--gold);
  font: 600 .875rem/1 var(--font-display);
  transition: gap .2s ease;
}
.rzcard:hover .rzcard-cta { gap: .7rem; }

/* Arrow nav buttons */
.rz-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 50%;
  background: oklch(0.13 0.04 255 / .7);
  color: white;
  border: 1px solid rgba(255,255,255,.15);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: opacity .2s ease, background .2s ease;
  backdrop-filter: blur(6px);
  z-index: 5;
}
.rz-slider:hover .rz-btn { opacity: 1; }
.rz-btn:hover { background: var(--gold); color: var(--gold-foreground); border-color: var(--gold); }
.rz-prev { left: 1rem; }
.rz-next { right: 1rem; }

/* Mobile: reduce card height and padding */
@media (max-width: 639px) {
  .rzcard { height: 280px; }
  .rzcard-inner { padding: 1rem 1.25rem; }
  .rzcard-ticker-box { width: 2.5rem; height: 2.5rem; font-size: .8125rem; }
  .rzcard-blurb { font-size: .875rem; }

  /* Nav arrows: move to the top-right corner (clear image zone) so they don't
     overlap the company logo/name, which is bottom-aligned on mobile. */
  .rz-btn  { top: 1rem; transform: none; width: 2.25rem; height: 2.25rem; }
  .rz-prev { left: auto; right: 3.5rem; }
  .rz-next { right: 1rem; }
}

/* ─── Company Page: Breadcrumb ───────────────────────────────────────────────── */
.co-breadcrumb {
  display: flex;
  align-items: center;
  gap: .5rem;
  padding: 1rem 0 .25rem;
}
.co-breadcrumb-link {
  display: inline-flex;
  align-items: center;
  gap: .25rem;
  font: 600 .75rem/1 var(--font-display);
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(255,255,255,.5);
  transition: color .15s ease;
}
.co-breadcrumb-link:hover { color: var(--accent); }
.co-breadcrumb-sep  { color: rgba(255,255,255,.25); font-size: .75rem; }
.co-breadcrumb-cur  { font: 500 .75rem/1 var(--font-sans); color: rgba(255,255,255,.35); }

/* ─── Company Page: Hero Section ────────────────────────────────────────────── */
.co-hero-section { background: var(--primary); color: var(--primary-foreground); }
.co-hero-inner   { padding-bottom: 0; }

/* ─── Company Page: Hero Grid ────────────────────────────────────────────────── */
.co-hero-grid {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-areas:
    "logo info"
    "price price";
  gap: 1.25rem 1.5rem;
  padding: 1.25rem 0 2rem;
  align-items: start;
}
.co-hero-logo  { grid-area: logo; }
.co-hero-info  { grid-area: info; min-width: 0; }
.co-hero-price { grid-area: price; padding-top: .25rem; }

.co-hero-logo-box {
  width: 5.5rem;
  height: 5.5rem;
  border-radius: .75rem;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.co-hero-logo-img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: .625rem;
}
.co-hero-logo-ph {
  color: rgba(255,255,255,.4);
}
.co-hero-eyebrow {
  color: var(--accent);
  margin-bottom: .125rem;
}

@media (min-width: 640px) {
  .co-hero-grid {
    grid-template-columns: auto 1fr auto;
    grid-template-areas: "logo info price";
    align-items: center;
    padding: 2rem 0 2.25rem;
  }
  .co-hero-price { padding-top: 0; text-align: right; min-width: 180px; }
}

@media (max-width: 479px) {
  .co-hero-logo-box { width: 4rem; height: 4rem; border-radius: .5rem; }
}

/* ─── Company Page: Hero Name + Meta ─────────────────────────────────────────── */
.co-hero-name {
  color: var(--primary-foreground);
  font-size: clamp(1.375rem, 4vw, 2.25rem);
  line-height: 1.1;
  margin-top: .375rem;
}
.co-hero-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .5rem .75rem;
  margin-top: .75rem;
}
.co-ticker-pill { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.2); color: white; }
.co-meta-item   { color: rgba(255,255,255,.65); font-size: .875rem; }
.co-meta-item strong { color: white; font-weight: 600; }
.co-meta-sep    { color: rgba(255,255,255,.3); font-size: 12px; }
.co-meta-link   { display: inline-flex; align-items: center; gap: .3rem; color: var(--accent); font-size: .875rem; transition: opacity .15s; }
.co-meta-link:hover { opacity: .75; }

.co-price-label {
  font: 600 .6875rem/1 var(--font-display);
  letter-spacing: .1em;
  text-transform: uppercase;
  color: rgba(255,255,255,.45);
  margin-bottom: .5rem;
}

/* ─── Company Page: Tab Navigation ──────────────────────────────────────────── */
.co-tab-nav-wrap {
  border-top: 1px solid rgba(255,255,255,.1);
  margin-top: .5rem;
}
.co-tabs {
  display: flex;
  gap: 0;
  overflow-x: auto;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.co-tabs::-webkit-scrollbar { display: none; }
.co-tab {
  padding: .9rem 1.375rem;
  background: transparent;
  border: 0;
  border-bottom: 2px solid transparent;
  color: rgba(255,255,255,.5);
  font: 600 11px/1 var(--font-display);
  letter-spacing: .1em;
  text-transform: uppercase;
  white-space: nowrap;
  cursor: pointer;
  transition: color .2s ease, border-color .2s ease;
  flex-shrink: 0;
}
.co-tab:hover  { color: rgba(255,255,255,.85); }
.co-tab.active { color: var(--accent); border-bottom-color: var(--accent); }

/* ─── Company Page: Tab Panels ───────────────────────────────────────────────── */
.co-tab-panel        { display: none; }
.co-tab-panel.active { display: flex; flex-direction: column; gap: 2rem; }

/* ─── Company Page: Tab Badge ────────────────────────────────────────────────── */
.co-tab-badge {
  display: inline-block;
  padding: .15rem .4rem;
  font: 600 .6rem/1.4 var(--font-sans);
  letter-spacing: .05em;
  text-transform: uppercase;
  background: rgba(119,247,197,.18);
  color: var(--accent);
  border-radius: 3px;
  margin-left: .3rem;
  vertical-align: middle;
}

/* ─── Company Page: Body Layout ─────────────────────────────────────────────── */
.co-body-grid {
  display: grid;
  gap: 2.5rem;
  align-items: start;
}
@media (min-width: 1024px) {
  .co-body-grid { grid-template-columns: 1fr 21rem; gap: 3rem; }
  .co-sidebar   { position: sticky; top: 5.5rem; }
}

/* ─── Company Page: Key Facts Grid ──────────────────────────────────────────── */
.co-key-facts {
  display: grid;
  gap: .875rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
@media (min-width: 640px)  { .co-key-facts { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .co-key-facts { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* ─── Company Page: Sections ─────────────────────────────────────────────────── */
.co-main { display: flex; flex-direction: column; gap: 2rem; }
.co-section { display: flex; flex-direction: column; gap: .875rem; }
.co-section-label {
  font: 600 .6875rem/1 var(--font-display);
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--muted-foreground);
}
.co-prose { line-height: 1.75; color: var(--foreground); font-size: 1.0625rem; }
.co-prose p { margin-top: .875rem; }
.co-prose p:first-child { margin-top: 0; }
.co-blurb           { font-size: 1.0625rem; line-height: 1.75; color: var(--foreground); }
.co-blurb-secondary { color: var(--muted-foreground); margin-top: .75rem; }

/* Price chart — main column version (mobile/tablet only) */
.co-main-chart { display: flex; }
@media (min-width: 1024px) { .co-main-chart { display: none; } }

.co-chart-card {
  padding: 1.25rem;
  overflow: hidden;
}

/* ─── Company Page: Fact Cards ───────────────────────────────────────────────── */
.co-fact-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 1rem 1.125rem;
}
.co-fact-label {
  font: 600 .6875rem/1 var(--font-display);
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--muted-foreground);
}
.co-fact-value {
  font: 600 1rem/1.3 var(--font-display);
  color: var(--foreground);
  margin-top: .375rem;
}

/* ─── Company Page: Sidebar ──────────────────────────────────────────────────── */
.co-sidebar { display: flex; flex-direction: column; gap: 1.25rem; }

/* Price chart in sidebar — desktop only */
.co-sidebar-chart { display: none; }
@media (min-width: 1024px) { .co-sidebar-chart { display: flex; flex-direction: column; } }

.co-sidebar-chart-body { margin-top: .75rem; }

.co-sidebar-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 1.25rem;
}
.co-sidebar-card-head  { display: flex; align-items: center; gap: .5rem; margin-bottom: .75rem; }
.co-sidebar-card-title { font: 600 .9375rem/1 var(--font-display); color: var(--foreground); margin: 0; }
.co-sidebar-icon       { color: var(--accent); display: flex; }

/* Quick stats dl */
.co-quick-stats { display: flex; flex-direction: column; gap: 0; margin: 0; padding: 0; }
.co-stat-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: .75rem;
  padding: .6875rem 0;
  border-bottom: 1px solid var(--border);
}
.co-stat-row:last-child { border-bottom: 0; padding-bottom: 0; }
.co-stat-label {
  font: 500 .8125rem/1.3 var(--font-sans);
  color: var(--muted-foreground);
  flex: none;
}
.co-stat-value {
  font: 600 .875rem/1.3 var(--font-display);
  color: var(--foreground);
  text-align: right;
}
.co-stat-link {
  display: inline-flex;
  align-items: center;
  gap: .25rem;
  color: var(--accent);
  font: 600 .875rem/1 var(--font-display);
}
.co-stat-link:hover { opacity: .75; }

/* ─── Company Page: Coming Soon ──────────────────────────────────────────────── */
.co-coming-soon {
  text-align: center;
  padding: 5rem 2rem;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  color: var(--muted-foreground);
}
.co-coming-icon {
  display: inline-flex;
  width: 3.5rem; height: 3.5rem;
  align-items: center; justify-content: center;
  background: rgba(119,247,197,.1);
  border-radius: 50%;
  color: var(--accent);
  margin: 0 auto;
}
.co-coming-title { font: 600 1.25rem/1.2 var(--font-display); color: var(--foreground); margin: 1.25rem 0 0; }
.co-coming-desc  { margin: .625rem auto 0; max-width: 28rem; line-height: 1.6; font-size: .9375rem; }

/* ─── Home Page: Utility Classes ────────────────────────────────────────────── */
.section-title { margin-top: .5rem; }

/* ── Hero slide meta ── */
.hero-img-wrap { overflow: hidden; background: var(--primary); }
.hero-slide-meta { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.hero-slide-dot  { color: rgba(255,255,255,.4); font-size: 12px; }
.hero-slide-region { font-size: 11px; color: rgba(255,255,255,.7); }
.hero-slide-byline { display: flex; align-items: center; gap: .75rem; flex-wrap: wrap; margin-top: .75rem; font-size: 11px; color: rgba(255,255,255,.6); }
.hero-slide-author { font-family: var(--font-display); font-weight: 600; color: rgba(255,255,255,.8); }
.premium-pill  { background: var(--accent) !important; color: var(--accent-foreground) !important; border-color: var(--accent) !important; }
.ticker-ghost  { background: rgba(255,255,255,.1); color: white; border-color: rgba(255,255,255,.2); }
.live-pill     { background: var(--destructive); color: var(--destructive-foreground); border-color: var(--destructive); }

/* ── Top Stories sidebar ── */
.top-stories-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 1.25rem; }
.top-stories-all  { font: 600 11px/1 var(--font-display); letter-spacing: .08em; text-transform: uppercase; color: rgba(255,255,255,.6); display: inline-flex; align-items: center; gap: .25rem; }
.top-stories-all:hover { color: var(--accent); }
.top-story-meta   { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.top-story-sep    { color: rgba(255,255,255,.3); font-size: 12px; }
.top-story-region { font-size: 10px; color: rgba(255,255,255,.5); }
.top-story-title  { margin-top: .4rem; color: white; font: 600 15px/1.35 var(--font-display); }
.top-story-byline { margin-top: .4rem; font-size: 11px; color: rgba(255,255,255,.5); display: flex; align-items: center; gap: .25rem; }

/* ── Trending strip ── */
.trending-item { font-size: .875rem; font-weight: 500; }
.trending-tag  { margin-right: .5rem; }

/* ── Category tiles ── */
.category-tile-title { font-size: 1.5rem; font-weight: 700; }
.category-tile-blurb { margin-top: .25rem; color: rgba(255,255,255,.8); font-size: .875rem; }
.category-tile-cta   { margin-top: .75rem; display: inline-flex; align-items: center; gap: .25rem; }

/* ── Company Spotlight ── */
.company-spotlight-section { padding-bottom: 5rem; }
.company-band-title { margin-top: .75rem; }
.company-band-desc  { margin-top: .5rem; color: rgba(255,255,255,.65); max-width: 36rem; }
.company-card-head  { display: flex; align-items: flex-start; justify-content: space-between; gap: .75rem; }
.company-card-name  { margin-top: 1rem; font-size: 1.125rem; }
.company-card-sector { margin-top: .25rem; font-size: 12px; }
.company-card-blurb  { margin-top: .75rem; font-size: .875rem; flex: 1; }
.company-card-footer { display: flex; align-items: center; justify-content: space-between; margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--border); }
.company-cap-label   { color: var(--muted-foreground); }
.company-cap-value   { font: 700 .875rem/1 var(--font-display); margin-top: .25rem; }

/* ── Reserved Zone ── */
.reserved-desc    { margin-top: .75rem; max-width: 44rem; }
.reserved-card-top  { display: flex; align-items: center; justify-content: space-between; }
.reserved-card-body { display: flex; align-items: center; gap: 1rem; }
.reserved-card-icon { background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.2); color: var(--accent); }
.reserved-card-name { font-size: clamp(1.5rem,3vw,1.875rem); font-weight: 700; color: white; }
.reserved-card-cap  { margin-top: .25rem; font: 600 11px/1 var(--font-display); letter-spacing: .08em; text-transform: uppercase; color: rgba(255,255,255,.6); }

/* ── Region filters ── */
.hp-region-filters { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }

/* ── Premium Insights (dark section) ── */
.hp-dark-section { background: var(--primary); color: var(--primary-foreground); }
.hp-insights-desc { margin-top: .5rem; color: rgba(255,255,255,.6); max-width: 32rem; }
.hp-dark-section .hp-insights-desc { color: rgba(255,255,255,.6); }
.hp-insight-card  { display: flex; flex-direction: column; }
.hp-insight-meta  { display: flex; align-items: center; gap: .5rem; margin-top: 1rem; }
.hp-insight-title { margin-top: .75rem; color: white; font-size: 1.25rem; line-height: 1.35; }
.hp-insight-byline { margin-top: .5rem; color: rgba(255,255,255,.6); font-size: .875rem; }

/* ── Video Insights ── */
.hp-video-card   { display: flex; flex-direction: column; }
.hp-video-thumb  { position: relative; overflow: hidden; background: var(--primary); }
.hp-video-overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,.7), rgba(0,0,0,.1), transparent); }
.hp-video-play   { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: white; }
.hp-video-duration { position: absolute; right: .75rem; bottom: .75rem; background: rgba(0,0,0,.6) !important; color: white !important; border-color: rgba(255,255,255,.2) !important; }
.hp-video-meta   { display: flex; align-items: center; gap: .5rem; margin-top: 1rem; }
.hp-video-title  { margin-top: .5rem; font-size: 1rem; line-height: 1.4; }

/* ── Market Snapshot ── */
.market-snapshot-card { padding: 1.5rem; }
.hp-market-head       { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .5rem; margin-bottom: 1rem; }
.hp-market-title-row  { display: flex; align-items: center; gap: .5rem; color: var(--accent); }
.hp-market-icon       { display: flex; }
.hp-market-title      { color: var(--foreground); font-size: 1.125rem; }
.market-grid  { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 1rem; }
.market-tile  { border: 1px solid var(--border); border-radius: var(--radius); padding: 1rem; background: var(--background); }
.market-tile-label  { color: var(--muted-foreground); }
.market-tile-value  { margin-top: .25rem; font: 700 1.25rem/1 var(--font-display); }
.market-tile-change { margin-top: .25rem; font-size: .75rem; }

/* ── Article card region hidden state ── */
.article-card[hidden] { display: none; }
.img-clip { overflow: hidden; }

/* ─── FAQ Accordion ──────────────────────────────────────────────────────────── */
.co-faq-group   { border-top: 1px solid var(--border); }
.co-faq-item    { border-bottom: 1px solid var(--border); }

.co-faq-q {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  width: 100%;
  padding: 1.25rem 0;
  text-align: left;
  font: 600 1rem/1.4 var(--font-display);
  color: var(--foreground);
  background: none;
  border: none;
  cursor: pointer;
  transition: color .2s ease;
}
.co-faq-q:hover { color: var(--accent); }
.co-faq-q span  { flex: 1; }
.co-faq-q svg   { flex-shrink: 0; transition: transform .28s ease; color: var(--muted-foreground); }
.co-faq-item.open .co-faq-q svg { transform: rotate(180deg); }
.co-faq-item.open .co-faq-q     { color: var(--accent); }

.co-faq-a {
  max-height: 0;
  overflow: hidden;
  transition: max-height .35s ease;
}
.co-faq-item.open .co-faq-a { max-height: 1200px; }

.co-faq-a-inner {
  padding-bottom: 1.375rem;
  font-size: .9375rem;
  line-height: 1.75;
  color: var(--muted-foreground);
}
.co-faq-a-inner p { margin: .75rem 0 0; }
.co-faq-a-inner p:first-child { margin-top: 0; }

/* ─── Global Responsive Foundation ──────────────────────────────────────────── */

/* Prevent any element from causing horizontal scrolling.
   html uses overflow-x:clip (stronger than hidden) — it clips position:fixed
   descendants that are translated off-screen (e.g. the bookmark drawer), which
   overflow-x:hidden on body cannot contain because fixed elements are positioned
   relative to the viewport, not the document. This is the root cause of the
   rightward layout shift seen on Android Chrome but not iOS Safari. */
html { overflow-x: clip; }
body { overflow-x: hidden; max-width: 100%; }

/* Ensure all images and media are contained */
video, iframe, embed, object { max-width: 100%; }

/* Touch-friendly tap targets for all interactive elements */
.icon-btn, .pill-filter, .primary-btn, .accent-btn, .outline-btn,
.share-button, .menu-toggle, .nl-submit-btn, .filter-btn {
  min-height: 44px;
}
.pill-filter { display: inline-flex; align-items: center; }

/* Touch devices: make square icon buttons a full 44x44 tap target (width was
   only 36px). Scoped to coarse pointers so the desktop mouse UI stays compact. */
@media (pointer: coarse) {
  .icon-btn, .menu-toggle, .share-button { width: 44px; height: 44px; }
}
/* Company directory search: never let the inline-styled form overflow on phones */
@media (max-width: 639px) {
  #co-search-form { max-width: 100% !important; }
}

/* Menu toggle sizing/colours — display is controlled per breakpoint */
.menu-toggle {
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 4px;
  color: var(--foreground);
  border: 1px solid var(--border);
  padding: 0;
}
.menu-toggle:hover { color: var(--accent); border-color: var(--accent); }
/* Show hamburger only below desktop breakpoint */
@media (max-width: 1023px) {
  .menu-toggle { display: inline-flex; }
}

/* ── Bookmark drawer ─────────────────────────────────────────────────────────── */
.bookmark-drawer-backdrop { display: none; position: fixed; inset: 0; z-index: 299; background: rgba(0,0,0,.45); }
.bookmark-drawer-backdrop.open { display: block; }
.bookmark-drawer { position: fixed; top: 0; right: 0; bottom: 0; z-index: 300; width: min(360px,100vw); background: var(--surface); border-left: 1px solid var(--border); box-shadow: -8px 0 40px rgba(0,0,0,.3); transform: translateX(100%); transition: transform .25s ease; overflow-y: auto; }
.bookmark-drawer.open { transform: translateX(0); }
.bookmark-drawer-header { display: flex; align-items: center; justify-content: space-between; padding: 1.25rem 1.25rem .75rem; border-bottom: 1px solid var(--border); position: sticky; top: 0; background: var(--surface); z-index: 1; }
.bookmark-drawer-title { font: 600 1rem/1.2 var(--font-display); }
.bookmark-drawer-close { background: transparent; border: 0; cursor: pointer; color: var(--muted-foreground); padding: .25rem; line-height: 1; font-size: 1.2rem; }
.bookmark-drawer-close:hover { color: var(--foreground); }
.bookmark-list { padding: .75rem; display: flex; flex-direction: column; gap: .5rem; }
.bookmark-empty { padding: 2rem 1.25rem; text-align: center; color: var(--muted-foreground); font-size: .875rem; }
.bookmark-item { display: flex; align-items: flex-start; gap: .75rem; padding: .75rem; border: 1px solid var(--border); border-radius: 8px; }
.bookmark-item img { width: 3rem; height: 3rem; object-fit: cover; border-radius: 6px; flex-shrink: 0; }
.bookmark-item-text { flex: 1; min-width: 0; }
.bookmark-item-title { font-size: .875rem; font-weight: 600; line-height: 1.3; }
.bookmark-item-title a { color: var(--foreground); text-decoration: none; }
.bookmark-item-title a:hover { color: var(--accent); }
.bookmark-item-cat { font-size: .75rem; color: var(--muted-foreground); margin-top: .2rem; }
.bookmark-item-remove { background: transparent; border: 0; cursor: pointer; color: var(--muted-foreground); padding: .15rem; flex-shrink: 0; font-size: .875rem; line-height: 1; }
.bookmark-item-remove:hover { color: #ef4444; }

/* Bookmark button on article cards */
.bookmark-btn { background: transparent; border: 0; cursor: pointer; color: var(--muted-foreground); padding: .1rem; display: inline-flex; align-items: center; }
.bookmark-btn:hover { color: var(--accent); }
.bookmark-btn.saved svg { fill: var(--accent); stroke: var(--accent); }

/* ─── Mobile: max 639px ──────────────────────────────────────────────────────── */
@media (max-width: 639px) {

  /* --- Layout spacing --- */
  .section-pad    { padding-top: 2.5rem; padding-bottom: 2.5rem; }
  .section-pad-sm { padding-top: 1.5rem; padding-bottom: 1.5rem; }
  .container-fin  { padding-inline: 1rem; }

  /* --- Header --- */
  .header-row { height: 4rem; }
  .brand-logo { height: 2rem !important; max-height: 2rem !important; }
  .ticker-item { font-size: 11px; padding: 0 .65rem; }

  /* --- Hero --- */
  .home-hero-grid { padding-top: 1.25rem; padding-bottom: 2rem; gap: 1.5rem; }
  .hero-slide-title { font-size: 1.125rem; }
  .hero-slide-copy { padding: .875rem 1rem 1.125rem; }

  /* --- Trending strip --- */
  .trending-strip { margin-top: 1.5rem; }

  /* --- Section heads --- */
  .section-head { flex-direction: column; align-items: flex-start; gap: .5rem; margin-bottom: 1.25rem; }

  /* --- Latest News / Video region filter pills: horizontal scroll --- */
  .hp-region-filters {
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding-bottom: .375rem;
    max-width: 100%;
  }
  .hp-region-filters::-webkit-scrollbar { display: none; }
  .hp-region-filters .pill-filter { flex-shrink: 0; }

  /* --- Filter row: horizontal scroll instead of wrapping --- */
  .filter-row {
    flex-wrap: nowrap;
    justify-content: flex-start;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    gap: .4rem;
    margin-bottom: 1.25rem;
    padding-bottom: .75rem;
  }
  .filter-row::-webkit-scrollbar { display: none; }
  .pill-filter { flex: none; white-space: nowrap; }

  /* Companies directory tab row: horizontal scroll */
  [data-dir-filters] {
    flex-wrap: nowrap !important;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding-bottom: .5rem;
    margin-bottom: 1.5rem !important;
  }
  [data-dir-filters]::-webkit-scrollbar { display: none; }

  /* --- Article cards --- */
  .article-compact img { width: 4.25rem; height: 4.25rem; }
  .article-compact { gap: .625rem; }

  /* --- Company slider --- */
  .company-slide { flex-basis: 85%; }

  /* --- Post hero --- */
  .post-hero-inner { padding-top: 1.25rem; padding-bottom: 3rem; }
  .post-title { font-size: clamp(1.5rem, 6vw, 2rem); }
  .breadcrumbs { font-size: 10px; }
  .overlap-image { margin-top: -1.75rem; }
  .overlap-image img { border-radius: .375rem; }

  /* --- Prose --- */
  .prose-fin { font-size: 15px; line-height: 1.75; }
  .dropcap:first-letter { font-size: 3.25rem; }

  /* --- Tag list --- */
  .tag-list { gap: .375rem; }
  .tag-list span { font-size: 11px; padding: .35rem .6rem; }

  /* --- Footer --- */
  .footer-grid { padding-block: 2rem 2.5rem; gap: 2rem 1.25rem; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .footer-brand { grid-column: 1 / -1; text-align: left; }
  .footer-brand .footer-logo { margin-inline: 0; display: block; }
  .footer-brand > p { margin-inline: 0; text-align: left; max-width: 100%; font-size: .8125rem; }
  .footer-brand .footer-links { text-align: left; display: grid; margin-inline: 0; }
  .footer-col { min-width: 0; }
  .footer-col h4 { text-align: left; font-size: .6875rem; letter-spacing: .08em; }
  .footer-col .footer-links { text-align: left; font-size: .8125rem; }
  .footer-col .footer-links a { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .footer-disclaimer-inner { flex-direction: column; gap: .5rem; }
  .footer-disclaimer-inner > div p { font-size: 11px !important; }
  .footer-bottom { margin-top: .5rem; }
  .footer-bottom-row { flex-direction: column; gap: .625rem; align-items: center; padding-block: 1rem; }
  .footer-bottom-row > p { text-align: center; font-size: 11px !important; }
  .footer-logo { height: 2rem !important; max-height: 2rem !important; max-width: min(160px, 50vw) !important; }
  .socials { flex-wrap: wrap; justify-content: center; gap: .625rem; }
  .socials a { width: 2rem; height: 2rem; }

  /* --- Newsletter --- */
  .newsletter-grid { padding: 2.5rem 0; }

  /* --- Market widget: horizontal snap-scroll slider on mobile --- */
  .colitco-mw-cards {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    gap: .75rem;
    padding-bottom: .625rem;
    scrollbar-width: none;
  }
  .colitco-mw-cards::-webkit-scrollbar { display: none; }
  .colitco-mw-card {
    flex: 0 0 78vw !important;
    width: 78vw !important;
    max-width: 300px !important;
    min-width: 0 !important;
    scroll-snap-align: start;
    overflow: hidden;
    padding: .9rem;
  }
  .colitco-mw-card-price { font-size: 1.15rem; }
  .colitco-mw-cname { max-width: 100%; }
  /* Fix empty space: collapse Elementor widget container height */
  .elementor-widget-colitco_market_widget,
  .elementor-widget-colitco_market_widget .elementor-widget-container {
    height: auto !important;
    min-height: 0 !important;
  }

  /* --- Table maker --- */
  .naitrich-table { font-size: .8125rem; }
  .naitrich-table td, .naitrich-table thead th { padding: .5rem .75rem; }

  /* --- Page grid sidebar: full width on mobile --- */
  .page-grid { gap: 2rem; }
  .sidebar { gap: 1.5rem; }

  /* --- Activity log admin (frontend-facing tables) --- */
  .naitrich-log-wrap { padding: 0; }

  /* --- Post hero separator --- */
  .post-hero-sep { display: none; }

  /* --- Author bio card: let it stack cleanly --- */
  .author-bio-card { flex-direction: column; }

  /* --- Blockquote: tighter padding --- */
  blockquote { padding: 1.25rem 1rem; }

  /* --- Company page: remove forced multi-column grid span --- */
  [style*="grid-column:span"] { grid-column: auto !important; }

  /* --- Company spotlight: tighter bottom padding --- */
  .company-spotlight-section { padding-bottom: 2rem; }

  /* --- Market snapshot: compact layout on small screens --- */
  .market-snapshot-card { padding: 1rem; }
  .market-grid { grid-template-columns: repeat(2, 1fr); gap: .5rem; }
  .market-tile { padding: .75rem .875rem; }
  .market-tile-value { font-size: 1rem; }

  /* --- Post hero meta bar: share buttons left-aligned, not pushed right --- */
  .post-meta-bar > div[style*="margin-left:auto"] { margin-left: 0 !important; }

  /* --- Contact form: reduce inner padding on mobile --- */
  .card-fin[style*="padding:2rem"] { padding: 1.25rem !important; }

  /* --- Geo section head: allow wrapping so title and link don't collide --- */
  .geo-section-head { flex-wrap: wrap; gap: .75rem; }
  .geo-section-flag { font-size: 1.25rem; }

  /* --- Commodity filter row: horizontal scroll instead of wrapping --- */
  .commodity-filter-row {
    flex-wrap: nowrap !important;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding-bottom: .5rem;
  }
  .commodity-filter-row::-webkit-scrollbar { display: none; }
  .commodity-pill { flex-shrink: 0; }

  /* --- Geo divider: full width on mobile --- */
  .geo-divider { width: 100%; }

  /* --- Section head text-link: ensure it doesn't overflow --- */
  .section-head .text-link { white-space: nowrap; }
  .section-head .outline-btn { white-space: nowrap; }
  .section-head .accent-btn { white-space: nowrap; }
}

/* ─── 400px+: team/cols-4 grid shows 2 columns so avatars aren't lonely 1-up ─── */
@media (min-width: 400px) {
  .article-grid.cols-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ─── Small mobile: max 479px ────────────────────────────────────────────────── */
@media (max-width: 479px) {
  .post-title { font-size: 1.5rem; }
  .hero-slide-title { font-size: 1rem; }
  .newsletter-title { font-size: 1.75rem; }
  .article-compact img { width: 3.5rem; height: 3.5rem; }
  .top-list li { gap: .625rem; }
  .story-num { width: 1.375rem; font-size: 1.25rem; }

  /* Very small phones: mobile nav grid 1-column so links don't truncate */
  .mobile-grid { grid-template-columns: 1fr; }

  /* Company page: collapse hero to 2-row stacked on tiny screens */
  .co-hero-grid {
    grid-template-columns: auto 1fr;
    grid-template-areas: "logo info" "price price";
  }
  .co-hero-name { font-size: 1.25rem; }
  .co-breadcrumb { padding: .75rem 0 0; }

  /* Search panel: compact on tiny screens */
  .search-overlay { padding: 4rem .75rem 1.5rem; }
  .search-panel { border-radius: 12px; max-height: calc(100dvh - 5.5rem); }
  .sp-bar { padding: .875rem 1rem; }
  .sp-bar-input { font-size: 1rem; }
  .sp-body { padding: 1rem .875rem; }
  .sp-hints { display: none; }

  /* Geo side items: reduce thumbnail column on tiny screens */
  .geo-side-item { grid-template-columns: 4rem 1fr; gap: .625rem; }

  /* Market grid: force 2 columns even on tiny screens */
  .market-grid { grid-template-columns: repeat(2, 1fr); gap: .375rem; }
  .market-tile { padding: .625rem .75rem; }
  .market-tile-value { font-size: .9375rem; }

  /* Company spotlight band: reduce padding */
  .company-band-inner { padding: 1.5rem 0 2.5rem; }
}

/* ─── Tablet: 640px – 1023px ─────────────────────────────────────────────────── */
@media (min-width: 640px) and (max-width: 1023px) {
  .section-pad    { padding-top: 3.5rem; padding-bottom: 3.5rem; }
  .section-pad-sm { padding-top: 2rem;   padding-bottom: 2rem; }
  .prose-fin { font-size: 16px; }
}

/* ─── Tablet+: 768px up (before desktop nav kicks in) ────────────────────────── */
@media (min-width: 768px) {

  /* Hero: show 2-column split at tablet */
  .home-hero-grid {
    grid-template-columns: repeat(12, minmax(0, 1fr));
    padding-top: 2rem;
    padding-bottom: 3rem;
  }
  .hero-main    { grid-column: span 8 / span 8; }
  .top-stories  { grid-column: span 4 / span 4; padding-left: 1.5rem; border-left: 1px solid rgba(255,255,255,.1); }

  /* Footer: 2 column groups at tablet */
  .footer-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .footer-brand { grid-column: span 6 / span 6; }
  .footer-col   { grid-column: span 2 / span 2; }

  /* Category grid 3-col at tablet */
  .category-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* ─── Desktop override: brand + up to 5 link columns in one row ──────────────── */
@media (min-width: 1024px) {
  .footer-grid  { grid-template-columns: minmax(16rem, 1.5fr) repeat(5, minmax(0, 1fr)); }
  .footer-brand { grid-column: 1; }
  .footer-col   { grid-column: auto; }

  /* Post body: share rail visible */
  .post-body-grid { grid-template-columns: repeat(12, minmax(0, 1fr)); }
  .prose-content  { grid-column: span 8 / span 8; }
  .post-sidebar   { grid-column: span 4 / span 4; }
}

/* ─── Reusable horizontal-scroll container (no visible scrollbar) ────────────── */
[data-scroll-x] {
  overflow-x: auto;
  flex-wrap: nowrap !important;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
[data-scroll-x]::-webkit-scrollbar { display: none; }

/* ─── Tablet and below: guarantee single-column grid layouts ─────────────────── */
@media (max-width: 1023px) {
  /* page-grid and post-body-grid must NEVER create implicit multi-column tracks.
     Any child with an inline grid-column:span N would otherwise force N implicit
     columns and break mobile layouts. minmax(0,1fr) (not bare 1fr) lets the single
     column shrink to the viewport instead of growing to fit a wide child. */
  .page-grid,
  .post-body-grid { grid-template-columns: minmax(0, 1fr) !important; }

  /* Grid children must be allowed to shrink below their content width, otherwise a
     wide child (chart, table, long word, stacked sidebar) pushes the whole article
     past the viewport and it scrolls sideways. */
  .content-7, .content-8, .prose-content, .sidebar, .post-sidebar { min-width: 0; max-width: 100%; }
  .prose-fin img, .article-compact img, .sidebar img, .overlap-image img { max-width: 100%; height: auto; }

  /* Belt-and-suspenders: never let anything force horizontal page scroll on mobile.
     overflow-x: clip (unlike hidden) does not create a scroll container, so sticky
     positioning keeps working. */
  body { overflow-x: clip; }

  /* Share rail is hidden on mobile — ensure it takes no space */
  .share-rail { display: none !important; }

  /* Tab/filter bars in company page hero should scroll, not overflow */
  .co-tab-nav-wrap .container-fin {
    overflow-x: auto;
    flex-wrap: nowrap;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .co-tab-nav-wrap .container-fin::-webkit-scrollbar { display: none; }
  .co-tab-nav-wrap .pill-filter { white-space: nowrap; flex-shrink: 0; }

  /* Slider prev/next buttons: always visible on touch devices (can't hover) */
  .slider-btn { opacity: 0.85; }
  .rz-btn     { opacity: 0.85; }

  /* Slider slides at tablet: account for the 1rem gap so track stays in bounds */
  .company-slide, .reserved-slide { flex-basis: calc(50% - 0.5rem); }

  /* Company page logo: responsive sizing */
  .co-hero-logo-box { width: 4.5rem; height: 4.5rem; }
  .co-hero-logo-img { padding: .5rem; }

  /* Company body grid: single column on tablet */
  .co-body-grid { grid-template-columns: minmax(0, 1fr) !important; }
  .co-body-grid > * { min-width: 0; }
  .co-sidebar   { position: static !important; }
}

/* ─── Print ──────────────────────────────────────────────────────────────────── */
@media print {
  .site-header, .site-footer, .ticker-bar, .share-rail,
  .newsletter-section, .trending-strip, .sidebar { display: none !important; }
  .post-body-grid { display: block; }
  .prose-fin { font-size: 12pt; line-height: 1.6; color: #000; }
  .post-title { color: #000; font-size: 22pt; }
  a { color: #000; text-decoration: underline; }
}

/* Financial values — right-align last column */
.naitrich-table-wrap.numbers .naitrich-table td:not(:first-child),
.naitrich-table-wrap.numbers .naitrich-table th:not(:first-child) {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

@media (max-width: 640px) {
  .naitrich-table td,
  .naitrich-table th { padding: .5rem .75rem; font-size: .8125rem; }
}

/* ─── Header Socials ─────────────────────────────────────────────────────────── */
.header-socials {
  display: flex;
  align-items: center;
  gap: .25rem;
}
.header-socials .icon-btn {
  width: 2rem;
  height: 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius);
  color: var(--muted-foreground);
  transition: color .15s, background .15s;
}
.header-socials .icon-btn:hover {
  color: var(--foreground);
  background: var(--surface);
}
@media (max-width: 767px) { .header-socials { display: none; } }

/* ─── Geographic News Section ────────────────────────────────────────────────── */
.geo-news-section { padding-block: var(--section-pad, 3.5rem); }
.geo-news-section.bg-surface { background: var(--surface); }
.geo-news-section.bg-dark    { background: var(--navy-deep); color: var(--primary-foreground); }
.geo-news-section + .geo-news-section { border-top: 1px solid var(--border); }
.geo-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1.5rem;
  gap: 1rem;
}
.geo-section-flag {
  font-size: 1.5rem;
  line-height: 1;
}
.geo-section-title {
  font-family: var(--font-display);
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--foreground);
  display: flex;
  align-items: center;
  gap: .5rem;
}
.geo-news-section.bg-dark .geo-section-title { color: var(--primary-foreground); }
.geo-section-link {
  font-size: .8125rem;
  font-weight: 500;
  color: var(--accent);
  display: flex;
  align-items: center;
  gap: .25rem;
  white-space: nowrap;
}
.geo-divider { border: none; border-top: 2px solid var(--accent); margin-bottom: 1.75rem; width: 3rem; }

.geo-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem;
}
@media (max-width: 1023px) { .geo-grid { grid-template-columns: minmax(0, 1fr); } .geo-grid > * { min-width: 0; } }

/* Featured article */
.geo-featured { display: flex; flex-direction: column; gap: .75rem; }
.geo-feat-img-wrap { border-radius: var(--radius); overflow: hidden; aspect-ratio: 16/10; }
.geo-feat-img-wrap img { width: 100%; height: 100%; object-fit: cover; display: block; }
.geo-feat-meta {
  display: flex;
  align-items: center;
  gap: .5rem;
  font-size: .6875rem;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--muted-foreground);
}
.geo-feat-title {
  font-family: var(--font-display);
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.3;
  color: var(--foreground);
}
.geo-news-section.bg-dark .geo-feat-title { color: var(--primary-foreground); }
.geo-feat-title a { color: inherit; text-decoration: none; }
.geo-feat-title a:hover { color: var(--accent); }
.geo-feat-excerpt {
  font-size: .875rem;
  color: var(--muted-foreground);
  line-height: 1.55;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.geo-feat-byline { font-size: .75rem; color: var(--muted-foreground); }

/* Side grid */
.geo-side { display: flex; flex-direction: column; gap: .875rem; }
.geo-side-item {
  display: grid;
  grid-template-columns: 5rem 1fr;
  gap: .75rem;
  align-items: start;
  padding-bottom: .875rem;
  border-bottom: 1px solid var(--border);
}
.geo-side-item:last-child { border-bottom: none; padding-bottom: 0; }
.geo-side-img-wrap { border-radius: var(--radius); overflow: hidden; aspect-ratio: 4/3; }
.geo-side-img-wrap img { width: 100%; height: 100%; object-fit: cover; display: block; }
.geo-side-meta {
  font-size: .625rem;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--muted-foreground);
  margin-bottom: .25rem;
}
.geo-side-title {
  font-family: var(--font-display);
  font-size: .875rem;
  font-weight: 600;
  line-height: 1.35;
  color: var(--foreground);
}
.geo-news-section.bg-dark .geo-side-title { color: var(--primary-foreground); }
.geo-side-title a { color: inherit; text-decoration: none; }
.geo-side-title a:hover { color: var(--accent); }

/* ─── Commodity Filter Section ───────────────────────────────────────────────── */
.commodity-filter-row {
  display: flex;
  align-items: center;
  gap: .5rem;
  flex-wrap: wrap;
  margin-bottom: 1.5rem;
}
.commodity-pill {
  padding: .375rem .875rem;
  border-radius: 9999px;
  font-size: .75rem;
  font-weight: 600;
  letter-spacing: .04em;
  border: 1px solid var(--border);
  background: transparent;
  color: var(--muted-foreground);
  cursor: pointer;
  transition: background .15s, color .15s, border-color .15s;
  white-space: nowrap;
}
.commodity-pill:hover,
.commodity-pill.active {
  background: var(--accent);
  border-color: var(--accent);
  color: var(--accent-foreground);
}

/* ─── Editorial / Geopolitics Section ───────────────────────────────────────── */
.editorial-section,
.geopolitics-section {
  padding-block: var(--section-pad, 3.5rem);
}
.editorial-section   { background: var(--navy); color: var(--primary-foreground); }
.geopolitics-section { background: var(--navy-deep); color: var(--primary-foreground); }
.editorial-section .section-title,
.geopolitics-section .section-title { color: var(--primary-foreground); }
.editorial-section .eyebrow,
.geopolitics-section .eyebrow { color: var(--accent); }
.editorial-section .text-link,
.geopolitics-section .text-link { color: var(--primary-foreground); }

.editorial-grid {
  display: grid;
  gap: 1.5rem;
  grid-template-columns: repeat(3, 1fr);
}
@media (max-width: 1023px) { .editorial-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 639px)  { .editorial-grid { grid-template-columns: 1fr; } }
.editorial-grid.cols-2 { grid-template-columns: repeat(2, 1fr); }
@media (max-width: 639px) { .editorial-grid.cols-2 { grid-template-columns: 1fr; } }

.editorial-card {
  background: rgb(255 255 255 / .04);
  border: 1px solid rgb(255 255 255 / .12);
  border-top: 3px solid var(--accent);
  border-radius: var(--radius);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: background .15s;
}
.editorial-card:hover { background: rgb(255 255 255 / .07); }
.editorial-card-img { aspect-ratio: 16/10; overflow: hidden; }
.editorial-card-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.editorial-card-body { padding: 1rem; display: flex; flex-direction: column; gap: .5rem; flex: 1; }
.editorial-card-meta {
  display: flex;
  gap: .5rem;
  align-items: center;
  font-size: .625rem;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: rgb(255 255 255 / .5);
}
.editorial-card-title {
  font-family: var(--font-display);
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.35;
  color: var(--primary-foreground);
}
.editorial-card-title a { color: inherit; text-decoration: none; }
.editorial-card-title a:hover { color: var(--accent); }
.editorial-card-excerpt {
  font-size: .8125rem;
  color: rgb(255 255 255 / .6);
  line-height: 1.5;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  flex: 1;
}
.editorial-card-byline {
  font-size: .75rem;
  color: rgb(255 255 255 / .45);
  margin-top: .25rem;
}

/* ─── Newsletter Topic Checkboxes ────────────────────────────────────────────── */
.nl-topics-grid {
  display: flex;
  flex-wrap: wrap;
  gap: .375rem .75rem;
}
.nl-topic-check {
  display: flex;
  align-items: center;
  gap: .375rem;
  font-size: .8125rem;
  color: var(--muted-foreground);
  cursor: pointer;
  user-select: none;
}
.nl-topic-check input[type="checkbox"] {
  accent-color: var(--accent);
  width: .875rem;
  height: .875rem;
  cursor: pointer;
}
.nl-topic-check:hover { color: var(--foreground); }

/* ─── Footer Newsletter Band ─────────────────────────────────────────────────── */
.footer-newsletter-band {
  background: var(--navy-deep);
  border-bottom: 1px solid rgb(255 255 255 / .08);
  padding-block: 3rem;
}
.footer-newsletter-inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2.5rem;
  align-items: center;
}
@media (max-width: 767px) {
  .footer-newsletter-inner { grid-template-columns: 1fr; gap: 1.5rem; }
}
.footer-newsletter-copy .eyebrow { color: var(--accent); margin-bottom: .5rem; }
.footer-newsletter-title {
  font-family: var(--font-display);
  font-size: clamp(1.25rem, 2.5vw, 1.625rem);
  font-weight: 700;
  color: var(--primary-foreground);
  line-height: 1.25;
}
.footer-newsletter-desc {
  margin-top: .75rem;
  font-size: .875rem;
  color: rgb(255 255 255 / .92);
  line-height: 1.65;
}
.footer-nl-row {
  display: flex;
  gap: .5rem;
}
.footer-nl-input {
  flex: 1;
  min-width: 0;
  background: rgb(255 255 255 / .07);
  border: 1px solid rgb(255 255 255 / .15);
  color: var(--primary-foreground);
  border-radius: var(--radius);
  padding: .75rem 1rem;
  font-size: .875rem;
}
.footer-nl-input::placeholder { color: rgb(255 255 255 / .6); }
.footer-nl-input:focus { outline: none; border-color: var(--accent); }
.footer-nl-btn { white-space: nowrap; }
.footer-newsletter-note {
  margin-top: .625rem;
  font-size: .75rem;
  color: rgb(255 255 255 / .72);
}
@media (max-width: 479px) {
  .footer-nl-row { flex-direction: column; }
  .footer-nl-btn { width: 100%; justify-content: center; }
}

/* ─── Market Overview Section ───────────────────────────────────────────────── */
.market-overview-section {
  padding: 1.75rem 0;
  background: var(--card);
  border-bottom: 1px solid var(--border);
}

.mo-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1.25rem;
  gap: 1rem;
  flex-wrap: wrap;
}

.mo-header-left {
  display: flex;
  align-items: center;
  gap: .5rem;
  color: var(--accent);
}

.mo-eyebrow {
  font: 700 .6875rem/1 var(--font-display);
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--accent);
}

.mo-grid {
  display: grid;
  gap: .75rem;
  grid-template-columns: repeat(var(--mo-cols-m, 2), 1fr);
}

@media (min-width: 480px) {
  .mo-grid { grid-template-columns: repeat(var(--mo-cols-m, 2), 1fr); }
}

@media (min-width: 640px) {
  .mo-grid { grid-template-columns: repeat(var(--mo-cols-t, 3), 1fr); }
}

@media (min-width: 1024px) {
  .mo-grid { grid-template-columns: repeat(var(--mo-cols-d, 6), 1fr); }
}

.mo-tile {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 1rem;
  display: flex;
  flex-direction: column;
  gap: .25rem;
  min-width: 0;
  overflow: hidden;
  transition: border-color .2s ease, background .2s ease;
}
.mo-tile:hover { border-color: rgba(119,247,197,.35); background: color-mix(in oklab, var(--surface) 92%, var(--accent)); }

.mo-tile-header {
  display: flex;
  align-items: center;
  gap: .4rem;
  margin-bottom: .375rem;
}

.mo-tile-icon {
  font-size: .9375rem;
  line-height: 1;
  flex-shrink: 0;
}

.mo-tile-name {
  font: 700 .5625rem/1 var(--font-display);
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--muted-foreground);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mo-tile-price {
  font: 700 1.125rem/1.15 var(--font-display);
  color: var(--foreground);
  letter-spacing: -.01em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mo-tile-unit {
  font: 400 .5625rem/1 var(--font-sans);
  color: var(--muted-foreground);
  letter-spacing: .05em;
  text-transform: uppercase;
}

.mo-tile-change {
  display: flex;
  align-items: center;
  gap: .2rem;
  font: 600 .6875rem/1 var(--font-display);
  margin-top: .3rem;
  white-space: nowrap;
  overflow: hidden;
}
.mo-tile-change.bull { color: var(--bull); }
.mo-tile-change.bear { color: var(--bear); }

.mo-tile-change-arrow {
  font-size: .5625rem;
  flex-shrink: 0;
}

.mo-tile-pct { opacity: .8; }

.mo-tile-spark {
  margin-top: .5rem;
  height: 30px;
  flex-shrink: 0;
  overflow: hidden;
}

/* Mobile: compact */
@media (max-width: 479px) {
  .market-overview-section { padding: 1.25rem 0; }
  .mo-tile { padding: .75rem .875rem; gap: .2rem; }
  .mo-tile-price { font-size: .9375rem; }
  .mo-tile-spark { height: 22px; margin-top: .375rem; }
  .mo-tile-header { margin-bottom: .25rem; }
}

/* ─── Mining News Section ────────────────────────────────────────────────────── */
.mn-section { position: relative; }
.mn-bg-surface { background: var(--surface); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.mn-bg-dark { background: var(--primary); color: var(--primary-foreground); }

.mn-section-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1.25rem;
  flex-wrap: wrap;
  margin-bottom: 2rem;
}

.mn-title-block { flex: none; }

.mn-controls {
  display: flex;
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
  margin-top: .625rem;
}

/* ── Filter bar ── */
.mn-filter-bar {
  display: flex;
  align-items: center;
  gap: .625rem;
  flex-wrap: wrap;
}

.mn-filter-label {
  display: flex;
  align-items: center;
  gap: .3rem;
  font-family: var(--font-display);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--muted-foreground);
  white-space: nowrap;
  flex-shrink: 0;
}
.mn-filter-icon { flex-shrink: 0; color: var(--accent); }

/* Pills — visible on desktop */
.mn-filter-pills {
  display: none;
  align-items: center;
  gap: .35rem;
  flex-wrap: wrap;
}

/* Native select — visible on mobile */
.mn-filter-select {
  display: block;
  padding: .45rem .875rem .45rem .75rem;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  font: 600 12px/1 var(--font-display);
  color: var(--foreground);
  background: var(--background);
  cursor: pointer;
  min-width: 160px;
  -webkit-appearance: none;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23888' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right .75rem center;
  padding-right: 2rem;
}
.mn-filter-select:focus { outline: none; border-color: var(--accent); }

/* Hidden items */
[data-mn-item][hidden] { display: none !important; }

/* Dark style overrides */
.mn-bg-dark .mn-filter-label { color: rgba(255,255,255,.5); }
.mn-bg-dark .mn-filter-icon { color: var(--gold); }
.mn-bg-dark .mn-filter-select {
  background-color: rgba(255,255,255,.07);
  border-color: rgba(255,255,255,.15);
  color: white;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
}
.mn-bg-dark .pill-filter {
  border-color: rgba(255,255,255,.18);
  color: rgba(255,255,255,.72);
}
.mn-bg-dark .pill-filter.active {
  background: var(--primary-foreground);
  color: var(--primary);
  border-color: var(--primary-foreground);
}

/* Responsive */
@media (min-width: 640px) {
  .mn-filter-pills  { display: flex; }
  .mn-filter-select { display: none; }
}

@media (max-width: 639px) {
  .mn-section-head { flex-direction: column; align-items: flex-start; gap: 1rem; }
  .mn-controls { gap: .75rem; flex-direction: column; align-items: flex-start; }
  .mn-filter-bar { gap: .5rem; }
}

/* ─── Latest Mining News + Breaking News Section ────────────────────────────── */
.lmn-section { padding: 3rem 0; border-top: 1px solid var(--border); }
.lmn-section > .container-fin { padding-inline: 2.5rem; }
.lmn-outer { display: grid; grid-template-columns: 1fr 300px; gap: 2.25rem; align-items: start; }

.lmn-header {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 1.5rem; gap: 1rem; flex-wrap: wrap;
}
.lmn-controls { display: flex; align-items: center; gap: .75rem; flex-shrink: 0; }

.lmn-filter-select {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  color: var(--foreground);
  font: 500 .8125rem/1 var(--font-sans);
  padding: .4375rem 1.75rem .4375rem .75rem;
  cursor: pointer;
  outline: none;
  -webkit-appearance: none;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%2398a7b5' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right .6rem center;
  transition: border-color .2s;
}
.lmn-filter-select:hover,
.lmn-filter-select:focus { border-color: var(--accent); }
.lmn-filter-select option { background: var(--card); color: var(--foreground); }

/* Breaking news sidebar */
.lmn-breaking-card { padding: 1.25rem; position: sticky; top: 5rem; }
.lmn-breaking-head {
  display: flex; align-items: center; gap: .4rem;
  margin-bottom: 1rem; padding-bottom: .875rem;
  border-bottom: 1px solid var(--border);
}
.lmn-breaking-bolt { color: var(--accent); display: flex; align-items: center; }
.lmn-breaking-label {
  font: 700 .6875rem/1 var(--font-display);
  letter-spacing: .12em; text-transform: uppercase; color: var(--foreground);
}
.lmn-breaking-list { display: grid; }
.lmn-breaking-item {
  padding: .8rem 0;
  border-bottom: 1px solid var(--border);
}
.lmn-breaking-item:last-child { border-bottom: none; padding-bottom: 0; }
.lmn-breaking-time {
  display: flex; align-items: center; gap: .35rem;
  font: 600 .625rem/1 var(--font-sans);
  letter-spacing: .04em; color: var(--accent);
  margin-bottom: .3rem;
}
.lmn-breaking-time::before {
  content: ''; width: 5px; height: 5px; border-radius: 50%;
  background: var(--accent); flex-shrink: 0;
}
.lmn-breaking-title {
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden;
  font: 600 .8125rem/1.45 var(--font-display);
  color: var(--foreground); text-decoration: none;
  transition: color .15s;
}
.lmn-breaking-title:hover { color: var(--accent); }
.lmn-breaking-all {
  display: flex; align-items: center; justify-content: center; gap: .4rem;
  margin-top: 1.125rem; padding: .625rem 1rem;
  border: 1px solid var(--border); border-radius: var(--radius);
  font: 700 .625rem/1 var(--font-display);
  letter-spacing: .1em; text-transform: uppercase;
  color: var(--muted-foreground); text-decoration: none;
  transition: border-color .2s, color .2s, background .2s;
}
.lmn-breaking-all:hover { border-color: var(--accent); color: var(--accent); background: rgba(119,247,197,.05); }
.lmn-no-results { color: var(--muted-foreground); padding: 2rem 0; font-size: .9rem; }

@media (max-width: 1023px) {
  .lmn-outer { grid-template-columns: minmax(0, 1fr); }
  .lmn-breaking-card { position: static; }
  .lmn-section > .container-fin { padding-inline: 1.5rem; }
}
@media (max-width: 639px) {
  .lmn-section { padding: 2rem 0; }
  .lmn-section > .container-fin { padding-inline: 1rem; }
  .lmn-header { flex-direction: column; align-items: flex-start; gap: .75rem; }
  /* Stack breaking news above articles on mobile */
  .lmn-outer { display: flex; flex-direction: column; }
  .lmn-breaking { order: -1; margin-bottom: 1.5rem; }
  /* Show only first 6 articles on mobile to avoid endless scroll */
  [data-lmn-item]:nth-child(n+7) { display: none; }
  /* Filter controls: full-width column layout */
  .lmn-controls { flex-direction: column; align-items: stretch; width: 100%; gap: .5rem; }
  .lmn-filter-select { width: 100%; }
}

/* ─── Hero V2 — Full-bleed image hero (matches design reference) ────────────── */
:root {
  --hero-green: #77f7c5;
  --hero-green-dark: #071218;
}

.hero-v2 {
  position: relative;
  min-height: 580px;
  display: flex;
  align-items: stretch;
  overflow: hidden;
  color: #fff;
}

.hero-v2-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.hero-v2-bg-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 30%;
  display: block;
}

.hero-v2-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    105deg,
    rgba(7, 18, 24, 0.92) 0%,
    rgba(7, 18, 24, 0.82) 45%,
    rgba(7, 18, 24, 0.65) 70%,
    rgba(7, 18, 24, 0.50) 100%
  );
}

.hero-v2-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1fr;
  gap: 2.5rem;
  padding-top: 4rem;
  padding-bottom: 4.5rem;
  align-items: center;
}

.hero-v2-label {
  display: flex;
  align-items: center;
  gap: .5rem;
  margin-bottom: 1.5rem;
}

.hero-v2-arrow-icon {
  color: var(--hero-green);
  flex-shrink: 0;
}

.hero-v2-eyebrow {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--hero-green);
}

.hero-v2-title {
  font-size: clamp(1.875rem, 4.5vw, 3.25rem);
  font-weight: 700;
  line-height: 1.08;
  color: #fff;
  letter-spacing: -0.02em;
  margin: 0 0 1.25rem;
}

.hero-v2-title a { color: inherit; }
.hero-v2-title a:hover { color: var(--hero-green); }

.hero-v2-desc {
  font-size: 1rem;
  line-height: 1.65;
  color: rgba(255, 255, 255, .72);
  max-width: 38rem;
  margin: 0 0 2rem;
}

.hero-v2-cta {
  display: inline-flex;
  align-items: center;
  gap: .75rem;
  padding: .875rem 1.875rem;
  border: 1px solid var(--hero-green);
  color: #fff;
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  border-radius: var(--radius);
  transition: background .2s ease, color .2s ease, border-color .2s ease;
  text-decoration: none;
}
.hero-v2-cta:hover {
  background: var(--hero-green);
  color: var(--hero-green-dark);
  border-color: var(--hero-green);
}
.hero-v2-cta svg { transition: transform .2s ease; }
.hero-v2-cta:hover svg { transform: translateX(3px); }

/* Side story list */
.hero-v2-aside {
  padding-left: 2rem;
  border-left: 2px solid var(--hero-green);
}

.hero-v2-story-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
}

.hero-v2-story {
  display: flex;
  align-items: flex-start;
  gap: 1.125rem;
  padding: 1.25rem 0;
  border-bottom: 1px solid rgba(255, 255, 255, .1);
}
.hero-v2-story:first-child { padding-top: 0; }
.hero-v2-story:last-child  { border-bottom: 0; padding-bottom: 0; }

.hero-v2-story-num {
  font-family: var(--font-display);
  font-size: 1.375rem;
  font-weight: 700;
  color: rgba(255, 255, 255, .35);
  flex: none;
  line-height: 1.2;
  min-width: 2rem;
}

.hero-v2-story-body { flex: 1; min-width: 0; }

.hero-v2-story-title {
  font-family: var(--font-display);
  font-size: .9375rem;
  font-weight: 600;
  line-height: 1.35;
  color: rgba(255, 255, 255, .88);
  margin: 0;
  transition: color .2s ease;
}
.hero-v2-story a:hover .hero-v2-story-title { color: var(--hero-green); }

/* Desktop: 2-column layout */
@media (min-width: 1024px) {
  .hero-v2 { min-height: 640px; }
  .hero-v2-grid {
    grid-template-columns: 1fr 380px;
    gap: 0;
    padding-top: 5rem;
    padding-bottom: 5.5rem;
  }
  .hero-v2-aside {
    padding-left: 3rem;
    margin-left: 2rem;
  }
}

/* Tablet */
@media (min-width: 640px) and (max-width: 1023px) {
  .hero-v2-grid {
    grid-template-columns: 3fr 2fr;
    gap: 2rem;
    padding-top: 3.5rem;
    padding-bottom: 4rem;
  }
}

/* Mobile */
@media (max-width: 639px) {
  .hero-v2 { min-height: 0; }
  .hero-v2-grid {
    padding-top: 2.5rem;
    padding-bottom: 3rem;
    gap: 2rem;
    grid-template-columns: 1fr;
  }
  .hero-v2-aside { display: none; }
  .hero-v2-title { font-size: clamp(1.625rem, 6vw, 2.25rem); }
  .hero-v2-desc { font-size: .9375rem; }
}

/* ─── Homepage Mobile Responsiveness ─────────────────────────────────────────── */

/* Reserved card: reduce fixed height on mobile so it fits the viewport */
@media (max-width: 639px) {
  .reserved-card { height: 13rem; }
  .reserved-slide { flex-basis: 85%; }
  .reserved-content { padding: 1.25rem; }
}

/* Market Overview header: stack on very small screens */
@media (max-width: 479px) {
  .mo-header { flex-direction: column; align-items: flex-start; gap: .5rem; }
}

/* Premium Insights / Video: scale down font on mobile */
@media (max-width: 639px) {
  .hp-insight-title { font-size: 1rem; }
  .hp-video-title   { font-size: .9375rem; }
}

/* ─── Single Article Page: Additional Mobile Fixes ───────────────────────── */

/* Related stories band: reduce large top margin on mobile */
.post-related-section { margin-top: 5rem; }
@media (max-width: 639px) { .post-related-section { margin-top: 3rem; } }

/* Post meta bar: tighter gap on mobile */
@media (max-width: 639px) {
  .post-meta-bar { gap: .625rem; }
}

/* Post meta bar: stack vertically on very small phones so author/date/share
   each get their own clear row instead of cramming into one line */
@media (max-width: 479px) {
  .post-meta-bar {
    flex-direction: column;
    align-items: flex-start;
  }
  /* Remove the margin-left:auto that pushes share buttons to the far right */
  .post-meta-bar > div[style*="margin-left:auto"] { margin-left: 0 !important; }
}

/* ─── Company Pages: Mobile Refinements ─────────────────────────────────── */

@media (max-width: 639px) {
  /* Breadcrumb: allow wrapping when sector names are long */
  .co-breadcrumb { flex-wrap: wrap; }

  /* Company description text: scale down to match site-wide mobile body size */
  .co-blurb, .co-prose { font-size: 1rem; line-height: 1.7; }
}

/* ─── Elementor Widgets: Mobile Fixes ────────────────────────────────────── */

/* Category Tiles: 2-column grid on mobile so 6 tiles don't stack into ~1,660px of scroll */
@media (max-width: 639px) {
  .category-grid { grid-template-columns: repeat(2, 1fr); }
  .category-copy { padding: 1rem; }
  .category-copy h3 { font-size: 1.125rem !important; }
  .category-tile-blurb { font-size: .8125rem; }
}

/* ─── Home page: equal vertical spacing between ALL sections ──────────────────
   Every top-level home section (incl. the thin Market Overview & Trending bars)
   is forced onto a single vertical rhythm so the gap between every section is
   identical. Scoped to body.home so inner pages keep their own spacing.
   Scale matches the theme's section-pad steps: 5rem / 3.5rem / 2.5rem.        */
body.home .market-overview-section,
body.home .lmn-section,
body.home .geo-news-section,
body.home .section-pad,
body.home .section-pad-sm,
body.home .trending-row,
body.home .company-band-inner {
  padding-top: 5rem !important;
  padding-bottom: 5rem !important;
}
body.home .trending-strip { margin-top: 0 !important; }
body.home .company-spotlight-section { padding-bottom: 5rem !important; }

@media (min-width: 640px) and (max-width: 1023px) {
  body.home .market-overview-section,
  body.home .lmn-section,
  body.home .geo-news-section,
  body.home .section-pad,
  body.home .section-pad-sm,
  body.home .trending-row,
  body.home .company-band-inner {
    padding-top: 3.5rem !important;
    padding-bottom: 3.5rem !important;
  }
  body.home .company-spotlight-section { padding-bottom: 3.5rem !important; }
}
@media (max-width: 639px) {
  body.home .market-overview-section,
  body.home .lmn-section,
  body.home .geo-news-section,
  body.home .section-pad,
  body.home .section-pad-sm,
  body.home .trending-row,
  body.home .company-band-inner {
    padding-top: 2.5rem !important;
    padding-bottom: 2.5rem !important;
  }
  body.home .company-spotlight-section { padding-bottom: 2.5rem !important; }
}

/* ─── Companies directory: refined card grid ─────────────────────────────────
   Equal-height cards with a uniform avatar, sector tag and a footer (Market Cap
   + Profile link) pinned to the same baseline across every card. Toolbar adds a
   sector filter + sort dropdown next to the exchange pills.                    */
.co-toolbar {
  display: flex; align-items: center; justify-content: space-between;
  gap: 1rem; flex-wrap: wrap; margin-bottom: 2rem;
}
.co-toolbar-controls { display: flex; align-items: center; gap: .75rem; flex-wrap: wrap; }
.co-select {
  background: var(--card); border: 1px solid var(--border); border-radius: var(--radius);
  color: var(--foreground); font: 500 .8125rem/1 var(--font-sans);
  padding: .5rem 2rem .5rem .75rem; cursor: pointer; outline: none;
  -webkit-appearance: none; appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%2398a7b5' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right .7rem center;
  transition: border-color .2s;
}
.co-select:hover, .co-select:focus { border-color: var(--accent); }
.co-select option { background: var(--card); color: var(--foreground); }

/* Equal-height cards: override the article-grid's top alignment for this grid */
#co-grid { align-items: stretch; }

.co-card {
  display: flex; flex-direction: column; height: 100%;
  padding: 1.25rem; text-decoration: none;
  transition: border-color .2s, transform .2s, box-shadow .2s;
}
.co-card:hover { border-color: var(--accent); transform: translateY(-2px); box-shadow: 0 8px 24px rgba(0,0,0,.12); }

.co-card-head { display: flex; align-items: center; gap: .75rem; }
.co-logo {
  width: 2.75rem; height: 2.75rem; border-radius: 8px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center; overflow: hidden;
}
.co-logo--img { background: #fff; border: 1px solid var(--border); padding: 4px; }
.co-logo--img img { max-width: 100%; max-height: 100%; object-fit: contain; }
.co-logo--initials {
  background: var(--primary); color: var(--primary-foreground);
  font: 700 .9rem/1 var(--font-display); letter-spacing: .02em;
}

.co-card-head-text { min-width: 0; flex: 1; }
.co-name {
  font: 700 1rem/1.3 var(--font-display); color: var(--foreground);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.co-card-tags { display: flex; align-items: center; gap: .4rem; margin-top: .35rem; flex-wrap: wrap; }
.co-exch { font: 600 10px/1 var(--font-display); letter-spacing: .06em; text-transform: uppercase; color: var(--muted-foreground); }

.co-sector-tag {
  align-self: flex-start; margin-top: .85rem;
  padding: .25rem .6rem; border-radius: 999px;
  background: var(--surface); border: 1px solid var(--border);
  font: 600 11px/1.2 var(--font-display); color: var(--muted-foreground);
}
.co-blurb { font-size: .875rem; line-height: 1.55; margin-top: .75rem; }

.co-foot {
  margin-top: auto; padding-top: 1rem;
  display: flex; align-items: center; justify-content: space-between; gap: .5rem;
  border-top: 1px solid var(--border);
}
.co-cap { font-size: .8rem; }
.co-cap strong { font-weight: 700; }
.co-profile {
  display: inline-flex; align-items: center; gap: .3rem;
  font: 700 11px/1 var(--font-display); letter-spacing: .06em; text-transform: uppercase;
  color: var(--accent); flex-shrink: 0; transition: gap .2s;
}
.co-profile svg { width: 14px; height: 14px; }
.co-card:hover .co-profile { gap: .55rem; }
