/**
 * Certified Dhakkan — /certified/  ("Certificate of Dhakkan-hood").
 *
 * Faithful port of the standalone certificate-builder design. Every selector is
 * scoped under .dkc so the reference's generic class names (.cert, .panel, .btn,
 * .name…) and its CSS variables never leak into the rest of the site.
 */
.dkc{
  --page:#1a1611;--panel:#221d16;--bone:#EDE4D1;--ink:#15120E;
  --red:#C53D1E;--marigold:#E2A012;--muted:#b7ab93;
  width:100%;background:var(--page);color:var(--bone);
  font-family:'Oswald',sans-serif;-webkit-font-smoothing:antialiased;
  display:flex;flex-direction:column;align-items:center;padding:40px 16px 56px;
}
.dkc *{box-sizing:border-box;margin:0;padding:0}
.dk-certv2{background:#1a1611}

.dkc .wrap{width:100%;max-width:460px}
.dkc .top{text-align:center;margin-bottom:18px}
.dkc .top .kick{font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--red);font-weight:700}
.dkc .top h1{text-transform:uppercase;font-weight:700;font-size:clamp(28px,8vw,40px);line-height:.95;margin-top:8px}
.dkc .top p{font-family:'Special Elite',monospace;font-size:12px;color:var(--muted);margin-top:10px;line-height:1.5}

/* layout: stacked (form first) on mobile, side-by-side on desktop */
.dkc .layout{display:flex;flex-direction:column;gap:16px}
.dkc .col-form,.dkc .col-cert{width:100%;max-width:460px;margin:0 auto}

/* ---------- CERTIFICATE (white only) ---------- */
.dkc .cert{position:relative;overflow:hidden;display:flex;flex-direction:column;aspect-ratio:9/16;background:#EFE7D6 url(../img/cert-paper.jpg) center/cover no-repeat;color:#16120E;border:2px solid #16120E;padding:40px 34px 32px}
.dkc .cert::before{content:"";position:absolute;inset:21px;border:1px solid #16120E2e;pointer-events:none;z-index:1}
.dkc .frame{position:absolute;inset:0;z-index:1;pointer-events:none}
.dkc .fstrip{position:absolute;display:flex;align-items:center;justify-content:center;overflow:hidden;background:#15120E;color:#EDE4D1;font-family:'Oswald',sans-serif;font-weight:600;font-size:9px;letter-spacing:.22em}
.dkc .fstrip span{white-space:nowrap}
.dkc .ft{top:0;left:18px;right:18px;height:18px}
.dkc .fb{bottom:0;left:18px;right:18px;height:18px}
.dkc .fl{top:0;bottom:0;left:0;width:18px}
.dkc .fr{top:0;bottom:0;right:0;width:18px}
.dkc .fl .v,.dkc .fr .v{writing-mode:vertical-rl;text-orientation:mixed}
.dkc .cn{display:none}
.dkc .cn.tl{top:13px;left:13px;border-right:0;border-bottom:0}
.dkc .cn.tr{top:13px;right:13px;border-left:0;border-bottom:0}
.dkc .cn.bl{bottom:13px;left:13px;border-right:0;border-top:0}
.dkc .cn.br{bottom:13px;right:13px;border-left:0;border-top:0}
.dkc .crown{display:block;width:88px;height:auto;margin:0 auto 8px;position:relative;z-index:2}
.dkc .ch{text-align:center;position:relative;z-index:2}
.dkc .ch .kick{font-size:10px;letter-spacing:.32em;text-transform:uppercase;color:#A52616;font-weight:700}
.dkc .ch h2{font-family:'Cinzel',serif;text-transform:uppercase;font-weight:700;font-size:clamp(21px,5.8vw,30px);line-height:1.12;margin-top:8px;letter-spacing:.03em}
.dkc .crule{height:2px;background:#16120E;width:60px;margin:13px auto 18px}
.dkc .cb{text-align:center;position:relative;z-index:2}
.dkc .said{font-family:'Special Elite',monospace;font-size:12.5px;color:#5a5142;line-height:1.5}
.dkc .name{text-transform:uppercase;font-weight:700;font-size:clamp(24px,7.5vw,36px);line-height:1.04;margin:8px 0;word-break:break-word}
.dkc .cdeva{font-family:'Tiro Devanagari Hindi',serif;font-size:27px;color:#A52616;margin:4px 0 2px}
.dkc .desig{display:inline-block;border:2.5px double #A52616;color:#A52616;text-transform:uppercase;font-weight:700;letter-spacing:.06em;font-size:clamp(15px,4.6vw,21px);line-height:1;padding:11px 16px 9px;margin:16px 0 4px;transform:rotate(-2.5deg)}
.dkc .reason{margin:20px auto 0;max-width:330px}
.dkc .reason span{display:block;font-size:9px;letter-spacing:.26em;text-transform:uppercase;color:#8a7f6b;font-weight:700;margin-bottom:5px}
.dkc .reason em{font-family:'Special Elite',monospace;font-style:normal;font-size:14.5px;line-height:1.5}
.dkc .cdef{margin:16px auto 0;max-width:330px;text-align:center;position:relative;z-index:2}
.dkc .cdef-word{font-family:'Cinzel',serif;font-weight:700;font-size:18px;color:#16120E}
.dkc .cdef-deva{font-family:'Tiro Devanagari Hindi',serif;color:#A52616;font-size:17px;margin-left:5px}
.dkc .cdef-pron{font-family:'Special Elite',monospace;font-size:11px;color:#8a7f6b;letter-spacing:.02em;margin:3px 0 9px}
.dkc .cdef-pron em{font-style:italic;color:#5a5142}
.dkc .cdef-line{font-family:'Special Elite',monospace;font-size:11.5px;color:#5a5142;line-height:1.5;margin:3px 0;text-align:left}
.dkc .cdef-line b{color:#A52616;font-weight:400;margin-right:3px}
.dkc .cdef-line em{font-style:italic}
.dkc .csign{margin-top:auto;position:relative;z-index:3;max-width:58%}
.dkc .csign img{display:block;width:140px;max-width:100%;height:auto;margin-bottom:2px}
.dkc .csign .sigline{height:1px;background:#16120E;opacity:.55;width:150px;max-width:100%}
.dkc .csign .siglab{font-family:'Special Elite',monospace;font-size:9px;letter-spacing:.05em;text-transform:uppercase;color:#8a7f6b;margin-top:6px}
.dkc .stamp{position:absolute;right:30px;bottom:88px;width:132px;height:auto;transform:rotate(-9deg);z-index:2;pointer-events:none}
.dkc .cmeta{margin-top:20px;border-top:1px solid #16120E22;padding-top:11px;display:flex;justify-content:space-between;gap:10px;font-family:'Special Elite',monospace;font-size:10px;color:#8a7f6b;letter-spacing:.02em;position:relative;z-index:2}
.dkc .cmeta b{color:#16120E;font-weight:400}
.dkc .cfoot{text-align:center;font-family:'Special Elite',monospace;font-size:10px;color:#8a7f6b;margin-top:13px;letter-spacing:.04em;position:relative;z-index:2}

/* ---------- CONTROLS ---------- */
.dkc .panel{background:var(--panel);border:1.5px solid #000;padding:18px}
.dkc label.fl{display:block;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);font-weight:700;margin:14px 0 6px}
.dkc label.fl:first-child{margin-top:0}
.dkc input,.dkc select{width:100%;background:#15120E;border:1.5px solid #3a3225;color:var(--bone);font-family:'Oswald',sans-serif;font-size:16px;padding:11px 12px;outline:none}
.dkc input:focus,.dkc select:focus{outline:3px solid var(--marigold);outline-offset:1px;border-color:var(--marigold)}
.dkc select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23b7ab93' stroke-width='2' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:34px}
.dkc .cust{margin-top:7px;display:none}
.dkc .lnk{background:none;border:0;color:var(--marigold);font-family:'Special Elite',monospace;font-size:11px;text-decoration:underline;cursor:pointer;padding:4px 0;margin-top:4px}
.dkc .btns{display:flex;gap:9px;margin-top:18px;flex-wrap:wrap}
.dkc .btn{flex:1;min-width:120px;border:1.5px solid #000;font-family:'Oswald',sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.1em;font-size:13px;padding:13px 10px;cursor:pointer;transition:transform .08s}
.dkc .btn:hover{transform:translateY(-2px)}
.dkc .btn:active{transform:translateY(0)}
.dkc .btn.red{background:var(--red);color:var(--bone)}
.dkc .btn.mar{background:var(--marigold);color:var(--ink)}
.dkc .btn.gho{background:transparent;color:var(--bone)}
.dkc .sharehint{display:none;font-family:'Special Elite',monospace;font-size:11px;color:var(--marigold);margin-top:10px;line-height:1.5}
.dkc .capture{background:var(--bone);color:var(--ink);padding:18px;margin-top:14px;border:1.5px solid #000}
.dkc .capture h3{text-transform:uppercase;font-weight:700;font-size:18px;letter-spacing:.02em}
.dkc .capture p{font-family:'Special Elite',monospace;font-size:11.5px;color:#5a5142;margin-top:5px;line-height:1.5}
.dkc .capture .row{display:flex;gap:8px;margin-top:13px;flex-wrap:wrap}
.dkc .capture input{flex:1;min-width:160px;background:#fff;border:1.5px solid var(--ink);color:var(--ink)}
.dkc .capture input:focus{outline:3px solid var(--red);border-color:var(--red)}
.dkc .capture .btn{flex:0 0 auto;min-width:0;width:auto;padding:11px 16px}
.dkc .done{font-family:'Special Elite',monospace;font-size:12.5px;color:#9a3a16;margin-top:11px;display:none}

@media (min-width:820px){
  .dkc .wrap{max-width:980px}
  .dkc .layout{flex-direction:row;gap:28px;align-items:flex-start;justify-content:center}
  .dkc .col-form{flex:0 1 420px;max-width:420px;margin:0}
  .dkc .col-cert{flex:0 1 470px;max-width:470px;margin:0;position:sticky;top:20px}
}
@media (prefers-reduced-motion:reduce){.dkc *{transition:none!important}}
@media (max-width:430px){
  .dkc .stamp{width:108px;bottom:120px;right:16px}
  .dkc .csign{max-width:100%}
  .dkc .cmeta{flex-direction:column;gap:3px}
}
