improve domain frame page and rename stack into steps

template.typ

@@ -250,7 +250,7 @@
   )
 ]
 
-#let stack(..layers) = context {
+#let steps(..layers) = context {
   let cp = color-palette.get()
   let radius = 12pt
   let gutter = 12pt
@@ -454,12 +454,20 @@
 ]
 
 // Domain frame template function
-#let domain_frame(title: "", bg_img_path: none, font_color: color-ink, chrome_color: color-ink-helper, content) = page(
-  background: place(
-    center + horizon,
-    if bg_img_path != none {
-      image(bg_img_path, width: 100.5%, height: 100.5%, fit: "cover")
-    },
+#let domain_frame(
+  title: "",
+  bg_img_path: none,
+  cover_color: white.transparentize(50%),
+  font_color: color-ink,
+  chrome_color: color-ink-helper,
+  content,
+) = page(
+  background: stack(
+    image(bg_img_path, width: 100.5%, height: 100.5%, fit: "cover"),
+    move(
+      dy: -50%,
+      rect(width: 100.5%, height: 100.5%, fill: cover_color),
+    ),
   ),
   header: header_template(font_color: chrome_color),
   footer: footer_template(font_color: chrome_color),