/* ProseLoom.com — site styles
   Self-contained. No CDN, no webfont, no framework, no JavaScript required. */

:root{
  --paper:#faf7f2;
  --paper-2:#f2ece1;
  --ink:#1e1b17;
  --ink-soft:#4a443b;
  --ink-faint:#7a7267;
  --rule:#e0d7c7;
  --thread:#a4462a;
  --thread-dark:#7d3520;
  --deep:#221f1a;
  --deep-2:#2c2822;
  --ok:#3f6b45;
  --warn:#8a6d1f;
  --maxw:1080px;
  --serif:Georgia,"Iowan Old Style","Palatino Linotype",Palatino,"Times New Roman",serif;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --mono:ui-monospace,"Cascadia Mono","Consolas","Liberation Mono",monospace;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:var(--serif); font-size:18px; line-height:1.62;
  text-rendering:optimizeLegibility;
}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 24px}
a{color:var(--thread-dark); text-underline-offset:3px}
a:hover{color:var(--thread)}
h1,h2,h3,h4{line-height:1.2; margin:0 0 .5em; font-weight:600}
h1{font-size:clamp(34px,5.2vw,54px); letter-spacing:-.015em}
h2{font-size:clamp(25px,3.2vw,34px); letter-spacing:-.01em}
h3{font-size:21px}
p{margin:0 0 1em}
small{font-size:15px; color:var(--ink-faint)}
hr{border:0; border-top:1px solid var(--rule); margin:56px 0}
code{font-family:var(--mono); font-size:.88em; background:var(--paper-2);
     padding:2px 6px; border-radius:4px}

.masthead{border-bottom:1px solid var(--rule); background:var(--paper); position:sticky; top:0; z-index:10}
.masthead .wrap{display:flex; align-items:center; gap:28px; height:68px}
.wordmark{font-family:var(--serif); font-size:23px; font-weight:600; letter-spacing:-.01em;
          color:var(--ink); text-decoration:none; white-space:nowrap}
.wordmark .tm{font-size:11px; vertical-align:super; color:var(--ink-faint); font-weight:400; letter-spacing:0}
.nav{margin-left:auto; display:flex; gap:22px; flex-wrap:wrap}
.nav a{font-family:var(--sans); font-size:15px; color:var(--ink-soft); text-decoration:none}
.nav a:hover,.nav a[aria-current]{color:var(--thread-dark); text-decoration:underline}

.btn{display:inline-block; font-family:var(--sans); font-size:16px; font-weight:600;
     padding:14px 26px; border-radius:6px; text-decoration:none; border:1px solid transparent;
     transition:transform .06s ease}
.btn:active{transform:translateY(1px)}
.btn-primary{background:var(--thread); color:#fff}
.btn-primary:hover{background:var(--thread-dark); color:#fff}
.btn-quiet{background:transparent; color:var(--ink); border-color:var(--rule)}
.btn-quiet:hover{border-color:var(--ink-faint); color:var(--ink)}
.btn-row{display:flex; gap:14px; flex-wrap:wrap; align-items:center; margin:26px 0 14px}

.hero{padding:76px 0 8px}
.hero .lede{font-size:clamp(19px,2.1vw,22px); color:var(--ink-soft); max-width:44ch; margin-bottom:0}
.kicker{font-family:var(--sans); font-size:13px; letter-spacing:.13em; text-transform:uppercase;
        color:var(--thread-dark); margin:0 0 16px; font-weight:600}

.trustbar{border-top:1px solid var(--rule); border-bottom:1px solid var(--rule);
          background:var(--paper-2); margin-top:44px}
.trustbar .wrap{display:flex; flex-wrap:wrap; gap:10px 34px; padding-top:16px; padding-bottom:16px}
.trustbar span{font-family:var(--sans); font-size:14px; color:var(--ink-soft)}
.trustbar b{color:var(--ink); font-weight:600}

figure{margin:0}
.shot{border:1px solid var(--rule); border-radius:10px; background:#fff; overflow:hidden;
      box-shadow:0 1px 0 rgba(0,0,0,.03), 0 18px 44px -28px rgba(30,27,23,.42)}
.shot img{display:block; width:100%; height:auto}
figcaption{font-family:var(--sans); font-size:13.5px; color:var(--ink-faint); margin-top:10px}

section{padding:64px 0}
section.tight{padding:44px 0}
.band{background:var(--deep); color:#efe8dc}
.band h2{color:#fff}
.band a{color:#f0c9b6}
.band .grid p{color:#cfc6b8}

.grid{display:grid; gap:34px; grid-template-columns:repeat(auto-fit,minmax(258px,1fr))}
.grid h3{margin-bottom:.35em}
.grid p{color:var(--ink-soft); font-size:16.5px; margin:0}

table{border-collapse:collapse; width:100%; font-family:var(--sans); font-size:15.5px}
th,td{text-align:left; padding:13px 14px; border-bottom:1px solid var(--rule); vertical-align:top}
th{font-weight:600; color:var(--ink)}
thead th{border-bottom:2px solid var(--ink-faint); font-size:14px}
td.y{color:var(--ok); font-weight:600}
td.n{color:var(--ink-faint)}
.tablenote{font-family:var(--sans); font-size:13.5px; color:var(--ink-faint); margin-top:12px}

.card{border:1px solid var(--rule); border-radius:10px; padding:28px; background:#fff}
details{border-bottom:1px solid var(--rule); padding:16px 0}
details summary{cursor:pointer; font-weight:600; font-size:18px; list-style:none}
details summary::-webkit-details-marker{display:none}
details summary::before{content:"+ "; color:var(--thread); font-weight:700}
details[open] summary::before{content:"– "}
details p{margin:12px 0 4px; color:var(--ink-soft); font-size:16.5px}

.note{border-left:3px solid var(--thread); background:var(--paper-2); padding:16px 20px;
      font-family:var(--sans); font-size:15.5px; color:var(--ink-soft); border-radius:0 6px 6px 0}
.note b{color:var(--ink)}

footer{background:var(--deep-2); color:#bdb4a6; font-family:var(--sans); font-size:14.5px;
       padding:52px 0 40px; margin-top:24px}
footer a{color:#e2d8c9; text-decoration:none}
footer a:hover{text-decoration:underline; color:#fff}
.fcols{display:grid; gap:30px; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); margin-bottom:34px}
.fcols h4{color:#fff; font-family:var(--sans); font-size:13px; letter-spacing:.1em;
          text-transform:uppercase; margin:0 0 12px}
.fcols ul{list-style:none; margin:0; padding:0}
.fcols li{margin-bottom:8px}
.legal{border-top:1px solid #40392f; padding-top:22px; color:#8d8477; font-size:13.5px}
.legal p{margin:0 0 8px}

.skip{position:absolute; left:-9999px}
.skip:focus{position:static; display:block; padding:10px; background:var(--thread); color:#fff}
