/* theconsigliere.ai — Brand Standards v2.0. One ground: ink. */
@font-face { font-family: 'IBM Plex Mono'; font-style: normal; font-weight: 400; font-display: swap; src: url('/fonts/ibm-plex-mono-400.woff2') format('woff2'); }
@font-face { font-family: 'IBM Plex Mono'; font-style: normal; font-weight: 500; font-display: swap; src: url('/fonts/ibm-plex-mono-500.woff2') format('woff2'); }
@font-face { font-family: 'IBM Plex Mono'; font-style: normal; font-weight: 600; font-display: swap; src: url('/fonts/ibm-plex-mono-600.woff2') format('woff2'); }

:root {
  --ink: #14110F;
  --parchment: #F5F1E8;
  --oxblood-lift: #A8383A;
  --oxblood-text: #C0585A;
  --gilt: #C6A15B;
  --ash: #A9A196;
  --label: #8A8278;
  --hash: #7C746A;
  --hairline: rgba(245, 241, 232, 0.14);
  --row-hover: rgba(168, 56, 58, 0.10);
  --gutter: 32px;
}

* { box-sizing: border-box; }
html { background: var(--ink); -webkit-text-size-adjust: 100%; }
body {
  margin: 0; min-height: 100vh; min-height: 100dvh;
  display: flex; flex-direction: column; align-items: center;
  background: var(--ink); color: var(--parchment);
  font-family: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  text-wrap: pretty;
}
a { color: inherit; text-decoration: none; }
:focus-visible { outline: 1px solid var(--gilt); outline-offset: 4px; }

main {
  flex: 1; width: 100%; max-width: 680px; padding: 0 var(--gutter);
  display: flex; flex-direction: column; justify-content: center; align-items: center;
}

.lockup { padding-top: 96px; display: flex; flex-direction: column; align-items: center; gap: 26px; }
.mark { width: 120px; height: auto; color: var(--parchment); display: block; }
.rule { width: 124px; height: 1px; background: var(--oxblood-lift); }
h1 {
  margin: 0; font-weight: 400; font-size: 14px; letter-spacing: 0.3em; text-indent: 0.3em;
  text-transform: uppercase; text-align: center; white-space: nowrap;
}

.projects { width: 100%; padding-top: 84px; display: flex; flex-direction: column; }
h2 {
  margin: 0; padding-bottom: 20px; text-align: center;
  font-size: 12px; font-weight: 400; letter-spacing: 0.02em; color: var(--label);
}
.ox { color: var(--oxblood-lift); padding-right: 8px; }

.row { display: flex; flex-direction: column; gap: 10px; padding: 24px 10px; border-top: 1px solid var(--hairline); }
a.row:hover, a.row:focus-visible { background: var(--row-hover); }
a.row:focus-visible { outline-offset: -1px; }
.head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 8px 20px; }
.domain { font-size: 21px; font-weight: 500; line-height: 1.3; min-width: 0; }
.prompt { color: var(--oxblood-lift); padding-right: 12px; }
.tld { color: var(--oxblood-text); }
.status { font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; white-space: nowrap; color: var(--label); }
.status.live { color: var(--oxblood-text); }
.desc { margin: 0; display: flex; gap: 12px; font-size: 14px; line-height: 1.7; color: var(--ash); }
.desc > span:last-child { max-width: 54ch; }
.hash { color: var(--hash); }

.row.pending .domain, .row.pending .desc { opacity: 0.62; }
.row.end { flex-direction: row; align-items: center; gap: 0; padding: 22px 10px 0; }
.row.end .prompt { font-size: 21px; line-height: 1; }
.caret { display: inline-block; width: 10px; height: 19px; background: var(--ash); animation: caret 1.1s step-end infinite; }
@keyframes caret { 0%, 48% { opacity: 1; } 52%, 100% { opacity: 0; } }

footer {
  width: 100%; max-width: 680px; padding: 72px var(--gutter) 40px;
  display: flex; flex-wrap: wrap; gap: 14px 28px; align-items: baseline; justify-content: center;
  font-size: 12px; color: var(--label);
}
footer a { color: var(--ash); }
footer a:hover { color: var(--oxblood-text); }

@media (max-width: 480px) {
  :root { --gutter: 20px; }
  .lockup { padding-top: 64px; }
  .projects { padding-top: 60px; }
  .row { padding-left: 4px; padding-right: 4px; }
  .domain { font-size: 19px; }
  footer { padding-top: 56px; }
}
@media (prefers-reduced-motion: reduce) { .caret { animation: none; } }