/* Excelpedia certificate, A4 landscape. Used for the preview and for "Save as PDF". */
@font-face{font-family:"Vazirmatn";src:url("fonts/Vazirmatn-VF.woff2") format("woff2");font-weight:100 900;font-display:swap}

:root{--green:#1f7a4d;--green-d:#14573a;--green-s:#eaf5ee;--ink:#14231b;--muted:#5d6d64;--line:#cfe0d5;--hdr:#eef5f0;
  --col:36.125mm;--row:9mm;--rh:8mm;--ch:6mm}
*{box-sizing:border-box}
@page{size:297mm 210mm;margin:0}
html,body{margin:0;padding:0}
body{font-family:"Vazirmatn",Tahoma,sans-serif;color:var(--ink);background:#e7ece9;-webkit-print-color-adjust:exact;print-color-adjust:exact}
.is-page{padding:12px}
.is-embed{background:transparent}

/* Screen toolbar */
.toolbar{max-width:1100px;margin:0 auto 12px;display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;font-size:14px}
.toolbar__btn{font:inherit;font-weight:700;background:var(--green);color:#fff;border:0;border-radius:10px;padding:9px 18px;cursor:pointer}
.toolbar__btn:hover{background:var(--green-d)}
.toolbar__link{color:var(--green-d);text-decoration:none;font-weight:600}
.toolbar__link:hover{text-decoration:underline}
.toolbar__hint{color:var(--muted);font-size:13px}

/* Stage keeps the scaled sheet centred; the sheet is always laid out at real A4 size */
.stage{direction:ltr;margin:0 auto;position:relative}
.sheet{position:relative;width:297mm;height:209.6mm;overflow:hidden;background:#fff;transform-origin:0 0;box-shadow:0 10px 34px rgba(0,0,0,.16)}
html[dir=rtl] .sheet{direction:rtl}
html[dir=ltr] .sheet{direction:ltr}
.is-embed .sheet{box-shadow:none}

/* Spreadsheet frame: column letters, row numbers, faint grid */
.colhdr{position:absolute;top:0;height:var(--ch);display:flex;background:var(--hdr);border-bottom:.2mm solid var(--line);font-size:6.5pt;color:var(--muted)}
html[dir=rtl] .colhdr{right:var(--rh);left:0}
html[dir=ltr] .colhdr{left:var(--rh);right:0}
.colhdr span{flex:1;display:flex;align-items:center;justify-content:center;border-left:.2mm solid var(--line)}
.rowhdr{position:absolute;top:var(--ch);bottom:0;width:var(--rh);display:flex;flex-direction:column;background:var(--hdr);font-size:6pt;color:var(--muted)}
html[dir=rtl] .rowhdr{right:0;border-left:.2mm solid var(--line)}
html[dir=ltr] .rowhdr{left:0;border-right:.2mm solid var(--line)}
.rowhdr span{height:var(--row);flex:none;display:flex;align-items:center;justify-content:center;border-bottom:.2mm solid var(--line)}
.corner{position:absolute;top:0;width:var(--rh);height:var(--ch);background:#e1ede5}
html[dir=rtl] .corner{right:0}
html[dir=ltr] .corner{left:0}
.grid{position:absolute;top:var(--ch);bottom:0;
  background-image:linear-gradient(to right,rgba(31,122,77,.11) .2mm,transparent .2mm),linear-gradient(to bottom,rgba(31,122,77,.11) .2mm,transparent .2mm);
  background-size:var(--col) 100%,100% var(--row)}
html[dir=rtl] .grid{right:var(--rh);left:0}
html[dir=ltr] .grid{left:var(--rh);right:0}

/* Main selection frame */
.frame{position:absolute;top:calc(var(--ch) + 8mm);bottom:8mm;display:flex;flex-direction:column;padding:8.6mm 14mm 6.4mm;
  background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(243,249,245,.95));border:.7mm solid var(--green);border-radius:1.2mm;
  box-shadow:inset 0 0 0 1.3mm #fff,inset 0 0 0 1.6mm rgba(31,122,77,.35)}
html[dir=rtl] .frame{right:calc(var(--rh) + 8mm);left:8mm}
html[dir=ltr] .frame{left:calc(var(--rh) + 8mm);right:8mm}
.handle{position:absolute;width:2.6mm;height:2.6mm;background:#fff;border:.45mm solid var(--green)}
.handle--tl{top:-1.7mm;left:-1.7mm}.handle--tr{top:-1.7mm;right:-1.7mm}
.handle--bl{bottom:-1.7mm;left:-1.7mm}.handle--br{bottom:-1.7mm;right:-1.7mm}
.vcode{position:absolute;top:50%;transform:translateY(-50%);writing-mode:vertical-rl;font:600 7pt/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.35em;color:var(--muted)}
html[dir=rtl] .vcode{left:5mm}
html[dir=ltr] .vcode{right:5mm}

/* Fine print: corner brackets, guilloche ribbons, faint logo in the middle */
.orn{position:absolute;width:9.5mm;height:9.5mm;color:var(--green);opacity:.75;pointer-events:none}
.orn--tl{top:2.6mm;left:2.6mm}
.orn--tr{top:2.6mm;right:2.6mm;transform:scaleX(-1)}
.orn--bl{bottom:2.6mm;left:2.6mm;transform:scaleY(-1)}
.orn--br{bottom:2.6mm;right:2.6mm;transform:scale(-1,-1)}
.ribbon{position:absolute;left:15mm;right:15mm;height:3.2mm;color:var(--green);pointer-events:none}
.ribbon--top{top:3.1mm}.ribbon--bottom{bottom:3.1mm}
.guil{display:block;width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:.42px;opacity:.45}
.guil path{vector-effect:non-scaling-stroke}
.wm{position:absolute;top:50%;left:50%;width:88mm;transform:translate(-50%,-50%);opacity:.1;color:var(--green);pointer-events:none}
.wm img,.wm svg{display:block;width:100%;height:auto}

/* Header: brand, client, QR */
.head{display:flex;align-items:center;gap:7mm;min-height:22.5mm}
.brand{display:flex;align-items:center;gap:3mm;color:var(--green)}
.brand__mark{width:15mm;height:15mm;flex:none}
.brand__logo{display:block;height:18mm;width:auto;max-width:48mm;object-fit:contain}
.brand__text strong{display:block;font-size:16pt;font-weight:800;line-height:1.25;color:var(--ink)}
.brand__text small{display:block;font-size:8pt;color:var(--muted)}
.client{display:flex;align-items:center;align-self:stretch;padding-inline-start:7mm;border-inline-start:.3mm solid var(--line)}
.client__logo{display:block;width:auto;height:auto;max-width:56mm;max-height:18mm;object-fit:contain}
.formula{flex:1;min-width:52mm;max-width:100mm;margin-inline:auto;height:8mm;display:flex;border:.3mm solid var(--line);border-radius:1.6mm;overflow:hidden;background:#fff}
.formula__fx{width:9.5mm;display:flex;align-items:center;justify-content:center;background:var(--hdr);color:var(--green);font:italic 700 9pt Georgia,serif;border-right:.3mm solid var(--line)}
.formula__expr{padding:0 3.5mm;display:flex;align-items:center;white-space:nowrap;overflow:hidden;font:500 8pt ui-monospace,Menlo,Consolas,monospace;color:var(--green-d)}
.qr{display:flex;flex-direction:column;align-items:center;gap:1mm}
.qr__box{width:20.5mm;height:20.5mm;padding:1.6mm;background:#fff;border:.3mm solid var(--line);border-radius:1.6mm}
.qr__box svg{display:block;width:100%;height:100%;shape-rendering:crispEdges}
.qr__box svg path{fill:#111}
.qr__hint{font-size:6pt;color:var(--muted)}

/* Body: three groups spread evenly between header and footer */
.body{flex:1;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:space-evenly;text-align:center;padding:0 10mm}
.grp{display:flex;flex-direction:column;align-items:center}
.title{margin:0;font-size:30pt;font-weight:800;line-height:1.25;color:var(--green-d)}
html[lang=en] .title{font-size:28pt;letter-spacing:.01em}
.divider{display:block;width:44mm;height:3mm;margin-top:1.6mm;color:var(--green)}
.lead{margin:0 0 2mm;font-size:12pt;color:var(--muted)}
.namecell{position:relative;display:inline-block;max-width:225mm;padding:2.2mm 13mm 2.6mm;border:.6mm solid var(--green);background:rgba(234,245,238,.6);box-shadow:0 .8mm 0 rgba(31,122,77,.1)}
.namecell__text{font-size:28pt;font-weight:800;line-height:1.35;color:var(--ink)}
.namecell.is-long .namecell__text{font-size:23pt}
.namecell.is-xlong .namecell__text{font-size:18pt}
.namecell__fill{position:absolute;bottom:-1.7mm;width:2.8mm;height:2.8mm;background:var(--green);border:.5mm solid #fff}
html[dir=rtl] .namecell__fill{left:-1.7mm}
html[dir=ltr] .namecell__fill{right:-1.7mm}
.namealt{margin:1.6mm 0 0;font-size:13pt;color:var(--muted);letter-spacing:.02em}
.statement{margin:0;font-size:12pt;color:var(--muted)}
.course{max-width:215mm;margin:1.6mm 0;padding:2.4mm 11mm 2.6mm;background:var(--green-s);border:.3mm solid #bfdccb;border-radius:1.8mm;font-size:16.5pt;font-weight:700;line-height:1.5;color:var(--ink)}
.course.is-long{font-size:13.5pt}

/* Details: one quiet line, small diamonds between the items */
.facts{display:flex;flex-wrap:wrap;justify-content:center;align-items:baseline;gap:1.2mm 5mm;margin:0;max-width:240mm;font-size:11pt;color:var(--ink)}
.facts__i{display:inline-flex;align-items:baseline;gap:2mm}
.facts__i small{font-size:9pt;color:var(--muted)}
.facts__i strong{font-weight:700}
.facts__i+.facts__i::before{content:"";align-self:center;width:1.7mm;height:1.7mm;margin-inline-end:5mm;background:var(--green);transform:rotate(45deg);opacity:.75}

/* Footer: signature, seal, issue date */
.foot{display:grid;grid-template-columns:1fr auto 1fr;align-items:end;padding:0 4mm;margin-top:0}
.sign,.issued{display:flex;flex-direction:column;align-items:center;width:64mm;text-align:center}
.sign{position:relative;justify-self:start}
.issued{justify-self:end;padding-top:11mm}
.sign__space{height:11mm}
.sign__art{position:relative;z-index:2;width:100%;height:17mm;margin-bottom:-6mm;display:flex;align-items:flex-end;justify-content:center}
.sign__img{display:block;max-height:17mm;max-width:54mm;width:auto;height:auto;object-fit:contain;mix-blend-mode:multiply;filter:brightness(.72) contrast(1.6)}
.sign__line{position:relative;z-index:1;display:block;width:100%;height:.3mm;background:var(--ink);opacity:.55}
.sign__name{position:relative;z-index:1;margin-top:1.4mm;font-size:11pt;font-weight:700}
.sign__title{position:relative;z-index:1;font-size:8.5pt;color:var(--muted)}
.sign__micro{opacity:.27}
.sign__guard{position:absolute;left:-3mm;top:-1mm;width:calc(100% + 6mm);height:calc(100% + 2mm);z-index:3;color:var(--green-d);mix-blend-mode:multiply;pointer-events:none}
.issued small{width:100%;padding-top:1.4mm;border-top:.3mm solid rgba(20,35,27,.55);font-size:8pt;color:var(--muted)}
.issued strong{margin-top:.6mm;font-size:12.5pt}
.seal{width:24mm;height:24mm;margin-bottom:-1mm;color:var(--green)}
.seal__svg{display:block;width:100%;height:100%}

/* The address to type if the QR cannot be scanned */
.verify{margin:1.6mm 0 0;text-align:center;font:500 7pt ui-monospace,Menlo,Consolas,monospace;letter-spacing:.02em;color:var(--muted)}

@media print{
  html,body{height:209.6mm;overflow:hidden;background:#fff}
  .is-page,.is-embed{padding:0}
  .toolbar{display:none}
  .stage{width:auto!important;height:auto!important;margin:0!important}
  .sheet{transform:none!important;box-shadow:none}
}