/* Renard et Cie stealth site: one stylesheet for every page. */

@font-face { font-family:"Geist"; font-style:normal; font-weight:400 600; font-display:swap; src:url("/assets/fonts/geist-latin.woff2") format("woff2"); }
@font-face { font-family:"JetBrains Mono"; font-style:normal; font-weight:400 600; font-display:swap; src:url("/assets/fonts/jetbrains-mono-latin.woff2") format("woff2"); }

:root {
  --paper:#FAF8F3; --paper-2:#F3EFE6; --cream:#F6EFE0; --white:#FFFFFF;
  --ink:#1C1917; --ink-2:#57534E; --ink-3:#78716C; --line:#E4DFD4; --line-soft:#EFEBE3;
  --scarlet:#6E1A2C; --scarlet-deep:#4A1020; --burgundy:#6E1A2C; --burgundy-deep:#4A1020;
  --moss:#4F6B3A; --forest:#2E4530; --sage:#A9B89A; --ochre:#6E1A2C; --ochre-ink:#4A1020;
  --sans:"Geist", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --mono:"JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --gutter:clamp(20px, 4vw, 56px);
  --shadow:0 1px 2px rgba(28, 25, 23, .04), 0 30px 60px -40px rgba(28, 25, 23, .32);
}

/* Base */
*, *::before, *::after { box-sizing:border-box; margin:0; padding:0; }
html { -webkit-text-size-adjust:100%; }
body { min-height:100vh; min-height:100dvh; display:flex; flex-direction:column; background:var(--paper); color:var(--ink); font:400 16px/1.6 var(--sans); -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; }
a { color:inherit; }
button { font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
.ico { display:block; flex:none; width:20px; height:20px; }
.wrap { width:min(1280px, 100% - 2 * var(--gutter)); margin-inline:auto; }
:focus-visible { outline:2px solid var(--burgundy); outline-offset:3px; border-radius:6px; }
.skip { position:absolute; left:var(--gutter); top:-64px; z-index:10; padding:10px 14px; border-radius:8px; background:var(--ink); color:var(--white); font:500 14px/1 var(--sans); text-decoration:none; }
.skip:focus { top:12px; }
.sr { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }

/* Header */
.top { display:flex; align-items:center; justify-content:space-between; gap:20px; padding-block:22px; }
.brand { display:inline-flex; align-items:center; gap:12px; font:600 17px/1 var(--sans); letter-spacing:-.012em; color:var(--ink); text-decoration:none; }
.brand-mark { display:block; width:30px; height:30px; }
.top-meta { display:flex; align-items:center; gap:20px; }
.top-note { display:inline-flex; align-items:center; gap:8px; font:400 12.5px/1 var(--mono); color:var(--ink-3); }
.top-note .ico { width:17px; height:17px; color:var(--ochre-ink); }
.pill { display:inline-flex; align-items:center; gap:9px; height:32px; padding:0 14px 0 12px; border:1px solid var(--line); border-radius:999px; background:var(--white); font:500 12.5px/1 var(--mono); color:var(--ink); }
.pulse { position:relative; width:8px; height:8px; border-radius:50%; background:var(--scarlet); }
.pulse::after { content:""; position:absolute; inset:-4px; border:1.5px solid var(--scarlet); border-radius:50%; opacity:0; animation:ring 2.4s ease-out infinite; }
@keyframes ring { 0% { transform:scale(.4); opacity:.7; } 80%, 100% { transform:scale(1.3); opacity:0; } }

.lang { display:inline-flex; gap:2px; height:32px; padding:3px; border:1px solid var(--line); border-radius:999px; background:var(--white); }
.lang a { display:inline-flex; align-items:center; padding:0 10px; border-radius:999px; font:500 12px/1 var(--mono); letter-spacing:.02em; color:var(--ink-3); text-decoration:none; transition:color .2s, background-color .2s; }
.lang a[aria-current] { background:var(--burgundy); color:var(--cream); }
@media (hover:hover) { .lang a:not([aria-current]):hover { color:var(--burgundy); } }

/* Headings, lede and buttons shared by every page */
.display { font:600 clamp(36px, 4.2vw, 62px)/1.02 var(--sans); letter-spacing:-.045em; text-wrap:balance; }
.caret { display:inline-block; width:.34em; height:.72em; margin-left:.1em; border-radius:2px; background:var(--scarlet); vertical-align:-.02em; animation:blink 1.1s steps(1) infinite; }
@keyframes blink { 50% { opacity:0; } }
.lede { margin-top:26px; max-width:31em; font-size:18px; line-height:1.62; color:var(--ink-2); text-wrap:pretty; }
.actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:34px; }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:10px; height:50px; padding:0 22px 0 18px; border-radius:999px; font:500 15.5px/1 var(--sans); letter-spacing:-.005em; text-decoration:none; transition:background-color .2s, border-color .2s, color .2s, transform .2s; }
.btn:active { transform:translateY(1px); }
.btn-primary { background:var(--burgundy); color:var(--cream); }
.btn-quiet { border:1px solid var(--line); background:var(--white); color:var(--ink); }
.btn .i-done { display:none; color:var(--moss); }
.btn.is-done .i-copy { display:none; }
.btn.is-done .i-done { display:block; }
@media (hover:hover) {
  .btn-primary:hover { background:var(--burgundy-deep); }
  .btn-quiet:hover { border-color:#CBC3B4; }
}

/* Home page layout */
.stage { flex:1; display:grid; grid-template-columns:minmax(0, .72fr) minmax(0, 1fr); align-items:center; gap:clamp(40px, 5.5vw, 88px); padding-block:clamp(12px, 2.5vh, 32px) clamp(28px, 4vh, 48px); }

/* Window chrome, shared by the terminal, the documents and the 404 card */
.window { position:relative; overflow:hidden; border:1px solid var(--line); border-radius:16px; background:var(--white); box-shadow:var(--shadow); }
.term-bar { display:grid; grid-template-columns:96px minmax(0, 1fr) 96px; align-items:center; height:44px; padding:0 16px; border-bottom:1px solid var(--line); background:#FCFBF8; }
.lights { display:flex; gap:8px; }
.lights i { position:relative; width:12px; height:12px; border-radius:50%; box-shadow:inset 0 0 0 .5px rgba(28, 25, 23, .2); }
.lights i:nth-child(1) { background:var(--scarlet); }
.lights i:nth-child(2) { background:var(--sage); }
.lights i:nth-child(3) { background:var(--moss); }
.lights:hover i::after { position:absolute; inset:0; display:grid; place-items:center; font:600 9px/1 var(--mono); color:rgba(28, 25, 23, .6); }
.lights:hover i:nth-child(1)::after { content:"×"; }
.lights:hover i:nth-child(2)::after { content:"−"; }
.lights:hover i:nth-child(3)::after { content:"+"; }
.term-title { display:flex; align-items:center; justify-content:center; gap:8px; min-width:0; font:500 12.5px/1 var(--mono); color:var(--ink-2); white-space:nowrap; }
.term-title .ico { width:15px; height:15px; color:var(--burgundy); }
.term-title .sep { color:var(--ink-3); }
.term-size { font:400 11.5px/1 var(--mono); color:var(--ink-3); text-align:right; white-space:nowrap; }

/* Terminal */
.term { color:var(--ink); font:400 13px/1.65 var(--mono); font-variant-ligatures:none; }
.term-body { display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, 1fr); grid-template-rows:376px 192px; grid-template-areas:"session session" "status log"; gap:20px 14px; padding:22px 16px 16px; }
.pane { position:relative; min-width:0; border:1px solid var(--line); border-radius:10px; transition:border-color .2s; }
.pane-title, .pane-meta { position:absolute; top:-10px; z-index:1; display:inline-flex; align-items:center; gap:6px; padding:0 7px; background:var(--white); font:500 11px/19px var(--mono); color:var(--ink-3); white-space:nowrap; }
.pane-title { left:12px; }
.pane-meta { right:12px; font-weight:400; }
.pane-title .ico, .pane-meta .ico { width:13px; height:13px; }
.pane-session { grid-area:session; }
.pane-session.is-focused { border-color:rgba(110, 26, 44, .5); }
.pane-session.is-focused .pane-title { color:var(--burgundy); }
.pane-session .pane-meta .on, .pane-session.is-focused .pane-meta .off { display:none; }
.pane-session.is-focused .pane-meta .on { display:inline; }
.scroll { position:absolute; inset:16px 6px 10px 18px; overflow-y:auto; overscroll-behavior:contain; padding-right:12px; cursor:text; scrollbar-width:thin; scrollbar-color:var(--line) transparent; }

/* Session output */
.line { min-height:1.65em; white-space:pre-wrap; overflow-wrap:anywhere; }
.block { margin:2px 0 12px; }
.block > * + * { margin-top:4px; }
.out-p { max-width:76ch; }
.ps-path { color:var(--moss); font-weight:500; }
.ps-sym { color:var(--ink-3); }
.tk-bin { color:var(--burgundy); font-weight:600; --fg:var(--burgundy); }
.tk-cmd { color:var(--ink); }
.tk-bad { color:var(--scarlet-deep); --fg:var(--scarlet-deep); }
.tk-flag { color:var(--ochre-ink); --fg:var(--ochre-ink); }
.tk-arg { color:var(--ink-2); --fg:var(--ink-2); }
.c-dim, .comment { color:var(--ink-3); }
.c-err { color:var(--scarlet-deep); }
.term a { overflow-wrap:anywhere; }
.term a, .cmd-link { color:var(--burgundy); text-decoration:underline; text-decoration-color:rgba(110, 26, 44, .35); text-underline-offset:3px; }
.cmd-link { font:inherit; }
.prompt { position:relative; }
.prompt input { position:absolute; inset:0; width:100%; height:100%; padding:0; border:0; opacity:0; background:transparent; color:transparent; caret-color:transparent; font-size:16px; }
.cur { --fg:var(--ink); display:inline-block; min-width:1ch; border-radius:2px; box-shadow:inset 0 0 0 1.25px var(--ink-3); }
.cur-ghost { --fg:var(--ink-3); color:var(--ink-3); }
.prompt.is-auto .cur, .prompt.is-focused .cur, .cur.is-solid { background:var(--ink); color:var(--white); box-shadow:none; }
.prompt.is-focused .cur, .cur.is-solid { animation:cblink 1.06s steps(1) infinite; }
@keyframes cblink { 50% { background:transparent; color:var(--fg); } }
.ghost { color:var(--ink-3); }

.kv > div { display:grid; grid-template-columns:12ch minmax(0, 1fr); column-gap:14px; }
.kv dt { color:var(--burgundy); }
.kv dd { color:var(--ink-2); }
.kv-wide > div { grid-template-columns:14ch minmax(0, 1fr); }
.kv-wide dd { color:var(--ink); }
.nums { list-style:none; counter-reset:n; }
.nums li { display:grid; grid-template-columns:4ch minmax(0, 1fr); counter-increment:n; }
.nums li + li { margin-top:4px; }
.nums li::before { content:counter(n, decimal-leading-zero); color:var(--scarlet-deep); }
.ls { display:flex; flex-wrap:wrap; gap:0 3ch; }
.ls .d { color:var(--moss); font-weight:500; }

/* neofetch-style readout with the fox */
.nf { display:grid; grid-template-columns:96px minmax(0, 1fr); gap:30px; align-items:start; padding:6px 0 0 4px; }
.nf-fox { display:block; width:96px; height:96px; margin-top:8px; overflow:visible; }
.nf-fox .o { fill:var(--scarlet); stroke:var(--scarlet); stroke-width:2.5; stroke-linejoin:round; stroke-dasharray:1; stroke-dashoffset:0; animation:draw 1.1s cubic-bezier(.65, 0, .35, 1) both, fillin .45s .95s ease-out both; }
.nf-fox .m { fill:var(--cream); animation:fade .4s 1.2s ease-out both; }
.nf-fox .n { fill:var(--ink); animation:fade .3s 1.4s ease-out both; }
.nf-fox .e { fill:var(--cream); transform-box:fill-box; transform-origin:center; animation:fade .3s 1.4s ease-out both, wink 5.5s 3s infinite; }
@keyframes draw { from { stroke-dashoffset:1; } }
@keyframes fillin { from { fill:rgba(110, 26, 44, 0); stroke:var(--burgundy); } }
@keyframes fade { from { opacity:0; } }
@keyframes wink { 0%, 93%, 100% { transform:scaleY(1); } 95.5% { transform:scaleY(.12); } }
.nf-head { font-weight:600; }
.nf-head .a { color:var(--scarlet-deep); }
.nf-head .b { color:var(--moss); }
.nf-rule { color:var(--ink-3); }
.nf-list > div { display:grid; grid-template-columns:10ch minmax(0, 1fr); column-gap:12px; }
.nf-list dt { color:var(--scarlet-deep); font-weight:500; }
.nf-swatches { display:flex; margin-top:8px; }
.nf-swatches i { width:24px; height:14px; }
.nf-swatches i:first-child { border-radius:3px 0 0 3px; }
.nf-swatches i:last-child { border-radius:0 3px 3px 0; }
.sw-burgundy-deep { background:var(--burgundy-deep); }
.sw-cream { background:var(--cream); box-shadow:inset 0 0 0 1px var(--line); }
.sw-burgundy { background:var(--burgundy); }
.sw-moss { background:var(--moss); }
.sw-forest { background:var(--forest); }
.sw-sage { background:var(--sage); }
.sw-ochre { background:var(--ochre); }
.sw-ink { background:var(--ink); }

/* Status pane */
.pane-status { grid-area:status; padding:20px 16px 12px; container-type:inline-size; }
@container (max-width:360px) { .stat .bar { display:none; } }
.stat { list-style:none; display:grid; gap:3px; }
.stat li { display:grid; grid-template-columns:18px 10.5ch minmax(0, 1fr) auto; align-items:center; column-gap:10px; min-height:25px; }
.mk { display:flex; align-items:center; justify-content:center; }
.mk .ico { width:16px; height:16px; }
.mk-stealth { color:var(--scarlet); }
.mk-done { color:var(--moss); }
.mk-busy { color:var(--ochre); }
.mk-busy .ico { animation:spin 2.6s linear infinite; }
.mk-wait { color:var(--ink-3); }
.stat .k { color:var(--ink-3); }
.stat .v { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bar { position:relative; width:40px; height:4px; overflow:hidden; border-radius:2px; background:var(--line-soft); }
.bar i { position:absolute; top:0; bottom:0; left:0; width:42%; border-radius:2px; background:var(--ochre); animation:slide 1.9s cubic-bezier(.65, 0, .35, 1) infinite; }
@keyframes slide { from { transform:translateX(-100%); } to { transform:translateX(240%); } }
@keyframes spin { to { transform:rotate(360deg); } }

/* Log pane */
.pane-log { grid-area:log; }
.live { color:var(--moss); }
.live::before { content:""; width:6px; height:6px; border-radius:50%; background:var(--moss); animation:breathe 2s ease-in-out infinite; }
@keyframes breathe { 50% { opacity:.3; } }
.log { position:absolute; inset:16px 14px 10px 16px; display:flex; flex-direction:column; justify-content:flex-end; overflow:hidden; list-style:none; font-size:12px; line-height:1.78; -webkit-mask-image:linear-gradient(to bottom, transparent, #000 40px); mask-image:linear-gradient(to bottom, transparent, #000 40px); }
.log li { display:grid; flex:none; grid-template-columns:8ch 10ch minmax(0, 1fr); column-gap:10px; white-space:nowrap; animation:logIn .5s ease-out both; }
.log li.is-seed { animation:none; }
@keyframes logIn { from { opacity:0; transform:translateY(8px); } }
.log .t { color:var(--ink-3); font-variant-numeric:tabular-nums; }
.log .m { overflow:hidden; text-overflow:ellipsis; color:var(--ink-2); }
.s-workspace { color:var(--moss); }
.s-website { color:var(--scarlet-deep); }
.s-principles, .s-practices { color:var(--burgundy); }
.s-team { color:var(--forest); }
.s-notes { color:var(--burgundy); }
.s-invoices, .s-files { color:var(--ink-2); }
.s-redacted { color:var(--ink); }
.redact { display:flex; align-items:center; gap:6px; }
.redact i { display:block; flex:none; height:9px; border-radius:2px; background:var(--ink); }
.w-20 { width:20px; } .w-22 { width:22px; } .w-28 { width:28px; } .w-34 { width:34px; }
.w-40 { width:40px; } .w-46 { width:46px; } .w-52 { width:52px; } .w-58 { width:58px; }

/* tmux-style status line */
.term-status { display:flex; align-items:stretch; height:30px; border-top:1px solid var(--line); background:#F8F6F1; font:500 11.5px/30px var(--mono); color:var(--ink-3); white-space:nowrap; }
.tm-session { padding:0 12px; background:var(--burgundy); color:var(--cream); font-weight:600; }
.tm-win { padding:0 12px; background:var(--white); color:var(--ink); box-shadow:inset -1px 0 0 var(--line); }
.tm-right { display:flex; gap:18px; margin-left:auto; padding:0 14px; font-variant-numeric:tabular-nums; }
.tm-dot { display:inline-block; width:6px; height:6px; margin-right:7px; border-radius:50%; background:var(--scarlet); vertical-align:1px; }

/* Command chips */
.chips { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-top:18px; }
.chips-label { margin-right:6px; font:400 12.5px/1 var(--mono); color:var(--ink-3); }
.chip { display:inline-flex; align-items:center; gap:7px; height:34px; padding:0 14px 0 11px; border:1px solid var(--line); border-radius:999px; background:var(--white); font:500 12.5px/1 var(--mono); color:var(--ink-2); transition:color .2s, border-color .2s; }
.chip .ico { width:16px; height:16px; color:var(--ink-3); transition:color .2s; }
@media (hover:hover) {
  .chip:hover { border-color:rgba(110, 26, 44, .4); color:var(--burgundy); }
  .chip:hover .ico { color:var(--burgundy); }
}

/* Document pages: privacy and terms */
.page { flex:1; padding-block:clamp(12px, 2.5vh, 32px) clamp(40px, 6vh, 72px); }
.doc { max-width:820px; margin-inline:auto; }
.doc-body { padding:clamp(28px, 5vw, 60px); }
.doc-body h1 { font:600 clamp(32px, 4.2vw, 48px)/1.06 var(--sans); letter-spacing:-.038em; text-wrap:balance; }
.doc-body .lede { margin-top:20px; max-width:36em; font-size:18px; }
.doc-body section { margin-top:34px; padding-top:28px; border-top:1px solid var(--line-soft); }
.doc-body h2 { display:grid; grid-template-columns:4ch minmax(0, 1fr); align-items:baseline; font:600 20px/1.35 var(--sans); letter-spacing:-.016em; text-wrap:balance; }
.doc-body h2 .n { font:500 13px/1 var(--mono); letter-spacing:0; color:var(--scarlet-deep); }
.doc-body section p { max-width:62ch; margin:10px 0 0 4ch; padding-left:0; color:var(--ink-2); }
.doc-body section p a, .doc-body .lede a { color:var(--burgundy); text-decoration-color:rgba(110, 26, 44, .35); text-underline-offset:3px; }
.doc-meta { display:flex; align-items:center; gap:8px; margin-top:40px; font:400 12.5px/1.5 var(--mono); color:var(--ink-3); }
.doc-meta .ico { width:16px; height:16px; }
.doc-actions { margin-top:28px; }

/* Not found page */
.lost { flex:1; display:grid; align-content:center; padding-block:clamp(24px, 6vh, 72px); }
.lost-inner { max-width:760px; }
.lost .display { font-size:clamp(38px, 5vw, 62px); }
.mini-term { margin-top:34px; }
.mini-body { padding:18px 22px 20px; }

/* Footer */
.foot { display:grid; grid-template-columns:minmax(0, 1fr) auto auto; align-items:center; gap:10px 28px; padding:18px 0 24px; border-top:1px solid var(--line); font:400 12.5px/1.5 var(--mono); color:var(--ink-3); }
.foot-launch { display:inline-flex; align-items:center; gap:8px; color:var(--ink-2); }
.foot-launch .ico { width:16px; height:16px; color:var(--burgundy); }
.foot-links { display:flex; flex-wrap:wrap; gap:6px 20px; }
.foot a { color:var(--ink-2); text-decoration:none; }
.foot a.mail { color:var(--burgundy); }
.foot a:hover, .foot a[aria-current="page"] { color:var(--burgundy); text-decoration:underline; text-underline-offset:3px; }

/* Narrower screens */
@media (max-width:1180px) {
  .stage { grid-template-columns:minmax(0, 1fr); align-content:center; align-items:start; gap:clamp(36px, 6vw, 56px); padding-top:clamp(16px, 4vw, 40px); }
  .intro { display:grid; grid-template-columns:minmax(0, 1.15fr) minmax(0, 1fr); grid-template-areas:"title lede" "title actions"; align-items:end; column-gap:56px; }
  .intro .display { grid-area:title; font-size:clamp(36px, 5.6vw, 58px); }
  .intro .lede { grid-area:lede; margin-top:0; font-size:17px; }
  .intro .actions { grid-area:actions; margin-top:26px; }
}
@media (max-width:900px) {
  .foot { grid-template-columns:minmax(0, 1fr); }
}
@media (max-width:820px) {
  .intro { display:block; }
  .intro .lede { margin-top:22px; }
  .intro .actions { margin-top:28px; }
}
@media (max-width:720px) {
  .top-note { display:none; }
  .term-bar { grid-template-columns:auto minmax(0, 1fr); padding:0 14px; }
  .term-title { justify-content:flex-end; }
  .term-size { display:none; }
  .term-body { grid-template-columns:minmax(0, 1fr); grid-template-rows:428px auto 156px; grid-template-areas:"session" "status" "log"; gap:22px; padding:22px 10px 12px; }
  .scroll { inset:16px 4px 8px 13px; padding-right:9px; }
  .pane-status { padding:20px 12px 12px; }
  .log { inset:16px 12px 10px 13px; }
  .nf { grid-template-columns:56px minmax(0, 1fr); grid-template-areas:"fox head" "fox rule" "list list" "sw sw"; gap:0 14px; padding-left:0; }
  .nf-info { display:contents; }
  .nf-fox { grid-area:fox; width:56px; height:56px; margin-top:0; }
  .nf-head { grid-area:head; align-self:end; }
  .nf-rule { grid-area:rule; align-self:start; }
  .nf-list { grid-area:list; margin-top:10px; }
  .nf-swatches { grid-area:sw; }
  .nf-list > div { grid-template-columns:9ch minmax(0, 1fr); column-gap:10px; }
  .kv > div, .kv-wide > div { grid-template-columns:minmax(0, 1fr); }
  .kv > div + div { margin-top:6px; }
  .tm-up { display:none; }
  .btn { flex:1 1 auto; }
  .doc-body h2 { grid-template-columns:minmax(0, 1fr); row-gap:6px; }
  .doc-body section p { margin-left:0; }
  .mini-body { padding:16px 16px 18px; }
}
@media (max-width:440px) {
  .top-meta { gap:10px; }
  .pill { display:none; }
  .term { font-size:12.5px; }
  .tm-win { display:none; }
  .chips-label { width:100%; margin:0 0 4px; }
}
@media (hover:none) { .pane-session .pane-meta { display:none; } }

/* Motion preferences, and ?reveal=all for still renders */
@media (prefers-reduced-motion:reduce) {
  *, *::before, *::after { animation-duration:.001ms !important; animation-delay:0s !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
  .bar i { animation:none !important; }
}
.still *, .still *::before, .still *::after { animation:none !important; transition:none !important; }
