/* CodeWarrior — shared ops-brief design system (new pages: labs, services, work) */
:root{
  --ink:#0E1115; --ink-2:#161B22; --surface:#1C232B; --surface-2:#232B35;
  --rule:#2E3742; --rule-bright:#424C58;
  --bone:#E8E4D7; --bone-dim:#A0A39E; --bone-mute:#808480;
  --signal:#B8945E; --signal-bright:#D4B380; --signal-soft:rgba(184,148,94,.12);
  --alive:#7BA682; --steel:#6B829A; --warn:#D9A05B; --danger:#C86B62;
  --logo-url:url('/assets/logo.jpg');
  --display:'Archivo',system-ui,sans-serif; --body:'Inter',system-ui,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,monospace;
  --gutter:clamp(1.25rem,3vw,2.5rem); --max:1080px;
}
*,*::before,*::after{box-sizing:border-box;}
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{margin:0;font-family:var(--body);background:var(--ink);color:var(--bone);
  line-height:1.6;font-size:16px;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden;}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:1;
  background-image:radial-gradient(rgba(237,234,224,.025) 1px,transparent 1px);background-size:3px 3px;opacity:.6;mix-blend-mode:overlay;}
a{color:var(--signal);text-decoration:none;} a:hover{color:var(--signal-bright);}
img,svg{display:block;max-width:100%;}
.wrap{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--gutter);position:relative;z-index:2;}
:focus-visible{outline:2px solid var(--signal);outline-offset:3px;}

/* NAV */
.nav{position:sticky;top:0;z-index:50;background:rgba(11,14,13,.85);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--rule);}
.nav__inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-block:1rem;max-width:1320px;margin-inline:auto;padding-inline:var(--gutter);}
.brand{display:flex;align-items:center;gap:.7rem;}
.brand__mark{width:40px;height:40px;border-radius:50%;background:var(--ink-2) var(--logo-url) center/cover no-repeat;border:1px solid var(--rule-bright);flex-shrink:0;transition:border-color .2s;}
.brand:hover .brand__mark{border-color:var(--signal);}
.brand__name{font-family:var(--display);font-weight:800;font-size:1rem;letter-spacing:.14em;color:var(--bone);}
.brand__name span{color:var(--signal);}
.nav__links{display:flex;gap:1.4rem;align-items:center;}
.nav__links a{font-family:var(--mono);font-size:.78rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--bone-dim);transition:color .15s;}
.nav__links a:hover,.nav__links a[aria-current]{color:var(--signal);}
.nav__cta{background:var(--signal);color:var(--ink)!important;padding:.55rem 1rem;border-radius:2px;font-family:var(--mono);font-size:.75rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;}
.nav__cta:hover{background:var(--signal-bright);}
.nav__toggle{display:none;background:none;border:1px solid var(--rule-bright);border-radius:3px;color:var(--bone);font-size:1.2rem;line-height:1;padding:.3rem .55rem;cursor:pointer;}
@media(max-width:760px){
  .nav__inner{position:relative;}
  .nav__toggle{display:block;}
  .nav__links{display:none;position:absolute;top:calc(100% + 1px);left:0;right:0;flex-direction:column;align-items:stretch;gap:0;background:var(--ink-2);border-bottom:1px solid var(--rule);padding:.3rem var(--gutter) 1rem;}
  .nav__links.is-open{display:flex;}
  .nav__links a{padding:.75rem 0;border-bottom:1px solid var(--rule);}
  .nav__links a.nav__cta{margin-top:.7rem;border-bottom:none;text-align:center;}
}

/* PAGE HEADER */
.page-head{padding-block:clamp(3rem,7vw,5rem) clamp(2rem,4vw,3rem);border-bottom:1px solid var(--rule);position:relative;overflow:hidden;}
.page-head::after{content:"";position:absolute;inset:0;background-image:linear-gradient(var(--rule) 1px,transparent 1px),linear-gradient(90deg,var(--rule) 1px,transparent 1px);background-size:64px 64px;mask-image:radial-gradient(ellipse 60% 70% at 25% 50%,#000 30%,transparent 80%);-webkit-mask-image:radial-gradient(ellipse 60% 70% at 25% 50%,#000 30%,transparent 80%);opacity:.28;z-index:0;pointer-events:none;}
.page-head .wrap{position:relative;z-index:2;}
.eyebrow{font-family:var(--mono);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--signal);margin-bottom:1rem;}
.eyebrow::before{content:"[ ";color:var(--bone-mute);} .eyebrow::after{content:" ]";color:var(--bone-mute);}
.page-title{font-family:var(--display);font-weight:900;font-size:clamp(2.2rem,5.5vw,3.9rem);line-height:1.02;letter-spacing:-.025em;margin:0;color:var(--bone);}
.page-title .accent{color:var(--signal);}
.lead{max-width:680px;margin:1.5rem 0 0;color:var(--bone-dim);font-size:clamp(1rem,1.3vw,1.15rem);}
.lead strong{color:var(--bone);font-weight:500;}

/* SECTIONS + PROSE */
main{padding-block:clamp(2.5rem,5vw,4rem);}
.sec{margin-bottom:clamp(2.2rem,4vw,3.4rem);}
.sec__label{font-family:var(--mono);font-size:.72rem;letter-spacing:.15em;text-transform:uppercase;color:var(--signal);margin-bottom:.7rem;}
h2.sec__title{font-family:var(--display);font-weight:700;font-size:clamp(1.4rem,2.3vw,1.8rem);letter-spacing:-.015em;color:var(--bone);margin:0 0 1rem;}
h3{font-family:var(--display);font-weight:600;font-size:1.15rem;color:var(--bone);margin:1.6rem 0 .6rem;}
p{color:var(--bone-dim);margin:0 0 1.1rem;}
p strong{color:var(--bone);font-weight:500;}
ul.ticks{list-style:none;padding:0;margin:0 0 1.3rem;}
ul.ticks li{position:relative;padding-left:1.5rem;margin-bottom:.6rem;color:var(--bone-dim);}
ul.ticks li::before{content:"▸";position:absolute;left:0;top:0;color:var(--signal);}
ul.ticks li strong{color:var(--bone);font-weight:500;}

/* CARDS + GRID */
.grid{display:grid;gap:1.2rem;}
.g2{grid-template-columns:repeat(2,1fr);} .g3{grid-template-columns:repeat(3,1fr);}
@media(max-width:760px){.g2,.g3{grid-template-columns:1fr;}}
.card{background:var(--ink-2);border:1px solid var(--rule);border-radius:3px;padding:1.5rem 1.6rem;transition:border-color .18s,transform .18s;display:block;}
a.card:hover{border-color:var(--signal);transform:translateY(-2px);}
.card__code{font-family:var(--mono);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--signal);margin-bottom:.6rem;}
.card__title{font-family:var(--display);font-weight:700;font-size:1.25rem;color:var(--bone);margin:0 0 .5rem;}
.card__desc{color:var(--bone-dim);font-size:.95rem;margin:0;}
.card__meta{margin-top:1rem;font-family:var(--mono);font-size:.72rem;letter-spacing:.06em;color:var(--bone-mute);text-transform:uppercase;}

/* STAT STRIP */
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--rule);border:1px solid var(--rule);margin:1.5rem 0;}
@media(max-width:560px){.stats{grid-template-columns:1fr;}}
.stats>div{background:var(--ink);padding:1.3rem 1.4rem;}
.stats .v{font-family:var(--display);font-weight:800;font-size:1.7rem;color:var(--signal-bright);line-height:1;}
.stats .k{font-family:var(--mono);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--bone-mute);margin-top:.5rem;}

/* PROCESS STEPS */
ol.steps{list-style:none;counter-reset:s;padding:0;margin:0;}
ol.steps li{counter-increment:s;position:relative;padding:0 0 1.1rem 3rem;color:var(--bone-dim);}
ol.steps li::before{content:counter(s,decimal-leading-zero);position:absolute;left:0;top:-.1rem;font-family:var(--mono);font-size:.8rem;font-weight:600;color:var(--signal);border:1px solid var(--signal);border-radius:2px;width:2rem;height:2rem;display:flex;align-items:center;justify-content:center;background:var(--signal-soft);}
ol.steps li strong{color:var(--bone);font-weight:600;display:block;margin-bottom:.15rem;font-family:var(--display);}

/* CALLOUT / DISCLAIMER BOXES */
.callout{border-radius:3px;padding:1.2rem 1.4rem;margin:1.5rem 0;border:1px solid var(--rule);background:var(--surface);}
.callout__label{font-family:var(--mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;font-weight:600;margin-bottom:.5rem;display:flex;align-items:center;gap:.5rem;}
.callout p{margin:0;font-size:.95rem;color:var(--bone-dim);}
.callout--note{border-left:3px solid var(--steel);} .callout--note .callout__label{color:var(--steel);}
.callout--warn{border-left:3px solid var(--warn);background:rgba(217,160,91,.07);} .callout--warn .callout__label{color:var(--warn);}
.callout--danger{border-left:3px solid var(--danger);background:rgba(200,107,98,.08);} .callout--danger .callout__label{color:var(--danger);}
.callout--danger p strong{color:var(--bone);}

.tags{display:flex;flex-wrap:wrap;gap:.4rem;margin:1rem 0;}
.tag{font-family:var(--mono);font-size:.7rem;letter-spacing:.05em;color:var(--bone-dim);background:var(--surface);border:1px solid var(--rule-bright);border-radius:2px;padding:.3rem .6rem;}

.cta-band{border:1px solid var(--signal);background:linear-gradient(180deg,var(--ink-2),var(--signal-soft));border-radius:3px;padding:2rem;text-align:center;margin-top:2.5rem;}
.cta-band h2{font-family:var(--display);font-weight:800;color:var(--bone);margin:0 0 1rem;font-size:1.6rem;}
.btn{display:inline-flex;align-items:center;gap:.5rem;background:var(--signal);color:var(--ink);font-family:var(--mono);font-weight:700;font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;padding:.85rem 1.4rem;border-radius:2px;transition:background .15s;}
.btn:hover{background:var(--signal-bright);color:var(--ink);}
.btn--ghost{background:transparent;border:1px solid var(--rule-bright);color:var(--bone);}
.btn--ghost:hover{border-color:var(--signal);color:var(--signal);}

.crumbs{font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--bone-mute);margin-bottom:1.2rem;}
.crumbs a{color:var(--bone-dim);} .crumbs a:hover{color:var(--signal);}

.footer{border-top:1px solid var(--rule);padding-block:2rem;margin-top:2rem;}
.footer__inner{display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;align-items:center;font-family:var(--mono);font-size:.72rem;letter-spacing:.05em;color:var(--bone-mute);}
.footer__inner a{color:var(--bone-dim);} .footer__inner a:hover{color:var(--signal);}