/* ============ LRSF HOME — custom effects (Path B) ============ */
/* Palette: near-black base, forest green, warm gold. No blue/purple. */
:root{
  --lrsf-ink:#0E0E0C;
  --lrsf-ink2:#15150F;
  --lrsf-green:#2E7D5B;
  --lrsf-gold:#C9A227;
  --lrsf-gold-soft:#E2C566;
  --lrsf-cream:#FAF7F2;
}

/* ---- 1. Fixed noise-grain overlay 3.5% ---- */
.lrsf-grain{position:fixed;inset:0;z-index:9998;pointer-events:none;opacity:.035;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}

/* ---- 2. Preloader curtain ---- */
#lrsf-pre{position:fixed;inset:0;z-index:9999;background:var(--lrsf-ink);display:flex;align-items:center;justify-content:center;flex-direction:column;transition:opacity .6s ease}
#lrsf-pre .lrsf-pre-word{color:var(--lrsf-cream);font-family:'Cormorant Garamond',serif;font-size:64px;font-weight:700;letter-spacing:6px;opacity:0;transform:translateY(14px);animation:lrsfPreWord .8s ease forwards}
#lrsf-pre .lrsf-pre-line{height:2px;width:0;background:var(--lrsf-gold);margin-top:14px;animation:lrsfPreLine .7s ease .6s forwards}
#lrsf-pre.lrsf-pre-top,#lrsf-pre.lrsf-pre-bot{}
.lrsf-pre-curtain{position:fixed;left:0;right:0;height:50%;z-index:9999;background:var(--lrsf-ink);transition:transform .7s cubic-bezier(.77,0,.18,1)}
.lrsf-pre-curtain.top{top:0}.lrsf-pre-curtain.bot{bottom:0}
body.lrsf-revealed .lrsf-pre-curtain.top{transform:translateY(-100%)}
body.lrsf-revealed .lrsf-pre-curtain.bot{transform:translateY(100%)}
@keyframes lrsfPreWord{to{opacity:1;transform:translateY(0)}}
@keyframes lrsfPreLine{to{width:120px}}

/* ---- 3. Frosted nav on scroll (legible light text) ---- */
#main-header{transition:background-color .35s ease,backdrop-filter .35s ease,box-shadow .35s ease!important;background:transparent!important;box-shadow:none!important}
/* soft top gradient so light text stays readable even over light hero edges */
#main-header:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.45),rgba(0,0,0,0));pointer-events:none;z-index:-1}
body.lrsf-nav-scrolled #main-header{background:rgba(14,14,12,.92)!important;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 2px 30px rgba(0,0,0,.45)!important}
body.lrsf-nav-scrolled #main-header:before{display:none}
/* force menu links light + gold hover/active, top and scrolled */
#main-header #top-menu>li>a,#main-header #top-menu>li>a:visited{color:#FAF7F2!important;text-shadow:0 1px 6px rgba(0,0,0,.4)}
#main-header #top-menu>li>a:hover,#main-header #top-menu>li.current-menu-item>a,#main-header #top-menu>li.current_page_item>a{color:#E2C566!important}
/* dropdowns dark */
#main-header #top-menu li ul{background:rgba(14,14,12,.96)!important;border-top:2px solid #C9A227!important}
#main-header #top-menu li ul li a{color:#FAF7F2!important}
#main-header #top-menu li ul li a:hover{color:#E2C566!important;background:rgba(201,162,39,.12)!important}
/* mobile menu icon + menu */
#main-header .mobile_menu_bar:before{color:#FAF7F2!important}
.et_mobile_menu{background:rgba(14,14,12,.97)!important;border-top:2px solid #C9A227!important}
.et_mobile_menu li a{color:#FAF7F2!important}
/* search icon */
#et_top_search .et-search-icon{color:#FAF7F2!important}

/* ---- 4. Hero drifting shapes ---- */
.lrsf-hero-shapes{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.lrsf-shape{position:absolute;border-radius:50%;filter:blur(60px);opacity:.5}
.lrsf-shape.s1{width:420px;height:420px;background:var(--lrsf-green);top:-80px;left:-60px;animation:lrsfDrift1 18s ease-in-out infinite}
.lrsf-shape.s2{width:360px;height:360px;background:var(--lrsf-gold);bottom:-80px;right:-40px;animation:lrsfDrift2 22s ease-in-out infinite}
.lrsf-shape.s3{width:300px;height:300px;background:#1f5e44;top:30%;right:20%;animation:lrsfDrift3 26s ease-in-out infinite}
@keyframes lrsfDrift1{0%,100%{transform:translate(0,0)}50%{transform:translate(40px,30px)}}
@keyframes lrsfDrift2{0%,100%{transform:translate(0,0)}50%{transform:translate(-30px,-40px)}}
@keyframes lrsfDrift3{0%,100%{transform:translate(0,0)}50%{transform:translate(-25px,25px)}}

/* ---- 5. Scroll reveal base ---- */
.lrsf-reveal{opacity:0;transform:translateY(28px);transition:opacity .7s ease,transform .7s ease}
.lrsf-reveal.is-in{opacity:1;transform:none}
.lrsf-reveal.d1{transition-delay:.1s}.lrsf-reveal.d2{transition-delay:.2s}.lrsf-reveal.d3{transition-delay:.3s}

/* ---- 6. Gold-left-border grow (urgency + CSR cards) ---- */
.lrsf-growcard{position:relative;overflow:hidden;transition:transform .35s ease,box-shadow .35s ease}
.lrsf-growcard::before{content:"";position:absolute;left:0;top:0;width:4px;height:0;background:var(--lrsf-gold);transition:height .4s ease}
.lrsf-growcard:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(0,0,0,.18)}
.lrsf-growcard:hover::before{height:100%}

/* ---- 7. Focus-area tilt + shine ---- */
.lrsf-tilt{position:relative;transform-style:preserve-3d;transition:transform .15s ease;will-change:transform}
.lrsf-tilt .lrsf-shine{position:absolute;inset:0;border-radius:inherit;opacity:0;transition:opacity .3s ease;background:radial-gradient(circle at var(--mx,50%) var(--my,50%),rgba(226,197,102,.25),transparent 45%);pointer-events:none}
.lrsf-tilt:hover .lrsf-shine{opacity:1}
.lrsf-flag{border:1px solid var(--lrsf-gold)!important;box-shadow:0 0 24px rgba(201,162,39,.25)}

/* ---- 8. AI Mission pulsing edges + ring ---- */
.lrsf-aiband{position:relative;overflow:hidden}
.lrsf-aiband .lrsf-edge{position:absolute;left:0;right:0;height:2px}
.lrsf-aiband .lrsf-edge.top{top:0;background:var(--lrsf-gold);animation:lrsfPulseGold 3s ease-in-out infinite}
.lrsf-aiband .lrsf-edge.bot{bottom:0;background:var(--lrsf-green);animation:lrsfPulseGreen 3s ease-in-out infinite 1.5s}
@keyframes lrsfPulseGold{0%,100%{opacity:.3}50%{opacity:1}}
@keyframes lrsfPulseGreen{0%,100%{opacity:.3}50%{opacity:1}}
.lrsf-ring{display:inline-block;position:relative;width:10px;height:10px;border-radius:50%;background:var(--lrsf-gold);margin-right:10px;vertical-align:middle}
.lrsf-ring::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:2px solid var(--lrsf-gold);opacity:.6;animation:lrsfRing 2.4s ease-out infinite}
@keyframes lrsfRing{0%{transform:scale(.6);opacity:.7}100%{transform:scale(1.8);opacity:0}}

/* ---- 9. Theory of Change line-draw ---- */
.lrsf-toc-line{position:absolute;top:42px;left:0;height:3px;width:0;background:var(--lrsf-gold);transition:width 1.4s ease}
.lrsf-toc-line.is-in{width:100%}
.lrsf-toc-dot{width:18px;height:18px;border-radius:50%;background:var(--lrsf-ink2);border:2px solid var(--lrsf-gold);transform:scale(.7);transition:transform .4s ease,background-color .4s ease}
.lrsf-toc-dot.is-in{background:var(--lrsf-gold);transform:scale(1)}

/* ---- 10. Impact mosaic ---- */
.lrsf-mosaic{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:200px;gap:14px}
.lrsf-mtile{position:relative;overflow:hidden;border-radius:12px}
.lrsf-mtile img{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.lrsf-mtile:hover img{transform:scale(1.08)}
.lrsf-mtile .lrsf-mcap{position:absolute;left:0;right:0;bottom:0;padding:22px;background:linear-gradient(transparent,rgba(14,14,12,.85));color:#fff;transform:translateY(12px);transition:transform .4s ease}
.lrsf-mtile:hover .lrsf-mcap{transform:translateY(0)}
.lrsf-mtile .lrsf-mcap p{opacity:0;transition:opacity .4s ease .1s;margin:.3em 0 0;font-size:14px}
.lrsf-mtile:hover .lrsf-mcap p{opacity:1}
.lrsf-mtile.tall{grid-row:span 2}.lrsf-mtile.wide{grid-column:span 2}
@media(max-width:980px){.lrsf-mosaic{grid-template-columns:repeat(2,1fr)}.lrsf-mtile.wide{grid-column:span 2}.lrsf-mtile.tall{grid-row:span 1}}

/* ---- 11. Stand-for watermark ---- */
.lrsf-watermark{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none;z-index:0}
.lrsf-watermark span{font-family:'Cormorant Garamond',serif;font-weight:700;font-size:22vw;color:var(--lrsf-green);opacity:.06;line-height:1}

/* ---- 12. Reduced motion off-switch ---- */
@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  .lrsf-reveal{opacity:1!important;transform:none!important}
  #lrsf-pre,.lrsf-pre-curtain{display:none!important}
  .lrsf-toc-line{width:100%!important}.lrsf-toc-dot{transform:scale(1)!important;background:var(--lrsf-gold)!important}
}