/*
Theme Name: Guinea Pig Haven
Theme URI: https://3402.cn
Description: Editorial magazine-style WordPress theme - Unique, warm, and beautifully crafted
Version: 4.0
Author: Guinea Pig Haven
Text Domain: cangshuwo
*/

/* ========== CSS Reset ========== */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

:root{
    /* Sophisticated Warm Palette */
    --c-primary:#C4A484;
    --c-primary-dark:#A68B6A;
    --c-primary-light:#D4B896;
    --c-primary-soft:#F5EDE5;
    
    --c-secondary:#6B8E7A;
    --c-secondary-dark:#5A7A68;
    --c-secondary-soft:#E8F0EB;
    
    --c-dark:#2C2C2C;
    --c-dark-soft:#404040;
    --c-text:#3D3D3D;
    --c-text-light:#666666;
    --c-text-muted:#999999;

    --c-bg:#FDFBF9;
    --c-bg-alt:#F7F3EF;
    --c-bg-warm:#FBF8F4;
    --c-card:#FFFFFF;
    --c-card-alt:#F5F2EE;

    --c-accent:#B8860B;
    --c-accent-soft:#FDF6E3;
    --c-success:#6B8E7A;
    --c-warning:#D4A574;
    --c-error:#C07878;

    --c-border:#E8E3DD;
    --c-border-light:#F0ECE7;

    --shadow-xs:0 1px 2px rgba(0,0,0,.03);
    --shadow-sm:0 2px 6px rgba(0,0,0,.04);
    --shadow-md:0 4px 16px rgba(0,0,0,.06);
    --shadow-lg:0 8px 32px rgba(0,0,0,.08);
    --shadow-xl:0 16px 64px rgba(0,0,0,.1);

    --r-sm:4px;--r-md:8px;--r-lg:16px;--r-xl:24px;--r-full:9999px;

    --font-display:"Playfair Display","Georgia",serif;
    --font-body:"Source Sans 3","Segoe UI",sans-serif;

    --max-w:1200px;
    --transition:all .3s ease;
}

html{font-size:16px;scroll-behavior:smooth}
body{
    font-family:var(--font-body);
    color:var(--c-text);
    background:var(--c-bg);
    line-height:1.75;
    -webkit-font-smoothing:antialiased
}

::selection{background:var(--c-primary);color:#fff}
::-webkit-scrollbar{width:8px}
::-webkit-scrollbar-track{background:var(--c-bg-alt)}
::-webkit-scrollbar-thumb{background:var(--c-border);border-radius:4px}

a{color:var(--c-dark);text-decoration:none;transition:var(--transition)}
a:hover{color:var(--c-primary)}
img{max-width:100%;height:auto;display:block}
ul,ol{list-style:none}

.container{max-width:var(--max-w);margin:0 auto;padding:0 32px}

/* ========== Header - Minimal ========== */
.site-header{
    background:rgba(253,251,249,.98);
    backdrop-filter:blur(12px);
    border-bottom:1px solid var(--c-border);
    position:sticky;
    top:0;
    z-index:1000
}
.site-header .container{
    display:flex;align-items:center;justify-content:space-between;
    padding:0 32px;height:68px;gap:24px
}

.site-branding{display:flex;align-items:center;gap:12px}
.site-title{
    font-family:var(--font-display);
    font-size:1.25rem;font-weight:700;margin:0;line-height:1
}
.site-title a{color:var(--c-dark);display:flex;align-items:center;gap:10px}
.logo-mark{
    width:32px;height:32px;
    border-radius:50%;
    background:var(--c-dark);
    color:#fff;font-size:1rem;
    display:flex;align-items:center;justify-content:center
}

.main-navigation{display:flex;align-items:center;flex:1;justify-content:center}
.nav-menu{display:flex;gap:2px;align-items:center;margin:0;padding:0}
.nav-menu li{list-style:none;position:relative}
.nav-menu a{
    display:block;padding:8px 10px;
    color:var(--c-text-light);font-size:.82rem;font-weight:500;
    transition:var(--transition);white-space:nowrap
}
.nav-menu a:hover,.nav-menu .current-menu-item>a{color:var(--c-dark)}
.nav-menu a:hover{background:var(--c-bg-alt)}

.sub-menu{
    position:absolute;top:calc(100% + 8px);left:0;
    background:var(--c-card);
    border-radius:var(--r-lg);
    box-shadow:var(--shadow-xl);
    border:1px solid var(--c-border);
    min-width:180px;padding:8px;
    opacity:0;visibility:hidden;
    transform:translateY(-8px);
    transition:all .2s ease;
    z-index:100
}
.nav-menu li:hover>.sub-menu{opacity:1;visibility:visible;transform:translateY(0)}
.sub-menu a{padding:10px 14px;border-radius:var(--r-sm);font-size:.82rem}
.sub-menu a:hover{background:var(--c-bg-alt);color:var(--c-dark)}

.menu-toggle{display:none;background:none;border:none;cursor:pointer;padding:8px;margin-left:auto}
.menu-toggle .menu-icon{display:block;width:22px;height:2px;background:var(--c-dark);border-radius:2px;transition:all .3s}

.header-actions{display:flex;align-items:center;gap:8px}
.search-toggle{
    background:none;border:none;
    color:var(--c-text-light);cursor:pointer;
    padding:8px;font-size:1rem
}
.search-toggle:hover{color:var(--c-dark)}

.search-form-wrapper{
    position:absolute;right:32px;top:calc(100% + 12px);
    width:320px;padding:20px;
    background:var(--c-card);border-radius:var(--r-lg);
    box-shadow:var(--shadow-xl);border:1px solid var(--c-border);
    z-index:200;display:none
}
.search-form-wrapper.active{display:block}
.search-form-wrapper form{display:flex;gap:8px}
.search-form-wrapper input[type=search]{
    flex:1;padding:12px 16px;border:1px solid var(--c-border);
    border-radius:var(--r-md);font-size:.9rem;
    background:var(--c-bg-alt)
}
.search-form-wrapper input[type=search]:focus{border-color:var(--c-primary);outline:none}
.search-form-wrapper button{
    padding:12px 20px;background:var(--c-dark);color:#fff;
    border:none;border-radius:var(--r-md);font-weight:600;cursor:pointer
}

/* ========== Editorial Hero ========== */
.editorial-hero{
    padding:80px 0 60px;
    text-align:center;
    border-bottom:1px solid var(--c-border)
}
.editorial-hero-inner{max-width:800px;margin:0 auto;padding:0 32px}
.editorial-masthead{
    display:flex;align-items:center;justify-content:center;gap:16px;
    margin-bottom:32px
}
.masthead-line{
    width:60px;height:1px;
    background:var(--c-border)
}
.masthead-date{
    font-size:.75rem;
    color:var(--c-text-muted);
    letter-spacing:2px;text-transform:uppercase
}
.editorial-title{
    font-family:var(--font-display);
    margin-bottom:20px;line-height:1.1
}
.title-main{
    display:block;
    font-size:3.5rem;
    font-weight:700;
    color:var(--c-dark);
    letter-spacing:-1px
}
.title-sub{
    display:block;
    font-size:1.5rem;
    font-weight:400;
    color:var(--c-primary);
    font-style:italic;
    margin-top:4px
}
.editorial-desc{
    font-size:1.1rem;
    color:var(--c-text-light);
    line-height:1.7;
    margin-bottom:32px;
    max-width:600px;
    margin-left:auto;
    margin-right:auto
}
.editorial-search{
    display:flex;gap:0;max-width:480px;margin:0 auto;
    border:1px solid var(--c-border);
    border-radius:var(--r-full);
    background:#fff;overflow:hidden
}
.editorial-search input[type=search]{
    flex:1;padding:16px 24px;border:none;
    font-size:1rem;font-family:inherit;
    background:transparent
}
.editorial-search input[type=search]:focus{outline:none}
.editorial-search button{
    padding:16px 24px;
    background:var(--c-dark);color:#fff;border:none;
    font-size:1rem;cursor:pointer;
    transition:var(--transition)
}
.editorial-search button:hover{background:var(--c-primary)}

/* ========== Featured Section ========== */
.featured-section{padding:64px 0}
.featured-story{
    display:grid;grid-template-columns:1.2fr 1fr;
    gap:48px;align-items:center
}
.featured-image{
    position:relative;border-radius:var(--r-xl);overflow:hidden;
    aspect-ratio:16/10;
    background:var(--c-bg-alt)
}
.featured-image img{width:100%;height:100%;object-fit:cover}
.featured-category{
    position:absolute;top:20px;left:20px;
    padding:6px 14px;
    background:var(--c-card);
    border-radius:var(--r-full);
    font-size:.75rem;font-weight:600;color:var(--c-dark)
}
.featured-content{padding:16px 0}
.featured-label{
    display:inline-block;
    font-size:.7rem;font-weight:600;
    color:var(--c-primary);
    letter-spacing:2px;text-transform:uppercase;
    margin-bottom:12px
}
.featured-title{
    font-family:var(--font-display);
    font-size:2rem;line-height:1.25;
    font-weight:700;color:var(--c-dark);
    margin-bottom:16px
}
.featured-title a{color:inherit}
.featured-title a:hover{color:var(--c-primary)}
.featured-excerpt{
    font-size:1rem;color:var(--c-text-light);
    line-height:1.7;margin-bottom:20px
}
.featured-meta{
    display:flex;gap:16px;
    font-size:.85rem;color:var(--c-text-muted);
    margin-bottom:24px
}
.featured-readmore{
    display:inline-flex;align-items:center;gap:8px;
    font-weight:600;color:var(--c-dark);
    padding-bottom:4px;
    border-bottom:2px solid var(--c-primary)
}
.featured-readmore:hover{color:var(--c-primary)}

/* ========== Quick Nav ========== */
.quick-nav-section{
    background:var(--c-dark);
    padding:20px 0
}
.quick-nav{
    display:flex;justify-content:center;gap:4px;flex-wrap:wrap
}
.quick-nav-item{
    display:flex;align-items:center;gap:8px;
    padding:12px 20px;
    color:rgba(255,255,255,.85);
    font-size:.9rem;font-weight:500;
    border-radius:var(--r-full);
    transition:var(--transition)
}
.quick-nav-item:hover{
    background:rgba(255,255,255,.1);
    color:#fff
}
.quick-nav-icon{font-size:1.1rem}

/* ========== Section Common ========== */
.section{padding:72px 0}
.section-alt{background:var(--c-bg-alt)}
.section-header{
    margin-bottom:40px;
    display:flex;align-items:flex-end;justify-content:space-between;
    gap:24px
}
.section-header.centered{
    flex-direction:column;align-items:center;text-align:center
}
.section-title{
    font-family:var(--font-display);
    font-size:1.8rem;line-height:1.2;
    font-weight:700;color:var(--c-dark)
}
.section-desc{
    font-size:.95rem;color:var(--c-text-light);
    margin-top:8px;max-width:500px
}
.view-all-link{
    font-size:.88rem;font-weight:600;
    color:var(--c-primary);white-space:nowrap
}
.view-all-link:hover{color:var(--c-primary-dark)}

/* ========== Breeds Showcase ========== */
.breeds-section{background:var(--c-bg-alt)}
.breeds-showcase{
    display:grid;grid-template-columns:repeat(6,1fr);gap:16px
}
.breed-card{
    text-align:center;padding:28px 16px;
    background:var(--c-card);
    border:1px solid var(--c-border);
    border-radius:var(--r-xl);
    transition:var(--transition);cursor:pointer
}
.breed-card:hover{
    transform:translateY(-4px);
    box-shadow:var(--shadow-md);
    border-color:var(--c-primary)
}
.breed-icon{font-size:2.5rem;margin-bottom:12px;display:block}
.breed-card h4{
    font-family:var(--font-display);
    font-size:.95rem;font-weight:600;
    color:var(--c-dark);margin-bottom:6px
}
.breed-card p{
    font-size:.78rem;color:var(--c-text-light);line-height:1.4
}

/* ========== Topics Grid ========== */
.topics-grid{
    display:grid;grid-template-columns:repeat(3,1fr);gap:20px
}
.topic-card{
    display:flex;flex-direction:column;align-items:center;
    text-align:center;padding:32px 24px;
    background:var(--c-card);
    border:1px solid var(--c-border);
    border-radius:var(--r-xl);
    transition:var(--transition)
}
.topic-card:hover{
    transform:translateY(-4px);
    box-shadow:var(--shadow-md);
    border-color:var(--c-primary)
}
.topic-icon{font-size:2rem;margin-bottom:12px}
.topic-name{
    font-family:var(--font-display);
    font-size:1rem;font-weight:600;
    color:var(--c-dark);margin-bottom:6px
}
.topic-count{
    font-size:.78rem;color:var(--c-text-muted)
}

/* ========== Checklist Section ========== */
.checklist-section{background:var(--c-dark)}
.checklist-wrapper{
    display:grid;grid-template-columns:1fr 1fr;gap:60px;
    align-items:center
}
.checklist-intro h2{
    font-family:var(--font-display);
    font-size:2rem;font-weight:700;
    color:#fff;margin-bottom:12px
}
.checklist-intro p{
    color:rgba(255,255,255,.7);
    font-size:1rem;line-height:1.6;
    margin-bottom:24px
}
.checklist-cta{
    display:inline-flex;
    padding:14px 28px;
    background:var(--c-primary);
    color:#fff;
    border-radius:var(--r-full);
    font-weight:600;
    transition:var(--transition)
}
.checklist-cta:hover{
    background:var(--c-primary-dark);
    transform:translateY(-2px)
}
.checklist-items{
    display:flex;flex-direction:column;gap:12px
}
.checklist-item{
    display:flex;align-items:center;gap:14px;
    padding:14px 18px;
    background:rgba(255,255,255,.08);
    border-radius:var(--r-lg);
    color:rgba(255,255,255,.9);
    font-size:.95rem
}
.checklist-item .check-icon{
    width:24px;height:24px;
    background:var(--c-secondary);
    color:#fff;
    border-radius:50%;
    display:flex;align-items:center;justify-content:center;
    font-size:.75rem;font-weight:700;
    flex-shrink:0
}

/* ========== Magazine Grid ========== */
.magazine-grid{
    display:grid;grid-template-columns:1fr 320px;gap:48px
}
.magazine-article{
    display:grid;grid-template-columns:160px 1fr;gap:24px;
    padding:24px 0;
    border-bottom:1px solid var(--c-border)
}
.magazine-featured{
    padding-top:0
}
.magazine-featured .article-image{
    aspect-ratio:4/3;border-radius:var(--r-lg);overflow:hidden;height:120px}
.magazine-featured .article-title{font-size:1.15rem}
.article-image{
    aspect-ratio:1;width:160px;border-radius:var(--r-md);overflow:hidden;
    background:var(--c-bg-alt)
}
.article-image img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.article-image:hover img{transform:scale(1.05)}
.article-content{min-width:0}
.article-category{
    display:inline-block;
    font-size:.65rem;font-weight:600;
    color:var(--c-primary);
    letter-spacing:1px;text-transform:uppercase;
    margin-bottom:8px
}
.article-title{
    font-family:var(--font-display);
    font-size:1rem;line-height:1.35;
    font-weight:600;color:var(--c-dark);margin-bottom:8px
}
.article-title a{color:inherit}
.article-title a:hover{color:var(--c-primary)}
.article-excerpt{
    font-size:.85rem;color:var(--c-text-light);
    line-height:1.55;margin-bottom:10px;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden
}
.article-meta{
    display:flex;gap:10px;
    font-size:.78rem;color:var(--c-text-muted)
}

/* ========== Sidebar Widgets ========== */
.magazine-sidebar{display:flex;flex-direction:column;gap:32px}
.sidebar-widget{
    background:var(--c-card);
    border:1px solid var(--c-border);
    border-radius:var(--r-xl);
    padding:24px
}
.widget-title{
    font-family:var(--font-display);
    font-size:1rem;font-weight:700;
    color:var(--c-dark);margin-bottom:20px;
    padding-bottom:12px;
    border-bottom:2px solid var(--c-primary)
}
.popular-item{
    display:flex;align-items:flex-start;gap:14px;
    padding:14px 0;
    border-bottom:1px solid var(--c-border-light);
    color:var(--c-dark);transition:var(--transition)
}
.popular-item:last-child{border-bottom:none}
.popular-item:hover{color:var(--c-primary)}
.popular-rank{
    font-family:var(--font-display);
    font-size:1.5rem;font-weight:700;
    color:var(--c-border);line-height:1;
    flex-shrink:0
}
.popular-item:hover .popular-rank{color:var(--c-primary)}
.popular-title{
    font-size:.9rem;font-weight:500;
    line-height:1.4
}
.tool-links{display:flex;flex-direction:column;gap:8px}
.tool-link-item{
    display:flex;align-items:center;gap:10px;
    padding:12px 14px;
    background:var(--c-bg-alt);
    border-radius:var(--r-md);
    font-size:.88rem;color:var(--c-dark);transition:var(--transition)
}
.tool-link-item:hover{background:var(--c-primary-soft);color:var(--c-primary)}

/* ========== FAQ Accordion ========== */
.faq-section{background:var(--c-bg-alt)}
.faq-accordion{
    max-width:800px;margin:0 auto;
    display:flex;flex-direction:column;gap:8px
}
.faq-item{
    background:var(--c-card);
    border-radius:var(--r-lg);
    overflow:hidden;transition:var(--transition)
}
.faq-item:hover{box-shadow:var(--shadow-sm)}
.faq-question{
    width:100%;padding:20px 24px;
    background:none;border:none;text-align:left;
    font-family:var(--font-body);
    font-size:1rem;font-weight:600;
    color:var(--c-dark);cursor:pointer;
    display:flex;justify-content:space-between;align-items:center;gap:16px
}
.faq-question::after{
    content:"+";font-size:1.5rem;font-weight:300;
    color:var(--c-primary);transition:transform .2s
}
.faq-item.active .faq-question::after{transform:rotate(45deg)}
.faq-answer{
    max-height:0;overflow:hidden;
    transition:max-height .3s ease
}
.faq-answer-inner{
    padding:0 24px 20px;
    font-size:.95rem;color:var(--c-text-light);
    line-height:1.7
}
.faq-item.active .faq-answer{max-height:300px}

/* ========== Newsletter Editorial ========== */
.newsletter-editorial{
    padding:80px 0;
    background:var(--c-dark)
}
.newsletter-box{
    text-align:center;
    max-width:500px;margin:0 auto
}
.newsletter-icon{font-size:2.5rem;margin-bottom:16px;display:block}
.newsletter-title{
    font-family:var(--font-display);
    font-size:1.8rem;font-weight:700;
    color:#fff;margin-bottom:12px
}
.newsletter-desc{
    color:rgba(255,255,255,.6);
    font-size:1rem;margin-bottom:28px
}
.newsletter-form{
    display:flex;gap:12px;
    max-width:420px;margin:0 auto
}
.newsletter-form input[type=email]{
    flex:1;padding:14px 20px;
    border:none;border-radius:var(--r-full);
    font-size:1rem;font-family:inherit
}
.newsletter-form input[type=email]:focus{outline:2px solid var(--c-primary)}
.newsletter-form button{
    padding:14px 28px;
    background:var(--c-primary);
    color:#fff;border:none;
    border-radius:var(--r-full);
    font-weight:600;cursor:pointer;
    transition:var(--transition)
}
.newsletter-form button:hover{background:var(--c-primary-dark)}

/* ========== Footer ========== */
.site-footer{
    background:var(--c-bg-alt);
    border-top:1px solid var(--c-border);
    padding:48px 0 24px
}
.footer-grid{
    display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;
    gap:40px;margin-bottom:40px
}
.footer-brand .site-title{font-size:1.2rem;margin-bottom:14px}
.footer-brand p{font-size:.88rem;color:var(--c-text-light);line-height:1.6;max-width:260px}
.footer-col h5{
    font-family:var(--font-display);
    font-size:.9rem;color:var(--c-dark);margin-bottom:16px;font-weight:700
}
.footer-col ul li{margin-bottom:10px}
.footer-col ul a{color:var(--c-text-light);font-size:.85rem}
.footer-col ul a:hover{color:var(--c-primary)}
.footer-bottom{
    padding-top:24px;border-top:1px solid var(--c-border);
    display:flex;justify-content:space-between;
    font-size:.8rem;color:var(--c-text-muted)
}

/* ========== Responsive ========== */
@media (max-width:1024px){
    .featured-story{grid-template-columns:1fr;gap:32px}
    .magazine-grid{grid-template-columns:1fr}
    .magazine-sidebar{order:-1;display:grid;grid-template-columns:1fr 1fr;gap:20px}
    .footer-grid{grid-template-columns:1fr 1fr;gap:32px}
}
@media (max-width:768px){
    .main-navigation{display:none}
    .menu-toggle{display:block}
    .site-header .container{padding:0 16px}
    .site-title{font-size:1.1rem}
    
    /* Mobile Nav Overlay */
    .mobile-nav{
        display:none;position:fixed;top:68px;left:0;right:0;bottom:0;
        background:var(--c-bg);z-index:999;padding:20px;
        overflow-y:auto
    }
    .mobile-nav.active{display:block}
    .mobile-nav .nav-menu{
        display:flex;flex-direction:column;gap:0
    }
    .mobile-nav .nav-menu a{
        padding:14px 0;font-size:1rem;
        border-bottom:1px solid var(--c-border-light)
    }
    .mobile-nav .sub-menu{
        position:static;opacity:1;visibility:visible;
        transform:none;box-shadow:none;
        border:none;padding:0 0 0 16px;margin-bottom:8px
    }
    .mobile-nav .sub-menu a{font-size:.9rem;color:var(--c-text-light)}
    
    /* Hero */
    .editorial-hero{padding:48px 0 40px}
    .masthead-date{font-size:.65rem}
    .title-main{font-size:2rem}
    .title-sub{font-size:1.1rem}
    .editorial-desc{font-size:.95rem}
    .editorial-search{flex-direction:column;border-radius:var(--r-lg)}
    .editorial-search input[type=search]{padding:14px 18px}
    .editorial-search button{padding:14px;border-radius:var(--r-lg)}
    
    /* Quick Nav */
    .quick-nav{justify-content:flex-start;overflow-x:auto;padding-bottom:8px;gap:8px}
    .quick-nav::-webkit-scrollbar{display:none}
    .quick-nav-item{padding:10px 14px;white-space:nowrap;font-size:.82rem}
    .quick-nav-icon{font-size:.95rem}
    
    /* Section */
    .section{padding:48px 0}
    .section-header{flex-direction:column;align-items:flex-start;gap:12px;margin-bottom:28px}
    .section-title{font-size:1.4rem}
    .section-desc{font-size:.88rem}
    
    /* Breeds */
    .breeds-showcase{grid-template-columns:repeat(2,1fr);gap:12px}
    .breed-card{padding:20px 12px}
    .breed-icon{font-size:2rem}
    .breed-card h4{font-size:.85rem}
    
    /* Featured */
    .featured-section{padding:40px 0}
    .featured-image{aspect-ratio:16/9;border-radius:var(--r-lg)}
    .featured-title{font-size:1.5rem}
    .featured-excerpt{font-size:.9rem}
    
    /* Magazine */
    .magazine-article{grid-template-columns:120px 1fr;gap:16px;padding:20px 0}
    .article-image{width:120px;height:120px;border-radius:var(--r-md)}
    .article-title{font-size:.95rem}
    .article-excerpt{font-size:.82rem;-webkit-line-clamp:2}
    
    /* Sidebar */
    .magazine-sidebar{order:-1;display:grid;grid-template-columns:1fr;gap:20px}
    .sidebar-widget{padding:20px}
    .popular-item{padding:12px 0}
    .popular-rank{font-size:1.2rem}
    
    /* Topics */
    .topics-grid{grid-template-columns:1fr 1fr;gap:12px}
    .topic-card{padding:20px 16px}
    .topic-icon{font-size:1.5rem}
    .topic-name{font-size:.88rem}
    
    /* Checklist */
    .checklist-section{padding:48px 0}
    .checklist-intro h2{font-size:1.5rem}
    .checklist-item{padding:12px 14px;font-size:.88rem}
    
    /* FAQ */
    .faq-question{font-size:.92rem;padding:16px 20px}
    .faq-question::after{font-size:1.3rem}
    
    /* Newsletter */
    .newsletter-editorial{padding:56px 0}
    .newsletter-title{font-size:1.4rem}
    .newsletter-form{flex-direction:column}
    .newsletter-form input[type=email]{text-align:center}
    .newsletter-form button{width:100%}
    
    /* Footer */
    .footer-grid{grid-template-columns:1fr;gap:24px}
    .footer-bottom{flex-direction:column;gap:12px;text-align:center}
    
    /* Archive/Grid */
    .articles-grid{grid-template-columns:1fr 1fr;gap:16px}
    .card-thumb{height:140px}
    .card-body{padding:16px}
    .card-title{font-size:.92rem}
    
    /* Related Posts */
    .related-grid{grid-template-columns:1fr 1fr;gap:16px}
    .related-thumb{height:120px}
    
    /* Single Post */
    .post-header h1{font-size:1.6rem}
    .post-body{font-size:1rem}
    .post-body h2{font-size:1.3rem}
    .author-box{flex-direction:column;text-align:center;align-items:center}
}

/* ========== Post Single Page ========== */
.main-layout{display:grid;grid-template-columns:1fr 300px;gap:48px;padding:48px 0}
.main-content{min-width:0}
.main-sidebar{min-width:0}

.single-post-content{max-width:780px}
.post-header{margin-bottom:32px}
.post-header h1{
    font-family:var(--font-display);
    font-size:2.2rem;line-height:1.25;font-weight:700;
    color:var(--c-dark);margin-bottom:20px
}
.post-meta{
    display:flex;flex-wrap:wrap;gap:20px;
    font-size:.85rem;color:var(--c-text-muted)
}
.post-body{font-size:1.05rem;line-height:1.8;margin:32px 0}
.post-body h2{
    font-family:var(--font-display);
    font-size:1.5rem;font-weight:700;color:var(--c-dark);
    margin:40px 0 16px;padding-top:20px;
    border-top:1px solid var(--c-border)
}
.post-body h3{
    font-family:var(--font-display);
    font-size:1.2rem;font-weight:700;color:var(--c-dark);
    margin:32px 0 12px
}
.post-body p{margin-bottom:20px}
.post-body ul,.post-body ol{margin:0 0 20px 24px;list-style:disc}
.post-body li{margin-bottom:8px}
.post-body strong{color:var(--c-dark);font-weight:600}
.post-body a{color:var(--c-primary);text-decoration:underline}

.author-box{
    display:flex;gap:20px;padding:24px;
    background:var(--c-bg-alt);border-radius:var(--r-xl);margin:32px 0
}
.author-box .author-avatar img{
    width:60px;height:60px;border-radius:50%
}
.author-box .author-name{
    font-family:var(--font-display);
    font-size:1.1rem;font-weight:700;color:var(--c-dark);margin-bottom:6px
}
.author-box .author-desc{font-size:.88rem;color:var(--c-text-light);line-height:1.6}

.related-posts{margin:48px 0}
.related-posts h2{
    font-family:var(--font-display);
    font-size:1.3rem;font-weight:700;color:var(--c-dark);margin-bottom:24px
}
.related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.related-card{background:var(--c-card);border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--c-border);transition:var(--transition)}
.related-card:hover{border-color:var(--c-primary)}
.related-thumb{height:140px;overflow:hidden;background:var(--c-bg-alt)}
.related-thumb img{width:100%;height:100%;object-fit:cover}
.related-info{padding:16px}
.related-title{font-family:var(--font-display);font-size:.95rem;font-weight:600;color:var(--c-dark);margin-bottom:8px;line-height:1.4}
.related-title a{color:inherit}
.related-title a:hover{color:var(--c-primary)}

/* ========== Sidebar ========== */
.main-sidebar{display:flex;flex-direction:column;gap:24px}
.sidebar-widget{
    background:var(--c-card);padding:24px;
    border:1px solid var(--c-border);border-radius:var(--r-xl)
}
.sidebar-widget h3{
    font-family:var(--font-display);
    font-size:1rem;font-weight:700;color:var(--c-dark);
    margin-bottom:16px;padding-bottom:12px;
    border-bottom:2px solid var(--c-primary)
}
.sidebar-widget ul li{margin-bottom:12px}
.sidebar-widget ul li a{
    display:flex;align-items:center;gap:8px;
    padding:8px 0;color:var(--c-text-light);font-size:.88rem;
    border-bottom:1px dashed var(--c-border-light)
}
.sidebar-widget ul li a:hover{color:var(--c-primary)}

/* ========== Archive Page ========== */
.archive-header{margin-bottom:40px;padding-bottom:24px;border-bottom:2px solid var(--c-border)}
.archive-title{
    font-family:var(--font-display);
    font-size:2rem;font-weight:700;color:var(--c-dark);margin-bottom:12px
}
.archive-description{font-size:.95rem;color:var(--c-text-light);line-height:1.7}

.articles-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.article-card{
    background:var(--c-card);border-radius:var(--r-lg);
    overflow:hidden;border:1px solid var(--c-border);
    transition:var(--transition);display:flex;flex-direction:column
}
.article-card:hover{border-color:var(--c-primary);transform:translateY(-4px)}
.card-thumb{
    width:100%;height:180px;overflow:hidden;
    background:var(--c-bg-alt)
}
.card-thumb img{width:100%;height:100%;object-fit:cover}
.card-body{padding:20px;flex:1;display:flex;flex-direction:column}
.card-category{
    display:inline-flex;
    font-size:.65rem;font-weight:600;color:var(--c-primary);
    text-transform:uppercase;letter-spacing:1px;margin-bottom:10px
}
.card-title{
    font-family:var(--font-display);
    font-size:1.05rem;line-height:1.35;font-weight:600;
    color:var(--c-dark);margin-bottom:10px;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden
}
.card-title a{color:inherit}
.card-title a:hover{color:var(--c-primary)}
.card-excerpt{
    font-size:.85rem;color:var(--c-text-light);
    line-height:1.6;margin-bottom:16px;flex:1
}
.card-meta{font-size:.78rem;color:var(--c-text-muted)}

.pagination{margin-top:40px;display:flex;justify-content:center}
.pagination .nav-links{display:flex;gap:8px}
.pagination a,.pagination span{
    padding:10px 16px;background:var(--c-card);
    border:1px solid var(--c-border);border-radius:var(--r-md);
    font-size:.88rem;color:var(--c-text)
}
.pagination a:hover{background:var(--c-bg-alt);color:var(--c-dark)}
.pagination .current{background:var(--c-dark);color:#fff;border-color:var(--c-dark)}

/* ========== Page Hero ========== */
.page-hero{
    background:var(--c-bg-alt);
    padding:60px 0 48px;
    border-bottom:1px solid var(--c-border)
}
.page-eyebrow{
    font-size:.7rem;color:var(--c-primary);font-weight:600;
    letter-spacing:2px;text-transform:uppercase;margin-bottom:12px
}
.page-hero h1{
    font-family:var(--font-display);
    font-size:2.2rem;font-weight:700;color:var(--c-dark);margin-bottom:16px
}
.page-lede{font-size:1rem;color:var(--c-text-light);line-height:1.7;max-width:700px}

/* ========== Utility Classes ========== */
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:32px}
.card{background:var(--c-card);border:1px solid var(--c-border);border-radius:var(--r-xl);padding:28px}
.card h3{font-family:var(--font-display);font-size:1.1rem;font-weight:700;color:var(--c-dark);margin-bottom:14px}
.card p{font-size:.9rem;color:var(--c-text-light);line-height:1.6}

.alert{padding:16px 20px;border-radius:var(--r-lg);margin-bottom:24px;display:flex;align-items:flex-start;gap:12px;font-size:.95rem}
.alert-info{background:var(--c-primary-soft);border-left:4px solid var(--c-primary)}
.alert-warning{background:#FEF3C7;border-left:4px solid var(--c-warning)}
.alert-error{background:#FEE2E2;border-left:4px solid var(--c-error)}

.error-404{text-align:center;padding:80px 20px}
.error-404 .error-code{font-family:var(--font-display);font-size:6rem;font-weight:700;color:var(--c-primary);line-height:1}
.error-404 h1{font-family:var(--font-display);font-size:1.8rem;font-weight:700;color:var(--c-dark);margin:24px 0}
.error-404 p{color:var(--c-text-light);margin-bottom:32px}
.error-404 .btn{display:inline-flex;padding:14px 32px;background:var(--c-dark);color:#fff;border-radius:var(--r-full);font-weight:600}

@media (max-width:1024px){
    .main-layout{grid-template-columns:1fr}
    .main-sidebar{display:none}
    .breeds-showcase{grid-template-columns:repeat(3,1fr)}
    .topics-grid{grid-template-columns:repeat(2,1fr)}
    .checklist-wrapper{grid-template-columns:1fr;gap:32px}
    .featured-story{grid-template-columns:1fr}
    .magazine-grid{grid-template-columns:1fr}
}
@media (max-width:768px){
    .container{padding:0 16px}
    .site-header .container{padding:0 16px;height:60px}
    .site-title{font-size:1.1rem}
    .logo-mark{width:28px;height:28px;font-size:.85rem}
    
    /* Hero */
    .editorial-hero{padding:48px 0 40px}
    .masthead-date{font-size:.65rem}
    .title-main{font-size:2rem}
    .title-sub{font-size:1.1rem}
    .editorial-desc{font-size:.95rem}
    .editorial-search{flex-direction:column;border-radius:var(--r-lg)}
    .editorial-search input[type=search]{padding:14px 18px}
    .editorial-search button{padding:14px;border-radius:var(--r-lg)}
    
    /* Quick Nav */
    .quick-nav{justify-content:flex-start;overflow-x:auto;padding-bottom:8px;gap:8px}
    .quick-nav::-webkit-scrollbar{display:none}
    .quick-nav-item{padding:10px 14px;white-space:nowrap;font-size:.82rem}
    .quick-nav-icon{font-size:.95rem}
    
    /* Section */
    .section{padding:48px 0}
    .section-header{flex-direction:column;align-items:flex-start;gap:12px;margin-bottom:28px}
    .section-title{font-size:1.4rem}
    .section-desc{font-size:.88rem}
    
    /* Breeds */
    .breeds-showcase{grid-template-columns:repeat(2,1fr);gap:12px}
    .breed-card{padding:20px 12px}
    .breed-icon{font-size:2rem}
    .breed-card h4{font-size:.85rem}
    
    /* Featured */
    .featured-section{padding:40px 0}
    .featured-image{aspect-ratio:16/9;border-radius:var(--r-lg)}
    .featured-title{font-size:1.5rem}
    .featured-excerpt{font-size:.9rem}
    
    /* Magazine */
    .magazine-article{grid-template-columns:120px 1fr;gap:16px;padding:20px 0}
    .article-image{width:120px;height:120px;border-radius:var(--r-md)}
    .article-title{font-size:.95rem}
    .article-excerpt{font-size:.82rem;-webkit-line-clamp:2}
    
    /* Sidebar */
    .magazine-sidebar{order:-1;display:grid;grid-template-columns:1fr;gap:20px}
    .sidebar-widget{padding:20px}
    .popular-item{padding:12px 0}
    .popular-rank{font-size:1.2rem}
    
    /* Topics */
    .topics-grid{grid-template-columns:1fr 1fr;gap:12px}
    .topic-card{padding:20px 16px}
    .topic-icon{font-size:1.5rem}
    .topic-name{font-size:.88rem}
    
    /* Checklist */
    .checklist-section{padding:48px 0}
    .checklist-intro h2{font-size:1.5rem}
    .checklist-item{padding:12px 14px;font-size:.88rem}
    
    /* FAQ */
    .faq-question{font-size:.92rem;padding:16px 20px}
    .faq-question::after{font-size:1.3rem}
    
    /* Newsletter */
    .newsletter-editorial{padding:56px 0}
    .newsletter-title{font-size:1.4rem}
    .newsletter-form{flex-direction:column}
    .newsletter-form input[type=email]{text-align:center}
    .newsletter-form button{width:100%}
    
    /* Footer */
    .footer-grid{grid-template-columns:1fr;gap:24px}
    .footer-bottom{flex-direction:column;gap:12px;text-align:center}
    
    /* Archive/Grid */
    .articles-grid{grid-template-columns:1fr 1fr;gap:16px}
    .card-thumb{height:140px}
    .card-body{padding:16px}
    .card-title{font-size:.92rem}
    
    /* Related Posts */
    .related-grid{grid-template-columns:1fr 1fr;gap:16px}
    .related-thumb{height:120px}
    
    /* Single Post */
    .post-header h1{font-size:1.6rem}
    .post-body{font-size:1rem}
    .post-body h2{font-size:1.3rem}
    .author-box{flex-direction:column;text-align:center;align-items:center}
}

/* Small phones */
@media (max-width:480px){
    .breeds-showcase{grid-template-columns:repeat(2,1fr)}
    .topics-grid{grid-template-columns:1fr}
    .articles-grid{grid-template-columns:1fr}
    .related-grid{grid-template-columns:1fr}
    .magazine-article{grid-template-columns:100px 1fr;gap:12px}
    .article-image{width:100px;height:100px}
    .title-main{font-size:1.7rem}
}
