/* Omnitechnicus v2.1: approved wordmark and supplied abstract artwork. */
:root {
  --wordmark-color: #e5b33f;
  --wordmark-file: url("/assets/images/brand/faceted-slant-wordmark.png");
  --font-display: "Avenir Next", "Segoe UI Variable Display", "Segoe UI", ui-sans-serif, sans-serif;
}
body { isolation: isolate; }
h1, h2, h3 { font-weight: 750; letter-spacing: -.028em; }
.brand { gap: 11px; min-height: 44px; }
.brand-wordmark {
  display: inline-block;
  flex: none;
  width: clamp(150px, 15.4vw, 196px);
  aspect-ratio: 1477/118;
  background-color: var(--wordmark-color);
  -webkit-mask: var(--wordmark-file) center/contain no-repeat;
  mask: var(--wordmark-file) center/contain no-repeat;
  vertical-align: middle;
}
.site-header { background: rgba(7, 15, 35, .91); border-bottom-color: var(--line); backdrop-filter: blur(18px); }
.site-header.scrolled { background: rgba(7, 15, 35, .96); }
.site-footer .brand-wordmark { width: clamp(168px, 17vw, 224px); }
.site-backdrop { z-index: -1; background: var(--bg); }
.site-backdrop::before {
  opacity: .52;
  background-image: url("/assets/images/brand/mirrored-crescent-1920.webp");
  background-size: cover;
  background-position: left center;
  mask-image: none;
  -webkit-mask-image: none;
  filter: brightness(.38) saturate(.9);
}
.site-backdrop span { display: none; }
.section-alt { background: linear-gradient(180deg, rgba(9, 18, 39, .72), rgba(9, 18, 39, .9)); }

/* Full-color blue introductions give the two themes a common brand anchor. */
.hero, .page-hero {
  --hero-art: url("/assets/images/brand/signature-ribbon-1920.webp");
  --text: #f4f7ff;
  --muted: #e0e9fc;
  --blue: #9fc3ff;
  --blue-bright: #c6d9ff;
  --gold: #e5b33f;
  --line: rgba(204, 221, 255, .28);
  --line-strong: rgba(204, 221, 255, .5);
  isolation: isolate;
  overflow: hidden;
  color: #f4f7ff;
  background: #07328e;
  border-bottom: 1px solid rgba(229, 179, 63, .25);
}
.home-page .hero { --hero-art: url("/assets/images/brand/crescent-arc-1920.webp"); }
.technology-page .page-hero { --hero-art: url("/assets/images/brand/horizon-flow-1920.webp"); }
.hero::before, .page-hero::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background-image: linear-gradient(90deg, rgba(3, 18, 54, .86) 0%, rgba(4, 23, 67, .84) 68%, rgba(4, 23, 67, .28) 100%), var(--hero-art);
  background-size: cover;
  background-position: center, right center;
  pointer-events: none;
}
.technology-page .page-hero::before { background-position: center, center bottom; }
.technology-hero .technology-brand-strip { background: rgba(4, 21, 58, .86); padding-inline: 18px; }
.hero h1, .page-hero h1 { color: #f4f7ff; }
.hero .hero-lead, .page-hero p { color: #e0e9fc; }
.hero .eyebrow, .page-hero .eyebrow { color: #d5e4ff; }
.hero .text-link, .page-hero .text-link,
[data-theme="light"] .hero .text-link, [data-theme="light"] .page-hero .text-link { color: #dce8ff; }
.hero .gradient-text, .page-hero .gradient-text,
[data-theme="light"] .hero .gradient-text, [data-theme="light"] .page-hero .gradient-text {
  color: transparent;
  background: linear-gradient(115deg, #fff0c9, #edc36b 62%, #e5b33f);
  background-clip: text;
  -webkit-background-clip: text;
}
.hero .trust-strip, [data-theme="light"] .hero .trust-strip { color: #e0e9fc; }
.hero .trust-strip span::before { background: #e5b33f; }
.hero .status-dot { background: #e5b33f; box-shadow: 0 0 15px rgba(229, 179, 63, .5); }
.hero .button-primary, .page-hero .button-primary, .final-cta .button-primary {
  color: #111c32;
  background: linear-gradient(120deg, #ffeac0, #e5b33f);
  border-color: #e5b33f;
  box-shadow: 0 10px 34px rgba(5, 15, 41, .2);
}
.hero .button-secondary, .page-hero .button-secondary,
[data-theme="light"] .hero .button-secondary, [data-theme="light"] .page-hero .button-secondary {
  color: #f4f7ff;
  background: rgba(8, 25, 65, .65);
  border-color: rgba(222, 234, 255, .6);
}
.hero .button-secondary:hover, .page-hero .button-secondary:hover { background: rgba(18, 47, 106, .82); }
.hero .core-mark, [data-theme="light"] .hero .core-mark {
  border-color: rgba(229, 179, 63, .48);
  background: radial-gradient(circle at 50% 44%, rgba(37, 83, 170, .5), rgba(5, 20, 53, .94) 70%);
}
.core-mark .brand-wordmark { --wordmark-color: #e5b33f; width: 190px; margin-top: 3px; }
.hero .signal-card, [data-theme="light"] .hero .signal-card { color: #f4f7ff; background: rgba(6, 22, 57, .87); border-color: rgba(204, 221, 255, .3); }
.hero .signal-card span { color: #c6d9ff; }

/* Quieter material behind long reading sections; artwork remains visible at the edges. */
.site-footer {
  background-image: linear-gradient(90deg, rgba(6, 16, 38, .94), rgba(6, 16, 38, .91)), url("/assets/images/brand/mirrored-ribbon-1920.webp");
  background-size: cover;
  background-position: center bottom;
}
.final-cta .container, [data-theme="light"] .final-cta .container {
  --text: #f4f7ff;
  --muted: #e0e9fc;
  --gold: #e5b33f;
  color: #f4f7ff;
  border-color: rgba(229, 179, 63, .42);
  background-image: linear-gradient(rgba(5, 23, 65, .76), rgba(5, 23, 65, .8)), url("/assets/images/brand/horizon-flow-1920.webp");
  background-size: cover;
  background-position: center bottom;
}
.final-cta h2 { color: #f4f7ff; }
.final-cta p { color: #e0e9fc; }
.final-cta .button-secondary, [data-theme="light"] .final-cta .button-secondary { color: #f4f7ff; background: rgba(8, 25, 65, .65); border-color: rgba(222, 234, 255, .6); }

[data-theme="light"] {
  --bg: #f2f6fc;
  --muted: #3f5068;
  --blue: #164aa5;
  --blue-bright: #164aa5;
  --gold: #6e470b;
  --wordmark-color: #12459f;
}
[data-theme="light"] .site-header { background: rgba(246, 249, 255, .94); }
[data-theme="light"] .site-header.scrolled { background: rgba(246, 249, 255, .98); }
[data-theme="light"] .site-backdrop { background: #f2f6fc; }
[data-theme="light"] .site-backdrop::before { opacity: .2; filter: saturate(.85); background-image: url("/assets/images/brand/mirrored-crescent-1920.webp"); }
[data-theme="light"] .section-alt { background: linear-gradient(180deg, rgba(235, 242, 252, .75), rgba(246, 249, 255, .86)); }
[data-theme="light"] .site-footer {
  background-image: linear-gradient(90deg, rgba(239, 245, 253, .95), rgba(239, 245, 253, .9)), url("/assets/images/brand/mirrored-ribbon-1920.webp");
}

@media (max-width: 900px) {
  .site-backdrop::before, [data-theme="light"] .site-backdrop::before { background-image: url("/assets/images/brand/mirrored-crescent-960.webp"); }
  .hero, .page-hero { --hero-art: url("/assets/images/brand/signature-ribbon-960.webp"); }
  .home-page .hero { --hero-art: url("/assets/images/brand/crescent-arc-960.webp"); }
  .technology-page .page-hero { --hero-art: url("/assets/images/brand/horizon-flow-960.webp"); }
  .hero::before, .page-hero::before {
    background-image: linear-gradient(90deg, rgba(3, 18, 54, .88), rgba(4, 23, 67, .84)), var(--hero-art);
    background-position: center, 72% center;
  }
  .site-footer, [data-theme="light"] .site-footer { background-image: linear-gradient(90deg, rgba(6, 16, 38, .94), rgba(6, 16, 38, .91)), url("/assets/images/brand/mirrored-ribbon-960.webp"); }
  [data-theme="light"] .site-footer { background-image: linear-gradient(90deg, rgba(239, 245, 253, .95), rgba(239, 245, 253, .9)), url("/assets/images/brand/mirrored-ribbon-960.webp"); }
  .final-cta .container, [data-theme="light"] .final-cta .container { background-image: linear-gradient(rgba(5, 23, 65, .76), rgba(5, 23, 65, .8)), url("/assets/images/brand/horizon-flow-960.webp"); }
}
@media (max-width: 460px) {
  .brand { gap: 9px; }
  .brand-wordmark { width: 158px; }
  .core-mark .brand-wordmark { width: 145px; }
  .site-footer .brand-wordmark { width: 190px; }
}
@media (prefers-reduced-motion: reduce) { .site-backdrop::before { animation: none; } }
