:root{
  --bg:#0E2A30;
  --bg-panel:#123640;
  --bg-panel-2:#16404B;
  --bg-panel-3:#0B2126;
  --line:rgba(94,234,212,0.20);
  --line-strong:rgba(94,234,212,0.45);

  --cyan:#5EEAD4;
  --copper:#E0954F;
  --copper-dark:#B8703A;
  --copper-light:#F2B877;
  --violet:#B48CFF;
  --violet-light:#D4C2FF;
  --green:#7EE0A8;
  --pink:#FF8FB1;

  --text:#EDEAE0;
  --text-muted:#9FB9BD;
  --radius:14px;
  --maxw:1180px;
}

*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--bg);
  color:var(--text);
  font-family:'Manrope', sans-serif;
  line-height:1.7;
  overflow-x:hidden;
}
h1,h2,h3,h4{ font-family:'Space Grotesk', sans-serif; font-weight:700; letter-spacing:-.01em;}
.mono{ font-family:'JetBrains Mono', monospace; letter-spacing:.02em;}
a{ color:inherit; text-decoration:none;}
img,svg{ display:block; max-width:100%;}
ul{ list-style:none;}
button{ font-family:inherit; cursor:pointer; border:none; background:none; color:inherit;}
input,select{ font-family:inherit; }

.wrap{ max-width:var(--maxw); margin:0 auto; padding:0 28px;}
section{ position:relative; padding:110px 0;}

section{ --accent:var(--copper-light); --accent-dot:var(--cyan); }
#services{ --accent:var(--copper-light); --accent-dot:var(--cyan); }
#process{ --accent:var(--cyan); --accent-dot:var(--violet-light); }
#stats{ --accent:var(--violet-light); --accent-dot:var(--pink); }
#testimonials{ --accent:var(--green); --accent-dot:var(--cyan); }
#pricing{ --accent:var(--copper-light); --accent-dot:var(--green); }
#faults{ --accent:var(--violet-light); --accent-dot:var(--copper-light); }
#contact{ --accent:var(--cyan); --accent-dot:var(--copper-light); }

.eyebrow{
  display:inline-flex; align-items:center; gap:10px;
  font-family:'JetBrains Mono', monospace; font-size:12.5px; letter-spacing:.14em;
  color:var(--accent); text-transform:uppercase;
  padding:6px 14px; border:1px solid color-mix(in srgb, var(--accent) 55%, transparent); border-radius:100px;
  background:color-mix(in srgb, var(--accent) 10%, transparent);
  transition:color .4s, border-color .4s, background .4s;
}
.eyebrow .dot{ width:6px; height:6px; border-radius:50%; background:var(--accent-dot); box-shadow:0 0 8px var(--accent-dot);}

.blueprint-bg{
  position:fixed; inset:0; z-index:-2; background:var(--bg);
  background-image:
    linear-gradient(var(--line) 1px, transparent 1px),
    linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size:44px 44px;
  opacity:.35;
  mask-image: radial-gradient(ellipse 90% 60% at 50% 0%, black 30%, transparent 90%);
}

.blob-field{ position:absolute; inset:0; z-index:-1; overflow:hidden; pointer-events:none;}
.blob{ position:absolute; border-radius:50%; filter:blur(70px); opacity:.35; animation:drift 22s ease-in-out infinite;}
.blob-a{ width:420px; height:420px; background:var(--copper); top:-120px; left:-100px; animation-duration:26s;}
.blob-b{ width:380px; height:380px; background:var(--violet); top:60px; right:-140px; animation-duration:19s; animation-delay:-6s;}
.blob-c{ width:300px; height:300px; background:var(--cyan); bottom:-140px; left:30%; animation-duration:24s; animation-delay:-12s;}
@keyframes drift{
  0%,100%{ transform:translate(0,0) scale(1);}
  33%{ transform:translate(30px,-24px) scale(1.08);}
  66%{ transform:translate(-24px,20px) scale(.95);}
}

header{
  position:fixed; top:0; inset-inline:0; z-index:100;
  backdrop-filter:blur(10px);
  background:rgba(14,42,48,.72);
  border-bottom:1px solid var(--line);
}
.nav{ display:flex; align-items:center; justify-content:space-between; padding:14px 28px; max-width:var(--maxw); margin:0 auto; gap:20px;}
.brand{ display:flex; align-items:center; gap:10px;}
.brand img{ height:46px; width:auto; display:block;}
.nav-links{ display:flex; gap:28px; font-size:15px; font-weight:500; flex:1; justify-content:center;}
.nav-links a{ color:var(--text-muted); transition:color .2s;}
.nav-links a:hover, .nav-links a:focus-visible{ color:var(--cyan);}
.nav-right{ display:flex; align-items:center; gap:16px;}
.lang-switch{ display:flex; gap:2px; background:var(--bg-panel); border:1px solid var(--line); border-radius:100px; padding:3px;}
.lang-switch a{ padding:6px 11px; font-size:12.5px; font-weight:700; border-radius:100px; color:var(--text-muted); font-family:'JetBrains Mono'; transition:all .2s; display:block;}
.lang-switch a.active{ background:var(--copper); color:#1a1005;}
.lang-switch a:hover:not(.active){ color:var(--text);}
.nav-cta{
  background:var(--copper); color:#1a1005; font-weight:700; font-size:14.5px;
  padding:10px 20px; border-radius:100px; transition:transform .2s, background .2s; white-space:nowrap;
}
.nav-cta:hover{ background:var(--copper-light); transform:translateY(-1px);}

.hero{ padding:172px 0 100px; }
.hero-grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:60px; align-items:center;}
.ticket-id{ margin-bottom:22px; }
.hero h1{ font-size:clamp(34px, 5vw, 58px); line-height:1.12; margin:18px 0 22px;}
.grad-text{
  background:linear-gradient(100deg, var(--copper-light), var(--pink) 35%, var(--violet-light) 65%, var(--cyan));
  background-size:300% 100%;
  -webkit-background-clip:text; background-clip:text; color:transparent;
  animation:gradflow 8s ease infinite;
}
@keyframes gradflow{ 0%{ background-position:0% 50%;} 50%{ background-position:100% 50%;} 100%{ background-position:0% 50%;} }
.hero p.lead{ font-size:18.5px; color:var(--text-muted); max-width:520px; margin-bottom:34px;}
.hero-ctas{ display:flex; gap:14px; flex-wrap:wrap; margin-bottom:46px;}
.btn{
  display:inline-flex; align-items:center; gap:10px; padding:14px 26px;
  border-radius:100px; font-weight:700; font-size:15.5px; transition:all .2s;
}
.btn-primary{ background:linear-gradient(100deg, var(--copper), var(--pink)); background-size:200% 100%; color:#1a1005;}
.btn-primary:hover{ background-position:100% 0; transform:translateY(-2px); box-shadow:0 10px 30px -12px var(--copper);}
.btn-ghost{ border:1px solid var(--line-strong); color:var(--text);}
.btn-ghost:hover{ background:rgba(94,234,212,.08); border-color:var(--cyan);}
.readout-row{ display:flex; gap:36px; flex-wrap:wrap;}
.readout .num{ font-family:'JetBrains Mono'; font-size:26px; font-weight:700; color:var(--cyan);}
.readout:nth-child(2) .num{ color:var(--violet-light);}
.readout:nth-child(3) .num{ color:var(--green);}
.readout .lbl{ font-size:13px; color:var(--text-muted); margin-top:2px;}

.schematic{ position:relative; }
.schematic svg{ width:100%; height:auto; overflow:visible;}
.float{ animation:floaty 6s ease-in-out infinite;}
@keyframes floaty{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-10px);} }
.pulse-line{ stroke-dasharray:6 5; animation:march 20s linear infinite;}
@keyframes march{ to{ stroke-dashoffset:-500;} }
.tag-label{ font-family:'JetBrains Mono'; font-size:11px; fill:var(--text-muted);}
.tag-chip{ fill:var(--bg-panel-2); stroke:var(--line-strong); stroke-width:1;}
.chip-glow{ animation:glow 4s ease-in-out infinite;}
@keyframes glow{ 0%,100%{ opacity:.5;} 50%{ opacity:1;} }

.sec-head{ max-width:640px; margin-bottom:56px;}
.sec-head h2{ font-size:clamp(28px,3.4vw,40px); margin:16px 0 14px;}
.sec-head p{ color:var(--text-muted); font-size:16.5px;}

.services-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
.svc-card{
  background:var(--bg-panel); border:1px solid var(--line); border-radius:var(--radius);
  padding:30px 26px; transition:transform .25s, border-color .25s, background .25s;
  border-top:3px solid var(--card-accent, var(--copper));
}
.svc-card:hover{ transform:translateY(-6px); border-color:var(--line-strong); background:var(--bg-panel-2);}
.svc-icon{ width:46px; height:46px; margin-bottom:20px; color:var(--card-accent, var(--copper-light));}
.svc-card h3{ font-size:19px; margin-bottom:8px;}
.svc-card p{ color:var(--text-muted); font-size:14.5px;}
.svc-meta{ margin-top:16px; display:flex; justify-content:space-between; font-family:'JetBrains Mono'; font-size:12px; color:var(--card-accent, var(--cyan)); border-top:1px dashed var(--line); padding-top:12px;}

.process{ background:var(--bg-panel-3); }
.process-track{ position:relative; display:grid; grid-template-columns:repeat(5,1fr); gap:18px; margin-top:20px;}
.process-track::before{
  content:''; position:absolute; top:23px; inset-inline:4%; height:2px;
  background:repeating-linear-gradient(90deg, var(--line-strong) 0 8px, transparent 8px 14px);
  z-index:0;
}
.proc-step{ position:relative; z-index:1; text-align:center;}
.proc-num{
  width:46px; height:46px; border-radius:50%; background:var(--bg-panel-2); border:1px solid var(--step-accent, var(--copper-dark));
  display:flex; align-items:center; justify-content:center; margin:0 auto 16px;
  font-family:'JetBrains Mono'; color:var(--step-accent, var(--copper-light)); font-weight:700;
  transition:transform .3s;
}
.proc-step:hover .proc-num{ transform:scale(1.12) rotate(-6deg);}
.proc-step h4{ font-size:15.5px; margin-bottom:8px;}
.proc-step p{ font-size:13.5px; color:var(--text-muted);}

.panel{
  background:var(--bg-panel); border:1px solid var(--line); border-radius:20px;
  padding:50px 44px; display:grid; grid-template-columns:repeat(4,1fr); gap:30px;
}
.gauge{ text-align:center;}
.gauge svg{ margin:0 auto 14px;}
.gauge .ring{ transition:stroke-dashoffset 1.4s ease;}
.gauge .val{ font-family:'JetBrains Mono'; font-size:16px; color:var(--gauge-accent, var(--cyan)); font-weight:700;}
.gauge .lbl{ font-size:13.5px; color:var(--text-muted); margin-top:6px;}

.tickets{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
.ticket{
  background:var(--bg-panel); border:1px solid var(--line); border-radius:var(--radius);
  padding:28px; position:relative; border-inline-start:3px solid var(--tk-accent, var(--green));
}
.ticket p.quote{ font-size:15px; color:var(--text); margin-bottom:22px;}
.ticket .sig{ display:flex; justify-content:space-between; align-items:center; border-top:1px dashed var(--line); padding-top:14px;}
.sig .who{ font-weight:700; font-size:14.5px;}
.sig .device{ font-family:'JetBrains Mono'; font-size:11.5px; color:var(--tk-accent, var(--copper-light));}

.price-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
.price-card{
  background:var(--bg-panel); border:1px solid var(--line); border-radius:var(--radius);
  padding:32px 28px; display:flex; flex-direction:column; transition:transform .25s;
}
.price-card:hover{ transform:translateY(-4px);}
.price-card.highlight{ border-color:var(--copper); background:linear-gradient(160deg, rgba(224,149,79,.12), rgba(180,140,255,.06) 60%, var(--bg-panel));}
.price-card h3{ font-size:18px; margin-bottom:6px;}
.price-card .range{ font-family:'JetBrains Mono'; color:var(--cyan); font-size:22px; margin:14px 0 18px;}
.price-card.highlight .range{ color:var(--violet-light);}
.price-card ul{ flex:1; margin-bottom:22px;}
.price-card li{ font-size:14px; color:var(--text-muted); padding:6px 0; display:flex; gap:8px;}
.price-card li::before{ content:'\2014'; color:var(--copper-light);}

/* ---------------- dynamic faults price table ---------------- */
.faults-controls{ display:flex; gap:14px; flex-wrap:wrap; margin-bottom:24px;}
.faults-search{
  flex:1; min-width:220px; background:var(--bg-panel); border:1px solid var(--line); border-radius:100px;
  padding:12px 20px; color:var(--text); font-size:14.5px;
}
.faults-search::placeholder{ color:var(--text-muted);}
.faults-search:focus{ outline:none; border-color:var(--violet-light);}
.faults-category{
  background:var(--bg-panel); border:1px solid var(--line); border-radius:100px; color:var(--text);
  padding:12px 20px; font-size:14.5px;
}
.faults-table-wrap{
  background:var(--bg-panel); border:1px solid var(--line); border-radius:var(--radius); overflow-x:auto;
}
table.faults-table{ width:100%; border-collapse:collapse; min-width:560px;}
.faults-table thead th{
  text-align:start; font-family:'JetBrains Mono'; font-size:12px; text-transform:uppercase; letter-spacing:.08em;
  color:var(--violet-light); padding:16px 22px; border-bottom:1px solid var(--line); cursor:pointer; user-select:none; white-space:nowrap;
}
.faults-table thead th:hover{ color:var(--cyan);}
.faults-table thead th .arrow{ opacity:.4; margin-inline-start:4px; font-size:10px;}
.faults-table tbody td{ padding:15px 22px; border-bottom:1px dashed var(--line); font-size:14.5px;}
.faults-table tbody tr:last-child td{ border-bottom:none;}
.faults-table tbody tr:hover{ background:rgba(94,234,212,.04);}
.faults-cat-pill{
  display:inline-block; padding:4px 12px; border-radius:100px; font-size:12px; font-family:'JetBrains Mono';
  background:rgba(180,140,255,.14); color:var(--violet-light); border:1px solid rgba(180,140,255,.3);
}
.faults-price{ font-family:'JetBrains Mono'; color:var(--green); font-weight:700; white-space:nowrap;}
.faults-empty{ padding:40px 22px; text-align:center; color:var(--text-muted);}

.contact-grid{ display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:start;}
.info-row{ display:flex; gap:16px; padding:18px 0; border-bottom:1px solid var(--line);}
.info-row .ic{ width:22px; height:22px; color:var(--copper-light); flex:none; margin-top:3px;}
.info-row:nth-child(2) .ic{ color:var(--violet-light);}
.info-row:nth-child(3) .ic{ color:var(--green);}
.info-row .t1{ font-size:13px; color:var(--text-muted);}
.info-row .t2{ font-size:16px; font-weight:700;}
.hours-card{
  background:var(--bg-panel); border:1px solid var(--line); border-radius:var(--radius); padding:28px;
}
.hours-row{ display:flex; justify-content:space-between; padding:9px 0; font-size:14.5px; border-bottom:1px dashed var(--line);}
.hours-row:last-child{ border:0;}
.hours-row .d{ color:var(--text-muted);}
.hours-row .t{ font-family:'JetBrains Mono'; color:var(--cyan);}

footer{ background:var(--bg-panel-3); border-top:1px solid var(--line); padding:56px 0 30px;}
.foot-grid{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:30px; margin-bottom:40px;}
.foot-brand img{ height:40px; margin-bottom:12px;}
.foot-brand p{ color:var(--text-muted); max-width:320px; margin-top:4px; font-size:14px;}
.foot-links h4{ font-size:14px; margin-bottom:16px; color:var(--text-muted); font-family:'Manrope'; font-weight:700;}
.foot-links li{ padding:6px 0; font-size:14.5px;}
.foot-links a:hover{ color:var(--cyan);}
.foot-bottom{ display:flex; justify-content:space-between; padding-top:26px; border-top:1px solid var(--line); font-size:13px; color:var(--text-muted); flex-wrap:wrap; gap:10px;}
.foot-admin-link{ opacity:.35; font-size:11px; transition:opacity .2s;}
.foot-admin-link:hover{ opacity:1;}

.float-wa{
  position:fixed; bottom:26px; left:26px; z-index:90;
  width:58px; height:58px; border-radius:50%; background:#25D366;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 10px 30px -8px rgba(0,0,0,.5);
  transition:transform .2s;
}
.float-wa:hover{ transform:scale(1.08);}
.float-wa svg{ width:28px; height:28px; fill:#fff;}

.reveal{ opacity:0; transform:translateY(24px); transition:opacity .7s ease, transform .7s ease;}
.reveal.in{ opacity:1; transform:none;}

a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible{ outline:2px solid var(--cyan); outline-offset:3px; border-radius:6px;}

@media (max-width: 900px){
  .nav-links{ display:none;}
  .hero-grid{ grid-template-columns:1fr;}
  .schematic{ order:-1;}
  .services-grid, .price-grid, .tickets{ grid-template-columns:1fr 1fr;}
  .process-track{ grid-template-columns:repeat(3,1fr); row-gap:36px;}
  .process-track::before{ display:none;}
  .panel{ grid-template-columns:1fr 1fr;}
  .contact-grid{ grid-template-columns:1fr;}
}
@media (max-width: 600px){
  section{ padding:76px 0;}
  .hero{ padding-top:150px;}
  .services-grid, .price-grid, .tickets, .panel{ grid-template-columns:1fr;}
  .process-track{ grid-template-columns:1fr 1fr;}
  .foot-grid{ flex-direction:column;}
  .nav{ padding:14px 18px;}
  .nav-cta{ padding:9px 14px; font-size:13px;}
  .brand img{ height:36px;}
}
@media (prefers-reduced-motion: reduce){
  *{ animation:none !important; transition:none !important; scroll-behavior:auto !important;}
}
