/* TEST THEME "H, the drawing" (owner, 2026-11-04): a light, blue-drawing
   restyle laid over the current pages. Loaded after each page's own styles,
   so these rules win. Pale blue paper, navy ink, no glow, no gradients, no
   monospace labels; the hero and the contact bands are navy "drawing"
   panels. Fonts are served from /fonts/ as always. */

@font-face {
    font-family: 'Instrument Sans';
    font-style: normal;
    font-weight: 400 700;
    font-display: swap;
    src: url('/fonts/InstrumentSans-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
    font-family: 'Instrument Sans';
    font-style: normal;
    font-weight: 400 700;
    font-display: swap;
    src: url('/fonts/InstrumentSans-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
    --paper:   #edf1f5;
    --paper-2: #e3e9f0;
    --navy:    #10264a;
    --mid:     #3a5a8c;
    --mute:    #4f5f78;
    --line-h:  #b9c6d6;

    /* the pages' own variables, remapped */
    --ink:       var(--navy);
    --ink-soft:  #243b60;
    --slate:     var(--mute);
    --bg:        var(--paper);
    --bg-soft:   #f6f8fb;
    --bg-mute:   var(--paper-2);
    --line:      var(--line-h);
    --cyan:      var(--navy);
    --cyan-soft: var(--paper-2);
    --teal:      var(--mid);
    --blue:      var(--mid);
}

html, body { background: var(--paper); }
body { font-family: 'Instrument Sans', system-ui, sans-serif; color: var(--navy); }
html .font-extrabold { font-weight: 500; letter-spacing: -.025em; }
html .font-bold { font-weight: 600; }
html .font-semibold { font-weight: 600; }

/* ---- Tailwind colour utilities used by the pages ---- */
html .text-\[\#e6edf6\], html .text-white, html .hover\:text-white:hover, html .hover\:text-slate-300:hover { color: var(--navy); }
html .text-slate-300, html .text-slate-400 { color: var(--mute); }
html .text-slate-500, html .text-slate-600, html .text-slate-700 { color: #8290a6; }
html .text-\[\#2dd4bf\], html .text-\[\#22d3ee\], html .hover\:text-\[\#22d3ee\]:hover { color: var(--mid); }
html .border-white\/10, html .border-white\/20 { border-color: var(--line-h); }
html .bg-white\/15 { background-color: rgba(16,38,74,.2); }
html .bg-\[\#070c15\], html .bg-\[\#070c15\]\/95, html .bg-\[\#0b1220\] { background-color: #f6f8fb; }
html .bg-\[\#22d3ee\] { background-color: var(--navy); }
html .text-\[\#04060b\] { color: #fff; }
html .bg-\[\#22d3ee\]\/10 { background-color: rgba(16,38,74,.06); }
html .border-\[\#22d3ee\] { border-color: var(--navy); }
html .hover\:bg-cyan-400\/10:hover { background-color: rgba(16,38,74,.06); }
html .from-\[\#22d3ee\] { --tw-gradient-from: var(--navy) var(--tw-gradient-from-position); --tw-gradient-to: rgba(16,38,74,0) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
html .to-\[\#2dd4bf\], html .to-\[\#22d3ee\] { --tw-gradient-to: var(--mid) var(--tw-gradient-to-position); }
html .shadow-xl, html .shadow-2xl { box-shadow: none; }
html .blur, html .blur-2xl, html .blur-3xl, html .blur-\[140px\], html .blur-\[150px\] { display: none; }
html .decoration-\[\#2dd4bf\] { text-decoration-color: var(--mid); }
html .bg-emerald-400\/10 { background-color: rgba(16,38,74,.06); }

/* ---- Navigation ---- */
.glass-nav { background: rgba(237,241,245,.94); backdrop-filter: none; -webkit-backdrop-filter: none; border-bottom: 1px solid var(--navy); }
.nav-link { font-family: inherit; font-size: .9rem; letter-spacing: 0; text-transform: none; color: var(--navy); font-weight: 500; }
.nav-link:hover { color: var(--mid); }
.nav-link::after { background: var(--navy); height: 1px; bottom: -3px; }
.nav-item .dropdown { background: #fff; border: 1px solid var(--navy); box-shadow: 0 16px 36px -22px rgba(16,38,74,.45); }
.dropdown a { color: var(--navy); }
.dropdown a:hover { background: var(--paper); color: var(--mid); }
.lang-link { border-color: var(--navy); }
.nav-item:hover .lang-link, .nav-item:focus-within .lang-link { border-color: var(--mid); }
.mobile-menu { background: var(--paper) !important; border-bottom: 1px solid var(--navy) !important; color: var(--navy); }
.m-access .m-access-list a { color: var(--mute); }
.m-access .m-access-list a:hover { color: var(--navy); }

/* ---- Buttons ---- */
.btn-ink { background: var(--navy); color: #fff; box-shadow: none; }
.btn-ink:hover { background: var(--mid); filter: none; box-shadow: none; transform: none; }
.btn-breathe { animation: none; }
.btn-cyan { border: 1px solid var(--navy); color: var(--navy); font-family: inherit; font-size: .9rem; letter-spacing: 0; text-transform: none; font-weight: 500; }
.btn-cyan:hover { background: var(--navy); color: #fff; box-shadow: none; transform: none; }
.btn-outline { border: 1px solid var(--navy); color: var(--navy); }
.btn-outline:hover { border-color: var(--mid); color: var(--mid); transform: none; }

/* ---- Hero: the drawing ---- */
.hero-canvas { background: var(--paper); }
.grid-bg, .skyline-bg { display: none; }
.text-gradient { color: inherit; text-shadow: none; padding: 0; }
.eyebrow { font-family: inherit; font-size: .8rem; letter-spacing: .02em; text-transform: none; font-weight: 500; color: var(--mute); background: transparent; border: 0; padding: 0; }
.eyebrow .dot { background: var(--navy); box-shadow: none; width: 6px; height: 6px; }

#top.hero-canvas { background: var(--navy); color: #fff; padding-top: 7.5rem; padding-bottom: 0; }
#top .h-draw { position: absolute; inset: 0; pointer-events: none; }
#top .h-draw img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 60% 40%; transform: scale(1.45); transform-origin: 50% 30%; filter: grayscale(1) contrast(1.6) brightness(1.05); mix-blend-mode: screen; opacity: .8; }
#top .h-draw::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(16,38,74,.94) 0%, rgba(16,38,74,.82) 45%, rgba(16,38,74,.2) 100%); }
#top .text-\[\#e6edf6\], #top .text-slate-400, #top strong, #top h1 { color: #fff; }
#top .text-slate-400 { color: rgba(255,255,255,.78); }
#top .text-\[\#2dd4bf\] { color: #fff; }
#top .bg-white\/15 { background-color: rgba(255,255,255,.3); }
#top .btn-ink { background: #fff; color: var(--navy); }
#top .btn-ink:hover { background: var(--paper-2); }
#top .btn-outline { border-color: rgba(255,255,255,.7); color: #fff; }
#top .btn-outline:hover { border-color: #fff; }
#top .news-flash { background: transparent; color: #fff; border: 1px solid rgba(255,255,255,.6); box-shadow: none; animation: none; font-weight: 500; }
#top .news-flash::after { display: none; }
#top .news-flash .nf-tag { background: #fff; color: var(--navy); font-family: inherit; letter-spacing: .08em; }
#top .news-flash .nf-dot { background: var(--navy); animation: none; }
#top .nf-rotator > .news-flash.nf-enter { animation: nf-enter .6s cubic-bezier(.2,.9,.25,1.15) both; }
#top .nf-rotator > .news-flash.nf-leave { animation: nf-leave .4s cubic-bezier(.5,0,.75,0) both; }
#top .nf-rotator > .news-flash.nf-off { opacity: 0; visibility: hidden; }
#top .metric-chip { background: transparent; border: 1px solid rgba(255,255,255,.45); color: #fff; font-family: inherit; font-size: .9rem; letter-spacing: 0; text-transform: none; }
#top .metric-chip:hover { transform: none; box-shadow: none; border-color: #fff; }
#top .metric-icon { background: #fff !important; color: var(--navy); }
#top .metric-icon i { animation: none; }
#top .metric-icon::before { display: none; }
#top .pulse-dot { background: #fff; }
#top .pulse-dot::before { border-color: rgba(255,255,255,.5); }
#top .stage, #top .stage-dots { display: none; }
#top .lg\:col-span-5 { align-self: stretch; }
#top .h-anno { position: relative; min-height: 420px; }
#top .anno { position: absolute; color: #fff; font-size: .8rem; line-height: 1.4; letter-spacing: .01em; max-width: 15rem; }
#top .anno::before { content: ''; position: absolute; left: 0; bottom: 100%; width: 1px; height: 64px; background: rgba(255,255,255,.7); }
#top .anno b { display: block; font-weight: 600; }
#top .h-tb { position: absolute; right: 0; bottom: 0; background: #fff; color: var(--navy); border-left: 1px solid var(--navy); border-top: 1px solid var(--navy); display: grid; grid-template-columns: auto auto; font-size: .72rem; letter-spacing: .03em; }
#top .h-tb div { padding: .45rem .8rem; border-bottom: 1px solid var(--line-h); }
#top .h-tb div:nth-child(odd) { color: var(--mute); border-right: 1px solid var(--line-h); }
#top .h-tb div:nth-last-child(-n+2) { border-bottom: 0; }
#top > .max-w-7xl { padding-bottom: 6rem; }
@media (max-width: 1023px) {
    #top .h-anno { min-height: 0; margin-top: 2rem; }
    #top .anno { position: static; max-width: none; margin-top: 1.4rem; padding-left: 1rem; border-left: 1px solid rgba(255,255,255,.7); }
    #top .anno::before { display: none; }
    #top .h-tb { position: static; margin-top: 1.6rem; border: 1px solid var(--navy); width: fit-content; }
    #top > .max-w-7xl { padding-bottom: 3rem; }
}

/* ---- Sections and cards ---- */
.section-divider { border-top: 1px solid var(--line-h); }
.card, .soft-card, .pipe-node, .project, .person, .news-item, .contact-panel { background: #fff; border: 1px solid var(--line-h); }
.card:hover, .pipe-node:hover, .project:hover, .person:hover, .news-item:hover { transform: none; border-color: var(--navy); box-shadow: none; }
.pipe-icon { background: var(--paper); color: var(--navy); border-color: var(--line-h); }
.pipe-node.engine { background: var(--navy); color: #fff; border-color: var(--navy); }
.pipe-node.engine:hover { box-shadow: none; }
.pipe-node.engine .text-white, .pipe-node.engine .text-\[\#e6edf6\] { color: #fff; }
.pipe-node.engine .text-slate-300, .pipe-node.engine .text-slate-400 { color: rgba(255,255,255,.78); }
#product-api.card { background: #fff !important; border-color: var(--navy) !important; }
html .border-\[\#22d3ee\]\/30, html .border-\[\#2dd4bf\] { border-color: var(--navy); }
.pipe-icon.engine-icon { background: #fff; color: var(--navy); }
.pipe-arrow { color: var(--navy); }
.pipe-arrow .line { background: var(--navy); height: 1px; }
.pipe-arrow .line::after { display: none; }
.pipe-connector path, .pipe-connector-mobile path { stroke: var(--navy); stroke-dasharray: none; animation: none; }
.timeline::before { background: var(--navy); width: 1px; }
.timeline::after { display: none; }
.tl-dot { background: #fff; border: 1px solid var(--navy); box-shadow: none; width: 14px; height: 14px; }
.tl-dot.done { background: var(--navy); border-color: var(--navy); box-shadow: none; }
.tl-dot.testing { background: #fff; border-color: var(--navy); box-shadow: none; }
.tl-dot.future { background: #fff; border-color: var(--mid); box-shadow: none; }
.case-indicator { font-family: inherit; font-size: .85rem; letter-spacing: 0; text-transform: none; color: var(--mute); }
.case-indicator::after { background: var(--line-h); height: 1px; }
.case-indicator:hover { color: var(--navy); }
.case-indicator.is-active { color: var(--navy); }
.case-indicator.is-active::after { background: var(--navy); box-shadow: none; }
.slider-nav-btn { background: #fff; border-color: var(--navy); box-shadow: none; }
.slider-nav-btn:hover { border-color: var(--mid); box-shadow: none; transform: translateY(-50%); }
.future-card { background: var(--navy); color: #fff; border-radius: 0; border: 0; }
.future-card::before { display: none; }
.metric-chip { background: #fff; border-color: var(--line-h); font-family: inherit; font-size: .9rem; letter-spacing: 0; text-transform: none; color: var(--navy); }
.metric-chip:hover { transform: none; box-shadow: none; border-color: var(--navy); }
.metric-icon { background: var(--navy) !important; color: #fff; }
.metric-icon i { animation: none; }
.metric-icon::before { display: none; }
.soon-sup { color: var(--mid); }
.stage-label { font-family: inherit; letter-spacing: 0; text-transform: none; color: var(--navy); background: #fff; border-color: var(--navy); box-shadow: none; backdrop-filter: none; }
.phone { background: var(--navy); box-shadow: none; }
.phone-notch { background: var(--navy); }
.monitor-frame { background: var(--navy); box-shadow: none; }
.monitor-neck, .monitor-base { background: var(--navy); box-shadow: none; }
.aq-bar { box-shadow: none; }

/* ---- The navy bands (for cities, contact) ---- */
.contact-band { background: var(--navy); color: #fff; }
.contact-band .text-white, .contact-band .text-\[\#e6edf6\], .contact-band h2, .contact-band strong { color: #fff; }
.contact-band .text-slate-300, .contact-band .text-slate-400 { color: rgba(255,255,255,.78); }
.contact-band .hover\:text-\[\#22d3ee\]:hover, .contact-band .hover\:text-white:hover { color: #fff; }
.contact-band .eyebrow { color: rgba(255,255,255,.75); }
.contact-band .eyebrow .dot { background: #fff; }
.contact-band .btn-ink { background: #fff; color: var(--navy); }
.contact-band .btn-ink:hover { background: var(--paper-2); }
.contact-band .btn-cyan { border-color: #fff; color: #fff; }
.contact-band .btn-cyan:hover { background: #fff; color: var(--navy); }
.contact-band .border-white\/10 { border-color: rgba(255,255,255,.25); }
.cf-field { border: 1px solid rgba(255,255,255,.35); background: rgba(255,255,255,.06); color: #fff; border-radius: 0; }
.cf-field::placeholder { color: rgba(255,255,255,.4); }
.cf-field:focus { border-color: #fff; background: rgba(255,255,255,.1); }
#contact-form input:-webkit-autofill, #contact-form input:-webkit-autofill:focus { -webkit-box-shadow: 0 0 0 1000px var(--navy) inset; }
.contact-band .text-\[\#2dd4bf\], .contact-band .text-\[\#22d3ee\] { color: #fff; }

/* ---- Footer ---- */
footer.bg-\[\#04060b\] { background: var(--navy) !important; color: rgba(255,255,255,.8); border-top-color: var(--navy) !important; }
footer .text-slate-400 { color: rgba(255,255,255,.78); }
footer .text-white, footer .hover\:text-white:hover { color: #fff; }
footer .border-white\/10 { border-color: rgba(255,255,255,.25); }
footer .text-slate-600, footer .text-slate-700 { color: rgba(255,255,255,.4); }

/* ---- Subpages (about, news): the title area ---- */
main.hero-canvas { background: var(--paper); }
.about-section h2, .news-item h2, .project h3, .person h3 { font-weight: 500; letter-spacing: -.015em; }
.project .grant, .person .role, .news-item .meta { font-family: inherit; letter-spacing: 0; text-transform: none; font-size: .85rem; color: var(--mid); }
.person img { border-color: var(--line-h); background: var(--paper-2); }
.news-item .read-more { text-decoration-color: var(--navy); }
.news-item .read-more:hover { color: var(--mid); }

/* ---- Site assistant ---- */
.assistant { font-family: 'Instrument Sans', system-ui, sans-serif; }
.assistant-toggle { background: var(--navy); border-color: var(--navy); color: #fff; box-shadow: none; }
.assistant-toggle:hover { background: var(--mid); border-color: var(--mid); transform: none; }
.assistant-toggle .fa-comment-dots { color: #fff; }
.assistant-panel { background: #fff; border-color: var(--navy); box-shadow: 0 24px 60px -30px rgba(16,38,74,.5); }
.assistant-head, .assistant-foot { background: var(--paper); }
.assistant-head .assistant-title { font-family: inherit; letter-spacing: 0; text-transform: none; font-size: .95rem; font-weight: 600; color: var(--navy); }
.assistant-msg.is-bot { background: var(--paper); color: var(--navy); }
.assistant-msg.is-user { background: var(--navy); border-color: var(--navy); color: #fff; }
.assistant-msg a { color: var(--mid); }
.assistant-starters button { font-family: inherit; font-size: .8rem; color: var(--mute); }
.assistant-starters button:hover { border-color: var(--navy); color: var(--navy); }
.assistant-form textarea, .assistant-send { background: #fff; color: var(--navy); }
.assistant-form textarea::placeholder { color: var(--mute); }
.assistant-send:hover:not([disabled]) { background: var(--navy); color: #fff; }
.assistant-turnstile { background: #fff; }

/* arriving from /intro/: no dark fade-up on a light page */
::view-transition-new(root) { animation: none; }

/* ---- Other pages ---- */
.rd-section h2, .policy-section h2, .policy-section h3, .pub .title, .rd-card h3, .region-card h3 { font-weight: 500; letter-spacing: -.015em; }
.rd-card, .pub, .panel, .region-card, .quick-link { background: #fff; border: 1px solid var(--line-h); }
.rd-card:hover, .pub:hover, .quick-link:hover { border-color: var(--navy); box-shadow: none; background: #fff; }
.rd-card .tag, .region-kind { font-family: inherit; letter-spacing: 0; text-transform: none; font-size: .85rem; color: var(--mid); }
.pub a { color: var(--mid); }
.product-tag { background: var(--navy); color: #fff; font-family: inherit; letter-spacing: .04em; font-size: .8rem; text-transform: none; }
.code-404 { font-family: inherit; color: var(--navy); text-shadow: none; font-weight: 500; }
.quick-link i { color: var(--navy); }
.service-chip { background: var(--paper); border: 1px solid var(--line-h); color: var(--navy); }
/* form fields on light pages (login); the navy band keeps its own below */
.cf-field { border: 1px solid var(--line-h); background: #fff; color: var(--navy); border-radius: 0; }
.cf-field::placeholder { color: #8290a6; }
.cf-field:focus { border-color: var(--navy); background: #fff; }
input:-webkit-autofill, input:-webkit-autofill:focus { -webkit-text-fill-color: var(--navy); -webkit-box-shadow: 0 0 0 1000px #fff inset; caret-color: var(--navy); }
.contact-band .cf-field { border: 1px solid rgba(255,255,255,.35); background: rgba(255,255,255,.06); color: #fff; }
.contact-band .cf-field::placeholder { color: rgba(255,255,255,.4); }
.contact-band .cf-field:focus { border-color: #fff; background: rgba(255,255,255,.1); }
.contact-band input:-webkit-autofill, .contact-band input:-webkit-autofill:focus { -webkit-text-fill-color: #fff; -webkit-box-shadow: 0 0 0 1000px var(--navy) inset; caret-color: #fff; }
/* pricing page */
.price-wrap { background: #fff; border-color: var(--line-h); }
.price-table .band td { background: var(--navy); color: #fff; font-family: inherit; letter-spacing: .06em; font-size: .75rem; }
.price-table thead .group th { font-family: inherit; letter-spacing: .04em; text-transform: none; font-size: .8rem; color: var(--mid); }
.calc-step, .calc-dock p { font-family: inherit; letter-spacing: .02em; text-transform: none; font-size: .9rem; font-weight: 600; color: var(--navy); }
.calc-step .n { border-color: var(--navy); color: var(--navy); }
.calc-panel, .calc-layer, .calc-result, .calc-base, .calc-chip .face, .calc-area, .req-dialog, .req-summary, .req-field { background: #fff; border-color: var(--line-h); }
.calc-layer.on { border-color: var(--navy); }
.calc-layer.on .ico { background: var(--navy); border-color: var(--navy); color: #fff; }
.calc-base i { background: var(--navy); }
.calc-range { background: linear-gradient(90deg, var(--navy) 0%, var(--navy) var(--pct, 10%), var(--line-h) var(--pct, 10%)); }
.calc-range::-webkit-slider-thumb { border-color: var(--navy); }
.calc-range::-moz-range-thumb { border-color: var(--navy); }
.calc-total.bump { color: var(--mid); }
.calc-dock { background: rgba(255,255,255,.96); border-top: 1px solid var(--navy); }
.req-dock-btn { background: var(--navy); color: #fff; }
.req-dialog::backdrop { background: rgba(16,38,74,.45); }
.calc-detail summary, .calc-lines, .calc-legend { color: var(--mute); }
.example-panel { border-left-color: var(--navy); }
.included-item { background: #fff; border-color: var(--line-h); }
.included-item i { color: var(--navy); }
.req-close { border-color: var(--line-h); color: var(--mute); }

/* ---- Second pass after the full check (2026-11-04) ---- */
#top .nf-rotator > .news-flash.nf-enter { animation: h-nf-enter .6s cubic-bezier(.2,.9,.25,1.15) both; }
#top .nf-rotator > .news-flash.nf-enter .nf-tag { animation: none; }
@keyframes h-nf-enter { 0% { opacity: 0; transform: translateY(70%) rotateX(-80deg); } 60% { opacity: 1; } 100% { opacity: 1; transform: none; } }
/* validation card: the dark corner chips become navy with white text */
html .bg-\[\#0a0f1a\]\/90 { background-color: var(--navy); backdrop-filter: none; }
#validation .bg-\[\#070c15\] { background-color: #fff; }
#validation .text-\[\#22d3ee\] { color: var(--mid); }
/* "what's next" cards: white text on navy */
.future-card .text-white, .future-card h3 { color: #fff; }
.future-card .text-slate-300, .future-card .text-slate-400 { color: rgba(255,255,255,.78); }
.future-card .text-\[\#22d3ee\], .future-card .text-\[\#2dd4bf\] { color: #fff; }
.future-card .border-white\/10 { border-color: rgba(255,255,255,.25); }
#validation .w-9.h-9 { color: #fff; }
html .bg-\[\#0a0f1a\]\/90 .text-white { color: #fff; }