/* Dedit.ai — dark tech theme */

:root{
  --bg: #06070d;
  --bg-alt: #0b0d18;
  --surface: #10131f;
  --border: #1e2233;
  --text: #e7e9f2;
  --text-dim: #9aa0b4;
  --accent: #4dd0ff;
  --accent2: #a361ff;
  --grad: linear-gradient(135deg, var(--accent), var(--accent2));
  --radius: 14px;
  --max-w: 1160px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:"Inter","Segoe UI",system-ui,-apple-system,sans-serif;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}

.container{max-width:var(--max-w); margin:0 auto; padding:0 24px;}
.accent{background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent;}

h1,h2,h3{line-height:1.2; margin:0 0 16px; font-weight:700;}
h1{font-size:clamp(2.2rem,5vw,3.6rem);}
h2{font-size:clamp(1.7rem,3.5vw,2.4rem);}
h3{font-size:1.2rem; margin-bottom:8px;}
p{color:var(--text-dim); margin:0 0 16px;}

.eyebrow{
  display:inline-block; text-transform:uppercase; letter-spacing:.12em;
  font-size:.75rem; font-weight:700; color:var(--accent); margin-bottom:12px;
}
.section-lead{max-width:640px; font-size:1.05rem;}

/* HEADER */
.site-header{
  position:sticky; top:0; z-index:100;
  background:rgba(6,7,13,.85); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--border);
}
.header-inner{display:flex; align-items:center; justify-content:space-between; height:72px;}
.logo{font-size:1.4rem; font-weight:800; color:var(--text); text-decoration:none;}
.main-nav{display:flex; gap:28px;}
.main-nav a{color:var(--text-dim); text-decoration:none; font-size:.95rem; transition:color .2s;}
.main-nav a:hover{color:var(--text);}
.header-controls{display:flex; align-items:center; gap:16px;}

.lang-switch{display:flex; gap:4px; border:1px solid var(--border); border-radius:8px; padding:2px;}
.lang-btn{
  background:none; border:none; color:var(--text-dim); font-size:.8rem; font-weight:600;
  padding:5px 9px; border-radius:6px; cursor:pointer; transition:all .2s;
}
.lang-btn:hover{color:var(--text);}
.lang-btn.active{background:var(--grad); color:#06070d;}

.burger{display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:6px;}
.burger span{width:22px; height:2px; background:var(--text); border-radius:2px; transition:.2s;}

/* HERO */
.hero{position:relative; padding:140px 0 100px; overflow:hidden;}
.hero-inner{position:relative; z-index:2; max-width:760px;}
.hero-sub{font-size:1.15rem; max-width:560px;}
.hero-cta{display:flex; gap:16px; margin-top:28px; flex-wrap:wrap;}
.hero-glow{
  position:absolute; top:-200px; right:-200px; width:600px; height:600px;
  background:radial-gradient(circle, rgba(77,208,255,.25), transparent 70%);
  filter:blur(20px); z-index:1; pointer-events:none;
}

.btn{
  display:inline-block; padding:13px 28px; border-radius:999px; font-weight:600;
  text-decoration:none; font-size:.95rem; cursor:pointer; transition:transform .15s, opacity .2s; border:none;
}
.btn-primary{background:var(--grad); color:#06070d;}
.btn-primary:hover{transform:translateY(-2px);}
.btn-outline{background:transparent; border:1px solid var(--border); color:var(--text);}
.btn-outline:hover{border-color:var(--accent); color:var(--accent);}

/* SECTIONS */
.section{padding:90px 0;}
.section-alt{background:var(--bg-alt);}

.cards-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:36px;}
.card{
  background:var(--surface); border:1px solid var(--border); border-radius:var(--radius);
  padding:32px 26px; transition:transform .2s, border-color .2s;
}
.card:hover{transform:translateY(-4px); border-color:var(--accent);}
.card-icon{font-size:1.8rem; margin-bottom:14px;}

/* AI AGENTS */
.section-ai{background:linear-gradient(180deg, var(--bg-alt), var(--bg));}
.ai-inner{display:grid; grid-template-columns:1.2fr .8fr; gap:48px; align-items:center;}
.ai-list{list-style:none; padding:0; margin:20px 0 0;}
.ai-list li{
  padding:10px 0 10px 28px; position:relative; color:var(--text);
  border-bottom:1px solid var(--border);
}
.ai-list li::before{
  content:"→"; position:absolute; left:0; color:var(--accent); font-weight:700;
}
.ai-visual{display:flex; align-items:center; justify-content:center;}
.ai-orb{
  width:260px; height:260px; border-radius:50%;
  background:radial-gradient(circle at 30% 30%, var(--accent), var(--accent2) 70%, transparent 100%);
  filter:blur(2px); opacity:.85; animation:pulse 4s ease-in-out infinite;
}
@keyframes pulse{0%,100%{transform:scale(1);} 50%{transform:scale(1.06);}}

/* HOW WE WORK */
.steps{display:grid; grid-template-columns:repeat(4,1fr); gap:24px; margin-top:36px;}
.step{border-left:2px solid var(--border); padding-left:18px;}
.step-num{
  display:block; font-size:1.6rem; font-weight:800; margin-bottom:8px;
  background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent;
}

/* CONTACT */
.contact-inner{display:grid; grid-template-columns:.8fr 1.2fr; gap:48px; align-items:start;}
#contactForm{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:32px;}
.form-row{margin-bottom:18px; display:flex; flex-direction:column; gap:6px;}
.form-row label{font-size:.85rem; color:var(--text-dim); font-weight:600;}
.form-row input, .form-row textarea{
  background:var(--bg); border:1px solid var(--border); border-radius:8px;
  padding:12px 14px; color:var(--text); font-family:inherit; font-size:.95rem; resize:vertical;
}
.form-row input:focus, .form-row textarea:focus{outline:none; border-color:var(--accent);}
.hp-field{position:absolute; left:-9999px; top:-9999px;}
.form-status{margin-top:14px; font-size:.9rem;}
.form-status.ok{color:#4dffa0;}
.form-status.err{color:#ff6b6b;}

/* FOOTER */
.site-footer{border-top:1px solid var(--border); padding:56px 0 24px; background:var(--bg-alt);}
.footer-inner{display:flex; justify-content:space-between; flex-wrap:wrap; gap:32px; margin-bottom:32px;}
.footer-legal p{margin:0 0 4px; font-size:.85rem;}
.footer-bottom{border-top:1px solid var(--border); padding-top:20px; font-size:.8rem; color:var(--text-dim);}

/* RESPONSIVE */
@media (max-width: 900px){
  .cards-grid{grid-template-columns:1fr;}
  .ai-inner{grid-template-columns:1fr;}
  .ai-visual{order:-1;}
  .steps{grid-template-columns:repeat(2,1fr);}
  .contact-inner{grid-template-columns:1fr;}
}

@media (max-width: 720px){
  .burger{display:flex;}
  .main-nav{
    position:absolute; top:72px; left:0; right:0; background:var(--bg);
    flex-direction:column; padding:20px 24px; border-bottom:1px solid var(--border);
    display:none; gap:18px;
  }
  .main-nav.open{display:flex;}
  .steps{grid-template-columns:1fr;}
  .footer-inner{flex-direction:column;}
}