/*
Theme Name:   Directory Finder
Theme URI:    https://example.org/directory-finder
Author:       Directory Themes
Description:  A calm, text-first theme for local business directories: search bar, category grid, listing cards.
Version:      2.4.1
Tested up to: 6.4
Requires PHP: 7.4
License:      GNU General Public License v3 or later
Text Domain:  directory-finder
*/

:root{
  --ink:#16211f;--text:#42504d;--muted:#7c8a87;--line:#dfe6e4;
  --paper:#ffffff;--wash:#f3f7f6;--teal:#10695e;--teal-dark:#0a4c43;
  --sand:#f6efe3;--amber:#b5751f;--radius:10px;
}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--text);
  font:16.5px/1.72 "Source Sans 3",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased}
h1,h2,h3,h4{color:var(--ink);font-family:Georgia,"Iowan Old Style","Times New Roman",serif;font-weight:600;margin:0 0 .5em;line-height:1.24;letter-spacing:-.01em}
h1{font-size:2.45rem}h2{font-size:1.85rem}h3{font-size:1.2rem}h4{font-size:1rem}
p{margin:0 0 1em}
a{color:var(--teal);text-decoration:none}
a:hover{color:var(--teal-dark);text-decoration:underline}
img{max-width:100%;height:auto;display:block}
.wrap{max-width:1140px;margin:0 auto;padding:0 22px}
.skip-link{position:absolute;left:-999px}
.skip-link:focus{left:12px;top:12px;background:#fff;padding:.6em 1em;z-index:50}

/* header */
.site-header{background:#fff;border-bottom:1px solid var(--line)}
.header-inner{display:flex;align-items:center;gap:2em;min-height:74px}
.brand{display:flex;align-items:center;gap:.65em;color:var(--teal)}
.brand:hover{text-decoration:none}
.brand-mark{flex:0 0 auto}
.brand-text{display:flex;flex-direction:column;line-height:1.15}
.brand-text strong{font-family:Georgia,serif;font-size:1.32rem;color:var(--ink);letter-spacing:-.02em}
.brand-text small{font-size:.72rem;text-transform:uppercase;letter-spacing:.13em;color:var(--muted)}
.main-nav{margin-left:auto}
.main-nav ul{display:flex;gap:1.7em;list-style:none;margin:0;padding:0}
.main-nav a{color:var(--ink);font-size:.94rem;font-weight:600;padding:.3em 0;border-bottom:2px solid transparent}
.main-nav a:hover{border-color:var(--teal);text-decoration:none}
.header-tools{display:flex;align-items:center;gap:1.1em}
.tool-link{font-size:.92rem;font-weight:600;color:var(--ink)}
.button{display:inline-block;border:0;border-radius:var(--radius);padding:.72em 1.25em;font:inherit;font-weight:600;line-height:1.3;cursor:pointer;transition:background .16s,box-shadow .16s}
.button-solid{background:var(--teal);color:#fff}
.button-solid:hover{background:var(--teal-dark);color:#fff;text-decoration:none}
.button-outline{background:#fff;color:var(--teal);box-shadow:inset 0 0 0 1.5px var(--teal)}
.button-outline:hover{background:var(--wash);text-decoration:none}
.button-sand{background:var(--sand);color:var(--ink)}
.button-sand:hover{background:#efe5d3;text-decoration:none}
.button-lg{padding:.92em 1.55em;font-size:1.02rem}

/* page base */
.site-main{min-height:56vh}
.entry-header{margin:0 0 1.2em}
.entry-title{font-size:2.1rem}
.eyebrow{display:inline-block;font-size:.76rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--amber);margin-bottom:.7em}

/* hero with search */
.search-hero{background:linear-gradient(180deg,#eef5f3 0%,#fff 100%);border-bottom:1px solid var(--line);padding:3.6em 0 3em}
.search-hero h1{font-size:2.9rem;max-width:20ch}
.search-hero .lead{font-size:1.12rem;max-width:60ch;color:var(--text)}
.search-form{display:flex;gap:.6em;margin-top:1.6em;max-width:640px;flex-wrap:wrap}
.search-form input[type=search]{flex:1 1 260px;border:1px solid #cfdad7;border-radius:var(--radius);padding:.85em 1em;font:inherit;background:#fff}
.search-form input[type=search]:focus{outline:2px solid var(--teal);outline-offset:1px}
.search-form select{border:1px solid #cfdad7;border-radius:var(--radius);padding:.85em .9em;font:inherit;background:#fff;color:var(--ink)}
.hero-hint{margin-top:.9em;font-size:.88rem;color:var(--muted)}

/* stats strip */
.facts{background:var(--ink);color:#c8d6d3}
.facts .wrap{display:flex;flex-wrap:wrap;gap:2.4em;padding:1.05em 22px;font-size:.9rem}
.facts strong{color:#fff}

/* category grid */
.section{padding:3.2em 0}
.section-wash{background:var(--wash)}
.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:2em;margin-bottom:1.6em;flex-wrap:wrap}
.section-head h2{margin:0}
.more-link{font-weight:600;font-size:.94rem}
.cat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.1em;list-style:none;margin:0;padding:0}
.cat-card{display:block;height:100%;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.25em 1.3em;color:inherit}
.cat-card:hover{border-color:var(--teal);text-decoration:none;box-shadow:0 6px 18px rgba(16,105,94,.08)}
.cat-card .count{display:block;font-size:.8rem;color:var(--muted);margin-top:.35em}
.cat-icon{color:var(--teal);display:block;margin-bottom:.6em}

/* listings */
.listing-list{list-style:none;margin:0;padding:0;display:grid;gap:1em}
.listing{display:grid;grid-template-columns:74px 1fr auto;gap:1.2em;align-items:start;
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.15em 1.3em}
.listing-avatar{width:74px;height:74px;border-radius:8px;background:var(--wash);display:grid;place-items:center;color:var(--teal);font-family:Georgia,serif;font-size:1.5rem}
.listing h3{margin-bottom:.2em;font-size:1.12rem}
.listing-meta{font-size:.86rem;color:var(--muted);margin-bottom:.5em}
.listing p{margin:0;font-size:.95rem}
.listing-side{text-align:right;font-size:.85rem;color:var(--muted);white-space:nowrap}
.badge{display:inline-block;background:var(--sand);color:#7a5416;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;padding:.25em .6em;border-radius:5px}
.tags{display:flex;gap:.4em;flex-wrap:wrap;margin-top:.6em}
.tag{font-size:.75rem;background:var(--wash);color:var(--teal-dark);border-radius:4px;padding:.2em .55em}

/* article list */
.post-list{display:grid;gap:1.3em}
.post-item{border-bottom:1px solid var(--line);padding-bottom:1.2em}
.post-item:last-child{border-bottom:0}
.post-item h3{margin-bottom:.25em}
.post-meta{font-size:.84rem;color:var(--muted)}

/* entry content */
.entry-content{max-width:72ch}
.entry-content h2{margin-top:1.7em}
.entry-content ul,.entry-content ol{padding-left:1.35em}
.entry-content li{margin-bottom:.4em}

/* forms */
.field{margin-bottom:1.05em}
.field label{display:block;font-weight:600;color:var(--ink);font-size:.93rem;margin-bottom:.3em}
.field input,.field select,.field textarea{width:100%;border:1px solid #cfdad7;border-radius:8px;padding:.72em .85em;font:inherit;background:#fff}
.field textarea{min-height:150px;resize:vertical}
.form-note{font-size:.85rem;color:var(--muted)}

/* CTA */
.cta-strip{background:var(--teal);color:#dff0ec;padding:2.9em 0}
.cta-strip h2{color:#fff}
.cta-strip .cta-inner{display:flex;align-items:center;justify-content:space-between;gap:2em;flex-wrap:wrap}
.cta-strip p{margin:0;max-width:52ch}

/* footer */
.site-footer{background:var(--ink);color:#a9bab6;padding:2.9em 0 1.4em;font-size:.92rem}
.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:2em}
.site-footer h4{color:#fff;font-family:inherit;font-size:.82rem;text-transform:uppercase;letter-spacing:.12em;margin-bottom:.9em}
.site-footer ul{list-style:none;margin:0;padding:0}
.site-footer li{margin-bottom:.5em}
.site-footer a{color:#cfe0dc}
.site-footer a:hover{color:#fff}
.footer-brand{display:block;font-family:Georgia,serif;font-size:1.2rem;color:#fff;margin-bottom:.6em}
.footer-mail{margin-top:.6em}
.footer-legal{border-top:1px solid #2c3a37;margin-top:2.2em;padding-top:1.1em;display:flex;justify-content:space-between;gap:1em;flex-wrap:wrap;font-size:.82rem;color:#839792}

/* 404 and login extras */
.error404 .site-main,.login .site-main{max-width:640px;margin:0 auto;padding:4em 22px}
.search-again{display:flex;gap:.5em;margin-top:1.4em;flex-wrap:wrap}

@media (max-width:980px){
  .cat-grid{grid-template-columns:repeat(2,1fr)}
  .footer-grid{grid-template-columns:1fr 1fr}
  .header-inner{flex-wrap:wrap;gap:1em;padding:.8em 0}
  .main-nav{margin-left:0;order:3;width:100%}
  .main-nav ul{gap:1.3em;flex-wrap:wrap}
  .header-tools{margin-left:auto}
}
@media (max-width:620px){
  h1{font-size:2rem}
  .search-hero h1{font-size:2.2rem}
  .cat-grid{grid-template-columns:1fr}
  .listing{grid-template-columns:1fr}
  .listing-avatar{width:56px;height:56px;font-size:1.2rem}
  .listing-side{text-align:left}
  .footer-grid{grid-template-columns:1fr}
  .facts .wrap{gap:1.2em;font-size:.85rem}
}