/*
Theme Name: Verdentia
Theme URI: https://ecozap.es
Description: Tema ecologico para EcoZap — guias de sostenibilidad y vida verde.
Version: 1.0
Author: EcoZap
Text Domain: verdentia
*/

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

:root{
  --clr-leaf:#4CAF50;
  --clr-leaf-dark:#388E3C;
  --clr-bolt:#F9A825;
  --clr-bolt-dark:#F57F17;
  --clr-surface:#fff;
  --clr-canvas:#FAFAFA;
  --clr-text:#212121;
  --clr-text-muted:#757575;
  --clr-border:#E0E0E0;
  --clr-border-hover:#4CAF50;
  --wrap:1140px;
  --gap:1.5rem;
  --radius:4px;
  --ff-head:'Bitter',serif;
  --ff-body:'Raleway',sans-serif;
}

html{font-size:16px;scroll-behavior:smooth}
body{font-family:var(--ff-body);color:var(--clr-text);background:var(--clr-canvas);line-height:1.7}
img{max-width:100%;height:auto;display:block}
a{color:var(--clr-leaf-dark);text-decoration:none;transition:color .2s}
a:hover{color:var(--clr-bolt-dark)}
h1,h2,h3,h4,h5,h6{font-family:var(--ff-head);line-height:1.3;margin-bottom:.6em;color:var(--clr-text)}
h1{font-size:2rem}
h2{font-size:1.6rem}
h3{font-size:1.3rem}
p{margin-bottom:1em}
ul,ol{margin-bottom:1em;padding-left:1.5em}

/* ===== LAYOUT ===== */
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gap)}

/* ===== MASTHEAD ===== */
.masthead{background:var(--clr-surface);border-bottom:2px solid var(--clr-leaf);position:sticky;top:0;z-index:100}
.masthead .wrap{display:flex;align-items:center;justify-content:space-between;height:70px}
.brand-wrap{display:flex;align-items:center;gap:.6rem;text-decoration:none}
.brand-wrap img{height:42px;width:auto}
.brand-title{font-family:var(--ff-head);font-size:1.35rem;font-weight:700;color:var(--clr-leaf-dark)}

/* ===== TOP-NAV ===== */
.top-nav{display:flex;gap:.2rem;list-style:none;margin:0;padding:0}
.top-nav a{display:block;padding:.45rem .85rem;font-size:.9rem;font-weight:600;border-radius:var(--radius);transition:background .2s,color .2s}
.top-nav a:hover,.top-nav .current-menu-item>a{background:var(--clr-leaf);color:#fff}

.ham-btn{display:none;background:none;border:none;cursor:pointer;padding:.5rem}
.ham-btn span{display:block;width:24px;height:3px;background:var(--clr-text);margin:4px 0;border-radius:2px;transition:transform .3s}

/* ===== HERO ===== */
.hero-banner{background:linear-gradient(135deg,var(--clr-leaf-dark) 0%,var(--clr-leaf) 100%);color:#fff;padding:3.5rem 0;text-align:center}
.hero-banner h1{color:#fff;font-size:2.2rem;margin-bottom:.5rem}
.hero-banner p{font-size:1.15rem;opacity:.92;max-width:640px;margin:0 auto 1.5rem}
.hero-search{max-width:480px;margin:0 auto;position:relative}
.hero-search input{width:100%;padding:.8rem 1.2rem;border:none;border-radius:var(--radius);font-size:1rem;font-family:var(--ff-body)}
.hero-search input:focus{outline:2px solid var(--clr-bolt)}

/* ===== SECTION ===== */
.section-block{padding:3rem 0}
.section-block:nth-child(even){background:var(--clr-surface)}
.section-heading{text-align:center;margin-bottom:2rem}
.section-heading h2{position:relative;display:inline-block}
.section-heading h2::after{content:'';display:block;width:50px;height:3px;background:var(--clr-bolt);margin:.5rem auto 0}

/* ===== CARDS ===== */
.card-grid{display:grid;gap:var(--gap)}
.card-grid--3{grid-template-columns:repeat(3,1fr)}
.card-grid--4{grid-template-columns:repeat(4,1fr)}
.card-grid--2{grid-template-columns:repeat(2,1fr)}

.entry-card{border:1px solid var(--clr-border);border-radius:var(--radius);overflow:hidden;background:var(--clr-surface);transition:border-color .25s}
.entry-card:hover{border-color:var(--clr-border-hover)}
.entry-card__thumb{aspect-ratio:2.5/1;overflow:hidden;max-height:160px}
.entry-card__thumb img{width:100%;height:100%;object-fit:cover}
.entry-card__body{padding:1rem 1.2rem}
.entry-card__cat{font-size:.75rem;font-weight:700;text-transform:uppercase;color:var(--clr-bolt-dark);letter-spacing:.04em;margin-bottom:.35rem}
.entry-card__title{font-family:var(--ff-head);font-size:1.05rem;margin-bottom:.4rem}
.entry-card__title a{color:var(--clr-text)}
.entry-card__title a:hover{color:var(--clr-leaf)}
.entry-card__excerpt{font-size:.88rem;color:var(--clr-text-muted);line-height:1.55}
.entry-card__meta{font-size:.78rem;color:var(--clr-text-muted);margin-top:.6rem}

/* ===== TOOL CARDS ===== */
.tool-card{border:1px solid var(--clr-border);border-radius:var(--radius);padding:1.5rem;text-align:center;background:var(--clr-surface);transition:border-color .25s}
.tool-card:hover{border-color:var(--clr-leaf)}
.tool-card__icon{font-size:2.4rem;margin-bottom:.7rem}
.tool-card__title{font-family:var(--ff-head);font-size:1rem;margin-bottom:.35rem}
.tool-card__desc{font-size:.85rem;color:var(--clr-text-muted)}

/* ===== CATEGORY TILES ===== */
.cat-tile{display:flex;align-items:center;gap:.8rem;padding:1rem 1.2rem;border:1px solid var(--clr-border);border-radius:var(--radius);background:var(--clr-surface);transition:border-color .25s}
.cat-tile:hover{border-color:var(--clr-leaf)}
.cat-tile__icon{width:40px;height:40px;flex-shrink:0;display:flex;align-items:center;justify-content:center}
.cat-tile__icon svg{width:28px;height:28px;fill:var(--clr-leaf)}
.cat-tile__label{font-family:var(--ff-head);font-size:.95rem;font-weight:600}
.cat-tile__count{font-size:.78rem;color:var(--clr-text-muted)}

/* ===== PAGINATION ===== */
.paging-nav{text-align:center;padding:2rem 0}
.paging-nav .page-numbers{display:inline-block;padding:.45rem .8rem;margin:0 .15rem;border:1px solid var(--clr-border);border-radius:var(--radius);font-size:.9rem}
.paging-nav .page-numbers.current,.paging-nav .page-numbers:hover{background:var(--clr-leaf);color:#fff;border-color:var(--clr-leaf)}

/* ===== SINGLE / PAGE ===== */
.content-area{max-width:780px;margin:0 auto;padding:2.5rem var(--gap)}
.content-area .entry-thumb{margin-bottom:1.5rem;border-radius:var(--radius);overflow:hidden}
.content-area .entry-content h2{margin-top:1.8rem}
.content-area .entry-content img{border-radius:var(--radius);margin:1rem 0}
.content-area .entry-content blockquote{border-left:3px solid var(--clr-bolt);padding:.8rem 1.2rem;margin:1.2rem 0;background:#FFFDE7;border-radius:0 var(--radius) var(--radius) 0}
.content-area .entry-content table{width:100%;border-collapse:collapse;margin:1rem 0}
.content-area .entry-content th,.content-area .entry-content td{border:1px solid var(--clr-border);padding:.6rem .8rem;text-align:left}
.content-area .entry-content th{background:var(--clr-leaf);color:#fff;font-family:var(--ff-head)}

/* ===== AUTHOR BOX ===== */
.writer-box{display:flex;gap:1.2rem;padding:1.5rem;border:1px solid var(--clr-border);border-radius:var(--radius);margin-top:2.5rem;background:var(--clr-surface)}
.writer-box__photo{width:80px;height:80px;border-radius:50%;overflow:hidden;flex-shrink:0}
.writer-box__photo img{width:100%;height:100%;object-fit:cover}
.writer-box__name{font-family:var(--ff-head);font-weight:700;margin-bottom:.25rem}
.writer-box__bio{font-size:.88rem;color:var(--clr-text-muted)}

/* ===== SIDEBAR ===== */
.has-sidebar{display:grid;grid-template-columns:1fr 300px;gap:2rem;max-width:var(--wrap);margin:0 auto;padding:2rem var(--gap)}
.sidebar .widget{margin-bottom:1.5rem;padding:1.2rem;border:1px solid var(--clr-border);border-radius:var(--radius);background:var(--clr-surface)}
.sidebar .widget-title{font-family:var(--ff-head);font-size:1rem;margin-bottom:.8rem;padding-bottom:.5rem;border-bottom:2px solid var(--clr-bolt)}

/* ===== BREADCRUMBS ===== */
.crumbs{font-size:.82rem;color:var(--clr-text-muted);padding:.8rem 0;margin-bottom:1rem}
.crumbs a{color:var(--clr-leaf-dark)}
.crumbs span{margin:0 .3rem}

/* ===== FOOTER ===== */
.colophon{background:var(--clr-leaf-dark);color:rgba(255,255,255,.85);padding:3rem 0 1.5rem}
.colophon a{color:var(--clr-bolt)}
.colophon a:hover{color:#fff}
.foot-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap)}
.foot-block h4{font-family:var(--ff-head);color:#fff;margin-bottom:.8rem;font-size:.95rem}
.foot-block ul{list-style:none;padding:0}
.foot-block li{margin-bottom:.35rem}
.foot-block li a{font-size:.88rem}
.foot-bottom{margin-top:2rem;padding-top:1rem;border-top:1px solid rgba(255,255,255,.2);text-align:center;font-size:.82rem;opacity:.7}

/* ===== SEARCH RESULTS ===== */
.search-header{padding:2rem 0;background:var(--clr-surface);border-bottom:1px solid var(--clr-border);text-align:center}
.search-header h1{font-size:1.6rem}

/* ===== 404 ===== */
.not-found{text-align:center;padding:5rem var(--gap)}
.not-found h1{font-size:5rem;color:var(--clr-leaf);margin-bottom:.5rem}
.not-found p{font-size:1.15rem;color:var(--clr-text-muted);margin-bottom:1.5rem}
.btn-leaf{display:inline-block;padding:.7rem 1.8rem;background:var(--clr-leaf);color:#fff;border-radius:var(--radius);font-weight:600;transition:background .2s}
.btn-leaf:hover{background:var(--clr-leaf-dark);color:#fff}

/* ===== DROPDOWN ===== */
.top-nav{position:relative}
.top-nav li{position:relative}
.top-nav .sub-menu{display:none;position:absolute;top:100%;left:0;background:var(--clr-surface);border:1px solid var(--clr-border);border-radius:var(--radius);min-width:200px;padding:.4rem 0;z-index:200;box-shadow:0 4px 12px rgba(0,0,0,.08)}
.top-nav li:hover>.sub-menu{display:block}
.top-nav .sub-menu a{padding:.4rem 1rem;font-size:.85rem;white-space:nowrap}
.top-nav .sub-menu a:hover{background:var(--clr-canvas)}

/* ===== RESPONSIVE ===== */
@media(max-width:900px){
  .card-grid--3,.card-grid--4{grid-template-columns:repeat(2,1fr)}
  .foot-grid{grid-template-columns:repeat(2,1fr)}
  .has-sidebar{grid-template-columns:1fr}
}
@media(max-width:640px){
  .card-grid--3,.card-grid--4,.card-grid--2{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr}
  .masthead .wrap{flex-wrap:wrap}
  .top-nav{display:none;flex-direction:column;width:100%;padding:.5rem 0}
  .top-nav.open{display:flex}
  .ham-btn{display:block}
  .hero-banner{padding:2.5rem 0}
  .hero-banner h1{font-size:1.6rem}
  .content-area{padding:1.5rem var(--gap)}
  h1{font-size:1.6rem}
  .top-nav .sub-menu{position:static;border:none;box-shadow:none;padding-left:1rem}
  .top-nav li:hover>.sub-menu{display:block}
  .top-nav.open .sub-menu{display:block}
}

/* Category icon size */
.section-block svg { width: 48px; height: 48px; fill: var(--clr-leaf); }

/* Smaller thumbs on listing pages */
.entry-card__thumb { aspect-ratio: 16/9; max-height: 140px; }