/* ============ PADMA ANIMAL — shared styles ============ */
:root{
  --blush:#FEF4F8;          /* page background */
  --blush-deep:#FCE7F0;     /* alternating tint */
  --berry:#5C2445;          /* deep rose sections */
  --berry-deep:#481734;
  --rose:#D6528C;           /* primary accent */
  --rose-hot:#B93A72;
  --rose-soft:#F8CADE;
  --gold:#F0C866;           /* sparkle */
  --lav:#B98CC0;            /* small support accent */
  --ink:#3E2333;
  --soft:#7E5E70;
  --radius:16px;
  --display:'Fraunces', serif;
  --body:'Nunito Sans', sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--body);color:var(--ink);background:var(--blush);line-height:1.65}
img{max-width:100%;display:block}
a{color:inherit}

.wrap{max-width:1120px;margin:0 auto;padding:0 24px}
.eyebrow{font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;font-weight:800;color:var(--rose-hot)}
.on-dark .eyebrow{color:var(--gold)}
h1,h2,h3{font-family:var(--display);font-weight:500;line-height:1.15}
h1 em,h2 em{font-style:italic;color:var(--rose)}
.on-dark h1 em,.on-dark h2 em{color:var(--gold)}

.btn{display:inline-block;padding:.85rem 1.8rem;border-radius:999px;font-weight:800;
  text-decoration:none;font-size:.95rem;transition:transform .15s ease, box-shadow .15s ease}
.btn:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(214,82,140,.38)}
.btn:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.btn-rose{background:linear-gradient(120deg,var(--rose),var(--rose-hot));color:#fff}
.btn-gold{background:var(--gold);color:var(--berry-deep)}
.btn-ghost{border:2px solid rgba(255,255,255,.6);color:#fff}

/* NAV */
header.site{position:sticky;top:0;z-index:50;background:rgba(254,244,248,.94);
  backdrop-filter:blur(10px);border-bottom:1px solid rgba(62,35,51,.08)}
.nav{display:flex;align-items:center;justify-content:space-between;padding:.65rem 24px;
  max-width:1180px;margin:0 auto}
.brand{display:flex;align-items:center;gap:.6rem;text-decoration:none}
.brand svg{height:44px;width:auto}
.brand span{font-family:var(--display);font-size:1.25rem;color:var(--berry)}
.nav nav{display:flex;gap:1.15rem;align-items:center}
.nav nav a{text-decoration:none;font-weight:700;font-size:.9rem;color:var(--ink)}
.nav nav a:hover,.nav nav a.here{color:var(--rose-hot)}
.nav .btn{padding:.5rem 1.15rem;font-size:.88rem}
@media(max-width:980px){.nav nav a:not(.btn){display:none}}

/* HERO */
.hero{background:radial-gradient(1100px 620px at 72% -12%, #8A3566 0%, var(--berry) 48%, var(--berry-deep) 100%);
  color:#fff;position:relative;overflow:hidden}
.hero .wrap{position:relative;z-index:2;padding-top:4.5rem;padding-bottom:4.5rem}
.hero p.lead{color:rgba(255,255,255,.87);font-size:1.1rem;max-width:36rem;margin:1.2rem 0 2rem}

/* sparkle field */
.sparkle{position:absolute;border-radius:50%;background:var(--gold);width:6px;height:6px;
  opacity:0;animation:twinkle 4.5s ease-in-out infinite;pointer-events:none}
.sparkle.w{background:#fff;width:4px;height:4px}
.sparkle.p{background:var(--rose-soft);width:5px;height:5px}
.sparkle.big{width:9px;height:9px;filter:blur(.3px)}
@keyframes twinkle{0%,100%{opacity:0;transform:scale(.35)}45%{opacity:.95;transform:scale(1)}}
@media(prefers-reduced-motion:reduce){.sparkle{animation:none;opacity:.4}}

/* four-point star sparkles */
.star{position:absolute;opacity:0;animation:twinkle 5s ease-in-out infinite;pointer-events:none}
.star svg{display:block}

/* SECTIONS */
section.pad{padding:4.5rem 0}
.tint{background:var(--blush-deep)}
.white{background:#fff}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
@media(max-width:860px){.grid-2,.grid-3{grid-template-columns:1fr}}
.photo{border-radius:var(--radius);aspect-ratio:4/3;object-fit:cover;
  box-shadow:0 18px 44px rgba(92,36,69,.22)}

/* CARDS */
.card{background:#fff;border-radius:var(--radius);overflow:hidden;display:flex;
  flex-direction:column;text-decoration:none;border:1px solid rgba(62,35,51,.07);
  transition:transform .18s ease, box-shadow .18s ease}
.card:hover{transform:translateY(-5px);box-shadow:0 18px 38px rgba(92,36,69,.16)}
.card img{aspect-ratio:3/2;object-fit:cover}
.card .pad-in{padding:1.15rem 1.3rem 1.4rem}
.card .loc{font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;font-weight:800;color:var(--lav)}
.card h3{font-size:1.2rem;margin:.3rem 0 .45rem}
.card p{font-size:.94rem;color:var(--soft)}

/* SPONSOR progress */
.sponsor .goal{display:flex;justify-content:space-between;font-size:.85rem;
  font-weight:800;margin:.9rem 0 .35rem;color:var(--berry)}
.bar{height:12px;border-radius:999px;background:var(--rose-soft);overflow:hidden}
.bar i{display:block;height:100%;border-radius:999px;
  background:linear-gradient(90deg,var(--rose),var(--gold))}
.sponsor .left{font-size:.85rem;color:var(--soft);margin-top:.4rem}
.sponsor .btn{margin-top:1rem;align-self:flex-start}

/* dark band */
.band{background:var(--berry);color:#fff;position:relative;overflow:hidden}
.band h2{color:#fff}
.band p{color:rgba(255,255,255,.84)}

/* pillar / action boxes */
.action{background:#fff;border-radius:var(--radius);padding:1.4rem 1.5rem;
  border:1px solid rgba(62,35,51,.07);display:grid;gap:.5rem;align-content:start}
.action h3{font-size:1.15rem}
.action p{font-size:.95rem;color:var(--soft)}
.action .btn{justify-self:start;margin-top:.4rem}

/* belief list */
.beliefs{list-style:none;display:grid;gap:.75rem;margin-top:1rem}
.beliefs li{padding-left:1.7rem;position:relative;color:var(--soft)}
.beliefs li::before{content:"✦";position:absolute;left:0;color:var(--rose);font-size:1rem}
.on-dark .beliefs li{color:rgba(255,255,255,.85)}
.on-dark .beliefs li::before{color:var(--gold)}

/* FOOTER */
footer.site{background:var(--berry-deep);color:rgba(255,255,255,.85);padding:3.2rem 0 2rem}
footer.site .wrap{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:2.5rem}
footer.site h3{color:#fff;font-size:1rem;margin-bottom:.9rem;font-family:var(--body);font-weight:800}
footer.site a{text-decoration:none}
footer.site a:hover{color:var(--gold)}
footer.site ul{list-style:none;display:grid;gap:.45rem;font-size:.94rem}
footer.site .fine{grid-column:1/-1;border-top:1px solid rgba(255,255,255,.15);
  margin-top:1.5rem;padding-top:1.2rem;font-size:.84rem;color:rgba(255,255,255,.5)}
@media(max-width:860px){footer.site .wrap{grid-template-columns:1fr}}

.divider{display:flex;justify-content:center;padding:.5rem 0 0}
.divider svg{width:110px;opacity:.9}

/* ============ DONOR GARDEN ============ */
.donors{background:linear-gradient(180deg,var(--berry) 0%, var(--berry-deep) 100%);
  color:#fff;position:relative;overflow:hidden;padding:5rem 0 4.5rem}
.donor-field{display:flex;flex-wrap:wrap;justify-content:center;gap:.85rem;
  max-width:60rem;margin:2.5rem auto 0;position:relative;z-index:2}
.donor{display:inline-flex;align-items:baseline;gap:.5rem;
  background:rgba(255,255,255,.07);border:1px solid rgba(248,202,222,.28);
  border-radius:999px;padding:.55rem 1.15rem;backdrop-filter:blur(4px);
  animation:drift 7s ease-in-out infinite;transition:background .2s ease, border-color .2s ease}
.donor:hover{background:rgba(248,202,222,.16);border-color:var(--gold)}
.donor b{font-weight:700;font-size:.95rem;color:#fff;font-family:var(--body)}
.donor i{font-style:normal;font-size:.8rem;font-weight:800;color:var(--gold)}
@keyframes drift{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
@media(prefers-reduced-motion:reduce){.donor{animation:none}}
.donor-total{text-align:center;margin-top:2.6rem;position:relative;z-index:2}
.donor-total b{font-family:var(--display);font-size:2.4rem;color:var(--gold);
  display:block;line-height:1.1;font-weight:500}
.donor-total span{font-size:.85rem;letter-spacing:.14em;text-transform:uppercase;
  font-weight:800;color:rgba(255,255,255,.6)}

/* ============ DONATE ============ */
.amounts{display:grid;grid-template-columns:repeat(4,1fr);gap:.85rem;margin:1.4rem 0 1.2rem}
@media(max-width:620px){.amounts{grid-template-columns:repeat(2,1fr)}}
.amt{display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:1.15rem .6rem;border-radius:14px;background:#fff;border:2px solid var(--rose-soft);
  text-decoration:none;transition:all .16s ease}
.amt:hover{border-color:var(--rose);background:var(--rose-soft);transform:translateY(-3px)}
.amt b{font-family:var(--display);font-size:1.7rem;font-weight:500;color:var(--berry);line-height:1}
.amt span{font-size:.78rem;color:var(--soft);margin-top:.35rem;text-align:center;line-height:1.3}
.give-box{background:#fff;border-radius:18px;padding:1.9rem;border:1px solid rgba(62,35,51,.08);
  box-shadow:0 18px 44px rgba(92,36,69,.10)}
.give-box .btn{width:100%;text-align:center}
.freq{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:.3rem}
.freq span{font-size:.8rem;font-weight:800;padding:.35rem .85rem;border-radius:999px;
  background:var(--blush-deep);color:var(--berry)}

/* wishlist buttons */
.wish{display:grid;gap:.6rem;margin-top:1rem}
.wish a{display:flex;align-items:center;justify-content:space-between;gap:1rem;
  background:var(--blush-deep);border:1px solid rgba(214,82,140,.22);border-radius:12px;
  padding:.85rem 1.1rem;text-decoration:none;font-weight:700;font-size:.93rem;
  color:var(--berry);transition:all .16s ease}
.wish a:hover{background:var(--rose-soft);border-color:var(--rose);transform:translateX(3px)}
.wish a em{font-style:normal;color:var(--rose-hot);font-size:1.05rem}

/* needs list */
.needs{list-style:none;display:grid;grid-template-columns:repeat(2,1fr);gap:.55rem;margin-top:1rem}
@media(max-width:620px){.needs{grid-template-columns:1fr}}
.needs li{padding-left:1.5rem;position:relative;font-size:.94rem;color:var(--soft)}
.needs li::before{content:"✦";position:absolute;left:0;color:var(--rose)}

/* ============ ROAMING CRITTERS ============ */
#critter-layer{position:fixed;inset:0;pointer-events:none;z-index:6;overflow:hidden}
#critter-layer.cr-paused *{animation-play-state:paused!important}
.cr{position:absolute;top:0;left:0;will-change:transform;opacity:.38;pointer-events:auto;
  cursor:pointer;filter:drop-shadow(0 3px 4px rgba(92,36,69,.12));
  transition:opacity .2s ease}
.cr:hover,.cr:focus-visible{opacity:.7}
.cr.cr-gone{opacity:0;transition:opacity .34s ease}
.cr.cr-waiting{opacity:0;pointer-events:none}
.cr:focus-visible{outline:2px solid var(--rose);outline-offset:4px;border-radius:8px}
.cr svg{display:block;overflow:visible}

/* natural four-legged walk: diagonal pairs swing in opposition */
.cr-legs rect,.cr-pros{transform-box:fill-box;transform-origin:50% 0}
.lgA{animation:crLegA .56s ease-in-out infinite}
.lgB{animation:crLegA .56s ease-in-out infinite;animation-delay:-.28s}
@keyframes crLegA{0%,100%{transform:rotate(15deg)}50%{transform:rotate(-15deg)}}
.cr-body{animation:crBob .28s ease-in-out infinite}
@keyframes crBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-.8px)}}

/* limp: one side carries less weight, so the body dips unevenly */
.cr-limp .lgA{animation:crLegLimp .84s ease-in-out infinite}
.cr-limp .lgB{animation:crLegA .84s ease-in-out infinite;animation-delay:-.42s}
@keyframes crLegLimp{0%,100%{transform:rotate(9deg)}50%{transform:rotate(-6deg)}}
.cr-limp .cr-body{animation:crBobLimp .84s ease-in-out infinite}
@keyframes crBobLimp{0%,100%{transform:translateY(0)}
  22%{transform:translateY(-2.2px) rotate(-1.4deg)}
  60%{transform:translateY(.6px) rotate(.6deg)}}

/* wheelcart rolls smoothly instead of stepping at the back */
.cr-roll .lgA,.cr-roll .lgB{animation-duration:.46s}
.cr-roll .cr-cart{animation:crRoll .5s linear infinite}
@keyframes crRoll{0%,100%{transform:translateY(0)}50%{transform:translateY(-.7px)}}

/* tails wag; wings stay folded and only shiver occasionally */
.cr-tail{transform-origin:14px 22px;animation:crWag .62s ease-in-out infinite}
@keyframes crWag{0%,100%{transform:rotate(-6deg)}50%{transform:rotate(8deg)}}
.cr-wings{transform-origin:27px 18px;animation:crShiver 5s ease-in-out infinite}
@keyframes crShiver{0%,88%,100%{transform:rotate(0) scaleY(1)}
  92%{transform:rotate(-3deg) scaleY(.94)}96%{transform:rotate(2deg) scaleY(1)}}

/* sitting: everything stops, and the critter settles */
.cr-sitting{animation:crSit .34s ease-out}
@keyframes crSit{0%{transform-origin:50% 100%;opacity:.5}
  60%{opacity:.8}100%{opacity:.8}}
.cr-sitting{opacity:.72}

/* sitting: a paw lifts toward you, and the tail keeps wagging */
.cr-fpaw{transform-box:fill-box;transform-origin:50% 100%;
  animation:crPawAt 1.15s cubic-bezier(.4,0,.3,1) infinite}
@keyframes crPawAt{0%,58%,100%{transform:translateY(0) rotate(0deg)}
  22%{transform:translateY(-9px) rotate(-16deg)}
  40%{transform:translateY(-4px) rotate(-7deg)}}
.cr-ftail{transform-box:fill-box;transform-origin:0% 60%;
  animation:crTailWag .34s ease-in-out infinite}
@keyframes crTailWag{0%,100%{transform:rotate(-14deg)}50%{transform:rotate(16deg)}}

/* paw prints */
.cr-print{position:absolute;pointer-events:none;opacity:.7;transition:opacity 3.8s ease-out}
.cr-print svg{display:block}

/* toggle */
#critter-toggle{position:fixed;left:16px;bottom:16px;z-index:60;cursor:pointer;
  background:rgba(255,255,255,.9);border:1px solid rgba(214,82,140,.35);
  color:var(--rose-hot);font-family:var(--body);font-weight:800;font-size:.76rem;
  padding:.45rem 1rem;border-radius:999px;backdrop-filter:blur(6px);
  transition:background .15s ease,transform .15s ease}
#critter-toggle:hover{background:var(--rose-soft);transform:translateY(-2px)}
#critter-toggle:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
@media(max-width:700px){#critter-toggle{display:none}}
@media(prefers-reduced-motion:reduce){#critter-toggle{display:none}}

/* ============ PARTNER GALLERIES ============ */
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:1.5rem}
@media(max-width:860px){.gallery{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.gallery{grid-template-columns:1fr}}
.gitem{position:relative;border-radius:14px;overflow:hidden;background:var(--blush-deep);
  aspect-ratio:4/3;border:1px solid rgba(62,35,51,.08)}
.gitem img,.gitem video{width:100%;height:100%;object-fit:cover;display:block}
.gitem.tall{aspect-ratio:3/4}
.gitem.wide{grid-column:span 2;aspect-ratio:16/9}
@media(max-width:560px){.gitem.wide{grid-column:span 1}}
.gcap{position:absolute;left:0;right:0;bottom:0;padding:.7rem .9rem;font-size:.82rem;
  color:#fff;background:linear-gradient(0deg,rgba(72,23,52,.82),transparent);font-weight:600}
.gph{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:.5rem;color:var(--soft);text-align:center;padding:1rem}
.gph svg{width:40px;height:40px;opacity:.5}
.gph b{font-size:.85rem;font-weight:800;color:var(--rose-hot)}
.gph span{font-size:.74rem;line-height:1.4}
.vidwrap{position:relative}
.vidwrap .play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  pointer-events:none}
.vidwrap .play svg{width:56px;height:56px;filter:drop-shadow(0 3px 8px rgba(0,0,0,.4))}

.btn-line{background:transparent;border:2px solid var(--rose);color:var(--rose-hot)}
.btn-line:hover{background:var(--rose-soft)}

/* ============ SIGNUP FORM ============ */
.signup{display:grid;gap:.9rem;text-align:left}
.signup input[type=text],.signup input[type=email]{width:100%;padding:.9rem 1.1rem;
  border:2px solid var(--rose-soft);border-radius:12px;font-family:var(--body);font-size:1rem;
  color:var(--ink);background:#fff;transition:border-color .15s ease}
.signup input[type=text]:focus,.signup input[type=email]:focus{outline:none;border-color:var(--rose)}
.signup .anon{display:flex;align-items:flex-start;gap:.6rem;font-size:.9rem;color:var(--soft);
  cursor:pointer;line-height:1.4}
.signup .anon input{margin-top:.2rem;width:18px;height:18px;accent-color:var(--rose);flex-shrink:0}
.signup .anon strong{color:var(--rose-hot)}

/* placeholder image block inside a card (same footprint as card img) */
.cardph{aspect-ratio:3/2;background:var(--blush-deep);display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:.5rem;color:var(--soft);text-align:center;padding:1rem}
.cardph svg{width:38px;height:38px;opacity:.5}
.cardph b{font-size:.85rem;font-weight:800;color:var(--rose-hot)}
.cardph span{font-size:.72rem;line-height:1.4;max-width:80%}