/*
Theme Name: Dual Magazine
Theme URI: https://example.com/dual-magazine
Author: Your Name
Author URI: https://example.com
Description: একটি ফ্লেক্সিবল ম্যাগাজিন/নিউজ থিম, যাতে দুইটি ডেমো লেআউট (Pulses Pro স্টাইল ও Urban Observer স্টাইল) একসাথে রাখা হয়েছে। Elementor Free দিয়ে পেজ এডিট করা যায়, আর হোমপেজের সেকশনগুলো Customizer / Widgets থেকে ইচ্ছামতো এডিট করা যায়। মেনু নিজে থেকে Appearance > Menus থেকে তৈরি করা যাবে।
Version: 1.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: dual-magazine
Tags: news, magazine, blog, elementor-compatible, custom-menu, custom-logo, footer-widgets

Dual Magazine is a two-in-one starter theme. All the visual CSS below can be
freely edited. It is only a starting point so the client can restyle freely
via Customizer, Additional CSS, or Elementor.
*/

/* =========================================================
   0. RESET / BASE
========================================================= */
:root{
	--color-text:#222;
	--color-muted:#777;
	--color-border:#e5e5e5;
	--color-bg:#ffffff;
	--color-accent:#6c4fa1; /* style A accent (purple, like Pulses Pro "Must Read" band) */
	--color-accent-b:#e2231a; /* style B accent (red, like Urban Observer) */
	--font-serif:Georgia, 'Times New Roman', serif;
	--font-sans:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
	--container:1200px;
}
*{box-sizing:border-box;}
body{
	margin:0;
	font-family:var(--font-sans);
	color:var(--color-text);
	background:var(--color-bg);
	line-height:1.5;
}
img{max-width:100%;height:auto;display:block;}
a{color:inherit;text-decoration:none;}
a:hover{opacity:.8;}
ul{list-style:none;margin:0;padding:0;}
.container{max-width:var(--container);margin:0 auto;padding:0 20px;}
.screen-reader-text{position:absolute;left:-9999px;}

/* =========================================================
   1. TOP BAR
========================================================= */
.dm-topbar{background:#000;color:#fff;font-size:12px;}
.dm-topbar .container{display:flex;justify-content:space-between;align-items:center;padding:8px 20px;}
.dm-topbar a{color:#ccc;margin-right:14px;}
.dm-topbar a:hover{color:#fff;}
.dm-topbar-right a{margin-left:14px;margin-right:0;}

/* =========================================================
   2. SITE HEADER / LOGO
========================================================= */
.dm-header{padding:22px 0;text-align:center;border-bottom:1px solid var(--color-border);}
.dm-site-branding{display:flex;flex-direction:column;align-items:center;gap:4px;}
.dm-site-title{font-family:var(--font-serif);font-size:2.4em;letter-spacing:2px;margin:0;text-transform:uppercase;}
.dm-site-title a{color:var(--color-text);}
.dm-site-description{font-size:12px;color:var(--color-muted);margin:0;}
.custom-logo{max-height:70px;}

/* =========================================================
   3. PRIMARY NAVIGATION  (managed under Appearance > Menus)
========================================================= */
.dm-nav-wrap{background:#fff;border-bottom:1px solid var(--color-border);}
.dm-primary-nav{display:flex;justify-content:center;flex-wrap:wrap;}
.dm-primary-nav ul{display:flex;flex-wrap:wrap;justify-content:center;}
.dm-primary-nav li{position:relative;}
.dm-primary-nav a{display:block;padding:14px 16px;font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;}
.dm-primary-nav li:hover > a{color:var(--color-accent);}
.dm-primary-nav .sub-menu{display:none;position:absolute;top:100%;left:0;background:#fff;min-width:200px;box-shadow:0 6px 18px rgba(0,0,0,.08);z-index:50;text-align:left;}
.dm-primary-nav li:hover > .sub-menu{display:block;}
.dm-primary-nav .sub-menu a{padding:10px 16px;text-transform:none;font-weight:400;}
.dm-mobile-toggle{display:none;background:none;border:0;font-size:22px;padding:10px 20px;cursor:pointer;}

@media (max-width:800px){
	.dm-mobile-toggle{display:block;margin:0 auto;}
	.dm-primary-nav{display:none;flex-direction:column;}
	.dm-primary-nav.is-open{display:flex;}
	.dm-primary-nav ul{flex-direction:column;width:100%;}
	.dm-primary-nav .sub-menu{position:static;box-shadow:none;}
}

/* =========================================================
   4. GENERIC SECTION / CARD / GRID HELPERS
========================================================= */
.dm-section{margin:36px 0;}
.dm-section-title{font-size:18px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;border-bottom:3px solid var(--color-accent);padding-bottom:8px;margin-bottom:18px;display:inline-block;}
.dm-grid{display:grid;gap:24px;}
.dm-grid-2{grid-template-columns:2fr 1fr;}
.dm-grid-3{grid-template-columns:repeat(3,1fr);}
.dm-grid-4{grid-template-columns:repeat(4,1fr);}
@media (max-width:900px){
	.dm-grid-2,.dm-grid-3,.dm-grid-4{grid-template-columns:1fr;}
}

.dm-card{display:block;}
.dm-card-thumb{position:relative;overflow:hidden;margin-bottom:10px;}
.dm-card-cat{position:absolute;top:10px;left:10px;background:var(--color-accent);color:#fff;font-size:11px;font-weight:700;text-transform:uppercase;padding:3px 8px;}
.dm-card-title{font-size:16px;font-weight:700;margin:0 0 6px;line-height:1.3;}
.dm-card-meta{font-size:12px;color:var(--color-muted);font-style:italic;}
.dm-card-excerpt{font-size:13px;color:#555;margin-top:6px;}

.dm-list-item{display:flex;gap:12px;padding:10px 0;border-bottom:1px solid var(--color-border);}
.dm-list-item img{width:64px;height:64px;object-fit:cover;flex-shrink:0;}
.dm-list-item .dm-card-title{font-size:14px;margin-bottom:4px;}

/* =========================================================
   5. STYLE A — "Pulses Pro" feel (serif, purple band)
========================================================= */
body.dm-style-a .dm-section-title{border-color:var(--color-accent);}
.dm-style-a .dm-band{background:var(--color-accent);color:#fff;padding:26px 0;margin:36px 0;}
.dm-style-a .dm-band h2{margin:0 0 6px;font-size:26px;}
.dm-style-a .dm-band p{margin:0;opacity:.85;}

/* =========================================================
   6. STYLE B — "Urban Observer" feel (bold caption boxes, red accent)
========================================================= */
body.dm-style-b .dm-section-title{border-color:var(--color-accent-b);}
.dm-style-b .dm-card-caption{position:absolute;bottom:10px;left:10px;right:10px;background:rgba(255,255,255,.92);}
.dm-style-b .dm-card-caption .dm-card-title{padding:8px 10px;margin:0;}
.dm-style-b .dm-card-cat{background:var(--color-accent-b);}
.dm-style-b .dm-top5{background:var(--color-accent-b);color:#fff;padding:10px 16px;font-weight:700;text-transform:uppercase;}
.dm-style-b .dm-rank{display:flex;gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid var(--color-border);}
.dm-style-b .dm-rank-num{font-size:20px;font-weight:800;color:var(--color-accent-b);width:26px;}

/* =========================================================
   7. WIDGET AREAS / SIDEBAR
========================================================= */
.widget{margin-bottom:30px;}
.widget-title{font-size:15px;font-weight:700;text-transform:uppercase;border-bottom:2px solid var(--color-border);padding-bottom:8px;margin-bottom:12px;}
.widget ul li{padding:6px 0;border-bottom:1px solid var(--color-border);font-size:13px;}

/* =========================================================
   8. FOOTER (dark, 4 columns — editable widget areas)
========================================================= */
.dm-footer{background:#111;color:#ccc;padding:40px 0 20px;margin-top:50px;}
.dm-footer-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;}
.dm-footer .widget-title{color:#fff;border-color:#333;}
.dm-footer a{color:#ccc;}
.dm-footer a:hover{color:#fff;}
.dm-footer-bottom{border-top:1px solid #333;margin-top:24px;padding-top:16px;text-align:center;font-size:12px;color:#888;}
@media (max-width:900px){.dm-footer-grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:600px){.dm-footer-grid{grid-template-columns:1fr;}}

/* =========================================================
   9. SINGLE / PAGE / ARCHIVE DEFAULTS
========================================================= */
.dm-content-wrap{display:grid;grid-template-columns:2.4fr 1fr;gap:40px;margin:36px 0;}
@media (max-width:900px){.dm-content-wrap{grid-template-columns:1fr;}}
.entry-title{font-size:2em;margin:0 0 10px;}
.entry-meta{color:var(--color-muted);font-size:13px;margin-bottom:20px;}
.entry-content > *{margin-bottom:1.2em;}
.pagination{display:flex;gap:8px;margin:30px 0;}
.pagination a,.pagination span{border:1px solid var(--color-border);padding:6px 12px;font-size:13px;}

/* Flexible "add your own section" areas */
.dm-extra-section{margin:36px 0;}
.dm-extra-widget img{width:100%;}

/* Elementor full-width pages: hide default page padding if edited with Elementor */
.dm-elementor-fullwidth .dm-content-wrap{display:block;}