/* Pronta site style v2 (2026-10-09), shared by the static pages (privacy, beta guide, 404). The homepage carries the
   same look in src/styles/type-preview.css. One family: PP Neue Montreal (licensed web weights in /fonts), our
   black #1A1A1A and white #EBEBEB, pink #DA649B as the one accent, yellow #EDAE3D highlight. */
@font-face { font-family: "PP Neue Montreal Web"; src: url("/fonts/PPNeueMontreal-Regular.woff2") format("woff2"), url("/fonts/PPNeueMontreal-Regular.woff") format("woff"); font-weight: 1 479; font-display: swap; }
@font-face { font-family: "PP Neue Montreal Web"; src: url("/fonts/PPNeueMontreal-Medium.woff2") format("woff2"), url("/fonts/PPNeueMontreal-Medium.woff") format("woff"); font-weight: 480 599; font-display: swap; }
@font-face { font-family: "PP Neue Montreal Web"; src: url("/fonts/PPNeueMontreal-Bold.woff2") format("woff2"), url("/fonts/PPNeueMontreal-Bold.woff") format("woff"); font-weight: 600 799; font-display: swap; }
@font-face { font-family: "PP Neue Montreal Web"; src: url("/fonts/PPNeueMontreal-Black.woff2") format("woff2"), url("/fonts/PPNeueMontreal-Black.woff") format("woff"); font-weight: 800 1000; font-display: swap; }
:root, :root[data-theme="light"], :root:not([data-theme="dark"]) {
  --bg: #1a1a1a; --surface: #222222; --sunk: #141414; --ink: #ebebeb; --ink-2: #b4b4b4; --ink-3: #858585;
  --line: rgba(235,235,235,.22); --accent: #da649b; --accent-ink: #1a1a1a; --accent-text: #da649b; --accent-wash: #2a1a22; --warn: #ff8a7f;
  --sans: "PP Neue Montreal Web", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif; --serif: var(--sans); color-scheme: dark;
}
@media (prefers-color-scheme: light) { :root:not([data-theme="dark"]) { --bg: #1a1a1a; --ink: #ebebeb; --ink-2: #b4b4b4; --ink-3: #858585; --line: rgba(235,235,235,.22); --accent-text: #da649b; color-scheme: dark; } }
body { font-family: var(--sans) !important; letter-spacing: -.01em; }
::selection { background: #edae3d; color: #1a1a1a; }
h1, .hero h1 { font-weight: 400; letter-spacing: -.045em; }
h2 { font-weight: 700; letter-spacing: -.035em; }
h3, strong, b { font-weight: 600; }
.voice { font-family: var(--sans) !important; font-style: normal !important; font-weight: 700 !important; display: inline-block; transform: skewX(-8deg); color: var(--ink) !important; letter-spacing: -.02em; }
a:hover { font-weight: 700; }
.top .logo { display: block; height: 22px; width: auto; color: var(--ink); }
.tag { border-color: var(--line); }

/* v3 (2026-10-10): matches pronta.app. Black ground, our white for every line of text (no greys), a pink bar under
   the masthead like the closing cover, tracked caps for labels, square corners, and the yellow highlighter on links. */
:root, :root[data-theme="light"] { --bg: #1a1a1a !important; --surface: #1a1a1a !important; --sunk: #1a1a1a !important; --ink: #ebebeb !important; --ink-2: #ebebeb !important; --ink-3: #ebebeb !important; --line: #ebebeb !important; color-scheme: dark; }
@media (prefers-color-scheme: light) { :root:not([data-theme="dark"]) { --bg: #1a1a1a !important; --surface: #1a1a1a !important; --sunk: #1a1a1a !important; --ink: #ebebeb !important; --ink-2: #ebebeb !important; --ink-3: #ebebeb !important; --line: #ebebeb !important; color-scheme: dark; } }
html, body { background: #1a1a1a !important; color: #ebebeb !important; }
body, body p, body li, body span, body td, body th, body small, body .meta, body .meta * { color: #ebebeb !important; }
header.top { border-bottom: 14px solid #da649b !important; padding-bottom: 22px !important; margin-bottom: 8px; }
header.top .pill, header.top span, header.top a:not([aria-label]) { border: 0 !important; border-radius: 0 !important; background: none !important; font-size: 12px !important; font-weight: 700 !important; letter-spacing: .14em !important; text-transform: uppercase; color: #ebebeb !important; padding: 0 !important; }
h1 { text-transform: uppercase; font-weight: 700 !important; letter-spacing: -.02em !important; line-height: .9 !important; }
h1 .voice { font-style: normal !important; font-weight: 700 !important; -webkit-text-stroke: 1.5px #ebebeb; color: transparent !important; }
h2, h3 { font-weight: 700 !important; letter-spacing: -.02em !important; }
hr, section, .doc section { border-color: #ebebeb !important; }
* { border-radius: 0 !important; }
a { color: #ebebeb !important; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; background-image: linear-gradient(#edae3d, #edae3d); background-repeat: no-repeat; background-position: 0 50%; background-size: 0% 100%; transition: background-size .35s cubic-bezier(.7,0,.2,1), color .2s ease .05s; }
a:hover, a:focus-visible { color: #1a1a1a !important; background-size: 100% 100%; text-decoration-color: transparent; outline: none; }
header.top a[aria-label]:hover { background: none !important; color: inherit !important; }
li::marker { color: #da649b; }
footer, footer * { font-size: 12px !important; font-weight: 700 !important; letter-spacing: .14em !important; text-transform: uppercase; color: #ebebeb !important; }
footer a { text-decoration: none; }
@media (prefers-reduced-motion: reduce) { a { transition: none; } }

/* Links as on pronta.app: no browser underline. Links are Bold with nothing under them; on hover/focus the yellow highlighter wipes across the text left to right
   and the text turns black.
   The index and footer links are tracked caps with the same highlighter. */
a, a:visited { color: #ebebeb !important; text-decoration: none !important; font-weight: 700;
  background-image: linear-gradient(#edae3d, #edae3d) !important; background-repeat: no-repeat !important; background-position: 0 0 !important; background-size: 0% 100% !important;
  padding: 0 2px; margin: 0 -2px; transition: background-size .35s cubic-bezier(.7,0,.2,1), color .2s ease .05s; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
a:hover, a:focus-visible { color: #1a1a1a !important; background-size: 100% 100% !important; outline: none; }
header.top a[aria-label], header.top a[aria-label]:hover { background: none !important; padding: 0; margin: 0; }
nav.index a, footer a { background-size: 0% 100% !important; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; }
nav.index a:hover, nav.index a:focus-visible, footer a:hover, footer a:focus-visible { background-size: 100% 100% !important; }
@media (prefers-reduced-motion: reduce) { a { transition: none; } }

/* 2026-10-14: the beta guide's way into Pronta is a real pink button (pink = act), never stripped to caps text like
   the other masthead links. Square, black text, hard shadow on hover. */
a.btn.primary.cta, a.btn.primary.cta:visited, header.top a.btn.primary.cta {
  display: inline-flex !important; align-items: center; gap: 10px; background: #da649b !important; background-image: none !important;
  color: #1a1a1a !important; border: 0 !important; margin: 0 !important; padding: 16px 26px !important; font-size: 17px !important; font-weight: 700 !important;
  letter-spacing: -.01em !important; text-transform: none; text-decoration: none !important; box-shadow: 0 0 0 #ebebeb; transition: transform .15s ease, box-shadow .15s ease; }
a.btn.primary.cta *, header.top a.btn.primary.cta span { color: #1a1a1a !important; font-size: inherit !important; letter-spacing: inherit !important; }
a.btn.primary.cta:hover, a.btn.primary.cta:focus-visible { color: #1a1a1a !important; transform: translate(-3px, -3px); box-shadow: 4px 4px 0 #ebebeb; }
header.top a.btn.primary.cta { padding: 12px 18px !important; font-size: 13px !important; font-weight: 700 !important; letter-spacing: .14em !important; text-transform: uppercase; }
header.top .home-link { margin-left: auto; margin-right: 18px !important; }
.hero-cta { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px; margin-top: 30px; }
.hero-cta-note { font-size: 15px; max-width: 46ch; line-height: 1.45; }
@media (prefers-reduced-motion: reduce) { a.btn.primary.cta { transition: none; } a.btn.primary.cta:hover { transform: none; } }
@media (max-width: 560px) { header.top a.btn.primary.cta.home-open { display: none !important; } header.top .home-link { margin-right: 0 !important; } }
