body.dt{background:var(--cream);min-height:100vh;
display:flex;flex-direction:column}
body.dt #haze{position:fixed;inset:0;z-index:0;opacity:.72}
.dt-main{position:relative;z-index:2;flex:1;display:flex;align-items:center;
max-width:1180px;width:100%;margin:0 auto;
padding:clamp(112px,18vh,160px) clamp(20px,5vw,60px) clamp(60px,10vh,96px)}
.dt-code{display:block;font-size:12px;letter-spacing:.18em;
text-transform:uppercase;font-weight:600;
color:var(--dt-encre);margin-bottom:16px}
.dt-title{font-family:var(--title-font),serif;font-weight:400;
font-size:clamp(32px,5.6vw,68px);line-height:1.04;letter-spacing:-.03em;
max-width:19ch;margin:0}
.dt-title em{font-style:italic;color:var(--dt-grand)}
.dt-lead{font-size:clamp(16px,1.7vw,20px);line-height:1.55;
color:var(--ink-soft);max-width:52ch;margin-top:24px;text-wrap:pretty}
.dt-links{display:flex;flex-direction:column;align-items:flex-start;
gap:20px;margin-top:clamp(32px,5vh,40px)}
.dt-go{display:inline-flex;align-items:center;gap:8px;
padding:16px 32px;border-radius:12px;
background:var(--dt-encre);color:var(--cream);text-decoration:none;
font-size:15px;font-weight:500;
transition:filter .25s ease}
.dt-go:hover{filter:brightness(1.16)}
.dt-go .ar{transition:transform .25s}
.dt-go:hover .ar{transform:translate(3px,-3px)}
.dt-go:focus-visible{outline:2px solid var(--dt-encre);outline-offset:3px}
.dt-back{display:inline-flex;align-items:center;gap:8px;
font-size:14.5px;color:var(--ink-soft);text-decoration:none;
border-bottom:1px solid rgba(28,28,38,.22);padding-bottom:2px;
transition:color .25s,border-color .25s}
.dt-back:hover{color:var(--ink);border-color:var(--ink)}
.dt-back .ar{transition:transform .25s}
.dt-back:hover .ar{transform:translateX(-4px)}
.dt-back:focus-visible{outline:2px solid var(--dt-encre);outline-offset:3px}
@media (prefers-reduced-motion:reduce){
.dt-go .ar,.dt-back .ar{transition:none}
}
@media (hover:none){
.dt-back{padding-block:11px;margin-block:-11px}
}