/* RanaRestore Journal — inherits the Sanctuary palette from the main site */
:root{
  --paper:#F5F2EB; --paper-2:#EFEBE1; --white:#FBFAF6;
  --ink:#262219; --ink-soft:#57503F; --faint:#8B8270; --bronze:#9C7A45;
  --line:rgba(38,34,25,.14); --line-soft:rgba(38,34,25,.08);
  --max:1280px; --measure:44rem;
  --serif:"Cormorant Garamond","Palatino Linotype",Georgia,serif;
  --sans:"Jost","Helvetica Neue",Arial,sans-serif;
  --ease:cubic-bezier(.22,1,.36,1);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-weight:300;
     font-size:clamp(16px,1.02vw,17.5px);line-height:1.75;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
.wrap{max-width:var(--max);margin:0 auto;padding:0 clamp(20px,5vw,64px)}

/* header */
header.site{position:sticky;top:0;z-index:60;background:rgba(245,242,235,.88);
  backdrop-filter:saturate(140%) blur(12px);border-bottom:1px solid var(--line-soft)}
.site-inner{max-width:var(--max);margin:0 auto;padding:16px clamp(20px,5vw,64px);
  display:flex;align-items:center;justify-content:space-between;gap:24px}
.wordmark{font-family:var(--serif);font-size:22px;letter-spacing:.02em;text-decoration:none}
.wordmark em{font-style:italic;color:var(--bronze)}
.site-nav{display:flex;gap:28px}
.site-nav a{font-size:12px;letter-spacing:.16em;text-transform:uppercase;text-decoration:none;color:var(--ink-soft)}
.site-nav a:hover,.site-nav a[aria-current]{color:var(--ink)}
.header-cta{font-size:12px;letter-spacing:.16em;text-transform:uppercase;text-decoration:none;
  border-bottom:1px solid var(--bronze);padding-bottom:3px;white-space:nowrap}
@media(max-width:820px){.site-nav{display:none}}

/* article */
.article{padding:clamp(48px,7vw,96px) 0 0}
.eyebrow{font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--faint);margin:0 0 22px}
.eyebrow a{text-decoration:none;color:inherit;border-bottom:1px solid var(--line)}
h1{font-family:var(--serif);font-weight:400;line-height:1.06;letter-spacing:-.01em;
   font-size:clamp(34px,5.4vw,62px);margin:0 0 22px;max-width:20ch}
.dek{font-family:var(--serif);font-size:clamp(19px,2.1vw,25px);line-height:1.5;color:var(--ink-soft);
  max-width:36ch;margin:0 0 30px}
.byline{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--faint);
  border-top:1px solid var(--line);padding-top:16px;max-width:var(--measure)}
.hero-figure{margin:clamp(34px,5vw,58px) 0 0;position:relative;overflow:hidden;background:var(--paper-2)}
.hero-figure img{width:100%;aspect-ratio:16/8;object-fit:cover}
.hero-figure figcaption{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);padding-top:12px}

.prose{max-width:var(--measure);margin:clamp(40px,6vw,72px) 0 0}
.prose h2{font-family:var(--serif);font-weight:400;font-size:clamp(26px,3.2vw,38px);line-height:1.16;
  margin:clamp(46px,6vw,72px) 0 16px;letter-spacing:-.005em}
.prose h3{font-family:var(--sans);font-weight:500;font-size:15px;letter-spacing:.1em;text-transform:uppercase;
  margin:38px 0 10px;color:var(--ink)}
.prose p{margin:0 0 20px;color:var(--ink-soft)}
.prose p strong{color:var(--ink);font-weight:500}
.prose a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--bronze);padding-bottom:1px}
.prose a:hover{color:var(--bronze)}
.prose ul,.prose ol{margin:0 0 22px;padding-left:1.1em;color:var(--ink-soft)}
.prose li{margin:0 0 10px}
.prose li::marker{color:var(--bronze)}
.pull{font-family:var(--serif);font-style:italic;font-size:clamp(22px,2.6vw,30px);line-height:1.4;
  color:var(--ink);border-left:1px solid var(--bronze);padding:6px 0 6px 26px;margin:40px 0}
.note{background:var(--white);border:1px solid var(--line-soft);padding:22px 24px;margin:34px 0}
.note p{margin:0;font-size:15px}
.note strong{display:block;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--bronze);margin-bottom:8px}
table{width:100%;border-collapse:collapse;margin:28px 0;font-size:15px}
th,td{text-align:left;padding:12px 10px;border-bottom:1px solid var(--line-soft);color:var(--ink-soft)}
th{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink);font-weight:500}
.tablewrap{overflow-x:auto;margin:28px 0}
.tablewrap table{margin:0;min-width:520px}

/* CTA */
.cta{margin:clamp(56px,8vw,96px) 0 0;background:var(--white);border:1px solid var(--line-soft);
  padding:clamp(30px,5vw,54px);max-width:var(--measure)}
.cta h2{font-family:var(--serif);font-weight:400;font-size:clamp(26px,3.2vw,36px);margin:0 0 12px;line-height:1.15}
.cta p{color:var(--ink-soft);margin:0 0 24px}
.btn{display:inline-block;font-size:12px;letter-spacing:.18em;text-transform:uppercase;text-decoration:none;
  border:1px solid var(--ink);padding:15px 30px;transition:.4s var(--ease)}
.btn:hover{background:var(--ink);color:var(--paper)}
.btn.ghost{border-color:var(--line);margin-left:10px}
@media(max-width:520px){.btn.ghost{margin:12px 0 0}}

/* related + index cards */
.related{margin:clamp(56px,8vw,96px) 0 0;border-top:1px solid var(--line);padding-top:34px}
.related h2{font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--faint);margin:0 0 26px;font-family:var(--sans);font-weight:400}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:clamp(22px,3vw,40px)}
.card{text-decoration:none;display:block;border-top:1px solid var(--line);padding-top:18px}
.card .k{font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--bronze);display:block;margin-bottom:10px}
.card h3{font-family:var(--serif);font-weight:400;font-size:22px;line-height:1.25;margin:0 0 8px;text-transform:none;letter-spacing:0}
.card p{font-size:14px;color:var(--faint);margin:0;line-height:1.6}
.card:hover h3{color:var(--bronze)}

/* index page */
.index-head{padding:clamp(60px,9vw,120px) 0 clamp(30px,4vw,50px)}
.index-list{border-top:1px solid var(--line);margin:0 0 clamp(60px,8vw,100px)}
.entry{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:clamp(20px,4vw,60px);
  padding:clamp(28px,4vw,44px) 0;border-bottom:1px solid var(--line-soft);text-decoration:none;transition:.4s var(--ease)}
.entry:hover{background:rgba(251,250,246,.6)}
.entry .k{font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--bronze)}
.entry h2{font-family:var(--serif);font-weight:400;font-size:clamp(24px,2.9vw,34px);line-height:1.2;margin:0 0 10px}
.entry p{margin:0;color:var(--ink-soft);font-size:15px;max-width:52ch}
@media(max-width:760px){.entry{grid-template-columns:1fr;gap:10px}}

footer.site{border-top:1px solid var(--line);padding:44px 0 96px;margin-top:clamp(60px,8vw,110px)}
.foot{display:flex;flex-wrap:wrap;gap:18px 34px;align-items:center;justify-content:space-between;
  font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--faint)}
.foot a{text-decoration:none;color:var(--ink-soft)}
.foot a:hover{color:var(--ink)}
.disclaimer{max-width:var(--measure);margin:26px auto 0;font-size:12px;color:var(--faint);line-height:1.7;
  padding:0 clamp(20px,5vw,64px);text-align:left}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto}}
