/*
 * parcor.io — the marketing page's stylesheet.
 *
 * This was two inline <style> blocks and three style="" attributes until 10 Sep 2026.
 * The site serves `style-src 'self'` with no 'unsafe-inline' (D005 closed OI-32, which
 * made the six security headers actually arrive), and that policy blocks every one of
 * those. The page rendered with browser defaults — Times New Roman, blue underlined
 * links, no background — while returning HTTP 200 with an intact DOM.
 *
 * 'unsafe-inline' was rejected. OI-32's own comment says these headers exist to survive a
 * Fortune 500 InfoSec scan during diligence, and 'unsafe-inline' is the first thing such a
 * scan marks down; adding it to fix a rendering bug would trade the reason the headers
 * exist for the convenience of not moving a file.
 *
 * So: nothing inline, ever, on this page. Doc 37 §5 is untouched — a stylesheet is not
 * runtime JS.
 */

html{color-scheme:light dark}body{margin:0}img{max-width:100%}[hidden]{display:none!important}
*,*::before,*::after{box-sizing:border-box}
  body{
    background:var(--paper); color:var(--ink);
    font-family:var(--f-body); font-size:16px; line-height:1.62;
    -webkit-font-smoothing:antialiased; margin:0;
  }
  .wrap{max-width:60rem;margin:0 auto;padding-inline:clamp(1.25rem,4.5vw,2.5rem)}
  .col{max-width:var(--measure)}
  a{color:inherit}
  :focus-visible{outline:2px solid var(--petrol);outline-offset:3px}
  h1,h2,h3{text-wrap:balance;margin:0}
  p{margin:0}

  .lab{
    font-family:var(--f-mono); font-size:.6875rem; font-weight:500;
    letter-spacing:.14em; text-transform:uppercase; color:var(--ink-3);
  }

  /* ---- masthead: reads as a document header, not a nav bar ---- */
  .mast{border-bottom:1px solid var(--rule);}
  .auth-slot{display:flex;align-items:center;gap:1.25rem;flex:0 0 auto}
  .btn-signin{
    font-family:var(--f-body);font-size:.8125rem;font-weight:500;line-height:1;
    padding:.55rem .95rem;border:1px solid var(--rule);color:var(--ink-2);
    text-decoration:none;white-space:nowrap;
    transition:border-color .15s ease,color .15s ease;
  }
  .btn-signin:hover,.btn-signin:focus-visible{border-color:var(--petrol);color:var(--petrol)}
  @media (prefers-reduced-motion:reduce){.btn-signin{transition:none}}
  .mast-in{
    display:flex; flex-wrap:wrap; gap:.9rem 2rem; align-items:center;
    justify-content:space-between; padding:1.15rem 0;
  }
  .brand{display:flex;flex-direction:column;gap:.2rem;text-decoration:none;color:inherit;flex:0 0 auto}
  .mark{font-family:var(--f-display);font-size:1.5rem;font-weight:500;letter-spacing:-.015em;line-height:1.05}
  .mark span{color:var(--patina)}
  .tagline{font-size:.8125rem;color:var(--ink-3);line-height:1.2}
  .nav{display:flex;flex-wrap:wrap;gap:.35rem 1.6rem;order:3;width:100%;
       padding-top:.9rem;border-top:1px solid var(--rule-soft)}
  .nav a{font-size:.875rem;color:var(--ink-2);text-decoration:none;padding:.15rem 0;
         border-bottom:1px solid transparent;transition:color .15s ease,border-color .15s ease}
  .nav a:hover,.nav a:focus-visible{color:var(--petrol);border-bottom-color:var(--petrol)}
  @media (min-width:52rem){
    .nav{order:0;width:auto;padding-top:0;border-top:none;margin-inline:auto}
  }
  @media (prefers-reduced-motion:reduce){.nav a{transition:none}}

  /* ---- hero ---- */
  .hero{padding:5rem 0 4.5rem;border-bottom:1px solid var(--rule)}
  .thesis{
    font-family:var(--f-display); font-weight:300;
    font-size:clamp(1.9rem,1.15rem + 3.1vw,3.35rem);
    line-height:1.14; letter-spacing:-.02em; margin:1.75rem 0 0; max-width:22ch;
  }
  .thesis em{font-style:normal;color:var(--petrol)}
  .standfirst{margin-top:1.75rem;font-size:1.0625rem;color:var(--ink-2);max-width:44ch}

  section{padding:4.25rem 0;border-bottom:1px solid var(--rule)}
  .h2{
    font-family:var(--f-display); font-weight:400; letter-spacing:-.015em;
    font-size:clamp(1.4rem,1.1rem + 1.1vw,1.9rem); line-height:1.22; margin:1rem 0 0;
  }
  .body-copy{margin-top:1.5rem;display:flex;flex-direction:column;gap:1.05rem;color:var(--ink-2)}
  .body-copy strong{color:var(--ink);font-weight:500}

  /* ---- the chain: full-bleed dark instrument panel ---- */
  .instrument{
    background:var(--panel); color:var(--panel-ink);
    border-top:1px solid var(--panel-rule); border-bottom:1px solid var(--panel-rule);
    padding:4.25rem 0 4rem;
  }
  .instrument .lab{color:var(--panel-ink-2)}
  .instrument .h2{color:var(--panel-ink)}
  .instrument .body-copy{color:var(--panel-ink-2)}
  .instrument .body-copy strong{color:var(--panel-ink)}

  .chain{margin-top:2.75rem;position:relative}
  .node{
    position:relative; padding:0 0 2.1rem clamp(1.25rem,4vw,2.25rem);
    border-left:1px solid var(--panel-rule);
  }
  .node:last-child{padding-bottom:0;border-left-color:transparent}
  .node::before{
    content:""; position:absolute; left:-4.5px; top:.55rem;
    width:9px; height:9px; background:var(--panel); border:1px solid var(--patina);
  }
  .node[data-terminal]::before{background:var(--patina)}
  .node-head{
    display:flex; flex-wrap:wrap; gap:.35rem 1rem;
    align-items:baseline; justify-content:space-between;
  }
  .node-name{font-family:var(--f-body);font-size:1.0625rem;font-weight:600;letter-spacing:-.005em}
  .node-ceiling{
    font-family:var(--f-mono); font-size:.8125rem; font-variant-numeric:tabular-nums;
    color:var(--amber);
  }
  .node-note{margin-top:.3rem;font-size:.9375rem;color:var(--panel-ink-2);max-width:46ch;overflow-wrap:anywhere}
  .fields{
    margin-top:.95rem; display:grid; gap:.3rem .9rem;
    grid-template-columns:minmax(0,1fr);
    font-family:var(--f-mono); font-size:.78125rem; line-height:1.6;
  }
  .fields dt{opacity:.8}
  @media (min-width:34rem){.fields{grid-template-columns:auto minmax(0,1fr)}.fields dt{opacity:1}}
  .fields dt{color:var(--panel-ink-2)}
  .fields dd{margin:0;color:var(--panel-ink);overflow-wrap:anywhere}
  .fields dd b{font-weight:500;color:var(--amber)}
  .caption{
    margin-top:2.5rem;padding-top:1.1rem;border-top:1px solid var(--panel-rule);
    font-size:.8125rem;color:var(--panel-ink-2);max-width:52ch;
  }

  /* ---- properties table ---- */
  .tbl-scroll{overflow-x:auto;margin-top:2rem}
  table{border-collapse:collapse;width:100%;min-width:31rem;font-size:.9375rem}
  th,td{text-align:left;padding:.72rem 1.25rem .72rem 0;border-bottom:1px solid var(--rule-soft);vertical-align:baseline}
  thead th{
    font-family:var(--f-mono);font-size:.6875rem;font-weight:500;letter-spacing:.12em;
    text-transform:uppercase;color:var(--ink-3);border-bottom-color:var(--rule);padding-bottom:.6rem;
  }
  td:first-child{color:var(--ink);width:46%}
  td:last-child{font-family:var(--f-mono);font-size:.84375rem;color:var(--ink-2);font-variant-numeric:tabular-nums;padding-right:0}
  tbody tr:last-child td{border-bottom:none}

  /* ---- position: two plain columns, no cards ---- */
  .split{display:grid;gap:2.25rem;margin-top:2rem}
  @media (min-width:44rem){.split{grid-template-columns:1fr 1fr;gap:3rem}}
  .split h3{font-family:var(--f-body);font-size:.9375rem;font-weight:600;margin-bottom:.6rem}
  .split p{color:var(--ink-2);font-size:.9375rem}
  .split > div{border-top:2px solid var(--rule);padding-top:1.1rem}
  .split > div.us{border-top-color:var(--petrol)}

  .pull{
    font-family:var(--f-display);font-weight:300;font-style:italic;
    font-size:clamp(1.25rem,1.05rem + .85vw,1.6rem);line-height:1.36;
    letter-spacing:-.01em;color:var(--ink);margin-top:2rem;max-width:30ch;
  }
  .attrib{margin-top:.85rem}

  footer{padding:3.5rem 0 4rem;font-size:.875rem;color:var(--ink-3)}
  .foot-grid{display:grid;gap:1.75rem}
  @media (min-width:44rem){.foot-grid{grid-template-columns:1fr auto;align-items:start;gap:3rem}}
  .foot-grid a{color:var(--ink-2);text-underline-offset:3px}
  .foot-grid a:hover{color:var(--petrol)}
  .legal{margin-top:2.25rem;padding-top:1.25rem;border-top:1px solid var(--rule-soft);font-size:.78125rem;max-width:56ch;color:var(--ink-3)}

/* ---------------------------------------------------------------------------
 * Replacing three style="" attributes. A style attribute needs 'unsafe-inline'
 * exactly as much as a <style> element does — the CSP report named them separately,
 * with the note that hashes do not apply to style attributes at all.
 * --------------------------------------------------------------------------- */
.mt-lg { margin-top: 1.75rem; }
.mark-footer { font-size: 1.25rem; margin-bottom: 0.6rem; }
.lab-tight { margin-bottom: 0.4rem; }