/* software.css — the three product pages: /software, /tool, /plans.
 *
 * Started 2026-09-16, the day the studio moved to aiad.art and the software
 * got its home. The content is CREATOR001's (bridge file
 * FROM-CREATOR001-AiAD-art-pages.md); the look is the house blueprint that
 * site.css already carries — deep ultramarine, white ink, one gold accent,
 * measured things in a monospace. Nothing here re-declares a token: every
 * colour and face is read from site.css, so the three pages move with it. */

/* ---------- the opening ---------- */
.sw-hero{padding:clamp(130px,18vh,190px) 0 clamp(60px,9vh,100px)}
.sw-hero h1{font-size:clamp(46px,8.4vw,96px);line-height:.98;letter-spacing:-.025em}
.sw-hero .sw-sub{font-family:var(--serif);font-style:italic;font-weight:300;
  font-size:clamp(21px,3vw,32px);color:var(--fg);margin-top:18px;max-width:34ch;line-height:1.25}
.sw-hero .body{margin-top:30px}
.sw-cta{margin-top:40px;display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.sw-cta .btn{display:inline-block}

/* a thin rule between sections instead of a colour change on every one */
.sw-sec{padding:clamp(70px,10vh,120px) 0;border-top:1px solid var(--line)}
.sw-sec.alt{background:var(--bg2)}
.sw-sec h2{font-size:clamp(28px,4.4vw,46px);line-height:1.08;max-width:24ch}
.sw-sec .body{margin-top:18px}

/* ---------- the line, in six stops ---------- */
.sw-track{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:46px;counter-reset:stop}
@media(max-width:900px){.sw-track{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.sw-track{grid-template-columns:1fr}}
.sw-track li{border:1px solid var(--line);border-radius:14px;padding:22px 22px 24px;background:var(--panel);position:relative}
.sw-track li::before{counter-increment:stop;content:'0' counter(stop);display:block;
  font-family:var(--mono);font-size:11px;letter-spacing:.2em;color:var(--gold);margin-bottom:12px}
.sw-track b{display:block;font-family:var(--serif);font-weight:400;font-size:22px;color:var(--fg);margin-bottom:8px;letter-spacing:-.01em}
.sw-track span{font-size:14.5px;color:var(--muted);line-height:1.6}

/* ---------- a list with gold beads ---------- */
.sw-list{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:0 clamp(24px,4vw,56px);margin-top:34px;max-width:900px}
@media(max-width:680px){.sw-list{grid-template-columns:1fr}}
.sw-list li{font-size:15.5px;color:var(--fg);line-height:1.55;padding:11px 0 11px 22px;position:relative;border-bottom:1px solid var(--line)}
.sw-list li::before{content:'';position:absolute;left:0;top:19px;width:6px;height:6px;border-radius:50%;background:var(--gold)}

/* ---------- the honest panel ---------- */
.sw-panel{margin-top:40px;border:1px solid var(--line2);border-radius:16px;padding:26px 28px;max-width:760px;
  background:linear-gradient(180deg,rgba(233,184,114,.05),transparent)}
.sw-tag{font-family:var(--mono);font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin-bottom:12px}
.sw-panel p{font-size:15px;color:var(--muted);line-height:1.7}
.sw-panel p + p{margin-top:12px}

/* ---------- measured facts, in the monospace ---------- */
.sw-facts{list-style:none;display:flex;flex-wrap:wrap;gap:10px;margin-top:34px}
.sw-facts li{font-family:var(--mono);font-size:12.5px;letter-spacing:.03em;color:var(--cyan);
  border:1px solid var(--line2);border-radius:8px;padding:9px 14px;background:rgba(4,20,58,.5)}
.sw-facts li b{color:var(--gold);font-weight:500}

/* ---------- runs on ---------- */
.sw-req{margin-top:30px;font-family:var(--mono);font-size:12.5px;color:var(--muted);letter-spacing:.03em;line-height:1.8}
.sw-req b{color:var(--fg);font-weight:500}

/* ---------- the ribbon, as it sits in Inventor ---------- */
.rib{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:46px}
@media(max-width:980px){.rib{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.rib{grid-template-columns:1fr}}
.rib-g{border:1px solid var(--line);border-radius:14px;background:var(--panel);overflow:hidden}
.rib-h{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:14px 20px;
  border-bottom:1px solid var(--line);background:var(--panel2);
  font-family:var(--mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold)}
.rib-h i{font-style:normal;font-size:9.5px;letter-spacing:.18em;color:var(--muted2);
  border:1px solid var(--line2);border-radius:20px;padding:3px 9px}
.rib-g ul{list-style:none;padding:6px 20px 12px}
.rib-g li{padding:12px 0;border-bottom:1px solid var(--line)}
.rib-g li:last-child{border-bottom:0}
.rib-g b{display:block;font-family:var(--serif);font-weight:400;font-size:18px;color:var(--fg);margin-bottom:4px}
.rib-g span{font-size:14px;color:var(--muted);line-height:1.55}

/* ---------- the plans ---------- */
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:46px}
@media(max-width:900px){.plans{grid-template-columns:1fr}}
.plan{border:1px solid var(--line);border-radius:18px;padding:30px 28px;background:linear-gradient(180deg,var(--panel),var(--panel2));
  display:flex;flex-direction:column}
.plan.both{border-color:rgba(233,184,114,.35)}
.plan h3{font-size:clamp(24px,2.8vw,30px);font-weight:400}
.plan .price{font-family:var(--mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);
  margin:14px 0 20px;padding-bottom:18px;border-bottom:1px solid var(--line)}
.plan .inc{font-size:15px;color:var(--fg);line-height:1.6}
.plan .for{font-size:14px;color:var(--muted);line-height:1.6;margin-top:14px;flex:1}
.plan .btn{margin-top:26px;align-self:flex-start}

.terms{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,40px);margin-top:44px}
@media(max-width:820px){.terms{grid-template-columns:1fr;gap:26px}}
.terms div{padding-top:18px;border-top:1px solid var(--line)}
.terms b{display:block;font-family:var(--serif);font-weight:400;font-size:21px;color:var(--fg);margin-bottom:8px}
.terms span{font-size:14.5px;color:var(--muted);line-height:1.65}

/* ---------- the early-access form (the contact page's form, same bridge) ---------- */
.f{display:grid;gap:16px;max-width:680px;margin-top:34px}
.f label{display:block;font:600 10px/1.8 var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--muted2);margin-bottom:6px}
.f input,.f textarea,.f select{width:100%;background:rgba(4,20,58,.6);border:1px solid rgba(191,208,255,.22);border-radius:5px;
  color:var(--fg);font:400 16px/1.5 var(--sans);padding:14px;min-height:52px}
.f select{appearance:auto}
.f textarea{min-height:120px;resize:vertical}
.f input:focus,.f textarea:focus,.f select:focus{outline:none;border-color:var(--gold)}
.f .two{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:640px){.f .two{grid-template-columns:1fr}}
.f button{min-height:52px;border:0;border-radius:5px;background:var(--gold);color:#041A4B;
  font:600 12px/1 var(--mono);letter-spacing:.18em;text-transform:uppercase;cursor:pointer;padding:0 22px;justify-self:start}
.f button[disabled]{opacity:.55;cursor:default}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.msg{font:400 15px/1.7 var(--sans);color:var(--gold);margin-top:6px}
.fine{font:400 12px/1.7 var(--mono);color:var(--muted2);margin-top:22px;max-width:62ch}

/* ---------- the three products, as a row of links at the foot of each page ---------- */
.sw-doors{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:40px}
@media(max-width:760px){.sw-doors{grid-template-columns:1fr}}
.sw-doors a{display:block;border:1px solid var(--line);border-radius:14px;padding:20px 22px;background:var(--panel);
  transition:border-color .25s}
.sw-doors a:hover{border-color:var(--gold)}
.sw-doors a[aria-current]{border-color:var(--line2);opacity:.55;pointer-events:none}
.sw-doors b{display:block;font-family:var(--serif);font-weight:400;font-size:20px;color:var(--fg);margin-bottom:6px}
.sw-doors span{font-size:14px;color:var(--muted);line-height:1.55}

.tm{font:400 11px/1.7 var(--mono);color:var(--muted2);margin-top:40px;max-width:80ch}
