/* Meet the family shares the warm, circular Contact us theme. */
#tvMenu.family-open {
  padding: 1.2cqw 1.7cqw; color: #233c32; background: #faf5e9;
  background-image: radial-gradient(circle at 102% 110%, #edcf7138 0 20%, transparent 20.2%);
  box-shadow: inset 0 0 0 1px #d8d6c9;
}
#tvMenu.family-open #menuDetail .back {
  float: right; min-height: 44px; margin: 0 0 .4cqw 1cqw;
  padding: .55cqw 1cqw; font-size: max(12px,.95cqw);
  color: #334c40; background: #e6ecdf; border: 0; border-radius: 999px;
}
#tvMenu.family-open #detailTitle {
  min-height: 44px; display: flex; align-items: center; margin: 0;
  font-size: max(22px,2.5cqw); font-weight: 600; letter-spacing: -.04em;
}
#familyContent { clear: both; }
#familyContent[hidden] { display: none; }
.family-intro { margin: 0 0 .6cqw; color: #4d6355; font-size: max(12px,1.1cqw); line-height: 1.3; }
.family-people { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: .65cqw; }
#tvMenu .family-person {
  display: flex; flex-direction: column; justify-content: flex-start; gap: .2cqw;
  min-width: 0; padding: .4cqw .25cqw; border: 0; background: transparent;
  color: #233c32; text-align: center; border-radius: 1.5cqw;
  font-size: max(13px,1.15cqw); line-height: 1.2;
}
.family-portrait {
  display: block; width: 8.5cqw; height: 8.5cqw; min-width: 48px; min-height: 48px;
  border-radius: 50%; overflow: hidden; border: 3px solid #e4dfcd;
  background: #d9e3d0; margin-bottom: .25cqw; transition: transform .2s ease, box-shadow .2s ease;
}
.family-portrait img { width: 100%; height: 100%; object-fit: cover; display: block; }
.family-person[data-person="dan"] img { object-position: 20% center; }
.family-person[data-person="james"] img { object-position: 65% center; }
.family-person[aria-pressed="true"] .family-portrait { border-color: #e0b630; box-shadow: 0 0 0 3px #f2cf5e55; }
#tvMenu .family-person[aria-pressed="true"] { color: #233c32; background: #f2cf5e20; }
.family-person small { color: #526657; font-size: max(10px,.85cqw); font-weight: 400; }
.family-placeholder { display: grid; place-items: center; font-size: 2.5cqw; font-weight: 500; color: #334c40; background: #c2d2ba; border-color: #c2d2ba; }
.family-person[data-person="rachel"] .family-placeholder { background: #edbd9e; border-color: #edbd9e; }
.family-person[aria-pressed="true"] .family-placeholder { border-color: #e0b630; }
.family-profile { margin-top: .6cqw; padding: .7cqw 1cqw; border: 0; border-radius: 1.4cqw; background: #e6ecdfb3; }
.family-profile h3 { font-size: max(14px,1.2cqw); font-weight: 600; margin: 0 0 .3cqw; color: #233c32; }
.family-profile p { font-size: max(12px,1.05cqw); line-height: 1.4; margin: 0; color: #425c4d; }
#tvMenu .family-person:focus-visible, #tvMenu.family-open .back:focus-visible { outline: 3px solid #376747; outline-offset: 2px; }
@media(hover:hover) {
  #tvMenu .family-person:hover { background: #eee6d455; }
  .family-person:hover .family-portrait { transform: translateY(-3px); }
}
@media(max-width:600px) and (orientation:portrait) {
  #picture.menu-ready #tvMenu.family-open { padding: 3cqw 4cqw; }
  #picture.menu-ready #tvMenu.family-open #detailTitle { font-size: 5.8cqw; min-height: 44px; margin: 0; }
  #picture.menu-ready #tvMenu.family-open #menuDetail .back { margin: 0 0 2cqw 2cqw; padding: 2cqw 3cqw; border-radius: 999px; }
  .family-intro { font-size: 3.3cqw; margin-bottom: 1cqw; }
  .family-people { gap: 1cqw; }
  #picture.menu-ready #tvMenu .family-person { padding: 1.2cqw .5cqw; gap: 1cqw; font-size: 3.5cqw; border-radius: 4cqw; }
  .family-portrait { width: 19cqw; height: 19cqw; margin-bottom: .5cqw; }
  .family-placeholder { font-size: 7cqw; }
  .family-person small { font-size: 2.6cqw; }
  .family-profile { margin-top: 1cqw; padding: 2cqw 3cqw; border-radius: 4cqw; }
  .family-profile h3 { font-size: 4cqw; margin-bottom: 1cqw; }
  .family-profile p { font-size: 3.5cqw; line-height: 1.4; }
}
@media(min-width:601px) and (max-width:1000px) {
  #picture.family-ready { overflow: hidden; }
  #picture.family-ready #roomStill { width: 155%; height: 155%; max-width: none; left: -27.53525%; top: -36.048%; }
  #picture.family-ready #tvMenu.family-open { left: 17.5%; top: 20%; width: 64.945%; height: 64.821%; padding: 1.3cqw 2cqw; }
  #picture.family-ready .family-portrait { width: 10cqw; height: 10cqw; }
  #picture.family-ready .family-person small { font-size: 11px; }
  #picture.family-ready .family-profile p { font-size: 13px; }
}
@media(min-width:1001px) {
  #picture.family-ready { overflow: hidden; }
  #picture.family-ready #roomStill { width: 135%; height: 135%; max-width: none; left: -17.50425%; top: -23.816%; }
  #picture.family-ready #tvMenu.family-open { left: 21.72%; top: 25%; width: 56.565%; height: 56.457%; }
}
@media(prefers-reduced-motion:reduce) {
  .family-portrait { transition: none; }
  .family-person:hover .family-portrait { transform: none; }
}
