/* ===== Карточки резидента: плоский линейный стиль GRITZ ===== */
.pc, .gh { fill: none; stroke: currentColor; }
.pc path, .gh path { fill: none; stroke: currentColor; stroke-width: 2; stroke-linejoin: round; vector-effect: non-scaling-stroke; }

.rack { margin-top: clamp(32px, 4vw, 56px); display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: clamp(14px, 2vw, 24px); }
.rack > .fob { grid-column: span 2; }
/* два блока жилья в третьем ряду: каждый стоит на стыке двух колонок и симметричен второму */
.rack > .fob:nth-child(7) { grid-column: 2 / span 2; }
.rack > .fob:nth-child(8) { grid-column: 4 / span 2; }
/* длинные названия карточек жилья: меньший кегль, чтобы карточки 7 и 8 были ровно такой же высоты */
.rack > .fob:nth-child(n+7) .id__f--name b { font-size: clamp(15px, 4.2cqw, 19px); }
.rack { grid-auto-rows: 1fr; } .rack > .fob { display: flex; } .rack > .fob > .fob__body { flex: 1; display: flex; flex-direction: column; }
.rack__note { margin-top: 24px; font-size: 14px; line-height: 1.5; color: var(--on-navy); }

.fob, .twin { --edge: var(--navy); position: relative; display: flex; color: var(--navy); }
.fob__body, .twin { flex: 1; display: flex; flex-direction: column; min-width: 0; border-radius: 12px; background: #fff; border: 1.5px solid #fff; box-shadow: inset 0 0 0 1.5px var(--edge); }
.fob { transition: transform .45s var(--ease), box-shadow .45s var(--ease); }
.fob:focus-visible { transform: translateY(-4px); }
@media (hover: hover) { .fob:hover { transform: translateY(-4px); } }
.fob:focus-visible { outline-offset: 5px; border-radius: 12px; }

.id__head { display: flex; align-items: center; gap: 10px; padding: 11px 16px; border-bottom: 1.5px solid var(--edge); }
.id__es { flex: none; display: inline-grid; place-items: center; width: 30px; height: 22px; border-radius: 3px; box-shadow: inset 0 0 0 1.5px var(--edge); font-family: var(--display); font-weight: 800; font-size: 11px; letter-spacing: .04em; }
.id__title { display: flex; flex-direction: column; gap: 1px; font-family: var(--display); font-weight: 600; font-size: 11px; line-height: 1.15; letter-spacing: .06em; text-transform: uppercase; min-width: 0; }
.id__title b { font-weight: 800; font-size: 12.5px; letter-spacing: .16em; }
.fob__n { margin-left: auto; font-family: var(--display); font-weight: 800; font-size: 20px; line-height: 1; font-variant-numeric: tabular-nums; }

.id__main { flex: 1; display: grid; grid-template-columns: minmax(0, 34%) minmax(0, 1fr); gap: 16px; padding: 16px; }
.id__side { display: flex; flex-direction: column; gap: 14px; }
.id__photo { position: relative; display: block; width: 100%; max-width: 100%; min-width: 0; height: 0; padding: 0 0 100%; overflow: hidden; box-shadow: inset 0 0 0 1.5px var(--edge); color: var(--navy); transition: background-color .35s var(--ease), color .35s var(--ease); }
.id__photo svg { position: absolute; inset: 9%; width: 82%; height: 82%; }
.id__side { min-width: 0; }
.id__meta { display: flex; align-items: center; gap: 12px; }
.id__chip { flex: none; width: 34px; height: 26px; border-radius: 4px; box-shadow: inset 0 0 0 1.5px var(--edge);
  background: linear-gradient(90deg, #0000 33%, var(--edge) 33% calc(33% + 1.5px), #0000 0 calc(66% - 1.5px), var(--edge) calc(66% - 1.5px) 66%, #0000 0), linear-gradient(0deg, #0000 calc(50% - .75px), var(--edge) calc(50% - .75px) calc(50% + .75px), #0000 0); }
.id__ghost { display: block; width: 30px; height: 30px; opacity: .4; }
.id__ghost svg { width: 100%; height: 100%; }
.id__ghost path { stroke-width: 1.2; }

.id__data { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.id__f { display: block; min-width: 0; }
.id__f i { display: block; font-style: normal; font-size: 11px; font-weight: 600; line-height: 1.3; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.id__f b { display: block; margin-top: 3px; font-size: 14px; font-weight: 600; line-height: 1.4; text-wrap: pretty; }
.id__f--name { padding-bottom: 10px; border-bottom: 1.5px solid var(--edge); }
.id__f--name b { font-family: var(--display); font-weight: 800; font-size: clamp(20px, 5.6cqw, 26px); line-height: 1.1; letter-spacing: -.015em; text-wrap: balance; }
.fob__name { margin: 0; }
.id__f--price.is-text b { font-family: var(--font); font-weight: 600; font-size: 14px; letter-spacing: 0; }
.id__f--price b { font-family: var(--display); font-weight: 800; font-size: 17px; line-height: 1.25; letter-spacing: -.01em; font-variant-numeric: tabular-nums; }
.id__go { margin-top: auto; align-self: flex-end; display: inline-flex; align-items: center; gap: 6px; color: var(--navy); }
.fob__label { font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.id__go i { display: inline-flex; transition: transform .35s var(--ease); }
.id__go svg { width: 16px; height: 16px; }
.fob:focus-visible .id__go i, .fob.is-tap .id__go i { transform: translateX(4px); }
@media (hover: hover) { .fob:hover .id__go i { transform: translateX(4px); } }

/* при наведении фигура «заливается» синим — единственный акцент карточки */
.fob { -webkit-tap-highlight-color: transparent; }
.fob:focus-visible .id__photo, .fob:active .id__photo, .fob.is-tap .id__photo { background: var(--navy); color: #fff; }
@media (hover: hover) { .fob:hover .id__photo { background: var(--navy); color: #fff; } }
/* на телефоне нажатие = то же синее состояние, что наведение на компьютере */
.fob.is-tap { transform: translateY(-2px); }
.fob__body { container-type: inline-size; }

/* единственный авторский момент главной: карточки раскладываются на доске одна за другой */
.hero .fob { animation: deal 1s var(--ease) backwards; animation-delay: calc(var(--i, 0) * 90ms + 420ms); }
@keyframes deal { from { opacity: 0; transform: translateY(40px) rotate(1.4deg); } }

/* ===== Пара «ВНЖ» + «Жильё» ===== */
.bundle__art { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(12px, 2vw, 20px); align-items: start; }
.twin { --edge: var(--navy); border: 1.5px solid transparent; box-shadow: inset 0 0 0 1.5px var(--edge); }
.twin--b { margin-top: clamp(20px, 3vw, 40px); }
.twin__main { display: flex; flex-direction: column; gap: 22px; padding: 18px 16px 16px; }
.twin__main b { font-family: var(--display); font-weight: 800; font-size: clamp(30px, 4.2vw, 46px); line-height: 1; letter-spacing: -.02em; }
.twin__row { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.twin__label { font-size: 12px; font-weight: 600; line-height: 1.3; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); text-align: right; }

/* ===== Мини-карточка в блоке контактов ===== */
.close__key { position: absolute; z-index: 2; top: -54px; right: clamp(16px, 4%, 36px); width: 76px; rotate: 5deg; pointer-events: none; }
.mini { position: relative; display: block; padding: 10px 10px 32px; border-radius: 10px; background: #fff; box-shadow: inset 0 0 0 1.5px var(--navy); }
.mini__pic { position: relative; display: block; width: 100%; height: 0; padding: 0 0 100%; background: var(--red); color: #fff; }
.mini__pic svg { position: absolute; inset: 14%; width: 72%; height: 72%; }
.mini__pic path { stroke: #fff; stroke-width: 2.4; }

/* ===== Адаптив ===== */
@media (max-width: 1000px) {
  .rack { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rack > .fob, .rack > .fob:nth-child(7), .rack > .fob:nth-child(8) { grid-column: auto; }
}
@media (max-width: 640px) {
  .rack { grid-template-columns: 1fr; }
  .id__main { padding: 14px; gap: 14px; }
  .bundle__art { grid-template-columns: 1fr; }
  .twin--b { margin-top: 0; }
}