/* ReeveDesk site (reevedesk.com, #278, #282). Builds on /nr.css, the product-site look
   shared with getlibrepbx.com and serviceaven.com: ink on paper, Newsreader
   display, hairline rules, green only as a functional mark. Only ReeveDesk
   pieces live here. No tints, no colored borders, no amber/orange/yellow. */

/* brand: the mark, the text wordmark, the byline */
.rd-brand{display:inline-flex;align-items:center;gap:10px}
.rd-mark{width:28px;height:28px;flex:none;display:block}
.brand .rd-word{font-style:normal;font-weight:600;color:var(--ink);padding:0}
.brand .rd-by{font-style:italic;font-weight:500;color:var(--muted);font-size:.78em;padding-left:2px}
.site-foot .fbrand .rd-by{font-style:italic;font-weight:500;color:#a6a599;font-size:.8em;padding-left:6px}

/* honest status words beside a heading or a feature */
.rd-st{display:inline-flex;align-items:center;gap:7px;font-family:system-ui,sans-serif;font-size:.78rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.rd-st i{width:8px;height:8px;border-radius:50%;background:#9aa0a6;display:inline-block}
.rd-st.sm{font-size:.72rem;letter-spacing:.06em;margin-left:8px;vertical-align:2px}
.hero .rd-st,.rd-sub .rd-st{white-space:normal;line-height:1.4}
.rd-st i{flex:none}
.hero .rd-st{margin-bottom:22px}

/* hero diagram: how a request moves through ReeveDesk */
.rd-diagram{margin:64px 0 0;border:1px solid var(--line);background:#fff}
.rd-diagram svg{display:block;width:100%;height:auto}
.rd-diagram figcaption{border-top:1px solid var(--line);padding:12px 16px;font-size:.84rem;color:var(--muted)}
.rd-diagram .d-box{fill:#fff;stroke:#1c1e19;stroke-width:1.2}
.rd-diagram .d-soft{fill:#fff;stroke:#b5b3a8;stroke-width:1}
.rd-diagram .d-line{stroke:#1c1e19;stroke-width:1.2;fill:none}
.rd-diagram .d-dash{stroke:#8a8d82;stroke-width:1.2;fill:none;stroke-dasharray:5 5}
.rd-diagram .d-t{font-family:system-ui,-apple-system,"Segoe UI",Helvetica,Arial,sans-serif;font-size:15px;fill:#1c1e19;font-weight:600}
.rd-diagram .d-s{font-family:system-ui,-apple-system,"Segoe UI",Helvetica,Arial,sans-serif;font-size:13px;fill:#5b6054}
.rd-diagram .d-m{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;fill:#5b6054}
.rd-diagram .d-h{font-family:"Newsreader",Georgia,serif;font-size:21px;fill:#1c1e19;font-weight:600}
.rd-diagram .d-ok{fill:#226d41}
.rd-diagram .d-dot{fill:#9aa0a6}
.rd-diagram svg.rd-diagram-sm{display:none}
@media(max-width:720px){.rd-diagram svg.rd-diagram-lg{display:none}.rd-diagram svg.rd-diagram-sm{display:block}}

/* ruled index: name left, description right (same pattern as the GetLibre products) */
.rd-rows{margin-top:48px;border-top:1px solid var(--ink)}
.rd-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:20px 56px;padding:36px 0;border-bottom:1px solid var(--line)}
.rd-row h3,.rd-row .rd-rh{font-size:clamp(1.45rem,2.1vw,1.8rem)}
.rd-row .role{font-size:.92rem;color:var(--muted);margin-top:8px}
.rd-row .rd-st{margin-top:12px}
.rd-row p{color:var(--ink-soft);margin:0}
.rd-row ul{list-style:none;margin:16px 0 0;padding:0}
.rd-row li{padding:9px 0;border-top:1px solid var(--line-soft);font-size:.97rem;color:var(--ink-soft)}
.rd-row li b{color:var(--ink);font-weight:600}
@media(max-width:760px){.rd-row{grid-template-columns:1fr}}

.rd-two{display:grid;grid-template-columns:1fr 1fr;gap:40px 64px;margin-top:44px}
.rd-two>div{min-width:0}
.rd-two h3{font-size:1.35rem;margin-bottom:10px}
.rd-two p{color:var(--ink-soft)}
.rd-two p:last-child{margin-bottom:0}
@media(max-width:760px){.rd-two{grid-template-columns:1fr}}


/* small steps list (connect a mailbox) */
.rd-steps{list-style:none;counter-reset:s;margin:20px 0 0;padding:0}
.rd-steps li{counter-increment:s;position:relative;padding:12px 0 12px 40px;border-top:1px solid var(--line-soft);color:var(--ink-soft);font-size:1rem}
.rd-steps li:before{content:counter(s);position:absolute;left:0;top:11px;font-family:"Newsreader",Georgia,serif;font-weight:600;font-size:1.15rem;color:var(--ink)}
.rd-steps li b{color:var(--ink);font-weight:600}

/* plain code sample (API section) */
.rd-code{margin:20px 0 0;border:1px solid var(--line);background:#fff;padding:18px 20px;overflow-x:auto;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.86rem;line-height:1.6;color:var(--ink)}
.rd-code .c{color:var(--muted)}

/* early access form: single step, classes from nr.css .formcard/.field */
.rd-form .formcard{margin:40px 0 0}
.rd-form .field select{appearance:auto}
.rd-form .consent{font-size:.86rem;color:var(--muted);margin:6px 0 0}
.rd-form .navrow{justify-content:flex-start;gap:18px;flex-wrap:wrap}
.rd-form .done{text-align:left;padding:8px 0}
.rd-form .done .big{margin:0 0 18px}
.rd-form .done h3{margin-bottom:10px}
.rd-hp{position:absolute;left:-9999px;top:-9999px;width:1px;height:1px;overflow:hidden}

/* sub-page hero (features, security) */
.rd-sub{padding:72px 24px 40px}
.rd-sub h1{max-width:20ch;margin-bottom:22px}
.rd-toc{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:28px;font-size:.95rem}
.rd-toc a{color:var(--ink-soft)}

.rd-note{font-size:.88rem;color:var(--muted);margin-top:28px;max-width:80ch}
.rd-cta2{margin-left:10px}

@media(min-width:901px) and (max-width:1060px){.site-head .nav{gap:18px}}
@media(min-width:901px) and (max-width:980px){.site-head .nav{gap:12px}.site-head .head-in{gap:16px}}
@media(max-width:720px){.rd-sub{padding:52px 16px 28px}}
@media(max-width:640px){
  .rd-cta2{margin:12px 0 0}
  .dark .btn.lg{width:100%;text-align:center}
  .rd-form .navrow .btn{width:100%;text-align:center}
}
@media(max-width:420px){.rd-mark{width:24px;height:24px}.brand .rd-by{display:none}}

/* ---- #282: the full site ---- */

/* skip link: hidden until focused */
.rd-skip{position:absolute;left:16px;top:-60px;z-index:100;background:var(--ink);color:#fff;padding:10px 16px;font-weight:600;text-decoration:none}
.rd-skip:focus{top:12px;color:#fff}

/* header: the current page, and Sign in set apart from the menu */
.nav a[aria-current="page"]{color:var(--ink);text-decoration:underline;text-underline-offset:5px;text-decoration-color:var(--ink)}
.nav .rd-signin{padding-left:24px;border-left:1px solid var(--line)}
.nav-mobile a[aria-current="page"]{font-weight:700}

/* spacing helpers used instead of inline styles */
.rd-h2{max-width:22ch}
.rd-lead{margin-top:20px}
.rd-more{margin-top:28px;font-weight:600}
.rd-flist{margin-top:0}
.rd-narrow{max-width:760px}
.rd-flow,.rd-steps.rd-narrow{margin-top:36px}
.rd-st-top{margin-bottom:18px}
.rd-faq{margin-left:0}
.dark .rd-center{margin:0 auto}
.rd-cta-lead{margin:22px auto 32px}
.rd-first{padding-top:24px}
.rd-sub h1{margin-top:18px}
.rd-gap{margin-top:56px}
.rd-small{font-size:.92rem;color:var(--muted);margin-top:16px}
.rd-ul0{margin-top:0 !important}
.rd-row ul.rd-ul0 li:first-child{border-top:0;padding-top:0}
.rd-later{margin-top:72px}
.rd-later .flist{margin-top:24px}

/* "Coming": a quiet gray label, never a color */
.rd-soon{display:inline-block;font-family:system-ui,sans-serif;font-size:.7rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);background:#ededeb;padding:2px 7px 1px;margin-left:4px;vertical-align:1px;white-space:nowrap;line-height:1.5}

/* home: early access band */
.rd-split{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:28px 56px;align-items:end}
@media(max-width:760px){.rd-split{grid-template-columns:1fr}.rd-split-cta .btn{width:100%;text-align:center}}

/* how it works: the life of a request */
.rd-flow{list-style:none;counter-reset:f;padding:0;margin-bottom:0;border-top:1px solid var(--ink)}
.rd-flow li{counter-increment:f;display:grid;grid-template-columns:72px minmax(0,1fr);column-gap:24px;padding:28px 0;border-bottom:1px solid var(--line)}
.rd-flow li:before{content:counter(f);grid-row:1 / span 2;font-family:"Newsreader",Georgia,serif;font-weight:600;font-size:2.4rem;line-height:1;color:var(--ink)}
.rd-flow h3{font-size:1.35rem;margin-bottom:8px}
.rd-flow p{margin:0;color:var(--ink-soft);max-width:68ch}
@media(max-width:560px){.rd-flow li{grid-template-columns:44px minmax(0,1fr);column-gap:14px}.rd-flow li:before{font-size:1.8rem}}

/* how it works: status table */
.rd-table-wrap{margin-top:40px;overflow-x:auto}
.rd-table{width:100%;border-collapse:collapse;font-size:.98rem;min-width:520px}
.rd-table th,.rd-table td{text-align:left;padding:14px 16px 14px 0;border-bottom:1px solid var(--line);vertical-align:top;color:var(--ink-soft)}
.rd-table thead th{font-family:system-ui,sans-serif;font-size:.78rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--ink)}
.rd-table tbody th{color:var(--ink);font-weight:600;white-space:nowrap}

/* early access page: the form beside what happens next */
.rd-form-grid{display:grid;grid-template-columns:minmax(0,640px) minmax(0,1fr);gap:48px 64px;align-items:start}
.rd-form-grid .formcard{margin:24px 0 0;max-width:none}
.rd-aside{padding-top:24px}
.rd-aside-h{font-size:1.35rem;margin:0 0 4px}
.rd-aside .rd-steps{margin:8px 0 36px}
.rd-aside .flist{margin-top:12px}
@media(max-width:980px){.rd-form-grid{grid-template-columns:1fr}.rd-aside{padding-top:0}}
@media(max-width:560px){.rd-form-grid .formcard{padding:28px 20px}}