:root{--ink:#161616;--paper:#f5f4f1;--text:#1d1d1d;--gold:#b88a3c;--gold-dark:#7a5218;--line:#d9d4c7;
--grad:linear-gradient(90deg,#8d5e25,#d4b45f 45%,#f0e08f 60%,#b88a3c);
--dark:linear-gradient(135deg,#0f0f0f,#3a3a3a);
--serif:"Bodoni 72","Bodoni MT",Didot,"Didot LT STD","Playfair Display",Georgia,serif;
--sans:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--text);font:17px/1.65 var(--sans)}
a{color:var(--gold-dark)}
a:focus-visible,summary:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
img{max-width:100%}
.wrap{max-width:62rem;margin:0 auto;padding:0 1.25rem}

.top{background:var(--ink)}
.top .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.75rem 2rem;padding-top:1rem;padding-bottom:1rem}
.brand{display:flex;align-items:center;gap:.75rem;text-decoration:none}
.brand img{width:44px;height:44px}
.bn{display:block}
.nm{display:block;font:1.4rem/1 var(--serif);letter-spacing:.06em;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.brand small{display:block;margin-top:.35rem;font:.82rem/1 var(--sans);letter-spacing:.04em;color:#cdbf9a}
nav ul{display:flex;flex-wrap:wrap;gap:.25rem 1.5rem;list-style:none;margin:0;padding:0}
nav a{color:#e9e4d6;text-decoration:none;padding:.35rem 0;border-bottom:2px solid transparent}
nav a:hover{border-color:#8d7a4f}
nav a[aria-current]{border-color:var(--gold)}

.hero,.pagehead{background:var(--dark);color:#f1ede2;border-bottom:3px solid;border-image:var(--grad) 1}
.hero{text-align:center;padding:3.5rem 0 4rem}
.hero img{width:min(380px,80%);height:auto}
.hero h1{font:400 clamp(1.8rem,4.5vw,2.8rem)/1.2 var(--serif);margin:1.5rem auto .75rem;max-width:24ch}
.hero p{max-width:38rem;margin:0 auto 1.75rem;color:#d7d1c2}
.pagehead{padding:2.5rem 0}
.pagehead h1{font:400 clamp(2rem,5vw,3rem)/1.15 var(--serif);margin:0}
.pagehead p{margin:.75rem 0 0;color:#d7d1c2;max-width:40rem}
.btn{display:inline-block;padding:.75rem 1.4rem;border:1px solid var(--gold);background:var(--grad);color:var(--ink);text-decoration:none;font-weight:600;margin:.25rem}
.btn.alt{background:none;color:#f1ede2}

section{padding:2.5rem 0}
section+section{border-top:1px solid var(--line)}
h2{font:400 1.75rem/1.25 var(--serif);margin:0 0 1rem}
h3{font:400 1.3rem/1.3 var(--serif);margin:0 0 .5rem}
.prose{max-width:42rem}
ul.plain{padding-left:1.1rem;margin:.5rem 0 1rem}
ul.plain li{margin:.25rem 0}
.cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));gap:2rem 3rem}

ol.steps{list-style:none;padding:0;margin:1rem 0 0;counter-reset:s;max-width:42rem}
ol.steps li{counter-increment:s;position:relative;padding-left:3.25rem;margin:0 0 1.1rem}
ol.steps li::before{content:counter(s);position:absolute;left:0;top:.05rem;width:2.1rem;height:2.1rem;border:1px solid var(--gold);border-radius:50%;text-align:center;line-height:2rem;font-family:var(--serif);color:var(--gold-dark)}

.intro{display:flex;flex-wrap:wrap;align-items:center;gap:2rem 2.5rem}
.portrait{display:block;width:170px;height:170px;border-radius:50%;object-fit:cover;object-position:50% 20%;border:3px solid var(--gold);flex:none}
.portrait.big{width:230px;height:230px}

.scroll{overflow-x:auto}
table{width:100%;border-collapse:collapse;margin:.5rem 0 2rem}
th,td{text-align:left;padding:.7rem .6rem .7rem 0;border-bottom:1px solid var(--line);vertical-align:top}
th{font-weight:600;border-bottom:2px solid var(--gold)}
td.pris{white-space:nowrap;font-weight:600;padding-right:1.25rem}
td.not{color:#4d4a43}
caption{text-align:left;font:400 1.3rem/1.3 var(--serif);padding-bottom:.5rem}

details{border-bottom:1px solid var(--line);padding:1rem 0}
summary{cursor:pointer;font:400 1.2rem/1.4 var(--serif);list-style:none;position:relative;padding-right:2rem}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";position:absolute;right:0;top:0;color:var(--gold-dark)}
details[open] summary::after{content:"\2013"}
details>:not(summary){max-width:42rem}
details>p:first-of-type{margin-top:.75rem}

footer{background:var(--ink);color:#cfc8b6;padding:2.5rem 0;font-size:.95rem}
footer h2{color:#f1ede2;font-size:1.4rem}
footer a{color:#e3c97a}
footer p{margin:.25rem 0;max-width:42rem}
.small{font-size:.9rem;margin-top:1.5rem}
