/* AkanLeaf Kinetic — motion + polish (respects prefers-reduced-motion) */
:root{
  --shadow: 0 18px 40px rgba(7,17,14,0.14);
  --shadow-soft: 0 12px 28px rgba(7,17,14,0.10);
}
@media (prefers-reduced-motion: reduce){
  *{ animation: none !important; transition: none !important; scroll-behavior:auto !important; }
}

/* Cards */
.akan-card{
  border-radius: 22px;
  border: 1px solid var(--wp--preset--color--stone);
  background: var(--wp--preset--color--mist);
  box-shadow: var(--shadow-soft);
  transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
  will-change: transform;
}
.akan-card:hover{ transform: translateY(-3px); box-shadow: var(--shadow); border-color: rgba(18,129,94,0.35); }

/* Hero */
.akan-hero{
  position: relative;
  overflow: hidden;
  isolation: isolate;
  border-bottom: 1px solid rgba(247,250,244,0.16);
}
.akan-hero::before{
  content:"";
  position:absolute; inset:-40%;
  background: var(--wp--preset--gradient--hero-shift);
  filter: saturate(1.1) contrast(1.05);
  animation: akanGradientShift 16s ease-in-out infinite alternate;
  z-index: -3;
}
@keyframes akanGradientShift{
  0%{ transform: translate(-3%, -2%) scale(1.02) rotate(-2deg); }
  50%{ transform: translate(2%, 1%) scale(1.06) rotate(1deg); }
  100%{ transform: translate(4%, 3%) scale(1.08) rotate(2deg); }
}

/* Abstract layers */
.akan-layer{ position:absolute; inset:0; pointer-events:none; z-index:-2; opacity:0.95; }
.akan-noise{
  position:absolute; inset:0; pointer-events:none; z-index:-1; opacity:0.08;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='220' height='220' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E");
  mix-blend-mode: overlay;
}
.akan-float{
  position:absolute; width:520px; height:520px; border-radius: 999px;
  filter: blur(18px);
  opacity:0.65;
  animation: akanFloat 9s ease-in-out infinite alternate;
}
.akan-float.f1{ top:-180px; left:-160px; background: rgba(182,242,108,0.65); animation-duration: 12s; }
.akan-float.f2{ top:-220px; right:-180px; background: rgba(214,179,93,0.55); animation-duration: 15s; }
.akan-float.f3{ bottom:-260px; left:15%; background: rgba(18,129,94,0.55); animation-duration: 13s; }
@keyframes akanFloat{
  0%{ transform: translate(0,0) scale(1); }
  100%{ transform: translate(24px, 18px) scale(1.08); }
}

/* Leaf pattern overlay */
.akan-pattern{
  position:absolute; inset:0; pointer-events:none; z-index:-2;
  opacity:0.22; mix-blend-mode: overlay;
}
.akan-pattern svg{ width:120%; height:120%; transform: translate(-10%,-10%); }

/* Reveal */
.akan-reveal{ opacity:0; transform: translateY(18px); transition: opacity 700ms ease, transform 700ms ease; }
.akan-reveal.in{ opacity:1; transform: translateY(0); }
.akan-reveal.slow{ transition-duration: 950ms; }
.akan-reveal.up{ transform: translateY(26px); }
.akan-reveal.fade{ transform:none; }

/* Marquee */
.akan-marquee{
  overflow:hidden; border:1px solid rgba(247,250,244,0.18); border-radius: 999px;
  background: rgba(247,250,244,0.06);
  backdrop-filter: blur(10px);
}
.akan-marquee .track{
  display:flex; gap: 18px; align-items:center;
  width:max-content;
  animation: akanMarquee 18s linear infinite;
  padding: 10px 14px;
}
@keyframes akanMarquee{
  from{ transform: translateX(0); }
  to{ transform: translateX(-50%); }
}
.akan-pill{
  display:inline-flex; align-items:center; gap:10px;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid rgba(247,250,244,0.16);
  background: rgba(7,17,14,0.10);
  color: var(--wp--preset--color--mist);
  font-weight: 700;
  white-space: nowrap;
}
.akan-dot{
  width:10px; height:10px; border-radius: 999px;
  background: var(--wp--preset--color--tropic);
  box-shadow: 0 0 0 6px rgba(182,242,108,0.12);
}

/* Outline buttons on dark hero */
.is-style-outline .wp-element-button{
  border: 1px solid rgba(247,250,244,0.55) !important;
  color: #F7FAF4 !important;
}

/* Tag */
.akan-tag{
  font-family: var(--wp--preset--font-family--system-mono);
  font-size: 0.85rem;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  opacity: 0.95;
}
.akan-hero h1{ max-width: 18ch; }
.akan-hero p{ max-width: 56ch; }