:root{
  --bg:#0b0d10;
  --glass: rgba(255,255,255,0.03);
  --glass-2: rgba(255,255,255,0.04);
  --accent1: #7efcf6;
  --accent2: #8a4fff;
  --text:#e6eef8;
  --muted:#9aa7b2;
  --radius:14px;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:Inter, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial;
  background: radial-gradient(1200px 400px at 10% 10%, rgba(138,79,255,0.06), transparent),
              radial-gradient(900px 300px at 90% 90%, rgba(126,252,246,0.04), transparent),
              var(--bg);
  color:var(--text);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
.hidden{display:none}

/* Intro */
.intro{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg, rgba(0,0,0,0.6), rgba(0,0,0,0.75));backdrop-filter:blur(6px);z-index:9999}
.intro-inner{width:min(880px,94%);text-align:center}
.intro-brand svg{width:140px;height:140px;margin:0 auto;display:block}
.boot-text{color:var(--accent1);margin-top:18px;font-weight:600}
.boot-sub{color:var(--muted);margin-top:8px}
.boot-bar{height:8px;background:rgba(255,255,255,0.03);border-radius:999px;margin-top:22px;overflow:hidden}
.boot-progress{height:100%;width:0;background:linear-gradient(90deg,var(--accent1),var(--accent2));transition:width 2.8s cubic-bezier(.2,.9,.3,1)}

/* Header */
.site-header{display:flex;justify-content:space-between;align-items:center;padding:20px 36px}
.logo-link{display:flex;align-items:center;gap:14px;text-decoration:none;color:inherit}
.logo-img{width:54px;height:54px}
.brand-title{font-weight:700;font-size:18px}
.brand-sub{font-size:12px;color:var(--muted)}
.header-right{display:flex;align-items:center;gap:12px}
.lang{display:flex;gap:8px}
.lang-btn{background:transparent;border:1px solid rgba(255,255,255,0.04);padding:8px 10px;border-radius:8px;color:var(--text);cursor:pointer}
.cta{background:linear-gradient(90deg,var(--accent1),var(--accent2));padding:10px 14px;border-radius:12px;color:#061018;text-decoration:none;font-weight:600}

/* Main */
.main{padding:24px 36px 80px}
.hero{display:flex;gap:28px;align-items:flex-start;margin-top:10px}
.hero-left{flex:1}
.hero-title{font-size:34px;margin:0 0 12px;line-height:1.05}
.hero-sub{color:var(--muted);margin:0 0 18px;max-width:620px}
.hero-actions{display:flex;gap:12px;margin-bottom:18px}
.btn-primary{background:linear-gradient(90deg,var(--accent2),var(--accent1));padding:12px 16px;border-radius:12px;color:#041018;text-decoration:none;font-weight:700}
.btn-ghost{background:transparent;border:1px solid rgba(255,255,255,0.04);padding:12px 16px;border-radius:12px;color:var(--text);text-decoration:none}
.trust{display:flex;align-items:center;gap:12px;margin-top:8px}
.logo-pill{background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));padding:6px 10px;border-radius:999px;font-size:13px;color:var(--muted)}

.hero-right{width:420px}
.glass-card{background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));border-radius:var(--radius);padding:18px;backdrop-filter:blur(8px);box-shadow:0 6px 30px rgba(0,0,0,0.6)}
.showcase-header{font-weight:700;margin-bottom:10px}
.showcase-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}
.showcase-list li{display:flex;justify-content:space-between;align-items:center;padding:10px;border-radius:10px;border:1px solid rgba(255,255,255,0.03);cursor:pointer}
.showcase-list li:hover{transform:translateX(6px);transition:transform .18s ease}

/* Categories grid */
.section-title{font-weight:700;margin-top:40px;margin-bottom:18px}
.categories-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.cat-card{display:block;padding:18px;border-radius:12px;text-decoration:none;color:inherit;background:linear-gradient(180deg,var(--glass),var(--glass-2));border:1px solid rgba(255,255,255,0.03);transition:transform .25s ease,box-shadow .25s ease}
.cat-card:hover{transform:translateY(-6px);box-shadow:0 18px 50px rgba(138,79,255,0.08)}
.cat-title{font-weight:700;margin-top:8px}
.cat-desc{color:var(--muted);font-size:13px;margin:6px 0 0}

/* Provider cards (category pages) */
.list-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:18px}
.provider-card{background:linear-gradient(180deg, rgba(255,255,255,0.015), rgba(255,255,255,0.01));padding:16px;border-radius:12px;border:1px solid rgba(255,255,255,0.03)}
.p-header{display:flex;gap:12px;align-items:center}
.p-avatar{width:56px;height:56px;border-radius:10px;background:linear-gradient(90deg,var(--accent1),var(--accent2));display:flex;align-items:center;justify-content:center;font-weight:700;color:#031018}
.p-name{font-weight:700}
.p-skill{color:var(--muted);font-size:13px}
.p-desc{margin-top:10px;color:var(--muted)}
.p-meta{margin-top:10px}
.p-actions{margin-top:12px}

/* Footer */
.site-footer{margin-top:40px;padding:22px 36px;border-top:1px solid rgba(255,255,255,0.02);color:var(--muted)}
.footer-inner{display:flex;justify-content:space-between;align-items:center}

/* Responsive */
@media (max-width:980px){
  .categories-grid{grid-template-columns:repeat(2,1fr)}
  .hero{flex-direction:column}
  .hero-right{width:100%}
  .list-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:560px){
  .categories-grid{grid-template-columns:1fr}
  .list-grid{grid-template-columns:1fr}
  .header-right{gap:8px}
}