/*
Theme Name: Affvidco Child
Theme URI: https://besthomegear.org/
Description: Best Home Gear child theme for Affvidco. Navy + warm orange brand, custom homepage, footer and review blocks.
Author: Best Home Gear
Template: affvidco
Version: 1.1.3
Requires at least: 6.0
Requires PHP: 8.0
License: GNU General Public License v2 or later
Text Domain: affiliatecms-child
*/
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@600;700&display=swap');

:root {
    --color-primary: #1E3A5F;
    --color-primary-hover: #17304F;
    --color-primary-dark: #12263F;
    --color-primary-light: #E8EEF6;
    --color-primary-rgb: 30, 58, 95;
    --color-accent: #E4572E;
    --color-accent-hover: #C8461F;
    --color-accent-light: #FDECE6;
    --color-text: #0F172A;
    --color-text-secondary: #334155;
    --color-text-muted: #64748B;
    --color-text-subtle: #94A3B8;
    --color-bg: #F7F8FA;
    --color-bg-alt: #EEF1F5;
    --color-surface: #FFFFFF;
    --color-surface-raised: #FFFFFF;
    --color-surface-hover: #F1F4F8;
    --color-border: #E2E8F0;
    --color-border-subtle: #EDF2F7;
    --color-border-strong: #CBD5E1;
    --color-overlay: rgba(15, 23, 42, 0.55);
    --shadow-primary: 0 4px 14px rgba(30, 58, 95, 0.22);
    --shadow-accent: 0 4px 14px rgba(228, 87, 46, 0.22);
    --radius-sm: 4px; --radius-md: 6px; --radius-lg: 8px; --radius-xl: 12px; --radius-2xl: 16px; --radius-3xl: 20px;
    --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-head: 'Poppins', 'Inter', -apple-system, 'Segoe UI', sans-serif;
    --bhg-red: #D92D20; --bhg-red-hover: #B42318;
    --bhg-navy: #10233F; --bhg-card: #FFFFFF; --bhg-line: #E2E8F0;
    --bhg-good: #067647; --bhg-good-bg: #ECFDF3; --bhg-bad: #B42318; --bhg-bad-bg: #FEF3F2;
}
[data-theme="dark"] {
    --color-primary: #8DB4E8; --color-primary-hover: #A9C7EF; --color-primary-dark: #6E9BD8;
    --color-primary-light: rgba(141, 180, 232, 0.15); --color-primary-rgb: 141, 180, 232;
    --color-accent: #F2805C; --color-accent-hover: #F59B7E; --color-accent-light: rgba(242, 128, 92, 0.15);
    --color-text: #F1F5F9; --color-text-secondary: #CBD5E1; --color-text-muted: #94A3B8; --color-text-subtle: #64748B;
    --color-bg: #0B1220; --color-bg-alt: #111A2C; --color-surface: #152036; --color-surface-raised: #1B2842; --color-surface-hover: #22304D;
    --color-border: #283754; --color-border-subtle: #1E2A44; --color-border-strong: #3A4B6E;
    --bhg-card: #152036; --bhg-line: #283754; --bhg-navy: #070D18;
    --bhg-good: #6CE9A6; --bhg-good-bg: rgba(108, 233, 166, .1); --bhg-bad: #FDA29B; --bhg-bad-bg: rgba(253, 162, 155, .1);
}
h1, h2, h3, .site-title, .entry-title, .page-title { font-family: var(--font-head); letter-spacing: -0.01em; }
body { background: var(--color-bg); }
.custom-logo { max-height: 40px; width: auto; }
[data-theme="dark"] .custom-logo { content: url('/wp-content/uploads/2026/10/besthomegear-logo-dark.png'); }

/* Buttons */
.bhg-btn { display: inline-flex; align-items: center; gap: .5rem; padding: .8rem 1.4rem; border-radius: 8px; font-weight: 600; font-size: 1rem; line-height: 1.2; text-decoration: none !important; transition: background .2s, transform .2s, color .2s; border: 2px solid transparent; }
.bhg-btn--red { background: var(--bhg-red); color: #fff !important; }
.bhg-btn--red:hover { background: var(--bhg-red-hover); transform: translateY(-1px); }
.bhg-btn--outline { border-color: var(--color-primary); color: var(--color-primary) !important; background: transparent; }
.bhg-btn--outline:hover { background: var(--color-primary); color: #fff !important; }
[data-theme="dark"] .bhg-btn--outline:hover { color: #0B1220 !important; }
.bhg-btn--sm { padding: .55rem 1rem; font-size: .9rem; }
.bhg-label { display: inline-flex; align-items: center; gap: .4rem; background: var(--bhg-red); color: #fff; font-size: .8rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; padding: .35rem .8rem; border-radius: 999px; }
.bhg-label--soft { background: var(--color-accent-light); color: var(--color-accent); }

/* Hero */
.bhg-hero { background: linear-gradient(135deg, var(--color-primary-light) 0%, var(--color-bg) 60%); padding: 3.5rem 0; border-bottom: 1px solid var(--bhg-line); }
.bhg-hero__in { display: grid; grid-template-columns: 1.1fr 1fr; gap: 2.5rem; align-items: center; }
.bhg-hero__title { font-size: clamp(1.9rem, 4vw, 3rem); line-height: 1.15; margin: 1rem 0; color: var(--color-text); }
.bhg-hero__desc { font-size: 1.1rem; color: var(--color-text-secondary); margin-bottom: 1.5rem; }
.bhg-hero__btns { display: flex; flex-wrap: wrap; gap: .8rem; }
.bhg-hero__amz { margin-top: 1rem; font-size: .85rem; color: var(--color-text-muted); }
.bhg-hero__img { width: 100%; height: auto; border-radius: 16px; display: block; }
.bhg-hero__tiles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.bhg-tile { aspect-ratio: 1; display: flex; align-items: center; justify-content: center; border-radius: 18px; background: var(--bhg-card); border: 1px solid var(--bhg-line); box-shadow: 0 8px 24px rgba(15, 23, 42, .06); font-size: 2.4rem; color: var(--color-primary); }
.bhg-tile:nth-child(2n) { color: var(--color-accent); transform: translateY(14px); }

/* Section heads */
.bhg-latest, .bhg-cats { padding: 3rem 0; }
.bhg-cats { background: var(--color-bg-alt); }
.bhg-sechead { text-align: center; margin-bottom: 2rem; }
.bhg-sechead h1, .bhg-sechead h2 { font-size: clamp(1.5rem, 3vw, 2.1rem); margin: .6rem 0 .3rem; }
.bhg-sechead p { color: var(--color-text-muted); }

/* Card grid */
.bhg-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.4rem; }
.bhg-card { background: var(--bhg-card); border: 1px solid var(--bhg-line); border-radius: 12px; overflow: hidden; display: flex; flex-direction: column; transition: box-shadow .2s, transform .2s; }
.bhg-card:hover { box-shadow: 0 10px 28px rgba(15, 23, 42, .1); transform: translateY(-2px); }
.bhg-card__img { display: block; aspect-ratio: 1200 / 630; background: var(--color-bg-alt); overflow: hidden; }
.bhg-card__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bhg-card__ph { display: flex; height: 100%; align-items: center; justify-content: center; font-size: 2.5rem; color: var(--color-text-subtle); }
.bhg-card__body { padding: 1rem 1.1rem 1.2rem; display: flex; flex-direction: column; gap: .55rem; flex: 1; }
.bhg-card__title { font-size: 1.05rem; line-height: 1.35; margin: 0; }
.bhg-card__title a { color: var(--color-text); text-decoration: none; }
.bhg-card__title a:hover { color: var(--color-accent); }
.bhg-card__meta { display: flex; flex-wrap: wrap; gap: .8rem; font-size: .8rem; color: var(--color-text-muted); }
.bhg-card__cat { align-self: flex-start; font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: var(--color-primary); background: var(--color-primary-light); padding: .2rem .55rem; border-radius: 4px; text-decoration: none; }
.bhg-card__excerpt { font-size: .9rem; color: var(--color-text-secondary); margin: 0; flex: 1; }
.bhg-card .bhg-btn { align-self: flex-start; margin-top: .3rem; }
.bhg-empty { text-align: center; color: var(--color-text-muted); }
.bhg-pager { margin-top: 2rem; display: flex; justify-content: center; }
.bhg-pager ul { display: flex; flex-wrap: wrap; gap: .4rem; list-style: none; margin: 0; padding: 0; }
.bhg-pager a, .bhg-pager span { display: inline-block; padding: .5rem .9rem; border: 1px solid var(--bhg-line); border-radius: 6px; background: var(--bhg-card); color: var(--color-text); text-decoration: none; }
.bhg-pager .current { background: var(--bhg-red); border-color: var(--bhg-red); color: #fff; }

/* Category cards */
.bhg-catgrid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.2rem; }
.bhg-catcard { display: flex; flex-direction: column; gap: .5rem; padding: 1.4rem; border-radius: 14px; color: #fff !important; text-decoration: none !important; transition: transform .2s, box-shadow .2s; min-height: 190px; }
.bhg-catcard:hover { transform: translateY(-3px); box-shadow: 0 12px 28px rgba(15, 23, 42, .18); }
.bhg-catcard i { font-size: 1.8rem; align-self: flex-start; }
.bhg-catcard h3 { color: #fff; font-size: 1.15rem; margin: .2rem 0 0; }
.bhg-catcard p { font-size: .9rem; opacity: .92; margin: 0; flex: 1; color: #fff !important; }
.bhg-catcard--wide { grid-column: span 2; }
@media (max-width: 1024px) { .bhg-catcard--wide { grid-column: auto; } }
.bhg-catcard__go { font-weight: 600; font-size: .9rem; }
.bhg-catcard--1 { background: linear-gradient(135deg, #1E3A5F, #2F5D8C); }
.bhg-catcard--2 { background: linear-gradient(135deg, #C8461F, #E4572E); }
.bhg-catcard--3 { background: linear-gradient(135deg, #0F766E, #14A39A); }
.bhg-catcard--4 { background: linear-gradient(135deg, #5B3E96, #7C5CC4); }
.bhg-catcard--5 { background: linear-gradient(135deg, #9A3412, #D97706); }
.bhg-catcard--0 { background: linear-gradient(135deg, #1F2937, #475569); }

/* Footer */
.bhg-footer { background: var(--bhg-navy); color: #CBD5E1; padding: 3rem 0 1.5rem; margin-top: 0; }
.bhg-footer__grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr; gap: 2rem; }
.bhg-footer__logo img { height: 40px; width: auto; }
.bhg-footer p { font-size: .92rem; line-height: 1.6; margin: .8rem 0 0; color: #CBD5E1 !important; }
.bhg-footer .bhg-footer__amz { color: #F8FAFC !important; font-weight: 600; }
.bhg-footer h4 { color: #fff; font-family: var(--font-head); font-size: 1rem; margin: 0 0 .8rem; }
.bhg-footer ul { list-style: none; margin: 0; padding: 0; }
.bhg-footer li { margin: .4rem 0; }
.bhg-footer a { color: #CBD5E1; text-decoration: none; font-size: .92rem; }
.bhg-footer a:hover { color: #F2805C; }
.bhg-footer__bottom { border-top: 1px solid rgba(255, 255, 255, .12); margin-top: 2rem; padding-top: 1.2rem; display: flex; flex-wrap: wrap; justify-content: space-between; gap: .5rem; }
.bhg-footer__bottom p { margin: 0; font-size: .85rem; }

@media (max-width: 1024px) { .bhg-grid, .bhg-catgrid { grid-template-columns: repeat(3, 1fr); } .bhg-footer__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 768px) { .bhg-hero__in { grid-template-columns: 1fr; } .bhg-hero__art { order: -1; } .bhg-hero__art:has(.bhg-hero__tiles) { display: none; } .bhg-grid, .bhg-catgrid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .bhg-grid, .bhg-catgrid, .bhg-footer__grid { grid-template-columns: 1fr; } .bhg-hero { padding: 2rem 0; } .bhg-btn { width: 100%; justify-content: center; } .bhg-card .bhg-btn { width: auto; } }

/* ==========================================================================
   Review article blocks (bup-*)
   ========================================================================== */
.entry-content .bup-disc, .bup-disc { font-size: .88rem; color: var(--color-text-muted); border-left: 3px solid var(--color-accent); padding: .5rem .9rem; background: var(--color-accent-light); border-radius: 0 6px 6px 0; margin: 1rem 0 1.5rem; }
.bup-top3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; margin: 1.5rem 0 2rem; }
.bup-pick { position: relative; background: var(--bhg-card); border: 1px solid var(--bhg-line); border-radius: 12px; padding: 2.2rem 1rem 1.1rem; display: flex; flex-direction: column; gap: .6rem; text-align: center; }
.bup-pick img { width: 100%; height: 170px; object-fit: contain; background: #fff; border-radius: 8px; margin: 0 auto; }
.bup-pick h3 { font-size: 1rem !important; line-height: 1.35; margin: 0 !important; }
.bup-pick ul { text-align: left; font-size: .88rem; margin: 0; padding-left: 1.1rem; flex: 1; }
.bup-pick li { margin: .25rem 0; }
.bup-badge { position: absolute; top: -1px; left: 50%; transform: translateX(-50%); background: var(--bhg-red); color: #fff; font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; padding: .3rem .8rem; border-radius: 0 0 8px 8px; white-space: nowrap; }
.bup-label { display: inline-block; background: var(--color-primary); color: #fff; font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; padding: .25rem .65rem; border-radius: 4px; margin-bottom: .6rem; }
a.bup-btn, .entry-content a.bup-btn { display: inline-flex; align-items: center; justify-content: center; gap: .4rem; background: #FF9900; color: #111 !important; font-weight: 700; padding: .7rem 1.2rem; border-radius: 8px; text-decoration: none !important; border: 0; transition: background .2s; }
a.bup-btn:hover { background: #F08804; }
.bup-btnrow { display: flex; flex-wrap: wrap; gap: .6rem; margin: 1rem 0; }
.bup-table { overflow-x: auto; margin: 1.2rem 0 2rem; border: 1px solid var(--bhg-line); border-radius: 10px; }
.bup-table table { width: 100%; border-collapse: collapse; margin: 0; font-size: .92rem; }
.bup-table th { background: var(--color-primary); color: #fff; text-align: left; padding: .7rem .8rem; font-weight: 600; }
.bup-table td { padding: .65rem .8rem; border-top: 1px solid var(--bhg-line); vertical-align: middle; }
.bup-table tr:nth-child(even) td { background: var(--color-bg-alt); }
.bup-table img { width: 64px; height: 64px; object-fit: contain; background: #fff; border-radius: 6px; }
.bup-prod { background: var(--bhg-card); border: 1px solid var(--bhg-line); border-radius: 14px; padding: 1.4rem; margin: 1rem 0 2.2rem; }
.bup-prod__img { display: block; text-align: center; background: #fff; border-radius: 10px; padding: 1rem; margin-bottom: 1rem; }
.bup-prod__img img { max-height: 320px; width: auto; max-width: 100%; object-fit: contain; }
.bup-pc { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin: 1rem 0; }
.bup-pros, .bup-cons { border-radius: 10px; padding: .9rem 1rem; }
.bup-pros { background: var(--bhg-good-bg); }
.bup-cons { background: var(--bhg-bad-bg); }
.bup-pros strong { color: var(--bhg-good); }
.bup-cons strong { color: var(--bhg-bad); }
.bup-pros ul, .bup-cons ul { margin: .4rem 0 0; padding-left: 1.1rem; font-size: .92rem; }
.bup-specs { width: 100%; border-collapse: collapse; margin: 1rem 0; font-size: .92rem; }
.bup-specs th, .bup-specs td { border: 1px solid var(--bhg-line); padding: .5rem .7rem; text-align: left; }
.bup-specs th { width: 38%; background: var(--color-bg-alt); font-weight: 600; }
.bup-amz { font-size: .82rem; color: var(--color-text-muted); margin: .6rem 0 0; }
.bup-score { display: inline-block; min-width: 3rem; text-align: center; font-weight: 700; color: #fff; background: var(--bhg-good); border-radius: 6px; padding: .2rem .5rem; }
.bup-faq details { border: 1px solid var(--bhg-line); border-radius: 10px; padding: .8rem 1rem; margin: .6rem 0; background: var(--bhg-card); }
.bup-faq summary { cursor: pointer; font-weight: 600; }
.bup-faq details p { margin: .6rem 0 0; }
.bup-verdict { background: var(--color-primary-light); border: 1px solid var(--bhg-line); border-radius: 14px; padding: 1.3rem; margin: 1.5rem 0; }
.bup-more { background: var(--color-bg-alt); border-radius: 10px; padding: 1rem 1.2rem; margin: 1.5rem 0; }
.bup-related { border: 1px solid var(--bhg-line); border-radius: 12px; padding: 1.2rem 1.3rem; margin: 2rem 0 1rem; background: var(--bhg-card); }
.bup-related h2, .bup-related h3 { margin-top: 0 !important; font-size: 1.15rem !important; }
.bup-related ul { columns: 2; column-gap: 2rem; margin: .5rem 0 0; padding-left: 1.1rem; }
.bup-related li { break-inside: avoid; margin: .3rem 0; }
@media (max-width: 768px) { .bup-top3 { grid-template-columns: 1fr; } .bup-pc { grid-template-columns: 1fr; } .bup-related ul { columns: 1; } }