简化首页介绍区域

assets/css/components.css

@@ -136,81 +136,6 @@
   box-shadow: 0 0 0 6px rgba(25, 185, 130, 0.13);
 }
 
-.hero-visual {
-  position: relative;
-  min-height: 460px;
-  overflow: hidden;
-  background: var(--panel);
-  border: 1px solid rgba(222, 232, 248, 0.9);
-  border-radius: 28px;
-  box-shadow: var(--shadow);
-}
-
-.hero-visual::after {
-  position: absolute;
-  inset: 0;
-  background:
-    linear-gradient(90deg, rgba(9, 34, 74, 0.38), rgba(9, 34, 74, 0.02) 58%),
-    linear-gradient(180deg, transparent 48%, rgba(6, 24, 56, 0.42));
-  content: "";
-}
-
-.hero-visual img {
-  width: 100%;
-  height: 100%;
-  min-height: 460px;
-  object-fit: cover;
-}
-
-.visual-overlay {
-  position: absolute;
-  right: 24px;
-  bottom: 24px;
-  left: 24px;
-  z-index: 1;
-  padding: 20px;
-  color: #fff;
-  background: rgba(17, 35, 66, 0.68);
-  border: 1px solid rgba(255, 255, 255, 0.24);
-  border-radius: 20px;
-  box-shadow: 0 24px 54px rgba(10, 31, 68, 0.24);
-  backdrop-filter: blur(18px);
-}
-
-.overlay-heading {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: 16px;
-  margin-bottom: 16px;
-  color: rgba(255, 255, 255, 0.82);
-  font-weight: 780;
-}
-
-.overlay-heading strong {
-  color: #48f0aa;
-}
-
-.overlay-grid {
-  display: grid;
-  grid-template-columns: repeat(5, minmax(0, 1fr));
-  gap: 10px;
-}
-
-.overlay-grid span {
-  display: inline-flex;
-  min-height: 36px;
-  align-items: center;
-  justify-content: center;
-  padding: 0 10px;
-  color: rgba(255, 255, 255, 0.92);
-  background: rgba(255, 255, 255, 0.14);
-  border: 1px solid rgba(255, 255, 255, 0.16);
-  border-radius: 10px;
-  font-size: 0.84rem;
-  font-weight: 800;
-}
-
 .section-note {
   max-width: 420px;
   margin-bottom: 0;
@@ -310,11 +235,6 @@
 }
 
 @media (max-width: 960px) {
-  .hero-visual,
-  .hero-visual img {
-    min-height: 390px;
-  }
-
   .section-note {
     text-align: left;
   }
@@ -331,30 +251,6 @@
     border-radius: 14px;
   }
 
-  .hero-visual {
-    min-height: auto;
-    border-radius: 22px;
-  }
-
-  .hero-visual img {
-    min-height: 360px;
-  }
-
-  .visual-overlay {
-    right: 14px;
-    bottom: 14px;
-    left: 14px;
-    padding: 16px;
-  }
-
-  .overlay-grid {
-    grid-template-columns: repeat(2, minmax(0, 1fr));
-  }
-
-  .overlay-grid span {
-    min-height: 34px;
-  }
-
   .service-card,
   .service-card img {
     min-height: 230px;

assets/css/layout.css

@@ -31,12 +31,8 @@
 }
 
 .hero {
-  display: grid;
+  min-height: auto;
-  grid-template-columns: minmax(0, 0.95fr) minmax(360px, 1.05fr);
+  padding: clamp(64px, 12vh, 128px) 0 56px;
-  gap: clamp(34px, 6vw, 84px);
-  align-items: center;
-  min-height: calc(100svh - 72px);
-  padding: 54px 0 74px;
 }
 
 .services-section {
@@ -81,11 +77,6 @@
     display: none;
   }
 
-  .hero {
-    grid-template-columns: 1fr;
-    min-height: auto;
-  }
-
   .services {
     grid-template-columns: repeat(2, minmax(0, 1fr));
   }
@@ -108,10 +99,6 @@
     min-height: 64px;
   }
 
-  h1 {
-    font-size: clamp(2.55rem, 13vw, 4rem);
-  }
-
   .services {
     grid-template-columns: 1fr;
   }

index.html

@@ -26,10 +26,9 @@
     </header>
 
     <main>
-      <section class="hero" aria-labelledby="site-title">
+      <section class="hero" aria-label="sumi.work 服务入口介绍">
         <div class="hero-copy">
           <p class="eyebrow">Private Service Gateway</p>
-          <h1 id="site-title">一个更清爽的 sumi.work 服务入口</h1>
           <p class="subtitle">
             聚合常用内部服务与外部应用，保持入口清晰、状态明确、访问路径简单。
           </p>
@@ -45,23 +44,6 @@
             <span>安全连接 · 在线</span>
           </div>
         </div>
-
-        <aside class="hero-visual" aria-label="服务概览">
-          <img src="assets/images/workspace-hero.jpg" alt="王者荣耀角色壁纸风格的游戏视觉" />
-          <div class="visual-overlay">
-            <div class="overlay-heading">
-              <span>Service Gateway</span>
-              <strong>Online</strong>
-            </div>
-            <div class="overlay-grid" aria-label="可用服务">
-              <span>FRP</span>
-              <span>Git</span>
-              <span>Sync</span>
-              <span>Gemini</span>
-              <span>DeepSeek</span>
-            </div>
-          </div>
-        </aside>
       </section>
 
       <section class="services-section" id="services" aria-labelledby="services-title">