/* Shared navigation, content surfaces and quiet interaction details. */
.site-header {
  position: sticky; top: 0; z-index: 10;
  background: rgba(247, 248, 244, 0.94);
  box-shadow: 0 8px 24px rgba(23, 36, 43, 0.045);
  backdrop-filter: blur(10px);
}

.site-header-inner { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); min-height: 4.6rem; }

.wordmark { display: inline-flex; align-items: center; color: var(--text); font-family: var(--font-display); font-size: clamp(1.3rem, 2vw, 1.55rem); letter-spacing: -0.03em; line-height: 1; text-decoration: none; }
.wordmark:hover { color: var(--text); }

.wordmark-name { padding-top: 0.06em; white-space: nowrap; }

.site-nav { display: flex; align-items: center; gap: clamp(0.85rem, 2vw, 1.75rem); flex-wrap: wrap; }
.site-nav a { padding: 0.35rem 0.55rem; border-radius: 0.35rem; color: var(--muted); font-family: var(--font-label); font-size: var(--text-xs); font-weight: 600; letter-spacing: 0.08em; text-decoration: none; text-transform: uppercase; }
.site-nav a:hover, .site-nav a[aria-current="page"] { color: var(--observer); }
.site-nav a[aria-current="page"] { background: var(--observer-soft); }

.hero-actions { display: flex; gap: var(--space-2); flex-wrap: wrap; margin-top: var(--space-4); }
.button { display: inline-flex; align-items: center; justify-content: center; min-height: 2.8rem; padding: 0.65rem 1rem; border: 1px solid transparent; font-family: var(--font-label); font-size: var(--text-sm); font-weight: 600; line-height: 1.2; text-decoration: none; }
.button-primary { border-color: var(--observer-deep); background: var(--observer-deep); color: #fff; }
.button-primary:hover { background: var(--observer); color: #fff; }
.button-secondary { background: var(--paper-deep); color: var(--text); }
.button-secondary:hover { background: var(--observer-soft); color: var(--observer-deep); }

.profile-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-2); margin-top: var(--space-5); }
.focus-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.toolkit-facts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.section-title + .profile-facts { margin-top: 0; }
.profile-facts div { padding: var(--space-3); border-radius: 0.6rem; background: var(--paper-alt); }
.profile-facts dt { color: var(--faint); font-family: var(--font-label); font-size: var(--text-xs); font-weight: 600; letter-spacing: 0.09em; text-transform: uppercase; }
.profile-facts dd { margin-top: 0.25rem; color: var(--text); font-size: var(--text-sm); line-height: 1.5; }

.site-footer { margin-top: var(--space-6); background: var(--paper-deep); }
.site-footer-inner { display: flex; align-items: start; justify-content: space-between; gap: var(--space-4); flex-wrap: wrap; padding-top: var(--space-5); }
.footer-links { display: flex; gap: var(--space-3); flex-wrap: wrap; }
.footer-links a { font-family: var(--font-label); font-size: var(--text-sm); font-weight: 600; }
.footer-note { padding-bottom: var(--space-4); margin-top: var(--space-3); color: var(--faint); font-size: var(--text-xs); }

.ledger { display: grid; gap: var(--space-2); }
.ledger-row { display: grid; grid-template-columns: var(--rail) minmax(0, 1fr); gap: var(--space-4); padding: clamp(1.7rem, 3vw, 2.75rem); border-radius: 0.7rem; background: var(--paper-alt); }
.ledger-when { color: var(--observer); font-family: var(--font-label); font-size: var(--text-sm); font-weight: 600; font-variant-numeric: tabular-nums; letter-spacing: 0.02em; }
.ledger-when .sub { display: block; margin-top: var(--space-1); color: var(--faint); font-size: var(--text-xs); font-weight: 400; }
.ledger-what h3 { font-size: clamp(1.55rem, 3vw, 2.15rem); }
.ledger-what .org { margin-top: 0.3rem; color: var(--observer); font-family: var(--font-label); font-size: var(--text-sm); font-weight: 600; }
.ledger-what p { margin-top: var(--space-2); color: var(--muted); }

.chip { display: inline-block; margin-left: var(--space-2); padding: 0.2rem 0.5rem; border-radius: 999px; background: var(--observer-soft); color: var(--observer); font-family: var(--font-label); font-size: 0.62rem; font-weight: 600; letter-spacing: 0.1em; line-height: 1.25; text-transform: uppercase; vertical-align: middle; }

.card-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-2); }
.card { display: block; min-height: 0; padding: clamp(1.45rem, 2.6vw, 2.25rem); border-radius: 0.7rem; background: var(--paper-alt); color: var(--text); text-decoration: none; transition: background-color 180ms var(--ease-out), transform 180ms var(--ease-out); }
.card:hover { background: var(--observer-soft); color: var(--text); transform: translateY(-3px); }
.card p { margin-top: var(--space-3); color: var(--muted); font-size: var(--text-sm); }

.plain-list { display: grid; gap: 0.5rem; }
.plain-list li { display: flex; justify-content: space-between; gap: var(--space-3); padding: var(--space-2) var(--space-3); border-radius: 0.5rem; background: var(--paper-alt); font-size: var(--text-sm); }
.plain-list .issuer { color: var(--faint); font-family: var(--font-label); font-size: var(--text-xs); font-weight: 600; letter-spacing: 0.04em; text-align: right; }

.tracks-scroll { overflow-x: auto; padding: var(--space-3); border-radius: 0.7rem; background: var(--paper-alt); scrollbar-color: var(--observer) transparent; scrollbar-width: thin; }
.tracks-grid { display: grid; grid-template-columns: repeat(336, minmax(0.09rem, 1fr)); grid-template-rows: 1.9rem 1.9rem 1.9rem 1.9rem 1.5rem; row-gap: 0.5rem; min-width: 50rem; }
.bar { overflow: hidden; padding-inline: 0.5rem; color: var(--observer-deep); font-family: var(--font-label); font-size: 0.66rem; font-weight: 600; letter-spacing: 0.015em; line-height: 1.9rem; text-overflow: ellipsis; white-space: nowrap; }
.bar { border-radius: 0.3rem; }
.bar-work { background: var(--observer-soft); }
.bar-study { background: var(--study-soft); color: #405449; }
.bar-now { background: var(--observer); color: #fff; }
.year-tick { align-self: end; padding-left: 0.45rem; color: var(--faint); font-family: var(--font-label); font-size: var(--text-xs); font-variant-numeric: tabular-nums; }
.timeline-atmiya { grid-column: 53 / 60; grid-row: 1; }
.timeline-cellent { grid-column: 60 / 85; grid-row: 1; }
.timeline-smart-wireless { grid-column: 85 / 118; grid-row: 1; }
.timeline-telstra-first { grid-column: 118 / 261; grid-row: 1; }
.timeline-cba { grid-column: 261 / 266; grid-row: 1; }
.timeline-telstra-second { grid-column: 266 / 310; grid-row: 1; }
.timeline-x15 { grid-column: 310 / 314; grid-row: 1; }
.timeline-quantium { grid-column: 314 / 337; grid-row: 1; }
.timeline-be { grid-column: 6 / 54; grid-row: 2; }
.timeline-mit { grid-column: 187 / 301; grid-row: 2; }
.timeline-mres { grid-column: 307 / 330; grid-row: 2; }
.timeline-cyber { grid-column: 253 / 289; grid-row: 3; }
.timeline-mba { grid-column: 256 / 273; grid-row: 4; }
.timeline-year-2000 { grid-column: 1 / span 24; }
.timeline-year-2005 { grid-column: 61 / span 24; }
.timeline-year-2010 { grid-column: 121 / span 24; }
.timeline-year-2015 { grid-column: 181 / span 24; }
.timeline-year-2020 { grid-column: 241 / span 24; }
.timeline-year-2025 { grid-column: 301 / span 24; }
.tracks-legend { display: flex; align-items: center; gap: var(--space-3); flex-wrap: wrap; margin-top: var(--space-2); color: var(--muted); font-family: var(--font-label); font-size: var(--text-xs); }
.key { display: inline-block; width: 1.25rem; height: 0.65rem; margin-right: 0.35rem; border-radius: 0.2rem; vertical-align: -0.04em; }
.key-work { background: var(--observer-soft); }
.key-study { background: var(--study-soft); }

@media (max-width: 44rem) {
  .site-header-inner { min-height: auto; padding-block: 1rem; flex-wrap: wrap; }
  .site-nav { width: 100%; gap: 0.75rem 1.1rem; justify-content: space-between; }
  .ledger-row { grid-template-columns: 1fr; gap: var(--space-2); }
  .plain-list li { display: grid; }
  .plain-list .issuer { text-align: left; }
  .profile-facts { grid-template-columns: 1fr; }
  .focus-facts { grid-template-columns: 1fr; }
  .toolkit-facts { grid-template-columns: 1fr; }
  .profile-facts div, .profile-facts div + div { padding: var(--space-3); }
  .card-grid { grid-template-columns: 1fr; }
}