
:root{
  --ink: #0b1020;
  --text: #121826;
  --muted: #5b6476;
  --card: #ffffff;
  --ring: rgba(0,0,0,.08);
}
*{box-sizing:border-box}
body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:var(--text);line-height:1.6;background:#f7f9fc}
.container{width:min(1100px,92%);margin:0 auto}
.site-header{position:sticky;top:0;background:#ffffffcc;backdrop-filter:saturate(180%) blur(10px);border-bottom:1px solid #eee}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:14px 0}
.logo{height:40px}
.nav a{margin-left:18px;text-decoration:none;color:#2c3342;font-weight:600}
.nav a:hover{opacity:.75}


  20%{transform:translateX(0%)}
  25%{transform:translateX(-100%)}
  40%{transform:translateX(-100%)}
  45%{transform:translateX(-200%)}
  60%{transform:translateX(-200%)}
  65%{transform:translateX(-300%)}
  80%{transform:translateX(-300%)}
  85%{transform:translateX(-400%)}
  100%{transform:translateX(-400%)}
}

.section{padding:60px 0}
.section.alt{background:#f1f5fb}
.grid.two{display:grid;grid-template-columns:1.2fr .8fr;gap:26px}
@media (max-width:900px){.grid.two{grid-template-columns:1fr;}.hero-text h1{font-size:32px}}
.card{background:var(--card);padding:22px;border-radius:16px;box-shadow:0 8px 24px var(--ring)}
.facts{list-style:none;padding:0;margin:0}
.facts li{padding:6px 0;border-bottom:1px dashed #e8ecf3}
.facts li:last-child{border-bottom:none}
.service .code{margin-top:10px;display:inline-block;padding:6px 10px;border-radius:10px;background:#eef6ff;border:1px solid #d6e7ff;font-weight:700;color:#0b5bd7;letter-spacing:.4px}
.table-wrap{overflow:auto;border-radius:12px;border:1px solid #e7ebf3;background:white}
table{width:100%;border-collapse:collapse}
th,td{padding:14px;border-bottom:1px solid #eef1f6;text-align:left}
tr:last-child td{border-bottom:none}
.note{border-left:4px solid #4fc3ff}
.email a{font-weight:800;color:#0b5bd7;text-decoration:none}
.email a:hover{text-decoration:underline}
.site-footer{padding:26px 0;background:#0f1221;color:#c9d2ea}
.footer-inner{display:flex;align-items:center;justify-content:center}


  20%{transform:translateX(0%)}
  25%{transform:translateX(-100%)}
  40%{transform:translateX(-100%)}
  45%{transform:translateX(-200%)}
  60%{transform:translateX(-200%)}
  65%{transform:translateX(-300%)}
  80%{transform:translateX(-300%)}
  85%{transform:translateX(-400%)}
  100%{transform:translateX(-400%)}
}


  20%{transform:translateX(0%)}
  25%{transform:translateX(-100%)}
  40%{transform:translateX(-100%)}
  45%{transform:translateX(-200%)}
  60%{transform:translateX(-200%)}
  65%{transform:translateX(-300%)}
  80%{transform:translateX(-300%)}
  85%{transform:translateX(-400%)}
  100%{transform:translateX(-400%)}
}


.hero{padding:32px 0;background:transparent}
.hero-wrap{width:min(1200px,92%);margin:0 auto}
.slideshow{position:relative;overflow:hidden;border-radius:16px;box-shadow:0 10px 24px rgba(0,0,0,.2);background:#000}
.slides{display:flex;transition:transform 1s ease;width:500%}
.slide{flex:1 0 100%;display:flex;justify-content:center;align-items:center;background:#000}

.overlay{position:absolute;inset:0;background:linear-gradient(90deg, rgba(0,0,0,.55), rgba(0,0,0,.15));pointer-events:none}
.hero-inner{height:100%;display:flex;align-items:center}
.hero-text{padding-left:40px;max-width:680px;color:#fff;pointer-events:auto}
.hero-text h1{font-size:34px;margin:0 0 10px 0}
.tagline{font-size:18px;margin:6px 0 4px 0;color:#edf2ff}
.sub{opacity:.95;margin-top:6px}
.cta{display:inline-block;margin-top:14px;padding:10px 16px;background:#fff;color:#0b1020;border-radius:8px;text-decoration:none;font-weight:700}

/* nav buttons */

.nav:hover{background:rgba(0,0,0,0.8)}
.prev{left:10px}
.next{right:10px}

/* indicators */
.indicators{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);display:flex;gap:8px;z-index:2}
.dot{height:12px;width:12px;background:#bbb;border-radius:50%;display:inline-block;cursor:pointer;transition:background .3s, transform .3s}
.dot.active{background:#fff;transform:scale(1.2)}

@media (max-width:900px){
  .hero-text{padding:20px}
  .hero-text h1{font-size:26px}
}



/* Hero section with autoplay slider */
.hero{padding:32px 0;background:transparent}
.hero-wrap{width:min(1200px,92%);margin:0 auto}
.slideshow{position:relative;overflow:hidden;border-radius:16px;box-shadow:0 8px 24px rgba(0,0,0,.2);background:#000}
.slides{display:flex;transition:transform .8s ease}

.overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.55),rgba(0,0,0,.15));pointer-events:none}
.hero-inner{height:100%;display:flex;align-items:center}
.hero-text{padding-left:40px;max-width:680px;color:#fff;pointer-events:auto}
.hero-text h1{font-size:34px;margin:0 0 10px}
.tagline{font-size:18px;margin:6px 0 4px;color:#edf2ff}
.sub{opacity:.95;margin-top:6px}
.cta{display:inline-block;margin-top:14px;padding:10px 16px;background:#fff;color:#0b1020;border-radius:8px;text-decoration:none;font-weight:700}

/* nav buttons */

.nav.prev{left:10px}
.nav.next{right:10px}
.nav:hover{background:#fff}

/* dots */
.dots{position:absolute;left:0;right:0;bottom:12px;display:flex;gap:6px;justify-content:center;z-index:6}
.dot{width:8px;height:8px;border-radius:999px;border:none;background:rgba(255,255,255,.6);cursor:pointer}
.dot.active{width:16px;height:8px;border-radius:10px;background:#fff}

/* responsive */
@media(max-width:900px){
  .hero-text{padding:20px}
  .hero-text h1{font-size:26px}
}
/* fix logo shadow */
.logo{height:40px;box-shadow:none;background:transparent}

/* === HEADER FIX === */
.site-header{position:sticky;top:0;background:rgba(255,255,255,.9);backdrop-filter:saturate(180%) blur(10px);border-bottom:1px solid #eee;z-index:9999}
.logo{filter:none} /* remove any unintended shadow effects */

/* === HERO FINAL LAYOUT === */
.hero{padding:32px 0;background:transparent}
.hero-wrap{width:min(1200px,92%);margin:0 auto}
.slideshow{position:relative;overflow:hidden;border-radius:16px;box-shadow:0 10px 24px rgba(0,0,0,.2);background:#000;z-index:1}
.slides{display:flex;transition:transform .8s ease}
.slide{flex:0 0 auto;display:flex;justify-content:center;align-items:center;background:#000}

.overlay{position:absolute;inset:0;background:linear-gradient(90deg, rgba(0,0,0,.55), rgba(0,0,0,.15));z-index:1;pointer-events:none}
.hero-inner{height:100%;display:flex;align-items:center;z-index:2;position:relative}
.hero-text{padding-left:40px;max-width:680px;color:#fff}
.hero-text h1{font-size:34px;margin:0 0 10px 0}
.tagline{font-size:18px;margin:6px 0 4px 0;color:#edf2ff}
.sub{opacity:.95;margin-top:6px}
.cta{display:inline-block;margin-top:14px;padding:10px 16px;background:#fff;color:#0b1020;border-radius:8px;text-decoration:none;font-weight:700}

/* Controls & dots */
.controls{position:absolute;inset:0;display:flex;align-items:center;justify-content:space-between;z-index:3;pointer-events:none}
.controls 
.controls .nav:hover{background:#fff}
.dots{position:absolute;left:0;right:0;bottom:10px;display:flex;gap:6px;justify-content:center;z-index:3}
.dots .dot{width:8px;height:8px;border-radius:999px;border:none;background:rgba(255,255,255,.6);cursor:pointer}
.dots .dot.active{width:16px;height:8px;border-radius:10px;background:#fff}

/* responsive */
@media (max-width:900px){
  .hero-text{padding:18px}
  .hero-text h1{font-size:26px}
}

/* Header navigation: horizontal row */
.nav{display:flex;flex-direction:row;align-items:center;gap:22px}
.nav a{display:inline-block;text-decoration:none;color:#2c3342;font-weight:600;padding:6px 2px}
.nav a:hover{opacity:.75}

/* Hero images fill area with cover (no letterbox), fixed height */
.slide img{width:100%;height:420px;object-fit:cover;display:block}
/* Keep whitespace via container */
.hero-wrap{width:min(1200px,92%);margin:0 auto}
