/* Ivory & Bloom — Journal styles.
   Loaded after css/00-tokens.css and css/01-base.css, which now supply the
   shared tokens/resets this file used to duplicate (see README ADR-3).
   The overrides below preserve the journal's existing, slightly different
   measure (narrower --max-w, 32px container padding, no heading
   letter-spacing) exactly as they were before this split. */

:root { --max-w: 1200px; }
.container { padding: 0 32px; }
body { line-height: 1.7; }
h1, h2, h3, h4 { letter-spacing: normal; }
.eyebrow { margin-bottom: 14px; }

/* Header */
.jheader{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--linen);padding:16px 0}
.jheader-inner{display:flex;align-items:center;justify-content:space-between;gap:20px}
.jlogo{font-family:var(--font-display);font-size:22px;color:var(--espresso)}
.jlogo .amp{color:var(--brass);font-style:italic}
.jlogo .tag{font-family:var(--font-body);font-size:9.5px;letter-spacing:.22em;text-transform:uppercase;color:#A8988B;margin-left:6px}
.jnav{display:flex;gap:26px;flex-wrap:wrap}
.jnav a{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);transition:color .3s}
.jnav a:hover,.jnav a.active{color:var(--terracotta-rose)}
@media(max-width:760px){.jnav{display:none}}

/* Journal index hero */
.jhero{text-align:center;padding:76px 20px 56px;background:var(--parchment)}
.jhero h1{font-size:clamp(34px,4.6vw,56px);font-weight:400;margin-bottom:14px}
.jhero p{color:var(--terracotta-rose);max-width:520px;margin:0 auto;font-size:15.5px}

/* Post grid */
.jgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;padding:64px 0 40px}
@media(max-width:960px){.jgrid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.jgrid{grid-template-columns:1fr}}
.jcard{background:var(--white);border:1px solid var(--linen);border-radius:4px;overflow:hidden;transition:transform .4s ease,box-shadow .4s ease;display:flex;flex-direction:column}
.jcard:hover{transform:translateY(-8px);box-shadow:0 22px 44px rgba(51,37,30,.1)}
.jcard .thumb{aspect-ratio:16/10;overflow:hidden}
.jcard .thumb img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.jcard:hover .thumb img{transform:scale(1.06)}
.jcard-body{padding:26px 24px 30px;display:flex;flex-direction:column;flex:1}
.jmeta{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--brass);margin-bottom:12px}
.jcard h2{font-size:21px;font-weight:400;line-height:1.3;margin-bottom:12px}
.jcard p{font-size:14px;color:#8A7E74;margin-bottom:18px;flex:1}
.jread{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--terracotta-rose);display:inline-flex;gap:8px;transition:gap .3s ease}
.jcard:hover .jread{gap:14px}

/* Pagination */
.jpagination{display:flex;justify-content:center;align-items:center;gap:10px;padding:10px 0 90px}
.jpage-btn{min-width:42px;height:42px;border-radius:50%;border:1px solid var(--linen);display:flex;align-items:center;justify-content:center;font-size:13px;color:var(--ink-soft);transition:all .3s ease;padding:0 14px}
.jpage-btn:hover{border-color:var(--brass);color:var(--terracotta-rose)}
.jpage-btn.active{background:var(--espresso);border-color:var(--espresso);color:var(--white)}
.jpage-btn[disabled]{opacity:.35;pointer-events:none}

/* Breadcrumb */
.jbreadcrumb{max-width:var(--max-w);margin:0 auto;padding:16px 32px;font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:#A8988B}
.jbreadcrumb a{color:var(--terracotta-rose);transition:color .3s}
.jbreadcrumb a:hover{color:var(--espresso)}
.jbreadcrumb .sep{margin:0 8px;color:var(--brass)}

/* Article */
.jarticle-hero{position:relative;height:52vh;min-height:340px;max-height:560px;overflow:hidden}
.jarticle-hero img{width:100%;height:100%;object-fit:cover}
.jarticle-hero::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,15,12,.18),rgba(20,15,12,.05) 40%,rgba(20,15,12,.45))}
.jarticle-head{max-width:760px;margin:-90px auto 0;position:relative;z-index:2;background:var(--white);border-radius:6px 6px 0 0;padding:44px 48px 8px;text-align:center}
@media(max-width:700px){.jarticle-head{margin:-56px 16px 0;padding:30px 22px 4px}}
.jarticle-head h1{font-size:clamp(28px,3.6vw,44px);font-weight:400;line-height:1.16;margin-bottom:16px}
.jarticle-meta{font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--brass)}
.jprose{max-width:680px;margin:0 auto;padding:34px 24px 70px;font-size:16.5px;line-height:1.85}
.jprose p{margin-bottom:22px}
.jprose h2{font-size:26px;font-weight:500;margin:40px 0 16px}
.jprose ul{margin:0 0 22px 20px}
.jprose li{margin-bottom:10px}
.jprose em{color:var(--terracotta-rose)}
.jprose .lead{font-size:19px;font-family:var(--font-display);font-style:italic;color:var(--terracotta-rose)}
.jdivider{display:flex;align-items:center;gap:12px;justify-content:center;margin:36px 0}
.jdivider span{width:44px;height:1px;background:var(--linen)}
.jdivider svg{width:12px;height:12px;color:var(--brass)}

/* Post CTA */
.jcta{background:var(--linen);text-align:center;padding:56px 24px;border-radius:6px;max-width:760px;margin:0 auto 80px}
.jcta h3{font-size:26px;font-weight:400;margin-bottom:10px}
.jcta p{color:var(--terracotta-rose);font-size:14.5px;margin-bottom:24px}
.jbtn{display:inline-block;background:var(--brass);color:var(--white);padding:14px 32px;font-size:12px;letter-spacing:.15em;text-transform:uppercase;border-radius:2px;transition:background .3s,transform .3s}
.jbtn:hover{background:var(--terracotta-rose);transform:translateY(-2px)}

/* Related */
.jrelated{max-width:var(--max-w);margin:0 auto;padding:0 32px 90px}
.jrelated h3{text-align:center;font-size:26px;font-weight:400;margin-bottom:34px}
.jrelated-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:28px;max-width:820px;margin:0 auto}
@media(max-width:640px){.jrelated-grid{grid-template-columns:1fr}}

/* Footer */
.jfooter{border-top:1px solid var(--linen);text-align:center;padding:48px 20px 34px;background:var(--parchment)}
.jfooter .jlogo{display:inline-block;margin-bottom:10px}
.jfooter-nav{display:flex;justify-content:center;flex-wrap:wrap;gap:4px 12px;margin:14px 0 20px}
.jfooter-nav a{font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft)}
.jfooter-nav a:hover{color:var(--terracotta-rose)}
.jfooter-nav span{color:var(--brass)}
.jcopy{font-size:11px;color:#A8988B}