/* Fifteen curated compositions. All article order and accessible DOM order stay chronological. */
.brand svg{width:70px;height:42px}
[class*="identity-"] .brand{min-width:0;flex-shrink:1}
[class*="identity-"] .brand span{overflow-wrap:anywhere}
.category-intro{max-width:78ch;margin:12px 0 30px;line-height:1.8}
/* 1. Rounded: soft cards and generous introduction. */
.identity-rounded .card{border-radius:24px}
.identity-rounded .intro h1{max-width:900px}
.identity-rounded .site-header{border-bottom:3px solid var(--accent)}
.identity-rounded .article-body{border-radius:24px}
/* 2. Editorial: serif headlines, two-column newspaper. */
.identity-editorial h1,.identity-editorial h2{font-family:Georgia,serif;letter-spacing:-.025em}
.identity-editorial .card{border-radius:0;border:0;border-top:3px solid var(--accent)}
.identity-editorial .site-header{border-top:5px solid var(--accent)}
.identity-editorial .article-body{border-radius:0;border-top:3px solid var(--accent)}
/* 3. Compact: dense digest with ruled cards. */
.identity-compact .intro{padding:30px 0 18px}
.identity-compact .card-content{padding:16px}
.identity-compact .card{border-radius:5px;border-top:5px solid var(--accent)}
.identity-compact .cards{gap:18px}
.identity-compact .article-body{border-radius:5px;padding:24px}
/* 4. Magazine: a lead story and smaller supporting cards. */
.identity-magazine .site-header{border-bottom:5px double var(--accent)}
.identity-magazine .intro h1{font-family:Georgia,serif;font-style:italic;max-width:950px}
.identity-magazine .card{border-radius:0;border:0}
.identity-magazine .card:first-child h2{font-size:30px}
.identity-magazine .article-body{border:0;border-top:5px double var(--accent);border-radius:0}
/* 5. Split: horizontal photo/text rows. */
.identity-split .intro{border-left:8px solid var(--accent);padding:30px;margin:36px 0}
.identity-split .card{border-radius:12px;display:grid;grid-template-columns:minmax(100px,38%) minmax(0,1fr)}
.identity-split .card>a img{height:100%;min-height:200px;aspect-ratio:auto}
.identity-split .card:not(:has(>a)){grid-template-columns:1fr}
.identity-split .article-body{border-left:6px solid var(--accent)}
/* 6. Journal: centered masthead, quiet reading column. */
.identity-journal .intro{text-align:center;border-bottom:1px solid var(--accent)}
.identity-journal .intro h1{margin-left:auto;margin-right:auto;font-family:Georgia,serif}
.identity-journal .card{border:0;border-radius:0;background:transparent;border-bottom:1px solid var(--line)}
.identity-journal .card-content{padding:24px 0}
.identity-journal .article-body{border:0;background:transparent;padding-left:0;padding-right:0}
/* 7. Minimal: clean unboxed cards and restrained typography. */
.identity-minimal .site-header{background:transparent;border:0}
.identity-minimal .intro{padding-top:80px}
.identity-minimal .intro h1{font-weight:500;letter-spacing:-.055em}
.identity-minimal .card{background:transparent;border:0;border-radius:0}
.identity-minimal .card-content{padding:18px 0}
.identity-minimal .card img{border-radius:2px}
.identity-minimal .article-body{border:0;border-radius:0}
/* 8. Bold: high-contrast introduction and outlined cards. */
.identity-bold .intro{background:var(--accent);color:#fff;padding:42px 32px;margin-top:32px}
.identity-bold .intro .eyebrow{color:inherit}
.identity-bold .intro h1{font-weight:900;max-width:950px}
.identity-bold .card{border:2px solid var(--ink);border-radius:0;box-shadow:5px 5px 0 var(--ink)}
.identity-bold .article-body{border:2px solid var(--ink);border-radius:0}
/* 9. Studio: open gallery with oversized rounded photographs. */
.identity-studio .intro h1{font-weight:450;font-size:clamp(36px,6vw,68px)}
.identity-studio .card{border:0;background:transparent;border-radius:0}
.identity-studio .card img{border-radius:80px 80px 12px 12px;aspect-ratio:1/1}
.identity-studio .card-content{padding:24px 4px}
.identity-studio .article-body{border-radius:32px;border:0}
/* 10. Paper: inset reading panel and understated serif text. */
.identity-paper{font-family:Georgia,serif}
.identity-paper .site-header{background:transparent;border-bottom:1px solid var(--ink)}
.identity-paper main.wrap{background:var(--paper);padding:0 32px;margin-top:28px;margin-bottom:28px;box-shadow:0 8px 35px #00000009}
.identity-paper .card{border-radius:0;border:0;border-bottom:1px solid var(--line)}
.identity-paper .card-content{padding:20px 0}
.identity-paper .article-body{border:0;border-radius:0;box-shadow:0 8px 35px #00000009}
/* 11. Framed: outlined masthead and double-border reading panels. */
.identity-framed .intro{border:1px solid var(--accent);outline:1px solid var(--accent);outline-offset:7px;margin:42px 8px 32px;padding:32px;text-align:center}
.identity-framed .intro h1{margin-left:auto;margin-right:auto;font-family:Georgia,serif}
.identity-framed .card{border-radius:0;border:1px solid var(--accent);padding:8px}
.identity-framed .article-body{border:4px double var(--accent);border-radius:0}
/* 12. Panorama: wide photographic rows and a light content panel. */
.identity-panorama .intro{padding-bottom:12px}
.identity-panorama .intro h1{max-width:1000px;font-weight:600}
.identity-panorama .card{border:0;border-radius:0;position:relative}
.identity-panorama .card img{aspect-ratio:3/1}
.identity-panorama .card-content{border-left:5px solid var(--accent);margin:0 24px;padding:24px}
.identity-panorama .article-body{border:0;border-radius:0;border-left:5px solid var(--accent)}
/* 13. Ledger: numbered rows with clear separators. */
.identity-ledger .intro h1{font-family:Georgia,serif}
.identity-ledger .cards{counter-reset:stories;gap:0}
.identity-ledger .card{counter-increment:stories;border:0;border-top:1px solid var(--ink);border-radius:0;background:transparent;position:relative;padding-left:58px}
.identity-ledger .card:before{content:counter(stories,decimal-leading-zero);position:absolute;left:0;top:20px;color:var(--accent);font-size:24px;font-weight:750}
.identity-ledger .card>a{display:none}
.identity-ledger .card-content{padding:20px 0}
.identity-ledger .article-body{border-radius:0;border:0;border-top:1px solid var(--ink)}
/* 14. Mosaic: a regular grid punctuated by wide lead tiles. */
.identity-mosaic .intro{border-bottom:6px solid var(--accent);padding-bottom:24px}
.identity-mosaic .card{border:0;border-radius:16px}
.identity-mosaic .card:nth-child(3n+1){background:color-mix(in srgb,var(--accent) 9%,var(--paper))}
.identity-mosaic .article-body{border:0;border-radius:16px}
/* 15. Sidebar: introduction and topic navigation beside the feed. */
.identity-sidebar .intro{padding-top:32px}
.identity-sidebar .intro h1{font-family:Georgia,serif}
.identity-sidebar .card{border-radius:6px;border:0;border-bottom:3px solid var(--accent)}
.identity-sidebar .article-body{border-radius:6px;border:0;border-left:3px solid var(--accent)}
@media(min-width:851px){
.identity-editorial .cards,.identity-studio .cards{grid-template-columns:repeat(2,minmax(0,1fr))}
.identity-magazine .cards{grid-template-columns:repeat(2,minmax(0,1fr))}
.identity-magazine .card:first-child{grid-column:1/-1;display:grid;grid-template-columns:3fr 2fr}
.identity-magazine .card:first-child img{height:100%;aspect-ratio:16/9}
.identity-magazine .card:first-child:not(:has(>a)){display:block}
.identity-split .cards,.identity-journal .cards,.identity-panorama .cards,.identity-ledger .cards{grid-template-columns:1fr}
.identity-journal main.wrap{max-width:780px}
.identity-minimal .cards{gap:48px 32px}
.identity-mosaic .cards{grid-template-columns:repeat(3,minmax(0,1fr))}
.identity-mosaic .card:nth-child(5n+1){grid-column:span 2}
.identity-mosaic .card:nth-child(5n+1) img{aspect-ratio:3/1}
.identity-sidebar main.wrap{display:grid;grid-template-columns:minmax(200px,1fr) minmax(0,3fr);gap:0 40px;align-items:start}
.identity-sidebar main.wrap>.intro,.identity-sidebar main.wrap>.article-tools,.identity-sidebar main.wrap>.breadcrumbs,.identity-sidebar main.wrap>.category-intro{grid-column:1}
.identity-sidebar main.wrap>.intro{grid-row:1}
.identity-sidebar main.wrap>.article-tools{grid-row:2}
.identity-sidebar main.wrap>.cards{grid-column:2;grid-row:1/span 5;grid-template-columns:repeat(2,minmax(0,1fr));padding-top:32px}
.identity-sidebar main.wrap>.pagination{grid-column:2}
.identity-sidebar .intro h1{font-size:34px}
.identity-sidebar .topic-links{flex-direction:column;align-items:flex-start}
}
@media(max-width:540px){
.identity-split .card{display:block}
.identity-split .card>a img{aspect-ratio:3/2;min-height:0;height:auto}
.identity-paper main.wrap{padding:0 16px}
.identity-bold .intro,.identity-framed .intro{padding:24px 18px}
.identity-panorama .card-content{margin:0 8px;padding:18px}
.identity-studio .card img{border-radius:48px 48px 8px 8px;aspect-ratio:3/2}
.identity-minimal .intro{padding-top:36px}
}