/* journal.css — the lifestyle hub */

/* HERO — full-bleed photo, matching the entry pages */
.j-hero { position:relative; margin-top:62px; min-height:54vh; max-height:520px; display:flex; align-items:center; justify-content:center; text-align:center; overflow:hidden; background:var(--navy); }
.j-hero .j-bg { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }
.j-hero::after { content:''; position:absolute; inset:0; background:linear-gradient(to top, rgba(8,18,32,0.72) 0%, rgba(8,18,32,0.38) 55%, rgba(8,18,32,0.30) 100%); }
.j-hero-in { position:relative; z-index:2; padding:64px 24px; }
.j-eyebrow { font-size:0.64rem; letter-spacing:0.34em; text-transform:uppercase; color:var(--gold2); margin-bottom:20px; }
.j-title { font-family:'Cormorant Garamond',serif; font-size:clamp(2.8rem,5vw,4.4rem); font-weight:400; color:#fff; line-height:1; letter-spacing:-0.01em; }
.j-title em { font-style:italic; color:var(--gold2); }
.j-sub { font-size:1.02rem; color:rgba(255,255,255,0.82); line-height:1.75; max-width:540px; margin:22px auto 0; }

/* FILTER BAR */
.j-filter { position:sticky; top:62px; z-index:50; display:flex; justify-content:center; flex-wrap:wrap; gap:8px; padding:18px 24px; background:rgba(252,251,248,0.92); backdrop-filter:blur(8px); border-bottom:1px solid var(--light); }
.j-chip { font-family:'Outfit',sans-serif; font-size:0.66rem; font-weight:500; letter-spacing:0.16em; text-transform:uppercase; color:var(--mid); background:none; border:1px solid var(--light); border-radius:2px; padding:8px 18px; cursor:pointer; transition:all 0.18s; }
.j-chip:hover { color:var(--navy); border-color:var(--gold); }
.j-chip.active { color:var(--white); background:var(--navy); border-color:var(--navy); }

/* FEATURED */
.j-featured-wrap { padding:56px 52px 0; }
.j-featured { max-width:1160px; margin:0 auto; display:grid; grid-template-columns:1.25fr 1fr; min-height:440px; border:1px solid var(--light); background:var(--white); }
.j-featured .jf-img { position:relative; overflow:hidden; background:var(--band); }
.j-featured .jf-img img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }
.j-featured .jf-flag { position:absolute; top:20px; left:20px; z-index:2; font-size:0.58rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--navy); background:var(--gold); padding:6px 12px; }
.j-featured .jf-text { padding:52px 56px; display:flex; flex-direction:column; justify-content:center; }
.jf-cat { font-size:0.62rem; letter-spacing:0.22em; text-transform:uppercase; color:var(--gold); margin-bottom:14px; }
.jf-title { font-family:'Cormorant Garamond',serif; font-size:clamp(1.9rem,3vw,2.6rem); font-weight:500; color:var(--navy); line-height:1.08; letter-spacing:-0.01em; }
.jf-dek { font-size:1rem; color:var(--mid); line-height:1.8; margin:18px 0 26px; }
.jf-read { align-self:flex-start; display:inline-flex; align-items:center; gap:8px; font-size:0.7rem; font-weight:500; letter-spacing:0.14em; text-transform:uppercase; color:var(--navy); text-decoration:none; border-bottom:1px solid var(--gold); padding-bottom:3px; transition:gap 0.2s; }
.jf-read::after { content:'→'; }
.jf-read:hover { gap:13px; color:var(--gold); }
.jf-date { font-size:0.66rem; letter-spacing:0.1em; text-transform:uppercase; color:#a7afb8; margin-top:20px; }

/* GRID */
.j-grid-wrap { padding:56px 52px 88px; }
.j-grid { max-width:1160px; margin:0 auto; display:grid; grid-template-columns:repeat(3,1fr); gap:34px; }
.j-card { display:flex; flex-direction:column; text-decoration:none; background:var(--white); border:1px solid var(--light); transition:transform 0.2s, box-shadow 0.2s; }
.j-card.live:hover { transform:translateY(-4px); box-shadow:0 14px 34px rgba(11,31,53,0.08); }
.j-thumb { position:relative; aspect-ratio:3/2; overflow:hidden; background:var(--band); }
.j-thumb img { width:100%; height:100%; object-fit:cover; display:block; }
/* placeholder tile for upcoming pieces */
.j-thumb.soon { display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg,var(--cream),var(--band)); }
.j-thumb.soon span { font-family:'Cormorant Garamond',serif; font-style:italic; font-size:2.2rem; color:rgba(11,31,53,0.16); }
.j-body { padding:22px 24px 26px; display:flex; flex-direction:column; flex:1; }
.j-cat { font-size:0.58rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--gold); margin-bottom:10px; }
.j-ct { font-family:'Cormorant Garamond',serif; font-size:1.5rem; font-weight:500; color:var(--navy); line-height:1.14; }
.j-cd { font-size:0.9rem; color:var(--mid); line-height:1.65; margin-top:10px; flex:1; }
.j-meta { margin-top:18px; font-size:0.62rem; letter-spacing:0.1em; text-transform:uppercase; color:#a7afb8; }
.j-card.soon { opacity:0.9; }
.j-card.soon .j-meta { color:var(--gold); }
.j-card[hidden] { display:none; }

/* NEWSLETTER STRIP */
.j-news { text-align:center; padding:64px 24px; background:var(--band); border-top:1px solid var(--light); }
.j-news h3 { font-family:'Cormorant Garamond',serif; font-size:clamp(1.6rem,2.6vw,2.2rem); font-weight:400; color:var(--navy); }
.j-news h3 em { font-style:italic; color:var(--gold); }
.j-news p { font-size:0.98rem; color:var(--mid); margin:10px auto 24px; max-width:440px; }

@media (max-width:900px) {
  .j-hero { padding:96px 24px 40px; }
  .j-filter { top:62px; }
  .j-featured-wrap, .j-grid-wrap { padding-left:24px; padding-right:24px; }
  .j-featured { grid-template-columns:1fr; }
  .j-featured .jf-img { height:56vw; max-height:340px; }
  .j-featured .jf-text { padding:36px 28px; }
  .j-grid { grid-template-columns:1fr; gap:26px; }
}