/**
 * Certificate sheet — classic diploma on white.
 *
 * The page is a literal 297 x 210mm sheet of white paper, drawn entirely in
 * absolute millimetre positions so the same markup and the same geometry are
 * what Dompdf reproduces. Everything here avoids the CSS Dompdf is weakest at
 * (flexbox, grid, percentage radii, transforms); anything it cannot faithfully
 * restate is spelled out as a flat-print equivalent in certificate-pdf.css.
 *
 * Palette: white paper, deep-navy ink, antique gold accents. The logo and the
 * engraved artwork (guilloche, seal) are black ink, so they sit naturally on
 * the white ground like a printed diploma.
 */

.cert-sheet {
    position: relative;
    width: 297mm;
    height: 210mm;
    overflow: hidden;
    background: #ffffff;
    color: #16233f;
    font-family: 'Lato', 'DejaVu Sans', sans-serif;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
}

/* ---------------------------------------------------------------- frames -- */

.cert-frame { position: absolute; }

/* Fine ink rule near the page edge — the classic diploma border. */
.cert-frame-navy {
    top: 4mm; left: 4mm; width: 289mm; height: 202mm;
    border: 0.5mm solid #16233f;
    border-radius: 0.4mm;
}
/* Antique gold double rule. */
.cert-frame-gold {
    top: 8.6mm; left: 8.6mm; width: 279.8mm; height: 192.8mm;
    border: 0.55mm double #b08a35;
}
.cert-frame-hair {
    top: 10.6mm; left: 10.6mm; width: 275.8mm; height: 188.8mm;
    border: 0.18mm solid rgba(22, 35, 63, 0.22);
}

/* Serialised micro-band runs between the ink rule and the gold rule. */
.cert-micro {
    position: absolute;
    top: 5mm; left: 5.5mm;
    width: 286mm; height: 3.2mm;
    font-size: 2.05pt;
    line-height: 3.2mm;
    letter-spacing: 0.02em;
    color: rgba(176, 138, 53, 0.55);
    text-align: center;
    white-space: nowrap;
}

/* Corner ornaments sit on the gold rule. */
.cert-corner {
    position: absolute;
    width: 13mm; height: 13mm;
    border: 0.3mm solid rgba(176, 138, 53, 0.75);
}
.cert-corner.tl { top: 8.8mm;  left: 8.8mm;  border-right: 0; border-bottom: 0; }
.cert-corner.tr { top: 8.8mm;  right: 8.8mm; border-left: 0;  border-bottom: 0; }
.cert-corner.bl { bottom: 8.8mm; left: 8.8mm;  border-right: 0; border-top: 0; }
.cert-corner.br { bottom: 8.8mm; right: 8.8mm; border-left: 0;  border-top: 0; }

/* ------------------------------------------------------------ background -- */

/* Faint engraved guilloche behind the centre of the diploma. */
.cert-guilloche {
    position: absolute;
    top: 20mm; left: 65.5mm;
    width: 166mm; height: 166mm;
    opacity: 0.38;
}

/* ----------------------------------------------------------------- head -- */

.cert-brand {
    position: absolute;
    top: 12mm; left: 0; width: 297mm;
    text-align: center;
}
.cert-logo { width: 23mm; height: 23mm; }

.cert-org {
    position: absolute;
    top: 36mm; left: 0; width: 297mm;
    text-align: center;
    font-family: 'Playfair Display', 'DejaVu Serif', serif;
    font-weight: 700;
    letter-spacing: 0.11em;
    color: #16233f;
    text-transform: uppercase;
}
.cert-tagline {
    position: absolute;
    top: 42.2mm; left: 0; width: 297mm;
    text-align: center;
    letter-spacing: 0.26em;
    text-transform: uppercase;
    color: #5a6478;
}
.cert-hrule {
    position: absolute;
    top: 46.6mm; left: 118.5mm;
    width: 60mm; height: 0.5mm;
    background: linear-gradient(90deg, rgba(176,138,53,0) 0%, #d8b45f 24%, #b08a35 50%, #d8b45f 76%, rgba(176,138,53,0) 100%);
}

/* ---------------------------------------------------------------- title -- */

.cert-eyebrow {
    position: absolute;
    top: 49.5mm; left: 0; width: 297mm;
    text-align: center;
    font-size: 6.2pt;
    font-weight: 700;
    letter-spacing: 0.5em;
    text-transform: uppercase;
    color: #8f6d24;
}
.cert-title {
    position: absolute;
    top: 54mm; left: 0; width: 297mm;
    text-align: center;
    font-family: 'Playfair Display', 'DejaVu Serif', serif;
    font-size: 33pt;
    font-weight: 700;
    letter-spacing: 0.008em;
    line-height: 1.08;
    color: #16233f;
}
.cert-title-b {
    color: #b08a35;
    font-style: italic;
    font-weight: 700;
    letter-spacing: 0.002em;
}
.cert-ornament {
    position: absolute;
    top: 71mm; left: 0; width: 297mm;
    height: 2.4mm;
    text-align: center;
}
.cert-ornament span {
    display: inline-block;
    width: 26mm; height: 0.3mm;
    margin: 0 2.6mm;
    vertical-align: middle;
    background: linear-gradient(90deg, rgba(176,138,53,0) 0%, #b08a35 100%);
}
.cert-ornament span + i + span {
    background: linear-gradient(90deg, #b08a35 0%, rgba(176,138,53,0) 100%);
}
.cert-ornament i {
    display: inline-block;
    width: 2.1mm; height: 2.1mm;
    vertical-align: middle;
    background: #b08a35;
    transform: rotate(45deg);
}
.cert-subtitle {
    position: absolute;
    top: 75.5mm; left: 0; width: 297mm;
    text-align: center;
    font-size: 8.6pt;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: #3b455c;
}

/* -------------------------------------------------------------- student -- */

.cert-lead {
    position: absolute;
    top: 84.5mm; left: 0; width: 297mm;
    text-align: center;
    font-size: 9pt;
    font-style: italic;
    color: #4a5568;
}
.cert-name {
    position: absolute;
    top: 89mm; left: 0; width: 297mm;
    text-align: center;
    font-family: 'Playfair Display', 'DejaVu Serif', serif;
    font-weight: 700;
    line-height: 1.12;
    color: #0e1a35;
}
.cert-flourish {
    position: absolute;
    top: 105mm; left: 98.5mm;
    width: 100mm; height: 0.8mm;
    background: radial-gradient(ellipse at center, #b08a35 0%, rgba(216,180,95,0.4) 60%, rgba(216,180,95,0) 100%);
}
.cert-sentence {
    position: absolute;
    top: 109.5mm; left: 0; width: 297mm;
    text-align: center;
    font-size: 9.4pt;
    color: #333c4f;
}
.cert-course {
    position: absolute;
    top: 115mm; left: 0; width: 297mm;
    text-align: center;
    font-family: 'Playfair Display', 'DejaVu Serif', serif;
    font-weight: 700;
    font-style: italic;
    line-height: 1.16;
    color: #b08a35;
}
.cert-accreditation {
    position: absolute;
    top: 127mm; left: 0; width: 297mm;
    text-align: center;
    font-size: 6.6pt;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: #5a6478;
}

/* ---------------------------------------------------------------- facts -- */

.cert-facts {
    position: absolute;
    top: 129mm; left: 32.5mm;
    width: 232mm;
    border-collapse: collapse;
    table-layout: fixed;
}
.cert-facts td {
    width: 58mm;
    padding: 0 2mm;
    text-align: center;
    vertical-align: top;
    border-top: 0.22mm solid rgba(176,138,53,0.4);
    border-bottom: 0.22mm solid rgba(176,138,53,0.4);
}
.cert-fact-label {
    font-size: 5.8pt;
    font-weight: 700;
    letter-spacing: 0.20em;
    text-transform: uppercase;
    color: #8f6d24;
    padding-top: 1.6mm;
}
.cert-fact-value {
    font-size: 8.4pt;
    font-weight: 400;
    color: #16233f;
    padding-bottom: 1.6mm;
}
.cert-fact-id { letter-spacing: 0.04em; }

/* --------------------------------------------------------------- footer -- */

.cert-sign {
    position: absolute;
    top: 168mm; left: 26mm;
    width: 66mm;
    text-align: center;
}
.cert-sign-rule {
    width: 52mm; height: 0.25mm;
    margin: 0 auto 1.4mm auto;
    background: #16233f;
}
.cert-sign-script {
    font-family: 'Great Vibes', 'DejaVu Serif', cursive;
    font-size: 15pt;
    line-height: 1.1;
    color: #16233f;
}
.cert-sign-image { height: 11mm; }
.cert-sign-role {
    margin-top: 0.8mm;
    font-size: 7.2pt;
    font-weight: 700;
    letter-spacing: 0.10em;
    text-transform: uppercase;
    color: #16233f;
}
.cert-sign-org {
    font-size: 6.2pt;
    letter-spacing: 0.08em;
    color: #5a6478;
}

/* ----------------------------------------------------------------- seal -- */
/* A single gold-rimmed medallion carrying the CMTI mark, like the institute's
   seal affixed over the ribbon. */

.cert-seal {
    position: absolute;
    top: 141mm; left: 125.5mm;
    width: 46mm; height: 46mm;
}
.cert-seal-ring1 {
    position: absolute;
    top: 0; left: 0; width: 46mm; height: 46mm;
    border: 0.8mm solid #b08a35;
    border-radius: 23mm;
    background: #ffffff;
    box-shadow: 0 0 1.6mm rgba(176, 138, 53, 0.35);
}
.cert-seal-art {
    position: absolute;
    top: 8mm; left: 8mm;
    width: 30mm; height: 30mm;
}

/* ------------------------------------------------------------------ qr -- */

.cert-verify {
    position: absolute;
    top: 150mm; left: 212mm;
    width: 28mm;
    text-align: center;
}
.cert-qr { width: 25mm; height: 25mm; }
.cert-qr-fallback {
    width: 25mm; height: 25mm;
    border: 0.25mm solid rgba(22, 35, 63, 0.3);
    border-radius: 1mm;
    font-size: 11pt;
    font-weight: 700;
    letter-spacing: 0.10em;
    line-height: 25mm;
    color: #98a0b0;
}
.cert-verify-cap {
    margin-top: 1.1mm;
    font-size: 5.6pt;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #4a5568;
}

/* ----------------------------------------------------------------- base -- */

.cert-base {
    position: absolute;
    bottom: 0; left: 0; width: 297mm;
    height: 12mm;
    text-align: center;
}
.cert-base-rule {
    position: absolute;
    top: 3.6mm; left: 50%;
    width: 46mm; height: 0;
    margin-left: -23mm;
    border-top: 0.35mm solid #b08a35;
}
.cert-base-line {
    position: absolute;
    top: 6.2mm; left: 0; width: 297mm;
    font-size: 6pt;
    letter-spacing: 0.10em;
    text-transform: uppercase;
    color: #4a5568;
}
.cert-base-sep {
    display: inline-block;
    width: 0.35mm; height: 0.35mm;
    margin: 0 3mm;
    vertical-align: middle;
    border-radius: 50%;
    background: #b08a35;
}

/* ----------------------------------------------------------------- motto -- */

.cert-motto {
    position: absolute;
    top: 187.6mm; left: 18mm;
    width: 261mm; height: 9.4mm;
    text-align: center;
    background: radial-gradient(ellipse at center, rgba(216,180,95,0.10) 0%, rgba(216,180,95,0.04) 70%, rgba(216,180,95,0) 100%);
    border-top: 0.22mm solid rgba(176, 138, 53, 0.55);
    border-bottom: 0.22mm solid rgba(176, 138, 53, 0.55);
}
.cert-motto-label {
    padding-top: 1.3mm;
    font-size: 4.8pt;
    font-weight: 700;
    letter-spacing: 0.34em;
    text-transform: uppercase;
    color: #8f6d24;
}
.cert-motto-text {
    padding-top: 0.3mm;
    font-family: 'Playfair Display', 'DejaVu Serif', serif;
    font-style: italic;
    line-height: 1.2;
    color: #16233f;
}
.cert-motto-src {
    font-family: 'Lato', 'DejaVu Sans', sans-serif;
    font-style: normal;
    font-size: 6.2pt;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #5a6478;
    margin-left: 2.2mm;
}

/* -------------------------------------------------------------- revoked -- */

.cert-revoked {
    position: absolute;
    top: 0; left: 0;
    width: 297mm; height: 210mm;
    text-align: center;
}
.cert-revoked span {
    display: inline-block;
    margin-top: 92mm;
    padding: 3mm 12mm;
    border: 0.7mm solid rgba(158, 34, 34, 0.75);
    border-radius: 1.5mm;
    font-family: 'Playfair Display', 'DejaVu Serif', serif;
    font-size: 30pt;
    font-weight: 700;
    letter-spacing: 0.30em;
    text-transform: uppercase;
    color: rgba(158, 34, 34, 0.80);
    background: rgba(255, 255, 255, 0.65);
}
/* ---- CMTI FINAL DESIGN 2026-10-25: gold seal, crest watermark, signature ---- */
.cert-sign { top: 164mm; }
.cert-sign-image { height: 15mm; }
.cert-seal-ring1 { display: none; }
.cert-seal-art { top: 0; left: 0; width: 46mm; height: 46mm; }
.cert-watermark { position: absolute; top: 74mm; left: 50%; width: 64mm; margin-left: -32mm; z-index: 0; }