
:root{
  --bg:#020617;
  --bg2:#0f172a;
  --card:rgba(255,255,255,.05);
  --border:rgba(255,255,255,.10);
  --text:#e2e8f0;
  --muted:#94a3b8;
  --blue:#38bdf8;
  --lime:#a3e635;
  --shadow:0 20px 60px rgba(0,0,0,.35);
  --radius:24px;
  --max:1200px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  color:var(--text);
  background:
    radial-gradient(circle at top, rgba(59,130,246,.18), transparent 30%),
    radial-gradient(circle at right, rgba(132,204,22,.14), transparent 28%),
    linear-gradient(180deg,var(--bg) 0%,var(--bg2) 100%);
  min-height:100vh;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.container{max-width:var(--max);margin:0 auto;padding:0 24px}
.header{
  position:sticky;top:0;z-index:50;
  backdrop-filter:blur(16px);
  background:rgba(2,6,23,.78);
  border-bottom:1px solid var(--border);
}
.header-inner{
  display:flex;align-items:center;justify-content:space-between;
  gap:20px;padding:14px 0;
}
.brand{display:flex;align-items:center;gap:14px}
.brand img{width:54px;height:54px;object-fit:contain;border-radius:14px;background:rgba(255,255,255,.04);padding:6px;border:1px solid var(--border)}
.brand-title{font-size:1.1rem;font-weight:800;letter-spacing:-.02em}
.brand-sub{font-size:.92rem;color:var(--muted)}
.nav{display:flex;gap:10px;flex-wrap:wrap}
.nav a{
  padding:10px 16px;border-radius:14px;font-size:.96rem;font-weight:600;
  color:rgba(255,255,255,.86);transition:.2s ease;
}
.nav a:hover,.nav a.active{background:#fff;color:#0f172a}
.menu-btn{display:none}
.page{padding:56px 0 80px}
.hero{
  position:relative;overflow:hidden;border:1px solid var(--border);
  border-radius:36px;padding:40px;box-shadow:var(--shadow);
  background:rgba(255,255,255,.03);
}
.hero-grid{position:relative;display:grid;grid-template-columns:1.08fr .92fr;gap:40px;align-items:center}
.badge{
  display:inline-flex;align-items:center;gap:8px;
  border:1px solid rgba(163,230,53,.28);background:rgba(163,230,53,.08);
  color:#d9f99d;padding:10px 16px;border-radius:999px;font-size:.9rem;font-weight:700
}
h1{font-size:clamp(2.5rem,4.5vw,4.6rem);line-height:1.04;letter-spacing:-.03em;margin:18px 0 0}
.lead{font-size:clamp(1.15rem,2vw,1.6rem);color:#cbd5e1;margin:18px 0 0}
.copy{margin-top:22px;max-width:760px;color:#cbd5e1;line-height:1.85;font-size:1.05rem}
.hero-points{margin-top:28px;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.kpi{border:1px solid var(--border);background:rgba(255,255,255,.05);padding:16px;border-radius:18px;font-size:.95rem;font-weight:700}
.cta-row{margin-top:28px;display:flex;flex-wrap:wrap;gap:14px}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:16px 22px;border-radius:18px;border:1px solid transparent;
  font-weight:800;font-size:1rem;transition:.2s ease;cursor:pointer
}
.btn-primary{background:#fff;color:#0f172a}
.btn-primary:hover{transform:translateY(-1px)}
.btn-secondary{background:transparent;color:#fff;border-color:rgba(255,255,255,.18)}
.btn-secondary:hover{background:rgba(255,255,255,.08)}
.card{
  border:1px solid var(--border);background:rgba(255,255,255,.05);
  border-radius:32px;box-shadow:var(--shadow)
}
.card-inner{padding:32px}
.logo-box{
  min-height:320px;display:flex;flex-direction:column;justify-content:space-between;
  border:1px dashed rgba(163,230,53,.28);border-radius:26px;padding:28px;
  background:linear-gradient(135deg, rgba(2,6,23,.9), rgba(15,23,42,.92));
}
.logo-panel{
  margin-top:18px;
  background:rgba(2,6,23,.72);
  border:1px solid var(--border);
  border-radius:28px;
  padding:20px;
  text-align:center;
  min-height:420px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.logo-panel img{
  width:100%;
  max-width:620px;
  max-height:440px;
  height:auto;
  margin:0 auto;
  object-fit:contain;
  filter: drop-shadow(0 0 20px rgba(56,189,248,.18))
          drop-shadow(0 0 34px rgba(163,230,53,.10));
  animation: logoFloat 5s ease-in-out infinite;
}

@keyframes logoFloat{
  0%,100%{
    transform: translateY(0);
  }
  50%{
    transform: translateY(-8px);
  }
}
}
.mini-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:22px}
.mini-chip{
  display:flex;align-items:center;gap:10px;padding:14px;border-radius:16px;
  background:rgba(255,255,255,.05);border:1px solid var(--border);color:#cbd5e1;font-size:.95rem
}
.section{padding-top:26px}
.section-title{max-width:840px;margin-bottom:28px}
.section-title .eyebrow{font-size:.8rem;letter-spacing:.22em;text-transform:uppercase;color:var(--lime);font-weight:800;margin-bottom:12px}
.section-title h2{font-size:clamp(2rem,3.4vw,3.4rem);line-height:1.08;letter-spacing:-.03em;margin:0}
.section-title p{margin-top:14px;color:#cbd5e1;line-height:1.8}
.grid{display:grid;gap:20px}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-5{grid-template-columns:repeat(5,1fr)}
.service-card,.target-card{
  border:1px solid var(--border);background:rgba(255,255,255,.05);border-radius:28px;padding:26px;box-shadow:var(--shadow)
}
.service-icon{
  width:58px;height:58px;border-radius:18px;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg, rgba(56,189,248,.14), rgba(163,230,53,.14));
  border:1px solid rgba(255,255,255,.08);font-size:1.4rem
}
.service-card h3{margin:18px 0 10px;font-size:1.25rem}
.service-card p{margin:0;color:#cbd5e1;line-height:1.8}
.target-card{text-align:center;font-weight:800}
.about-layout,.contact-layout{display:grid;grid-template-columns:1.2fr .8fr;gap:24px}
.info-list .item,.stats-box .item{
  padding:14px 16px;border-radius:18px;background:rgba(0,0,0,.12);border:1px solid var(--border);margin-top:12px
}
.form-card form{display:grid;gap:14px}
label{display:block;margin-bottom:8px;font-size:.94rem;font-weight:700;color:#cbd5e1}
input,textarea{
  width:100%;padding:14px 16px;border-radius:18px;border:1px solid var(--border);
  background:rgba(255,255,255,.05);color:#fff;font:inherit;outline:none
}
input:focus,textarea:focus{border-color:rgba(163,230,53,.45)}
.notice{padding:14px 16px;border-radius:18px;background:rgba(163,230,53,.08);border:1px solid rgba(163,230,53,.18);color:#cbd5e1;font-size:.95rem;line-height:1.65}
.legal-card{padding:32px}
.legal-card h3{font-size:1.35rem;margin:0 0 10px}
.legal-card p{margin:10px 0;color:#cbd5e1;line-height:1.8}
.footer{
  border-top:1px solid var(--border);
  background:rgba(2,6,23,.55);margin-top:42px
}
.footer-grid{display:grid;grid-template-columns:1.2fr .8fr .9fr;gap:24px;padding:34px 0}
.footer h4,.footer h3{margin:0}
.footer p,.footer li{color:var(--muted);line-height:1.8}
.footer-nav{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}
.footer-nav a{padding:10px 14px;border-radius:14px;background:rgba(255,255,255,.05);border:1px solid var(--border)}
.hero-canvas{
  position:absolute;inset:0;pointer-events:none;border-radius:36px
}
@media (max-width: 1024px){
  .hero-grid,.about-layout,.contact-layout,.grid-3,.grid-5,.grid-2,.footer-grid{grid-template-columns:1fr}
  .hero-points{grid-template-columns:1fr}
}
@media (max-width: 760px){
  .page{padding-top:34px}
  .hero{padding:24px}
  .card-inner,.legal-card{padding:22px}
  .brand img{width:46px;height:46px}
  .brand-sub{display:none}
  .nav{display:none}
  .nav.mobile-open{
    display:flex;position:absolute;left:16px;right:16px;top:76px;flex-direction:column;
    padding:12px;border-radius:20px;background:rgba(2,6,23,.96);border:1px solid var(--border)
  }
  .menu-btn{
    display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:14px;
    border:1px solid var(--border);background:rgba(255,255,255,.05);color:#fff
  }
}
