.acf-dl-table th,
.acf-dl-table td {
  vertical-align: top!important;          /* align all cell contents at the top */
  text-align: left!important;             /* keep text left-aligned */
  padding-top: 10px!important;
  padding-bottom: 10px!important;
}
.acf-dl-table td button,
.acf-dl-table td a.button {
  vertical-align: top!important;          /* ensure buttons align nicely with text */
}

/* Category split: 67% / 33% with image constrained */
.acf-dl-cat-split { display:flex; gap:1rem; align-items:flex-start; }
.acf-dl-cat-left  { flex: 0 0 67%; min-width:0; }
.acf-dl-cat-right { flex: 0 0 33%; display:flex; justify-content:center; align-items:flex-start; }

/* Read-more fade-in (apply to the inner content directly) */
.acf-dl-more-content{
  opacity: 0;
  transform: translateY(-4px);
  transition: opacity .22s ease, transform .22s ease;
}

.acf-dl-more-content.is-open{
  opacity: 1;
  transform: none;
}

/* keep the row hidden when [hidden] */
.acf-dl-more-row[hidden]{ display:none; }




/* Ensure the SHA block starts below the floated image/text */
.acf-dl-clear { clear: both; }

/* Nice formatting for the SHA block */
.acf-dl-sha-note{
  margin-top:.75rem;
  padding:.5rem .6rem;
  background:linear-gradient(180deg, rgba(0,0,0,.03), rgba(0,0,0,.02));
  border:1px solid rgba(0,0,0,.06);
  border-radius:6px;
}

.acf-dl-sha-note code { word-break: break-all; }
.acf-dl-sha-sub { font-size: .9em; opacity: .8; margin-top: .25rem; }

/* --- Category/right image --- */
.acf-dl-cat-right img{
  max-width:100%;
  height:auto;
  object-fit:contain;
  max-height:240px;              /* keep layout balanced */
  border-radius:8px;
  background:#fff;               /* lift from page bg */
  border:1px solid rgba(0,0,0,.06);
  box-shadow:0 6px 18px rgba(0,0,0,.08);
}

/* --- Read-more floated image --- */
.acf-dl-more-float{
  float:right;
  max-width:33%;
  height:auto;
  object-fit:contain;
  max-height:220px;              /* slightly smaller than category */
  margin:0 .0rem .75rem 1rem;    /* top right bottom left */
  border-radius:8px;
  background:#fff;
  border:1px solid rgba(0,0,0,.06);
  box-shadow:0 6px 18px rgba(0,0,0,.08);
}

/* --- Read-more fade-in --- */
.acf-dl-more-row[hidden] { display:none; }
.acf-dl-more-row .acf-dl-more-content{
  opacity:0;
  transform: translateY(-4px);
  transition: opacity .22s ease, transform .22s ease;
}
.acf-dl-more-row.is-open .acf-dl-more-content{
  opacity:1;
  transform:none;
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce){
  .acf-dl-more-row .acf-dl-more-content{
    transition:none;
    transform:none;
  }
}

/* Large button style reused by both shortcodes */
.acf-dl-btn-large {
  display:inline-block;
  padding:.65rem 1rem;
  font-weight:600;
  border-radius:6px;
}

/* Skyscraper card */
.acf-dl-card{
  width: 100%;
  max-width: 280px;          /* feels like your screenshot */
  border:1px solid rgba(0,0,0,.08);
  border-radius:10px;
  background:#fff;
  box-shadow:0 6px 18px rgba(0,0,0,.06);
  overflow:hidden;
  text-align:center;
  padding: .75rem .75rem 1rem;
}
.acf-dl-card-img img{
  width:100%;
  height:auto;
  max-height:180px;
  object-fit:contain;
  border-radius:6px;
  background:#fff;
  border:1px solid rgba(0,0,0,.06);
}
.acf-dl-card-title{
  font-size:1rem;
  margin:.6rem 0 .25rem 0;
}
.acf-dl-card-platform{
  font-size:.9rem;
  opacity:.8;
  margin-bottom:.35rem;
}
.acf-dl-card-desc{
  font-size:.95rem;
  text-align:left;           /* better for longer text */
  margin:.4rem 0 .8rem;
}
.acf-dl-card-cta{ margin:.3rem 0 .4rem; }
.acf-dl-card-doc a{ font-size:.9rem; }

/* Button-only block */
.acf-dl-btn-only { text-align:center; }