/* Journal: featured hero, category chips, animated cards */
body.journal-page .journal-shell{position:relative;isolation:isolate;overflow:clip}
body.journal-page .journal-shell::before,body.journal-page .journal-shell::after{content:"";position:absolute;z-index:-1;border-radius:50%;filter:blur(70px);opacity:.5;pointer-events:none}
body.journal-page .journal-shell::before{width:460px;height:460px;left:-120px;top:-60px;background:radial-gradient(circle,#8bd3ff,transparent 70%);animation:jlDrift 16s ease-in-out infinite alternate}
body.journal-page .journal-shell::after{width:520px;height:520px;right:-160px;top:40px;background:radial-gradient(circle,#d6b8ff,transparent 70%);animation:jlDrift 20s ease-in-out infinite alternate-reverse}
@keyframes jlDrift{to{transform:translate(70px,50px) scale(1.12)}}
body.journal-page #listing>.eyebrow{display:inline-flex;align-items:center;gap:8px;padding:7px 14px;border-radius:980px;background:#fff;box-shadow:0 1px 0 rgba(0,0,0,.06),0 8px 24px -14px rgba(0,0,0,.25);font-size:12px;letter-spacing:.08em;color:#1d1d1f}
body.journal-page #listing>.eyebrow::before{content:"";width:8px;height:8px;border-radius:50%;background:#0071e3;animation:jlDot 2s ease-in-out infinite}
@keyframes jlDot{50%{transform:scale(1.7);opacity:.5}}
body.journal-page #listing>h1{font-size:clamp(40px,6vw,84px);letter-spacing:-.045em;line-height:1.02;margin:22px 0 16px}
body.journal-page #listing>p:not(.eyebrow){font-size:clamp(17px,1.6vw,21px);color:#515154;max-width:640px;margin:0}

body.journal-page .journal-controls{margin:34px 0 16px}
body.journal-page .journal-controls select{display:none}
body.journal-page .journal-controls input{background:#fff;border:0;border-radius:16px;height:52px;padding:0 20px;font-size:16px;box-shadow:0 0 0 1px rgba(0,0,0,.08),0 14px 30px -22px rgba(0,0,0,.4);transition:box-shadow .25s}
body.journal-page .journal-controls input:focus{outline:0;box-shadow:0 0 0 2px #0071e3,0 14px 30px -18px rgba(0,113,227,.4)}

.jc-chips{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 34px}
.jc-chip{--ac:#1d1d1f;border:0;border-radius:980px;padding:9px 18px;font:inherit;font-size:14px;font-weight:500;cursor:pointer;background:#fff;color:#1d1d1f;box-shadow:inset 0 0 0 1px rgba(0,0,0,.1);transition:transform .25s cubic-bezier(.2,.8,.2,1),background .2s,color .2s,box-shadow .2s}
.jc-chip em{font-style:normal;font-size:12px;opacity:.55;margin-left:4px}
.jc-chip:hover{transform:translateY(-2px);box-shadow:inset 0 0 0 1px var(--ac)}
.jc-chip.on{background:var(--ac);color:#fff;box-shadow:none}
.jc-chip[data-cat=tech]{--ac:#0071e3}.jc-chip[data-cat=world]{--ac:#0a8f6a}.jc-chip[data-cat=viz]{--ac:#d9480f}.jc-chip[data-cat=artist]{--ac:#8a3ffc}.jc-chip[data-cat=guide]{--ac:#b8860b}.jc-chip[data-cat=news]{--ac:#c2255c}

body.journal-page .journal-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
body.journal-page .journal-card{--ac:#1d1d1f;position:relative;display:flex;flex-direction:column;background:#fff;border:0;border-radius:28px;padding:0;overflow:hidden;color:#1d1d1f;text-decoration:none;box-shadow:0 0 0 1px rgba(0,0,0,.06),0 24px 48px -36px rgba(0,0,0,.45);transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s;animation:jlIn .7s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i,0)*90ms)}
@keyframes jlIn{from{opacity:0;transform:translateY(34px) scale(.98)}to{opacity:1;transform:none}}
body.journal-page .journal-card:hover{transform:translateY(-8px);box-shadow:0 0 0 1px rgba(0,0,0,.04),0 40px 60px -34px rgba(0,0,0,.5)}
body.journal-page .journal-card[data-cat=tech]{--ac:#0071e3}.journal-card[data-cat=world]{--ac:#0a8f6a}.journal-card[data-cat=viz]{--ac:#d9480f}.journal-card[data-cat=artist]{--ac:#8a3ffc}.journal-card[data-cat=guide]{--ac:#b8860b}.journal-card[data-cat=news]{--ac:#c2255c}
body.journal-page .jc-media{position:relative;aspect-ratio:16/10;overflow:hidden;background:#0b0b0c}
body.journal-page .journal-card .jc-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1.1s cubic-bezier(.2,.8,.2,1)}
body.journal-page .journal-card:hover .jc-media img{transform:scale(1.07)}
body.journal-page .jc-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(0,0,0,.28));pointer-events:none}
body.journal-page .journal-card .empty-cover{height:100%}
body.journal-page .jc-body{display:flex;flex-direction:column;gap:12px;padding:24px 26px 26px;flex:1}
body.journal-page .jc-top{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
body.journal-page .jc-cat{font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--ac);background:color-mix(in srgb,var(--ac) 12%,#fff);padding:6px 12px;border-radius:980px}
body.journal-page .jc-meta{font-size:13px;color:#6e6e73}
body.journal-page .journal-card h2{font-size:clamp(21px,2vw,27px);line-height:1.2;letter-spacing:-.025em;margin:0;font-weight:700}
body.journal-page .journal-card p{font-size:15.5px;line-height:1.55;color:#515154;margin:0;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
body.journal-page .jc-more{margin-top:auto;padding-top:6px;font-size:15px;font-weight:600;color:var(--ac);display:inline-flex;transition:transform .3s}
body.journal-page .journal-card:hover .jc-more{transform:translateX(6px)}

/* Featured first article */
body.journal-page .journal-grid.has-hero .journal-card.hero{grid-column:1/-1;flex-direction:row;background:#0b0b0f;color:#fff;border-radius:34px;min-height:430px}
body.journal-page .journal-card.hero .jc-media{flex:1.25;aspect-ratio:auto;min-height:100%}
body.journal-page .journal-card.hero .jc-media::after{background:linear-gradient(90deg,transparent 60%,#0b0b0f)}
body.journal-page .journal-card.hero .jc-body{flex:1;justify-content:center;gap:16px;padding:44px 44px 44px 28px}
body.journal-page .journal-card.hero h2{font-size:clamp(28px,3.4vw,46px);letter-spacing:-.035em}
body.journal-page .journal-card.hero p{color:#c7c7cc;font-size:17px;-webkit-line-clamp:4}
body.journal-page .journal-card.hero .jc-meta{color:#a1a1a6}
body.journal-page .journal-card.hero .jc-cat{background:color-mix(in srgb,var(--ac) 28%,#0b0b0f);color:#fff}
body.journal-page .journal-card.hero .jc-more{color:#fff;margin-top:8px}
body.journal-page .journal-card.hero .jc-more{background:var(--ac);padding:12px 22px;border-radius:980px;align-self:flex-start;font-size:16px}

/* Reader */
body.journal-page #reader>h1{font-size:clamp(32px,4.4vw,56px);letter-spacing:-.04em;line-height:1.1}
body.journal-page #reader .cover{border-radius:28px;max-height:520px}
body.journal-page #reader .article-body h2{letter-spacing:-.03em}
body.journal-page #reader>a:first-child{display:inline-block;margin-top:10px;color:#0066cc;text-decoration:none;font-size:15px}

@media(max-width:900px){
 body.journal-page .journal-grid.has-hero .journal-card.hero{flex-direction:column;min-height:0}
 body.journal-page .journal-card.hero .jc-media{aspect-ratio:16/10;min-height:0;flex:none}
 body.journal-page .journal-card.hero .jc-media::after{background:linear-gradient(180deg,transparent 55%,#0b0b0f)}
 body.journal-page .journal-card.hero .jc-body{padding:26px}
}
@media(max-width:700px){
 body.journal-page .journal-grid{grid-template-columns:1fr;gap:20px}
 .jc-chips{flex-wrap:nowrap;overflow-x:auto;margin-right:-6%;padding-right:6%;scrollbar-width:none}
 .jc-chips::-webkit-scrollbar{display:none}
 .jc-chip{flex:none;white-space:nowrap}
}
@media(prefers-reduced-motion:reduce){
 body.journal-page .journal-shell::before,body.journal-page .journal-shell::after,body.journal-page #listing>.eyebrow::before,body.journal-page .journal-card{animation:none}
 body.journal-page .journal-card,body.journal-page .jc-media img{transition:none}
}
