/* ══════════════════════════════════════════════════════════════════
   Banner modes — particles (default) | koi pond
   ══════════════════════════════════════════════════════════════════ */

/* ── Koi mode: banner-only overrides ─────────────────────────────── */
[data-banner="koi"] {
  --koi-glow: rgba(61, 155, 98, 0.22);
}

[data-banner="koi"][data-theme="dark"] {
  --koi-glow: rgba(74, 173, 114, 0.24);
}

[data-banner="koi"] #particles-js {
  display: none !important;
}

[data-banner="particles"] #koi-pond {
  display: none !important;
}

[data-banner="koi"] #koi-pond {
  display: block !important;
  pointer-events: auto;
}

#koi-pond {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100% !important;
  height: 100% !important;
  z-index: 1;
  pointer-events: none;
}

[data-banner="koi"] header.masthead {
  position: relative;
  background: linear-gradient(180deg, #3aa2a0 0%, #207982 36%, #155866 72%, #0b3544 100%);
  cursor: pointer;
}

[data-banner="koi"] header.masthead .masthead-heading {
  color: #fff;
  text-shadow:
    0 2px 24px rgba(0, 0, 0, 0.55),
    0 0 48px rgba(10, 50, 60, 0.45);
}

[data-banner="koi"] header.masthead .masthead-subheading {
  color: #d4f5e0;
  text-shadow: 0 1px 16px rgba(0, 0, 0, 0.45);
}

[data-banner="koi"] #mainNav {
  background-color: #123222;
}

[data-banner="koi"] #mainNav .navbar-brand,
[data-banner="koi"] #mainNav .navbar-brand:focus {
  color: var(--gold-bright);
}

[data-banner="koi"] #mainNav.navbar-shrink {
  background-color: #123222;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.32);
}

[data-banner="koi"] #mainNav .navbar-nav .nav-item .nav-link.active,
[data-banner="koi"] #mainNav .navbar-nav .nav-item .nav-link:hover,
[data-banner="koi"] #mainNav .navbar-nav .nav-item .nav-link:focus {
  color: #9ee0b4;
}

@media (min-width: 992px) {
  [data-banner="koi"] #mainNav .navbar-nav .nav-item .nav-link::after {
    background: #9ee0b4;
  }
}

[data-banner="koi"] .theme-toggle:hover,
[data-banner="koi"] .theme-toggle:focus {
  color: var(--gold-bright);
  background: rgba(142, 212, 168, 0.14);
  border-color: rgba(142, 212, 168, 0.35);
}

[data-banner="koi"] #mainNav .navbar-toggler {
  background-color: var(--gold);
}

.koi-feed-note {
  display: none;
  position: absolute;
  right: 1.25rem;
  bottom: 1rem;
  z-index: 3;
  pointer-events: none;
  color: #ffffff;
  font-size: 0.95rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-shadow: 0 1px 8px rgba(0, 0, 0, 0.45);
}

[data-banner="koi"] .koi-feed-note {
  display: block;
}

/* ── Koi mode: hardcoded accent overrides in styles.css ─────────── */
[data-banner="koi"] .timeline-scroll,
[data-banner="koi"] .portfolio-scroll {
  scrollbar-color: var(--gold) var(--scrollbar-track);
}

[data-banner="koi"] .timeline-scroll::-webkit-scrollbar-thumb,
[data-banner="koi"] .portfolio-scroll::-webkit-scrollbar-thumb {
  background: linear-gradient(90deg, var(--gold), var(--gold-dark));
}

[data-banner="koi"] .timeline-scroll-track::before {
  background: linear-gradient(
    90deg,
    rgba(61, 155, 98, 0.15),
    var(--gold) 10%,
    var(--gold) 90%,
    rgba(61, 155, 98, 0.15)
  );
}

[data-banner="koi"] #timeline .timeline-item-above .timeline-panel::after {
  background: linear-gradient(to bottom, var(--gold), rgba(61, 155, 98, 0.3));
}

[data-banner="koi"] #timeline .timeline-item-below .timeline-panel::after {
  background: linear-gradient(to top, var(--gold), rgba(61, 155, 98, 0.3));
}

[data-banner="koi"] #timeline .timeline-horizontal .timeline-panel {
  border-color: var(--border-card);
}

[data-banner="koi"] #timeline .timeline-horizontal > li:hover .timeline-panel {
  box-shadow: var(--shadow-card-hover);
}

[data-banner="koi"] #timeline .timeline-horizontal .timeline-heading h4:not(.subheading) {
  color: var(--gold-dark);
}

[data-banner="koi"][data-theme="dark"] #timeline .timeline-horizontal .timeline-heading h4:not(.subheading) {
  color: var(--gold-bright, #6bc48a);
}

@media (prefers-color-scheme: dark) {
  [data-banner="koi"]:not([data-theme]) #timeline .timeline-horizontal .timeline-heading h4:not(.subheading) {
    color: var(--gold-bright, #6bc48a);
  }
}

[data-theme="dark"] #timeline .timeline-horizontal .timeline-panel .timeline-heading > h4.subheading {
  color: #ffffff !important;
}

[data-banner="koi"] #timeline .timeline-horizontal .timeline-image {
  border-color: var(--gold);
  box-shadow: 0 0 0 8px var(--koi-glow), 0 4px 16px rgba(0, 0, 0, 0.12);
}

[data-banner="koi"] #timeline .timeline-horizontal > li:hover .timeline-image {
  box-shadow: 0 0 0 8px rgba(61, 155, 98, 0.3), 0 6px 20px rgba(0, 0, 0, 0.12);
}

[data-banner="koi"] .timeline-scroll-btn,
[data-banner="koi"] .portfolio-scroll-btn {
  border-color: var(--gold);
  color: var(--gold-dark);
}

[data-banner="koi"] .timeline-scroll-btn:hover,
[data-banner="koi"] .portfolio-scroll-btn:hover {
  background: var(--gold);
  color: #fff;
}

[data-banner="koi"] #portfolio .portfolio-link .portfolio-item .portfolio-hover,
[data-banner="koi"] #portfolio .portfolio-grid .portfolio-item .portfolio-hover {
  background: rgba(61, 155, 98, 0.92);
}

[data-banner="koi"] #portfolio .portfolio-grid .portfolio-card:hover .portfolio-item {
  box-shadow: var(--shadow-card-hover);
}

[data-banner="koi"] #portfolio .portfolio-grid .portfolio-item,
[data-banner="koi"] #portfolio .portfolio-scroll-track .portfolio-item {
  border-color: var(--border-card);
}

[data-banner="koi"] #portfolio .portfolio-scroll-track .portfolio-card:hover .portfolio-item {
  box-shadow: var(--shadow-card-hover);
}

[data-banner="koi"] .contact-socials .btn-social {
  box-shadow: 0 4px 14px rgba(61, 155, 98, 0.28);
}

[data-banner="koi"] .contact-socials .btn-social:hover {
  box-shadow: 0 8px 22px rgba(61, 155, 98, 0.4);
}

[data-banner="koi"] .footer {
  background-color: #123222;
}

@media (prefers-reduced-motion: reduce) {
  #koi-pond {
    display: none !important;
  }
}