/* =========================================================
   MODENU v3.2.2 — Definitive overrides
   Loaded at the tail of main.css to guarantee that the fixes
   for logo layout, unified colors, button styling, and
   desktop/mobile proportions win against any legacy rule.
   Mobile-first: base rules target phones; media queries
   scale UP for tablets and desktops.
   ========================================================= */

/* -------- 1. Logo: single line, single white color -------- */
.site-header .logo-wrap,
.logo-wrap{
	display:flex !important;
	align-items:center !important;
	gap:10px !important;
	width:auto !important;
	height:auto !important;
	flex-shrink:0 !important;
	white-space:nowrap !important;
	text-decoration:none !important;
}
.site-header .logo-img,
.logo-img{
	width:36px !important;
	height:36px !important;
	flex-shrink:0 !important;
	background:transparent !important;
	border-radius:0 !important;
	overflow:visible !important;
}
.site-header .logo-img img,
.logo-img img,
.logo-wrap img{
	width:36px !important;
	height:36px !important;
	object-fit:contain !important;
	border-radius:0 !important;
	display:block !important;
	background:transparent !important;
}
.site-header .logo-text,
.logo-text{
	display:inline-flex !important;
	flex-direction:row !important;
	align-items:baseline !important;
	gap:0 !important;
	line-height:1 !important;
	white-space:nowrap !important;
}
.site-header .logo-name,
.logo-name{
	font-size:1.05rem !important;
	font-weight:900 !important;
	letter-spacing:1.6px !important;
	text-transform:uppercase !important;
	color:#FFFFFF !important;
	-webkit-text-fill-color:#FFFFFF !important;
	background:none !important;
	-webkit-background-clip:initial !important;
	background-clip:initial !important;
}
.site-header .logo-dot,
.logo-dot{
	font-size:1.1rem !important;
	font-weight:900 !important;
	color:#FFFFFF !important;
	margin:0 1px !important;
}
.site-header .logo-tld,
.logo-tld{
	font-size:.82rem !important;
	font-weight:800 !important;
	color:#FFFFFF !important;
	letter-spacing:1px !important;
	text-transform:uppercase !important;
}

/* -------- 2. Hot Right Now card: single solid color -------- */
.showcase{
	padding:16px !important;
	border-radius:18px !important;
}
.showcase-feature{
	position:relative !important;
	border-radius:16px !important;
	overflow:hidden !important;
	min-height:190px !important;
	background:#16A34A !important;
	background-image:none !important;
	box-shadow:0 6px 18px rgba(0,0,0,.22) !important;
}
.showcase-feature:hover{
	transform:translateY(-2px) !important;
	box-shadow:0 10px 24px rgba(0,0,0,.32) !important;
}
.showcase-feature-bg,
.showcase-feature .showcase-feature-bg{
	display:none !important;
	background:none !important;
	background-image:none !important;
	filter:none !important;
	opacity:0 !important;
}
.showcase-feature-overlay,
.showcase-feature .showcase-feature-overlay{
	display:none !important;
	background:none !important;
}
.showcase-feature-content{
	position:relative !important;
	padding:16px !important;
	gap:10px !important;
}
.showcase-feature-info h4{
	font-size:1.05rem !important;
}
.showcase-feature-info p{
	font-size:.78rem !important;
}

/* -------- 3. Buttons: single solid color, no colored glow -------- */
.btn-primary{
	background:#16A34A !important;
	background-image:none !important;
	color:#fff !important;
	box-shadow:none !important;
	border:0 !important;
	padding:12px 22px !important;
	font-size:.88rem !important;
	border-radius:12px !important;
}
.btn-primary:hover{ background:#15803D !important; box-shadow:none !important; }

.btn-sec{
	background:#1F2937 !important;
	background-image:none !important;
	color:#E5E7EB !important;
	border:1px solid rgba(255,255,255,.12) !important;
	box-shadow:none !important;
	padding:12px 22px !important;
	font-size:.88rem !important;
	border-radius:12px !important;
}
.btn-sec:hover{ background:#374151 !important; transform:none !important; border-color:rgba(255,255,255,.2) !important; }

.showcase-feature-btn,
.showcase .showcase-feature-btn{
	background:#16A34A !important;
	background-image:none !important;
	color:#fff !important;
	box-shadow:none !important;
	border:0 !important;
	padding:11px 16px !important;
	font-size:.88rem !important;
	border-radius:10px !important;
}
.showcase-feature-btn:hover{ background:#15803D !important; box-shadow:none !important; transform:none !important; }

.hot-dl-btn,
.showcase-tile-dl,
.dl-btn,
.tool-btn,
.dl-energy-btn,
.ov-btn{
	background:#16A34A !important;
	background-image:none !important;
	color:#fff !important;
	box-shadow:none !important;
	border:0 !important;
}
.hot-dl-btn:hover,
.showcase-tile-dl:hover,
.dl-btn:hover,
.tool-btn:hover,
.dl-energy-btn:hover,
.ov-btn:hover{ background:#15803D !important; box-shadow:none !important; transform:none !important; }

/* -------- 4. Hot Right Now badges: cleaner, no colored shadows -------- */
.sf-badge{ box-shadow:none !important; backdrop-filter:none !important; }
.sf-badge-hot{ background:#EF4444 !important; box-shadow:none !important; }
.sf-badge-mod{ background:rgba(255,255,255,.14) !important; color:#fff !important; box-shadow:none !important; }

/* -------- 5. Header: tighter, aligned to design system -------- */
.site-header{ height:60px !important; }
.site-header .header-inner{ height:60px !important; max-width:1200px !important; padding:0 20px !important; }
.site-header .nav-list a{ padding:7px 12px !important; font-size:.88rem !important; }
.site-header .header-actions .icon-btn{ width:36px !important; height:36px !important; font-size:.85rem !important; }

/* -------- 6. Hero: smaller proportions on desktop -------- */
.hero{ padding:32px 0 24px !important; }
.hero-grid{ max-width:1160px !important; margin:0 auto !important; gap:32px !important; }
.brand-l1,.brand-l2{ font-size:clamp(1.9rem,4.2vw,3.1rem) !important; line-height:1.05 !important; letter-spacing:-.5px !important; }
.brand-l3{ font-size:clamp(1rem,1.8vw,1.35rem) !important; letter-spacing:2px !important; margin-top:6px !important; }
.hero-tagline{ font-size:.68rem !important; letter-spacing:2.5px !important; margin-bottom:8px !important; }
.hero-subtitle-row{ margin-bottom:14px !important; }
.hero-sub{ font-size:.9rem !important; line-height:1.6 !important; max-width:460px !important; margin-bottom:16px !important; }
.hero-cta{ gap:10px !important; margin-bottom:18px !important; }
.stats-row{ gap:14px !important; }

/* -------- 7. Ticker: keep neutral, no gradient overlap -------- */
.ticker-wrap,
.ticker-wrap::before,
.ticker-wrap::after{ background:#344056 !important; }

/* -------- 8. Kill dead / legacy nodes so nothing broken lingers -------- */
.logo-orbit{ display:none !important; }

/* =========================================================
   Responsive scale-up (mobile-first)
   ========================================================= */
@media (min-width: 768px){
	.site-header .logo-name{ font-size:1.1rem !important; letter-spacing:1.8px !important; }
	.site-header .logo-tld{ font-size:.86rem !important; }
	.hero{ padding:40px 0 28px !important; }
}
@media (min-width: 1024px){
	.showcase-feature{ min-height:200px !important; }
	.showcase-feature-info h4{ font-size:1.1rem !important; }
	.brand-l1,.brand-l2{ font-size:clamp(2rem,3.6vw,2.8rem) !important; }
}
@media (min-width: 1280px){
	.hero-grid{ max-width:1200px !important; }
	.site-header .header-inner{ max-width:1200px !important; }
}

/* Small screens: single column already handled at 900px in main.css;
   ensure logo scales cleanly without wrapping. */
@media (max-width: 480px){
	.site-header .logo-name{ font-size:.95rem !important; letter-spacing:1.2px !important; }
	.site-header .logo-dot{ font-size:1rem !important; }
	.site-header .logo-tld{ font-size:.72rem !important; letter-spacing:.8px !important; }
	.site-header .header-inner{ padding:0 14px !important; gap:8px !important; }
	.showcase-feature{ min-height:170px !important; }
	.showcase-feature-info h4{ font-size:1rem !important; }
}
