/* ==========================================================================
   USModernist catalog pages (Lautner, Wright, Neutra ... ) - shared styles
   One file for every architect page in the catalog-record layout.
   ========================================================================== */
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Montserrat',Helvetica,sans-serif;font-size:16px;background:#fff;color:#1a1a1a;line-height:1.4}
a{color:#CC0000;text-decoration:none}
a:hover{text-decoration:underline}

/* biography block above the map */
.bio{max-width:1400px;margin:20px auto;padding:0 20px;font-size:16px;color:#000;line-height:1.7;font-family:'Montserrat',sans-serif}
.bio b{color:#1a1a1a}
.bio-photos{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end;margin-bottom:16px;justify-content:center}
.bio-photos img{height:184px;width:auto;border:1px solid #ddd;border-radius:3px}
.bio-quote{color:#000;margin:16px 0;padding:10px 20px;border-left:4px solid #CC0000;background:#fafafa;font-size:16px}
.bio-resources{margin:12px 0;font-size:16px;color:#000}
.section-title{max-width:1400px;margin:30px auto 10px;padding:0 20px;font-size:20px;font-weight:800;color:#1a1a1a;letter-spacing:0.5px}
.section-title span{color:#CC0000}

/* map */
#map{width:100%;max-width:1400px;height:500px;margin:10px auto 30px;border:1px solid #ddd;border-radius:4px}
.map-wrap{max-width:1400px;margin:0 auto;padding:0 20px}
.legend{font-size:16px;color:#555;margin:6px 0 0;text-align:right}
.legend span{display:inline-block;width:12px;height:12px;border-radius:50%;margin:0 4px 0 10px;vertical-align:middle}
.map-dot{width:14px;height:14px;background:#CC0000;border:2px solid #fff;border-radius:50%;box-shadow:0 1px 3px rgba(0,0,0,.45);cursor:pointer}
.leg-house{background:#CC0000}
.map-pop{font-family:'Montserrat',sans-serif;font-size:14px;line-height:1.4;min-width:180px}
.map-pop b{color:#CC0000}

/* house table */
.tbl-wrap{max-width:1400px;margin:0 auto;padding:0 20px}
.tbl{width:100%;max-width:1400px;margin:10px auto 40px;border-collapse:collapse;font-size:16px}
.tbl th{background:#1a1a1a;color:#fff;padding:8px 10px;text-align:left;font-weight:700;font-size:14px;letter-spacing:1px;position:sticky;top:0;z-index:10}
.tbl td{padding:8px 10px;border-bottom:1px solid #e0e0e0;vertical-align:top}
.tbl tr:hover{background:#fafafa}
.tbl tr:nth-child(even){background:#f8f8f8}
.tbl tr:nth-child(even):hover{background:#f0f0f0}
.tbl tr:target{outline:3px solid #CC0000;outline-offset:-3px}
.phcell{vertical-align:top;width:320px}
.ph{width:300px;height:200px;object-fit:cover;display:block;border:1px solid #ddd;cursor:pointer;transition:opacity .2s}
.ph:hover{opacity:.85}
.ph-nophoto{width:100px;height:67px;object-fit:cover;display:block;border:1px solid #ddd}
.phlinks{margin-top:6px;line-height:1.8}
.phl{display:inline-block;width:26px;height:22px;text-align:center;line-height:22px;background:#1a1a1a;color:#fff !important;font-size:13px;font-weight:700;border-radius:3px;margin:1px 2px;text-decoration:none}
.phl:hover{background:#CC0000;text-decoration:none}
.housecell{width:335px;min-width:335px;max-width:335px}
.hyear{font-size:16px;font-weight:700;color:#000}
.hname{font-size:16px;font-weight:800;color:#CC0000}
.nm-plain{font-weight:500}
.hloc{font-size:16px;color:#000;font-weight:500}
.hstatus{display:inline-block;padding:2px 8px;border-radius:3px;font-weight:bold;font-size:14px;color:#fff}
.st-b{background-color:#22c55e}
.st-d{background-color:#ef4444}
.st-u{background-color:#666}
.st-x{background-color:#9ca3af} /* status not known: deliberately lighter than Unbuilt, so "we do not know" never reads as "never built" */
.descell{font-size:16px;color:#000;line-height:1.6}
.pcred{color:#000;font-size:14px}
.unbuilt-row{opacity:.7}
.unbuilt-row .hyear,.unbuilt-row .hloc,.unbuilt-row .hname{color:#000}

/* lightbox */
#lightbox{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.92);z-index:99999;justify-content:center;align-items:center;flex-direction:column}
#lightbox img{max-width:90vw;max-height:75vh;object-fit:contain;border:2px solid #333;border-radius:4px}

@media(max-width:900px){
 .tbl,.tbl thead,.tbl tbody,.tbl th,.tbl td,.tbl tr{display:block}
 .tbl th{position:static}
 .tbl tr{margin-bottom:16px;border:1px solid #ddd;border-radius:4px;overflow:hidden}
 .tbl td{padding:6px 12px;border-bottom:1px solid #eee}
 .ph{width:100%;height:auto;max-width:300px}
 .phcell{width:auto}
 .housecell{width:auto;min-width:auto;max-width:none}
 .bio-photos img{height:140px}
 #map{height:350px}
}