/* ==========================================================================
   PrivAdSpy — SEO feature pages (complements lp_v6.css, loaded after it)
   ========================================================================== */

/* Smaller hero for article-style pages */
.hero-seo{ padding:56px 0 72px; }
.hero-seo h1{ font-size:clamp(2rem,4.6vw,3.3rem); }

/* Breadcrumbs */
.crumbs{ display:flex; flex-wrap:wrap; gap:8px; align-items:center; font-size:.85rem; color:var(--d-muted); margin-bottom:22px; }
.crumbs a:hover{ color:#fff; }
.crumbs .sep{ opacity:.5; }

/* Prose blocks (intro / explanations) */
.prose{ max-width:760px; margin-inline:auto; }
.prose h2{ font-size:clamp(1.5rem,3vw,2.1rem); margin-top:0; }
.prose p{ margin-top:18px; font-size:1.05rem; line-height:1.75; color:var(--l-muted); }
.prose p b, .prose p strong{ color:var(--l-text); }
.prose ul{ margin:18px 0 0; padding-left:22px; color:var(--l-muted); }
.prose li{ margin-top:8px; }

/* Quotable definition box (GEO) */
.quotebox{
  margin:32px auto 0; max-width:760px;
  background:var(--l-card); border:1px solid var(--l-border);
  border-left:4px solid; border-image:var(--grad) 1;
  border-radius:0 var(--radius-sm) var(--radius-sm) 0;
  padding:24px 28px; box-shadow:var(--shadow);
}
.quotebox p{ margin:0; font-size:1.06rem; line-height:1.7; color:var(--l-text); }

/* Comparison table (alternatives pages) */
.cmp-wrap{ margin-top:52px; overflow-x:auto; border:1px solid var(--l-border); border-radius:var(--radius); box-shadow:var(--shadow); background:var(--l-card); }
.cmp{ width:100%; border-collapse:collapse; min-width:640px; font-size:.95rem; }
.cmp th,.cmp td{ padding:16px 20px; text-align:left; border-bottom:1px solid var(--l-border); vertical-align:top; }
.cmp thead th{ font-size:.9rem; letter-spacing:.02em; background:#f0f4fa; }
.cmp thead th:last-child{ background:linear-gradient(90deg,rgba(84,193,246,.14),rgba(49,90,231,.14)); }
.cmp tbody tr:last-child th,.cmp tbody tr:last-child td{ border-bottom:0; }
.cmp tbody th{ font-weight:600; color:var(--l-text); width:26%; }
.cmp td{ color:var(--l-muted); }
.cmp td:last-child{ color:var(--l-text); font-weight:500; }
.cmp .yes{ color:#047857; font-weight:700; }
.cmp .no{ color:#be123c; font-weight:700; }

/* "Choose X / choose Y" two-up */
.choose{ display:grid; gap:18px; margin-top:52px; }
@media (min-width:900px){ .choose{ grid-template-columns:1fr 1fr; } }
.choose .card-light{
  background:var(--l-card); border:1px solid var(--l-border);
  border-radius:var(--radius); padding:30px 28px; box-shadow:var(--shadow);
}
.choose .card-light.hl{ border:2px solid transparent;
  background:linear-gradient(var(--l-card),var(--l-card)) padding-box, var(--grad) border-box; }
.choose h3{ font-size:1.15rem; }
.choose ul{ list-style:none; margin:18px 0 0; padding:0; display:grid; gap:12px; }
.choose li{ display:flex; gap:12px; align-items:flex-start; color:var(--l-muted); font-size:.97rem; }

/* Related pages */
.related{ display:grid; gap:16px; margin-top:52px; }
@media (min-width:900px){ .related{ grid-template-columns:repeat(3,1fr); } }
.related a{
  display:block; background:var(--l-card); border:1px solid var(--l-border);
  border-radius:var(--radius-sm); padding:20px 22px; box-shadow:var(--shadow);
  font-weight:600; font-size:.97rem; transition:transform .18s ease, box-shadow .18s ease;
}
.related a:hover{ transform:translateY(-2px); box-shadow:0 16px 40px -16px rgba(15,23,42,.25); }
.related a span{ display:block; margin-top:6px; font-weight:400; font-size:.87rem; color:var(--l-muted); }