/* =============================================
   PONCHIKOV.NET — WELLNESS THEME OVERRIDE
   Modern UI: Inter font, sage palette, clean cards
   Appended AFTER existing engine.css
   ============================================= */

/* ── Google Font Import ────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Manrope:wght@400;500;600;700&display=swap');

/* ── CSS Custom Properties ──────────────────── */
:root {
  --color-bg:          #F9FAFB;
  --color-surface:     #FFFFFF;
  --color-border:      #E8EDF2;
  --color-text:        #1F2937;
  --color-muted:       #6B7280;
  --color-accent:      var(--brand-accent);      /* Cyan */
  --color-accent-light:var(--brand-accent-bg);
  --color-accent-dark: var(--brand-accent-hover);
  --color-warning:     #F59E0B;
  --font-body:         'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-heading:      'Manrope', 'Inter', sans-serif;
  --radius-sm:         8px;
  --radius-md:         12px;
  --radius-lg:         16px;
  --shadow-sm:         0 1px 3px rgba(0,0,0,.06), 0 1px 2px rgba(0,0,0,.04);
  --shadow-md:         0 4px 12px rgba(0,0,0,.08), 0 2px 4px rgba(0,0,0,.04);
  --shadow-lg:         0 8px 24px rgba(0,0,0,.10), 0 4px 8px rgba(0,0,0,.06);
  --content-width:     760px;
  --transition:        all .2s ease;
}

/* ── Global Reset Enhancements ──────────────── */
*, *::before, *::after { box-sizing: border-box; }

body {
  font-family: var(--font-body);
  color: var(--color-text);
  background: var(--color-bg);
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
  line-height: 1.3;
  font-weight: 700;
  color: var(--color-text);
}

/* ── Main Layout ────────────────────────────── */
#wrapper { background: var(--color-bg); }

#content.row.sbr {
  max-width: 1240px;
  margin: 0 auto;
  padding: 40px 16px 24px;
}

/* ── BREADCRUMBS ────────────────────────────── */
.breadcrumbs {
  font-size: .85rem;
  color: var(--color-muted);
  padding: 12px 0 8px;
}
.breadcrumbs a { color: var(--color-accent); text-decoration: none; }
.breadcrumbs a:hover { text-decoration: underline; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   ARTICLE FULL-STORY (Two-column layout)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/* Article wrapper — two-column on desktop */
.article-layout {
  display: grid;
  grid-template-columns: var(--content-width) 1fr;
  gap: 32px;
  align-items: start;
  max-width: 1100px;
  margin: 0 auto;
}

@media (max-width: 1024px) {
  .article-layout { grid-template-columns: 1fr; }
}

/* ── Article Header ─────────────────────────── */
.entry-header {
  margin-bottom: 24px;
}

.entry-header h1,
.entry-header .entry-title {
  font-size: clamp(1.6rem, 4vw, 2.1rem);
  font-weight: 700;
  line-height: 1.25;
  margin: 0 0 16px;
  color: var(--color-text);
}

.entry-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  font-size: .85rem;
  color: var(--color-muted);
  border-bottom: 1px solid var(--color-border);
  padding-bottom: 14px;
}

.entry-meta time { font-weight: 500; }
.entry-meta .far { margin-right: 4px; }
.posted-on { color: var(--color-accent); font-weight: 600; }

/* ── Reading Time Badge ─────────────────────── */
.reading-time {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: var(--color-accent-light);
  color: var(--color-accent-dark);
  font-size: .78rem;
  font-weight: 600;
  padding: 3px 10px;
  border-radius: 20px;
}

/* ── E-E-A-T Author Block ───────────────────── */
.eeat-author-block {
  background: var(--color-accent-light) !important;
  border-left: 4px solid var(--color-accent) !important;
  border-radius: var(--radius-md) !important;
  padding: 16px 18px !important;
  margin: 0 0 24px !important;
  font-size: .9rem !important;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.eeat-author-block strong { color: var(--color-accent-dark); }
.eeat-author-block .eeat-disclaimer {
  color: var(--color-muted);
  font-style: italic;
  font-size: .82rem;
  margin-top: 4px;
  padding-top: 8px;
  border-top: 1px solid rgba(90,138,114,.25);
}

/* ── TL;DR / AI Snippet Card ────────────────── */
.article-tldr {
  background: linear-gradient(135deg, #E8F3EE 0%, #F0F8FF 100%);
  border: 1px solid var(--color-accent-light);
  border-radius: var(--radius-lg);
  padding: 20px 24px;
  margin: 0 0 28px;
}

.article-tldr__label {
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: var(--color-accent);
  margin-bottom: 8px;
}

.article-tldr__text {
  font-size: .95rem;
  line-height: 1.6;
  color: var(--color-text);
  font-weight: 400;
}

/* ── Article Body Typography ────────────────── */
.entry-content {
  font-size: 1rem;
  line-height: 1.75;
  color: #2D3748;
  max-width: var(--content-width);
}

.entry-content p { margin: 0 0 1.25em; }

.entry-content h2 {
  font-size: 1.5rem;
  margin: 2em 0 .75em;
  padding-bottom: 8px;
  border-bottom: 2px solid var(--color-accent-light);
  color: var(--color-text);
}

.entry-content h3 {
  font-size: 1.2rem;
  margin: 1.75em 0 .6em;
  color: var(--color-accent-dark);
}

.entry-content h4 { font-size: 1.05rem; margin: 1.5em 0 .5em; }

.entry-content img {
  max-width: 100%;
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-md);
  height: auto;
  display: block;
  margin: 1.5em auto;
}

.entry-content a {
  color: var(--color-accent);
  text-decoration: underline;
  text-decoration-color: rgba(90,138,114,.4);
}

.entry-content a:hover {
  color: var(--color-accent-dark);
  text-decoration-color: var(--color-accent);
}

.entry-content ul, .entry-content ol {
  padding-left: 1.5em;
  margin: 0 0 1.25em;
}

.entry-content li { margin-bottom: .5em; }

.entry-content blockquote {
  border-left: 4px solid var(--color-accent);
  background: var(--color-accent-light);
  padding: 14px 20px;
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  margin: 1.5em 0;
  color: var(--color-accent-dark);
  font-style: italic;
}

/* ── Article Footer (Shares + Rating) ──────── */
.fullstory-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
  padding: 20px 0;
  margin-top: 20px;
  border-top: 1px solid var(--color-border);
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   AD WRAPPERS — CLS-Safe
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

.ad-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--color-bg);
  border-radius: var(--radius-sm);
  overflow: hidden;
  width: 100%;
}

.ad-wrapper--top    { min-height: 90px;  margin: 0 0 24px; }
.ad-wrapper--bottom { min-height: 250px; margin: 24px 0 0; }
.ad-wrapper--infeed { min-height: 250px; margin: 24px 0; }

/* ── Mobile Floor Ad ────────────────────────── */
.mobile-floor-ad {
  display: none;
  position: fixed;
  bottom: 0; left: 0; right: 0;
  z-index: 9999;
  background: var(--color-surface);
  box-shadow: 0 -2px 12px rgba(0,0,0,.12);
  text-align: center;
  padding: 6px 8px 10px;
}

.mobile-floor-ad .close-btn {
  position: absolute;
  top: 6px; right: 8px;
  background: none;
  border: none;
  font-size: 16px;
  cursor: pointer;
  color: var(--color-muted);
  line-height: 1;
  padding: 4px 6px;
  border-radius: 50%;
}

.mobile-floor-ad .close-btn:hover { background: var(--color-border); }

@media (max-width: 767px) {
  .mobile-floor-ad { display: block; }
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   STICKY SIDEBAR
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

.article-sidebar {
  position: sticky;
  top: 24px;
  max-height: calc(100vh - 48px);
  overflow-y: auto;
}

/* ── Table of Contents ──────────────────────── */
#toc-container {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: 16px 18px;
  margin-bottom: 20px;
  box-shadow: var(--shadow-sm);
}

#toc-container h4 {
  font-size: .8rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--color-muted);
  margin: 0 0 12px;
}

#toc-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

#toc-list li { margin-bottom: 6px; }

#toc-list a {
  display: block;
  font-size: .875rem;
  color: var(--color-text);
  text-decoration: none;
  padding: 4px 8px;
  border-radius: var(--radius-sm);
  transition: var(--transition);
  line-height: 1.4;
}

#toc-list a:hover,
#toc-list a.toc-active {
  background: var(--color-accent-light);
  color: var(--color-accent-dark);
}

#toc-list a.toc-h3 {
  padding-left: 20px;
  font-size: .82rem;
  color: var(--color-muted);
}

#toc-list a.toc-h3:hover,
#toc-list a.toc-h3.toc-active {
  color: var(--color-accent-dark);
  background: var(--color-accent-light);
}

.sidebar-ad-wrapper {
  min-height: 250px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--color-bg);
  border-radius: var(--radius-sm);
  overflow: hidden;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   SHORT STORY CARDS (Feed Grid)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/* ── Card Base ──────────────────────────────── */
.post.border {
  background: var(--color-surface);
  border: 1px solid var(--color-border) !important;
  border-radius: var(--radius-lg) !important;
  box-shadow: var(--shadow-sm);
  transition: var(--transition);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  height: 100%;
}

.post.border:hover {
  box-shadow: var(--shadow-md);
  transform: translateY(-2px);
  border-color: rgba(90,138,114,.3) !important;
}

/* ── Card Thumbnail ─────────────────────────── */
.entry-media {
  position: relative;
  overflow: hidden;
  border-radius: var(--radius-lg) var(--radius-lg) 0 0;
}

.entry-media .img {
  background-size: cover;
  background-position: center;
  padding-top: 60%;            /* 5:3 ratio */
  transition: transform .4s ease;
}

.post.border:hover .entry-media .img {
  transform: scale(1.04);
}

/* ── Category Badge ─────────────────────────── */
.cat-links {
  display: inline-block;
  background: var(--color-accent);
  color: #fff !important;
  font-size: .7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  padding: 3px 8px;
  border-radius: 20px;
  text-decoration: none !important;
}

.cat-links:hover { background: var(--color-accent-dark); }

/* ── Card Body ──────────────────────────────── */
.entry-header .entry-title {
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.4;
  margin: 0;
}

.entry-header .entry-title a {
  color: var(--color-text);
  text-decoration: none;
}

.entry-header .entry-title a:hover { color: var(--color-accent); }

.entry-content p {
  font-size: .875rem;
  color: var(--color-muted);
  line-height: 1.5;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.entry-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px;
  font-size: .78rem;
  color: var(--color-muted);
  padding: 0 14px 14px;
  margin-top: auto;
}

.entry-footer .posted-on { color: var(--color-muted); }

/* ── Card padding ───────────────────────────── */
.post.border .entry-header { padding: 14px 14px 6px; }
.post.border .entry-content { padding: 0 14px 10px; flex: 1; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   SECTION TITLES
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

.section-title-main {
  font-family: var(--font-heading);
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--color-text);
  margin: 28px 0 16px;
  position: relative;
  padding-left: 14px;
}

.section-title-main::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 4px;
  height: 1.25em;
  background: var(--color-accent);
  border-radius: 4px;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   SEARCH MODAL
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

.search-modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.55);
  backdrop-filter: blur(4px);
  z-index: 9000;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding-top: 80px;
  opacity: 0;
  visibility: hidden;
  transition: var(--transition);
}

.search-modal-overlay.is-open {
  opacity: 1;
  visibility: visible;
}

.search-modal {
  background: var(--color-surface);
  border-radius: var(--radius-lg);
  padding: 20px;
  width: min(90vw, 600px);
  box-shadow: var(--shadow-lg);
  transform: translateY(-12px);
  transition: transform .25s ease;
}

.search-modal-overlay.is-open .search-modal {
  transform: translateY(0);
}

.search-modal input[type="text"] {
  width: 100%;
  border: 2px solid var(--color-border);
  border-radius: var(--radius-sm);
  padding: 12px 16px;
  font-size: 1.05rem;
  font-family: var(--font-body);
  outline: none;
  transition: var(--transition);
}

.search-modal input[type="text"]:focus {
  border-color: var(--color-accent);
  box-shadow: 0 0 0 3px rgba(90,138,114,.15);
}

/* ── Search Trigger Button ──────────────────── */
.search-trigger-btn {
  background: none;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  padding: 6px 14px;
  font-family: var(--font-body);
  font-size: .875rem;
  color: var(--color-muted);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: var(--transition);
}

.search-trigger-btn:hover {
  border-color: var(--color-accent);
  color: var(--color-accent);
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   RELATED ARTICLES
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

.related-article-area {
  margin-top: 40px;
  padding-top: 32px;
  border-top: 2px solid var(--color-border);
}

.related-article-area .section-title-main { margin-top: 0; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   COMMENTS
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

.respond-comments { margin-top: 36px; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   NAVIGATION HUB PILLS (Top menu enhancement)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

.wellness-hubs {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  padding: 8px 0;
}

.wellness-hubs a {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: 20px;
  padding: 5px 14px;
  font-size: .82rem;
  font-weight: 600;
  color: var(--color-text);
  text-decoration: none;
  transition: var(--transition);
}

.wellness-hubs a:hover,
.wellness-hubs a.active {
  background: var(--color-accent);
  border-color: var(--color-accent);
  color: #fff;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   SCROLL-TO-TOP BUTTON
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

#scroll-top-btn {
  position: fixed;
  bottom: 80px;
  right: 20px;
  width: 40px;
  height: 40px;
  background: var(--color-accent);
  color: #fff;
  border: none;
  border-radius: 50%;
  font-size: 18px;
  cursor: pointer;
  box-shadow: var(--shadow-md);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transform: translateY(10px);
  transition: var(--transition);
  z-index: 8000;
}

#scroll-top-btn.visible {
  opacity: 1;
  transform: translateY(0);
}

#scroll-top-btn:hover { background: var(--color-accent-dark); }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   RESPONSIVE HELPERS
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

@media (max-width: 767px) {
  .article-layout { gap: 16px; }
  .entry-header h1 { font-size: 1.45rem; }
  .eeat-author-block { font-size: .85rem !important; }
  #toc-container { display: none; } /* hide sidebar TOC on mobile */
}

/* ==========================================================
   COLOR OVERRIDE: ponchikov.net (������ ������ �� �������� � ����)
   ========================================================== */

:root {
  --brand-primary: #E6008A;       /* ����� �������� (Ponchikov) */
  --brand-primary-hover: #C40075;
  --brand-accent: #00D2FF;        /* ����� ���� (.Net) */
  --brand-accent-hover: #00B4DB;
  --brand-primary-bg: rgba(230, 0, 138, 0.08);
  --brand-accent-bg: rgba(0, 210, 255, 0.12);
}

/* 1. ������ � ��������� ������� */
a, 
.entry-title a:hover,
.post-title a:hover,
.news-title a:hover,
.speedbar a:hover {
  color: var(--brand-primary) !important;
}

/* 2. �����, ������� � ��������� ������ */
.header,
.navbar,
.top-menu,
.main-nav {
  border-bottom-color: var(--brand-primary) !important;
}

/* ������� (���� ��������� �������) */
.logo-ponchikov {
  color: var(--brand-primary) !important;
}
.logo-net {
  color: var(--brand-accent) !important;
}

/* 3. ������ � ������������� �������� */
button,
.btn,
.button,
.btn-primary,
input[type="submit"],
.bbcodes input[type="button"]:hover,
.pagination .current,
.navigation .current,
.nav-pages span.current {
  background-color: var(--brand-primary) !important;
  border-color: var(--brand-primary) !important;
  color: #ffffff !important;
}

button:hover,
.btn:hover,
.button:hover,
.btn-primary:hover,
input[type="submit"]:hover {
  background-color: var(--brand-primary-hover) !important;
  border-color: var(--brand-primary-hover) !important;
}

/* 4. �������������� ������, ������ ������ � ���� */
.category-badge,
.tag-cloud a,
.post-category a,
.speedbar span:last-child {
  background-color: var(--brand-accent-bg) !important;
  color: #008fa8 !important;
  border-color: var(--brand-accent) !important;
}

.tag-cloud a:hover,
.post-category a:hover {
  background-color: var(--brand-accent) !important;
  color: #ffffff !important;
}

/* 5. �������, ��������� �������� � ����� */
.block-title,
.widget-title,
.sidebar h3,
.sidebar h4 {
  border-left-color: var(--brand-primary) !important;
  color: #111827 !important;
}

/* 6. ����� (����� ������) */
#searchinput:focus,
input[name="story"]:focus {
  border-color: var(--brand-accent) !important;
  box-shadow: 0 0 0 3px rgba(0, 210, 255, 0.25) !important;
}

/* 7. ��������� ������ �� ����� */
::selection {
  background: var(--brand-primary);
  color: #ffffff;
}


/* Fix logo sizing */
.header.type-3 .header-middle .header-middle-entry .logo .imagelogo { background-size: contain !important; width: 220px !important; height: 60px !important; }


/* ==========================================================
   ������ ���� �����������: ������ � ����� ������ (ponchikov.net)
   ========================================================== */

/* 1. ����� ���� �����: �������� ����������� ������ ����� */
body, p, div, span, li, dt, dd {
  color: #111111;
}

/* ��� �������� ������, ��������� ������ � �������� � ������ ������ */
h1, h2, h3, h4, h5, h6,
.entry-title a,
.post-title a,
.news-title a,
.card-title a,
.widget-title,
.block-title,
.section-title-main {
  color: #111111 !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}

/* 2. ���� ���������: �������� ������ � ������� */
.top-menu a,
.main-nav a,
.nav-menu a,
.navigation a,
.main-nav ul li a,
.top-menu ul li a,
.menu > li > a,
.menu > li > span {
  color: #FFFFFF !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  text-shadow: none !important;
}

/* �������� ����� ��� ��������� */
.main-nav li.active > a,
.top-menu li.active > a,
.main-nav li:hover > a,
.top-menu li:hover > a,
.main-nav .current-menu-item > a,
.menu > li:hover > a,
.menu > li:hover > span {
  background-color: #00D2FF !important;
  color: #000000 !important;
  font-weight: 800 !important;
  text-shadow: none !important;
}

/* ���������� ����: ����� ���, �������� ������ ����� */
.main-nav ul ul a,
.top-menu ul ul a,
.sub-menu li a,
.menu ul li a {
  color: #111111 !important;
  font-weight: 600 !important;
  background-color: #FFFFFF !important;
}

.main-nav ul ul a:hover,
.sub-menu li a:hover,
.menu ul li a:hover {
  background-color: #00D2FF !important;
  color: #000000 !important;
}

/* ������� ������ ����������� | */
.menu > li::after,
.menu > li::before,
.main-nav > ul > li::after,
.top-menu > ul > li::after {
  content: none !important;
  display: none !important;
}

/* 3. ������ ����������� �����Ȼ � ������� ����� �������� */
.widget-title,
.sidebar-title,
.block-header,
[class*="popular-title"],
[class*="widget-header"] {
  background-color: #E6008A !important;
  color: #000000 !important;
  font-weight: 800 !important;
  letter-spacing: 0.5px !important;
}

/* 4. �������: ���� � ������ ������ ������ */
.sidebar .date,
.popular-posts .date-badge,
[class*="date-box"],
[class*="date-block"],
.post-date {
  background-color: #00D2FF !important;
  color: #000000 !important;
  font-weight: 800 !important;
}

.popular-posts .title-box,
.popular-posts .post-title-block,
.sidebar [class*="title-block"] {
  background-color: #00D2FF !important;
}

.popular-posts .title-box a,
.popular-posts .post-title-block a,
.sidebar [class*="title-block"] a {
  color: #000000 !important;
  font-weight: 700 !important;
}

/* 5. ������ ������ �� ��������� */
.category-badge,
.post-category a,
.cat-tag,
[class*="cat-link"],
.cat-links {
  background-color: #00D2FF !important;
  color: #000000 !important;
  font-weight: 700 !important;
  border-radius: 4px !important;
  padding: 3px 8px !important;
}

/* 6. ��������� ������ ������ ��������: ������ ����� */
.thumb-overlay a,
.overlay-text a,
.post-overlay a,
.card-overlay-title,
.image-post.item-overlay .entry-title a {
  color: #FFFFFF !important;
  font-weight: 700 !important;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.9) !important;
}

/* ==========================================================
   ���������� �������� � ����� ����� (ponchikov.net)
   ========================================================== */

/* 1. ������� ������� ����������� � ���������� �������� */
.logo,
.header-logo,
.site-logo,
.brand,
[class*="logo"] {
  display: inline-flex !important;
  align-items: center !important;
  max-height: none !important;
  height: auto !important;
}

/* 2. ���� ������� ��������� ��������� <img> */
.logo img,
.header-logo img,
.site-logo img,
.brand img,
[class*="logo"] img {
  height: 68px !important;              /* ����������� ������������� ������ */
  width: auto !important;               /* ��������� �� ���������� */
  max-width: 280px !important;          /* ������� ����� ����� */
  object-fit: contain !important;
  display: block !important;
  margin: 10px 0 !important;            /* ���������� ������� ������ � ����� */
}

/* 3. ������������ ��� ��������� ������� */
@media (max-width: 768px) {
  .logo img,
  .header-logo img,
  .site-logo img,
  [class*="logo"] img {
    height: 48px !important;
    max-width: 200px !important;
  }
}

/* ==========================================================
   ����� ����� ��� ����� �������� ����������� �����Ȼ
   ========================================================== */

.sidebar .block-title,
.sidebar .widget-title,
.sidebar h3,
.sidebar h4,
.popular-title-head,
[class*="popular"] h3,
[class*="popular"] h4,
[class*="widget-header"],
[class*="block-header"] {
  color: #FFFFFF !important;            /* ������ ����� ���� */
  font-weight: 700 !important;
  letter-spacing: 0.5px !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25) !important; /* ������ ���� ��� ������� */
}

/* �� ������, ���� ����� ������� � span ��� ������ ������ ��������� */
.sidebar .block-title *,
.sidebar .widget-title *,
[class*="popular"] h3 *,
[class*="popular"] h4 * {
  color: #FFFFFF !important;
}

/* ==========================================================
   ���������� ����� �������� �������� � ���� �����
   ========================================================== */

/* Target the image directly */
.logo img,
.header-logo img,
a.logo img,
.header-middle-entry .logo img {
  display: block !important;
  height: 65px !important;            /* Force actual image render height */
  width: auto !important;            /* Maintain aspect ratio */
  max-width: 320px !important;
  object-fit: contain !important;
  transform: scale(1.35) !important; /* Scale multiplier to zoom the artwork */
  transform-origin: left center !important;
}

/* Prevent container overflow caused by scale */
.logo, a.logo, .header-middle-entry .logo {
  display: inline-flex !important;
  align-items: center !important;
  height: auto !important;
}
/* Reset header paddings to keep it compact */
.header .header-middle {
  padding: 5px 0 !important;
}
.header .header-middle .header-middle-entry {
  padding: 0 !important;
}

/* ==========================================================
   ��������� ����: ����� ����, ��������� ���� � ����� ������
   ========================================================== */

/* 1. ��������� ����������� �����Ȼ � ������ ����� ����� */
.sidebar .block-title,
.sidebar .widget-title,
.sidebar h3,
.sidebar h4,
[class*="popular-title"],
[class*="popular"] h3,
[class*="popular"] h4,
[class*="block-header"] {
  color: #FFFFFF !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35) !important;
  font-weight: 700 !important;
}

.sidebar .block-title *,
.sidebar .widget-title *,
[class*="popular"] h3 *,
[class*="popular"] h4 * {
  color: #FFFFFF !important;
}

/* 2. ������ �������: ���� � ������ ��� ���������� */
.topnews [class*="date"], .topnews .date, .topnews .date-badge,
.widget-popular [class*="date"], .widget-popular .date, .widget-popular .date-badge,
.popular-posts [class*="date"], .popular-posts .date, .popular-posts .date-badge,
[class*="topnews"] [class*="date"], [class*="topnews"] .date, [class*="topnews"] .date-badge,
[class*="popular"] [class*="date"], [class*="popular"] .date, [class*="popular"] .date-badge {
  background-color: #00D2FF !important;
  background-image: none !important;
  color: #000000 !important;
  font-weight: 800 !important;
  text-shadow: none !important;
}

.topnews [class*="date"] *, .topnews .date *, .topnews .date-badge *,
.widget-popular [class*="date"] *, .widget-popular .date *, .widget-popular .date-badge *,
.popular-posts [class*="date"] *, .popular-posts .date *, .popular-posts .date-badge *,
[class*="topnews"] [class*="date"] *, [class*="topnews"] .date *, [class*="topnews"] .date-badge *,
[class*="popular"] [class*="date"] *, [class*="popular"] .date *, [class*="popular"] .date-badge * {
  color: #000000 !important;
}

.topnews [class*="title"], .topnews .title, .topnews .title-block, .topnews .caption,
.widget-popular [class*="title"], .widget-popular .title, .widget-popular .title-block, .widget-popular .caption,
.popular-posts [class*="title"], .popular-posts .title, .popular-posts .title-block, .popular-posts .caption,
[class*="topnews"] [class*="title"], [class*="topnews"] .title, [class*="topnews"] .title-block, [class*="topnews"] .caption,
[class*="popular"] [class*="title"], [class*="popular"] .title, [class*="popular"] .title-block, [class*="popular"] .caption,
.item-overlay-FIX-REMOVED {
  background-color: #00D2FF !important;
  background-image: none !important;
}

.topnews [class*="title"] a, .topnews [class*="title"] span, .topnews .title a, .topnews .title span, .topnews .title-block a, .topnews .title-block span, .topnews .caption a, .topnews .caption span,
.widget-popular [class*="title"] a, .widget-popular [class*="title"] span, .widget-popular .title a, .widget-popular .title span, .widget-popular .title-block a, .widget-popular .title-block span, .widget-popular .caption a, .widget-popular .caption span,
.popular-posts [class*="title"] a, .popular-posts [class*="title"] span, .popular-posts .title a, .popular-posts .title span, .popular-posts .title-block a, .popular-posts .title-block span, .popular-posts .caption a, .popular-posts .caption span,
[class*="topnews"] [class*="title"] a, [class*="topnews"] [class*="title"] span, [class*="topnews"] .title a, [class*="topnews"] .title span, [class*="topnews"] .title-block a, [class*="topnews"] .title-block span, [class*="topnews"] .caption a, [class*="topnews"] .caption span,
[class*="popular"] [class*="title"] a, [class*="popular"] [class*="title"] span, [class*="popular"] .title a, [class*="popular"] .title span, [class*="popular"] .title-block a, [class*="popular"] .title-block span, [class*="popular"] .caption a, [class*="popular"] .caption span {
  color: #000000 !important;
  font-weight: 700 !important;
  text-shadow: none !important;
}

/* 3. ��������� ���������� ���� */
.mobile-advanced .active,
.mobile-advanced [class*="header"],
.mobile-advanced [class*="title"],
.mobile-advanced .menu-close,
.mobile-advanced .close-btn,
.mobile-menu .active,
.mobile-menu [class*="header"],
.mobile-menu [class*="title"],
.mobile-menu .menu-close,
.mobile-menu .close-btn,
.m-menu .active,
.m-menu [class*="header"],
.m-menu [class*="title"],
.m-menu .menu-close,
.m-menu .close-btn,
.nav-mobile .active,
.nav-mobile [class*="header"],
.nav-mobile [class*="title"],
.nav-mobile .menu-close,
.nav-mobile .close-btn,
[class*="drawer"] .active,
[class*="drawer"] [class*="header"],
[class*="drawer"] [class*="title"],
[class*="drawer"] .menu-close,
[class*="drawer"] .close-btn,
#advanced-menu-hide {
  background-color: #E6008A !important;
  color: #FFFFFF !important;
}

.mobile-advanced li.parent > a,
.mobile-advanced li.has-sub > a,
.mobile-advanced .menu-heading,
.mobile-menu li.parent > a,
.mobile-menu li.has-sub > a,
.mobile-menu .menu-heading,
.m-menu li.parent > a,
.m-menu li.has-sub > a,
.m-menu .menu-heading,
.nav-mobile li.parent > a,
.nav-mobile li.has-sub > a,
.nav-mobile .menu-heading,
[class*="drawer"] li.parent > a,
[class*="drawer"] li.has-sub > a,
[class*="drawer"] .menu-heading,
.mobile-advanced>div>ul>li>span,
.mobile-advanced>div>ul>li>a {
  background-color: #00D2FF !important;
  color: #000000 !important;
  font-weight: 800 !important;
}

/* 4. ������ ���������� ���� */
.menu-btn,
.mobile-toggle,
.navbar-toggle,
.responsive-nav-button {
  background-color: #00D2FF !important;
  color: #000000 !important;
}

/* ���� ��� ��������� �� ��������� �������� (������ ����� ��� ����) */
.cat-links, 
.cat-links a, 
.cat-links span,
.category-badge,
.post-category a,
.cat-tag,
[class*="cat-link"],
[class*="cat-link"] a {
  background: transparent !important;
  background-color: transparent !important;
  color: #111111 !important;
  font-weight: 700 !important;
  padding: 0 !important;
}

/* ==========================================================
   ���������� �������� ��� ����� ����� �������� (ponchikov.net)
   ========================================================== */

/* 1. ����� ���� ��������: ������ ��������� ������ */
.sidebar, aside, .right-column {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

/* 2. ����� �������: �������, �� ����������� � ����� ������� */
.sidebar .block-title,
.sidebar .widget-title,
.sidebar h3,
.popular-title-head,
[class*="popular-title"],
[class*="widget-header"] {
  background: #E6008A !important;
  color: #FFFFFF !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 12px 16px !important;
  border-radius: 12px !important;
  margin-bottom: 14px !important;
  box-shadow: 0 4px 12px rgba(230, 0, 138, 0.15) !important;
  text-align: center;
}

/* 3. ���������� ������ ���������� ���� � �������� � ���������� �������� */
.topnews, .widget-popular, .popular-posts {
  display: flex;
  flex-direction: column;
  gap: 16px;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.topnews-item,
.popular-item,
.widget-popular-item,
.topnews > div,
.popular-posts > div,
.popular-posts > li {
  background: #FFFFFF !important;
  border-radius: 12px !important;
  padding: 10px !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05) !important;
  border: 1px solid #F1F3F5 !important;
  display: flex !important;
  flex-direction: column !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  overflow: hidden;
  margin-bottom: 0 !important;
}

.topnews-item:hover,
.popular-item:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.08) !important;
}

/* 4. �������� � ��������: ������� ����������, ������� ���������� ���������������� ������ ��� */
.topnews img,
.popular-item img,
.sidebar [class*="thumb"] img {
  width: 100% !important;
  height: 120px !important;
  object-fit: cover !important;
  border-radius: 8px !important;
  margin-bottom: 8px !important;
  display: block;
}

/* 5. ������� ���������� ���������� ���� (��� ������� ���������� �����) */
.topnews [class*="date"],
.popular-item [class*="date"],
.sidebar [class*="date-badge"] {
  display: none !important;
}

/* 6. �������� ������: ���������� ������ ����� ��� ���������, � �� ������� ����� */
.topnews [class*="title"],
.popular-item [class*="title"],
.popular-item .popular-title,
.popular-title,
.sidebar [class*="caption"] {
  background: transparent !important;
  padding: 4px 2px !important;
  position: static !important;
}

.topnews [class*="title"] a,
.popular-item [class*="title"] a,
.popular-item .popular-title,
.popular-title a,
.sidebar [class*="caption"] a {
  color: #111827 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  text-decoration: none !important;
  display: block;
}

.topnews [class*="title"] a:hover,
.popular-item [class*="title"] a:hover,
.popular-item .popular-title:hover {
  color: #E6008A !important;
}

/* ==========================================================
   ����������� ����� ������ (GRID) � ����� ��������� ��������
   ========================================================== */

/* 1. ���� ��������� �������� (������� ���������������) */
#sidebar .block-title,
#sidebar .widget-title,
#sidebar h3,
#sidebar .popular-title-head,
aside .widget-title {
  color: #FFFFFF !important;
}

/* 2. ������� 3-���������� CSS Grid ��� ������� ������ (�������� Foundation floats) */
.post-list {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 20px !important;
  /* ������� float-�������� �� Foundation, ����� �� ������ ���� */
}
.post-list:before, 
.post-list:after {
  display: none !important;
}

/* 3. ������� �������� �� ����������� ������ Foundation (����� ��� ��������� ������ �����) */
.post-list > article,
.post-list > .columnitem,
.post-list > .columns {
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* ������������ ��� ����� */
@media (max-width: 1024px) {
  .post-list { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 768px) {
  .post-list { grid-template-columns: 1fr !important; }
}

/* ���� ��� #dle-content �� ��������� ��������� */
#dle-content {
  grid-column: 1 / -1;
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 20px !important;
}

#dle-content .page_nav,
#dle-content .navigation,
#dle-content > center {
  grid-column: 1 / -1 !important;
}

#dle-content > article,
#dle-content > .columnitem,
#dle-content > .columns {
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* ������������ ��� #dle-content */
@media (max-width: 1024px) {
  #dle-content { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 768px) {
  #dle-content { grid-template-columns: 1fr !important; }
}

/* ������ �� ������ ������� � ����-������ ������ ����� */
.post-list > div:not(article):not(.columnitem):not(.columns),
.post-list > span {
  grid-column: 1 / -1 !important;
}

/* ��������� ������� �������: ���������� ����� ��������� ����� �������� ��� ������ ����� ������ */
#dle-content > div:not(article):not(.columnitem):not(.columns):not(.page_nav),
#dle-content > center,
.post-list > div:not(article):not(.columnitem):not(.columns):not(.page_nav),
.recblock,
.recblockcat,
[id^="yandex_rtb"] {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 15px 0 !important;
}

/* ��������������� ������������� ��� ������� */
#dle-content > div:not(article):not(.columnitem):not(.columns):not(.page_nav),
#dle-content > center,
.post-list > div:not(article):not(.columnitem):not(.columns):not(.page_nav),
.recblock,
.recblockcat,
[id^="yandex_rtb"] {
  display: block !important;
  text-align: center !important;
}

/* ��������� �������� �����: ��������� ������ ������ (�����) �� ������������� ������� ���������� �������� */
#dle-content,
.post-list {
  grid-auto-flow: dense !important;
}