練習室後台

sechskies-admin-hw/css/style.css

@@ -136,10 +136,10 @@ body::after {
   color: #fff;
 }
 
-/* ============ 主視覺 ============ */
+/* ============ 主視覺（嵌入影片背景，尺寸依影片比例） ============ */
 .sk-hero {
-  background: linear-gradient(180deg, rgba(180, 184, 191, 0.14) 0%, transparent 100%);
   border-bottom: 1px solid var(--sk-border);
+  overflow: hidden;
 }
 
 .sk-hero h1 {
@@ -155,6 +155,39 @@ body::after {
   border-radius: 2px;
 }
 
+.sk-hero-video-frame {
+  position: relative;
+  width: 100%;
+  aspect-ratio: 16 / 9;
+  background: #000;
+}
+
+.sk-hero-video-frame iframe {
+  position: absolute;
+  inset: 0;
+  width: 100%;
+  height: 100%;
+  border: 0;
+  pointer-events: none;
+}
+
+.sk-hero-overlay {
+  position: absolute;
+  inset: 0;
+  background: linear-gradient(180deg, rgba(10, 10, 10, 0.35) 0%, rgba(10, 10, 10, 0.8) 100%);
+}
+
+.sk-hero-content {
+  position: relative;
+  z-index: 2;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 1rem;
+}
+
 /* ============ 區塊標題 ============ */
 .sk-section-title {
   color: var(--sk-text);