article.blog-story{--story-text:640px;--story-wide:1040px;max-width:1240px;color:var(--joy-ink);margin:0 auto 24px;font:400 19px/1.7 Neue Montreal,Arial,sans-serif}article.blog-story .story-hero{background:var(--joy-sky);border-radius:28px;align-items:end;min-height:clamp(440px,72vh,700px);margin:0;display:grid;position:relative;overflow:hidden}article.blog-story .story-hero-photo{object-fit:cover;width:100%;max-width:none;height:100%;display:block;position:absolute;inset:0}article.blog-story .story-hero-text{color:#fff;background:linear-gradient(#173e5400,#173e548c 45%,#173e54eb);padding:120px clamp(20px,5vw,56px) clamp(24px,4vw,44px);position:relative}article.blog-story p.story-kicker{letter-spacing:.08em;text-transform:uppercase;max-width:none;color:var(--joy-yellow);align-items:center;gap:8px;margin:0;font:600 15px/1 Neue Montreal,Arial,sans-serif;display:flex}article.blog-story .story-hero h1{letter-spacing:-.01em;color:#fff;text-wrap:balance;max-width:14ch;margin:14px 0 12px;font:600 clamp(38px,6.4vw,72px)/1.04 Fredoka,Neue Montreal,sans-serif}article.blog-story p.story-dek{color:#fff;max-width:40ch;margin:0 0 18px;font-size:clamp(18px,2.2vw,22px);line-height:1.5}article.blog-story p.story-byline{color:#fff;opacity:.92;max-width:none;margin:0;font:400 15px/1.4 Neue Montreal,Arial,sans-serif}article.blog-story .story-chapter{max-width:var(--story-wide);margin:0 auto clamp(56px,9vw,104px)}article.blog-story .story-hero+.story-chapter{margin-top:clamp(48px,8vw,88px)}article.blog-story .story-chapter>h2{max-width:var(--story-text);letter-spacing:-.01em;color:var(--joy-ink);text-wrap:balance;margin:0 auto 18px;font:600 clamp(30px,4vw,42px)/1.15 Fredoka,Neue Montreal,sans-serif}article.blog-story .story-chapter>p{max-width:var(--story-text);font-size:inherit;line-height:inherit;color:var(--joy-ink);margin:0 auto 22px}article.blog-story .story-chapter>blockquote{max-width:var(--story-text);margin-inline:auto}article.blog-story .story-quote{background:var(--joy-sky);font-size:inherit;line-height:inherit;border:0;border-radius:24px;margin:40px auto;padding:clamp(24px,4vw,40px) clamp(24px,4.5vw,48px) clamp(24px,3.5vw,34px)}article.blog-story .story-quote-mark{height:.5em;color:var(--joy-blue);margin-bottom:6px;font:600 clamp(84px,10vw,120px)/1 Fredoka,Neue Montreal,sans-serif;display:block}article.blog-story .story-quote p{max-width:none;color:var(--joy-red);text-wrap:balance;margin:0;font:500 clamp(23px,3vw,32px)/1.32 Fredoka,Neue Montreal,sans-serif}article.blog-story .story-quote cite{letter-spacing:.07em;text-transform:uppercase;color:var(--joy-blue);margin-top:18px;font:600 14px/1.3 Neue Montreal,Arial,sans-serif;display:block}article.blog-story .story-quote-opening{text-align:center;max-width:820px;margin:clamp(48px,8vw,88px) auto}article.blog-story .story-quote-opening p{font-size:clamp(28px,4.2vw,42px);line-height:1.25}article.blog-story .story-photos{gap:16px;margin:36px 0 40px;display:grid}article.blog-story .story-single.story-wide{max-width:var(--story-wide);margin-inline:auto}article.blog-story .story-single.story-tall{max-width:560px;margin-inline:auto}article.blog-story .story-row-2{grid-template-columns:repeat(2,minmax(0,1fr))}article.blog-story .story-row-3{grid-template-columns:repeat(3,minmax(0,1fr))}article.blog-story .story-shot{min-width:0;margin:0}article.blog-story .story-frame{background:var(--joy-sky);cursor:zoom-in;border:0;border-radius:20px;width:100%;padding:0;display:block;overflow:hidden}article.blog-story .story-frame img{width:100%;max-width:none;height:auto;transition:opacity .2s;display:block}article.blog-story .story-row .story-frame img{object-fit:cover;height:100%}article.blog-story .story-row.story-wide .story-frame{aspect-ratio:4/3}article.blog-story .story-row.story-tall .story-frame{aspect-ratio:3/4}article.blog-story .story-frame:hover img{opacity:.9}article.blog-story .story-shot figcaption{text-align:left;color:#4d6470;margin-top:10px;font:400 15px/1.45 Neue Montreal,Arial,sans-serif}article.blog-story :is(p,li) a{color:var(--joy-blue);text-underline-offset:3px;overflow-wrap:anywhere;text-decoration:underline}article.blog-story :is(p,li) a[href^=tel\:]{white-space:nowrap;overflow-wrap:normal}article.blog-story .blog-cite a{text-decoration:none}article.blog-story .story-visit{max-width:var(--story-wide);background:var(--joy-sky);border-radius:28px;margin:0 auto 56px;padding:clamp(28px,5vw,56px)}article.blog-story .story-visit>h2{letter-spacing:-.01em;color:var(--joy-ink);margin:0 0 12px;font:600 clamp(28px,3.6vw,38px)/1.15 Fredoka,Neue Montreal,sans-serif}article.blog-story .story-visit>p{max-width:var(--story-text);color:var(--joy-ink);margin:0;font-size:18px;line-height:1.7}article.blog-story .story-sources{max-width:var(--story-text);color:#4d6470;margin:0 auto;padding-bottom:24px;font:400 14px/1.55 Neue Montreal,Arial,sans-serif}article.blog-story .story-sources>h2{letter-spacing:.08em;text-transform:uppercase;color:#4d6470;margin:0 0 10px;font:600 15px/1 Neue Montreal,Arial,sans-serif}article.blog-story .story-sources ol{color:inherit;font-size:inherit;grid-template-columns:minmax(0,1fr);gap:8px;margin:0;padding-left:20px;display:grid}article.blog-story .story-sources li{overflow-wrap:anywhere;margin:0;scroll-margin-top:140px}article.blog-story .story-sources li:target{background:var(--joy-yellow);border-radius:8px}article.blog-story .story-viewer{background:0 0;border:0;max-width:min(1100px,96vw);max-height:94vh;padding:0;overflow:visible}article.blog-story .story-viewer::backdrop{background:#173e54e0}article.blog-story .story-viewer img{border-radius:16px;max-width:100%;max-height:78vh;margin:0 auto;display:block}article.blog-story .story-viewer p{text-align:center;color:#fff;max-width:none;margin:12px 0 0;font:400 16px/1.4 Neue Montreal,Arial,sans-serif}article.blog-story .story-viewer-nav{flex-wrap:wrap;justify-content:center;gap:10px;margin-top:12px;display:flex}article.blog-story .story-viewer-nav button{background:var(--joy-cream);color:var(--joy-ink);cursor:pointer;border:0;border-radius:999px;padding:10px 18px;font:600 15px/1 Neue Montreal,Arial,sans-serif}article.blog-story .story-viewer[open]{animation:.2s ease-out story-fade}@keyframes story-fade{0%{opacity:0}to{opacity:1}}@media (max-width:640px){article.blog-story{font-size:18px}article.blog-story .story-hero{border-radius:20px}article.blog-story .story-row-3{grid-template-columns:minmax(0,1fr)}article.blog-story .story-row-3.story-tall .story-frame{aspect-ratio:4/5}}@media (prefers-reduced-motion:reduce){article.blog-story .story-viewer[open]{animation:none}article.blog-story .story-frame img{transition:none}}
