/* OKEMA motion layer v4 — cream sections converted to ink; no checkerboard cards */
:root{--anim-dur-fast:260ms;--anim-dur:640ms;--anim-dur-slow:920ms;--anim-ease:cubic-bezier(.22,1,.36,1);--anim-ease-soft:cubic-bezier(.33,1,.68,1);--anim-shift:20px;--anim-shift-sm:10px;--anim-stagger:78ms;--anim-stagger-max:8;--type-cream:#EDE9DE;--type-cream-warm:#F3EFE4;--type-sage:#A7C6AC;--type-gold:#C9AC74}
.has-anim .rv{opacity:0;transform:translateY(var(--anim-shift));transition:opacity var(--anim-dur) var(--anim-ease),transform var(--anim-dur) var(--anim-ease)}
.has-anim .rv-fade{opacity:0;transition:opacity var(--anim-dur) var(--anim-ease)}
.has-anim .rv-sm{opacity:0;transform:translateY(var(--anim-shift-sm));transition:opacity var(--anim-dur) var(--anim-ease),transform var(--anim-dur) var(--anim-ease)}
.has-anim .rv-scale{opacity:0;transform:scale(.975);transition:opacity var(--anim-dur) var(--anim-ease),transform var(--anim-dur) var(--anim-ease)}
.has-anim .rv-line{opacity:1;transform:scaleX(0);transform-origin:left;transition:transform var(--anim-dur) var(--anim-ease)}
.has-anim .rv.is-in,.has-anim .rv-fade.is-in,.has-anim .rv-sm.is-in,.has-anim .rv-scale.is-in{opacity:1;transform:none}
.has-anim .rv-line.is-in{transform:none}
.has-anim .rv-group>.rv,.has-anim .rv-group>.rv-fade,.has-anim .rv-group>.rv-sm,.has-anim .rv-group>.rv-scale,.has-anim .rv-group>.rv-line{transition-delay:calc(var(--i,0)*var(--anim-stagger))}
@keyframes okemaRise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.hero-1,.hero-2,.hero-3,.hero-4{animation:okemaRise var(--anim-dur-slow) var(--anim-ease) both}
.hero-1{animation-delay:0ms}.hero-2{animation-delay:85ms}.hero-3{animation-delay:170ms}.hero-4{animation-delay:255ms}
html{scroll-padding-top:84px}[id]{scroll-margin-top:84px}
.site-nav{position:sticky;top:0;z-index:50;background:#0B1E1A;transition:padding var(--anim-dur-fast) var(--anim-ease-soft),background var(--anim-dur-fast) linear,border-color var(--anim-dur-fast) linear,box-shadow var(--anim-dur-fast) linear}
.site-nav.is-stuck{background:rgba(11,30,26,.88);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom-color:rgba(201,172,116,.28);box-shadow:0 10px 28px rgba(0,0,0,.18);padding-top:14px!important;padding-bottom:14px!important}
.read-progress{position:fixed;top:0;left:0;right:0;height:2px;z-index:60;background:linear-gradient(90deg,#C9AC74,#8FB79A);transform:scaleX(0);transform-origin:left;transition:transform 80ms linear;pointer-events:none}
@media (hover:hover) and (pointer:fine){
.has-anim .studycard.is-in,.has-anim .solcard.is-in,.has-anim .indcard.is-in,.has-anim .featcard.is-in,.has-anim .artcard.is-in,.has-anim .studycard:not(.rv),.has-anim .modcard.is-in{transition:opacity var(--anim-dur) var(--anim-ease),transform var(--anim-dur-fast) var(--anim-ease-soft),box-shadow var(--anim-dur-fast) var(--anim-ease-soft),border-color .2s linear,background .2s linear}
.has-anim .studycard.is-in:hover,.has-anim .solcard.is-in:hover,.has-anim .indcard.is-in:hover,.has-anim .featcard.is-in:hover,.has-anim .artcard.is-in:hover,.has-anim .studycard:not(.rv):hover,.has-anim .modcard.is-in:hover{transform:translateY(-2px);box-shadow:0 14px 32px rgba(0,0,0,.22)}
.has-anim .btn-pill{transition:background .2s,transform var(--anim-dur-fast) var(--anim-ease-soft),box-shadow var(--anim-dur-fast) var(--anim-ease-soft)}
.has-anim .btn-pill:hover{transform:translateY(-1px);box-shadow:0 8px 20px rgba(201,172,116,.22)}
}

/*
 * Type accent — sage → cream settle when a reveal enters.
 * Attribute gate keeps light-section ink headings (#0B1E1A) untouched.
 * !important only beats inline cream so the settle is visible (narrow override).
 */
.has-anim .rv h1[style*="color:#EDE9DE"],
.has-anim .rv h2[style*="color:#EDE9DE"],
.has-anim .rv h3[style*="color:#EDE9DE"],
.has-anim .rv h1[style*="color:#F3EFE4"],
.has-anim .rv h2[style*="color:#F3EFE4"],
.has-anim .rv h3[style*="color:#F3EFE4"],
.has-anim .rv-sm h1[style*="color:#EDE9DE"],
.has-anim .rv-sm h2[style*="color:#EDE9DE"],
.has-anim .rv-sm h3[style*="color:#EDE9DE"],
.has-anim .rv-sm h1[style*="color:#F3EFE4"],
.has-anim .rv-sm h2[style*="color:#F3EFE4"],
.has-anim .rv-sm h3[style*="color:#F3EFE4"],
.has-anim .rv-fade h1[style*="color:#EDE9DE"],
.has-anim .rv-fade h2[style*="color:#EDE9DE"],
.has-anim .rv-fade h3[style*="color:#EDE9DE"],
.has-anim .rv-scale h1[style*="color:#EDE9DE"],
.has-anim .rv-scale h2[style*="color:#EDE9DE"],
.has-anim .rv-scale h3[style*="color:#EDE9DE"],
.has-anim h1.rv[style*="color:#EDE9DE"],
.has-anim h2.rv[style*="color:#EDE9DE"],
.has-anim h3.rv[style*="color:#EDE9DE"],
.has-anim h1.rv[style*="color:#F3EFE4"],
.has-anim h2.rv[style*="color:#F3EFE4"],
.has-anim h3.rv[style*="color:#F3EFE4"] {
  transition:
    opacity var(--anim-dur) var(--anim-ease),
    transform var(--anim-dur) var(--anim-ease),
    color var(--anim-dur) var(--anim-ease);
}

.has-anim .rv:not(.is-in) h1[style*="color:#EDE9DE"],
.has-anim .rv:not(.is-in) h2[style*="color:#EDE9DE"],
.has-anim .rv:not(.is-in) h3[style*="color:#EDE9DE"],
.has-anim .rv:not(.is-in) h1[style*="color:#F3EFE4"],
.has-anim .rv:not(.is-in) h2[style*="color:#F3EFE4"],
.has-anim .rv:not(.is-in) h3[style*="color:#F3EFE4"],
.has-anim .rv-sm:not(.is-in) h1[style*="color:#EDE9DE"],
.has-anim .rv-sm:not(.is-in) h2[style*="color:#EDE9DE"],
.has-anim .rv-sm:not(.is-in) h3[style*="color:#EDE9DE"],
.has-anim .rv-sm:not(.is-in) h1[style*="color:#F3EFE4"],
.has-anim .rv-sm:not(.is-in) h2[style*="color:#F3EFE4"],
.has-anim .rv-sm:not(.is-in) h3[style*="color:#F3EFE4"],
.has-anim .rv-fade:not(.is-in) h1[style*="color:#EDE9DE"],
.has-anim .rv-fade:not(.is-in) h2[style*="color:#EDE9DE"],
.has-anim .rv-fade:not(.is-in) h3[style*="color:#EDE9DE"],
.has-anim .rv-scale:not(.is-in) h1[style*="color:#EDE9DE"],
.has-anim .rv-scale:not(.is-in) h2[style*="color:#EDE9DE"],
.has-anim .rv-scale:not(.is-in) h3[style*="color:#EDE9DE"],
.has-anim h1.rv:not(.is-in)[style*="color:#EDE9DE"],
.has-anim h2.rv:not(.is-in)[style*="color:#EDE9DE"],
.has-anim h3.rv:not(.is-in)[style*="color:#EDE9DE"],
.has-anim h1.rv:not(.is-in)[style*="color:#F3EFE4"],
.has-anim h2.rv:not(.is-in)[style*="color:#F3EFE4"],
.has-anim h3.rv:not(.is-in)[style*="color:#F3EFE4"] {
  color: var(--type-sage) !important;
}

.has-anim .rv.is-in h1[style*="color:#EDE9DE"],
.has-anim .rv.is-in h2[style*="color:#EDE9DE"],
.has-anim .rv.is-in h3[style*="color:#EDE9DE"],
.has-anim .rv.is-in h1[style*="color:#F3EFE4"],
.has-anim .rv.is-in h2[style*="color:#F3EFE4"],
.has-anim .rv.is-in h3[style*="color:#F3EFE4"],
.has-anim .rv-sm.is-in h1[style*="color:#EDE9DE"],
.has-anim .rv-sm.is-in h2[style*="color:#EDE9DE"],
.has-anim .rv-sm.is-in h3[style*="color:#EDE9DE"],
.has-anim .rv-sm.is-in h1[style*="color:#F3EFE4"],
.has-anim .rv-sm.is-in h2[style*="color:#F3EFE4"],
.has-anim .rv-sm.is-in h3[style*="color:#F3EFE4"],
.has-anim .rv-fade.is-in h1[style*="color:#EDE9DE"],
.has-anim .rv-fade.is-in h2[style*="color:#EDE9DE"],
.has-anim .rv-fade.is-in h3[style*="color:#EDE9DE"],
.has-anim .rv-scale.is-in h1[style*="color:#EDE9DE"],
.has-anim .rv-scale.is-in h2[style*="color:#EDE9DE"],
.has-anim .rv-scale.is-in h3[style*="color:#EDE9DE"],
.has-anim h1.rv.is-in[style*="color:#EDE9DE"],
.has-anim h2.rv.is-in[style*="color:#EDE9DE"],
.has-anim h3.rv.is-in[style*="color:#EDE9DE"],
.has-anim h1.rv.is-in[style*="color:#F3EFE4"],
.has-anim h2.rv.is-in[style*="color:#F3EFE4"],
.has-anim h3.rv.is-in[style*="color:#F3EFE4"] {
  color: var(--type-cream) !important;
}

.has-anim .rv.is-in h1[style*="color:#F3EFE4"],
.has-anim .rv.is-in h2[style*="color:#F3EFE4"],
.has-anim .rv-sm.is-in h1[style*="color:#F3EFE4"],
.has-anim .rv-sm.is-in h2[style*="color:#F3EFE4"],
.has-anim h1.rv.is-in[style*="color:#F3EFE4"],
.has-anim h2.rv.is-in[style*="color:#F3EFE4"] {
  color: var(--type-cream-warm) !important;
}

/*
 * Ink-section atmosphere (legacy class .cream-ink)
 * Soft depth wash on scroll. All cards share the same ink panel treatment — no checkerboard,
 * no cream surfaces, no gold left/top inset accent stripes on cards.
 */
.cream-ink{position:relative;isolation:isolate;overflow:hidden}
.cream-ink::before{
  content:"";
  position:absolute;
  inset:-10% -8%;
  z-index:0;
  pointer-events:none;
  background:
    radial-gradient(ellipse 70% 55% at 8% 10%,rgba(201,172,116,.06),transparent 58%),
    radial-gradient(ellipse 60% 50% at 94% 90%,rgba(143,183,154,.05),transparent 55%),
    radial-gradient(ellipse 90% 42% at 50% 108%,rgba(7,19,15,.35),transparent 52%),
    linear-gradient(180deg,rgba(14,36,30,.35),transparent 22%,transparent 78%,rgba(7,19,15,.4));
  opacity:0;
  transform:scale(1.04);
  transition:opacity var(--anim-dur-slow) var(--anim-ease),transform var(--anim-dur-slow) var(--anim-ease);
}
.cream-ink>*{position:relative;z-index:1}
.has-anim .cream-ink.is-in::before,
html:not(.has-anim) .cream-ink::before{opacity:1;transform:none}

/* Unified ink cards — every child matches (no 4n checkerboard) */
.ink-cards>*,
.cream-ink .ink-grid>*,
.cream-ink .proof-cols>*{
  background:linear-gradient(165deg,#0E241E 0%,#0A1C18 100%)!important;
  border-color:rgba(201,172,116,.16)!important;
  box-shadow:none!important;
  color:#EDE9DE;
}
.ink-cards>*>h3,
.ink-cards>* [style*="font-family:'Newsreader'"],
.ink-cards>* [style*='font-family:"Newsreader"'],
.cream-ink .ink-grid>* h3,
.cream-ink .ink-grid>* [style*="font-family:'Newsreader'"],
.cream-ink .proof-cols>* [style*="font-family:'Newsreader'"]{color:#EDE9DE!important}
.ink-cards>* p,
.ink-cards>* [style*="color:#6E7F73"],
.ink-cards>* [style*="color:#4C5A51"],
.ink-cards>* [style*="color:#9FB0A8"],
.cream-ink .ink-grid>* p,
.cream-ink .proof-cols>* p{color:#9FB0A8!important}
.ink-cards>* [style*="color:#41504A"],
.ink-cards>* [style*="color:#33403A"],
.ink-cards>* [style*="color:#C6CFC8"]{color:#C6CFC8!important}
.ink-cards>* span[style*="background:#E9E5DA"],
.ink-cards>* span[style*="background:#fff"],
.ink-cards>* span[style*="background:rgba(201,172,116"],
.cream-ink span[style*="background:#E9E5DA"],
.cream-ink span[style*="background:#fff"]{
  background:rgba(201,172,116,.12)!important;
  border-color:rgba(201,172,116,.22)!important;
  color:#D8BE84!important;
}

.has-anim .cream-ink .ink-cards>*,
.has-anim .cream-ink .ink-grid>*,
.has-anim .cream-ink .proof-cols>*{
  transition:opacity var(--anim-dur) var(--anim-ease),transform var(--anim-dur) var(--anim-ease),border-color var(--anim-dur) var(--anim-ease),background var(--anim-dur) var(--anim-ease),box-shadow var(--anim-dur-fast) var(--anim-ease-soft);
}
.has-anim .cream-ink.is-in .ink-cards>*,
.has-anim .cream-ink.is-in .ink-grid>*,
.has-anim .cream-ink.is-in .proof-cols>*{
  border-color:rgba(201,172,116,.22)!important;
}

@media (hover:hover) and (pointer:fine){
.has-anim .cream-ink .ink-cards>*.is-in:hover,
.has-anim .cream-ink .ink-grid>*.is-in:hover,
.has-anim .cream-ink .proof-cols>*.is-in:hover,
.has-anim .cream-ink.is-in .ink-cards>*:not(.rv):hover,
.has-anim .cream-ink.is-in .ink-grid>*:not(.rv):hover,
.has-anim .cream-ink.is-in .proof-cols>*:not(.rv):hover{
  transform:translateY(-2px);
  box-shadow:0 14px 32px rgba(0,0,0,.28);
  border-color:rgba(201,172,116,.32)!important;
}
}

@media (prefers-reduced-motion:reduce){
*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
.has-anim .rv,.has-anim .rv-fade,.has-anim .rv-sm,.has-anim .rv-scale,.has-anim .rv-line{opacity:1;transform:none}
.has-anim .studycard.is-in:hover,.has-anim .solcard.is-in:hover,.has-anim .indcard.is-in:hover,.has-anim .featcard.is-in:hover,.has-anim .artcard.is-in:hover,.has-anim .studycard:not(.rv):hover,.has-anim .modcard.is-in:hover,.has-anim .btn-pill:hover,.has-anim .cream-ink .ink-cards>*:hover,.has-anim .cream-ink .ink-grid>*:hover,.has-anim .cream-ink .proof-cols>*:hover{transform:none;box-shadow:none}
/* Settle type accents immediately — no sage flash */
  .has-anim .rv h1[style*="color:#EDE9DE"],
  .has-anim .rv h2[style*="color:#EDE9DE"],
  .has-anim .rv h3[style*="color:#EDE9DE"],
  .has-anim .rv-sm h1[style*="color:#EDE9DE"],
  .has-anim .rv-sm h2[style*="color:#EDE9DE"],
  .has-anim .rv-sm h3[style*="color:#EDE9DE"],
  .has-anim .rv-fade h1[style*="color:#EDE9DE"],
  .has-anim .rv-fade h2[style*="color:#EDE9DE"],
  .has-anim .rv-fade h3[style*="color:#EDE9DE"],
  .has-anim .rv-scale h1[style*="color:#EDE9DE"],
  .has-anim .rv-scale h2[style*="color:#EDE9DE"],
  .has-anim .rv-scale h3[style*="color:#EDE9DE"],
  .has-anim h1.rv[style*="color:#EDE9DE"],
  .has-anim h2.rv[style*="color:#EDE9DE"],
  .has-anim h3.rv[style*="color:#EDE9DE"] {
    color: var(--type-cream) !important;
  }
  .has-anim .rv h1[style*="color:#F3EFE4"],
  .has-anim .rv h2[style*="color:#F3EFE4"],
  .has-anim .rv h3[style*="color:#F3EFE4"],
  .has-anim .rv-sm h1[style*="color:#F3EFE4"],
  .has-anim .rv-sm h2[style*="color:#F3EFE4"],
  .has-anim .rv-sm h3[style*="color:#F3EFE4"],
  .has-anim h1.rv[style*="color:#F3EFE4"],
  .has-anim h2.rv[style*="color:#F3EFE4"],
  .has-anim h3.rv[style*="color:#F3EFE4"] {
    color: var(--type-cream-warm) !important;
  }
  .cream-ink::before{opacity:1!important;transform:none!important}
}