.dt_newsfeed {
  --orange: #f59d22;
  --orange2: #ffb446;
  --orangeSoft: #fff4e4;
  --ink: #171a20;
  --muted: #667085;
  --line: #e8e8e8;
  --soft: #f7f7f6;
  --green: #167c5a;
  --greenSoft: #eaf7f1;
  --shadow: 0 14px 40px rgba(17, 24, 39, .08);
  --radius: 20px
}

.dt_newsfeed,
.dt_newsfeed * {
  box-sizing: border-box;
  font-family: "Roboto", sans-serif;
}

.dt_newsfeed {
  background: #fff;
  color: var(--ink);
  font-family: "Roboto", sans-serif;
  line-height: 1.55
}

.dt_newsfeed a {
  color: inherit
}

.dt_newsfeed .wrap {
  width: min(1180px, calc(100% - 40px));
  margin: auto
}

.dt_newsfeed .btn {
  border: 0;
  border-radius: 999px;
  padding: 12px 18px;
  font-weight: 800;
  font-size: 14px;
  cursor: pointer;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 9px
}

.dt_newsfeed .btn.primary {
  background: var(--orange);
  color: #191919
}

.dt_newsfeed .btn.dark {
  background: #171a20;
  color: #fff
}

.dt_newsfeed .btn.ghost {
  border: 1px solid #d8dbe0;
  background: #fff;
  color: #262a31
}

.hero {
  padding: 74px 0 44px;
  background: linear-gradient(180deg, #fff 0%, #fffaf3 100%);
  overflow: hidden
}

.hero-grid {
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 54px;
  align-items: center
}

.eyebrow {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .13em;
  color: #7a5c2a;
  font-weight: 800;
  margin-bottom: 16px
}

.hero h1 {
  font-size: clamp(42px, 6vw, 72px);
  line-height: 1.02;
  letter-spacing: -.055em;
  margin: 0 0 22px;
  max-width: 15ch
}

.hero h1 em {
  font-style: normal;
  color: var(--orange)
}

.dt_newsfeed .lead {
  font-size: 19px;
  color: #5d6675;
  max-width: 62ch;
  margin: 0 0 28px
}

.cta-row {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 26px
}

.dt_newsfeed .trust {
  display: flex;
  gap: 18px;
  flex-wrap: wrap;
  color: #6c7480;
  font-size: 13px
}

.dt_newsfeed .trust span {
  display: flex;
  align-items: center;
  gap: 7px
}

.dt_newsfeed .dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--green)
}

.demo-shell {
  background: #171a20;
  border-radius: 26px;
  padding: 17px;
  box-shadow: 0 28px 65px rgba(15, 23, 42, .22)
}

.demo-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: #aab0ba;
  font-size: 12px;
  padding: 2px 4px 13px
}

.dt_newsfeed .live {
  display: flex;
  align-items: center;
  gap: 7px
}

.pulse {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #5ce0aa;
  box-shadow: 0 0 0 5px rgba(92, 224, 170, .12)
}

.watchbox {
  background: #22262f;
  border: 1px solid #333944;
  border-radius: 16px;
  padding: 16px
}

.watchbox small {
  color: #9299a7
}

.chips {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin: 10px 0 14px
}

.chip {
  border: 1px solid #4c5361;
  background: #2b303a;
  color: #e9ecf1;
  padding: 7px 10px;
  border-radius: 999px;
  font-size: 12px;
  cursor: pointer
}

.chip.on {
  border-color: #ffb446;
  background: #4a3420;
  color: #ffdca3
}

.feed {
  display: grid;
  gap: 8px
}

.story {
  background: #fff;
  border-radius: 12px;
  padding: 12px 13px;
  color: #16191f;
  display: grid;
  grid-template-columns: 64px 1fr;
  gap: 10px;
  align-items: start
}

.story .time {
  font-size: 11px;
  color: #8b9099
}

.story b {
  font-size: 13px;
  line-height: 1.35
}

.story .tag {
  color: #c86900
}

.json-mini {
  margin-top: 12px;
  border-top: 1px solid #363b46;
  padding: 12px 5px 2px;
  color: #a8f0dd;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 11px;
  white-space: pre-wrap
}

.band {
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: #fbfbfa
}

.band-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr)
}

.band-item {
  padding: 24px;
  border-right: 1px solid var(--line)
}

.band-item:last-child {
  border-right: 0
}

.band-item strong {
  display: block;
  font-size: 26px;
  letter-spacing: -.035em
}

.band-item span {
  color: var(--muted);
  font-size: 12px
}

.dt_newsfeed section {
  padding: 86px 0
}

.section-head {
  display: flex;
  width: 100%;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 40px;
  flex-direction: column;
}

.section-head h2 {
  font-size: clamp(30px, 4vw, 48px);
  line-height: 1.06;
  letter-spacing: -.04em;
  margin: 0
}

.section-head p {
  max-width: 900px;
  color: var(--muted);
  margin: 0
}

.kicker {
  color: #b86500;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .13em;
  font-weight: 900;
  margin-bottom: 10px
}

.pain-grid {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 20px;
  align-items: stretch
}

.pain-card {
  padding: 28px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: #fff
}

.pain-card.bad {
  background: #fafafa
}

.pain-card.good {
  background: linear-gradient(180deg, #fff9ef, #fff)
}

.pain-card h3 {
  font-size: 22px;
  margin: 0 0 18px
}

.pain-list {
  display: grid;
  gap: 14px
}

.pain-row {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  color: #5e6672
}

.pain-row b {
  color: #24282f
}

.arrow-mid {
  display: grid;
  place-items: center;
  font-size: 32px;
  color: var(--orange)
}

.personas {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px
}

.persona {
  border: 1px solid var(--line);
  border-radius: 20px;
  padding: 24px;
  transition: .2s;
  background: #fff
}

.persona:hover {
  box-shadow: var(--shadow);
  transform: translateY(-3px);
  border-color: #f4bc70
}

.iconbox {
  width: 44px;
  height: 44px;
  border-radius: 14px;
  background: var(--orangeSoft);
  display: grid;
  place-items: center;
  color: #b76500;
  margin-bottom: 18px
}

.iconbox svg {
  width: 22px;
  height: 22px
}

.persona h3 {
  font-size: 20px;
  margin: 0 0 8px
}

.persona p {
  font-size: 14px;
  color: var(--muted);
  margin: 0 0 14px
}

.persona .outcome {
  font-size: 13px;
  color: #315b4c;
  background: var(--greenSoft);
  padding: 9px 10px;
  border-radius: 11px
}

.usecase {
  background: #171a20;
  color: #fff
}

.usecase .section-head p {
  color: #adb4c0
}

.dt_newsfeed .tabs {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 24px
}

.dt_newsfeed .tab {
  color: #bfc6d0;
  background: #242832;
  border: 1px solid #333943;
  border-radius: 999px;
  padding: 9px 13px;
  font-weight: 800;
  font-size: 13px;
  cursor: pointer
}

.dt_newsfeed .tab.active {
  background: var(--orange);
  color: #171a20;
  border-color: var(--orange)
}

.workflow {
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 20px
}

.workflow-copy {
  border: 1px solid #363b45;
  background: #20242d;
  border-radius: 20px;
  padding: 25px
}

.workflow-copy h3 {
  font-size: 27px;
  margin: 0 0 8px
}

.workflow-copy p {
  color: #adb4c0
}

.steps {
  display: grid;
  gap: 9px;
  margin-top: 18px
}

.dt_newsfeed .step {
  border: 1px solid #3a404b;
  border-radius: 13px;
  padding: 12px 13px;
  display: flex;
  gap: 12px
}

.dt_newsfeed .step strong {
  color: #ffd197
}

.workflow-out {
  background: #fff;
  color: #171a20;
  border-radius: 20px;
  padding: 24px;
  display: grid;
  gap: 10px
}

.signal-card {
  border: 1px solid #e6e6e6;
  border-radius: 14px;
  padding: 13px
}

.signal-card small {
  color: #7b8390
}

.signal-card b {
  display: block;
  margin-top: 3px
}

.signal-card .risk {
  color: #c03c33
}

.signal-card .good {
  color: #137254
}

.tech-grid {
  display: grid;
  grid-template-columns: .8fr 1.2fr;
  gap: 26px
}

.tech-copy h3 {
  font-size: 29px;
  margin: 0 0 12px
}

.tech-copy p {
  color: var(--muted)
}

.term {
  background: #151922;
  color: #dce1e9;
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid #2b313c
}

.termbar {
  padding: 11px 14px;
  border-bottom: 1px solid #2d333e;
  color: #969eab;
  font-size: 12px
}

.dt_newsfeed .code {
  padding: 18px;
  white-space: pre-wrap;
  overflow: auto;
  font: 12px/1.8 ui-monospace, SFMono-Regular, Menlo, monospace
}

.c1 {
  color: #9be7d2
}

.c2 {
  color: #ffc36c
}

.c3 {
  color: #c5b5ff
}

.tech-pills {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 20px
}

.tech-pill {
  font-size: 12px;
  border: 1px solid #d9dde3;
  padding: 7px 9px;
  border-radius: 999px;
  color: #596273;
  background: #fff
}

.start-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px
}

.dt_newsfeed .start {
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 20px
}

.num {
  font-size: 12px;
  color: #b96906;
  font-weight: 900;
  letter-spacing: .12em
}

.dt_newsfeed .start h3 {
  font-size: 18px;
  margin: 8px 0
}

.dt_newsfeed .start p {
  font-size: 13px;
  color: var(--muted);
  margin: 0
}

.trial {
  margin-top: 20px;
  background: var(--greenSoft);
  border: 1px solid #cde9dc;
  border-radius: 18px;
  padding: 19px;
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: center
}

.trial b {
  font-size: 18px
}

.trial span {
  color: #526b61;
  font-size: 13px
}

.dt_newsfeed .field {
  width: 100%;
  border: 1px solid #d9dde3;
  border-radius: 12px;
  padding: 12px 13px;
  font-size: 13px;
  margin-bottom: 9px;
}

.dt_newsfeed .textarea {
  min-height: 92px;
  resize: vertical
}

@media(max-width:900px) {
  .hero-grid,
  .workflow,
  .tech-grid {
    grid-template-columns: 1fr
  }

  .hero {
    padding-top: 48px
  }

  .personas,
  .start-grid {
    grid-template-columns: 1fr 1fr
  }

  .band-grid {
    grid-template-columns: repeat(3, 1fr)
  }

  .pain-grid {
    grid-template-columns: 1fr
  }

  .arrow-mid {
    transform: rotate(90deg)
  }

  .section-head {
    display: block
  }

  .section-head p {
    margin-top: 12px
  }
}

@media(max-width:620px) {
  .dt_newsfeed .wrap {
    width: min(100% - 26px, 1180px)
  }

  .hero h1 {
    font-size: 43px
  }

  .personas,
  .start-grid,
  .band-grid {
    grid-template-columns: 1fr
  }

  .band-item {
    border-right: 0 !important;
    border-bottom: 1px solid var(--line)
  }

  .trial {
    display: block
  }

  .dt_newsfeed .trial .btn {
    margin-top: 12px
  }
}

.corporate-inquiry {
  padding: 18px 0 96px;
  background: #fff
}

.corporate-form {
  background: #fff;
  border: 1px solid #eadfce;
  border-radius: 20px;
  padding: 22px
}

.form-title {
  font-weight: 800;
  font-size: 17px;
  margin-bottom: 4px
}

.form-sub {
  color: var(--muted);
  font-size: 12px;
  margin-bottom: 16px
}

.corporate-form label {
  display: block;
  font-size: 12px;
  font-weight: 700;
  color: #4d5560;
  margin: 0 0 6px
}

.dt_newsfeed .corporate-form .field {
  margin-bottom: 13px
}

.dt_newsfeed .corporate-form select.field {
  appearance: auto;
  background: #fff
}

.dt_newsfeed .corporate-form .btn {
  width: 100%;
  justify-content: center;
  margin-top: 2px
}

.corporate-form .privacy {
  font-size: 10.5px;
  line-height: 1.5;
  color: #8b929c;
  margin-top: 10px
}

.corporate-form .privacy a {
  color: inherit
}

@media(max-width:620px) {
  .corporate-inquiry {
    padding-bottom: 68px
  }
}

.dt_newsfeed {
  --dt-orange: #f39800;
  --dt-orange-dark: #d77e00;
  --dt-black: #111;
  --dt-gray: #666;
  --dt-light: #f5f5f5;
  --dt-border: #dedede;
}

.dt_newsfeed {
  font-family: "Roboto", sans-serif;
  color: #111;
  line-height: 1.5
}

.dt_newsfeed .wrap {
  width: min(1200px, calc(100% - 40px))
}

.hero {
  background: #fff;
  padding: 58px 0 42px;
  border-bottom: 1px solid #e7e7e7
}

.eyebrow,
.kicker {
  color: #a65d00
}

.hero h1 {
  font-weight: 800;
  letter-spacing: initial;
  line-height: 1.15;
}

.hero h1 em {
  color: var(--dt-orange)
}

.dt_newsfeed .btn {
  border-radius: 999px
}

.dt_newsfeed .btn.primary {
  background: var(--dt-orange);
  color: #111
}

.dt_newsfeed .btn.ghost {
  border-color: #ccc
}

.band {
  background: #f6f6f6
}

.band-item {
  padding: 20px 24px
}

.band-item strong {
  font-size: 24px
}

.dt_newsfeed section {
  padding: 52px 0
}

.section-head h2 {
  font-weight: 800;
  letter-spacing: initial;
  line-height: 1.15;
}

.persona,
.pain-card,
.dt_newsfeed .start,
.corporate-form {
  border-radius: 4px
}

.demo-shell,
.watchbox,
.workflow-copy,
.workflow-out,
.term {
  border-radius: 6px
}

.corporate-inquiry {
  background: #f5f5f5;
  padding: 72px 0
}

.scope-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin-top: 24px
}

.scope-card {
  border: 1px solid #ddd;
  background: #fff;
  padding: 22px;
  border-radius: 4px
}

.scope-card h3 {
  margin: 0 0 8px;
  font-size: 20px
}

.scope-card p {
  color: #666;
  margin: 0 0 12px;
  font-size: 14px
}

.scope-card ul {
  margin: 0;
  padding-left: 18px;
  color: #555;
  font-size: 13px
}

.scope-note {
  margin-top: 14px;
  border-left: 3px solid var(--dt-orange);
  padding: 10px 14px;
  background: #fff8ee;
  color: #5e5e5e;
  font-size: 13px
}

@media(max-width:760px) {
  .scope-grid {
    grid-template-columns: 1fr
  }
}

.dt_newsfeed .hero .lead {
  max-width: 720px
}

.hero .cta-row {
  margin-top: 28px
}

.dt_newsfeed .btn.primary {
  font-weight: 800;
  box-shadow: 0 6px 18px rgba(243, 152, 0, .18)
}

.sales-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 18px;
  margin-top: 18px;
  color: #555;
  font-size: 13px
}

.sales-strip span {
  display: flex;
  align-items: center;
  gap: 7px
}

.sales-strip i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--dt-orange);
  display: inline-block
}

.dt_newsfeed .start .num {
  color: var(--dt-orange)
}

.trial {
  background: #fff8ee;
  border-color: #f0cf9b
}

.conversion-card {
  display: grid;
  grid-template-columns: 1.15fr .85fr;
  gap: 40px;
  align-items: stretch;
  background: #fff;
  border: 1px solid #ddd;
  padding: 44px
}

.conversion-copy {
  display: flex;
  flex-direction: column;
  justify-content: center
}

.conversion-copy h2 {
  font-size: clamp(36px, 4.2vw, 54px);
  line-height: 1.02;
  letter-spacing: -.045em;
  margin: 0 0 16px
}

.conversion-copy>p {
  font-size: 16px;
  color: #5f5f5f;
  max-width: 690px
}

.value-points {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin: 26px 0
}

.value-point {
  border-top: 3px solid var(--dt-orange);
  background: #f8f8f8;
  padding: 16px
}

.value-point b {
  display: block;
  font-size: 13px;
  margin-bottom: 5px
}

.value-point span {
  font-size: 12px;
  color: #666;
  line-height: 1.45
}

@media(max-width:860px) {
  .conversion-card {
    grid-template-columns: 1fr;
    padding: 30px 22px
  }

  .value-points {
    grid-template-columns: 1fr
  }
}

.dt_newsfeed .btn,
.dt_newsfeed a.btn,
.dt_newsfeed .corporate-form .btn,
.dt_newsfeed .trial .btn {
  border-radius: 999px !important;
  min-height: 44px;
  padding: 11px 24px !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-weight: 800;
  letter-spacing: .01em;
  text-decoration: none;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease;
}

.dt_newsfeed .btn:hover,
.dt_newsfeed a.btn:hover,
.dt_newsfeed .corporate-form .btn:hover,
.dt_newsfeed .trial .btn:hover {
  transform: translateY(-1px);
}

.dt_newsfeed .btn.primary,
.dt_newsfeed .corporate-form .btn.primary {
  background: #f39800 !important;
  color: #111 !important;
  border: 1px solid #f39800 !important;
  box-shadow: 0 7px 18px rgba(243, 152, 0, .22);
}

.dt_newsfeed .btn.primary:hover,
.dt_newsfeed .corporate-form .btn.primary:hover {
  background: #ffa914 !important;
  border-color: #ffa914 !important;
  box-shadow: 0 9px 22px rgba(243, 152, 0, .28);
}

.dt_newsfeed .btn.ghost {
  background: #fff !important;
  color: #222 !important;
  border: 1px solid #bdbdbd !important;
  box-shadow: none !important;
}

.dt_newsfeed .btn.ghost:hover {
  border-color: #777 !important;
  background: #f7f7f7 !important;
}

.dt_newsfeed .btn.dark,
.dt_newsfeed .trial .btn.dark {
  background: #171717 !important;
  color: #fff !important;
  border: 1px solid #171717 !important;
}

.dt_newsfeed .btn.dark:hover,
.dt_newsfeed .trial .btn.dark:hover {
  background: #333 !important;
  border-color: #333 !important;
}

.conversion-card {
  grid-template-columns: minmax(0, 1.08fr) minmax(340px, .92fr);
  align-items: center;
}

.sales-form {
  background: #fff;
  border: 1px solid #dedede;
  padding: 26px;
  border-radius: 18px;
  box-shadow: 0 12px 36px rgba(17, 19, 24, .06);
}

.sales-form .form-title {
  font-size: 20px;
  line-height: 1.25;
  font-weight: 800;
  margin-bottom: 5px;
}

.sales-form .form-sub {
  font-size: 12px;
  line-height: 1.5;
  color: #777;
  margin-bottom: 18px;
}

.sales-form label {
  display: block;
  margin: 0 0 6px;
  font-size: 12px;
  line-height: 1.4;
  font-weight: 700;
  color: #444;
}

.dt_newsfeed .sales-form .field {
  width: 100%;
  min-height: 44px;
  border: 1px solid #d8d8d8;
  border-radius: 11px;
  background: #fff;
  color: #171717;
  padding: 10px 12px;
  margin-bottom: 13px;
  font: inherit;
  font-size: 14px;
  line-height: 1.45;
  outline: none;
  transition: border-color .18s ease, box-shadow .18s ease;
}

.dt_newsfeed .sales-form .textarea {
  min-height: 88px;
  resize: vertical;
}

.dt_newsfeed .sales-form .field:focus {
  border-color: #f39800;
  box-shadow: 0 0 0 3px rgba(243, 152, 0, .10);
}

.dt_newsfeed .sales-form .btn {
  width: 100%;
  margin-top: 2px;
}

.sales-form .privacy {
  margin-top: 9px;
  font-size: 10.5px;
  line-height: 1.45;
  color: #999;
  text-align: center;
}

@media(max-width:900px) {
  .conversion-card {
    grid-template-columns: 1fr
  }
}

.dt_newsfeed_nav {
  position: fixed;
  right: 22px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 95;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding: 12px 9px;
  background: rgba(255, 255, 255, .92);
  border: 1px solid #e3e3e3;
  border-radius: 999px;
  box-shadow: 0 12px 36px rgba(17, 24, 39, .10);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.dt_newsfeed_nav .section-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  display: block;
  background: #cfd3d8;
  transition: transform .2s ease, background-color .2s ease, box-shadow .2s ease;
  cursor: pointer;
  position: relative;
}

.dt_newsfeed_nav .section-dot span {
  position: absolute;
  inset: 0;
  border-radius: inherit;
}

.dt_newsfeed_nav .section-dot:hover {
  background: #aeb4bc;
  transform: scale(1.15);
}

.dt_newsfeed_nav .section-dot.active {
  background: var(--dt-orange, #f39800);
  transform: scale(1.28);
  box-shadow: 0 0 0 4px rgba(243, 152, 0, .12);
}

@media(prefers-reduced-motion:reduce) {
  .dt_newsfeed_nav .section-dot {
    transition: none
  }
}

@media(max-width:1000px) {
  .dt_newsfeed_nav {
    display: none;
  }
}

.dt_newsfeed section[id] > .wrap {
  scroll-margin-top: 82px;
}

.scope-card ul {
  list-style: disc;
}