/* voyagerlabs.io — page-level styles on top of tokens.css and components.css */
@font-face{font-family:"Lilita One";src:url("../fonts/LilitaOne.woff2") format("woff2");font-display:swap}
html{background:var(--void);scroll-behavior:smooth}
body{margin:0;background:var(--void)}
a{color:var(--orbit)}a:hover{color:var(--orbit-hover)}
.skip{position:absolute;left:-9999px;top:8px;background:var(--starlight);color:var(--void);padding:8px 12px;border-radius:var(--radius-md);z-index:10}
.skip:focus{left:8px}
.vl-card-mark .vl-patch{margin:4px 0}

/* grids */
.grid-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px}
.grid-3{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px}
.grid-2{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:48px;align-items:start}
.mb-64{margin-bottom:64px}

/* principle tiles (home) */
.tile{display:flex;flex-direction:column;gap:12px;padding-top:20px;border-top:1px solid var(--starlight)}
.num{font-family:var(--font-mono);font-size:12px;letter-spacing:.08em;color:var(--dust)}
.h3{margin:0;font-size:20px;font-weight:600;letter-spacing:-0.02em;color:var(--starlight)}
.p{margin:0;font-size:15px;line-height:1.55;color:var(--haze)}
.p-lg{margin:0;font-size:17px;line-height:1.55;color:var(--haze)}

/* contact */
.stack{display:flex;flex-direction:column;align-items:flex-start;gap:24px}
.email{font-size:clamp(28px,3.4vw,44px);font-weight:500;letter-spacing:-0.04em;line-height:1.1;color:var(--starlight);text-decoration:none;overflow-wrap:anywhere}
.email:hover{color:var(--haze)}
.email-xl{font-size:clamp(32px,4.4vw,64px);letter-spacing:-0.045em;line-height:1.05}
.row-between{display:flex;flex-wrap:wrap;gap:24px;align-items:center;justify-content:space-between}

/* fleet page */
.studio{display:flex;flex-wrap:wrap;gap:48px;align-items:flex-start}
.studio-text{flex:1 1 380px;min-width:0;display:flex;flex-direction:column;gap:24px}
.studio-meta{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.studio-name{margin:0;font-size:clamp(36px,4vw,56px);font-weight:500;letter-spacing:-0.04em;line-height:1;color:var(--starlight)}
.studio-visual{flex:1.4 1 520px;min-width:0;border-radius:var(--radius-md);overflow:hidden;aspect-ratio:16/10;box-sizing:border-box}
@media (max-width:600px){.studio-visual{flex-basis:100%}.visual-enq{aspect-ratio:auto}}
.visual-art{border:1px solid var(--rule);background:var(--panel)}
.visual-art img{width:100%;height:100%;object-fit:cover;display:block}
.visual-fdg{background:#2b5cff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:28px;padding:32px}
.fdg-word{font-family:"Lilita One",sans-serif;font-size:clamp(40px,5vw,72px);line-height:1;color:#fff;-webkit-text-stroke:10px #140f33;paint-order:stroke fill;text-align:center}
.fdg-meter{display:flex;gap:8px}
.fdg-meter span{width:56px;height:20px;border-radius:999px;background:#efeef6;border:3px solid #140f33}
.fdg-meter span.on{background:#ffd023}
@media (max-width:600px){.fdg-meter span{width:36px}}
.visual-enq{border:1px solid var(--rule);background:#1b1e22;display:flex;flex-direction:column;justify-content:center;gap:16px;padding:clamp(20px,4vw,56px);font-family:system-ui,-apple-system,"Segoe UI",sans-serif}
.enq-next{border:1px solid #454d57;border-radius:10px;background:#2f353b;padding:20px 24px;display:flex;flex-direction:column;gap:8px}
.enq-k{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#9aa2ab}
.enq-t{font-size:18px;font-weight:600;color:#eef1f4}
.enq-s{font-size:14px;color:#9aa2ab}
.enq-m{font-size:12px;color:#78808a}
.enq-row{border:1px solid #343b43;border-radius:10px;background:#24282d;padding:16px 24px;display:flex;justify-content:space-between;gap:12px;font-size:15px;color:#d3d7dc}
.enq-cmd{border:1px solid #6b747e;border-radius:6px;background:#24282d;padding:14px 18px;font-size:15px;color:#d3d7dc}

/* how we work */
.principle{display:flex;flex-wrap:wrap;gap:16px 24px;padding:32px 0;border-top:1px solid var(--rule)}
.principle:first-child{border-top-color:var(--starlight)}
.principle:last-child{border-bottom:1px solid var(--rule)}
.principle .num{flex:0 0 120px;padding-top:10px}
.principle h3{flex:1 1 320px;margin:0;font-size:clamp(26px,2.6vw,36px);font-weight:500;letter-spacing:-0.03em;line-height:1.1;color:var(--starlight)}
.principle p{flex:1.2 1 380px;margin:0;font-size:17px;line-height:1.55;color:var(--haze)}
.tree{display:flex;flex-direction:column;align-items:center;margin-bottom:64px}
.tree-stem{width:1px;height:32px;background:var(--starlight)}
.tree-row{width:100%;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:24px;padding-top:24px;border-top:1px solid var(--starlight)}
.tree-node{display:flex;align-items:center;gap:16px;padding:20px;border:1px solid var(--rule);border-radius:var(--radius-md);background:var(--hull);text-decoration:none;transition:border-color .15s}
.tree-node:hover{border-color:var(--dust)}
.tree-node .code{font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;color:var(--dust)}
.tree-node .name{font-size:20px;font-weight:500;letter-spacing:-0.02em;color:var(--starlight)}
.tree-node .txt{display:flex;flex-direction:column;gap:4px}
.endorse-tile{display:flex;align-items:center;justify-content:center;padding:32px;border:1px solid var(--rule);border-radius:var(--radius-md);background:var(--hull)}

