/* ============================================================================ Quietpost landing version — shared stylesheet (hand-written, no Tailwind). The page itself is authored with inline styles (ported from the docs/quietpost/ prototype); this file holds only what inline styles cannot express: the fixed pastel palette + accent fallback, element resets, keyframes, :hover states, and the responsive collapse for the layout grids. Per-domain accent overrides are emitted server-side by {% quietpost_accent_vars %}. ========================================================================== */ /* Accent fallback (prototype soft coral). Overridden in per-domain by {% quietpost_accent_vars %} so a custom brand color re-tints the whole page. */ :root { --accent: 255 125 92; --accent-deep: 199 98 72; --accent-soft: 255 239 235; color-scheme: light; /* Fixed quietpost palette (decorative secondaries stay constant per brand; --coral aliases the per-domain accent so the coral bits re-tint too). */ --ink: #2E2A28; --cream: #FFF8F0; --sky: #5FAEE8; --mint: #74CBA6; --butter: #FFD37A; --muted: #857B73; --coral: rgb(var(--accent)); } * { box-sizing: border-box; } html { overflow-x: clip; scroll-behavior: smooth; } html, body { margin: 0; padding: 0; background: #FFF8F0; color: #2E2A28; font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; } body { overflow-x: clip; } ::selection { background: rgb(var(--accent) / 0.18); } summary { list-style: none; } summary::-webkit-details-marker { display: none; } details[open] .faq-plus { transform: rotate(45deg); } a { -webkit-tap-highlight-color: transparent; } /* Alpine pre-init guard: anything marked x-cloak stays hidden until Alpine boots and removes the attribute (the mobile close icon / chatbox panel would otherwise flash on load). Every landing theme carries this rule. */ [x-cloak] { display: none !important; } /* Skip-to-content link (a11y) — visually hidden until focused. */ .qp-skip { position: absolute; left: -9999px; top: 0; z-index: 200; background: #2E2A28; color: #fff; padding: 10px 16px; border-radius: 0 0 10px 0; font-size: 13px; font-weight: 600; text-decoration: none; } .qp-skip:focus { left: 0; } /* Keyboard focus ring for the sea of inline-styled links/buttons (a11y). */ a:focus-visible, button:focus-visible, summary:focus-visible { outline: 3px solid rgb(var(--accent) / 0.55); outline-offset: 2px; border-radius: 6px; } /* Keyframe ported from the prototype's inline