@charset "UTF-8";
/* ==========================================================================
   DESIGN TOKENS（サイト共通の変数定義）

   このファイルは以下の2箇所から読み込まれる 1 つのソース。
     - フロント : functions.php の wp_enqueue_scripts（全ページ）
     - 編集画面 : functions.php の add_editor_style()
   renewal.css の :root にあったものをそのまま移してある。変数だけなので
   どのページで読み込まれても表示には影響しない（recruit/lp/portfolio 系で
   読み込まれても安全）。

   値を変えるときはここ1箇所を直せば、フロントも編集画面も同時に変わる。
   ========================================================================== */

:root {
    /* Color（PC_TOP.jpg から実測。2026-09-15: カラー設計データに合わせて数値を更新） */
    --color-bg: #ffffff;
    --color-dark: #27211E;       /* About/Works/Stats/Portfolio/Blog の暗部パネル（旧#27221f。設計データ --color-accent-1 に合わせ更新） */
    --color-black: #19100D;      /* 見出し・ボタン等の濃色（旧#1a100e。設計データ --color-main に合わせ更新） */
    --color-text-sub: #7F7F80;   /* リード文・キャプション（旧#828282。設計データ --color-accent-3 に合わせ更新） */
    --color-border: #C0C0C0;     /* 設計データ --color-accent-5 と完全一致のため変更なし */
    --color-placeholder: #d9d9d9;
    --color-bg-soft: #F6F3F0;    /* ブログ一覧の見出し帯（旧#f8f7f5。設計データ --color-base に合わせ更新） */
    --color-bg-soft-2: #F8F8F5;  /* ベースカラーの追加バリエーション（2026-09-16追加・ユーザー指定） */
    --color-accent-from: #d61280; /* Contact CTA グラデーション（マゼンタ側） */
    --color-accent-to: #ffa880;   /* Contact CTA グラデーション（オレンジ側） */
    /* 設計データに追加されたが、既存カラーと近似しない新規色（2026-09-15追加） */
    --color-accent-2: #D43D27;   /* 差し色（赤系）。既存変数に近似なし */
    --color-accent-4: #583E3A;   /* 差し色（赤褐色系）。既存変数に近似なし */

    /* お問い合わせ系CTAの共通グラデーション。
       使っているところ：フッターお問い合わせ帯（.c-contact-cta）／
       ヘッダーのCTAボタン（style.css）／横長ボタンのグラデーション塗り
       （.c-wide-btn / .is-style-mda-wide-fill）。

       ■ style.css ではなくこのファイルに置いてある理由（重要）
         元は style.css の :root にあったが、style.css は「ページ全体のレイアウトを
         含み編集画面を壊す」ため add_editor_style() から意図的に外してある。
         そのため編集画面ではこの変数が解決できず、背景が透明になっていた
         （＝グラデーションのボタンや帯が、白背景に白文字で何も見えない状態になる）。
         このファイルはフロントと編集画面の両方から読み込まれる唯一の変数置き場
         なので、両方で色を出したい値はここに置くこと。 */
    --gradient-contact: linear-gradient(-47deg, #FFBF80 0%, #FFA680 14%, #FF6880 43%, #FF5880 50%, #DE2180 82%, #CB0080 100%);

    /* Font */
    --font-en: 'Montserrat', sans-serif;
    --font-jp: 'TBUDGothic R', 'Noto Sans JP', sans-serif;
    /* TBUDGothic E */
    /* Statsの数字（600 / 97.7）専用。TOPページのみ・数字のみにサブセットして読み込む
       （functions.phpのmy_custom_google_fonts()内、is_front_page()分岐を参照） */
    --font-stats-num: 'Antonio', var(--font-en);

    /* Spacing */
    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 1rem;
    --space-4: 1.5rem;
    --space-5: 2.5rem;
    --space-6: 4rem;
    --space-7: 6rem;
    --space-8: 8rem;

    /* Layout */
    --container-w: 1600px;

    /* Works スライドショーのカード間隔。CSSのgapではなくSwiperのspaceBetweenに
       渡す値なので、assets/js/works-slider.js がこの変数を読んでpx換算している
       （理由はworks-slider.js側のコメント参照）。SP側の上書きは下の@mediaにある */
    --works-slide-gap: 1.5rem;

    /* Breakpoint（メディアクエリでは変数は使えないため値の目安として） */
    /* sp: ~750px / pc: 751px~（legacy.css/recruit.cssと同じ750px単一基準に統一） */

    /* Typography (Japanese)
       px→rem は 1rem=16px（SWELL基準）で換算。line-heightはフォントサイズに対する
       単位なしの相対値（lh_px ÷ fz_px）に換算してある。
       SP値はrenewal.cssの `@media (max-width:750px){ html{font-size:2.1333vw} }`
       により750px幅で1rem=16pxになる設計と対応（デザインデータもSP=750px基準）。
       -pc / -sp は同じ役割の値をブレークポイントごとに分けた別トークンなので、
       使用側は自分がいるメディアクエリに応じて -pc / -sp を使い分けること。 */
    /* 基本サイズ */
    --fz-jp-base-pc: 1rem;      --fz-jp-base-sp: 1.375rem;
    --lh-jp-base-pc: 2.5;       --lh-jp-base-sp: 1.91;
    /* ミディアム */
    --lh-jp-md-pc: 1.875;       --lh-jp-md-sp: 2;
    /* ボールド */
    --lh-jp-bd-pc: 2.625;       --lh-jp-bd-sp: 2.09;
    /* 見出し大 */
    --fz-jp-h-lg-pc: 2.8125rem; --fz-jp-h-lg-sp: 3rem;
    --lh-jp-h-lg-pc: 1.44;      --lh-jp-h-lg-sp: 1.46;
    /* 見出し中 */
    --fz-jp-h-md-pc: 1.875rem;  --fz-jp-h-md-sp: 2.1875rem;
    --lh-jp-h-md-pc: 1.53;      --lh-jp-h-md-sp: 1.71;
    /* 見出し小 */
    --fz-jp-h-sm-pc: 1.375rem;  --fz-jp-h-sm-sp: 1.625rem;
    --lh-jp-h-sm-pc: 2.09;      --lh-jp-h-sm-sp: 2.31;
    /* 見出し極小（18px・行送り32px。設計データに無かったため2026-09-15追加。
       既存CSSでこのサイズが英字見出し小(--fz-en-h-sm-pc)と数値上一致していたが、
       実際は日本語UI（SPメニュー項目など）で使われていたため、誤って英字用
       トークンに紐付けないよう日本語用として新規定義。SP値は未提供のためPCのみ） */
    --fz-jp-h-xs-pc: 1.125rem;
    --lh-jp-h-xs-pc: 1.78;
    /* 注釈 */
    --fz-jp-note-pc: 0.875rem;  --fz-jp-note-sp: 1.25rem;
    --lh-jp-note-pc: 1.43;      --lh-jp-note-sp: 1.7;
    /* 極小 */
    --fz-jp-xs-pc: 0.75rem;     --fz-jp-xs-sp: 1.25rem;
    --lh-jp-xs-pc: 1.67;        --lh-jp-xs-sp: 1.5;

    /* Typography (English) */
    /* 見出し大 */
    --fz-en-h-lg-pc: 3.125rem;  --fz-en-h-lg-sp: 4.0625rem;
    --lh-en-h-lg-pc: 1.56;      --lh-en-h-lg-sp: 1.23;
    /* 見出し中 */
    --fz-en-h-md-pc: 1.875rem;  --fz-en-h-md-sp: 2.1875rem;
    --lh-en-h-md-pc: 1.53;      --lh-en-h-md-sp: 1.71;
    /* 見出し小 */
    --fz-en-h-sm-pc: 1.125rem;  --fz-en-h-sm-sp: 1.375rem;
    --lh-en-h-sm-pc: 1.78;      --lh-en-h-sm-sp: 1.73;
    /* 日にち */
    --fz-en-date-pc: 0.875rem;  --fz-en-date-sp: 1.25rem;
    --lh-en-date-pc: 1.43;      --lh-en-date-sp: 1.8;
}