:root {
  color-scheme: dark;
  --sc-canvas: var(--localis-ground); --sc-surface: var(--localis-surface);
  --sc-ink: var(--localis-ink); --sc-ink-soft: var(--localis-muted);
  --sc-accent: var(--localis-blue); --sc-accent-ink: var(--localis-blue-ink);
  --sc-font-display: var(--localis-font); --sc-font-text: var(--localis-font);
  --ink: var(--localis-ink); --muted: var(--localis-muted); --accent: var(--localis-blue);
  --gutter: clamp(1.25rem, 5vw, 6rem); --rule: var(--localis-line);
  --header-height: 5rem;
  --material-face: linear-gradient(145deg, #29404e 0%, #162731 52%, #0e1a23 100%);
  --material-shadow: 0 16px 28px rgb(2 8 13 / 28%), inset 0 1px 0 rgb(237 243 245 / 18%);
  --paper-shadow: 0 20px 40px rgb(30 66 84 / 16%), inset 0 1px 0 rgb(255 255 255 / 80%);
  font-family: var(--localis-font); font-synthesis: none;
}
body { font: 400 16px/1.6 var(--localis-font); color: var(--ink); background: var(--localis-ground); }
a { text-decoration: none; color: inherit; }
[hidden] { display: none !important; }
h1,h2,h3,p,figure { margin: 0; font-weight: 400; }
h1,h2,h3 { text-wrap: balance; }
h1,h2 { letter-spacing: -0.035em; }
p { text-wrap: pretty; }
.icon-library { width: 0; height: 0; position: absolute; overflow: hidden; }
.icon { width: 1.4rem; height: 1.4rem; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.content-width { width: calc(100% - var(--gutter) * 2); max-width: 1440px; margin-inline: auto; }
.skip-link { position: fixed; top: 1rem; left: 1rem; z-index: 100; padding: 1rem; color: var(--localis-blue-ink); background: var(--accent); transform: translateY(-180%); }
.skip-link:focus { transform: none; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 6px; }
html { scroll-padding-top: calc(var(--header-height) + 1rem); }
.brand { display: inline-flex; align-items: center; gap: 0.65rem; font-size: 1.9rem; letter-spacing: -0.035em; line-height: 1; }
.brand svg { width: 1.5rem; height: 1.9rem; fill: currentColor; }
.site-header { position: sticky; z-index: 60; inset: 0 0 auto; display: flex; align-items: center; min-height: var(--header-height); gap: 5vw; padding: 0.75rem var(--gutter); background: var(--localis-ground); border-bottom: 1px solid rgb(160 219 237 / 14%); }
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .site-header { background: rgb(11 19 26 / 90%); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); }
}
.site-navigation { display: flex; align-items: center; justify-content: space-between; flex: 1; gap: 2rem; font-size: 0.85rem; }
.section-links,.account-links { display: flex; align-items: center; gap: clamp(1rem,2.3vw,3rem); }
.account-links { gap: 1.4rem; }
.section-links a,.sign-in { display: inline-flex; align-items: center; min-height: 44px; transition: color 160ms ease; }
.section-links a:hover,.sign-in:hover { color: var(--accent); }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 1.5rem; min-height: 52px; padding: 0.8rem 1.4rem; border: 1px solid transparent; border-radius: 5px; background:linear-gradient(180deg,#c2e8f3,var(--accent)); box-shadow:0 7px 16px rgb(2 8 13 / 16%),inset 0 1px 0 rgb(255 255 255 / 55%); color: var(--localis-blue-ink); font-size: 0.95rem; line-height: 1.3; white-space: nowrap; transition: background 160ms ease,transform 160ms var(--localis-ease),box-shadow 160ms ease; }
.button:hover { background: var(--localis-blue-hover); transform: translateY(-2px); }
.button:active { transform: scale(0.97); }
.button-small { min-height: 44px; font-size: 0.8rem; padding: 0.65rem 1rem; gap: 1rem; }
.button .icon { width: 1.15rem; height: 1.15rem; }
.text-link { display: inline-flex; align-items: center; gap: 1.5rem; min-height: 44px; color: var(--accent); font-size: 0.95rem; }
.text-link .icon { transition: transform 160ms var(--localis-ease); }
.text-link:hover .icon { transform: translateX(4px); }
.menu-toggle { display: none; border: 1px solid var(--rule); border-radius: 5px; padding: 0.5rem 1rem; min-height: 44px; background: var(--localis-ground); }
[data-localis-story] [data-sc-copy] { opacity:1; pointer-events:auto; will-change:auto; }
.hero { position: relative; }
.hero-stage { position: relative; height: 100svh; min-height: 650px; overflow: hidden; isolation: isolate; background: #0b131a; }
.hero-stage::after { content:""; position:absolute; inset:0; z-index:0; pointer-events:none; background:radial-gradient(ellipse at 57% 58%,transparent 28%,rgb(3 9 14 / 32%) 100%),linear-gradient(0deg,rgb(3 9 14 / 18%),transparent 40%); }
.station-scene { position: absolute; inset: 0; z-index: -1; }
.station-canvas,.scene-poster,.scene-poster img { display: block; width: 100%; height: 100%; position: absolute; inset: 0; }
.scene-poster img { object-fit: cover; }
.station-canvas { opacity: 0; transition: opacity 350ms ease; }
.is-rendered .station-canvas { opacity: 1; }
.is-rendered .scene-poster { opacity: 0; }
.hero-start { position: absolute; top: clamp(115px,14vh,180px); left: var(--gutter); width: fit-content; max-width: calc(100% - var(--gutter)*2); z-index: 1; pointer-events: none; }
.hero-start h1 { font-size: clamp(4.5rem,8.25vw,9rem); line-height: 0.99; }
.hero-start h1 span { color: var(--accent); }
.hero-action { position: absolute; z-index: 4; left: var(--gutter); bottom: 5vh; }
.hero-action p { color: var(--muted); font-size: 1rem; line-height: 1.5; }
.hero-action .text-link { margin-top: 0.6rem; }
.scene-caption { position: absolute; z-index: 4; right: var(--gutter); bottom: 5vh; color: var(--muted); font-size: 0.7rem; }
.hero-end { display: none; position: absolute; z-index: 3; top: 29%; left: var(--gutter); width: fit-content; max-width:39%; pointer-events: none; }
.hero-end h2 { font-size: clamp(3rem,5vw,5.5rem); line-height: 1.04; }
.hero-end p { color: var(--muted); margin-top: 1.7rem; font-size: 1.05rem; }
.core-label { display: block; margin-top: 2rem; color: var(--accent); font-size: 0.8rem; }
.scene-enhanced .hero-start { opacity: clamp(0,calc(1 - var(--sc-p,0) * 4),1); transform: translateY(calc(var(--sc-p,0) * -90px)); }
.scene-enhanced .hero-end { display: block; opacity: clamp(0,calc((var(--sc-p,0) - 0.23) * 5),1); transform: translateY(calc(20px - min(var(--sc-p,0) * 50px,20px))); }
.local-statement { position: relative; padding-block: clamp(5rem,9vw,10rem); background:linear-gradient(125deg,#142936 0%,#101e28 42%,#0b131a 85%); box-shadow:inset 0 1px 0 rgb(160 219 237 / 9%); }
.statement-layout { display:grid; grid-template-columns:1.4fr 0.85fr; align-items:center; gap:10%; }
.statement-context { color:var(--ink); font-size:1.15rem; margin-block:2rem 1rem; }
.ink-statement { font-size: clamp(3rem,5.8vw,5.5rem); line-height: 1.12; }
.ink-statement span { color: #829eaf; transition: color 160ms ease; }
.ink-statement span.is-inked { color: var(--ink); }
.statement-detail { color:var(--muted); font-size:0.95rem; max-width:38ch; }
.core-emblem { display:grid; place-items:center; width:112px; height:112px; border-radius:12px; background:var(--material-face); box-shadow:var(--material-shadow); color:var(--accent); }
.core-emblem .icon { width:64px; height:64px; stroke-width:1.1; filter:drop-shadow(0 3px 2px rgb(2 8 13 / 45%)); }
.boundary-section { padding-block: clamp(5rem,8vw,9rem); background:linear-gradient(125deg,#e0f0f3 0%,#c9e7ee 48%,#b2d3de 100%); color: #132e3c; --sc-ink:#132e3c; --sc-ink-soft:#365765; }
.boundary-intro { display: flex; align-items: end; justify-content: space-between; gap: 3rem; margin-bottom: 3rem; }
h2 { font-size: clamp(2.5rem,4.3vw,4.5rem); line-height: 1.08; }
.boundary-intro h2 span { color: #3d697a; }
.boundary-intro > p { color: #365765; font-size: 0.95rem; }
.boundary-workbench { border-top:1px solid rgb(79 120 139 / 45%); }
.boundary-options { display: flex; align-items: center; gap: 0.75rem; padding-block: 1.5rem 2.5rem; }
.boundary-options button { display: inline-flex; gap: 0.7rem; align-items: center; min-height: 48px; border: 1px solid #607d8c; border-radius: 5px; padding: 0.7rem 1.2rem; background: transparent; color: #193b4c; cursor: pointer; transition: background 160ms ease,color 160ms ease,transform 160ms ease; }
.boundary-options button[aria-pressed="true"] { background:linear-gradient(150deg,#2b5266,#173848); color:#e9f4f8; border-color:transparent; box-shadow:0 5px 10px rgb(19 46 60 / 15%),inset 0 1px 0 rgb(255 255 255 / 20%); }
.boundary-options button:hover { background: #a9d3e1; color: #173848; }
.boundary-options button:active { transform: scale(0.97); }
.boundary-options button:focus-visible { outline-color: #173848; }
.boundary-map { display: grid; grid-template-columns: 1fr 0.24fr 1fr; gap: 1rem; align-items: center; }
.boundary-node { position: relative; display: flex; gap: 2rem; align-items: center; padding: 3rem 2.5rem; min-height: 290px; border-radius: 12px; background:linear-gradient(145deg,#d0e6ed,#b3d3df); box-shadow:var(--paper-shadow); transition:background 240ms ease,transform 240ms var(--localis-ease),box-shadow 240ms ease; }
.local-node { background:linear-gradient(145deg,#f5fbfc,#d8ecf2); transform:translateY(-6px); }
.boundary-node h3 { font-size: clamp(1.5rem,2.5vw,2.25rem); letter-spacing: -0.025em; line-height: 1.2; }
.node-location { display: block; margin-bottom: 0.6rem; font-size: 0.75rem; color: #365765; }
.boundary-node p { margin-top: 1rem; color: #365765; font-size: 0.9rem; }
.node-state { position: absolute; right: 1.5rem; bottom: 1rem; color: #365765; font-size: 0.7rem; }
.local-symbol { position:relative; display:flex; justify-content:center; align-items:center; gap:5px; min-width:88px; height:104px; padding:13px 13px 19px; border-radius:5px; background:var(--material-face); transform:perspective(400px) rotateY(-20deg) rotateX(8deg); box-shadow:10px 16px 22px rgb(19 46 60 / 22%),inset 1px 1px 0 rgb(237 243 245 / 32%); }
.local-symbol::after { content:""; position:absolute; right:11px; bottom:9px; width:5px; height:5px; border-radius:50%; background:#a0dbed; }
.local-symbol span { display:block; height:100%; width:4px; border-radius:2px; background:linear-gradient(90deg,#7197a8,#2c4b5d); box-shadow:1px 0 1px rgb(2 8 13 / 60%); }
.hosted-symbol { width:92px; height:82px; color:#365b70; fill:#e7f3f7; stroke-width:1.1; filter:drop-shadow(3px 9px 6px rgb(19 46 60 / 20%)); }
.connection-track { position: relative; height: 1px; background: #7198aa; }
.connection-track .icon { position: absolute; right: -5px; top: -11px; }
.connection-packet { position: absolute; top: -3px; width: 7px; height: 7px; border-radius: 50%; background: #173848; transform: translateX(0); opacity: 0; }
[data-mode="access"] .local-node { background:linear-gradient(145deg,#d0e6ed,#b3d3df); transform:none; }
[data-mode="access"] .hosted-node { background:linear-gradient(145deg,#f5fbfc,#d8ecf2); transform:translateY(-6px); }
.boundary-workbench.is-tracing .connection-packet { animation: trace-connection 650ms var(--localis-ease); }
@keyframes trace-connection { 0% { opacity:1; transform:translateX(0); } 90% { opacity:1; } 100% { opacity:0; transform:translateX(7vw); } }
.boundary-explanation { display: flex; justify-content: space-between; align-items: start; gap: 3rem; padding-top: 2rem; margin-top: 2rem; border-top: 1px solid #83aab9; }
.boundary-explanation p { max-width: 65ch; color: #365765; font-size: 0.95rem; }
.architecture-label { color: #365765; font-size: 0.7rem; text-align: right; }
.boundary-fallback { margin-top: 2rem; }
.workplace { position: relative; isolation: isolate; min-height: 650px; height: 84vh; overflow: hidden; background: #0b131a; }
.workplace-media { position:absolute; inset:-15% 0; z-index:-2; }
.workplace-media img { width:100%; height:100%; object-fit:cover; object-position:65% 50%; }
.workplace::after { content:""; position:absolute; z-index:-1; inset:0; background:linear-gradient(90deg,#0b131a 0%,rgb(11 19 26 / 85%) 25%,transparent 65%); }
.workplace-copy { padding-top:15vh; }
.workplace h2 { width:fit-content; max-width:60%; font-size:clamp(3rem,5.2vw,5.5rem); line-height:1.06; }
.workplace h2 span { color:var(--accent); }
.workplace-copy p { width:fit-content; max-width:100%; margin-top:2rem; color:var(--muted); font-size:1.05rem; }
.workplace-caption { position:absolute; bottom:2rem; left:var(--gutter); width:fit-content; max-width:calc(100% - var(--gutter)*2); padding:0.35rem 0.6rem; background:#0b131a; color:var(--muted); font-size:0.7rem; }
.organisation { position:relative; display:grid; grid-template-columns:1.15fr 1fr; gap:12%; padding-block:clamp(6rem,10vw,11rem); }
.organisation-symbol { margin-bottom:2rem; color:var(--accent); }
.organisation-symbol .icon { width:56px; height:56px; stroke-width:1.1; }
.organisation-heading > p { color:var(--muted); margin-top:1.7rem; font-size:1.05rem; }
.organisation-heading .text-link { margin-top:1.5rem; }
.organisation-features article { display:flex; gap:1.6rem; align-items:start; padding-block:2.2rem; border-bottom:1px solid var(--rule); }
.organisation-features article:first-child { padding-top:0.3rem; }
.feature-emblem { display:grid; place-items:center; flex:0 0 76px; width:76px; height:76px; border-radius:12px; background:var(--material-face); box-shadow:var(--material-shadow); }
.organisation-features .icon { color:var(--accent); width:40px; height:40px; stroke-width:1.25; filter:drop-shadow(0 2px 1px rgb(2 8 13 / 40%)); }
.organisation-features h3 { font-size:1.4rem; letter-spacing:-0.02em; }
.organisation-features p { color:var(--muted); font-size:0.95rem; line-height:1.65; margin-top:0.65rem; }
.questions { display:grid; grid-template-columns:1fr 1.3fr; gap:10%; padding:clamp(2rem,4.5vw,4.5rem); margin-bottom:clamp(5rem,8vw,9rem); border-radius:12px; background:linear-gradient(135deg,#192e3c,#111f29 55%,#0d1922); box-shadow:0 26px 54px rgb(2 8 13 / 22%),inset 0 1px 0 rgb(160 219 237 / 13%); }
.questions-heading > .icon { width:40px; height:40px; color:var(--accent); stroke-width:1.2; margin-bottom:1.6rem; }
.question-list { border-top:1px solid var(--rule); }
.question-list details { border-bottom:1px solid var(--rule); }
.question-list summary { display:flex; align-items:center; justify-content:space-between; gap:1.5rem; min-height:82px; padding-block:1.3rem; list-style:none; cursor:pointer; font-size:1rem; }
.question-list summary::-webkit-details-marker { display:none; }
.question-list summary .icon { width:1.75rem; height:1.75rem; padding:0.35rem; border-radius:50%; background:#233d4d; color:var(--accent); transition:transform 180ms var(--localis-ease),background 160ms ease; }
.question-list summary:hover .icon { background:#315367; }
.question-list details[open] summary .icon { transform:rotate(45deg); }
.question-list details > p { color:var(--muted); max-width:65ch; font-size:0.95rem; padding-bottom:1.7rem; }
.closing { padding-top:clamp(4rem,7vw,7rem); background:linear-gradient(145deg,#c2e8f1 0%,#a0dbed 48%,#72adc3 100%); box-shadow:inset 0 1px 0 rgb(237 243 245 / 60%); color:#132e3c; --sc-ink:#132e3c; --sc-ink-soft:#365765; }
.closing-top { display:flex; align-items:end; justify-content:space-between; gap:3rem; }
.closing h2 { font-size:clamp(2.75rem,4.5vw,4.5rem); }
.closing-top p { margin-bottom:1rem; }
.closing-prompt { display:flex; align-items:center; gap:0.75rem; }
.closing-prompt .icon { width:1.2rem; height:1.2rem; }
.closing .button { background:linear-gradient(145deg,#2d5569,#173848); color:#e9f4f8; box-shadow:0 8px 16px rgb(19 46 60 / 20%),inset 0 1px 0 rgb(237 243 245 / 20%); }
.closing .button:hover { background:#28526a; }
.closing :focus-visible { outline-color:#173848; }
.closing-wordmark { display:flex; align-items:start; padding-inline:3.5vw; margin-top:4.5vw; font-size:29.3vw; line-height:0.93; letter-spacing:-0.04em; overflow:hidden; text-shadow:0 10px 20px rgb(19 46 60 / 12%); }
.closing-wordmark span { margin-top:3vw; margin-left:1vw; font-size:2vw; letter-spacing:0; }
.site-footer { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:1.5rem; padding-block:2rem; margin-top:2rem; border-top:1px solid #79aabd; color:#132e3c; font-size:0.75rem; }
.site-footer a { display:flex; align-items:center; gap:1rem; min-height:44px; }
.site-footer a .icon { width:1.1rem; height:1.1rem; }
@media(min-width:1800px){ .hero-start { left:max(var(--gutter),calc((100vw - 1600px)/2)); } }
@media(max-width:1100px){ .site-header { gap:3vw; } .site-navigation { font-size:0.75rem; gap:1rem; } .section-links { gap:1.25rem; } .button-small { gap:0.75rem; } .boundary-node { gap:1.2rem; padding-inline:1.5rem; } .local-symbol { min-width:60px; height:80px; } .hosted-symbol { width:65px; } }
@media(max-width:800px){
  :root { --header-height:4rem; }
  .site-header { position:relative; flex-wrap:wrap; padding-block:0.5rem; }
  .brand { font-size:1.7rem; }
  .menu-toggle { display:inline-flex; align-items:center; gap:0.75rem; margin-left:auto; }
  .menu-lines { width:15px; height:8px; border-block:1px solid; }
  .site-navigation { flex-basis:100%; flex-direction:column; align-items:stretch; padding-top:1rem; gap:1.2rem; }
  .section-links { justify-content:space-between; flex-wrap:wrap; gap:0.25rem 1rem; font-size:0.85rem; }
  .account-links { justify-content:space-between; }
  .navigation-ready .site-navigation { display:none; }
  .navigation-ready .site-navigation.is-open { display:flex; }
  .hero-stage { height:100svh; min-height:660px; }
  .hero-start { top:16vh; }
  .hero-start h1 { font-size:clamp(2.6rem,8.5vw,4.8rem); line-height:1.02; }
  .hero-action { bottom:5vh; }
  .hero-action p { font-size:0.9rem; }
  .scene-caption { bottom:3vh; font-size:0.6rem; }
  .hero-end { top:calc(var(--header-height) + 1rem); width:calc(100% - var(--gutter)*2); max-width:none; }
  .hero-end h2 { font-size:2.5rem; }
  .hero-end p { margin-top:1rem; font-size:0.9rem; }
  .core-label { display:none; }
  .local-statement { padding-block:5rem; }
  .statement-layout { grid-template-columns:1fr; gap:2.5rem; }
  .statement-context { margin-block:1.6rem 0.8rem; font-size:1.1rem; }
  .ink-statement { font-size:clamp(2.8rem,9.5vw,5rem); max-width:100%; }
  .statement-detail { max-width:55ch; }
  .core-emblem { width:88px; height:88px; }
  .core-emblem .icon { width:52px; height:52px; }
  .boundary-intro { display:block; }
  h2 { font-size:clamp(2.25rem,6.5vw,3.5rem); }
  .boundary-intro > p { margin-top:1.5rem; }
  .boundary-options { gap:0.5rem; }
  .boundary-options button { font-size:0.8rem; gap:0.5rem; padding:0.7rem 0.8rem; }
  .boundary-options .icon { width:1.15rem; height:1.15rem; }
  .boundary-map { grid-template-columns:1fr; gap:1.75rem; }
  .boundary-node { min-height:240px; padding:2.5rem 2rem; gap:2rem; }
  .boundary-node h3 { font-size:1.8rem; }
  .connection-track { width:1px; height:40px; margin-inline:auto; }
  .connection-track .icon { transform:rotate(90deg); top:20px; right:-11px; }
  .connection-packet { display:none; }
  .boundary-explanation { display:block; }
  .architecture-label { display:block; margin-top:1.5rem; text-align:left; }
  .workplace { height:76vh; min-height:580px; }
  .workplace::after { background:linear-gradient(180deg,#0b131a 0%,rgb(11 19 26 / 90%) 32%,transparent 70%); }
  .workplace-media img { object-position:67% 50%; }
  .workplace-copy { padding-top:4rem; }
  .workplace h2 { max-width:100%; font-size:clamp(2.5rem,8vw,4rem); }
  .workplace-copy p { margin-top:1.5rem; font-size:0.9rem; }
  .workplace-caption { max-width:65%; font-size:0.6rem; }
  .organisation,.questions { grid-template-columns:1fr; gap:2.5rem; }
  .organisation { padding-block:5rem; }
  .questions { padding:2rem 1.5rem; margin-bottom:5rem; gap:2rem; }
  .feature-emblem { flex-basis:60px; width:60px; height:60px; }
  .organisation-features .icon { width:32px; height:32px; }
  .organisation-features article { gap:1.25rem; }
  .closing-top { display:block; }
  .closing-top > div { margin-top:2rem; }
  .closing h2 { font-size:clamp(2.4rem,8vw,4rem); }
  .closing-wordmark { font-size:29.3vw; margin-top:3rem; padding-inline:3vw; }
  .closing-wordmark span { font-size:3vw; }
  .site-footer { gap:0.5rem 1.5rem; padding-block:1.5rem; margin-top:1rem; font-size:0.7rem; }
  .site-footer > span:first-child { width:100%; }
}
@media(max-width:380px){ .hero-stage { min-height:620px; } .hero-start { top:18vh; } .hero-start h1 { font-size:2.6rem; } .hero-end h2 { font-size:2.4rem; } .boundary-node { padding-inline:1.4rem; gap:1.4rem; } .scene-caption { font-size:0.55rem; } }
@media(max-width:800px) and (max-height:700px){ .hero-end { top:calc(var(--header-height) + 0.5rem); } .hero-end h2 { font-size:2rem; } .hero-end p { margin-top:0.5rem; font-size:0.8rem; } }
@media(prefers-reduced-motion:reduce){
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation:none !important; transition:none !important; }
  .hero.sc-act--pinned { height:auto !important; }
  .hero .sc-stage { position:relative; }
  .scene-enhanced .hero-start { opacity:1; transform:none; }
  .scene-enhanced .hero-end { display:none; }
  [data-sc-reveal],[data-sc-in] { clip-path:none !important; opacity:1 !important; transform:none !important; }
  .ink-statement span { color:var(--ink); }
}

.navigation-ready .site-header { position:fixed; max-height:100svh; overflow-y:auto; }
.scene-enhanced .hero-stage { position:sticky; top:0; }
@media(prefers-reduced-motion:reduce){ .scene-enhanced .hero-stage { position:relative; } }