/* ==== Buttons ==== */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  padding:14px 26px;
  border-radius:var(--radius);
  font-family:var(--font-main);
  font-size:15px;
  font-weight:500;
  cursor:pointer;
  transition:all var(--t-base);
  border:1px solid transparent;
  white-space:nowrap;
}
.btn svg{width:18px;height:18px;flex-shrink:0}
.btn-primary{
  background:var(--avocado);
  color:#0a0f0a;
  box-shadow:0 0 30px var(--avocado-glow);
}
.btn-primary:hover{
  transform:translateY(-3px);
  box-shadow:0 8px 40px var(--avocado-glow);
}
.btn-ghost{
  background:var(--avocado-soft);
  color:var(--text);
  border-color:rgba(168,224,95,.25);
}
.btn-ghost:hover{
  border-color:var(--avocado);
  color:var(--avocado);
  transform:translateY(-3px);
}

/* ==== Badge ==== */
.badge{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:8px 18px;
  border:1px solid rgba(168,224,95,.3);
  border-radius:var(--radius-full);
  background:var(--avocado-soft);
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:2px;
  text-transform:uppercase;
  color:var(--avocado);
  backdrop-filter:blur(10px);
}
.badge .dot{
  width:7px;height:7px;
  border-radius:50%;
  background:var(--avocado);
  box-shadow:0 0 10px var(--avocado);
  animation:pulse 1.8s ease-in-out infinite;
}
@keyframes pulse{
  0%,100%{opacity:1;transform:scale(1)}
  50%{opacity:.4;transform:scale(.7)}
}

/* ==== Progress ==== */
.progress-wrap{max-width:420px;width:100%}
.progress-info{
  display:flex;
  justify-content:space-between;
  font-family:var(--font-mono);
  font-size:12px;
  color:var(--text-muted);
  letter-spacing:1px;
  margin-bottom:12px;
  text-transform:uppercase;
}
.progress-info .pct{color:var(--avocado)}
.progress-bar{
  height:6px;
  background:rgba(168,224,95,.1);
  border-radius:var(--radius-full);
  overflow:hidden;
}
.progress-fill{
  height:100%;
  width:0;
  background:linear-gradient(90deg,var(--avocado-dark),var(--avocado));
  border-radius:var(--radius-full);
  box-shadow:0 0 15px var(--avocado-glow);
  transition:width .3s linear;
}

/* ==== Section header ==== */
.section__header{
  text-align:center;
  margin-bottom:clamp(40px,6vw,80px);
}
.section__tag{
  display:inline-block;
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:2px;
  text-transform:uppercase;
  color:var(--avocado);
  margin-bottom:16px;
  padding:6px 14px;
  border:1px solid var(--border);
  border-radius:var(--radius-full);
  background:var(--avocado-soft);
}
.section__title{
  font-size:clamp(32px,5vw,56px);
  font-weight:700;
  letter-spacing:-.03em;
  line-height:1.1;
  margin-bottom:16px;
}
.section__subtitle{
  font-size:clamp(15px,1.6vw,17px);
  line-height:1.7;
  color:var(--text-muted);
  max-width:560px;
  margin:0 auto;
}

/* ==== Avocado emoji ==== */
.avocado-emoji{
  display:inline-block;
  animation:wobble 3s ease-in-out infinite;
  transform-origin:bottom center;
}
@keyframes wobble{
  0%,100%{transform:rotate(0)}
  25%{transform:rotate(-8deg)}
  75%{transform:rotate(8deg)}
}