/* Vibrant theme — improved visuals */
:root{
  --bg-1:#f4f6ff;
  --bg-2:#eef2ff;
  --text:#0f172a;
  --muted:#64748b;
  --accent-1:#6b8cff; /* blue */
  --accent-2:#8b5cf6; /* violet */
  --accent-3:#ff7ab6; /* pink */
  --card:#ffffff;
  --glass: rgba(255,255,255,0.65);
  --radius:14px;
  --maxw:1150px;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  font-family: Inter, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  color:var(--text);
  background: radial-gradient(1200px 600px at 10% 10%, rgba(139,92,246,0.06), transparent), linear-gradient(180deg,var(--bg-1),#ffffff);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  line-height:1.55;
}
.container{max-width:var(--maxw);margin:0 auto;padding:28px}
.site-header{position:sticky;top:0;backdrop-filter: blur(6px);background:linear-gradient(180deg, rgba(255,255,255,0.6), rgba(255,255,255,0.45));box-shadow:0 6px 20px rgba(11,22,50,0.06);z-index:60}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:14px 0}
.brand{font-weight:800;color:var(--accent-1);text-decoration:none;font-size:1.05rem}
.main-nav a{margin:0 12px;color:var(--muted);text-decoration:none;padding:6px 8px;border-radius:8px;transition:all .18s}
.main-nav a:hover{color:var(--accent-2);background:rgba(139,92,246,0.06)}
.lang a{margin-left:8px;color:var(--muted);text-decoration:none;padding:6px 8px;border-radius:8px}
.lang a[aria-current="true"]{font-weight:700;color:var(--accent-2);background:linear-gradient(90deg, rgba(139,92,246,0.08), rgba(107,140,255,0.04))}

.hero{display:flex;align-items:center;gap:36px;padding:64px 0}
.hero-content{flex:1}
.hero h1{font-size:2.4rem;margin:0 0 10px 0;line-height:1.06;color:var(--text)}
.lead{color:var(--muted);font-size:1.05rem;margin-bottom:20px}
.hero-ctas .btn{margin-right:12px}
.hero-visual{width:320px;height:220px;border-radius:18px;background:linear-gradient(135deg,var(--accent-1),var(--accent-2));display:flex;align-items:center;justify-content:center;color:white;box-shadow:0 14px 40px rgba(99,102,241,0.15)}

.btn{display:inline-block;padding:12px 18px;border-radius:999px;text-decoration:none;border:1px solid transparent;font-weight:700;cursor:pointer}
.btn.primary{background:linear-gradient(90deg,var(--accent-1),var(--accent-2));color:white;box-shadow:0 8px 30px rgba(107,140,255,0.18)}
.btn.primary:hover{transform:translateY(-3px)}
.btn.outline{background:transparent;border:1px solid rgba(15,23,42,0.06);color:var(--accent-2)}

.section{padding:64px 0}
.section-title{font-size:1.35rem;margin-bottom:18px;font-weight:700}
.grid{display:grid;gap:18px}
.grid-3{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.grid-2{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}

.card{background:linear-gradient(180deg,var(--card), rgba(255,255,255,0.96));padding:22px;border-radius:var(--radius);box-shadow:0 10px 30px rgba(15,23,42,0.06);transition:transform .22s, box-shadow .22s}
.card:hover{transform:translateY(-6px);box-shadow:0 20px 50px rgba(15,23,42,0.09)}

.light{background:linear-gradient(180deg,#ffffff,#fbfdff)}
.problems-list{list-style:disc;margin-left:18px;color:var(--muted);font-size:1.03rem}
.testimonial{background:linear-gradient(90deg,#fff,#fbfbff);padding:20px;border-radius:12px}
.testimonial cite{display:block;margin-top:12px;color:var(--muted);font-size:0.92rem}

.contact{background:linear-gradient(180deg,#ffffff,#f7f9ff)}
.contact-inner{display:flex;justify-content:center}
.contact-card{max-width:720px;background:linear-gradient(180deg, rgba(255,255,255,0.96), rgba(255,255,255,0.98));padding:26px;border-radius:18px;box-shadow:0 18px 50px rgba(11,22,50,0.06)}
.muted{color:var(--muted)}
.form-row{display:flex;gap:12px;margin-bottom:12px}
.form-row input,.form-row select,.form-row textarea{flex:1;padding:12px;border-radius:10px;border:1px solid rgba(12,24,48,0.06);background:linear-gradient(180deg,#ffffff,#fbfdff)}
.form-row input:focus,.form-row select:focus,.form-row textarea:focus{outline:none;box-shadow:0 6px 20px rgba(107,140,255,0.08);border-color:rgba(107,140,255,0.18)}
.form-actions{text-align:right}
.form-note{margin-top:8px;color:var(--muted);font-size:0.95rem}

.site-footer{padding:26px 0;background:transparent}
.footer-inner{display:flex;justify-content:space-between;align-items:center;color:var(--muted);font-size:0.95rem}

@media(max-width:880px){
  .hero{flex-direction:column;padding:36px 0}
  .hero-visual{width:220px;height:160px}
  .form-row{flex-direction:column}
  .footer-inner{flex-direction:column;gap:8px}
}
