:root{
  --site-bg:#08111d;
  --site-bg-2:#0c1727;
  --site-card:rgba(9,16,29,.72);
  --site-card-2:rgba(16,24,39,.82);
  --site-border:rgba(201,168,95,.24);
  --site-border-soft:rgba(255,255,255,.12);
  --site-text:#f8fafc;
  --site-muted:rgba(226,232,240,.82);
  --site-gold:#c9a85f;
  --site-gold-dark:#8a6b2c;
  --site-shadow:0 24px 60px rgba(0,0,0,.38);
  --site-radius:22px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;min-height:100%}
body.site-public{
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  color:var(--site-text);
  background:
    radial-gradient(900px 420px at 15% 10%, rgba(201,168,95,.20), transparent 60%),
    radial-gradient(880px 420px at 85% 12%, rgba(59,130,246,.16), transparent 60%),
    linear-gradient(180deg, rgba(8,17,29,.94), rgba(8,17,29,.98)),
    url('/assets/bg.jpg') center/cover fixed no-repeat;
}
a{color:inherit;text-decoration:none}
button{font:inherit}
.site-topbar{
  position:sticky;top:0;z-index:50;
  display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center;
  padding:14px 24px;
  backdrop-filter:blur(16px);
  background:rgba(8,17,29,.72);
  border-bottom:1px solid var(--site-border);
}
.site-brand{display:flex;align-items:center;gap:12px;min-width:0}
.site-brand-mark{
  width:46px;height:46px;border-radius:16px;flex:0 0 auto;
  background:radial-gradient(circle at 30% 30%, rgba(255,235,180,.98), rgba(201,168,95,.78) 48%, rgba(92,63,17,.98));
  box-shadow:0 14px 32px rgba(0,0,0,.32);
  border:1px solid rgba(255,255,255,.18);
}
.site-brand strong{display:block;font-size:18px;letter-spacing:.2px}
.site-brand small{display:block;color:var(--site-muted);margin-top:2px}
.site-nav{
  display:flex;gap:10px;align-items:center;justify-content:center;
  overflow-x:auto;padding:4px 2px;min-width:0;
}
.site-nav::-webkit-scrollbar{height:6px}
.site-nav::-webkit-scrollbar-thumb{background:rgba(201,168,95,.30);border-radius:999px}
.site-nav button{
  flex:0 0 auto;cursor:pointer;
  border-radius:999px;border:1px solid var(--site-border-soft);
  background:rgba(255,255,255,.05);color:rgba(248,250,252,.94);
  padding:11px 16px;font-weight:800;transition:transform .15s ease, background .15s ease, border-color .15s ease;
}
.site-nav button:hover{transform:translateY(-1px);background:rgba(255,255,255,.08)}
.site-nav button.active{background:linear-gradient(135deg,var(--site-gold),var(--site-gold-dark));color:#0f172a;border-color:rgba(255,255,255,.18)}
.site-cta{display:flex;gap:10px;align-items:center;justify-content:flex-end}
.site-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:46px;padding:0 18px;border-radius:14px;border:1px solid var(--site-border-soft);
  font-weight:900;transition:transform .15s ease, filter .15s ease, background .15s ease;
}
.site-btn:hover{transform:translateY(-1px);filter:saturate(1.06)}
.site-btn.primary{background:linear-gradient(135deg,var(--site-gold),var(--site-gold-dark));color:#0f172a;border-color:rgba(255,255,255,.18)}
.site-btn.ghost{background:rgba(255,255,255,.05);color:var(--site-text)}
.site-stage{width:min(1240px,100%);margin:0 auto;padding:34px 22px 54px}
.site-hero{
  display:grid;grid-template-columns:minmax(0,1.05fr) minmax(340px,.95fr);gap:24px;align-items:stretch;
}
.site-copy,.site-banner-panel,.site-feature-card{
  background:var(--site-card);
  border:1px solid var(--site-border);
  border-radius:var(--site-radius);
  box-shadow:var(--site-shadow);
  backdrop-filter:blur(12px);
}
.site-copy{padding:26px}
.site-badge{
  display:inline-flex;align-items:center;padding:8px 12px;border-radius:999px;
  background:rgba(201,168,95,.12);border:1px solid rgba(201,168,95,.28);
  color:#f5deb3;font-size:12px;font-weight:900;letter-spacing:.3px;text-transform:uppercase;
}
.site-copy h1{margin:16px 0 10px;font-size:clamp(32px,5vw,54px);line-height:1.02}
.site-copy p{margin:0;color:var(--site-muted);font-size:17px;line-height:1.7;max-width:650px}
.site-hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}
.site-highlights{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:24px}
.site-highlight-card{
  display:grid;gap:6px;padding:16px;border-radius:18px;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.10);
}
.site-highlight-card strong{font-size:14px}
.site-highlight-card span{color:var(--site-muted);font-size:13px;line-height:1.55}
.site-banner-panel{padding:18px;display:grid;align-items:center}
.site-banner-wrap{border-radius:18px;overflow:hidden;border:1px solid rgba(255,255,255,.10);background:rgba(0,0,0,.22)}
.site-banner-wrap img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover}
.site-feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:22px}
.site-feature-card{padding:22px;display:grid;gap:10px;background:var(--site-card-2)}
.site-feature-label{font-size:12px;font-weight:900;letter-spacing:.4px;text-transform:uppercase;color:#f5deb3}
.site-feature-card h2{margin:0;font-size:22px;line-height:1.2}
.site-feature-card p{margin:0;color:var(--site-muted);line-height:1.7}
.site-feature-card code{padding:2px 6px;border-radius:8px;background:rgba(255,255,255,.08)}
.site-footer{text-align:center;color:var(--site-muted);margin-top:26px;font-weight:700}
@media (max-width:1080px){
  .site-topbar{grid-template-columns:1fr;justify-items:start}
  .site-nav{justify-content:flex-start;width:100%}
  .site-cta{justify-content:flex-start}
  .site-hero,.site-feature-grid{grid-template-columns:1fr}
  .site-highlights{grid-template-columns:1fr}
}
@media (max-width:640px){
  .site-topbar{padding:14px 16px}
  .site-stage{padding:24px 14px 40px}
  .site-copy,.site-banner-panel,.site-feature-card{padding:18px}
  .site-copy h1{font-size:32px}
  .site-nav button,.site-btn{width:auto}
}