/* Industry pages (scripts/website-industries.py, Tim 2026-10-22). The galleries use the Residential page's plain blocks;
   only the client-logo band lives here. */
/* Client logos as a band: heading on the left, borderless logos on the right. */
.mf-partners--band { display: grid; grid-template-columns: minmax(250px, .8fr) 2fr; gap: 5vw; align-items: center; }
.mf-partners--band .mf-partners-heading { display: block; margin: 0; }
.mf-partners--band .mf-partners-heading > p { margin-top: 16px; }
.mf-partners--band .mf-partner-logos { border: 0; }
.mf-partners--band .mf-partner-logos > :is(a, div) { border: 0; min-height: 72px; }

/* Logos never outgrow their cells (the fixed pixel sizes from the logo pool overlapped at tablet widths). */
.mf-partner-logos > :is(a, div) { min-width: 0; }
.mf-partner-logos img { max-width: 100% !important; height: auto !important; object-fit: contain; }   /* (the logos carry inline sizes with max-width: none) */

@media (max-width: 1100px) {
  .mf-partners--band { display: block; }
  .mf-partners--band .mf-partners-heading { margin-bottom: 22px; }
}

/* ---------- Full product sections (industry-rich.js; scripts/website-industries.py RICH), Industrial first ---------- */
.ind-films, .ind-tour, .ind-site { border-bottom: 1px solid var(--line); }
.ind-films, .ind-tour, .ind-site { --ind-lime: #d8ee75; }

/* film player: one large frame, the other films as a row of picks */
.ind-film-frame { position: relative; aspect-ratio: 16 / 9; background: var(--dark); overflow: hidden; }
.ind-film-frame > img, .ind-film-frame > iframe { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border: 0; }
.ind-film-start { position: absolute; left: 50%; top: 50%; width: 96px; height: 96px; margin: -48px 0 0 -48px; border-radius: 50%; border: 1px solid rgba(255,255,255,.7);
  background: rgba(37,45,39,.45); color: #fff; display: grid; place-items: center; cursor: pointer; backdrop-filter: blur(6px); transition: transform .3s ease, background .3s ease; }
.ind-film-start svg { width: 34px; height: 34px; margin-left: 4px; }
.ind-film-frame:hover .ind-film-start, .ind-film-start:focus-visible { transform: scale(1.06); background: rgba(37,45,39,.7); }
.ind-film-caption { display: flex; justify-content: space-between; gap: 20px; padding-top: 12px; font-size: 13px; color: var(--muted); }
.ind-film-caption b { color: var(--ink); font-weight: 500; }
.ind-film-list { display: grid; grid-template-columns: repeat(var(--films, 4), minmax(0, 1fr)); gap: 18px; margin-top: 28px; }
.ind-film-pick { display: block; padding: 0; border: 0; background: none; text-align: left; cursor: pointer; color: inherit; font: inherit; }
.ind-film-thumb { position: relative; display: block; aspect-ratio: 16 / 9; overflow: hidden; background: var(--dark); }
.ind-film-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.ind-film-pick:hover .ind-film-thumb img { transform: scale(1.04); }
.ind-film-play { position: absolute; right: 10px; bottom: 10px; width: 34px; height: 34px; border-radius: 50%; background: rgba(255,255,255,.9); color: var(--ink); display: grid; place-items: center; }
.ind-film-play svg { width: 14px; height: 14px; margin-left: 2px; }
.ind-film-pick.is-active .ind-film-thumb { outline: 2px solid var(--ink); outline-offset: 3px; }
.ind-film-meta { display: flex; flex-direction: column; gap: 2px; padding-top: 10px; font-size: 13px; color: var(--muted); }
.ind-film-meta b { color: var(--ink); font-weight: 500; font-size: 14px; }
.ind-film-card { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 6px; padding: 16px; text-align: center;
  background: linear-gradient(135deg, #2c372f, #1d241f); color: #f1f0e9; }
.ind-film-card b { font-family: var(--serif, Georgia, serif); font-weight: 400; font-size: clamp(18px, 2.2vw, 34px); line-height: 1.1; }
.ind-film-card span { font-size: 12px; letter-spacing: .08em; text-transform: uppercase; opacity: .75; }
.ind-film-thumb .ind-film-card b { font-size: 17px; }

/* 360 tour: copy beside a large frame (placeholder until the tour is ready) */
.ind-tour { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.6fr); gap: 5vw; align-items: center; }
/* the site's section-title style, as on every other section heading (Tim, 2026-10-27: "the more bulkier, thicker font") */
.ind-tour-copy h2 { font-size: var(--section-title-size); font-weight: var(--section-title-weight); line-height: var(--section-title-leading);
  letter-spacing: -.02em; margin: 18px 0 20px; }
.ind-tour-copy p { color: var(--muted); line-height: 1.7; font-size: 15px; max-width: 420px; }
.ind-tour-copy ul { list-style: none; padding: 0; margin: 26px 0 0; }
.ind-tour-copy li { padding: 12px 0; border-top: 1px solid var(--line); font-size: 15px; }
.ind-tour-frame { position: relative; aspect-ratio: 16 / 10; overflow: hidden; background: var(--dark); }
.ind-tour-frame img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.9) brightness(.82); }
.ind-tour-frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.ind-tour-badge { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 120px; height: 120px; border-radius: 50%;
  border: 1px solid rgba(255,255,255,.75); display: grid; place-items: center; color: #fff; font-size: 28px; letter-spacing: .02em; backdrop-filter: blur(5px); background: rgba(37,45,39,.35); }
.ind-tour-soon { position: absolute; left: 0; right: 0; bottom: 0; padding: 16px 20px; color: #fff; font-size: 13px; letter-spacing: .06em; text-transform: uppercase;
  background: linear-gradient(transparent, rgba(0,0,0,.55)); }

/* interactive site plan: the aerial with pins beside the building list */
.ind-site-app { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(280px, .8fr); gap: 0; background: var(--dark); color: #f1f0e9; }
.ind-site-map { position: relative; aspect-ratio: 16 / 10; overflow: hidden; }
.ind-site-map img { width: 100%; height: 100%; object-fit: cover; }
.ind-pin { position: absolute; transform: translate(-50%, -50%); width: 34px; height: 34px; border-radius: 50%; border: 2px solid #fff; cursor: pointer;
  display: grid; place-items: center; font: 600 13px/1 var(--sans); color: var(--ink); background: var(--ind-lime); box-shadow: 0 4px 14px rgba(0,0,0,.35); transition: transform .2s ease; }
.ind-pin.is-leased { background: #9aa197; color: #fff; }
.ind-pin.is-under-offer { background: #f1c86b; }
.ind-pin:hover, .ind-pin.is-active { transform: translate(-50%, -50%) scale(1.22); }
.ind-pin.is-active { box-shadow: 0 0 0 6px rgba(216,238,117,.35), 0 4px 14px rgba(0,0,0,.35); }
.ind-site-panel { display: flex; flex-direction: column; padding: 26px 26px 22px; }
.ind-site-panel-head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding-bottom: 14px; border-bottom: 1px solid rgba(241,240,233,.18); font-size: 14px; }
.ind-site-panel-head span { font-size: 11px; letter-spacing: .08em; text-transform: uppercase; opacity: .65; }
.ind-site-panel ul { list-style: none; margin: 0; padding: 0; flex: 1; }
.ind-site-panel li button { width: 100%; display: grid; grid-template-columns: 1fr auto; grid-template-rows: auto auto; column-gap: 12px; padding: 13px 10px; margin: 0 -10px;
  border: 0; border-bottom: 1px solid rgba(241,240,233,.12); background: none; color: inherit; font: inherit; text-align: left; cursor: pointer; transition: background .2s ease; }
.ind-site-panel li button:hover, .ind-site-panel li button[aria-pressed="true"] { background: rgba(241,240,233,.08); }
.ind-site-panel li b { font-weight: 500; font-size: 15px; }
.ind-site-panel li span { grid-column: 1; font-size: 12px; opacity: .7; margin-top: 3px; }
.ind-site-panel li em { grid-row: 1 / 3; grid-column: 2; align-self: center; font-style: normal; font-size: 11px; letter-spacing: .06em; text-transform: uppercase;
  padding: 5px 9px; border-radius: 99px; background: var(--ind-lime); color: var(--ink); font-family: var(--sans); }
.ind-site-panel li em.is-leased { background: #5d645b; color: #f1f0e9; }
.ind-site-panel li em.is-under-offer { background: #f1c86b; }
.ind-site-panel .text-link { margin-top: 18px; color: #f1f0e9; font-size: 13px; }
.ind-site-note { margin-top: 12px; font-size: 12px; color: var(--muted); }

@media (max-width: 1000px) {
  .ind-film-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ind-tour { grid-template-columns: 1fr; }
  .ind-site-app { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .ind-film-start { width: 68px; height: 68px; margin: -34px 0 0 -34px; }
  .ind-film-caption { flex-direction: column; gap: 2px; }
  .ind-film-list { gap: 14px; }
  .ind-tour-badge { width: 84px; height: 84px; font-size: 20px; }
  .ind-tour-soon { font-size: 11px; }
  .ind-pin { width: 28px; height: 28px; font-size: 12px; }
  .ind-site-panel { padding: 20px 18px; }
}

/* a live 360° tour (Multifamily & Condos) and the FloorStack demo */
.ind-tour-live { margin: 0; }
/* the live tour frame: 16:10 plus 100 px more height for viewing room (Tim, 2026-10-27) */
.ind-tour-live { container-type: inline-size; }
.ind-tour-frame.is-live { aspect-ratio: auto; height: calc(100cqw * 10 / 16 + 100px); }
.ind-tour-live figcaption { display: flex; justify-content: space-between; gap: 16px; padding-top: 12px; font-size: 13px; color: var(--muted); }
.ind-tour-live figcaption span { white-space: nowrap; }
.ind-demo .fsd { margin-top: 8px; }
/* picks between an industry's 360° tours (Hospitality, Office, Student Housing) */
.ind-tour-picks { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.ind-tour-pick { font: inherit; font-size: 13px; padding: 8px 14px; border-radius: 999px; border: 1px solid var(--line); background: transparent; color: inherit; cursor: pointer; transition: background .2s, color .2s, border-color .2s; }
.ind-tour-pick:hover { border-color: currentColor; }
.ind-tour-pick[aria-pressed="true"] { background: var(--ink, #111); color: var(--paper, #fff); border-color: var(--ink, #111); }
@media (max-width: 1000px) { .ind-film-list { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 600px) { .ind-film-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ind-tour-live figcaption { flex-direction: column; gap: 2px; } }
.ind-film-more { margin-top: 18px; font-size: 14px; }