/* page-foundry homepage — "Slab" direction (brutalist-minimal).
   White ground, pure-black ink, one screaming red, thick borders, oversized grotesque.
   Red (#ff3b1d) is used ONLY for large display text, borders, and black-on-red buttons
   (black-on-red = 5.9:1). Small text is always black on white. WCAG 2.2 AA from the ground. */
:root{
  --bg:#fafaf7; --ink:#0a0a0a; --ink-2:#2b2b28; --red:#ff3b1d; --dim:#4a4a45;
  --line:#0a0a0a; --panel:#ffffff; --wash:#f0efe9;
  --grot:"Helvetica Neue","Arial Black","Arial Bold",Arial,sans-serif;
  --sans:-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;
  --mono:ui-monospace,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace;
  --maxw:76rem; --pad:clamp(1rem,4vw,1.6rem); --bd:3px;
}
*{box-sizing:border-box;margin:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:1.02rem;line-height:1.5;
  -webkit-font-smoothing:antialiased}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--pad)}
a{color:var(--ink)}
a:focus-visible,button:focus-visible{outline:3px solid var(--red);outline-offset:2px}
h1,h2,h3{margin:0;font-family:var(--grot);font-weight:800;letter-spacing:-.03em;line-height:.94;
  text-transform:uppercase;overflow-wrap:break-word;text-wrap:balance}
.u{-webkit-text-stroke:2px var(--ink);color:transparent}
.red{color:var(--red)}
.rule{border:0;border-top:var(--bd) solid var(--ink);margin:0}

/* nav */
.nav{border-bottom:var(--bd) solid var(--ink);position:sticky;top:0;background:var(--bg);z-index:20}
.nav__in{display:flex;justify-content:space-between;align-items:center;height:3.7rem;gap:1rem}
.brand{font-family:var(--grot);font-weight:800;font-size:1.15rem;letter-spacing:-.03em;text-transform:uppercase;text-decoration:none}
.nav__links{display:none;gap:.4rem;align-items:center}
.nav__links a{font-weight:700;font-size:.8rem;text-transform:uppercase;letter-spacing:.02em;text-decoration:none;padding:.5rem .6rem}
.nav__links a:hover{color:var(--red);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}
.nav__gh{background:var(--ink);color:var(--bg)!important}
@media(min-width:48rem){.nav__links{display:flex}}

/* sections */
section{border-bottom:var(--bd) solid var(--ink)}
.sec{padding:clamp(2.6rem,7vw,4.6rem) 0}
.sec__tag{display:inline-block;background:var(--red);color:var(--ink);font-weight:800;font-size:.72rem;
  letter-spacing:.06em;text-transform:uppercase;padding:.3rem .6rem;margin-bottom:1rem}
.sec__h{font-size:clamp(1.7rem,5vw,3rem);border-bottom:var(--bd) solid var(--ink);padding-bottom:.55rem;margin-bottom:1.4rem}
.lede{font-size:1.15rem;max-width:60ch;color:var(--ink-2)}

/* hero */
.hero{padding:clamp(2rem,6vw,3.4rem) 0 clamp(1.6rem,4vw,2.4rem)}
.hero h1{font-size:clamp(2.6rem,8.5vw,5.7rem)}
.hero__row{display:grid;grid-template-columns:1.5fr 1fr;gap:2rem;align-items:end;margin-top:1.6rem;
  border-top:var(--bd) solid var(--ink);padding-top:1.5rem}
.hero__row>*{min-width:0}
@media(max-width:52rem){.hero__row{grid-template-columns:1fr;gap:1.4rem}}
.hero__sub{font-size:clamp(1.1rem,2.4vw,1.32rem);font-weight:500;max-width:36ch}
.cta{display:flex;flex-direction:column;gap:.8rem;align-items:start}
.cmd{display:flex;justify-content:space-between;align-items:stretch;gap:.5rem;width:100%;max-width:100%;
  background:var(--ink);border:var(--bd) solid var(--ink);min-width:0}
.cta{align-self:stretch}
.cta>.cmd,.cta>.demo{width:100%}
.cmd__t{flex:1;min-width:0;overflow-x:auto;white-space:nowrap;color:var(--bg);font-family:var(--mono);
  font-size:.86rem;padding:.85rem .9rem;display:flex;align-items:center}
.cmd__c{flex:none;border:0;background:var(--red);color:var(--ink);font-family:var(--sans);font-weight:800;
  font-size:.66rem;letter-spacing:.06em;text-transform:uppercase;padding:0 .9rem;cursor:pointer}
.cmd__c:hover{background:#ff5638}
.star{font-weight:800;font-size:.9rem;text-transform:uppercase;letter-spacing:.02em;text-decoration:none;
  border-bottom:4px solid var(--red);padding-bottom:2px}
.demo{font-family:var(--mono);font-size:.8rem;color:var(--dim)}
.hero__meta{font-family:var(--mono);font-size:.74rem;color:var(--dim);letter-spacing:.02em}

/* showcase — uneven brutalist grid */
.gal{display:grid;grid-template-columns:1.7fr 1fr;gap:1.1rem}
@media(max-width:52rem){.gal{grid-template-columns:1fr}}
.gal__col{display:grid;grid-template-rows:1fr 1fr;gap:1.1rem}
@media(max-width:52rem){.gal__col{grid-template-rows:none}}
.shot{border:var(--bd) solid var(--ink);background:var(--panel);overflow:hidden;min-width:0}
.shot img{display:block;width:100%;object-fit:cover;object-position:top}
.shot--big img{height:clamp(12rem,32vw,19rem)}
.shot--sm img{height:clamp(8rem,15vw,8.6rem);-webkit-mask-image:linear-gradient(#000 55%,transparent 97%);mask-image:linear-gradient(#000 55%,transparent 97%)}
.shot figcaption{font-weight:700;font-size:.82rem;padding:.55rem .65rem;border-top:var(--bd) solid var(--ink);text-transform:uppercase;letter-spacing:.01em}
.shot figcaption b{color:var(--red)}
.shot a{text-decoration:none}

/* how it works — the roster */
.roster{display:grid;grid-template-columns:repeat(2,1fr);gap:0;border:var(--bd) solid var(--ink);margin-top:.4rem}
@media(min-width:44rem){.roster{grid-template-columns:repeat(3,1fr)}}
.role{padding:1rem 1.1rem;border-right:var(--bd) solid var(--ink);border-bottom:var(--bd) solid var(--ink)}
.role__n{font-family:var(--mono);font-size:.72rem;color:var(--red);font-weight:700}
.role b{display:block;font-family:var(--grot);font-weight:800;text-transform:uppercase;font-size:1rem;margin:.3rem 0 .2rem;letter-spacing:-.01em}
.role span{font-size:.86rem;color:var(--dim)}
.callout{border:var(--bd) solid var(--ink);background:var(--panel);padding:.85rem 1.1rem;margin-top:1.5rem;font-size:1.05rem;max-width:60ch;font-weight:500}

/* gates */
.gates{list-style:none;padding:0;margin:1.2rem 0 0;display:grid;grid-template-columns:1fr;gap:0;border:var(--bd) solid var(--ink)}
@media(min-width:40rem){.gates{grid-template-columns:1fr 1fr}}
.gates li{padding:.7rem 1rem;border-bottom:var(--bd) solid var(--ink);font-size:.94rem;display:flex;gap:.6rem}
@media(min-width:40rem){.gates li:nth-child(odd){border-right:var(--bd) solid var(--ink)}}
.gates b{font-family:var(--grot);text-transform:uppercase;font-size:.82rem;letter-spacing:.01em}
.gates .no{color:var(--red);font-weight:800;flex:none}
/* gate report card (real data) */
.report{border:var(--bd) solid var(--ink);margin-top:1.6rem;background:var(--ink);color:var(--bg)}
.report__h{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.7rem 1rem;border-bottom:var(--bd) solid var(--red);
  font-family:var(--mono);font-size:.78rem;color:#bdb8ab;flex-wrap:wrap}
.report__h b{color:var(--red);font-family:var(--grot);text-transform:uppercase;font-size:.86rem}
.report table{width:100%;border-collapse:collapse;font-family:var(--mono);font-size:.82rem}
.report td{padding:.42rem 1rem;border-bottom:1px solid #262626}
.report tr td:last-child{text-align:right;color:#bdb8ab}
.report tr:last-child td{border-bottom:0}
.report .pass{color:#5bd97a}

/* own it + handoff / safety */
.two{display:grid;grid-template-columns:1fr 1fr;gap:0;border:var(--bd) solid var(--ink);margin-top:.4rem}
@media(max-width:44rem){.two{grid-template-columns:1fr}}
.two>div{padding:1.2rem 1.2rem;border-right:var(--bd) solid var(--ink)}
.two>div:last-child{border-right:0}
.two h3{font-size:1.1rem;margin-bottom:.5rem}
.two p{font-size:.95rem;color:var(--ink-2)}
.pratfall{margin-top:1.3rem;font-family:var(--mono);font-size:.9rem;color:var(--dim);border-top:var(--bd) solid var(--ink);padding-top:1rem}

/* install */
.install .cmd{max-width:44rem;margin-top:1rem}
.built{margin-top:1.6rem;font-size:.95rem;color:var(--ink-2);max-width:64ch}
.built a{font-weight:700}

/* footer */
.foot{border-bottom:0;padding:1.6rem 0;font-family:var(--mono);font-size:.8rem}
.foot__in{display:flex;justify-content:space-between;flex-wrap:wrap;gap:.8rem}
.foot a{text-decoration:none;color:var(--ink)}
.foot a:hover{color:var(--red);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}