/*
Theme Name: 撮る｜写真家集団 | Divi 5 Child
Theme URI: https://toru.photo/
Description: 吉水直樹を代表に、人物写真・専門講座・写真家募集を展開する写真家集団「撮る」専用のDivi 5子テーマです。
Author: Toru Project
Author URI: https://toru.photo/
Template: Divi
 Version: 2.7.0
Text Domain: toru-collective-divi-child
*/

/**
 * Design philosophy — 写真家集団のエディトリアル・コレクティブ
 * 写真と写真家を第一情報にし、温かなオフホワイト、墨色、灰白、藍墨で
 * 人物写真の色を邪魔せず、余白と組版のリズムで集団の存在感をつくる。
 * Diviモジュールには必要に応じて toru-eyebrow / toru-title /
 * toru-link / toru-cta のCSSクラスを付与して使用する。
 */

:root {
  --toru-paper: #f8f7f3;
  --toru-paper-deep: #efeee8;
  --toru-ink: #1d1c1a;
  --toru-muted: #706e69;
  --toru-rule: #d9d7d0;
  --toru-indigo: #18334a;
  --toru-indigo-deep: #10283b;
  --toru-serif: "Noto Serif JP", "Yu Mincho", "Hiragino Mincho ProN", serif;
  --toru-sans: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
  --toru-ease: cubic-bezier(0.23, 1, 0.32, 1);
}

html {
  scroll-behavior: smooth;
}

body {
  background: var(--toru-paper);
  color: var(--toru-ink);
  font-family: var(--toru-sans);
  font-feature-settings: "palt" 1;
  text-rendering: optimizeLegibility;
}

::selection {
  background: var(--toru-indigo);
  color: #fff;
}

/* Header: the navigation should remain a light editorial frame, not a heavy panel. */
#main-header,
#main-header.et-fixed-header {
  background: rgb(248 247 243 / 94%) !important;
  box-shadow: none !important;
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--toru-rule);
}

#et-top-navigation {
  font-family: var(--toru-sans);
}

#top-menu-nav > ul > li > a,
.et_mobile_menu li a {
  color: var(--toru-ink) !important;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

#top-menu-nav > ul > li > a::after {
  display: block;
  width: 0;
  height: 1px;
  margin-top: 5px;
  background: var(--toru-indigo);
  content: "";
  transition: width 180ms var(--toru-ease);
}

#top-menu-nav > ul > li > a:hover::after,
#top-menu-nav > ul > li.current-menu-item > a::after {
  width: 100%;
}

#logo {
  max-height: 52%;
}

/* Type system */
h1,
h2,
h3,
h4,
h5,
h6,
.et_pb_text h1,
.et_pb_text h2,
.et_pb_text h3 {
  color: var(--toru-ink);
  font-family: var(--toru-serif);
  font-weight: 600;
  letter-spacing: 0.04em;
  line-height: 1.42;
}

/*
 * Brand typography utilities
 * Diviのモジュール固有設定より優先し、編集画面と公開ページの書体を揃える。
 * 明朝：大見出し・写真家名・作品名 / ゴシック：本文・補足 / 英字：管理ラベル。
 */
body .et_pb_module .toru-type-display,
body .et_pb_module .toru-type-display *,
body .et_pb_module .toru-type-name,
body .et_pb_module .toru-type-name *,
body .et_pb_module .toru-type-work-title,
body .et_pb_module .toru-type-work-title * {
  color: var(--toru-ink) !important;
  font-family: var(--toru-serif) !important;
  font-style: normal !important;
  font-weight: 500 !important;
  letter-spacing: 0.06em !important;
}

body .et_pb_module .toru-type-display,
body .et_pb_module .toru-type-display * {
  line-height: 1.35 !important;
}

body .et_pb_module .toru-type-name,
body .et_pb_module .toru-type-name * {
  letter-spacing: 0.13em !important;
  line-height: 1.35 !important;
}

body .et_pb_module .toru-type-body,
body .et_pb_module .toru-type-body *,
body .et_pb_module .toru-type-caption,
body .et_pb_module .toru-type-caption * {
  font-family: var(--toru-sans) !important;
  font-style: normal !important;
}

body .et_pb_module .toru-type-label,
body .et_pb_module .toru-type-label * {
  color: var(--toru-indigo) !important;
  font-family: var(--toru-sans) !important;
  font-size: 10px !important;
  font-style: normal !important;
  font-weight: 700 !important;
  letter-spacing: 0.18em !important;
  line-height: 1.5 !important;
  text-transform: uppercase;
}

/* 写真家アーカイブ：公開側でDiviが見出し書体を上書きしないための固定指定。 */
body #toru-photographers-page .toru-photographers-intro h1,
body #toru-photographers-page .toru-photographers-intro h1 *,
body .toru-photographer-card .et_pb_heading h1,
body .toru-photographer-card .et_pb_heading h2,
body .toru-photographer-card .et_pb_heading h3,
body .toru-photographer-card .et_pb_heading h4,
body .toru-photographer-card .et_pb_heading h5,
body .toru-photographer-card .et_pb_heading h6,
body .toru-photographer-card .et_pb_heading h1 *,
body .toru-photographer-card .et_pb_heading h2 *,
body .toru-photographer-card .et_pb_heading h3 *,
body .toru-photographer-card .et_pb_heading h4 *,
body .toru-photographer-card .et_pb_heading h5 *,
body .toru-photographer-card .et_pb_heading h6 * {
  font-family: var(--toru-serif) !important;
  font-style: normal !important;
  font-weight: 500 !important;
}

/* 作品アーカイブ：導入見出しとLoop Builderの作品タイトルを共通の明朝体で固定する。 */
body #toru-works-page .toru-works-intro h1,
body #toru-works-page .toru-works-intro h1 *,
body .toru-works-loop-row .et_pb_heading h1,
body .toru-works-loop-row .et_pb_heading h2,
body .toru-works-loop-row .et_pb_heading h3,
body .toru-works-loop-row .et_pb_heading h4,
body .toru-works-loop-row .et_pb_heading h5,
body .toru-works-loop-row .et_pb_heading h6,
body .toru-works-loop-row .et_pb_heading h1 *,
body .toru-works-loop-row .et_pb_heading h2 *,
body .toru-works-loop-row .et_pb_heading h3 *,
body .toru-works-loop-row .et_pb_heading h4 *,
body .toru-works-loop-row .et_pb_heading h5 *,
body .toru-works-loop-row .et_pb_heading h6 * {
  font-family: var(--toru-serif) !important;
  font-style: normal !important;
  font-weight: 500 !important;
}

/* Divi 5が作品カード内に出力する実際の見出しコンテナに対する最終上書き。 */
body #page-container .toru-works-loop-row .et_pb_heading .et_pb_heading_container h1,
body #page-container .toru-works-loop-row .et_pb_heading .et_pb_heading_container h2,
body #page-container .toru-works-loop-row .et_pb_heading .et_pb_heading_container h3,
body #page-container .toru-works-loop-row .et_pb_heading .et_pb_heading_container h4,
body #page-container .toru-works-loop-row .et_pb_heading .et_pb_heading_container h5,
body #page-container .toru-works-loop-row .et_pb_heading .et_pb_heading_container h6 {
  font-family: "Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", serif !important;
  font-style: normal !important;
  font-weight: 500 !important;
}

/* 実際の公開DOM用フォールバック：Loop行のカスタムクラス未付与時にも作品カードの見出しを明朝体に固定する。 */
body.post-type-archive-work #page-container .et_pb_section_0_tb_body .et_pb_heading .et_pb_module_header {
  font-family: "Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", serif !important;
  font-style: normal !important;
  font-weight: 500 !important;
}

/* 実際の公開DOM用フォールバック：写真家カードの名前を明朝体に固定する。 */
body.post-type-archive-photographer #page-container .et_pb_section_1_tb_body .et_pb_heading .et_pb_module_header {
  font-family: "Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", serif !important;
  font-style: normal !important;
  font-weight: 500 !important;
}

/* 写真家アーカイブ：プロフィール写真は縦長ポートレートとして統一表示する。 */
body.post-type-archive-photographer #page-container .et_pb_section_1_tb_body .et_pb_image {
  display: block !important;
  aspect-ratio: 3 / 4;
  margin-bottom: 25px !important;
  overflow: hidden !important;
}

body.post-type-archive-photographer #page-container .et_pb_section_1_tb_body .et_pb_image_wrap,
body.post-type-archive-photographer #page-container .et_pb_section_1_tb_body .et_pb_image_wrap img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
}

body.post-type-archive-photographer #page-container .et_pb_section_1_tb_body .et_pb_image_wrap img {
  object-fit: cover !important;
  object-position: center top;
}

/* 写真家アーカイブ：Loop Builderで繰り返される列を、集団の人数感が伝わる3列カードにする。 */
body.post-type-archive-photographer #page-container .et_pb_section_1_tb_body .et_pb_row_1_tb_body {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 58px 28px !important;
  width: min(1280px, calc(100% - 96px)) !important;
  max-width: none !important;
  margin: 0 auto !important;
}

body.post-type-archive-photographer #page-container .et_pb_section_1_tb_body .et_pb_row_1_tb_body > .et_pb_column {
  float: none !important;
  width: auto !important;
  min-width: 0 !important;
  margin: 0 !important;
}

p,
.et_pb_text,
.et_pb_blurb_description {
  color: var(--toru-ink);
  font-family: var(--toru-sans);
  font-size: 15px;
  font-weight: 400;
  letter-spacing: 0.04em;
  line-height: 2;
}

.toru-eyebrow {
  color: var(--toru-indigo) !important;
  font-family: var(--toru-sans) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 0.2em !important;
  line-height: 1.4 !important;
  text-transform: uppercase;
}

.toru-title {
  max-width: 12em;
  margin-top: 14px;
  font-family: var(--toru-serif) !important;
  font-size: clamp(30px, 4vw, 56px) !important;
  letter-spacing: 0.04em !important;
  line-height: 1.45 !important;
}

.toru-caption {
  color: var(--toru-muted) !important;
  font-size: 11px !important;
  letter-spacing: 0.08em !important;
  line-height: 1.75 !important;
}

/* A bold collective manifesto. Use this on the top-page statement module. */
.toru-manifesto {
  max-width: 11em;
  color: var(--toru-ink) !important;
  font-family: var(--toru-serif) !important;
  font-size: clamp(38px, 5.2vw, 76px) !important;
  font-weight: 600 !important;
  letter-spacing: 0.06em !important;
  line-height: 1.32 !important;
}

.toru-collective-meta {
  color: var(--toru-muted) !important;
  font-family: var(--toru-sans) !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  letter-spacing: 0.16em !important;
  line-height: 1.75 !important;
  text-transform: uppercase;
}

/* Space & rules */
.et_pb_section {
  background-color: var(--toru-paper);
}

.et_pb_section.toru-section-muted {
  background-color: var(--toru-paper-deep) !important;
}

.toru-rule-top {
  border-top: 1px solid var(--toru-rule);
}

.toru-rule-bottom {
  border-bottom: 1px solid var(--toru-rule);
}

.toru-section-number::before {
  display: block;
  margin-bottom: 26px;
  color: var(--toru-indigo);
  content: attr(data-section-number);
  font-family: var(--toru-sans);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.18em;
}

/* Buttons: a narrow indigo editorial slit rather than rounded UI buttons. */
.et_pb_button,
.toru-button .et_pb_button {
  min-width: 194px;
  padding: 15px 22px !important;
  border: 1px solid var(--toru-indigo) !important;
  border-radius: 0 !important;
  background: var(--toru-indigo) !important;
  color: #fff !important;
  font-family: var(--toru-sans) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  letter-spacing: 0.12em !important;
  line-height: 1.2 !important;
  transition: background-color 180ms var(--toru-ease), color 180ms var(--toru-ease), transform 160ms var(--toru-ease) !important;
}

.et_pb_button:hover,
.toru-button .et_pb_button:hover {
  background: var(--toru-paper) !important;
  color: var(--toru-indigo) !important;
  opacity: 1 !important;
}

.et_pb_button:active,
.toru-button .et_pb_button:active {
  transform: scale(0.97);
}

.toru-link .et_pb_button {
  min-width: auto;
  padding: 0 0 7px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--toru-indigo) !important;
  background: transparent !important;
  color: var(--toru-indigo) !important;
}

/* Portfolio and blog cards should read as photographs, not boxed components. */
.et_pb_blog_grid .et_pb_post,
.et_pb_portfolio_item {
  overflow: hidden;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
}

.et_pb_blog_grid .et_pb_image_container,
.et_pb_portfolio_image {
  overflow: hidden;
}

.et_pb_blog_grid .et_pb_image_container img,
.et_pb_portfolio_image img {
  transition: transform 240ms var(--toru-ease), filter 240ms var(--toru-ease);
}

.et_pb_blog_grid .et_pb_post:hover .et_pb_image_container img,
.et_pb_portfolio_item:hover .et_pb_portfolio_image img {
  filter: saturate(1.04);
  transform: scale(1.015);
}

.et_pb_blog_grid h2,
.et_pb_portfolio_item h2 {
  margin-top: 20px;
  font-family: var(--toru-serif) !important;
  font-size: 22px !important;
  letter-spacing: 0.04em;
}

.et_pb_post .post-meta,
.et_pb_portfolio_item .post-meta {
  color: var(--toru-muted) !important;
  font-family: var(--toru-sans) !important;
  font-size: 11px !important;
  letter-spacing: 0.1em;
}

/* A reusable CTA panel. Add class toru-cta to the Divi section. */
.toru-cta,
.et_pb_section.toru-cta {
  background: var(--toru-indigo) !important;
}

.toru-cta .et_pb_text,
.toru-cta .et_pb_text h1,
.toru-cta .et_pb_text h2,
.toru-cta .et_pb_text h3,
.toru-cta .et_pb_text p {
  color: #fff !important;
}

.toru-cta .et_pb_button {
  border-color: #fff !important;
  background: #fff !important;
  color: var(--toru-indigo) !important;
}

.toru-cta .et_pb_button:hover {
  background: transparent !important;
  color: #fff !important;
}

/* Footer */
#main-footer {
  background: var(--toru-ink) !important;
  color: rgb(255 255 255 / 82%);
}

#footer-bottom,
#footer-info,
#footer-info a {
  color: rgb(255 255 255 / 82%) !important;
  font-family: var(--toru-sans);
  font-size: 11px;
  letter-spacing: 0.08em;
}

/* Accessibility and reduced motion */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
  outline: 2px solid var(--toru-indigo) !important;
  outline-offset: 3px;
}

@media (max-width: 980px) {
  #main-header {
    min-height: 64px;
  }

  .toru-title {
    max-width: none;
    font-size: 34px !important;
  }

  .et_pb_section {
    padding-top: 64px;
    padding-bottom: 64px;
  }

  body.post-type-archive-photographer #page-container .et_pb_section_1_tb_body .et_pb_row_1_tb_body {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 44px 20px !important;
    width: min(100% - 48px, 720px) !important;
  }
}

@media (max-width: 600px) {
  body.post-type-archive-photographer #page-container .et_pb_section_1_tb_body .et_pb_row_1_tb_body {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 34px 14px !important;
    width: calc(100% - 32px) !important;
  }

  body.post-type-archive-photographer #page-container .et_pb_section_1_tb_body .et_pb_heading .et_pb_module_header {
    font-size: 21px !important;
    letter-spacing: 0.08em !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}

/* 写真家一覧：Loop Builderの誤ったTheme Builder URLを使わないプロフィール導線 */
.toru-photographer-loop-profile-link {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  min-height: 40px;
  padding: 10px 17px;
  border: 1px solid var(--toru-indigo, #18334a);
  border-radius: 0;
  background: transparent;
  color: var(--toru-indigo, #18334a) !important;
  font-family: var(--toru-sans, "Noto Sans JP", sans-serif);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .1em;
  line-height: 1.2;
  text-decoration: none !important;
  transition: background 180ms cubic-bezier(.23, 1, .32, 1), color 180ms cubic-bezier(.23, 1, .32, 1), transform 160ms cubic-bezier(.23, 1, .32, 1);
}

.toru-photographer-loop-profile-link:hover { background: var(--toru-indigo, #18334a); color: #fff !important; }
.toru-photographer-loop-profile-link:active { transform: scale(.97); }
.toru-photographer-loop-profile-link__arrow { font-size: 15px; font-weight: 400; line-height: 1; }

@media (max-width:600px) {
  .toru-photographer-loop-profile-link { min-height: 37px; padding: 9px 14px; font-size: 9px; }
}

/* =========================================================
   tORu MODEL PROFILE
   WORKS / 出演作品
   ========================================================= */

/* セクション全体 */
.toru-mwl-model-works {
    width: 100%;
    max-width: 1200px;
    margin: 80px auto 40px;
    padding: 0 24px;
    background: transparent;
    box-sizing: border-box;
}

/* セクション見出し */
.toru-mwl-model-works .toru-mwl-eyebrow {
    margin: 0 0 12px;
    color: #8b7770;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.18em;
    line-height: 1.8;
}

.toru-mwl-model-works > h2 {
    margin: 0 0 36px;
    padding: 0 0 22px;
    border-bottom: 1px solid #dedbd6;
    color: #1a2c42;
    font-family: "Noto Serif JP", serif;
    font-size: clamp(26px, 3vw, 36px);
    font-weight: 500;
    line-height: 1.5;
}

/* 作品一覧：PCでは3列 */
.toru-mwl-model-works .toru-mwl-work-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 32px 24px;
    width: 100%;
    align-items: start;
}

/* 作品カード */
.toru-mwl-model-works .toru-mwl-work-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    gap: 0;
    color: #1a2c42 !important;
    text-decoration: none !important;
    transition: opacity 0.25s ease;
}

.toru-mwl-model-works .toru-mwl-work-card:hover {
    opacity: 0.75;
}

/* サムネイル */
.toru-mwl-model-works .toru-mwl-work-card img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 5;
    object-fit: cover;
    margin: 0 0 16px;
    border: 0;
    border-radius: 0;
}

/* 作品名 */
.toru-mwl-model-works .toru-mwl-work-card strong {
    display: block;
    margin: 0 0 8px;
    color: #1a2c42;
    font-family: "Noto Serif JP", serif;
    font-size: 19px;
    font-weight: 500;
    line-height: 1.6;
}

/* 撮影した写真家 */
.toru-mwl-model-works .toru-mwl-work-card span {
    display: block;
    color: #7b7772;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 11px;
    font-weight: 500;
    letter-spacing: 0.06em;
    line-height: 1.8;
}

/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 980px) {

    .toru-mwl-model-works {
        margin-top: 64px;
        padding: 0 20px;
    }

    .toru-mwl-model-works .toru-mwl-work-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 28px 20px;
    }

}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 600px) {

    .toru-mwl-model-works {
        margin: 56px auto 24px;
        padding: 0 16px;
    }

    .toru-mwl-model-works > h2 {
        margin-bottom: 24px;
        padding-bottom: 16px;
        font-size: 27px;
    }

    .toru-mwl-model-works .toru-mwl-work-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 24px 12px;
    }

    .toru-mwl-model-works .toru-mwl-work-card img {
        margin-bottom: 12px;
    }

    .toru-mwl-model-works .toru-mwl-work-card strong {
        font-size: 15px;
        line-height: 1.5;
    }

    .toru-mwl-model-works .toru-mwl-work-card span {
        font-size: 10px;
        letter-spacing: 0;
    }

}

/* =========================================================
   tORu MODEL PROFILE
   BODY LINK COLOR
   ========================================================= */

/* モデル詳細ページ内の通常リンク */
body.single-model .toru-model-profile a:not(.toru-model-profile__button),
body.single-model .toru-mwl-model-works a {
    color: #1a2c42 !important;
    text-decoration: none !important;
    transition: color 0.25s ease, opacity 0.25s ease;
}

/* ホバー時 */
body.single-model .toru-model-profile a:not(.toru-model-profile__button):hover,
body.single-model .toru-mwl-model-works a:hover {
    color: #8b7770 !important;
}

/* 訪問済みリンク */
body.single-model .toru-model-profile a:visited,
body.single-model .toru-mwl-model-works a:visited {
    color: #1a2c42 !important;
}

/* キーボード操作時のフォーカスは残す */
body.single-model .toru-model-profile a:focus-visible,
body.single-model .toru-mwl-model-works a:focus-visible {
    outline: 2px solid #1a2c42;
    outline-offset: 4px;
}

/* =========================================================
   モデル詳細ページ：本文エリアのリンク色を統一
   ========================================================= */

body.single-model .et_pb_post_content a,
body.single-model .et_pb_code_inner a {
    color: #1a2c42 !important;
    text-decoration: none !important;
}

body.single-model .et_pb_post_content a:hover,
body.single-model .et_pb_code_inner a:hover {
    color: #8b7770 !important;
}