/* Direction A: EdwJobs PMO identity around an unchanged, light workspace. */
:root {
  --brand-navy: #142235;
  --return-space: 32px;
  --brand-gold: #c6a56b;
  --brand-ink: #f4f6fa;
  --brand-muted: #c2cfdf;
  --background-color: #f5f3ee;
  --border-color: #d8d0c1;
  --brand-brass: #80612e;
  --interaction-surface: #f1eadc;
  --interaction-pressed: #e5d8bf;
  --interaction-link: #244e70;
  --interaction-link-hover: #765526;
  --interaction-dark-hover: #29384a;
  --ui-focus: #80612e;
  --brand-heading: "Yu Mincho", "Hiragino Mincho ProN", Georgia, serif;
  --brand-focus: #8cc9ff;
}

.site-header {
  background: var(--brand-navy);
  border-bottom: 1px solid var(--brand-gold);
}

.header .logo, .header .logo:hover {
  color: var(--brand-ink);
}

.header .logo {
  letter-spacing: .025em;
}

.site-header .nav-link {
  color: var(--brand-muted);
}

.site-header .nav-link.active {
  box-shadow: inset 0 -2px var(--brand-gold);
}

.site-header .current-date {
  color: var(--brand-muted);
  border-color: #43536b;
}

.site-header .search-toggle, .site-header .language-btn, .site-header .mobile-menu-btn {
  color: var(--brand-ink);
  background: #203249;
  border-color: var(--brand-gold);
  border-radius: 5px;
}

.site-header .hamburger span {
  background: var(--brand-ink);
}

.creation-intro {
  display: flex;
  align-items: center;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 490px;
  aspect-ratio: 1.9;
  margin-bottom: 36px;
  padding: 48px;
  border: 1px solid var(--brand-gold);
  border-radius: 12px;
  background: #101b29;
  color: var(--brand-ink);
}

.creation-intro__art {
  position: absolute;
  inset: 0;
  z-index: -2;
  overflow: hidden;
}

.creation-intro__art img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 48%;
}

.creation-intro::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(90deg, #101b29 0%, #101b29f5 26%, #101b29d9 42%, #101b2940 63%, transparent 78%);
}

.creation-intro::after {
  content: '';
  position: absolute;
  inset: 10px;
  border: 1px solid #c6a56b66;
  border-radius: 5px;
  pointer-events: none;
}

.creation-intro__copy {
  width: min(46%, 480px);
}

.creation-eyebrow {
  color: var(--brand-gold);
  font-size: .75rem;
  line-height: 1.8;
  letter-spacing: .08em;
  margin: 0 0 12px;
}

.creation-eyebrow span {
  padding-inline: 8px;
}

.creation-intro h1 {
  color: var(--brand-ink);
  font-family: var(--brand-heading);
  font-size: clamp(1.8rem, 3.1vw, 2.8rem);
  line-height: 1.5;
  letter-spacing: .025em;
  margin: 0 0 20px;
  font-weight: 600;
}

.creation-period {
  color: var(--brand-gold);
}

.creation-intro__description {
  color: var(--brand-muted);
  font-size: .9rem;
  line-height: 1.9;
  max-width: 42em;
  margin: 0;
}

.creation-link {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  min-height: 48px;
  margin-top: 26px;
  padding: 12px 22px;
  border: 1px solid #e3c994;
  border-radius: 5px;
  background: #d9bc84;
  color: #142235;
  font-size: .85rem;
  font-weight: 650;
  text-decoration: none;
  transition: background-color 160ms ease;
}

.creation-link:hover {
  color: #142235;
  background: #ebd3a7;
}

#project-list-heading {
  scroll-margin-top: 170px;
}

.home-content > .projects-list > .section-title {
  display: flex;
  align-items: center;
  gap: 12px;
}

.home-content > .projects-list > .section-title::before {
  content: '';
  width: 4px;
  height: 1.1em;
  border-radius: 2px;
  background: #8c6b35;
  flex-shrink: 0;
}

.creation-journal-intro {
  max-width: 48em;
  color: var(--text-secondary);
  line-height: 1.9;
  margin: -4px 0 24px;
}

.site-footer {
  background: var(--brand-navy);
  border-top: 1px solid var(--brand-gold);
  color: var(--brand-ink);
}

.site-footer .footer-logo {
  color: var(--brand-ink);
  margin-bottom: 8px;
}

.site-footer .creation-footer-note {
  color: var(--brand-gold);
  font-size: .85rem;
  line-height: 1.9;
  margin: 0 0 24px;
}

.site-footer .footer-return {
  color: var(--brand-ink);
}

@media (max-width: 700px) {
  .creation-intro {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    min-height: 0;
    aspect-ratio: auto;
    padding: 0;
    margin-bottom: 24px;
  }
  .creation-intro__copy {
    order: -1;
    width: auto;
    padding: 28px 24px;
  }
  .creation-intro__art {
    position: relative;
    inset: auto;
    z-index: 0;
    aspect-ratio: 1.9;
    width: 100%;
  }
  .creation-intro::before {
    display: none;
  }
  .creation-intro::after {
    z-index: 1;
  }
  .creation-intro h1 {
    font-size: clamp(1.65rem, 6.5vw, 2.5rem);
    margin-bottom: 12px;
  }
  .creation-eyebrow {
    font-size: .7rem;
    letter-spacing: .025em;
  }
  .creation-intro__description {
    font-size: .85rem;
  }
  #project-list-heading {
    scroll-margin-top: 200px;
  }
}

@media (max-width: 480px) {
  #project-list-heading {
    scroll-margin-top: 16px;
  }
}

@media print {
  .creation-intro {
    display: block;
    padding: 0 0 12pt;
    background: #fff;
    color: #000;
    border: 0;
    border-bottom: 1px solid #777;
  }
  .creation-intro p, .creation-period {
    color: #000;
  }
  .creation-intro__art, .creation-intro::before, .creation-intro::after, .creation-link {
    display: none;
  }
  .creation-intro__copy {
    width: auto;
    padding: 0;
  }
}

/* Brass outlines and quiet ink surfaces unify controls without changing status colors. */
.button--primary, .view-details-link.button, .back-to-top {
  background: var(--brand-navy);
  color: var(--brand-ink);
  border: 1px solid var(--brand-brass);
  border-radius: 5px;
  min-height: 44px;
  box-shadow: none;
  text-decoration: none;
}

.button--ghost {
  background: #fffdf8;
  color: var(--brand-navy);
  border: 1px solid var(--brand-brass);
  border-radius: 5px;
}

.board-summary {
  border-top: 2px solid var(--brand-brass);
  background: #fffdf9;
  border-radius: 8px;
}

.projects-list .card, .project-card, .blog-items .journal-card, .member-item {
  border-radius: 8px;
}

.project-header, .blog-post .post-header, .blog-list > .section-title {
  border-bottom-color: var(--brand-gold);
}

.project-visuals > section > .section-title {
  border-bottom: 1px solid var(--border-color);
  padding-bottom: 12px;
}

.task-table th {
  background: #eee9df;
  color: var(--brand-navy);
  border-bottom-color: var(--brand-brass);
}

.task-table tbody tr:nth-child(even) {
  background: #faf9f6;
}

.task-table tbody tr:hover, .task-table tbody tr:focus-within {
  background: var(--interaction-surface);
}

.project-section-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 24px;
}

.project-section-nav a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 9px 18px;
  border: 1px solid var(--brand-brass);
  border-radius: 5px;
  background: #fffdf8;
  color: var(--brand-navy);
  text-decoration: none;
  font-size: .85rem;
}

#project-overview, #schedule-title, #tasks-title {
  scroll-margin-top: 180px;
}

.creation-study {
  margin: 24px 0 36px;
  border: 1px solid var(--brand-brass);
  border-radius: 8px;
  overflow: hidden;
  background: var(--brand-navy);
}

.creation-study img {
  width: 100%;
  height: auto;
  display: block;
}

.creation-study figcaption {
  color: var(--brand-gold);
  font-family: var(--brand-heading);
  padding: 18px 24px;
  line-height: 1.8;
}

.search-box, input[type="search"] {
  border-color: var(--brand-brass);
  border-radius: 5px;
}

@media (min-width: 701px) and (max-width: 1000px) {
  .creation-intro {
    min-height: 420px;
    padding: 36px;
  }
  .creation-intro__copy {
    width: 53%;
  }
  .creation-intro::before {
    background: linear-gradient(90deg, #101b29 0%, #101b29f5 38%, #101b29d9 53%, transparent 85%);
  }
}

@media (max-width: 480px) {
  #project-overview, #schedule-title, #tasks-title {
    scroll-margin-top: 16px;
  }
}

@media print {
  .creation-intro {
    min-height: 0;
    aspect-ratio: auto;
  }
  .creation-study, .project-section-nav {
    display: none;
  }
  .board-summary {
    background: #fff;
    border-color: #777;
  }
}

/* Shared interaction states. Status and priority badges retain semantic colors. */
.task-table td a,
.project-card .project-title a,
.projects-list .card-body h3 a,
.journal-card h2 a,
.rss-link a {
  color: var(--interaction-link);
  text-underline-offset: 4px;
}

.task-table td a {
  text-decoration: underline;
}

.task-table td a:hover, .task-table td:first-child a:hover,
.project-card .project-title a:hover,
.projects-list .card-body h3 a:hover,
.journal-card h2 a:hover, .rss-link a:hover,
.board-project-link:hover, .journal-read-more:hover {
  color: var(--interaction-link-hover);
  text-decoration: underline;
}

.projects-list .card:hover, .projects-list .card:focus-within,
.project-card:hover, .project-card:focus-within,
.blog-items .journal-card:hover, .blog-items .journal-card:focus-within,
.member-item:focus-within {
  background: var(--interaction-surface);
  border-color: var(--brand-brass);
  transform: none;
  box-shadow: none;
}

.task-table tbody tr:hover, .task-table tbody tr:focus-within {
  transform: none;
  box-shadow: none;
}

.workspace-about .feature-item:hover {
  background: #fff;
  border-color: var(--border-color);
  transform: none;
  box-shadow: none;
}

.member-item:hover {
  box-shadow: none;
}

.member-item .member-link:hover {
  color: var(--interaction-link-hover);
  text-decoration: underline;
}

.button--primary:hover, .button--primary:focus-visible,
.view-details-link.button:hover, .view-details-link.button:focus-visible,
.back-to-top:hover {
  background: var(--interaction-dark-hover);
  color: var(--brand-ink);
  border-color: var(--brand-gold);
  transform: none;
  box-shadow: none;
}

.button--ghost:hover, .button--ghost:focus-visible,
.project-section-nav a:hover, .project-section-nav a:focus-visible {
  color: var(--brand-navy);
  background: var(--interaction-surface);
  border-color: var(--brand-brass);
  box-shadow: none;
}

.button--primary:active, .view-details-link.button:active, .back-to-top:active {
  background: #101b29;
  color: var(--brand-gold);
}

.button--ghost:active, .project-section-nav a:active {
  background: var(--interaction-pressed);
}

.creation-link:active {
  background: #c6a56b;
  color: var(--brand-navy);
}

.back-link__button:hover .back-link__icon, .back-link__button:focus-visible .back-link__icon {
  transform: none;
}

.site-header .nav-link:hover, .site-header .nav-link.active {
  background: var(--interaction-dark-hover);
  color: var(--brand-ink);
}

.site-header .search-toggle:hover, .site-header .language-btn:hover, .site-header .mobile-menu-btn:hover {
  background: var(--interaction-dark-hover);
  color: var(--brand-gold);
  border-color: var(--brand-gold);
  box-shadow: none;
}

.site-header .nav-link:active, .site-header .search-toggle:active, .site-header .language-btn:active, .site-header .mobile-menu-btn:active {
  background: #101b29;
  color: var(--brand-gold);
}

.site-header .language-option:hover, .site-header .language-option.is-active,
.site-header .mobile-menu-link:hover, .site-header .mobile-menu-link:focus-visible,
.site-header .mobile-menu-link.active, .site-header .mobile-dropdown .language-option:hover,
.site-header .mobile-dropdown .language-option.is-active {
  color: var(--brand-navy);
  background: var(--interaction-surface);
  border-color: var(--brand-brass);
  transform: none;
}

.site-header .language-option:active, .site-header .mobile-menu-link:active {
  background: var(--interaction-pressed);
}

.site-header .language-option.is-active, .site-header .mobile-menu-link.active {
  box-shadow: inset 3px 0 var(--brand-brass);
}

.site-footer a:hover {
  color: var(--brand-gold);
  text-decoration: underline;
}

.search-results li a {
  color: var(--interaction-link);
  border-bottom-color: var(--border-color);
  border-radius: 5px;
  min-height: 44px;
}

.search-results li a:hover, .search-results li a:focus-visible {
  color: var(--interaction-link-hover);
  background: var(--interaction-surface);
  text-decoration: underline;
}

.search-results li a:active {
  background: var(--interaction-pressed);
}

/* Opaque focus rings remain distinguishable on both light and dark surfaces. */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible,
.button:focus-visible {
  outline: 3px solid var(--brand-brass);
  outline-offset: 3px;
}

.site-header :is(.logo,.nav-link,.search-toggle,.language-btn,.mobile-menu-btn):focus-visible,
.creation-link:focus-visible, .site-footer a:focus-visible, .back-to-top:focus-visible {
  outline-color: var(--brand-gold);
}

.button--primary:disabled, .button--ghost:disabled,
.site-header button:disabled {
  color: #62615c;
  background: #ece9e2;
  border-color: #939087;
  cursor: not-allowed;
  transform: none;
  box-shadow: none;
}

/* Override legacy important transforms; keep Gantt positions and status fills intact. */
#gantt-container:hover, #gantt-global:hover, [id^="gantt-"]:hover {
  transform: none !important;
  box-shadow: none !important;
}

.gantt .bar:hover {
  transform: none !important;
  filter: none !important;
}

.gantt .bar-wrapper:hover .bar, .gantt .bar-wrapper:focus-within .bar {
  stroke: var(--brand-brass);
  stroke-width: 2px;
}

@media print {
  .task-table tbody tr:hover, .task-table tbody tr:focus-within,
  .projects-list .card:hover, .project-card:hover, .journal-card:hover {
    background: #fff !important;
    box-shadow: none !important;
  }
}

@media (forced-colors: active) {
  a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible {
    outline-color: Highlight !important;
  }
}

/* Explicit input colors avoid inherited dark surfaces and native dark controls. */
.search-container .search-box {
  color-scheme: light;
  background: #fff;
  color: #18283f;
  caret-color: #18283f;
  border: 1px solid var(--brand-brass);
}

.search-container .search-box::placeholder {
  color: #526178;
  opacity: 1;
}

.search-container .search-box:focus {
  background: #fff;
  color: #18283f;
}

.search-container .search-box::selection {
  background: #e5d8bf;
  color: #18283f;
}

/* Main stays a skip-link target; mouse focus does not draw a page-sized ring. */
#main-content:focus:not(:focus-visible) {
  outline: none;
}

#main-content:focus-visible {
  outline: 2px solid var(--brand-brass);
  outline-offset: 5px;
}

/* Footer details. */
.site-footer .footer-bottom {
  padding-top: 20px;
  border-top: 1px solid #586071;
}

.site-footer .footer-copy {
  margin: 0;
  color: #c2cfdf;
  font-size: .78rem;
  letter-spacing: .045em;
  line-height: 1.9;
  font-variant-numeric: tabular-nums;
}

.site-footer .footer-copy::before {
  content: '';
  display: inline-block;
  width: 22px;
  height: 1px;
  margin-right: 12px;
  vertical-align: middle;
  background: var(--brand-gold);
}

@media print {
  #main-content:focus-visible {
    outline: none;
  }
}

/* Navigation actions share dimensions and states, irrespective of page type. */
.site-main a.button--primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 44px;
  padding: 12px 20px;
  border: 1px solid var(--brand-brass);
  border-radius: 5px;
  background: var(--brand-navy);
  color: var(--brand-ink);
  font-size: .85rem;
  line-height: 1.5;
  font-weight: 600;
  text-decoration: none;
  box-shadow: none;
  transform: none;
}

.site-main a.button--primary:hover, .site-main a.button--primary:focus-visible {
  background: var(--interaction-dark-hover);
  color: var(--brand-ink);
  border-color: var(--brand-gold);
  text-decoration: none;
  box-shadow: none;
  transform: none;
}

.site-main a.button--primary:active {
  background: #101b29;
  color: var(--brand-gold);
}

@media print {
  .site-main a.button--primary {
    color: #000;
    background: #fff;
    border-color: #777;
  }
}

.site-main .button--primary span[aria-hidden="true"] {
  color: var(--brand-gold);
}

.board-project-link.button {
  align-self: flex-start;
  margin-top: 8px;
}

/* One spacing rule for return navigation below content and card groups. */
.page-return, .project-cards + .detail-return {
  margin-block: var(--return-space) 0;
}

#members {
  scroll-margin-top: 180px;
}

.project-card .view-details-link {
  align-self: flex-start;
  margin-top: auto;
}

@media (max-width: 700px) {
  :root {
    --return-space: 24px;
  }
}

@media (max-width: 480px) {
  #members {
    scroll-margin-top: 16px;
  }
}

@media print {
  .page-return {
    display: none;
  }
}

/* Search controls: white input, native buttons, persistent selection feedback. */
.search-label {
  display: block;
  text-align: left;
  margin-bottom: 8px;
  font-weight: 600;
}

.search-help, .search-status {
  text-align: left;
  color: var(--text-secondary);
  line-height: 1.8;
  font-size: .85rem;
  margin-block: 12px;
}

.search-container .tag-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-block: 16px;
}

.search-container .search-box:disabled {
  background: #f5f3ee;
  color: #526178;
  cursor: wait;
}

.search-clear, .search-retry {
  margin-block: 8px;
}

/* Shared tag component: static labels and interactive filters share visual tokens. */
.tag {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  padding: 4px 10px;
  margin: 0;
  border: 1px solid var(--border-color);
  border-radius: 5px;
  background: #f5f3ee;
  color: var(--text-secondary);
  font: inherit;
  font-size: .8rem;
  line-height: 1.6;
  overflow-wrap: anywhere;
}

button.tag {
  min-height: 44px;
  padding: 8px 14px;
  cursor: pointer;
}

button.tag:hover {
  background: var(--interaction-surface);
  border-color: var(--brand-brass);
}

button.tag:active {
  background: var(--interaction-pressed);
}

button.tag[aria-pressed="true"] {
  background: var(--brand-navy);
  color: var(--brand-ink);
  border-color: var(--brand-brass);
  text-decoration: underline;
  text-underline-offset: 4px;
}

.search-more {
  margin-top: 16px;
}

.related-content {
  margin-block: 32px;
  padding-top: 24px;
  border-top: 1px solid var(--border-color);
}

.related-list {
  list-style: none;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}

.related-list > li {
  min-width: 0;
  padding: 20px;
  border: 1px solid var(--border-color);
  border-radius: 8px;
  background: #fff;
}

.related-list > li:focus-within {
  border-color: var(--brand-brass);
  background: var(--interaction-surface);
}

.related-kind {
  font-size: .75rem;
  color: var(--text-secondary);
  margin-bottom: 8px;
}

.related-list h3 {
  font-size: 1rem;
  line-height: 1.7;
  margin-bottom: 12px;
}

.related-list a {
  color: var(--interaction-link);
  text-underline-offset: 4px;
}

.related-list a:hover {
  color: var(--interaction-link-hover);
}

@media (max-width: 700px) {
  .related-list {
    grid-template-columns: 1fr;
  }
}