/*
Theme Name: TechPathGuide
Theme URI: https://example.com/techpathguide
Author: TechPathGuide
Description: A clean, responsive technology blog theme for software guides, networking tutorials, and product comparisons.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
License: GPL-2.0-or-later
Text Domain: techpathguide
*/
:root{--navy:#10213d;--blue:#0875e1;--cyan:#14b8d4;--muted:#5c6b82;--line:#e4eaf2;--bg:#f6f9fd;--white:#fff;--radius:18px;--shadow:0 10px 28px rgba(16,33,61,.07)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--white);color:var(--navy);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.65}a{color:var(--blue);text-decoration:none}a:hover{color:#0056ad}img{max-width:100%;height:auto}.site-header{border-bottom:1px solid var(--line);background:#fff}.header-inner{max-width:1180px;margin:auto;padding:18px 24px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{font-weight:850;font-size:1.55rem;letter-spacing:-.05em;color:var(--navy);line-height:1.1}.brand span{color:var(--blue)}.tagline{display:block;font-size:.66rem;letter-spacing:.17em;color:var(--muted);font-weight:700;margin-top:5px}.site-nav ul{display:flex;list-style:none;gap:24px;padding:0;margin:0;align-items:center}.site-nav a{font-size:.93rem;font-weight:650;color:var(--navy)}.site-nav a:hover{color:var(--blue)}.menu-toggle{display:none;background:#fff;border:1px solid var(--line);border-radius:10px;padding:8px 12px}.hero{background:linear-gradient(120deg,#f5f9ff 0%,#fff 55%,#eaf5ff 100%);overflow:hidden}.hero-inner{max-width:1180px;margin:auto;padding:76px 24px;display:grid;grid-template-columns:1.08fr .92fr;align-items:center;gap:42px}.eyebrow{font-size:.76rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--blue)}h1,h2,h3{line-height:1.18;letter-spacing:-.035em}h1{font-size:clamp(2.35rem,5vw,4.25rem);margin:14px 0 18px}h1 span{color:var(--blue)}.hero-copy{font-size:1.14rem;color:var(--muted);max-width:600px}.button{display:inline-flex;align-items:center;gap:10px;background:var(--blue);color:#fff;padding:13px 20px;border-radius:12px;font-weight:750;margin-top:15px;box-shadow:0 8px 18px rgba(8,117,225,.18)}.button:hover{background:#005bb8;color:#fff}.hero-art{min-height:300px;border-radius:26px;background:radial-gradient(circle at 25% 25%,#6dd8f4 0,transparent 24%),linear-gradient(135deg,#11294b,#0758a4 65%,#0aa6c7);display:flex;align-items:center;justify-content:center;padding:26px;position:relative;box-shadow:var(--shadow)}.device{width:min(100%,390px);background:#fff;border:7px solid #d7e3f0;border-radius:16px;padding:22px;transform:rotate(-2deg);box-shadow:0 18px 40px #071c3b55}.device-top{height:9px;width:65px;background:#dbe7f3;border-radius:10px;margin-bottom:20px}.app-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.app-tile{background:#eef6ff;border-radius:12px;padding:14px 6px;text-align:center;font-size:.76rem;font-weight:750}.app-icon{display:block;font-size:1.6rem;margin-bottom:5px}.hero-pills{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}.pill{font-size:.82rem;font-weight:700;border:1px solid #dbe7f5;background:#fff;padding:8px 12px;border-radius:999px;color:#274362}.section{max-width:1180px;margin:auto;padding:56px 24px}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:24px}.section-heading h2{font-size:2rem;margin:0}.section-heading p{margin:6px 0 0;color:var(--muted)}.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.post-card{border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:#fff;box-shadow:var(--shadow);display:flex;flex-direction:column}.post-card:hover{transform:translateY(-3px);transition:transform .18s ease}.card-art{min-height:155px;padding:22px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#e8f4ff,#cbe8ff);font-size:3.6rem}.card-art.network{background:linear-gradient(135deg,#e2fbf6,#b6efe7)}.card-art.tools{background:linear-gradient(135deg,#eeeaff,#d7d1ff)}.card-body{padding:22px;display:flex;flex-direction:column;flex:1}.category{font-size:.72rem;font-weight:850;letter-spacing:.1em;text-transform:uppercase;color:var(--blue)}.post-card h3{font-size:1.25rem;margin:10px 0}.post-card p{color:var(--muted);margin:0 0 18px}.read-more{font-weight:800;margin-top:auto}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:22px}.info-panel{background:var(--bg);border:1px solid var(--line);border-radius:var(--radius);padding:28px}.info-panel h3{margin-top:0}.info-panel ul{padding-left:20px;color:var(--muted)}.site-footer{background:#0f203a;color:#eaf2ff;margin-top:35px}.footer-inner{max-width:1180px;margin:auto;padding:42px 24px;display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap}.footer-inner p{color:#b7c7dd;max-width:480px}.footer-links{display:flex;gap:16px;flex-wrap:wrap}.footer-links a{color:#eaf2ff}.content-wrap{max-width:850px;margin:auto;padding:50px 24px}.content-wrap h1{font-size:clamp(2rem,4vw,3.2rem)}.entry-content{font-size:1.05rem}.entry-content h2,.entry-content h3{margin-top:1.8em}.entry-content img{border-radius:14px}.post-meta{font-size:.86rem;color:var(--muted)}.archive-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.notice{background:#fff8e6;border:1px solid #f0dca5;border-radius:12px;padding:15px;color:#664c0b;font-size:.9rem}.search-form{display:flex;gap:8px}.search-form input{min-width:0;padding:10px;border:1px solid var(--line);border-radius:8px}.search-form button{border:0;background:var(--blue);color:#fff;border-radius:8px;padding:10px 14px}@media(max-width:800px){.header-inner{flex-wrap:wrap}.menu-toggle{display:block}.site-nav{display:none;width:100%}.site-nav.is-open{display:block}.site-nav ul{align-items:flex-start;flex-direction:column;gap:12px;padding:12px 0}.hero-inner{grid-template-columns:1fr;padding-top:48px;padding-bottom:48px}.hero-art{min-height:250px}.cards{grid-template-columns:1fr 1fr}.two-col{grid-template-columns:1fr}.section{padding-top:42px;padding-bottom:42px}}@media(max-width:540px){.cards,.archive-grid{grid-template-columns:1fr}.section-heading{align-items:flex-start;flex-direction:column}.brand{font-size:1.35rem}.hero-copy{font-size:1rem}.hero-art{padding:16px}.device{padding:15px}.app-grid{gap:7px}.app-tile{padding:10px 4px;font-size:.68rem}.footer-inner{flex-direction:column}}
/* TechPathGuide: archive page styling */
.archive-page {
    max-width: 1180px;
    margin: 0 auto;
    padding: 56px 24px;
}

.archive-header {
    margin-bottom: 34px;
    padding-bottom: 24px;
    border-bottom: 1px solid var(--line);
}

.archive-eyebrow {
    margin: 0 0 10px;
    color: var(--blue);
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.13em;
}

.archive-header h1 {
    margin: 0 0 14px;
    font-size: clamp(2rem, 4vw, 3rem);
    line-height: 1.18;
    color: var(--navy);
}

.archive-subtitle,
.archive-description {
    max-width: 720px;
    margin: 0;
    color: var(--muted);
    font-size: 1.05rem;
}

.archive-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
}

.archive-card-image {
    display: block;
    overflow: hidden;
    background: linear-gradient(135deg, #e8f4ff, #cbe8ff);
    aspect-ratio: 16 / 9;
}

.archive-card-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.archive-card-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--navy);
    font-weight: 800;
    letter-spacing: 0.1em;
}

.archive-card-placeholder:hover {
    color: var(--blue);
}

.archive-card-title {
    margin: 10px 0 14px;
    font-size: 1.25rem;
    line-height: 1.35;
}

.archive-card-title a {
    color: var(--navy);
}

.archive-card-title a:hover {
    color: var(--blue);
}

.archive-pagination {
    margin-top: 36px;
}

.archive-pagination .nav-links {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
}

.archive-pagination a,
.archive-pagination .page-numbers {
    padding: 8px 13px;
    border: 1px solid var(--line);
    border-radius: 9px;
}

.archive-empty {
    padding: 32px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--bg);
}

@media (max-width: 800px) {
    .archive-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 540px) {
    .archive-page {
        padding: 38px 20px;
    }

    .archive-grid {
        grid-template-columns: 1fr;
    }
}

/* TechPathGuide: keep header and navigation consistent on all pages */
.site-header .brand {
    text-transform: none !important;
}

.site-header .site-nav a {
    text-transform: none !important;
    font-size: 0.8rem !important;
    font-weight: 650 !important;
    letter-spacing: normal !important;
}
/* TechPathGuide: keep archive-page footer typography consistent */
body.category .site-footer .brand {
    text-transform: none !important;
}

body.category .site-footer p {
    text-transform: none !important;
    font-weight: 400 !important;
    letter-spacing: normal !important;
}

body.category .site-footer .footer-links a {
    text-transform: none !important;
    font-weight: 400 !important;
    letter-spacing: normal !important;
}

body.category .site-footer {
    text-transform: none;
}
/* Keep category-page footer typography consistent */
body.category .site-footer .brand {
    font-size: 1.5rem !important;
    font-weight: 800 !important;
    text-transform: none !important;
    letter-spacing: normal !important;
}

body.category .site-footer .footer-inner p {
    font-size: 1rem !important;
    font-weight: 400 !important;
    line-height: 1.7 !important;
    text-transform: none !important;
    letter-spacing: normal !important;
}

body.category .site-footer .footer-links a {
    font-size: 1rem !important;
    font-weight: 400 !important;
    text-transform: none !important;
    letter-spacing: normal !important;
}

body.category .site-footer .footer-inner > div:last-child {
    font-size: 1rem !important;
    font-weight: 400 !important;
    text-transform: none !important;
    letter-spacing: normal !important;
}
/* TechPathGuide: proper dropdown navigation */

/* Keep the main menu in a horizontal row */
.site-nav > ul {
    display: flex;
    align-items: center;
}

/* Position each menu item for its dropdown */
.site-nav li {
    position: relative;
}

/* Hide submenu by default */
.site-nav ul.sub-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 200px;
    padding: 8px 0;
    margin: 0;
    background: #ffffff;
    border: 1px solid #e4eaf2;
    border-radius: 8px;
    box-shadow: 0 8px 20px rgba(16, 33, 61, 0.12);
    z-index: 1000;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
}

/* Show submenu on hover or keyboard focus */
.site-nav li.menu-item-has-children:hover > ul.sub-menu,
.site-nav li.menu-item-has-children:focus-within > ul.sub-menu {
    display: flex;
}

/* Style submenu links */
.site-nav ul.sub-menu li {
    display: block;
    width: 100%;
}

.site-nav ul.sub-menu a {
    display: block;
    padding: 10px 16px;
    white-space: nowrap;
    font-size: 0.85rem;
}

.site-nav ul.sub-menu a:hover {
    background: #f6f9fd;
    color: #0875e1;
}

/* Mobile: keep submenu inside the expanded navigation */
@media (max-width: 800px) {
    .site-nav ul.sub-menu {
        position: static;
        min-width: 0;
        border: 0;
        border-radius: 0;
        box-shadow: none;
        padding-left: 16px;
    }

    .site-nav li.menu-item-has-children:hover > ul.sub-menu,
    .site-nav li.menu-item-has-children:focus-within > ul.sub-menu {
        display: flex;
    }
}