:root{
  --logo-w:clamp(260px,80vw,560px);   
  --col:620px;                          
  --ink:#22262B; --logo:#706B65; --bronze:#A2663A; --grey:#6F6A64; --rule:#D8D4CE; --bg:#FDFCFA;
  --sans:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --serif:Cambria,'Iowan Old Style',Georgia,serif;
  --cage:800px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--bg); color:var(--ink); font-family:var(--sans);
  -webkit-font-smoothing:antialiased; min-height:100vh; min-height:100svh;
  display:flex; flex-direction:column; align-items:center;
  padding:0 24px; text-align:center;
}
.skip{position:absolute; left:-9999px}
.skip:focus{left:24px; top:14px; background:var(--ink); color:#fff; padding:8px 14px; z-index:99}
.lang{position:fixed; top:20px; right:24px; font-size:11px; letter-spacing:.14em; color:var(--grey); z-index:1}
.lang a{color:var(--grey); text-decoration:none; border-bottom:1px solid transparent; padding-bottom:2px}
.lang a:hover{color:var(--ink); border-bottom-color:var(--bronze)}
main{width:100%; flex:1; display:flex; flex-direction:column; align-items:center}
h1{
  margin:0; font-size:0; line-height:0; width:100%;
  flex:1; display:flex; align-items:center; justify-content:center;
  min-height:min(60svh,600px); padding:clamp(72px,11vh,120px) 0 clamp(56px,8vh,96px);
}
.logo{display:block; width:var(--logo-w); height:auto}
.logo .t,.logo .lg{fill:var(--logo)}
.logo .tb,.logo .bead{fill:var(--bronze)}
.logo .tc{fill:var(--logo)}
.text{width:100%; max-width:var(--col); text-align:left}
p{font-size:15.5px; line-height:1.75; color:var(--ink); margin:0 0 22px}
p.quiet{color:var(--grey); margin:0}
.mail{color:var(--ink); user-select:all; -webkit-user-select:all; white-space:nowrap}
.frag{
  font-family:var(--serif); font-style:italic; font-size:16.5px; line-height:1.8;
  color:var(--grey); border-left:2px solid var(--bronze); padding-left:20px; margin:0 0 34px;
}
a{color:var(--ink); text-underline-offset:3px; text-decoration-color:var(--rule)}
a:hover{text-decoration-color:var(--bronze)}
a:focus-visible,button:focus-visible{outline:2px solid var(--bronze); outline-offset:3px}
footer{
  width:100%; max-width:var(--col); text-align:left; margin:52px 0 40px; padding-top:20px; border-top:1px solid var(--rule);
  font-size:11.5px; letter-spacing:.04em; color:var(--grey); line-height:1.5;
}
@media (max-width:560px){
  h1{min-height:0; padding:84px 0 56px}
  .frag{font-size:16px}
}
.doc{flex:1 0 auto; display:block; padding-top:84px}
.doc h1{font-size:30px; line-height:1.15; font-family:var(--serif); font-weight:400; margin:0 0 18px; min-height:0; padding:0; flex:none; display:block}
.doc h2{font-size:18px; line-height:1.3; font-weight:600; margin:30px 0 8px}
.doc h3{font-size:15.5px; line-height:1.4; font-weight:600; margin:18px 0 6px}
.doc p{font-size:15px}
.doc .intro{color:var(--grey); font-size:16px; margin-bottom:8px}
footer p{font-size:inherit; line-height:inherit; color:inherit; letter-spacing:inherit; margin:0 0 4px}
footer p:last-child{margin-bottom:0}
footer a{color:var(--grey)}