/* ============================================================================
   Augurea · archivo.css — Archivo Vivo (the cabinet, oficios, doors).
   Engraved-paper idiom, collector-album register: philatelic hairline frames
   (the acta's own double-bezel matting, borrowed not duplicated — see
   intaglio.css .acta/.acta-plate), mono furniture, duotone discipline at card
   scale. No new hex: every color here resolves through tokens.css. Frame ink
   per Oficio varies across the FOUR ALREADY-SANCTIONED tokens below (burgundy /
   burgundy-deep / ink / warm-grey) rather than inventing new palette entries —
   tokens.css is a closed palette this wave doesn't touch (archivo-vivo-
   adjudication-v1 §4 "Frame ink convention" asked for 4 new custom properties;
   this reuses 4 existing ones instead — see the mission return for the note).
   ============================================================================ */

.archivo{ --archivo-ink: var(--burgundy); }
/* Per-Oficio frame ink — scoped to each plate (a single oficios.html page
   lists all four), not the page wrapper. */
.oficio-plate[data-oficio="cartografo"]{ --archivo-ink: var(--burgundy); }
.oficio-plate[data-oficio="cronista"]{ --archivo-ink: var(--burgundy-deep); }
.oficio-plate[data-oficio="curador"]{ --archivo-ink: var(--ink); }
.oficio-plate[data-oficio="guia"]{ --archivo-ink: var(--warm-grey); }

/* ---- Page shell ------------------------------------------------------------ */
.archivo-page{padding-top:26px;padding-bottom:72px}
.archivo-head{max-width:62ch;margin-bottom:30px}
.archivo-crumb{margin-bottom:14px}
.archivo-crumb a{color:var(--warm-grey)}
.archivo-head h1{margin-top:8px}
.archivo-lead{margin-top:12px;max-width:56ch;line-height:1.55;color:var(--muted)}

/* Section jump-nav — real in-page anchors (not JS tab-panels), so every
   section is always present in the DOM: no-JS and AT users get the same
   content as a mouse user, just without the smooth scroll. */
.archivo-nav{display:flex;flex-wrap:wrap;gap:8px;margin:22px 0 34px;border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);padding:14px 0}
.archivo-nav a{font-family:var(--mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;
  color:var(--muted);padding:8px 14px;border:1px solid var(--line-2);border-radius:999px}
.archivo-nav a:hover,.archivo-nav a:focus-visible{color:var(--ink);border-color:var(--line-ui)}

.archivo-section{margin-top:48px;scroll-margin-top:24px}
.archivo-section-h{display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  border-bottom:1px solid var(--line-2);padding-bottom:10px;margin-bottom:20px}
.archivo-section-h h2{font-size:20px}
.archivo-section-count{font-family:var(--mono);font-size:12px;color:var(--warm-grey)}

/* ---- Empty states ----------------------------------------------------------
   Dignified, never a call to spend/urgency — matches base.css .state but
   scoped smaller so three of these can sit inside one page without the
   full-bleed 80px rhythm meant for whole-page empties. */
.archivo-empty{padding:34px 18px;text-align:center;color:var(--muted);border:1px dashed var(--line-2);
  border-radius:6px}
.archivo-empty p{max-width:44ch;margin:0 auto}
.archivo-empty-mark{display:block;font-size:20px;color:var(--line-ui);margin-bottom:8px}

/* ---- Folio grid (the collector album) --------------------------------------
   Double-bezel matting exactly like .acta/.acta-plate: outer mat (6px radius)
   + inner paper plate (3px radius, concentric). Card scale only — no wax, no
   guilloché strip (those stay Acta-exclusive per house discipline). */
.folio-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}
.folio-card{position:relative;background:var(--brand-mat);border:1px solid var(--line-2);
  border-radius:6px;padding:6px;transition:box-shadow var(--dur-mid,.4s) var(--ease-out,ease),
  transform var(--dur-mid,.4s) var(--ease-out,ease)}
.folio-card:hover{box-shadow:var(--lift);transform:translateY(-2px)}
.folio-card-plate{background:var(--surface);border:1px solid var(--line);border-radius:3px;
  padding:12px 14px 14px;height:100%;display:flex;flex-direction:column;gap:8px}
.folio-card-top{display:flex;justify-content:space-between;align-items:baseline;gap:8px;
  font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--warm-grey)}
.folio-card-house{font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;
  color:var(--warm-grey)}
.folio-card-name{font-family:var(--serif);font-size:19px;line-height:1.2;color:var(--ink)}
.folio-card-status{margin-top:auto;padding-top:10px;border-top:1px solid var(--line);
  font-family:var(--mono);font-size:11px;letter-spacing:.05em;color:var(--ink);
  display:flex;flex-wrap:wrap;gap:6px 10px}
.folio-card-status span{white-space:nowrap}
/* Provenance shown FACTUALLY — same weight as any other trace, never a badge
   implying elevated status (house law: never a status difference). */
.folio-card-prov{color:var(--brand-folio)}

.folio-note{margin-top:2px;font-size:13px;line-height:1.5;color:var(--muted);font-style:italic}
.folio-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px}

/* ---- Simple list rows (bitácora, withdrawn vitrina) ------------------------- */
.archivo-log{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.archivo-log-item{display:flex;flex-direction:column;gap:4px;padding:14px 0;border-bottom:1px solid var(--line)}
.archivo-log-head{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
.archivo-log-title{font-family:var(--serif);font-size:16px}
.archivo-log-meta{font-family:var(--mono);font-size:11px;color:var(--warm-grey);white-space:nowrap}
.archivo-log-body{font-size:14px;line-height:1.55;color:var(--muted)}
.archivo-log-context{font-family:var(--mono);font-size:11px;color:var(--warm-grey)}

/* ---- Inline "new entry" panels (progressive disclosure via Alpine) ---------- */
.archivo-panel{margin-top:18px}
.archivo-panel-toggle{background:none;border:1px solid var(--line-2);border-radius:4px;
  padding:10px 16px;font-family:var(--mono);font-size:12px;letter-spacing:.04em;
  text-transform:uppercase;color:var(--ink);cursor:pointer}
.archivo-panel-toggle:hover{border-color:var(--line-ui)}
.archivo-panel-body{margin-top:14px;padding:18px;background:var(--cream);border-radius:4px;
  display:grid;gap:12px;max-width:52ch}
.archivo-panel-body label{display:block;font-family:var(--mono);font-size:11px;
  letter-spacing:.06em;text-transform:uppercase;color:var(--warm-grey);margin-bottom:5px}
.archivo-panel-body input[type="text"],.archivo-panel-body textarea,.archivo-panel-body select{
  width:100%;padding:10px 12px;border:1px solid var(--line-ui);border-radius:3px;
  font-family:var(--sans);font-size:14px;background:var(--surface);color:var(--ink)}
.archivo-panel-row{display:flex;gap:12px;flex-wrap:wrap}
.archivo-panel-row > div{flex:1 1 160px}
.archivo-field-error{color:var(--burgundy);font-size:12px;margin-top:4px}

/* ---- OFICIOS — the four private plates -------------------------------------- */
.oficio-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px}
.oficio-plate{background:var(--brand-mat);border:1px solid var(--line-2);border-radius:6px;padding:6px}
.oficio-plate-inner{background:var(--surface);border:1px solid var(--line);border-radius:3px;
  padding:20px 18px;color:var(--archivo-ink)}
.oficio-plate-head{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.oficio-plate-name{font-family:var(--serif);font-size:20px;color:var(--ink)}
.oficio-plate-chapter{font-family:var(--mono);font-size:11px;letter-spacing:.06em;
  text-transform:uppercase;color:currentColor}
.oficio-plate-glyph{color:currentColor;line-height:0;flex:none}
.oficio-plate-glyph svg{display:block;width:38px;height:38px}

.oficio-stamps{list-style:none;margin:16px 0;padding:12px 0 0;border-top:1px solid var(--line);
  display:flex;flex-wrap:wrap;gap:8px}
.oficio-stamp{font-family:var(--mono);font-size:10.5px;letter-spacing:.05em;text-transform:uppercase;
  border:1px solid var(--line-2);border-radius:999px;padding:5px 10px;color:var(--ink)}
.oficio-empty-note{font-size:13px;color:var(--muted);margin:14px 0}

.oficio-expr{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}
.oficio-expr-opt{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);
  font-size:11px;text-transform:uppercase;letter-spacing:.04em;border:1px solid var(--line-2);
  border-radius:4px;padding:6px 10px;cursor:pointer}
.oficio-expr-opt input{margin:0}
.oficio-expr-opt.is-selected{border-color:var(--archivo-ink);color:var(--archivo-ink)}

.oficio-publish-row{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:16px;
  padding-top:14px;border-top:1px solid var(--line)}
.oficio-published-badge{font-family:var(--mono);font-size:10px;letter-spacing:.1em;
  text-transform:uppercase;border:1px solid var(--brand-folio);color:var(--brand-folio);
  border-radius:999px;padding:5px 10px}

.archivo-consent{background:var(--cream);border-radius:4px;padding:14px 16px;margin-top:12px;
  font-size:13px;line-height:1.55;color:var(--muted)}
.archivo-consent input[type="text"]{margin-top:8px;width:100%;max-width:32ch;padding:9px 11px;
  border:1px solid var(--line-ui);border-radius:3px;font-family:var(--sans);font-size:14px}

/* ---- Doors — discrete text-link pairs (PDP + delivered-order surface) ------
   Secondary-utility weight, never a hero CTA (§4 "PDP/order door placement").
   Deliberately reuses .mono + hairline rules already established by the acta,
   never a new button style. */
.archivo-door{margin-top:18px;padding-top:14px;border-top:1px dashed var(--line-2);
  display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.archivo-door-link{font-family:var(--mono);font-size:12px;letter-spacing:.03em;color:var(--ink);
  background:none;border:0;padding:0;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.archivo-door-link:hover,.archivo-door-link:focus-visible{color:var(--burgundy)}
.archivo-door-sep{color:var(--line-ui)}
.archivo-door-note{font-size:12px;color:var(--warm-grey)}

/* ---- Gift-path stub ("próximamente") ----------------------------------------*/
.archivo-soon{padding:80px 0;text-align:center;color:var(--muted)}
.archivo-soon h1{font-size:26px;color:var(--ink);margin-bottom:10px}
.archivo-soon p{max-width:44ch;margin:0 auto}

/* ---- Focus / a11y ------------------------------------------------------------ */
.archivo a:focus-visible,.archivo button:focus-visible,.archivo input:focus-visible,
.archivo textarea:focus-visible,.archivo select:focus-visible,
.archivo-door-link:focus-visible{outline:2px solid var(--burgundy);outline-offset:2px}

@media(max-width:640px){
  .folio-grid,.oficio-grid{grid-template-columns:1fr}
  .archivo-nav{gap:6px}
  .archivo-door{flex-direction:column;align-items:flex-start;gap:8px}
}

@media(prefers-reduced-motion:reduce){
  .folio-card{transition:none}
  .folio-card:hover{box-shadow:none;transform:none}
}