/* Techgen20 site (v7) */
:root{
  --bg:#0b0f17; --bg-alt:#121826; --card:#0e1523; --text:#e8eefc; --muted:#9fb3d1;
  --brand:#2d59c6; --brand-2:#6aa3ff; --accent:#00d4ff; --ring: rgba(0,212,255,.25); --radius:18px;
}
*{box-sizing:border-box} html,body{height:100%}
body{margin:0; font-family:system-ui,-apple-system,Segoe UI,Roboto,Inter,Arial,sans-serif; background:var(--bg); color:var(--text); line-height:1.6}
a{color:var(--brand-2); text-decoration:none} a:hover{text-decoration:underline}
.container{width:min(1120px,92%); margin:0 auto}

.banner{ background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,0)); padding:18px 0 8px; border-bottom:1px solid rgba(255,255,255,.08)}
.banner-logo{ max-width:540px; width:72%; height:auto; display:block; margin:0 auto; filter:drop-shadow(0 6px 18px rgba(0,0,0,.45))}

.site-header{ position:sticky; top:0; z-index:20; backdrop-filter: blur(10px);
  background: linear-gradient(180deg, rgba(10,14,22,.85), rgba(10,14,22,.55));
  border-bottom:1px solid rgba(255,255,255,.06); }
.nav{ display:flex; gap:16px; align-items:center; justify-content:center; padding:10px 0; flex-wrap:wrap }
.nav a{ font-weight:700; padding:8px 10px; border-radius:12px } .nav .cta{ border:1px solid rgba(255,255,255,.15)} .nav .ghost{ background:transparent }

.section{padding:56px 0} .section.alt{background:var(--bg-alt)} .lead{color:var(--muted); font-size:clamp(16px,2vw,18px)}

.top-bg{ position:relative; background:#0b0f17 url('/assets/bg-main.avif') center/cover no-repeat fixed}
.top-bg .overlay{ position:absolute; inset:0; background: radial-gradient(60% 60% at 50% 40%, rgba(9,15,25,.3), rgba(9,15,25,.88))}
.top-inner{ position:relative; text-align:center; padding:72px 0 }
.cta-row{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-top:14px }

.secondary-bg{ background: radial-gradient(1200px 400px at 50% -20%, rgba(106,163,255,.08), transparent 60%), url('/assets/bg-secondary.png') center/contain no-repeat; background-blend-mode:screen }
.page-top{ padding:32px 0 }

.grid-2{display:grid; gap:28px; grid-template-columns:1.2fr .8fr}
.grid-3{display:grid; gap:20px; grid-template-columns:repeat(3,1fr)}
.grid-4{display:grid; gap:16px; grid-template-columns:repeat(4,1fr)}
@media (max-width:900px){ .grid-2,.grid-3,.grid-4{grid-template-columns:1fr} }

.card{ background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02)); border:1px solid rgba(255,255,255,.06); border-radius:var(--radius); box-shadow:0 10px 30px rgba(0,0,0,.25); padding:18px }
.card.small{max-width:540px}
.card a.btn{display:inline-block; padding:10px 14px; border-radius:12px; border:1px solid rgba(255,255,255,.18)}

.svc-link{display:block; transition:transform .06s ease, border-color .2s ease}
.svc-link:hover{transform:translateY(-2px); border-color:rgba(0,212,255,.25)}

.btn{ display:inline-block; padding:12px 18px; border-radius:14px; border:1px solid transparent; font-weight:700; letter-spacing:.2px; transition: transform .05s ease}
.btn:active{transform:translateY(1px)} .btn-primary{background:linear-gradient(135deg, var(--brand), var(--brand-2)); color:white; box-shadow:0 0 0 6px var(--ring)} .btn-ghost{background:transparent; border-color:rgba(255,255,255,.18); color:var(--text)}

.checklist{list-style:none; padding-left:0}
.checklist li{margin:10px 0; padding-left:26px; position:relative}
.checklist li::before{ content:""; position:absolute; left:0; top:.4em; width:16px; height:16px; border-radius:50%; background:radial-gradient(circle at 30% 30%, var(--accent), var(--brand-2)); box-shadow:0 0 0 4px rgba(0,212,255,.12)}

.placeholder{ border:1px dashed rgba(255,255,255,.25); border-radius:14px; min-height:160px; display:grid; place-items:center; color:var(--muted); background:rgba(255,255,255,.03); margin-top:12px }

.muted{color:var(--muted)}
.contact-list{list-style:none; padding:0; margin:0 0 16px} .contact-list li{margin:6px 0}

.site-footer{border-top:1px solid rgba(255,255,255,.06); padding:22px 0; background:var(--bg)} .footer-inner{display:flex; justify-content:space-between; align-items:center} .footer-inner a{font-weight:600}