/* ===== Ohio Listing Lab — brand navy/gold ===== */
:root, [data-theme="light"] {
  --navy-900:#0a1530; --navy-800:#0f1e44; --navy-700:#16285a;
  --gold:#d4a534; --gold-bright:#e8bd4d; --cyan:#4fb6d0;

  --color-bg:#f5f6fa;
  --color-surface:#ffffff;
  --color-surface-2:#f0f2f8;
  --color-text:#101733;
  --color-text-muted:#54607f;
  --color-text-faint:#8a93ab;
  --color-border:#dde1ec;
  --color-primary:var(--gold);
  --hero-overlay:linear-gradient(90deg, rgba(245,246,250,.96) 0%, rgba(245,246,250,.7) 40%, rgba(245,246,250,.15) 100%);
  --header-bg:rgba(245,246,250,.85);

  --text-xs:clamp(.75rem,.7rem + .2vw,.85rem);
  --text-sm:clamp(.875rem,.82rem + .3vw,1rem);
  --text-base:clamp(1rem,.95rem + .25vw,1.125rem);
  --text-lg:clamp(1.125rem,1rem + .7vw,1.4rem);
  --text-xl:clamp(1.5rem,1.1rem + 1.6vw,2.2rem);
  --text-2xl:clamp(2.1rem,1.3rem + 3vw,3.6rem);

  --space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-6:1.5rem;--space-8:2rem;
  --space-10:2.5rem;--space-12:3rem;--space-16:4rem;--space-20:5rem;--space-24:6rem;
  --radius-md:.6rem;--radius-lg:1rem;--radius-xl:1.4rem;--radius-full:9999px;
  --content:1160px;
  --font-display:'Sora',system-ui,sans-serif;
  --font-body:'Inter',system-ui,sans-serif;
  --shadow-md:0 6px 24px rgba(16,23,51,.10);
  --shadow-lg:0 20px 50px rgba(16,23,51,.16);
  --transition:200ms cubic-bezier(.16,1,.3,1);
}
[data-theme="dark"]{
  --color-bg:#0a1530;
  --color-surface:#0f1e44;
  --color-surface-2:#0d1a3a;
  --color-text:#eaeefb;
  --color-text-muted:#9fabcb;
  --color-text-faint:#6b779a;
  --color-border:#1d2d5c;
  --hero-overlay:linear-gradient(90deg, rgba(10,21,48,.95) 0%, rgba(10,21,48,.72) 42%, rgba(10,21,48,.2) 100%);
  --header-bg:rgba(10,21,48,.78);
  --shadow-md:0 6px 24px rgba(0,0,0,.35);
  --shadow-lg:0 20px 50px rgba(0,0,0,.5);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-font-smoothing:antialiased;scroll-behavior:smooth;scroll-padding-top:5rem}
body{min-height:100dvh;line-height:1.6;font-family:var(--font-body);font-size:var(--text-base);color:var(--color-text);background:var(--color-bg);transition:background var(--transition),color var(--transition)}
img,svg{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none;transition:color var(--transition)}
h1,h2,h3{font-family:var(--font-display);line-height:1.1;text-wrap:balance;font-weight:700}
p{text-wrap:pretty}
button{cursor:pointer;background:none;border:none;font:inherit;color:inherit}
.container{width:100%;max-width:var(--content);margin-inline:auto;padding-inline:var(--space-6)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:6px}
@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

/* ===== buttons ===== */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font-weight:600;font-size:var(--text-sm);padding:.85rem 1.5rem;border-radius:var(--radius-full);transition:all var(--transition);white-space:nowrap}
.btn-sm{padding:.6rem 1.1rem}
.btn-primary{background:linear-gradient(135deg,var(--gold-bright),var(--gold));color:#1a1304;box-shadow:0 6px 20px rgba(212,165,52,.35)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 10px 28px rgba(212,165,52,.5)}
.btn-ghost{border:1.5px solid var(--color-border);color:var(--color-text)}
.btn-ghost:hover{border-color:var(--gold);color:var(--gold)}

/* ===== header ===== */
.site-header{position:sticky;top:0;z-index:50;background:var(--header-bg);backdrop-filter:blur(14px);border-bottom:1px solid var(--color-border)}
.header-inner{display:flex;align-items:center;justify-content:space-between;height:4.5rem;gap:var(--space-6)}
.brand{display:flex;align-items:center;gap:.65rem;font-family:var(--font-display);font-weight:700}
.brand-logo{width:40px;height:40px;border-radius:50%}
.brand-name{font-size:1.05rem;letter-spacing:-.01em}
.nav{display:flex;gap:var(--space-8);font-size:var(--text-sm);font-weight:500}
.nav a{color:var(--color-text-muted)}
.nav a:hover{color:var(--gold)}
.header-actions{display:flex;align-items:center;gap:var(--space-4)}
.theme-toggle{width:40px;height:40px;display:grid;place-items:center;border-radius:50%;color:var(--color-text-muted);border:1px solid var(--color-border)}
.theme-toggle:hover{color:var(--gold);border-color:var(--gold)}

/* ===== hero ===== */
.hero{position:relative;overflow:hidden;padding-block:clamp(4rem,10vw,8rem)}
.hero-bg{position:absolute;inset:0;background:url('assets/hero_bg.png') center right/cover no-repeat;z-index:-2}
.hero::before{content:"";position:absolute;inset:0;background:var(--hero-overlay);z-index:-1}
[data-theme="light"] .hero-bg{opacity:.5}
.hero-inner{max-width:760px}
.eyebrow{display:inline-block;font-size:var(--text-xs);font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--gold);margin-bottom:var(--space-4)}
.eyebrow.center{display:block;text-align:center}
.hero-title{font-size:var(--text-2xl);font-weight:800;letter-spacing:-.02em;margin-bottom:var(--space-6)}
.grad{background:linear-gradient(120deg,var(--gold-bright),var(--cyan));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-sub{font-size:var(--text-lg);color:var(--color-text-muted);max-width:46rem;margin-bottom:var(--space-8)}
.hero-cta{display:flex;gap:var(--space-4);flex-wrap:wrap;margin-bottom:var(--space-10)}
.hero-trust{display:flex;gap:var(--space-8);flex-wrap:wrap;font-size:var(--text-sm);color:var(--color-text-faint);font-weight:500}

/* ===== value bar ===== */
.valuebar{background:var(--navy-800);border-block:1px solid var(--color-border)}
[data-theme="light"] .valuebar{background:linear-gradient(135deg,var(--navy-900),var(--navy-700))}
.valuebar-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-8);padding-block:var(--space-12);text-align:center}
.vb-num{display:block;font-family:var(--font-display);font-size:var(--text-xl);font-weight:800;color:var(--gold-bright);margin-bottom:.3rem}
.vb-label{font-size:var(--text-sm);color:#aeb9d6;max-width:18rem;margin-inline:auto;display:block}

/* ===== sections ===== */
.section{padding-block:clamp(3.5rem,8vw,6.5rem)}
.section-alt{background:var(--color-surface-2)}
.section-title{font-size:var(--text-xl);letter-spacing:-.015em;margin-bottom:var(--space-4)}
.section-title.center{text-align:center}
.section-lead{font-size:var(--text-lg);color:var(--color-text-muted);max-width:42rem}
.section-lead.center{text-align:center;margin-inline:auto;margin-bottom:var(--space-12)}

/* cards */
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-6);margin-top:var(--space-12)}
.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-8) var(--space-6);transition:all var(--transition)}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:var(--gold)}
.card-icon{font-size:2rem;margin-bottom:var(--space-4)}
.card h3{font-size:var(--text-lg);margin-bottom:var(--space-3)}
.card p{font-size:var(--text-sm);color:var(--color-text-muted)}

/* about */
.about-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:var(--space-16);align-items:center}
.about-media{display:grid;place-items:center}
.about-logo{width:min(320px,80%);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg)}
.about-copy p{color:var(--color-text-muted);margin-bottom:var(--space-4)}
.about-host{padding:var(--space-4) var(--space-6);background:var(--color-surface);border-left:3px solid var(--gold);border-radius:var(--radius-md)}
.about-host strong{color:var(--gold)}
.fineprint{font-size:var(--text-xs);color:var(--color-text-faint)!important;margin-top:var(--space-6)}

/* watch */
.video-feature{display:grid;grid-template-columns:1.3fr 1fr;gap:var(--space-10);align-items:center;margin-top:var(--space-12);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);padding:var(--space-8);box-shadow:var(--shadow-md)}
.video-thumb{position:relative;aspect-ratio:16/9;border-radius:var(--radius-lg);background:linear-gradient(135deg,var(--navy-700),var(--navy-900));display:grid;place-items:center;overflow:hidden;border:1px solid var(--color-border)}
.play{width:72px;height:72px;border-radius:50%;background:linear-gradient(135deg,var(--gold-bright),var(--gold));color:#1a1304;display:grid;place-items:center;font-size:1.6rem;padding-left:5px;box-shadow:0 8px 24px rgba(212,165,52,.5)}
.video-tag{position:absolute;top:var(--space-4);left:var(--space-4);font-size:var(--text-xs);font-weight:600;background:rgba(212,165,52,.2);color:var(--gold-bright);padding:.3rem .7rem;border-radius:var(--radius-full)}
.video-meta h3{font-size:var(--text-lg);margin-bottom:var(--space-3)}
.video-meta p{font-size:var(--text-sm);color:var(--color-text-muted);margin-bottom:var(--space-6)}

/* join */
.join{background:linear-gradient(135deg,var(--navy-900),var(--navy-700));color:#eaeefb}
.join .eyebrow{color:var(--gold-bright)}
.join .section-title,.join .section-lead{color:#eaeefb}
.join .section-lead{color:#b9c3de}
.join-inner{max-width:680px;margin-inline:auto}
.signup{margin-bottom:var(--space-8)}
.signup-row{display:flex;gap:var(--space-3);flex-wrap:wrap;justify-content:center}
.signup input{flex:1;min-width:180px;padding:.9rem 1.1rem;border-radius:var(--radius-full);border:1.5px solid rgba(255,255,255,.18);background:rgba(255,255,255,.06);color:#fff;font-size:var(--text-sm)}
.signup input::placeholder{color:#8b97b8}
.signup input:focus{border-color:var(--gold);background:rgba(255,255,255,.1);outline:none}
.signup-note{text-align:center;font-size:var(--text-sm);color:#9fabcb;margin-top:var(--space-4)}
.signup-note.success{color:var(--gold-bright);font-weight:600}
.social-links{display:flex;gap:var(--space-6);justify-content:center;flex-wrap:wrap}
.social{font-size:var(--text-sm);font-weight:600;color:#b9c3de;padding:.5rem 1rem;border:1px solid rgba(255,255,255,.15);border-radius:var(--radius-full)}
.social:hover{color:var(--gold-bright);border-color:var(--gold)}

/* footer */
.site-footer{background:var(--color-surface-2);border-top:1px solid var(--color-border);padding-block:var(--space-12) var(--space-8)}
.footer-inner{display:flex;justify-content:space-between;align-items:center;gap:var(--space-8);flex-wrap:wrap;padding-bottom:var(--space-8);border-bottom:1px solid var(--color-border)}
.footer-brand{display:flex;align-items:center;gap:var(--space-4)}
.footer-brand .brand-logo{width:48px;height:48px}
.footer-brand p{font-size:var(--text-sm);color:var(--color-text-muted)}
.footer-nav{display:flex;gap:var(--space-6);font-size:var(--text-sm);font-weight:500}
.footer-nav a{color:var(--color-text-muted)}
.footer-nav a:hover{color:var(--gold)}
.footer-bottom{padding-top:var(--space-6);font-size:var(--text-xs);color:var(--color-text-faint)}
.footer-bottom .disclaimer{margin-top:.4rem}

/* ===== legal pages ===== */
.legal-hero{background:linear-gradient(135deg,var(--navy-900),var(--navy-700));color:#eaeefb;padding-block:clamp(3rem,7vw,5rem)}
.legal-hero .eyebrow{color:var(--gold-bright)}
.legal-title{font-size:var(--text-2xl);font-weight:800;letter-spacing:-.02em;color:#fff;margin-bottom:var(--space-3)}
.legal-updated{color:#9fabcb;font-size:var(--text-sm)}
.legal-body{padding-block:clamp(3rem,6vw,5rem)}
.legal-wrap{max-width:760px}
.legal-wrap h2{font-size:var(--text-lg);margin-top:var(--space-10);margin-bottom:var(--space-4);padding-bottom:var(--space-3);border-bottom:1px solid var(--color-border)}
.legal-wrap h3{font-size:var(--text-base);font-family:var(--font-display);font-weight:600;color:var(--gold);margin-top:var(--space-6);margin-bottom:var(--space-2)}
.legal-wrap p{color:var(--color-text-muted);margin-bottom:var(--space-4)}
.legal-wrap ul{color:var(--color-text-muted);margin:0 0 var(--space-4) var(--space-6);display:flex;flex-direction:column;gap:.4rem}
.legal-wrap li{padding-left:.3rem}
.legal-wrap a{color:var(--gold);text-decoration:underline;text-underline-offset:2px}
.legal-wrap a:hover{color:var(--gold-bright)}
.legal-contact{background:var(--color-surface-2);border-left:3px solid var(--gold);border-radius:var(--radius-md);padding:var(--space-4) var(--space-6);margin-block:var(--space-6);font-size:var(--text-sm);color:var(--color-text-muted);line-height:1.8}
.legal-contact a{text-decoration:none}
.legal-disclaimer{font-size:var(--text-xs);color:var(--color-text-faint)!important;font-style:italic;margin-top:var(--space-8)}
.legal-back{margin-top:var(--space-8)}
.legal-back a{text-decoration:none}

/* reveal animation — only hide when JS is active (progressive enhancement) */
.js-reveal .reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}
.js-reveal .reveal.in{opacity:1;transform:none}

/* ===== responsive ===== */
@media(max-width:900px){
  .cards{grid-template-columns:repeat(2,1fr)}
  .about-grid,.video-feature{grid-template-columns:1fr;gap:var(--space-8)}
  .about-media{order:-1}
  .nav{display:none}
}
@media(max-width:560px){
  .valuebar-grid{grid-template-columns:1fr;gap:var(--space-6)}
  .cards{grid-template-columns:1fr}
  .brand-name{display:none}
  .hero-trust{gap:var(--space-4)}
  .signup-row{flex-direction:column}
  .signup input,.signup button{width:100%}
}

/* FAQ */
.faq-container{max-width:760px}
.faq-list{display:flex;flex-direction:column;gap:var(--space-3);margin-top:var(--space-8)}
.faq-item{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);overflow:hidden;transition:border-color .2s ease}
.faq-item[open]{border-color:var(--gold)}
.faq-item summary{cursor:pointer;list-style:none;padding:var(--space-5) var(--space-6);font-family:var(--font-display);font-weight:600;font-size:var(--text-md);display:flex;justify-content:space-between;align-items:center;gap:var(--space-4)}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+";color:var(--gold);font-size:1.4rem;line-height:1;font-weight:400;transition:transform .2s ease}
.faq-item[open] summary::after{transform:rotate(45deg)}
.faq-item summary:hover{color:var(--gold)}
.faq-item p{padding:0 var(--space-6) var(--space-5);color:var(--color-text-muted);line-height:1.7;margin:0}

/* Beehiiv embedded subscribe form */
.signup-embed{max-width:540px;margin:var(--space-8) auto var(--space-3);min-height:64px}
.signup-embed iframe{width:100%!important;border:0;border-radius:var(--radius-md)}

/* ===== Blog ===== */
.breadcrumb{font-size:var(--text-sm);color:#9fabcb;margin-bottom:var(--space-4);display:flex;gap:.5rem;flex-wrap:wrap;align-items:center}
.breadcrumb a{color:var(--gold-bright);text-decoration:none}
.breadcrumb a:hover{text-decoration:underline}
.breadcrumb span{color:#6b779b}

.blog-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:var(--space-6);margin-bottom:var(--space-10)}
.post-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-6);transition:border-color .2s ease,transform .2s ease}
.post-card:hover{border-color:var(--gold);transform:translateY(-3px)}
.post-card-link{display:block;text-decoration:none;color:inherit}
.post-tag{display:inline-block;font-family:var(--font-display);font-size:var(--text-xs);font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--navy-900);background:var(--gold);padding:.25rem .6rem;border-radius:999px;margin-bottom:var(--space-4)}
.post-tag--muted{background:var(--color-surface-2);color:var(--color-text-muted);border:1px solid var(--color-border)}
.post-card-title{font-family:var(--font-display);font-size:var(--text-lg);font-weight:700;line-height:1.25;color:var(--color-text);margin-bottom:var(--space-3)}
.post-card-excerpt{color:var(--color-text-muted);font-size:var(--text-sm);line-height:1.65;margin-bottom:var(--space-4)}
.post-card-meta{display:block;font-size:var(--text-xs);color:var(--color-text-faint);margin-bottom:var(--space-2)}
.post-card-cta{font-family:var(--font-display);font-weight:600;font-size:var(--text-sm);color:var(--gold)}
.post-card--soon{opacity:.72}

.blog-cta{display:flex;align-items:center;justify-content:space-between;gap:var(--space-6);flex-wrap:wrap;background:linear-gradient(135deg,var(--navy-900),var(--navy-700));border-radius:var(--radius-lg);padding:var(--space-8);color:#fff}
.blog-cta h2{font-family:var(--font-display);font-size:var(--text-xl);margin-bottom:var(--space-2);color:#fff}
.blog-cta p{color:#cdd6ea;font-size:var(--text-sm);max-width:46ch;margin:0}

/* ===== Article ===== */
.article-wrap{max-width:720px;margin-inline:auto}
.article-lead{font-size:var(--text-lg)!important;line-height:1.6!important;color:var(--color-text)!important;margin-bottom:var(--space-8)!important}
.article-wrap p{font-size:var(--text-base);line-height:1.75}
.article-wrap em{color:var(--color-text);font-style:italic}
.callout{background:var(--color-surface-2);border-left:3px solid var(--gold);border-radius:var(--radius-md);padding:var(--space-5) var(--space-6);margin-block:var(--space-6);color:var(--color-text-muted);line-height:1.7;font-size:var(--text-sm)}
.callout strong{color:var(--gold)}
.article-cta{background:linear-gradient(135deg,var(--navy-900),var(--navy-700));border-radius:var(--radius-lg);padding:var(--space-8);margin-block:var(--space-10);text-align:center}
.article-cta h2{color:#fff!important;border:none!important;margin-top:0!important;padding:0!important;font-size:var(--text-xl)}
.article-cta p{color:#cdd6ea!important;max-width:52ch;margin:0 auto var(--space-5)!important}
