:root {
  color-scheme: light;
  --navy-900:#0a1a2a;
  --navy-800:#0f2740;
  --navy-700:#173a5c;
  --navy-600:#1f4a74;
  --ice:#3a8fd6;
  --ice-ink:#1d6fb4;
  --ice-soft:#e4f0fb;
  --ink:#141f29;
  --muted:#5a6b7a;
  --line:#d8dfe6;
  --paper:#f4f6f8;
  --surface:#ffffff;
  --amber:#fbe6c8;
  --amber-ink:#6b4b06;
  --mint:#dff1e9;
  --grey-badge:#e6e9ec;
  --radius:6px;
  --shadow:0 8px 24px rgba(10,26,42,.10);
  --container:1200px;
}

* { box-sizing: border-box; min-width: 0; }
html { background: var(--paper); overflow-x: hidden; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: "Helvetica Neue", Helvetica, Arial, "Segoe UI", Roboto, sans-serif;
  font-size: 16px;
  line-height: 1.6;
  overflow-x: hidden;
}
a { color: var(--ice-ink); }
a:visited { color: var(--ice-ink); }
h1, h2, h3, h4 { color: var(--navy-800); font-weight: 700; letter-spacing: -.015em; line-height: 1.2; }
:focus-visible { outline: 3px solid var(--ice); outline-offset: 3px; }
.container { width: 100%; max-width: var(--container); min-width: 0; margin: 0 auto; padding: 0 1.5rem; }

.skip-link {
  position: fixed; left: -999px; top: 0; z-index: 100;
  padding: .65rem 1rem; background: var(--navy-900); color: #fff; border-radius: 0 0 4px 0;
}
.skip-link:focus { left: 0; }

.utility-bar { min-height: 34px; background: var(--navy-900); color: rgba(255,255,255,.72); font-size: .78rem; letter-spacing: .055em; text-transform: uppercase; }
.utility-bar .container { min-height: 34px; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.utility-links { display: flex; align-items: center; gap: 1.25rem; }
.utility-bar a, .utility-bar a:visited { color: #fff; text-decoration: none; }
.utility-bar a:hover { text-decoration: underline; }

.site-header { position: relative; z-index: 30; background: var(--surface); border-bottom: 1px solid var(--line); box-shadow: 0 2px 10px rgba(10,26,42,.06); }
.header-inner { display: flex; align-items: center; justify-content: space-between; gap: 2rem; min-height: 76px; }
.brand { display: flex; align-items: center; flex: 0 1 auto; gap: .65rem; min-width: 0; color: var(--navy-800); text-decoration: none; }
.brand:visited { color: var(--navy-800); }
.brand strong { display: block; font-size: 1.15rem; line-height: 1.15; }
.brand small { display: block; color: var(--muted); font-size: .72rem; font-weight: 400; line-height: 1.35; }

.primary-nav { display: flex; align-items: stretch; align-self: stretch; }
.nav-link, .nav-trigger {
  display: flex; align-items: center; min-height: 100%; padding: 1.4rem .9rem;
  border-bottom: 3px solid transparent; color: var(--navy-800); cursor: pointer;
  font-size: .95rem; font-weight: 600; line-height: 1.2; text-decoration: none; white-space: nowrap;
}
.nav-link:visited { color: var(--navy-800); }
.nav-link:hover, .nav-link[aria-current="page"], .nav-trigger:hover, .nav-trigger[aria-current="page"], .nav-group:focus-within .nav-trigger { border-bottom-color: var(--ice); }
.nav-group { position: relative; display: flex; }
.nav-menu { position: absolute; z-index: 40; top: 100%; left: 0; display: none; min-width: 240px; margin: -1px 0 0; padding: .5rem 0; list-style: none; background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow); }
.nav-group:hover .nav-menu, .nav-group:focus-within .nav-menu { display: block; }
.nav-menu a { display: block; padding: .65rem 1rem .65rem 1.15rem; border-left: 2px solid transparent; color: var(--navy-800); font-size: .95rem; text-decoration: none; }
.nav-menu a:visited { color: var(--navy-800); }
.nav-menu a:hover, .nav-menu a:focus, .nav-menu a[aria-current="page"] { border-left-color: var(--ice); background: var(--ice-soft); }
.nav-drawer { display: none; position: relative; }

main { display: block; }
.hero { position: relative; min-height: 520px; height: min(72vh, 640px); overflow: hidden; background: linear-gradient(90deg, rgba(10,26,42,.88) 0%, rgba(10,26,42,.55) 55%, rgba(10,26,42,.25) 100%), url(assets/hero.jpg) center/cover; }
.hero::before { content: ""; position: absolute; z-index: 1; inset: 0; background: linear-gradient(90deg, rgba(10,26,42,.88) 0%, rgba(10,26,42,.55) 55%, rgba(10,26,42,.25) 100%); }
.hero-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hero-content { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-end; height: 100%; min-height: inherit; padding-top: 5rem; padding-bottom: 8rem; color: #fff; }
.hero .eyebrow { color: #8fc8f5; font-size: .78rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.hero h1 { margin: .35rem 0 .65rem; color: #fff; font-size: clamp(2.6rem, 5.5vw, 4.2rem); }
.tagline { max-width: 46ch; margin: 0; color: rgba(255,255,255,.88); font-size: 1.15rem; }

.start-here-wrap { position: relative; z-index: 3; margin-top: -64px; }
.start-here { max-width: 720px; padding: 1.6rem 2rem 1.75rem; background: var(--surface); border-radius: var(--radius); box-shadow: var(--shadow); }
.start-here h2 { margin: 0 0 .4rem; font-size: 1.35rem; }
.start-here p { margin: 0 0 1rem; color: var(--muted); }
.button-link { display: inline-block; padding: .65rem 1rem; background: var(--navy-800); border-radius: 4px; color: #fff; font-weight: 600; text-decoration: none; }
.button-link:visited { color: #fff; }
.button-link:hover { background: var(--navy-600); }

.home-section { padding: 5rem 0 0; }
.home-section h2, .ai-band h2 { margin: 0 0 2rem; font-size: clamp(1.6rem, 2.4vw, 2rem); }
.home-section h2::after, .ai-band h2::after { content: ""; display: block; width: 48px; height: 3px; margin-top: .7rem; background: var(--ice); }
.news-grid { display: grid; grid-template-columns: repeat(3, 1fr); grid-auto-flow: dense; gap: 1.5rem; }
.news-card { display: flex; flex-direction: column; overflow: hidden; min-width: 0; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); color: var(--ink); text-decoration: none; transition: transform .18s ease, box-shadow .18s ease; }
.news-card:visited { color: var(--ink); }
.news-card:hover { transform: translateY(-2px); box-shadow: var(--shadow); }
.news-card img { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.news-card-body { display: block; padding: 1.2rem 1.3rem 1.4rem; }
.news-date { color: var(--ice-ink); font-size: .76rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.news-card h3 { margin: .45rem 0 0; font-size: 1.15rem; }
.news-card-featured { grid-column: span 2; grid-row: span 2; }
.news-card-featured img { aspect-ratio: auto; flex: 1 1 auto; min-height: 280px; }
.news-card-featured h3 { font-size: 1.6rem; }

.sections { padding-bottom: 5rem; }
.section-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.25rem; }
.section-card { display: flex; flex-direction: column; min-height: 245px; padding: 1.5rem; background: var(--surface); border: 1px solid var(--line); border-top: 4px solid var(--navy-800); border-radius: var(--radius); color: var(--ink); text-decoration: none; transition: border-color .18s ease, box-shadow .18s ease; }
.section-card:visited { color: var(--ink); }
.section-card:hover { border-top-color: var(--ice); box-shadow: var(--shadow); }
.section-icon { color: var(--ice-ink); fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.section-card h3 { margin: 1rem 0 .5rem; font-size: 1.15rem; }
.section-card p { margin: 0 0 1rem; color: var(--muted); font-size: .92rem; }
.section-count { margin-top: auto; color: var(--ice-ink); font-size: .8rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }

.ai-band { padding: 4.5rem 0; background: linear-gradient(rgba(15,39,64,.92), rgba(15,39,64,.92)), url(assets/band-terrain.jpg) center/cover; color: #fff; }
.ai-band-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(260px, .45fr); align-items: center; gap: 4rem; }
.ai-band h2 { color: #fff; }
.ai-band p { max-width: 64ch; margin: 0; color: rgba(255,255,255,.88); }
.ai-band a, .ai-band a:visited { color: #fff; text-decoration: underline; }
.ai-band code { padding: .1rem .3rem; background: rgba(255,255,255,.12); border-radius: 3px; color: #fff; }
.ai-link-tiles { display: grid; gap: 1rem; }
.ai-link-tiles a { display: block; padding: 1.2rem 1.35rem; border: 1px solid rgba(255,255,255,.75); border-radius: 4px; font-size: 1.15rem; font-weight: 700; text-decoration: none; }
.ai-link-tiles a:hover { background: #fff; color: var(--navy-800); }

.page-header { padding: 2.25rem 0 2.5rem; background: linear-gradient(120deg, var(--navy-800), var(--navy-700)); color: #fff; }
.page-header-company { background: linear-gradient(rgba(15,39,64,.88), rgba(15,39,64,.88)), url(assets/section-company.jpg) center/cover; }
.breadcrumb { margin-bottom: 1.3rem; color: rgba(255,255,255,.75); font-size: .85rem; }
.breadcrumb a, .breadcrumb a:visited { color: rgba(255,255,255,.78); text-decoration: none; }
.breadcrumb a:hover { color: #fff; text-decoration: underline; }
.breadcrumb span { color: #fff; }
.page-header h1 { max-width: 24ch; margin: 0; color: #fff; font-size: clamp(2rem, 4vw, 3rem); }
.section-lede { max-width: 70ch; margin: .8rem 0 .25rem; color: rgba(255,255,255,.86); font-size: 1.08rem; }
.page-count { margin: 1rem 0 0; color: #8fc8f5; font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }

.metadata { display: flex; flex-wrap: wrap; gap: 1rem 2.25rem; margin: 1.6rem 0 0; padding: 1.25rem 0 0; border-top: 1px solid rgba(255,255,255,.23); }
.metadata div { min-width: 110px; }
.metadata dt { color: rgba(255,255,255,.68); font-size: .72rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; }
.metadata dd { margin: .1rem 0 0; color: #fff; font-weight: 600; }
.metadata a, .metadata a:visited { color: #fff; text-decoration: underline; }
.badge { display: inline-block; padding: .18rem .48rem; border-radius: 3px; font-size: .72rem; font-weight: 700; letter-spacing: .04em; line-height: 1.35; text-transform: uppercase; }
.badge-approved { background: var(--mint); color: #165b3d; }
.badge-draft { background: var(--amber); color: var(--amber-ink); }
.badge-copy { background: var(--grey-badge); color: #35424d; }
.badge-media { background: var(--amber); color: var(--amber-ink); }

.layout-sidebar { display: grid; grid-template-columns: minmax(0, 280px) minmax(0, 1fr); gap: 3rem; padding-top: 3rem; padding-bottom: 4.5rem; }
.layout-sidebar > article, .layout-sidebar > .side-nav { min-width: 0; }
.side-nav { position: sticky; top: 1rem; align-self: start; }
.side-nav-group + .side-nav-group { margin-top: 2rem; }
.side-nav h2 { margin: 0 0 .65rem; color: var(--muted); font-size: .78rem; letter-spacing: .08em; text-transform: uppercase; }
.side-nav ul { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.side-nav li { border-bottom: 1px solid var(--line); }
.side-nav a { display: block; padding: .55rem .6rem .55rem .8rem; border-left: 3px solid transparent; color: var(--muted); font-size: .9rem; line-height: 1.35; overflow-wrap: anywhere; text-decoration: none; }
.side-nav a:visited { color: var(--muted); }
.side-nav a:hover { color: var(--navy-800); background: var(--surface); }
.side-nav a[aria-current="page"] { border-left-color: var(--ice); background: var(--ice-soft); color: var(--navy-800); font-weight: 600; }
.side-entry-list { max-height: 70vh; overflow: auto; }
.section-index-content { min-width: 0; }
.people-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)); gap: 1rem; padding: 0; list-style: none; }
.person-portrait { display: block; width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; border-radius: .25rem; }
.person-card { min-width: 0; border: 1px solid var(--line); border-radius: 8px; padding: 1rem; }
.person-card h3 { margin: 0 0 .5rem; }
.person-card p { margin: .35rem 0; }
.person-card a { display: inline-block; max-width: 100%; overflow-wrap: anywhere; }
.section-index-content > h2 { margin: 2rem 0 .75rem; font-size: 1.15rem; }
.section-index-content > h2:first-child { margin-top: 0; }
.section-index-content > h2::after { content: ""; display: block; width: 48px; height: 3px; margin-top: .5rem; background: var(--ice); }

.document-content {
  width: 100%;
  min-width: 0;
  max-width: 78ch;
  padding: 2.5rem;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
}
.document-content, .document-content p, .document-content li, .document-content dd,
.document-content th, .document-content td, .document-content a { overflow-wrap: anywhere; }
.document-content > :first-child { margin-top: 0; }
.document-content h2 { margin: 2rem 0 1rem; padding-bottom: .55rem; border-bottom: 1px solid var(--line); font-size: 1.5rem; }
.document-content h3 { margin-top: 1.75rem; font-size: 1.2rem; }
.document-content h4 { font-size: 1rem; }
.document-content blockquote { min-width: 0; margin: 1.5rem 0; padding: .65rem 1.2rem; border-left: 4px solid var(--ice); background: var(--ice-soft); }
.document-content code, .document-content pre { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.document-content code { padding: .1rem .3rem; border-radius: 3px; background: var(--grey-badge); }
.copyable-code { width: 100%; min-width: 0; margin: 1.5rem 0; }
.copy-toolbar { display: none; }
.copy-js .copy-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: .65rem; margin-bottom: .45rem; }
.copy-button { padding: .4rem .7rem; border: 1px solid var(--navy-700); border-radius: 4px; background: var(--surface); color: var(--navy-800); cursor: pointer; font: inherit; font-size: .82rem; font-weight: 700; }
.copy-button:hover { background: var(--ice-soft); }
.copy-status { min-height: 1.35em; color: var(--muted); font-size: .82rem; }
.document-content pre { max-width: 100%; margin: 0; padding: 1.1rem; overflow: visible; white-space: pre-wrap; overflow-wrap: anywhere; word-break: break-word; background: var(--navy-900); color: #eef5fb; border-radius: 4px; }
.document-content pre code { background: none; padding: 0; color: inherit; }

.table-wrap { overflow-x: auto; margin: 1rem 0; }
.exercise-scene { margin: 1.5rem 0; max-width: 640px; }
.exercise-scene img { display: block; width: 100%; height: auto; border-radius: 8px; }
.document-content-wide { max-width: none; }
table { border-collapse: collapse; width: 100%; font-size: .92rem; }
caption { margin-bottom: .4rem; color: var(--muted); font-size: .82rem; text-align: left; }
th, td { padding: .65rem .7rem; border: 1px solid var(--line); text-align: left; vertical-align: top; }
th { background: #eef2f5; }
.index-table { margin: 0 0 1.75rem; }
.index-cell-label { display: none; }
.index-table th, .index-table td { border-width: 0 0 1px; }
.index-table thead th { border-bottom: 2px solid var(--navy-800); background: transparent; color: var(--muted); font-size: .75rem; letter-spacing: .06em; text-transform: uppercase; }
.index-table tbody tr:nth-child(even) { background: #f9fafb; }
.index-table tbody tr:hover { background: var(--ice-soft); }
.index-table td:first-child a { color: var(--navy-800); font-weight: 600; text-decoration: none; }
.index-table td:nth-child(2) { white-space: nowrap; }
.index-table td:first-child a:hover { text-decoration: underline; }

.pager { display: flex; justify-content: space-between; gap: 1rem; margin: 2rem 0 0; font-size: .9rem; }
.pager span:last-child { margin-left: auto; text-align: right; }
.pager a { display: inline-block; padding: .65rem .85rem; border: 1px solid var(--navy-700); border-radius: 4px; color: var(--navy-800); font-weight: 600; line-height: 1.35; text-decoration: none; }
.pager a:hover { background: var(--navy-800); color: #fff; }

.site-footer { background: var(--navy-900); color: rgba(255,255,255,.72); font-size: .88rem; }
.footer-grid { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: 2.5rem; padding-top: 3.5rem; padding-bottom: 3rem; }
.site-footer .brand, .site-footer .brand:visited { color: #fff; }
.site-footer .brand small { color: rgba(255,255,255,.68); }
.footer-brand p { max-width: 35ch; }
.site-footer h2 { margin: .25rem 0 1rem; color: #fff; font-size: .82rem; letter-spacing: .07em; text-transform: uppercase; }
.footer-links { margin: 0; padding: 0; list-style: none; }
.footer-links li + li { margin-top: .45rem; }
.site-footer a, .site-footer a:visited { color: rgba(255,255,255,.82); text-decoration: none; }
.site-footer a:hover { color: #fff; text-decoration: underline; }
.footer-section-continuation h2 { visibility: hidden; }
.machine-links { display: grid; gap: .45rem; }
.footer-bottom { border-top: 1px solid rgba(255,255,255,.16); }
.footer-bottom .container { padding-top: 1rem; padding-bottom: 1rem; }

@media (max-width: 1100px) {
  .news-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .news-card-featured { grid-column: span 2; grid-row: span 1; }
  .news-card-featured img { aspect-ratio: 16 / 9; flex: 0 0 auto; min-height: 0; }
  .section-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 1080px) {
  .primary-nav { display: none; }
  .nav-drawer { display: block; }
  .nav-drawer summary { position: relative; padding: .5rem .85rem .5rem 2.35rem; border: 1px solid var(--line); border-radius: 999px; color: var(--navy-800); cursor: pointer; font-size: .9rem; font-weight: 600; list-style: none; }
  .nav-drawer summary::-webkit-details-marker { display: none; }
  .nav-drawer summary::before { content: ""; position: absolute; left: .85rem; top: 50%; width: 15px; height: 2px; margin-top: -1px; background: var(--navy-800); box-shadow: 0 -5px 0 var(--navy-800), 0 5px 0 var(--navy-800); }
  .nav-drawer nav { position: absolute; z-index: 50; top: calc(100% + .75rem); right: 0; display: grid; min-width: 280px; max-height: 70vh; overflow: auto; padding: .5rem; background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow); }
  .nav-drawer .nav-link { min-height: 0; padding: .55rem .75rem; border-bottom: 0; border-left: 3px solid transparent; }
  .nav-drawer .nav-link:hover, .nav-drawer .nav-link[aria-current="page"] { border-left-color: var(--ice); background: var(--ice-soft); }
  .ai-band-grid { grid-template-columns: 1fr; gap: 2.5rem; }
  .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 960px) {
  .layout-sidebar { grid-template-columns: 1fr; gap: 2.25rem; }
  .side-nav { position: static; }
  .side-entry-list { max-height: 22rem; }
}

@media (max-width: 600px) {
  .index-table { display: block; }
  .index-table thead { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); }
  .index-table tbody { display: grid; gap: 1rem; }
  .index-table tbody tr { display: block; min-width: 0; border: 1px solid var(--line); border-radius: 8px; padding: .4rem .75rem; }
  .index-table tbody td { display: grid; grid-template-columns: 5.5rem minmax(0, 1fr); gap: .5rem; padding: .5rem 0; white-space: normal; overflow-wrap: anywhere; }
  .index-table tbody td:last-child { border-bottom: 0; }
  .index-cell-label { display: block; color: var(--muted); font-weight: 600; }
  .index-cell-value { min-width: 0; }
  .container { padding-left: 1rem; padding-right: 1rem; }
  .utility-bar { font-size: .68rem; }
  .utility-bar .container > span { display: none; }
  .utility-bar .container { justify-content: flex-end; }
  .header-inner { min-height: 68px; gap: 1rem; }
  .brand svg { width: 30px; height: 30px; }
  .nav-drawer nav { position: fixed; top: 102px; left: 1rem; right: 1rem; min-width: 0; }
  .hero { min-height: 420px; height: 62vh; }
  .hero-content { padding-bottom: 4rem; }
  .start-here-wrap { margin-top: 0; padding-top: 1rem; }
  .start-here { max-width: none; padding: 1.35rem; }
  .home-section { padding-top: 3.5rem; }
  .news-grid, .section-grid { grid-template-columns: 1fr; }
  .news-card-featured { grid-column: span 1; }
  .news-card-featured h3 { font-size: 1.3rem; }
  .sections { padding-bottom: 3.5rem; }
  .page-header { padding: 1.75rem 0 2rem; }
  .layout-sidebar { padding-top: 2rem; padding-bottom: 3rem; }
  .document-content { padding: 1.25rem; }
  .pager { flex-direction: column; }
  .pager span:last-child { margin-left: 0; text-align: left; }
  .footer-grid { grid-template-columns: 1fr; gap: 1.75rem; }
  .footer-section-continuation h2 { display: none; }
}

@media print {
  .utility-bar, .site-header, .skip-link, .site-footer, .pager, .hero, .side-nav, .ai-band { display: none !important; }
  .page-header, .page-header-company { padding: 0 0 1rem; background: #fff !important; color: var(--ink); }
  .page-header h1, .page-header .section-lede, .page-header .page-count, .metadata dt, .metadata dd { color: var(--ink); }
  .page-header .breadcrumb { display: none; }
  .metadata { border-top-color: var(--line); }
  .layout-sidebar { display: block; padding: 0; }
  .document-content { border: 0; padding: 0; }
}