/* Synodic-AI site chrome v1: shared teal header, current-page indicator,
   footer row and desk glass cards. Loaded after bundle.css on every page.
   Versioned filename: /assets/* is served immutable, so edits ship as v2. */

/* ---- Header: teal band, Hero C logo sizing inline with the menu ---- */
.syn-band { background: radial-gradient(ellipse 75% 320% at 50% 0%, rgba(15,163,173,.55), transparent 78%),
  radial-gradient(ellipse 50% 260% at 82% 100%, rgba(39,173,125,.24), transparent 74%),
  linear-gradient(180deg, rgba(7,12,22,.90), rgba(7,12,22,.84)); }
.syn-band-inner { flex-wrap: nowrap; align-items: center; }
.syn-band .syn-home-link { gap: 15px; align-items: center; flex: none; }
.syn-band .syn-mark { width: 47.5px; height: 47.5px; }
.syn-band .syn-wordmark { font-size: 26.25px; }
.syn-band .syn-desk-tag { color: #b8c4d2; }
.syn-band nav { flex-wrap: nowrap; gap: 12px; }
.syn-band nav a { padding: 4px 4px; white-space: nowrap; position: relative; color: #dde4ea; text-decoration: none; }
.syn-band nav a:hover { color: #ffffff; }
.syn-band .syn-wm-q { color: #b8c4d2; }
.syn-band .syn-sep { color: rgba(246,241,233,.5); }

/* ---- Current page: white text + 2px aqua bar under the link ---- */
.syn-band nav a[aria-current="page"] { color: #ffffff; font-weight: 700; text-shadow: 0 1px 6px rgba(4,7,14,.9); }
.syn-band nav a[aria-current="page"]::after { content: ""; position: absolute; left: 4px; right: 4px; bottom: -4px; height: 2px;
  border-radius: 1px; background: #45c2e0; box-shadow: 0 0 10px rgba(69,194,224,.55); }

@media (max-width: 1240px) {
  .syn-band nav { gap: 8px; }
  .syn-band nav a { font-size: 12px; letter-spacing: .06em; padding: 4px 2px; }
  .syn-band nav a[aria-current="page"]::after { left: 2px; right: 2px; }
}
@media (max-width: 1060px) {
  .syn-band nav a { font-size: 10.5px; letter-spacing: .04em; }
  .syn-band .syn-sep { font-size: 11px; }
}
@media (max-width: 1000px) and (min-width: 681px) {
  .syn-band-inner { flex-wrap: wrap; }
  .syn-band nav { flex-wrap: wrap; margin-left: 0; width: 100%; }
  .syn-band nav a { font-size: 12px; }
}
@media (max-width: 680px) {
  .syn-band { background: radial-gradient(ellipse 95% 320% at 50% 0%, rgba(15,163,173,.55), transparent 78%),
    radial-gradient(ellipse 70% 260% at 82% 100%, rgba(39,173,125,.24), transparent 74%), var(--navy-900); }
  .syn-band .syn-mark { width: 40px; height: 40px; }
  .syn-band .syn-wordmark { font-size: 22.5px; }
  .syn-band-inner { flex-wrap: wrap; }
  .syn-band nav { flex-wrap: wrap; margin-left: 0; width: 100%; gap: 8px 16px; }
  .syn-band nav .syn-sep { display: none; }
  .syn-band nav a { font-size: 11px; letter-spacing: .05em; padding: 5px 2px; }
  .syn-band nav a[aria-current="page"]::after { left: 2px; right: 2px; bottom: -2px; }
}

/* ---- Desk pages: dark navy with a committed royal/lagoon wash, glass cards ---- */
body.syn-desk, body.syn-wash { background-color: var(--navy-950);
  background-image: radial-gradient(ellipse 60% 45% at 85% 8%, rgba(76,110,245,.22), transparent 70%),
    radial-gradient(ellipse 55% 50% at 8% 60%, rgba(15,163,173,.18), transparent 72%),
    radial-gradient(ellipse 50% 40% at 90% 95%, rgba(39,173,125,.14), transparent 72%);
  background-attachment: fixed; }
body.syn-desk .feed-item, body.syn-desk .item, body.syn-desk .footer {
  background: var(--surface-glass, rgba(16,23,38,.55));
  -webkit-backdrop-filter: blur(24px) saturate(1.4); backdrop-filter: blur(24px) saturate(1.4);
  border: 1px solid var(--well-border, rgba(157,177,255,.18));
  box-shadow: var(--glass-highlight), 0 10px 30px -8px rgba(0,0,0,.55); }
body.syn-desk .feed-item:hover, body.syn-desk .item:hover { border-color: var(--border-opal, rgba(110,180,240,.38));
  box-shadow: var(--glass-highlight), 0 16px 44px -10px rgba(0,0,0,.6), var(--glow-opal); }
body.syn-desk .why { background: rgba(11,17,30,.62); }