/* ============================================================
   PSRN SC BPKIHS — Homepage premium layer (visual only)
   Load AFTER homepage-enhancements.css. No content/markup changes.
   Design idea: one orchestrated hero moment, quiet depth everywhere else.
============================================================ */
.psrn-homepage{
  --pe-ease:cubic-bezier(.22,.8,.24,1);
  --pe-g1:var(--green,#126b59); --pe-g2:#0b4a3c; --pe-mint:#35b592; --pe-gold:#d9b45a;
  --pe-ring:rgba(18,107,89,.16);
  --pe-sh1:0 1px 2px rgba(14,60,48,.05),0 10px 26px rgba(14,60,48,.07);
  --pe-sh2:0 2px 4px rgba(14,60,48,.05),0 24px 50px rgba(14,60,48,.15);
}
.psrn-homepage ::selection{background:rgba(18,107,89,.2)}
.psrn-homepage a:focus-visible,.psrn-homepage .btn:focus-visible{outline:3px solid rgba(18,107,89,.4);outline-offset:3px}

/* ---------- Scroll progress + header glass ---------- */
.psrn-progress{position:fixed;inset:0 0 auto 0;height:3px;z-index:9999;pointer-events:none;transform:scaleX(var(--p,0));transform-origin:0 50%;background:linear-gradient(90deg,var(--pe-g1),var(--pe-mint),var(--pe-gold))}
.org-header{transition:background-color .4s ease,box-shadow .4s ease,backdrop-filter .4s ease}
.org-header.scrolled{background-color:rgba(255,255,255,.82);-webkit-backdrop-filter:saturate(170%) blur(16px);backdrop-filter:saturate(170%) blur(16px);box-shadow:0 10px 34px rgba(14,60,48,.09)}

/* ---------- Scroll reveal (replaces base transition; staggered) ---------- */
.psrn-homepage .reveal{opacity:0;transform:none;transition:none}
.psrn-homepage .reveal.active{opacity:1;animation:pe-rise .85s var(--pe-ease) var(--d,0s) backwards}
@keyframes pe-rise{from{opacity:0;translate:0 26px;scale:.98}to{opacity:1;translate:0 0;scale:1}}
.psrn-homepage .reveal:nth-child(2){--d:.08s}
.psrn-homepage .reveal:nth-child(3){--d:.16s}
.psrn-homepage .reveal:nth-child(4){--d:.24s}
.psrn-homepage .team-grid>.reveal:nth-child(5){--d:.32s}
.psrn-homepage .team-grid>.reveal:nth-child(6){--d:.4s}
.psrn-homepage .team-grid>.reveal:nth-child(7){--d:.48s}
.psrn-homepage .team-grid>.reveal:nth-child(8){--d:.56s}

/* ---------- Hero: the one orchestrated moment ---------- */
.psrn-homepage .public-hero-copy.reveal,.psrn-homepage .public-hero-copy.reveal.active{opacity:1;animation:none}
.psrn-homepage .public-hero-copy>*{animation:pe-rise 1s var(--pe-ease) both}
.psrn-homepage .public-hero-copy>h1{animation-delay:.08s}
.psrn-homepage .public-hero-copy>p{animation-delay:.24s}
.psrn-homepage .public-hero-copy>.hero-actions{animation-delay:.4s}
.psrn-homepage .public-hero-visual.reveal,.psrn-homepage .public-hero-visual.reveal.active{opacity:1;animation:pe-rise 1.2s var(--pe-ease) .2s both}

.psrn-homepage .public-hero-copy h1 span{background:linear-gradient(100deg,var(--pe-g2) 0%,var(--pe-mint) 48%,var(--pe-g1) 78%);background-size:220% auto;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;animation:pe-sheen 9s ease-in-out infinite alternate}
@keyframes pe-sheen{to{background-position:100% 0}}
.psrn-homepage .section-head h2>span,.psrn-homepage .contact-copy h2>span{background:linear-gradient(100deg,var(--pe-g1),var(--pe-mint));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}

.psrn-homepage .hero-orb{animation:pe-drift 16s ease-in-out infinite alternate;will-change:translate}
.psrn-homepage .hero-orb-two{animation-duration:22s;animation-direction:alternate-reverse}
@keyframes pe-drift{from{translate:0 0;scale:1}to{translate:34px -28px;scale:1.12}}

.psrn-homepage .hero-photo-card{box-shadow:0 2px 6px rgba(14,60,48,.08),0 34px 70px rgba(14,60,48,.22);transform:perspective(1100px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .55s var(--pe-ease),box-shadow .55s var(--pe-ease)}
.psrn-homepage .hero-photo-card img{animation:pe-kb 22s ease-in-out infinite alternate}
@keyframes pe-kb{from{scale:1}to{scale:1.09}}

.psrn-homepage .hero-mini-card{-webkit-backdrop-filter:blur(14px) saturate(160%);backdrop-filter:blur(14px) saturate(160%);background:rgba(255,255,255,.8);border:1px solid rgba(255,255,255,.75);box-shadow:0 18px 40px rgba(14,60,48,.16);animation:pe-float 6.5s ease-in-out infinite;transform:translate3d(calc(var(--hx,0)*14px),calc(var(--hy,0)*10px),0);transition:transform .6s var(--pe-ease)}
.psrn-homepage .hero-mini-bottom{animation-duration:7.5s;animation-delay:-3s}
@keyframes pe-float{50%{translate:0 -12px}}
.psrn-homepage .mini-icon{background:linear-gradient(135deg,var(--pe-mint),var(--pe-g1));color:#fff;box-shadow:0 8px 18px rgba(18,107,89,.3)}

/* ---------- Buttons ---------- */
.psrn-homepage .btn{transition:transform .35s var(--pe-ease),box-shadow .35s var(--pe-ease),background-position .8s var(--pe-ease),border-color .3s,background-color .3s}
.psrn-homepage .btn>span{display:inline-block;transition:transform .35s var(--pe-ease)}
.psrn-homepage .btn:hover>span{transform:translateX(5px)}
.psrn-homepage .btn:active{transform:translateY(-1px) scale(.98)}
.psrn-homepage .btn-primary{background-color:var(--pe-g1);background-image:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.3) 50%,transparent 65%),linear-gradient(135deg,#17806a,#0c5243);background-size:260% 100%,100% 100%;background-position:150% 0,0 0;background-repeat:no-repeat;box-shadow:0 10px 26px rgba(18,107,89,.3),inset 0 1px 0 rgba(255,255,255,.22)}
.psrn-homepage .btn-primary:hover{background-position:-60% 0,0 0;transform:translateY(-3px);box-shadow:0 18px 38px rgba(18,107,89,.38),inset 0 1px 0 rgba(255,255,255,.3)}
.psrn-homepage .btn-soft{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid var(--pe-ring)}
.psrn-homepage .btn-soft:hover,.psrn-homepage .btn-white:hover{transform:translateY(-3px);box-shadow:0 16px 34px rgba(14,60,48,.16)}

/* ---------- Cards: depth, then quiet hover ---------- */
.psrn-homepage :is(.impact-card,.info-card,.activity-card,.team-card,.wide-card,.psrn-connect-panel){position:relative;isolation:isolate;transition:transform .5s var(--pe-ease),box-shadow .5s var(--pe-ease),border-color .4s ease}
.psrn-homepage :is(.impact-card,.info-card,.activity-card,.team-card){box-shadow:var(--pe-sh1)}
.psrn-homepage .impact-card strong{font-variant-numeric:tabular-nums}
.psrn-homepage .info-number{background:linear-gradient(135deg,var(--pe-g1),var(--pe-mint));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.psrn-homepage .card-link{display:block;width:fit-content;padding-bottom:3px;background:linear-gradient(currentColor,currentColor) 0 100%/0 1.5px no-repeat;transition:background-size .45s var(--pe-ease),transform .45s var(--pe-ease)}
.psrn-homepage .about-image-card,.psrn-homepage .team-photo{overflow:hidden}
.psrn-homepage .about-image-card img,.psrn-homepage .team-photo img{transition:transform 1.1s var(--pe-ease)}

.pe-glow{position:absolute;inset:0;z-index:-1;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .45s ease;background:radial-gradient(380px circle at var(--mx,50%) var(--my,50%),rgba(53,181,146,.16),transparent 60%)}

@media (hover:hover) and (pointer:fine){
  .psrn-homepage .impact-card:hover,.psrn-homepage .info-card:hover{transform:translateY(-5px);box-shadow:var(--pe-sh2)}
  .psrn-homepage .activity-card:hover{transform:translateY(-9px);box-shadow:var(--pe-sh2),inset 0 3px 0 var(--pe-g1);border-color:rgba(18,107,89,.28)}
  .psrn-homepage .activity-card:hover .card-link{background-size:100% 1.5px;transform:translateX(4px)}
  .psrn-homepage .team-card:hover{transform:translateY(-8px);box-shadow:var(--pe-sh2)}
  .psrn-homepage .wide-card:hover,.psrn-homepage .psrn-connect-panel:hover{transform:translateY(-4px);box-shadow:var(--pe-sh2)}
  .psrn-homepage .about-image-card:hover img,.psrn-homepage .team-card:hover .team-photo img{transform:scale(1.07)}
  :is(.activity-card,.info-card,.team-card):hover>.pe-glow{opacity:1}
}

/* ---------- Section atmosphere ---------- */
.psrn-homepage .section-soft{background-image:radial-gradient(760px 380px at 92% -8%,rgba(18,107,89,.07),transparent 62%),radial-gradient(640px 340px at 4% 108%,rgba(217,180,90,.07),transparent 60%)}

/* ---------- Donate ---------- */
.psrn-homepage .donate-card{background-image:linear-gradient(125deg,#0a4538,#127a63 50%,#0a4538);background-size:200% 200%}
.psrn-homepage .donate-card.reveal.active{animation:pe-rise .85s var(--pe-ease) backwards,pe-bg 16s ease-in-out .85s infinite alternate}
@keyframes pe-bg{to{background-position:100% 100%}}
.psrn-homepage .donate-symbol{text-shadow:0 0 60px rgba(255,255,255,.35);animation:pe-float 7s ease-in-out infinite,pe-spin 48s linear infinite}
@keyframes pe-spin{to{rotate:360deg}}

/* ---------- Team loading + contact ---------- */
.psrn-homepage .team-loading{animation:pe-pulse 1.6s ease-in-out infinite}
@keyframes pe-pulse{50%{opacity:.45}}
.psrn-homepage .psrn-social-tile:hover .psrn-social-icon{background:var(--pe-g1);color:#fff;transform:scale(1.08) rotate(-4deg)}
.psrn-homepage .psrn-involve-form :is(input,textarea){transition:border-color .3s ease,box-shadow .3s ease}
.psrn-homepage .psrn-involve-form :is(input,textarea):focus{outline:none;border-color:var(--pe-g1);box-shadow:0 0 0 4px rgba(18,107,89,.13)}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  .psrn-homepage *,.psrn-homepage *::before,.psrn-homepage *::after{animation:none!important;transition:none!important}
  .psrn-homepage .reveal{opacity:1!important}
  .psrn-progress{display:none}
}
