/* ============================================================
   DEADLINK : Section 02 "What Deadlink is"
   Reuses the isidor components already loaded (container-large,
   tag-component, t-heading/t-label/t-paragraph, card_icon-corner)
   + koyeb's terminal block, remapped to Deadlink. Background is the
   hero grid, now ALIVE and coordinated (the payoff to Section 01).
   ============================================================ */

.dl-sec2{position:relative;background:var(--void);overflow:hidden}
/* reuse .dl-pbg / #canvas / .dl-pveil pattern; stronger veil so pillars read */
.dl-pveil2{background:
  linear-gradient(180deg, var(--void) 0%, rgba(8,8,13,.5) 15%, rgba(8,8,13,.5) 85%, var(--void) 100%)}

.dl-sec2 .container-large{position:relative;z-index:2;padding-top:clamp(80px,9vw,150px);padding-bottom:clamp(80px,9vw,150px)}

/* heading reuses .dl-prob-head / .dl-eyebrow / .dl-stmt / .dl-prob-copy from problem.css */

/* ===== pillars ===== */
.dl-pillars{display:flex;flex-direction:column;gap:clamp(52px,6.5vw,118px);margin-top:clamp(58px,7vw,120px)}
.dl-pillar{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,4vw,76px);align-items:center}
.dl-pillar.flip .dl-pillar-text{order:2}
.dl-pillar-num{color:var(--cyan);margin-bottom:1.2rem;display:block;font-size:.92rem}
.dl-pillar-title{color:var(--offwhite);margin:0 0 1.1rem;font-size:clamp(1.5rem,2vw,1.95rem);line-height:1.18}
.dl-pillar-desc{color:var(--_colors---c-brand--white-80p);font-family:'Geist Mono',monospace;
  font-size:.95rem;line-height:1.62;letter-spacing:-.01em;max-width:34em;margin:0}

/* visual = a region of the live background grid, framed by isidor corner brackets.
   the panel itself is transparent so the actual background squares read through. */
.dl-pillar-visual{position:relative;min-height:clamp(220px,24vw,300px)}

@media(max-width:860px){
  .dl-pillar{grid-template-columns:1fr;gap:26px}
  .dl-pillar.flip .dl-pillar-text{order:0}
}
@media(max-width:640px){
  .dl-sec2 .container-large{padding-top:64px;padding-bottom:64px}
  .dl-pillars{gap:34px;margin-top:36px}
  .dl-pillar{display:block;gap:16px}
  .dl-pillar-num{font-size:.74rem;margin-bottom:.75rem}
  .dl-pillar-title{font-size:1.25rem;line-height:1.18;margin-bottom:.65rem}
  .dl-pillar-desc{font-size:.82rem;line-height:1.52}
  .dl-pillar-visual{display:none}
  .dl-sec2-close{margin-top:38px}
  .dl-sec2-close p{font-size:1.15rem;line-height:1.28}
}

/* ===== koyeb terminal block (reproduced with Deadlink values) ===== */
.dl-term{width:100%;border-radius:4px;overflow:hidden;background:rgba(26,28,32,.92);
  color:var(--offwhite);font-family:'Geist Mono',monospace;font-size:.72rem;
  box-shadow:0 25px 50px -12px rgba(var(--cyan-rgb)/.18)}
.dl-term-bar{display:flex;align-items:center;gap:7px;background:#0c0d11;padding:9px 12px}
.dl-term-bar i{width:10px;height:10px;border-radius:50%;display:block}
.dl-term-bar .r{background:#ff5f57}.dl-term-bar .y{background:#febc2e}.dl-term-bar .g{background:var(--cyan)}
.dl-term-bar span{margin-left:.6rem;color:rgba(var(--ow-rgb)/.4);font-size:.66rem;letter-spacing:.06em}
.dl-term-body{padding:16px 18px;min-height:236px;line-height:1.75;white-space:pre-wrap;word-break:break-word}
.dl-term-body .k{color:var(--cyan)}
.dl-term-body .m{color:rgba(var(--ow-rgb)/.45)}
.dl-term-body .a{color:var(--amber)}
.dl-term-cursor{display:inline-block;width:7px;height:1em;background:var(--cyan);vertical-align:-2px;animation:dl-blink 1s steps(1) infinite}
@keyframes dl-blink{50%{opacity:0}}

@media(max-width:640px){
  .dl-term{font-size:.66rem}
  .dl-term-bar{padding:8px 10px}
  .dl-term-bar span{font-size:.58rem;margin-left:.35rem}
  .dl-term-body{min-height:168px;padding:12px 13px;line-height:1.62}
}

/* closing line */
.dl-sec2-close{margin-top:clamp(56px,7vw,120px);max-width:48rem}
.dl-sec2-close p{font-family:'Geist Pixel',monospace;font-weight:400;color:var(--offwhite);
  font-size:clamp(1.25rem,2vw,1.8rem);line-height:1.34;letter-spacing:0;margin:0}
.dl-sec2-close .m{color:rgba(var(--ow-rgb)/.5)}