/* Shared styles for LandlordProof marketing & blog pages (standalone, SEO-friendly). */
:root{
  --bg:#111110; --bg2:#1a1a18; --card:#1e1e1c; --line:#2a2a28;
  --ink:#f2f2ef; --muted:#b7b7b0; --faint:#8a8a83;
  --red:#e8382a; --amber:#f5a623; --green:#4ade80;
  --maxw:820px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:'DM Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  line-height:1.65; -webkit-font-smoothing:antialiased;
}
a{color:var(--amber); text-decoration:none;}
a:hover{text-decoration:underline;}
.wrap{width:100%; max-width:var(--maxw); margin:0 auto; padding:0 20px;}
.wide{max-width:1040px;}

/* Header */
.site-head{border-bottom:1px solid var(--line); background:#0d0d0c; position:sticky; top:0; z-index:10;}
.site-head .wrap{display:flex; align-items:center; justify-content:space-between; height:60px;}
.brand{font-weight:700; font-size:1.1rem; color:var(--ink);}
.brand span{color:var(--red);}
.nav-links{display:flex; gap:1.2rem; align-items:center; font-size:0.9rem;}
.nav-links a{color:var(--muted);}
.nav-links a:hover{color:var(--ink); text-decoration:none;}

/* Buttons */
.btn{display:inline-block; background:var(--green); color:#0b160f; font-weight:700; padding:0.8rem 1.4rem; border-radius:8px; font-size:0.95rem;}
.btn:hover{text-decoration:none; filter:brightness(1.05);}
.btn-red{background:var(--red); color:#fff;}
.btn-ghost{background:transparent; color:var(--muted); border:1px solid var(--line);}
.btn-ghost:hover{color:var(--ink);}

/* Typography */
h1{font-family:'Bebas Neue',sans-serif; font-weight:400; font-size:clamp(2.4rem,6vw,3.6rem); line-height:1.02; letter-spacing:0.5px; margin:0 0 0.6rem; text-wrap:balance;}
h2{font-family:'Bebas Neue',sans-serif; font-weight:400; font-size:clamp(1.6rem,4vw,2.2rem); letter-spacing:0.5px; margin:2.4rem 0 0.8rem; line-height:1.05;}
h3{font-size:1.15rem; margin:1.6rem 0 0.5rem;}
.eyebrow{font-size:0.72rem; font-weight:700; letter-spacing:2.5px; text-transform:uppercase; color:var(--red); margin-bottom:0.7rem;}
.lead{font-size:1.15rem; color:var(--muted); margin:0 0 1.4rem;}
.muted{color:var(--muted);}
p{margin:0 0 1rem;}

/* Sections */
section{padding:2.4rem 0;}
.hero{padding:3.4rem 0 2.6rem; border-bottom:1px solid var(--line); background:radial-gradient(1200px 400px at 50% -10%, rgba(232,56,42,0.12), transparent);}
.band{background:var(--bg2); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}

/* Cards / grids */
.grid{display:grid; gap:1rem;}
.grid-2{grid-template-columns:1fr 1fr;}
.grid-3{grid-template-columns:repeat(3,1fr);}
.card{background:var(--card); border:1px solid var(--line); border-radius:12px; padding:1.3rem;}
.card h3{margin-top:0;}
.check li{list-style:none; padding-left:1.7rem; position:relative; margin-bottom:0.5rem;}
.check{padding:0; margin:0;}
.check li::before{content:'✓'; position:absolute; left:0; color:var(--green); font-weight:700;}
.cross li{list-style:none; padding-left:1.7rem; position:relative; margin-bottom:0.5rem;}
.cross{padding:0; margin:0;}
.cross li::before{content:'✕'; position:absolute; left:0; color:var(--red); font-weight:700;}

/* Code / CSV */
pre{background:#0c0c0b; border:1px solid var(--line); border-radius:8px; padding:1rem; overflow-x:auto; font-size:0.82rem; color:#d6d6cf;}
code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;}

/* Article */
.article{padding-top:2rem;}
.article p, .article li{color:#dcdcd6;}
.article h2{margin-top:2rem;}
.meta-line{color:var(--faint); font-size:0.85rem; margin-bottom:1.6rem;}
.callout{background:var(--bg2); border-left:3px solid var(--amber); border-radius:6px; padding:1rem 1.2rem; margin:1.4rem 0;}
.cta-block{background:var(--card); border:1px solid var(--line); border-radius:12px; padding:1.6rem; text-align:center; margin:2.4rem 0;}

/* Blog list */
.post-card{display:block; background:var(--card); border:1px solid var(--line); border-radius:12px; padding:1.3rem; margin-bottom:1rem;}
.post-card:hover{border-color:#3a3a37; text-decoration:none;}
.post-card h3{margin:0 0 0.35rem; color:var(--ink);}
.post-card p{margin:0; color:var(--muted); font-size:0.92rem;}

/* Footer */
.site-foot{border-top:1px solid var(--line); color:var(--faint); font-size:0.82rem; padding:2rem 0; margin-top:2rem;}
.site-foot a{color:var(--muted);}
.disclaimer{font-size:0.75rem; color:var(--faint); line-height:1.6; margin-top:1rem;}

@media(max-width:640px){
  .grid-2,.grid-3{grid-template-columns:1fr;}
  .nav-links{gap:0.8rem; font-size:0.82rem;}
}

/* Mobile sticky "Start free" CTA — organic long-read pages only (not the homepage,
   which doesn't load this stylesheet). Keeps the action within thumb reach while
   reading; hidden on desktop where the header CTA stays visible. */
.sticky-cta{
  display:none; position:fixed; left:50%; transform:translateX(-50%);
  bottom:calc(0.9rem + env(safe-area-inset-bottom,0px)); z-index:60;
  background:var(--red); color:#fff; font-weight:700; font-size:0.95rem;
  padding:0.8rem 1.5rem; border-radius:999px; text-decoration:none;
  box-shadow:0 6px 22px rgba(0,0,0,0.28);
}
.sticky-cta:hover{text-decoration:none; filter:brightness(1.05);}
@media(max-width:720px){ .sticky-cta{display:inline-block;} }