*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

:root{
  --gold:#c9a96e;--gold-dim:#8a6a3a;
  --cream:#f0ead8;--cream-dim:#9a9080;
  --dark:#0a0906;--dark2:#120f0a;--dark3:#1c1710;--dark4:#242018;
  --border:rgba(201,169,110,0.15);--border-b:rgba(201,169,110,0.38);
}

html{scroll-behavior:smooth}
body{
  background:var(--dark);color:var(--cream);
  font-family:'Syne',sans-serif;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  line-height:1.6;
}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}

/* animated waveform background (from /links) — sits behind all content */
#waveform-bg{position:fixed;bottom:0;left:0;right:0;width:100%;height:220px;
  opacity:.07;pointer-events:none;z-index:-1}

/* ---------- NAV ---------- */
nav{position:fixed;top:0;left:0;right:0;z-index:200;display:flex;
  justify-content:space-between;align-items:center;padding:1.6rem 4rem;
  transition:background .4s,padding .4s,border-color .4s;
  border-bottom:1px solid transparent}
nav.s{background:rgba(10,9,6,.93);backdrop-filter:blur(14px);
  padding:1.1rem 4rem;border-bottom:1px solid var(--border)}
.nl{display:flex;align-items:center;gap:.85rem}
.nl img{height:48px;width:auto;opacity:.9}
.n-logo{font-family:'Cormorant Garamond',serif;font-size:1rem;font-weight:300;
  letter-spacing:.18em;color:var(--gold);text-transform:uppercase}
.n-links{display:flex;gap:2.2rem;align-items:center}
.n-links a{font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--cream-dim);transition:color .2s}
.n-links a:hover{color:var(--gold)}
.n-links a.n-here{color:var(--gold)}

/* ---------- shared eyebrow ---------- */
.journal-eyebrow,.post-eyebrow{
  font-family:'DM Mono',monospace;font-size:.66rem;letter-spacing:.32em;
  text-transform:uppercase;color:var(--gold-dim)}

/* ---------- JOURNAL INDEX ---------- */
main{min-height:60vh}
.journal{max-width:880px;margin:0 auto;padding:11rem 2rem 5rem}
.journal-head{border-bottom:1px solid var(--border);padding-bottom:2.4rem;margin-bottom:1rem}
.journal-eyebrow{margin-bottom:1rem}
.journal-title{font-family:'Cormorant Garamond',serif;font-weight:400;
  font-size:clamp(3rem,8vw,5rem);line-height:.98;letter-spacing:-.01em}
.journal-sub{margin-top:1.1rem;color:var(--cream-dim);font-size:1.02rem;max-width:42ch}
.journal-empty{padding:2.5rem 0;color:var(--cream-dim)}
.journal-empty a{color:var(--gold);border-bottom:1px solid var(--border-b)}

.post-list{list-style:none}
.post-row{border-bottom:1px solid var(--border)}
.post-link{display:grid;grid-template-columns:auto 1fr auto;gap:1.6rem;
  align-items:center;padding:1.8rem .25rem;transition:padding-left .3s ease}
.post-link:hover{padding-left:1rem}
.post-thumb{width:96px;height:64px;overflow:hidden;border:1px solid var(--border);
  border-radius:2px;background:var(--dark3)}
.post-thumb img{width:100%;height:100%;object-fit:cover;filter:saturate(.9) brightness(.95)}
.post-text{display:flex;flex-direction:column;gap:.35rem;min-width:0}
.post-date{font-family:'DM Mono',monospace;font-size:.7rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--gold-dim)}
.post-name{font-family:'Cormorant Garamond',serif;font-size:1.7rem;font-weight:400;
  line-height:1.15;color:var(--cream)}
.post-excerpt{color:var(--cream-dim);font-size:.92rem;max-width:54ch;
  overflow:hidden;text-overflow:ellipsis;display:-webkit-box;
  -webkit-line-clamp:2;-webkit-box-orient:vertical}
.post-arrow{font-size:1rem;color:var(--gold-dim);transition:color .25s,transform .25s;
  font-variant-emoji:text;-webkit-font-feature-settings:normal}
.post-link:hover .post-arrow{color:var(--gold);transform:translate(2px,-2px)}
.post-link:hover .post-name{color:var(--gold)}

/* ---------- SINGLE POST ---------- */
.post{max-width:720px;margin:0 auto;padding:11rem 2rem 5rem}
.post-head{border-bottom:1px solid var(--border);padding-bottom:2rem;margin-bottom:2.4rem}
.back{font-family:'DM Mono',monospace;font-size:.7rem;letter-spacing:.18em;
  text-transform:uppercase;color:var(--cream-dim);transition:color .2s;
  font-variant-emoji:text}
.back:hover{color:var(--gold)}
.post-head .post-eyebrow{margin:1.6rem 0 .9rem}
.post-title{font-family:'Cormorant Garamond',serif;font-weight:400;
  font-size:clamp(2.4rem,6vw,3.6rem);line-height:1.04;letter-spacing:-.01em}
.post-meta{margin-top:1rem}
.post-meta time{font-family:'DM Mono',monospace;font-size:.74rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--gold-dim)}

.post-cover{margin:0 0 2.6rem;border:1px solid var(--border);border-radius:2px;overflow:hidden}
.post-cover img{width:100%}
.post-cover figcaption{font-family:'DM Mono',monospace;font-size:.72rem;
  letter-spacing:.06em;color:var(--cream-dim);padding:.7rem 1rem;background:var(--dark2)}

/* body typography */
.post-body{font-size:1.08rem;color:#e7e0cf}
.post-body > * + *{margin-top:1.3rem}
.post-body h2{font-family:'Cormorant Garamond',serif;font-weight:500;
  font-size:1.9rem;letter-spacing:-.01em;color:var(--cream);margin-top:2.6rem}
.post-body h3{font-family:'Syne',sans-serif;font-weight:600;font-size:1.15rem;
  letter-spacing:.01em;color:var(--cream);margin-top:2rem}
.post-body a{color:var(--gold);border-bottom:1px solid var(--border-b)}
.post-body a:hover{border-color:var(--gold)}
.post-body strong{color:var(--cream);font-weight:600}
.post-body em{font-style:italic;color:#efe8d6}
.post-body ul,.post-body ol{padding-left:1.3rem}
.post-body li{margin-top:.5rem}
.post-body img{margin:1.8rem 0;border:1px solid var(--border);border-radius:2px}

/* responsive video embeds (YouTube / Vimeo) */
.post-body .embed{position:relative;width:100%;margin:2rem 0;
  border:1px solid var(--border);border-radius:2px;overflow:hidden;background:var(--dark3)}
.post-body .embed--video{padding-top:56.25%} /* 16:9 */
.post-body .embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* resizable images with alignment + caption */
.post-body .post-img{margin:2rem 0}
.post-body .post-img img{width:100%;height:auto;margin:0}
.post-body .post-img--small{max-width:320px}
.post-body .post-img--medium{max-width:520px}
.post-body .post-img--large{max-width:720px}
.post-body .post-img--full{max-width:100%}
.post-body .post-img--left{margin-left:0;margin-right:auto}
.post-body .post-img--center{margin-left:auto;margin-right:auto}
.post-body .post-img--right{margin-left:auto;margin-right:0}
.post-body .post-img figcaption{font-family:'DM Mono',monospace;font-size:.72rem;
  letter-spacing:.04em;color:var(--cream-dim);margin-top:.6rem}
.post-body blockquote{border-left:2px solid var(--gold-dim);padding-left:1.3rem;
  font-family:'Cormorant Garamond',serif;font-style:italic;font-size:1.3rem;
  color:var(--cream)}
.post-body code{font-family:'DM Mono',monospace;font-size:.86em;background:var(--dark3);
  padding:.12em .4em;border-radius:2px;color:var(--gold)}
.post-body pre{background:var(--dark2);border:1px solid var(--border);border-radius:3px;
  padding:1.1rem 1.2rem;overflow-x:auto}
.post-body pre code{background:none;padding:0;color:#e7e0cf}
.post-body hr{border:none;border-top:1px solid var(--border);margin:2.4rem 0}

.post-foot{margin-top:3.5rem;padding-top:2rem;border-top:1px solid var(--border)}

/* ---------- FOOTER ---------- */
.site-foot{border-top:1px solid var(--border);background:var(--dark2);
  padding:4rem 2rem 3rem}
.foot-inner{max-width:880px;margin:0 auto;text-align:center}
.foot-eyebrow{font-family:'DM Mono',monospace;font-size:.66rem;letter-spacing:.3em;
  text-transform:uppercase;color:var(--gold-dim);margin-bottom:1rem}
.foot-mail{font-family:'Cormorant Garamond',serif;font-size:1.8rem;color:var(--cream);
  display:inline-block;margin-bottom:1.6rem}
.foot-mail:hover{color:var(--gold)}
.foot-links{display:flex;gap:1.8rem;justify-content:center;flex-wrap:wrap;margin-bottom:1.6rem}
.foot-links a{font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--cream-dim)}
.foot-links a:hover{color:var(--gold)}
.foot-copy{font-family:'DM Mono',monospace;font-size:.66rem;letter-spacing:.1em;
  color:var(--cream-dim);opacity:.7}

/* ---------- RESPONSIVE ---------- */
@media (max-width:760px){
  nav,nav.s{padding:1.1rem 1.4rem}
  .n-links{gap:1.1rem}
  .n-links a{font-size:.58rem;letter-spacing:.14em}
  .n-logo{display:none}
  .journal,.post{padding-top:8.5rem}
  .post-link{grid-template-columns:auto 1fr auto;gap:1rem}
  .post-thumb{display:block;width:52px;height:52px}
}
@media (max-width:480px){
  .n-links a:not(.n-here){display:none}
}
@media (prefers-reduced-motion:reduce){
  *{scroll-behavior:auto !important;transition:none !important}
}
