:root{
  --eh-orange:#F57C00;
  --eh-orange-2:#FF8C00;
  --eh-ink:#070B15;
  --radius:18px;
  --radius-lg:22px;
  --shadow: 0 18px 55px rgba(0,0,0,.28);
}

/* ===== SCROLL FIX (mac/trackpad safe) ===== */
html { height: auto !important; scroll-behavior: smooth; }
body {
  min-height: 100vh;
  overflow-x: hidden;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-y: auto;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  background:
    radial-gradient(900px 520px at 15% 10%, rgba(245,124,0,.14), transparent 60%),
    radial-gradient(900px 520px at 85% 10%, rgba(255,140,0,.10), transparent 60%),
    linear-gradient(180deg, #070B15 0%, #050812 100%);
  color: rgba(255,255,255,.92);
}

.bg-circuit{ position:relative; overflow: visible !important; }
.bg-circuit::before{
  content:"";
  position:absolute;
  inset:-1px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1200' height='800' viewBox='0 0 1200 800'%3E%3Cg fill='none' stroke='rgba(255,255,255,0.08)' stroke-width='1'%3E%3Cpath d='M120 160h220v90h160v-60h200v140h240'/%3E%3Cpath d='M160 520h280v-120h200v90h240v-160h220'/%3E%3Cpath d='M820 650h260v-220h-120v-140h-220'/%3E%3Ccircle cx='340' cy='250' r='6' fill='rgba(245,124,0,0.70)'/%3E%3Ccircle cx='560' cy='190' r='6' fill='rgba(245,124,0,0.60)'/%3E%3Ccircle cx='800' cy='490' r='6' fill='rgba(245,124,0,0.55)'/%3E%3Ccircle cx='960' cy='430' r='6' fill='rgba(245,124,0,0.55)'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position: right 10% top 6%;
  opacity:.55;
  pointer-events:none;
  transform: translateY(-10px);
}

/* Navbar */
.navbar{
  background: rgba(5,8,18,.72);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.navbar-brand{
  color:#fff !important;
  font-weight: 900;
  letter-spacing: .3px;
  display:flex;
  align-items:center;
  gap:.65rem;
}
.brand-mark{
  width: 38px; height: 38px;
  border-radius: 14px;
  display:inline-flex;
  align-items:center; justify-content:center;
  background: linear-gradient(135deg, rgba(245,124,0,.22), rgba(255,255,255,.06));
  border: 1px solid rgba(245,124,0,.30);
  box-shadow: 0 12px 28px rgba(0,0,0,.25);
  font-weight: 900;
  color: #ffd7b0;
}
.nav-link{
  color: rgba(255,255,255,.82) !important;
  font-weight: 700;
}
.nav-link:hover{ color:#fff !important; }
.nav-link.active{
  color:#fff !important;
  position: relative;
}
.nav-link.active::after{
  content:"";
  position:absolute;
  left: .4rem; right: .4rem; bottom: .25rem;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--eh-orange), transparent);
  border-radius: 99px;
  opacity:.9;
}

/* Buttons */
.btn-eh{
  --bs-btn-color: #0b1220;
  --bs-btn-bg: var(--eh-orange);
  --bs-btn-border-color: var(--eh-orange);
  --bs-btn-hover-bg: var(--eh-orange-2);
  --bs-btn-hover-border-color: var(--eh-orange-2);
  --bs-btn-focus-shadow-rgb: 245,124,0;
  border-radius: 999px;
  font-weight: 900;
  padding: .72rem 1.05rem;
}
.btn-ghost{
  border: 1px solid rgba(255,255,255,.20);
  color: rgba(255,255,255,.92);
  background: rgba(255,255,255,.04);
  border-radius: 999px;
  font-weight: 900;
  padding: .72rem 1.05rem;
}
.btn-ghost:hover{
  background: rgba(255,255,255,.07);
  border-color: rgba(255,255,255,.30);
  color:#fff;
}

/* Anchor offset */
section[id]{ scroll-margin-top: 96px; }

/* Hero / Carousel */
.hero{ padding-top: 86px; }
.carousel, .carousel-item{ border-radius: var(--radius-lg); overflow:hidden; }
.carousel-item{ height: clamp(440px, 60vh, 670px); position:relative; }
.carousel-item img{
  width:100%; height:100%; object-fit: cover;
  filter: contrast(1.03) saturate(1.05);
  transform: scale(1.02);
}
.slide-overlay{
  position:absolute; inset:0; pointer-events:none;
  background:
    linear-gradient(90deg, rgba(5,8,18,.94) 0%, rgba(5,8,18,.70) 46%, rgba(5,8,18,.26) 76%, rgba(5,8,18,.12) 100%),
    radial-gradient(900px 420px at 15% 10%, rgba(245,124,0,.25), transparent 60%);
}
.carousel-caption{
  left:6%; right:6%; bottom:16%;
  text-align:left; padding:0;
}
.hero-badge{
  display:inline-flex; gap:.5rem; align-items:center;
  padding: .5rem .85rem;
  border-radius: 999px;
  background: rgba(245,124,0,.14);
  border: 1px solid rgba(245,124,0,.28);
  color: #ffd7b0;
  font-weight: 800;
  letter-spacing:.2px;
  margin-bottom: .95rem;
}
.hero-title{
  font-weight: 950;
  letter-spacing: -1px;
  line-height: 1.03;
  max-width: 20ch;
  margin-bottom: .8rem;
  text-shadow: 0 20px 60px rgba(0,0,0,.55);
}
.hero-lead{
  color: rgba(255,255,255,.78);
  max-width: 62ch;
  font-size: 1.08rem;
  margin-bottom: 1.25rem;
}
.hero-kpis{
  display:flex; gap:.75rem; flex-wrap:wrap; margin-top: 1rem;
}
.kpi{
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 14px;
  padding: .75rem .85rem;
  min-width: 190px;
  box-shadow: 0 14px 35px rgba(0,0,0,.25);
}
.kpi .n{ font-weight: 950; }
.kpi .t{ color: rgba(255,255,255,.70); font-weight: 700; font-size:.92rem; }

/* Sections */
section{ padding: 4.35rem 0; }
.section-title{ font-weight: 950; letter-spacing: -.6px; margin-bottom: .55rem; }
.section-sub{ color: rgba(255,255,255,.72); max-width: 74ch; }

/* Cards */
.card-e{
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: var(--radius);
  box-shadow: 0 10px 30px rgba(0,0,0,.20);
  height: 100%;
  transition: transform .18s ease, border-color .18s ease, background .18s ease;
}
.card-e:hover{
  transform: translateY(-4px);
  border-color: rgba(245,124,0,.42);
  background: rgba(255,255,255,.05);
}
.icon{
  width: 44px; height: 44px;
  border-radius: 14px;
  display:inline-flex;
  align-items:center; justify-content:center;
  background: rgba(245,124,0,.12);
  border: 1px solid rgba(245,124,0,.22);
  color:#ffd7b0;
  font-weight: 950;
}

/* CTA */
.cta{
  background:
    radial-gradient(900px 420px at 15% 10%, rgba(245,124,0,.20), transparent 62%),
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.02));
  border-top: 1px solid rgba(255,255,255,.08);
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.cta-box{
  border-radius: calc(var(--radius-lg) + 6px);
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.04);
  box-shadow: var(--shadow);
  padding: 2.2rem;
}

/* Forms */
.form-control, .form-select{
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.04);
  color:#fff;
}
.form-control::placeholder{ color: rgba(255,255,255,.55); }
.form-control:focus{
  border-color: rgba(245,124,0,.55);
  box-shadow: 0 0 0 .25rem rgba(245,124,0,.18);
  background: rgba(255,255,255,.06);
  color:#fff;
}
label{ color: rgba(255,255,255,.86); font-weight: 800; }

.badge-eh{
  background: rgba(245,124,0,.14);
  border: 1px solid rgba(245,124,0,.25);
  color: #ffd7b0;
  font-weight: 800;
}
.hr-soft{
  height:1px;
  background: rgba(255,255,255,.08);
  margin: 1.6rem 0;
}
footer{
  padding: 2.25rem 0;
  color: rgba(255,255,255,.70);
}
footer a{ color: rgba(255,255,255,.82); text-decoration:none; }
footer a:hover{ color:#fff; text-decoration:underline; }

@media (max-width: 576px){
  .carousel-caption{ bottom: 12%; }
  .hero-title{ max-width: 26ch; }
  .kpi{ min-width: 160px; }
}