/* Shared interface layer. Emblem styling remains in its approved assets. */
:root {
  --ui-width: 1200px;
  --ui-gutter: clamp(20px, 5vw, 64px);
  --ui-section: 80px;
  --ui-border: #a6bddb2b;
  --ui-muted: #c4cfdf;
}
html { scroll-padding-top: 112px; }
.ui-rebuild { font-family: Archivo, Arial, sans-serif; }
.ui-rebuild button, .ui-rebuild input, .ui-rebuild textarea, .ui-rebuild select { font-family: inherit; }
.ui-rebuild :is(h1, h2, h3, p, a, li) { overflow-wrap: break-word; }
.ui-rebuild :is(a, button, input, textarea, select):focus-visible { outline: 2px solid #b4ceff; outline-offset: 5px; }
.ui-rebuild :is(section, article)[id] { scroll-margin-top: 0; }
body.ui-rebuild #main .eyebrow { margin: 0 0 15px; color: #9fbdf6; font: 500 12px/1.5 Archivo, Arial, sans-serif; letter-spacing: .1em; text-transform: uppercase; }
body.ui-rebuild #main .content-meta { color: var(--ui-muted); font: 400 13px/1.6 Archivo, Arial, sans-serif; letter-spacing: 0; text-transform: none; }
body.ui-rebuild #main .button {
  display: inline-flex; align-items: center; justify-content: space-between;
  min-height: 48px; padding: 13px 20px; gap: 22px; border-radius: 4px;
  font: 500 14px/1.5 Archivo, Arial, sans-serif; letter-spacing: 0; text-transform: none;
  box-shadow: none; transform: none; text-decoration: none;
  transition: color .18s ease, background-color .18s ease, border-color .18s ease;
}
body.ui-rebuild #main .button-primary { background: #e8efff; color: #0b1427; border: 1px solid #e8efff; }
body.ui-rebuild #main .button-primary:hover { background: #bfd3ff; border-color: #bfd3ff; }
body.ui-rebuild #main .button-ghost { color: #e2ebfb; background: #0b152333; border: 1px solid #a2bbdf66; }
body.ui-rebuild #main .button-ghost:hover { background: #8db7ff14; border-color: #b3cbf4; }
body.ui-rebuild #main .button:disabled { opacity: .65; cursor: wait; }
.ui-rebuild .text-link { display: inline-flex; align-items: center; gap: 14px; min-height: 44px; padding-block: 8px; color: #bed2fc; font-size: 14px; font-weight: 500; line-height: 1.55; border: 0; }
.ui-rebuild .text-link:hover { color: #fff; text-decoration: underline; text-decoration-color: #92b5f0; text-underline-offset: 5px; }
.ui-rebuild .text-link span { flex-shrink: 0; }
.ui-rebuild .footer-links a[aria-current="page"] { color: #f0f5ff; text-decoration: underline; text-decoration-color: #92b5f0; text-underline-offset: 5px; }
.ui-rebuild .site-header, .ui-rebuild .site-header.is-scrolled {
  position: fixed; inset: 0 0 auto; height: 86px;
  padding: 0 max(var(--ui-gutter), calc((100% - var(--ui-width)) / 2));
  display: flex; flex-wrap: nowrap; align-items: center; gap: 28px;
  background: #070d18c7; border-bottom: 1px solid var(--ui-border); backdrop-filter: blur(16px);
}
.ui-rebuild .brand { gap: 14px; margin-right: auto; }
.ui-rebuild .brand-name { font-size: 11px; line-height: 1.2; }
.ui-rebuild .site-nav { position: static; display: flex; align-items: center; flex-direction: row; gap: clamp(16px,1.8vw,26px); width: auto; padding: 0; background: none; border: 0; backdrop-filter: none; }
html.js .ui-rebuild .site-nav { overflow: visible; max-height: none; }
.ui-rebuild .site-nav > a, .ui-rebuild .site-nav > a:last-child,
.ui-rebuild .site-nav .courses-toggle { min-height: 44px; padding: 12px 0; color: #b9c5d9; border: 0; background: transparent; font-size: 13px; line-height: 1.5; white-space: nowrap; }
.ui-rebuild .site-nav > a:hover, .ui-rebuild .site-nav > a[aria-current],
.ui-rebuild .site-nav .courses-toggle:hover, .ui-rebuild .site-nav .courses-toggle.is-current { color: #fff; }
.ui-rebuild .site-nav > a::after { bottom: 3px; }
.ui-rebuild .site-nav .courses-toggle.is-current { box-shadow: inset 0 -1px #92b8ff; }
.ui-rebuild .nav-courses { position: relative; }
.ui-rebuild .courses-menu { position: absolute; top: calc(100% + 12px); left: -18px; width: 280px; min-width: 0; padding: 8px; border: 1px solid #9fbce14d; border-radius: 5px; background: #0b1424; box-shadow: 0 14px 36px #0005; }
.ui-rebuild .site-nav .courses-menu a, .ui-rebuild .site-nav .courses-menu a:last-child { display: block; min-height: 48px; padding: 13px 12px; border: 0; border-radius: 2px; color: #d1def3; font-size: 14px; white-space: normal; }
.ui-rebuild .site-nav .courses-menu a:hover, .ui-rebuild .site-nav .courses-menu a[aria-current] { color: #fff; background: #99bfff14; }
.ui-rebuild .site-nav .courses-menu a::after { display: none; }
.ui-rebuild .menu-toggle { display: none; }
.ui-rebuild .site-footer {
  width: min(var(--ui-width), calc(100% - var(--ui-gutter) * 2)); margin-inline: auto;
  padding: 48px 0 28px; border-top: 1px solid var(--ui-border); background: transparent;
  display: grid; grid-template-columns: 1.2fr 1fr .6fr; gap: 32px;
}
.ui-rebuild .site-footer p { max-width: 34ch; margin-top: 18px; color: var(--ui-muted); font-size: 14px; line-height: 1.7; }
.ui-rebuild .footer-links { display: grid; grid-template-columns: 1fr 1fr; align-content: start; gap: 3px 24px; }
.ui-rebuild .footer-links a, .ui-rebuild .footer-social a { display: block; padding-block: 9px; color: #b8c6dd; font: 400 13px/1.6 Archivo,Arial,sans-serif; min-height: 40px; }
.ui-rebuild .footer-links a:hover, .ui-rebuild .footer-social a:hover { color: #fff; text-decoration: underline; }
.ui-rebuild .site-footer small { border-top: 1px solid var(--ui-border); padding-top: 22px; margin: 8px 0 0; font: 400 12px/1.6 Archivo,Arial,sans-serif; color: #99abc5; }
@media (max-width: 1023px) {
  .ui-rebuild .site-header, .ui-rebuild .site-header.is-scrolled { height: 80px; gap: 16px; }
  .ui-rebuild .menu-toggle { display: flex; align-items: center; justify-content: center; gap: 10px; min-width: 64px; min-height: 44px; padding: 8px 0; background: transparent; color: #e0e9fa; font: 500 14px/1.5 Archivo,Arial,sans-serif; text-transform: none; letter-spacing: 0; }
  .ui-rebuild .site-nav { display: none; position: absolute; top: 100%; left: 0; right: 0; width: 100%; flex-direction: column; align-items: stretch; gap: 0; padding: 12px var(--ui-gutter) 24px; background: #080f1a; border-bottom: 1px solid var(--ui-border); backdrop-filter: blur(20px); }
  html.js .ui-rebuild .site-nav { max-height: calc(100dvh - 80px); overflow-y: auto; overscroll-behavior: contain; }
  .ui-rebuild .site-nav.open { display: flex; }
  .ui-rebuild .site-nav > a, .ui-rebuild .site-nav > a:last-child, .ui-rebuild .site-nav .courses-toggle { display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 15px 0; min-height: 57px; border-bottom: 1px solid var(--ui-border); font-size: 17px; white-space: normal; }
  .ui-rebuild .site-nav > a::after { display: none; }
  .ui-rebuild .site-nav > a[aria-current], .ui-rebuild .site-nav .courses-toggle.is-current { color: #a9c6ff; box-shadow: none; }
  .ui-rebuild .courses-menu { position: static; width: 100%; max-width: none; margin: 0; padding: 4px 0 10px 14px; border: 0; border-bottom: 1px solid var(--ui-border); border-radius: 0; background: transparent; box-shadow: none; }
  .ui-rebuild .site-nav .courses-menu a, .ui-rebuild .site-nav .courses-menu a:last-child { font-size: 15px; padding: 13px 0; }
  .ui-rebuild .site-footer { grid-template-columns: 1fr 1fr; }
  .ui-rebuild .site-footer > div:first-child { grid-column: 1 / -1; }
}
@media (max-width: 699px) {
  :root { --ui-section: 48px; }
  .ui-rebuild .site-header, .ui-rebuild .site-header.is-scrolled { height: 76px; }
  html.js .ui-rebuild .site-nav { max-height: calc(100dvh - 76px); }
  .ui-rebuild .brand { gap: 10px; }
  .ui-rebuild .brand-name { font-size: 10px; }
  .ui-rebuild .site-footer { grid-template-columns: 1fr; gap: 28px; padding-top: 36px; }
  .ui-rebuild .footer-social { display: flex; gap: 24px; flex-wrap: wrap; }
  .ui-rebuild .site-footer small { margin-top: 0; }
}
html:not(.js) .ui-rebuild .site-header { position: relative; height: auto; flex-wrap: wrap; padding-block: 16px; }
html:not(.js) .ui-rebuild .site-nav { display: flex; flex: 1 0 100%; position: static; flex-direction: row; flex-wrap: wrap; width: 100%; padding: 0; gap: 8px 20px; background: none; border: 0; }
html:not(.js) .ui-rebuild .site-nav > a { width: auto; font-size: 14px; border: 0; }
html:not(.js) .ui-rebuild .menu-toggle { display: none; }
html:not(.js) .ui-rebuild.home-page .signal-hero { padding-top: 48px; }
@media (prefers-reduced-motion: reduce) { .ui-rebuild .button { transition: none; } }

/* Keep the continuous network visible, with a quiet surface beneath reading copy.
   The feather sits outside each text block, so it adds no layout or hard panels. */
body.ui-rebuild:not(.home-page) #world-stage::after {
  background: linear-gradient(90deg, #05070cb8 0%, #05070c66 28%, #05070c59 72%, #05070c0d 100%),
    linear-gradient(0deg, #05070c9c, transparent 45%);
}
body.ui-rebuild #main :is(.work-body, .reading-section, .profile-copy, .detail-block,
  .service-body, .feature-copy, .course-body, .contact-context,
  .home-course, .writing-summary, .home-talk-content, .person-copy) {
  position: relative;
  isolation: isolate;
  --reading-feather: 24px;
  --reading-shade: #05070cb3;
}
body.ui-rebuild.home-page #main :is(.home-course, .writing-summary, .home-talk-content, .person-copy) {
  --reading-shade: #05070c94;
}
body.ui-rebuild #main :is(.work-body, .reading-section, .profile-copy, .detail-block,
  .service-body, .feature-copy, .course-body, .contact-context,
  .home-course, .writing-summary, .home-talk-content, .person-copy)::before {
  content: '';
  position: absolute;
  z-index: -1;
  inset: calc(-1 * var(--reading-feather));
  pointer-events: none;
  background: linear-gradient(90deg, transparent, var(--reading-shade) var(--reading-feather),
    var(--reading-shade) calc(100% - var(--reading-feather)), transparent);
  mask-image: linear-gradient(transparent, #000 var(--reading-feather),
    #000 calc(100% - var(--reading-feather)), transparent);
}
@media (max-width: 699px) {
  body.ui-rebuild:not(.home-page) #world-stage::after {
    background: linear-gradient(90deg, #05070c66, #05070c70 50%, #05070c4d),
      linear-gradient(0deg, #05070c80, transparent 45%);
  }
  body.ui-rebuild #main :is(.work-body, .reading-section, .profile-copy, .detail-block,
    .service-body, .feature-copy, .course-body, .contact-context,
    .home-course, .writing-summary, .home-talk-content, .person-copy) {
    --reading-feather: 16px;
  }
}