@charset "UTF-8";
/* ============================================================
   LIM v2 — base.css
   役割：CSS 変数（tokens）/ リセット / 基本タイポ / 共通 @keyframes
   配色：E2（純白 #ffffff + 純黒 #000000 + 朱 #b54040）
   書体：Manrope（英）+ Noto Sans JP（和）
   ============================================================ */

/* ============================================================
   1. CSS TOKENS（CSS 変数）
   - 変更時はここを修正してサイト全体に反映
   ============================================================ */
:root {

  /* -------- Color tokens -------- */
  --color-bg:        #ffffff;             /* 純白・ベース */
  --color-text:      #000000;             /* 純黒・主テキスト */
  --color-accent:    #b54040;             /* 朱・アクセント 1〜2 点 */
  --color-sub:       #888888;             /* サブグレー */
  --color-light:     #f5f5f5;             /* 微背景 */
  --color-rule:      rgba(0, 0, 0, 0.12); /* 罫線 */
  --color-rule-2:    rgba(0, 0, 0, 0.18); /* 罫線・濃 */

  /* -------- Type tokens -------- */
  --ff-en:           "Manrope", system-ui, sans-serif;
  --ff-jp:           "Noto Sans JP", system-ui, sans-serif;

  /* -------- Spacing tokens -------- */
  --gap-section:     clamp(80px, 12vw, 180px);   /* セクション間 */
  --gap-block:       clamp(40px, 6vw, 80px);     /* ブロック間 */
  --pad-x:           5vw;                        /* 水平パディング */

  /* -------- Motion tokens -------- */
  --ease-out:        cubic-bezier(0.16, 1, 0.3, 1);
  --ease-quint:      cubic-bezier(0.83, 0, 0.17, 1);
  --ease-quad:       cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* ============================================================
   2. RESET（最小限）
   ============================================================ */
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
}

body {
  background: var(--color-bg);
  color: var(--color-text);
  font-family: var(--ff-jp);
  font-weight: 400;
  line-height: 1.85;
  letter-spacing: 0.04em;

  /* W-2 日本語 CSS 規律 */
  word-break: auto-phrase;
  line-break: strict;

  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}

img, video, picture {
  display: block;
  max-width: 100%;
  height: auto;
}

a {
  color: inherit;
  text-decoration: none;
  transition: color .3s;
}

/* iOS Safari リンク色対策（W-4 規律）*/
a, a:visited {
  -webkit-text-fill-color: currentColor;
}

button {
  background: none;
  border: none;
  cursor: pointer;
  color: inherit;
  font: inherit;
}

::selection {
  background: var(--color-accent);
  color: var(--color-bg);
}

/* W-2 日本語改行：意味の塊を割らせない（句点・短い塊を nowrap）
   feedback_japanese_line_break_rules 準拠 */
.nobreak {
  white-space: nowrap;
}

/* ============================================================
   3. 共通 @keyframes
   ============================================================ */

/* FV 映像 ken-burns loop */
@keyframes hero-kenburns {
  0%   {
    transform: scale(1.0) translate3d(0, 0, 0);
    filter: grayscale(100%) contrast(1.45) brightness(0.42);
  }
  100% {
    transform: scale(1.18) translate3d(-3%, -2%, 0);
    filter: grayscale(100%) contrast(1.55) brightness(0.5);
  }
}

/* fade up */
@keyframes fade-up {
  0%   { opacity: 0; transform: translateY(20px); }
  100% { opacity: 1; transform: translateY(0); }
}

/* text-in（H1 用 blur 解除）*/
@keyframes text-in {
  0%   { opacity: 0; transform: translateY(30px); filter: blur(4px); }
  100% { opacity: 1; transform: translateY(0); filter: blur(0); }
}

/* ============================================================
   4. prefers-reduced-motion
   - 動きを停止して poster 画像 fallback
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}
