/* DOCUMENTED NORTH / no-tracking social sharing */
.dn-share{
  --dn-share-bg:#141916;
  --dn-share-ink:#e8e7dc;
  --dn-share-muted:#aeb6ae;
  --dn-share-line:#384239;
  --dn-share-accent:#d7c64a;
  --dn-share-button:#101411;
  display:grid;
  grid-template-columns:minmax(220px,.72fr) minmax(0,1.28fr);
  gap:24px;
  margin:38px 0;
  padding:24px;
  border:1px solid var(--dn-share-line);
  background:var(--dn-share-bg);
  color:var(--dn-share-ink);
}
.case-page .dn-share{
  --dn-share-bg:rgba(240,239,232,.84);
  --dn-share-ink:var(--ink);
  --dn-share-muted:var(--muted);
  --dn-share-line:var(--line);
  --dn-share-accent:var(--case-accent,var(--accent));
  --dn-share-button:rgba(255,255,255,.28);
}
.dn-share-copy{min-width:0}
.dn-share-kicker{
  margin:0 0 9px;
  color:var(--dn-share-accent);
  font:700 10px/1.4 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.dn-share-title{
  margin:0;
  color:var(--dn-share-ink);
  font:500 clamp(26px,3vw,42px)/.98 Georgia,"Times New Roman",serif;
  letter-spacing:-.04em;
}
.dn-share-description{
  max-width:530px;
  margin:12px 0 0;
  color:var(--dn-share-muted);
  font:14px/1.55 system-ui,-apple-system,Segoe UI,sans-serif;
}
.dn-share-actions{
  display:flex;
  align-content:flex-start;
  align-items:flex-start;
  justify-content:flex-end;
  flex-wrap:wrap;
  gap:8px;
}
.dn-share-action,
.dn-share-native{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:40px;
  padding:10px 13px;
  border:1px solid var(--dn-share-line);
  background:var(--dn-share-button);
  color:var(--dn-share-ink);
  font:700 10px/1.1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  letter-spacing:.06em;
  text-decoration:none;
  text-transform:uppercase;
  cursor:pointer;
  transition:background .2s,border-color .2s,color .2s,transform .2s;
}
.dn-share-action:hover,
.dn-share-action:focus-visible,
.dn-share-native:hover,
.dn-share-native:focus-visible{
  border-color:var(--dn-share-accent);
  color:var(--dn-share-accent);
  transform:translateY(-1px);
}
.dn-share-native{
  border-color:var(--dn-share-accent);
  background:var(--dn-share-accent);
  color:#111513;
}
.dn-share-native:hover,
.dn-share-native:focus-visible{
  background:transparent;
  color:var(--dn-share-accent);
}
.dn-share-action[data-share-network="facebook"]{border-top:2px solid #5a78b7}
.dn-share-action[data-share-network="x"]{border-top:2px solid #dfe4df}
.dn-share-action[data-share-network="linkedin"]{border-top:2px solid #5b9bd5}
.dn-share-action[data-share-network="bluesky"]{border-top:2px solid #72a9e8}
.dn-share-action[data-share-network="reddit"]{border-top:2px solid #ef7445}
.dn-share-action[data-share-network="email"]{border-top:2px solid var(--dn-share-accent)}
.dn-share-copy-button{border-top:2px solid var(--dn-share-accent)}
.dn-share-status{
  grid-column:1/-1;
  min-height:1.25em;
  margin:0;
  color:var(--dn-share-accent);
  font:600 10px/1.4 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.dn-share-native[hidden]{display:none}
@media (min-width:761px){
  .dn-share-native{display:none!important}
}
@media (max-width:760px){
  .dn-share{
    grid-template-columns:1fr;
    gap:18px;
    margin:30px 0;
    padding:19px;
  }
  .dn-share-actions{justify-content:flex-start}
  .dn-share-action,
  .dn-share-native{
    flex:1 1 calc(50% - 8px);
    min-width:132px;
  }
  .dn-share-native:not([hidden]){
    flex-basis:100%;
    order:-1;
  }
  .dn-share-status{grid-column:auto}
}
@media (prefers-reduced-motion:reduce){
  .dn-share-action,.dn-share-native{transition:none}
}
