/* Editorial discovery and shared navigation. One responsive system, no carousels. */
:root { --container:1200px; --header-height:80px; }
html { scroll-padding-top:100px; }
[hidden] { display:none!important; }
:focus-visible { outline:2px solid var(--ink); outline-offset:5px; }
body { overflow-wrap:break-word; }
.brand { font-size:38px; }
.brand-small { font-size:29px; }
.icon-button { width:44px; height:44px; flex-shrink:0; }
.desktop-nav { gap:24px; }
.desktop-nav a { font-size:14px; }
.mobile-menu { display:none; }
.mobile-menu summary { display:grid; place-items:center; width:44px; height:44px; list-style:none; cursor:pointer; }
.mobile-menu summary::-webkit-details-marker { display:none; }
.mobile-menu summary svg { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.6; }
.mobile-menu[open] summary { background:var(--surface); border-radius:50%; }
.mobile-menu nav { position:absolute; top:100%; left:0; right:0; padding:12px 24px 24px; background:var(--paper); border-bottom:1px solid var(--line); box-shadow:var(--shadow); max-height:calc(100dvh - var(--header-height)); overflow:auto; }
.mobile-menu nav a { display:block; padding:12px 0; border-bottom:1px solid var(--line); font-size:17px; }
.mobile-menu nav a[aria-current="page"] { font-weight:700; }
html:not(.js) .js-control { display:none; }
.eyebrow,.section-kicker { font-size:12px; }
.reveal { opacity:1; transform:none; }
.publication-intro { padding:30px 0 27px; display:flex; justify-content:space-between; gap:24px; align-items:center; }
.publication-intro h1 { font-family:'Manrope',sans-serif; font-size:clamp(22px,2.5vw,34px); line-height:1.22; letter-spacing:-.045em; margin:0; max-width:630px; }
.publication-intro p { font-size:14px; color:var(--muted); margin:0; text-align:right; flex-shrink:0; white-space:nowrap; }
.section-bar { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:18px 0; border-top:2px solid var(--ink); }
.section-bar h2 { margin:0; font-family:'Manrope',sans-serif; font-size:20px; line-height:1.3; letter-spacing:-.035em; }
.text-link { display:inline-flex; align-items:center; min-height:44px; font-size:14px; font-weight:600; text-decoration:underline; text-underline-offset:5px; text-decoration-thickness:1px; }
.text-link:hover { color:var(--muted); }
.lead-grid { display:grid; grid-template-columns:minmax(0,1.65fr) minmax(0,1fr); gap:32px; padding-bottom:40px; }
.lead-story,.side-stories,.story-copy { min-width:0; }
.story-link { display:block; }
.story-link h2,.story-link h3 { font-family:'Manrope',sans-serif; font-weight:700; letter-spacing:-.04em; line-height:1.16; margin:10px 0 12px; }
.story-link:hover h2,.story-link:hover h3 { text-decoration:underline; text-underline-offset:4px; text-decoration-thickness:1px; }
.story-link:focus-visible { outline-offset:6px; }
.story-image { display:block; width:100%; height:auto; aspect-ratio:3/2; object-fit:cover; background:var(--surface); }
.lead-story .story-image { aspect-ratio:16/9; }
.lead-story h2 { font-size:clamp(30px,3.25vw,46px); max-width:700px; }
.story-meta { display:flex; align-items:center; gap:10px; flex-wrap:wrap; font-size:12px; color:var(--muted); line-height:1.5; }
.story-meta .story-type { color:var(--ink); font-weight:700; }
.lead-story .story-meta { margin-top:18px; }
.story-description { font-size:16px; line-height:1.6; color:var(--muted); margin:0; max-width:64ch; }
.story-read { display:flex; align-items:center; gap:16px; margin-top:16px; font-size:13px; color:var(--muted); }
.story-read strong { color:var(--ink); font-size:14px; text-decoration:underline; text-underline-offset:4px; font-weight:600; }
.side-stories { border-left:1px solid var(--line); padding-left:32px; display:grid; align-content:start; gap:26px; }
.side-story+.side-story { padding-top:26px; border-top:1px solid var(--line); }
.side-story .story-link { display:grid; grid-template-columns:minmax(0,1fr) 120px; gap:18px; }
.side-story .story-image { grid-column:2; grid-row:1; aspect-ratio:1; }
.side-story .story-copy { grid-column:1; grid-row:1; }
.side-story h3 { font-size:clamp(21px,2vw,27px); margin-top:8px; }
.side-story .story-description { font-size:14px; }
.reading-section { padding-bottom:48px; }
.story-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:48px; }
.list-story { padding:25px 0; border-bottom:1px solid var(--line); }
.list-story .story-link { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:22px; }
.list-story .story-image { width:140px; grid-column:2; grid-row:1; }
.list-story .story-copy { grid-column:1; grid-row:1; }
.list-story h2,.list-story h3 { font-size:clamp(23px,2.3vw,30px); }
.list-story .story-read { margin-top:10px; }
.format-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px; padding:12px 0 36px; }
.format-link { padding-right:28px; }
.format-link+.format-link { border-left:1px solid var(--line); padding-left:32px; }
.format-link h3 { font-family:'Manrope',sans-serif; font-size:28px; letter-spacing:-.04em; margin:0 0 12px; }
.format-link p { font-size:16px; line-height:1.6; color:var(--muted); margin:0 0 14px; }
.format-link span { font-size:14px; text-decoration:underline; text-underline-offset:4px; }
.format-link:hover h3 { text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:5px; }
.publication-bottom { padding-top:10px; }
.upcoming-list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px; padding:0 0 36px; margin:0; list-style:none; }
.upcoming-list li { padding-top:10px; }
.upcoming-list h3 { font-family:'Manrope',sans-serif; font-size:20px; line-height:1.3; letter-spacing:-.03em; margin:10px 0 0; }
.upcoming-label { font-size:12px; color:var(--muted); }
.weekly-banner { display:grid; grid-template-columns:1fr 1.8fr auto; align-items:center; gap:28px; padding:30px; margin:12px 0 52px; background:var(--ink); color:var(--paper); }
.weekly-banner h2 { font-family:'Manrope',sans-serif; font-size:32px; letter-spacing:-.04em; margin:6px 0 0; }
.weekly-banner p { font-size:16px; line-height:1.6; margin:0; }
.weekly-banner .eyebrow { color:inherit; opacity:.75; }
.weekly-banner .text-link { white-space:nowrap; }
.about-publication { display:grid; grid-template-columns:1fr 1.6fr; gap:60px; padding:34px 0 60px; border-top:2px solid var(--ink); }
.about-publication h2 { font-family:'Manrope',sans-serif; font-size:clamp(30px,4vw,48px); line-height:1.12; letter-spacing:-.05em; margin:8px 0 0; }
.about-publication p { font-size:17px; line-height:1.7; margin:0 0 16px; }
.about-publication .eyebrow { font-size:12px; }
.archive-page { padding:42px 0 72px; }
.archive-head { padding:0 0 30px; }
.archive-head h1 { font-family:'Manrope',sans-serif; font-size:clamp(40px,6vw,76px); line-height:1.05; letter-spacing:-.055em; margin:10px 0 16px; }
.archive-head p { max-width:700px; color:var(--muted); font-size:17px; line-height:1.65; margin:0; }
.format-nav { display:flex; gap:24px; flex-wrap:wrap; padding:4px 0 14px; border-bottom:2px solid var(--ink); }
.format-nav a { display:inline-flex; align-items:center; min-height:44px; font-size:14px; }
.format-nav a[aria-current="page"] { font-weight:700; text-decoration:underline; text-underline-offset:7px; }
.archive-page .story-list { margin-top:6px; }
.archive-page .list-story:first-child { grid-column:1/-1; padding:28px 0; }
.archive-page .list-story:first-child .story-link { grid-template-columns:1fr 1fr; gap:40px; align-items:center; }
.archive-page .list-story:first-child .story-image { width:100%; grid-column:1; }
.archive-page .list-story:first-child .story-copy { grid-column:2; }
.archive-page .list-story:first-child h2 { font-size:clamp(28px,3.5vw,44px); }
.archive-page .list-story:first-child .story-link:not(:has(img)) { display:block; max-width:800px; }
/* Existing article prose, hero visuals and source lists remain intact. */
.article-hero { padding-top:38px; }
.article-title { font-size:clamp(34px,5.4vw,72px); line-height:1.06; letter-spacing:-.05em; }
.article-deck { font-size:clamp(18px,2vw,22px); }
.back-link { font-size:14px; min-height:32px; margin-bottom:24px; }
.article-byline { font-size:14px; }
.article-meta { font-size:13px; flex-wrap:wrap; }
.article-toc { position:static; }
.article-toc p { font-size:12px; }
.article-toc a { font-size:14px; line-height:1.5; }
.article-sources li,.article-sources>p { font-size:14px; }
.article-body table { display:block; max-width:100%; overflow-x:auto; }
.related-reading { border-top:2px solid var(--ink); padding-top:22px; padding-bottom:54px; }
.related-reading .section-bar { border:0; padding-top:0; }
.article-reading-layout { padding-bottom:64px; }
.footer-legal,.footer-instagram { font-size:14px; }
.footer-expanded { grid-template-columns:1fr auto; align-items:end; }
.footer-left { display:grid; gap:12px; justify-items:start; }
.footer-legal { display:flex; flex-wrap:wrap; gap:16px; }
.footer-instagram { align-self:center; color:var(--muted); }
.search-dialog { width:min(680px,calc(100% - 32px)); max-height:calc(100dvh - 48px); margin:24px auto; padding:30px; border:1px solid var(--line); color:var(--ink); background:var(--paper); border-radius:4px; }
.search-dialog::backdrop { background:rgb(0 0 0/.55); backdrop-filter:blur(3px); }
.search-dialog form { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:20px; }
.search-dialog h2 { font-family:'Manrope',sans-serif; font-size:28px; letter-spacing:-.04em; margin:0; }
.search-dialog label { display:block; margin:10px 0 8px; font-size:14px; }
.search-dialog input { width:100%; min-height:52px; padding:12px; background:var(--surface); color:var(--ink); border:1px solid var(--line); border-radius:0; font-size:16px; }
.search-status { color:var(--muted); font-size:14px; margin-bottom:0; }
.search-results { gap:0; }
.search-result { padding:16px 0; }
.search-result:hover strong { text-decoration:underline; }
.search-result span { font-size:14px; margin-top:5px; display:block; }
@media(max-width:1000px) {
 .lead-grid { grid-template-columns:minmax(0,1.4fr) minmax(0,1fr); gap:24px; }
 .side-stories { padding-left:24px; }
 .side-story .story-link { grid-template-columns:minmax(0,1fr) 88px; gap:12px; }
 .side-story .story-description { display:none; }
 .weekly-banner { grid-template-columns:1fr 2fr; }
 .weekly-banner .text-link { grid-column:2; }
}
@media(max-width:820px) {
 :root { --header-height:68px; }
 .mobile-menu { display:block; }
 .desktop-nav { display:none; }
 .publication-intro { padding:22px 0; }
 .publication-intro p { display:none; }
 .lead-grid { display:block; }
 .lead-story h2 { font-size:clamp(30px,5.4vw,44px); }
 .side-stories { grid-template-columns:repeat(2,minmax(0,1fr)); padding:24px 0 0; margin-top:24px; border-top:1px solid var(--line); border-left:0; gap:24px; }
 .side-story+.side-story { padding:0; border:0; }
 .story-list { column-gap:28px; }
 .list-story .story-image { width:100px; }
 .format-grid { gap:22px; }
 .format-link { padding-right:0; }
 .format-link+.format-link { padding-left:22px; }
 .format-link h3 { font-size:23px; }
 .about-publication { gap:30px; }
}
@media(max-width:600px) {
 .container,.article-shell { width:calc(100% - 36px); }
 .section-bar { padding:12px 0 16px; }
 .section-bar h2 { font-size:18px; }
 .publication-intro h1 { font-size:23px; max-width:300px; }
 .lead-grid { padding-bottom:30px; }
 .lead-story .story-meta { margin-top:16px; }
 .lead-story h2 { font-size:32px; line-height:1.13; letter-spacing:-.04em; }
 .side-stories,.story-list { grid-template-columns:1fr; }
 .side-stories { gap:20px; }
 .side-story+.side-story { border-top:1px solid var(--line); padding-top:20px; }
 .side-story .story-link { grid-template-columns:minmax(0,1fr) 100px; gap:18px; }
 .side-story h3 { font-size:22px; }
 .list-story { padding:22px 0; }
 .list-story h2,.list-story h3 { font-size:24px; }
 .list-story .story-description { font-size:15px; }
 .reading-section { padding-bottom:30px; }
 .format-grid,.upcoming-list { grid-template-columns:1fr; gap:0; }
 .format-link { padding:20px 0; }
 .format-link+.format-link { border-left:0; border-top:1px solid var(--line); padding:20px 0; }
 .format-link h3 { font-size:27px; margin-bottom:8px; }
 .format-link p { margin-bottom:8px; }
 .upcoming-list li { padding:16px 0; border-bottom:1px solid var(--line); }
 .upcoming-list h3 { font-size:19px; margin-top:5px; }
 .weekly-banner { display:block; padding:24px; margin-bottom:36px; }
 .weekly-banner>p { margin:16px 0 8px; }
 .about-publication { grid-template-columns:1fr; gap:24px; padding-bottom:36px; }
 .archive-page { padding-top:28px; }
 .format-nav { gap:18px; }
 .archive-page .list-story:first-child .story-link { display:flex; flex-direction:column; align-items:stretch; gap:16px; }
 .archive-page .list-story:first-child h2 { font-size:30px; }
 .archive-page .list-story:first-child .story-image { aspect-ratio:16/9; }
 .article-hero { padding-top:24px; }
 .article-title { font-size:clamp(34px,9vw,46px); }
 .article-reading-layout { padding-top:28px; padding-bottom:42px; }
 .article-toc a { display:block; margin-right:0; }
 .article-body section { margin-top:42px; }
 .article-rule { margin-top:24px; }
 .search-dialog { padding:20px; }
 .footer-expanded { grid-template-columns:1fr; gap:20px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }
.article-byline a { font-weight:600; text-decoration:underline; text-underline-offset:4px; }
.footer-instagram:hover { color:var(--ink); }
.founder-profile ul { padding-left:20px; }
.founder-profile li { margin:10px 0; }

/* Shared article cover uses the same editorial image as discovery. */
.article-cover { margin:28px 0 0; }
.article-cover img { display:block; width:100%; height:auto; aspect-ratio:16/9; object-fit:cover; background:var(--surface); }
.article-cover figcaption { margin-top:8px; color:var(--muted); font-size:12px; line-height:1.5; }
@media(max-width:600px) { .article-cover img { aspect-ratio:3/2; } }

/* Reader topic suggestions. */
.suggestion-page { max-width:720px; padding-top:48px; padding-bottom:64px; }
.suggestion-page h1 { font-family:'Manrope',sans-serif; font-size:clamp(32px,5vw,52px); letter-spacing:-.045em; line-height:1.12; margin:12px 0 20px; }
.suggestion-intro { font-size:18px; line-height:1.65; color:var(--muted); margin-bottom:32px; }
.suggestion-form label { display:block; margin:24px 0 8px; font-weight:600; font-size:15px; }
.suggestion-form label span { font-weight:400; color:var(--muted); }
.suggestion-form input:not([type=hidden]),.suggestion-form textarea { box-sizing:border-box; width:100%; padding:13px 14px; border:1px solid var(--line); border-radius:4px; background:var(--surface); color:var(--ink); font:inherit; font-size:16px; line-height:1.5; }
.suggestion-form textarea { resize:vertical; }
.suggestion-form :is(input,textarea,button):focus-visible { outline:2px solid var(--ink); outline-offset:3px; }
.suggestion-fields { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.suggestion-note { color:var(--muted); font-size:13px; line-height:1.65; margin:14px 0; }
.suggestion-note a { text-decoration:underline; text-underline-offset:3px; }
.suggestion-submit { min-height:48px; padding:12px 22px; margin-top:10px; border:1px solid var(--ink); border-radius:4px; background:var(--ink); color:var(--paper); font:inherit; font-weight:600; cursor:pointer; }
.suggestion-fallback { margin-top:24px; }
.article-suggestion { padding-top:36px; padding-bottom:32px; }
.article-suggestion p { color:var(--muted); font-size:16px; line-height:1.7; margin:0; }
@media(max-width:600px) { .suggestion-page { padding-top:30px; } .suggestion-fields { grid-template-columns:1fr; gap:0; } }

.article-suggestion .article-suggestion-button { display:inline-flex; align-items:center; justify-content:center; box-sizing:border-box; min-height:56px; margin-top:16px; padding:16px 30px; border:1px solid var(--ink); border-radius:4px; background:var(--ink); color:var(--paper); font-size:18px; font-weight:600; line-height:1.3; text-align:center; text-decoration:none; }
.article-suggestion .article-suggestion-button:hover { background:var(--paper); color:var(--ink); }
.article-suggestion .article-suggestion-button:focus-visible { outline:2px solid var(--ink); outline-offset:4px; }
@media(max-width:600px) { .article-suggestion .article-suggestion-button { width:100%; } }
