/* Shared reading and navigation geometry for the Bangkok article collection. */
.bangkok-story{--article-related-accent:#2a5143;--muted:#5b6c61;--sub:#52685a;--green:#2a5143;--green2:#526b5e}
.bangkok-story .shell{width:min(1120px,calc(100% - 56px));margin-inline:auto}
.bangkok-story :is(.article,.prose) p{font-size:16px;line-height:2.1}
.bangkok-story :is(.article,.prose) :is(p,li,dd){overflow-wrap:break-word}
.bangkok-story :is(.photo,.shot) figcaption{font-size:12px;line-height:1.9;color:#56695d}
.bangkok-story .article-update{margin:20px 0 0;font:400 12px/1.8 var(--sans);color:#586d60;letter-spacing:0}
.bangkok-story :is(.eyebrow,.kicker,.label,.en,.subtitle-en,.small-em,.note-quiet){color:#586d60}
.bangkok-story :is(.intro-desc,.note,.quick-info dd){color:#506559}
.bangkok-story :is(.photo-frame,.shot-frame){background:#e9ede6}
.bangkok-story .related{margin-top:56px;padding:40px 0 44px;background:#f3f6f0;color:#253b32}
.bangkok-story .related h2{margin:0 0 16px;font:600 25px/1.6 var(--serif)}
.bangkok-story .related-items>a{border-top:1px solid #c5d2c6;text-decoration:none}
.bangkok-story .related-items strong{display:block;font-family:var(--serif);font-weight:600}
.bangkok-story .related-items small{display:block}
.bangkok-story .article-return{margin-top:22px}
.bangkok-story .article-credits-wrap{margin-bottom:48px}
.bangkok-story .article-photo-credits .photo-credits-group{font:400 13px/1.95 var(--sans);color:#415a4b}
.bangkok-story .article-photo-credits .photo-credits-group h3{font-size:14px}
.bangkok-story .article-photo-credits a:focus-visible{outline:3px solid #2a5143;outline-offset:4px}
.bangkok-story .image-load-error{display:block!important;position:static!important;width:auto!important;min-height:100px;padding:20px;font:14px/1.8 var(--sans);color:#385641;background:#edf1ea}
.bangkok-story .image-load-error a{text-decoration:underline}
.bangkok-story img[hidden]{display:none!important}
.bangkok-story .back-top{z-index:40}
@media(min-width:681px) and (max-width:1000px){
 .bangkok-story :is(.shot.float:not(.right),.photo.float-left){margin-left:0}
 .bangkok-story :is(.shot.float.right,.photo.float-right){margin-right:0}
}
@media(max-width:680px){
 .bangkok-story .shell{width:calc(100% - 38px)}
 .bangkok-story :is(.article,.prose) p{font-size:15px;line-height:2.05}
 .bangkok-story .related{margin-top:36px;padding:30px 0 34px}
 .bangkok-story .related h2{font-size:23px}
 .bangkok-story .article-credits-wrap{margin-bottom:32px}
}