/**
 * StarkLab Base CSS — 基礎覆蓋層
 *
 * 版本：1.0.0
 * 日期：2026-05-02
 * 用途：修正第三方框架衝突 + 全局基礎規則
 *
 * 載入順序要求（重要）：
 * - 本檔案必須在 responsee.css 和 template-style.css 之後載入
 * - 本檔案依賴 tokens.css 提供的 CSS 變數
 */

/* Google Fonts — 品牌字型載入 */
@import url("https://fonts.googleapis.com/css?family=Noto+Sans+TC:500,700,600,400|Noto+Sans:500,700,800,400|Space+Grotesk:500,400");

/* Meyer CSS Reset — 原 globals.css 有引入，確保 h1/h2/p 等無預設 margin/padding */
/* 只重設會影響定位的常見元素，避免破壞第三方框架 */
h1, h2, h3, h4, h5, h6 {
  margin: 0;
  padding: 0;
  font-size: inherit;
  font-weight: inherit;
}

p {
  margin: 0;
  padding: 0;
}


/* ============================================
 * OVERRIDE LAYER — 修正第三方框架衝突
 * 此區塊必須在 responsee.css 和 template-style.css 之後載入才生效
 * ============================================ */

/* 修正衝突 2：responsee.css body { color: #ffffff } 造成淺背景文字不可見 */
body {
  color: var(--color-text-primary, #191a23);
}

/* 修正衝突 6：template-style.css 強制所有標題用 Playfair Display */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: inherit;
}


/* ============================================
 * GLOBAL BASE RULES — 全局基礎規則
 * ============================================ */

/* 全局 box-sizing（globals.css 已有，base.css 明確聲明確保優先） */
*, *::before, *::after {
  box-sizing: border-box;
}


/* ============================================
 * GLOBAL UTILITIES — 從 globals.css 遷移（第 3 批）
 * globals.css 模板已不再載入，utility 類別集中於此
 * ============================================ */

.screen a {
  display: contents;
  text-decoration: none;
}

.container-center-horizontal {
  display: flex;
  flex-direction: row;
  justify-content: center;
  pointer-events: none;
  width: 100%;
}

.container-center-horizontal > * {
  flex-shrink: 0;
  pointer-events: auto;
}

.valign-text-middle {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.logo-1 {
  height: 76px;
  position: relative;
  width: 126px;
}

/* ============================================
 * GLOBAL IMAGE UTILITIES — 從 globals.css 遷移（漏補項）
 * 這些 class 是首頁專案區塊圖片的尺寸定義
 * ============================================ */

/* 首頁 Project 區塊：ETF 卡片縮圖 */
.rectangle-79 {
  height: 244px;
  width: 244px;
}

/* 首頁 Project 區塊：AI 學習歷程平台縮圖 */
.x1-2 {
  height: 245px;
  width: 240px;
}

/* 首頁 Project 區塊：連結按鈕箭頭 icon */
.arrow-3 {
  height: 20px;
  width: 19px;
}


/* ============================================
 * TYPOGRAPHY UTILITIES — 從 styleguide.css 遷移
 * 原 styleguide.css 刪除後，這些 utility class 集中於此
 * 所有模板均載入 base.css，故此處定義可全站共用
 * ============================================ */

.notosanstc-semi-bold-black-20px {
  color: var(--black);
  font-family: var(--font-family-noto_sans_tc);
  font-size: var(--font-size-l);
  font-style: normal;
  font-weight: 600;
}

.spacegrotesk-medium-black-20px {
  color: var(--black);
  font-family: var(--font-family-space_grotesk);
  font-size: var(--font-size-l);
  font-style: normal;
  font-weight: 500;
}

.spacegrotesk-normal-black-18px {
  color: var(--black);
  font-family: var(--font-family-space_grotesk);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 400;
}

.notosanstc-normal-black-18px {
  color: var(--black);
  font-family: var(--font-family-noto_sans_tc);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 400;
}

.notosanstc-normal-black-24px {
  color: var(--black);
  font-family: var(--font-family-noto_sans_tc);
  font-size: var(--font-size-xl);
  font-style: normal;
  font-weight: 400;
}

.notosanstc-medium-white-30px {
  color: var(--white);
  font-family: var(--font-family-noto_sans_tc);
  font-size: var(--font-size-xxl);
  font-style: normal;
  font-weight: 500;
}

.notosanstc-bold-navy-blue-20px {
  color: var(--navy-blue);
  font-family: var(--font-family-noto_sans_tc);
  font-size: var(--font-size-l);
  font-style: normal;
  font-weight: 700;
}

.notosanstc-bold-navy-blue-36px {
  color: var(--navy-blue);
  font-family: var(--font-family-noto_sans_tc);
  font-size: var(--font-size-xxxxl);
  font-style: normal;
  font-weight: 700;
}

.notosanstc-normal-white-18px {
  color: var(--white);
  font-family: var(--font-family-noto_sans_tc);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 400;
}

.notosans-bold-navy-blue-20px {
  color: var(--navy-blue);
  font-family: var(--font-family-noto_sans);
  font-size: var(--font-size-l);
  font-style: normal;
  font-weight: 700;
}

.notosans-normal-white-18px {
  color: var(--white);
  font-family: var(--font-family-noto_sans);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 400;
}

.notosanstc-bold-white-20px {
  color: var(--white);
  font-family: var(--font-family-noto_sans_tc);
  font-size: var(--font-size-l);
  font-style: normal;
  font-weight: 700;
}

.spacegrotesk-medium-white-36px {
  color: var(--white);
  font-family: var(--font-family-space_grotesk);
  font-size: var(--font-size-xxxxl);
  font-style: normal;
  font-weight: 500;
}

.notosans-bold-white-32px {
  color: var(--white);
  font-family: var(--font-family-noto_sans);
  font-size: var(--font-size-xxxl);
  font-style: normal;
  font-weight: 700;
}

.notosans-bold-navy-blue-60px {
  color: var(--navy-blue);
  font-family: var(--font-family-noto_sans);
  font-size: 60px;
  font-style: normal;
  font-weight: 700;
}

.notosanstc-bold-navy-blue-30px {
  color: var(--navy-blue);
  font-family: var(--font-family-noto_sans_tc);
  font-size: var(--font-size-xxl);
  font-style: normal;
  font-weight: 700;
}

/* 補充：member / project 頁用到的額外 class */
.notosanstc-normal {
  font-family: var(--font-family-noto_sans_tc);
  font-style: normal;
  font-weight: 400;
}

.spacegrotesk-medium-white-20px {
  color: var(--white);
  font-family: var(--font-family-space_grotesk);
  font-size: var(--font-size-l);
  font-style: normal;
  font-weight: 500;
}

.notosanstc-medium-navy-blue-20px {
  color: var(--navy-blue);
  font-family: var(--font-family-noto_sans_tc);
  font-size: var(--font-size-l);
  font-style: normal;
  font-weight: 500;
}