:root{
  --bg:#081a38;
  --bg-soft:#0d234a;
  --panel:#0f2a56;
  --panel-2:#163872;
  --line:rgba(124,189,255,.28);
  --line-strong:rgba(173,221,255,.46);
  --text:#f5f9ff;
  --muted:#b2c2da;
  --blue:#2b8dff;
  --blue-2:#8fd7ff;
  --silver:#cad8ea;
  --shadow:0 18px 54px rgba(0,0,0,.38);
  --radius:24px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  color:var(--text);
  background:
    radial-gradient(circle at 76% 8%, rgba(62,140,255,.34), transparent 26%),
    radial-gradient(circle at 18% 30%, rgba(48,108,232,.18), transparent 32%),
    linear-gradient(180deg, #071934 0%, #0a2144 40%, #0b1b39 100%);
  line-height:1.6;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
.container{width:min(1180px, calc(100% - 32px)); margin:0 auto}
.topbar{
  background:linear-gradient(90deg, rgba(18,46,98,.96), rgba(8,26,56,.98));
  border-bottom:1px solid var(--line);
  font-size:.95rem;
}
.topbar-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 0}
.topbar-left,.topbar-right{display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.topbar-item,.lang-switch{color:var(--muted)}
.topbar-slogan{color:var(--blue-2); font-weight:600}
.lang-switch{padding:8px 14px;border:1px solid var(--line);border-radius:999px}
.site-header{
  position:sticky; top:0; z-index:30;
  backdrop-filter:blur(14px);
  background:rgba(8,26,56,.84);
  border-bottom:1px solid rgba(154,205,255,.12);
}
.nav-shell{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:14px 0}
.brand img{width:220px;max-width:44vw}
.site-nav{display:flex;align-items:center;gap:22px}
.site-nav a{color:#d7e5f7;font-weight:600}
.site-nav a.active{color:#fff}
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:14px 22px; border-radius:16px; font-weight:700; border:1px solid transparent;
  transition:.22s ease; cursor:pointer;
}
.btn:hover{transform:translateY(-1px)}
.btn-primary{
  background:linear-gradient(135deg, var(--blue), #2aa0ff);
  color:white;
  box-shadow:0 14px 30px rgba(29,143,255,.26);
}
.btn-secondary{
  background:rgba(255,255,255,.04);
  border-color:var(--line-strong);
  color:#edf4ff;
}
.btn-ghost{
  background:transparent;
  border-color:var(--line);
  color:var(--muted);
}
.nav-cta{margin-left:6px}
.nav-toggle{
  display:none; border:1px solid var(--line); background:rgba(255,255,255,.04); color:white;
  border-radius:14px; font-size:1.2rem; padding:10px 14px;
}
.hero{
  position:relative;
  min-height:76vh;
  display:flex; align-items:center;
  background:
    linear-gradient(90deg, rgba(5,20,46,.88) 0%, rgba(7,26,58,.60) 42%, rgba(7,26,58,.28) 100%),
    url('../images/hero-banner.png') center/cover no-repeat;
  border-bottom:1px solid var(--line);
}
.hero::after{
  content:""; position:absolute; inset:auto 0 0 0; height:150px;
  background:linear-gradient(180deg, rgba(7,18,37,0) 0%, rgba(7,18,37,.98) 100%);
}
.hero-inner{position:relative; z-index:1; width:min(740px,100%); padding:92px 0 110px}
.hero-kicker{
  display:inline-flex; align-items:center; gap:10px; padding:10px 16px;
  border:1px solid var(--line); border-radius:999px; background:rgba(11,25,52,.58); color:var(--blue-2);
  font-weight:700; margin-bottom:18px;
}
.hero h1{
  font-size:clamp(2.5rem, 5vw, 4.8rem); line-height:1.02; margin:0 0 14px; letter-spacing:-.04em;
}
.hero p{font-size:1.14rem; color:#d6e4f6; max-width:60ch; margin:0 0 28px}
.hero-actions{display:flex; gap:14px; flex-wrap:wrap; margin-bottom:20px}
.hero-note{color:var(--muted); font-size:.98rem}
.section{padding:78px 0}
.section-tight{padding:56px 0}
.section-header{display:flex;justify-content:space-between;gap:18px;align-items:end;margin-bottom:30px}
.section-header h2,.section-title{font-size:clamp(2rem, 4vw, 3.1rem);line-height:1.05;margin:0}
.section-header p{max-width:640px;color:var(--muted);margin:0}
.eyebrow{color:var(--blue-2);text-transform:uppercase;letter-spacing:.16em;font-weight:800;font-size:.84rem;display:block;margin-bottom:10px}
.service-grid{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px;
}
.service-card,.gallery-card,.feature,.info-card,.contact-card,.pricing-card{
  background:linear-gradient(180deg, rgba(14,36,76,.92), rgba(8,24,52,.96));
  border:1px solid var(--line);
  border-radius:var(--radius);
  overflow:hidden;
  box-shadow:var(--shadow);
}
.service-image-wrap{display:block; aspect-ratio: 11 / 7; background:#081427}
.service-image{width:100%; height:100%; object-fit:cover}
.service-body{padding:18px 20px 22px}
.service-meta{display:flex;justify-content:space-between;gap:12px;align-items:center;color:var(--blue-2);font-weight:700;font-size:.96rem;margin-bottom:4px}
.service-card h3,.gallery-card h3,.feature h3,.info-card h3,.contact-card h3,.pricing-card h3{margin:0 0 10px;font-size:1.25rem;line-height:1.15}
.service-card p,.gallery-card p,.feature p,.info-card p,.contact-card p,.pricing-card p{margin:0;color:var(--muted)}
.service-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:16px}
.grid-2{display:grid;grid-template-columns:1.1fr .9fr;gap:28px;align-items:center}
.panel-image{
  border-radius:30px; border:1px solid var(--line); overflow:hidden; box-shadow:var(--shadow)
}
.panel-image img{width:100%; height:100%; object-fit:cover}
.feature-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.feature{padding:24px}
.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.step{
  background:rgba(11,25,52,.72); border:1px solid var(--line); border-radius:22px;
  padding:22px; box-shadow:var(--shadow)
}
.step-number{
  width:42px; height:42px; display:grid; place-items:center;
  border-radius:50%; background:linear-gradient(135deg, var(--blue), #3db7ff);
  color:white; font-weight:800; margin-bottom:14px;
}
.step h3{margin:0 0 8px;font-size:1.12rem}
.step p{margin:0;color:var(--muted)}
.band{
  padding:28px; border:1px solid var(--line); border-radius:30px;
  background:linear-gradient(180deg, rgba(16,39,82,.90), rgba(9,25,52,.94));
  box-shadow:var(--shadow)
}
.gallery-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}
.gallery-card img{aspect-ratio:11/7; width:100%; object-fit:cover}
.gallery-body{padding:18px}
.cta{
  padding:34px; border:1px solid var(--line); border-radius:32px;
  background:linear-gradient(120deg, rgba(18,47,95,.98), rgba(9,29,60,.99));
  display:flex; justify-content:space-between; gap:20px; align-items:center; box-shadow:var(--shadow)
}
.cta h2{margin:0 0 10px; font-size:clamp(1.8rem,4vw,3rem); line-height:1.08}
.cta p{margin:0;color:var(--muted);max-width:700px}
.cta-actions{display:flex;gap:12px;flex-wrap:wrap}
.contact-layout{display:grid;grid-template-columns:1.1fr .9fr;gap:24px}
.contact-card,.pricing-card,.info-card{padding:26px}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.field{display:flex;flex-direction:column;gap:8px}
.field.full{grid-column:1/-1}
label{font-weight:700}
input,textarea,select{
  width:100%; padding:15px 16px; border-radius:16px; border:1px solid var(--line);
  background:rgba(255,255,255,.03); color:white; font:inherit;
}
textarea{min-height:150px; resize:vertical}
.note{font-size:.95rem;color:var(--muted)}
.list{display:grid;gap:12px;margin-top:18px}
.list-item{padding:14px 16px;border-radius:18px;background:rgba(255,255,255,.03);border:1px solid var(--line);color:#dce9f7}
.site-footer{margin-top:56px; border-top:1px solid var(--line); background:rgba(4,11,22,.72)}
.footer-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:26px;padding:38px 0}
.footer-logo{width:180px;margin-bottom:14px}
.footer-contact,.footer-links{display:grid;gap:10px}
.footer-links{grid-template-columns:repeat(2,minmax(0,1fr))}
.footer-bottom{padding:0 0 30px;color:var(--muted)}
.notice{padding:14px 18px;border-radius:18px;border:1px solid var(--line);background:rgba(255,255,255,.03);margin-bottom:16px}
@media (max-width: 1000px){
  .service-grid,.gallery-grid,.feature-grid,.steps,.form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grid-2,.contact-layout,.footer-grid{grid-template-columns:1fr}
}
@media (max-width: 760px){
  .topbar-inner{flex-direction:column;align-items:flex-start}
  .nav-toggle{display:block}
  .site-nav{
    display:none; position:absolute; left:16px; right:16px; top:100%;
    background:rgba(7,18,37,.98); border:1px solid var(--line); border-radius:22px;
    flex-direction:column; align-items:flex-start; padding:16px; box-shadow:var(--shadow)
  }
  .site-nav.open{display:flex}
  .site-nav .nav-cta{margin-left:0;width:100%}
  .hero{min-height:72vh; background-position:74% center}
  .service-grid,.gallery-grid,.feature-grid,.steps,.form-grid{grid-template-columns:1fr}
  .section{padding:62px 0}
  .cta{flex-direction:column; align-items:flex-start}
}

.service-image{filter:saturate(1.08) contrast(1.03);}
.hero{background-position:center center;}