/* Final visual pass aligned with the local Electric Glass reference. */
:root {
  --glass-surface: rgba(255, 255, 255, 0.72);
  --glass-border: rgba(255, 255, 255, 0.7);
  --glass-shadow: 0 18px 45px rgba(76, 57, 98, 0.12);
}

.site-header {
  background: rgba(255, 255, 255, 0.88);
  border-bottom-color: rgba(255, 255, 255, 0.58);
  box-shadow: 0 4px 18px rgba(45, 38, 58, 0.05);
}

.site-nav {
  gap: 20px;
}

.site-nav a {
  font-size: 14px;
}

.hero-layout,
.overview .container,
.drama-layout,
.portfolio-shell {
  border-color: var(--glass-border);
  border-radius: 40px;
  background: var(--glass-surface);
  box-shadow: var(--glass-shadow);
  backdrop-filter: blur(12px);
}

.capability-card,
.drama-points div,
.portfolio-list span,
.identity-tags span {
  border-color: rgba(255, 255, 255, 0.7);
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.68);
  box-shadow: 0 10px 28px rgba(76, 57, 98, 0.08);
}

.capability-card:hover,
.drama-points div:hover,
.portfolio-list span:hover {
  border-color: rgba(168, 85, 247, 0.45);
  box-shadow: 0 16px 34px rgba(128, 84, 184, 0.14);
}

.icon-label,
.portfolio-list i {
  border-radius: 14px;
}

.button {
  border-radius: 999px;
}

.button-primary {
  background: #111;
  color: #fff;
}

.button-primary:hover {
  background: linear-gradient(130deg, #111, #3b3b3b);
}

.footer-brand img {
  display: block;
  width: auto;
  height: 34px;
}

.site-footer .footer-wrap > div {
  color: #fff;
  font-size: 13px;
  font-weight: 700;
}

.site-footer .footer-wrap > div a:hover {
  color: var(--lime);
}

.site-footer {
  color: var(--ink);
  background: rgba(255, 255, 255, 0.88);
  border-top: 1px solid rgba(255, 255, 255, 0.58);
  box-shadow: 0 -4px 18px rgba(45, 38, 58, 0.05);
  backdrop-filter: blur(16px);
}

.site-footer .footer-wrap > div {
  color: var(--ink);
}

footer.site-footer .footer-wrap > div > a {
  color: #111111;
}

@media (max-width: 840px) {
  .hero-layout,
  .overview .container,
  .drama-layout,
  .portfolio-shell {
    border-radius: 28px;
  }
}