/* Approved magazine layout; shares tokens with blog.css. */
body { margin: 0px; }
.blog a { color: inherit; text-decoration: none; }
.blog a:hover h3,  .sections a:hover { color: var(--accent); }
.blog-shell { max-width: 1280px; }
.intro { padding: 54px 0px 28px; }
.intro h1 { font-size: clamp(38px, 5vw, 68px); font-weight: 500; letter-spacing: -0.035em; line-height: 1.04; }
.intro p { margin-top: 16px; color: var(--muted); }
.sections { display: flex; gap: 30px; border-top: 1px solid var(--blog-rule); border-bottom: 1px solid var(--blog-rule); padding: 17px 0px; font-size: 15px; flex-wrap: wrap; }
.sections a:first-child { color: var(--accent); }
section { margin-top: 42px; }
.section-title { display: flex; justify-content: space-between; align-items: baseline; gap: 20px; margin-bottom: 24px; }
.section-title h2 { font-size: 28px; font-weight: 500; letter-spacing: -0.025em; }
.section-title > a,  .section-title > span { font-size: 14px; }
.section-title p { font-size: 16px; margin-top: 8px; }
.stories { display: grid; gap: 30px; grid-template-columns: 2fr 1fr; }
.story { min-width: 0px; }
.story img { width: 100%; aspect-ratio: 1.76 / 1; object-fit: cover; }
.story h3 { font-size: 25px; font-weight: 500; line-height: 1.14; letter-spacing: -0.025em; text-wrap: balance; }
.story-copy { padding-top: 17px; }
.story p { font-size: 16px; color: var(--muted); margin-top: 12px; max-width: 58ch; }
.read { display: block; font-size: 14px; margin-top: 18px; color: var(--accent); }
.story-0 { grid-row: span 3; }
.story-0 h3 { font-size: 38px; }
.story:not(.story-0) > a { display: grid; grid-template-columns: 120px 1fr; gap: 18px; }
.story:not(.story-0) img { aspect-ratio: 1 / 1; object-fit: cover; }
.story:not(.story-0) .story-copy { padding: 0px; }
.story:not(.story-0) h3 { font-size: 21px; }
.story:not(.story-0) p,  .story:not(.story-0) .read { display: none; }
.anniversaries { background: var(--dark-bg); color: var(--on-dark); padding: 34px; margin-top: 56px; }
.editions { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 24px; align-items: start; }
.mosaic { display: grid; grid-template-columns: repeat(3, 1fr); }
.mosaic img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; }
.edition-copy { padding-top: 18px; }
.edition-copy > span { font-size: 13px; color: var(--blog-link-on-dark); }
.edition h3 { font-size: 28px; font-weight: 500; margin: 5px 0px; }
.edition p { font-size: 15px; }
.edition details { margin-top: 15px; font-size: 14px; }
.edition summary { cursor: pointer; }
.edition details p { margin-top: 12px; }
.updates { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; }
.updates .story > a { display: grid; grid-template-columns: 150px 1fr; gap: 24px; }
.updates .story img { aspect-ratio: 1 / 1; }
.updates .story-copy { padding: 0px; }
.updates h3 { font-size: 23px; }
.updates p { display: none; }
footer { display: flex; justify-content: space-between; gap: 20px; font-size: 14px; padding: 35px 0px 120px; margin-top: 48px; border-top: 1px solid var(--blog-rule); }
.blog :focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; }
@media (max-width: 700px) {
.intro { padding-top: 35px !important; display: block !important; }
.intro p { font-size: 17px; }
.sections { gap: 18px; font-size: 14px; }
.section-title h2 { font-size: 24px; }
.stories { flex-direction: column; display: flex !important; }
.story-0 h3 { font-size: 30px !important; }
.story-0 > a { display: block !important; }
.story-0 .story-copy { padding: 18px 0px !important; }
.story:not(.story-0) > a { display: grid !important; grid-template-columns: 100px 1fr !important; }
.story:not(.story-0) img { aspect-ratio: 1 / 1 !important; }
.story:not(.story-0) .story-copy { padding: 0px !important; }
.anniversaries { padding: 24px 20px; margin-inline: -20px; }
.anniversaries .section-title { display: block; }
.anniversaries .section-title > span { display: block; margin-top: 10px; }
.editions { overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 15px; display: flex !important; }
.edition { flex: 0 0 85%; scroll-snap-align: start; }
.edition:first-child { display: block !important; }
.updates { grid-template-columns: 1fr; }
.updates .story > a { grid-template-columns: 100px 1fr; }
footer { flex-direction: column; }
}
[data-variant="A"] .stories .story:not(.story-0) img { aspect-ratio: 4 / 3 !important; }
[data-variant="A"] .stories .story-0 img { aspect-ratio: 720 / 405; }
[data-variant="A"] .updates .story > a { display: block; }
[data-variant="A"] .updates .story img { aspect-ratio: 1480 / 840; object-fit: cover; }
[data-variant="A"] .updates .story-copy { padding-top: 18px; }
[data-variant="A"] .updates h3 { font-size: 23px; }
.edition-link { display: block; height: 100%; }
.edition-copy .edition-date { font-size: 14px; color: var(--blog-link-on-dark); }
.edition-copy h3 { font-size: clamp(23px, 2vw, 28px); line-height: 1.15; margin: 10px 0px 17px; letter-spacing: -0.02em; }
.album-list { list-style: none; display: grid; gap: 8px; font-size: 14px; line-height: 1.45; }
.album-list li { font-weight: 500; }
.album-list li span { font-weight: 400; }
.stories-button { display: inline-block; margin-top: 24px; padding: 11px 16px; background: var(--accent); color: var(--on-dark); font-size: 14px; border-radius: 4px; }
.blog .edition-link:hover h3 { color: var(--on-dark); text-decoration: underline; text-underline-offset: 4px; }
.edition-link:hover .stories-button { background: var(--on-dark); color: var(--ink); }
.post-shell { max-width: 920px; margin: 48px auto 100px; }
.post-back { display: inline-block; font-size: 15px; color: var(--accent) !important; }
.post-header { max-width: 740px; margin: 42px 0px 32px; }
.post-date { font-size: 15px; color: var(--accent); }
.post-header h1 { font-size: clamp(34px, 5vw, 56px); font-weight: 500; line-height: 1.1; letter-spacing: -0.03em; margin: 12px 0px 18px; }
.post-header p { margin-top: 12px; }
.post-header .sample-note { font-size: 14px; color: var(--muted); max-width: 65ch; }
.post-stories { margin: 48px 0px; }
.album-story { display: grid; grid-template-columns: 200px 1fr; gap: 32px; padding: 32px 0px; border-bottom: 1px solid var(--blog-rule); }
.album-story img { aspect-ratio: 1 / 1; object-fit: cover; }
.album-story span { font-size: 15px; color: var(--accent); }
.album-story h2 { font-size: 30px; line-height: 1.15; font-weight: 500; margin: 8px 0px 18px; }
.album-story p { max-width: 60ch; }
@media (max-width: 700px) {
[data-variant="A"] .updates .story img { aspect-ratio: 1480 / 840; }
.album-story { grid-template-columns: 90px 1fr; gap: 20px; }
.album-story h2 { font-size: 24px; }
.album-story p { font-size: 16px; }
}
.blog[data-variant] .updates .story img { width: 100%; height: auto; aspect-ratio: auto; object-fit: contain; }
.blog .album-list { font-size: 12px; }
.blog .edition-link .stories-button { color: rgb(255, 255, 255); }
.blog .edition-link:hover .stories-button { background: var(--accent); color: rgb(255, 255, 255); }
.blog[data-variant="A"] .updates .story > a { display: grid; grid-template-columns: minmax(160px, 40%) minmax(0px, 1fr); gap: 24px; align-items: start; }
.blog[data-variant="A"] .updates .story-copy { padding-top: 0px; }
.blog[data-variant="A"] .updates .story h3 { font-size: 21px; line-height: 1.2; }
@media (max-width: 700px) {
.blog[data-variant="A"] .updates .story > a { grid-template-columns: 40% minmax(0px, 1fr); gap: 18px; align-items: start; }
.blog[data-variant="A"] .updates .story h3 { font-size: 19px; }
}
@media (max-width: 700px) {
.blog[data-variant="A"] .updates .story > a { grid-template-columns: 40% minmax(0px, 1fr) !important; }
}
.blog[data-variant="A"] .updates .story img { height: auto; align-self: start; margin: 0px; padding: 0px; aspect-ratio: auto !important; }
.blog[data-variant="A"] .updates .story-copy { align-self: start; margin: 0px; padding: 0px; }
.list-page { padding: 40px 0px 100px; }
.list-page .intro { padding-top: 32px; }
.list-page .anniversaries { margin-top: 0px; }
.list-sample { font-size: 14px; margin-bottom: 24px; }
.anniversaries .section-title > a { white-space: nowrap; text-decoration: underline; text-underline-offset: 4px; }
.section-title > a:hover { color: var(--accent); }
.anniversaries .section-title > a:hover { color: var(--blog-link-on-dark); }
@media (max-width: 700px) {
.anniversaries .section-title { display: flex; align-items: baseline; gap: 14px; }
.section-title > a { font-size: 13px; white-space: nowrap; }
.anniversaries .section-title p { font-size: 14px; }
}
.list-page .blog-index-header { padding-top: 32px; }
.anniversary-archive .editions { grid-template-columns: repeat(3, minmax(0px, 1fr)); overflow: visible; align-items: start; display: grid !important; }
.anniversary-archive .edition:first-child { display: block !important; }
.edition-copy h3 { margin-top: 0px; }
@media (max-width: 700px) {
.anniversary-archive .editions { grid-template-columns: 1fr; gap: 40px; }
.anniversary-archive .edition { width: 100%; min-width: 0px; }
.anniversary-archive .anniversaries { margin-inline: 0px; }
.anniversary-archive .edition-copy h3 { font-size: 28px; }
}
.blog .anniversary-archive .anniversaries { background: transparent; color: var(--ink); padding: 0px; margin: 0px; }
.blog .anniversary-archive .edition-link:hover h3 { color: var(--accent); }
.blog .anniversary-archive .list-sample { color: var(--muted); }
.blog .album-story { display: block; border: 0px; padding: 0px; margin: 38px 0px; max-width: 720px; margin-inline: auto; }
.blog .album-heading { display: flex; align-items: center; gap: 16px; margin-bottom: 20px; }
.blog .album-heading img { width: 64px; height: 64px; flex: 0 0 64px; object-fit: cover; }
.blog .album-heading h2 { font-size: 21px; line-height: 1.3; letter-spacing: -0.015em; margin: 0px; color: var(--ink); font-weight: 500; }
.blog .album-heading .album-date { font-size: 14px; color: var(--muted); margin: 6px 0px 0px; }
.blog .album-prose p { font-size: var(--blog-body-size); line-height: 1.65; max-width: 720px; margin: 0px 0px 18px; color: var(--ink); }
@media (max-width: 700px) {
.blog .album-heading h2 { font-size: 19px; }
.blog .album-heading { align-items: flex-start; }
.blog .album-heading img { width: 56px; height: 56px; flex-basis: 56px; }
}
.blog .intro .shared-blog-title { font-size: clamp(38px, 5vw, 68px); font-weight: 500; letter-spacing: -0.035em; line-height: 1.04; color: var(--ink); margin: 0px; }
.blog .sections a { color: var(--ink); }
.blog .sections a[aria-current="page"],  .blog .sections a:hover { color: var(--accent); }
.blog .anniversary-banner { display: block; margin: 32px 0px; }
.blog .anniversary-banner img { display: block; width: 100%; height: auto; }
.blog .anniversary-archive .edition-link .stories-button,  .blog .anniversary-archive .edition-link:hover .stories-button { background: transparent; color: var(--accent); padding: 0px; border-radius: 0px; }
.blog .anniversary-archive .edition-link:hover .stories-button { text-decoration: underline; text-underline-offset: 4px; }
.blog .edition-link .stories-button,  .blog .edition-link:hover .stories-button { background: transparent; padding: 0px; border-radius: 0px; color: var(--blog-link-on-dark); }
.blog .anniversary-archive .edition-link .stories-button,  .blog .anniversary-archive .edition-link:hover .stories-button { color: var(--accent); }
.blog .archive-pagination { display: flex; justify-content: center; align-items: center; gap: 24px; margin-top: 40px; font-size: 15px; }
.blog .archive-pagination a { color: var(--accent); }
.blog .mosaic-jpeg { display: block; }
.blog .mosaic-jpeg img { width: 100%; height: auto; aspect-ratio: 3 / 2; }
.blog .story-copy { min-width: 0px; }
@media (min-width: 701px) and (max-width: 1050px) {
.blog[data-variant="A"] .stories { grid-template-columns: minmax(0px, 1.5fr) minmax(0px, 1fr); }
.blog[data-variant="A"] .stories .story:not(.story-0) > a { grid-template-columns: minmax(0px, 1fr); gap: 12px; }
.blog[data-variant="A"] .stories .story:not(.story-0) img { width: 100%; max-width: 180px; }
.blog[data-variant="A"] .stories .story:not(.story-0) h3 { font-size: 19px; }
.blog[data-variant="A"] .updates { grid-template-columns: 1fr; }
}
.blog .sections a,  .blog .archive-pagination a { min-height: 24px; display: inline-flex; align-items: center; }

.blog[data-variant=A] .stories .story-0 img{aspect-ratio:auto;height:auto}

/* Compact sidebar: spanning lead must not distribute spare height among stories. */
@media(min-width:701px){
 .blog[data-variant=A] .stories{grid-template-rows:auto auto auto auto 1fr;row-gap:24px}
 .blog[data-variant=A] .stories .story-0{grid-row:1 / 6;grid-column:1}
 .blog[data-variant=A] .stories .story-1{grid-row:1;grid-column:2}
 .blog[data-variant=A] .stories .story-2{grid-row:2;grid-column:2}
 .blog[data-variant=A] .stories .story-3{grid-row:3;grid-column:2}
}

.blog[data-variant=A] #anniversaries .editions{grid-template-columns:repeat(3,minmax(0,1fr))}

.post-meta{font-size:14px;color:#555}.collection-note{margin:40px 0}.collection-note h2{font-size:24px;line-height:1.25}.collection-note p{font-size:18px;line-height:1.6}.collection-note a{color:#ce3300}

@media(min-width:701px){.blog[data-variant=A] .stories .story-4{grid-row:4;grid-column:2}}