/* Connection Observatory: two visual scales, one shared direction. */
.observatory-portal{background:#eae9df;color:#172f2d;border-bottom:1px solid #425b4f;overflow:hidden}
.observatory-intro{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-bottom:38px}
.observatory-intro .eyebrow{margin:0;color:#32554c;font-size:10px;letter-spacing:1.7px}
.observatory-intro .live-dot{background:#477256;box-shadow:none}
.observatory-edition{font:9px/1.6 'Courier New',monospace;letter-spacing:1.5px;white-space:nowrap;color:#53675e}
.observatory-heading{display:grid;grid-template-columns:1.15fr 1fr;gap:8%;align-items:end;margin-bottom:48px}
.observatory-heading h2{font-size:clamp(38px,5.3vw,73px);font-weight:400;line-height:1.06;letter-spacing:-.052em;margin:0;text-wrap:balance}
.observatory-heading p{font-size:16px;line-height:1.8;color:#4b6259;margin:0 0 25px;max-width:520px}
.observatory-portal .button.primary{background:#173e35;color:#f1f2df;border-color:#173e35}
.observatory-portal .button.primary:hover{background:#285347}
.observatory-diptych{display:grid;grid-template-columns:1.28fr 1fr;gap:22px;align-items:stretch}
.observatory-diptych>a{position:relative;display:block;overflow:hidden;min-width:0;border-radius:8px;isolation:isolate;min-height:410px}
.observatory-diptych img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;transition:transform .7s}
.observatory-diptych>a:hover img{transform:scale(1.025)}
.observatory-human img{object-position:54% center}
.observatory-material img{object-position:47% center}
.observatory-diptych>a::after{content:'';position:absolute;inset:0;z-index:0;background:linear-gradient(0deg,rgba(15,27,27,.85),transparent 55%)}
.observatory-diptych .observatory-material::after{background:linear-gradient(0deg,rgba(25,17,43,.93),transparent 62%)}
.observatory-image-index{position:absolute;top:22px;left:22px;z-index:1;font:9px/1.5 'Courier New',monospace;letter-spacing:1.3px;padding:8px 11px;border:1px solid #ffffff60;color:#f5f4e9;background:#1d332bd9;border-radius:3px}
.observatory-material .observatory-image-index{background:#281f3cdb}
.observatory-image-title{position:absolute;z-index:1;bottom:27px;inset-inline:28px;display:flex;gap:20px;justify-content:space-between;align-items:end;color:#f6f6e9}
.observatory-image-title strong{font-size:clamp(25px,2.6vw,37px);line-height:1.17;letter-spacing:-1px;font-weight:400;max-width:340px;text-wrap:balance}
.observatory-image-title>span{font-size:27px;line-height:1}
.observatory-bottom{display:grid;grid-template-columns:1.28fr 1fr;gap:22px;margin-top:22px;align-items:start}
.observatory-bottom p{font-size:11px;line-height:1.7;color:#50635b;max-width:460px;margin:0}
.observatory-bottom>a{display:flex;align-items:center;gap:15px;border-top:1px solid #8c9b90;padding-top:18px}
.observatory-bottom>a>span:last-child{margin-left:auto;font-size:23px}
.observatory-bottom small{display:block;font:9px/1.5 'Courier New',monospace;letter-spacing:1.2px;color:#526a5f;margin-bottom:7px}
.observatory-bottom strong{font-size:15px;line-height:1.5;font-weight:400}
.observatory-pulse{font-size:33px;color:#456a57}
.observatory-portal a:focus-visible{outline:3px solid #527942;outline-offset:5px}
@media(max-width:900px){.observatory-heading{gap:6%;grid-template-columns:1fr 1fr}.observatory-diptych>a{min-height:340px}.observatory-heading p{font-size:14px}.observatory-image-title{inset-inline:21px}.observatory-image-title strong{font-size:27px}}
@media(max-width:650px){.observatory-intro{margin-bottom:28px}.observatory-edition{display:none}.observatory-intro .eyebrow{font-size:8px;letter-spacing:1px}.observatory-heading,.observatory-diptych,.observatory-bottom{grid-template-columns:1fr}.observatory-heading{gap:24px;margin-bottom:30px}.observatory-heading h2{font-size:clamp(38px,9vw,56px)}.observatory-heading p{font-size:15px}.observatory-diptych{gap:15px}.observatory-diptych>a{min-height:340px}.observatory-diptych .observatory-material{min-height:280px}.observatory-image-index{top:16px;left:16px;font-size:8px}.observatory-bottom{gap:24px}.observatory-bottom>a{padding-top:20px}.observatory-image-title strong{max-width:270px;font-size:29px}}
@media(prefers-reduced-motion:reduce){.observatory-diptych img{transition:none}.observatory-diptych>a:hover img{transform:none}}
