:root{--navy:#12384a;--teal:#1f5f7a;--light:#eef4f7;--ink:#1f2a30;--muted:#5b6b74}
*{box-sizing:border-box}body{margin:0;font-family:-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;color:var(--ink);line-height:1.6;background:#fff}
a{color:var(--teal)}.wrap{max-width:1100px;margin:0 auto;padding:0 24px}
header{background:var(--navy);color:#fff;position:sticky;top:0;z-index:9}
header .wrap{display:flex;align-items:center;justify-content:space-between;height:68px}
.brand{display:flex;align-items:center;gap:12px;color:#fff;text-decoration:none;font-weight:700;letter-spacing:.5px}
.brand img{height:40px;width:auto;display:block}
nav a{color:#d6e6ee;text-decoration:none;margin-left:20px;font-size:.95rem}nav a:hover{color:#fff}
.lang{margin-left:20px;background:transparent;border:1px solid #7fa9bd;color:#fff;border-radius:16px;padding:4px 12px;cursor:pointer}
.hero{background:linear-gradient(135deg,var(--navy),var(--teal));color:#fff;padding:90px 0 80px}
.hero h1{font-size:2.6rem;line-height:1.2;margin:0 0 16px;max-width:760px}.hero p{font-size:1.15rem;max-width:680px;color:#dbeaf1}
.btn{display:inline-block;background:#fff;color:var(--navy);padding:12px 26px;border-radius:6px;font-weight:600;text-decoration:none;margin-top:18px}
section{padding:70px 0}section h2{color:var(--navy);font-size:1.9rem;margin:0 0 8px}.sub{color:var(--muted);margin:0 0 32px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:22px}
.card{border:1px solid #d5e1e7;border-radius:10px;padding:24px;background:#fff;border-top:4px solid var(--teal)}
.card h3{margin:0 0 4px;color:var(--navy)}.card .kind{color:var(--muted);font-size:.85rem;margin:0 0 10px}
.price{font-weight:700;color:var(--teal);margin-top:12px}
.alt{background:var(--light)}.steps{counter-reset:s}.step{background:#fff;border-radius:10px;padding:24px}
.step b{display:block;color:var(--navy);font-size:1.1rem}
.contact{background:var(--navy);color:#fff;text-align:center}.contact h2{color:#fff}.contact a{color:#fff;font-size:1.3rem;font-weight:600}
footer{background:#0c2733;color:#a9c3cf;font-size:.9rem;padding:26px 0}footer a{color:#d6e6ee;margin-right:16px}
.legal{max-width:820px;margin:0 auto;padding:50px 24px}.legal h1{color:var(--navy)}.legal h2{color:var(--navy);font-size:1.3rem;margin-top:34px}
.note{font-size:.85rem;color:var(--muted)}
@media(max-width:700px){nav a.hide{display:none}.hero h1{font-size:1.9rem}}


/* Official M3A2C Brand Header & Wordmark */
.site-header {
  background: #ffffff !important;
  border-bottom: 1px solid #e2e8f0 !important;
  position: sticky;
  top: 0;
  z-index: 100;
  box-shadow: 0 2px 12px rgba(15, 23, 42, 0.05);
}
.brand-logo {
  height: 40px !important;
  width: auto !important;
  display: block;
}
.nav-links a {
  color: #1e293b !important;
  font-weight: 600 !important;
}
.nav-links a:hover {
  color: #f37152 !important;
}
.lang-btn {
  background: #f8fafc !important;
  color: #0f172a !important;
  border: 1px solid #cbd5e1 !important;
}
.lang-btn.active {
  background: #111827 !important;
  color: #ffffff !important;
  border-color: #111827 !important;
}
.btn-primary {
  background: #f37152 !important;
  color: #ffffff !important;
  border: none !important;
}
.btn-primary:hover {
  background: #e05d3e !important;
}
.footer-logo {
  height: 36px !important;
  width: auto !important;
  margin-bottom: 12px;
  display: block;
}


header {
  background: #ffffff !important;
  color: #111827 !important;
  border-bottom: 1px solid #e2e8f0 !important;
  padding: 16px 0 !important;
}
header .brand img {
  height: 38px !important;
  width: auto !important;
  display: block;
}
header nav a {
  color: #1e293b !important;
  font-weight: 600 !important;
}
header nav a:hover {
  color: #f37152 !important;
}
header .lang {
  background: #111827 !important;
  color: #ffffff !important;
  border: 1px solid #111827 !important;
}
.hero .btn {
  background: #f37152 !important;
  color: #ffffff !important;
  border: none !important;
  box-shadow: 0 4px 14px rgba(243, 113, 82, 0.35);
}