.brand-page { background:#000; color:var(--text); }
.brand-intro { padding:clamp(60px,9vw,140px) var(--edge) 70px; }
.brand-label { display:block; font-size:12px; color:var(--muted); margin-bottom:26px; }
.brand-intro h1 { font:400 clamp(36px,5.6vw,88px)/1.17 var(--display); letter-spacing:-.055em; margin:0 0 32px; }
.brand-intro > p { color:var(--muted); font-size:clamp(16px,1.6vw,22px); line-height:1.65; margin:0; }
.brand-feature { margin:0; }
.brand-feature img { width:100%; height:auto; max-height:85svh; object-fit:cover; }
.brand-story { display:grid; grid-template-columns:1fr 1fr; gap:9vw; padding:clamp(65px,10vw,150px) var(--edge); }
.brand-story h2,.brand-cta h2 { font:400 clamp(28px,3.6vw,56px)/1.22 var(--display); letter-spacing:-.045em; margin:0; }
.brand-story p { font-size:clamp(16px,1.5vw,21px); color:var(--muted); line-height:1.7; margin:0 0 24px; }
.brand-link { display:inline-flex; align-items:center; gap:34px; border-bottom:1px solid var(--line-strong); padding-bottom:10px; font-size:14px; }
.brand-link:hover { color:var(--orange); }
.brand-approach { display:grid; grid-template-columns:repeat(3,1fr); gap:36px; padding:0 var(--edge) 100px; }
.brand-approach article { padding:28px 0; border-top:1px solid var(--line-strong); }
.brand-approach h2 { font:500 clamp(22px,2.6vw,36px)/1.2 var(--body); margin:0 0 20px; }
.brand-approach p { color:var(--muted); max-width:320px; font-size:15px; line-height:1.75; margin:0; }
.brand-image-pair { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.brand-image-pair img { width:100%; height:100%; aspect-ratio:1.2; object-fit:cover; }
.brand-cta { padding:clamp(75px,10vw,150px) var(--edge); display:flex; align-items:end; justify-content:space-between; gap:40px; }
/* Contact: a local street map and direct ways to reach PRISM. */
.contact-page .site-header { background:#000; }
.contact-page .site-header::after { display:none; }
.contact-main { padding:0; }
.contact-layout { --contact-map-x:29%; --contact-map-y:50%; position:relative; isolation:isolate; display:grid; grid-template-columns:minmax(0,1.16fr) minmax(0,.84fr); align-items:center; gap:0; width:100%; min-height:max(600px,calc(100svh - var(--header))); margin:0; padding-right:var(--edge); background:#5e5e5e; }
.contact-location { position:absolute; inset:0; z-index:0; overflow:hidden; background:#5e5e5e; scroll-margin-top:var(--header); }
.contact-map-background { position:absolute; inset:0; overflow:hidden; cursor:default; }
.contact-map-art { position:absolute; top:var(--contact-map-y); left:var(--contact-map-x); width:160%; height:160%; max-width:none; object-fit:cover; object-position:center; transform:translate(-50%,-50%); pointer-events:none; }
.contact-map-marker { position:absolute; top:var(--contact-map-y); left:var(--contact-map-x); width:40px; height:52px; transform:translate(-50%,-100%); }
.contact-map-marker svg { display:block; width:40px; height:52px; }
.contact-map-popup { position:absolute; top:calc(100% + 13px); left:50%; transform:translateX(-50%); width:260px; padding:16px; background:#242424; border:1px solid #ffffff26; color:#f4f4f4; text-align:center; font:400 12px/1.6 var(--body); }
.contact-map-popup:focus-visible { outline:2px solid var(--orange); outline-offset:3px; }
.contact-map-popup strong { display:block; font-size:14px; font-weight:600; }
.contact-map-address { display:block; margin-top:6px; color:#c9c9c9; }
.contact-map-directions { display:inline-block; margin-top:12px; border-bottom:1px solid #f5823270; color:var(--orange); font-size:10px; }
.contact-map-credit { position:absolute; left:12px; bottom:12px; padding:6px 8px; background:#242424; color:#c3c3c3; font:400 10px/1.4 var(--body); }
.contact-map-credit:hover { color:#fff; }
.contact-info { position:relative; z-index:1; grid-column:2; grid-row:1; justify-self:end; width:100%; max-width:730px; min-width:0; margin:46px 0; padding:clamp(30px,3.5vw,56px); background:#f4f4f2; color:#202020; }
.contact-info > h2 { font:600 clamp(28px,2.7vw,39px)/1.12 var(--body); letter-spacing:-.055em; margin:0 0 34px; }
.contact-channels { margin:0; }
.contact-channels > div { padding:22px 0; border-top:1px solid #cacaca; }
.contact-channels dt { color:#686868; font-size:11px; margin-bottom:10px; }
.contact-channels dd { margin:0; font-size:clamp(17px,1.65vw,23px); line-height:1.5; letter-spacing:-.035em; overflow-wrap:anywhere; }
.contact-channels .contact-address { font-size:15px; line-height:1.8; letter-spacing:0; }
.contact-channels a { display:inline-block; padding:3px 0; }
.contact-info a:hover { color:#a5440c; }
.contact-info a:focus-visible { outline-color:#a5440c; }
.contact-socials { display:flex; flex-wrap:wrap; gap:12px; border-top:1px solid #cacaca; padding-top:25px; }
.contact-socials a { display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:44px; padding:10px 18px; border:1px solid #969696; border-radius:0; color:#303030; font-size:12px; }
.contact-socials img { width:20px; height:20px; flex-shrink:0; object-fit:contain; }
.contact-socials .contact-social-link--instagram,
.contact-socials .contact-social-link--instagram:hover { color:#a72669; border-color:#c976a0; }
.contact-socials .contact-social-link--instagram:hover { background:#fbeaf3; }
.contact-socials .contact-social-link--linkedin,
.contact-socials .contact-social-link--linkedin:hover { color:#0a66c2; border-color:#6d9fcf; }
.contact-socials .contact-social-link--linkedin:hover { background:#e7f0fa; }
.contact-page .to-top { display:none; }
.brand-notice { padding:100px var(--edge); min-height:60vh; }
.brand-notice h1 { font:400 clamp(32px,5vw,70px)/1.2 var(--display); }
.brand-notice p { color:var(--muted); }
@media(max-width:900px) {
 .contact-layout { --contact-map-x:25%; grid-template-columns:minmax(0,1fr) minmax(320px,1fr); padding-right:24px; }
 .contact-info { padding:32px 25px; margin:32px 0; }
 .brand-story { gap:40px; }
}
@media(max-width:700px) {
 .contact-layout { --contact-map-x:50%; --contact-map-y:200px; display:block; min-height:0; padding:400px 20px 36px; }
 .contact-map-art { height:200%; }
 .contact-map-credit { top:12px; bottom:auto; }
 .contact-info { margin:0; padding:34px 28px; }
}
@media(max-width:600px) {
 .brand-intro { padding-top:50px; padding-bottom:45px; }
 .brand-intro h1 { font-size:clamp(29px,7vw,40px); }
 .brand-story { grid-template-columns:1fr; gap:30px; }
 .brand-approach { grid-template-columns:1fr; gap:0; padding-bottom:45px; }
 .brand-cta { flex-direction:column; align-items:start; }
 .brand-image-pair { gap:5px; }
}
