:root{
  --bg:#070a12;
  --text:#eef2ff;
  --muted:rgba(238,242,255,.74);
  --border:rgba(255,255,255,.12);
  --panel:rgba(255,255,255,.05);
  --panel2:rgba(255,255,255,.03);
  --red:#b3001b;
  --red2:#e11233;
  --max:1220px;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Helvetica Neue", Helvetica, sans-serif;
  color:var(--text);
  background:
    radial-gradient(900px 420px at 15% -10%, rgba(225,18,51,.22), transparent 60%),
    radial-gradient(800px 360px at 90% 0%, rgba(255,255,255,.08), transparent 60%),
    linear-gradient(180deg, #050811, var(--bg));
}
a{color:inherit}
.container{max-width:var(--max);margin:0 auto;padding:0 18px}
.hr{height:1px;background:rgba(255,255,255,.10);border:0;margin:18px 0}
.small{color:var(--muted);line-height:1.75}

.header{
  position:sticky;top:0;z-index:1000;
  background:rgba(5,8,17,.84);
  backdrop-filter: blur(14px);
  border-bottom:1px solid var(--border);
}
.header__inner{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:12px 0;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:14px;text-decoration:none}
.brand__logo{height:54px;width:auto;display:block;filter: drop-shadow(0 10px 26px rgba(0,0,0,.55));}
.brand__name{font-weight:950;letter-spacing:.01em}
.brand__tag{margin-top:4px;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:850}
.nav{display:flex;gap:6px;flex-wrap:wrap}
.nav__link{padding:9px 10px;border-radius:14px;text-decoration:none;font-weight:950;color:rgba(238,242,255,.92)}
.nav__link:hover{background:rgba(255,255,255,.08)}
.nav__link.active{background:rgba(225,18,51,.14);border:1px solid rgba(225,18,51,.22)}
.header__cta{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.pill{padding:9px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.06);text-decoration:none;font-weight:950}

.btn{
  display:inline-flex;align-items:center;justify-content:center;
  padding:12px 16px;border-radius:16px;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(255,255,255,.06);
  text-decoration:none;font-weight:950;
  transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.btn--primary{background:linear-gradient(135deg,var(--red),var(--red2));border-color:transparent}
.btn--ghost{background:transparent;border-color:rgba(225,18,51,.55)}
.btn:hover{transform:translateY(-1px); box-shadow:0 14px 40px rgba(0,0,0,.35)}

.hero{position:relative;min-height:720px;display:flex;align-items:center;overflow:hidden;border-bottom:1px solid rgba(255,255,255,.08)}
.hero__bg{
  position:absolute;inset:0;
  background:
    linear-gradient(90deg, rgba(7,10,18,.93) 0%, rgba(7,10,18,.70) 45%, rgba(7,10,18,.45) 70%, rgba(7,10,18,.93) 100%),
    url("../images/hero.jpg") center/cover no-repeat;
  transform:scale(1.02);
}
.hero__inner{position:relative;z-index:2;display:grid;grid-template-columns:1.1fr .9fr;gap:18px;align-items:start;padding:76px 0 56px}
.badge{display:inline-flex;align-items:center;gap:10px;font-weight:950;font-size:13px;padding:8px 12px;border-radius:999px;background:rgba(225,18,51,.14);border:1px solid rgba(225,18,51,.22)}
.badge::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--red2)}
h1{margin:12px 0 12px;font-size:56px;line-height:1.04;letter-spacing:-.03em}
.muted{color:var(--muted)}
.lead{margin:0 0 18px;font-size:18px;line-height:1.9;color:rgba(238,242,255,.92)}
.cta{display:flex;gap:10px;flex-wrap:wrap}
.kpi{margin-top:18px;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.kpi__card{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:18px;padding:14px}
.kpi__title{font-weight:1000}
.kpi__text{margin-top:6px;font-size:13px;line-height:1.6;color:rgba(238,242,255,.78)}

.panel{background:rgba(12,16,30,.80);border:1px solid rgba(255,255,255,.14);border-radius:24px;padding:18px}
.panel__title{font-weight:1000;margin-bottom:10px}
.panel__row{display:flex;justify-content:space-between;gap:10px;padding:9px 0;border-bottom:1px solid rgba(255,255,255,.10);font-size:14px}
.panel__row span{color:rgba(238,242,255,.70)}
.panel__divider{height:1px;background:rgba(255,255,255,.10);margin:12px 0}
.panel__mini{font-size:13px;line-height:1.7;color:rgba(238,242,255,.78)}
.panel__cta{margin-top:12px;display:flex;gap:10px;flex-wrap:wrap}

.section{padding:64px 0}
.section--alt{background:rgba(255,255,255,.02);border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08)}
.section__head{display:flex;justify-content:space-between;gap:18px;align-items:flex-end;flex-wrap:wrap;margin-bottom:18px}
.section__head h2{margin:0;font-size:36px;letter-spacing:-.02em}
.section__head p{margin:0;color:rgba(238,242,255,.75);max-width:640px;line-height:1.75}

.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.card{background:var(--panel);border:1px solid rgba(255,255,255,.12);border-radius:22px;padding:18px}
.card--flat{background:var(--panel2)}
.card h3{margin:0 0 8px}
.card p{margin:0 0 10px;color:rgba(238,242,255,.78);line-height:1.75}
.card ul{margin:0;padding-left:18px;color:rgba(238,242,255,.78);line-height:1.85}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}

.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.figure{border-radius:22px;overflow:hidden;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04)}
.figure img{width:100%;height:220px;object-fit:cover;display:block}
.figure .cap{padding:14px}
.figure .cap strong{display:block}
.figure .cap span{display:block;margin-top:6px;color:rgba(238,242,255,.72);font-size:13px;line-height:1.6}

.split{display:grid;grid-template-columns:1.2fr .8fr;gap:12px;align-items:start}
.list{margin-top:12px;display:grid;gap:10px}
.list__item{display:flex;justify-content:space-between;gap:12px;padding:12px 14px;border-radius:18px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04)}
.list__item span{color:rgba(238,242,255,.72)}
.quote{border-radius:24px;border:1px solid rgba(225,18,51,.20);background:linear-gradient(135deg, rgba(225,18,51,.14), rgba(255,255,255,.04));padding:18px}
.quote__title{font-weight:1000;margin-bottom:8px}
.quote p{margin:0;color:rgba(238,242,255,.86);line-height:1.85}
.quote__meta{margin-top:12px;color:rgba(238,242,255,.70);font-size:13px}

.contact{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.contact__row{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.10)}
.contact__row:last-child{border-bottom:none}
.contact__row span{color:rgba(238,242,255,.72)}
.contact__cta{margin-top:12px;display:flex;gap:10px;flex-wrap:wrap}
.steps{margin:8px 0 0;padding-left:18px;color:rgba(238,242,255,.80);line-height:1.9}
.note{margin-top:12px;padding:12px 14px;border-radius:18px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);color:rgba(238,242,255,.78);line-height:1.75}

.footer{padding:26px 0;border-top:1px solid rgba(255,255,255,.10)}
.footer__inner{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;flex-wrap:wrap}
.footer__brand{font-weight:1000}
.footer__muted{color:rgba(238,242,255,.68);font-size:13px;line-height:1.6}

@media (max-width: 1040px){
  .hero__inner{grid-template-columns:1fr}
  .kpi{grid-template-columns:1fr}
  .cards,.gallery{grid-template-columns:1fr}
  .grid2,.split,.contact{grid-template-columns:1fr}
  h1{font-size:42px}
  .brand__tag{display:none}
}


/* FIX: single logo + hero logo */
.brand__logo{background:none; image-rendering:auto;}
.hero__logo{
  height:54px;
  width:auto;
  display:block;
  margin:0 0 10px 0;
  filter: drop-shadow(0 12px 28px rgba(0,0,0,.55));
}
@media (max-width: 1040px){
  .hero__logo{height:46px}
}

/* --- Enterprise upgrades: video hero + logo animation --- */
.hero{position:relative}
.hero__video{
  position:absolute;
  inset:-10px;
  width:calc(100% + 20px);
  height:calc(100% + 20px);
  object-fit:cover;
  opacity:.55;
  filter:saturate(1.05) contrast(1.08);
  pointer-events:none;
  z-index:0;
}
.hero__bg{z-index:0}
.hero__inner{z-index:2; position:relative}
/* Prefer video on larger screens, fallback to image on mobile */
@media (max-width: 820px){
  .hero__video{display:none}
}
.hero__mark{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-bottom:12px;
}
.hero__mark img{
  height:56px;
  width:auto;
  display:block;
  filter: drop-shadow(0 18px 40px rgba(0,0,0,.55));
  animation: asrexIn .9s ease both;
}
@keyframes asrexIn{
  from{opacity:0; transform: translateY(12px) scale(.98)}
  to{opacity:1; transform:none}
}