/* Rankwise — cross-site enhancement layer
   Applies to blog/lab/city/about/audit pages (not loaded by index.html)
   Strategy: override dark CSS variables at root so the existing page
   cascade automatically adjusts to the light editorial theme */
*,*::before,*::after{box-sizing:border-box}

/* ── Retheme: dark vars → light editorial ─────────────────── */
:root{
  --paper:#F7F0E3;
  --paper-2:#FFFDF7;
  --paper-3:#FFFFFF;
  --bg:#FFFDF7;
  --ink:#17231F;
  --ink-soft:rgba(23,35,31,.76);
  --ink-muted:rgba(23,35,31,.54);
  --line:rgba(23,35,31,.11);
  --line-strong:rgba(23,35,31,.22);
  --accent:#F2B533;
  --accent-2:#0F766E;
  --accent-3:#D95F42;
  --accent-4:#B84A32;
  --display:"Avenir Next","Segoe UI","Trebuchet MS",sans-serif;
  --serif:"Iowan Old Style","Palatino Linotype","Book Antiqua",Georgia,serif;
  --text:"Avenir Next","Segoe UI","Helvetica Neue",sans-serif;
}
body{
  background:linear-gradient(180deg,#F7F0E3 0%,#FFFDF7 50%,#E8F1EB 100%)!important;
  color:var(--ink)!important;
  -webkit-font-smoothing:antialiased;
}
/* ── Page headers ───────────────────────────────────────── */
.page-header{
  background:var(--paper)!important;
  border-bottom:1px solid var(--line)!important;
}
.page-header h1{color:var(--ink)!important;letter-spacing:-.025em!important}
.lbl{color:#0A675F!important}
/* ── Blog/lab list: clean borderline style ──────────────── */
.post-item{
  border-bottom:1px solid var(--line)!important;
  transition:opacity .15s!important;
}
.post-item:hover{opacity:.82!important}
.post-item:hover .post-title{color:var(--accent)!important}
.post-title{color:var(--ink)!important}
.post-meta,.post-badge{color:#0A675F!important}
.post-excerpt{color:var(--ink-soft)!important}
.post-link{color:#0A675F!important}
/* ── Article typography ────────────────────────────────── */
article h1,article h2,article h3{color:var(--ink)!important}
article p,article li{color:var(--ink-soft)!important}
article p strong,article li strong{color:var(--ink)!important}
article a{color:#006E67!important}
article a:hover{color:var(--accent-3)!important}
article hr{border-top-color:var(--line)!important}
.crumb,.crumb a{color:var(--ink-muted)!important}
.meta{color:#0A675F!important}
/* ── Audit CTA box ─────────────────────────────────────── */
.audit-cta{
  background:rgba(242,181,51,.08)!important;
  border:1px solid rgba(242,181,51,.28)!important;
  border-radius:16px!important;
}
.audit-cta h3{color:var(--ink)!important}
.audit-cta p{color:var(--ink-soft)!important}
/* ── Footer ────────────────────────────────────────────── */
footer{
  background:rgba(15,22,18,.96)!important;
  border-top:1px solid rgba(255,255,255,.08)!important;
}
.flogo,.flinks a,.fcopy{color:rgba(255,255,255,.70)!important}
.flogo span{color:#F2B533!important}
.flinks a:hover{color:#fff!important}
/* ── Buttons ────────────────────────────────────────────── */
.btn-primary,.audit-cta a{
  transition:transform .2s ease,box-shadow .2s ease!important;
  letter-spacing:0!important;
}
.btn-primary:hover,.audit-cta a:hover{transform:translateY(-1px)!important}
/* ── Tables ────────────────────────────────────────────── */
th{background:rgba(242,181,51,.06)!important;color:#0A675F!important}
.table-wrap{border-color:var(--line)!important;background:rgba(255,255,255,.6)!important}
td{color:var(--ink-soft)!important}
/* ── Sticky mobile CTA ──────────────────────────────────── */
.mobile-sticky-cta{display:none!important}
@media(max-width:1000px){
  .mobile-sticky-cta{
    display:flex!important;
    opacity:0!important;
    pointer-events:none!important;
    transform:translateY(12px)!important;
    transition:opacity .2s ease,transform .2s ease,box-shadow .2s ease!important;
  }
  body.show-mobile-cta .mobile-sticky-cta{
    opacity:1!important;
    pointer-events:auto!important;
    transform:translateY(0)!important;
  }
  body.show-mobile-cta .mobile-sticky-cta:hover{transform:translateY(-2px)!important}
  body{padding-bottom:calc(104px + env(safe-area-inset-bottom))!important}
  footer{padding-bottom:calc(96px + env(safe-area-inset-bottom))!important}
}
/* ── Blog/Lab: page header decoration ───────────────────── */
.page-header{
  background:linear-gradient(180deg,var(--paper) 0%,var(--paper-2) 100%)!important;
  position:relative!important;
}
.lbl{
  display:inline-flex!important;
  align-items:center!important;
  gap:8px!important;
}
.lbl::before{
  content:'';
  display:inline-block;
  width:18px;height:2px;
  background:currentColor;
  border-radius:1px;
  opacity:.7;
  flex-shrink:0;
}
/* ── Blog/Lab: post list refinements ────────────────────── */
.post-item{
  padding-left:18px!important;
  border-left:3px solid transparent!important;
  transition:border-color .2s ease,opacity .15s!important;
  position:relative!important;
}
.post-item:hover{
  opacity:1!important;
  border-left-color:var(--accent)!important;
}
.post-item:hover .post-title{color:var(--ink)!important}
/* ── Featured first post ─────────────────────────────────── */
.posts .post-item:first-child{
  padding-top:44px!important;
  padding-bottom:40px!important;
}
.posts .post-item:first-child .post-title{
  font-size:28px!important;
  line-height:1.12!important;
}
.posts .post-item:first-child .post-excerpt{
  font-size:16px!important;
  color:rgba(23,35,31,.68)!important;
  line-height:1.72!important;
}
/* ── Lab page: study post badge refinement ───────────────── */
.post-badge{
  background:rgba(10,103,95,.08)!important;
  border:1px solid rgba(10,103,95,.20)!important;
  color:#0A675F!important;
}
@media(max-width:700px){
  .page-header{padding:52px 18px 38px!important}
  article{padding:24px 18px 56px!important}
}
