/* Shared portfolio theme layer — include on every current and future page. */
:root {
  color-scheme: dark;
  --theme-accent: var(--cyan, #15c9d0);
  --theme-accent-strong: #15c9d0;
  --theme-toggle-bg: rgba(21,201,208,.12);
  --theme-toggle-ring: rgba(21,201,208,.34);
}
html[data-theme="light"] {
  color-scheme: light;
  --ink: #10172a;
  --muted: #526078;
  --night: #f6f8fc;
  --panel: #ffffff;
  --panel-2: #eef3fb;
  --line: rgba(15, 36, 73, .17);
  --cyan: #1746a2;
  --blue: #2459c4;
  --violet: #5a42a8;
  --green: #1746a2;
  --theme-accent: #1746a2;
  --theme-accent-strong: #0f367f;
  --theme-toggle-bg: #e6edff;
  --theme-toggle-ring: rgba(23,70,162,.28);
}
html[data-theme="light"] body {
  background: radial-gradient(circle at 82% 4%, rgba(36,89,196,.10), transparent 32rem),
              radial-gradient(circle at 8% 42%, rgba(23,70,162,.06), transparent 28rem),
              var(--night) !important;
}
html[data-theme="light"] .site-header { background: rgba(246,248,252,.90) !important; backdrop-filter: blur(16px); }
html[data-theme="dark"] .site-header { backdrop-filter: blur(16px); }
html[data-theme="light"] .card,
html[data-theme="light"] .metric,
html[data-theme="light"] .capability,
html[data-theme="light"] .project,
html[data-theme="light"] .journey-step,
html[data-theme="light"] .handshake-card,
html[data-theme="light"] .mobile-gallery,
html[data-theme="light"] .case-card,
html[data-theme="light"] .insight-card,
html[data-theme="light"] .artifact-card { box-shadow: 0 12px 36px rgba(23,42,79,.06); }

/* Light theme accent: vibrant navy replaces cyan/green brand accents. */
html[data-theme="light"] .brand span,
html[data-theme="light"] .eyebrow,
html[data-theme="light"] .kicker,
html[data-theme="light"] .section-label,
html[data-theme="light"] .metric strong,
html[data-theme="light"] .card small,
html[data-theme="light"] .gallery-counter,
html[data-theme="light"] .slide-copy small,
html[data-theme="light"] .journey-step span,
html[data-theme="light"] .journey-step:not(:last-child)::after,
html[data-theme="light"] .handshake-arrow,
html[data-theme="light"] .handshake-card span { color: var(--theme-accent) !important; }

/* Primary CTAs: WCAG-friendly white on navy in light mode. */
html[data-theme="light"] .button:not(.ghost):not(.button--ghost),
html[data-theme="light"] .primary,
html[data-theme="light"] button.confirm {
  background: var(--theme-accent) !important;
  border-color: var(--theme-accent) !important;
  color: #fff !important;
  box-shadow: 0 8px 22px rgba(23,70,162,.18);
}
html[data-theme="light"] .button:not(.ghost):not(.button--ghost):hover,
html[data-theme="light"] .primary:hover,
html[data-theme="light"] button.confirm:hover {
  background: var(--theme-accent-strong) !important;
  border-color: var(--theme-accent-strong) !important;
  color: #fff !important;
}
html[data-theme="light"] .button.ghost,
html[data-theme="light"] .button--ghost { background: #fff !important; color: var(--ink) !important; border-color: rgba(15,54,127,.24) !important; }

/* Theme control — intentionally more visible in both modes. */
.theme-toggle {
  position: relative;
  display: inline-grid;
  place-items: center;
  width: 44px;
  height: 44px;
  flex: 0 0 44px;
  padding: 0;
  border: 1px solid var(--theme-accent) !important;
  border-radius: 999px;
  color: var(--theme-accent) !important;
  background: var(--theme-toggle-bg) !important;
  box-shadow: 0 0 0 4px var(--theme-toggle-ring), 0 8px 24px rgba(0,0,0,.12);
  cursor: pointer;
  transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease;
}
.theme-toggle:hover { transform: translateY(-2px); box-shadow: 0 0 0 5px var(--theme-toggle-ring), 0 12px 28px rgba(0,0,0,.16); }
.theme-toggle:focus-visible { outline: 3px solid var(--theme-accent) !important; outline-offset: 4px !important; }
.theme-toggle svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.9; }
.theme-toggle .icon-sun { display: none; }
html[data-theme="light"] .theme-toggle .icon-sun { display: block; }
html[data-theme="light"] .theme-toggle .icon-moon { display: none; }
html[data-theme="dark"] .theme-toggle .icon-moon { display: block; }

/* Keep canvas subtle in light mode. */
html[data-theme="light"] .firefly-canvas { opacity: .28 !important; filter: saturate(.65); }

/* Shared accessible focus treatment. */
a:focus-visible, button:focus-visible, [tabindex]:focus-visible { outline: 3px solid var(--theme-accent); outline-offset: 3px; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}


/* Credit Card Story Statement — light-mode contrast corrections. */
html[data-theme="light"] .credit-card-case .case-nav {
  background: rgba(246,248,252,.94) !important;
}
html[data-theme="light"] .credit-card-case .card,
html[data-theme="light"] .credit-card-case .problem-item,
html[data-theme="light"] .credit-card-case .principle {
  background: #ffffff !important;
  border-color: rgba(15,36,73,.15) !important;
}
html[data-theme="light"] .credit-card-case .ownership,
html[data-theme="light"] .credit-card-case .recommendation-copy {
  background: linear-gradient(145deg, rgba(23,70,162,.075), #ffffff 72%) !important;
  border-color: rgba(23,70,162,.25) !important;
}
html[data-theme="light"] .credit-card-case .metric {
  background: rgba(23,70,162,.055) !important;
  border-color: rgba(23,70,162,.20) !important;
}
html[data-theme="light"] .credit-card-case .map-row:first-child {
  background: rgba(23,70,162,.07) !important;
  color: var(--theme-accent) !important;
}
html[data-theme="light"] .credit-card-case .problem-item b {
  background: var(--theme-accent) !important;
  color: #ffffff !important;
}
html[data-theme="light"] .credit-card-case .research-note {
  background: #fff8e8 !important;
  color: #4e5668 !important;
  border-left-color: #9a6700 !important;
}
html[data-theme="light"] .credit-card-case .research-note strong {
  color: #765000 !important;
}
html[data-theme="light"] .credit-card-case .showcase-note {
  background: rgba(255,255,255,.94) !important;
  border-color: rgba(15,36,73,.18) !important;
  color: #10172a !important;
  box-shadow: 0 8px 24px rgba(23,42,79,.10);
}
html[data-theme="light"] .credit-card-case .showcase {
  border-color: rgba(23,70,162,.20) !important;
  box-shadow: 0 24px 70px rgba(23,42,79,.14) !important;
}
html[data-theme="light"] .credit-card-case .artifact {
  border-color: rgba(15,36,73,.16) !important;
}
html[data-theme="light"] .credit-card-case .artifact figcaption {
  background: #f8fafc !important;
  border-top-color: rgba(15,36,73,.13) !important;
  color: #526078 !important;
}
html[data-theme="light"] .credit-card-case .artifact figcaption strong {
  color: #10172a !important;
}
html[data-theme="light"] .credit-card-case .content-map {
  background: #ffffff !important;
  border-color: rgba(15,36,73,.15) !important;
}
html[data-theme="light"] .credit-card-case dialog {
  border-color: rgba(15,36,73,.18) !important;
  box-shadow: 0 30px 100px rgba(23,42,79,.22) !important;
}

/* V13 case-study navigation consistency */
.case-nav{top:var(--case-header-height,90px)!important}
.case-study-pager{width:min(calc(100% - 40px),1180px);margin:0 auto;padding:42px 0 54px;border-top:1px solid var(--line,rgba(255,255,255,.13));display:grid;grid-template-columns:1fr 1fr;gap:18px}
.case-study-pager a{display:flex;flex-direction:column;gap:5px;padding:18px 20px;border:1px solid var(--line,rgba(255,255,255,.13));border-radius:16px;text-decoration:none;background:color-mix(in srgb,var(--panel,#10132f) 78%,transparent);transition:transform .2s ease,border-color .2s ease,background .2s ease}
.case-study-pager a:hover{transform:translateY(-2px);border-color:var(--cyan,var(--accent,#15c9d0))}
.case-study-pager a:last-child{text-align:right;align-items:flex-end}
.case-study-pager small{color:var(--muted,#a7aec9);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase}
.case-study-pager strong{font:700 1rem "DM Sans",system-ui,sans-serif;color:var(--ink,#f7f8ff)}
@media(max-width:640px){.case-study-pager{grid-template-columns:1fr;padding:30px 0 40px}.case-study-pager a:last-child{text-align:left;align-items:flex-start}}