/*
 Theme Name: Nephilim
 Theme URI: https://example.com/nephilim
 Author: （あなたの名前）
 Author URI: https://example.com
 Description: フルスクラッチで構築する WordPress テーマ「Nephilim」。
 Version: 1.0.0
 License: GNU General Public License v2 or later
 License URI: https://www.gnu.org/licenses/gpl-2.0.html
 Text Domain: nephilim
 Tags: custom-theme, full-scratch, blog, minimal, responsive
*/

/*
  2022/12/12 確認

  ■ このシート（style.css）の役割
  - テーマヘッダ（WordPressがテーマとして認識するために必須）
  - サイト全体に共通する「基礎（グローバル）スタイル」のみを定義する
    例：bodyの基礎、全体コンテナ幅、全ページ共通の装飾（hr など）

  ■ 方針
  - 画面/機能に依存するスタイル（landing等）は assets/css/landing/ などへ分離する
  - ここは“全体に必ず効くものだけ”を置く
*/


/* =========================================
   Accessibility: Screen Reader Text
   ====================================== */
.screen-reader-text{
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}


/* =========================================
   Global: Base (全体ベース)
   ========================================= */
body {
    margin: 0;
    padding: 0;
    font-family: sans-serif;
    line-height: 1.6;
  background-image: url("assets/images/wood.png");
  background-repeat: repeat;
  background-position: top left;
}


/* =========================================
   Global: Layout (全体レイアウト)
   ========================================= */

/* ヘッダー/フッターの共通ベース */
.site-header,
.site-footer {
    padding: 20px;
    text-align: center;
}

/* サイト全体の有効幅を Nephilim 用に拡張 */
.site-main {
    max-width: 1400px;  /* ★ ここを 800 → 1400 に */
    margin: 40px auto;
    padding: 0 24px;    /* 少しだけ左右余白を広げておく */
}

/* =========================================
   Global: Elements (共通要素)
   ========================================= */

/* 共通の水平線（白基調・木目背景に馴染ませる） */
hr {
    border: none;
    height: 2px;
    width: 100%;
    margin: 2rem 0;

    background: linear-gradient(
        to right,
        rgba(255, 255, 255, 0.1),
        rgba(255, 255, 255, 1),
        rgba(255, 255, 255, 0.1)
    );
}
/* =========================================
   Responsive (SP) - 横はみ出し止血（full-bleed対応版）
   ====================================== */

@media (max-width: 768px){
  html{
    overflow-x: visible;
  }
  body{
    overflow-x: hidden;
  }
}

@media (max-width: 768px){
  .site-main{
    width: 100%;
    max-width: 100%;
    margin: 0.6rem auto;  /* 例：統一値に寄せる */
    padding: 0;
  }
}

/* padding込みで幅計算を安定化（はみ出しの最大原因を潰す） */
*, *::before, *::after{
  box-sizing: border-box;
}

/* 画像・動画・iframe系のはみ出し防止 */
img, video, iframe, embed, object{
  max-width: 100%;
  height: auto;
}

/* 長いURL/英数字でレイアウトが割れない問題を止血 */
a, p, li, h1, h2, h3, h4, h5, h6{
  overflow-wrap: anywhere;
  word-break: break-word;
}

@media (max-width: 768px){
  .screen-reader-text{
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden; /* ← "hidden t" のtypo修正 */
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }
}