/* DispatchEngine: a lighter, plainer sibling of the studio theme.
   Same type, header/footer structure, button shapes and spacing; light throughout,
   one accent (safety orange), solid headings, fewer cards. Scoped to body.de. */
body.de{
  --de-accent:#C2410C;      /* buttons, links, rules: 5.2:1 on white */
  --de-accent-dk:#9A3412;
  --de-tint:#FFF3EB;
  --de-ink:#14171C;
  --de-muted:#4B5563;
  --de-line:#E2E0DA;
  --de-panel:#F1F0EC;
  background:#FFFFFF;color:var(--de-ink)
}
.de h1,.de h2,.de h3{color:var(--de-ink)}
.de h1{font-size:clamp(36px,5.6vw,58px)}
.de a{color:inherit}

/* header: white bar, product mark in ink, "by Appsterpiece" as a visible tag */
.de .de-top{background:#fff;border-bottom:1px solid var(--de-line)}
.de header.top{border-bottom:1px solid var(--de-line)}
.de header.top .product-mark{color:var(--de-ink)}
.de header.top .by{color:var(--de-ink);font-weight:600;background:var(--de-panel);border:1px solid var(--de-line);border-radius:6px;padding:3px 8px;font-size:12.5px}
.de header.top .by:hover{color:var(--de-accent);text-decoration:none;border-color:var(--de-accent)}
.de header.top nav a{color:var(--de-muted)}
.de header.top nav a:hover{color:var(--de-ink)}
.de header.top nav a.pill{color:#fff;background:var(--de-accent);border-color:var(--de-accent);border-radius:999px}
.de header.top nav a.pill:hover{background:var(--de-accent-dk);border-color:var(--de-accent-dk)}
@media (max-width:480px){.de header.top .by{padding:2px 7px;margin-left:33px}}

/* hero: light, no glow, no gradient text */
.de .hero{padding:36px 0 56px}
.de .kicker{color:var(--de-accent)}
.de .kicker::before{background:var(--de-accent);border-radius:2px}
.de .lede{color:var(--de-muted)}
.de .callline,.de .dark .callline{color:var(--de-muted)}
.de .callline a{color:var(--de-ink);font-weight:600}
.de .trust{color:var(--de-muted)}
.de .trust li::before{background:var(--de-accent);border-radius:1px}
.de .factline{color:var(--de-muted);border-left:3px solid var(--de-accent);padding-left:12px}
.de .hero .shot .badge{box-shadow:0 10px 26px rgba(20,23,28,.16);border:1px solid var(--de-line)}
.de .hero .shot .badge i{background:var(--de-tint)}
.de .hero .shot .badge svg{stroke:var(--de-accent)}
.de .caption{color:var(--de-muted)}
.de .phone{box-shadow:0 18px 40px rgba(20,23,28,.22)}

/* buttons: same shapes, one accent */
.de .btn.go,.de .btn.solid{background:var(--de-accent);color:#fff}
.de .btn.go:hover,.de .btn.solid:hover{background:var(--de-accent-dk)}
.de .btn.line,.de .btn.outline{color:var(--de-ink);border-color:var(--de-ink);background:transparent}
.de .btn.line:hover,.de .btn.outline:hover{background:var(--de-panel)}

/* sections: tighter, ruled, fewer cards */
.de section.pad{padding:64px 0;border-top:1px solid var(--de-line)}
.de main>section.pad:first-child{border-top:0}
.de .sec-head{margin-bottom:28px}
.de .sec-head p{color:var(--de-muted)}
.de .card{box-shadow:none;border-color:var(--de-line);border-radius:12px}

/* three points: plain columns with an accent rule, not cards */
.de .feats{gap:0}
.de .feat{background:none;border:0;border-top:3px solid var(--de-ink);border-radius:0;padding:20px 0 0}
.de .feat .ico{width:auto;height:auto;background:none!important;margin-bottom:10px;justify-content:start}
.de .feat .ico svg{stroke:var(--de-accent)}
.de .feat p{color:var(--de-muted)}
@media (min-width:860px){.de .feats{gap:36px}}
@media (max-width:859px){.de .feat+.feat{margin-top:22px}}

/* screens: a light panel instead of the dark showcase */
.de .showcase{background:var(--de-panel);border:1px solid var(--de-line);border-radius:16px;color:var(--de-ink)}
.de .showcase::before,.de .showcase::after{display:none}
.de .console .browser{border-color:var(--de-line);box-shadow:0 14px 36px rgba(20,23,28,.14)}
.de .console figcaption,.de .screen p,.de .swipe-hint{color:var(--de-muted)}
.de .console figcaption b,.de .screen h3{color:var(--de-ink)}
.de .who-for,.de .screen .who-for,.de .console .who-for{color:var(--de-accent-dk);background:var(--de-tint);border:1px solid #F7D3BD}
.de .midcta{box-shadow:none;border-color:var(--de-line);border-left:4px solid var(--de-accent);border-radius:8px}
.de .midcta p{color:var(--de-muted)}

/* feature groups: clean lists beside their screenshot */
.de .tour{gap:0}
.de .group{background:none;border:0;border-top:1px solid var(--de-line);border-radius:0;box-shadow:none;padding:36px 0}
.de .group:first-child{border-top:0;padding-top:8px}
.de .g-tag{color:var(--de-accent-dk);background:var(--de-tint);border-radius:4px;font-size:12.5px;letter-spacing:.02em}
.de .g-list li{color:var(--de-muted)}
.de .g-list li::before{background:var(--de-accent);border-radius:1px;width:6px;height:6px}
.de .g-list b{color:var(--de-ink)}
.de .g-media{background:var(--de-panel);border:1px solid var(--de-line);border-radius:12px}
.de .g-media figcaption{color:var(--de-muted)}
.de .browser{box-shadow:0 8px 22px rgba(20,23,28,.10);border-color:var(--de-line)}
.de .custom{background:var(--de-tint);border-color:#F7D3BD;box-shadow:none}
.de .custom p{color:var(--de-muted)}
@media (min-width:860px){.de .group{padding:44px 0}.de .group.g-wide .g-media{padding:24px}}

/* FAQ */
.de .faq details{border-color:var(--de-line);border-radius:8px}
.de .faq summary::after{color:var(--de-accent)}
.de .faq p{color:var(--de-muted)}

/* who built it: prominent, plain */
.de .who{padding:0 0 64px}
.de .who .card{border:1px solid var(--de-line);border-left:4px solid var(--de-accent);border-radius:10px;background:#fff}
.de .avatar{background:var(--de-ink)}
.de .who .muted{color:var(--de-muted)}

/* closing call to action and footer: light */
.de .de-bottom{background:var(--de-panel);border-top:1px solid var(--de-line)}
.de .final{padding:64px 0 72px}
.de .final .lede{color:var(--de-muted)}
.de .final .callline{color:var(--de-muted)}
.de .final .callline a{color:var(--de-ink)}
.de footer.foot{background:transparent;color:var(--de-muted)}
.de footer.foot .wrap{border-top:1px solid var(--de-line)}
.de footer.foot a{color:var(--de-ink)}

/* sticky text/call bar on phones */
.de .sticky{background:rgba(255,255,255,.96);border-top:1px solid var(--de-line)}
.de .group.g-phone .g-media{padding:20px 16px 0;gap:16px}
.de .group.g-phone .g-media figcaption{padding:0 8px}
.de .group.g-phone .g-media{align-items:center;justify-content:flex-start}
