:root{
  --white:#FFFFFF;
  --paper:#F6FAFD;
  --navy:#1C2A4A;
  --navy-deep:#10182C;
  --ink:#151F3C;
  --muted:#4A576F;
  --line:#E3E9F2;
  --gold:#A88661;
  --maxw:820px;
  --pad-x:clamp(18px,5vw,40px);
  --ff-display:"Bodoni Moda",Georgia,serif;
  --ff-body:"Archivo",system-ui,sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  font-family:var(--ff-body);
  font-weight:300;
  color:var(--ink);
  background:var(--paper);
  line-height:1.75;
  font-size:16px;
}
.topbar{
  background:var(--navy-deep);
  color:#fff;
  text-align:center;
  padding:11px 16px;
  font-size:.68rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  font-weight:500;
}
.head{
  background:var(--navy);
  color:#fff;
  padding:26px var(--pad-x) 0;
}
.head__in{
  max-width:var(--maxw);
  margin:0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  flex-wrap:wrap;
}
.brand{
  font-family:var(--ff-display);
  font-size:1.5rem;
  letter-spacing:.12em;
  color:#fff;
  text-decoration:none;
  font-weight:600;
}
.brand span{color:var(--gold)}
.back{
  color:rgba(255,255,255,.8);
  text-decoration:none;
  font-size:.78rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  border-bottom:1px solid rgba(255,255,255,.3);
  padding-bottom:3px;
  transition:color .2s,border-color .2s;
}
.back:hover{color:var(--gold);border-color:var(--gold)}
.hero{
  background:var(--navy);
  color:#fff;
  padding:44px var(--pad-x) 56px;
}
.hero__in{max-width:var(--maxw);margin:0 auto}
.hero h1{
  font-family:var(--ff-display);
  font-weight:400;
  font-size:clamp(2rem,6vw,3.1rem);
  line-height:1.1;
  margin:0 0 14px;
  letter-spacing:-.01em;
}
.hero h1 em{color:var(--gold);font-style:italic}
.hero p{
  margin:0;
  color:rgba(255,255,255,.72);
  font-size:.92rem;
  max-width:56ch;
}
main{
  max-width:var(--maxw);
  margin:0 auto;
  padding:52px var(--pad-x) 80px;
}
.notice{
  background:#FFF8E8;
  border:1px solid #E8D9AE;
  border-left:3px solid var(--gold);
  padding:16px 20px;
  margin:0 0 40px;
  font-size:.86rem;
  color:#5C4A24;
  line-height:1.65;
}
.notice b{font-weight:600}
section{margin:0 0 44px}
h2{
  font-family:var(--ff-display);
  font-weight:600;
  font-size:1.32rem;
  color:var(--navy);
  margin:0 0 6px;
  letter-spacing:-.005em;
}
h2::after{
  content:"";
  display:block;
  width:34px;
  height:2px;
  background:var(--gold);
  margin:12px 0 18px;
}
h3{
  font-family:var(--ff-body);
  font-weight:600;
  font-size:.94rem;
  color:var(--navy);
  margin:26px 0 6px;
  letter-spacing:.01em;
}
p{margin:0 0 14px}
ul{margin:0 0 14px;padding-left:20px}
li{margin-bottom:7px}
a{color:var(--navy);text-decoration:underline;text-underline-offset:2px;text-decoration-color:var(--gold)}
a:hover{color:var(--gold)}
strong,b{font-weight:600;color:var(--navy)}
.todo{
  background:#FFF8E8;
  border-left:3px solid var(--gold);
  padding:14px 18px;
  margin:18px 0 0;
  font-size:.84rem;
  color:#5C4A24;
  line-height:1.6;
}
.todo b{font-weight:600;color:#4A3A18}
table{
  width:100%;
  border-collapse:collapse;
  margin:0 0 18px;
  font-size:.88rem;
}
th,td{
  text-align:left;
  padding:11px 12px;
  border-bottom:1px solid var(--line);
  vertical-align:top;
}
th{
  background:var(--white);
  font-weight:600;
  color:var(--navy);
  font-size:.76rem;
  letter-spacing:.1em;
  text-transform:uppercase;
}
td{background:rgba(255,255,255,.55)}
.updated{
  font-size:.78rem;
  color:var(--muted);
  letter-spacing:.1em;
  text-transform:uppercase;
  padding-top:28px;
  border-top:1px solid var(--line);
  margin-top:44px;
}
footer{
  background:var(--navy-deep);
  color:rgba(255,255,255,.6);
  padding:34px var(--pad-x);
  font-size:.82rem;
}
.foot__in{
  max-width:var(--maxw);
  margin:0 auto;
  display:flex;
  justify-content:space-between;
  gap:18px;
  flex-wrap:wrap;
  align-items:center;
}
footer nav{display:flex;gap:20px;flex-wrap:wrap}
footer a{
  color:rgba(255,255,255,.6);
  text-decoration:none;
  text-decoration-color:transparent;
}
footer a:hover{color:var(--gold)}
