/*
Theme Name: GoodHomeHub
Theme URI: https://goodhomehub.net
Author: Ignite Media Group
Author URI: https://goodhomehub.net
Description: Custom magazine-style WordPress theme for GoodHomeHub.net, a home & lifestyle content site covering Kitchen, Bathrooms, and Outdoors. Clean red-and-white editorial design inspired by classic home-and-living magazine sites. No social icons; built-in newsletter signup and unsubscribe handling.
Version: 1.0
Requires at least: 6.0
Requires PHP: 7.4
Tested up to: 6.5
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: goodhomehub
*/

/* -------------------------------------------------
   0. Variables (fallback for browsers via custom props)
------------------------------------------------- */
:root{
  --ghh-red: #C8102E;
  --ghh-red-dark: #a30e26;
  --ghh-ink: #1f1f1f;
  --ghh-gray: #6b6b6b;
  --ghh-light: #f7f5f2;
  --ghh-border: #e6e2dc;
  --ghh-white: #ffffff;
  --ghh-maxw: 1180px;
  --ghh-radius: 6px;
}

/* -------------------------------------------------
   1. Reset & base
------------------------------------------------- */
*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0;
  font-family: Georgia, 'Times New Roman', serif;
  color: var(--ghh-ink);
  background: var(--ghh-white);
  line-height:1.65;
  font-size:17px;
}
img{max-width:100%;height:auto;display:block;}
a{color:var(--ghh-red);text-decoration:none;}
a:hover{text-decoration:underline;}
h1,h2,h3,h4{
  font-family: 'Playfair Display', Georgia, 'Times New Roman', serif;
  font-weight:700;
  line-height:1.2;
  margin:0 0 .5em;
  color:var(--ghh-ink);
}
p{margin:0 0 1.2em;}
ul{margin:0 0 1.2em;padding-left:1.2em;}
.container{max-width:var(--ghh-maxw);margin:0 auto;padding:0 20px;}
.btn{
  display:inline-block;
  background:var(--ghh-red);
  color:var(--ghh-white);
  font-family: 'DejaVu Sans', Arial, sans-serif;
  font-weight:700;
  letter-spacing:.5px;
  text-transform:uppercase;
  font-size:13px;
  padding:12px 26px;
  border:none;
  border-radius:var(--ghh-radius);
  cursor:pointer;
  text-decoration:none;
}
.btn:hover{background:var(--ghh-red-dark);text-decoration:none;}
.eyebrow{
  font-family:'DejaVu Sans', Arial, sans-serif;
  font-weight:700;
  letter-spacing:1.5px;
  text-transform:uppercase;
  font-size:12px;
  color:var(--ghh-red);
}
.screen-reader-text{position:absolute;left:-9999px;}

/* -------------------------------------------------
   2. Top utility bar
------------------------------------------------- */
.ghh-topbar{
  background:var(--ghh-ink);
  color:#fff;
  font-family:'DejaVu Sans', Arial, sans-serif;
  font-size:12.5px;
  letter-spacing:.5px;
}
.ghh-topbar .container{display:flex;justify-content:space-between;align-items:center;padding:6px 20px;}
.ghh-topbar a{color:#fff;opacity:.85;}
.ghh-topbar a:hover{opacity:1;text-decoration:underline;}

/* -------------------------------------------------
   3. Header
------------------------------------------------- */
.ghh-header{
  border-bottom:4px solid var(--ghh-red);
  background:var(--ghh-white);
  padding:18px 0;
}
.ghh-header .container{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  flex-wrap:wrap;
}
.ghh-logo img{max-height:56px;width:auto;}
.ghh-logo{display:inline-block;}

.ghh-nav-toggle{
  display:none;
  background:none;
  border:2px solid var(--ghh-ink);
  border-radius:4px;
  padding:8px 10px;
  cursor:pointer;
  font-size:20px;
  line-height:1;
}

.ghh-primary-nav ul{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  gap:28px;
  flex-wrap:wrap;
}
.ghh-primary-nav a{
  font-family:'DejaVu Sans', Arial, sans-serif;
  font-weight:700;
  letter-spacing:.5px;
  text-transform:uppercase;
  font-size:14px;
  color:var(--ghh-ink);
}
.ghh-primary-nav a:hover{color:var(--ghh-red);text-decoration:none;}

@media (max-width: 780px){
  .ghh-nav-toggle{display:inline-block;}
  .ghh-primary-nav{display:none;width:100%;order:3;}
  .ghh-primary-nav.is-open{display:block;}
  .ghh-primary-nav ul{flex-direction:column;gap:14px;padding:18px 0 6px;}
}

/* -------------------------------------------------
   4. Hero (front page)
------------------------------------------------- */
.ghh-hero{
  background:var(--ghh-light);
  border-bottom:1px solid var(--ghh-border);
  padding:48px 0 40px;
  margin-bottom:40px;
}
.ghh-hero-inner{display:flex;gap:40px;align-items:center;flex-wrap:wrap;}
.ghh-hero-text{flex:1 1 420px;}
.ghh-hero-text h1{font-size:42px;margin-bottom:.4em;}
.ghh-hero-text p{font-size:19px;color:#3a3a3a;}
.ghh-hero-img{flex:1 1 420px;}
.ghh-hero-img img{border-radius:var(--ghh-radius);}

/* -------------------------------------------------
   5. Section headers
------------------------------------------------- */
.ghh-section{padding:0 0 48px;}
.ghh-section-head{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  border-bottom:2px solid var(--ghh-ink);
  margin-bottom:26px;
  padding-bottom:10px;
}
.ghh-section-head h2{font-size:28px;margin:0;}
.ghh-section-head .view-all{
  font-family:'DejaVu Sans', Arial, sans-serif;
  font-weight:700;
  font-size:13px;
  text-transform:uppercase;
  letter-spacing:.5px;
}

/* -------------------------------------------------
   6. Card grid
------------------------------------------------- */
.ghh-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:30px;
}
@media (max-width:900px){.ghh-grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:600px){.ghh-grid{grid-template-columns:1fr;}}

.ghh-card{background:var(--ghh-white);}
.ghh-card .thumb{
  display:block;
  aspect-ratio:4/3;
  overflow:hidden;
  background:var(--ghh-border);
  border-radius:var(--ghh-radius);
  margin-bottom:14px;
}
.ghh-card .thumb img{width:100%;height:100%;object-fit:cover;}
.ghh-card .cat{font-family:'DejaVu Sans', Arial, sans-serif;font-weight:700;font-size:11.5px;letter-spacing:1px;text-transform:uppercase;color:var(--ghh-red);margin-bottom:6px;display:inline-block;}
.ghh-card h3{font-size:21px;margin-bottom:8px;}
.ghh-card h3 a{color:var(--ghh-ink);}
.ghh-card h3 a:hover{color:var(--ghh-red);text-decoration:none;}
.ghh-card p{color:#4a4a4a;font-size:15.5px;margin-bottom:0;}
.ghh-card .meta{
  font-family:'DejaVu Sans', Arial, sans-serif;
  font-size:12.5px;
  color:var(--ghh-gray);
  margin-top:8px;
}

/* -------------------------------------------------
   7. Category banner (archive header)
------------------------------------------------- */
.ghh-cat-banner{
  background:var(--ghh-red);
  color:#fff;
  padding:44px 0;
  margin-bottom:44px;
}
.ghh-cat-banner .eyebrow{color:#ffe3e3;}
.ghh-cat-banner h1{color:#fff;font-size:40px;margin:.15em 0 .3em;}
.ghh-cat-banner p{color:#ffe9e9;font-size:17px;margin:0;max-width:700px;}

/* -------------------------------------------------
   8. Single article
------------------------------------------------- */
.ghh-article-head{max-width:760px;margin:0 auto 26px;text-align:left;}
.ghh-article-head .eyebrow{margin-bottom:10px;display:inline-block;}
.ghh-article-head h1{font-size:38px;}
.ghh-article-meta{
  font-family:'DejaVu Sans', Arial, sans-serif;
  font-size:13.5px;
  color:var(--ghh-gray);
  border-top:1px solid var(--ghh-border);
  border-bottom:1px solid var(--ghh-border);
  padding:12px 0;
  margin:18px 0 30px;
}
.ghh-article-feat{max-width:900px;margin:0 auto 34px;}
.ghh-article-feat img{border-radius:var(--ghh-radius);}
.ghh-article-body{max-width:760px;margin:0 auto;font-size:18.5px;}
.ghh-article-body h2{font-size:27px;margin-top:1.4em;}
.ghh-article-body h3{font-size:22px;margin-top:1.2em;}
.ghh-article-body ul li, .ghh-article-body ol li{margin-bottom:.5em;}
.ghh-article-body blockquote{
  border-left:4px solid var(--ghh-red);
  margin:1.6em 0;
  padding:.2em 0 .2em 1.2em;
  font-style:italic;
  color:#333;
}

.ghh-related{max-width:900px;margin:60px auto 0;border-top:2px solid var(--ghh-ink);padding-top:28px;}

/* -------------------------------------------------
   9. Newsletter box
------------------------------------------------- */
.ghh-newsletter-box{
  background:var(--ghh-ink);
  color:#fff;
  border-radius:var(--ghh-radius);
  padding:34px;
  max-width:900px;
  margin:50px auto;
  text-align:center;
}
.ghh-newsletter-box h3{color:#fff;font-size:26px;margin-bottom:8px;}
.ghh-newsletter-box p{color:#d8d8d8;margin-bottom:20px;}
.ghh-form{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;max-width:480px;margin:0 auto;}
.ghh-form input[type="email"], .ghh-form input[type="text"]{
  flex:1 1 240px;
  padding:12px 14px;
  border:1px solid var(--ghh-border);
  border-radius:var(--ghh-radius);
  font-family:'DejaVu Sans', Arial, sans-serif;
  font-size:14px;
}
.ghh-form-note{font-size:12.5px;color:var(--ghh-gray);margin-top:12px;}
.ghh-notice{
  font-family:'DejaVu Sans', Arial, sans-serif;
  font-size:14px;
  padding:12px 16px;
  border-radius:var(--ghh-radius);
  margin:0 auto 20px;
  max-width:480px;
}
.ghh-notice.success{background:#e6f4ea;color:#1e5e34;border:1px solid #b7dfc3;}
.ghh-notice.error{background:#fce8e8;color:#8a1c1c;border:1px solid #f3bcbc;}

/* Standalone newsletter / unsubscribe page styling */
.ghh-page-form{max-width:600px;margin:0 auto 60px;background:var(--ghh-light);padding:40px;border-radius:var(--ghh-radius);text-align:center;}
.ghh-page-form .ghh-form{max-width:420px;}

/* -------------------------------------------------
   10. Footer
------------------------------------------------- */
.ghh-footer{background:var(--ghh-red);color:#fff;margin-top:60px;padding:50px 0 20px;}
.ghh-footer a{color:#fff;}
.ghh-footer a:hover{opacity:.85;}
.ghh-footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1.4fr;gap:32px;}
@media (max-width:800px){.ghh-footer-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:520px){.ghh-footer-grid{grid-template-columns:1fr;}}
.ghh-footer h4{
  font-family:'DejaVu Sans', Arial, sans-serif;
  font-size:13px;
  letter-spacing:1px;
  text-transform:uppercase;
  color:#ffe3e3;
  margin-bottom:16px;
}
.ghh-footer ul{list-style:none;margin:0;padding:0;}
.ghh-footer li{margin-bottom:8px;font-family:'DejaVu Sans', Arial, sans-serif;font-size:14px;}
.ghh-footer .ghh-footer-logo img{max-height:40px;filter:brightness(0) invert(1);margin-bottom:14px;}
.ghh-footer .ghh-footer-about{font-size:14px;color:#ffe9e9;max-width:320px;}
.ghh-footer-bottom{
  border-top:1px solid rgba(255,255,255,.25);
  margin-top:36px;
  padding-top:18px;
  font-family:'DejaVu Sans', Arial, sans-serif;
  font-size:12.5px;
  color:#ffe3e3;
  display:flex;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:10px;
}
.ghh-footer-newsletter input[type="email"]{
  width:100%;
  padding:10px 12px;
  border-radius:var(--ghh-radius);
  border:none;
  margin-bottom:10px;
  font-family:'DejaVu Sans', Arial, sans-serif;
}
.ghh-footer-newsletter .btn{width:100%;text-align:center;background:#1f1f1f;}
.ghh-footer-newsletter .btn:hover{background:#000;}

/* -------------------------------------------------
   11. Pagination / misc
------------------------------------------------- */
.ghh-pagination{display:flex;gap:10px;justify-content:center;margin:40px 0;font-family:'DejaVu Sans', Arial, sans-serif;}
.ghh-pagination a, .ghh-pagination span{
  padding:8px 14px;border:1px solid var(--ghh-border);border-radius:4px;font-size:14px;
}
.ghh-pagination .current{background:var(--ghh-red);color:#fff;border-color:var(--ghh-red);}

.ghh-page-content{max-width:760px;margin:0 auto 60px;font-size:18px;}
.ghh-page-content h1{font-size:36px;margin-bottom:.6em;}
.ghh-page-content h2{font-size:24px;}