/* brand.css — Purely Plant logo assets + GrowFlow brand treatments
   Dark glass-morphism / TAL SHIAR reskin.
   Plasma green (#2BE8A0) replaces old lime (#5BBA47).
   Plasma teal (#2FD9D9) replaces old teal (#0EA5A5).
   Poppins replaces Outfit for brand text. */

/* ── Wordmark (lockup-style: PURELYPLANT + tagline) ───────────────── */
.pp-wordmark {
  display: inline-block;
  background-image: url('../assets/pp-wordmark.png');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: left center;
  width: 144px;
  height: 24px;
  transition: opacity .15s;
  filter: brightness(0) invert(1) opacity(.75);  /* white variant on dark bg */
}
.pp-wordmark:hover { opacity: .85; }
.pp-wordmark--sm { width: 110px; height: 18px; }
.pp-wordmark--md { width: 168px; height: 28px; }
.pp-wordmark--lg { width: 240px; height: 40px; }
.pp-wordmark--xl { width: 320px; height: 53px; }
.pp-wordmark--white { filter: brightness(0) invert(1); }

/* ── Leaf only ────────────────────────────────────────────────────── */
.pp-leaf {
  display: inline-block;
  background-image: url('../assets/pp-leaf.png');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  width: 36px; height: 42px;
}
.pp-leaf--sm { width: 24px; height: 28px; }
.pp-leaf--md { width: 36px; height: 42px; }
.pp-leaf--lg { width: 64px; height: 74px; }
.pp-leaf--xl { width: 96px; height: 112px; }

/* ── Animated leaf — plasma aura + float + shimmer ─────────────────
   Aura: plasma green (#2BE8A0) + plasma teal (#2FD9D9).             */
.pp-leaf-anim {
  position: relative;
  display: inline-block;
  width: 96px; height: 112px;
  background-image: url('../assets/pp-leaf.png');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  filter:
    drop-shadow(0 0 40px rgba(43,232,160,0.55))
    drop-shadow(0 0 14px rgba(47,217,217,0.32))
    saturate(1.12) brightness(1.05);
  animation: pp-leaf-float 6s ease-in-out infinite,
             pp-leaf-breathe 4.5s ease-in-out infinite;
  transform-origin: 50% 80%;
}
/* pulsing aura behind */
.pp-leaf-anim::before {
  content: '';
  position: absolute; inset: -28%;
  background: radial-gradient(circle at 50% 46%,
    rgba(43,232,160,0.55) 0%, rgba(47,217,217,0.20) 42%, transparent 68%);
  filter: blur(12px);
  z-index: -1;
  animation: pp-aura-pulse 4s ease-in-out infinite;
}
/* light shimmer across leaf silhouette */
.pp-leaf-anim::after {
  content: '';
  position: absolute; inset: 0;
  -webkit-mask: url('../assets/pp-leaf.png') center / contain no-repeat;
          mask: url('../assets/pp-leaf.png') center / contain no-repeat;
  background: linear-gradient(115deg,
    transparent 38%, rgba(255,255,255,0.75) 50%, transparent 62%);
  background-size: 280% 280%;
  animation: pp-leaf-shimmer 4.8s ease-in-out infinite;
  pointer-events: none;
}
.pp-leaf-anim--sm { width: 30px; height: 35px; }
.pp-leaf-anim--md { width: 52px; height: 60px; }
.pp-leaf-anim--lg { width: 90px; height: 104px; }
.pp-leaf-anim--xl { width: 132px; height: 153px; }

@keyframes pp-leaf-float {
  0%, 100% { transform: translateY(0) rotate(0deg); }
  50%      { transform: translateY(-8px) rotate(-1.4deg); }
}
@keyframes pp-leaf-breathe {
  0%, 100% { filter: drop-shadow(0 0 36px rgba(43,232,160,0.42)) drop-shadow(0 0 12px rgba(47,217,217,0.28)) saturate(1.1) brightness(1.03); }
  50%      { filter: drop-shadow(0 0 60px rgba(43,232,160,0.68)) drop-shadow(0 0 20px rgba(47,217,217,0.44)) saturate(1.2) brightness(1.10); }
}
@keyframes pp-aura-pulse {
  0%, 100% { transform: scale(1);    opacity: 0.65; }
  50%      { transform: scale(1.14); opacity: 1; }
}
@keyframes pp-leaf-shimmer {
  0%       { background-position: 220% 0;  opacity: 0; }
  18%      { opacity: 1; }
  46%      { background-position: -120% 0; opacity: 0; }
  100%     { background-position: -120% 0; opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .pp-leaf-anim, .pp-leaf-anim::before, .pp-leaf-anim::after { animation: none; }
  .pp-brand-hero .pp-leaf { animation: none !important; }
  .pp-brand-text { animation: none !important; }
}

/* ── Full lockup ─────────────────────────────────────────────────── */
.pp-logo {
  display: inline-block;
  background-image: url('../assets/pp-logo-white.png');  /* white variant for dark bg */
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  width: 200px; height: 100px;
}
.pp-logo--sm { width: 140px; height: 70px; }
.pp-logo--md { width: 200px; height: 100px; }
.pp-logo--lg { width: 320px; height: 160px; }
.pp-logo--xl { width: 480px; height: 240px; }
.pp-logo--white { background-image: url('../assets/pp-logo-white.png'); }

/* ── Backwards-compat ────────────────────────────────────────────── */
.pp-mark {
  display: inline-block;
  background-image: url('../assets/pp-leaf.png');
  background-size: contain; background-repeat: no-repeat; background-position: center;
  width: 36px; height: 42px;
}
.pp-mark--sm { width: 24px; height: 28px; }
.pp-mark--lg { width: 64px; height: 74px; }
.pp-footmark {
  display: inline-block; vertical-align: middle; opacity: .6;
  background-image: url('../assets/pp-wordmark.png');
  background-size: contain; background-repeat: no-repeat; background-position: left center;
  width: 80px; height: 14px;
  filter: brightness(0) invert(1);
}

/* ── GrowFlow gradient text (plasma green → teal → bronze) ──────── */
.pp-brand-text {
  font-family: 'Poppins', 'Comfortaa', system-ui, sans-serif;
  font-weight: 800;
  letter-spacing: -0.015em;
  background: linear-gradient(135deg,
    #2BE8A0 0%,
    #2FD9D9 50%,
    #E0A73E 100%);
  background-size: 200% 200%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  animation: pp-title-shift 8s ease-in-out infinite;
  display: inline-block;
}
@keyframes pp-title-shift {
  0%, 100% { background-position: 0% 50%; }
  50%      { background-position: 100% 50%; }
}

/* ── Hero lockup — splash / login ───────────────────────────────── */
.pp-brand-hero {
  display: flex; flex-direction: column; align-items: center;
  text-align: center; padding: 0.5rem 1rem;
  font-family: 'Poppins', system-ui, sans-serif;
}
.pp-brand-hero .pp-leaf {
  width: 90px; height: 104px;
  filter: drop-shadow(0 4px 18px rgba(43,232,160,0.40));
  animation: pp-leaf-float 6s ease-in-out infinite;
  margin-bottom: 0.4rem;
}
.pp-brand-hero .pp-wordmark { width: 220px; height: 36px; }
.pp-brand-hero h1 { margin: 0; font-size: 1.9rem; line-height: 1.05; }
.pp-brand-hero .pp-brand-sub {
  font-size: 0.72rem; color: var(--ink-2);
  text-transform: uppercase; letter-spacing: 0.22em;
  font-weight: 500; margin-top: 0.55rem;
}

/* Plasma separator */
.pp-brand-sep {
  width: 170px; height: 1px;
  margin: 1.2rem auto 0.9rem;
  background: linear-gradient(90deg, transparent, rgba(43,232,160,0.55) 50%, transparent);
  position: relative;
}
.pp-brand-sep::before {
  content: ''; position: absolute; left: 50%; top: 50%;
  width: 6px; height: 6px; border-radius: 50%;
  transform: translate(-50%, -50%);
  background: #2BE8A0;
  box-shadow: 0 0 10px #2BE8A0;
}