html{scroll-padding-top:96px}

.dt-card{
  max-width:46rem;margin:0 auto;
  padding:clamp(24px,4vw,48px);
  border:1px solid rgba(255,255,255,0.1);border-radius:var(--radius-lg);
  background:rgba(15,15,17,0.94);
  box-shadow:0 40px 120px rgba(0,0,0,0.55)
}
.dt-card + .dt-card{margin-top:clamp(20px,3vw,32px)}

.dt-prose{
  font-family:var(--font-body,'EB Garamond',serif);
  font-size:19px;line-height:1.7;color:#a9aaad
}
.dt-prose p{margin:0 0 1.1em;max-width:none;font-size:inherit}
.dt-prose p:last-child,.dt-prose ul:last-child{margin-bottom:0}
.dt-prose strong{color:#d9d9d6;font-weight:600}
.dt-prose a{
  color:#d8bd80;text-decoration:underline;text-decoration-color:rgba(216,189,128,0.4);
  text-underline-offset:3px;overflow-wrap:anywhere
}
.dt-prose a:hover{color:#f4e8c8;text-decoration-color:currentColor}

.dt-prose h2{
  margin:0 0 0.8em;font-family:var(--font-display,Cinzel,serif);font-weight:600;
  font-size:clamp(20px,2.4vw,26px);letter-spacing:0.08em;line-height:1.25;color:#d8bd80;
  scroll-margin-top:96px
}
.dt-prose h3{
  margin:2em 0 0.7em;font-family:var(--font-display,Cinzel,serif);font-weight:600;
  font-size:15px;letter-spacing:0.14em;line-height:1.4;color:#c9c9c6
}
.dt-prose h2 + h3,.dt-prose h3:first-child{margin-top:0}

.dt-prose ul{margin:0 0 1.2em;padding:0;list-style:none}
.dt-prose li{position:relative;margin:0 0 0.65em;padding-left:1.4em}
.dt-prose li::before{
  content:"";position:absolute;left:0.15em;top:0.8em;width:5px;height:5px;
  background:#c3a25c;transform:rotate(45deg)
}

.dt-prose .dt-lead{margin-bottom:0.7em;color:#c9c9c6}
.dt-label{
  margin-right:0.5em;font-family:var(--font-mono,monospace);font-size:0.62em;
  letter-spacing:0.16em;text-transform:uppercase;color:#8e8f92
}

.dt-sec + .dt-sec{
  margin-top:clamp(28px,4vw,44px);padding-top:clamp(28px,4vw,44px);
  border-top:1px solid rgba(255,255,255,0.08)
}
.dt-intro{margin-bottom:clamp(24px,3vw,32px)}

.dt-meta{
  margin:0;font-family:var(--font-mono,monospace);font-size:12px;
  letter-spacing:0.16em;text-transform:uppercase;color:#8e8f92
}

.dt-toc{
  margin:0 0 clamp(28px,4vw,44px);padding:18px 20px;
  border:1px solid rgba(216,189,128,0.22);border-radius:var(--radius-md);
  background:rgba(0,0,0,0.25)
}
.dt-toc__label{
  font-family:var(--font-mono,monospace);font-size:11px;letter-spacing:0.2em;
  text-transform:uppercase;color:#8e8f92
}
.dt-toc ol{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:6px 20px;
  margin:12px 0 0;padding:0;list-style:none;counter-reset:dt-toc
}
.dt-toc li{margin:0;padding:0;counter-increment:dt-toc}
.dt-toc li::before{content:none}
.dt-toc a{
  display:flex;gap:1em;font-family:var(--font-mono,monospace);font-size:12px;letter-spacing:0.12em;
  text-transform:uppercase;text-decoration:none;line-height:1.5
}
.dt-toc a::before{flex:none;content:counter(dt-toc,decimal-leading-zero);color:#6b6c6f}

.dt-collab{
  display:flex;flex-direction:column;overflow:hidden;color:inherit;
  border:1px solid rgba(255,255,255,0.1);border-radius:var(--radius-lg);
  background:rgba(20,20,22,0.82);
  transition:transform .6s cubic-bezier(0.16,1,0.3,1),box-shadow .6s,border-color .3s
}
.dt-collab:hover,.dt-collab:focus-visible{
  transform:translateY(-4px) !important;border-color:rgba(216,189,128,0.45);
  box-shadow:0 30px 80px rgba(0,0,0,0.6)
}
.dt-collab__media{position:relative;aspect-ratio:16/10;overflow:hidden;background:#141416}
.dt-collab__media img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  transition:opacity .6s,transform 1.2s cubic-bezier(0.16,1,0.3,1)
}
.dt-collab__media img + img{opacity:0}
.dt-collab:hover .dt-collab__media img,.dt-collab:focus-visible .dt-collab__media img{transform:scale(1.04)}
.dt-collab:hover .dt-collab__media img + img,.dt-collab:focus-visible .dt-collab__media img + img{opacity:1}
.dt-collab__body{
  display:flex;flex:1;flex-direction:column;justify-content:space-between;gap:14px;
  padding:20px 22px 24px
}
.dt-collab__title{
  margin:0;font-family:var(--font-display,Cinzel,serif);font-weight:600;
  font-size:18px;letter-spacing:0.06em;line-height:1.35;color:#d8bd80
}
.dt-collab__cta{
  font-family:var(--font-mono,monospace);font-size:11px;letter-spacing:0.18em;
  text-transform:uppercase;color:#d8bd80
}

@media (prefers-reduced-motion:reduce){
  .dt-collab,.dt-collab__media img{transition:none}
  .dt-collab:hover,.dt-collab:focus-visible,
  .dt-collab:hover .dt-collab__media img,.dt-collab:focus-visible .dt-collab__media img{transform:none !important}
}
