/*
Theme Name: Socrates Marketing Theme
Theme URI: https://yoursite.com/socrates-theme
Author: Your Name
Author URI: https://yoursite.com
Description: A powerful, SEO-friendly WordPress theme built by marketers for marketers. Features include custom headers, banner widgets, WooCommerce compatibility, BBPress support, landing page templates, masonry layouts, member area templates, Google Fonts integration, built-in monetization, custom widget visibility, and full Customizer control. Compatible with any page builder plugin.
Version: 1.0.0
Requires at least: 5.8
Tested up to: 6.5
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: socrates-theme
Tags: blog, marketing, two-columns, right-sidebar, custom-header, custom-background, custom-menu, featured-images, footer-widgets, full-width-template, sticky-post, theme-options, threaded-comments, translation-ready, woocommerce, e-commerce

This theme, like WordPress, is licensed under the GPL.
*/

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

:root {
	/* Primary Palette */
	--color-primary:        #1a6fc4;
	--color-primary-dark:   #145aa0;
	--color-primary-light:  #e8f1fb;
	--color-secondary:      #f0a500;
	--color-accent:         #e84c3d;

	/* Neutrals */
	--color-bg:             #f5f6f8;
	--color-surface:        #ffffff;
	--color-border:         #e2e6ea;
	--color-text:           #1c2b3a;
	--color-text-muted:     #6b7a8d;
	--color-text-light:     #9aa5b4;

	/* Header */
	--header-bg:            #1a6fc4;
	--header-text:          #ffffff;

	/* Nav */
	--nav-bg:               #1a6fc4;
	--nav-text:             #ffffff;
	--nav-hover:            #145aa0;

	/* Footer */
	--footer-bg:            #1c2b3a;
	--footer-text:          #c8d3e0;

	/* Typography */
	--font-heading:         'Merriweather', Georgia, serif;
	--font-body:            'Source Sans Pro', Arial, sans-serif;
	--font-mono:            'Courier New', monospace;
	--font-size-base:       16px;
	--line-height-body:     1.7;

	/* Spacing */
	--spacing-xs:    4px;
	--spacing-sm:    8px;
	--spacing-md:    16px;
	--spacing-lg:    24px;
	--spacing-xl:    40px;
	--spacing-xxl:   64px;

	/* Layout */
	--container-width:      1200px;
	--sidebar-width:        300px;
	--content-width:        860px;
	--border-radius:        4px;
	--border-radius-lg:     8px;
	--box-shadow:           0 2px 8px rgba(0,0,0,0.08);
	--box-shadow-hover:     0 4px 20px rgba(0,0,0,0.14);
	--transition:           0.2s ease;
}

/* Boxed layout override */
body.layout-boxed .site-wrapper {
	max-width: var(--container-width);
	margin: 0 auto;
	box-shadow: 0 0 40px rgba(0,0,0,0.12);
}

body {
	font-family: var(--font-body);
	font-size: var(--font-size-base);
	line-height: var(--line-height-body);
	color: var(--color-text);
	background-color: var(--color-bg);
}

img { max-width: 100%; height: auto; display: block; }
a { color: var(--color-primary); text-decoration: none; transition: color var(--transition); }
a:hover { color: var(--color-primary-dark); text-decoration: underline; }
ul, ol { padding-left: 1.5em; }
p { margin-bottom: var(--spacing-md); }
h1,h2,h3,h4,h5,h6 {
	font-family: var(--font-heading);
	line-height: 1.3;
	margin-bottom: var(--spacing-sm);
	color: var(--color-text);
}
h1 { font-size: 2.2rem; }
h2 { font-size: 1.75rem; }
h3 { font-size: 1.4rem; }
h4 { font-size: 1.15rem; }

/* =============================================================
   UTILITY
============================================================= */
.container {
	max-width: var(--container-width);
	margin-left: auto;
	margin-right: auto;
	padding-left: var(--spacing-lg);
	padding-right: var(--spacing-lg);
}
.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
.clearfix::after { content:''; display:table; clear:both; }
.text-center { text-align: center; }
.btn {
	display: inline-block;
	padding: 10px 22px;
	border-radius: var(--border-radius);
	font-weight: 600;
	font-size: 0.95rem;
	cursor: pointer;
	transition: background var(--transition), color var(--transition), box-shadow var(--transition);
	border: 2px solid transparent;
	text-decoration: none;
}
.btn-primary { background: var(--color-primary); color: #fff; border-color: var(--color-primary); }
.btn-primary:hover { background: var(--color-primary-dark); color: #fff; border-color: var(--color-primary-dark); text-decoration: none; }
.btn-secondary { background: var(--color-secondary); color: #fff; border-color: var(--color-secondary); }
.btn-secondary:hover { background: #d8900a; color: #fff; border-color: #d8900a; text-decoration: none; }
.btn-outline { background: transparent; color: var(--color-primary); border-color: var(--color-primary); }
.btn-outline:hover { background: var(--color-primary); color: #fff; text-decoration: none; }

/* =============================================================
   SKIP LINK
============================================================= */
.skip-link {
	position: absolute;
	top: -999px;
	left: 0;
	padding: 8px 16px;
	background: var(--color-primary);
	color: #fff;
	z-index: 9999;
	font-size: 0.875rem;
}
.skip-link:focus { top: 0; }

/* =============================================================
   TOP BANNER WIDGET
============================================================= */
.top-banner-widget {
	width: 100%;
	background: var(--color-surface);
	border-bottom: 1px solid var(--color-border);
}
.top-banner-widget .widget-inner {
	text-align: center;
	padding: var(--spacing-sm) var(--spacing-lg);
}
.top-banner-widget img { display: inline-block; max-height: 120px; }

/* =============================================================
   SITE HEADER
============================================================= */
.site-header {
	background: var(--header-bg);
	color: var(--header-text);
	padding: var(--spacing-lg) 0;
	position: relative;
}
.site-header .container {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: var(--spacing-md);
}
.site-branding { display: flex; flex-direction: column; }
.site-title {
	font-family: var(--font-heading);
	font-size: 1.9rem;
	font-weight: 700;
	color: #fff;
	margin: 0;
}
.site-title a { color: #fff; text-decoration: none; }
.site-title a:hover { opacity: 0.85; text-decoration: none; }
.site-description {
	color: rgba(255,255,255,0.75);
	font-size: 0.9rem;
	margin: 0;
}
.header-image-wrap img {
	max-height: 100px;
	border-radius: var(--border-radius);
}
.header-right-widget { color: #fff; font-size: 0.9rem; }

/* =============================================================
   NAVIGATION
============================================================= */
.main-navigation {
	background: var(--nav-bg);
	box-shadow: 0 2px 6px rgba(0,0,0,0.1);
	position: relative;
	z-index: 100;
}
.main-navigation .container { position: relative; }

/* Primary menu */
.main-navigation ul { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; }
.main-navigation > div > ul > li { position: relative; }
.main-navigation > div > ul > li > a {
	display: block;
	padding: 14px 16px;
	color: var(--nav-text);
	font-size: 0.93rem;
	font-weight: 600;
	white-space: nowrap;
	transition: background var(--transition);
}
.main-navigation > div > ul > li > a:hover,
.main-navigation > div > ul > li.current-menu-item > a { background: var(--nav-hover); text-decoration: none; }

/* Dropdowns */
.main-navigation ul ul {
	position: absolute;
	top: 100%;
	left: 0;
	background: var(--nav-hover);
	min-width: 200px;
	display: none;
	flex-direction: column;
	z-index: 200;
	box-shadow: var(--box-shadow);
}
.main-navigation ul li:hover > ul { display: flex; }
.main-navigation ul ul li a {
	display: block;
	padding: 10px 16px;
	color: #fff;
	font-size: 0.88rem;
	border-bottom: 1px solid rgba(255,255,255,0.1);
	transition: background var(--transition);
}
.main-navigation ul ul li a:hover { background: rgba(0,0,0,0.2); text-decoration: none; }

/* Mobile toggle */
.menu-toggle {
	display: none;
	background: transparent;
	border: 2px solid rgba(255,255,255,0.6);
	color: #fff;
	padding: 6px 14px;
	cursor: pointer;
	font-size: 1rem;
	border-radius: var(--border-radius);
	margin: 8px 0;
}
.menu-toggle:hover { border-color: #fff; }

/* Secondary navbars */
.secondary-nav {
	background: rgba(0,0,0,0.1);
	font-size: 0.82rem;
}
.secondary-nav .container { display: flex; justify-content: flex-end; }
.secondary-nav ul { list-style: none; padding: 0; margin: 0; display: flex; }
.secondary-nav ul li a {
	display: block;
	padding: 6px 12px;
	color: rgba(255,255,255,0.8);
}
.secondary-nav ul li a:hover { color: #fff; text-decoration: none; }

/* =============================================================
   AD BAR / IN-POST ADS
============================================================= */
.ad-bar {
	background: var(--color-surface);
	border-bottom: 1px solid var(--color-border);
	padding: var(--spacing-sm) 0;
	text-align: center;
}
.ad-bar .ad-bar-inner { display: inline-block; }

.in-post-ad {
	margin: var(--spacing-lg) 0;
	text-align: center;
	background: var(--color-bg);
	padding: var(--spacing-md);
	border: 1px dashed var(--color-border);
	border-radius: var(--border-radius);
}
.in-post-ad.ad-top { margin-top: 0; }
.in-post-ad.ad-bottom { margin-bottom: 0; }

/* =============================================================
   LAYOUT WRAPPERS
============================================================= */
.site-content {
	padding: var(--spacing-xl) 0;
}
.content-area-wrap {
	display: flex;
	gap: var(--spacing-xl);
	align-items: flex-start;
}

/* Sidebar layouts */
.content-area-wrap.sidebar-right .content-area { flex: 1 1 var(--content-width); min-width: 0; }
.content-area-wrap.sidebar-right .widget-area { flex: 0 0 var(--sidebar-width); }
.content-area-wrap.sidebar-left { flex-direction: row-reverse; }
.content-area-wrap.sidebar-left .content-area { flex: 1 1 var(--content-width); min-width: 0; }
.content-area-wrap.sidebar-left .widget-area { flex: 0 0 var(--sidebar-width); }
.content-area-wrap.no-sidebar .content-area { flex: 1 1 100%; }

/* Full-width template */
.page-template-template-full-width .content-area-wrap,
.page-template-template-landing .content-area-wrap,
.page-template-template-plain-white .content-area-wrap { display: block; }
.page-template-template-full-width .widget-area,
.page-template-template-landing .widget-area { display: none; }

/* Wide layout columns */
.wide-layout-3col .posts-grid { grid-template-columns: repeat(3, 1fr); }
.wide-layout-4col .posts-grid { grid-template-columns: repeat(4, 1fr); }
.wide-layout-5col .posts-grid { grid-template-columns: repeat(5, 1fr); }

/* =============================================================
   POSTS GRID (Standard Blog)
============================================================= */
.posts-list .post-card { margin-bottom: var(--spacing-xl); }

/* =============================================================
   POST CARD
============================================================= */
.post-card {
	background: var(--color-surface);
	border-radius: var(--border-radius-lg);
	overflow: hidden;
	box-shadow: var(--box-shadow);
	transition: box-shadow var(--transition), transform var(--transition);
}
.post-card:hover { box-shadow: var(--box-shadow-hover); transform: translateY(-2px); }
.post-card .card-thumb { position: relative; overflow: hidden; }
.post-card .card-thumb img { width: 100%; height: 220px; object-fit: cover; transition: transform 0.4s ease; }
.post-card:hover .card-thumb img { transform: scale(1.04); }
.post-card .card-body { padding: var(--spacing-lg); }
.post-card .card-meta {
	font-size: 0.8rem;
	color: var(--color-text-muted);
	margin-bottom: var(--spacing-sm);
	display: flex;
	gap: var(--spacing-md);
	flex-wrap: wrap;
}
.post-card .card-meta a { color: var(--color-text-muted); }
.post-card .card-meta a:hover { color: var(--color-primary); }
.post-card .card-title { font-size: 1.15rem; margin-bottom: var(--spacing-sm); }
.post-card .card-title a { color: var(--color-text); }
.post-card .card-title a:hover { color: var(--color-primary); text-decoration: none; }
.post-card .card-excerpt { font-size: 0.93rem; color: var(--color-text-muted); margin-bottom: var(--spacing-md); }
.post-card .card-footer {
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: 0.82rem;
	color: var(--color-text-muted);
	padding-top: var(--spacing-sm);
	border-top: 1px solid var(--color-border);
}
.post-card .read-more { font-size: 0.85rem; font-weight: 600; }
.cat-badge {
	display: inline-block;
	padding: 2px 8px;
	background: var(--color-primary-light);
	color: var(--color-primary);
	border-radius: 20px;
	font-size: 0.72rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	margin-bottom: var(--spacing-sm);
}

/* =============================================================
   MASONRY LAYOUT
============================================================= */
.posts-masonry {
	columns: 3;
	column-gap: var(--spacing-lg);
}
.posts-masonry.masonry-2col { columns: 2; }
.posts-masonry .post-card {
	break-inside: avoid;
	margin-bottom: var(--spacing-lg);
}

/* =============================================================
   POSTS GRID LAYOUT
============================================================= */
.posts-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--spacing-lg);
}

/* =============================================================
   SINGLE POST / PAGE
============================================================= */
.single-post-header { margin-bottom: var(--spacing-xl); }
.single-post-header .post-title { font-size: 2rem; margin-bottom: var(--spacing-md); }
.post-meta {
	font-size: 0.85rem;
	color: var(--color-text-muted);
	display: flex;
	gap: var(--spacing-lg);
	flex-wrap: wrap;
	margin-bottom: var(--spacing-lg);
}
.post-meta a { color: var(--color-text-muted); }
.post-meta a:hover { color: var(--color-primary); }
.post-featured-image {
	margin-bottom: var(--spacing-xl);
	border-radius: var(--border-radius-lg);
	overflow: hidden;
}
.post-featured-image img { width: 100%; max-height: 450px; object-fit: cover; }

.entry-content { font-size: 1.02rem; line-height: var(--line-height-body); }
.entry-content h2,
.entry-content h3,
.entry-content h4 { margin-top: var(--spacing-xl); margin-bottom: var(--spacing-md); }
.entry-content ul,
.entry-content ol { margin-bottom: var(--spacing-md); }
.entry-content blockquote {
	border-left: 4px solid var(--color-primary);
	padding: var(--spacing-md) var(--spacing-lg);
	margin: var(--spacing-xl) 0;
	background: var(--color-primary-light);
	border-radius: 0 var(--border-radius) var(--border-radius) 0;
	font-style: italic;
}
.entry-content code {
	background: #f0f4f8;
	padding: 2px 6px;
	border-radius: 3px;
	font-family: var(--font-mono);
	font-size: 0.88em;
}
.entry-content pre {
	background: #1c2b3a;
	color: #c8d3e0;
	padding: var(--spacing-lg);
	border-radius: var(--border-radius);
	overflow-x: auto;
	margin-bottom: var(--spacing-md);
}
.entry-content pre code { background: none; color: inherit; }
.entry-content table { width: 100%; border-collapse: collapse; margin-bottom: var(--spacing-md); }
.entry-content table th,
.entry-content table td { border: 1px solid var(--color-border); padding: 8px 12px; }
.entry-content table th { background: var(--color-bg); font-weight: 700; }

.post-tags { margin-top: var(--spacing-xl); font-size: 0.88rem; }
.post-tags a {
	display: inline-block;
	padding: 3px 10px;
	margin: 2px;
	background: var(--color-bg);
	border: 1px solid var(--color-border);
	border-radius: 20px;
	color: var(--color-text-muted);
	font-size: 0.82rem;
}
.post-tags a:hover { background: var(--color-primary-light); color: var(--color-primary); text-decoration: none; }

.post-share {
	margin-top: var(--spacing-xl);
	padding: var(--spacing-lg);
	background: var(--color-bg);
	border-radius: var(--border-radius-lg);
}
.post-share h4 { margin-bottom: var(--spacing-md); font-size: 0.95rem; }
.share-buttons { display: flex; gap: var(--spacing-sm); flex-wrap: wrap; }
.share-btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 7px 14px;
	border-radius: var(--border-radius);
	font-size: 0.82rem;
	font-weight: 600;
	color: #fff;
	cursor: pointer;
	border: none;
}
.share-btn.facebook { background: #1877f2; }
.share-btn.twitter  { background: #1da1f2; }
.share-btn.linkedin { background: #0a66c2; }
.share-btn.pinterest { background: #e60023; }
.share-btn:hover { opacity: 0.88; }

/* Author Box */
.author-box {
	display: flex;
	gap: var(--spacing-lg);
	align-items: flex-start;
	background: var(--color-surface);
	padding: var(--spacing-xl);
	border-radius: var(--border-radius-lg);
	box-shadow: var(--box-shadow);
	margin-top: var(--spacing-xl);
}
.author-box .author-avatar img { width: 80px; height: 80px; border-radius: 50%; object-fit: cover; }
.author-box .author-name { font-size: 1rem; font-weight: 700; margin-bottom: var(--spacing-xs); }
.author-box .author-bio { font-size: 0.9rem; color: var(--color-text-muted); }

/* Post Navigation */
.post-navigation {
	display: flex;
	justify-content: space-between;
	gap: var(--spacing-lg);
	margin-top: var(--spacing-xl);
}
.post-nav-link {
	flex: 1;
	padding: var(--spacing-md);
	background: var(--color-surface);
	border: 1px solid var(--color-border);
	border-radius: var(--border-radius-lg);
	font-size: 0.88rem;
}
.post-nav-link.next { text-align: right; }
.post-nav-label { font-size: 0.75rem; color: var(--color-text-muted); text-transform: uppercase; letter-spacing: 0.06em; margin-bottom: 4px; }
.post-nav-title { font-weight: 700; color: var(--color-text); }

/* Related posts */
.related-posts { margin-top: var(--spacing-xl); }
.related-posts h3 { margin-bottom: var(--spacing-lg); font-size: 1.2rem; }
.related-posts .posts-grid { grid-template-columns: repeat(3, 1fr); }

/* =============================================================
   COMMENTS
============================================================= */
.comments-section {
	margin-top: var(--spacing-xl);
	padding-top: var(--spacing-xl);
	border-top: 2px solid var(--color-border);
}
.comments-title { font-size: 1.3rem; margin-bottom: var(--spacing-xl); }
.comment-list { list-style: none; padding: 0; }
.comment {
	display: flex;
	gap: var(--spacing-md);
	margin-bottom: var(--spacing-xl);
	padding-bottom: var(--spacing-xl);
	border-bottom: 1px solid var(--color-border);
}
.comment-avatar img { width: 50px; height: 50px; border-radius: 50%; }
.comment-body { flex: 1; }
.comment-author { font-weight: 700; font-size: 0.93rem; }
.comment-date { font-size: 0.78rem; color: var(--color-text-muted); margin-bottom: var(--spacing-sm); }
.comment-text { font-size: 0.93rem; }
.comment-reply-link { font-size: 0.8rem; font-weight: 600; color: var(--color-primary); }

.comment-form h3 { margin-bottom: var(--spacing-lg); font-size: 1.2rem; }
.comment-form .form-row { display: flex; gap: var(--spacing-md); margin-bottom: var(--spacing-md); }
.comment-form .form-field { flex: 1; display: flex; flex-direction: column; }
.comment-form label { font-size: 0.85rem; font-weight: 600; margin-bottom: 4px; }
.comment-form input,
.comment-form textarea {
	padding: 9px 12px;
	border: 1px solid var(--color-border);
	border-radius: var(--border-radius);
	font-family: var(--font-body);
	font-size: 0.93rem;
	color: var(--color-text);
	background: var(--color-surface);
	transition: border-color var(--transition);
	width: 100%;
}
.comment-form input:focus,
.comment-form textarea:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px var(--color-primary-light); }
.comment-form textarea { min-height: 140px; resize: vertical; }

/* =============================================================
   SIDEBAR / WIDGETS
============================================================= */
.widget-area { min-width: 0; }
.widget {
	background: var(--color-surface);
	border-radius: var(--border-radius-lg);
	padding: var(--spacing-lg);
	box-shadow: var(--box-shadow);
	margin-bottom: var(--spacing-xl);
}
.widget-title {
	font-size: 0.95rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--color-text);
	margin-bottom: var(--spacing-lg);
	padding-bottom: var(--spacing-sm);
	border-bottom: 2px solid var(--color-primary);
}

/* Widget - Recent Posts */
.widget_recent_entries ul { list-style: none; padding: 0; }
.widget_recent_entries li { padding: var(--spacing-sm) 0; border-bottom: 1px solid var(--color-border); font-size: 0.88rem; }
.widget_recent_entries li:last-child { border-bottom: none; }
.widget_recent_entries .post-date { font-size: 0.75rem; color: var(--color-text-muted); display: block; }

/* Widget - Categories */
.widget_categories ul { list-style: none; padding: 0; }
.widget_categories li { padding: 5px 0; font-size: 0.88rem; display: flex; justify-content: space-between; border-bottom: 1px solid var(--color-border); }
.widget_categories li:last-child { border-bottom: none; }
.widget_categories li a { color: var(--color-text-muted); }
.widget_categories li a:hover { color: var(--color-primary); text-decoration: none; }

/* Widget - Search */
.widget_search .search-form { display: flex; }
.widget_search .search-field {
	flex: 1;
	padding: 8px 12px;
	border: 1px solid var(--color-border);
	border-right: none;
	border-radius: var(--border-radius) 0 0 var(--border-radius);
	font-size: 0.9rem;
}
.widget_search .search-submit {
	padding: 8px 14px;
	background: var(--color-primary);
	color: #fff;
	border: none;
	border-radius: 0 var(--border-radius) var(--border-radius) 0;
	cursor: pointer;
	font-size: 0.9rem;
}

/* Widget - CTA */
.widget-cta {
	background: linear-gradient(135deg, var(--color-primary), var(--color-primary-dark));
	color: #fff;
	border-radius: var(--border-radius-lg);
	padding: var(--spacing-xl);
	text-align: center;
	margin-bottom: var(--spacing-xl);
}
.widget-cta .widget-title { color: #fff; border-color: rgba(255,255,255,0.4); }
.widget-cta p { color: rgba(255,255,255,0.85); font-size: 0.9rem; }
.widget-cta .btn-cta {
	display: inline-block;
	padding: 10px 24px;
	background: var(--color-secondary);
	color: #fff;
	border-radius: var(--border-radius);
	font-weight: 700;
	margin-top: var(--spacing-md);
	text-decoration: none;
}
.widget-cta .btn-cta:hover { background: #d8900a; text-decoration: none; }

/* Widget - Ad Banner in sidebar */
.widget-ad-banner { text-align: center; padding: var(--spacing-md); }
.widget-ad-banner img { max-width: 100%; }

/* Widget visibility indicator (admin only) */
.widget-visibility-info {
	font-size: 0.7rem;
	color: var(--color-text-light);
	margin-top: var(--spacing-sm);
	font-style: italic;
}

/* =============================================================
   PAGINATION
============================================================= */
.pagination {
	display: flex;
	gap: var(--spacing-xs);
	justify-content: center;
	align-items: center;
	margin-top: var(--spacing-xl);
	flex-wrap: wrap;
}
.pagination a,
.pagination span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: var(--border-radius);
	border: 1px solid var(--color-border);
	font-size: 0.88rem;
	color: var(--color-text);
	background: var(--color-surface);
	transition: all var(--transition);
}
.pagination a:hover { background: var(--color-primary); color: #fff; border-color: var(--color-primary); text-decoration: none; }
.pagination .current { background: var(--color-primary); color: #fff; border-color: var(--color-primary); }
.pagination .prev, .pagination .next { width: auto; padding: 0 14px; }

/* =============================================================
   TEMPLATES
============================================================= */

/* Landing Page */
.page-template-template-landing .site-header,
.page-template-template-landing .main-navigation,
.page-template-template-landing .site-footer { /* Show by default, JS can hide if enabled */ }

.page-template-template-landing .entry-content {
	max-width: 800px;
	margin: 0 auto;
}

/* Member Area */
.page-template-template-member .member-welcome {
	background: linear-gradient(135deg, var(--color-primary-light), #fff);
	padding: var(--spacing-xl);
	border-radius: var(--border-radius-lg);
	margin-bottom: var(--spacing-xl);
	border-left: 4px solid var(--color-primary);
}
.member-resources-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--spacing-lg);
}
.member-resource-card {
	background: var(--color-surface);
	padding: var(--spacing-lg);
	border-radius: var(--border-radius-lg);
	box-shadow: var(--box-shadow);
	text-align: center;
}
.member-resource-card .resource-icon { font-size: 2.5rem; margin-bottom: var(--spacing-md); }
.member-resource-card h3 { font-size: 1rem; margin-bottom: var(--spacing-sm); }

/* Plain White */
.page-template-template-plain-white .site-content { padding: var(--spacing-xxl) 0; }
.page-template-template-plain-white .entry-content { max-width: 700px; margin: 0 auto; }

/* Sections Template */
.page-template-template-sections .entry-content { max-width: 100%; padding: 0; }
.section-block {
	padding: var(--spacing-xxl) 0;
}
.section-block.section-alt { background: var(--color-bg); }
.section-block.section-primary { background: var(--color-primary); color: #fff; }
.section-block.section-dark { background: var(--color-footer-bg, #1c2b3a); color: #fff; }
.section-block .container { max-width: var(--container-width); margin: 0 auto; padding: 0 var(--spacing-lg); }
.section-block h2 { margin-bottom: var(--spacing-md); }
.section-block.section-primary h2, .section-block.section-dark h2 { color: #fff; }

/* =============================================================
   BOTTOM BANNER WIDGET
============================================================= */
.bottom-banner-widget {
	width: 100%;
	background: var(--color-surface);
	border-top: 1px solid var(--color-border);
}
.bottom-banner-widget .widget-inner {
	text-align: center;
	padding: var(--spacing-sm) var(--spacing-lg);
}
.bottom-banner-widget img { display: inline-block; max-height: 120px; }

/* =============================================================
   FOOTER
============================================================= */
.site-footer {
	background: var(--footer-bg);
	color: var(--footer-text);
	padding-top: var(--spacing-xxl);
}
.footer-widgets {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: var(--spacing-xl);
	padding-bottom: var(--spacing-xl);
	border-bottom: 1px solid rgba(255,255,255,0.1);
}
.footer-widget .widget-title { color: #fff; border-bottom-color: var(--color-primary); }
.footer-widget a { color: var(--footer-text); }
.footer-widget a:hover { color: #fff; text-decoration: none; }
.footer-widget ul { list-style: none; padding: 0; }
.footer-widget ul li { padding: 4px 0; font-size: 0.88rem; border-bottom: 1px solid rgba(255,255,255,0.06); }
.footer-widget ul li:last-child { border-bottom: none; }

.footer-bottom {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: var(--spacing-md);
	padding: var(--spacing-lg) 0;
	font-size: 0.83rem;
	color: rgba(255,255,255,0.5);
}
.footer-bottom a { color: rgba(255,255,255,0.6); }
.footer-bottom a:hover { color: #fff; text-decoration: none; }

.footer-social { display: flex; gap: var(--spacing-sm); }
.footer-social a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px; height: 34px;
	border-radius: 50%;
	background: rgba(255,255,255,0.1);
	color: #fff;
	font-size: 0.85rem;
	transition: background var(--transition);
	text-decoration: none;
}
.footer-social a:hover { background: var(--color-primary); text-decoration: none; }

/* Affiliate link */
.footer-affiliate { font-size: 0.8rem; color: rgba(255,255,255,0.4); text-align: center; padding-bottom: var(--spacing-md); }
.footer-affiliate a { color: rgba(255,255,255,0.5); }

/* =============================================================
   WOOCOMMERCE COMPATIBILITY
============================================================= */
.woocommerce .products {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--spacing-lg);
}
.woocommerce ul.products li.product {
	background: var(--color-surface);
	border-radius: var(--border-radius-lg);
	padding: var(--spacing-lg);
	box-shadow: var(--box-shadow);
	transition: box-shadow var(--transition);
}
.woocommerce ul.products li.product:hover { box-shadow: var(--box-shadow-hover); }
.woocommerce .button {
	background: var(--color-primary) !important;
	color: #fff !important;
	border-radius: var(--border-radius) !important;
	padding: 8px 18px !important;
	font-weight: 600 !important;
}
.woocommerce .button:hover { background: var(--color-primary-dark) !important; }
.woocommerce-page .entry-content { max-width: 100%; }

/* =============================================================
   BBPRESS
============================================================= */
.bbpress .bbp-header { background: var(--color-primary); color: #fff; padding: var(--spacing-md); border-radius: var(--border-radius) var(--border-radius) 0 0; }
.bbpress .bbp-body { border: 1px solid var(--color-border); border-top: none; }
.bbpress .bbp-forum-title a { color: var(--color-primary); }
.bbpress .bbp-forum-title a:hover { text-decoration: underline; }
#bbpress-forums .bbp-reply-content { font-size: 0.93rem; }

/* =============================================================
   GOOGLE AMP COMPATIBILITY
============================================================= */
.amp-wp-article { max-width: 780px; margin: 0 auto; }
.amp-wp-article-header { margin-bottom: var(--spacing-xl); }
.amp-wp-article-featured-image { margin-bottom: var(--spacing-xl); }

/* =============================================================
   SEARCH RESULTS
============================================================= */
.search-results .posts-list .post-card { display: flex; gap: var(--spacing-lg); }
.search-results .post-card .card-thumb { flex: 0 0 200px; }
.search-results .post-card .card-thumb img { height: 140px; }
.search-results .post-card .card-body { flex: 1; }

/* =============================================================
   404 PAGE
============================================================= */
.error-404 { text-align: center; padding: var(--spacing-xxl); }
.error-404 .error-code { font-size: 8rem; font-weight: 900; color: var(--color-primary-light); line-height: 1; }
.error-404 h1 { font-size: 1.8rem; margin-bottom: var(--spacing-md); }
.error-404 p { color: var(--color-text-muted); }
.error-404 .search-form { max-width: 400px; margin: var(--spacing-xl) auto; display: flex; }

/* =============================================================
   RESPONSIVE
============================================================= */
@media (max-width: 1024px) {
	:root { --sidebar-width: 260px; }
	.footer-widgets { grid-template-columns: repeat(2, 1fr); }
	.posts-masonry { columns: 2; }
	.posts-grid { grid-template-columns: repeat(2, 1fr); }
	.wide-layout-5col .posts-grid { grid-template-columns: repeat(3, 1fr); }
	.wide-layout-4col .posts-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 768px) {
	.content-area-wrap { flex-direction: column !important; }
	.widget-area { width: 100%; }
	.menu-toggle { display: block; }
	.main-navigation > div > ul { display: none; flex-direction: column; width: 100%; }
	.main-navigation > div > ul.active { display: flex; }
	.main-navigation > div > ul > li > a { border-bottom: 1px solid rgba(255,255,255,0.1); }
	.main-navigation ul ul { position: static; box-shadow: none; min-width: 100%; background: rgba(0,0,0,0.2); }
	.posts-masonry { columns: 1; }
	.posts-grid { grid-template-columns: 1fr; }
	.wide-layout-3col .posts-grid,
	.wide-layout-4col .posts-grid,
	.wide-layout-5col .posts-grid { grid-template-columns: 1fr; }
	.footer-widgets { grid-template-columns: 1fr; }
	.member-resources-grid { grid-template-columns: 1fr; }
	.related-posts .posts-grid { grid-template-columns: 1fr; }
	.post-navigation { flex-direction: column; }
	h1 { font-size: 1.6rem; }
	h2 { font-size: 1.35rem; }
	.site-header .container { flex-direction: column; align-items: flex-start; }
	.footer-bottom { flex-direction: column; text-align: center; }
	.comment-form .form-row { flex-direction: column; }
}

@media (max-width: 480px) {
	:root {
		--spacing-xl: 24px;
		--spacing-xxl: 40px;
	}
	.container { padding-left: var(--spacing-md); padding-right: var(--spacing-md); }
	.error-404 .error-code { font-size: 5rem; }
}

/* =============================================================
   PRINT
============================================================= */
@media print {
	.main-navigation, .widget-area, .site-footer, .ad-bar,
	.top-banner-widget, .bottom-banner-widget, .in-post-ad,
	.post-share, .comments-section { display: none !important; }
	.content-area-wrap { display: block; }
	body { background: #fff; color: #000; }
}
