.dhero{position:relative;overflow:hidden;padding-block:var(--s8) var(--section);
  min-height:min(74vh,720px);display:flex;align-items:center}
.dhero .wrap{width:100%}
.dhero .inner{max-width:680px;position:relative;z-index:3}
.dhero-flip .inner{margin-left:auto;padding:26px 28px;margin-inline-end:-28px;border-radius:16px;
  background:radial-gradient(120% 130% at 62% 45%,var(--bg) 40%,transparent 78%)}
.dhero-flip .neural{right:auto;left:0;
  -webkit-mask-image:radial-gradient(80% 86% at 38% 52%,#000 42%,transparent 88%);
  mask-image:radial-gradient(80% 86% at 38% 52%,#000 42%,transparent 88%)}
.dlabel{display:inline-flex;align-items:center;gap:9px;font-family:var(--mono);font-size:.6875rem;
  text-transform:uppercase;letter-spacing:.1em;color:var(--accent);background:var(--accent-soft);
  border:1px solid var(--accent-line);border-radius:var(--r-xs);padding:5px 11px;margin-bottom:var(--s5)}
.dhero h1{max-width:16ch;letter-spacing:-.032em}
.dhero .lead{max-width:56ch;margin-top:var(--s5)}
.crumb{font-family:var(--mono);font-size:.6875rem;text-transform:uppercase;letter-spacing:.09em;
  color:var(--ink-subtle);margin-bottom:var(--s4)}
.crumb a{color:var(--ink-subtle)} .crumb a:hover{color:var(--ink)}
.unitrow{display:grid;grid-template-columns:.8fr 1.2fr;gap:var(--s8);align-items:start}
.klist{display:grid;gap:var(--s3);margin-top:var(--s5)}
.klist div{display:flex;gap:12px;align-items:flex-start;font-size:.9375rem;color:var(--ink-muted)}
.klist b{flex:none;font-family:var(--mono);font-size:.6875rem;color:var(--accent);
  letter-spacing:.08em;padding-top:3px;min-width:22px}
.props{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s3);margin-top:var(--s6)}
.props div{border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--s5);background:var(--bg-raised)}
.props b{display:block;font-size:1.375rem;font-weight:600;letter-spacing:-.03em}
.props span{display:block;font-family:var(--mono);font-size:.625rem;text-transform:uppercase;
  letter-spacing:.09em;color:var(--ink-subtle);margin-top:6px;line-height:1.5}
.portfolio{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s3);margin-top:var(--s6)}
.site{border:1px solid var(--line);border-radius:var(--r-lg);background:var(--bg-raised);overflow:hidden}
.site .bar{display:flex;gap:4px;padding:8px 10px;background:var(--bg-sunken);border-bottom:1px solid var(--line)}
.site .bar i{width:6px;height:6px;border-radius:50%;background:var(--line-strong)}
.site .body{padding:var(--s4)}
.site .t{height:7px;border-radius:3px;background:var(--brand);opacity:.75;width:62%}
.site .l{height:5px;border-radius:3px;background:var(--line);margin-top:7px}
.site .l:nth-of-type(3){width:86%} .site .l:nth-of-type(4){width:70%}
.site .cap{font-family:var(--mono);font-size:.5625rem;text-transform:uppercase;letter-spacing:.09em;
  color:var(--ink-subtle);margin-top:10px;text-align:left}
@media(max-width:900px){.unitrow{grid-template-columns:1fr;gap:var(--s6)}
  .props,.portfolio{grid-template-columns:1fr 1fr}}

/* Service directory: readable cards with the Media division's green accent. */
.media-services{border-top:1px solid var(--line)}
.services-heading{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:end}
.services-heading h2{max-width:19ch}
.services-heading .lead{max-width:48ch}
.services-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:36px}
.service-card{min-width:0;padding:26px;border:1px solid var(--line);border-radius:var(--r-lg);
  background:linear-gradient(150deg,var(--accent-soft),var(--bg-raised) 46%)}
.service-number{display:block;font-family:var(--mono);font-size:.6875rem;letter-spacing:.08em;
  text-transform:uppercase;color:var(--brand);margin-bottom:20px}
.service-card h3{font-size:1.125rem;line-height:1.35;letter-spacing:-.02em}
.service-card ul{margin:18px 0 0;padding-left:18px;color:var(--ink-muted);font-size:.9375rem;line-height:1.6}
.service-card li+li{margin-top:12px}
.service-card li::marker{color:var(--brand)}
.services-contact{margin-top:28px;max-width:100%;white-space:normal;text-align:center}
@media(max-width:1000px){.services-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){
  .services-heading{grid-template-columns:1fr;gap:18px}
  .services-grid{grid-template-columns:minmax(0,1fr);gap:14px;margin-top:26px}
  .service-card{padding:22px}
  .service-number{margin-bottom:12px}
}