@font-face{font-family:"Rockwell";font-weight:400;font-display:swap;src:url(fonts/rockwell.ttf) format("truetype")}
@font-face{font-family:"Rockwell";font-weight:700;font-display:swap;src:url(fonts/rockwell-bold.ttf) format("truetype")}
:root{
  --ink:#414042;--sl:#454c57;--sl-d:#23282f;--sage:#596b55;--tan:#c8b598;--tan-d:#84745a;
  --rule:#e4e0db;--muted:#5d5b5f;--paper:#fdfcfa;
  --slab:"Rockwell","Rokkitt",Georgia,serif;--sans:"Montserrat","Helvetica Neue",Arial,sans-serif;
  --gut:clamp(16px,4vw,40px);--ease:cubic-bezier(.23,1,.32,1);
  color-scheme:light;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:400 17px/1.65 var(--sans);-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
h1,h2{font-family:var(--slab);font-weight:400;color:var(--sl-d);margin:0;text-wrap:balance}
p{margin:0}
a{color:inherit}
:focus-visible{outline:2px solid var(--tan-d);outline-offset:3px}
.skip{position:absolute;left:-999px;top:0;background:#fff;padding:.5rem 1rem;z-index:50}
.skip:focus{left:1rem}
.paper{position:fixed;inset:0;background:url(topo.png) center/1400px auto;opacity:.05;pointer-events:none;z-index:0}
main,.bar,.foot{position:relative;z-index:1}
.wrap{max-width:calc(1120px + var(--gut)*2);margin-inline:auto;padding-inline:var(--gut)}
.k{display:block;font:600 .72rem/1.3 var(--sans);letter-spacing:.22em;text-transform:uppercase;color:var(--tan-d)}

.bar{position:sticky;top:0;background:rgba(253,252,250,.9);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--rule);z-index:20}
.bar-in{max-width:1180px;margin:auto;padding:.7rem var(--gut);display:flex;align-items:center;gap:1rem;justify-content:space-between;min-height:56px}
.brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;font:600 .72rem var(--sans);letter-spacing:.22em;text-transform:uppercase;color:var(--sl)}
.bar-back{font:600 .72rem var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--sl-d);text-decoration:none;border-bottom:1px solid var(--tan-d);padding:.6rem 0 .2rem}

.hero{padding-block:clamp(3rem,9vw,6.5rem) clamp(2rem,5vw,3.5rem);display:grid;gap:1rem}
.hero h1{font-size:clamp(2.4rem,6vw,4.4rem);line-height:1.04}
.hero-sub{font-size:1.1rem;color:var(--muted);max-width:34rem}

.group{padding-bottom:3.5rem}
.group-h{font-size:1.5rem;padding-bottom:.8rem;margin-bottom:1.6rem;border-bottom:1px solid var(--rule)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,250px),1fr));gap:1.6rem}
.card{position:relative;display:flex;flex-direction:column;text-decoration:none;background:#fff;border:1px solid var(--rule);transition:transform .2s var(--ease)}
.card::after{content:"";position:absolute;inset:0;box-shadow:0 18px 40px -24px rgba(35,40,47,.35);opacity:0;transition:opacity .2s var(--ease);pointer-events:none}
.card-img{display:block;aspect-ratio:720/932;overflow:hidden;border-bottom:1px solid var(--rule);background:var(--rule)}
.card-img img{width:100%;height:100%;object-fit:cover}
.card-body{display:grid;gap:.45rem;padding:1.2rem 1.2rem 1.4rem;flex:1;align-content:start}
.card-t{font:400 1.3rem/1.2 var(--slab);color:var(--sl-d)}
.card-x{font-size:.95rem;line-height:1.5;color:var(--muted)}
.card-go{margin-top:.5rem;justify-self:start;font:600 .72rem var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--sl-d);border-bottom:1px solid var(--tan-d);padding-bottom:.15rem}
@media (hover:hover) and (pointer:fine){.card:hover{transform:translateY(-4px)}.card:hover::after{opacity:1}}

.doc{display:grid;grid-template-columns:minmax(0,340px) minmax(0,1fr);gap:clamp(1.6rem,5vw,4rem);align-items:start;padding-block:clamp(2.5rem,7vw,5rem) 3rem}
.doc-cover img{border:1px solid var(--rule);box-shadow:0 18px 40px -24px rgba(35,40,47,.35)}
.doc-text{display:grid;gap:.8rem;max-width:38rem}
.doc-text h1{font-size:clamp(2rem,4.6vw,3.2rem);line-height:1.06}
.doc-vol{font:400 1.2rem var(--slab);color:var(--tan-d)}
.doc-lead{font-size:1.15rem;color:var(--sl-d)}
.doc-body{display:grid;gap:.6rem;color:var(--muted)}
.doc-btns{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:.8rem}
.btn{display:inline-flex;align-items:center;min-height:44px;padding:.6rem 1.3rem;background:var(--sl-d);color:#fff;text-decoration:none;font:600 .74rem var(--sans);letter-spacing:.18em;text-transform:uppercase}
.btn-2{background:transparent;color:var(--sl-d);border:1px solid var(--sl-d)}
.viewer{padding-bottom:4rem}
.viewer iframe{display:block;width:100%;height:88vh;border:1px solid var(--rule);background:#fff}

.foot{border-top:1px solid var(--rule);padding-block:3rem 4rem;text-align:center}
.foot-tag{font:400 1.2rem var(--slab);color:var(--tan-d);margin-bottom:.6rem}
.foot-fine{font-size:.8rem;color:var(--muted)}

@media (max-width:560px){.grid{gap:1rem}.card{flex-direction:row}.card-img{width:104px;flex:none;align-self:flex-start;border-bottom:0;border-right:1px solid var(--rule)}.card-body{padding:.9rem 1rem 1rem}.card-t{font-size:1.15rem}}
@media (max-width:760px){.doc{grid-template-columns:1fr}.doc-cover{max-width:260px}.viewer{display:none}}
@media (prefers-reduced-motion:reduce){.card,.card::after{transition:none}.card:hover{transform:none}}