/* Une composition éditoriale simple, avec des repères propres au portfolio. */

/* Le menu garde son verre; les contenus gardent une surface nette. */
.projects-empty,
.project-row,
.concept-card,
.certificate-frame,
.social-list li {
  box-shadow: none;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

.projects-empty,
.project-row {
  background: transparent;
  border: 0;
  border-top: 1px solid rgba(15, 61, 46, 0.24);
  padding-inline: 0;
}

.projects-empty:last-child,
.project-row:last-child {
  border-bottom: 1px solid rgba(15, 61, 46, 0.24);
}

.projects-empty { min-height: 84px; }
.project-row { min-height: 96px; }

.project-row:hover,
.projects-empty:hover {
  background: rgba(15, 61, 46, 0.035);
  transform: translateX(4px);
}

.concept-card {
  padding: 0;
  border: 0;
  background: transparent;
}

.concept-card img {
  border: 0;
  border-bottom: 1px solid rgba(15, 61, 46, 0.28);
}

.concept-card > span { padding: 0 2px; }

.certificate-frame {
  padding: 0;
  border: 0;
  background: transparent;
}

.certificate-placeholder {
  border: 1px solid rgba(15, 61, 46, 0.26);
  background: #E4ECE5;
}

.certificate-placeholder::before,
.certificate-placeholder::after { display: none; }

.social-list li {
  padding-inline: 0;
  background: transparent;
  border: 0;
  border-top: 1px solid rgba(232, 236, 233, 0.25);
}

.social-list li:last-child { border-bottom: 1px solid rgba(232, 236, 233, 0.25); }
.social-list li + li { margin-top: 0; }
.social-list li:hover { background: rgba(232, 236, 233, 0.055); }

/* Index lisible plutôt que des pastilles génériques pour les technologies. */
.tech-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  max-width: 560px;
  gap: 0 22px;
  counter-reset: tech-item;
}

.tech-list li {
  display: flex;
  align-items: baseline;
  gap: 11px;
  min-height: 39px;
  padding: 8px 0;
  border: 0;
  border-bottom: 1px solid rgba(15, 61, 46, 0.17);
  color: #20362A;
  font: 12px var(--mono);
  counter-increment: tech-item;
}

.tech-list li::before {
  content: counter(tech-item, decimal-leading-zero);
  color: #718378;
  font-size: 10px;
}

.hero-photo-slot {
  border: 0;
  border-left: 1px solid rgba(232, 236, 233, 0.35);
  background: transparent;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

.hero-photo-slot .slot-note {
  position: static;
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  color: #D1DDD5;
  font-size: 11px;
  letter-spacing: 0.08em;
}

.hero-photo-slot.has-photo { border: 0; }

.hero-visual { margin-left: 0; }

@media (max-width: 680px) {
  .tech-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 14px; }
  .tech-list li { min-height: 36px; padding: 7px 0; font-size: 11px; }
  .projects-empty,
  .project-row { padding-inline: 0; }
  .project-row:hover,
  .projects-empty:hover,
  .social-list li:hover { transform: none; }
  .hero-photo-slot { border-left: 0; border-top: 1px solid rgba(232, 236, 233, 0.35); }
}

@media (prefers-reduced-motion: reduce) {
  .project-row:hover,
  .projects-empty:hover,
  .social-list li:hover { transform: none; }
}

.tech-list li { transition: color 180ms ease, transform 180ms ease; }
.tech-list li::before { transition: color 180ms ease; }
.tech-list li:hover { color: #0F3D2E; transform: translateX(3px); }
.tech-list li:hover::before { color: #0F3D2E; }

@media (prefers-reduced-motion: reduce) {
  .tech-list li,
  .tech-list li::before { transition: none; }
  .tech-list li:hover { transform: none; }
}