/* 在售物件 — 列表與詳情頁樣式，延續 site.css 的色彩與字級 token */

.lst-head{padding:clamp(70px,9vw,110px) 0 0}
.lst-head .sec-head{margin-bottom:0}
.lst-count{font-family:var(--sans);font-size:.74rem;letter-spacing:.2em;color:var(--text-mute);margin-top:18px}

.lst-wrap{padding:44px 0 clamp(70px,9vw,110px)}
.lst-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(310px,1fr));gap:clamp(22px,3vw,34px)}

.lst-card{
  display:flex;flex-direction:column;text-decoration:none;color:inherit;
  border:1px solid var(--line);border-radius:2px;overflow:hidden;
  background:var(--panel);transition:border-color .3s ease,transform .3s ease;
}
.lst-card:hover{border-color:var(--accent);transform:translateY(-3px)}
.lst-card:focus-visible{outline:2px solid var(--accent);outline-offset:3px}

/* 無照片時襯品牌米白底，讓藏藍 A mark 保有對比 */
.lst-photo{position:relative;aspect-ratio:4/3;overflow:hidden;
  background:radial-gradient(84% 64% at 50% 40%, rgba(198,160,82,.13), transparent 64%),var(--cream)}
.lst-photo img{width:100%;height:100%;object-fit:cover;display:block}
.lst-photo .ph{position:absolute;inset:0;display:grid;place-items:center}
.lst-photo .ph img{width:72px;height:auto;opacity:.92}
.lst-photo .ph::after{content:"";position:absolute;inset:14px;border:1px solid rgba(27,42,74,.16)}

.lst-badge{
  position:absolute;top:14px;left:14px;z-index:2;
  font-family:var(--sans);font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;
  padding:6px 11px;border-radius:2px;background:var(--accent);color:var(--navy);font-weight:600;
}
/* 有實景影片的標記 */
.lst-vidmark{position:absolute;top:14px;right:14px;z-index:2;
  font-family:var(--sans);font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;
  padding:5px 10px;border-radius:2px;color:var(--cream);font-weight:600;
  background:rgba(20,32,58,.72);backdrop-filter:blur(4px)}

.lst-badge[data-status="reserved"]{background:#8A7A5C;color:var(--cream)}
.lst-badge[data-status="sold"]{background:rgba(0,0,0,.55);color:#C9CEDA}

.lst-body{padding:24px 24px 26px;display:flex;flex-direction:column;flex:1}
.lst-area{font-family:var(--sans);font-size:.68rem;letter-spacing:.22em;color:var(--accent-strong);text-transform:uppercase}
.lst-estate{font-family:var(--serif);font-size:1.3rem;font-weight:600;margin:9px 0 0;line-height:1.4}
.lst-headline{color:var(--text-soft);font-size:.9rem;margin:9px 0 0}

.lst-price{font-family:var(--serif);font-size:1.72rem;font-weight:600;color:var(--text);margin:18px 0 0;letter-spacing:.02em}
.lst-price small{font-size:.86rem;font-weight:400;margin-left:.35em;color:var(--text-mute)}
.lst-price.ask{font-size:1.24rem;color:var(--text-soft)}

.lst-meta{display:flex;flex-wrap:wrap;gap:8px 20px;margin-top:16px;padding-top:16px;border-top:1px solid var(--line)}
.lst-meta div{font-family:var(--sans);font-size:.8rem;color:var(--text-soft)}
.lst-meta b{font-weight:600;color:var(--text)}

.lst-tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:16px}
.lst-tag{font-family:var(--sans);font-size:.68rem;letter-spacing:.06em;color:var(--text-mute);
  border:1px solid var(--line);border-radius:2px;padding:4px 9px}

.lst-more{margin-top:auto;padding-top:20px;font-family:var(--sans);font-size:.76rem;
  letter-spacing:.14em;color:var(--accent-strong)}

.lst-card[data-status="sold"] .lst-photo,
.lst-card[data-status="sold"] .lst-price{opacity:.55}

/* 手機版：壓低照片高度，讓價格與行動點更快進入視線 */
@media(max-width:600px){
  .lst-photo{aspect-ratio:16/10}
  .lst-body{padding:20px 20px 22px}
  .lst-price{font-size:1.92rem;margin-top:14px}
  .lst-meta{gap:6px 16px;margin-top:14px;padding-top:14px}
  .lst-more{margin-top:18px;padding:12px 0 0;text-align:center;
    border-top:1px solid var(--line);letter-spacing:.16em}
}

.lst-empty{border:1px dashed var(--line);border-radius:2px;padding:60px 30px;text-align:center;color:var(--text-mute)}

/* ---- 詳情頁 ---- */
.dtl{padding:clamp(64px,8vw,96px) 0 0}
.dtl-back{font-family:var(--sans);font-size:.76rem;letter-spacing:.12em;color:var(--text-mute);
  text-decoration:none;display:inline-block;margin-bottom:26px}
.dtl-back:hover{color:var(--accent-strong)}

.dtl-hero{border-radius:2px;overflow:hidden;position:relative;
  display:grid;place-items:center;min-height:clamp(280px,42vw,520px);
  background:radial-gradient(76% 68% at 50% 42%, rgba(198,160,82,.13), transparent 64%),var(--cream);
  margin-bottom:clamp(30px,4vw,46px)}
/* 詳情頁必須完整顯示物件照片。原本 16:9 + cover 會把直式房產照上下裁掉。 */
.dtl-hero>img{display:block;width:auto;height:auto;max-width:100%;max-height:min(82vh,920px);object-fit:contain;margin:auto}
.dtl-hero .ph{position:absolute;inset:0;display:grid;place-items:center}
.dtl-hero .ph img{width:104px;height:auto;opacity:.92}
.dtl-hero .ph::after{content:"";position:absolute;inset:20px;border:1px solid rgba(27,42,74,.16)}

.dtl-thumbs{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px;margin:-24px 0 clamp(30px,4vw,46px)}
.dtl-thumbs button{padding:0;border:1px solid var(--line);border-radius:2px;overflow:hidden;
  background:none;cursor:pointer;aspect-ratio:4/3;transition:border-color .25s}
.dtl-thumbs button[aria-current="true"],.dtl-thumbs button:hover{border-color:var(--accent)}
.dtl-thumbs img{width:100%;height:100%;object-fit:contain;display:block;background:var(--cream)}

/* ---- 實景影片 ----
   點擊前只有封面與播放鍵，不載入播放器 */
.dtl-video{margin:0 0 clamp(30px,4vw,46px)}
.dv-frame{position:relative;aspect-ratio:16/9;border-radius:2px;overflow:hidden;
  background:radial-gradient(76% 68% at 50% 42%, rgba(198,160,82,.13), transparent 64%),var(--cream)}
.dv-frame.no-poster .ph{position:absolute;inset:0;display:grid;place-items:center}
.dv-frame.no-poster .ph img{width:104px;height:auto;opacity:.5}
.dv-poster{width:100%;height:100%;object-fit:cover;display:block}
.dv-player{width:100%;height:100%;border:0;display:block;background:#000}

.dv-play{
  position:absolute;inset:0;width:100%;height:100%;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;
  background:linear-gradient(180deg,rgba(20,32,58,.18),rgba(20,32,58,.42));
  border:0;cursor:pointer;color:var(--cream);
  font-family:var(--sans);font-size:.8rem;letter-spacing:.18em;
  transition:background .3s ease;
}
.dv-play:hover{background:linear-gradient(180deg,rgba(20,32,58,.28),rgba(20,32,58,.55))}
.dv-play:focus-visible{outline:2px solid var(--accent);outline-offset:-4px}
.dv-play svg{width:62px;height:62px;color:var(--gold-lt);transition:transform .3s ease}
.dv-play:hover svg{transform:scale(1.06)}
@media(prefers-reduced-motion:reduce){.dv-play svg{transition:none}.dv-play:hover svg{transform:none}}
.dtl-video figcaption{font-family:var(--sans);font-size:.74rem;letter-spacing:.14em;
  color:var(--text-mute);margin-top:12px;text-align:center}

/* 單檔預覽版無法載入外部播放器時的說明 */
.dv-unavailable{position:absolute;inset:0;display:grid;place-items:center;text-align:center;
  padding:24px;font-family:var(--sans);font-size:.8rem;line-height:1.8;color:var(--text-mute)}

.dtl-grid{display:grid;grid-template-columns:1.35fr .8fr;gap:clamp(34px,5vw,64px);align-items:start}
@media(max-width:880px){.dtl-grid{grid-template-columns:1fr}}

.dtl-title{font-family:var(--serif);font-size:clamp(1.8rem,4vw,2.6rem);font-weight:600;margin:6px 0 10px;line-height:1.3}
.dtl-headline{color:var(--text-soft);font-size:1rem;margin:0 0 30px}

.dtl-spec{width:100%;border-collapse:collapse;margin-bottom:34px}
.dtl-spec th,.dtl-spec td{text-align:left;padding:13px 0;border-bottom:1px solid var(--line);font-size:.92rem;vertical-align:baseline}
.dtl-spec th{font-family:var(--sans);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--text-mute);font-weight:600;width:38%}
.dtl-spec td b{font-family:var(--serif);font-size:1.06rem;font-weight:600}
.dtl-spec td small{color:var(--text-mute);margin-left:.5em;font-size:.8rem}

.dtl-sec-t{font-family:var(--sans);font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;
  color:var(--accent-strong);margin:0 0 16px}
.dtl-notes{list-style:none;padding:0;margin:0 0 34px}
.dtl-notes li{position:relative;padding-left:20px;margin-bottom:11px;color:var(--text-soft);font-size:.92rem;line-height:1.75}
.dtl-notes li::before{content:"";position:absolute;left:0;top:.72em;width:8px;height:1px;background:var(--accent)}

.dtl-aside{position:sticky;top:96px;border:1px solid var(--line);border-radius:2px;
  padding:30px 28px;background:var(--panel)}
/* 手機版：價格與行動按鈕移到規格表前面 */
@media(max-width:880px){.dtl-aside{position:static;order:-1;margin-bottom:10px}}
.dtl-aside .lab{font-family:var(--sans);font-size:.66rem;letter-spacing:.22em;text-transform:uppercase;color:var(--text-mute)}
.dtl-aside .amt{font-family:var(--serif);font-size:2.1rem;font-weight:600;margin:8px 0 0;letter-spacing:.02em}
.dtl-aside .amt small{font-size:.9rem;font-weight:400;color:var(--text-mute);margin-left:.35em}
.dtl-aside .unit{font-family:var(--sans);font-size:.8rem;color:var(--text-soft);margin:12px 0 0;
  padding-top:14px;border-top:1px solid var(--line)}
.dtl-aside .unit b{font-weight:600;color:var(--text)}
.dtl-aside .btn{width:100%;justify-content:center;margin-top:22px}
.dtl-aside .tel{display:block;text-align:center;font-family:var(--serif);font-size:1.02rem;
  margin-top:14px;color:var(--text);text-decoration:none;letter-spacing:.04em}
.dtl-aside .tel:hover{color:var(--accent-strong)}

/* ---- 廣告揭露列 ---- */
.lst-disclosure{border-top:1px solid var(--line);margin-top:clamp(50px,7vw,80px);padding:26px 0 0}
.lst-disclosure dl{display:flex;flex-wrap:wrap;gap:10px 34px;margin:0 0 16px}
.lst-disclosure dt{font-family:var(--sans);font-size:.85rem;letter-spacing:.04em;text-transform:uppercase;color:var(--text-mute)}
.lst-disclosure dd{margin:0 0 0 .7em;font-size:.95rem;color:var(--text-soft)}
.lst-disclosure dl>div{display:flex;align-items:baseline}
.lst-disclosure p{font-family:var(--sans);font-size:.72rem;line-height:1.75;color:var(--text-mute);max-width:74ch;margin:0}
.lst-disclosure .lst-basis{font-size:.82rem;color:var(--text-soft);font-weight:600;
  letter-spacing:.02em;margin-bottom:10px}

/* 照片尚未補齊時的說明：講清楚狀態並給下一步，而不是留一個半成品的空格 */
.ph-label{position:absolute;left:0;right:0;bottom:24px;text-align:center;
  display:flex;flex-direction:column;align-items:center;gap:9px}
.ph-label b{font-family:var(--sans);font-size:.66rem;font-weight:600;letter-spacing:.22em;
  color:rgba(27,42,74,.5)}
.ph-label em{font-style:normal;font-family:var(--serif);font-size:.88rem;letter-spacing:.06em;
  color:var(--navy);padding-top:9px;position:relative}
.ph-label em::before{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);
  width:26px;height:1px;background:var(--accent);opacity:.75}
.dtl-hero .ph-label{bottom:32px}
.dtl-hero .ph-label b{font-size:.7rem}
.dtl-hero .ph-label em{font-size:1rem}
@media(max-width:600px){
  .ph-label{bottom:16px;gap:7px}
  .ph-label b{font-size:.6rem;letter-spacing:.18em}
}

/* 缺點區塊：與特色區分開，用金線改為警示灰 */
.dtl-notes.caution li::before{background:var(--text-mute)}

.dtl-aside .btn+.btn{margin-top:10px}
