/* =========================================
   BUTTONS & BADGES
========================================= */
.forge-btn{
  display:inline-flex;align-items:center;gap:.5rem;
  padding:.85rem 1.1rem;border-radius:14px;font-weight:700;
  background:#ea580c; /* orange-600 */
  color:#fff;
  box-shadow:0 6px 20px rgba(0,0,0,.25);
  transition:filter .15s ease;
}
.forge-btn:hover{ filter:saturate(1.05); }

/* Secondary button (outline) */
.ghost-btn{
  display:inline-flex;align-items:center;gap:.5rem;
  padding:.8rem 1.05rem;border-radius:14px;font-weight:700;
  border:1px solid rgba(148,163,184,.35);
  color:inherit; background:transparent;
}
.ghost-btn:hover{ background:rgba(148,163,184,.06); }

.badge{
  display:inline-flex;align-items:center;gap:.45rem;padding:.35rem .7rem;
  border-radius:999px;font-size:.8rem;
  border:1px solid color-mix(in oklab,currentColor,transparent 75%);
}
.dot{display:inline-block;width:.6rem;height:.6rem;border-radius:999px}

/* =========================================
   CARDS / MOCK / TILT
========================================= */
.anvil-card,.proj{
  position:relative;overflow:hidden;border-radius:22px;
  border:1px solid color-mix(in oklab,currentColor,transparent 80%);
  background:color-mix(in oklab,var(--panel,#fff),transparent 0%);
  box-shadow:0 20px 50px rgba(0,0,0,.15);
  transition:box-shadow .2s ease, transform .2s ease;
}
.anvil-card::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,transparent,rgba(0,0,0,.05))
}
.proj:hover{transform:translateY(-2px);box-shadow:0 14px 38px rgba(0,0,0,.18)}

.card-badge{
  position:absolute;top:14px;left:14px;padding:.4rem .6rem;border-radius:12px;
  font-size:.85rem;font-weight:900;letter-spacing:.5px;background:rgba(15,23,42,.7);color:#fff
}
.card-badge span{color:var(--accent-1)}

.mock{background:linear-gradient(135deg,#e5e7eb,#cbd5e1)}
@media (prefers-color-scheme: dark){.mock{background:linear-gradient(135deg,#0f172a,#1f2937)}}

/* =========================================
   LOGO TICKER
========================================= */
.logo-ticker{overflow:hidden;mask-image:linear-gradient(90deg,transparent,black 10%,black 90%,transparent)}
.logo-ticker .track{display:flex;gap:18px;width:max-content;animation:ticker 18s linear infinite}
.logo-ticker .pill{
  padding:.55rem .8rem;border-radius:999px;font-size:.8rem;font-weight:800;letter-spacing:.08em;
  border:1px solid color-mix(in oklab,currentColor,transparent 80%);opacity:.8
}
@keyframes ticker{to{transform:translateX(-50%)}}

/* =========================================
   INPUTS
========================================= */
.inp{
  width:100%;padding:.9rem 1rem;border-radius:16px;background:transparent;
  border:1px solid color-mix(in oklab,currentColor,transparent 75%);
  transition:border-color .15s ease, box-shadow .15s ease;
}
.inp:focus{outline:none;border-color:var(--accent-1);box-shadow:0 0 0 4px color-mix(in oklab,var(--accent-1),transparent 85%)}

/* Dark-theme selects (match form-card inputs) */
select.inp{
  appearance:none;
  -webkit-appearance:none;
  cursor:pointer;
  color-scheme:dark;
  background-color:rgba(15,23,42,.92);
  color:#e2e8f0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 1rem center;
  padding-right:2.75rem;
}
select.inp:invalid,
select.inp option[value=""]{
  color:#94a3b8;
}
select.inp option{
  background:#0f172a;
  color:#e2e8f0;
}
select.inp:focus{
  background-color:rgba(15,23,42,.98);
}

/* =========================================
   MOBILE CTA
========================================= */
.forge-cta{
  position:fixed;
  display:inline-flex;align-items:center;gap:.5rem;padding:.85rem 1.1rem;
  border-radius:16px;font-weight:700;color:#fff;
  background:linear-gradient(135deg,var(--accent-1),var(--accent-2));
  box-shadow:0 12px 30px rgba(0,0,0,.25);
  bottom:max(1rem, env(safe-area-inset-bottom));
  right:max(1rem, env(safe-area-inset-right));
  max-width:calc(100vw - 2rem);
  z-index:60;
}
.i-spark{display:inline-block;width:.7rem;height:.7rem;border-radius:999px;background:#fff;box-shadow:0 0 0 6px rgba(255,255,255,.25)}

/* =========================================
   TILT
========================================= */
[data-tilt]{transform-style:preserve-3d;will-change:transform}