/*
 * 共通公園カルテカード。
 * トップ、一覧、検索、関連記事で同じ見た目を使う。
 */
.park-card { position: relative; overflow: hidden; min-width: 0; background: #fff; border: 1px solid var(--okt-line); border-top: 4px solid var(--okt-green); border-radius: 24px; box-shadow: var(--okt-shadow); transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.park-card::after { content: ""; position: absolute; right: -34px; top: -34px; width: 110px; height: 110px; border: 1px solid rgba(11,107,58,.10); border-radius: 50%; pointer-events: none; }
.park-card:hover { transform: translateY(-5px); border-color: rgba(11,107,58,.35); box-shadow: 0 18px 44px rgba(24,53,35,.14); }
.park-card__link { display: flex; min-height: 100%; flex-direction: column; color: inherit; text-decoration: none; }
.park-card__topline { display: flex; min-height: 76px; align-items: center; gap: 12px; padding: 18px 24px 10px; border-bottom: 1px solid rgba(11,107,58,.08); }
.park-card__pin { position: relative; width: 28px; height: 28px; flex: 0 0 auto; border: 7px solid var(--okt-green); border-radius: 50% 50% 50% 0; transform: rotate(-45deg); }
.park-card__pin::after { content: ""; position: absolute; inset: 4px; border-radius: 50%; background: var(--okt-green); }
.park-card__area { min-width: 0; color: var(--okt-green); font-size: .74rem; font-weight: 800; letter-spacing: .12em; }
.park-card__type { margin-left: auto; padding: 5px 9px; border: 1px solid rgba(11,107,58,.22); border-radius: 999px; color: var(--okt-green-dark); background: var(--okt-green-pale); font-size: .66rem; font-weight: 800; letter-spacing: .08em; white-space: nowrap; }
.park-card__rank { margin-left: auto; display: grid; place-items: center; width: 50px; height: 50px; flex: 0 0 auto; border-radius: 50%; background: var(--okt-green-pale); color: var(--okt-green-dark); font-size: 1.25rem; font-weight: 900; line-height: 1; }
.park-card__rank small { display: block; font-size: .46rem; letter-spacing: .08em; }
.park-card__rank + .park-card__type { margin-left: 0; }
.park-card__body { flex: 1; min-width: 0; padding: 8px 24px 30px; }
.park-card__edition { display: flex; align-items: baseline; gap: 10px; margin: 0 0 12px !important; color: var(--okt-green-dark) !important; }
.park-card__edition span { font-family: Georgia, "Times New Roman", serif; font-size: .68rem; font-weight: 700; letter-spacing: .14em; }
.park-card__edition small { color: var(--okt-muted); font-size: .66rem; }
.park-card__body h3 { position: relative; margin: 0; padding-bottom: 17px; overflow-wrap: anywhere; font-family: "Hiragino Mincho ProN", "Yu Mincho", serif; font-size: clamp(1.35rem, 2.6vw, 1.85rem); line-height: 1.35; letter-spacing: -.025em; }
.park-card__body h3::after { content: ""; position: absolute; left: 0; bottom: 0; width: 34px; height: 2px; background: var(--okt-green); }
.park-card__body > p:not(.park-card__edition):not(.park-card__no-tags) { margin: 15px 0 0; color: var(--okt-muted); font-size: .94rem; line-height: 1.85; }
.park-card__facilities { margin-top: 22px; padding-top: 17px; border-top: 1px dashed var(--okt-line); }
.park-card__facilities-label { margin: 0 0 10px !important; color: var(--okt-green-dark) !important; font-size: .7rem !important; font-weight: 800; letter-spacing: .12em; }
.park-card__facilities-label::before { content: "CHECK  "; color: rgba(11,107,58,.55); font-family: Georgia, "Times New Roman", serif; }
.park-card__tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.park-card__tags li { display: inline-flex; align-items: center; gap: 6px; padding: 8px 13px 8px 8px; border: 1px solid #d5e1d8; border-radius: 999px; background: #fff; color: #445148; font-size: .72rem; font-weight: 700; box-shadow: 0 2px 0 rgba(11,107,58,.04); }
.park-card__tags li span { display: inline-grid; width: 29px; height: 29px; place-items: center; border-radius: 50%; background: var(--okt-green-pale); color: var(--okt-green-dark); font-size: .66rem; font-weight: 900; }
.park-card__no-tags { margin-top: 22px !important; padding-top: 16px; border-top: 1px dashed var(--okt-line); color: var(--okt-muted); font-size: .78rem !important; }
.park-card__footer { position: relative; display: flex; min-height: 88px; align-items: center; gap: 11px; overflow: hidden; padding: 20px 24px; background: var(--okt-green-dark); color: #fff; }
.park-card__footer::after { content: "STREET VIEW"; position: absolute; right: 62px; bottom: -2px; color: rgba(255,255,255,.06); font-family: Georgia, "Times New Roman", serif; font-size: 2rem; font-weight: 700; letter-spacing: .06em; pointer-events: none; }
.park-card__cta-copy, .park-card__arrow, .park-card__streetview { position: relative; z-index: 1; }
.park-card__cta-copy { display: grid; min-width: 0; gap: 1px; }
.park-card__cta-copy small { margin-bottom: 3px; color: rgba(255,255,255,.66); font-size: .65rem; font-weight: 700; letter-spacing: .08em; }
.park-card__cta-copy strong { color: #fff; font-size: .95rem; letter-spacing: .02em; }
.park-card__streetview { display: grid; width: 26px; height: 26px; flex: 0 0 auto; place-items: center; color: #bce1c8; }
.park-card__streetview svg { width: 22px; height: 22px; fill: currentColor; }
.park-card__arrow { display: grid; width: 34px; height: 34px; flex: 0 0 auto; margin-left: auto; place-items: center; border: 1px solid rgba(255,255,255,.35); border-radius: 50%; font-size: 1.25rem; transition: transform .2s ease; }
.park-card:hover .park-card__footer { background: var(--okt-green); }
.park-card:hover .park-card__arrow { transform: translateX(4px); }

@media (max-width: 640px) {
	.park-card__type { display: none; }
	.park-card__topline, .park-card__body, .park-card__footer { padding-right: 20px; padding-left: 20px; }
	.park-card__edition { align-items: flex-start; flex-direction: column; gap: 2px; }
	.park-card__footer::after { display: none; }
}
