/* ============================================================
   GoodHomeFinds — main.css
   Consolidated <style> block from the design handoff (the Home
   file is the most complete) plus extra classes for Article,
   Category, Comparison, Contact, Search and the legal pages.
   ============================================================ */

*{box-sizing:border-box}
:root{--paper:#faf7f0;--paper2:#f2eddf;--paper3:#e8e0cc;--card:#ffffff;--ink:#14241c;--mut:rgba(20,36,28,.6);--mut2:rgba(20,36,28,.42);--line:rgba(20,36,28,.12);--accent:#2f7d5c;--accent-d:#225e44;--amber:#ecb24c;--amber-d:#cf9430;--tone:#7a5c44;--teal:#4f8a8a;--olive:#8a9a4f}
html{scroll-behavior:smooth}
#rooms,#index,#guides,#newsletter,#faq{scroll-margin-top:92px}
html,body{margin:0;padding:0;background:var(--paper);color:var(--ink);font-family:'Manrope',system-ui,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:clip}
::selection{background:rgba(47,125,92,.16)}
a{color:inherit;text-decoration:none}
input,button,textarea,select{font-family:inherit}
summary::-webkit-details-marker{display:none}summary::marker{content:''}
img{max-width:100%;height:auto}
.gh-d{font-family:'Figtree',sans-serif}
.gh-script{font-family:'Caveat',cursive}
.gh-eye{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}

/* ---------- Scroll-Reveal ---------- */
[data-rv]{opacity:0;transform:translateY(26px);transition:opacity .8s cubic-bezier(.22,.61,.36,1),transform .8s cubic-bezier(.22,.61,.36,1)}
[data-rv].in{opacity:1;transform:none}

/* ---------- Animated underline link ---------- */
.gh-link{position:relative}
.gh-link::after{content:'';position:absolute;left:0;right:100%;bottom:-3px;height:2px;border-radius:2px;background:var(--accent);transition:right .35s}
.gh-link:hover::after{right:0}

/* ---------- Buttons / cards / tiles / rows (hover) ---------- */
.gh-btn{transition:transform .3s,box-shadow .3s}
.gh-btn:hover{transform:translateY(-2px);box-shadow:0 14px 28px rgba(47,125,92,.24)}
.gh-card{transition:transform .4s cubic-bezier(.22,.61,.36,1),box-shadow .4s}
.gh-card:hover{transform:translateY(-6px);box-shadow:0 24px 50px rgba(20,36,28,.12)}
.gh-card:hover .gh-img{transform:scale(1.05)}
.gh-tile{transition:transform .4s cubic-bezier(.22,.61,.36,1),box-shadow .4s}
.gh-tile:hover{transform:translateY(-4px);box-shadow:0 22px 44px rgba(20,36,28,.16)}
.gh-tile:hover .gh-img{transform:scale(1.07)}
.gh-row{transition:background .3s,transform .3s}
.gh-row:hover{background:var(--paper);transform:translateX(3px)}
.gh-row:hover .gh-img{transform:scale(1.08)}

/* ---------- Keyframes / marquee ---------- */
.gh-marq{animation:ghmarq 34s linear infinite;will-change:transform}
@keyframes ghmarq{to{transform:translateX(-50%)}}
@keyframes ghdash{to{stroke-dashoffset:0}}
@keyframes ghfloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}

/* ---------- FAQ (details) ---------- */
.gh-faq summary:hover .gh-fq{color:var(--accent)}
.gh-faq[open] .gh-fic{transform:rotate(45deg);background:var(--accent);border-color:var(--accent);color:#fff}
.gh-faq[open] .gh-fq{color:var(--accent)}
.gh-faq[open] > .gh-fa{animation:ghfaq .4s cubic-bezier(.22,.61,.36,1)}
@keyframes ghfaq{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}

/* ---------- Room bento (Home) ---------- */
.gh-bento{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:198px;gap:14px;grid-template-areas:"a a b b" "a a c d" "e e f f"}
@media(max-width:920px){.gh-fotw{grid-template-columns:1fr!important}.gh-2col{grid-template-columns:1fr!important}.gh-process{grid-template-columns:1fr!important}.gh-bento{grid-template-columns:1fr 1fr;grid-auto-rows:176px;grid-template-areas:"a a" "b c" "d e" "f f"}}
@media(max-width:620px){.gh-nav-d{display:none!important}.gh-hide-sm{display:none!important}.gh-bento{grid-template-columns:1fr;grid-auto-rows:158px;grid-template-areas:"a" "b" "c" "d" "e" "f"}}

/* ---------- Image placeholder (replaces prototype image slots) ---------- */
.gh-ph-img{display:block;width:100%;height:100%;background:linear-gradient(150deg,#f1e7d0 0%,var(--paper2) 52%,#e3d6b6 100%);position:relative}
.gh-ph-img::after{content:"GoodHomeFinds";position:absolute;inset:0;display:grid;place-items:center;font-family:'Figtree',sans-serif;font-weight:800;font-size:clamp(15px,2.6vw,22px);color:rgba(47,125,92,.34);letter-spacing:-.01em}

/* ---------- Post card — CLASS-BASED (robust, independent of inline styles) ----------
   Layout/look come entirely from these classes so cards still look correct
   even when inline styles are stripped (optimizer / AMP / stale file). */
.gh-postgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:20px;align-items:stretch}
@media(max-width:540px){.gh-postgrid{grid-template-columns:1fr;gap:18px}}
.gh-card{position:relative;display:flex;flex-direction:column;height:100%;border-radius:20px;overflow:hidden;background:var(--card);border:1px solid var(--line);box-shadow:0 14px 32px rgba(20,36,28,.06);color:inherit;text-decoration:none}
.gh-card__link{color:inherit;text-decoration:none}
.gh-card__link::after{content:"";position:absolute;inset:0;z-index:1}
.gh-card__media{position:relative;display:block;aspect-ratio:4/3;min-height:150px;overflow:hidden;background:linear-gradient(150deg,#f1e7d0,var(--paper2) 55%,#e3d6b6)}
.gh-card__media>img,.gh-card__media .gh-img,.gh-card__media .gh-ph-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.22,.61,.36,1)}
.gh-card__cat{position:absolute;left:12px;top:12px;z-index:3;padding:5px 11px;border-radius:999px;background:rgba(255,255,255,.92);color:var(--accent);font-size:10.5px;font-weight:800;letter-spacing:.02em}
.gh-card__body{display:flex;flex-direction:column;flex:1;padding:17px 19px 19px}
.gh-card__title{margin:0;font-family:'Figtree',sans-serif;font-size:18.5px;font-weight:700;line-height:1.2;color:var(--ink);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.4em}
.gh-card__meta{display:flex;align-items:center;gap:9px;margin-top:auto;padding-top:11px;font-size:11.5px;font-weight:500;color:var(--mut)}
.gh-card__meta .gh-dot{opacity:.5}
/* Pinterest "Save" button overlay (class-based) */
.gh-pin--mini,.gh-pin--card{position:absolute;top:13px;right:13px;z-index:4;background:#e60023;color:#fff;box-shadow:0 8px 20px rgba(230,0,35,.4);cursor:pointer;opacity:0;transform:translateY(-6px);transition:opacity .3s,transform .3s,filter .25s}
.gh-card:hover .gh-pin,.gh-pin:focus-visible{opacity:1;transform:none}
.gh-pin:hover{filter:brightness(1.08)}
.gh-pin--mini{display:grid;place-items:center;width:32px;height:32px;border-radius:50%}
.gh-pin--card{display:inline-flex;align-items:center;gap:6px;padding:8px 13px;border-radius:999px;font-size:11.5px;font-weight:800}
@media(hover:none){.gh-pin{opacity:1;transform:none}}

/* ---------- Article body (single / .gh-prose) ---------- */
.gh-prose>p{margin:0 0 20px;font-size:17px;line-height:1.85;color:rgba(20,36,28,.84)}
.gh-prose h2{font-family:'Figtree',sans-serif;font-weight:800;font-size:clamp(23px,3vw,30px);letter-spacing:-.01em;margin:38px 0 14px;color:var(--ink)}
.gh-prose h3{font-family:'Figtree',sans-serif;font-weight:800;font-size:clamp(19px,2.4vw,24px);margin:30px 0 10px;color:var(--ink)}
.gh-prose ul,.gh-prose ol{margin:0 0 20px;padding-left:22px}
.gh-prose li{font-size:17px;line-height:1.8;color:rgba(20,36,28,.84);margin:0 0 8px}
.gh-prose strong{font-weight:700;color:var(--ink)}
.gh-prose a{color:var(--accent);text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(47,125,92,.4)}
.gh-prose img{border-radius:14px;margin:30px 0;box-shadow:0 18px 44px rgba(20,36,28,.12)}
.gh-prose blockquote{margin:26px 0;padding:18px 24px;border-left:3px solid var(--accent);font-family:'Figtree',sans-serif;font-weight:800;font-size:clamp(20px,2.4vw,22px);line-height:1.4;color:var(--ink)}
.gh-prose blockquote p{margin:0;font-size:inherit;line-height:inherit;color:inherit;font-weight:inherit}

/* ---------- Comparison table ---------- */
.gh-tablewrap{border:1px solid var(--line);border-radius:20px;overflow:hidden;background:var(--card)}
.gh-ctable{width:100%;border-collapse:collapse;font-size:14px;min-width:560px}
.gh-ctable td,.gh-ctable th{padding:14px 18px;text-align:left}
.gh-ctable th{font-family:'Figtree',sans-serif;font-size:14px;font-weight:800;color:#fff;background:var(--ink)}

/* ---------- Legal / reading pages ---------- */
.gh-legal h2{font-family:'Figtree',sans-serif;font-weight:800;font-size:clamp(20px,3vw,23px);letter-spacing:-.01em;margin:32px 0 9px;color:var(--ink)}
.gh-legal h3{font-family:'Figtree',sans-serif;font-weight:700;font-size:17px;margin:24px 0 8px;color:var(--ink)}
.gh-legal p{font-size:15px;line-height:1.75;color:var(--mut);margin:0 0 12px}
.gh-legal ul,.gh-legal ol{margin:0 0 14px;padding-left:22px;font-size:15px;line-height:1.75;color:var(--mut)}
.gh-legal strong{color:var(--ink);font-weight:700}
.gh-legal a{color:var(--accent);text-decoration:underline;text-underline-offset:3px}

/* ---------- Form fields (contact) ---------- */
.gh-in{padding:14px 16px;border-radius:13px;border:1px solid var(--line);background:var(--card);font-size:15px;color:var(--ink);outline:none;width:100%;transition:border-color .3s}
.gh-in:focus{border-color:var(--accent);box-shadow:0 0 0 4px rgba(47,125,92,.08)}

/* ---------- WP pagination ---------- */
.gh-pagination{display:flex;align-items:center;justify-content:center;gap:9px;margin-top:50px;flex-wrap:wrap}
.gh-pagination .page-numbers{display:grid;place-items:center;min-width:44px;height:44px;padding:0 14px;border-radius:12px;border:1px solid var(--line);background:var(--card);font-family:'Figtree',sans-serif;font-weight:700;font-size:15px;color:var(--ink);transition:border-color .3s,color .3s}
.gh-pagination .page-numbers:hover{border-color:var(--accent);color:var(--accent)}
.gh-pagination .page-numbers.current{border-color:transparent;background:var(--accent);color:#fff}
.gh-pagination .page-numbers.dots{border:none;background:transparent;color:var(--mut2)}

/* ---------- Comments ---------- */
.gh-comments{max-width:760px;margin:48px auto 0;padding:0 clamp(20px,5vw,40px)}
.gh-comments .comment-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:16px}
.gh-comments .comment-list ul.children{list-style:none;margin:14px 0 0 24px;padding-left:18px;border-left:2px solid var(--line);display:flex;flex-direction:column;gap:16px}
.gh-comment-body{padding:22px 24px;border-radius:16px;background:var(--card);border:1px solid var(--line);box-shadow:0 12px 30px rgba(20,36,28,.06)}
.gh-comments .comment-author{font-weight:700;color:var(--ink)}
.gh-comments .comment-meta{font-size:12px;color:var(--mut2);margin-bottom:8px}
.gh-comments p{font-size:14.5px;line-height:1.65;color:rgba(20,36,28,.78)}
.gh-comment-form input[type=text],.gh-comment-form input[type=email],.gh-comment-form input[type=url],.gh-comment-form textarea{width:100%;padding:14px 16px;border-radius:12px;border:1px solid var(--line);background:var(--card);color:var(--ink);font-size:14.5px;outline:none;margin-bottom:14px;transition:border-color .3s,box-shadow .3s}
.gh-comment-form input:focus,.gh-comment-form textarea:focus{border-color:var(--accent);box-shadow:0 0 0 4px rgba(47,125,92,.08)}
.gh-comment-form .submit{padding:14px 30px;border:none;border-radius:12px;font-size:14.5px;font-weight:700;color:#fff;background:var(--accent);box-shadow:0 12px 28px rgba(47,125,92,.28);cursor:pointer;transition:transform .35s}
.gh-comment-form .submit:hover{transform:translateY(-2px)}

/* ---------- Affiliate box shortcode ---------- */
.gh-affbox{margin:32px 0;background:var(--card);border:1px solid var(--line);border-left:4px solid var(--accent);border-radius:0 18px 18px 0;padding:22px 24px;box-shadow:0 14px 34px rgba(20,36,28,.07)}

/* ---------- Skip link (a11y) ---------- */
.gh-skip{position:absolute;left:-9999px;top:0;z-index:300;padding:12px 20px;background:var(--card);color:var(--ink);border-radius:0 0 12px 0}
.gh-skip:focus{left:0}

/* ---------- Responsive helpers ---------- */
@media(max-width:920px){.gh-2col{grid-template-columns:1fr!important}.gh-art{grid-template-columns:1fr!important}.gh-aside{position:static!important}}
@media(max-width:900px){.gh-cat6{grid-template-columns:repeat(2,1fr)!important}}
@media(max-width:780px){.gh-rank-row{grid-template-columns:1fr!important}}
@media(max-width:620px){.gh-nav-d{display:none!important}.gh-hide-sm{display:none!important}.gh-cat6{grid-template-columns:1fr!important}}

/* ---------- prefers-reduced-motion ---------- */
@media(prefers-reduced-motion:reduce){*{animation:none!important;scroll-behavior:auto}[data-rv]{opacity:1;transform:none}}