/* ============================================================================
   Augurea · intaglio.css — the certificate furniture (security-printing motifs).
   Loaded globally from base.html (after trust.css). Per BRAND_BRIEF: what carries
   over from Intaglio is the FURNITURE, not new colors — seal, acta, guilloché,
   microprint, wax, all on the existing tokens. Light-only site; tokens only; AA
   holds. Gold is decorative line-work ONLY (guilloché ~0.5px at ~55% on paper) —
   never small text. Burgundy stays the scarce signature (seal, folio, wax).
   ============================================================================ */

/* ---- Wordmark lockup: seal (vector, currentColor) + live Bodoni caps --------
   currentColor makes the seal ink in the header and cream on the burgundy footer;
   the site is light-only so no prefers-color-scheme is involved. The logotype is
   live <b> text so it renders in real self-hosted Bodoni (SVG can't see @font-face). */
.brand{align-items:center;gap:9px;color:var(--ink)}
.brand b,.brand .brand-word{color:currentColor}
.brand-seal{display:inline-flex;flex:none;line-height:0}
.brand-seal svg{display:block}
.ftr .brand,.ftr .brand .brand-word,.ftr .brand span{color:var(--cream)}

/* ---- Seal-lituus mark on the originality trust block ------------------------
   The seal doubles as the verification stamp; beside the trust head it reads in
   burgundy — the one signature color the brief reserves for seal/CTA/folio. */
.trust{position:relative}
.trust-head{padding-right:42px}
.trust-seal{position:absolute;top:11px;right:12px;color:var(--brand-seal);opacity:.9;line-height:0}
.trust-seal svg{display:block}

/* ---- Acta de Verificación — the certificate ---------------------------------
   Double-bezel matting: an outer mat frame + hairline + inner paper plate, so it
   reads like a framed certificate rather than a flat card on the page. */
.acta{position:relative;margin:0 0 6px;background:var(--brand-mat);
  border:1px solid var(--line-2);border-radius:6px;padding:6px;   /* outer mat radius per BRAND_BRIEF (6px/3px concentric) */
  transition:box-shadow var(--dur-mid,.4s) var(--ease-out,ease),transform var(--dur-mid,.4s) var(--ease-out,ease)}
.acta:hover{box-shadow:var(--lift);transform:translateY(-3px)}   /* the framed certificate lifts on hover */
.acta-plate{position:relative;overflow:hidden;background:var(--surface);
  border:1px solid var(--line);border-radius:3px;padding:15px 18px 0}   /* inner plate radius (concentric with the 6px mat) */

.acta-head{display:flex;align-items:center;gap:10px;padding-bottom:12px;
  border-bottom:1px solid var(--line)}
.acta-seal{flex:none;color:var(--ink);line-height:0}
.acta-seal svg{display:block}
.acta-title{font-size:12px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink);white-space:nowrap}
.acta-guilloche{flex:1;min-width:20px;height:12px;overflow:hidden}
/* Guilloché hairline at ~0.6 stroke-opacity on white (BRAND_BRIEF); overrides the
   SVG's own opacity attr so the single value is authoritative. Draws in with the
   acta's scroll reveal — no separate stroke animation (faithful to the prospect). */
/* Oxblood engraving hairline (--brand-guillo -> --burgundy-deep). Kept a REDUCED-OPACITY
   HAIRLINE, never a solid mass: oxblood #4A1622 sits ~1.14:1 from signature burgundy, so
   weight+opacity (not hue) are what keep burgundy scarce. stroke set here so it resolves
   via CSS regardless of the SVG attribute. */
.acta-guilloche svg{display:block;width:100%;height:12px;opacity:.72;stroke:var(--brand-guillo)}

.acta-rows{margin:0;padding:11px 0 13px}
.acta-row{display:flex;justify-content:space-between;gap:16px;align-items:baseline;
  padding:5px 0;font-size:13px;line-height:1.4}
.acta-row + .acta-row{border-top:1px solid var(--line)}
.acta-row dt{margin:0;flex:none;color:var(--warm-grey);font-size:11px;
  letter-spacing:.08em;text-transform:uppercase}
.acta-row dd{margin:0;color:var(--ink);text-align:right;word-break:break-word}
/* folio = scarce burgundy; needs dd.acta-folio (0,2,1) to beat `.acta-row dd`
   (0,1,1), otherwise --ink wins and the folio loses its signature prominence. */
.acta-row dd.acta-folio{color:var(--brand-folio);font-weight:500;letter-spacing:.02em}
.acta-estado.is-verified{color:var(--brand-verified)}

/* microprint band — banknote microtext as a section rule (static; no motion). */
.acta-strip{margin:0 -18px;padding:6px 18px;border-top:1px solid var(--line);
  background:var(--cream);overflow:hidden;white-space:nowrap}
.acta-strip span{font-family:var(--mono);font-size:8.5px;letter-spacing:.34em;
  text-transform:uppercase;color:var(--warm-grey);opacity:.72}

/* the wax seal — the one theatrical object, pressed over the corner (opt-in). */
.acta-has-wax{margin-top:28px}
.acta-wax{position:absolute;top:-22px;right:-14px;transform:rotate(-8deg);line-height:0;
  filter:drop-shadow(0 3px 6px rgba(26,21,24,.22));pointer-events:none}
.acta-wax svg{display:block}
@media(max-width:520px){
  .acta-wax{top:-16px;right:-6px}
  .acta-wax svg{width:56px;height:56px}
}

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