:root{
  --gold:#d4af37;
  --black:#000000;
  --charcoal:#0d0d0d;
  --grey:#a9a9a9;
  --brown:#3b2f2f;
  --maxw:1100px;
  --radius:10px;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;background:#000;color:#fff;font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Inter, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif; line-height:1.6}
a{color:var(--gold);text-decoration:none}
a:hover{opacity:.85}
.container{max-width:var(--maxw);padding:0 20px;margin:0 auto}

header{
  position:sticky;top:0;z-index:10;
  background:rgba(0,0,0,.75);backdrop-filter:saturate(180%) blur(6px);
  border-bottom:1px solid rgba(212,175,55,.15);
}
.nav{display:flex;align-items:center;justify-content:space-between;height:72px}
.brand{display:flex;gap:12px;align-items:center}
.brand__mark{
  width:38px;height:38px;border-radius:50%;
  border:2px solid var(--gold);position:relative;flex:none;
}
/* simple network lines inside the circle */
.brand__mark:before, .brand__mark:after{
  content:'';position:absolute;left:4px;right:4px;height:2px;background:var(--gold);top:50%;transform:rotate(20deg);
}
.brand__title{font-weight:600;letter-spacing:.04em}
.brand__title small{display:block;font-weight:500;opacity:.8;font-size:.8rem}

.menu{display:flex;gap:24px}
.menu a{color:#eee;font-weight:500}
.cta{background:var(--gold);color:#111;padding:.65rem 1rem;border-radius:8px;font-weight:700}

.section{padding:80px 0;border-top:1px solid rgba(255,255,255,.06)}
.section--hero{padding:120px 0 80px;background: radial-gradient(1200px 400px at 10% -10%, rgba(212,175,55,.12), transparent 60%), radial-gradient(1000px 600px at 90% -20%, rgba(212,175,55,.10), transparent 60%);}
.hero__eyebrow{color:var(--gold);text-transform:uppercase;letter-spacing:.2em;font-size:.85rem}
h1{font-size:clamp(34px,5vw,56px);margin:.4em 0 .2em;line-height:1.1}
.lead{font-size:1.1rem;color:#cfcfcf;max-width:760px}
.actions{margin-top:28px;display:flex;gap:14px;flex-wrap:wrap}

.cardgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:30px}
.card{
  background:linear-gradient(180deg, rgba(212,175,55,.10), rgba(255,255,255,.03));
  border:1px solid rgba(212,175,55,.22);
  padding:22px;border-radius:var(--radius);
}
.card h3{margin:0 0 6px}
.card p{margin:0;color:#d9d9d9}

.kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:26px}
.kpi{border:1px solid rgba(255,255,255,.06);border-radius:var(--radius);padding:18px;text-align:center;background:rgba(255,255,255,.02)}
.kpi strong{display:block;font-size:1.6rem;color:var(--gold)}

.twocol{display:grid;grid-template-columns:1.1fr .9fr;gap:36px}
.twocol img{width:100%;border-radius:var(--radius);border:1px solid rgba(255,255,255,.06);opacity:.88}

.list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.list .item{border:1px solid rgba(255,255,255,.06);border-radius:var(--radius);padding:18px;background:rgba(255,255,255,.02)}
.item .icon{width:28px;height:28px;border-radius:50%;border:2px solid var(--gold);margin-bottom:10px}

.form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:20px}
.form .full{grid-column:1 / -1}
.input, textarea{
  background:#0b0b0b;border:1px solid rgba(255,255,255,.08);color:#fff;
  padding:14px;border-radius:10px;width:100%;
}
footer{padding:40px 0;border-top:1px solid rgba(255,255,255,.06);color:#bbb;font-size:.95rem}
.footergrid{display:grid;grid-template-columns:1.2fr .8fr;gap:24px}
small.muted{color:#9d9d9d}

@media (max-width:900px){
  .cardgrid{grid-template-columns:1fr}
  .list{grid-template-columns:1fr 1fr}
  .twocol{grid-template-columns:1fr}
  .kpis{grid-template-columns:1fr}
  .menu{display:none}
}