/* Capabilities statement v7 (brief S1). Every rule is scoped under .astr-statement.
   Colors come from the site tokens (spec 5.2); statement.html repeats them for the standalone PDF.
   Layout: one US Letter page (8.5 x 11 in, 0.5 in margins) drawn to the container's width, so the web page
   shows the same page as the PDF. Header band across the top; below it two columns, main 64% (Core
   Competencies, Past Performance) and a sidebar 36% (Differentiators, Company Data, Contact); a footer line.
   Below 760 px of container width the blocks stack (tablet and phone widths).
   Type roles on the page (1em = 12 pt at Letter size): title 1.833em (22 pt), headings .958em (11.5 pt),
   main body .833em (10 pt), sidebar body and the update date .792em (9.5 pt, the floor). */

/* Width comes from the page column. On a desktop screen the page is drawn up to 10.5 in wide, so its 10 pt
   body reads at about 16 px; in print (the PDF) it is exactly the Letter page. */
.astr-statement{container-type:inline-size;max-width:10.5in}
.astr-statement *,.astr-statement *::before,.astr-statement *::after{box-sizing:border-box}
.astr-statement article{
  font-size:calc(100cqw / 51);width:51em;height:66em;padding:3em;margin:0;
  display:flex;flex-direction:column;gap:1.25em;
  font-family:var(--sans);line-height:1.36;color:var(--ink);background:var(--paper);
  border:1px solid var(--rule)}
.astr-statement p,.astr-statement ul,.astr-statement dl,.astr-statement dd,.astr-statement dt,.astr-statement li,
.astr-statement section{margin:0;padding:0;max-width:none}
.astr-statement ul{list-style:none}
.astr-statement article h2{font-size:.958em;font-weight:700;line-height:1.3;letter-spacing:.01em;color:var(--navy);
  text-transform:none;margin:0 0 .45em;padding-bottom:.2em;border-bottom:2px solid var(--navy);max-width:none}
.astr-statement code{font-family:var(--mono);font-size:1em;background:none;padding:0;color:inherit}
.astr-statement a{color:var(--navy)}
.astr-statement b{font-weight:700}

/* Header band: identity left, the promise right */
.astr-statement article>header{display:flex;justify-content:space-between;align-items:flex-end;gap:1.5em;
  background:var(--navy);color:var(--paper);padding:1.05em 1.5em;flex:none}
.astr-statement article>header img{display:block;width:auto;height:1.75em;filter:brightness(0) invert(1)}
.astr-statement article>header>div:first-child p:nth-of-type(1){font-size:.958em;font-weight:600;margin-top:.55em}
.astr-statement article>header>div:first-child p:nth-of-type(2){font-size:1.833em;font-weight:600;line-height:1.1;margin-top:.05em}
.astr-statement article>header>div:last-child{flex:0 1 17em;text-align:right;color:var(--tint)}
.astr-statement article>header>div:last-child p:first-child{font-size:.958em;font-weight:600;line-height:1.4;color:var(--paper)}
.astr-statement article>header>div:last-child p:first-child span{display:block}
.astr-statement article>header>div:last-child p+p{font-size:.833em;margin-top:.35em}

/* Two columns, 64 : 36 */
.astr-statement .st-cols{flex:1 1 auto;min-height:0;display:grid;grid-template-columns:minmax(0,64fr) minmax(0,36fr);gap:1.5em}
.astr-statement .st-main{display:flex;flex-direction:column;gap:1.5em;font-size:.833em;line-height:1.45;padding-top:.9em}
.astr-statement .st-main h2{font-size:1.15em}
.astr-statement .st-side{display:flex;flex-direction:column;gap:1.05em;font-size:.7925em;
  background:var(--pale);padding:.95em 1.05em 1.05em}
.astr-statement .st-side h2{font-size:1.21em}

/* Core Competencies: navy square bullets */
.astr-statement .st-list li{position:relative;padding-left:1em;margin-top:.32em}
.astr-statement .st-list li:first-child{margin-top:0}
.astr-statement .st-list li::before{content:"";position:absolute;left:0;top:.5em;width:.42em;height:.42em;background:var(--navy)}
.astr-statement .st-list b{color:var(--navy)}

/* Past Performance: the one entry, its seals, dated task lines, then the company-funded prototype */
.astr-statement .st-pphead{display:flex;justify-content:space-between;align-items:flex-end;gap:1em;
  border-bottom:2px solid var(--navy);padding-bottom:.3em;margin-bottom:.5em}
.astr-statement .st-pphead h2{margin:0;padding:0;border:0}
.astr-statement .st-seals{display:flex;gap:.55em;flex:none}
.astr-statement .st-seals img{display:block;width:2.9em;height:2.9em;object-fit:contain}
.astr-statement .st-entry{line-height:1.4;margin-bottom:.55em}
.astr-statement .st-entry b{font-size:1.1em;color:var(--navy)}
.astr-statement .st-tasks{border-left:3px solid var(--navy);padding-left:.85em}
.astr-statement .st-tasks li{margin-top:.38em}
.astr-statement .st-tasks li:first-child{margin-top:0}
.astr-statement .st-date{color:var(--muted);white-space:nowrap}
.astr-statement .st-date::before{content:"· "}
.astr-statement .st-proto{display:grid;grid-template-columns:minmax(0,1fr) 12em;gap:.9em;align-items:start;
  margin-top:-.4em;padding-top:.7em;border-top:1px solid var(--rule)}
.astr-statement .st-proto img{display:block;width:100%;height:auto;aspect-ratio:5/3;object-fit:cover}

/* Sidebar: differentiators, company data, contact */
.astr-statement .st-diff dt{font-size:1.16em;font-weight:700;line-height:1.25;color:var(--navy);margin-top:.5em}
.astr-statement .st-diff dt:first-child{margin-top:0}
.astr-statement .st-diff dd{margin-top:.1em}
.astr-statement .st-data{display:grid;grid-template-columns:5.5em minmax(0,1fr);gap:.28em .5em}
.astr-statement .st-data dt{color:var(--muted);white-space:nowrap}
.astr-statement .st-data .st-wide{grid-column:1 / -1}
.astr-statement .st-data dd.st-wide{margin-top:-.1em}
.astr-statement .st-data li+li{margin-top:.22em}
.astr-statement .st-contact li{display:flex;flex-wrap:wrap;gap:0 1.2em}
.astr-statement .st-contact li+li{margin-top:.15em}
.astr-statement .st-contact b{color:var(--ink)}

/* Footer: the contact block, then the update date */
.astr-statement article>footer{flex:none;display:flex;justify-content:space-between;align-items:baseline;gap:1em;
  border-top:2px solid var(--navy);padding-top:.5em;font-size:.833em}
.astr-statement article>footer section{flex:1 1 auto;display:flex;align-items:baseline;gap:.8em;min-width:0}
.astr-statement article>footer h2{flex:none;font-size:1.1em;margin:0;padding:0;border:0}
.astr-statement article>footer>p{flex:none;font-size:.955em;color:var(--muted);text-align:right}

/* The web page below 760 px of container width: blocks stack, text at the reader's size */
@container (max-width:759.98px){
  .astr-statement article{font-size:1rem;width:auto;height:auto;padding:0;border:0;gap:1.6em}
  .astr-statement article>header{flex-direction:column;align-items:flex-start;gap:.8em;padding:1em}
  .astr-statement article>header>div:last-child{text-align:left;flex:none}
  .astr-statement .st-cols{grid-template-columns:minmax(0,1fr);gap:1.6em}
  .astr-statement .st-main,.astr-statement .st-side{font-size:1em}
  .astr-statement .st-main h2,.astr-statement .st-side h2{font-size:1.1em}
  .astr-statement .st-pphead{flex-wrap:wrap}
  .astr-statement .st-seals img{width:2.8em;height:2.8em}
  .astr-statement .st-proto{grid-template-columns:minmax(0,1fr)}
  .astr-statement .st-proto img{max-width:22em}
  .astr-statement .st-data{grid-template-columns:5.6em minmax(0,1fr)}
  .astr-statement article>footer,.astr-statement article>footer section{flex-direction:column;align-items:flex-start;gap:.5em}
  .astr-statement article>footer{font-size:1em}
}

@media print{
  .astr-statement{max-width:none}
  .astr-statement article{border:0}
}
