:root{
--bg:#07080b;--surface:#0e1117;--surface2:#141820;--text:#f7f8fb;--muted:#9ba3b2;
--line:#242a35;--lime:#c7ff3d;--violet:#8b6cff;--max:1180px;
}
*{box-sizing:border-box}html{scroll-behavior:smooth;overflow-x:hidden}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,Arial,sans-serif;line-height:1.55}
a{text-decoration:none;color:inherit}.container{max-width:var(--max);margin:auto;padding:0 28px}
.site-header{position:sticky;top:0;z-index:100;background:linear-gradient(180deg,rgba(20,15,35,.88),rgba(7,8,11,.88));backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.site-header::after{content:'';display:block;height:2px;background:linear-gradient(90deg,var(--lime),var(--violet),var(--lime));background-size:200% 100%;animation:bz-shimmer 6s linear infinite}
@keyframes bz-shimmer{0%{background-position:0% 0}100%{background-position:200% 0}}
.nav{height:84px;display:flex;align-items:center;justify-content:space-between;gap:18px}
.brand{font-weight:900;letter-spacing:-.05em;font-size:19px}.brand span{color:var(--lime)}
.brand img.brand-logo{transition:transform .2s ease}
.brand:hover img.brand-logo{transform:scale(1.05)}
.nav-ctas{display:flex;align-items:center;gap:10px}
.links{display:flex;align-items:center;gap:25px;color:#c7ccd6;font-size:14px}
.links a{position:relative;padding:4px 0;transition:color .18s ease}
.links a:hover{color:white}
.links a::after{content:'';position:absolute;left:0;bottom:-4px;width:100%;height:2px;background:var(--lime);transform:scaleX(0);transform-origin:left;transition:transform .22s ease}
.links a:hover::after,.links a.active::after{transform:scaleX(1)}
.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:13px 19px;background:var(--lime);color:#07080b;font-weight:850;font-size:14px;transition:transform .18s ease,box-shadow .18s ease,background .18s ease}
.btn:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(199,255,61,.25)}
.btn.alt:hover{border-color:var(--lime);color:var(--lime);box-shadow:0 10px 24px rgba(199,255,61,.1)}
.btn.alt{background:transparent;border:1px solid var(--line);color:white}
.eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:.18em;color:var(--lime);font-weight:850}
h1{font-size:clamp(40px,7vw,92px);line-height:1.02;letter-spacing:-.03em;margin:18px 0 25px;word-break:break-word}
h2{font-size:clamp(30px,5vw,62px);line-height:1.05;letter-spacing:-.025em;margin:12px 0 18px;word-break:break-word}
h3{font-size:20px;letter-spacing:-.02em;margin:8px 0}.lead{font-size:19px;color:#b8bfca;max-width:760px}
.hero{padding:90px 0 76px;display:grid;grid-template-columns:1.08fr .92fr;gap:65px;align-items:center}
.hero strong{color:var(--lime)}
.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
.hero-card{border:1px solid var(--line);border-radius:30px;background:radial-gradient(circle at 70% 20%,rgba(139,108,255,.3),transparent 35%),linear-gradient(145deg,#171c25,#0d1015);min-height:570px;padding:25px;position:relative;overflow:hidden}
.video-placeholder{position:absolute;inset:25px;border:1px dashed #3a414e;border-radius:22px;display:grid;place-items:center;text-align:center;color:#aab1be}
.play{width:72px;height:72px;background:white;color:#08090c;border-radius:50%;display:grid;place-items:center;margin:auto;font-size:22px}
.video-note{position:absolute;bottom:25px;left:25px;right:25px;padding:15px;border-radius:15px;background:rgba(7,8,11,.7);border:1px solid #303642;backdrop-filter:blur(10px)}
.section{padding:88px 0;border-top:1px solid var(--line)}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:35px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:26px}.card p{color:var(--muted)}
.number{color:var(--lime);font-size:11px;letter-spacing:.15em;font-weight:850}
.flow{display:grid;grid-template-columns:repeat(9,1fr);gap:8px;align-items:center;margin-top:38px}.node{padding:17px 8px;text-align:center;border:1px solid var(--line);background:var(--surface);border-radius:13px;font-size:12px;font-weight:800}.arrow{text-align:center;color:var(--lime);font-size:20px}
.quote{font-size:30px;line-height:1.25;letter-spacing:-.03em;max-width:900px;margin:30px 0}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:30px}.stat{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:24px}.stat b{display:block;font-size:30px}.stat span{font-size:13px;color:var(--muted)}
.work-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:16px;margin-top:35px}.work-card{min-height:320px;background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:24px;position:relative;overflow:hidden}.work-card:nth-child(1),.work-card:nth-child(4){grid-column:span 7}.work-card:nth-child(2),.work-card:nth-child(3){grid-column:span 5}
.work-art{height:180px;border-radius:16px;background:linear-gradient(135deg,#191e27,#0b0d12);margin-bottom:20px;border:1px solid #2b313c;display:grid;place-items:center;color:#8f97a6}
.tags{margin-top:14px}.tag{display:inline-block;border:1px solid #303642;border-radius:999px;padding:5px 9px;margin:3px;font-size:10px;color:#cbd0d9}
.testimonials{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:35px}.testimonial{background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:30px}.testimonial p{font-size:20px;line-height:1.4}.person{color:var(--muted);font-size:13px}
.cta{padding:90px 0}.cta-box{border:1px solid var(--line);border-radius:30px;padding:55px;background:radial-gradient(circle at 80% 20%,rgba(199,255,61,.12),transparent 35%),#11151c}
@media(max-width:850px){.hero{grid-template-columns:1fr;padding-top:60px}.hero-card{min-height:430px}.grid3,.testimonials{grid-template-columns:1fr}.stats{grid-template-columns:repeat(2,1fr)}.flow{grid-template-columns:1fr}.arrow{transform:rotate(90deg)}.work-card:nth-child(n){grid-column:span 12}h1{font-size:57px}}

/* --- Blog additions --- */
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:35px}
.blog-card{background:var(--surface);border:1px solid var(--line);border-radius:22px;overflow:hidden;display:flex;flex-direction:column}
.blog-card img{width:100%;height:190px;object-fit:cover;display:block}
.blog-card .blog-art{height:190px;background:linear-gradient(135deg,#191e27,#0b0d12);display:grid;place-items:center;color:#8f97a6}
.blog-card .body{padding:22px}
.blog-card .meta{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--lime);font-weight:800;margin-bottom:8px}
.blog-card h3{font-size:20px}
.blog-card p{color:var(--muted);font-size:14px}
.blog-card a.stretched{position:absolute;inset:0}
.blog-card{position:relative}
.article{max-width:760px;margin:0 auto}
.article img.cover{width:100%;border-radius:22px;margin:20px 0 10px;border:1px solid var(--line)}
.article .meta{color:var(--muted);font-size:13px;margin-bottom:6px}
.article .content{font-size:18px;line-height:1.75;color:#d7dbe3;margin-top:30px}
.article .content p{margin:0 0 22px}
.empty-note{color:var(--muted);border:1px dashed var(--line);border-radius:16px;padding:30px;margin-top:30px}
@media(max-width:850px){.blog-grid{grid-template-columns:1fr}}

/* --- Mobile nav: side drawer --- */
.nav-toggle{display:none;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:44px;height:44px;background:rgba(139,108,255,.14);border:1px solid rgba(139,108,255,.3);border-radius:12px;cursor:pointer;padding:0;transition:background .2s}
.nav-toggle:hover{background:rgba(139,108,255,.22)}
.nav-toggle span{display:block;height:2px;width:20px;background:var(--text);border-radius:2px;transition:transform .25s ease,opacity .2s ease}
.nav-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle.open span:nth-child(2){opacity:0}
.nav-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.links a.active{color:var(--lime)}
.nav-overlay{display:none}

@media(max-width:850px){
  .nav-toggle{display:flex}
  .nav-overlay{display:block;position:fixed;inset:0;background:rgba(4,4,7,.6);opacity:0;pointer-events:none;transition:opacity .25s ease;z-index:65}
  .nav-overlay.open{opacity:1;pointer-events:auto}
  .links{display:flex;flex-direction:column;gap:0;position:fixed;top:0;right:0;height:100vh;width:82%;max-width:320px;background:linear-gradient(180deg,#161225,var(--surface));border-left:1px solid var(--line);padding:100px 28px 28px;z-index:70;overflow-y:auto;transform:translateX(100%);transition:transform .32s ease;box-shadow:-20px 0 60px rgba(0,0,0,.4)}
  .links.open{transform:translateX(0)}
  .links > a{padding:16px 0;border-bottom:1px solid var(--line);font-size:16px}
  .links > a:last-of-type{border-bottom:none}
  .links a::after{display:none}
  .nav{position:relative}
  .nav-ctas{flex-direction:column;align-items:stretch;width:100%;margin:18px 0 4px;gap:10px}
  .nav-ctas .btn{width:100%}
}

/* --- Footer --- */
.site-footer{position:relative;border-top:1px solid var(--line);padding:60px 0 0;margin-top:60px;background:radial-gradient(circle at 12% 0%,rgba(139,108,255,.12),transparent 40%),radial-gradient(circle at 90% 10%,rgba(199,255,61,.06),transparent 35%);overflow:hidden}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px;padding-bottom:40px}
.footer-col h4{font-size:13px;text-transform:uppercase;letter-spacing:.1em;color:var(--lime);margin:0 0 14px}
.footer-col a{display:flex;align-items:center;color:#c7ccd6;font-size:14px;margin-bottom:12px}
.footer-col a:hover{color:white}
.footer-col .muted{color:var(--muted);font-size:14px;margin-top:14px;max-width:280px}
.fico{display:inline-flex;width:16px;height:16px;margin-right:8px;vertical-align:-3px;flex-shrink:0;color:var(--lime)}
.footer-bottom{border-top:1px solid var(--line);padding:20px 0 36px;color:var(--muted);font-size:13px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px}
@media(max-width:850px){
  .footer-grid{grid-template-columns:1fr;gap:28px}
  .footer-bottom{flex-direction:column}
}

/* --- General mobile polish --- */
@media(max-width:600px){
  .container{padding:0 20px}
  h1{font-size:42px}
  h2{font-size:32px}
  .lead{font-size:17px}
  .cta-box{padding:32px 22px}
  .card{padding:20px}
}

/* --- Logo + friendlier footer socials --- */
.brand{display:flex;align-items:center;gap:12px}
.brand-logo{display:block;width:auto;max-width:260px;object-fit:contain}
.footer-col .brand{margin-bottom:8px}
.footer-social{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.footer-social a{margin-bottom:0;width:40px;height:40px;flex-shrink:0;display:flex;align-items:center;justify-content:center;overflow:hidden;background:var(--surface2);border:1px solid var(--line);border-radius:50%;color:#c7ccd6;transition:border-color .15s,color .15s,transform .15s,background .15s}
.footer-social a svg{width:18px;height:18px;flex-shrink:0}
.footer-social a:hover{transform:translateY(-3px)}
.ico-ig{border-color:rgba(225,48,108,.35);color:#ff8fb3;background:rgba(225,48,108,.1)}
.ico-tt{border-color:rgba(37,244,238,.3);color:#25f4ee;background:rgba(37,244,238,.08)}
.ico-li{border-color:rgba(47,143,214,.35);color:#5aa9e6;background:rgba(47,143,214,.1)}
.ico-fb{border-color:rgba(66,103,255,.35);color:#8ea0ff;background:rgba(66,103,255,.1)}
.ico-wa{border-color:rgba(37,211,102,.35);color:#3ee87f;background:rgba(37,211,102,.1)}
.ico-ig:hover{border-color:#e1306c;color:#ff6f9c;background:rgba(225,48,108,.22)}
.ico-tt:hover{border-color:#25f4ee;color:#25f4ee;background:rgba(37,244,238,.18)}
.ico-li:hover{border-color:#2f8fd6;color:#5aa9e6;background:rgba(47,143,214,.24)}
.ico-fb:hover{border-color:#4267ff;color:#7893ff;background:rgba(66,103,255,.24)}
.ico-wa:hover{border-color:#25d366;color:#3ee87f;background:rgba(37,211,102,.24)}
.back-to-top{color:var(--muted);font-size:13px;transition:color .15s,transform .15s;display:inline-block}
.back-to-top:hover{color:var(--lime);transform:translateY(-2px)}
@media(max-width:600px){
  .site-header .brand-logo{height:56px}
  .footer-col .brand-logo{height:48px}
}

/* --- Admin table horizontal scroll on small screens --- */
.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}