@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');
}
@font-face{
  font-family:'IBM Plex Sans';
  font-style:normal;
  font-weight:400 600;
  font-display:swap;
  src:url('fonts/ibm-plex-sans-variable.woff2') format('woff2');
}
@font-face{
  font-family:'Roboto Slab';
  font-style:normal;
  font-weight:400 700;
  font-display:swap;
  src:url('fonts/roboto-slab-variable.woff2') format('woff2');
}

:root{
  --paper:#F3E8CE;
  --paper-rgb:243,232,206;
  --paper-alt:#EADDB8;
  --ink:#1C1A17;
  --ink-soft:#5C5039;
  --ink-faint:#8C7F5C;
  --ink-faint-rgb:140,127,92;
  --line:#D2BF92;
  --stamp-blue:#263B8C;
  --approved:#1E6B45;
  --approved-rgb:30,107,69;
  --void:#9C3B2E;
  --radius:2px;
  --max:67.5rem;
}

:root[data-theme="dark"]{
  --paper:#1B1712;
  --paper-rgb:27,23,18;
  --paper-alt:#251F17;
  --ink:#F0E4C8;
  --ink-soft:#C7B78C;
  --ink-faint:#93855F;
  --ink-faint-rgb:147,133,95;
  --line:#3C3325;
  --stamp-blue:#7C93F0;
  --approved:#3FBE86;
  --approved-rgb:63,190,134;
  --void:#E07856;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}

body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:'IBM Plex Sans', sans-serif;
  font-size:1rem;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  transition:background-color .25s ease, color .25s ease;
}

h1,h2,h3{
  font-family:'Roboto Slab', serif;
  margin:0;
  letter-spacing:-0.01em;
}

a{color:inherit;}

:focus-visible{
  outline:2px solid var(--stamp-blue);
  outline-offset:3px;
}

.mono{font-family:'IBM Plex Mono', monospace;}

.eyebrow{
  font-family:'IBM Plex Mono', monospace;
  font-size:0.75rem;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--ink-soft);
  margin:0 0 0.625rem 0;
}

/* ---------- topbar ---------- */
.topbar{
  position:sticky;
  top:0;
  z-index:50;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:1rem 1.75rem;
  background:rgba(var(--paper-rgb),0.92);
  transition:background-color .25s ease, border-color .25s ease;
  backdrop-filter:blur(6px);
  border-bottom:1px solid var(--line);
}
.topbar .brand{
  font-family:'IBM Plex Mono', monospace;
  font-size:0.8125rem;
  letter-spacing:0.04em;
}
.topbar .brand strong{font-weight:600;}

.topbar-menu{
  display:flex;
  align-items:center;
  gap:1.75rem;
}

.topbar nav{display:flex; gap:1.375rem;}
.topbar nav a{
  font-family:'IBM Plex Mono', monospace;
  font-size:0.78125rem;
  letter-spacing:0.05em;
  text-decoration:none;
  color:var(--ink-soft);
  padding:0.25rem 0.125rem;
  border-bottom:1px solid transparent;
  transition:border-color .15s ease, color .15s ease;
}
.topbar nav a:hover{ color:var(--ink); border-color:var(--stamp-blue); }

.topbar-controls{
  display:flex;
  align-items:center;
  gap:0.625rem;
}

.menu-toggle{
  display:none;
  align-items:center;
  justify-content:center;
  width:29px;
  height:29px;
  padding:0;
  background:transparent;
  border:1px solid var(--line);
  border-radius:var(--radius);
  cursor:pointer;
  transition:border-color .15s ease, background .15s ease;
}
.menu-toggle:hover{ border-color:var(--stamp-blue); }
.menu-icon{
  position:relative;
  display:block;
  width:15px;
  height:1.5px;
  background:var(--ink-soft);
  border-radius:1px;
  transition:transform .2s ease, background .15s ease;
}
.menu-icon::before,
.menu-icon::after{
  content:'';
  position:absolute;
  left:0;
  width:15px;
  height:1.5px;
  background:var(--ink-soft);
  border-radius:1px;
  transition:transform .2s ease, top .2s ease;
}
.menu-icon::before{ top:-5px; }
.menu-icon::after{ top:5px; }
.menu-toggle[aria-expanded="true"] .menu-icon{ background:transparent; }
.menu-toggle[aria-expanded="true"] .menu-icon::before{ top:0; transform:rotate(45deg); }
.menu-toggle[aria-expanded="true"] .menu-icon::after{ top:0; transform:rotate(-45deg); }

.lang-switch{
  display:flex;
  gap:0.375rem;
}
.lang-btn{
  font-size:0.6875rem;
  letter-spacing:0.05em;
  padding:0.3125rem 0.5625rem;
  background:transparent;
  color:var(--ink-soft);
  border:1px solid var(--line);
  border-radius:var(--radius);
  cursor:pointer;
  transition:border-color .15s ease, color .15s ease, background .15s ease;
}
.lang-btn:hover{ border-color:var(--stamp-blue); color:var(--ink); }
.lang-btn.active{
  background:var(--ink);
  color:var(--paper);
  border-color:var(--ink);
}

.theme-toggle{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:29px;
  height:29px;
  padding:0;
  font-size:0.875rem;
  line-height:1;
  background:transparent;
  color:var(--ink-soft);
  border:1px solid var(--line);
  border-radius:var(--radius);
  cursor:pointer;
  transition:border-color .15s ease, color .15s ease, background .15s ease;
}
.theme-toggle:hover{ border-color:var(--stamp-blue); color:var(--ink); }

@media (max-width:40em){
  .menu-toggle{ display:inline-flex; }
  .topbar-menu{
    position:absolute;
    top:100%;
    left:0;
    right:0;
    flex-direction:column;
    align-items:stretch;
    gap:1.125rem;
    background:var(--paper);
    border-bottom:1px solid var(--line);
    padding:1.25rem 1.75rem 1.5rem;
    max-height:0;
    overflow:hidden;
    opacity:0;
    visibility:hidden;
    transition:max-height .3s ease, opacity .2s ease, visibility .3s;
  }
  .topbar-menu.open{
    max-height:24rem;
    opacity:1;
    visibility:visible;
  }
  .topbar nav{ flex-direction:column; gap:0.875rem; }
  .topbar nav a{ font-size:0.8125rem; }
  .topbar-controls{ width:100%; justify-content:center; }
}

/* ---------- hero ---------- */
.hero{
  max-width:var(--max);
  margin:0 auto;
  padding:clamp(2.5rem, 8vh, 4rem) 1.75rem 0 1.75rem;
}
.hero-inner{ max-width:none; }
.hero h1{
  font-size:clamp(1.875rem, 5vw, 3rem);
  line-height:1.12;
  margin-bottom:1.375rem;
}
.hero .lede{
  font-size:1.0625rem;
  color:var(--ink-soft);
  margin-bottom:1.875rem;
}
.hero .lede strong{color:var(--ink); font-weight:600;}

.cta-row{ display:flex; gap:0.875rem; flex-wrap:wrap; margin-bottom:3rem; }
.cta-row.center{ justify-content:center; }

.btn-primary, .btn-ghost{
  font-family:'IBM Plex Mono', monospace;
  font-size:0.8125rem;
  letter-spacing:0.03em;
  padding:0.8125rem 1.375rem;
  border-radius:var(--radius);
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  gap:0.5rem;
  transition:transform .15s ease, background .15s ease, border-color .15s ease;
}
.btn-primary{
  background:var(--ink);
  color:var(--paper);
  border:1px solid var(--ink);
}
.btn-primary:hover{ transform:translateY(-1px); background:var(--stamp-blue); border-color:var(--stamp-blue); }
.btn-ghost{
  background:transparent;
  color:var(--ink);
  border:1px solid var(--ink-soft);
}
.btn-ghost:hover{ transform:translateY(-1px); border-color:var(--ink); }

/* ticker */
.ticker{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.tick{
  padding:1.375rem 1.125rem;
  border-right:1px solid var(--line);
}
.tick:last-child{ border-right:none; }
.tick-value{
  display:block;
  font-family:'IBM Plex Mono', monospace;
  font-size:1.625rem;
  font-weight:600;
  color:var(--stamp-blue);
}
.tick-label{
  display:block;
  font-size:0.75rem;
  color:var(--ink-soft);
  margin-top:0.25rem;
  letter-spacing:0.01em;
}
@media (max-width:47.5em){
  .ticker{ grid-template-columns:repeat(2, 1fr); }
  .tick:nth-child(2){ border-right:none; }
}

/* ---------- sections ---------- */
.section{
  max-width:var(--max);
  margin:0 auto;
  padding:clamp(3rem, 9vh, 4.5rem) 1.75rem;
}
.section-head{ margin-bottom:2.25rem; }
.section-head.center{ text-align:center; }
.section-head h2{ font-size:clamp(1.5rem, 3.4vw, 2rem); }

.reveal{
  opacity:0;
  transform:translateY(0.875rem);
  transition:opacity .6s ease, transform .6s ease;
}
.reveal.in-view{ opacity:1; transform:translateY(0); }
@media (prefers-reduced-motion:reduce){
  .reveal{ opacity:1; transform:none; transition:none; }
}

/* ---------- ledger / experience ---------- */
.ledger{
  list-style:none;
  margin:0;
  padding:0;
  border-top:1px solid var(--line);
}
.entry{
  display:grid;
  grid-template-columns:9.375rem 1fr;
  gap:1.75rem;
  padding:1.75rem 0;
  border-bottom:1px dashed var(--line);
}
.entry-when{
  font-family:'IBM Plex Mono', monospace;
  font-size:0.8125rem;
  color:var(--ink-soft);
  padding-top:0.25rem;
}
.entry-top{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:0.75rem;
  flex-wrap:wrap;
}
.entry-top h3{ font-size:1.25rem; }
.entry-role{
  font-family:'IBM Plex Mono', monospace;
  font-size:0.78125rem;
  color:var(--stamp-blue);
  letter-spacing:0.02em;
  margin:0.25rem 0 0.75rem 0;
}
.entry-desc{
  color:var(--ink-soft);
  max-width:40rem;
  margin:0 0 0.875rem 0;
  font-size:0.9375rem;
}
.entry-stack{
  display:flex;
  flex-wrap:wrap;
  gap:0.5rem;
}
.entry-stack span{
  font-family:'IBM Plex Mono', monospace;
  font-size:0.6875rem;
  color:var(--ink-soft);
  border:1px solid var(--line);
  padding:0.25rem 0.5rem;
  border-radius:var(--radius);
}

.status{
  font-family:'IBM Plex Mono', monospace;
  font-size:0.6875rem;
  letter-spacing:0.08em;
  display:inline-flex;
  align-items:center;
  gap:0.375rem;
  padding:0.25rem 0.5625rem;
  border-radius:0.75rem;
  white-space:nowrap;
}
.status-active{ color:var(--approved); background:rgba(var(--approved-rgb),0.09); }
.status-settled{
  color:var(--ink-faint);
  background:rgba(var(--ink-faint-rgb),0.16);
  border:1px solid rgba(var(--ink-faint-rgb),0.4);
  font-weight:600;
}

.dot{
  width:7px; height:7px;
  border-radius:50%;
  background:var(--approved);
  display:inline-block;
}
.status-active .dot{ animation:pulse 1.8s ease-in-out infinite; }
@media (prefers-reduced-motion:reduce){ .status-active .dot{ animation:none; } }
@keyframes pulse{
  0%,100%{ box-shadow:0 0 0 0 rgba(var(--approved-rgb),0.45); }
  50%{ box-shadow:0 0 0 5px rgba(var(--approved-rgb),0); }
}

.entry-more{
  margin-top:0.75rem;
}
.entry-more summary{
  cursor:pointer;
  list-style:none;
  font-family:'IBM Plex Mono', monospace;
  font-size:0.75rem;
  color:var(--stamp-blue);
  display:inline-flex;
  align-items:center;
  gap:0.375rem;
  user-select:none;
}
.entry-more summary::-webkit-details-marker{ display:none; }
.entry-more summary::marker{ content:""; }
.entry-more summary .arrow{
  display:inline-block;
  transition:transform .2s ease;
  font-size:0.625rem;
}
.entry-more[open] summary .arrow{ transform:rotate(180deg); }
.entry-more-body{
  margin-top:0.75rem;
  padding-top:0.75rem;
  border-top:1px dotted var(--line);
  color:var(--ink-soft);
  font-size:0.90625rem;
  max-width:40rem;
}
.entry-more-body p{ margin:0 0 0.625rem 0; }
.entry-more-body p:last-child{ margin-bottom:0; }

@media (max-width:40em){
  .entry{ grid-template-columns:1fr; gap:0.5rem; }
  .entry-when{ padding-top:0; }
}

/* ---------- industries ---------- */
.industries-section{ background:var(--paper-alt); }
.industry-grid{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:1rem;
}
.industry-card{
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:1.375rem 1.125rem;
  transition:border-color .15s ease, transform .15s ease;
}
.industry-card:hover{ border-color:var(--stamp-blue); transform:translateY(-2px); }
.industry-top{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:0.5rem;
  margin:0 0 0.625rem 0;
}
.industry-tag{
  font-family:'IBM Plex Mono', monospace;
  font-size:0.6875rem;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:var(--stamp-blue);
  margin:0;
}
.industry-year{
  font-family:'IBM Plex Mono', monospace;
  font-size:0.6875rem;
  color:var(--ink-soft);
  white-space:nowrap;
}
.industry-company{
  font-size:1.03125rem;
  font-weight:600;
  margin:0 0 0.375rem 0;
  font-family:'Roboto Slab', serif;
}
.industry-note{
  font-size:0.84375rem;
  color:var(--ink-soft);
  margin:0;
}
@media (max-width:47.5em){
  .industry-grid{ grid-template-columns:repeat(2, 1fr); }
}
@media (max-width:30em){
  .industry-grid{ grid-template-columns:1fr; }
}

/* ---------- stack columns ---------- */
.ledger-columns{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:2rem;
  border-top:1px solid var(--line);
  padding-top:1.75rem;
}
.ledger-col h3{
  font-family:'IBM Plex Mono', monospace;
  font-size:0.75rem;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:var(--stamp-blue);
  margin-bottom:0.875rem;
}
.ledger-col ul{
  list-style:none;
  margin:0; padding:0;
}
.ledger-col li{
  font-size:0.90625rem;
  color:var(--ink-soft);
  padding:0.4375rem 0;
  border-bottom:1px dotted var(--line);
}
.ledger-col li:last-child{ border-bottom:none; }

.languages{
  margin-top:1.875rem;
  font-family:'IBM Plex Mono', monospace;
  font-size:0.78125rem;
  color:var(--ink-faint);
  border-top:1px solid var(--line);
  padding-top:1.125rem;
}

@media (max-width:47.5em){
  .ledger-columns{ grid-template-columns:repeat(2, 1fr); }
}
@media (max-width:30em){
  .ledger-columns{ grid-template-columns:1fr; }
}

/* ---------- contact / footer ---------- */
.contact-section{
  text-align:center;
  border-top:1px solid var(--line);
  padding-bottom:3.5rem;
}
.tear{
  display:flex;
  align-items:center;
  gap:0.625rem;
  color:var(--ink-faint);
  font-size:0.8125rem;
  margin-bottom:3.125rem;
}
.tear::before, .tear::after{
  content:"";
  flex:1;
  height:0;
  border-top:1px dashed var(--line);
}
.contact-section h2{ font-size:clamp(1.5rem, 3.6vw, 2.125rem); margin-bottom:0.75rem; }
.contact-lede{
  color:var(--ink-soft);
  max-width:30rem;
  margin:0 auto 2.125rem auto;
}
.barcode{
  height:46px;
  margin:2.75rem auto 0.875rem auto;
  max-width:16.25rem;
  background:repeating-linear-gradient(
    to right,
    var(--ink) 0px, var(--ink) 2px,
    transparent 2px, transparent 4px,
    var(--ink) 4px, var(--ink) 5px,
    transparent 5px, transparent 9px,
    var(--ink) 9px, var(--ink) 12px,
    transparent 12px, transparent 14px
  );
  opacity:0.85;
}
.foot-note{
  font-family:'IBM Plex Mono', monospace;
  font-size:0.6875rem;
  letter-spacing:0.08em;
  color:var(--ink-faint);
  text-transform:uppercase;
}
