/* Blog post / archive / 404 layout (from the redesign's post template). The design layer (lr-clay.css) restyles it into the site look under body.lr-clay. */

:root{
  --color-bg:#ffffff;
  --color-bg-soft:#f6f5f1;
  --color-bg-cream:#fbf8f0;
  --color-ink:#15161b;
  --color-ink-soft:#3a3d49;
  --color-muted:#5c5f6b;
  --color-muted-2:#7a7e8a;
  --color-gold:#8668f2;
  --color-gold-2:#a78bfa;
  --color-gold-soft:#ece7fd;
  --color-gold-deep:#5b43c4;
  --color-line:#e9e7e0;
  --color-line-2:#efede6;
}

html.dark,
html.dark-mode,
html.dark-theme,
html[data-theme="dark"],
body.dark,
body.dark-mode,
body.dark-theme,
body[data-theme="dark"]{
  --color-bg:#0f1015;
  --color-bg-soft:#181920;
  --color-bg-cream:#1e1b15;
  --color-ink:#ededf2;
  --color-ink-soft:#a5a9b8;
  --color-muted:#9ca3af;
  --color-muted-2:#6b7280;
  --color-gold:#9f83ff;
  --color-gold-2:#a78bfa;
  --color-gold-soft:#2c244c;
  --color-gold-deep:#ece7fd;
  --color-line:#2b2c36;
  --color-line-2:#21222d;
}

body{
  background-color:var(--color-bg);
  color:var(--color-ink);
}



/* ============================================================
   THE LEGACY ROOM — post.css
   Reusable stylesheet for every single blog post.
   Linked from index.php <head> for is_singular('post').
   All rules scoped under .lr-single so they can't affect your
   site header or footer.

   DARK MODE: this stylesheet does NOT own a toggle. It reacts to
   a local .lr-is-dark class mirrored onto .lr-single from the
   header's existing html/body theme state.
   ============================================================ */

.lr-single{
  /* tokens (light) */
  --ink:var(--color-ink); --ink-soft:var(--color-ink-soft);
  --bg:var(--color-bg); --bg-soft:var(--color-bg-soft);
  --gold:var(--color-gold); --gold-2:var(--color-gold-2); --gold-soft:var(--color-gold-soft); --gold-deep:var(--color-gold-deep);
  --muted:var(--color-muted); --muted-2:var(--color-muted-2);
  --btn-gold-text:#ffffff;
  --maxw:1200px;
  --shadow:0 18px 50px -22px rgba(20,22,30,.28);
  --hero-bg:radial-gradient(58% 60% at 50% -8%, color-mix(in srgb,var(--gold) 16%,transparent), transparent 70%);
  /* base */
  background:var(--bg);
  color:var(--ink-soft);
  font-family:"Inter",system-ui,sans-serif;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  scroll-behavior:smooth;
  transition:background .3s ease, color .3s ease;
}

.lr-single.lr-is-dark{
  --btn-gold-text:#0f1015;
  --shadow:0 18px 50px -22px rgba(0,0,0,.6);
  --hero-bg:radial-gradient(95% 100% at 50% -15%, #4a3590 0%, #2a1f55 30%, #1a1530 55%, transparent 78%);
}

.lr-single, .lr-single *, .lr-single *::before, .lr-single *::after{ box-sizing:border-box; }
.lr-single img{ max-width:100%; display:block; }
.lr-single a{ color:inherit; }
.lr-single :focus-visible{ outline:2px solid var(--gold); outline-offset:3px; border-radius:4px; }

.lr-single .container{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:24px; }

/* shared bits */
.lr-single .pill{
  display:inline-block; font-family:"Sora",sans-serif; font-weight:600;
  font-size:.72rem; letter-spacing:.09em; text-transform:uppercase;
  color:var(--gold-deep); background:var(--gold-soft);
  padding:.42rem .82rem; border-radius:999px; text-decoration:none;
}
.lr-single .btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  font-family:"Sora",sans-serif; font-weight:600; font-size:.95rem; line-height:1;
  padding:.85rem 1.6rem; border-radius:999px; border:1px solid transparent;
  cursor:pointer; text-decoration:none;
  transition:transform .2s ease, box-shadow .2s ease;
}
.lr-single .btn--gold{ background:var(--gold); color:var(--btn-gold-text); }
.lr-single .btn--gold:hover{
  transform:translateY(-2px);
  box-shadow:0 14px 30px -12px color-mix(in srgb,var(--gold) 70%,transparent);
}

/* placeholder block when a post has no image */
.lr-single .ph{
  background:
    radial-gradient(130% 130% at 0% 0%, color-mix(in srgb,var(--gold) 32%,transparent), transparent 52%),
    radial-gradient(130% 130% at 100% 100%, color-mix(in srgb,var(--gold-2) 38%,transparent), transparent 55%),
    var(--bg-soft);
  position:relative; overflow:hidden;
}
.lr-single .ph::after{
  content:""; position:absolute; inset:10px; border-radius:inherit; pointer-events:none;
  border:1px dashed color-mix(in srgb,var(--gold-deep) 30%,transparent);
}

/* reading progress bar */
.lr-single .progress{
  position:fixed; top:0; left:0; height:3px; width:0%; z-index:70;
  background:linear-gradient(90deg, var(--gold), var(--gold-2));
  transition:width .08s linear;
}

/* ---------- HERO ---------- */
.lr-single .hero{
  position:relative; padding:36px 0; text-align:center;
  background:var(--hero-bg);
}
.lr-single .hero__inner{ max-width:800px; margin-inline:auto; display:flex; flex-direction:column; align-items:center; gap:18px; }
.lr-single .backlink{
  align-self:flex-start; display:inline-flex; align-items:center; gap:.4rem;
  font-family:"Sora",sans-serif; font-weight:600; font-size:.9rem;
  color:var(--muted); text-decoration:none; transition:color .2s ease;
}
.lr-single .backlink .arrow{ transition:transform .2s ease; }
.lr-single .backlink:hover{ color:var(--gold-deep); }
.lr-single .backlink:hover .arrow{ transform:translateX(-3px); }
.lr-single .hero__title{
  max-width:760px; margin:0; font-family:"Sora",sans-serif; font-weight:800;
  font-size:clamp(2.1rem,4.6vw,3.5rem); line-height:1.08; letter-spacing:-.025em; color:var(--ink);
}
.lr-single .meta{
  display:flex; align-items:center; justify-content:center; flex-wrap:wrap;
  gap:12px; color:var(--muted); font-size:.94rem;
}
.lr-single .meta__author{ display:inline-flex; align-items:center; gap:10px; }
.lr-single .meta__author img{ width:38px; height:38px; border-radius:999px; }
.lr-single .meta__author strong{ color:var(--ink); font-weight:600; }
.lr-single .dot{ color:var(--muted-2); }
.lr-single .featured{
  width:100%; max-width:980px; aspect-ratio:16 / 7; border-radius:22px; overflow:hidden;
  margin:40px auto 0; box-shadow:var(--shadow);
}
.lr-single .featured img{ width:100%; height:100%; object-fit:cover; }

/* ---------- CONTENT: single column ---------- */
.lr-single .post{ padding:56px 24px 8px; }
.lr-single .article-wrap{ max-width:760px; margin-inline:auto; }

/* inline collapsible table of contents (top of article) */
.lr-single .toc-inline{
  margin:0 0 38px; padding:22px 24px; border-radius:16px;
  background:var(--bg-soft); border:1px solid color-mix(in srgb,var(--gold) 14%,transparent);
}
.lr-single .toc-inline > summary{
  cursor:pointer; list-style:none; display:flex; align-items:center; gap:10px;
  font-family:"Sora",sans-serif; font-weight:700; font-size:.78rem;
  letter-spacing:.12em; text-transform:uppercase; color:var(--ink);
}
.lr-single .toc-inline > summary::-webkit-details-marker{ display:none; }
.lr-single .toc-inline > summary::before{
  content:""; width:18px; height:18px; flex:none; border-radius:5px;
  background:linear-gradient(135deg,var(--gold),var(--gold-2));
}
.lr-single .toc-inline > summary::after{
  content:"▾"; margin-left:auto; color:var(--muted-2); transition:transform .2s ease;
}
.lr-single .toc-inline[open] > summary::after{ transform:rotate(180deg); }
.lr-single .toc-inline__list{
  list-style:none; margin:16px 0 0; padding:0; counter-reset:toc; display:grid; gap:2px;
}
.lr-single .toc-inline__list a{
  counter-increment:toc; display:flex; align-items:baseline; gap:12px;
  padding:9px 12px; border-radius:9px; color:var(--ink-soft);
  text-decoration:none; font-size:.98rem; line-height:1.4;
  transition:background .2s ease, color .2s ease;
}
.lr-single .toc-inline__list a::before{
  content:counter(toc,decimal-leading-zero);
  font-family:"Sora",sans-serif; font-weight:700; font-size:.8rem;
  color:var(--gold-deep); flex:none; min-width:1.6em;
}
.lr-single .toc-inline__list a:hover{
  background:color-mix(in srgb,var(--gold) 10%,transparent); color:var(--ink);
}

/* article body */
.lr-single .article{ color:var(--ink-soft); font-size:1.075rem; line-height:1.8; }
.lr-single .article p{ margin:0 0 1.4rem; }
.lr-single .article > p:first-of-type::first-letter{
  float:left; font-family:"Sora",sans-serif; font-weight:800;
  font-size:3.6rem; line-height:.82; padding:.04em .1em 0 0; margin-right:.04em; color:var(--gold);
}
.lr-single .article > p:first-of-type{ font-size:1.18rem; line-height:1.7; }
.lr-single .article h2{
  font-family:"Sora",sans-serif; font-weight:700; font-size:clamp(1.5rem,2.6vw,1.9rem);
  line-height:1.2; letter-spacing:-.015em; color:var(--ink); margin:2.8rem 0 1rem; scroll-margin-top:90px;
}
.lr-single .article h2::before{
  content:""; display:block; width:34px; height:3px; border-radius:3px; margin:0 0 .9rem;
  background:linear-gradient(90deg,var(--gold),var(--gold-2));
}
.lr-single .article h3{
  font-family:"Sora",sans-serif; font-weight:600; font-size:1.25rem; color:var(--ink); margin:1.9rem 0 .7rem;
}
.lr-single .article a{ color:var(--gold-deep); text-decoration:underline; text-underline-offset:3px; text-decoration-thickness:1.5px; transition:color .2s ease; }
.lr-single .article a:hover{ color:var(--gold); }
.lr-single .article strong{ color:var(--ink); font-weight:700; }
.lr-single .article ul, .lr-single .article ol{ margin:0 0 1.4rem; padding-left:1.3rem; }
.lr-single .article li{ margin-bottom:.55rem; }
.lr-single .article li::marker{ color:var(--gold); }
.lr-single .article img{ border-radius:14px; margin:1.5rem 0; }
.lr-single .article code{
  font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace; font-size:.86em;
  background:var(--gold-soft); color:var(--gold-deep); padding:.15em .45em; border-radius:6px;
}
.lr-single .article blockquote{
  position:relative; margin:2.4rem 0; padding:1.3rem 1.6rem 1.3rem 1.8rem;
  border:0; border-left:4px solid var(--gold); border-radius:0 14px 14px 0;
  background:color-mix(in srgb,var(--gold) 7%,transparent);
  font-family:"Sora",sans-serif; font-weight:600; font-size:clamp(1.2rem,2.2vw,1.4rem);
  line-height:1.45; color:var(--ink);
}

/* share row */
.lr-single .share{
  display:flex; align-items:center; gap:12px; flex-wrap:wrap;
  margin:8px 0 4px; padding-top:24px; border-top:1px solid color-mix(in srgb,var(--ink) 10%,transparent);
}
.lr-single .share__label{
  font-family:"Sora",sans-serif; font-weight:600; font-size:.82rem;
  letter-spacing:.04em; text-transform:uppercase; color:var(--muted-2);
}
.lr-single .social{
  font-family:"Sora",sans-serif; font-weight:600; font-size:.82rem;
  padding:.45rem .95rem; border-radius:999px; background:transparent; cursor:pointer;
  border:1px solid color-mix(in srgb,var(--ink) 14%,transparent);
  color:var(--ink); text-decoration:none;
  transition:border-color .2s ease, color .2s ease, transform .2s ease;
}
.lr-single .social:hover{ border-color:var(--gold); color:var(--gold-deep); transform:translateY(-2px); }

/* author box */
.lr-single .authorbox{
  margin:44px 0 8px; padding:28px; background:var(--bg-soft); border-radius:20px;
  display:flex; gap:22px; align-items:flex-start;
}
.lr-single .authorbox__photo{ flex:none; width:84px; height:84px; border-radius:999px; overflow:hidden; }
.lr-single .authorbox__photo img{ width:100%; height:100%; object-fit:cover; }
.lr-single .authorbox__name{ margin:0; font-family:"Sora",sans-serif; font-weight:700; font-size:1.2rem; color:var(--ink); }
.lr-single .authorbox__bio{ color:var(--ink-soft); margin:.6rem 0 1rem; line-height:1.7; font-size:.98rem; }
.lr-single .authorbox__socials{ display:flex; gap:10px; flex-wrap:wrap; }

/* newsletter */
.lr-single .newsletter{ background:var(--gold-soft); padding:64px 0; margin-top:44px; }
.lr-single .newsletter__inner{ max-width:660px; margin-inline:auto; padding-inline:24px; text-align:center; }
.lr-single .newsletter h2{ margin:0; font-family:"Sora",sans-serif; font-weight:700; font-size:clamp(1.6rem,3vw,2.15rem); letter-spacing:-.02em; color:var(--ink); }
.lr-single .newsletter p{ margin:.8rem auto 0; max-width:460px; color:var(--ink-soft); font-size:1rem; }
.lr-single .subscribe{ display:flex; gap:12px; justify-content:center; align-items:center; width:100%; margin-top:24px; }
.lr-single .subscribe--beehiiv{
  display:grid!important;
  place-items:center!important;
  justify-content:center!important;
  justify-items:center!important;
  width:100%!important;
  max-width:100%!important;
  text-align:center!important;
}
.lr-single .subscribe--beehiiv > *,
.lr-single .subscribe--beehiiv div,
.lr-single .subscribe--beehiiv iframe,
.lr-single .subscribe--beehiiv form{
  margin-left:auto!important;
  margin-right:auto!important;
}
.lr-single .subscribe--beehiiv form,
.lr-single .subscribe--beehiiv form > div{
  display:flex!important;
  justify-content:center!important;
  align-items:center!important;
}
.lr-single .subscribe input{
  flex:1; max-width:340px; padding:.9rem 1.25rem; border-radius:999px;
  border:1px solid color-mix(in srgb,var(--gold-deep) 30%,transparent);
  background:color-mix(in srgb,var(--bg) 68%,transparent);
  color:var(--ink); font-family:"Inter",sans-serif; font-size:.95rem;
}
.lr-single .subscribe input::placeholder{ color:var(--muted-2); }
.lr-single .subscribe input:focus{ outline:none; border-color:var(--gold); box-shadow:0 0 0 3px color-mix(in srgb,var(--gold) 25%,transparent); }
.lr-single .subscribe__done{ margin:24px 0 0; font-family:"Sora",sans-serif; font-weight:600; color:var(--gold-deep); }

/* related */
.lr-single .related{ padding:56px 0 24px; }
.lr-single .related h2{
  margin:0 0 28px; font-family:"Sora",sans-serif; font-weight:700;
  font-size:clamp(1.5rem,2.6vw,1.9rem); letter-spacing:-.015em; color:var(--ink); text-align:center;
}
.lr-single .cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.lr-single .card{
  background:var(--bg-soft); border-radius:18px; overflow:hidden; box-shadow:var(--shadow);
  text-decoration:none; color:inherit; display:flex; flex-direction:column;
  transition:transform .25s ease, box-shadow .25s ease;
}
.lr-single .card:hover{ transform:translateY(-6px); box-shadow:0 30px 60px -28px color-mix(in srgb,var(--ink) 45%,transparent); }
.lr-single .card__img{ aspect-ratio:16 / 10; width:100%; overflow:hidden; }
.lr-single .card__img img{ width:100%; height:100%; object-fit:cover; }
.lr-single .card__body{ padding:18px 18px 22px; display:flex; flex-direction:column; gap:10px; flex:1; }
.lr-single .card__body .pill{ align-self:flex-start; }
.lr-single .card__title{ margin:0; font-family:"Sora",sans-serif; font-weight:600; font-size:1.08rem; line-height:1.3; color:var(--ink); }
.lr-single .card__meta{ color:var(--muted); font-size:.85rem; margin-top:auto; }

/* responsive */
@media (max-width:768px){
  .lr-single .hero{ padding-top:28px; }
  .lr-single .featured{ aspect-ratio:16 / 10; }
  .lr-single .cards{ grid-template-columns:1fr; }
  .lr-single .authorbox{ flex-direction:column; }
  .lr-single .subscribe{ flex-direction:column; align-items:center; }
  .lr-single .subscribe input{ max-width:100%; width:100%; }
  .lr-single .subscribe .btn{ width:100%; }
}

/* reduced motion */
@media (prefers-reduced-motion:reduce){
  .lr-single{ scroll-behavior:auto; }
  .lr-single *, .lr-single *::before, .lr-single *::after{
    animation-duration:.001ms !important; transition-duration:.001ms !important;
  }
}

/* course box (inc/coursebox.php): category-matched link to the course hub, after the third paragraph.
   Dark glass card to match the author box / related cards. */
body.lr-clay .lr-single .lr-coursebox{
  margin:36px 0; padding:28px 30px; border-radius:24px; position:relative;
  background:linear-gradient(rgba(44,20,148,.92),rgba(44,20,148,.92)) padding-box,
             linear-gradient(120deg,#ffa45e,#ff8fb1 45%,#4fe0b4) border-box;
  border:1.5px solid transparent; box-shadow:0 18px 40px -24px rgba(10,0,60,.7);
}
body.lr-clay .lr-single .lr-coursebox::before{
  content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none;
  background:linear-gradient(rgba(255,255,255,.1),rgba(255,255,255,.04));
}
body.lr-clay .lr-single .lr-coursebox > *{ position:relative; }
body.lr-clay .lr-single .lr-coursebox__k{
  display:inline-block; font-size:.72rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  color:#1b0f4a !important; background:#4fe0b4; border-radius:999px; padding:5px 12px;
}
body.lr-clay .lr-single .article .lr-coursebox__t,
body.lr-clay .lr-single .lr-coursebox__t{
  margin:.8rem 0 0; font-weight:800; font-size:1.4rem; line-height:1.3; color:#fff !important; letter-spacing:-.01em;
}
body.lr-clay .lr-single .article .lr-coursebox__p,
body.lr-clay .lr-single .lr-coursebox__p{ margin:.55rem 0 1.15rem; color:rgba(255,255,255,.86) !important; line-height:1.7; font-size:1.02rem; }
body.lr-clay .lr-single .lr-coursebox__p a{ color:#4fe0b4 !important; font-weight:600; text-decoration:underline; text-underline-offset:2px; }
html body.lr-clay .lr-single .article .lr-coursebox a.lr-coursebox__btn,
body.lr-clay .lr-single a.lr-coursebox__btn{
  display:inline-flex; align-items:center; gap:8px; padding:13px 24px; border-radius:999px; text-decoration:none;
  font-weight:700; font-size:.95rem; color:#21124f !important; background:linear-gradient(135deg,#ffb56d,#ff9257);
  box-shadow:0 10px 24px -8px rgba(255,146,87,.6);
}
body.lr-clay .lr-single a.lr-coursebox__btn:hover{ filter:brightness(1.05); }
body.lr-clay .lr-single a.lr-coursebox__btn:focus-visible{ outline:3px solid #4fe0b4; outline-offset:3px; }
@media (max-width:767px){
  body.lr-clay .lr-single .lr-coursebox{ padding:22px 20px; margin:28px 0; }
  body.lr-clay .lr-single .lr-coursebox__t{ font-size:1.2rem; }
  body.lr-clay .lr-single a.lr-coursebox__btn{ width:100%; justify-content:center; }
}