:root{
  --shadow-soft: 0 1px 0 var(--line), 0 18px 40px rgba(0,0,0,.55);
}

@keyframes fadeReveal{
  from{opacity:0;transform:translateY(14px)}
  to{opacity:1;transform:translateY(0)}
}

body{
  background:
    radial-gradient(1100px 520px at 82% -8%, rgba(198,155,60,.06), transparent 60%),
    radial-gradient(900px 480px at 8% 105%, rgba(198,155,60,.045), transparent 60%),
    var(--bg);
}

.section:nth-child(even){
  background:linear-gradient(180deg, transparent, rgba(255,255,255,.012) 50%, transparent);
}

/* Headings — Bodoni display, generous spacing, ivory */
.hero-title,.section h2,.article h2,.feature h3,.card h3{
  color:var(--text);
  font-weight:600;
  letter-spacing:.03em;
}
.hero-title{
  letter-spacing:.04em;
  text-transform:none;
}
.section h2,.article h2{
  position:relative;
  padding-bottom:.4em;
}
.section h2::after,.article h2::after{
  content:"";
  position:absolute;left:0;bottom:0;
  width:64px;height:1px;
  background:var(--accent);
}

/* Hero — calm, hairline framing */
.hero{
  background:
    radial-gradient(720px 380px at 78% 12%, rgba(198,155,60,.07), transparent 65%),
    var(--panel);
  border:1px solid var(--line);
  border-radius:var(--radius);
  animation:fadeReveal .9s ease both;
}
.hero-sub{color:var(--prose)}

.fact{
  background:var(--panel-2);
  border:1px solid var(--line);
  border-radius:var(--radius);
}
.fact b{color:var(--accent)}

/* Cards / features — onyx panels, brown-gold hairline */
.card,.feature,.faq-item{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow-soft);
  transition:border-color .4s ease, transform .4s ease, box-shadow .4s ease;
}
.card:hover,.feature:hover{
  border-color:var(--accent);
  transform:translateY(-3px);
}
.card{animation:fadeReveal .8s ease both}

.feature .icon{
  color:var(--accent);
  background:var(--panel-2);
  border:1px solid var(--line);
  border-radius:var(--radius);
  transition:border-color .4s ease, color .4s ease;
}
.feature:hover .icon{border-color:var(--accent)}

/* Buttons — 24k outline CTA, no glow */
.btn{
  border-radius:var(--radius);
  letter-spacing:.06em;
  text-transform:uppercase;
  font-size:.86em;
  transition:background .35s ease, color .35s ease, border-color .35s ease;
}
.btn-primary{
  background:var(--accent);
  color:var(--on-accent);
  border:1px solid var(--accent);
}
.btn-primary:hover{
  background:transparent;
  color:var(--accent);
}
.btn-ghost{
  background:transparent;
  color:var(--text);
  border:1px solid var(--line);
}
.btn-ghost:hover{border-color:var(--accent);color:var(--accent)}

.badge{
  background:var(--panel-2);
  border:1px solid var(--line);
  color:var(--accent);
  border-radius:999px;
  letter-spacing:.12em;
  text-transform:uppercase;
  font-size:.74em;
}

/* Catalog tiles */
.tab{
  background:var(--panel-2);
  border:1px solid var(--line);
  border-radius:999px;
  color:var(--text-2);
  transition:border-color .35s ease,color .35s ease;
}
.tab:hover{border-color:var(--accent);color:var(--text)}
.tab.active{
  background:var(--accent);
  color:var(--on-accent);
  border-color:var(--accent);
}

.tile{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:var(--radius);
  overflow:hidden;
  transition:border-color .4s ease, transform .4s ease;
}
.tile:hover{border-color:var(--accent);transform:translateY(-2px)}
.tile .nm{color:var(--text)}
.tile .gp{color:var(--accent);letter-spacing:.08em;text-transform:uppercase;font-size:.72em}
.tile.noimg{
  background:linear-gradient(160deg, var(--panel-2), var(--panel));
}

/* Article + table */
.article p,.article li{color:var(--prose)}
.table{
  border:1px solid var(--line);
  border-radius:var(--radius);
  overflow:hidden;
}
.table th{
  background:var(--panel-2);
  color:var(--text);
  border-bottom:1px solid var(--accent);
  letter-spacing:.04em;
}
.table td{border-top:1px solid var(--line);color:var(--prose)}

/* FAQ */
.faq-item{transition:border-color .35s ease}
.faq-item:hover{border-color:var(--accent)}
.faq-q{color:var(--text);font-weight:600;letter-spacing:.02em}
.faq-a{color:var(--prose)}

/* Header hairline */
.site-header{
  background:rgba(10,10,10,.82);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
}