/* Schapiro LLP v9 — attorneys */

/* ---------- Page hero ---------- */
.page-attorneys .page-hero h1 { max-width: 12ch; }

/* ---------- Roster: ruled editorial rows ---------- */
.roster { padding-top: clamp(48px, 5vw, 80px); }

.attorney {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: clamp(16px, 2vw, 32px);
  align-items: start;
  padding-block: clamp(56px, 6.4vw, 104px);
  border-top: 1px solid var(--rule-strong);
}
.attorney:first-child:not(.attorney--placeholder) { padding-top: clamp(48px, 5vw, 80px); }

/* Portrait: a framed object that stays beside a long bio while it reads */
.attorney__photo {
  grid-column: 1 / span 4;
  aspect-ratio: 4 / 5;
  position: sticky; top: 112px;
}
.attorney__photo img { object-position: 54% 30%; }

/* Slow push-in on hover. With JS the curtain owns the transform (scale via
   --drift-scale), so hover raises that scale; without JS it scales directly. */
html.js .attorney__photo.curtain.in.settled img { transition: transform .8s var(--ease); }
html.js .attorney__photo.curtain.in:hover { --drift-scale: 1.082; }
html:not(.js) .attorney__photo img { transition: transform .8s var(--ease); }
html:not(.js) .attorney__photo:hover img { transform: scale(1.04); }

/* Pending photo: a quiet stone plate with the words set small and centred */
.attorney__photo--pending {
  display: grid; place-items: center;
  background: var(--stone);
  text-align: center;
}
.attorney__photo--pending::before {
  content: ""; position: absolute; inset: 12px; pointer-events: none;
  border: 1px solid var(--rule);
}
.attorney__photo--pending span {
  font: 600 10.5px/1.9 var(--ui);
  letter-spacing: .22em; text-transform: uppercase;
  color: var(--ink-muted);
}

.attorney__body { grid-column: 6 / span 7; }
.attorney__role {
  display: block;
  font: 600 11px/1.5 var(--ui);
  letter-spacing: .22em; text-transform: uppercase;
  color: var(--ink-muted);
}
.attorney h2 {
  margin: 22px 0 clamp(32px, 3.4vw, 48px);
  font-size: clamp(44px, 4.4vw, 64px);
  line-height: 1;
  color: var(--navy);
}
.attorney .bio {
  max-width: 62ch;
  font-size: 18px; line-height: 1.75;
  color: var(--ink-body);
}
.attorney .bio + .bio { margin-top: 1.1em; }
.attorney__creds {
  max-width: 64ch;
  margin-top: clamp(32px, 3.4vw, 44px);
  padding-top: 22px;
  border-top: 1px solid var(--rule);
  font: 400 12.5px/1.8 var(--ui);
  letter-spacing: .03em;
  color: var(--ink-muted);
}

/* Contact line left, LinkedIn right */
.attorney__foot {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: 20px 32px;
  margin-top: 28px;
}
.attorney__contact {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 14px;
  font: 400 clamp(18px, 1.5vw, 21px)/1.5 var(--serif);
  color: var(--navy);
}
.attorney__contact .sep { color: var(--ink-muted); }
.attorney__contact .u-link { padding-bottom: 3px; }
.attorney__contact--pending {
  font: 600 10.5px/1.6 var(--ui);
  letter-spacing: .2em; text-transform: uppercase;
  color: var(--ink-muted);
}

/* ---------- Placeholders: Chaya and Isabella, visibly quieter ---------- */
.roster__pending {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: clamp(32px, 5vw, 96px);
  border-top: 1px solid var(--rule-strong);
}
.attorney--placeholder {
  grid-template-columns: clamp(96px, 9vw, 132px) minmax(0, 1fr);
  column-gap: clamp(24px, 2.6vw, 40px);
  padding-block: clamp(40px, 4.4vw, 64px);
  border-top: 0;
}
.attorney--placeholder .attorney__photo { grid-column: 1; position: relative; top: auto; }
.attorney--placeholder .attorney__photo--pending::before { inset: 6px; }
.attorney--placeholder .attorney__photo--pending span { font-size: 8.5px; letter-spacing: .18em; }
.attorney--placeholder .attorney__body { grid-column: 2; }
.attorney--placeholder h2 {
  margin: 14px 0 12px;
  font-size: clamp(30px, 2.6vw, 38px);
  color: var(--ink-body);
}
.attorney--placeholder .bio { font-size: 16.5px; color: var(--ink-muted); }
.attorney--placeholder .attorney__contact { margin-top: 18px; font-size: 17px; color: var(--ink-body); }
.attorney--placeholder .attorney__contact.attorney__contact--pending { font-size: 10px; color: var(--ink-muted); }

/* ---------- Responsive ---------- */
@media (max-width: 1080px) {
  .attorney__photo { grid-column: 1 / span 5; }
  .attorney__body { grid-column: 6 / span 7; }
  .attorney--placeholder .attorney__photo { grid-column: 1; }
  .attorney--placeholder .attorney__body { grid-column: 2; }
}
@media (max-width: 860px) {
  .roster__pending { grid-template-columns: 1fr; }
  .attorney--placeholder + .attorney--placeholder { border-top: 1px solid var(--rule); }
}
@media (max-width: 760px) {
  .attorney:not(.attorney--placeholder) { display: block; }
  .attorney:not(.attorney--placeholder) .attorney__photo {
    position: relative; top: auto;
    width: 100%; max-width: 320px;
    margin-bottom: clamp(36px, 8vw, 48px);
  }
  .attorney h2 { font-size: clamp(38px, 10vw, 48px); }
  .attorney .bio { font-size: 17.5px; }
  .attorney__contact { font-size: 19px; }
}
@media (max-width: 420px) {
  .attorney--placeholder { grid-template-columns: 84px minmax(0, 1fr); column-gap: 20px; }
  .attorney--placeholder .attorney__photo--pending span { font-size: 7.5px; letter-spacing: .14em; }
  .attorney--placeholder h2 { font-size: 28px; }
  .attorney--placeholder .attorney__contact { font-size: 15.5px; }
}