*{margin:0;padding:0;box-sizing:border-box;font-family:Arial,Helvetica,sans-serif;scroll-behavior:smooth}
body{background:#08111f;color:#fff;line-height:1.6}a{text-decoration:none;color:inherit}img{max-width:100%;display:block}
header{position:sticky;top:0;z-index:1000;background:#020617;border-bottom:1px solid #1e293b;padding:14px 16px;display:flex;justify-content:space-between;align-items:center}
.brand h1{font-size:22px}.brand .b{color:#38bdf8}.brand .r{color:#ef4444}.brand p{font-size:12px;color:#cbd5e1}.menu-btn{font-size:30px;color:#38bdf8;cursor:pointer}
.overlay{position:fixed;inset:0;background:rgba(0,0,0,.58);display:none;z-index:1001}.overlay.show{display:block}
.menu{position:fixed;right:-270px;top:70px;width:260px;max-height:calc(100vh - 80px);overflow:auto;background:#020617;border-left:1px solid #1e293b;z-index:1002;padding:16px;border-radius:16px 0 0 16px;transition:.3s}.menu.open{right:0}
.menu a,.menu .parent{display:flex;justify-content:space-between;padding:9px 10px;margin-bottom:6px;border:1px solid #1e3a5f;background:#0d1b30;border-radius:10px;font-size:13px;cursor:pointer}.menu .parent::after{content:'+';color:#38bdf8}.sub{display:none;margin:0 0 10px 12px;border-left:2px solid #38bdf8;padding-left:8px}
.sub a{font-size:12px;background:#071225}.menu-actions{display:grid;gap:10px;margin-top:16px}.menu-actions a{justify-content:center;background:#38bdf8;color:#02111f;font-weight:700}.menu-actions .secondary{background:#14243c;color:#fff;border:1px solid #38bdf8}
.hero{min-height:88vh;padding:42px 16px 30px;background:linear-gradient(160deg,#08111f 0%,#0f2544 48%,#020617 100%);text-align:center}.hero-inner,.container{max-width:1120px;margin:auto}
.hero h2{font-size:34px;line-height:1.12;margin-bottom:12px}.hero h2 span,.section-title h2,.about h2{color:#38bdf8}.hero p,.section-title p{color:#d5e3f5;max-width:760px;margin:0 auto 20px}
.actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin:18px 0 24px}.btn{display:inline-block;background:#38bdf8;color:#02111f;padding:12px 18px;border-radius:999px;font-weight:700;border:0;cursor:pointer}.btn.alt{background:transparent;color:#fff;border:1px solid #38bdf8}.btn.red{background:#ef4444;color:#fff}
.slider{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;border-radius:20px;background:#020617;align-items:center;box-shadow:0 18px 45px rgba(0,0,0,.35)}.slider::-webkit-scrollbar{display:none}.slide{min-width:100%;height:360px;scroll-snap-align:center;display:flex;align-items:center;justify-content:center;background:#020617}.slide img{width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain}.dots{display:flex;justify-content:center;gap:7px;margin-top:14px}.dots span{width:9px;height:9px;background:#475569;border-radius:50%}.dots span.active{background:#38bdf8;width:22px;border-radius:10px}
.section{padding:58px 16px;border-bottom:1px solid #1e293b}.section-title{text-align:center;margin-bottom:34px}.section-title h2{font-size:30px;margin-bottom:8px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.card{background:#0d1b30;border:1px solid #1e3a5f;border-radius:18px;overflow:hidden;box-shadow:0 10px 28px rgba(0,0,0,.22)}.card img{width:100%;height:210px;object-fit:contain;background:#020617}.card img.poster{object-fit:cover;object-position:top center;background:#fff;height:260px}.card-content{padding:20px}.card h3{font-size:20px;margin-bottom:10px}.card p{color:#cbd5e1;font-size:15px}.small-btn{display:inline-block;background:#38bdf8;color:#02111f;padding:9px 13px;border-radius:999px;font-weight:700;font-size:13px;margin-top:14px}
.about{background:#071225}.about-box{display:grid;grid-template-columns:1.1fr .9fr;gap:24px;align-items:stretch}.about p{color:#dbeafe;margin-bottom:12px}.points{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:18px}.point{background:#0d1b30;border:1px solid #1e3a5f;padding:14px;border-radius:14px}.point strong{color:#38bdf8}.about-slider{display:flex;overflow:hidden;border-radius:20px;box-shadow:0 18px 45px rgba(0,0,0,.35);height:100%}.about-slide{min-width:100%;height:100%}.about-slide img{width:100%;height:100%;object-fit:cover}
.service-hero{padding:70px 16px;background:linear-gradient(160deg,#020617,#0f2544);border-bottom:1px solid #1e293b}.service-wrap{max-width:1120px;margin:auto;display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:center}.service-copy h1{font-size:38px;line-height:1.1;margin-bottom:12px}.service-copy h1 span,.cat{color:#38bdf8}.service-copy p{color:#dbeafe;margin-bottom:14px}.service-img img{height:430px;width:100%;object-fit:contain;background:#020617;border-radius:22px;box-shadow:0 18px 45px rgba(0,0,0,.38)}.details-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.detail-box{background:#0d1b30;border:1px solid #1e3a5f;border-radius:18px;padding:22px}.detail-box h3{color:#38bdf8;margin-bottom:10px}
form{max-width:760px;margin:auto;background:#0d1b30;border:1px solid #1e3a5f;padding:22px;border-radius:18px}input,select,textarea{width:100%;padding:13px;margin:8px 0;border:1px solid #233d61;border-radius:12px;background:#071225;color:#fff;outline:none}textarea{min-height:120px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
footer{text-align:center;background:#020617;color:#94a3b8;padding:28px;border-top:1px solid #1e293b}.footer-links{margin:12px 0;display:flex;gap:18px;justify-content:center;flex-wrap:wrap}.footer-links a,.developer-credit a{color:#38bdf8}.developer-credit{margin-top:8px;font-size:13px;color:#7ecbff}
@media(max-width:850px){.grid,.about-box,.service-wrap,.details-grid{grid-template-columns:1fr}.points,.form-row{grid-template-columns:1fr}.hero h2{font-size:28px}.service-img img{height:300px}}@media(max-width:480px){.hero h2{font-size:24px}.slide{height:240px}.btn{width:100%;text-align:center}}
.page{
  display:none;
  opacity:0;
  transform:translateX(35px);
  transition:opacity .45s ease, transform .45s ease;
}

.page.active{
  display:block;
  opacity:1;
  transform:translateX(0);
}

.page.page-exit{
  opacity:0;
  transform:translateX(-35px);
}
body{
  opacity:1;
  transform:translateX(0);
  transition:opacity .45s ease, transform .45s ease;
}

body.page-leave{
  opacity:0;
  transform:translateX(-35px);
}
body{
  opacity:0;
  transform:translateX(35px);
  transition:opacity .5s ease, transform .5s ease;
}

body.page-ready{
  opacity:1;
  transform:translateX(0);
}

body.page-exit{
  opacity:0;
  transform:translateX(-35px);
}
html, body{
  overflow-x:hidden !important;
  max-width:100% !important;
}

*{
  box-sizing:border-box;
}

.menu{
  right:-260px;
}

.menu.open{
  right:0;
}

img, section, main, header, footer{
  max-width:100%;
}