/* MARSHAL® — shared styles for standalone pages (studio, careers, legal) */
:root{--obsidian:#08080A;--void:#050507;--bone:#F4F1EA;--blue:#3D5AFE;--blue-2:#5570ff;
  --dim:#8B887F;--dim-2:#6a6860;--line:rgba(244,241,234,.10);
  --disp:'Bricolage Grotesque',sans-serif;--serif:'Fraunces',serif;--body:'Satoshi',sans-serif;}
*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{background:var(--void);color:var(--bone);font-family:var(--body);-webkit-font-smoothing:antialiased;
  line-height:1.6;overflow-x:hidden;
  background-image:radial-gradient(48% 48% at 80% 4%,rgba(61,90,254,.11),transparent 70%),radial-gradient(44% 44% at 8% 96%,rgba(61,90,254,.06),transparent 70%);
  background-attachment:fixed}
::selection{background:var(--blue);color:#fff}
.reg{font-size:.34em;vertical-align:.85em;font-weight:500;font-family:var(--body)}
img{max-width:100%;display:block}

/* ===== top bar ===== */
.tbar{position:sticky;top:0;z-index:50;display:flex;justify-content:space-between;align-items:center;
  padding:18px 34px;background:rgba(5,5,7,.74);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line)}
.tbar .bm{font-family:var(--disp);font-weight:700;font-size:20px;letter-spacing:-.01em;text-decoration:none;color:var(--bone)}
.tbar .bm .reg{font-size:.4em;vertical-align:.7em}
.tbar .back{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--dim);text-decoration:none;transition:color .25s}
.tbar .back:hover{color:var(--bone)}

/* ===== page hero ===== */
.phero{max-width:1000px;margin:0 auto;padding:104px 34px 36px}
.phero .kick{font-size:11px;letter-spacing:.34em;text-transform:uppercase;color:var(--blue-2);margin-bottom:24px;display:flex;align-items:center;gap:13px}
.phero .kick::before{content:"";width:30px;height:1px;background:var(--blue)}
.phero h1{font-family:var(--disp);font-weight:700;font-size:clamp(42px,7.4vw,88px);letter-spacing:-.03em;line-height:.95}
.phero .lede{margin-top:26px;font-family:var(--serif);font-size:clamp(18px,2.1vw,27px);font-style:italic;color:var(--dim);max-width:44ch;line-height:1.42}
.phero .meta{margin-top:20px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim-2)}

/* ===== prose ===== */
.prose{max-width:760px;margin:0 auto;padding:30px 34px 100px}
.prose h2{font-family:var(--disp);font-weight:600;font-size:clamp(22px,3vw,33px);letter-spacing:-.02em;margin:56px 0 16px;line-height:1.1}
.prose h2:first-child{margin-top:18px}
.prose h3{font-family:var(--disp);font-weight:600;font-size:18px;margin:34px 0 10px;color:var(--bone)}
.prose p{color:#cfccc4;margin:0 0 16px;font-size:16px}
.prose ul{list-style:none;margin:0 0 20px}
.prose li{position:relative;padding-left:24px;margin:0 0 11px;color:#cfccc4;font-size:16px}
.prose li::before{content:"";position:absolute;left:2px;top:11px;width:6px;height:6px;background:var(--blue);border-radius:50%}
.prose a.inl{color:var(--bone);border-bottom:1px solid var(--blue);text-decoration:none;transition:color .2s}
.prose a.inl:hover{color:var(--blue-2)}
.prose strong{color:var(--bone);font-weight:600}
.prose .rule{height:1px;background:var(--line);margin:46px 0}
.prose .small{font-size:13px;color:var(--dim-2);line-height:1.7}

/* ===== feature cards (studio / careers) ===== */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:16px;overflow:hidden;margin:40px 0}
.cards .c{background:var(--void);padding:32px 26px}
.cards .c .n{font-family:var(--disp);color:var(--blue-2);font-size:13px;letter-spacing:.08em;margin-bottom:14px}
.cards .c h3{font-family:var(--disp);font-weight:600;font-size:19px;margin-bottom:9px;letter-spacing:-.01em}
.cards .c p{font-size:14px;color:var(--dim);line-height:1.55}

/* ===== role list (careers) ===== */
.roles{margin:40px 0}
.role{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:24px 6px;border-top:1px solid var(--line);text-decoration:none;color:var(--bone);transition:padding .3s,background .3s}
.role:last-of-type{border-bottom:1px solid var(--line)}
.role:hover{padding-left:16px}
.role .rl .rt{font-family:var(--disp);font-weight:600;font-size:clamp(19px,2.5vw,25px);letter-spacing:-.01em}
.role .rl .rd{font-size:13px;color:var(--dim);margin-top:4px}
.role .rm{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim-2);white-space:nowrap}
.role .ra{color:var(--blue-2);font-size:20px;line-height:1}

/* ===== cta band ===== */
.band{max-width:1000px;margin:0 auto 96px;padding:0 34px}
.band .inner{border:1px solid var(--line);border-radius:22px;padding:54px 40px;background:linear-gradient(150deg,rgba(61,90,254,.10),transparent 64%);text-align:center}
.band h2{font-family:var(--disp);font-weight:700;font-size:clamp(28px,4.4vw,46px);letter-spacing:-.025em;margin-bottom:14px;line-height:1}
.band p{color:var(--dim);margin:0 auto 28px;max-width:46ch}
.band a.btn{display:inline-flex;align-items:center;gap:10px;background:var(--bone);color:#0a0a0b;font-family:var(--disp);font-weight:600;font-size:16px;padding:15px 30px;border-radius:50px;text-decoration:none;transition:transform .25s,background .25s}
.band a.btn:hover{transform:translateY(-2px);background:#fff}

/* ===== footer (shared with homepage) ===== */
.ftr{position:relative;z-index:2;background:var(--void);padding:88px 34px 40px;border-top:1px solid var(--line)}
.ftr-top{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:48px;max-width:1380px;margin:0 auto;align-items:start}
.ftr-brand .fbm{font-family:var(--disp);font-weight:700;font-size:clamp(46px,7vw,104px);letter-spacing:-.03em;line-height:.82}
.ftr-brand .ftag{margin-top:20px;font-family:var(--serif);font-style:italic;font-size:clamp(15px,1.4vw,19px);color:var(--dim);max-width:22ch;line-height:1.4}
.ftr-brand .floc{margin-top:24px;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--dim-2);line-height:2.1}
.ftr-brand .floc a{color:var(--bone);text-decoration:none;border-bottom:1px solid var(--line);transition:border-color .25s}
.ftr-brand .floc a:hover{border-color:var(--blue)}
.ftcol h4{font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--dim-2);margin-bottom:18px;font-weight:600}
.ftcol a{display:block;color:var(--dim);text-decoration:none;font-size:14px;letter-spacing:.01em;padding:7px 0;transition:color .25s,transform .25s}
.ftcol a:hover{color:var(--bone);transform:translateX(3px)}
.ftr-bot{max-width:1380px;margin:66px auto 0;padding-top:24px;border-top:1px solid var(--line);display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px 32px;align-items:center}
.ftr-bot .legal{font-size:11px;letter-spacing:.05em;color:var(--dim-2);line-height:1.75;max-width:66ch}
.ftr-bot .legal b{color:var(--dim);font-weight:600}
.ftr-bot .fcopy{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim-2);white-space:nowrap}

@media(max-width:880px){
  .phero{padding:84px 22px 28px}.prose{padding:24px 22px 80px}
  .cards{grid-template-columns:1fr}
  .band{padding:0 22px}.band .inner{padding:40px 26px}
  .ftr{padding:60px 22px 36px}.ftr-top{grid-template-columns:1fr 1fr;gap:38px 24px}.ftr-brand{grid-column:1 / -1}
  .ftr-bot{flex-direction:column;align-items:flex-start;margin-top:48px}
}
@media(max-width:460px){.ftr-top{grid-template-columns:1fr 1fr}.ftr-brand .fbm{font-size:clamp(42px,16vw,64px)}.role{flex-wrap:wrap;gap:8px}.role .rm{order:3}}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}