/* landing-compat.css — a scoped Tailwind-subset for the marketing/legal
   pages (/about, /contact, /changelog, /roadmap, /security + privacy/terms/dpa/
   acceptable-use). Their templates still use Tailwind utilities inline; bundle.css
   is NOT loaded on the home layout, so this provides just the utilities
   those pages use, mapped to the flat #0e1219 brand. EVERYTHING is scoped under `.lp`
   (each page wraps its body in <div class="lp">) so it can't leak into the
   home-designed pages. Accent colours + colour tints collapse to the single
   brand (#2567ff); red/rose stay for warnings. */

/* containers / layout */
.lp .container{max-width:1160px;margin:0 auto;padding:0 24px}
.lp .max-w-none{max-width:none}
.lp .max-w-2xl{max-width:42rem}.lp .max-w-3xl{max-width:48rem}.lp .max-w-4xl{max-width:56rem}
.lp .mx-auto{margin-left:auto;margin-right:auto}
.lp .relative{position:relative}.lp .absolute{position:absolute}
.lp .top-0{top:0}.lp .bottom-0{bottom:0}.lp .left-6{left:1.5rem}
.lp .z-10{z-index:10}
.lp .overflow-x-auto{overflow-x:auto}.lp .overflow-hidden{overflow:hidden}
.lp .w-full{width:100%}
.lp .hidden{display:none}
.lp .block{display:block}.lp .inline-flex{display:inline-flex}
.lp .flex{display:flex}.lp .flex-col{flex-direction:column}.lp .flex-1{flex:1}
.lp .grid{display:grid;gap:1rem}
.lp .grid-cols-1{grid-template-columns:1fr}.lp .grid-cols-2{grid-template-columns:1fr 1fr}
.lp .items-start{align-items:flex-start}.lp .items-center{align-items:center}
.lp .justify-center{justify-content:center}.lp .justify-between{justify-content:space-between}
.lp .flex-shrink-0{flex-shrink:0}
.lp .text-center{text-align:center}.lp .text-left{text-align:left}
.lp .uppercase{text-transform:uppercase}.lp .tracking-wider{letter-spacing:.05em}
.lp .leading-relaxed{line-height:1.7}
.lp ul,.lp ol{list-style:none;margin:0;padding:0}
.lp .list-disc{list-style:disc;padding-left:1.35rem}.lp .list-inside{list-style-position:inside;padding-left:0}
@media(min-width:640px){.lp .sm\:px-6{padding-left:1.5rem;padding-right:1.5rem}.lp .sm\:flex-row{flex-direction:row}.lp .sm\:grid-cols-2{grid-template-columns:1fr 1fr}}
@media(min-width:768px){.lp .md\:text-5xl{font-size:3rem;line-height:1.05}.lp .md\:grid-cols-2{grid-template-columns:1fr 1fr}.lp .md\:grid-cols-3{grid-template-columns:repeat(3,1fr)}.lp .md\:flex{display:flex}.lp .md\:block{display:block}.lp .md\:hidden{display:none}.lp .md\:p-12{padding:3rem}}
@media(min-width:1024px){.lp .lg\:px-8{padding-left:2rem;padding-right:2rem}}

/* gaps / spacing */
.lp .gap-2{gap:.5rem}.lp .gap-3{gap:.75rem}.lp .gap-6{gap:1.5rem}
.lp .gap-x-4{column-gap:1rem}.lp .gap-y-2{row-gap:.5rem}
.lp .space-y-2>*+*{margin-top:.5rem}.lp .space-y-3>*+*{margin-top:.75rem}.lp .space-y-8>*+*{margin-top:2rem}
.lp .p-4{padding:1rem}.lp .p-6{padding:1.5rem}.lp .p-8{padding:2rem}
.lp .px-2{padding-left:.5rem;padding-right:.5rem}.lp .px-3{padding-left:.75rem;padding-right:.75rem}.lp .px-4{padding-left:1rem;padding-right:1rem}.lp .px-6{padding-left:1.5rem;padding-right:1.5rem}
.lp .py-0\.5{padding-top:.125rem;padding-bottom:.125rem}.lp .py-1{padding-top:.25rem;padding-bottom:.25rem}.lp .py-2{padding-top:.5rem;padding-bottom:.5rem}.lp .py-3{padding-top:.75rem;padding-bottom:.75rem}.lp .py-24{padding-top:6rem;padding-bottom:6rem}
.lp .pr-4{padding-right:1rem}
.lp .mx-auto{margin-left:auto;margin-right:auto}
.lp .mt-0\.5{margin-top:.125rem}.lp .mt-1{margin-top:.25rem}.lp .mt-2{margin-top:.5rem}.lp .mt-4{margin-top:1rem}.lp .mt-8{margin-top:2rem}
.lp .mb-2{margin-bottom:.5rem}.lp .mb-3{margin-bottom:.75rem}.lp .mb-4{margin-bottom:1rem}.lp .mb-6{margin-bottom:1.5rem}.lp .mb-8{margin-bottom:2rem}.lp .mb-12{margin-bottom:3rem}.lp .mb-16{margin-bottom:4rem}

/* sizing (icons, dots, rails) */
.lp .w-2{width:.5rem}.lp .w-4{width:1rem}.lp .w-5{width:1.25rem}.lp .w-6{width:1.5rem}.lp .w-8{width:2rem}.lp .w-10{width:2.5rem}.lp .w-12{width:3rem}.lp .w-0\.5{width:2px}
.lp .h-2{height:.5rem}.lp .h-4{height:1rem}.lp .h-5{height:1.25rem}.lp .h-6{height:1.5rem}.lp .h-8{height:2rem}.lp .h-10{height:2.5rem}.lp .h-12{height:3rem}

/* radius */
.lp .rounded{border-radius:6px}.lp .rounded-lg{border-radius:8px}.lp .rounded-xl{border-radius:12px}.lp .rounded-full{border-radius:999px}

/* borders → light */
.lp .border,.lp .border-2{border:1px solid var(--border)}
.lp .border-b{border-bottom:1px solid var(--border)}
.lp [class*="border-slate-"],.lp [class*="border-white/"],.lp [class*="border-sky-"],.lp [class*="border-emerald-"],.lp [class*="border-green-"],.lp [class*="border-amber-"]{border-color:var(--border)}

/* typography */
.lp .text-xs{font-size:.75rem}.lp .text-sm{font-size:.875rem}.lp .text-xl{font-size:1.25rem}.lp .text-2xl{font-size:1.5rem}.lp .text-4xl{font-size:2.25rem;line-height:1.1}
.lp .font-mono{font-family:var(--font-mono)}.lp .font-semibold{font-weight:650}.lp .font-bold{font-weight:800}

/* text colours */
.lp .text-white{color:var(--text)}
.lp .text-slate-300{color:var(--text-2)}.lp .text-slate-400{color:var(--text-2)}.lp .text-slate-500{color:var(--text-3)}
.lp .text-sky-400,.lp .text-sky-300,.lp .text-blue-400,.lp .text-cyan-400,.lp .text-purple-400,.lp .text-violet-400,.lp .text-emerald-400,.lp .text-green-400,.lp .text-green-300,.lp .text-teal-400,.lp .text-amber-400,.lp .text-pink-400{color:var(--cyan-deep)}
.lp .text-red-400,.lp .text-rose-400,.lp .text-orange-400{color:#fb7185}
.lp .hover\:text-sky-300:hover,.lp .hover\:text-purple-300:hover,.lp .hover\:text-pink-300:hover,.lp .hover\:text-green-300:hover{color:var(--cyan);text-decoration:underline}
.lp .transition-colors{transition:color .2s,background .2s,border-color .2s}

/* surfaces / tints → flat dark brand */
.lp .glass-card{background:var(--bg);border:1px solid var(--border);box-shadow:var(--sh-sm)}
.lp .bg-white\/5,.lp .bg-slate-800,.lp [class*="bg-slate-900"]{background:rgba(255,255,255,0.03)}
.lp [class*="bg-sky-"],.lp [class*="bg-blue-"],.lp [class*="bg-cyan-"],.lp [class*="bg-purple-"],.lp [class*="bg-violet-"],.lp [class*="bg-emerald-"],.lp [class*="bg-green-"],.lp [class*="bg-teal-"],.lp [class*="bg-amber-"],.lp [class*="bg-pink-"],.lp [class*="bg-slate-500"]{background:var(--cyan-tint)}
.lp [class*="bg-red-"],.lp [class*="bg-rose-"],.lp [class*="bg-orange-"]{background:rgba(251,113,133,0.10)}
.lp .bg-gradient-to-r,.lp .bg-gradient-to-br{background-image:none;background:var(--cyan-tint)}
.lp .animate-pulse{animation:lpPulse 2s cubic-bezier(.4,0,.6,1) infinite}
@keyframes lpPulse{0%,100%{opacity:1}50%{opacity:.5}}

/* prose (privacy/terms/dpa if they use it) */
.lp .prose{font-size:16px;line-height:1.75;color:var(--text)}
.lp .prose-invert{color:var(--text)}
.lp .prose p{margin:0 0 1.1rem}
.lp .prose h2{font-size:1.4rem;font-weight:800;margin:2rem 0 .8rem;color:var(--text)}
.lp .prose h3{font-size:1.15rem;font-weight:700;margin:1.6rem 0 .6rem;color:var(--text)}
.lp .prose a{color:var(--cyan-deep);font-weight:600;text-decoration:underline}
.lp .prose ul,.lp .prose ol{padding-left:1.35rem;margin:0 0 1.1rem}
.lp .prose li{margin-bottom:.4rem}
.lp .prose code{font-family:var(--font-mono);background:rgba(255,255,255,0.06);color:var(--cyan-bright);border-radius:5px;padding:1px 6px;font-size:.9em}

/* buttons (about/contact use .btn-primary/.btn-secondary) → home .btn look */
.lp .btn-primary{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:14px;font-weight:700;padding:0 22px;height:44px;border:none;border-radius:999px;background:var(--cyan);color:#fff;box-shadow:0 8px 24px -8px rgba(37,103,255,.45);cursor:pointer;appearance:none;-webkit-appearance:none;transition:background .18s}
.lp .btn-primary:hover{background:var(--cyan-deep)}
.lp .btn-secondary{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:14px;font-weight:700;padding:0 22px;height:44px;border-radius:999px;border:1px solid var(--border);color:var(--text);background:var(--bg);transition:border-color .18s,background .18s}
.lp .btn-secondary:hover{border-color:var(--cyan-line);background:var(--cyan-tint)}

/* headings default weight/scale for h1/h2 without utility classes */
.lp h1{letter-spacing:-.02em}
.lp .step-number{display:flex;align-items:center;justify-content:center;font-family:var(--font-mono);font-weight:700;color:var(--cyan-ink);background:var(--cyan);border-radius:50%}

/* ── extra utilities for /search, /404, /guides ── */
.lp .text-lg{font-size:1.125rem}.lp .text-3xl{font-size:1.875rem;line-height:1.15}.lp .text-8xl{font-size:6rem;line-height:1}
.lp .gradient-text{background:linear-gradient(115deg,#8fb0ff,#5b86ff 55%,#2567ff);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.lp .text-slate-200{color:var(--text)}
.lp .text-sky-400\/80{color:var(--cyan-deep)}
.lp .whitespace-nowrap{white-space:nowrap}
.lp .space-y-4>*+*{margin-top:1rem}
.lp .transition-all{transition:all .3s}.lp .duration-300{transition-duration:.3s}
.lp .pl-12{padding-left:3rem}.lp .pr-4{padding-right:1rem}.lp .py-1\.5{padding-top:.375rem;padding-bottom:.375rem}.lp .px-1\.5{padding-left:.375rem;padding-right:.375rem}
.lp .left-4{left:1rem}.lp .top-1\/2{top:50%}.lp .-translate-y-1\/2{transform:translateY(-50%)}
.lp .pointer-events-none{pointer-events:none}
.lp .outline-none,.lp .focus\:outline-none:focus{outline:none}
.lp .focus\:border-sky-500\/60:focus{border-color:var(--cyan-line)}
.lp .placeholder-slate-500::placeholder{color:var(--text-3)}
.lp [class*="hover:border-"]:hover{border-color:var(--cyan-line)}
.lp .hover\:text-white:hover{color:var(--text)}
.lp .group:hover [class*="group-hover:text-sky"]{color:var(--cyan-deep)}
/* search input reads on the flat dark surface (drop native search chrome) */
.lp input[type="search"]{background:rgba(255,255,255,0.04);color:var(--text);appearance:none;-webkit-appearance:none}
.lp button{appearance:none;-webkit-appearance:none}
.lp .flex-wrap{flex-wrap:wrap}
.lp .inline-block{display:inline-block}
.lp .gap-4{gap:1rem}
.lp .p-5{padding:1.25rem}
.lp .mb-10{margin-bottom:2.5rem}.lp .mt-12{margin-top:3rem}
.lp .hover\:text-sky-400:hover{color:var(--cyan-deep)}
.lp .hover\:underline:hover{text-decoration:underline}
@media(min-width:768px){.lp .md\:text-4xl{font-size:2.25rem;line-height:1.1}}