/* Page-specific styles for home.html (home page). Shared styles live in base.css. */

.fbd img{max-width:100%}
.fbd .hero{position:relative;text-align:center;padding:96px 24px 80px;overflow:hidden}
.fbd .hero::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% -10%,rgba(155,35,53,.28),transparent 60%),radial-gradient(ellipse at 50% 110%,rgba(203,161,78,.12),transparent 55%)}
.fbd .hero>*{position:relative}
.fbd .hero img.portrait{width:132px;height:132px;border-radius:50%;border:2px solid var(--gold);object-fit:cover;box-shadow:0 0 40px rgba(203,161,78,.25)}
.fbd .hero img.wordmark{max-width:min(560px,86vw);margin-top:30px}
.fbd .hero .tagline{font-family:var(--display);font-style:italic;color:var(--gold);font-size:clamp(1.3rem,3vw,1.8rem);margin-top:10px}
.fbd .hero p.lede{max-width:640px;margin:22px auto 0;color:var(--ink-dim);font-size:1.1rem}
.fbd .hero .ctas{margin-top:36px;display:flex;gap:16px;justify-content:center;flex-wrap:wrap}
.fbd .btn{display:inline-block;padding:13px 30px;border:1px solid var(--gold);letter-spacing:.14em;text-transform:uppercase;font-size:.85rem;color:var(--gold);transition:all .25s;cursor:pointer}
.fbd section{padding:84px 24px}
.fbd .wrap{max-width:1200px;margin:0 auto}
.fbd .kicker{letter-spacing:.3em;text-transform:uppercase;font-size:.78rem;color:var(--crimson);text-align:center}
.fbd .kicker.gold{color:var(--gold)}
.fbd h2{font-family:var(--display);font-weight:600;font-size:clamp(2rem,4.5vw,2.9rem);text-align:center;margin:10px 0 14px;color:var(--ink)}
.fbd .sub{text-align:center;color:var(--ink-dim);max-width:620px;margin:0 auto 52px}
.fbd .rule{width:64px;height:1px;background:var(--gold);margin:22px auto 0}
.fbd .cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(255px,1fr));gap:22px}
.fbd .card{background:var(--bg-card);border:1px solid rgba(203,161,78,.18);padding:38px 30px;display:flex;flex-direction:column;transition:border-color .25s,transform .25s}
.fbd .card:hover{border-color:var(--gold);transform:translateY(-4px)}
.fbd .card .num{font-family:var(--display);font-style:italic;color:var(--crimson);font-size:1.1rem}
.fbd .card h3{font-family:var(--display);font-size:1.6rem;font-weight:600;margin:10px 0 12px;color:var(--ink)}
.fbd .card p{color:var(--ink-dim);font-size:1rem;flex:1}
.fbd .card a.more{margin-top:22px;letter-spacing:.14em;text-transform:uppercase;font-size:.8rem}
.fbd .card a.more::after{content:" \2192"}
.fbd .band{background:linear-gradient(180deg,var(--bg-soft),var(--bg));border-top:1px solid var(--gold-soft);border-bottom:1px solid var(--gold-soft)}
.fbd .guide-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px;margin-top:8px}
.fbd .guide{border:1px solid rgba(203,161,78,.22);padding:28px 24px;background:rgba(12,10,15,.6)}
.fbd .guide h4{font-family:var(--display);font-size:1.35rem;font-weight:600;color:var(--ink)}
.fbd .guide .tag{display:inline-block;margin-bottom:12px;font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);border:1px solid var(--gold-soft);padding:4px 10px}
.fbd .guide p{color:var(--ink-dim);font-size:.95rem;margin-top:8px}
.fbd .book{display:grid;grid-template-columns:1fr 1.4fr;gap:56px;align-items:center}
.fbd .book-cover{aspect-ratio:2/3;background:linear-gradient(160deg,#1c1524,#0c0a0f);border:1px solid var(--gold-soft);display:flex;align-items:center;justify-content:center;flex-direction:column;padding:32px;text-align:center;max-width:320px;margin:0 auto}
.fbd .book-cover .bc-title{font-family:var(--display);font-size:2rem;color:var(--gold)}
.fbd .book-cover .bc-sub{font-style:italic;color:var(--ink-dim);margin-top:12px;font-size:.95rem}
.fbd .book h2,.fbd .book .kicker{text-align:left}
.fbd .book p{color:var(--ink-dim);margin-bottom:16px}
.fbd .shop{border:1px solid rgba(203,161,78,.18);background:var(--bg-card);padding:30px 26px;text-align:center;transition:border-color .25s;display:block}
.fbd .shop:hover{border-color:var(--gold)}
.fbd .shop h4{font-family:var(--display);font-size:1.3rem;font-weight:600;margin-bottom:8px;color:var(--ink)}
.fbd .shop p{color:var(--ink-dim);font-size:.93rem}
.fbd .news{background:linear-gradient(180deg,rgba(155,35,53,.16),transparent);border-top:1px solid var(--gold-soft)}
.fbd .cover-img{max-width:320px;width:100%;display:block;margin:0 auto;border:1px solid var(--gold-soft);box-shadow:0 14px 44px rgba(0,0,0,.55)}
/* Width matches the Beehiiv form card exactly (440px form + 24px padding each
   side) so the left-pinned card sits dead center. If you change the form width
   in Beehiiv, update the max-width here to match. */
.fbd .news .beehiiv-embed{display:block;width:100%;max-width:490px;height:250px;margin:28px auto 0;border:0;background:transparent}
.fbd .news form{display:flex;gap:12px;max-width:560px;margin:34px auto 0;flex-wrap:wrap;justify-content:center}
.fbd .news input{flex:1;min-width:220px;background:var(--bg-card);border:1px solid var(--gold-soft);color:var(--ink);padding:13px 16px;font-family:var(--fbody);font-size:1rem}
.fbd .news input:focus{outline:none;border-color:var(--gold)}
.fbd .news button{cursor:pointer;font-family:var(--fbody)}

@media(max-width:820px){
.fbd .book{grid-template-columns:1fr}
}