/* =====================================================================
   Visitors' comments + comment form — the ".vc" block of the approved designs
   (mockups/_gen/comments.py) and the letter sheet of the contact page, ported
   with their own class names (dgc-*) so that they look the same inside every
   design and inside the fallback templates. Tokens come from the page's :root
   when present, with the design system's values as fallbacks.
   ===================================================================== */
.dgc{
  --dgc-ink:var(--ink,#15161A); --dgc-ink2:var(--ink-2,#36342F); --dgc-muted:var(--muted,#5E5A52);
  --dgc-rule:var(--rule,rgba(21,22,26,.17)); --dgc-bronze:var(--bronze,#8A5526); --dgc-pgold:var(--pgold,#B08D57);
  --dgc-klein:var(--klein,#002FA7); --dgc-paper:var(--paper,#F5F1E8);
  --dgc-display:var(--display,'Cormorant Garamond','EB Garamond',Garamond,'Times New Roman',serif);
  --dgc-serif:var(--serif,'EB Garamond',Garamond,'Times New Roman',serif);
  --dgc-mono:var(--mono,'IBM Plex Mono',ui-monospace,Menlo,monospace);
  position:relative;clear:both;display:block;margin:0;text-align:left;
  padding:clamp(56px,6.5vw,104px) var(--m,clamp(20px,5vw,72px));
  background-color:var(--dgc-paper);background-image:var(--noise,none);color:var(--dgc-ink);
  font-family:var(--dgc-serif);font-size:19px;line-height:1.55;font-weight:400;letter-spacing:normal;text-transform:none;
  font-variant-numeric:oldstyle-nums proportional-nums;-webkit-font-smoothing:antialiased
}
.dgc *,.dgc *::before,.dgc *::after{box-sizing:border-box}
.dgc :focus-visible{outline:2px solid var(--dgc-klein);outline-offset:3px}
.dgc-wrap{max-width:var(--max,1296px);margin:0 auto}

/* running head and section head */
.dgc-run{display:flex;justify-content:space-between;align-items:baseline;gap:20px;margin:0 0 clamp(44px,5.5vw,80px);padding:0 0 12px;border-bottom:1px solid var(--dgc-rule);font:400 10.5px/1.4 var(--dgc-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--dgc-muted);font-variant-numeric:normal}
.dgc-run .folio{color:var(--dgc-bronze)}
.dgc-head{display:grid;grid-template-columns:7fr 5fr;gap:clamp(32px,6vw,96px);align-items:end;margin:0 0 clamp(48px,5.5vw,84px)}
.dgc-label{margin:0;font:400 11px/1.4 var(--dgc-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--dgc-bronze);font-variant-numeric:normal}
.dgc-label .sep{display:inline-block;width:28px;height:1px;background:currentColor;vertical-align:middle;margin:0 10px 2px;opacity:.7}
.dgc-h2{margin:.32em 0 0;padding:0;font:300 clamp(42px,5.2vw,78px)/.98 var(--dgc-display);letter-spacing:-.018em;color:var(--dgc-ink);text-transform:none;text-wrap:balance}
.dgc-h2 em{font-style:italic}
.dgc-intro{margin:0;font-size:19px;line-height:1.6;color:var(--dgc-ink2);max-width:30em;text-wrap:pretty}

/* the comments */
.dgc-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--dgc-ink)}
.dgc-i{display:grid;grid-template-columns:minmax(170px,3fr) minmax(0,9fr);gap:8px clamp(24px,4vw,64px);margin:0;padding:clamp(22px,2.4vw,32px) 0;border-bottom:1px solid var(--dgc-rule);list-style:none}
.dgc-d1,.dgc-d2,.dgc-d3{border-left:1px solid var(--dgc-rule);padding-left:clamp(16px,2vw,28px)}
.dgc-d1{margin-left:clamp(18px,3vw,48px)}
.dgc-d2{margin-left:calc(2 * clamp(18px,3vw,48px))}
.dgc-d3{margin-left:calc(3 * clamp(18px,3vw,48px))}
.dgc-m{display:flex;flex-direction:column;gap:6px;min-width:0}
.dgc-m b{font:400 clamp(22px,2vw,28px)/1.1 var(--dgc-display);color:var(--dgc-ink);overflow-wrap:anywhere}
.dgc-own .dgc-m b{color:var(--dgc-bronze)}
.dgc-m time,.dgc-re{font:400 10.5px/1.4 var(--dgc-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--dgc-muted);font-variant-numeric:normal}
.dgc-re{color:var(--dgc-bronze)}
.dgc-t{font:400 19px/1.62 var(--dgc-serif);color:var(--dgc-ink2);max-width:36em;overflow-wrap:anywhere}
.dgc-t p{margin:0}
.dgc-t p+p{margin-top:.7em}
.dgc [lang=fa]{font-family:'Vazirmatn','Noto Naskh Arabic','Geeza Pro','Al Bayan',var(--dgc-serif)}
.dgc-t[lang=fa]{text-align:right}
.dgc-m b[lang=fa]{font-size:clamp(20px,1.8vw,25px);text-align:left}

/* "Mentioned in" (pingbacks) */
.dgc-pb{margin-top:clamp(40px,4.5vw,64px)}
.dgc-pb.dgc-solo{margin-top:0}
.dgc-pb h3{margin:0;padding:0 0 12px;border-bottom:1px solid var(--dgc-ink);font:400 10.5px/1.4 var(--dgc-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--dgc-bronze);font-variant-numeric:normal}
.dgc-pb.dgc-solo ul{border-top:1px solid var(--dgc-ink)}
.dgc-pb ul{list-style:none;margin:0;padding:0}
.dgc-pb li{display:grid;grid-template-columns:1fr auto;gap:18px;align-items:baseline;margin:0;padding:13px 0 12px;border-bottom:1px solid var(--dgc-rule)}
.dgc-src{font:italic 400 clamp(18px,1.5vw,21px)/1.3 var(--dgc-display);color:var(--dgc-ink);overflow-wrap:anywhere}
.dgc-pb time{font:400 10.5px/1.4 var(--dgc-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--dgc-muted);white-space:nowrap}

/* the comment form — the letter sheet of the contact page */
.dgc-respond{margin-top:clamp(56px,6vw,96px);max-width:760px}
.dgc-thanks{margin:0 0 24px;padding:16px 20px;border:1px solid var(--dgc-bronze);background:rgba(251,249,244,.75);font:italic 400 18px/1.5 var(--dgc-serif);color:var(--dgc-ink)}
.dgc-thanks:focus{outline:none}
.dgc-form{position:relative;margin:0;font-family:var(--dgc-serif);color:var(--dgc-ink)}
.dgc-sheet{position:relative;border:1px solid rgba(21,22,26,.38);background:rgba(251,249,244,.62)}
.dgc-reg{position:absolute;width:22px;height:22px;pointer-events:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22' fill='none' stroke='%23131519' stroke-opacity='.5' stroke-width='1'%3E%3Ccircle cx='11' cy='11' r='5.5'/%3E%3Cpath d='M11 0v22M0 11h22'/%3E%3C/svg%3E") center/contain no-repeat}
.dgc-reg.tl{left:-11px;top:-11px}.dgc-reg.tr{right:-11px;top:-11px}.dgc-reg.bl{left:-11px;bottom:-11px}.dgc-reg.br{right:-11px;bottom:-11px}
.dgc-top{display:flex;justify-content:space-between;gap:16px;margin:0;padding:12px 16px 11px;border-bottom:1px solid rgba(21,22,26,.38);font:400 10.5px/1.4 var(--dgc-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--dgc-muted);font-variant-numeric:normal}
.dgc-top b{font-weight:400;color:var(--dgc-bronze)}
.dgc-to{margin:0;padding:12px 16px;border-bottom:1px solid var(--dgc-rule);font:italic 400 17px/1.45 var(--dgc-serif);color:var(--dgc-ink2)}
.dgc-to a{color:var(--dgc-ink);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.18em;font-style:normal}
.dgc-row{display:grid;grid-template-columns:1fr 1fr}
.dgc-row+.dgc-row{border-top:1px solid var(--dgc-rule)}
.dgc-row.one{grid-template-columns:1fr}
.dgc-f{position:relative;min-width:0;margin:0;padding:12px 16px 10px;border:0;border-left:1px solid var(--dgc-rule);transition:background .4s}
.dgc-f:first-child{border-left:0}
.dgc-f>label{display:block;margin:0;padding:0;font:400 9.5px/1.4 var(--dgc-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--dgc-bronze);font-variant-numeric:normal}
.dgc-f>label .opt{color:var(--dgc-muted)}
.dgc-f input,.dgc-f textarea{display:block;width:100%;max-width:none;margin:5px 0 0;padding:2px 0 4px;border:0;border-radius:0;background:transparent;box-shadow:none;font:400 19px/1.4 var(--dgc-serif);color:var(--dgc-ink);-webkit-appearance:none;appearance:none}
.dgc-f textarea{min-height:170px;resize:vertical;line-height:1.55}
.dgc-f input:focus,.dgc-f textarea:focus{outline:none}
.dgc-f:focus-within{background:rgba(255,255,255,.55);box-shadow:inset 0 0 0 2px var(--dgc-klein)}
.dgc-f::after{content:"";position:absolute;left:16px;right:16px;bottom:7px;height:1px;background:var(--dgc-bronze);transform:scaleX(0);transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.dgc-f:focus-within::after{transform:scaleX(1)}
.dgc-hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.dgc-send-row{display:flex;flex-direction:column;align-items:flex-start;gap:14px;margin-top:30px}
.dgc-send{position:relative;display:inline-flex;align-items:center;gap:14px;margin:0;padding:18px 28px 18px 30px;border:0;border-radius:0;background:var(--dgc-ink);color:var(--dgc-paper);font:400 11.5px/1 var(--dgc-mono);letter-spacing:.16em;text-transform:uppercase;cursor:pointer;transition:background .4s}
.dgc-send::after{content:"";width:28px;height:1px;background:currentColor;transition:width .4s ease}
.dgc-send:hover{background:#26272c}
.dgc-send:hover::after{width:42px}
.dgc-notch{position:absolute;right:0;top:0;width:0;height:0;border-style:solid;border-width:0 10px 10px 0;border-color:transparent var(--dgc-pgold) transparent transparent}
.dgc-req{margin:0;font:400 10px/1.5 var(--dgc-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--dgc-muted)}
.dgc-note{margin:0;max-width:40em;font:italic 400 16px/1.55 var(--dgc-serif);color:var(--dgc-muted);text-wrap:pretty}
.dgc-note a{color:var(--dgc-ink);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.18em}
.dgc-note a:hover,.dgc-to a:hover{color:var(--dgc-bronze)}

.dgc time sup{font-size:.78em;line-height:0;vertical-align:.42em;text-transform:none;letter-spacing:.02em}

/* ranked images kept on designed pages (URL spec R3.3 / R3.4): plates in the same language */
.dgc-plates-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:clamp(28px,3.5vw,56px);align-items:start}
.dgc-one .dgc-plates-grid{grid-template-columns:minmax(0,880px)}
.dgc-plate{margin:0;min-width:0}
.dgc-pi{display:block;line-height:0;border:1px solid var(--dgc-rule);background:var(--dgc-paper)}
.dgc-pi img{display:block;width:100%;height:auto}
.dgc-plate figcaption{margin:14px 0 0;font:italic 400 17px/1.45 var(--dgc-serif);color:var(--dgc-ink2)}
.dgc-plate figcaption a,.dgc-sz a{color:var(--dgc-ink);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.18em;font-style:normal}
.dgc-plate figcaption a:hover,.dgc-sz a:hover{color:var(--dgc-bronze)}
.dgc-sz{margin:10px 0 0;font:400 10.5px/1.7 var(--dgc-mono);letter-spacing:.06em;color:var(--dgc-muted);font-variant-numeric:normal;overflow-wrap:anywhere}
.dgc-sz span{color:var(--dgc-bronze);text-transform:uppercase;letter-spacing:.14em;margin-right:6px}
@media (max-width:860px){
  .dgc{font-size:18px}
  .dgc-run{font-size:9.5px;letter-spacing:.12em;margin-bottom:40px}
  .dgc-run .who{display:none}
  .dgc-row{grid-template-columns:1fr}
  .dgc-row>.dgc-f+.dgc-f{border-left:0;border-top:1px solid var(--dgc-rule)}
  .dgc-f input,.dgc-f textarea{font-size:18px}
  .dgc-reg{display:none}
  .dgc-send{width:100%;justify-content:center}
  .dgc-send-row{align-items:stretch}
}
@media (max-width:760px){
  .dgc-i{grid-template-columns:1fr}
  .dgc-pb li{grid-template-columns:1fr}
  .dgc-head{grid-template-columns:1fr}
  .dgc-d1{margin-left:14px}.dgc-d2{margin-left:28px}.dgc-d3{margin-left:42px}
}
@media (prefers-reduced-motion:reduce){.dgc *,.dgc *::before,.dgc *::after{transition:none!important}}