/* Shared property cards: the surface owns the cut-out, while the link stays outside
   the mask. The transparent corner works on every section background. */
body.reference-design .homelengo-box.property-card {
  display:block;position:relative;min-width:0;height:100%;padding:0;margin-bottom:0;
  border:0;border-radius:20px;background:transparent;overflow:visible;
  box-shadow:none;transform:none;transition:filter .25s;
}
body.reference-design .homelengo-box.property-card:hover,
body.reference-design .homelengo-box.property-card:focus-within {
  transform:none;box-shadow:none;filter:drop-shadow(0 8px 12px #102c4612);
}
body.reference-design .homelengo-box.property-card::after {
  content:"";position:absolute;right:0;bottom:0;width:80px;height:80px;pointer-events:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 80'%3E%3Cpath fill='none' stroke='%23e4e4e4' d='M79.5 0V8C79.5 16.561 72.561 23.5 64 23.5H56C38.051 23.5 23.5 38.051 23.5 56V64C23.5 72.561 16.561 79.5 8 79.5H0'/%3E%3C/svg%3E") center / contain no-repeat;
}
body.reference-design .property-card-surface {
  display:flex;flex-direction:column;min-width:0;height:100%;
  background:#fff;border:1px solid var(--ui-line);border-radius:20px;overflow:hidden;
  mask:
    linear-gradient(#000 0 0) top left / 100% calc(100% - 80px) no-repeat,
    linear-gradient(#000 0 0) bottom left / calc(100% - 80px) 80px no-repeat,
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 80'%3E%3Cpath fill='white' d='M0 0H80V8C80 16.837 72.837 24 64 24H56C38.327 24 24 38.327 24 56V64C24 72.837 16.837 80 8 80H0Z'/%3E%3C/svg%3E") bottom right / 80px 80px no-repeat;
}
body.reference-design .homelengo-box.property-card .archive-top {position:relative;min-width:0;flex-shrink:0}
body.reference-design .homelengo-box.property-card .images-group {display:block;width:100%}
body.reference-design .homelengo-box.property-card .images-style {aspect-ratio:1.526;max-height:none}
body.reference-design .homelengo-box.property-card .images-style img {display:block;width:100%;height:100%;object-fit:cover}
body.reference-design .homelengo-box.property-card .archive-bottom {display:flex;flex-direction:column;flex:1;min-width:0;padding:20px 20px 16px}
body.reference-design .homelengo-box.property-card .content-top {min-width:0;padding:0;margin:0 0 10px;border:0}
body.reference-design .homelengo-box.property-card :is(h2,h3,.card-title),
body.reference-design .map-results .homelengo-box.property-card :is(h2,h3,.card-title) {
  display:block;min-height:0;margin:0 0 9px;font-size:18px!important;
  line-height:1.35!important;font-weight:600!important;letter-spacing:0;
  white-space:normal;text-wrap:wrap;overflow-wrap:anywhere;-webkit-line-clamp:unset;
}
body.reference-design .homelengo-box.property-card .card-title a:hover {color:#9c793f}
body.reference-design .homelengo-box.property-card .meta-list {
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;
  margin:0;padding:0;white-space:normal;font-size:11px;
}
body.reference-design .homelengo-box.property-card .meta-list .item {
  display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:4px;
  min-width:0;padding:6px 4px;background:#faf7f1;border:1px solid #c5a46b42;
  border-radius:8px;line-height:1.5;color:var(--walin-navy);
}
body.reference-design .homelengo-box.property-card .meta-list .walin-icon {width:15px;height:15px;color:#a08047;flex-shrink:0}
body.reference-design .homelengo-box.property-card .content-bottom,
body.reference-design .map-results .homelengo-box.property-card .content-bottom {
  display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;
  flex-wrap:nowrap;gap:8px;min-height:0;margin-top:auto;padding:0 56px 0 0;border:0;
}
body.reference-design .homelengo-box.property-card .price,
body.reference-design .map-results .homelengo-box.property-card .price {
  display:block;max-width:100%;margin:0;color:#9c793f;text-align:left;
  font-size:18px;line-height:1.35;font-weight:600;white-space:normal;overflow-wrap:anywhere;
}
body.reference-design .homelengo-box.property-card .content-bottom>div,
body.reference-design .map-results .homelengo-box.property-card .content-bottom>div {display:flex!important;min-width:0;gap:8px;font-size:12px;color:var(--walin-muted)}
body.reference-design .homelengo-box.property-card .avatar {width:24px;min-width:24px;height:24px;flex:0 0 24px;border:1px solid #c5a46b66}
body.reference-design .homelengo-box.property-card .avatar img {width:100%;height:100%;object-fit:cover}
body.reference-design .property-card-open {
  position:absolute;right:2px;bottom:2px;z-index:2;display:grid;place-items:center;
  width:44px;height:44px;min-width:44px;padding:0;border:1px solid var(--walin-navy);
  border-radius:50%;background:var(--walin-navy);color:#fff;
  transition:background .2s,border-color .2s,color .2s;
}
/* Its centre matches the 32px notch radius: a 22px button radius leaves 10px clear. */
body.reference-design .property-card-open .walin-icon {width:20px;height:20px;stroke-width:1.8;transition:transform .2s}
body.reference-design .property-card-open:hover {background:var(--walin-gold);border-color:var(--walin-gold);color:var(--walin-deep)}
body.reference-design .property-card-open:hover .walin-icon {transform:translateX(2px)}
body.reference-design .property-card-open:focus-visible {outline:3px solid var(--walin-gold);outline-offset:3px}
body.reference-design .homelengo-box.property-card .flag-tag {height:28px;display:inline-flex;align-items:center;padding:0 10px;border-radius:99px;font-size:12px;letter-spacing:0}
body.reference-design .homelengo-box.property-card .flag-tag.primary {background:var(--walin-gold);color:#fff}
body.reference-design .homelengo-box.property-card .reference-save {width:36px;height:36px;display:grid;place-items:center;border-radius:50%;padding:0}
body.reference-design .reference-save .walin-icon {width:20px;height:20px}
body.reference-design .reference-save[aria-pressed=true] .walin-icon {fill:currentColor}

/* List mode uses the same surface and corner without placing text under the image. */
body.reference-design .property-grid.list-layout .homelengo-box.property-card {display:block}
body.reference-design .list-layout .property-card-surface {display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);align-items:stretch}
body.reference-design .list-layout .homelengo-box.property-card .archive-top {width:100%;min-height:220px;height:auto;overflow:hidden}
body.reference-design .list-layout .homelengo-box.property-card .images-group,
body.reference-design .list-layout .homelengo-box.property-card .images-style {position:absolute;inset:0;width:100%;height:100%;min-width:0;min-height:0;max-width:100%;aspect-ratio:auto}
body.reference-design .list-layout .homelengo-box.property-card .archive-bottom {justify-content:space-between;padding:20px 20px 16px;gap:10px}
body.reference-design .list-layout .homelengo-box.property-card .card-title {min-height:0;overflow:visible;text-overflow:clip}
body.reference-design .list-layout .homelengo-box.property-card .meta-list {max-width:460px;margin:0}
@media(max-width:900px) and (min-width:701px) {
  body.reference-design .list-layout .property-card-surface {grid-template-columns:minmax(0,260px) minmax(0,1fr)}
}
@media(max-width:700px) {
  body.reference-design .list-layout .property-card-surface {display:flex}
  body.reference-design .list-layout .homelengo-box.property-card .archive-top {min-height:0;aspect-ratio:1.526}
  body.reference-design .list-layout .homelengo-box.property-card .archive-bottom {gap:0;padding:20px 20px 16px}
}
@media(max-width:380px) {
  body.reference-design .homelengo-box.property-card .archive-bottom,
  body.reference-design .list-layout .homelengo-box.property-card .archive-bottom {padding:16px 16px 14px}
  body.reference-design .homelengo-box.property-card .meta-list {gap:5px;font-size:10px}
  body.reference-design .homelengo-box.property-card .meta-list .walin-icon {width:13px;height:13px}
  body.reference-design .homelengo-box.property-card .price {font-size:17px}
}
@media(prefers-reduced-motion:reduce) {
  body.reference-design :is(.property-card,.property-card-open,.property-card-open .walin-icon) {transition:none}
  body.reference-design .property-card-open:hover .walin-icon {transform:none}
}