/* Basic, accessible, responsive styles */
:root{
  --bg:#0b1220;
  --ink:#0b1220;
  --ink-soft:#3a4153;
  --paper:#ffffff;
  --accent:#0e7afe;
  --accent-ink:#063a83;
  --accent-bg:#e8f1ff;
  --ring: 0 0 0 3px rgba(14,122,254,.25);
  --radius:12px;
  --max:1120px;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";
  color: var(--ink);
  background: var(--paper);
  line-height:1.5;
}

.container{max-width:var(--max);margin:0 auto;padding: clamp(16px, 2vw, 28px)}

.site-header{
  position:static;top:auto;z-index:auto;
  /* backdrop removed for non-sticky header */
  background:rgba(255,255,255,.7);
  border-bottom:1px solid #eef1f6;
  display:flex;align-items:center;gap:16px;
  padding:20px clamp(16px, 2vw, 28px);
}

.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);font-weight:700}
.brand img{display:block}
.nav{margin-left:auto;display:flex;gap:18px;flex-wrap:wrap}
.nav a{color:var(--ink);text-decoration:none;font-weight:600}
.nav a:hover{color:var(--accent)}

.nav-toggle{display:none;margin-left:auto;border:none;background:none;font-size:24px}

@media (max-width: 860px){
  .nav{display:none;flex-direction:column;gap:8px;padding:10px 0}
  .nav[aria-expanded="true"]{display:flex}
  .nav-toggle{display:block}
}

.hero{
  background: radial-gradient(80% 120% at 10% 10%, #eef4ff 0%, #ffffff 60%);
  border-bottom:1px solid #eef1f6;
}
.hero-inner{max-width:var(--max);margin:0 auto;padding: clamp(24px, 5vw, 64px)}
.lead{font-size:clamp(18px, 2.2vw, 22px);color:var(--ink-soft);max-width:900px}
.cta-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:16px}
.btn{
  display:inline-block;padding:12px 18px;border-radius:10px;border:1px solid #d9e2f2;
  background:#fff;color:var(--ink);font-weight:700;text-decoration:none
}
.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}
.btn:focus{outline:none;box-shadow:var(--ring)}
.badges{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px;padding:0;list-style:none;}
.badges li{background:#fff;border:1px solid #e7edf8;border-radius:999px;padding:8px 12px}

.panel{border-bottom:1px solid #eef1f6}
.panel.accent{background:var(--accent-bg)}
.grid{display:grid;gap:16px}
.grid.two{grid-template-columns:repeat(2,1fr)}
.grid.three{grid-template-columns:repeat(3,1fr)}
@media (max-width: 900px){
  .grid.two{grid-template-columns:1fr}
  .grid.three{grid-template-columns:1fr}
}

.card{background:#fff;border:1px solid #e7edf8;border-radius:var(--radius);padding:18px}
.notice{margin-top:16px;background:#fff8e5;border:1px solid #ffe2a8;padding:14px;border-radius:var(--radius)}

.service{background:#fff;border:1px solid #e7edf8;border-radius:var(--radius);padding:18px}

.steps{counter-reset:s;display:grid;gap:10px;padding-left:0}
.steps li{list-style:none;border-left:4px solid var(--accent);padding:10px 14px;background:#fff;border-radius:8px}
.steps li::before{counter-increment:s;content:counter(s) ".";font-weight:800;color:var(--accent);margin-right:6px}

.contact-form{display:grid;gap:12px;max-width:720px}
.field{display:grid;gap:6px}
input,textarea{padding:12px 14px;border:1px solid #cdd7e6;border-radius:10px;font:inherit}
input:focus,textarea:focus{outline:none;box-shadow:var(--ring)}
.small{font-size:14px;color:var(--ink-soft)}

.site-footer{padding:22px clamp(16px, 2vw, 28px);color:var(--ink-soft)}

.badges li{list-style:none;}

.site-header .nav a{color:#fff;}
.site-header .nav a:hover{color:#e6f0ff;}