/*
Theme Name: 903Pets
Theme URI: https://903pets.com
Author: 903Pets
Description: Content-first pet care theme for families researching small pets. Clean, fast, trustworthy.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: 903pets
*/

/* === RESET & BASE === */
*,*::before,*::after{box-sizing:border-box}
body,h1,h2,h3,h4,h5,h6,p,ul,ol,figure,blockquote{margin:0;padding:0}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}

/* === VARIABLES === */
:root{
  --c-bg:#fff;--c-text:#2d2d2d;--c-text-light:#666;--c-border:#e5e5e5;
  --c-surface:#f8f8f8;--c-link:#1a6b4a;
  --c-hamster:#e8913a;--c-tortoise:#4a8c5c;--c-mantis:#2a8a8a;--c-general:#8b7d6b;
  --c-hamster-bg:#fef5eb;--c-tortoise-bg:#eef6f0;--c-mantis-bg:#ebf5f5;--c-general-bg:#f5f3f0;
  --font-body:'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
  --font-heading:Georgia,'Times New Roman',serif;
  --content-width:720px;--site-width:1200px;
  --radius:6px;
}

/* === DARK MODE === */
@media(prefers-color-scheme:dark){
  :root{
    --c-bg:#1a1a1a;--c-text:#e0e0e0;--c-text-light:#aaa;--c-border:#333;
    --c-surface:#242424;--c-link:#5cb88a;
    --c-hamster-bg:#2d2518;--c-tortoise-bg:#1a2d1f;--c-mantis-bg:#1a2a2a;--c-general-bg:#2a2722;
  }
  img{opacity:.92}
}

/* === TYPOGRAPHY === */
body{font-family:var(--font-body);font-size:18px;line-height:1.7;color:var(--c-text);background:var(--c-bg)}
h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);font-weight:700;line-height:1.3;color:var(--c-text)}
h1{font-size:2rem;margin-bottom:.5em}
h2{font-size:1.5rem;margin:1.8em 0 .6em;padding-bottom:.3em;border-bottom:2px solid var(--c-border)}
h3{font-size:1.25rem;margin:1.4em 0 .5em}
h4{font-size:1.1rem;margin:1.2em 0 .4em}
p{margin-bottom:1.2em}
a{color:var(--c-link);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px}
a:hover{text-decoration-thickness:2px}
ul,ol{margin:0 0 1.2em 1.5em}
li{margin-bottom:.3em}
blockquote{border-left:4px solid var(--c-tortoise);padding:1em 1.5em;margin:1.5em 0;background:var(--c-surface);border-radius:var(--radius);font-style:italic}
strong{font-weight:600}
hr{border:none;border-top:1px solid var(--c-border);margin:2em 0}

/* === LAYOUT === */
.site-container{max-width:var(--site-width);margin:0 auto;padding:0 20px}
.content-wrap{max-width:var(--content-width);margin:0 auto}

/* === HEADER === */
.site-header{background:var(--c-bg);border-bottom:1px solid var(--c-border);padding:1em 0;position:sticky;top:0;z-index:100}
.header-inner{display:flex;align-items:center;justify-content:space-between;max-width:var(--site-width);margin:0 auto;padding:0 20px}
.site-brand a{text-decoration:none;display:flex;align-items:center;gap:.5em}
.site-brand .site-title{font-family:var(--font-heading);font-size:1.4rem;font-weight:700;color:var(--c-text)}
.site-brand .site-tagline{font-size:.72rem;color:var(--c-text-light);display:none;margin-left:.5em;opacity:.7}
@media(min-width:768px){.site-brand .site-tagline{display:block;margin-left:0;margin-top:-.2em;font-size:.72rem}}

/* === NAVIGATION === */
.primary-nav ul{list-style:none;margin:0;padding:0;display:flex;gap:.2em;flex-wrap:wrap}
.primary-nav a{display:block;padding:.5em .8em;font-size:.9rem;font-weight:500;color:var(--c-text);text-decoration:none;border-radius:var(--radius);transition:background .15s}
.primary-nav a:hover,.primary-nav .current-menu-item>a{background:var(--c-surface)}
.primary-nav li{position:relative}
.primary-nav .sub-menu{display:none;position:absolute;top:100%;left:0;background:var(--c-bg);border:1px solid var(--c-border);border-radius:var(--radius);min-width:200px;padding:.4em 0;box-shadow:0 4px 12px rgba(0,0,0,.1);z-index:50;flex-direction:column}
.primary-nav li:hover>.sub-menu{display:flex}
.primary-nav .sub-menu a{padding:.5em 1em;font-size:.85rem}

/* Mobile nav toggle */
.nav-toggle{display:none;background:none;border:none;font-size:1.5rem;cursor:pointer;padding:.3em;color:var(--c-text)}
@media(max-width:767px){
  .nav-toggle{display:block}
  .primary-nav{display:none;width:100%;order:3}
  .primary-nav.open{display:block}
  .primary-nav ul{flex-direction:column}
  .primary-nav .sub-menu{position:static;box-shadow:none;border:none;padding-left:1em;display:none}
  .primary-nav li:hover>.sub-menu{display:flex}
  .header-inner{flex-wrap:wrap}
}

/* === BREADCRUMBS === */
.breadcrumbs{font-size:.82rem;color:var(--c-text-light);padding:.8em 0;max-width:var(--content-width);margin:0 auto}
.breadcrumbs a{color:var(--c-text-light)}
.breadcrumbs a:hover{color:var(--c-link)}
.breadcrumbs .sep{margin:0 .4em;opacity:.5}

/* === CATEGORY BADGES === */
.cat-badge{display:inline-block;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;padding:.25em .7em;border-radius:3px;text-decoration:none}
.cat-badge:hover{opacity:.85}
.cat-hamsters,.cat-small-furry{background:var(--c-hamster-bg);color:var(--c-hamster);border:1px solid var(--c-hamster)}
.cat-tortoises,.cat-reptiles-and-amphibians{background:var(--c-tortoise-bg);color:var(--c-tortoise);border:1px solid var(--c-tortoise)}
.cat-praying-mantis,.cat-insects,.cat-invertebrates{background:var(--c-mantis-bg);color:var(--c-mantis);border:1px solid var(--c-mantis)}
.cat-general,.cat-uncategorized{background:var(--c-general-bg);color:var(--c-general);border:1px solid var(--c-general)}

/* === HERO / FEATURED IMAGE === */
.article-hero{position:relative;width:100%;max-height:450px;overflow:hidden;margin-bottom:0;border-radius:0}
.article-hero img{width:100%;height:auto;object-fit:cover;max-height:450px}
.article-hero-overlay{position:absolute;bottom:0;left:0;right:0;height:60%;background:linear-gradient(transparent,rgba(0,0,0,.65));pointer-events:none}

/* === SINGLE ARTICLE === */
.article-header{padding:1.5em 0 1em}
.article-meta{display:flex;flex-wrap:wrap;gap:.8em;align-items:center;font-size:.85rem;color:var(--c-text-light);margin-top:.6em}
.article-meta a{color:var(--c-text-light)}
.reading-time{white-space:nowrap}

/* === TABLE OF CONTENTS === */
.toc-wrap{background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius);padding:1.2em 1.5em;margin:1.5em 0 2em}
.toc-wrap .toc-title{font-family:var(--font-heading);font-size:1.1rem;font-weight:700;margin-bottom:.6em;cursor:pointer;display:flex;justify-content:space-between;align-items:center}
.toc-wrap .toc-title::after{content:'▾';font-size:.8em;transition:transform .2s}
.toc-wrap.collapsed .toc-title::after{transform:rotate(-90deg)}
.toc-wrap.collapsed .toc-list{display:none}
.toc-list{list-style:none;margin:0;padding:0;font-size:.9rem}
.toc-list li{padding:.3em 0;border-bottom:1px solid var(--c-border)}
.toc-list li:last-child{border-bottom:none}
.toc-list a{text-decoration:none;color:var(--c-text)}
.toc-list a:hover{color:var(--c-link)}
.toc-list .toc-h3{padding-left:1.2em;font-size:.85rem}

/* === ARTICLE CONTENT === */
.article-content{padding:1em 0 2em}
.article-content h2{scroll-margin-top:80px}
.article-content h3{scroll-margin-top:80px}
.article-content img{border-radius:var(--radius);margin:1em 0}
.article-content figure{margin:1.5em 0}
.article-content figcaption{font-size:.82rem;color:var(--c-text-light);text-align:center;margin-top:.4em}

/* === QUICK ANSWER BOX === */
.quick-answer,.wp-block-pullquote,.info-box{background:#f0f7ff;border-left:4px solid #2196F3;padding:1em 1.2em;margin:1.5em 0;border-radius:var(--radius);font-size:.95rem;line-height:1.6}
@media(prefers-color-scheme:dark){
  .quick-answer,.wp-block-pullquote,.info-box{background:#1a2433 !important;border-left-color:#4da6ff !important;color:#e0e0e0 !important}
  .quick-answer *,.info-box *{color:#e0e0e0 !important}
  .quick-answer strong{color:#fff !important}
}

/* === TABLES === */
.article-content table{width:100%;border-collapse:collapse;margin:1.5em 0;font-size:.92rem;overflow-x:auto;display:block}
@media(min-width:600px){.article-content table{display:table}}
.article-content th,.article-content td{padding:.7em .8em;border:1px solid var(--c-border);text-align:left}
.article-content th{background:var(--c-surface);font-weight:600;white-space:nowrap}
.article-content tr:nth-child(even){background:var(--c-surface)}

/* === RELATED POSTS / FURTHER READING === */
.related-posts{border-top:2px solid var(--c-border);padding:2em 0;margin-top:2em}
.related-posts h2{border-bottom:none;margin-top:0;font-size:1.3rem}
.related-grid{display:grid;grid-template-columns:1fr;gap:1.2em;margin-top:1em}
@media(min-width:600px){.related-grid{grid-template-columns:repeat(3,1fr)}}
.related-card{border:1px solid var(--c-border);border-radius:var(--radius);overflow:hidden;transition:box-shadow .15s}
.related-card:hover{box-shadow:0 2px 8px rgba(0,0,0,.1)}
.related-card img{width:100%;height:150px;object-fit:cover}
.related-card .card-body{padding:.8em}
.related-card .card-title{font-family:var(--font-heading);font-size:.95rem;font-weight:600;line-height:1.3}
.related-card .card-title a{text-decoration:none}
.related-card .card-title a:hover{color:var(--c-link)}

/* === AUTHOR BOX === */
.author-box{display:flex;gap:1em;align-items:flex-start;padding:1.5em;background:var(--c-surface);border-radius:var(--radius);margin:2em 0}
.author-box .avatar{border-radius:50%;width:64px;height:64px;flex-shrink:0}
.author-box .author-name{font-weight:600;font-size:1rem;margin-bottom:.3em}
.author-box .author-bio{font-size:.88rem;color:var(--c-text-light);line-height:1.5}

/* === POST NAVIGATION === */
.post-nav{display:grid;grid-template-columns:1fr 1fr;gap:1.5em;padding:2em 0;border-top:1px solid var(--c-border);margin-top:2em}
.post-nav a{text-decoration:none;padding:1.2em;border:1px solid var(--c-border);border-radius:var(--radius);transition:background .15s;display:block;height:100%}
.post-nav a:hover{background:var(--c-surface)}
.post-nav .nav-label{font-size:.75rem;text-transform:uppercase;color:var(--c-text-light);letter-spacing:.05em}
.post-nav .nav-title{font-family:var(--font-heading);font-size:.9rem;font-weight:600;margin-top:.3em;display:block}
.post-nav .nav-next{text-align:right}
.post-nav .nav-next a{margin-left:auto}

/* === ARCHIVE / CARD GRID === */
.archive-header{padding:2em 0 1em;max-width:var(--content-width);margin:0 auto}
.archive-header h1{font-size:1.8rem}
.archive-desc{font-size:1rem;color:var(--c-text-light);margin-top:.5em;line-height:1.6}
.post-grid{display:grid;grid-template-columns:1fr;gap:1.5em;max-width:var(--site-width);margin:0 auto;padding:0 20px 3em}
@media(min-width:600px){.post-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:900px){.post-grid{grid-template-columns:repeat(3,1fr)}}
.post-card{border:1px solid var(--c-border);border-radius:var(--radius);overflow:hidden;transition:box-shadow .15s,transform .15s}
.post-card:hover{box-shadow:0 4px 16px rgba(0,0,0,.08);transform:translateY(-2px)}
.post-card .card-thumb{height:200px;overflow:hidden;display:block}
.post-card .card-thumb img{width:100%;height:100%;object-fit:cover}
.post-card .card-content{padding:1em}
.post-card .card-cat{margin-bottom:.5em}
.post-card .card-title{font-family:var(--font-heading);font-size:1.05rem;font-weight:600;line-height:1.35;margin-bottom:.4em}
.post-card .card-title a{text-decoration:none}
.post-card .card-title a:hover{color:var(--c-link)}
.post-card .card-excerpt{font-size:.88rem;color:var(--c-text-light);line-height:1.5}
.post-card .card-meta{font-size:.78rem;color:var(--c-text-light);margin-top:.6em}

/* === PAGINATION === */
.pagination{display:flex;justify-content:center;gap:.5em;padding:2em 0}
.pagination a,.pagination span{padding:.5em 1em;border:1px solid var(--c-border);border-radius:var(--radius);font-size:.9rem;text-decoration:none}
.pagination .current{background:var(--c-text);color:var(--c-bg);border-color:var(--c-text)}
.pagination a:hover{background:var(--c-surface)}

/* === HOMEPAGE === */
.home-hero{text-align:center;padding:3em 1em;background:var(--c-surface)}
.home-hero h1{font-size:2rem;margin-bottom:.5em}
.home-hero p{font-size:1.1rem;color:var(--c-text-light);max-width:600px;margin:0 auto .8em}
.home-hero .search-form{max-width:500px;margin:1em auto 0;display:flex;gap:.5em}
.home-hero .search-field{flex:1;padding:.7em 1em;border:1px solid var(--c-border);border-radius:var(--radius);font-size:1rem;background:var(--c-bg);color:var(--c-text)}
.home-hero .search-submit{padding:.7em 1.5em;background:var(--c-tortoise);color:#fff;border:none;border-radius:var(--radius);font-size:.95rem;cursor:pointer;font-weight:600}
.home-hero .search-submit:hover{opacity:.9}

.home-section{max-width:var(--site-width);margin:0 auto;padding:2em 20px}
.home-section h2{text-align:center;margin-bottom:1em;border-bottom:none}

.species-hubs{display:grid;grid-template-columns:1fr;gap:1.2em}
@media(min-width:600px){.species-hubs{grid-template-columns:repeat(3,1fr)}}
.species-card{border:2px solid var(--c-border);border-radius:var(--radius);padding:1.5em;text-align:center;text-decoration:none;transition:border-color .15s,transform .15s}
.species-card:hover{transform:translateY(-3px)}
.species-card .species-icon{font-size:2.5rem;margin-bottom:.5em}
.species-card .species-name{font-family:var(--font-heading);font-size:1.2rem;font-weight:700;margin-bottom:.3em}
.species-card .species-count{font-size:.85rem;color:var(--c-text-light)}
.species-card.hamster{border-color:var(--c-hamster)}
.species-card.hamster:hover{background:var(--c-hamster-bg)}
.species-card.tortoise{border-color:var(--c-tortoise)}
.species-card.tortoise:hover{background:var(--c-tortoise-bg)}
.species-card.mantis{border-color:var(--c-mantis)}
.species-card.mantis:hover{background:var(--c-mantis-bg)}

/* === FOOTER === */
.site-footer{background:var(--c-surface);border-top:1px solid var(--c-border);padding:2.5em 0 1.5em;margin-top:3em}
.footer-inner{display:grid;grid-template-columns:1fr;gap:2em;max-width:var(--site-width);margin:0 auto;padding:0 20px}
@media(min-width:600px){.footer-inner{grid-template-columns:repeat(3,1fr)}}
.footer-col h3{font-size:1rem;margin-bottom:.8em;font-family:var(--font-heading)}
.footer-col p,.footer-col li{font-size:.88rem;color:var(--c-text-light);line-height:1.6}
.footer-col ul{list-style:none;margin:0;padding:0}
.footer-col li{margin-bottom:.4em}
.footer-col a{text-decoration:none;color:var(--c-text-light)}
.footer-col a:hover{color:var(--c-link)}
.footer-bottom{text-align:center;padding:1.5em 20px 0;font-size:.82rem;color:var(--c-text-light);max-width:var(--site-width);margin:0 auto}

/* === 404 === */
.error-404{text-align:center;padding:4em 1em}
.error-404 h1{font-size:4rem;margin-bottom:.2em;color:var(--c-text-light)}
.error-404 p{font-size:1.1rem;color:var(--c-text-light);margin-bottom:1.5em}
.error-404 .search-form{max-width:400px;margin:0 auto 2em;display:flex;gap:.5em}
.error-404 .search-field{flex:1;padding:.7em 1em;border:1px solid var(--c-border);border-radius:var(--radius);font-size:1rem;background:var(--c-bg);color:var(--c-text)}
.error-404 .search-submit{padding:.7em 1.5em;background:var(--c-tortoise);color:#fff;border:none;border-radius:var(--radius);cursor:pointer;font-weight:600}

/* === PAGE === */
.page-content{padding:2em 0 3em}
.page-content h1{margin-bottom:1em}

/* === KADENCE BLOCK COMPATIBILITY === */
.kb-row-layout-wrap{display:block;margin:1em 0}
.kb-row-column-wrap{display:block}
.kt-row-column-wrap{display:flex;flex-wrap:wrap;gap:1em}
.kt-row-column-wrap>.kadence-column{flex:1;min-width:250px}
.kb-icon-list-items,.kb-icon-list-item-wrap{list-style:none;padding:0}
.kb-icon-list-item-wrap{display:flex;align-items:flex-start;gap:.5em;margin-bottom:.5em}
.kb-buttons-wrap{display:flex;flex-wrap:wrap;gap:.5em;margin:1em 0}
.kb-btn{display:inline-block;padding:.6em 1.2em;border-radius:var(--radius);font-weight:600;text-decoration:none}
.kb-tabs-wrap{margin:1em 0}
.kb-accordion-wrap{margin:1em 0}
.wp-block-kadence-tabs .kt-tabs-title-list{display:flex;list-style:none;padding:0;gap:0;border-bottom:2px solid var(--c-border)}
.wp-block-kadence-tabs .kt-tabs-title-list li{padding:.5em 1em;cursor:pointer;font-weight:600;font-size:.9rem}
.wp-block-kadence-tabs .kt-tab-inner-content{padding:1em 0}

/* === WORDPRESS BLOCKS === */
.wp-block-image{margin:1.5em 0}
.wp-block-gallery{display:flex;flex-wrap:wrap;gap:.5em;margin:1.5em 0}
.wp-block-separator{border:none;border-top:1px solid var(--c-border);margin:2em 0}
.wp-block-quote{border-left:4px solid var(--c-tortoise);padding:.8em 1.2em;margin:1.5em 0;background:var(--c-surface);border-radius:var(--radius)}
.wp-block-embed{margin:1.5em 0}
.wp-block-embed iframe{max-width:100%;border-radius:var(--radius)}
.has-text-align-center{text-align:center}
.alignwide{max-width:calc(var(--content-width) + 200px);margin-left:auto;margin-right:auto}
.alignfull{max-width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw)}

/* === SKIP LINK === */
.skip-link{position:absolute;top:-100%;left:50%;transform:translateX(-50%);background:var(--c-text);color:var(--c-bg);padding:.5em 1em;z-index:1000;border-radius:var(--radius)}
.skip-link:focus{top:10px}

/* === UTILITY === */
.screen-reader-text{clip:rect(1px,1px,1px,1px);position:absolute;height:1px;width:1px;overflow:hidden}

/* === LOGO TREATMENT === */
.site-brand .site-title{display:flex;align-items:baseline;gap:0;font-size:1.6rem}
.logo-text{font-family:Georgia,'Times New Roman',serif;font-weight:700;letter-spacing:-.02em;color:var(--c-text)}
.logo-paw{position:relative;display:inline-block}
.logo-paw::after{content:'🐾';position:absolute;top:50%;left:50%;transform:translate(-50%,-55%);font-size:.55em;line-height:1;pointer-events:none}
.logo-pets{font-family:Georgia,'Times New Roman',serif;font-weight:700;color:var(--c-tortoise);margin-left:.05em}

/* === SPECIES CARDS SVG ICONS === */
.species-card .species-icon{font-size:1rem;line-height:1;margin-bottom:.5em}
.species-card .species-icon svg{display:block;margin:0 auto}
.species-card.hamster .species-icon{color:var(--c-hamster)}
.species-card.tortoise .species-icon{color:var(--c-tortoise)}
.species-card.mantis .species-icon{color:var(--c-mantis)}

/* === CARD IMAGE FALLBACK (no-image cards) === */
.post-card .card-thumb:empty{display:none}
.post-card:not(:has(.card-thumb img)){border-left:4px solid var(--c-border)}
