/* =========================================================
   VIB CSS Architecture - メインエントリーファイル
   
   ITCSS方法論に基づいた模块化CSS架構
   
   作成者：曹 小帥（SOU）
   最終更新：2025-11-02
   バージョン：v2.0（模块化重构版）
   ========================================================= */

/* =========================================================
   1. Core - 核心基础
   变量、重置、动画等基础样式
   ========================================================= */
@import url("./core/variables.css");
@import url("./core/reset.css");
@import url("./core/animations.css");

/* =========================================================
   2. Layout - 布局结构
   整体布局、侧边栏、header、footer
   ========================================================= */
@import url("./layout/content.css");
@import url("./layout/sidebar.css");
@import url("./layout/hamburger.css");
@import url("./layout/overlay.css");
@import url("./footer.css");

/* =========================================================
   3. Components - UI组件
   可复用的UI组件
   ========================================================= */
@import url("./components/buttons.css");
@import url("./components/cards.css");
@import url("./components/scrollbar.css");
@import url("./components/back-to-top.css");
@import url("./components/skip-link.css");
@import url("./components/skeleton.css");
@import url("./components/video.css");

/* =========================================================
   4. Sections - 页面区块
   各个section的特定样式
   ========================================================= */
@import url("./sections/section-base.css");
@import url("./sections/hero.css");
@import url("./sections/about.css");
@import url("./sections/features.css");
@import url("./sections/features-showcase.css");
@import url("./sections/usecase.css");
@import url("./sections/inline-styles.css");
@import url("./sections/plans.css");
@import url("./sections/vision.css");
@import url("./sections/news.css");
@import url("./sections/faq.css");
@import url("./sections/contact.css");
@import url("./sections/tech-icons.css");

/* =========================================================
   5. Utilities - 工具类（可选）
   单一功能的工具类
   ========================================================= */

/* ===== Decoration Elements ===== */
.section-decoration {
  position: absolute;
  width: 200px;
  height: 200px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 204, 0, 0.15) 0%, transparent 70%);
  pointer-events: none;
  z-index: 0;
}

/* ===== Text Gradient ===== */
.text-gradient {
  background: linear-gradient(135deg, var(--yellow) 0%, var(--yellow-dark) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* ===== Accessibility Helpers ===== */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* =========================================================
   架构说明
   
   目录结构:
   css/
   ├── main.css (このファイル)
   ├── core/ .......... 核心基础
   ├── layout/ ........ 布局结构
   ├── components/ .... UI组件
   ├── sections/ ...... 页面区块
   └── footer.css ..... Footer样式
   
   命名规范:
   - BEM方法论: .block__element--modifier
   - 使用CSS变量统一管理设计系统
   - 按功能模块组织代码
   
   维护指南:
   - 新增组件: components/
   - 新增section: sections/
   - 修改变量: core/variables.css
   - 全局样式: core/reset.css
   ========================================================= */
