*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#3b0d1f;color:#ddc9d1;
  font:17px/1.78 Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif}
a{color:#c9a227} a:hover{color:#e08fa4}
img{max-width:100%;height:auto;display:block}
.w{max-width:1120px;margin:0 auto;padding:0 20px}

/* header */
.hd{position:sticky;top:0;z-index:80;background:#280714;border-bottom:1px solid rgba(230,200,210,.16)}
.hdin{display:flex;align-items:center;gap:20px;height:66px}
.lg img{height:28px;width:auto}
.nv{display:flex;gap:19px;margin-left:auto;flex-wrap:wrap}
.nv a{color:#ad8e99;font-size:14.5px;font-weight:600;text-decoration:none}
.nv a:hover,.nv a[aria-current=page]{color:#c9a227}
.cta{background:#c9a227;color:#280714!important;font-weight:800;padding:10px 21px;border-radius:3px;
  font-size:14px;text-transform:uppercase;letter-spacing:.04em;text-decoration:none}
.cta:hover{background:#e08fa4;color:#280714!important}

/* hero */
.hero{background:linear-gradient(150deg,#280714 0%,#3b0d1f 55%,#4a1428 100%);
  padding:62px 0 0;border-bottom:1px solid rgba(230,200,210,.16)}
.kick{display:inline-block;color:#c9a227;font-size:12px;font-weight:800;letter-spacing:.18em;
  text-transform:uppercase;margin-bottom:18px;border-bottom:2px solid #c9a227;padding-bottom:5px}
h1{color:#f5f0e8;font-size:clamp(30px,4.4vw,47px);line-height:1.12;margin:0 0 18px;font-weight:800;
  letter-spacing:-.024em;max-width:20ch}
h1 em{font-style:normal;color:#c9a227}
.dek{font-size:18px;color:#ad8e99;margin:0 0 26px;max-width:62ch}
.hb{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:34px}
.gh{border:1px solid rgba(230,200,210,.16);color:#f5f0e8!important;padding:9px 21px;border-radius:3px;
  font-weight:600;font-size:14px;text-decoration:none}
.gh:hover{border-color:#c9a227}

/* stats ribbon — signature */
.ribbon{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid rgba(230,200,210,.16);
  background:#280714}
.ribbon div{padding:18px 16px;text-align:center;border-right:1px solid rgba(230,200,210,.16)}
.ribbon div:last-child{border-right:0}
.ribbon b{display:block;color:#c9a227;font-size:20px;font-weight:800;line-height:1.2}
.ribbon span{font-size:12.5px;color:#ad8e99}

/* zig-zag blocks — marker column alternates side */
.zz{padding:46px 0;border-bottom:1px solid rgba(230,200,210,.16)}
.zz:nth-of-type(even){background:#4a1428}
.zzin{display:grid;grid-template-columns:88px 1fr;gap:26px;align-items:start}
.zz:nth-of-type(even) .zzin{grid-template-columns:1fr 88px}
.zz:nth-of-type(even) .mark{order:2}
.mark{display:grid;place-items:center}
.mark span{width:70px;height:70px;border-radius:50%;border:2px solid #c9a227;color:#c9a227;
  display:grid;place-items:center;font-weight:800;font-size:23px;background:#280714}
h2{color:#f5f0e8;font-size:clamp(23px,2.9vw,32px);line-height:1.2;margin:0 0 15px;font-weight:800;
  letter-spacing:-.018em;scroll-margin-top:84px}
h3{color:#c9a227;font-size:19px;margin:26px 0 9px;font-weight:700}
p{margin:0 0 17px} ul,ol{margin:0 0 18px;padding-left:22px} li{margin-bottom:9px}
strong{color:#f5f0e8}

/* definition callout — signature device */
.def{background:#5a1a32;border-left:4px solid #c9a227;border-radius:0 10px 10px 0;
  padding:16px 20px;margin:0 0 20px}
.def b{display:block;color:#c9a227;font-size:12.5px;letter-spacing:.1em;text-transform:uppercase;
  margin-bottom:5px}
.def p{margin:0;color:#f5f0e8;font-size:16.5px}

.note{background:#5a1a32;border:1px solid rgba(230,200,210,.16);border-radius:10px;padding:18px 22px;margin:22px 0}
.note.warn{border-color:rgba(224,143,164,.5)}
.note h3{margin-top:0;color:#f5f0e8}

.tw{overflow-x:auto;margin:24px 0;border:1px solid rgba(230,200,210,.16);border-radius:10px}
table{width:100%;border-collapse:collapse;font-size:15px;min-width:480px}
th,td{padding:12px 16px;text-align:left;border-bottom:1px solid rgba(230,200,210,.16)}
th{background:#280714;color:#c9a227;font-size:12.5px;text-transform:uppercase;letter-spacing:.05em}
tr:last-child td{border-bottom:0} td:first-child{color:#f5f0e8;font-weight:600}

details{background:#5a1a32;border:1px solid rgba(230,200,210,.16);border-radius:9px;padding:15px 19px;margin-bottom:10px}
summary{cursor:pointer;font-weight:700;color:#f5f0e8;list-style:none}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";float:right;color:#c9a227;font-weight:800}
details[open] summary::after{content:"\2212"}
details p{margin:11px 0 0;color:#ad8e99}

/* footer */
.ft{background:#280714;border-top:2px solid #c9a227;padding:42px 0 28px;font-size:14px;color:#ad8e99}
.fg{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:32px;margin-bottom:26px}
.fg h4{color:#f5f0e8;font-size:14px;margin:0 0 12px}
.fg a{color:#ad8e99;display:block;margin-bottom:8px;text-decoration:none}
.fg a:hover{color:#c9a227}
.lgl{border-top:1px solid rgba(230,200,210,.16);padding-top:18px;font-size:12.8px;line-height:1.7}
.lgl strong{color:#f5f0e8}
.so{display:flex;gap:10px;margin-top:14px}
.so a{width:34px;height:34px;border-radius:6px;background:rgba(255,255,255,.08);
  display:grid;place-items:center;margin:0}
.so a:hover{background:rgba(255,255,255,.15)}
.so svg{width:17px;height:17px;display:block}

@media(max-width:860px){
  .zzin,.zz:nth-of-type(even) .zzin{grid-template-columns:56px 1fr;gap:18px}
  .zz:nth-of-type(even) .mark{order:0}
  .mark span{width:48px;height:48px;font-size:18px}
  .ribbon{grid-template-columns:1fr 1fr}
  .ribbon div:nth-child(2){border-right:0}
  .fg{grid-template-columns:1fr 1fr}
}
@media(max-width:700px){
  .nv{display:none} .hdin{height:58px} .hero{padding:44px 0 0}
  .fg{grid-template-columns:1fr} h1{max-width:none}
}