/*
 * 物件カード（rh_card）の並び替え：写真 → 場所（エリア＋号地名を大きく）→ ひとこと → 価格 → 間取り・建物・土地 → 学区 → タグ。
 * ボタン（物件を詳しく見る・資料請求・この物件で申し込む）と「この家の特徴」は出さない。カード全体を押すと物件ページ（rh/js/rh-pcard.js）。
 * rh-property.css（試作から写したもの）の上書き。行の高さをそろえる subgrid はそのまま、行の数を 7 に
 */
html .rh-pcard { grid-row: span 7; cursor: pointer; }
html .rh-pcard__media { grid-row: 1; }
html .rh-pcard__place { grid-row: 2; }
html .rh-pcard__title { grid-row: 3; }
html .rh-pcard__amount { grid-row: 4; }
html .rh-pcard__facts { grid-row: 5; }
html .rh-pcard__school { grid-row: 6; }
html .rh-pcard__tags { grid-row: 7; }

html .rh-pcard__place { margin: 16px 0 0; color: var(--rh-text); font-family: var(--rh-sans); font-size: 13px; font-weight: 500; line-height: 1.5; letter-spacing: .02em; }
html .rh-pcard__place b { display: block; margin-top: 2px; font-size: 20px; font-weight: 700; line-height: 1.4; }
html .rh-pcard__place a { color: inherit; }
html .rh-pcard__title { margin: 6px 0 0; font-size: 14px; font-weight: 500; line-height: 1.6; letter-spacing: .02em; color: var(--rh-gray); }
html .rh-pcard__title a { color: inherit; }
html .rh-pcard__amount { margin: 12px 0 0; padding: 0; border: 0; }
html .rh-pcard__facts { margin: 10px 0 0; padding-top: 10px; border-top: 1px solid var(--rh-line); }
html .rh-pcard__facts dd { font-size: 15px; }
html .rh-pcard__school { margin-top: 8px; }
html .rh-pcard__tags { margin-top: 10px; }
html .rh-pcard__tags li { font-size: 12px; }

/* 写真の枠：横になでる写真送りだけ。縦には動かさない（ホバーで写真を大きくしたとき、枠の中が縦にスクロールしていた） */
html .rh-pcard__media .rh-slider__track { overflow-y: hidden; }   /* 縦のはみ出しだけ止める。ページの上下スクロールは止めない（overscroll-behavior を付けると写真の上でページが動かなくなった） */
html .rh-pcard__media .rh-slider__slide, html .rh-pcard__media .rh-slider__slide a { overflow: hidden; }

/* ホバー：カードのどこにいても、写真を少し大きく・号地名を青に・ひとことに下線（全体の決まりと同じ） */
@media (hover: hover) {
  html .rh-pcard:hover .rh-pcard__place b, html .rh-pcard:hover .rh-pcard__place a { color: var(--rh-blue); }
  html .rh-pcard:hover .rh-pcard__title a, html .rh-pcard:hover h3.rh-pcard__place a { text-decoration: underline; text-underline-offset: 3px; }
  html .rh-pcard:hover .rh-pcard__media img { transform: scale(1.03); }
  html .rh-pcard__media img { transition: transform .4s ease; }
}
@media (prefers-reduced-motion: reduce) { html .rh-pcard__media img { transition: none; } html .rh-pcard:hover .rh-pcard__media img { transform: none; } }
@media (max-width: 767px) {
  html .rh-pcard__place b { font-size: 19px; }
}

/* 間取り・建物・土地は1行に詰める（「3LDK｜建物 87.36㎡｜土地 271.96㎡」）。間取りの見出しは省く */
html .rh-pcard__facts { display: flex; flex-wrap: wrap; gap: 2px 0; }
html .rh-pcard__facts div { display: flex; align-items: baseline; gap: 5px; padding: 0 12px; }
html .rh-pcard__facts div:first-child { padding-left: 0; }
html .rh-pcard__facts dd { margin: 0; }
html .rh-pcard__facts div:first-child dt { display: none; }
/* タグは1行だけ。入りきらない分は右端で薄く消える */
html .rh-pcard__tags { flex-wrap: nowrap; overflow: hidden; -webkit-mask-image: linear-gradient(90deg, #000 85%, transparent); mask-image: linear-gradient(90deg, #000 85%, transparent); }
html .rh-pcard__tags li { flex: none; }

/* カードの見出し（清水 10/18）：ひとことを大きく（2行まで。3行目からは「…」）、エリア／物件名は1行の小さな太字に */
html .rh-pcard__place { font-size: 13px; font-weight: 700; color: var(--rh-text); }
html .rh-pcard__place b { display: inline; margin: 0; font-size: inherit; font-weight: inherit; }
html .rh-pcard__place b::before { content: "／"; margin: 0 .25em; color: var(--rh-gray); font-weight: 400; }
html h3.rh-pcard__place { font-size: 20px; line-height: 1.45; }   /* ひとことが無い物件は、物件名を見出しの大きさで */
html h3.rh-pcard__place b::before { content: none; }
html h3.rh-pcard__place b { display: block; }
html .rh-pcard .rh-pcard__title { margin-top: 6px; font-size: 20px; font-weight: 700; line-height: 1.5; color: var(--rh-text); display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; word-break: auto-phrase; }
@media (max-width: 767px) { html .rh-pcard .rh-pcard__title, html h3.rh-pcard__place { font-size: 18px; } }
