/*
 * Device Matrix Pro - Main Theme CSS
 * Version: 2.0.0
 */

/* ============================================================
   CSS VARIABLES
============================================================ */
:root {
  --dm-primary:   #111827;
  --dm-accent:    #e8420a;
  --dm-accent-dk: #c73a08;
  --dm-bg:        #ffffff;
  --dm-bg-alt:    #f8f9fa;
  --dm-text:      #111111;
  --dm-muted:     #666666;
  --dm-light:     #999999;
  --dm-border:    #e8e8e8;
  --dm-topbar:    #1a1a2e;
  --dm-footer:    #111827;
  --dm-header-row1: #ffffff;
  --dm-radius:    8px;
  --dm-radius-sm: 5px;
  --dm-shadow:    0 2px 12px rgba(0,0,0,.07);
  --dm-shadow-md: 0 4px 20px rgba(0,0,0,.10);
  --dm-trans:     .2s ease;
  --dm-font:      'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --dm-container: 1240px;
  --dm-drawer-width: 320px;
}

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

html { font-size: 14px; scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }

body {
  font-family: var(--dm-font);
  color: var(--dm-text);
  background: var(--dm-bg);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

img, video { max-width: 100%; height: auto; display: block; }
a { text-decoration: none; color: inherit; transition: color var(--dm-trans); }
ul, ol { list-style: none; }
button, input, select, textarea { font-family: inherit; font-size: inherit; }
button { cursor: pointer; border: none; background: none; }
h1,h2,h3,h4,h5,h6 { font-family: var(--dm-font); font-weight: 700; line-height: 1.25; color: var(--dm-text); }

/* ============================================================
   LAYOUT
============================================================ */
.dm-container { max-width: var(--dm-container); margin: 0 auto; padding: 0 20px; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0; }

/* ============================================================
   TOP BAR
============================================================ */
.dm-topbar {
  background: var(--dm-topbar);
  height: 34px;
  display: flex;
  align-items: center;
  font-size: 11.5px;
  color: rgba(255,255,255,.65);
}
.dm-topbar .dm-container { display: flex; justify-content: space-between; align-items: center; width: 100%; }
.dm-topbar-text a { color: rgba(255,255,255,.7); }
.dm-topbar-text a:hover { color: var(--dm-accent); }
.dm-topbar-social { display: flex; gap: 6px; align-items: center; }
.dm-topbar-social a {
  display: flex; align-items: center; justify-content: center;
  width: 24px; height: 24px;
  background: rgba(255,255,255,.08); border-radius: 4px;
  color: rgba(255,255,255,.65); transition: all var(--dm-trans);
}
.dm-topbar-social a:hover { color: #fff; }
.dm-topbar-social a.fb:hover  { background: #1877f2; }
.dm-topbar-social a.ig:hover  { background: linear-gradient(45deg,#f09433,#e6683c,#dc2743,#cc2366); }
.dm-topbar-social a.yt:hover  { background: #ff0000; }
.dm-topbar-social a.tw:hover  { background: #000; }
.dm-topbar-social svg { width: 12px !important; height: 12px !important; }

/* ============================================================
   HEADER
============================================================ */
#dm-header {
  border-bottom: 1px solid var(--dm-border);
  position: sticky; top: 0; z-index: 200;
  box-shadow: 0 1px 4px rgba(0,0,0,.04);
  transition: box-shadow var(--dm-trans);
}
#dm-header.scrolled { box-shadow: 0 2px 16px rgba(0,0,0,.08); }
.admin-bar #dm-header { top: 32px; }
@media (max-width:782px) { .admin-bar #dm-header { top: 46px; } }

.dm-header-inner { display: block; }
.dm-header-top-row {
  display: flex; align-items: center; justify-content: space-between;
  height: 76px; gap: 12px;
  background: var(--dm-header-row1);
}
.dm-nav-row { border-top: 1px solid var(--dm-border); background: #fff; }
.dm-nav-row .dm-container { display: flex; }

/* Logo */
.dm-logo { display: flex; align-items: center; gap: 10px; flex-shrink: 0; text-decoration: none; }
.dm-logo img,
.dm-logo .custom-logo {
  max-height: 40px !important;
  height: auto !important;
  width: auto !important;
  max-width: 200px !important;
  display: block;
}
.dm-logo-icon { width: 38px; height: 38px; background: var(--dm-primary); border-radius: 6px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.dm-logo-icon span { color: #fff; font-weight: 900; font-size: 13px; letter-spacing: -.5px; }
.dm-logo-text { line-height: 1; }
.dm-logo-name { font-size: 17px; font-weight: 900; letter-spacing: -.5px; }
.dm-logo-name .dm-name-main   { color: var(--dm-primary); }
.dm-logo-name .dm-name-accent { color: var(--dm-accent); }
.dm-logo-tagline { font-size: 9px; color: #999; font-weight: 400; margin-top: 2px; letter-spacing: .02em; }

/* Navigation */
.dm-nav { display: flex; align-items: center; gap: 2px; flex: 1; height: 48px; }
.dm-nav > ul { display: flex; align-items: center; gap: 1px; }
.dm-nav > ul > li { position: relative; }
.dm-nav > ul > li > a {
  display: flex; align-items: center; gap: 3px;
  padding: 7px 10px; font-size: 12.5px; font-weight: 600; color: #333;
  border-radius: 4px; white-space: nowrap;
  transition: color var(--dm-trans); border-bottom: 2px solid transparent;
}
.dm-nav > ul > li > a:hover,
.dm-nav > ul > li.current-menu-item > a,
.dm-nav > ul > li.current-menu-ancestor > a { color: var(--dm-accent); }
.dm-nav > ul > li.current-menu-item > a { border-bottom-color: var(--dm-accent); border-radius: 0; }
.dm-nav-chevron { font-size: 9px; opacity: .5; }
.dm-deals-badge { background: var(--dm-accent); color: #fff; font-size: 9px; font-weight: 700; padding: 1px 5px; border-radius: 3px; margin-left: 2px; text-transform: uppercase; }

/* Dropdown */
.dm-nav .sub-menu {
  position: absolute; top: calc(100% + 4px); left: 0;
  background: #fff; border: 1px solid var(--dm-border); border-radius: var(--dm-radius);
  min-width: 200px; box-shadow: var(--dm-shadow-md);
  padding: 6px; opacity: 0; visibility: hidden;
  transform: translateY(-6px); transition: all var(--dm-trans); z-index: 100;
}
.dm-nav li:hover > .sub-menu,
.dm-nav li:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: translateY(0); }
.dm-nav .sub-menu a { display: block; padding: 7px 12px; font-size: 12.5px; color: #333; border-radius: 4px; transition: all var(--dm-trans); }
.dm-nav .sub-menu a:hover { background: var(--dm-bg-alt); color: var(--dm-accent); }

/* Header actions */
.dm-header-actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }

/* Search */
.dm-search-wrap {
  display: flex; align-items: center;
  border: 1px solid #e0e0e0; border-radius: 6px;
  overflow: visible; height: 34px; background: #f9f9f9;
  position: relative;
}
.dm-search-wrap input {
  border: none; outline: none; padding: 0 10px;
  font-size: 12px; color: #444; width: 160px; background: transparent;
}
.dm-search-wrap input::placeholder { color: #aaa; }
.dm-search-wrap button { padding: 0 10px; color: #888; background: none; border: none; cursor: pointer; }
.dm-search-wrap button:hover { color: var(--dm-accent); }
.dm-search-wrap svg { width: 14px !important; height: 14px !important; }

/* Search results dropdown */
#dm-search-results {
  position: absolute; top: calc(100% + 6px); right: 0;
  width: 360px; background: #fff;
  border: 1px solid #e8e8e8; border-radius: 8px;
  box-shadow: 0 8px 32px rgba(0,0,0,.12);
  z-index: 500; display: none; overflow: hidden;
}

/* Mobile toggle */
.dm-mobile-toggle {
  display: none; align-items: center; justify-content: center;
  width: 32px; height: 32px;
  border: none; border-radius: var(--dm-radius-sm);
  color: var(--dm-text); background: none; cursor: pointer;
  flex-shrink: 0; padding: 0;
}
.dm-mobile-toggle svg { width: 20px !important; height: 20px !important; }

/* Mobile-only search icon (hidden on desktop, shown instead of full search bar on mobile) */
.dm-search-icon-toggle {
  display: none; align-items: center; justify-content: center;
  width: 32px; height: 32px;
  border: none; border-radius: var(--dm-radius-sm);
  color: var(--dm-muted); background: none; cursor: pointer;
  flex-shrink: 0; padding: 0;
}
.dm-search-icon-toggle svg { width: 16px !important; height: 16px !important; }
.dm-search-icon-toggle.active { color: var(--dm-accent); }

/* Mobile slide-down search bar */
.dm-mobile-search-bar {
  display: none;
  max-height: 0;
  overflow: hidden;
  background: #fff;
  border-bottom: 1px solid var(--dm-border);
  transition: max-height .25s ease;
}
/* Capped to a viewport-relative height (not a flat 400px) so on short mobile
   screens -- especially once the on-screen keyboard opens -- this doesn't
   grow tall enough to cover the entire visible viewport. Anything beyond
   that scrolls internally instead of pushing the sticky header taller. */
.dm-mobile-search-bar.active { max-height: min(400px, 50vh); overflow-y: auto; }
.dm-mobile-search-bar .dm-container { padding-top: 10px; padding-bottom: 10px; }
.dm-mobile-search-inner {
  display: flex; align-items: center; gap: 8px;
  background: var(--dm-bg-alt); border: 1px solid var(--dm-border);
  border-radius: 8px; padding: 0 12px; height: 42px;
}
.dm-mobile-search-inner svg { width: 16px !important; height: 16px !important; color: #999; flex-shrink: 0; }
.dm-mobile-search-inner input {
  flex: 1; border: none; outline: none; background: none;
  font-size: 13px; color: var(--dm-text); height: 100%;
}
.dm-mobile-search-inner input::placeholder { color: #aaa; }
.dm-mobile-search-close {
  display: flex; align-items: center; justify-content: center;
  width: 26px; height: 26px; flex-shrink: 0;
  color: #999; background: none; border: none; cursor: pointer;
}
.dm-mobile-search-close svg { width: 16px !important; height: 16px !important; }
#dm-mobile-search-results { margin-top: 8px; max-height: 30vh; overflow-y: auto; border-radius: 8px; }
#dm-mobile-search-results:empty { margin-top: 0; }
#dm-mobile-search-results a { background: #fff; border-bottom: 1px solid var(--dm-border); }
#dm-mobile-search-results a:last-child { border-bottom: none; }

/* ============================================================
   MOBILE NAV DRAWER
============================================================ */
.dm-mobile-overlay { position: fixed; inset: 0; background: rgba(15,17,23,.55); backdrop-filter: blur(1px); z-index: 300; opacity: 0; visibility: hidden; transition: opacity .25s ease; }
.dm-mobile-overlay.active { opacity: 1; visibility: visible; }

.dm-mobile-panel {
  position: fixed; top: 0; left: 0; bottom: 0;
  width: min(var(--dm-drawer-width, 320px), 86vw);
  background: #fff; z-index: 400;
  display: flex; flex-direction: column;
  transform: translateX(-100%);
  transition: transform .32s cubic-bezier(.32,.72,0,1);
  box-shadow: 8px 0 32px rgba(0,0,0,.12);
}
.dm-mobile-panel.active { transform: translateX(0); }

/* Header inside drawer */
.dm-mobile-head {
  display: flex; align-items: center; justify-content: space-between;
  gap: 10px; padding: 16px; flex-shrink: 0;
  border-bottom: 1px solid var(--dm-border);
  background: var(--dm-bg-alt);
}
.dm-mobile-head-brand { display: flex; align-items: center; gap: 10px; min-width: 0; }
.dm-mobile-head-icon {
  width: 34px; height: 34px; flex-shrink: 0;
  background: var(--dm-primary); border-radius: 7px;
  display: flex; align-items: center; justify-content: center;
}
.dm-mobile-head-icon span { color: #fff; font-weight: 900; font-size: 12px; }
.dm-mobile-head-name {
  font-size: 14.5px; font-weight: 800; color: var(--dm-primary);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.dm-mobile-close {
  width: 32px; height: 32px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  border-radius: 50%; color: var(--dm-text); cursor: pointer;
  background: #fff; border: 1px solid var(--dm-border);
  transition: all var(--dm-trans);
}
.dm-mobile-close:hover { background: var(--dm-accent); border-color: var(--dm-accent); color: #fff; }
.dm-mobile-close svg { width: 16px !important; height: 16px !important; }

/* Scrollable nav body */
.dm-mobile-body { padding: 10px; overflow-y: auto; flex: 1; -webkit-overflow-scrolling: touch; }

.dm-mobile-body > ul { display: flex; flex-direction: column; gap: 2px; }
.dm-mobile-body li { position: relative; }

/* Row holds the link + the expand button side by side */
.dm-mobile-item-row { display: flex; align-items: stretch; }

.dm-mobile-item-link {
  flex: 1; display: flex; align-items: center; gap: 10px;
  padding: 12px 14px; font-size: 14.5px; font-weight: 600;
  color: var(--dm-text); border-radius: var(--dm-radius-sm);
  transition: all var(--dm-trans); min-width: 0;
}
.dm-mobile-item-link:hover,
.dm-mobile-item-link:active { background: var(--dm-bg-alt); color: var(--dm-accent); }

/* Current page highlight */
.dm-mobile-body li.current-menu-item > .dm-mobile-item-row > .dm-mobile-item-link {
  background: rgba(232,66,10,.08); color: var(--dm-accent);
}

/* The expand/collapse arrow button -- its own tap target, separate from the link */
.dm-mobile-submenu-toggle {
  display: flex; align-items: center; justify-content: center;
  width: 44px; flex-shrink: 0; background: none; border: none;
  color: #aaa; cursor: pointer; border-radius: var(--dm-radius-sm);
  transition: all var(--dm-trans);
}
.dm-mobile-submenu-toggle:hover { background: var(--dm-bg-alt); color: var(--dm-accent); }
.dm-mobile-submenu-toggle svg {
  width: 16px !important; height: 16px !important;
  transition: transform .25s cubic-bezier(.4,0,.2,1);
}
.dm-mobile-submenu-toggle[aria-expanded="true"] svg { transform: rotate(180deg); }
.dm-mobile-submenu-toggle[aria-expanded="true"] { color: var(--dm-accent); }

/* Sub-menu: smooth height animation, clear visual nesting via indent + left guide-line */
.dm-mobile-body .sub-menu {
  max-height: 0; overflow: hidden;
  margin-left: 14px; padding-left: 12px;
  border-left: 2px solid var(--dm-border);
  display: flex; flex-direction: column; gap: 2px;
  transition: max-height .3s cubic-bezier(.4,0,.2,1);
}
.dm-mobile-body li.open > .sub-menu { border-left-color: var(--dm-accent); }
.dm-mobile-body .sub-menu .dm-mobile-item-link {
  font-size: 13.5px; font-weight: 500; padding: 10px 12px;
}
.dm-mobile-body .sub-menu li:first-child { margin-top: 4px; }
.dm-mobile-body .sub-menu li:last-child { margin-bottom: 4px; }

/* Footer inside drawer */
.dm-mobile-footer {
  flex-shrink: 0; padding: 14px 16px;
  border-top: 1px solid var(--dm-border);
  background: var(--dm-bg-alt);
}
.dm-mobile-footer-social { display: flex; gap: 8px; margin-bottom: 10px; }
.dm-mobile-footer-social a {
  width: 30px; height: 30px; display: flex; align-items: center; justify-content: center;
  background: #fff; border: 1px solid var(--dm-border); border-radius: 50%;
  color: var(--dm-muted); transition: all var(--dm-trans);
}
.dm-mobile-footer-social a:hover { background: var(--dm-accent); border-color: var(--dm-accent); color: #fff; }
.dm-mobile-footer-social svg { width: 14px !important; height: 14px !important; }
.dm-mobile-footer-copy { font-size: 11px; color: var(--dm-light); margin: 0; }

/* Reading progress */
#dm-progress { position:fixed; top:0; left:0; height:3px; background:var(--dm-accent); z-index:9999; width:0; transition:width .1s linear; }

/* ============================================================
   SECTIONS - COMMON
============================================================ */
.dm-section { padding: 28px 0; }
.dm-section-gray  { background: var(--dm-bg-alt); }
.dm-section-white { background: #fff; }
.dm-sec-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
.dm-sec-title { font-size: 15px; font-weight: 800; color: var(--dm-text); text-transform: uppercase; letter-spacing: .03em; display: flex; align-items: center; gap: 8px; }
.dm-sec-title::before { content:''; width:3px; height:18px; background:var(--dm-accent); border-radius:2px; display:inline-block; flex-shrink:0; }
.dm-view-all { font-size: 12px; font-weight: 600; color: var(--dm-accent); display: flex; align-items: center; gap: 3px; }
.dm-view-all:hover { text-decoration: underline; }
.dm-view-all svg { width: 14px !important; height: 14px !important; }

/* ============================================================
   HERO
============================================================ */
.dm-hero { background: #fff; padding: 16px 0 0; }
.dm-hero-grid { display: grid; grid-template-columns: 1fr 310px; gap: 14px; align-items: start; }
.dm-hero-grid--full { grid-template-columns: 1fr; }

/* Slider */
.dm-slider-wrap { border-radius: 10px; overflow: hidden; position: relative; min-height: 350px; background: #05101e; isolation: isolate; }
.dm-slide { position: absolute; inset: 0; min-height: 350px; opacity: 0; visibility: hidden; transition: opacity .6s ease; }
.dm-slide.active { position: relative; opacity: 1; visibility: visible; z-index: 1; }
.dm-slide-img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.35; }
.dm-slide-overlay { position:absolute; inset:0; background:linear-gradient(90deg,rgba(5,10,20,.96) 0%,rgba(5,10,20,.72) 55%,rgba(5,10,20,.15) 100%); }
.dm-slide-content { position:relative; z-index:2; padding:30px 34px; max-width:460px; min-height:350px; display:flex; flex-direction:column; justify-content:center; }
.dm-slide-badge { display:inline-block; background:var(--dm-accent); color:#fff; font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; padding:3px 10px; border-radius:4px; margin-bottom:14px; align-self:flex-start; }
.dm-slide-title { font-size:28px; font-weight:900; color:#fff; line-height:1.2; margin-bottom:12px; letter-spacing:-.5px; }
.dm-slide-title a { color:#fff; }
.dm-slide-title a:hover { color:#fde68a; }
.dm-slide-desc { font-size:13px; color:rgba(255,255,255,.65); line-height:1.7; margin-bottom:22px; }
.dm-slide-btn { display:inline-flex; align-items:center; gap:6px; background:#fff; color:#111; font-size:12px; font-weight:700; padding:10px 20px; border-radius:5px; align-self:flex-start; transition:all var(--dm-trans); }
.dm-slide-btn:hover { background:var(--dm-accent); color:#fff; }
.dm-slide-dots { position:absolute; bottom:18px; left:34px; z-index:3; display:flex; gap:6px; align-items:center; }
.dm-dot { width:8px; height:8px; border-radius:50%; background:rgba(255,255,255,.35); cursor:pointer; transition:all var(--dm-trans); border:none; }
.dm-dot.active { background:var(--dm-accent); width:22px; border-radius:4px; }
.dm-slider-prev, .dm-slider-next { position:absolute; top:50%; transform:translateY(-50%); z-index:4; width:36px; height:36px; background:rgba(255,255,255,.15); border:1px solid rgba(255,255,255,.2); border-radius:50%; color:#fff; font-size:16px; display:flex; align-items:center; justify-content:center; cursor:pointer; transition:all var(--dm-trans); }
.dm-slider-prev { left:14px; }
.dm-slider-next { right:14px; }
.dm-slider-prev:hover, .dm-slider-next:hover { background:var(--dm-accent); border-color:var(--dm-accent); }

/* Hero right cards */
.dm-hero-right { display: flex; flex-direction: column; gap: 12px; }
.dm-hero-card { border-radius:10px; overflow:hidden; display:flex; height:140px; text-decoration:none; }
.dm-hero-card:hover { opacity:.92; }
.dm-hero-card-body { flex:1; padding:16px; display:flex; flex-direction:column; justify-content:center; }
.dm-hero-card-badge { display:inline-block; font-size:9px; font-weight:700; text-transform:uppercase; padding:2px 8px; border-radius:3px; margin-bottom:8px; letter-spacing:.04em; }
.dm-hero-card-badge.news  { background:#1d6fa4; color:#fff; }
.dm-hero-card-badge.deal  { background:#16a34a; color:#fff; }
.dm-hero-card-title { font-size:13.5px; font-weight:700; color:#fff; line-height:1.35; margin-bottom:8px; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.dm-hero-card-link { font-size:11px; color:rgba(255,255,255,.5); font-weight:600; display:flex; align-items:center; gap:4px; }
.dm-hero-card:hover .dm-hero-card-link { color:var(--dm-accent); }
.dm-hero-card-media { width:130px; flex-shrink:0; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.dm-hero-card-img { width:100%; height:100%; object-fit:cover; }
.dm-card-dark-blue  { background:#0d2137; }
.dm-card-dark-green { background:#0d2818; }
.dm-card-media-blue  { background:linear-gradient(135deg,#0f2540,#0d1f35); }
.dm-card-media-green { background:linear-gradient(135deg,#0d2818,#1a3a20); }

/* ============================================================
   REVIEW CARDS
============================================================ */
/* auto-fit (not a fixed repeat(3,...)) so that when a section has fewer
   cards than fit in a row, the cards stretch to fill the full row instead
   of leaving empty space on the right. Applies to every homepage section,
   including any new ones added later via Customizer. */
.dm-grid-3 { display:grid; grid-template-columns:repeat(auto-fit, minmax(280px, 1fr)); gap:16px; }
@media (max-width:900px) { .dm-grid-3 { grid-template-columns:repeat(auto-fit, minmax(240px, 1fr)); } }
@media (max-width:600px) { .dm-grid-3 { grid-template-columns:1fr; } }

.dm-review-card { background:#fff; border-radius:var(--dm-radius); border:1px solid var(--dm-border); overflow:hidden; transition:all var(--dm-trans); display:flex; flex-direction:column; }
.dm-review-card:hover { box-shadow:var(--dm-shadow-md); transform:translateY(-2px); }
.dm-review-card-img { width:100%; height:175px; object-fit:cover; display:block; background:#eee; }
.dm-review-card-body { padding:14px; flex:1; display:flex; flex-direction:column; }
.dm-review-cat { font-size:10px; font-weight:700; color:#1d6fa4; text-transform:uppercase; letter-spacing:.06em; margin-bottom:7px; }
.dm-review-cat a { color:inherit; }
.dm-review-title { font-size:14px; font-weight:700; color:var(--dm-text); line-height:1.35; margin-bottom:10px; flex:1; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.dm-review-title a { color:inherit; }
.dm-review-title a:hover { color:var(--dm-accent); }
.dm-review-meta { display:flex; align-items:center; gap:10px; font-size:11px; color:#999; margin-top:auto; }
.dm-review-comments { display:flex; align-items:center; gap:3px; }
.dm-review-comments svg { width:12px !important; height:12px !important; }

/* ============================================================
   DUAL SECTION
============================================================ */
.dm-dual-wrap { background:#fff; border-top:1px solid #f0f0f0; border-bottom:1px solid #f0f0f0; }
.dm-dual-inner { max-width:var(--dm-container); margin:0 auto; padding:0 20px; display:grid; grid-template-columns:1fr 1fr; }
@media (max-width:768px) { .dm-dual-inner { grid-template-columns:1fr; } }
.dm-dual-col { padding:22px 20px; }
.dm-dual-col:first-child { border-right:1px solid #f0f0f0; padding-left:0; }
.dm-dual-col:last-child  { padding-right:0; }
@media (max-width:768px) {
  .dm-dual-col:first-child { border-right:none; border-bottom:1px solid #f0f0f0; padding:0 0 20px; }
  .dm-dual-col:last-child  { padding:20px 0 0; }
}

.dm-mini-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
@media (max-width:480px) { .dm-mini-grid { grid-template-columns:repeat(2,1fr); } }
.dm-mini-card { transition:all var(--dm-trans); }
.dm-mini-card:hover { transform:translateY(-2px); }
.dm-mini-card-img { width:100%; aspect-ratio:16/10; object-fit:cover; border-radius:7px; margin-bottom:8px; display:block; background:#e8e8e8; }
.dm-mini-title { font-size:11.5px; font-weight:700; color:var(--dm-text); line-height:1.35; margin-bottom:4px; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.dm-mini-title a { color:inherit; }
.dm-mini-title a:hover { color:var(--dm-accent); }
.dm-mini-date { font-size:10px; color:#aaa; }

/* ============================================================
   BUYING GUIDES
============================================================ */
.dm-grid-5 { display:grid; grid-template-columns:repeat(5,1fr); gap:14px; }
@media (max-width:1024px) { .dm-grid-5 { grid-template-columns:repeat(3,1fr); } }
@media (max-width:640px)  { .dm-grid-5 { grid-template-columns:repeat(2,1fr); } }
@media (max-width:400px)  { .dm-grid-5 { grid-template-columns:1fr; } }

.dm-guide-card { background:#fff; border:1px solid var(--dm-border); border-radius:var(--dm-radius); overflow:hidden; transition:all var(--dm-trans); }
.dm-guide-card:hover { box-shadow:var(--dm-shadow-md); transform:translateY(-2px); border-color:#ddd; }
.dm-guide-img { width:100%; height:100px; object-fit:cover; display:block; background:#e8e8e8; }
.dm-guide-body { padding:10px 12px; }
.dm-guide-title { font-size:12px; font-weight:700; color:var(--dm-text); line-height:1.35; margin-bottom:4px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.dm-guide-title a { color:inherit; }
.dm-guide-title a:hover { color:var(--dm-accent); }
.dm-guide-date { font-size:10px; color:#aaa; }

/* ============================================================
   COMPARISONS
============================================================ */
.dm-comp-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:14px; }
@media (max-width:1024px) { .dm-comp-grid { grid-template-columns:repeat(3,1fr); } }
@media (max-width:640px)  { .dm-comp-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:400px)  { .dm-comp-grid { grid-template-columns:1fr; } }

.dm-comp-card { background:#fff; border:1px solid var(--dm-border); border-radius:var(--dm-radius); padding:14px; transition:all var(--dm-trans); }
.dm-comp-card:hover { box-shadow:var(--dm-shadow-md); transform:translateY(-2px); }
.dm-comp-devices { display:flex; align-items:center; justify-content:center; gap:8px; margin-bottom:12px; }
.dm-comp-img { width:62px; height:78px; object-fit:contain; border-radius:5px; background:#f2f2f2; display:block; }
.dm-comp-vs { width:26px; height:26px; flex-shrink:0; background:var(--dm-accent); color:#fff; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:9px; font-weight:800; }
.dm-comp-title { font-size:11.5px; font-weight:700; color:var(--dm-text); line-height:1.35; text-align:center; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.dm-comp-title a { color:inherit; }
.dm-comp-title a:hover { color:var(--dm-accent); }
.dm-comp-date { font-size:10px; color:#aaa; text-align:center; margin-top:4px; }

/* ============================================================
   NEWS GRID
============================================================ */
.dm-news-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
@media (max-width:900px) { .dm-news-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:500px) { .dm-news-grid { grid-template-columns:1fr; } }

.dm-news-item { display:flex; gap:11px; align-items:flex-start; }
.dm-news-thumb { width:72px; height:58px; flex-shrink:0; border-radius:6px; object-fit:cover; display:block; background:#e8e8e8; }
.dm-news-title { font-size:12px; font-weight:700; color:var(--dm-text); line-height:1.4; margin-bottom:5px; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.dm-news-title a { color:inherit; }
.dm-news-title a:hover { color:var(--dm-accent); }
.dm-news-date { font-size:10.5px; color:#aaa; }

/* ============================================================
   NEWSLETTER
============================================================ */
.dm-newsletter { background:#1a1a2e; padding:28px 0; }
.dm-newsletter-inner { display:flex; align-items:center; gap:24px; max-width:var(--dm-container); margin:0 auto; padding:0 20px; }
@media (max-width:768px) { .dm-newsletter-inner { flex-direction:column; text-align:center; align-items:center; } }
.dm-nl-icon { width:54px; height:54px; flex-shrink:0; background:rgba(255,255,255,.1); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:22px; }
.dm-nl-text { flex:1; }
.dm-nl-text h2 { font-size:15px; font-weight:800; color:#fff; margin-bottom:3px; }
.dm-nl-text p  { font-size:12px; color:rgba(255,255,255,.45); }
.dm-nl-form { display:flex; gap:8px; flex-shrink:0; }
@media (max-width:500px) { .dm-nl-form { flex-direction:column; width:100%; } }
.dm-nl-input { height:42px; padding:0 16px; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.15); border-radius:6px; color:#fff; font-size:12.5px; width:240px; outline:none; }
.dm-nl-input::placeholder { color:rgba(255,255,255,.3); }
.dm-nl-input:focus { border-color:var(--dm-accent); }
.dm-nl-btn { height:42px; padding:0 22px; background:var(--dm-accent); color:#fff; font-weight:700; font-size:12.5px; letter-spacing:.04em; border-radius:6px; border:none; cursor:pointer; transition:background var(--dm-trans); white-space:nowrap; }
.dm-nl-btn:hover { background:var(--dm-accent-dk); }

/* ============================================================
   BUTTONS
============================================================ */
.dm-btn-amazon  { display:inline-flex; align-items:center; justify-content:center; gap:6px; padding:9px 18px; background:#FF9900; color:#000; font-weight:700; font-size:12.5px; border-radius:5px; transition:all var(--dm-trans); }
.dm-btn-amazon:hover  { background:#e68900; color:#000; transform:translateY(-1px); }
.dm-btn-flipkart { display:inline-flex; align-items:center; justify-content:center; gap:6px; padding:9px 18px; background:#2874f0; color:#fff; font-weight:700; font-size:12.5px; border-radius:5px; transition:all var(--dm-trans); }
.dm-btn-flipkart:hover { background:#1a65e0; color:#fff; transform:translateY(-1px); }

/* ============================================================
   FOOTER
============================================================ */
#dm-footer { background:var(--dm-footer); color:rgba(255,255,255,.6); }
.dm-footer-main { padding:36px 0 28px; border-bottom:1px solid rgba(255,255,255,.07); }
.dm-footer-grid { display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:40px; }
@media (max-width:900px) { .dm-footer-grid { grid-template-columns:1fr 1fr; gap:24px; } }
@media (max-width:500px) { .dm-footer-grid { grid-template-columns:1fr; } }

.dm-footer-logo { display:flex; align-items:center; gap:9px; margin-bottom:12px; }
.dm-footer-logo img,
.dm-footer-logo .custom-logo {
  max-height:32px !important;
  height:auto !important;
  width:auto !important;
  max-width:180px !important;
  display:block;
}
.dm-footer-logo-icon { width:32px; height:32px; background:#fff; border-radius:5px; display:flex; align-items:center; justify-content:center; }
.dm-footer-logo-icon span { font-size:12px; font-weight:900; color:#111; }
.dm-footer-brand { font-size:16px; font-weight:900; }
.dm-footer-brand .main   { color:#fff; }
.dm-footer-brand .accent { color:var(--dm-accent); }
.dm-footer-desc { font-size:12px; line-height:1.7; color:rgba(255,255,255,.4); margin-bottom:14px; }
.dm-footer-social { display:flex; gap:8px; }
.dm-footer-social a { width:28px; height:28px; background:rgba(255,255,255,.08); border-radius:5px; display:flex; align-items:center; justify-content:center; color:rgba(255,255,255,.55); transition:all var(--dm-trans); }
.dm-footer-social a:hover { background:var(--dm-accent); color:#fff; }
.dm-footer-social svg { width:14px !important; height:14px !important; }

.dm-footer-col-title { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.1em; color:rgba(255,255,255,.35); margin-bottom:14px; }
.dm-footer-links { display:flex; flex-direction:column; gap:8px; }
.dm-footer-links a { font-size:12.5px; color:rgba(255,255,255,.5); transition:color var(--dm-trans); }
.dm-footer-links a:hover { color:var(--dm-accent); }
.dm-footer-links a.with-icon { display:flex; align-items:center; gap:7px; }
.fi { display:inline-flex; width:20px; height:20px; border-radius:4px; align-items:center; justify-content:center; font-size:11px; color:#fff; flex-shrink:0; }
.fi-fb { background:#1877f2; }
.fi-ig { background:linear-gradient(45deg,#f09433,#dc2743); }
.fi-yt { background:#ff0000; }
.fi-tw { background:#000; }

.dm-footer-bottom { padding:14px 0; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; }
.dm-footer-copy { font-size:11.5px; color:rgba(255,255,255,.3); }
.dm-footer-legal { display:flex; gap:14px; align-items:center; flex-wrap:wrap; }
.dm-footer-legal a { font-size:11.5px; color:rgba(255,255,255,.3); }
.dm-footer-legal a:hover { color:var(--dm-accent); }
.dm-footer-legal .sep { color:rgba(255,255,255,.12); }
.dm-scroll-top { width:32px; height:32px; background:rgba(255,255,255,.1); border-radius:6px; display:flex; align-items:center; justify-content:center; color:rgba(255,255,255,.5); cursor:pointer; transition:all var(--dm-trans); border:none; }
.dm-scroll-top:hover { background:var(--dm-accent); color:#fff; }
.dm-scroll-top svg { width:16px !important; height:16px !important; }

/* Mobile bottom nav */

/* ============================================================
   SINGLE POST
============================================================ */
.dm-single-layout { display:grid; grid-template-columns:1fr 300px; gap:30px; padding:24px 0 40px; align-items:start; }
@media (max-width:1024px) { .dm-single-layout { grid-template-columns:1fr; } }

.dm-article-header { margin-bottom:20px; }
.dm-article-cats { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:14px; }
.dm-article-cat-badge { background:var(--dm-accent); color:#fff; font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; padding:3px 10px; border-radius:4px; }
.dm-article-title { font-size:clamp(22px,4vw,32px); font-weight:900; line-height:1.2; letter-spacing:-.5px; margin-bottom:16px; }
.dm-article-meta { display:flex; flex-wrap:wrap; align-items:center; gap:14px; padding:12px 0; border-top:1px solid var(--dm-border); border-bottom:1px solid var(--dm-border); margin-bottom:22px; font-size:12px; color:#888; }
.dm-article-author { display:flex; align-items:center; gap:7px; }
.dm-article-avatar { width:32px; height:32px; border-radius:50%; object-fit:cover; }
.dm-article-author-name { font-weight:700; color:var(--dm-text); font-size:12.5px; }
.dm-article-author-name a { color:inherit; }
.dm-article-author-name a:hover { color:var(--dm-accent); }
.dm-article-featured { width:100%; border-radius:var(--dm-radius); margin-bottom:24px; object-fit:cover; aspect-ratio:16/9; display:block; }

.dm-article-content { font-size:15px; line-height:1.8; }
.dm-article-content h2 { font-size:22px; font-weight:800; margin:32px 0 12px; padding-top:12px; border-top:1px solid var(--dm-border); scroll-margin-top:80px; }
.dm-article-content h3 { font-size:18px; font-weight:700; margin:24px 0 10px; scroll-margin-top:80px; }
.dm-article-content p { margin-bottom:16px; }
.dm-article-content ul, .dm-article-content ol { list-style:revert; padding-left:24px; margin-bottom:16px; }
.dm-article-content li { margin-bottom:6px; }
.dm-article-content blockquote { border-left:4px solid var(--dm-accent); padding-left:18px; margin:0 0 20px; font-size:17px; color:#555; font-style:italic; }
.dm-article-content a { color:var(--dm-accent); text-decoration:underline; }
.dm-article-content img { border-radius:var(--dm-radius); margin:20px 0; }
.dm-article-content table { width:100%; border-collapse:collapse; margin-bottom:20px; font-size:13px; }
.dm-article-content th, .dm-article-content td { padding:9px 14px; border:1px solid var(--dm-border); text-align:left; }
.dm-article-content th { background:var(--dm-bg-alt); font-weight:700; font-size:11px; text-transform:uppercase; }

/* Review Scores */
.dm-review-score-box { background:var(--dm-primary); border-radius:var(--dm-radius); padding:20px; text-align:center; margin-bottom:20px; }
.dm-review-score-label { font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.1em; color:rgba(255,255,255,.5); margin-bottom:12px; }
.dm-review-score-num  { font-size:52px; font-weight:900; color:var(--dm-accent); line-height:1; }
.dm-review-score-denom { font-size:18px; color:rgba(255,255,255,.4); }
.dm-subscores { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:16px; }
.dm-subscore { background:rgba(255,255,255,.07); border-radius:5px; padding:8px 4px; text-align:center; }
.dm-subscore-val   { font-size:18px; font-weight:800; color:var(--dm-accent); }
.dm-subscore-label { font-size:9px; color:rgba(255,255,255,.45); margin-top:2px; }

/* Score bars */
.dm-score-bars { margin-bottom:20px; }
.dm-score-bar { margin-bottom:12px; }
.dm-score-bar-header { display:flex; justify-content:space-between; margin-bottom:5px; font-size:12px; }
.dm-score-bar-label { font-weight:600; color:var(--dm-text); }
.dm-score-bar-val   { font-weight:800; color:var(--dm-accent); }
.dm-score-bar-track { height:6px; background:var(--dm-border); border-radius:99px; overflow:hidden; }
.dm-score-bar-fill  { height:100%; background:linear-gradient(90deg,var(--dm-accent),#fbbf24); border-radius:99px; width:0; transition:width 1.5s ease; }

/* Pros / Cons */
.dm-pros-cons { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin:20px 0; }
@media (max-width:600px) { .dm-pros-cons { grid-template-columns:1fr; } }
.dm-pros { background:#f0fdf4; border:1px solid #86efac; border-radius:var(--dm-radius); padding:14px; }
.dm-cons { background:#fff1f2; border:1px solid #fecdd3; border-radius:var(--dm-radius); padding:14px; }
.dm-pros-cons-title { font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.07em; margin-bottom:10px; display:flex; align-items:center; gap:5px; }
.dm-pros .dm-pros-cons-title { color:#16a34a; }
.dm-cons .dm-pros-cons-title { color:#dc2626; }
.dm-pros-cons-list { display:flex; flex-direction:column; gap:7px; }
.dm-pros-cons-list li { font-size:12.5px; display:flex; align-items:flex-start; gap:7px; list-style:none; }
.dm-pros-cons-list li::before { content:''; display:inline-block; width:16px; height:16px; flex-shrink:0; margin-top:1px; background-size:contain; }
.dm-pros .dm-pros-cons-list li::before { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%2316a34a'%3E%3Cpath fill-rule='evenodd' d='M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z'/%3E%3C/svg%3E"); }
.dm-cons .dm-pros-cons-list li::before { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%23dc2626'%3E%3Cpath fill-rule='evenodd' d='M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z'/%3E%3C/svg%3E"); }

/* Specs table */
.dm-specs-wrap { border:1px solid var(--dm-border); border-radius:var(--dm-radius); overflow:hidden; margin:20px 0; }
.dm-specs-title { background:var(--dm-bg-alt); padding:10px 16px; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.07em; color:#666; border-bottom:1px solid var(--dm-border); }
.dm-specs-table { width:100%; border-collapse:collapse; font-size:13px; }
.dm-specs-table tr:nth-child(even) td { background:var(--dm-bg-alt); }
.dm-specs-table td { padding:9px 16px; border-bottom:1px solid var(--dm-border); vertical-align:top; }
.dm-specs-table tr:last-child td { border-bottom:none; }
.dm-specs-label { font-weight:600; color:#777; width:38%; }
.dm-specs-value { color:var(--dm-text); }

/* Verdict */
.dm-verdict { background:linear-gradient(135deg,var(--dm-primary),#1e3a5f); border-radius:var(--dm-radius); padding:24px; color:#fff; margin:20px 0; }
.dm-verdict-label { font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.12em; color:var(--dm-accent); margin-bottom:8px; }
.dm-verdict-title { font-size:17px; font-weight:800; margin-bottom:10px; }
.dm-verdict-text  { font-size:13.5px; color:rgba(255,255,255,.75); line-height:1.7; margin-bottom:16px; }
.dm-verdict-btns  { display:flex; gap:10px; flex-wrap:wrap; }

/* TOC */
.dm-toc { background:var(--dm-bg-alt); border:1px solid var(--dm-border); border-left:4px solid var(--dm-accent); border-radius:var(--dm-radius); padding:16px; margin-bottom:24px; }
.dm-toc-title { font-size:13px; font-weight:700; margin-bottom:12px; display:flex; align-items:center; gap:7px; }
.dm-toc-list { counter-reset:toc; display:flex; flex-direction:column; gap:7px; }
.dm-toc-list li { counter-increment:toc; }
.dm-toc-list a { font-size:12.5px; color:#666; display:flex; align-items:flex-start; gap:8px; }
.dm-toc-list a::before { content:counter(toc); display:inline-flex; align-items:center; justify-content:center; min-width:20px; height:20px; background:var(--dm-accent); color:#fff; font-size:10px; font-weight:700; border-radius:4px; flex-shrink:0; }
.dm-toc-list a:hover { color:var(--dm-accent); }

/* Author box */
.dm-author-box { display:flex; gap:16px; background:var(--dm-bg-alt); border:1px solid var(--dm-border); border-radius:var(--dm-radius); padding:20px; margin:28px 0; }
@media (max-width:500px) { .dm-author-box { flex-direction:column; align-items:center; text-align:center; } }
.dm-author-avatar { width:70px; height:70px; border-radius:50%; object-fit:cover; flex-shrink:0; border:3px solid var(--dm-accent); }
.dm-author-name { font-size:16px; font-weight:800; margin-bottom:3px; }
.dm-author-name a { color:var(--dm-text); }
.dm-author-name a:hover { color:var(--dm-accent); }
.dm-author-role { font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.07em; color:var(--dm-accent); margin-bottom:8px; }
.dm-author-bio  { font-size:12.5px; color:#666; line-height:1.6; }

/* Post nav */
.dm-post-nav { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin:28px 0; border-top:1px solid var(--dm-border); padding-top:24px; }
@media (max-width:600px) { .dm-post-nav { grid-template-columns:1fr; } }
.dm-post-nav-item { display:flex; gap:12px; padding:14px; border:1px solid var(--dm-border); border-radius:var(--dm-radius); transition:all var(--dm-trans); }
.dm-post-nav-item:hover { border-color:var(--dm-accent); box-shadow:var(--dm-shadow); }
.dm-post-nav-item.next { flex-direction:row-reverse; text-align:right; }
.dm-post-nav-thumb { width:52px; height:52px; border-radius:5px; object-fit:cover; flex-shrink:0; }
.dm-post-nav-label { font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.07em; color:#aaa; margin-bottom:3px; }
.dm-post-nav-title { font-size:12px; font-weight:700; color:var(--dm-text); line-height:1.3; }
.dm-post-nav-title a { color:inherit; }
.dm-post-nav-title a:hover { color:var(--dm-accent); }

/* Related posts */
.dm-related { margin-top:32px; }
.dm-related-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
@media (max-width:700px) { .dm-related-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:480px) { .dm-related-grid { grid-template-columns:1fr; } }

/* Sidebar */
.dm-sidebar { position:sticky; top:80px; }
.dm-sidebar-widget { background:#fff; border:1px solid var(--dm-border); border-radius:var(--dm-radius); padding:16px; margin-bottom:16px; }
.dm-widget-title { font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.08em; color:var(--dm-text); padding-bottom:10px; border-bottom:2px solid var(--dm-accent); margin-bottom:14px; }
.dm-ad-widget { text-align:center; overflow:hidden; border-radius:var(--dm-radius); background:var(--dm-bg-alt); border:1px dashed #ddd; min-height:250px; display:flex; align-items:center; justify-content:center; color:#bbb; font-size:13px; margin-bottom:16px; }
.dm-ad-slot { text-align:center; overflow:hidden; }

/* ============================================================
   BREADCRUMBS
============================================================ */
.dm-breadcrumbs { display:flex; flex-wrap:wrap; align-items:center; gap:6px; font-size:12px; color:#999; padding:14px 0; border-bottom:1px solid var(--dm-border); margin-bottom:20px; }
.dm-breadcrumbs a { color:#777; }
.dm-breadcrumbs a:hover { color:var(--dm-accent); }
.dm-breadcrumbs .sep { opacity:.4; }

/* ============================================================
   PAGINATION
============================================================ */
.dm-pagination { display:flex; justify-content:center; gap:6px; margin-top:28px; flex-wrap:wrap; }
.dm-pagination .page-numbers { display:inline-flex; align-items:center; justify-content:center; min-width:38px; height:38px; border:1px solid var(--dm-border); border-radius:5px; font-size:13px; font-weight:600; color:var(--dm-text); padding:0 10px; transition:all var(--dm-trans); }
.dm-pagination .page-numbers:hover,
.dm-pagination .page-numbers.current { background:var(--dm-accent); border-color:var(--dm-accent); color:#fff; }

/* ============================================================
   ARCHIVE HEADER
============================================================ */
.dm-archive-header { background:linear-gradient(135deg,var(--dm-primary),#1e3a5f); padding:36px 0; text-align:center; color:#fff; margin-bottom:28px; }
.dm-archive-badge { display:inline-block; background:rgba(232,66,10,.2); border:1px solid var(--dm-accent); border-radius:99px; font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.1em; color:var(--dm-accent); padding:3px 12px; margin-bottom:12px; }
.dm-archive-title { font-size:28px; font-weight:900; color:#fff; margin-bottom:8px; }
.dm-archive-desc  { font-size:14px; color:rgba(255,255,255,.55); max-width:500px; margin:0 auto; }

/* ============================================================
   404
============================================================ */
.dm-404 { text-align:center; padding:80px 20px; min-height:60vh; display:flex; align-items:center; justify-content:center; }
.dm-404-inner { max-width:520px; margin:0 auto; }
.dm-404-code  { font-size:96px; font-weight:900; color:var(--dm-accent); line-height:1; margin-bottom:14px; }
.dm-404-title { font-size:24px; font-weight:800; margin-bottom:12px; }
.dm-404-desc  { font-size:14px; color:#777; line-height:1.7; margin-bottom:24px; }
.dm-404-btn   { display:inline-flex; align-items:center; gap:7px; padding:11px 24px; background:var(--dm-primary); color:#fff; border-radius:6px; font-weight:700; font-size:13px; transition:all var(--dm-trans); }
.dm-404-btn:hover { background:var(--dm-accent); color:#fff; }

/* ============================================================
   TOAST
============================================================ */
#dm-toast { position:fixed; bottom:20px; left:50%; transform:translateX(-50%); background:#111827; color:#fff; padding:8px 20px; border-radius:99px; font-size:13px; font-weight:600; z-index:9999; opacity:0; pointer-events:none; white-space:nowrap; transition:opacity .3s; }

/* ============================================================
   FOCUS / ACCESSIBILITY
============================================================ */
:focus-visible { outline:2px solid var(--dm-accent); outline-offset:2px; }

/* ============================================================
   RESPONSIVE
============================================================ */
@media (max-width:1024px) {
  .dm-mobile-toggle { display:flex; }
  .dm-nav { display:none; }
  .dm-nav-row { display:none; }
  .dm-hero-grid { grid-template-columns:1fr; }
  .dm-hero-right { display:grid; grid-template-columns:1fr 1fr; }
}

@media (max-width:767px) {
  /* Header: collapse the full search bar, show compact icon instead */
  .dm-search-wrap { display:none; }
  .dm-search-icon-toggle { display:flex; }
  .dm-mobile-search-bar { display:block; }

  /* One clean line: [logo flex:1] [search-icon] [hamburger] */
  .dm-header-top-row { height:54px; gap:6px; padding:0 14px; }
  .dm-header-actions { gap:2px; flex-shrink:0; }
  .dm-logo { flex:1; gap:7px; min-width:0; overflow:hidden; }
  .dm-logo-icon { width:30px; height:30px; flex-shrink:0; }
  .dm-logo-icon span { font-size:11px; }
  .dm-logo-name { font-size:13.5px; white-space:nowrap; }
  .dm-logo-tagline { display:none; }

  .dm-hero-right { grid-template-columns:1fr; }
  .dm-slide-title { font-size:21px; }
  .dm-slide-content { padding:20px; }
  .dm-footer-grid { gap:20px; }

  .dm-topbar-text { font-size:10.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

  /* Hero side cards: smaller thumbnail, tighter text padding so content never feels squeezed */
  .dm-hero-card { height:120px; }
  .dm-hero-card-body { padding:12px; }
  .dm-hero-card-media { width:90px; }
  .dm-hero-card-title { font-size:12.5px; -webkit-line-clamp:2; }
}

@media (max-width:420px) {
  .dm-logo-icon { width:28px; height:28px; }
  .dm-logo-icon span { font-size:10px; }
  .dm-logo-name { font-size:12.5px; }
}

@media (max-width:360px) {
  .dm-logo-text { display:none; }
}

/* ============================================================
   PRINT
============================================================ */

/* ============================================================
   UTILITY CLASSES (generated by theme PHP, need CSS definitions)
============================================================ */

/* dmp_ad() output wrapper - ad slots injected by theme functions */
.dm-ad { text-align:center; overflow:hidden; margin:16px 0; clear:both; }

/* Article element on single.php - gets post_class() applied */
.dm-single-article { max-width:100%; }

/* Comments section wrapper in comments.php */
.dm-comments-area {
  margin-top:32px; padding-top:28px;
  border-top:1px solid var(--dm-border);
}

/* Newsletter AJAX form (when no Mailchimp URL is set in admin) */
.dm-nl-ajax-form { display:flex; gap:8px; flex-shrink:0; }
@media (max-width:500px) { .dm-nl-ajax-form { flex-direction:column; width:100%; } }

/* Live search results dropdown (both desktop and mobile share this) */
.dm-search-results-dropdown {
  position:absolute; top:calc(100% + 6px); right:0;
  width:360px; background:#fff;
  border:1px solid var(--dm-border);
  border-radius:var(--dm-radius);
  box-shadow:var(--dm-shadow-md);
  z-index:500; overflow:hidden;
  display:none;
}
@media (max-width:767px) {
  .dm-search-results-dropdown { width:calc(100vw - 40px); right:0; }
}

/* ============================================================
   PRINT
============================================================ */
@media print {
  .dm-single-layout { grid-template-columns:1fr; }
}

/* ============================================================
   REDUCED MOTION
============================================================ */
@media (prefers-reduced-motion:reduce) {
  *, *::before, *::after { animation-duration:.01ms !important; transition-duration:.01ms !important; }
}

/* ============================================================
   DARK MODE
============================================================ */
html[data-theme="dark"] {
  color-scheme: dark;
  --dm-bg:        #0f1115;
  --dm-bg-alt:    #171a21;
  --dm-text:      #e8e9ec;
  --dm-muted:     #9aa0aa;
  --dm-light:     #7a808a;
  --dm-border:    #2a2e37;
  --dm-topbar:    #0b0d11;
  --dm-footer:    #0b0d11;
  --dm-shadow:    0 2px 12px rgba(0,0,0,.35);
  --dm-shadow-md: 0 4px 20px rgba(0,0,0,.45);
}
html[data-theme="dark"] .dm-nav-row,
html[data-theme="dark"] .dm-nav .sub-menu,
html[data-theme="dark"] #dm-search-results,
html[data-theme="dark"] .dm-search-results-dropdown,
html[data-theme="dark"] #dm-mobile-search-bar,
html[data-theme="dark"] #dm-mobile-search-results a,
html[data-theme="dark"] .dm-mobile-panel,
html[data-theme="dark"] .dm-mobile-close,
html[data-theme="dark"] .dm-mobile-footer-social a,
html[data-theme="dark"] .dm-section-white,
html[data-theme="dark"] .dm-hero,
html[data-theme="dark"] .dm-review-card,
html[data-theme="dark"] .dm-dual-wrap,
html[data-theme="dark"] .dm-guide-card,
html[data-theme="dark"] .dm-comp-card,
html[data-theme="dark"] .dm-sidebar-widget,
html[data-theme="dark"] .dm-saved-panel {
  background: var(--dm-bg);
}
html[data-theme="dark"] img { filter: brightness(.92); }

/* Dark mode toggle + Saved button */
.dm-dark-toggle,
.dm-saved-open {
  display: inline-flex; align-items: center; justify-content: center;
  width: 34px; height: 34px; border-radius: 50%; border: 1px solid transparent;
  background: none; color: var(--dm-text); cursor: pointer; flex-shrink: 0; padding: 0;
  transition: all var(--dm-trans);
}
.dm-dark-toggle:hover,
.dm-saved-open:hover { border-color: var(--dm-accent); color: var(--dm-accent); }
.dm-dark-toggle svg,
.dm-saved-open svg { width: 18px !important; height: 18px !important; }
.dm-dark-toggle .dm-icon-moon { display: none; }
html[data-theme="dark"] .dm-dark-toggle .dm-icon-sun { display: none; }
html[data-theme="dark"] .dm-dark-toggle .dm-icon-moon { display: block; }

/* ============================================================
   LOAD MORE
============================================================ */
.dm-load-more-wrap { text-align: center; margin: 28px 0 8px; }
.dm-load-more-btn {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 12px 32px; border-radius: 6px; border: 1px solid var(--dm-border);
  background: var(--dm-bg); color: var(--dm-text); font-weight: 700; font-size: 13px;
  cursor: pointer; transition: all var(--dm-trans);
}
.dm-load-more-btn:hover { border-color: var(--dm-accent); color: var(--dm-accent); }
.dm-load-more-btn:disabled { opacity: .6; cursor: default; }

/* ============================================================
   SAVED ARTICLES PANEL
============================================================ */
.dm-saved-overlay {
  position: fixed; inset: 0; background: rgba(0,0,0,.5); z-index: 500;
  opacity: 0; visibility: hidden; transition: all var(--dm-trans);
}
.dm-saved-overlay.active { opacity: 1; visibility: visible; }
.dm-saved-panel {
  position: fixed; top: 0; right: 0; bottom: 0; width: min(340px,85vw);
  background: var(--dm-bg); z-index: 501; overflow-y: auto;
  transform: translateX(100%); transition: transform .3s ease;
  display: flex; flex-direction: column;
}
.dm-saved-panel.active { transform: translateX(0); }
.dm-saved-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 16px; border-bottom: 1px solid var(--dm-border);
  font-weight: 800; font-size: 14px; color: var(--dm-text);
}
.dm-saved-close {
  background: none; border: none; color: var(--dm-text); cursor: pointer;
  width: 30px; height: 30px; display: flex; align-items: center; justify-content: center;
}
.dm-saved-list { list-style: none; margin: 0; padding: 8px; flex: 1; }
.dm-saved-item {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 10px 12px; border-radius: var(--dm-radius-sm);
}
.dm-saved-item:hover { background: var(--dm-bg-alt); }
.dm-saved-item a { color: var(--dm-text); font-size: 13px; font-weight: 600; flex: 1; }
.dm-saved-item a:hover { color: var(--dm-accent); }
.dm-saved-remove {
  background: none; border: none; color: var(--dm-muted); font-size: 18px;
  line-height: 1; cursor: pointer; flex-shrink: 0; padding: 4px;
}
.dm-saved-remove:hover { color: var(--dm-accent); }
.dm-saved-empty { padding: 24px 16px; color: var(--dm-muted); font-size: 13px; text-align: center; }