/* Elsa Fiott footer: "certificate details" panel that closes the verification report */
.ef-foot{
  --e-bg:#0a141f; --e-panel:#101f30; --e-screen:#06101a; --e-ink:#e7f0ee; --e-soft:#a8bcc0;
  --e-neon:#39ff8a; --e-dim:#1c8a55; --e-warn:#ff6b78; --e-line:rgba(57,255,138,.18);
  --ef-w:932px; /* = .wrap of the page (980px minus 2x24px padding) */
  --e-mono:'Space Mono','Courier New',monospace; --e-sans:'Inter',-apple-system,'Segoe UI',Helvetica,Arial,sans-serif;
  background:
    linear-gradient(rgba(57,255,138,.06) 1px, transparent 1px) 0 0/100% 42px,
    linear-gradient(90deg, rgba(57,255,138,.06) 1px, transparent 1px) 0 0/42px 100%,
    var(--e-bg);
  color:var(--e-soft); font-family:var(--e-sans); line-height:1.6; text-align:left; padding:56px 24px 72px; border-top:1px solid var(--e-line);
}
.ef-foot *{box-sizing:border-box;}
.ef-foot p{margin:0;}
.ef-foot a{color:var(--e-neon); text-decoration:underline; text-decoration-color:rgba(57,255,138,.4); text-underline-offset:.2em;}
.ef-foot a:hover{text-decoration-color:var(--e-neon);}
.ef-foot a:focus-visible,.ef-foot .kc-link:focus-visible{outline:2px solid var(--e-neon); outline-offset:3px;}
.ef-cert{max-width:var(--ef-w); margin:0 auto; background:var(--e-panel); border:1px solid var(--e-line); border-radius:12px; overflow:hidden; position:relative;}
/* perforated top edge, like the tear line of a printed report */
.ef-cert::before{content:""; position:absolute; top:0; left:0; right:0; height:4px;
  background:repeating-linear-gradient(90deg, var(--e-neon) 0 10px, transparent 10px 16px); opacity:.7;}
.ef-cert-head{display:flex; align-items:center; gap:16px; padding:24px 24px 20px; border-bottom:1px dashed var(--e-line); background:var(--e-screen);}
.ef-lock{display:grid; place-items:center; width:52px; height:52px; flex:0 0 auto; border-radius:50%;
  border:2px solid var(--e-neon); color:var(--e-neon); box-shadow:0 0 0 4px rgba(57,255,138,.08), 0 0 18px rgba(57,255,138,.25);}
.ef-cert-title{flex:1 1 auto; min-width:0;}
.ef-cert-k{font-family:var(--e-mono); font-size:.72rem; letter-spacing:2px; text-transform:uppercase; color:var(--e-neon);}
.ef-cert-t{font-family:var(--e-mono); font-size:1.25rem; font-weight:700; color:var(--e-ink); text-transform:uppercase; letter-spacing:.5px;}
.ef-eof{font-family:var(--e-mono); font-size:.72rem; letter-spacing:2px; color:#04150c; background:var(--e-neon); border-radius:4px; padding:4px 8px; flex:0 0 auto;}
.ef-fields{margin:0; padding:8px 24px;}
.ef-row{display:grid; grid-template-columns:200px 1fr; gap:6px 20px; padding:12px 0; border-bottom:1px dotted var(--e-line); align-items:baseline;}
.ef-row:last-child{border-bottom:0;}
.ef-row dt{font-family:var(--e-mono); font-size:.72rem; letter-spacing:1px; text-transform:uppercase; color:var(--e-soft);}
.ef-row dd{margin:0; color:var(--e-ink); font-size:.95rem; min-width:0; overflow-wrap:anywhere;}
.ef-row dd a{display:inline-flex; align-items:center; min-height:44px;}
.ef-ids{display:flex; flex-wrap:wrap; gap:0 18px;}
.ef-warn{display:flex; gap:12px; align-items:flex-start; margin:0 24px 20px !important; padding:14px 16px; border-radius:10px;
  background:rgba(255,71,87,.08); border:1px solid rgba(255,107,120,.45); color:#f3d6d9; font-size:.85rem;}
.ef-warn-k{flex:0 0 auto; font-family:var(--e-mono); font-weight:700; font-size:.72rem; color:var(--e-warn); border:1px solid var(--e-warn); border-radius:4px; padding:1px 6px; margin-top:2px;}
.ef-foot .kc-foot{max-width:calc(var(--ef-w) - 40px); margin:0 auto; padding:4px 20px; background:var(--e-screen); border:1px solid var(--e-line); border-top:0; border-radius:0 0 10px 10px; font-family:var(--e-mono); font-size:.76rem; color:var(--e-soft); text-align:center;}
.ef-foot .kc-link{color:var(--e-neon);}
@media (max-width:600px){
  .ef-row{grid-template-columns:1fr; gap:2px;}
  .ef-cert-head{padding:20px 16px 16px; gap:12px;}
  .ef-fields{padding:4px 16px;}
  .ef-warn{margin:0 16px 16px !important;}
  .ef-foot .kc-foot{margin:0 12px; padding:4px 12px;}
  .ef-cert-t{font-size:1.05rem;}
}
/* privacy page uses a narrower .wrap (720px): footer follows it */
body:has(> .wrap > .panel) .ef-foot{--ef-w:672px;}
/* 404 page centres its content in a flex row: stack the footer under it */
body:has(> footer.ef-foot):not(:has(main)){flex-direction:column; align-items:stretch;}
body:has(> footer.ef-foot):not(:has(main)) > .wrap{margin-left:auto; margin-right:auto;}
