/* ==============================
   Project Bubbles & Plates
============================== */
.project{
  position:relative;
  isolation:isolate;
  min-height:420px;
  margin:2rem auto;
  width:min(1080px,92%);
  border-radius:1.2rem;
  border:1px solid var(--border);
  overflow:hidden;
  background: linear-gradient(180deg, var(--panel), var(--panel-2));
  box-shadow: 0 12px 28px rgba(0,0,0,.32);
}
.project__bg{
  position:absolute; inset:0; z-index:0;
  background-image: var(--project-bg);
  background-size:cover; background-position:center;
  transform:scale(1.06);
  opacity:.25;
}
.project__content{
  position:relative; z-index:1;
  margin:clamp(1rem, 3vw, 2rem);
  max-width:760px;
  background: rgba(10,20,15,.45);
  border:1px solid var(--border);
  border-radius:1rem;
  padding:clamp(1rem, 3vw, 1.4rem);
  box-shadow: 0 10px 22px rgba(0,0,0,.35);
  backdrop-filter: blur(6px) saturate(110%);
}
@media (min-width:980px){
  .project:not(.project--reverse) .project__content{ margin-left:2rem; margin-right:auto; }
  .project.project--reverse .project__content{ margin-right:2rem; margin-left:auto; }
}
.project__title{ margin: 0 0 .6rem; }
.project__bubble{
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.45rem .7rem;
  border-radius:.8rem; border:1px solid var(--border);
  background:#0b1511; color:var(--neon);
  font-weight:800; text-shadow:0 0 6px var(--neon-weak);
  box-shadow: 0 6px 18px rgba(0,0,0,.28);
}
.project__bubble i{ color:var(--neon); }
.project__desc{ color: var(--text); opacity:.95; line-height:1.6; margin:.8rem 0 1rem; }

.project__facts{
  list-style:none; padding:0; margin:0 0 1rem;
  display:grid; gap:.35rem; color:var(--muted);
}
.project__facts strong{ color: var(--text); }

.icon-link{
  display:inline-flex; align-items:center; justify-content:center;
  width:2.2rem; height:2.2rem; border-radius:.6rem;
  background:#0b1511; color:var(--neon);
  border:1px solid var(--border);
  box-shadow: 0 6px 18px rgba(0,0,0,.3);
  transition: transform .12s, box-shadow .25s, background .25s;
}
.icon-link:hover{ transform: translateY(-2px); box-shadow:0 10px 22px rgba(0,0,0,.4); }

/* Motion safety */
@media (prefers-reduced-motion: reduce){
  .project__bg{ transition:none; transform:none !important; }
}

/* Light theme for project plates/bubbles/buttons */
:root[data-theme="light"] .project__content{
  background:#ffffffcc;
  border:1px solid var(--border);
  box-shadow:0 0 10px var(--neon-weak2);
  color:var(--text);
}
:root[data-theme="light"] .project__bubble{
  background:#ffffffd9; color:var(--accent);
  border:1px solid var(--border);
  box-shadow:0 0 6px var(--neon-weak2);
}
:root[data-theme="light"] .project__bubble i{ color:var(--accent); }
:root[data-theme="light"] .icon-link{
  background:#ffffffd9; color:var(--accent);
  border:1px solid var(--border);
  box-shadow:0 0 6px var(--neon-weak2);
}
:root[data-theme="light"] .icon-link:hover{
  background:#ffffff; box-shadow:0 0 12px var(--neon-weak);
}
