*{box-sizing:border-box}
html{scroll-padding-top:var(--nav-height)}
body{margin:var(--zero);background:var(--background);color:var(--foreground);font-family:var(--type-body);font-size:var(--type-base);font-weight:var(--type-weight);line-height:var(--type-leading);letter-spacing:var(--type-tracking)}
a{color:inherit;text-decoration:none}button,input,textarea{font:inherit;letter-spacing:inherit}button,a{touch-action:manipulation;-webkit-tap-highlight-color:transparent}button{cursor:pointer;text-align:left;user-select:none}button{color:inherit}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:var(--focus-width) solid var(--ring);outline-offset:var(--focus-offset)}
h1,h2,h3,h4,p,figure{margin:var(--zero)}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:var(--type-weight)}b,strong{font-weight:var(--type-weight)}[hidden]{display:none!important}img,video{display:block;max-width:var(--fill)}::selection{background:var(--accent);color:var(--solid-white)}
.stack{display:flex;flex-direction:column;gap:var(--gap)}.cluster{display:flex;align-items:center;flex-wrap:wrap;gap:var(--gap-control)}.spread{justify-content:space-between}.muted{color:var(--muted-foreground)}.copy{max-width:var(--copy-width)}.wide-copy{max-width:var(--wide-copy)}
.display,.heading{font-family:var(--type-display-family);font-weight:var(--type-weight);line-height:var(--type-leading-heading);letter-spacing:var(--type-tracking-heading)}.display{font-size:var(--type-display)}.heading{font-size:var(--type-heading)}
.section{padding:var(--section-space) var(--inset);background:var(--background);color:var(--foreground)}.section-inner{max-width:var(--page-width);margin-inline:auto;gap:var(--space-section-gap)}.section-head{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap);align-items:start}.section-head .copy{justify-self:end;width:var(--fill)}
.button{height:var(--button-height);padding:var(--zero) var(--gap-control);display:inline-flex;align-items:center;justify-content:space-between;gap:var(--gap);width:fit-content;max-width:var(--fill);border:var(--stroke) solid var(--foreground);background:transparent;color:var(--foreground);border-radius:var(--radius);transition:background var(--motion-normal) var(--motion-ease-ui),color var(--motion-normal) var(--motion-ease-ui),border-color var(--motion-normal) var(--motion-ease-ui);user-select:none;flex-shrink:0}
.button.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-foreground)}.button:hover{background:var(--primary);color:var(--primary-foreground)}.button.primary:hover{background:var(--accent-hover);border-color:var(--accent-hover);color:var(--accent-foreground)}.button.quiet{padding-inline:var(--zero);border-color:transparent}.button.quiet:hover{background:transparent;color:var(--foreground);border-bottom-color:var(--accent)}.text-link{display:inline-flex;align-items:center;gap:var(--gap-control);min-height:var(--control-height);border-bottom:var(--stroke) solid var(--border);width:fit-content}.text-link:hover{border-color:var(--accent)}
.skip-link{position:fixed;left:var(--inset);top:var(--gap-control);padding:var(--gap-control);z-index:var(--layer-skip);background:var(--accent);color:var(--solid-white);transform:translateY(calc(-1 * var(--hero-space)))}.skip-link:focus{transform:none}
#navigation{position:sticky;top:var(--zero);z-index:var(--layer-navigation);background:var(--background);color:var(--foreground)}.site-nav{position:relative;border-bottom:var(--stroke) solid var(--border)}.nav-bar{margin:auto;display:flex;align-items:center;justify-content:space-between;gap:var(--gap);padding:var(--gap) var(--inset)}.wordmark{font-family:var(--type-display-family);font-size:var(--type-brand);letter-spacing:var(--type-tracking-heading);min-height:var(--control-height);display:inline-flex;align-items:center}.nav-links,.nav-actions{display:flex;align-items:center;gap:var(--inset)}.nav-trigger{display:flex;align-items:center;justify-content:space-between;gap:var(--gap-control);height:var(--control-height);padding:var(--zero);border:none;background:transparent;color:inherit;transition:opacity var(--motion-normal) var(--motion-ease)}.nav-trigger:hover,.nav-trigger[aria-expanded=true]{opacity:var(--motion-muted)}.menu-sign{transition:transform var(--motion-normal) var(--motion-ease)}[aria-expanded=true]>.menu-sign{transform:rotate(var(--icon-rotation))}.mobile-toggle{display:none}.menu-panel{position:absolute;top:var(--fill);left:var(--zero);width:var(--fill);display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap);padding:var(--inset);background:var(--background);color:var(--foreground);border-bottom:var(--stroke) solid var(--border)}.menu-col{display:flex;flex-direction:column;gap:var(--gap-control)}.menu-col>p{min-height:var(--control-height);display:flex;align-items:center}.menu-link{display:flex;justify-content:space-between;align-items:center;gap:var(--gap-control);min-height:var(--control-height);border-bottom:var(--stroke) solid var(--border)}.menu-link:hover{border-color:var(--accent)}.menu-panel>*{animation:enter var(--motion-slow) var(--motion-ease) both}.menu-panel>:nth-child(2){animation-delay:var(--motion-stagger)}.menu-panel>:nth-child(3){animation-delay:calc(var(--motion-stagger) * 2)}.mobile-panel{position:absolute;top:var(--fill);left:var(--zero);width:var(--fill);padding:var(--inset);max-height:calc(var(--screen) - var(--nav-height));overflow-y:auto;background:var(--background);border-bottom:var(--stroke) solid var(--border)}

.page-hero{padding-block:var(--hero-space) var(--section-space)}.page-hero .section-inner{gap:var(--space-section-gap)}.page-hero h1{max-width:var(--page-width)}.hero-under{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--gap)}.home-hero{padding-top:var(--section-space);padding-bottom:var(--inset)}.home-hero .hero-under{align-items:center}.home-hero .display{max-width:var(--wide-copy)}.hero-layout{display:grid;grid-template-columns:1.65fr 1fr;gap:var(--gap);align-items:end}.hero-layout .stack{max-width:var(--layout-360);justify-self:end}.hero-layout p{color:var(--muted-foreground)}
.media-section{padding:var(--zero) var(--inset) var(--inset);background:var(--background);color:var(--foreground)}.media-frame{margin:var(--zero);overflow:hidden}.film-stage{overflow:hidden;background:var(--muted);aspect-ratio:var(--story-ratio)}.film-stage video{width:var(--fill);height:var(--fill);object-fit:cover}.hero-film .film-stage{aspect-ratio:var(--film-ratio)}.film-caption{display:flex;align-items:center;justify-content:space-between;gap:var(--gap);padding-block:var(--gap-control);color:var(--muted-foreground)}.film-control{flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:var(--gap);height:var(--control-height);padding:var(--zero) var(--gap-control);border:var(--stroke) solid var(--border);background:transparent;color:var(--foreground)}.film-control:hover{border-color:var(--foreground)}
.logo-section{padding-block:var(--inset)}.logo-strip{border-inline:var(--stroke) solid var(--border);display:grid;grid-template-columns:repeat(3,1fr);border-block:var(--stroke) solid var(--border)}.client-logo{padding:var(--inset);display:flex;align-items:center;justify-content:center;min-height:var(--logo-strip-height)}.client-logo+.client-logo{border-left:var(--stroke) solid var(--border)}.client-logo img{width:var(--logo-width);height:var(--logo-height);object-fit:contain;transition:opacity var(--motion-normal) var(--motion-ease)}.client-logo:hover img{opacity:var(--motion-muted)}
.mission{padding-top:var(--section-space)}.mission .heading{max-width:var(--page-width)}.mission-under{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap)}.mission-under p{max-width:var(--copy-width)}.mission-under .button{justify-self:end;align-self:end}.mission-mark{width:var(--diagram-mark);filter:var(--illustration-invert)}
.sector-list{border-bottom:var(--stroke) solid var(--border)}.ruled-row{display:grid;grid-template-columns:1fr 1fr auto;gap:var(--gap);padding:var(--inset);border-top:var(--stroke) solid var(--border);transition:background var(--motion-normal) var(--motion-ease)}a.ruled-row:hover{background:var(--muted)}.ruled-tag{color:var(--muted-foreground);white-space:nowrap}.ruled-row h3{font:inherit}.ruled-row p{color:var(--muted-foreground)}div.ruled-row{grid-template-columns:1fr 1fr}
.solution-tabs{display:flex;gap:var(--gap);border-bottom:var(--stroke) solid var(--border);overflow-x:auto}.solution-tab{height:var(--control-height);padding:var(--zero);border:none;border-bottom:var(--border-emphasis) solid transparent;background:transparent;flex-shrink:0;color:var(--muted-foreground)}.solution-tab[aria-selected=true]{border-bottom-color:var(--accent);color:var(--foreground)}.solution-panel{display:grid;grid-template-columns:1fr 1.35fr;gap:var(--space-section-gap);align-items:center}.solution-panel .heading{font-size:var(--type-feature)}.solution-panel .copy{align-items:flex-start}.solution-panel .film-caption{font-size:var(--type-base)}.solution-panel .media-frame{width:var(--fill)}
.story-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap)}.story-card{display:flex;flex-direction:column;border-inline:var(--stroke) solid var(--border);border-bottom:var(--stroke) solid var(--border);overflow:hidden}.story-image{position:relative;overflow:hidden;aspect-ratio:var(--story-ratio);background:var(--muted)}.story-image img{width:var(--fill);height:var(--fill);object-fit:cover;transition:transform var(--motion-slow) var(--motion-ease)}.story-card:hover img{transform:scale(var(--media-hover-scale))}.story-caption{padding:var(--inset);flex:1}.story-caption h3{font-size:var(--type-feature);line-height:var(--type-leading-heading);letter-spacing:var(--type-tracking-heading);font-family:var(--type-display-family)}.story-caption .cluster{align-items:flex-start}.story-caption .muted{display:none}
.platform-section{border:none}.approach-grid{align-items:start;display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap)}.approach-item{display:flex;flex-direction:column;gap:var(--gap);padding:var(--inset);border-top:var(--stroke) solid var(--border)}.approach-item h3{font-size:var(--type-feature);font-family:var(--type-display-family);line-height:var(--type-leading-heading);letter-spacing:var(--type-tracking-heading)}.approach-item p{color:var(--muted-foreground)}.faq-list{border-bottom:var(--stroke) solid var(--border)}.faq{border-top:var(--stroke) solid var(--border)}.faq h3{font:inherit}.faq-trigger{width:var(--fill);display:flex;align-items:center;justify-content:space-between;gap:var(--gap);min-height:var(--control-height);padding:var(--zero);border:none;background:transparent}.faq-answer{padding:var(--zero) var(--zero) var(--gap);max-width:var(--article-width);color:var(--muted-foreground)}
.cta{border-top:var(--stroke) solid var(--border)}.cta-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap);align-items:end}.cta-row .copy{justify-self:end}.footer{padding:var(--inset);background:var(--background);color:var(--foreground);border-top:var(--stroke) solid var(--border);overflow:hidden}.footer-top,.footer-bottom{display:flex;justify-content:space-between;gap:var(--gap);flex-wrap:wrap}.footer-links{display:flex;gap:var(--gap);flex-wrap:wrap}.footer-links a,.footer-bottom a{display:flex;align-items:center;gap:var(--gap-tight);min-height:var(--control-height)}.footer a:hover{color:var(--muted-foreground)}.footer-top>p{min-height:var(--control-height);display:flex;align-items:center}.footer-wordmark{display:block;width:fit-content;font-family:var(--type-display-family);font-size:var(--type-wordmark);line-height:var(--type-leading-label);letter-spacing:var(--type-tracking-heading);margin-block:var(--section-space) var(--gap)}.footer-bottom{align-items:center;border-top:var(--stroke) solid var(--border);padding-top:var(--gap);color:var(--muted-foreground)}
.story-head{display:grid;grid-template-columns:1fr 2fr;gap:var(--space-section-gap)}.story-identity{display:flex;flex-direction:column;gap:var(--gap);align-items:flex-start}.story-identity img{object-fit:contain;object-position:left;width:var(--logo-width);height:var(--logo-height)}.story-identity ul{margin:var(--zero);padding:var(--zero);list-style:none;display:flex;flex-direction:column;gap:var(--gap-control);color:var(--muted-foreground)}.story-intro{font-size:var(--type-article);line-height:var(--type-leading);max-width:var(--article-width)}.story-disclosure{font-size:var(--type-base);color:var(--muted-foreground);max-width:var(--article-width)}.article-section{display:grid;grid-template-columns:1fr minmax(0,var(--article-width));gap:var(--space-section-gap);padding:var(--inset);border-top:var(--stroke) solid var(--border)}.article-section h2{font-size:var(--type-feature);font-family:var(--type-display-family);letter-spacing:var(--type-tracking-heading);line-height:var(--type-leading-heading);max-width:var(--copy-width)}.article-section .stack{max-width:var(--article-width)}.article-sections{display:flex;flex-direction:column;gap:var(--space-section-gap)}.takeaway{width:var(--fill)}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap)}.field{display:flex;flex-direction:column;gap:var(--gap-control)}input,textarea{width:var(--fill);border:var(--stroke) solid var(--border);border-radius:var(--radius);background:var(--background);color:var(--foreground);padding:var(--gap-control)}input{height:var(--control-height)}textarea{resize:vertical;min-height:var(--layout-160)}.contact-layout{display:grid;grid-template-columns:1fr 1.5fr;gap:var(--space-section-gap)}.contact-layout>div.stack{max-width:var(--copy-width)}.contact-form{width:var(--fill)}.contact-form input::placeholder,.contact-form textarea::placeholder{color:var(--muted-foreground)}.trust-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap);padding:var(--inset);border-top:var(--stroke) solid var(--border)}.trust-row span{color:var(--muted-foreground)}.legal-copy{max-width:var(--article-width);display:flex;flex-direction:column;gap:var(--gap);margin:auto}.legal-copy h2{font-size:var(--type-feature);margin-top:var(--gap)}.legal-copy a{text-decoration:underline;text-underline-offset:var(--focus-offset)}
.js .reveal-pending{opacity:var(--motion-hidden);transform:translateY(var(--motion-distance))}.reveal-pending{transition:opacity var(--motion-reveal) var(--motion-ease),transform var(--motion-reveal) var(--motion-ease)}.reveal-pending.is-visible{opacity:var(--motion-shown);transform:none}.solution-panel.is-entering{animation:enter var(--motion-slow) var(--motion-ease) both}@keyframes enter{from{opacity:var(--motion-hidden);transform:translateY(var(--motion-distance))}to{opacity:var(--motion-shown);transform:translateY(var(--zero))}}
@view-transition{navigation:auto}::view-transition-old(root),::view-transition-new(root){animation-duration:var(--motion-normal);animation-timing-function:var(--motion-ease)}
@media(min-width:1800px){.media-section{max-width:var(--body-max);margin:auto}}
@media(max-width:1000px){.nav-links{gap:var(--gap)}.hero-layout{grid-template-columns:1fr}.hero-layout .stack{justify-self:start;max-width:var(--copy-width)}.solution-panel{gap:var(--gap)}.story-grid{grid-template-columns:1fr 1fr}.story-grid>.story-card:last-child{grid-column:1/-1;max-width:var(--article-width)}.contact-layout{grid-template-columns:1fr}.footer-top{flex-direction:column}}
@media(max-width:700px){.section-head,.mission-under,.solution-panel,.approach-grid,.story-head,.article-section,.cta-row,.form-grid{grid-template-columns:1fr}.section-head .copy,.cta-row .copy{justify-self:start}.nav-bar{padding:var(--gap-control) var(--inset)}.nav-links,.nav-actions>.button{display:none}.mobile-toggle{display:flex}.nav-actions{margin-left:auto}.page-hero{padding-block:var(--section-space)}.home-hero{padding-bottom:var(--inset)}.hero-under{align-items:flex-start;flex-direction:column}.hero-layout .stack{gap:var(--gap)}.logo-strip{grid-template-columns:1fr}.client-logo+.client-logo{border-left:none;border-top:var(--stroke) solid var(--border)}.client-logo{min-height:var(--logo-strip-height)}.film-caption{align-items:flex-start;gap:var(--gap-control)}.film-caption>span{max-width:var(--copy-width)}.film-control{gap:var(--gap-tight)}.solution-tabs{gap:var(--gap)}.story-grid{grid-template-columns:1fr}.story-grid>.story-card:last-child{max-width:none}.story-caption h3{font-size:var(--type-feature)}.mission-under .button{justify-self:start}.ruled-row{grid-template-columns:1fr auto}.ruled-row p{grid-column:1;grid-row:2}.article-section{gap:var(--gap)}.story-intro{font-size:var(--type-feature)}.footer-wordmark{margin-top:var(--space-section-gap)}.footer-links{gap:var(--gap-control)}.trust-row{grid-template-columns:1fr}.story-head{gap:var(--space-section-gap)}.article-sections{gap:var(--gap)}.contact-layout{gap:var(--space-section-gap)}}
@media(prefers-reduced-motion:reduce){.js .reveal-pending{opacity:var(--motion-shown);transform:none}.story-card:hover img{transform:none}}

@media(max-width:700px){div.ruled-row{grid-template-columns:1fr}.article-section{grid-template-columns:1fr}}

.field-error{color:var(--foreground)}[aria-invalid="true"]{border-color:var(--accent)}

/* The recovered mark remains part of the home link. */
.wordmark{gap:var(--gap-control);flex-shrink:0}
.nav-brain{width:var(--brand-mark-width);height:var(--brand-mark-height);object-fit:contain;filter:var(--brand-filter)}.nav-brain{width:auto;height:42px}.nav-word{height:22px;width:auto;object-fit:contain;filter:var(--brand-filter)}.wordmark{gap:8px}
/* A full viewport of film, with no page gutter. */
.media-section{padding:var(--zero);max-width:none}
.hero-film .film-stage{height:calc(var(--screen) - var(--nav-height) - var(--stroke));aspect-ratio:auto}
.hero-film .film-caption{padding:var(--gap-control) var(--inset)}
/* Story title and portrait share one continuous, split opening. */
.story-hero{display:grid;grid-template-columns:1fr 1fr;min-height:var(--story-hero-height);background:var(--background);color:var(--foreground)}
.story-hero-copy{padding:var(--inset);display:flex;flex-direction:column;justify-content:space-between;gap:var(--space-section-gap)}
.story-hero-copy .display{font-size:var(--type-story-display)}
.story-hero-meta{align-items:flex-start}
.story-portrait{display:flex;flex-direction:column;min-width:var(--zero)}
.story-portrait>img{width:var(--fill);height:var(--story-hero-height);object-fit:cover;flex:1;min-height:var(--zero)}
.story-portrait figcaption{padding:var(--gap-control) var(--inset);color:var(--muted-foreground)}
.story-portrait figcaption a{white-space:nowrap}
.story-portrait figcaption a:hover{color:var(--foreground)}
/* Fine paths and an coral trace, extended from the original specimen. */
.platform-illustrations{display:grid;gap:var(--gap)}
.linework-pair{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap);align-items:start}
.linework{margin:var(--zero);background:var(--muted);color:var(--muted-foreground);overflow:hidden}
.linework svg{display:block;width:var(--fill);height:var(--linework-height)}
.linework-pair svg{height:var(--linework-detail-height)}
.linework path{vector-effect:non-scaling-stroke;stroke:currentColor;stroke-width:var(--stroke);fill:none}
.linework .active-line{color:var(--accent);stroke-width:var(--focus-width)}
.linework-caption{padding:var(--inset);border-top:var(--stroke) solid var(--border);display:grid;grid-template-columns:1fr 2fr;gap:var(--gap)}
.linework-caption h3{font:inherit;color:var(--foreground)}
.linework-pair .linework-caption{grid-template-columns:1fr}
.is-visible .linework .active-line{animation:trace var(--motion-reveal) var(--motion-ease) both}
@keyframes trace{from{stroke-dasharray:var(--trace-length);stroke-dashoffset:var(--trace-length)}to{stroke-dasharray:var(--trace-length);stroke-dashoffset:var(--zero)}}
.has-rider .active-line,.has-rider .rider{vector-effect:none}
.has-rider .active-line{stroke-width:calc(var(--focus-width) / var(--linework-scale))}
.linework .rider{stroke-linecap:round;stroke-width:calc(var(--rider-width) / var(--linework-scale));color:var(--accent-strong);stroke-dasharray:var(--rider-head) calc(var(--rider-cycle) - var(--rider-head));stroke-dashoffset:var(--rider-start);animation:lap calc(var(--rider-lap) * var(--rider-cycle)) linear infinite}
.linework .rider-trail{stroke-width:calc(var(--rider-trail-width) / var(--linework-scale));opacity:var(--motion-muted);stroke-dasharray:var(--rider-trail) calc(var(--rider-cycle) - var(--rider-trail))}
.linework .rider-wall{stroke-width:calc(var(--focus-width) / var(--linework-scale));color:var(--accent);stroke-dasharray:var(--rider-wall) calc(var(--rider-cycle) - var(--rider-wall))}
.linework .rider-wall-far{stroke-width:calc(var(--focus-width) / var(--linework-scale));color:var(--accent);opacity:var(--motion-muted);stroke-dasharray:var(--rider-wall-far) calc(var(--rider-cycle) - var(--rider-wall-far))}
.has-rider .active-line{opacity:var(--motion-faint)}
.is-offscreen .rider{animation-play-state:paused}
@keyframes lap{from{stroke-dashoffset:var(--rider-start)}to{stroke-dashoffset:var(--trace-length)}}
@media(prefers-reduced-motion:reduce){.linework .rider{display:none}.has-rider .active-line{opacity:var(--motion-shown)}}
@media(max-width:1000px){.story-hero{grid-template-columns:1fr 1fr}.story-hero-copy{gap:var(--gap)}}
@media(max-width:800px){.nav-links,.nav-actions>.button{display:none}.mobile-toggle{display:flex}.nav-actions{margin-left:auto}}
@media(max-width:700px){
 .wordmark{gap:var(--gap-tight)}
 .story-hero{grid-template-columns:1fr}
 .story-hero-copy{gap:var(--space-section-gap)}
 .story-portrait>img{height:var(--media-height);flex:none;object-position:top}
 .linework-pair,.linework-caption{grid-template-columns:1fr}
 .linework svg{height:var(--linework-detail-height)}
 .linework-pair svg{height:var(--layout-160)}
}

/* The opening video and client strip occupy exactly the first viewport. */
body.has-cinematic-hero #navigation{position:fixed;top:var(--zero);left:var(--zero);width:var(--fill);background:transparent;transition:background var(--motion-normal) var(--motion-ease)}
body.has-cinematic-hero .site-nav{border-bottom-color:transparent}
body.has-cinematic-hero.scrolled #navigation,body.has-cinematic-hero.menu-open #navigation{background:var(--background)}
body.has-cinematic-hero.scrolled .site-nav,body.has-cinematic-hero.menu-open .site-nav{border-bottom-color:var(--border)}
.cinematic-hero{position:relative;height:calc(var(--screen) - var(--trust-height));background:var(--background);color:var(--foreground)}
.cinematic-hero .media-frame,.cinematic-hero .film-stage{height:var(--fill);width:var(--fill)}
.cinematic-hero:after{content:"";position:absolute;inset:var(--zero);background:var(--hero-shade);pointer-events:none}
.cinematic-copy{position:absolute;left:var(--inset);right:var(--inset);bottom:var(--inset);z-index:1}
.cinematic-copy p{color:var(--foreground)}
.cinematic-hero .film-caption{position:absolute;left:var(--inset);right:var(--inset);bottom:var(--inset);z-index:1;padding:var(--zero);color:var(--foreground)}
.cinematic-hero .film-control{border-color:var(--foreground)}
.trust-marquee{height:var(--trust-height);padding:var(--inset);display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:var(--gap);background:var(--background);color:var(--foreground);border-bottom:var(--stroke) solid var(--border);overflow:hidden}
.trust-marquee>p{white-space:nowrap}
.marquee-window{overflow:hidden;min-width:var(--zero)}
.marquee-track{display:flex;width:max-content;animation:marquee var(--marquee-duration) linear infinite}
.marquee-group{display:flex;align-items:center;gap:var(--inset);padding-right:var(--inset)}
.marquee-client{display:flex;align-items:center;justify-content:center;width:var(--marquee-width);height:var(--marquee-height);flex-shrink:0}
.marquee-client img{width:var(--fill);height:var(--fill);object-fit:contain}.ink-logo{filter:var(--logo-ink-filter)}

.trust-marquee:hover .marquee-track,.trust-marquee:focus-within .marquee-track{animation-play-state:paused}
@keyframes marquee{to{transform:translateX(var(--marquee-shift))}}
.builds-heading{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:var(--gap)}
.builds-heading button{min-width:var(--control-height);justify-content:center;padding-inline:var(--gap-control)}
.builds-heading button:disabled{opacity:var(--motion-muted);cursor:default}
.builds-rail{display:flex;gap:var(--gap);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.build-card{flex:0 0 var(--build-width);padding:var(--inset);border:var(--stroke) solid var(--border);display:flex;flex-direction:column;justify-content:space-between;gap:var(--gap);min-height:var(--build-height);scroll-snap-align:start;transition:background var(--motion-normal) var(--motion-ease)}
.build-card h3{font-size:var(--type-feature);line-height:var(--type-leading-heading);letter-spacing:var(--type-tracking-heading);font-family:var(--type-display-family)}
.build-card>.stack>.cluster{align-items:flex-start;flex-wrap:nowrap}.build-card p{color:var(--muted-foreground)}
.build-card dl{display:flex;flex-direction:column;gap:var(--gap-tight);margin:var(--zero)}.build-card dl>div{display:flex;justify-content:space-between;gap:var(--gap)}.build-card dt{color:var(--muted-foreground)}.build-card dd{margin:var(--zero)}
@media(max-width:1000px){.cinematic-copy{grid-template-columns:1fr;gap:var(--gap)}.cinematic-copy .stack{justify-self:start}}
@media(max-width:700px){.trust-marquee{gap:var(--gap-control)}.cinematic-copy .display{font-size:var(--type-story-display)}.cinematic-copy .button{display:none}.cinematic-hero .film-caption>span{max-width:var(--copy-width)}.cinematic-copy{bottom:var(--inset)}.build-card dl>div{flex-direction:column;gap:var(--zero)}}
@media(max-height:560px) and (min-width:701px){.cinematic-copy .display{font-size:var(--type-heading)}.cinematic-copy{grid-template-columns:1fr 1fr}.cinematic-copy .button{display:none}}
@media(prefers-reduced-motion:reduce){.marquee-track{animation:none}.marquee-group[aria-hidden=true]{display:none}.marquee-window{overflow-x:auto}.trust-marquee{grid-template-columns:auto minmax(0,1fr)}}

.marquee-client .ink-logo{max-height:var(--inset)}

/* The cards travel through the viewport edges without white masks. */
.latest-builds .section-inner{max-width:none}
.builds-rail{margin-inline:calc(-1 * var(--inset));padding-inline:var(--inset);scroll-padding-inline:var(--inset)}
.mission .linework{background:var(--background)}
.together-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap)}
.together-step{min-width:var(--zero)}
.operation-demo{padding:var(--inset);min-height:var(--build-height);background:var(--muted);display:flex;flex-direction:column;gap:var(--gap);overflow:hidden}
.demo-heading{display:flex;justify-content:space-between;gap:var(--gap-control);border-bottom:var(--stroke) solid var(--border);padding-bottom:var(--gap-control)}
.demo-heading>span{color:var(--muted-foreground)}
.connection-list,.run-list{display:flex;flex-direction:column}
.connection-list>div,.run-list>div{display:flex;justify-content:space-between;align-items:center;gap:var(--gap-control);min-height:var(--control-height);border-bottom:var(--stroke) solid var(--border)}
.connection-state,.review-state{color:var(--accent)}
.demo-question{font-size:var(--type-feature);line-height:var(--type-leading-heading);letter-spacing:var(--type-tracking-heading)}
.demo-response{color:var(--muted-foreground)}
.context-links{display:flex;align-items:center;flex-wrap:wrap;gap:var(--gap-tight);color:var(--accent)}
.together-caption{padding-top:var(--inset);gap:var(--gap-control)}
.together-caption h3{font-size:var(--type-feature);line-height:var(--type-leading-heading)}
.is-visible .connection-state,.is-visible .demo-response,.is-visible .run-list>div{animation:enter var(--motion-reveal) var(--motion-ease) both}
.is-visible .connection-list>div:nth-child(2) .connection-state,.is-visible .run-list>div:nth-child(2){animation-delay:var(--motion-stagger)}
.is-visible .connection-list>div:nth-child(3) .connection-state,.is-visible .run-list>div:nth-child(3){animation-delay:calc(var(--motion-stagger) * 2)}
@media(max-width:1000px){.together-grid{grid-template-columns:1fr}.operation-demo{min-height:var(--zero)}.together-step+.together-step{margin-top:var(--gap)}}

@media(min-width:1001px){.together-step{display:grid;grid-template-rows:subgrid;grid-row:span 2;row-gap:var(--zero)}}

/* An editorial index opens on a solid ground, with the page left unfiltered. */
.editorial-toggle{min-width:var(--control-height)}
.editorial-panel{height:calc(var(--screen) - var(--nav-height) - var(--stroke));overflow-y:auto;align-content:start;grid-template-columns:1fr 1.2fr .8fr;gap:var(--space-section-gap)}
.editorial-intro{gap:var(--gap)}
.editorial-intro .heading{font-size:var(--type-feature)}
.editorial-links .menu-link{font-size:var(--type-menu);line-height:var(--type-leading-heading);padding-block:var(--gap-control)}

@media(max-width:1000px){.editorial-panel{grid-template-columns:1fr 1fr}.editorial-intro{grid-column:1/-1}}
@media(max-width:700px){.editorial-panel{grid-template-columns:1fr;gap:var(--gap)}.editorial-intro{display:none}.editorial-links .menu-link{font-size:var(--type-feature)}.editorial-support{padding-top:var(--gap)}}

.nav-links{margin-left:auto}

/* Illustrations are part of the page, with paths reaching both viewport edges. */
.linework{width:var(--viewport-inline);max-width:none;margin-inline:calc((var(--fill) - var(--viewport-inline)) / 2);background:transparent;overflow:hidden}
.linework-caption{border:none;max-width:var(--page-width);margin-inline:auto}


.nav-actions{margin-left:auto}
.editorial-toggle{width:var(--control-height);justify-content:center}
.hamburger{position:relative;display:block;width:var(--gap);height:var(--gap)}
.hamburger>span{position:absolute;left:var(--zero);top:calc(var(--fill) / 2);width:var(--fill);height:var(--stroke);background:currentColor;transition:transform var(--motion-normal) var(--motion-ease)}
.hamburger>span:first-child{transform:translateY(calc(-1 * var(--focus-offset)))}
.hamburger>span:last-child{transform:translateY(var(--focus-offset))}
[aria-expanded=true] .hamburger>span:first-child{transform:rotate(var(--icon-rotation))}
[aria-expanded=true] .hamburger>span:last-child{transform:rotate(calc(-1 * var(--icon-rotation)))}

.nav-bar{padding-block:var(--nav-block-inset)}

.belief-title{text-align:left}
.together-step>.operation-demo{height:var(--fill)}

/* Keep scroll boundaries firm, including macOS rubber-band overscroll. */
html,body,.editorial-panel,.mobile-panel{overscroll-behavior:none}
.builds-rail,.solution-tabs,.marquee-window{overscroll-behavior-x:none}

.button.nav-contact{background:var(--nav-contact-background);border-color:var(--nav-contact-background);color:var(--nav-contact-foreground)}
.button.nav-contact:hover{background:var(--nav-contact-background);border-color:var(--nav-contact-foreground);color:var(--nav-contact-foreground)}

/* Story openings occupy the screen below the navigation; portraits crop to fit. */
.story-hero{height:calc(var(--screen) - var(--nav-height) - var(--stroke));min-height:var(--zero);grid-template-rows:minmax(0,1fr)}
.story-hero-copy,.story-portrait{min-height:var(--zero)}
.story-portrait{overflow:hidden}
.story-portrait>img{height:var(--zero);flex:1 1 var(--zero);object-fit:cover;object-position:center}
.story-portrait figcaption{flex-shrink:0}
@media(max-width:1000px),(max-height:700px){.story-hero-copy .display{font-size:var(--type-heading)}.story-hero-copy{gap:var(--gap)}}
@media(max-width:700px){.story-hero{grid-template-rows:auto minmax(0,1fr)}.story-hero-meta{flex-direction:row;align-items:center;justify-content:space-between;gap:var(--gap-control)}.story-hero-copy .stack{gap:var(--gap-control)}.story-portrait>img{object-position:center}}

/* A single closing statement, open artwork, and a quiet legal row. */
.footer{padding:var(--zero);background:var(--background);color:var(--foreground)}
.footer-statement{max-width:var(--page-width);margin-inline:auto;padding:var(--section-space) var(--inset) var(--space-section-gap)}
.footer-bottom{padding:var(--inset);gap:var(--gap);color:var(--muted-foreground)}
.footer-links{align-items:center}

.footer,.footer-bottom{border:none}

.editorial-links .menu-link,.demo-question{font-family:var(--type-display-family)}

/* Section surfaces never use top or bottom divider borders. */
.section,.trust-marquee,.footer,.footer-bottom{border-block:none}

/* Center the client-story heading as requested. */
#stories>.section-inner>.section-head{grid-template-columns:1fr}
#stories>.section-inner>.section-head .heading{text-align:center}
#stories>.section-inner>.section-head>.copy:empty{display:none}

/* Centered mission copy requested by Marijn. */
.mission .heading{margin-inline:auto;text-align:center}
.mission-under{grid-template-columns:1fr}
.mission-under p{margin-inline:auto;text-align:center}

/* A spacious product opening inspired by the supplied editorial reference. */
.product-hero{padding-top:var(--product-hero-space);padding-bottom:var(--space-section-gap)}
.product-wordmark{width:100%;max-width:var(--product-wordmark-width)}.product-wordmark svg{display:block;width:100%;height:auto}
.product-hero-under{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--gap)}
.product-hero-under p{max-width:var(--copy-width)}
.product-hero .section-inner{gap:var(--space-section-gap)}
.product-hero .linework svg{height:var(--linework-height)}
.product-benefits{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--inset)}
.product-benefits h3{font-family:var(--type-display-family);font-size:var(--type-feature);line-height:var(--type-leading-heading);letter-spacing:var(--type-tracking-heading)}
.product-section .linework{margin-block:var(--gap)}
@media(max-width:700px){.product-hero{padding-top:var(--section-space)}.product-benefits{grid-template-columns:1fr;gap:var(--space-section-gap)}.product-hero-under{align-items:flex-start;flex-direction:column}.product-hero .linework svg{height:var(--linework-detail-height)}#stories>.section-inner>.section-head .heading{font-size:var(--type-feature)}}

.editorial-panel{height:auto;max-height:calc(var(--screen) - var(--nav-height) - var(--inset));border:none}
.editorial-panel>.menu-col{animation:none}

.theme-toggle{width:var(--control-height);justify-content:center;flex-shrink:0}
.theme-toggle svg{width:var(--gap);height:var(--gap);fill:none;stroke:currentColor;stroke-width:var(--stroke)}
.theme-toggle .theme-half{fill:currentColor;stroke:none}
.nav-brain{filter:var(--brand-filter)}
.marquee-client img,.client-logo img,.story-identity img{filter:var(--client-logo-filter)}
.cinematic-hero,.cinematic-copy p{color:var(--solid-white)}
.cinematic-copy .button{color:var(--solid-white)}
body.has-cinematic-hero:not(.scrolled):not(.menu-open) #navigation{color:var(--solid-white)}
body.has-cinematic-hero:not(.scrolled):not(.menu-open) .nav-brain,body.has-cinematic-hero:not(.scrolled):not(.menu-open) .nav-word{filter:var(--illustration-invert)}
@media(max-width:700px){.nav-bar,.nav-actions{gap:var(--gap-tight)}.wordmark{font-size:var(--type-base)}}

.marquee-client img,.client-logo img,.story-identity img{mix-blend-mode:var(--client-logo-blend)}
.marquee-client .ink-logo{filter:var(--pale-logo-filter)}

/* Give opaque logo images a real backdrop for theme-aware blending. */
.marquee-client,.client-logo,.story-identity{background:var(--background);isolation:isolate}

.product-hero-under{justify-content:flex-end}
.product-hero-under p{margin-left:auto}

/* Product views drawn in HTML on an open drafting surface. */
.interface-illustration{width:var(--viewport-inline);margin-inline:calc((var(--fill) - var(--viewport-inline)) / 2);color:var(--foreground)}
.blueprint-stage{position:relative;min-height:var(--blueprint-stage-height);padding:var(--space-section-gap) var(--inset);display:flex;align-items:center;overflow:hidden}
.blueprint-content{position:relative;width:var(--fill);max-width:var(--blueprint-width);margin-inline:auto}
.mock-access{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-section-gap);align-items:center}
.mock-login,.mock-workspaces{display:flex;flex-direction:column;gap:var(--gap);padding:var(--inset);background:var(--background)}
.mock-title{font-size:var(--type-feature);font-family:var(--type-display-family);line-height:var(--type-leading-heading);letter-spacing:var(--type-tracking-heading)}
.mock-brain{width:var(--brand-mark-width);height:var(--brand-mark-height);filter:var(--brand-filter)}
.mock-providers{display:flex;flex-direction:column;gap:var(--gap-control)}
.mock-providers>span{border:var(--stroke) solid var(--foreground);min-height:var(--control-height);padding:var(--gap-control);display:flex;align-items:center}
.mock-workspace{display:flex;justify-content:space-between;align-items:center;gap:var(--gap);padding-block:var(--gap);border-bottom:var(--stroke) solid var(--border)}
.mock-workspace svg{width:var(--blueprint-art-width);height:var(--blueprint-art-height);fill:none;stroke:var(--accent);stroke-width:var(--stroke);flex-shrink:0}
.mock-window{background:var(--background);border:var(--stroke) solid var(--border)}
.mock-window-bar{display:flex;justify-content:space-between;gap:var(--gap);padding:var(--gap-control) var(--inset);border-bottom:var(--stroke) solid var(--border)}
.mock-desk{display:grid;grid-template-columns:var(--blueprint-side) minmax(0,1fr)}
.mock-sidebar{padding:var(--inset);border-right:var(--stroke) solid var(--border);display:flex;flex-direction:column;gap:var(--gap)}
.mock-sidebar>.muted{margin-top:auto}.mock-nav{display:flex;flex-direction:column;gap:var(--gap-control);color:var(--muted-foreground)}
.mock-nav .selected{color:var(--accent)}
.mock-main{padding:var(--inset);display:flex;flex-direction:column;gap:var(--gap);min-width:var(--zero)}
.mock-page-title{display:flex;justify-content:space-between;align-items:baseline;gap:var(--gap);flex-wrap:wrap}
.mock-work-list{display:flex;flex-direction:column;gap:var(--zero)}
.mock-work-list>p{padding-bottom:var(--gap-control)}
.mock-row{display:flex;justify-content:space-between;align-items:center;gap:var(--gap);padding:var(--gap-control) var(--zero);border-bottom:var(--stroke) solid var(--border)}
.mock-row.highlighted{color:var(--accent)}.mock-row.highlighted .muted{color:inherit}
.mock-dock{display:flex;gap:var(--gap);padding:var(--gap-control) var(--inset);border-top:var(--stroke) solid var(--border)}
.mock-review{display:grid;grid-template-columns:minmax(0,1fr) var(--blueprint-agent)}
.mock-agent{padding:var(--inset);border-left:var(--stroke) solid var(--border);display:flex;flex-direction:column;gap:var(--gap)}
.mock-chat{display:flex;flex-direction:column;gap:var(--gap)}.mock-question{color:var(--accent)}
.mock-composer{margin-top:auto;min-height:var(--control-height);border-bottom:var(--stroke) solid var(--border);display:flex;align-items:center;color:var(--muted-foreground)}
.mock-source{display:flex;justify-content:space-between;gap:var(--gap);flex-wrap:wrap}.mock-accent{color:var(--accent)}
.mock-review-action{background:var(--accent);color:var(--accent-foreground);padding:var(--gap-control);width:fit-content}
@media(max-width:1000px){.mock-access{gap:var(--gap)}.mock-sidebar{padding:var(--gap-control)}.mock-desk{grid-template-columns:var(--blueprint-art-width) minmax(0,1fr)}.mock-review{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.blueprint-stage{padding-block:var(--gap);min-height:var(--zero)}.mock-access,.mock-review{grid-template-columns:1fr}.mock-access{gap:var(--space-section-gap)}.mock-login,.mock-workspaces,.mock-main,.mock-agent{padding:var(--gap-control)}.mock-workspace svg{width:var(--layout-80)}.mock-desk{grid-template-columns:1fr}.mock-sidebar{border-right:none;border-bottom:var(--stroke) solid var(--border)}.mock-sidebar>.muted{display:none}.mock-nav{flex-direction:row;justify-content:space-between;gap:var(--gap-tight)}.mock-row{align-items:flex-start;gap:var(--gap-control)}.mock-row>span{max-width:var(--fill)}.mock-agent{border-left:none;border-top:var(--stroke) solid var(--border)}.mock-dock{padding:var(--gap-control);flex-wrap:wrap;gap:var(--gap-tight)}.mock-window-bar{padding-inline:var(--gap-control)}.mock-source{flex-direction:column;gap:var(--gap-tight)}}

.footer-security{display:flex;align-items:center;justify-content:space-between;gap:var(--gap);padding:var(--gap) var(--inset);flex-wrap:wrap}
.footer-standards{display:flex;align-items:center;gap:var(--gap);flex-wrap:wrap}
.footer-security a:hover{color:var(--accent)}

/* Product recordings, feature prose, tables and records (the noon site's substance, in this system). */
.demo-frame{margin:var(--zero);display:flex;flex-direction:column;gap:var(--gap-control)}
.demo-screen{overflow:hidden}
.demo-screen video,.demo-screen img{display:block;width:var(--fill);height:auto}
.demo-note{color:var(--muted-foreground)}
.demo-frame .film-caption{flex-direction:column;align-items:flex-start;gap:var(--gap-tight)}
.demo-frame .film-caption>span:first-child{color:var(--foreground)}
.product-cycle .work-stage{aspect-ratio:var(--ratio-screen)}
.product-cycle .work-caption{display:grid;gap:var(--gap-tight)}
.product-cycle .work-text{color:var(--foreground)}
.mock-window-brand{display:inline-flex;align-items:center}
.mock-window-brand svg{display:block;height:var(--window-brand-height);width:auto}
@media(max-width:700px){.product-cycle .mock-window-bar{padding-block:var(--gap-tight);font-size:var(--type-caption)}}
.feature-list{border-bottom:var(--stroke) solid var(--border)}
.feature-row{display:grid;grid-template-columns:var(--content-min) minmax(0,1fr);gap:var(--gap);padding:var(--inset) var(--zero);border-top:var(--stroke) solid var(--border)}
.feature-row .stack{gap:var(--gap-tight);max-width:var(--article-width)}
.solution-panel.product-panel{grid-template-columns:1fr;align-items:start}
.solution-panel.product-panel .copy{max-width:var(--article-width)}
.data-table{width:var(--fill);border-collapse:collapse;text-align:left}
.data-table th,.data-table td{padding:var(--gap-control) var(--gap) var(--gap-control) var(--zero);border-top:var(--stroke) solid var(--border);vertical-align:top;font-weight:var(--type-weight)}
.data-table thead th{color:var(--muted-foreground);border-top:var(--zero)}
.data-table tbody th{color:var(--foreground)}
.data-table tr.group td{color:var(--muted-foreground);padding-top:var(--inset)}
.data-table tbody tr:last-child td,.data-table tbody tr:last-child th{border-bottom:var(--stroke) solid var(--border)}
.record-card{padding:var(--inset);border:var(--stroke) solid var(--border);background:var(--muted);display:flex;flex-direction:column;gap:var(--gap)}
.record-card dl{margin:var(--zero);display:flex;flex-direction:column;gap:var(--gap-tight)}
.record-card dl>div{display:grid;grid-template-columns:var(--content-min) minmax(0,1fr);gap:var(--gap)}
.record-card dt{color:var(--muted-foreground)}
.record-card dd{margin:var(--zero)}
.step-list,.column-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--inset)}
.step-list .stack,.column-list .stack{gap:var(--gap-tight)}
.column-list ul,.plain-list{list-style:none;margin:var(--zero);padding:var(--zero);display:flex;flex-direction:column;gap:var(--gap-tight)}
.column-list li,.plain-list li{padding-top:var(--gap-tight);border-top:var(--stroke) solid var(--border)}
.plain-list{max-width:var(--article-width)}
.together-caption{display:grid;grid-template-columns:var(--content-min) minmax(0,1fr);gap:var(--gap);padding-top:var(--gap-control)}
.together-caption>span:first-child{color:var(--muted-foreground)}.together-line{color:var(--foreground)}
.ontology-diagram{margin:var(--zero);display:flex;flex-direction:column;gap:var(--gap-control)}
.ontology-diagram img{display:block;width:var(--fill);height:auto}
.mcp-address{display:inline-flex;min-height:var(--control-height);align-items:center;padding:var(--zero) var(--gap-control);border:var(--stroke) solid var(--border);width:fit-content}
@media (max-width:700px){.feature-row,.record-card dl>div,.feature-row{gap:var(--gap-tight)}}

/* The statement keeps Sam's three-line break where the line fits, and wraps naturally where it does not. */
@media (max-width:1240px){.mission .heading br{display:none}}

/* Client marks: one ink in both themes, and each mark sized to read at the weight of its
   neighbours rather than to fill an equal cell. The width comes from the client record. */
.marquee-client{width:auto;height:auto;justify-content:flex-start}
.marquee-client img{width:var(--mark-width);height:auto;max-height:var(--marquee-height);object-fit:contain;mix-blend-mode:normal}
.marquee-client .ink-logo,.marquee-client img{filter:var(--client-logo-filter)}
.client-logo img{width:var(--mark-width);height:auto;max-height:var(--logo-height)}
.marquee-group{gap:var(--logo-gap);padding-right:var(--logo-gap)}
.trust-marquee{padding:var(--logo-band-space) var(--inset);gap:var(--logo-band-space)}

/* Under the statement: what we can be held to, who we build for, and what we bring.
   Each rotating slot is a stack in one grid cell, so it is as wide as its longest word
   and the row never shifts when a word turns over. */
.mission-readouts{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:var(--gap-control) var(--readout-gap);color:var(--muted-foreground);font-size:var(--type-caption)}
/* The industry is set to match SOC 2 and HIPAA, which are acronyms and already caps. */
.mission-readouts{text-transform:uppercase;letter-spacing:var(--tracking-caps)}
.readout-mark{display:flex;align-items:center;gap:var(--gap-tight)}
.mark-check{width:var(--type-caption);height:var(--type-caption);flex-shrink:0;fill:none;stroke:currentColor;stroke-width:var(--check-stroke)}
.rotator{display:grid;justify-items:center}
.rotator-item{grid-area:1/1;opacity:var(--motion-hidden);transition:opacity var(--motion-normal) var(--motion-ease);white-space:nowrap}
/* The word arriving waits for the word leaving, so two never sit on top of each other. */
.rotator-item.is-current{opacity:var(--motion-shown);transition-delay:var(--motion-normal)}
@media (prefers-reduced-motion:reduce){
 .rotator{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--readout-gap);width:auto}
 .rotator-item{opacity:var(--motion-shown)}
}

/* The work, turning over under the statement. Films and captions each sit in one grid cell,
   so the band reserves the height of the tallest caption and never shifts as they change. */
.work-cycle{margin:var(--zero);display:flex;flex-direction:column;gap:var(--gap-control)}
.work-stage{display:grid;aspect-ratio:var(--film-ratio);overflow:hidden;background:var(--muted)}
.work-film{grid-area:1/1;width:var(--fill);height:var(--fill);object-fit:cover;opacity:var(--motion-hidden);transition:opacity var(--motion-slow) var(--motion-ease)}
.work-film.is-current{opacity:var(--motion-shown)}
.work-caption{display:grid;color:var(--muted-foreground)}
.work-text{grid-area:1/1;max-width:var(--article-width);opacity:var(--motion-hidden);transition:opacity var(--motion-normal) var(--motion-ease)}
.work-text.is-current{opacity:var(--motion-shown);transition-delay:var(--motion-normal)}
@media (prefers-reduced-motion:reduce){
 .work-caption{display:flex;flex-direction:column;gap:var(--gap)}
 .work-text{opacity:var(--motion-shown)}
}
/* The work band runs edge to edge; only its caption keeps the page's inset. */
.work-section{padding:var(--zero)}
.work-section>.section-inner{max-width:none}
.work-cycle{gap:var(--zero)}
.work-caption{padding:var(--gap-control) var(--inset) var(--zero);font-size:var(--type-caption)}
/* With an overlay the band behaves like the hero: a scrim over the film, copy on top of it. */
.work-cycle.has-overlay .work-stage{position:relative;aspect-ratio:var(--ratio-banner)}
.work-cycle.has-overlay .work-stage:after{content:"";position:absolute;inset:var(--zero);background:var(--hero-shade);pointer-events:none}
.work-overlay{position:absolute;left:var(--inset);right:var(--inset);bottom:var(--inset);z-index:1;color:var(--solid-white)}
.work-overlay .heading,.work-overlay p{color:var(--solid-white)}
.work-overlay .button{border-color:var(--solid-white);color:var(--solid-white)}
.work-overlay .section-head{max-width:var(--page-width);margin-inline:auto}
/* On a phone a 2:1 band is far shorter than the copy laid over it, so the band goes square. */
@media (max-width:700px){.work-cycle.has-overlay .work-stage{aspect-ratio:var(--ratio-square)}}

/* Industry chips: a way into each build, sitting above the montage. Links, not tabs;
   nothing here tracks what the film is showing. */
.industry-chips{display:flex;flex-wrap:wrap;gap:var(--gap-tight)}
/* In the overlay the chips carry the film behind them, so they take the overlay's own ink. */
.work-overlay .industry-chip{border-color:var(--solid-white);color:var(--solid-white)}
.work-overlay .industry-chip:hover{background:var(--solid-white);color:var(--primary)}
.industry-chip{display:inline-flex;align-items:center;min-height:var(--control-height);padding:var(--zero) var(--gap-control);border:var(--stroke) solid var(--border);color:var(--foreground);transition:background var(--motion-normal) var(--motion-ease-ui),color var(--motion-normal) var(--motion-ease-ui),border-color var(--motion-normal) var(--motion-ease-ui)}
.industry-chip:hover{background:var(--primary);color:var(--primary-foreground);border-color:var(--primary)}
/* Without a long summary the meta drifted to the bottom of an empty column. */
/* Marijn pushed the meta to the bottom of this column; his summaries were long enough to fill it.
   Ours are two lines, so space-between left a void. The column stacks from the top instead. */
.story-hero-copy{justify-content:flex-start;gap:var(--inset)}
/* The ontology claim closes the approach section, under its graphic. */
.ontology-note{display:flex;flex-direction:column;gap:var(--gap);align-items:flex-start}
.ontology-claim{font-size:var(--type-feature);max-width:var(--article-width);margin:var(--zero)}

/* One connected operation: the model, the question answered, and the work done overnight.
   The schema block is the only monospace on the site; SQL in a proportional face is unreadable. */
.code-block{margin:var(--zero);font-family:var(--type-code);font-size:var(--code-size);line-height:var(--type-leading);white-space:pre;overflow-x:auto;color:var(--foreground)}
.code-keyword{color:var(--accent)}
.chat-thread{gap:var(--gap-control)}
.chat-question{margin:var(--zero);padding:var(--gap-control);background:var(--background);color:var(--foreground)}
.chat-answer{margin:var(--zero);color:var(--foreground)}
.chat-composer{margin:auto var(--zero) var(--zero);padding:var(--gap-control);border:var(--stroke) solid var(--border);color:var(--muted-foreground)}
.post-body{display:flex;flex-direction:column;gap:var(--gap-tight)}
.post-body p{margin:var(--zero);color:var(--foreground)}
.post-author{color:var(--foreground)}
.post-time{color:var(--muted-foreground);font-size:var(--type-caption)}
/* The client sits under their photograph, not beside the headline. */
.portrait-client{display:flex;flex-direction:column;gap:var(--gap-tight);padding-top:var(--gap-control)}

/* The tiles sat grey on white and barely separated. The ground takes the muted tone and the
   tiles take the page's own, the way the earlier version had it, so each one reads as a card. */
.together-section{background:var(--muted)}
.together-section .operation-demo{background:var(--background);border:var(--stroke) solid var(--border)}
.together-section .chat-question{background:var(--muted)}
.together-section .chat-composer{background:var(--muted);border-color:var(--muted)}

/* It all comes together: two scenes stacked in one stage. Without script only the second shows, complete. */
.together-stage{display:grid;position:relative}
.together-scene{grid-area:1/1;display:flex;flex-direction:column;gap:var(--gap-control);min-width:var(--zero);min-height:var(--zero);transition:opacity var(--motion-slow) var(--motion-ease),transform var(--motion-slow) var(--motion-ease)}
.together-scene[data-scene="a"]{display:none}
.js .together-scene[data-scene="a"]{display:flex}
.js .together-scene:not(.is-current){opacity:var(--motion-hidden);transform:translateY(var(--motion-nudge));pointer-events:none}
.scene-head{display:flex;justify-content:space-between;gap:var(--gap-control);margin:var(--zero);padding-bottom:var(--gap-tight);border-bottom:var(--stroke) solid var(--border);color:var(--muted-foreground);font-size:var(--type-caption)}
.scene-head>span:first-child{color:var(--foreground)}
.signal{display:inline-block;width:var(--signal-size);height:var(--signal-size);border-radius:var(--signal-radius);background:var(--muted-foreground);margin-inline-end:var(--gap-tight);vertical-align:middle;transition:background var(--motion-normal)}
.is-on .signal,.is-done .signal{background:var(--accent)}
.connections,.run-log{list-style:none;margin:var(--zero);padding:var(--zero);flex:1;display:flex;flex-direction:column;justify-content:space-between}
.connections li,.run-log li{padding-block:var(--gap-tight);border-bottom:var(--stroke) solid var(--border);color:var(--foreground)}
.connections li:last-child,.run-log li:last-child{border-bottom:none}
.connections li{display:flex;justify-content:space-between;gap:var(--gap-control)}
.connections em{font-style:normal;font-size:var(--type-caption);color:var(--muted-foreground);transition:color var(--motion-normal)}
.connections li.is-on em{color:var(--foreground)}
.run-log{font-family:var(--type-code);font-size:var(--code-size)}
.run-log li{display:grid;grid-template-columns:var(--run-label) minmax(0,1fr) auto;gap:var(--gap-control)}
.run-log em{font-style:normal;color:var(--muted-foreground)}
.run-log u{text-decoration:none;color:var(--muted-foreground)}
.run-log li.is-on u{color:var(--accent)}
.code-line{display:inline-block}
.code-string{color:var(--muted-foreground)}
.js .code-line,.js .run-log li{opacity:var(--motion-hidden);transform:translateX(calc(-1 * var(--motion-nudge)));transition:opacity var(--motion-normal),transform var(--motion-normal)}
.js .run-log li{transform:translateY(var(--motion-nudge))}
.js .code-line.is-on,.js .run-log li.is-on{opacity:var(--motion-shown);transform:none}
.together-grid.is-typing:not(.is-done) .chat-answer:not(:empty)::after{content:"";display:inline-block;width:var(--caret-width);height:1em;margin-inline-start:var(--gap-tight);vertical-align:text-bottom;background:var(--foreground);animation:together-caret 1s steps(2) infinite}
@keyframes together-caret{50%{opacity:var(--motion-hidden)}}
@media(prefers-reduced-motion:reduce){.together-scene,.code-line,.run-log li,.signal,.connections em{transition:none}.together-grid .chat-answer::after{display:none}}
@media(max-width:700px){.together-caption{grid-template-columns:1fr;gap:var(--gap-tight)}}
@media(max-width:1000px){.together-step>.operation-demo{height:auto}}
@media(max-width:700px){.mission-readouts .rotator{order:1;flex-basis:var(--fill)}}
