

.connect { padding-bottom: clamp(72px, 9vw, 140px); }
.tblock { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 1px; background: var(--rule-2); border: 2px solid var(--fg); }
.tb { background: var(--bg); padding: 14px 18px 18px; min-width: 0; }
.tb__k { display: block; color: var(--fg2); margin-bottom: 12px; font-weight: 300; }
.tb--cta { grid-column: 1 / 9; display: flex; flex-direction: column; justify-content: space-between; min-height: clamp(220px, 22vw, 320px); }
.cta { font-weight: 500; font-size: max(var(--t-display), var(--t-title)); line-height: var(--lh-display); letter-spacing: var(--tr-display); margin-left: -.04em; }
.cta__btn { font: inherit; letter-spacing: inherit; line-height: inherit; text-align: left; padding: 0 0 .06em; }
.cta__btn:focus-visible { outline-offset: 6px; }
.cta .ul { --ul-w: max(2px, .04em); background-position: 0 100%; }
.tb--contact { grid-column: 9 / 13; display: flex; flex-direction: column; }
.tb--contact .tb__rows { margin-top: auto; }
.tb__rows li:last-child .mail, .tb__rows li:last-child .soc { border-bottom: 0; }
.tb.tb--offices { grid-column: 1 / 9; display: grid; grid-template-columns: 1fr 1fr; gap: 1px; padding: 0; background: var(--rule-2); }

.office { background: var(--bg); padding: 14px 18px 18px; display: flex; flex-direction: column; }

.office__ph { position: relative; overflow: hidden; aspect-ratio: var(--a, 1.5); margin-bottom: 16px; }
.office__ph > .lv { position: absolute; inset: 0; width: 100%; height: 100%; }
.office__c { font-weight: 500; font-size: var(--t-lead); line-height: var(--lh-text); }
.office__l { color: var(--fg2); margin-top: 8px; }
.office__a { display: inline-block; min-height: 24px; margin-top: 16px; font-size: var(--t-small); line-height: var(--lh-text); max-width: 22em; }

.office__t { display: flex; gap: 10px; align-items: baseline; margin-top: auto; padding-top: 16px; }
.office__t b { font-weight: 300; font-size: var(--t-label); line-height: var(--lh-text); letter-spacing: var(--tr-label); font-variant-numeric: tabular-nums; }
.office__t .is-open { color: var(--fg); display: inline-flex; align-items: center; gap: 6px; }
.office__t .is-open::before { content: ''; width: 6px; height: 6px; background: var(--accent); flex: none; }

.tb--follow { grid-column: 9 / 13; display: flex; flex-direction: column; }
.tb__date { margin: auto -18px -18px; padding: 14px 18px 18px; border-top: 1px solid var(--rule-2); }
.tb--follow .tb__rows { margin-bottom: 18px; }

.tb--founded { grid-column: 1 / -1; }
.tb__v { font-weight: 300; font-size: var(--t-small); line-height: var(--lh-text); font-variant-numeric: tabular-nums; }
.tb__v.pn { font-variant-numeric: normal; }

@media (max-width: 1023px) {
  .tb--cta, .tb--contact, .tb.tb--offices, .tb--follow { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
  .tb { padding: 12px 14px 14px; }
  .tb--cta { min-height: 220px; }
  .tb.tb--offices { grid-template-columns: 1fr; }
  .office { padding: 12px 14px 14px; }
  .tb__date { margin: auto -14px -14px; padding: 12px 14px 14px; }
}

@media (pointer: coarse) { .office__a { position: relative; } .office__a::after { content: ''; position: absolute; left: 0; right: 0; top: -10px; bottom: -10px; } }
