/* Blog — "The Dream Story Journal". Signal-A-style type: thin serif + heavy grotesk + light mono.
   (Signal-A's paid faces PP Editorial New / Neue Haas Grotesk / GT America Mono are matched with
   Cormorant Garamond 300 / Inter Tight 700–800 / IBM Plex Mono 300 from Google Fonts.) */
.bl-page{background:#fff;color:#111}
.bl-page a:not(.ds-pill){color:inherit}
.bl-page .ds-menu a{color:#ECE7DF}
.bl-page .ds-menu [aria-current="page"]{color:#C8A46B}
.bl-page .ds-mono{color:#3b3b3b}

/* hero */
.bl-hero{position:relative;padding:150px 28px 70px;max-width:1600px;margin:0 auto}
.bl-clock{position:absolute;top:78px;right:28px;width:min(360px,60vw);font-size:12px;font-weight:400;color:#222}
.bl-clock-row{display:grid;grid-template-columns:1.2fr 1fr .8fr;gap:8px;padding:6px 0;border-top:1px solid #111}
.bl-clock-row:last-child{display:flex;flex-wrap:wrap;justify-content:space-between;column-gap:12px}
.bl-label{margin:56px 0 22px;text-align:center;font-size:15px;font-weight:500;letter-spacing:.14em;color:#111 !important}
.bl-stage{position:relative}
.bl-label,.bl-headline,.bl-words{position:relative;z-index:1}
.bl-headline{margin:0;font-family:'Cormorant Garamond',Georgia,serif;font-weight:300;text-transform:uppercase;
  font-size:clamp(40px,7.6vw,138px);line-height:.84;letter-spacing:-.01em;text-align:justify;text-align-last:justify;color:#111}
.bl-headline b{font-family:'Inter Tight',Inter,system-ui,sans-serif;font-weight:800;letter-spacing:-.035em;font-size:.86em}
.bl-headline .w{display:inline-block}
.bl-dot{display:inline-block;width:.42em;height:.42em;border-radius:50%;background:#111;margin-right:.18em;vertical-align:.12em}
.bl-words{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:2px 16px;margin:70px auto 0;max-width:1100px;
  font-family:'Inter Tight',Inter,system-ui,sans-serif;font-size:13px;line-height:1.15;text-transform:uppercase;letter-spacing:.01em}
.bl-words b{font-weight:700}

/* timeline */
.bl-timeline{max-width:1600px;margin:0 auto;padding:60px 28px 110px}
.bl-tl-head{display:flex;justify-content:space-between;align-items:baseline;border-bottom:1px solid #111;padding-bottom:12px}
.bl-tl-head h2,.bl-tl-head p{margin:0;font-size:13px;font-weight:500;color:#111 !important}
.bl-tl-wrap{position:relative;display:grid;grid-template-columns:28px minmax(0,1fr);gap:0 22px}
.bl-rail{position:relative;margin-top:34px}
.bl-rail::before{content:"";position:absolute;left:13px;top:0;bottom:0;width:1px;background:#d6d6d6}
.bl-rail-fill{position:absolute;left:12px;top:0;width:3px;height:0;background:#111}
.bl-tl{list-style:none;margin:0;padding:0}
.bl-entry{display:grid;grid-template-columns:44px 150px minmax(0,1fr) 140px 150px;gap:18px;align-items:baseline;padding:28px 0;border-bottom:1px solid #d6d6d6;position:relative}
.bl-entry::before{content:"";position:absolute;left:-41px;top:42px;width:9px;height:9px;border-radius:50%;background:#fff;border:1.5px solid #111}
.bl-entry.is-on::before{background:#111}
.bl-no,.bl-tag,.bl-status{font-size:12px}
.bl-year{font-size:clamp(18px,1.6vw,24px);font-weight:500;color:#111 !important}
.bl-title{margin:0 0 8px;font-family:'Cormorant Garamond',Georgia,serif;font-weight:300;font-size:clamp(36px,4.4vw,76px);line-height:.95;text-transform:uppercase;letter-spacing:-.01em}
.bl-title a{text-decoration:none}
.bl-title a:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:6px}
.bl-ex{margin:0;max-width:560px;font-family:Inter,system-ui,sans-serif;font-size:16px;line-height:1.55;color:#333}
.bl-thumb{display:none;width:100%;max-width:420px;height:auto;margin-top:16px}
.bl-status{justify-self:end;text-align:right;color:#111 !important;font-weight:500}
.bl-preview{position:fixed;left:0;top:0;z-index:30;width:280px;aspect-ratio:4/5;object-fit:cover;pointer-events:none;box-shadow:0 30px 60px rgba(0,0,0,.25);transition:opacity .2s ease}

/* newsletter */
.bl-news{background:#111;color:#ECE7DF;padding:110px 28px}
.bl-news .ds-mono{color:#CFC8BD}
.bl-news-in{max-width:1240px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:64px;align-items:end}
.bl-kicker{margin:0 0 16px;font-size:13px}
.bl-news-h{margin:0 0 22px;font-family:'Cormorant Garamond',Georgia,serif;font-weight:300;text-transform:uppercase;font-size:clamp(46px,6vw,104px);line-height:.86}
.bl-news-h b{font-family:'Inter Tight',Inter,system-ui,sans-serif;font-weight:800;font-size:.84em;letter-spacing:-.035em}
.bl-news-p{margin:0;max-width:520px;font-family:Inter,system-ui,sans-serif;font-size:17px;line-height:1.6;color:#DDD6CB}
.bl-form{display:flex;flex-direction:column;gap:24px}
.bl-form .ds-cta{align-self:flex-start;font-size:13px;color:#fff}
.bl-done{border-top:1px solid #444;padding-top:22px}
.bl-done-h{margin:0 0 6px;font-family:'Cormorant Garamond',Georgia,serif;font-size:44px;line-height:1}
.bl-done p{font-family:Inter,system-ui,sans-serif;color:#DDD6CB}
.bl-footer{background:#000}
.bl-footer p{margin:0;font-size:12px;color:#A39C92 !important}

@media (max-width:900px){
.bl-entry{grid-template-columns:36px minmax(0,1fr);gap:8px 14px}
.bl-entry .bl-year{grid-column:2}
.bl-entry .bl-body{grid-column:1 / -1}
.bl-entry .bl-tag,.bl-entry .bl-status{grid-column:1 / -1;justify-self:start;text-align:left}
.bl-entry .bl-tag{margin-top:6px}
.bl-thumb{display:block}
.bl-news-in{grid-template-columns:minmax(0,1fr)}
.bl-words{grid-template-columns:repeat(4,minmax(0,1fr))}
.bl-words b{grid-column:auto !important;grid-row:auto !important}
}
@media (max-width:760px){
.bl-clock{position:static;width:auto;margin-bottom:10px}
.bl-hero{padding-top:96px}
.bl-headline{text-align:left;text-align-last:left}
.bl-tl-wrap{grid-template-columns:minmax(0,1fr)}
.bl-rail{display:none}
.bl-entry::before{display:none}
}
/* entry 06 is an invitation, not an article: warm tint, dashed gold edge and a gold call to action set it apart */
.bl-cta{background:#F6F1E8;outline:1px dashed #C8A46B;outline-offset:-1px;padding-left:18px;padding-right:18px;margin-top:20px;border-bottom:0}
.bl-entry.bl-cta::before{background:#C8A46B;border-color:#C8A46B}
.bl-cta .bl-tag,.bl-cta .bl-status{color:#7A5C24 !important}
.bl-cta .bl-status{text-decoration:none}
.bl-cta .bl-status:hover{text-decoration:underline;text-underline-offset:4px}