/* ═══════════════════════════════════════════════════════════════════════════
   DMC PILLARS MODULE
   Related-pillars and resources blocks appended to pillar pages.

   Loads only when dmc_pillars_enabled is on AND the page is a mapped pillar.
   Namespace .dmc-plr*. Every selector is new, so nothing existing can be
   affected by this file.
   ═══════════════════════════════════════════════════════════════════════════ */

.dmc-plr{
  position:relative; overflow:hidden;
  padding:clamp(52px,6vw,84px) 0;
  border-top:1px solid var(--line-light);
}
.dmc-plr__lines{ position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }

.dmc-plr__head{
  position:relative; z-index:2;
  display:flex; align-items:flex-end; justify-content:space-between;
  gap:24px; flex-wrap:wrap; margin-bottom:34px;
}
.dmc-plr__head .dmc-h2{ font-size:clamp(1.7rem,2.5vw,2.5rem); }

.dmc-page a.dmc-plr__all{
  display:inline-flex; align-items:center; gap:8px; flex:none;
  font-family:var(--font-b); font-size:15.5px; font-weight:600;
  color:var(--sky-600); transition:gap .25s,color .2s;
}
.dmc-page a.dmc-plr__all::after{ content:"\2192"; transition:transform .25s; }
.dmc-page a.dmc-plr__all:hover{ color:var(--sky-700); }
.dmc-page a.dmc-plr__all:hover::after{ transform:translateX(4px); }

/* ── related pillars grid ─────────────────────────────────────────────────── */

.dmc-plr__grid{
  position:relative; z-index:2;
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px;
}
.dmc-plr__grid > *{ min-width:0; }

.dmc-page a.dmc-plr__card{
  position:relative; overflow:hidden;
  display:flex; flex-direction:column; gap:10px;
  background:#fff; border:1px solid var(--line-light); border-radius:var(--rad-sm);
  padding:26px 28px 24px; color:var(--ink-soft);
  transition:transform .3s,box-shadow .3s,border-color .3s;
}
.dmc-page a.dmc-plr__card:hover{
  transform:translateY(-4px); border-color:var(--sky-400);
  box-shadow:0 26px 54px -32px rgba(0,21,93,.45);
}
.dmc-plr__card::before{
  content:""; position:absolute; left:0; right:0; top:0; height:3px;
  background:var(--grad-rise); opacity:0; transition:opacity .3s;
}
.dmc-plr__card:hover::before{ opacity:1; }

.dmc-plr__kick{
  font-family:var(--font-d); font-weight:600; font-size:11.5px; letter-spacing:.09em;
  text-transform:uppercase; color:var(--sky-600);
}
.dmc-plr__ttl{
  font-family:var(--font-d); font-weight:600; font-size:1.14rem; line-height:1.32;
  color:var(--ink); text-wrap:balance;
}
.dmc-plr__go{
  margin-top:auto; padding-top:8px; display:inline-flex; color:var(--sky-600);
  transition:transform .25s;
}
.dmc-plr__go svg{ width:19px; height:19px; }
.dmc-plr__card:hover .dmc-plr__go{ transform:translateX(5px); }

/* ── resources list ───────────────────────────────────────────────────────── */

.dmc-plr__reslist{ position:relative; z-index:2; display:grid; gap:0; }
.dmc-plr__resitem + .dmc-plr__resitem{ border-top:1px solid var(--line-light); }

.dmc-page a.dmc-plr__reslink{
  display:grid; grid-template-columns:minmax(0,42%) minmax(0,1fr);
  gap:8px 34px; align-items:baseline;
  padding:22px 4px; color:var(--ink-soft);
  transition:padding-left .25s,background .25s;
}
.dmc-page a.dmc-plr__reslink:hover{ padding-left:14px; background:rgba(113,182,255,.05); }

.dmc-plr__resttl{
  font-family:var(--font-d); font-weight:600; font-size:1.06rem; line-height:1.36;
  color:var(--ink); transition:color .2s;
}
.dmc-page a.dmc-plr__reslink:hover .dmc-plr__resttl{ color:var(--sky-600); }
.dmc-plr__resex{ font-size:15px; line-height:1.65; color:var(--ink-soft); }

/* ── responsive ───────────────────────────────────────────────────────────── */

@media (max-width:1080px){
  .dmc-plr__grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .dmc-page a.dmc-plr__reslink{ grid-template-columns:minmax(0,1fr); gap:6px; }
}
@media (max-width:768px){
  .dmc-plr__grid{ grid-template-columns:minmax(0,1fr); }
  .dmc-plr__head{ flex-direction:column; align-items:flex-start; gap:14px; }
}
@media (prefers-reduced-motion:reduce){
  .dmc-plr *{ transition:none !important; animation:none !important; }
}

/* ── Appended-module wrapper ────────────────────────────────────────────────
   The pillars modules are emitted after post_content, so they are wrapped in
   their own .dmc-page to inherit the design tokens. That wrapper must not paint
   its own background: each section inside already sets .dmc-light / .dmc-white /
   .dmc-dark, and a stray navy ground would show through at the edges.          */
.dmc-page--appended{ background:transparent; }