/* Public tools, 120 capabilities and API systems · tools-systems-120-pass-2 */

body.tools-page{
  background:var(--paper-2);
}

body.tools-page main{
  overflow:hidden;
}

body.tools-page .nav-links a[aria-current="page"]{
  color:var(--bone);
  border-color:rgba(255,250,240,.48);
  background:rgba(255,255,255,.07);
}

/* Hero */
.tools-hero{
  min-height:940px;
  background:
    radial-gradient(circle at 73% 28%,rgba(255,255,255,.19),transparent 15%),
    radial-gradient(circle at 16% 72%,rgba(255,255,255,.06),transparent 24%),
    linear-gradient(135deg,#050403 0%,#17130f 52%,#080706 100%);
}

.tools-hero::before{
  inset:-16% -8% -8%;
  background:
    repeating-conic-gradient(from -24deg at 73% 28%,rgba(255,255,255,.20) 0 1deg,transparent 1deg 4deg),
    radial-gradient(circle at 73% 28%,rgba(255,255,255,.60) 0 1.3%,rgba(255,255,255,.18) 1.5% 7%,transparent 18%);
  opacity:.42;
}

.tools-hero-grid{
  min-height:940px;
  padding-top:124px;
  padding-bottom:120px;
  gap:clamp(32px,4vw,68px);
}

.tools-hero .hero-copy{
  flex-basis:55%;
  max-width:720px;
}

body.tools-page .hero .tools-title{
  display:inline-block;
  width:auto;
  max-width:100%;
  margin:30px 0 22px -.035em;
  font-family:var(--serif);
  font-size:142px;
  font-size:clamp(92px,9.9vw,154px);
  font-weight:700;
  line-height:.74;
  letter-spacing:-.068em;
  white-space:nowrap;
  text-transform:uppercase;
  color:var(--bone);
  filter:drop-shadow(0 12px 0 rgba(0,0,0,.78));
}

body.tools-page .hero .tools-title::before{
  display:block;
  color:transparent;
  -webkit-text-stroke:1px rgba(255,250,240,.66);
  transform:translate(7px,-4px) skewX(-5deg);
  clip-path:polygon(0 0,100% 0,96% 28%,3% 37%,8% 53%,100% 47%,100% 100%,0 100%);
  opacity:.58;
  mix-blend-mode:normal;
}

body.tools-page .hero .tools-title::after{
  display:none;
}

.tools-hero .hero-lead{
  max-width:700px;
  font-size:clamp(27px,2.8vw,43px);
}

.tools-hero .hero-text{
  max-width:680px;
}

.tools-hero-art{
  flex-basis:45%;
  margin-left:20px;
}

.tools-hero-plate{
  width:clamp(430px,39vw,570px);
  height:clamp(430px,39vw,570px);
  transform:rotate(1.3deg);
  clip-path:polygon(2% 0,100% 2%,98% 100%,0 97%);
}

.tools-hero-plate img{
  object-position:center center;
  filter:grayscale(1) contrast(1.38) brightness(.92);
}

.tools-hero-plate::after{
  content:"АРСЕНАЛ / 01";
}

.tools-promise{
  max-width:760px;
}

/* Intro and legend */
.tools-intro{
  border-bottom:1px solid var(--ink);
  background:
    repeating-linear-gradient(110deg,rgba(5,4,3,.035) 0 1px,transparent 1px 12px),
    var(--paper-3);
}

.tools-intro-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(420px,.82fr);
  gap:clamp(40px,7vw,100px);
  align-items:start;
}

.tools-intro .section-title{
  max-width:760px;
}

.status-ledger{
  border:1px solid var(--ink);
  background:var(--paper-2);
  box-shadow:14px 14px 0 rgba(5,4,3,.15);
}

.status-ledger > div{
  position:relative;
  display:grid;
  grid-template-columns:20px minmax(120px,.45fr) minmax(0,1fr);
  gap:14px;
  align-items:center;
  min-height:88px;
  padding:18px 20px;
  border-bottom:1px solid rgba(5,4,3,.24);
}

.status-ledger > div:last-child{
  border-bottom:0;
}

.status-ledger b{
  font-size:22px;
  line-height:1;
}

.status-ledger p{
  margin:0;
  color:var(--muted);
  font:500 12px/1.45 var(--mono);
}

.status-mark{
  width:12px;
  height:12px;
  border-radius:50%;
  display:block;
}

.status-mark.ready{
  background:var(--ink);
  box-shadow:0 0 0 4px rgba(5,4,3,.12);
}

.status-mark.connect{
  border:2px solid var(--ink);
  background:transparent;
}

.status-mark.roadmap{
  border:1px dashed var(--ink);
  border-radius:0;
  transform:rotate(45deg);
}

/* Tool map */
.tool-map-section{
  padding-top:clamp(82px,8vw,124px);
  background:
    radial-gradient(circle at 92% 8%,rgba(5,4,3,.08),transparent 22%),
    linear-gradient(180deg,var(--paper-2),#e7dbc4);
  border-bottom:12px solid var(--ink);
}

.tool-map-heading,
.skill-library-head{
  display:grid;
  grid-template-columns:minmax(0,1.3fr) minmax(330px,.7fr);
  gap:clamp(30px,6vw,86px);
  align-items:end;
  margin-bottom:54px;
}

.tool-map-heading .section-lead,
.skill-library-head .section-lead{
  margin-bottom:4px;
  font-size:clamp(20px,1.8vw,27px);
}

.tool-map-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  border-top:1px solid var(--ink);
  border-left:1px solid var(--ink);
  box-shadow:18px 18px 0 rgba(5,4,3,.13);
}

.tool-family{
  position:relative;
  min-height:430px;
  padding:32px;
  background:rgba(249,243,227,.84);
  border-right:1px solid var(--ink);
  border-bottom:1px solid var(--ink);
  overflow:hidden;
}

.tool-family::after{
  content:"";
  position:absolute;
  width:190px;
  height:190px;
  right:-78px;
  bottom:-92px;
  border:1px solid rgba(5,4,3,.16);
  border-radius:50%;
  box-shadow:0 0 0 14px rgba(5,4,3,.025),0 0 0 28px rgba(5,4,3,.018);
  pointer-events:none;
}

.tool-family > header{
  display:grid;
  grid-template-columns:76px minmax(0,1fr);
  gap:20px;
  align-items:start;
  margin-bottom:22px;
  padding-bottom:20px;
  border-bottom:1px solid rgba(5,4,3,.28);
}

.tool-family > header > span{
  font:700 54px/.78 var(--serif);
  letter-spacing:-.06em;
  color:var(--muted);
}

.tool-family > header p{
  margin:0 0 8px;
  color:var(--muted);
  font:700 11px/1 var(--mono);
  letter-spacing:.14em;
  text-transform:uppercase;
}

.tool-family h3{
  margin:0;
  font-size:38px;
  line-height:.92;
  letter-spacing:-.035em;
}

.tool-family-copy{
  max-width:620px;
  margin:0 0 24px;
  color:#2b2722;
  font-size:20px;
  line-height:1.35;
}

.tool-chips{
  position:relative;
  z-index:1;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:0;
  padding:0;
  list-style:none;
}

.tool-chips li{
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:8px 11px;
  border:1px solid var(--ink);
  background:transparent;
  font:600 11px/1.28 var(--mono);
  letter-spacing:.025em;
}

.tool-chips li::before{
  content:"";
  flex:0 0 auto;
  width:6px;
  height:6px;
  margin-right:8px;
}

.tool-chips li.ready{
  background:var(--ink);
  color:var(--bone);
}

.tool-chips li.ready::before{
  background:var(--bone);
  border-radius:50%;
}

.tool-chips li.connect::before{
  border:1px solid currentColor;
  border-radius:50%;
}

.tool-chips li.roadmap{
  border-style:dashed;
}

.tool-chips li.roadmap::before{
  border:1px dashed currentColor;
  transform:rotate(45deg);
}

.tool-family.dark-card{
  color:var(--bone);
  background:
    repeating-linear-gradient(112deg,rgba(255,255,255,.035) 0 1px,transparent 1px 10px),
    var(--ink-2);
}

.tool-family.dark-card::after{
  border-color:rgba(255,250,240,.18);
  box-shadow:0 0 0 14px rgba(255,250,240,.025),0 0 0 28px rgba(255,250,240,.018);
}

.tool-family.dark-card > header{
  border-color:rgba(255,250,240,.26);
}

.tool-family.dark-card > header > span,
.tool-family.dark-card > header p{
  color:rgba(255,250,240,.56);
}

.tool-family.dark-card .tool-family-copy{
  color:rgba(255,250,240,.74);
}

.tool-family.dark-card .tool-chips li{
  border-color:rgba(255,250,240,.56);
}

.tool-family.dark-card .tool-chips li.ready{
  color:var(--ink);
  background:var(--bone);
}

.tool-family.dark-card .tool-chips li.ready::before{
  background:var(--ink);
}

.tool-family.full-width{
  grid-column:1/-1;
  min-height:360px;
}

.tool-family.full-width > header{
  max-width:760px;
}

.tool-family.full-width .tool-family-copy{
  max-width:900px;
}

.tool-chips-wide{
  max-width:1080px;
}

/* Russian API systems registry */
.system-registry-section{
  color:var(--bone);
  background:
    repeating-linear-gradient(112deg,rgba(255,255,255,.028) 0 1px,transparent 1px 13px),
    radial-gradient(circle at 9% 11%,rgba(255,255,255,.08),transparent 21%),
    linear-gradient(145deg,#070605,#17130f 58%,#080706);
  border-top:1px solid rgba(255,250,240,.22);
  border-bottom:12px solid var(--ink);
}

.system-registry-head,
.catalog-head{
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(330px,.8fr);
  gap:clamp(30px,6vw,86px);
  align-items:end;
  margin-bottom:48px;
}

.system-registry-head .section-title{
  margin-bottom:0;
  color:var(--bone);
}

.system-registry-head .section-lead{
  margin-bottom:3px;
  color:rgba(255,250,240,.72);
  font-size:clamp(20px,1.8vw,27px);
}

.section-label.light{
  color:rgba(255,250,240,.6);
}

.read-write-rule{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  margin-bottom:64px;
  border:1px solid rgba(255,250,240,.34);
  box-shadow:16px 16px 0 rgba(0,0,0,.42);
}

.read-write-rule > div{
  min-height:210px;
  padding:26px;
  border-right:1px solid rgba(255,250,240,.25);
  background:rgba(255,255,255,.025);
}

.read-write-rule > div:last-child{
  border-right:0;
}

.read-write-rule span{
  display:block;
  margin-bottom:28px;
  color:rgba(255,250,240,.45);
  font:700 12px/1 var(--mono);
  letter-spacing:.18em;
}

.read-write-rule b{
  display:block;
  margin-bottom:12px;
  font:700 clamp(27px,2.2vw,36px)/.95 var(--serif);
  letter-spacing:-.035em;
}

.read-write-rule p{
  margin:0;
  color:rgba(255,250,240,.65);
  font-size:17px;
  line-height:1.45;
}

.system-families{
  display:grid;
  gap:42px;
}

.system-family{
  padding-top:26px;
  border-top:1px solid rgba(255,250,240,.32);
}

.system-family > header{
  display:grid;
  grid-template-columns:64px minmax(0,1fr) auto;
  gap:20px;
  align-items:start;
  margin-bottom:22px;
}

.system-family > header > span{
  color:rgba(255,250,240,.35);
  font:700 46px/.8 var(--serif);
  letter-spacing:-.06em;
}

.system-family > header h3{
  margin:0 0 5px;
  color:var(--bone);
  font-size:clamp(28px,3vw,45px);
  line-height:.95;
  letter-spacing:-.04em;
}

.system-family > header p{
  max-width:760px;
  margin:0;
  color:rgba(255,250,240,.58);
  font-size:17px;
  line-height:1.4;
}

.system-family > header > em{
  padding-top:5px;
  color:rgba(255,250,240,.52);
  font:700 11px/1 var(--mono);
  letter-spacing:.12em;
  text-transform:uppercase;
  white-space:nowrap;
}

.system-card-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  border-top:1px solid rgba(255,250,240,.28);
  border-left:1px solid rgba(255,250,240,.28);
}

.system-card{
  display:flex;
  flex-direction:column;
  min-height:260px;
  padding:24px;
  border-right:1px solid rgba(255,250,240,.28);
  border-bottom:1px solid rgba(255,250,240,.28);
  background:rgba(255,255,255,.025);
  transition:background .2s ease,transform .2s ease;
}

.system-card:hover{
  z-index:1;
  background:rgba(255,255,255,.075);
  transform:translateY(-3px);
}

.system-card-top{
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  gap:8px 14px;
  margin-bottom:32px;
  font:700 9px/1.2 var(--mono);
  letter-spacing:.12em;
  text-transform:uppercase;
}

.system-card-top span{
  color:rgba(255,250,240,.68);
}

.system-card-top em{
  color:rgba(255,250,240,.42);
  font-style:normal;
}

.system-card h4{
  margin:0 0 12px;
  color:var(--bone);
  font:700 30px/.92 var(--serif);
  letter-spacing:-.035em;
}

.system-card h4 a{
  display:inline-grid;
  place-items:center;
  width:25px;
  height:25px;
  margin-left:5px;
  border:1px solid rgba(255,250,240,.36);
  color:var(--bone);
  font:700 13px/1 var(--mono);
  text-decoration:none;
  vertical-align:3px;
}

.system-card h4 a:hover,
.system-card h4 a:focus-visible{
  color:var(--ink);
  background:var(--bone);
}

.system-card p{
  margin:0 0 22px;
  color:rgba(255,250,240,.72);
  font-size:17px;
  line-height:1.42;
}

.system-card small{
  display:block;
  margin-top:auto;
  padding-top:14px;
  border-top:1px dashed rgba(255,250,240,.25);
  color:rgba(255,250,240,.48);
  font:600 10px/1.45 var(--mono);
  letter-spacing:.025em;
}

.registry-caveat{
  max-width:980px;
  margin:50px 0 0 auto;
  padding:24px 0 0 58px;
  border-top:1px solid rgba(255,250,240,.34);
  color:rgba(255,250,240,.62);
  font-size:19px;
  line-height:1.5;
}

/* Full 120 capability catalog */
.capability-catalog-section{
  background:
    radial-gradient(circle at 90% 5%,rgba(5,4,3,.09),transparent 22%),
    repeating-linear-gradient(106deg,rgba(5,4,3,.028) 0 1px,transparent 1px 14px),
    var(--paper-2);
  border-top:12px solid var(--ink);
  border-bottom:1px solid var(--ink);
}

.catalog-head{
  margin-bottom:38px;
}

.catalog-head .section-lead{
  margin-bottom:4px;
  font-size:clamp(20px,1.8vw,27px);
}

.catalog-score{
  display:grid;
  grid-template-columns:repeat(3,minmax(150px,.55fr)) minmax(300px,1.35fr);
  margin-bottom:58px;
  border:1px solid var(--ink);
  box-shadow:16px 16px 0 rgba(5,4,3,.13);
}

.catalog-score > div,
.catalog-score > p{
  min-height:130px;
  margin:0;
  padding:22px;
  border-right:1px solid var(--ink);
}

.catalog-score > div{
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}

.catalog-score > div b{
  font:700 52px/.8 var(--serif);
  letter-spacing:-.06em;
}

.catalog-score > div span{
  color:var(--muted);
  font:700 10px/1.3 var(--mono);
  letter-spacing:.1em;
  text-transform:uppercase;
}

.catalog-score > p{
  display:flex;
  align-items:flex-end;
  border-right:0;
  color:#2c2822;
  font-size:17px;
  line-height:1.42;
}

.capability-chapters{
  border-top:1px solid var(--ink);
}

.capability-chapter{
  border-right:1px solid var(--ink);
  border-bottom:1px solid var(--ink);
  border-left:1px solid var(--ink);
  background:rgba(249,243,227,.6);
}

.capability-chapter > summary{
  display:grid;
  grid-template-columns:66px minmax(0,1fr) auto 28px;
  gap:20px;
  align-items:center;
  min-height:112px;
  padding:20px 24px;
  color:var(--ink);
  background:rgba(5,4,3,.035);
  cursor:pointer;
  list-style:none;
}

.capability-chapter > summary::-webkit-details-marker{
  display:none;
}

.capability-chapter > summary::after{
  content:"−";
  grid-column:4;
  font:700 25px/1 var(--mono);
}

.capability-chapter:not([open]) > summary::after{
  content:"+";
}

.chapter-index{
  color:var(--muted);
  font:700 48px/.8 var(--serif);
  letter-spacing:-.06em;
}

.capability-chapter summary b{
  display:block;
  margin-bottom:7px;
  font:700 clamp(27px,2.6vw,39px)/.92 var(--serif);
  letter-spacing:-.035em;
}

.capability-chapter summary small{
  display:block;
  max-width:780px;
  color:var(--muted);
  font-size:15px;
  line-height:1.4;
}

.capability-chapter summary em{
  color:var(--muted);
  font:700 10px/1.2 var(--mono);
  font-style:normal;
  letter-spacing:.1em;
  text-transform:uppercase;
  white-space:nowrap;
}

.capability-list{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  margin:0;
  padding:0;
  border-top:1px solid var(--ink);
  list-style:none;
}

.capability-item{
  display:grid;
  grid-template-columns:48px minmax(0,1fr) auto;
  gap:15px;
  min-height:154px;
  padding:22px;
  border-right:1px solid rgba(5,4,3,.36);
  border-bottom:1px solid rgba(5,4,3,.36);
  background:rgba(255,255,255,.16);
}

.capability-item:nth-child(even){
  border-right:0;
}

.capability-number{
  color:var(--muted);
  font:700 11px/1 var(--mono);
  letter-spacing:.08em;
}

.capability-item h4{
  margin:0 0 9px;
  font:700 23px/.98 var(--serif);
  letter-spacing:-.025em;
}

.capability-item p{
  margin:0;
  color:#39342e;
  font-size:15px;
  line-height:1.42;
}

.capability-status{
  align-self:start;
  padding:6px 7px;
  border:1px solid currentColor;
  color:var(--ink);
  font:700 8px/1 var(--mono);
  letter-spacing:.08em;
  text-transform:uppercase;
  white-space:nowrap;
}

.capability-item.ready .capability-status{
  color:var(--bone);
  background:var(--ink);
}

.capability-item.connect .capability-status{
  background:transparent;
}

.capability-item.roadmap .capability-status{
  border-style:dashed;
}

#business-systems,
#capability-catalog{
  scroll-margin-top:88px;
}

@media (max-width:1100px){
  .system-card-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .catalog-score{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }

  .catalog-score > p{
    grid-column:1/-1;
    min-height:auto;
    border-top:1px solid var(--ink);
  }
}

@media (max-width:920px){
  .system-registry-head,
  .catalog-head{
    grid-template-columns:1fr;
  }

  .read-write-rule{
    grid-template-columns:1fr;
  }

  .read-write-rule > div{
    min-height:auto;
    border-right:0;
    border-bottom:1px solid rgba(255,250,240,.25);
  }

  .read-write-rule > div:last-child{
    border-bottom:0;
  }

  .capability-list{
    grid-template-columns:1fr;
  }

  .capability-item,
  .capability-item:nth-child(even){
    border-right:0;
  }
}

@media (max-width:720px){
  .system-registry-head,
  .catalog-head{
    margin-bottom:30px;
  }

  .read-write-rule{
    margin-bottom:46px;
    box-shadow:8px 8px 0 rgba(0,0,0,.42);
  }

  .read-write-rule > div{
    padding:22px;
  }

  .read-write-rule span{
    margin-bottom:18px;
  }

  .system-family > header{
    grid-template-columns:45px minmax(0,1fr);
    gap:14px;
  }

  .system-family > header > em{
    grid-column:2;
    padding-top:0;
  }

  .system-family > header > span{
    font-size:38px;
  }

  .system-card-grid{
    grid-template-columns:1fr;
  }

  .system-card{
    min-height:auto;
    padding:22px;
  }

  .system-card-top{
    margin-bottom:24px;
  }

  .registry-caveat{
    margin-top:38px;
    padding-left:0;
    font-size:17px;
  }

  .catalog-score{
    grid-template-columns:1fr;
    margin-bottom:42px;
    box-shadow:8px 8px 0 rgba(5,4,3,.13);
  }

  .catalog-score > div,
  .catalog-score > p{
    min-height:auto;
    border-right:0;
    border-bottom:1px solid var(--ink);
  }

  .catalog-score > p{
    grid-column:auto;
    border-top:0;
    border-bottom:0;
  }

  .catalog-score > div{
    display:grid;
    grid-template-columns:90px minmax(0,1fr);
    align-items:center;
    gap:18px;
  }

  .capability-chapter > summary{
    grid-template-columns:42px minmax(0,1fr) 22px;
    gap:12px;
    min-height:100px;
    padding:18px 16px;
  }

  .capability-chapter > summary::after{
    grid-column:3;
    grid-row:1;
  }

  .capability-chapter summary em{
    grid-column:2;
    margin-top:5px;
    white-space:normal;
  }

  .chapter-index{
    font-size:38px;
  }

  .capability-item{
    grid-template-columns:38px minmax(0,1fr);
    min-height:auto;
    padding:19px 16px;
  }

  .capability-status{
    grid-column:2;
    justify-self:start;
  }
}

/* Assembled skill */
.assembled-skill-section{
  color:var(--bone);
  background:
    radial-gradient(circle at 86% 12%,rgba(255,255,255,.13),transparent 20%),
    repeating-linear-gradient(12deg,rgba(255,255,255,.025) 0 1px,transparent 1px 11px),
    var(--ink);
  border-bottom:1px solid rgba(255,250,240,.25);
}

.section-label.light{
  color:rgba(255,250,240,.62);
}

.assembled-skill-head{
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(350px,.8fr);
  gap:clamp(36px,7vw,92px);
  align-items:end;
  margin-bottom:48px;
}

.assembled-skill-head .section-lead{
  color:rgba(255,250,240,.72);
  font-size:clamp(20px,1.8vw,27px);
  margin-bottom:4px;
}

.skill-blueprint{
  border:1px solid rgba(255,250,240,.58);
  background:rgba(255,250,240,.035);
  box-shadow:18px 18px 0 rgba(255,250,240,.09);
}

.skill-blueprint > header{
  display:grid;
  grid-template-columns:200px minmax(0,1fr) minmax(280px,.65fr);
  gap:24px;
  align-items:center;
  padding:26px 30px;
  border-bottom:1px solid rgba(255,250,240,.35);
}

.skill-blueprint > header > span{
  color:rgba(255,250,240,.58);
  font:700 11px/1.4 var(--mono);
  letter-spacing:.14em;
  text-transform:uppercase;
}

.skill-blueprint > header h3{
  margin:0;
  font-size:38px;
  line-height:.95;
}

.skill-blueprint > header p{
  margin:0;
  color:rgba(255,250,240,.70);
  font-size:18px;
  line-height:1.35;
}

.skill-blueprint-flow{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  margin:0;
  padding:0;
  list-style:none;
}

.skill-blueprint-flow li{
  position:relative;
  min-height:260px;
  padding:24px 20px;
  border-right:1px solid rgba(255,250,240,.27);
}

.skill-blueprint-flow li:last-child{
  border-right:0;
}

.skill-blueprint-flow li::after{
  content:"→";
  position:absolute;
  z-index:2;
  right:-17px;
  top:34px;
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,250,240,.56);
  border-radius:50%;
  color:var(--bone);
  background:var(--ink);
  font:700 15px/1 var(--mono);
}

.skill-blueprint-flow li:last-child::after{
  display:none;
}

.skill-blueprint-flow b{
  display:block;
  margin-bottom:42px;
  color:rgba(255,250,240,.42);
  font:700 38px/1 var(--serif);
}

.skill-blueprint-flow span{
  display:block;
  margin-bottom:12px;
  font:700 11px/1 var(--mono);
  letter-spacing:.14em;
  text-transform:uppercase;
}

.skill-blueprint-flow p{
  margin:0;
  color:rgba(255,250,240,.72);
  font-size:18px;
  line-height:1.35;
}

.skill-blueprint-flow .human-gate{
  color:var(--ink);
  background:var(--bone);
}

.skill-blueprint-flow .human-gate b,
.skill-blueprint-flow .human-gate p{
  color:var(--ink);
}

.skill-blueprint > footer{
  display:grid;
  grid-template-columns:200px minmax(0,1fr);
  gap:24px;
  padding:20px 30px;
  border-top:1px solid rgba(255,250,240,.35);
}

.skill-blueprint > footer span{
  color:rgba(255,250,240,.56);
  font:700 11px/1.4 var(--mono);
  letter-spacing:.14em;
  text-transform:uppercase;
}

.skill-blueprint > footer p{
  margin:0;
  font:600 12px/1.5 var(--mono);
  letter-spacing:.04em;
}

/* Professional skill shelf */
.skill-library-section{
  background:
    radial-gradient(circle at 8% 92%,rgba(5,4,3,.08),transparent 22%),
    var(--paper-3);
  border-bottom:12px solid var(--ink);
}

.skill-shelf{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  border-top:1px solid var(--ink);
  border-left:1px solid var(--ink);
  box-shadow:16px 16px 0 rgba(5,4,3,.14);
}

.skill-card{
  position:relative;
  min-height:300px;
  padding:28px;
  border-right:1px solid var(--ink);
  border-bottom:1px solid var(--ink);
  background:rgba(237,228,209,.72);
}

.skill-card:nth-child(3n+2){
  background:var(--paper-2);
}

.skill-card:nth-child(7),
.skill-card:nth-child(8){
  color:var(--bone);
  background:var(--ink);
}

.skill-card > span{
  display:inline-block;
  margin-bottom:38px;
  padding:7px 9px;
  border:1px solid currentColor;
  font:700 10px/1 var(--mono);
  letter-spacing:.13em;
  text-transform:uppercase;
}

.skill-card h3{
  margin:0 0 14px;
  font-size:36px;
  line-height:.94;
  letter-spacing:-.035em;
}

.skill-card p{
  margin:0 0 28px;
  font-size:19px;
  line-height:1.35;
}

.skill-card small{
  position:absolute;
  left:28px;
  right:28px;
  bottom:24px;
  padding-top:12px;
  border-top:1px solid rgba(5,4,3,.25);
  color:var(--muted);
  font:600 10px/1.45 var(--mono);
  letter-spacing:.045em;
}

.skill-card:nth-child(7) small,
.skill-card:nth-child(8) small{
  color:rgba(255,250,240,.62);
  border-color:rgba(255,250,240,.24);
}

/* Skill Lab */
.skill-lab-section{
  padding-bottom:0;
  color:var(--bone);
  background:
    linear-gradient(90deg,rgba(255,255,255,.025),transparent 30%,rgba(255,255,255,.02)),
    #0a0908;
}

.skill-lab-grid{
  display:grid;
  grid-template-columns:minmax(420px,.86fr) minmax(0,1.14fr);
  gap:clamp(40px,7vw,96px);
  align-items:center;
}

.skill-lab-art{
  position:relative;
  min-height:720px;
  margin:0;
  border:1px solid rgba(255,250,240,.50);
  background:#ddd;
  box-shadow:18px 18px 0 rgba(255,250,240,.08);
  overflow:hidden;
  clip-path:polygon(2% 0,100% 1.5%,98% 100%,0 97%);
}

.skill-lab-art img{
  width:100%;
  height:720px;
  object-fit:cover;
  object-position:center center;
  filter:grayscale(1) contrast(1.4) brightness(.86);
  mix-blend-mode:multiply;
}

.skill-lab-art::after{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(circle at 50% 32%,rgba(255,255,255,.16),transparent 28%),linear-gradient(180deg,transparent 58%,rgba(0,0,0,.48));
  pointer-events:none;
}

.skill-lab-art figcaption{
  position:absolute;
  z-index:2;
  left:22px;
  right:22px;
  bottom:22px;
  padding:16px 18px;
  color:var(--bone);
  background:rgba(5,4,3,.80);
  border:1px solid rgba(255,250,240,.36);
  font-size:18px;
  line-height:1.3;
}

.roadmap-stamp{
  display:inline-block;
  margin:0 0 24px;
  padding:10px 13px;
  border:1px dashed rgba(255,250,240,.76);
  color:var(--bone);
  font:700 11px/1 var(--mono);
  letter-spacing:.14em;
  text-transform:uppercase;
  transform:rotate(-1.5deg);
}

.skill-lab-copy .section-title{
  color:var(--bone);
}

.skill-lab-copy .section-lead{
  color:rgba(255,250,240,.76);
  margin-bottom:22px;
}

.lab-honesty{
  margin:0 0 34px;
  padding:16px 18px;
  border-left:4px solid var(--bone);
  color:rgba(255,250,240,.70);
  background:rgba(255,255,255,.045);
  font-size:18px;
  line-height:1.38;
}

.lab-steps{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1px;
  margin:0;
  padding:1px;
  list-style:none;
  background:rgba(255,250,240,.28);
}

.lab-steps li{
  min-height:150px;
  padding:18px;
  color:var(--bone);
  background:var(--ink);
}

.lab-steps b{
  float:left;
  margin-right:12px;
  color:rgba(255,250,240,.35);
  font:700 28px/1 var(--serif);
}

.lab-steps span{
  display:block;
  margin-bottom:8px;
  font:700 11px/1.2 var(--mono);
  letter-spacing:.12em;
  text-transform:uppercase;
}

.lab-steps p{
  clear:both;
  margin:12px 0 0;
  color:rgba(255,250,240,.68);
  font-size:17px;
  line-height:1.32;
}

.lab-routes{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  margin-top:76px;
  border-top:1px solid rgba(255,250,240,.45);
  border-left:1px solid rgba(255,250,240,.45);
}

.lab-route{
  min-height:270px;
  padding:26px;
  border-right:1px solid rgba(255,250,240,.45);
  border-bottom:1px solid rgba(255,250,240,.45);
  background:rgba(255,255,255,.025);
}

.lab-route > span{
  display:inline-block;
  margin-bottom:34px;
  padding:7px 9px;
  border:1px solid currentColor;
  font:700 10px/1 var(--mono);
  letter-spacing:.12em;
  text-transform:uppercase;
}

.lab-route.connect > span{
  border-radius:50%;
}

.lab-route.roadmap > span{
  border-style:dashed;
}

.lab-route h3{
  margin:0 0 14px;
  font-size:31px;
  line-height:.96;
}

.lab-route p{
  margin:0;
  color:rgba(255,250,240,.68);
  font-size:18px;
  line-height:1.35;
}

/* Connection rule */
.connection-rule-section{
  background:
    repeating-linear-gradient(102deg,rgba(5,4,3,.04) 0 1px,transparent 1px 13px),
    var(--paper-2);
  border-bottom:1px solid var(--ink);
}

.connection-rule-grid{
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(420px,.95fr);
  gap:clamp(50px,8vw,120px);
  align-items:start;
}

.connection-rule-copy{
  padding:30px;
  border:1px solid var(--ink);
  background:var(--paper-3);
  box-shadow:14px 14px 0 rgba(5,4,3,.15);
}

.connection-rule-copy > p{
  margin:0 0 28px;
  font-size:23px;
  line-height:1.3;
}

.connection-rule-copy ol{
  margin:0 0 28px;
  padding:0;
  list-style:none;
  border-top:1px solid rgba(5,4,3,.25);
}

.connection-rule-copy li{
  display:grid;
  grid-template-columns:42px minmax(0,1fr);
  gap:12px;
  padding:15px 0;
  border-bottom:1px solid rgba(5,4,3,.25);
  font-size:18px;
  line-height:1.3;
}

.connection-rule-copy li b{
  font:700 20px/1 var(--serif);
}

.text-link{
  display:inline-block;
  padding-bottom:4px;
  border-bottom:1px solid currentColor;
  font:700 12px/1.3 var(--mono);
  letter-spacing:.08em;
  text-transform:uppercase;
}

.tools-final-cta{
  background:var(--paper-3);
}

.tools-final-cta .cta-box{
  padding-top:clamp(46px,6vw,84px);
}

/* Responsive */
@media (max-width:1180px){
  .tools-hero{
    min-height:860px;
  }

  .tools-hero-grid{
    min-height:860px;
    padding-top:116px;
  }

  body.tools-page .hero .tools-title{
    font-size:clamp(82px,9.6vw,116px);
  }

  .tools-hero-plate{
    width:clamp(370px,39vw,480px);
    height:clamp(370px,39vw,480px);
  }

  .tool-family{
    min-height:460px;
  }

  .skill-blueprint > header{
    grid-template-columns:160px minmax(0,1fr);
  }

  .skill-blueprint > header p{
    grid-column:2;
  }

  .skill-blueprint-flow{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }

  .skill-blueprint-flow li{
    min-height:230px;
    border-bottom:1px solid rgba(255,250,240,.27);
  }

  .skill-blueprint-flow li:nth-child(3){
    border-right:0;
  }

  .skill-blueprint-flow li:nth-child(3)::after,
  .skill-blueprint-flow li:nth-child(5)::after{
    display:none;
  }

  .skill-blueprint-flow .human-gate{
    grid-column:2/4;
  }

  .skill-shelf{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .skill-card:nth-child(3n+2){
    background:rgba(237,228,209,.72);
  }

  .skill-card:nth-child(even){
    background:var(--paper-2);
  }

  .skill-card:nth-child(7),
  .skill-card:nth-child(8){
    color:var(--bone);
    background:var(--ink);
  }

  .skill-lab-grid{
    grid-template-columns:minmax(360px,.8fr) minmax(0,1.2fr);
    gap:42px;
  }

  .skill-lab-art,
  .skill-lab-art img{
    min-height:650px;
    height:650px;
  }

  .lab-routes{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width:920px){
  .tools-hero,
  .tools-hero-grid{
    min-height:auto;
  }

  .tools-hero-grid{
    display:grid;
    grid-template-columns:1fr;
    padding-top:112px;
    padding-bottom:100px;
  }

  .tools-hero .hero-copy{
    max-width:760px;
    order:1;
  }

  .tools-hero-art{
    display:grid!important;
    order:2;
    width:100%;
    min-height:520px;
    margin:8px 0 0;
  }

  .tools-hero-plate{
    width:min(560px,82vw);
    height:min(560px,82vw);
  }

  body.tools-page .hero .tools-title{
    font-size:clamp(88px,16vw,132px);
  }

  .tools-intro-grid,
  .tool-map-heading,
  .skill-library-head,
  .assembled-skill-head,
  .connection-rule-grid{
    grid-template-columns:1fr;
  }

  .status-ledger{
    max-width:700px;
  }

  .tool-map-grid{
    grid-template-columns:1fr;
  }

  .tool-family,
  .tool-family.full-width{
    grid-column:auto;
    min-height:auto;
  }

  .skill-blueprint > header{
    grid-template-columns:1fr;
  }

  .skill-blueprint > header p{
    grid-column:auto;
  }

  .skill-blueprint-flow{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .skill-blueprint-flow li:nth-child(3){
    border-right:1px solid rgba(255,250,240,.27);
  }

  .skill-blueprint-flow li:nth-child(even){
    border-right:0;
  }

  .skill-blueprint-flow li:nth-child(2)::after,
  .skill-blueprint-flow li:nth-child(4)::after{
    display:none;
  }

  .skill-blueprint-flow .human-gate{
    grid-column:1/-1;
  }

  .skill-lab-grid{
    grid-template-columns:1fr;
  }

  .skill-lab-art{
    width:min(680px,100%);
    min-height:620px;
  }

  .skill-lab-art img{
    height:620px;
  }
}

@media (max-width:720px){
  body.tools-page .site-header{
    padding:13px 16px;
  }

  .tools-hero-grid{
    display:grid!important;
    grid-template-columns:1fr;
    padding:92px 18px 72px;
  }

  .tools-hero .hero-copy{
    display:block!important;
    width:100%;
    max-width:100%;
  }

  body.tools-page .hero .tools-title{
    display:block;
    width:calc(100% + 8px);
    max-width:none;
    margin:24px 0 18px -4px;
    font-size:68px!important;
    font-size:clamp(64px,18.2vw,78px)!important;
    line-height:.78;
    letter-spacing:-.058em;
    white-space:nowrap;
    filter:none!important;
    text-shadow:none!important;
  }

  body.tools-page .hero .tools-title::before{
    transform:translate(3px,-2px) skewX(-2deg);
    -webkit-text-stroke:1px rgba(255,250,240,.62);
    opacity:.66;
  }

  .tools-hero .hero-lead{
    font-size:28px;
    line-height:1.03;
  }

  .tools-hero .hero-text{
    font-size:18px;
  }

  .tools-hero .hero-actions{
    display:grid;
  }

  .tools-hero .hero-actions .btn{
    width:100%;
  }

  .tools-promise{
    grid-template-columns:1fr;
  }

  .tools-hero-art{
    display:grid!important;
    min-height:360px;
    margin-top:22px;
  }

  .tools-hero-plate{
    width:min(350px,90vw);
    height:min(350px,90vw);
    max-width:100%;
    max-height:none;
  }

  .tools-hero .orbit-note{
    display:none;
  }

  .tools-hero .vertical-whisper{
    display:none;
  }

  .status-ledger > div{
    grid-template-columns:18px minmax(0,1fr);
    gap:12px;
  }

  .status-ledger p{
    grid-column:2;
  }

  .tool-map-heading,
  .skill-library-head,
  .assembled-skill-head{
    margin-bottom:34px;
  }

  .tool-map-grid,
  .skill-shelf,
  .status-ledger,
  .connection-rule-copy,
  .skill-blueprint{
    box-shadow:8px 8px 0 rgba(5,4,3,.13);
  }

  .skill-blueprint{
    box-shadow:8px 8px 0 rgba(255,250,240,.08);
  }

  .tool-family{
    padding:22px;
  }

  .tool-family > header{
    grid-template-columns:56px minmax(0,1fr);
    gap:14px;
  }

  .tool-family > header > span{
    font-size:42px;
  }

  .tool-family h3{
    font-size:34px;
  }

  .tool-family-copy{
    font-size:18px;
  }

  .tool-chips{
    gap:6px;
  }

  .tool-chips li{
    min-height:32px;
    padding:7px 9px;
    font-size:10px;
  }

  .skill-blueprint > header,
  .skill-blueprint > footer{
    display:block;
    padding:22px;
  }

  .skill-blueprint > header > span{
    display:block;
    margin-bottom:14px;
  }

  .skill-blueprint > header h3{
    font-size:32px;
    margin-bottom:12px;
  }

  .skill-blueprint-flow{
    grid-template-columns:1fr;
  }

  .skill-blueprint-flow li,
  .skill-blueprint-flow .human-gate{
    grid-column:auto;
    min-height:auto;
    padding:22px;
    border-right:0!important;
  }

  .skill-blueprint-flow li::after{
    display:none!important;
  }

  .skill-blueprint-flow b{
    margin-bottom:18px;
  }

  .skill-blueprint > footer span{
    display:block;
    margin-bottom:10px;
  }

  .skill-shelf{
    grid-template-columns:1fr;
  }

  .skill-card{
    min-height:280px;
    padding:24px;
  }

  .skill-card:nth-child(even){
    background:rgba(237,228,209,.72);
  }

  .skill-card:nth-child(7),
  .skill-card:nth-child(8){
    color:var(--bone);
    background:var(--ink);
  }

  .skill-card small{
    left:24px;
    right:24px;
  }

  .skill-lab-art,
  .skill-lab-art img{
    min-height:430px;
    height:430px;
  }

  .skill-lab-art figcaption{
    left:14px;
    right:14px;
    bottom:14px;
    font-size:16px;
  }

  .lab-steps,
  .lab-routes{
    grid-template-columns:1fr;
  }

  .lab-steps li{
    min-height:auto;
  }

  .lab-routes{
    margin-top:48px;
  }

  .lab-route{
    min-height:230px;
  }

  .connection-rule-copy{
    padding:22px;
  }

  .connection-rule-copy > p{
    font-size:20px;
  }

  .connection-rule-copy li{
    font-size:17px;
  }
}

@media (prefers-reduced-motion:reduce){
  .tools-page *,
  .tools-page *::before,
  .tools-page *::after{
    scroll-behavior:auto!important;
  }
}
