/* ═══════════ custom software page ═══════════
   Loaded on software.html only. Uses the shared tokens from site.css. */

.sw-hero h1{ max-width:19ch; }
.sw-hero__acts{ display:flex; flex-wrap:wrap; gap:.6rem; margin-top:clamp(1.6rem, 3vw, 2.2rem); }

/* the two things to stop — struck through in marker red as they arrive */
.sw-stop{ display:grid; gap:.4rem; }
.sw-strike{
  position:relative; justify-self:start; margin:clamp(1rem, 2.4vw, 1.8rem) 0 0;
  font-family:var(--display); font-weight:700; letter-spacing:-.045em; line-height:1.05;
  font-size:clamp(1.9rem, 5.6vw, 4.4rem); max-width:18ch; text-wrap:balance;
}
/* struck through line by line: each wrapped line gets its own red bar through the middle of the letters */
.sw-strike__t{
  background:linear-gradient(var(--spot), var(--spot)) no-repeat 0 60% / calc(var(--strike, 1) * 100%) .085em;
  -webkit-box-decoration-break:clone; box-decoration-break:clone;
  transition:background-size .9s var(--ease);
}
.sw-strike__why{ margin:0; color:var(--mute); max-width:52ch; font-size:1.02rem; }
.sw-start{
  margin:clamp(2.2rem, 5vw, 3.4rem) 0 0; padding-top:1.4rem; border-top:1px solid var(--ink);
  font-family:var(--display); font-weight:700; letter-spacing:-.04em; line-height:1.1;
  font-size:clamp(1.4rem, 3.2vw, 2.3rem); max-width:26ch;
}
.sw-start em{ font-style:normal; font-family:var(--hand); font-weight:700; color:var(--spot); letter-spacing:0; font-size:1.18em; }

/* what we build: a ruled grid, industries in mono underneath */
.sw-builds{
  list-style:none; margin:0; padding:0;
  display:grid; grid-template-columns:repeat(4, minmax(0,1fr));
  border-top:1px solid var(--ink);
}
@media (max-width:64rem){ .sw-builds{ grid-template-columns:repeat(2, minmax(0,1fr)); } }
@media (max-width:34rem){ .sw-builds{ grid-template-columns:1fr; } }
.sw-build{
  display:flex; flex-direction:column; gap:.55rem;
  padding:1.3rem 1.2rem 1.4rem 0; border-bottom:1px solid var(--rule);
}
.sw-build h3{ margin:0; font-family:var(--display); font-weight:700; font-size:1.18rem; letter-spacing:-.03em; line-height:1.15; }
.sw-build p{ margin:0; color:var(--mute); font-size:.94rem; flex:1; }
.sw-build span{ font-family:var(--mono); font-size:.58rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink); }

/* the ledger: named software, then redacted NDA rows */
.ledger{ border-top:1px solid var(--ink); font-family:var(--mono); }
.lg-head, .lg-row{
  display:grid; grid-template-columns:3rem minmax(0,1.1fr) minmax(0,1.6fr) 5rem;
  gap:.4rem 1.4rem; align-items:center; padding:1rem 0; border-bottom:1px solid var(--rule);
}
.lg-head{ font-size:.58rem; letter-spacing:.16em; text-transform:uppercase; color:var(--mute); padding-block:.7rem; }
.lg-row{ text-decoration:none; color:var(--ink); font-size:.82rem; transition:background .25s; }
a.lg-row:hover{ background:var(--panel); }
.lg-n{ color:var(--mute); font-size:.7rem; }
.lg-name{ font-family:var(--display); font-weight:700; font-size:1.2rem; letter-spacing:-.03em; }
.lg-what{ color:var(--mute); font-family:var(--sans); font-size:.92rem; }
.lg-go{ justify-self:end; font-size:.6rem; letter-spacing:.14em; text-transform:uppercase; }
.lg-row--nda .lg-go{ color:var(--spot); }
.lg-row--nda i{ display:block; width:var(--w); height:.95em; background:var(--ink); border-radius:2px; }
.lg-row--nda .lg-name i{ height:1.1em; }
.lg-foot{ display:flex; align-items:center; gap:.9rem; flex-wrap:wrap; margin:1.1rem 0 0; font-family:var(--sans); color:var(--mute); font-size:.92rem; }
.lg-stamp{
  font-family:var(--mono); font-size:.6rem; font-weight:500; letter-spacing:.2em; text-transform:uppercase;
  color:var(--spot); border:1.5px solid var(--spot); border-radius:4px; padding:.35em .7em; rotate:-3deg;
}
@media (max-width:40rem){
  .lg-head{ display:none; }
  .lg-row{ grid-template-columns:2.2rem minmax(0,1fr) auto; }
  .lg-what{ grid-column:2 / -1; }
}

/* the promise */
.sw-promise__grid{ display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); gap:1.6rem clamp(2rem, 6vw, 5rem); align-items:end; }
@media (max-width:52rem){ .sw-promise__grid{ grid-template-columns:1fr; } }
.sw-promise__big{ margin:0; font-family:var(--display); font-weight:700; letter-spacing:-.05em; line-height:1; font-size:clamp(2.2rem, 6.4vw, 5.2rem); }
.sw-promise__body p{ margin:0 0 1rem; font-size:1.08rem; max-width:42ch; }
.sw-promise__body strong{ font-weight:600; background:linear-gradient(transparent 62%, color-mix(in srgb, var(--spot) 28%, transparent) 62%); }

/* tiers */
.sw-tiers{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); border-top:1px solid var(--ink); margin-bottom:clamp(2rem, 4vw, 3rem); }
@media (max-width:56rem){ .sw-tiers{ grid-template-columns:1fr; } }
.sw-tier{ padding:1.4rem 1.6rem 1.6rem 0; border-bottom:1px solid var(--rule); display:flex; flex-direction:column; }
.sw-tier + .sw-tier{ padding-left:1.6rem; border-left:1px solid var(--rule); }
@media (max-width:56rem){ .sw-tier + .sw-tier{ padding-left:0; border-left:0; } }
.sw-tier .key{ margin-bottom:.7rem; }
.sw-tier__who{ margin:0 0 1rem; font-family:var(--display); font-weight:700; font-size:1.15rem; letter-spacing:-.03em; line-height:1.2; }
.sw-tier ul{ list-style:none; margin:0 0 1.2rem; padding:0; display:grid; gap:.5rem; flex:1; }
.sw-tier li{ display:flex; gap:.7rem; font-size:.94rem; color:var(--mute); }
.sw-tier li::before{ content:""; flex:none; width:5px; height:5px; margin-top:.6em; border-radius:50%; background:var(--spot); }
.sw-tier__price{ margin:0; font-family:var(--mono); font-size:.62rem; font-weight:500; letter-spacing:.16em; text-transform:uppercase; }

/* questions */
.sw-faq{ border-top:1px solid var(--ink); margin-top:clamp(1.6rem, 3vw, 2.4rem); }
.sw-q{ border-bottom:1px solid var(--rule); }
.sw-q summary{
  list-style:none; cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:1rem;
  padding:1.15rem 0; font-family:var(--display); font-weight:700; font-size:clamp(1.05rem, 2vw, 1.3rem); letter-spacing:-.03em;
}
.sw-q summary::-webkit-details-marker{ display:none; }
.sw-q summary i{ position:relative; flex:none; width:14px; height:14px; }
.sw-q summary i::before, .sw-q summary i::after{ content:""; position:absolute; left:0; right:0; top:6px; height:2px; background:var(--ink); transition:rotate .3s var(--ease); }
.sw-q summary i::after{ rotate:90deg; }
.sw-q[open] summary i::after{ rotate:0deg; }
.sw-q p{ margin:0 0 1.3rem; color:var(--mute); max-width:62ch; }

@media (prefers-reduced-motion: reduce){ .sw-strike__t{ transition:none; } }
