/*
Theme Name: AI Tool Mesh
Theme URI: https://aitoolmesh.com
Author: AI Tool Mesh
Author URI: https://aitoolmesh.com
Description: Ultra-fast, SEO-optimized dark WordPress theme for AI tool reviews. Zero external CSS frameworks. Pure performance.
Version: 2.0.0
Requires at least: 5.0
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: aitoolmesh
Tags: blog, dark, modern, seo, ai-tools, reviews, fast
*/

/* ===== FONTS - Self-hosted swap ===== */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuLyfAZ9hiA.woff2') format('woff2');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuI6fAZ9hiA.woff2') format('woff2');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuGKYAZ9hiA.woff2') format('woff2');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuFuYAZ9hiA.woff2') format('woff2');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url('https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuDuYAZ9hiA.woff2') format('woff2');
}

/* ===== RESET ===== */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:'Inter',system-ui,-apple-system,sans-serif;background:#09090b;color:#e4e4e7;line-height:1.6;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
ul,ol{list-style:none}
button{cursor:pointer;border:none;background:none;font:inherit;color:inherit}
input,textarea{font:inherit}

/* ===== SCROLLBAR ===== */
::-webkit-scrollbar{width:6px}
::-webkit-scrollbar-track{background:#09090b}
::-webkit-scrollbar-thumb{background:#27272a;border-radius:3px}
::selection{background:rgba(139,92,246,.3);color:#c4b5fd}

/* ===== UTILITY CLASSES ===== */
.container{max-width:1280px;margin:0 auto;padding:0 1.5rem}
.container-sm{max-width:896px;margin:0 auto;padding:0 1.5rem}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}

/* Colors */
.text-white{color:#fff}
.text-zinc-300{color:#d4d4d8}
.text-zinc-400{color:#a1a1aa}
.text-zinc-500{color:#71717a}
.text-zinc-600{color:#52525b}
.text-violet{color:#a78bfa}
.text-cyan{color:#67e8f9}
.text-yellow{color:#eab308}
.bg-zinc-900{background:#18181b}
.bg-zinc-950{background:#09090b}

/* ===== NAVBAR ===== */
.navbar{position:fixed;top:0;left:0;width:100%;z-index:100;padding:1.25rem 0;transition:background .3s,padding .3s,border .3s}
.navbar.scrolled{background:rgba(9,9,11,.85);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid #27272a;padding:.75rem 0}
.navbar-inner{display:flex;justify-content:space-between;align-items:center}
.logo{display:flex;align-items:center;gap:.5rem}
.logo-icon{width:32px;height:32px;background:linear-gradient(135deg,#7c3aed,#22d3ee);border-radius:8px;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:14px;transition:transform .3s}
.logo:hover .logo-icon{transform:rotate(12deg)}
.logo-text{font-size:1.25rem;font-weight:700;letter-spacing:-.025em;background:linear-gradient(to right,#fff,#a1a1aa);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}

.nav-links{display:none;align-items:center;gap:2rem}
.nav-link{font-size:.875rem;font-weight:500;color:#a1a1aa;transition:color .2s}
.nav-link:hover,.nav-link.active{color:#a78bfa}
.nav-cta{padding:.5rem 1rem;background:#27272a;color:#fff;font-size:.875rem;font-weight:500;border-radius:9999px;border:1px solid #3f3f46;transition:background .2s}
.nav-cta:hover{background:#3f3f46}

.mobile-toggle{display:block;color:#fff;padding:.25rem}

@media(min-width:768px){
  .nav-links{display:flex}
  .mobile-toggle{display:none}
}

/* Mobile Menu */
.mobile-menu{position:fixed;inset:0;background:rgba(9,9,11,.98);z-index:200;display:none;flex-direction:column;align-items:center;justify-content:center;gap:2rem}
.mobile-menu.open{display:flex}
.mobile-menu a{font-size:1.5rem;font-weight:500;color:#fff;transition:color .2s}
.mobile-menu a:hover{color:#a78bfa}
.mobile-close{position:absolute;top:1.5rem;right:1.5rem;color:#fff}

/* ===== HERO ===== */
.hero{padding:7rem 1.5rem 5rem;text-align:center;position:relative}
.hero::before{content:'';position:absolute;top:0;left:50%;transform:translateX(-50%);width:100%;height:500px;background:radial-gradient(ellipse at center top,rgba(124,58,237,.15),transparent 70%);pointer-events:none}
.hero-badge{display:inline-flex;align-items:center;gap:.5rem;padding:.25rem .75rem;border-radius:9999px;background:rgba(139,92,246,.1);border:1px solid rgba(139,92,246,.2);color:#a78bfa;font-size:.6875rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;margin-bottom:1.5rem}
.hero h1{font-size:clamp(2.5rem,6vw,4.5rem);font-weight:800;color:#fff;line-height:1.1;letter-spacing:-.03em;margin-bottom:1.5rem}
.hero h1 span{background:linear-gradient(to right,#a78bfa,#22d3ee);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.hero p{font-size:1.25rem;color:#a1a1aa;max-width:640px;margin:0 auto 2.5rem;line-height:1.7}
.hero-actions{display:flex;flex-direction:column;gap:1rem;justify-content:center;align-items:center}
.search-box{position:relative;width:100%;max-width:28rem}
.search-box svg{position:absolute;left:1rem;top:50%;transform:translateY(-50%);color:#71717a}
.search-box input{width:100%;background:#18181b;border:1px solid #27272a;border-radius:9999px;padding:1rem 1.5rem 1rem 3rem;color:#fff;font-size:1rem;outline:none;transition:border-color .2s,box-shadow .2s}
.search-box input:focus{border-color:rgba(139,92,246,.5);box-shadow:0 0 0 3px rgba(139,92,246,.1)}
.btn-primary{display:inline-flex;align-items:center;gap:.5rem;padding:1rem 2rem;background:#7c3aed;color:#fff;font-weight:700;border-radius:9999px;transition:background .2s;font-size:1rem}
.btn-primary:hover{background:#6d28d9}
@media(min-width:640px){.hero-actions{flex-direction:row}}

/* ===== SECTIONS ===== */
.section{padding:5rem 1.5rem}
.section-header{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:3rem;flex-wrap:wrap;gap:1rem}
.section-title{font-size:1.875rem;font-weight:700;color:#fff;margin-bottom:.5rem}
.section-subtitle{color:#71717a}
.section-link{color:#a78bfa;font-weight:500;display:inline-flex;align-items:center;gap:.25rem;transition:color .2s;font-size:.875rem}
.section-link:hover{color:#c4b5fd}
.section-title-row{display:flex;align-items:center;gap:1rem;margin-bottom:3rem}
.section-title-row h2{white-space:nowrap}
.section-divider{height:1px;flex:1;background:#27272a}

/* ===== CATEGORY GRID ===== */
.cat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.5rem}
@media(min-width:768px){.cat-grid{grid-template-columns:repeat(4,1fr)}}
.cat-card{padding:2rem;background:#18181b;border:1px solid #27272a;border-radius:1.5rem;transition:border-color .3s;display:block}
.cat-card:hover{border-color:rgba(139,92,246,.5)}
.cat-icon{width:48px;height:48px;background:#27272a;border-radius:1rem;display:flex;align-items:center;justify-content:center;color:#a78bfa;margin-bottom:1.5rem;transition:background .3s,color .3s}
.cat-card:hover .cat-icon{background:#7c3aed;color:#fff}
.cat-card h3{font-size:1.125rem;font-weight:700;color:#fff;transition:color .2s}
.cat-card:hover h3{color:#a78bfa}
.cat-card .count{color:#71717a;font-size:.875rem;margin-top:.25rem}

/* ===== POST CARDS (Grid) ===== */
.post-grid{display:grid;gap:2rem}
@media(min-width:768px){.post-grid{grid-template-columns:repeat(3,1fr)}}
.post-card{display:flex;flex-direction:column;background:#18181b;border-radius:1.5rem;overflow:hidden;border:1px solid #27272a;transition:border-color .3s}
.post-card:hover{border-color:#3f3f46}
.post-card-img{position:relative;height:14rem;overflow:hidden}
.post-card-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.post-card:hover .post-card-img img{transform:scale(1.05)}
.post-card-badge{position:absolute;top:1rem;left:1rem;padding:.25rem .75rem;background:#7c3aed;color:#fff;font-size:.625rem;font-weight:700;text-transform:uppercase;border-radius:9999px}
.post-card-body{padding:2rem;flex:1;display:flex;flex-direction:column}
.post-card-body h3{font-size:1.25rem;font-weight:700;color:#fff;margin-bottom:.75rem;transition:color .2s;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.post-card:hover .post-card-body h3{color:#a78bfa}
.post-card-body .excerpt{color:#71717a;font-size:.875rem;margin-bottom:1.5rem;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;line-height:1.6}
.post-card-footer{margin-top:auto;display:flex;justify-content:space-between;align-items:center;padding-top:1.5rem;border-top:1px solid #27272a}
.post-card-meta{color:#71717a;font-size:.75rem;display:flex;align-items:center;gap:.25rem}
.post-card-more{color:#a78bfa;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;transition:transform .2s}
.post-card:hover .post-card-more{transform:translateX(4px)}

/* ===== TRUST BANNER ===== */
.trust-banner{max-width:1024px;margin:0 auto;background:linear-gradient(to right,#7c3aed,#4f46e5);border-radius:2rem;padding:3rem;text-align:center;color:#fff;position:relative;overflow:hidden}
.trust-banner::after{content:'';position:absolute;top:0;right:0;width:16rem;height:16rem;background:rgba(255,255,255,.1);border-radius:50%;transform:translate(50%,-50%);filter:blur(60px)}
.trust-banner h2{font-size:1.875rem;font-weight:700;margin:.75rem 0 1rem}
.trust-banner p{font-size:1.125rem;color:rgba(237,233,254,.9);max-width:640px;margin:0 auto;line-height:1.7}

/* ===== SEO CONTENT ===== */
.seo-content h2{font-size:2rem;font-weight:800;color:#fff;margin-bottom:1rem;letter-spacing:-.02em}
.seo-content h3{font-size:1.5rem;font-weight:700;color:#fff;margin-top:3rem;margin-bottom:1rem}
.seo-content h4{font-size:1.125rem;font-weight:600;color:#a78bfa;margin-top:2rem;margin-bottom:.75rem}
.seo-content p{color:#a1a1aa;line-height:1.8;margin-bottom:1.5rem}
.seo-content strong{color:#fff}
.seo-content a{color:#a78bfa;text-decoration:underline;transition:color .2s}
.seo-content a:hover{color:#c4b5fd}
.seo-content em{color:#d4d4d8}
.seo-gradient{width:20rem;height:4px;background:linear-gradient(to right,#7c3aed,#22d3ee);border-radius:2px;margin-bottom:2rem}
.check-list{display:flex;flex-direction:column;gap:.75rem;margin-bottom:2rem}
.check-list li{display:flex;align-items:flex-start;gap:.75rem;color:#a1a1aa;line-height:1.7}
.check-list li svg{color:#a78bfa;margin-top:.25rem;flex-shrink:0}
.check-list li strong{color:#fff}

/* ===== FAQ ===== */
.faq-list{display:flex;flex-direction:column;gap:1rem}
.faq-item{background:#18181b;border:1px solid #27272a;border-radius:1rem;overflow:hidden;transition:border-color .3s}
.faq-item[open]{border-color:rgba(139,92,246,.3)}
.faq-item summary{display:flex;justify-content:space-between;align-items:center;cursor:pointer;padding:1.5rem;color:#fff;font-weight:600;transition:color .2s;list-style:none}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:hover{color:#a78bfa}
.faq-item summary svg{flex-shrink:0;margin-left:1rem;transition:transform .3s}
.faq-item[open] summary svg{transform:rotate(180deg)}
.faq-answer{padding:0 1.5rem 1.5rem;color:#a1a1aa;line-height:1.7}
.faq-answer strong{color:#fff}

/* ===== BLOG LIST (index.php) ===== */
.blog-header{display:flex;flex-direction:column;gap:1.5rem;margin-bottom:3rem}
@media(min-width:768px){.blog-header{flex-direction:row;justify-content:space-between;align-items:center}}
.blog-header h1{font-size:2rem;font-weight:700;color:#fff;letter-spacing:-.02em}
.blog-search{position:relative}
.blog-search svg{position:absolute;left:.75rem;top:50%;transform:translateY(-50%);color:#71717a}
.blog-search input{background:#18181b;border:1px solid #27272a;border-radius:.5rem;padding:.5rem 1rem .5rem 2.5rem;color:#fff;font-size:.875rem;outline:none;transition:border-color .2s}
.blog-search input:focus{border-color:rgba(139,92,246,.5)}
.filter-tags{display:flex;gap:1rem;overflow-x:auto;padding-bottom:1rem;margin-bottom:3rem;-ms-overflow-style:none;scrollbar-width:none}
.filter-tags::-webkit-scrollbar{display:none}
.filter-tag{padding:.5rem 1.25rem;white-space:nowrap;border-radius:9999px;font-size:.875rem;font-weight:500;border:1px solid #27272a;background:#18181b;color:#a1a1aa;transition:all .2s}
.filter-tag:hover{border-color:#3f3f46}
.filter-tag.active{background:#7c3aed;border-color:#7c3aed;color:#fff}

.blog-layout{display:grid;gap:3rem}
@media(min-width:1024px){.blog-layout{grid-template-columns:2fr 1fr}}

/* Post List Items */
.post-list-item{display:flex;flex-direction:column;gap:2rem}
@media(min-width:768px){.post-list-item{flex-direction:row}}
.post-list-img{width:100%;border-radius:1rem;overflow:hidden;position:relative;flex-shrink:0;aspect-ratio:16/11}
@media(min-width:768px){.post-list-img{width:16rem;aspect-ratio:auto;height:12rem}}
.post-list-img img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.post-list-item:hover .post-list-img img{transform:scale(1.03)}
.post-list-img .badge{position:absolute;bottom:.5rem;left:.5rem;padding:.25rem .5rem;background:rgba(0,0,0,.6);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:.25rem;font-size:.625rem;color:#fff;font-weight:700;text-transform:uppercase}
.post-list-meta{display:flex;align-items:center;gap:.75rem;color:#71717a;font-size:.75rem;margin-bottom:.75rem}
.post-list-meta .dot{width:4px;height:4px;background:#27272a;border-radius:50%}
.post-list-item h2{font-size:1.5rem;font-weight:700;color:#fff;margin-bottom:.75rem;transition:color .2s;line-height:1.3}
.post-list-item:hover h2{color:#a78bfa}
.post-list-item .excerpt{color:#71717a;font-size:.875rem;margin-bottom:1rem;line-height:1.6;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.author-badge{display:flex;align-items:center;gap:.5rem}
.author-avatar{width:24px;height:24px;background:#7c3aed;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;color:#fff;font-weight:700}
.author-name{color:#a1a1aa;font-size:.75rem;font-weight:500}

/* Sidebar */
.sidebar{display:flex;flex-direction:column;gap:2.5rem}
.sidebar-card{padding:2rem;background:#18181b;border-radius:1.5rem;border:1px solid #27272a}
.sidebar-card h3{font-size:1.25rem;font-weight:700;color:#fff;margin-bottom:1rem}
.sidebar-card p{color:#71717a;font-size:.875rem;margin-bottom:1.5rem;line-height:1.6}
.sidebar-card input[type="email"]{width:100%;background:#09090b;border:1px solid #27272a;border-radius:.75rem;padding:.75rem;color:#fff;font-size:.875rem;margin-bottom:.75rem;outline:none}
.sidebar-card input[type="email"]:focus{border-color:rgba(139,92,246,.5)}
.btn-subscribe{width:100%;padding:.75rem;background:#7c3aed;color:#fff;font-weight:700;border-radius:.75rem;transition:background .2s;font-size:.875rem}
.btn-subscribe:hover{background:#6d28d9}
.sidebar-card .tiny{font-size:.625rem;color:#52525b;text-align:center;margin-top:1rem;font-style:italic}
.sidebar-heading{font-size:1.125rem;font-weight:700;color:#fff;margin-bottom:1.5rem;display:flex;align-items:center;gap:.5rem}
.match-list{display:flex;flex-direction:column;gap:1rem}
.match-item{padding:1rem;background:rgba(24,24,27,.5);border:1px solid #27272a;border-radius:.75rem;display:flex;justify-content:space-between;align-items:center;transition:background .2s}
.match-item:hover{background:#18181b}
.match-item span{color:#d4d4d8;font-size:.875rem;font-weight:500}
.match-item svg{color:#52525b;transition:color .2s}
.match-item:hover svg{color:#a78bfa}

.tool-list{display:flex;flex-direction:column;gap:1.5rem}
.tool-row{display:flex;align-items:center;gap:1rem}
.tool-icon{width:40px;height:40px;background:#27272a;border-radius:.75rem;border:1px solid #3f3f46;display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:700;color:#d4d4d8;flex-shrink:0}
.tool-info{flex:1}
.tool-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:.25rem}
.tool-name{font-size:.875rem;font-weight:700;color:#fff}
.tool-rating{display:flex;align-items:center;gap:.25rem;color:#eab308}
.tool-rating span{font-size:.625rem;font-weight:700}
.tool-type{font-size:.625rem;color:#71717a;text-transform:uppercase;letter-spacing:.1em}

/* ===== SINGLE POST ===== */
.breadcrumbs{font-size:.875rem;color:#71717a;margin-bottom:2rem}
.breadcrumbs a{transition:color .2s}
.breadcrumbs a:hover{color:#a78bfa}
.breadcrumbs .sep{margin:0 .5rem}

.post-header .cat-badge{display:inline-block;padding:.25rem .75rem;background:rgba(139,92,246,.1);border:1px solid rgba(139,92,246,.2);color:#a78bfa;border-radius:9999px;font-size:.75rem;font-weight:600}
.post-header .meta-row{display:flex;align-items:center;gap:.75rem;color:#71717a;font-size:.75rem;margin-bottom:1rem}
.post-header h1{font-size:clamp(2rem,4vw,3rem);font-weight:800;color:#fff;line-height:1.15;letter-spacing:-.03em;margin-bottom:1.5rem}
.post-header .lead{font-size:1.25rem;color:#a1a1aa;margin-bottom:2rem;line-height:1.7}
.author-box-sm{display:flex;align-items:center;gap:.75rem;padding-bottom:2.5rem;margin-bottom:2.5rem;border-bottom:1px solid #27272a}
.author-box-sm .avatar{width:40px;height:40px;background:#7c3aed;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:.875rem;font-weight:700}

/* Post content prose */
.prose{color:#a1a1aa;font-size:1.0625rem;line-height:1.8}
.prose h2{font-size:1.75rem;font-weight:700;color:#fff;margin:2.5rem 0 1rem;letter-spacing:-.02em}
.prose h3{font-size:1.375rem;font-weight:600;color:#fff;margin:2rem 0 .75rem}
.prose p{margin-bottom:1.25rem}
.prose a{color:#a78bfa;text-decoration:underline}
.prose a:hover{color:#c4b5fd}
.prose strong{color:#fff}
.prose ul,.prose ol{margin:1rem 0 1.5rem 1.5rem}
.prose li{margin-bottom:.5rem}
.prose ol{list-style:decimal}
.prose ul{list-style:disc}
.prose blockquote{border-left:3px solid #7c3aed;padding-left:1.5rem;margin:1.5rem 0;color:#d4d4d8;font-style:italic}
.prose img{border-radius:1rem;margin:2rem 0}
.prose code{background:#27272a;padding:.125rem .375rem;border-radius:.25rem;font-size:.875em}
.prose pre{background:#18181b;border:1px solid #27272a;border-radius:.75rem;padding:1.5rem;overflow-x:auto;margin:1.5rem 0}

.featured-img{border-radius:1rem;overflow:hidden;margin-bottom:3rem}
.featured-img img{width:100%;height:auto}

.tags{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:3rem;padding-top:2rem;border-top:1px solid #27272a}
.tag{padding:.5rem 1rem;background:#18181b;border:1px solid #27272a;border-radius:9999px;font-size:.75rem;color:#a1a1aa;transition:all .2s}
.tag:hover{color:#a78bfa;border-color:rgba(139,92,246,.5)}

.author-box{margin-top:3rem;padding:2rem;background:#18181b;border:1px solid #27272a;border-radius:1.5rem;display:flex;flex-direction:column;gap:1.5rem}
@media(min-width:640px){.author-box{flex-direction:row}}
.author-box .avatar-lg{width:64px;height:64px;background:linear-gradient(135deg,#7c3aed,#22d3ee);border-radius:1rem;display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.25rem;font-weight:700;flex-shrink:0}
.author-box h3{font-size:1.125rem;font-weight:700;color:#fff;margin-bottom:.5rem}
.author-box p{color:#71717a;font-size:.875rem;line-height:1.6}

.related-posts{margin-top:4rem}
.related-posts h2{font-size:1.5rem;font-weight:700;color:#fff;margin-bottom:2rem}
.related-grid{display:grid;gap:1.5rem}
@media(min-width:768px){.related-grid{grid-template-columns:repeat(2,1fr)}}
.related-card{display:flex;flex-direction:column;background:#18181b;border:1px solid #27272a;border-radius:1rem;overflow:hidden;transition:border-color .3s}
.related-card:hover{border-color:#3f3f46}
.related-card-img{height:10rem;overflow:hidden}
.related-card-img img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.related-card:hover .related-card-img img{transform:scale(1.03)}
.related-card-body{padding:1.5rem}
.related-card-body h3{font-size:1.125rem;font-weight:700;color:#fff;transition:color .2s;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.related-card:hover .related-card-body h3{color:#a78bfa}
.related-card-body p{color:#71717a;font-size:.875rem;margin-top:.5rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* ===== PAGINATION ===== */
.pagination{display:flex;justify-content:center;gap:.5rem;margin-top:3rem}
.pagination a,.pagination span{padding:.5rem 1rem;border-radius:.5rem;font-size:.875rem;border:1px solid #27272a;color:#a1a1aa;transition:all .2s}
.pagination a:hover{border-color:#3f3f46;color:#fff}
.pagination .current{background:#7c3aed;border-color:#7c3aed;color:#fff}

/* ===== 404 ===== */
.page-404{text-align:center;padding:8rem 1.5rem}
.page-404 h1{font-size:6rem;font-weight:800;color:#27272a;line-height:1}
.page-404 h2{font-size:1.5rem;font-weight:700;color:#fff;margin:1rem 0}
.page-404 p{color:#71717a;margin-bottom:2rem}
.btn-home{display:inline-flex;padding:.75rem 1.5rem;background:#7c3aed;color:#fff;font-weight:600;border-radius:9999px;transition:background .2s}
.btn-home:hover{background:#6d28d9}

/* ===== FOOTER ===== */
.site-footer{border-top:1px solid #18181b;padding:5rem 1.5rem 3rem;margin-top:5rem}
.footer-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:3rem;margin-bottom:5rem}
@media(min-width:768px){.footer-grid{grid-template-columns:repeat(4,1fr)}}
@media(min-width:1024px){.footer-grid{grid-template-columns:2fr 1fr 1fr 1fr}}
.footer-brand{grid-column:span 2}
@media(min-width:768px){.footer-brand{grid-column:span 1}}
@media(min-width:1024px){.footer-brand{grid-column:span 1}}
.footer-brand p{color:#71717a;font-size:.875rem;max-width:280px;margin-bottom:1.5rem;line-height:1.6}
.social-links{display:flex;gap:1rem}
.social-link{width:32px;height:32px;border-radius:50%;background:#18181b;display:flex;align-items:center;justify-content:center;color:#a1a1aa;font-size:.75rem;transition:all .2s}
.social-link:hover{background:#27272a;color:#fff}
.footer-col h4{color:#fff;font-weight:700;margin-bottom:1.5rem;font-size:.875rem}
.footer-col ul{display:flex;flex-direction:column;gap:1rem}
.footer-col a{color:#71717a;font-size:.875rem;transition:color .2s}
.footer-col a:hover{color:#a78bfa}
.footer-bottom{padding-top:3rem;border-top:1px solid #18181b;display:flex;flex-direction:column;gap:1.5rem;align-items:center}
@media(min-width:768px){.footer-bottom{flex-direction:row;justify-content:space-between}}
.footer-bottom p{color:#52525b;font-size:.75rem}
.footer-legal{display:flex;gap:1.5rem}
.footer-legal a{color:#52525b;font-size:.75rem;transition:color .2s}
.footer-legal a:hover{color:#a1a1aa}

/* ===== COMMENTS ===== */
.comments-area{margin-top:4rem;padding-top:3rem;border-top:1px solid #27272a}
.comments-area h2{font-size:1.5rem;font-weight:700;color:#fff;margin-bottom:2rem}
.comment{padding:1.5rem;background:#18181b;border:1px solid #27272a;border-radius:1rem;margin-bottom:1rem}
.comment .author{font-weight:600;color:#fff;font-size:.875rem}
.comment .date{color:#71717a;font-size:.75rem;margin-bottom:.75rem}
.comment p{color:#a1a1aa;font-size:.875rem;line-height:1.6}
.comment-form textarea{width:100%;background:#18181b;border:1px solid #27272a;border-radius:.75rem;padding:1rem;color:#fff;font-size:.875rem;min-height:120px;outline:none;resize:vertical}
.comment-form textarea:focus{border-color:rgba(139,92,246,.5)}
.comment-form input[type="text"],.comment-form input[type="email"],.comment-form input[type="url"]{width:100%;background:#18181b;border:1px solid #27272a;border-radius:.75rem;padding:.75rem 1rem;color:#fff;font-size:.875rem;outline:none;margin-bottom:.75rem}
.comment-form input:focus{border-color:rgba(139,92,246,.5)}
.btn-comment{padding:.75rem 2rem;background:#7c3aed;color:#fff;font-weight:600;border-radius:9999px;transition:background .2s;font-size:.875rem;margin-top:.75rem}
.btn-comment:hover{background:#6d28d9}

/* ===== SEARCH RESULTS ===== */
.search-results{padding-top:8rem}
.search-results h1{font-size:2rem;font-weight:700;color:#fff;margin-bottom:2rem}
.search-results mark{background:rgba(139,92,246,.2);color:#a78bfa;border-radius:2px;padding:0 2px}

/* ===== ARCHIVE ===== */
.archive-header{padding-top:8rem;margin-bottom:3rem}
.archive-header h1{font-size:2rem;font-weight:700;color:#fff;margin-bottom:.5rem}
.archive-header p{color:#71717a}

/* ===== WP ALIGNMENTS ===== */
.alignwide{max-width:1100px;margin-left:auto;margin-right:auto}
.alignfull{width:100vw;position:relative;left:50%;right:50%;margin-left:-50vw;margin-right:-50vw}
.aligncenter{display:block;margin-left:auto;margin-right:auto}
.alignleft{float:left;margin-right:1.5rem;margin-bottom:1rem}
.alignright{float:right;margin-left:1.5rem;margin-bottom:1rem}

/* ===== WP BLOCK STYLES ===== */
.wp-block-image{margin:2rem 0}
.wp-block-image img{border-radius:1rem}
.wp-block-quote{border-left:3px solid #7c3aed;padding-left:1.5rem;margin:1.5rem 0;font-style:italic;color:#d4d4d8}

/* ===== LOAD MORE ===== */
.load-more{width:100%;padding:1rem;background:#18181b;border:1px solid #27272a;border-radius:1rem;color:#a1a1aa;font-weight:500;transition:all .2s;text-align:center;display:block;margin-top:2rem}
.load-more:hover{color:#fff;border-color:#3f3f46}
