@charset "UTF-8";
/*
Theme Name: 
Theme URI:
Description: 
Version: 1.0
Author: 
Author URI: 
*/

:root {
    --brand-bg: #FAF6EE;         /* ベースの生成色（紙/米ぬか系ベージュ） */
    --brand-ink: #2F2A26;        /* 文字色（濃いブラウン） */
    --brand-accent: #8C6E4E;     /* アクセント（こがし茶） */
    --brand-accent-2: #C0A889;   /* 薄アクセント */
    --brand-green: #3C5B4C;      /* 差し色（ボタニカル系） */
    --brand-kv-overlay: rgba(47, 42, 38, 0.25); /* KVのトーン用 */
    --section-odd: #FFFFFF;
    --section-even: #f7faea;
  }
  
  html, body {
    background: var(--brand-bg);
    color: var(--brand-ink);
    scroll-behavior: smooth;
  }

  /* スクリーンリーダー専用クラス */
  .sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
  }

  /* フォーカス可視性 - キーボードユーザーのみ対象に */
  a:focus:not(:focus-visible), button:focus:not(:focus-visible) {
    outline: none;
  }

  a:focus-visible, button:focus-visible {
    outline: 2px solid var(--brand-accent);
    outline-offset: 2px;
  }

  /* 画像の最適化 */
  img {
    max-width: 100%;
    height: auto;
  }
  
  /* リンクのフォーカスとタップのハイライトを除去 */
  a, button {
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    user-select: none;
    outline: none;
  }

  a:hover {
    color: inherit;
  }
  
  /* サイト全体でフォーカス枠を消す */
  *:focus {
    outline: none !important;
    box-shadow: none !important;
  }
  
  /* キーボードユーザー向けのフォーカススタイル（アクセシビリティ維持） */
  *:focus-visible {
    outline: 1px solid var(--brand-accent-2) !important;
    outline-offset: 1px;
  }
  
  /* ニュースセクションとお客様の声セクションのリンク・ボタン特別スタイル */
  #news button, #voices a {
    outline: none !important;
  }
  
  /* ページング用ボタンの特別スタイル */
  #news .flex button {
    outline: none !important;
    box-shadow: none !important;
  }

  /* カスタムスクロールバー */
  .scrollbar-thin {
    scrollbar-width: thin;
    scrollbar-color: var(--brand-accent-2) transparent;
  }
  
  /* Webkit（Chrome、Safari）用スクロールバーカスタマイズ */
  .scrollbar-thin::-webkit-scrollbar {
    width: 6px;
  }
  
  .scrollbar-thin::-webkit-scrollbar-track {
    background: transparent;
  }
  
  .scrollbar-thin::-webkit-scrollbar-thumb {
    background-color: var(--brand-accent-2);
    border-radius: 20px;
  }