/* Download — Omni everywhere */
.dl-hero { min-height: min(100vh, 980px); display: flex; align-items: center; }
.dl-hero__inner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: clamp(32px, 5vw, 80px); align-items: center; }
.dl-hero__copy { display: flex; flex-direction: column; gap: 22px; }
.dl-hero__title { font-size: clamp(46px, 6.6vw, 104px); }
.dl-hero__actions { margin-block-start: 6px; }
.dl-hero__glow-a { width: 520px; height: 520px; inset-inline-start: -160px; inset-block-start: 10%; }
.dl-hero__glow-b { width: 620px; height: 620px; inset-inline-end: -200px; inset-block-end: -10%; }

.dl-devices { position: relative; min-height: 520px; direction: ltr; }
.dl-device { position: absolute; }
.dl-device--desktop { inset-inline-start: 0; inset-block-start: 20px; width: 84%; }
.dl-device--desktop .dl-desktop__chat { padding-inline-end: 22%; }
.dl-device--ide { inset-inline-start: 6%; inset-block-end: 0; width: 70%; z-index: 2; }
.dl-device--phone {
  inset-inline-end: 0;
  inset-block-start: 150px;
  width: 184px;
  z-index: 3;
  padding: 18px 12px 16px;
  border-radius: 30px;
  border: 1px solid var(--glass-border);
  background: linear-gradient(180deg, #0c1830, #060c18);
  box-shadow: var(--shadow-2), 0 0 0 6px rgba(3, 6, 13, 0.9), 0 0 0 7px var(--line-strong);
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.dl-phone__notch { width: 60px; height: 6px; margin: 0 auto 6px; border-radius: 99px; background: rgba(207, 226, 255, 0.14); }
.dl-phone__title { margin: 0 0 4px; text-align: center; font-size: 13px; font-weight: 600; color: var(--gold-2); }
.dl-desktop { display: grid; grid-template-columns: 70px 1fr; gap: 14px; min-height: 250px; }
.dl-desktop__side { display: grid; align-content: start; gap: 10px; padding-block-start: 4px; }
.dl-desktop__side span { height: 10px; border-radius: 6px; background: rgba(207, 226, 255, 0.08); }
.dl-desktop__side span:first-child { background: rgba(240, 169, 30, 0.35); }
.dl-desktop__chat { display: flex; flex-direction: column; gap: 10px; }
.dl-bubble { unicode-bidi: plaintext; text-align: start; margin: 0; max-width: 88%; padding: 9px 12px; border-radius: 14px; font-size: 12.5px; line-height: 1.45; color: var(--text-2); background: rgba(207, 226, 255, 0.06); border: 1px solid var(--line); }
.dl-bubble--me { align-self: flex-end; color: #1c1303; background: linear-gradient(180deg, var(--gold-2), var(--gold)); border-color: transparent; }
.dl-device--phone .dl-bubble { font-size: 11.5px; max-width: 100%; }
.dl-input { unicode-bidi: plaintext; margin: auto 0 0; padding: 10px 12px; border-radius: 12px; border: 1px solid var(--line-strong); font-size: 12px; color: var(--text-3); }
.dl-ide { padding: 14px 16px; }
.dl-ide__code { margin: 0; font-size: 12.5px; line-height: 1.7; color: var(--ice); white-space: pre-wrap; }
.dl-ide__code .t-k { color: #8fb8ff; }
.dl-ide__code .t-c { color: var(--gold-2); }
.dl-ide__panel { display: flex; align-items: center; gap: 8px; margin: 12px 0 0; padding: 10px 12px; border-radius: 10px; font-size: 12.5px; color: var(--text); background: rgba(240, 169, 30, 0.08); border: 1px solid rgba(255, 201, 90, 0.25); }
.dl-ide__panel .icon { width: 16px; height: 16px; color: var(--gold-2); fill: currentColor; }

.dl-apps__note { margin-block-start: 22px; font-size: 14px; }
.dl-ide-sec .feature-list { margin-block-start: 8px; }

@media (max-width: 980px) {
  .dl-hero__inner { grid-template-columns: minmax(0, 1fr); }
  .dl-devices { min-height: 470px; }
}
@media (max-width: 560px) {
  .dl-devices { min-height: 430px; }
  .dl-device--desktop { width: 100%; }
  .dl-device--ide { width: 86%; inset-inline-start: 0; }
  .dl-device--phone { width: 150px; inset-block-start: 170px; }
  .dl-device--desktop .dl-desktop__chat { padding-inline-end: 34%; }
  .dl-desktop { grid-template-columns: 1fr; }
  .dl-desktop__side { display: none; }
}