:root{
  --bg:#0b1220;--text:#e8eefc;--muted:#b8c6ea;--line:rgba(232,238,252,.14);
  --accent:#43d7c4;--accent2:#7aa7ff;--shadow:0 16px 40px rgba(0,0,0,.35);
  --r:18px;--max:1140px;--font:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;
}
*{box-sizing:border-box} html,body{margin:0;padding:0}
body{
  font-family:var(--font);color:var(--text);
  background:
    radial-gradient(1000px 600px at 15% 10%, rgba(122,167,255,.18), transparent 60%),
    radial-gradient(900px 520px at 85% 0%, rgba(67,215,196,.16), transparent 55%),
    linear-gradient(180deg,var(--bg) 0%,#050813 100%);
  line-height:1.6;
}
a{color:inherit;text-decoration:none} a:hover{text-decoration:underline}
.container{width:min(100% - 40px,var(--max));margin-inline:auto}
header{position:sticky;top:0;z-index:50;background:rgba(11,18,32,.76);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;padding:14px 0;gap:20px}
.brand{display:flex;align-items:center;gap:12px;font-weight:800;flex:0 0 auto}
.brand-logo{height:58px;width:auto;display:block;object-fit:contain;filter:drop-shadow(0 6px 20px rgba(0,0,0,.35))}
.brand-logo.small{height:42px}
.navlinks{display:flex;gap:8px;align-items:center;font-size:14px;flex:1 1 auto;justify-content:center}
.navlinks a{padding:10px 14px;border-radius:12px;white-space:nowrap}
.navlinks a.active{background:rgba(232,238,252,.08);border:1px solid rgba(232,238,252,.12);text-decoration:none}
.navcta{display:flex;gap:10px;align-items:center;flex:0 0 auto}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:14px;padding:10px 14px;font-weight:700;font-size:14px;border:1px solid rgba(232,238,252,.16);background:rgba(232,238,252,.06);box-shadow:0 10px 25px rgba(0,0,0,.18);text-decoration:none!important}
.btn:hover{background:rgba(232,238,252,.10)}
.btn.primary{border:none;background:linear-gradient(135deg,var(--accent2),var(--accent));color:#051026}
.btn.ghost{background:transparent;border:1px solid rgba(232,238,252,.18)}
.btn.small{padding:8px 12px;border-radius:12px;font-size:13px}
.mobile-toggle{display:none;width:44px;height:44px;border-radius:14px;border:1px solid rgba(232,238,252,.16);background:rgba(232,238,252,.06);color:var(--text)}
.mobile-menu{display:none;padding:10px 0 18px}
.mobile-menu a{display:block;padding:12px 12px;border-radius:14px;border:1px solid rgba(232,238,252,.10);background:rgba(232,238,252,.04);margin-top:10px}
.hero{padding:68px 0 34px}
.hero-grid{display:grid;grid-template-columns:1.04fr .96fr;gap:30px;align-items:stretch}
.hero h1{margin:0 0 12px;font-size:clamp(34px,4vw,52px);line-height:1.12;letter-spacing:-.3px}
.sub{color:var(--muted);font-size:16px;max-width:58ch}
.pills{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0 22px}
.pill{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;border:1px solid rgba(232,238,252,.14);background:rgba(232,238,252,.05);font-size:13px}
.dot{width:9px;height:9px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px rgba(67,215,196,.15)}
.card{background:linear-gradient(180deg,rgba(17,26,47,.92),rgba(17,26,47,.66));border:1px solid rgba(232,238,252,.12);border-radius:var(--r);box-shadow:var(--shadow)}
.hero-card{padding:18px;display:flex;flex-direction:column;justify-content:space-between;gap:14px}
.kpi{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.kpi .item{padding:14px;border-radius:16px;background:rgba(232,238,252,.05);border:1px solid rgba(232,238,252,.10)}
.kpi .big{font-size:22px;font-weight:900;letter-spacing:-.2px}
.kpi .label{color:var(--muted);font-size:12px;margin-top:2px}
.section{padding:26px 0}
.section h2{margin:0 0 12px;font-size:26px;letter-spacing:-.2px}
.section p{color:var(--muted);margin:0 0 12px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.service-card{padding:18px}
.service-card h3{margin:0 0 6px;font-size:16px}
.service-card p{margin:0 0 14px;color:var(--muted);font-size:14px}
.service-list{margin:0;padding-left:18px;color:var(--muted);font-size:14px}
.service-list li{margin:6px 0}
.split{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.steps{display:grid;gap:10px}
.step{padding:14px 16px;border-radius:16px;background:rgba(232,238,252,.05);border:1px solid rgba(232,238,252,.10)}
.step strong{display:block;font-size:14px}
.step span{color:var(--muted);font-size:13px}
.badge-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
.badge{padding:8px 12px;border-radius:999px;border:1px solid rgba(232,238,252,.14);background:rgba(232,238,252,.04);color:var(--muted);font-size:13px}
.cta{padding:22px;display:flex;align-items:center;justify-content:space-between;gap:18px}
.cta h3{margin:0;font-size:18px}
.cta p{margin:6px 0 0;color:var(--muted)}
.page-hero{padding:46px 0 14px}
.breadcrumb{color:var(--muted);font-size:13px}
.page-hero h1{margin:6px 0 10px;font-size:36px;line-height:1.12}
.list-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.mini{padding:16px}
.mini h4{margin:0 0 6px;font-size:15px}
.mini p{margin:0;color:var(--muted);font-size:14px}
.form{padding:18px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
label{display:block;font-size:13px;color:var(--muted);margin:10px 0 6px}
input,textarea,select{width:100%;padding:12px 12px;border-radius:14px;border:1px solid rgba(232,238,252,.14);background:rgba(232,238,252,.05);color:var(--text);outline:none}
textarea{min-height:120px;resize:vertical}
input:focus,textarea:focus,select:focus{border-color:rgba(67,215,196,.55);box-shadow:0 0 0 4px rgba(67,215,196,.12)}
footer{margin-top:42px;border-top:1px solid var(--line);background:rgba(11,18,32,.60)}
.footer-grid{display:grid;grid-template-columns:1.2fr .8fr .8fr;gap:16px;padding:26px 0}
.footer-grid h4{margin:0 0 10px;font-size:14px}
.footer-grid a{color:var(--muted);font-size:13px;display:block;margin:8px 0}
.smallprint{padding:14px 0 24px;color:rgba(232,238,252,.55);font-size:12px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;border-top:1px solid rgba(232,238,252,.08)}
.notice{padding:14px 16px;border-radius:16px;background:rgba(255,209,102,.10);border:1px solid rgba(255,209,102,.22);color:rgba(255,233,194,.95);font-size:13px}
.hero-enterprise{position:relative;overflow:hidden;padding:72px 0 40px}
.hero-enterprise:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(122,167,255,.08),transparent 35%,rgba(67,215,196,.06) 80%,transparent 100%);pointer-events:none}
.hero-orb{position:absolute;border-radius:999px;filter:blur(12px);pointer-events:none}
.hero-orb-1{width:320px;height:320px;right:12%;top:60px;background:radial-gradient(circle,rgba(67,215,196,.22),transparent 70%)}
.hero-orb-2{width:260px;height:260px;left:-60px;bottom:0;background:radial-gradient(circle,rgba(122,167,255,.20),transparent 70%)}
.enterprise-grid{align-items:center}
.hero-visual{position:relative;padding:28px;overflow:hidden;background:linear-gradient(180deg,rgba(13,23,43,.96),rgba(6,11,22,.85))}
.hero-panel-clean{display:flex;flex-direction:column;gap:22px;min-height:520px}
.hero-panel-head{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-bottom:18px;border-bottom:1px solid rgba(232,238,252,.08)}
.hero-panel-head h3{margin:10px 0 0;font-size:24px;line-height:1.25;max-width:16ch}
.hero-panel-head img{width:120px;height:auto;object-fit:contain;filter:drop-shadow(0 20px 35px rgba(0,0,0,.3))}
.hero-solution-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;flex:1 1 auto}
.solution-tile{padding:18px;border-radius:18px;border:1px solid rgba(232,238,252,.10);background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.04))}
.solution-tile h4{margin:8px 0 10px;font-size:20px;line-height:1.2}
.solution-tile ul{margin:0;padding-left:18px;color:var(--muted);font-size:14px}
.solution-tile li{margin:8px 0}
.tile-kicker{display:inline-block;padding:6px 10px;border-radius:999px;background:rgba(67,215,196,.10);border:1px solid rgba(67,215,196,.22);font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#cbfff7}
.tile-wide{grid-column:1 / -1}
.hero-panel-footer{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.hero-panel-footer span{padding:12px 10px;text-align:center;border-radius:14px;border:1px solid rgba(232,238,252,.10);background:rgba(232,238,252,.04);font-size:13px;color:#d8e4ff}
.section-head{display:flex;align-items:end;justify-content:space-between;gap:16px;flex-wrap:wrap}
.micro-note{color:var(--muted);font-size:13px;padding:10px 14px;border:1px solid rgba(232,238,252,.10);border-radius:999px;background:rgba(232,238,252,.04)}
.service-elite{position:relative;overflow:hidden}
.service-elite:before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:linear-gradient(90deg,var(--accent2),var(--accent))}
.service-tag,.eyebrow{display:inline-flex;align-items:center;gap:8px;padding:7px 11px;border-radius:999px;font-size:12px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;border:1px solid rgba(232,238,252,.14);background:rgba(232,238,252,.05);color:#dce7ff}
.service-footer{margin-top:14px;color:#d2def7;font-size:13px;font-weight:700}
.content-panel{padding:22px}
.content-panel h2{margin-top:10px}
.split-vision{align-items:stretch}
.clean-list{margin-top:8px}
.cta-enterprise{background:linear-gradient(135deg,rgba(122,167,255,.13),rgba(67,215,196,.08));border:1px solid rgba(122,167,255,.22)}
@media (max-width:1100px){
  .navlinks{gap:4px}
  .navlinks a{padding:9px 10px;font-size:13px}
  .navcta .btn.small{padding:8px 10px}
}
@media (max-width:980px){
  .hero-grid,.grid3,.split,.list-cards,.footer-grid,.hero-solution-grid,.hero-panel-footer{grid-template-columns:1fr}
  .navlinks,.navcta{display:none}
  .mobile-toggle{display:inline-flex;align-items:center;justify-content:center}
  .mobile-menu.show{display:block}
  .hero{padding-top:42px}
  .brand-logo{height:46px}
  .brand-logo.small{height:36px}
  .hero-panel-head{align-items:flex-start;flex-direction:column}
  .hero-panel-head img{width:96px}
}
@media (max-width:680px){
  .container{width:min(100% - 24px,var(--max))}
  .hero-panel-clean{min-height:auto}
  .hero-visual{padding:18px}
}


/* Premium interaction upgrades */
.navlinks a,
.mobile-menu a,
.btn,
.service-card,
.solution-tile,
.hero-visual,
.card{
  position:relative;
  isolation:isolate;
  transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease, background .28s ease, color .28s ease;
  will-change:transform;
}

.navlinks a{
  overflow:hidden;
  border:1px solid transparent;
  background:linear-gradient(180deg, rgba(255,255,255,.01), rgba(255,255,255,0));
}
.navlinks a::before,
.btn::before,
.service-card::before,
.solution-tile::before,
.hero-visual::before,
.card::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:radial-gradient(220px circle at var(--mx,50%) var(--my,50%), rgba(122,167,255,.24), transparent 42%),
             radial-gradient(180px circle at calc(var(--mx,50%) + 8%) calc(var(--my,50%) - 10%), rgba(67,215,196,.14), transparent 36%);
  opacity:0;
  transition:opacity .28s ease;
  pointer-events:none;
  z-index:-1;
}
.navlinks a::after{
  content:"";
  position:absolute;
  left:14px;
  right:14px;
  bottom:7px;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg,var(--accent2),var(--accent));
  transform:scaleX(.35);
  transform-origin:center;
  opacity:0;
  transition:transform .28s ease, opacity .28s ease;
  box-shadow:0 0 16px rgba(67,215,196,.28);
}
.navlinks a:hover,
.navlinks a:focus-visible{
  text-decoration:none;
  color:#fff;
  transform:translateY(-2px);
  border-color:rgba(122,167,255,.22);
  box-shadow:0 14px 32px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.05);
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
}
.navlinks a:hover::before,
.navlinks a:focus-visible::before,
.btn:hover::before,
.btn:focus-visible::before,
.service-card:hover::before,
.solution-tile:hover::before,
.hero-visual:hover::before,
.card:hover::before{
  opacity:1;
}
.navlinks a:hover::after,
.navlinks a:focus-visible::after,
.navlinks a.active::after{
  opacity:1;
  transform:scaleX(1);
}
.navlinks a.active{
  background:linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.04));
  border:1px solid rgba(122,167,255,.20);
  box-shadow:0 12px 26px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.05);
}

.btn{
  overflow:hidden;
}
.btn:hover,
.btn:focus-visible{
  transform:translateY(-3px) scale(1.01);
  box-shadow:0 16px 34px rgba(0,0,0,.26), 0 0 0 1px rgba(122,167,255,.10) inset;
}
.btn.primary{
  background:linear-gradient(135deg,#7aa7ff 0%, #4bb9ff 42%, var(--accent) 100%);
}
.btn.primary:hover,
.btn.primary:focus-visible{
  box-shadow:0 18px 40px rgba(32,118,255,.22), 0 10px 24px rgba(0,0,0,.24);
}
.btn.ghost:hover,
.btn.ghost:focus-visible{
  background:linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.04));
  border-color:rgba(122,167,255,.24);
}

.hero-visual,
.card,
.service-card,
.solution-tile{
  backdrop-filter:blur(12px);
}
.hero-visual:hover,
.card:hover,
.service-card:hover,
.solution-tile:hover{
  transform:translateY(-6px);
  border-color:rgba(122,167,255,.18);
  box-shadow:0 24px 54px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.04);
}
.service-card:hover h3,
.solution-tile:hover h4{
  color:#fff;
}

header::after{
  content:"";
  position:absolute;
  left:0; right:0; bottom:-1px;
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(122,167,255,.5), rgba(67,215,196,.55), transparent);
  opacity:.9;
  pointer-events:none;
}
header{
  box-shadow:0 10px 30px rgba(0,0,0,.16);
}

.hero-panel-head,
.hero-panel-footer span,
.solution-tile,
.service-card,
.mini,
.step,
.kpi .item{
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}

@media (prefers-reduced-motion:no-preference){
  .hero-orb-1{animation:floatOrbA 9s ease-in-out infinite;}
  .hero-orb-2{animation:floatOrbB 11s ease-in-out infinite;}
  .brand-logo{transition:transform .35s ease, filter .35s ease;}
  .brand:hover .brand-logo{transform:translateY(-2px) scale(1.03); filter:drop-shadow(0 10px 26px rgba(67,215,196,.22));}
}

@keyframes floatOrbA{
  0%,100%{transform:translate3d(0,0,0)}
  50%{transform:translate3d(8px,-14px,0)}
}
@keyframes floatOrbB{
  0%,100%{transform:translate3d(0,0,0)}
  50%{transform:translate3d(-10px,10px,0)}
}

/* Final visual refinement update */
body{
  background:
    linear-gradient(180deg, rgba(8,14,28,.90), rgba(5,8,19,.98)),
    url('../img/cyber-itsm-bg.svg') center top / cover no-repeat fixed,
    radial-gradient(1000px 600px at 15% 10%, rgba(122,167,255,.18), transparent 60%),
    radial-gradient(900px 520px at 85% 0%, rgba(67,215,196,.16), transparent 55%),
    linear-gradient(180deg,var(--bg) 0%,#050813 100%);
}

header{
  background:linear-gradient(180deg, rgba(6,12,24,.88), rgba(8,16,30,.72));
}

.brand-logo{
  height:76px;
  filter:
    drop-shadow(0 0 6px rgba(67,215,196,.32))
    drop-shadow(0 0 18px rgba(67,215,196,.18))
    drop-shadow(0 12px 30px rgba(0,0,0,.38));
}
.brand-logo.small{height:54px}
.brand-logo-glow{
  image-rendering:auto;
}
.brand:hover .brand-logo,
.brand:focus-visible .brand-logo{
  filter:
    drop-shadow(0 0 8px rgba(67,215,196,.46))
    drop-shadow(0 0 26px rgba(122,167,255,.22))
    drop-shadow(0 14px 34px rgba(0,0,0,.42));
}

.hero-enterprise,
.page-hero{
  position:relative;
  background:
    linear-gradient(90deg, rgba(17,28,54,.68), rgba(7,15,31,.50) 45%, rgba(6,22,31,.48) 100%),
    url('../img/cyber-itsm-bg.svg') center / cover no-repeat;
  border-bottom:1px solid rgba(232,238,252,.08);
}
.hero-enterprise::after,
.page-hero::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(500px 220px at 18% 18%, rgba(122,167,255,.14), transparent 65%),
    radial-gradient(460px 240px at 84% 18%, rgba(67,215,196,.12), transparent 62%);
  pointer-events:none;
}
.hero-enterprise .container,
.page-hero .container{position:relative; z-index:1}

.hero-panel-clean,
.content-panel,
.form,
.map-embed,
.page-hero,
.cta-enterprise{
  backdrop-filter:blur(12px);
}

.hero-panel-head img{
  width:148px;
  filter:
    drop-shadow(0 0 8px rgba(67,215,196,.26))
    drop-shadow(0 0 22px rgba(122,167,255,.18))
    drop-shadow(0 20px 35px rgba(0,0,0,.3));
}

.page-hero h1,
.hero h1{
  text-shadow:0 2px 10px rgba(0,0,0,.28);
}

.map-embed iframe{
  background:#09101f;
}

@media (max-width:980px){
  body{background-attachment:scroll, scroll, scroll, scroll, scroll}
  .brand-logo{height:62px}
  .brand-logo.small{height:46px}
  .hero-panel-head img{width:118px}
}

/* Final hero upgrade */
.brand-logo-glow{
  height:88px;
  filter:drop-shadow(0 0 10px rgba(68,217,255,.65)) drop-shadow(0 0 28px rgba(57,174,255,.45)) drop-shadow(0 0 44px rgba(67,215,196,.24));
}
.brand{
  position:relative;
}
.brand::after{
  content:"";
  position:absolute;
  left:8px;
  bottom:-8px;
  width:190px;
  height:18px;
  background:radial-gradient(circle, rgba(65,220,255,.8) 0%, rgba(65,220,255,.18) 45%, transparent 72%);
  filter:blur(10px);
  pointer-events:none;
}

.hero-futuristic{
  position:relative;
  min-height:calc(100vh - 92px);
  display:flex;
  align-items:center;
  overflow:hidden;
  isolation:isolate;
  padding:72px 0 48px;
  background:
    linear-gradient(90deg, rgba(5,10,24,.94) 0%, rgba(6,11,27,.88) 28%, rgba(5,10,24,.55) 48%, rgba(5,10,24,.22) 68%, rgba(5,10,24,.12) 100%),
    linear-gradient(180deg, rgba(6,11,24,.72) 0%, rgba(4,8,18,.78) 100%);
}
.hero-shell{
  position:relative;
  z-index:3;
  display:grid;
  grid-template-columns:minmax(0, 600px) 1fr;
  gap:24px;
  align-items:center;
}
.hero-copy-left{
  position:relative;
  z-index:4;
  padding:18px 0;
}
.hero-copy-left h1{
  margin:18px 0 16px;
  font-size:clamp(52px, 7.2vw, 94px);
  line-height:1.02;
  max-width:10ch;
  letter-spacing:-.04em;
  text-shadow:0 10px 40px rgba(0,0,0,.35);
}
.hero-copy-left h1 span{
  color:#5fe4ff;
  text-shadow:0 0 24px rgba(95,228,255,.22), 0 0 52px rgba(67,215,196,.14);
}
.hero-copy-left .sub{
  max-width:620px;
  font-size:18px;
  color:#d2def7;
  text-shadow:0 4px 20px rgba(0,0,0,.22);
}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:24px}
.hero-spacer{min-height:580px}
.hero-bg-art{
  position:absolute;
  inset:0;
  z-index:1;
  background-image:url('../img/hero-bg-4k-averik.png');
  background-repeat:no-repeat;
  background-position:right center;
  background-size:cover;
  opacity:.98;
}
.hero-bg-art::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, rgba(7,12,28,1) 0%, rgba(7,12,28,.94) 16%, rgba(7,12,28,.82) 30%, rgba(7,12,28,.42) 46%, rgba(7,12,28,.14) 66%, rgba(7,12,28,.08) 100%),
    radial-gradient(1100px 560px at 18% 20%, rgba(56,112,255,.22), transparent 60%),
    radial-gradient(1000px 520px at 85% 15%, rgba(67,215,196,.14), transparent 60%);
}
.hero-grid-bg{
  position:absolute;
  inset:auto -10% -16% -8%;
  height:68%;
  z-index:0;
  pointer-events:none;
  opacity:.55;
  transform:perspective(1200px) rotateX(76deg);
  transform-origin:center bottom;
  background-image:
    linear-gradient(rgba(88,203,255,.24) 1px, transparent 1px),
    linear-gradient(90deg, rgba(88,203,255,.24) 1px, transparent 1px),
    radial-gradient(circle at 50% 50%, rgba(56,189,248,.22), transparent 60%);
  background-size:80px 80px, 80px 80px, 100% 100%;
  border-top:1px solid rgba(88,203,255,.18);
  box-shadow:0 -30px 120px rgba(56,189,248,.16);
}
.hero-particles{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  z-index:2;
  pointer-events:none;
  opacity:.92;
}
.hero-bg-glow{
  position:absolute;
  border-radius:999px;
  filter:blur(90px);
  pointer-events:none;
  z-index:1;
}
.hero-bg-glow-1{width:420px;height:420px;right:10%;top:8%;background:rgba(59,130,246,.18)}
.hero-bg-glow-2{width:320px;height:320px;left:2%;top:10%;background:rgba(45,212,191,.12)}
.hero-service-cards{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:14px;
  margin-top:28px;
  max-width:700px;
}
.hero-service-card{
  display:flex;
  flex-direction:column;
  gap:5px;
  padding:18px 18px 16px;
  border-radius:20px;
  border:1px solid rgba(103,197,255,.22);
  background:linear-gradient(180deg, rgba(10,18,38,.78), rgba(6,12,24,.56));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06), 0 18px 30px rgba(0,0,0,.22), 0 0 0 1px rgba(103,197,255,.04);
  text-decoration:none!important;
  backdrop-filter:blur(10px);
}
.hero-service-card strong{font-size:20px;line-height:1.1;color:#fff}
.hero-service-card span{font-size:14px;color:#cae2ff}
.hero-service-card:hover{
  transform:translateY(-6px);
  border-color:rgba(88,203,255,.45);
  box-shadow:0 0 0 1px rgba(88,203,255,.12), 0 0 26px rgba(88,203,255,.18), 0 20px 34px rgba(0,0,0,.28);
}
.hero-trust-row{
  display:flex;
  gap:16px;
  flex-wrap:wrap;
  margin-top:26px;
  color:#dbe8ff;
  font-size:18px;
}
.hero-trust-row span{
  position:relative;
  padding-left:18px;
}
.hero-trust-row span::before{
  content:"";
  position:absolute;
  left:0;
  top:50%;
  width:8px;
  height:8px;
  border-radius:999px;
  transform:translateY(-50%);
  background:linear-gradient(135deg, #6ee7ff, #43d7c4);
  box-shadow:0 0 14px rgba(110,231,255,.65);
}
.navlinks a{
  border:1px solid transparent;
}
.navlinks a:hover,
.navlinks a:focus-visible,
.navlinks a.active{
  box-shadow:0 0 0 1px rgba(99,191,255,.18) inset, 0 0 22px rgba(35,173,255,.18), 0 12px 26px rgba(0,0,0,.2);
}
.navlinks a::after{
  height:3px;
  box-shadow:0 0 22px rgba(67,215,196,.55), 0 0 12px rgba(122,167,255,.45);
}

@media (max-width: 1180px){
  .brand-logo-glow{height:74px}
  .hero-shell{grid-template-columns:minmax(0, 560px) 1fr}
  .hero-service-cards{grid-template-columns:1fr;max-width:380px}
}
@media (max-width: 980px){
  .hero-futuristic{min-height:auto;padding:56px 0 28px}
  .hero-shell{grid-template-columns:1fr}
  .hero-spacer{min-height:320px}
  .hero-bg-art{background-position:68% center}
  .hero-bg-art::after{background:linear-gradient(180deg, rgba(7,12,28,.88) 0%, rgba(7,12,28,.62) 30%, rgba(7,12,28,.46) 60%, rgba(7,12,28,.74) 100%)}
  .hero-copy-left h1{font-size:clamp(42px, 12vw, 72px);max-width:12ch}
}
@media (max-width: 680px){
  .brand-logo-glow{height:60px}
  .brand::after{width:120px}
  .hero-spacer{min-height:220px}
  .hero-grid-bg{height:54%;background-size:42px 42px, 42px 42px, 100% 100%}
  .hero-actions{flex-direction:column;align-items:stretch}
  .hero-actions .btn{width:100%}
}


/* Final user refinement: shield banner + brighter logo */
.brand-logo,
.brand-logo-glow{
  height:92px;
  width:auto;
  max-width:340px;
  object-fit:contain;
  filter:brightness(1.18) contrast(1.18) saturate(1.18) drop-shadow(0 0 10px rgba(93,234,255,.78)) drop-shadow(0 0 28px rgba(68,195,255,.55)) drop-shadow(0 10px 26px rgba(0,0,0,.34));
}
.brand::after{
  left:4px;
  bottom:-10px;
  width:230px;
  height:26px;
  background:radial-gradient(circle, rgba(85,232,255,.88) 0%, rgba(85,232,255,.28) 42%, transparent 74%);
  filter:blur(14px);
}
.hero-bg-art{
  background-image:none;
  opacity:1;
}
.hero-bg-art::after{
  background:
    linear-gradient(90deg, rgba(7,12,28,.98) 0%, rgba(7,12,28,.92) 18%, rgba(7,12,28,.80) 34%, rgba(7,12,28,.56) 52%, rgba(7,12,28,.32) 70%, rgba(7,12,28,.16) 100%),
    radial-gradient(1100px 560px at 18% 20%, rgba(56,112,255,.22), transparent 60%),
    radial-gradient(1000px 520px at 85% 15%, rgba(67,215,196,.14), transparent 60%);
}
.hero-shell{
  grid-template-columns:minmax(0, 620px) minmax(340px, 1fr);
  gap:36px;
}
.hero-visual-stage{
  position:relative;
  z-index:3;
  min-height:640px;
  display:flex;
  align-items:center;
  justify-content:flex-end;
}
.hero-visual-stage::before{
  content:"";
  position:absolute;
  inset:12% 4% 12% 14%;
  border-radius:36px;
  background:linear-gradient(180deg, rgba(24,58,118,.18), rgba(13,31,65,.12));
  border:1px solid rgba(108,202,255,.16);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05), 0 18px 60px rgba(0,0,0,.18);
  backdrop-filter:blur(6px);
}
.hero-visual-banner{
  position:relative;
  width:min(100%, 760px);
  height:clamp(420px, 48vw, 700px);
  margin-left:auto;
  background:url('../img/shield-grid-banner.png') right center / contain no-repeat;
  filter:drop-shadow(0 24px 46px rgba(0,0,0,.30)) drop-shadow(0 0 26px rgba(73,220,255,.12));
}
.hero-spacer{display:none !important;}
@media (max-width: 1200px){
  .hero-visual-stage{min-height:560px}
  .hero-visual-banner{height:clamp(360px, 46vw, 580px)}
}
@media (max-width: 980px){
  .brand-logo,
  .brand-logo-glow{height:72px; max-width:260px;}
  .hero-shell{grid-template-columns:1fr; gap:18px;}
  .hero-visual-stage{min-height:360px; justify-content:center;}
  .hero-visual-stage::before{inset:10% 2%}
  .hero-visual-banner{width:100%; max-width:520px; height:320px; background-position:center center;}
}


/* Final refinement v8: clean logo, improved tablet and mobile */
.brand,
.brand:hover,
.brand:focus-visible{
  text-decoration:none;
}
.brand::after{
  content:none !important;
}
.brand-logo,
.brand-logo-glow,
.brand:hover .brand-logo,
.brand:focus-visible .brand-logo{
  height:84px;
  width:auto;
  max-width:360px;
  object-fit:contain;
  filter:brightness(1.08) contrast(1.08) saturate(1.02) drop-shadow(0 10px 24px rgba(0,0,0,.26)) !important;
}
.brand-logo.small{
  height:50px;
  max-width:240px;
}
.nav{
  gap:18px;
}
.navlinks{
  gap:10px;
  flex-wrap:wrap;
}
.navlinks a{
  position:relative;
  padding:12px 16px;
  border-radius:14px;
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease, background .2s ease;
}
.navlinks a::after{
  content:"";
  position:absolute;
  left:14px;
  right:14px;
  bottom:7px;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(122,167,255,0), rgba(95,228,255,.95), rgba(67,215,196,0));
  opacity:0;
  transform:scaleX(.4);
  transition:opacity .22s ease, transform .22s ease;
}
.navlinks a:hover::after,
.navlinks a:focus-visible::after,
.navlinks a.active::after{
  opacity:1;
  transform:scaleX(1);
}
.navlinks a:hover,
.navlinks a:focus-visible,
.navlinks a.active{
  background:rgba(255,255,255,.05);
  border-color:rgba(95,228,255,.24);
  box-shadow:0 0 0 1px rgba(99,191,255,.12) inset, 0 8px 24px rgba(0,0,0,.18), 0 0 18px rgba(35,173,255,.12);
  transform:translateY(-1px);
}
.hero-shell{
  grid-template-columns:minmax(0, 620px) minmax(320px, 1fr);
  gap:42px;
}
.hero-copy-left{
  max-width:620px;
}
.hero-visual-stage{
  min-height:620px;
  align-items:center;
}
.hero-visual-stage::before{
  inset:11% 3% 11% 12%;
}
.hero-visual-banner{
  width:min(100%, 720px);
  height:clamp(430px, 46vw, 660px);
  background:url('../img/shield-grid-banner.png') right center / contain no-repeat;
}
.hero-copy-left .sub{
  max-width:34em;
}
.hero-service-cards{
  max-width:680px;
}
.mobile-toggle{
  display:none;
  font-size:24px;
}
.mobile-menu{
  display:none;
  padding:0 0 18px;
}
.mobile-menu.show{
  display:block;
}
.mobile-menu a{
  display:block;
  padding:14px 16px;
  border-radius:16px;
  border:1px solid rgba(232,238,252,.10);
  background:rgba(10,17,31,.88);
  margin-top:10px;
}
.mobile-menu .btn{
  width:100%;
}
@media (max-width: 1180px){
  .container{width:min(100% - 30px,var(--max));}
  .nav{gap:14px;}
  .navlinks{gap:6px;}
  .navlinks a{padding:11px 12px;font-size:14px;}
  .navcta .btn.small{padding:10px 12px;}
  .hero-shell{grid-template-columns:minmax(0, 1.02fr) minmax(360px, .98fr);gap:28px;}
  .hero-copy-left h1{font-size:clamp(48px, 6vw, 78px);}
  .hero-visual-stage{min-height:540px;}
  .hero-visual-stage::before{inset:10% 0 10% 8%;}
  .hero-visual-banner{height:clamp(360px, 40vw, 540px);}
}
@media (max-width: 980px){
  header{backdrop-filter:blur(14px);}
  .nav{padding:12px 0;align-items:center;}
  .navlinks,.navcta{display:none;}
  .mobile-toggle{display:inline-flex;align-items:center;justify-content:center;}
  .brand-logo,
  .brand-logo-glow{
    height:68px;
    max-width:250px;
  }
  .hero-futuristic{
    min-height:auto;
    padding:36px 0 26px;
  }
  .hero-shell{
    grid-template-columns:1fr;
    gap:18px;
  }
  .hero-copy-left{
    max-width:none;
    padding:0;
  }
  .pills{
    gap:8px;
    margin:8px 0 18px;
  }
  .pill{
    padding:8px 12px;
    font-size:12px;
  }
  .hero-copy-left h1{
    font-size:clamp(42px, 10vw, 68px);
    max-width:12ch;
    margin:10px 0 14px;
  }
  .hero-copy-left .sub{
    font-size:17px;
    max-width:none;
  }
  .hero-actions{
    gap:12px;
  }
  .hero-actions .btn{
    min-height:50px;
  }
  .hero-service-cards{
    grid-template-columns:repeat(3, minmax(0,1fr));
    gap:12px;
    max-width:none;
  }
  .hero-service-card{
    padding:16px 14px;
  }
  .hero-service-card strong{font-size:18px;}
  .hero-service-card span{font-size:13px;}
  .hero-visual-stage{
    min-height:unset;
    justify-content:center;
    padding:8px 0 0;
  }
  .hero-visual-stage::before{
    inset:4% 0;
    border-radius:28px;
  }
  .hero-visual-banner{
    width:min(100%, 620px);
    height:min(62vw, 400px);
    background-position:center center;
  }
}
@media (max-width: 760px){
  .container{width:min(100% - 22px,var(--max));}
  .brand-logo,
  .brand-logo-glow{
    height:60px;
    max-width:220px;
  }
  .hero-copy-left h1{
    font-size:clamp(38px, 12vw, 56px);
    max-width:11ch;
  }
  .hero-copy-left .sub{
    font-size:15.5px;
    line-height:1.65;
  }
  .hero-actions{
    flex-direction:column;
    align-items:stretch;
  }
  .hero-actions .btn{
    width:100%;
  }
  .hero-service-cards{
    grid-template-columns:1fr;
  }
  .hero-trust-row{
    gap:12px 18px;
    font-size:16px;
  }
  .hero-visual-banner{
    width:100%;
    height:58vw;
    min-height:260px;
    max-height:340px;
  }
  .footer-grid{
    grid-template-columns:1fr;
  }
}
@media (max-width: 480px){
  .nav{gap:10px;}
  .brand-logo,
  .brand-logo-glow{
    height:52px;
    max-width:186px;
  }
  .mobile-toggle{
    width:42px;
    height:42px;
    border-radius:12px;
  }
  .hero-futuristic{
    padding:28px 0 22px;
  }
  .hero-copy-left h1{
    font-size:clamp(34px, 12vw, 48px);
  }
  .pill{
    width:100%;
    justify-content:flex-start;
  }
  .hero-trust-row span{
    padding-left:14px;
  }
  .hero-visual-banner{
    min-height:230px;
    height:64vw;
  }
  .mobile-menu a{
    font-size:15px;
  }
}