:root{
  --bg:#070712;
  --panel:rgba(255,255,255,.06);
  --panel2:rgba(255,255,255,.08);
  --line:rgba(255,255,255,.14);
  --txt:#eef2ff;
  --muted:rgba(238,242,255,.75);
  --neon1:#00fff0;
  --neon2:#ff4fe3;
  --shadow:0 20px 60px rgba(0,0,0,.55);
  --radius:18px;
  --w:1100px;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font:16px/1.55 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
  color:var(--txt);
  background:
    radial-gradient(1200px 600px at 15% 10%, rgba(255,79,227,.22), transparent 60%),
    radial-gradient(900px 520px at 85% 20%, rgba(0,255,240,.18), transparent 55%),
    radial-gradient(900px 600px at 50% 100%, rgba(0,255,240,.10), transparent 60%),
    linear-gradient(180deg, #060611, #0a0a18 45%, #070712);
}
a{color:inherit; text-decoration:none}
a:hover{opacity:.92}
.wrap{
  width:min(var(--w), 92vw);
  margin:18px auto;
}
.block{
  border:1px solid var(--line);
  background:linear-gradient(180deg, var(--panel), rgba(255,255,255,.03));
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  overflow:hidden;
  backdrop-filter: blur(10px);
}
.header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:14px 16px;
}
.brand{
  display:flex;
  align-items:center;
  gap:12px;
}
.brand img{width:60px;height:60px;border-radius:14px}
.burger{
  width:46px;height:46px;
  border:1px solid var(--line);
  background:linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.04));
  border-radius:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}
.burger:focus{outline:2px solid rgba(0,255,240,.45); outline-offset:2px}
.burger .lines{
  width:20px;height:14px; position:relative;
}
.burger .lines span{
  position:absolute; left:0; right:0;
  height:2px; border-radius:2px;
  background:linear-gradient(90deg, var(--neon1), var(--neon2));
}
.burger .lines span:nth-child(1){top:0}
.burger .lines span:nth-child(2){top:6px}
.burger .lines span:nth-child(3){top:12px}

.nav{
  display:none;
  border-top:1px solid var(--line);
  background:linear-gradient(180deg, rgba(0,0,0,.15), rgba(255,255,255,.02));
}
.nav.open{display:block}
.nav ul{
  list-style:none;
  padding:10px 10px 14px;
  margin:0;
  display:grid;
  grid-template-columns: 1fr;
  gap:8px;
}
.nav a{
  display:block;
  padding:12px 12px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:14px;
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
}
.nav a:hover{border-color:rgba(0,255,240,.35)}
@media (min-width: 960px){
  .nav ul{grid-template-columns: 1fr 1fr}
}

.intro{
  padding:18px 18px 16px;
}
.breadcrumbs{
  font-size:13px;
  color:var(--muted);
  margin:0 0 8px;
}
.breadcrumbs a{
  color:rgba(238,242,255,.88);
  border-bottom:1px dotted rgba(238,242,255,.35);
}
h1{
  font-size:28px;
  letter-spacing:.2px;
  margin:0 0 8px;
}
.intro p{
  margin:0;
  color:rgba(238,242,255,.86);
  max-width: 78ch;
}

.heroimg img{
  width:100%;
  height:auto;
  display:block;
}

.content{
  padding:18px;
}
.content section{
  padding:14px 14px 16px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:16px;
  background:linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.02));
  margin:12px 0;
}
.content h2{
  margin:0 0 10px;
  font-size:20px;
}
.content p{margin:0 0 10px; color:rgba(238,242,255,.86)}
.content p:last-child{margin-bottom:0}
.content ul, .content ol{
  margin:10px 0 0 18px;
  color:rgba(238,242,255,.86)
}
.content table{
  width:100%;
  border-collapse:collapse;
  margin-top:10px;
  background:rgba(0,0,0,.18);
  border:1px solid rgba(255,255,255,.12);
  border-radius:14px;
  overflow:hidden;
  display:block;
}
.content thead{background:rgba(255,255,255,.06)}
.content th, .content td{
  padding:10px 10px;
  border-bottom:1px solid rgba(255,255,255,.10);
  color:rgba(238,242,255,.88);
  text-align:left;
  vertical-align:top;
}
.content tr:last-child td{border-bottom:none}

.offers{
  padding:14px;
}
.offers .offers-table{
  border:2px solid #ffffff;
  background:#ffffff;
  border-radius:16px;
  overflow:hidden;
}
.offer-row{
  display:grid;
  grid-template-columns: 1fr 1fr 1fr;
  align-items:center;
  gap:0;
  border-top:1px solid rgba(0,0,0,.12);
}
.offer-row:first-child{border-top:none}
.offer-cell{
  padding:14px 10px;
  text-align:center;
  display:flex;
  justify-content:center;
  align-items:center;
  min-height:72px;
}
.offer-cell a{display:inline-flex; align-items:center; justify-content:center}
.offer-cell img{width:160px;height:50px; object-fit:contain}
.offer-sum{
  font-weight:700;
  color:#0b0b16;
  letter-spacing:.2px;
}
.offer-btn{
  padding:15px 14px;
  border-radius:15px;
  border:0;
  cursor:pointer;
  font-weight:800;
  background:#18c66b;
  color:#06110b;
}
.offer-btn:focus{outline:2px solid rgba(0,0,0,.28); outline-offset:2px}
@media (max-width: 640px){
  .offer-row{grid-template-columns: 1fr}
  .offer-cell{min-height:auto}
}

.calc{
  padding:18px;
}
.calc-grid{
  display:grid;
  grid-template-columns: 1fr;
  gap:10px;
}
@media (min-width: 900px){
  .calc-grid{grid-template-columns: 1fr 1fr 1fr 1fr}
}
.field{
  display:flex;
  flex-direction:column;
  gap:6px;
}
label{font-size:13px; color:var(--muted)}
input{
  padding:12px 12px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(0,0,0,.22);
  color:var(--txt);
}
.result{
  margin-top:12px;
  padding:14px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.12);
  background:linear-gradient(180deg, rgba(0,0,0,.20), rgba(255,255,255,.03));
  color:rgba(238,242,255,.90);
}

.faq{padding:18px}
.faq h2{margin:0 0 10px; font-size:20px}
details{
  border:1px solid rgba(255,255,255,.12);
  border-radius:16px;
  padding:12px 12px;
  background:linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.02));
  margin:10px 0;
}
summary{cursor:pointer; font-weight:700}
details p{margin:10px 0 0; color:rgba(238,242,255,.86)}

.footer{
  padding:16px 18px;
  display:flex;
  justify-content:center;
  gap:10px;
  color:var(--muted);
  font-size:14px;
}
.footer a{color:rgba(238,242,255,.85); border-bottom:1px dotted rgba(238,242,255,.35)}
.separator{opacity:.6}
.formwrap{padding:18px}
.formwrap form{
  display:grid;
  grid-template-columns: 1fr;
  gap:10px;
}
textarea{
  min-height:160px;
  resize:vertical;
  padding:12px 12px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(0,0,0,.22);
  color:var(--txt);
}
.sendbtn{
  padding:12px 14px;
  border-radius:16px;
  border:0;
  cursor:pointer;
  font-weight:800;
  background:linear-gradient(90deg, var(--neon1), var(--neon2));
  color:#050511;
}
.intro .lead{
  white-space:nowrap;
  overflow-x:auto;
  max-width:100%;
  -webkit-overflow-scrolling:touch;
}
.content a.interlink{
  text-decoration:underline;
}
.content a.interlink:hover{
  text-decoration:underline;
}

/* Contact form flash messages */
.flash{margin:0 18px 18px; padding:12px 14px; border-radius:14px; border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.06); color:rgba(238,242,255,.95);}
.flash--ok{border-color:rgba(0,255,200,.25);}
.flash--err{border-color:rgba(255,80,120,.25);}
.flash ul{margin:8px 0 0 18px;}
