html{scroll-behavior:smooth}
.hero{height:auto;aspect-ratio:3/2;max-height:900px;overflow:hidden;isolation:isolate;touch-action:pan-y;margin-inline:auto;background:var(--deep)}
.hero .slide{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity 800ms ease,visibility 800ms;pointer-events:none}
.hero .slide.active{opacity:1;visibility:visible}
.hero .slide img{display:block;width:100%;height:100%;margin:0 auto;object-position:50% 50%!important;object-fit:contain}
.hero .count{font-size:12px;opacity:0;transition:opacity .2s}
.hero:hover .count,.hero:focus-within .count{opacity:1}
.hero .prev,.hero .next{background:transparent;opacity:.65}
.hero .prev:hover,.hero .next:hover{opacity:1}
.hero .playback{top:auto;bottom:12px;right:18px;transform:none;font-size:16px;width:32px;height:32px;background:#11231d88;opacity:0;transition:opacity .2s}
.hero:hover .playback,.hero:focus-within .playback{opacity:1}
.home{background:var(--deep);color:var(--gold)}
.home .band{background:var(--ink)}
.home .band.dark{background:var(--deep)}
.home .split{width:min(100% - 48px,960px)}
.home .band:has(.carousel){background:linear-gradient(#11231de6,#182e28e6),url('img/hero3.jpg') center/cover fixed}
.home .split>div{text-align:center}
.home .split h2{font-size:32px}
.home .split h3{font-size:22px}
.home .split p{font-size:16px}
.home .cta{background:transparent;border-bottom:1px solid #e2bd9580;color:var(--gold);padding:8px 22px}
.home .cta:hover{color:white;border-color:white}
.home h2{font-size:30px}
.carousel{margin-top:28px}
.carousel-window{overflow:hidden;touch-action:pan-y}
.carousel-track{display:flex;gap:28px;transition:transform 650ms ease;will-change:transform;align-items:flex-start}
.carousel-track .tile{flex:0 0 calc((100% - 56px)/3);min-width:0;text-align:center}
.carousel-track .tile img{aspect-ratio:2/3;object-fit:cover}
.carousel-track .tile span{padding-top:12px;font-size:14px}
.carousel-controls{display:flex;align-items:center;justify-content:center;gap:25px;padding:20px 0 0;color:#e7ded2;font-size:13px}
.carousel-controls button{border:0;background:none;color:inherit;padding:2px 15px;font-size:26px}
.carousel-controls button:disabled{opacity:.25;cursor:default}
.home .articles img{aspect-ratio:4/3}
.home .articles article{background:#f6f1e8;color:#172b24}
.home .articles h3,.home .articles a{margin:15px;display:block}
.social-strip{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:24px}
.social-strip img{aspect-ratio:4/5;transition:filter .3s}
.social-strip a:hover img{filter:brightness(1.15)}
.menu span{display:block;width:22px;height:1px;background:currentColor;margin:5px 0;transition:transform .25s,opacity .25s}
.menu[aria-expanded=true] span:first-child{transform:translateY(6px) rotate(45deg)}
.menu[aria-expanded=true] span:nth-child(2){opacity:0}
.menu[aria-expanded=true] span:last-child{transform:translateY(-6px) rotate(-45deg)}
dialog[open]{animation:photo-open .25s ease}
@keyframes photo-open{from{opacity:0;transform:scale(.98)}to{opacity:1;transform:scale(1)}}
@media(max-width:650px){
 .head{position:relative;padding:22px 0 18px;gap:0;min-height:143px;align-content:start}
 .wordmark{align-self:center;margin-top:7px}
 .wordmark strong{font-size:16px;letter-spacing:1px}
 .wordmark small{font-size:9px;padding-top:2px}
 .menu{position:absolute;right:0;top:25px;background:#dddfd6;color:#25352f;padding:4px 7px;border:0}
 .head-links{display:block;padding:0}
 .head-links nav{position:absolute;left:-15px;right:-15px;top:calc(100% - 1px);z-index:5;background:var(--ink);display:flex;flex-direction:column;align-items:stretch;gap:0;max-height:0;overflow:hidden;visibility:hidden;transition:max-height .4s ease,visibility .4s}
 .head-links.open nav{max-height:440px;visibility:visible;border-bottom:1px solid #e2bd9555}
 .head-links nav a{padding:10px 25px;border-top:1px solid #e2bd9522}
 .language{margin-top:21px;width:100%;padding:5px 9px;font-size:11px}
 .home .hero{width:calc(100% - 32px);margin:20px auto 0;aspect-ratio:3/2;max-height:none}
 .hero .prev,.hero .next,.hero .count,.hero .playback{opacity:0}
 .hero:focus-within button{opacity:1}
 .home .band{padding:34px 0}
 .home .band:has(.carousel){background-attachment:scroll}
 .home .split{width:calc(100% - 32px);gap:28px}
 .home .split h2{font-size:27px;text-align:left;margin-bottom:38px}
 .home .split h3{display:none}
 .home .split p{font-size:16px;font-style:italic;line-height:2}
 .home .split img{height:340px}
 .home h2{font-size:25px}
 .carousel-track{gap:20px}
 .carousel-track .tile{flex-basis:100%}
 .carousel-track .tile img{width:75%;height:330px;aspect-ratio:auto;object-fit:contain;margin:auto}
 .carousel-track .tile span{font-size:13px}
 .carousel-controls{padding-top:15px}
 .home .articles{gap:18px}
 .home .articles img{aspect-ratio:1/1}
 .home .articles h3{font-size:21px;line-height:1.6}
 .social-strip{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:15px;-webkit-overflow-scrolling:touch}
 .social-strip a{flex:0 0 100%;scroll-snap-align:start}
 .social-strip img{aspect-ratio:4/5}
 footer nav{gap:12px;font-size:12px}
 .top{left:15px;right:auto;bottom:25px;background:transparent;color:#b9c4bc;border-radius:0;opacity:.8}
}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 .hero .slide,.carousel-track,.head-links nav,.menu span{transition:none}
 dialog[open]{animation:none}
 .home .band:has(.carousel){background-attachment:scroll}
}
.tile img[width][height]{height:auto}
.recovered-photos img{object-fit:contain;background:#152b23;object-position:center}
.viewer-controls{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 18px}
.viewer-controls button{width:auto;font:14px/1.8 "Microsoft YaHei",sans-serif;padding:6px 10px;white-space:nowrap}
.viewer-controls .photo-count{font-size:13px;color:var(--gold)}
dialog .viewer-controls~button{position:static}
@media(max-width:650px){.subnav{gap:8px 14px;font-size:13px}.viewer-controls{padding:8px}.viewer-controls button{font-size:12px}}