/*
 * サイト共通ヘッダー（ロゴ・戻る）のスタイル。
 *
 * もとは patterns/_header.php のページ内 <style>（2026-08-21 に外へ出した）。
 * 読み込む位置は元の <style> と同じ行 ―― wp_head() の直後。
 */

#back{
	margin: 40px 0;
}
#logo_pc{
	display:flex;
	flex:1; 
	justify-content:space-between;
	font-weight:normal;
}
.header-title{
	flex: 1;
	padding-right: 100px;
	max-width: 820px;
}
/* 書体の指定は外した（利用者の指示・2026-08-20）。
   "Libre Bodoni" はこのテーマのどこからも読み込んでおらず、
   **かつ次の候補も書いていなかった**ので、ブラウザの既定書体（多くは明朝）に
   落ちていた。狙って明朝にしていたのではなく、当たらない名前が残っていただけ。
   外したことで、ロゴを「テキスト」にしているサイトのサイト名は
   ヘッダーの書体（header a）に従う。画像ロゴのサイトには関係しない。 */
.header-title .pc{
	font-weight: normal;
	font-size: 20px;
	line-height: 30px;
	margin: 20px 0 20px;
}
.header-title .sp{
	font-weight: normal;
	font-size: 11px;
	line-height: 20px;
}
#header{
	max-width: 400px;
}
.sp{
	display:none;
}
@media only screen and (max-width: 480px) {
	.sp{
		display:block;
	}
	.pc{
		display:none;
	}
	#back{
		margin: 0px;
	}
	.header-title{
		padding-right: 0px;
	}
}

/* ロゴは9割の大きさにする（利用者の指示・2026-08-20）。
   PC・スマホとも同じ比率で縮める ―― 片方だけ変えると
   480pxの切り替わりで大きさが飛ぶ。 */
.header-title .sp img{
    max-width: 117px;   /* 130 の 90% */
    width: 100%;
}
.header-title .pc{
    width: max-content;
}
.header-title .pc img{
    max-width: 100%;
    /* 480pxのSP/PC切替で大きさが飛ばないよう、下限から上限まで連続的に拡大する。
       値は元（130px / 26vw / 200px）の9割。 */
    width: clamp(117px, 23.4vw, 180px);
    transition: width .24s ease;
}
.header-title {
    text-align: left;
}
@media only screen and (max-width: 768px) {
    .header-title .pc {
        margin: 0;
    }
}

/* --- プロフィール系（設定・ニックネーム編集・アンケート・ログアウト）の
       ヘッダーを、撮影一覧（body.fp-captured-layout）と同じ重ね置きにする。
       利用者の報告・2026-08-23「ヘッダーの位置が違う」。

   **写す先は photo-header.css の @media(min-width:481px) の1組**。
   切り替わり幅（481px）も pointer-events の扱いも、あちらに合わせてある
   ―― 値がずれると「ページを移るとロゴが動く」が別の形で戻ってくる。

   重ね置きにするとヘッダーは本文を押し下げないので、本文側に受けの余白が要る。
   登録/ログイン（_auth-head-styles.php）と同じ 110px。無いと一覧が
   アイコン列の下に潜り込む（LP v1 で実際に踏んだ・2026-08-18「上過ぎる」）。

   body クラスは functions.php の body_class フィルタが付ける。 */
@media screen and (min-width: 481px) {
  body.hs-profile-layout header {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 90;
    /* 重ねた面が下のクリックを奪わないようにする。ロゴの入れ物
       （p#logoTitle.header-title）は flex で横に広がり、右に 100px の
       padding も持つ。その透明な面がリンクの上に乗ると押せなくなる
       （利用者の報告・2026-08-18「リンクが押せない」）。 */
    pointer-events: none !important;
  }
  body.hs-profile-layout header a,
  body.hs-profile-layout header button,
  body.hs-profile-layout header input,
  body.hs-profile-layout header select { pointer-events: auto; }
  /* 本文の始まりも撮影一覧に合わせる（あちらは h3.head に clamp(80px,5vw,120px)）。
     数式をそろえておかないと、ヘッダーは同じ位置なのに中身の開始位置だけ
     ずれて「まだ違う」になる。 */
  body.hs-profile-layout { padding-top: 0 !important; }
  body.hs-profile-layout h3.head { margin-top: clamp(80px, 5vw, 120px) !important; }
  /* 設定ページだけは見出しが無く、いきなり一覧が来る。同じ位置から始める。
     一覧側の margin-top:60px はテンプレートのインライン指定で、スマホでは
     そのまま使う ―― ここ（PC）だけ !important で上書きする。 */
  body.hs-profile-layout .wrapeer > ul.post-lists { margin-top: clamp(80px, 5vw, 120px) !important; }
  /* ロゴの背に上限を付ける（撮影一覧と同じ 96px）。この画面だけヘッダーを
     絶対配置にしているため、縦に長いロゴだと下端が本文まで届いて重なる。
     object-fit:contain なので上限に当たっても縦横比は崩れない。 */
  body.hs-profile-layout .header-title .pc img {
    max-height: 96px;
    object-fit: contain;
    object-position: left center;
  }
}
