/* 共通部品の補助（位置はすべて生成 CSS 側。ここは入れ子グループの扱いと見た目の共通ルールのみ） */
/* グループ（header / nav / dl / ul / section …）は帯いっぱいに広げ、子を帯座標の絶対配置にする */
.grp { position: absolute; inset: 0; pointer-events: none; }
.grp > *, .grp > .grp-list > * { position: absolute; pointer-events: auto; }
/* 入れ子のグループ（header の中の SNS 群など）は帯いっぱいの透明な箱なので、当たり判定を持たせない。
   2026-09-15 発見：hd__sns が帯全体を覆って前面（z 7）にあり、右レールの Location（Google マップ）が押せなかった */
.grp > .grp, .grp > .grp-list { pointer-events: none; }
.grp-list { position: absolute; inset: 0; margin: 0; padding: 0; pointer-events: none; }
.nw__list li { position: absolute; inset: 0; pointer-events: none; }
.nw__list li > * { position: absolute; pointer-events: auto; }
/* 記事名は「自分の領域（417.33px）の中で 2 行まで」（2026-09-17・中間レビュー R08・B 案）。
   幅と行送り 28px は生成側（build/pages/top.py）が持つ。ここは行数の上限だけ。
   3 行目からは下の罫にかかるので止める。いまの原稿（最長 18 字）は 1 行に収まるので、
   見た目は 1px も変わらない。CMS で長い記事名が来ても、分類にはかからない。 */
.nw__list [class*="nw__title"] > a {
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;
}
/* クリック領域を持つグループ（ボタン・リンク）は自身の矩形に収める */
.hd__menu { pointer-events: auto; cursor: pointer; inset: auto; left: calc(1800 * var(--s)); top: 0; width: calc(120 * var(--s)); height: calc(120 * var(--s)); }
.hd__menu > * { pointer-events: none; }
/* 2026-09-22 不具合修正：Menu ボタンはヘッダー（.grp）の中のグループなので、上の「.grp > .grp は当たり判定を持たない」に負けて
   **マウスで押せなかった**（キーボードの Enter では開いていた）。ボタンだけは当たり判定を戻す。見た目は変わらない */
.grp > .hd__menu { pointer-events: auto; }
.hd__menu-l1, .hd__menu-l2 { left: calc(28 * var(--s)) !important; }   /* ボタン基準（x=1828-1800） */
.hd__menu-label { left: calc(40.43 * var(--s)) !important; }
/* PC の Menu の罫 2 本（2026-09-24 高野様「2 本の罫線の太さが違うので、細い方に合わせて」「横幅を 20% 縮小」）。
   これまでは高さ 1 × --s（約 0.79px）の面を、端数のある位置（40.82・56.82 × --s）に置いていたため、
   画面の画素へのそろえ方が上下で違い、片方が 2 画素・片方が 1 画素に見えていた。
   → 2 本とも「画面の 1 画素」ちょうどの細さにし、位置も画素の境目にそろえる（どちらも同じ細さになる）。
      ふつうの画面：1px／高解像度（Retina 2 倍）：0.5px（＝画面の 1 画素）
   幅 64 → 51.2（20% 縮小）。ボタンの中心（x=60）はそのまま */
@media (min-width: 768px) {
  .hd__menu-l1, .hd__menu-l2 {
    left: calc(34.4 * var(--s)) !important; width: calc(51.2 * var(--s)) !important; height: 1px !important;
  }
  .hd__menu-l1 { top: round(nearest, calc(40.82 * var(--s)), 1px) !important; }
  .hd__menu-l2 { top: round(nearest, calc(56.82 * var(--s)), 1px) !important; }
}
@media (min-width: 768px) and (min-resolution: 2dppx) {
  .hd__menu-l1, .hd__menu-l2 { height: .5px !important; }
  .hd__menu-l1 { top: round(nearest, calc(40.82 * var(--s)), .5px) !important; }
  .hd__menu-l2 { top: round(nearest, calc(56.82 * var(--s)), .5px) !important; }
}
/* View All 円ボタン：中身がすべて絶対配置なので、<a> 自身は箱を持たない（0×0）。
   2026-09-15 まで inset:auto だったため **リンクを押せず、ホバーも効かなかった**。
   帯いっぱいに広げたうえで当たり判定を透明な .va-hit（ai の円と同じ φ120・真円）だけに持たせる。
   見た目は 1px も変わらない。 */
.viewall { inset: 0; pointer-events: none; }
.viewall > * { pointer-events: none; }
.viewall .va-hit { display: block; pointer-events: auto; cursor: pointer; border-radius: 50%; background: transparent; }
/* フォーカスの枠は帯いっぱいの <a> ではなく、円に付ける */
.viewall:focus-visible { outline: none; }
.viewall:focus-visible .va-hit { outline: 2px solid currentColor; outline-offset: 3px; }
.hd__navlist a, .ft__indexlist a, .nw__list a, .nw__quote a { display: inline-block; }
.ft__cal dt, .ft__cal dd { margin: 0; }
.ft__aug { position: relative; }
.ft__aug-bang { position: absolute; left: calc(505.33 * var(--s)); top: 0; }  /* ai: ! の x=725.3 − A の x=219.97 */
/* 円ボタンのホバー：2026-09-15 に R4-4「内から外へ」を採用したので、
   仮置きしていた明度だけの変化（filter: brightness(.97)）はやめ、assets/css/viewall.css に移した。
   戻す場合は次の 1 行を有効にする：
   .viewall:hover .es__viewall__circle, .viewall:hover .g88__viewall__circle { filter: brightness(.97); } */

/* 右レールの縦罫は帯をまたいで下まで伸びる（ai）→ 後続の帯に隠れないよう前面に */
.rail__line { z-index: 5; }
.rail { z-index: 6; }
.hd { z-index: 7; }

/* Google マップの埋め込み（Q40）。白基調に合わせて彩度を落とす */
.ac__map iframe { display: block; width: 100%; height: 100%; border: 0; filter: grayscale(1) contrast(.92) brightness(1.03); }
@media (prefers-reduced-motion: reduce) { .ac__map iframe { filter: grayscale(1) contrast(.92); } }

/* 送信ボタン（Q44・ai に無い新設要素）。p3 の予約ボタンと同じ細い線の意匠 */
.fm__submit { cursor: pointer; color: var(--c-ink); background: transparent; transition: background .15s var(--e-out), color .15s var(--e-out); }
.fm__submit:hover, .fm__submit:focus-visible { background: var(--c-ink); color: var(--c-white); }
@media (prefers-reduced-motion: reduce) { .fm__submit { transition: none; } }

/* 2026-09-14 高野様指示：カリグラフィー（筆記体・飾り罫の SVG）は写真枠に隠さず、全箇所で写真の前面に出す。
   ai では ch__orn1（TOP）・os__orn2・cat1〜4__pick-orn（暮らしの品々）・esi__orn1（美容とエステ）の 7 箇所が
   写真枠の下に描かれていた。位置・寸法はそのまま、重なり順だけ変える。
   ※ 写真側に z-index を付けてはいけない。GARAGE88 帯の色面（#262722 multiply）まで写真の下に潜る。 */
.band__in > .svgbox, .grp > .svgbox { z-index: 3; }
/* ヘッダー・右レール・全画面メニューは既に前面（z 6〜100）。ボタン内の SVG はボタンの中で完結させる */
.hd .svgbox, .rail .svgbox, .viewall .svgbox, .mn .svgbox { z-index: auto; }

/* SP だけの改行（build/sp.py の SP_BREAKS が差し込む）。PC では出さない。767px 以下は sp-common.css が出す */
br.sp-br { display: none; }

/* 2026-09-22 不具合修正（記事詳細）：「COLUMN の記事をもっと見る →」の段落は右揃えのために幅 975 を持ち、
   同じ行の左の「← 一覧へもどる」の上に透明に重なって、**マウスで押せなかった**。段落は当たり判定を持たず、リンクだけが持つ。見た目は変わらない */
.ar__more { pointer-events: none; }
.ar__more a { pointer-events: auto; }

/* 2026-09-22 高野様「アウグーリのロゴを削除。後でロードアニメーションに使う」：TOP FV の大きなロゴを画面から外す。
   h1（日本語の aria-label）はページの見出しとして残し、読み上げと検索には今までどおり届く。ロードアニメーションで使うときはこの 2 行を外す */
.page-top .b-fv .fv__logo { clip-path: inset(50%) !important; opacity: 0; pointer-events: none; }

/* 2026-09-22 高野様「トップ FV の文字をフォントサイズを変えずに、読みやすいように位置を調整」：
   ロゴを外して空いた左上の白い面へ、コピーと英文を 330px（1920 基準）上げる。手とペンに文字がかからない。
   住所・時刻はノートの白い面の上なので ai の位置のまま。大きさ・行間・字送りは変えていない。SP（767px 以下）は流れの組みなので別 */
/* 2026-09-25 高野様「PC のトップ FV、ノートに近いので、少しだけ文字を離して」→ さらに 40px（1920 基準）上げて 370px に。
   1440 幅で英文の下とノートの角のすき間が 0 → 約 35px になる。住所・時刻はこれまでどおり
   2026-09-26 高野様「24 ピクセル上に」→ 394px に（1920 基準。1440 幅では 18px 上がる） */
@media (min-width: 768px) {
  .page-top .b-fv .fv__copy, .page-top .b-fv .fv__live { translate: 0 calc(-394 * var(--s)); }
}

/* 2026-09-26 高野様（暮らしの品々）「The Auguri Selection／暮らしの中に、好きなものを。」を画面幅の中心揃えに。
   ai では左寄せ（x=515／518）。筆記体の箱（370 幅）を 1920 の真ん中へ、見出しは帯の幅いっぱいにして中央揃え。
   見出しは字間 .04em が最後の「。」のあとにも付くので、左にも同じだけ足して真ん中を合わせる。
   すぐ下のリード文はもともと中央揃え。SP（767px 以下）は流れの組みなので別 */
@media (min-width: 768px) {
  .b-selection .tas__script { left: calc((1920 - 370) / 2 * var(--s)); }
  .b-selection .tas__h { left: 0; width: calc(1920 * var(--s)); text-align: center; padding-left: .04em; }
}

/* 暮らしの品々：ジャンルの写真 3 枚の入れもの（build/g3.py）。PC では箱を作らない＝これまでと 1px も変わらない。
   SP の横スワイプは sp-common.css */
.g3 { display: contents; }
.g3 > * { position: absolute; }   /* 02-base.css の「.band__in > *」と同じ（入れものの中でも ai の位置に置く） */
.g3__count { display: none; }
.nobr { white-space: nowrap; }   /* 途中で改行しない語（記事の予約帯の曜日など・2026-09-23） */

/* ── FV の文字：書体が届いてから出す（2026-09-26 高野様「FV のロード時の文字のカクつき」）──
   Adobe Fonts が届くまで（html.wf-loading のあいだ）は、代わりの明朝で文字が出て、届いた瞬間に字の形と幅が跳ねていた
   （本番で計測：書体が届くのは読み込みから 0.4〜2 秒後）。FV の小さな文字（ラベル・英文・リード・TOP の英文と住所・時刻）は
   届くまで隠し、届いたら 0.6 秒でふわっと出す。大見出しは heading-motion.js が同じく書体を待ってからにじませる。
   届かないとき（Adobe Fonts の不調）も 3 秒で出す。終わった絵は変わらない（opacity の終点は書かない） */
html.wf-loading main.page .b-hero :is(.hero__label, .hero__en, .hero__lead),
html.wf-loading .page-top .b-fv :is(.fv__live, .fv__addr-lab, .fv__addr-jp, .fv__time-lab, .fv__time) {
  animation: aug-wf-wait 3s steps(1, end) both;
}
main.page .b-hero :is(.hero__label, .hero__en, .hero__lead),
.page-top .b-fv :is(.fv__live, .fv__addr-lab, .fv__addr-jp, .fv__time-lab, .fv__time) {
  animation: aug-wf-in .6s cubic-bezier(.22, 1, .36, 1) backwards;
}
@keyframes aug-wf-wait { from { opacity: 0; } }
@keyframes aug-wf-in { from { opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
  main.page .b-hero :is(.hero__label, .hero__en, .hero__lead),
  .page-top .b-fv :is(.fv__live, .fv__addr-lab, .fv__addr-jp, .fv__time-lab, .fv__time) { animation-duration: .01s; }
}