
/* IKTech Enterprise V6.1 — Landing Page Perfection */
.site-header{
  transition:background .35s ease,border-color .35s ease,box-shadow .35s ease,transform .35s ease;
}
.site-header.is-scrolled{
  background:rgba(3,8,23,.82);
  border-color:rgba(82,135,202,.28);
  box-shadow:0 16px 50px rgba(0,0,0,.28);
}
.site-header.is-hidden{transform:translateY(-100%)}
.hero-v61{
  min-height:920px;
  isolation:isolate;
  overflow:hidden;
  background:
    linear-gradient(90deg,rgba(2,7,20,.97) 0%,rgba(2,7,20,.80) 42%,rgba(2,7,20,.18) 76%),
    url('/assets/img/hero-future.jpg') center/cover no-repeat;
}
.hero-v61 .hero-overlay{
  background:
    radial-gradient(circle at 74% 42%,rgba(29,100,255,.08),transparent 29%),
    linear-gradient(180deg,rgba(2,7,20,.02),rgba(2,7,20,.55));
}
.network-canvas{
  position:absolute;inset:0;width:100%;height:100%;z-index:0;opacity:.58;
}
.hero-grid{
  position:absolute;inset:0;z-index:0;
  background-image:
    linear-gradient(rgba(50,115,188,.07) 1px,transparent 1px),
    linear-gradient(90deg,rgba(50,115,188,.07) 1px,transparent 1px);
  background-size:72px 72px;
  mask-image:linear-gradient(to bottom,black,transparent 82%);
}
.hero-orb{position:absolute;border-radius:50%;filter:blur(1px);pointer-events:none;z-index:0}
.hero-orb-one{
  width:540px;height:540px;right:-160px;top:70px;
  background:radial-gradient(circle,rgba(34,211,238,.16),rgba(29,100,255,.05) 44%,transparent 70%);
  animation:orbFloat 10s ease-in-out infinite;
}
.hero-orb-two{
  width:420px;height:420px;left:32%;bottom:-220px;
  background:radial-gradient(circle,rgba(129,80,255,.16),transparent 68%);
  animation:orbFloat 13s ease-in-out infinite reverse;
}
@keyframes orbFloat{50%{transform:translate3d(20px,-22px,0) scale(1.04)}}
.hero-v61 .hero-content{
  grid-template-columns:.92fr 1.08fr;
  gap:55px;
  min-height:650px;
  padding-top:25px;
}
.hero-v61 .hero-copy{max-width:690px}
.hero-status{
  display:inline-flex;align-items:center;gap:10px;
  margin-bottom:22px;padding:8px 12px;
  border:1px solid rgba(91,150,219,.25);
  border-radius:999px;background:rgba(8,20,39,.58);
  backdrop-filter:blur(10px);
  color:#9fb5ce;font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
}
.status-dot{
  width:8px;height:8px;border-radius:50%;background:#32e6a1;
  box-shadow:0 0 0 5px rgba(50,230,161,.10),0 0 18px rgba(50,230,161,.7);
  animation:pulseDot 2s infinite;
}
@keyframes pulseDot{50%{box-shadow:0 0 0 9px rgba(50,230,161,0),0 0 23px rgba(50,230,161,.9)}}
.hero-v61 h1{
  font-size:clamp(56px,6vw,88px);
  line-height:.99;letter-spacing:-4px;max-width:760px;
}
.rotating-line{display:block;min-height:1.06em}
.gradient-text{
  background:linear-gradient(90deg,#55e8ff 0%,#2b83ff 48%,#9b63ff 100%);
  background-size:200% 100%;
  -webkit-background-clip:text;background-clip:text;color:transparent;
  animation:gradientShift 6s linear infinite;
}
@keyframes gradientShift{to{background-position:200% 0}}
#rotatingWord{display:inline-block;transition:opacity .25s ease,transform .25s ease}
#rotatingWord.swap{opacity:0;transform:translateY(10px)}
.hero-lead{font-size:18px;line-height:1.75;max-width:625px}
.hero-v61 .btn{gap:18px;position:relative;overflow:hidden;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}
.hero-v61 .btn:before{
  content:"";position:absolute;inset:-2px;
  background:linear-gradient(110deg,transparent 20%,rgba(255,255,255,.22) 45%,transparent 70%);
  transform:translateX(-120%);transition:transform .55s ease;
}
.hero-v61 .btn:hover:before{transform:translateX(120%)}
.hero-v61 .btn:hover{transform:translateY(-3px)}
.hero-v61 .primary:hover{box-shadow:0 18px 42px rgba(29,100,255,.42)}
.hero-v61 .secondary:hover{border-color:#4c78aa;background:rgba(10,27,52,.88)}
.hero-proof{display:flex;align-items:center;gap:14px;margin-top:33px;color:#94a8bf}
.proof-avatars{display:flex;padding-left:8px}
.proof-avatars span{
  width:34px;height:34px;border-radius:50%;display:grid;place-items:center;
  margin-left:-8px;background:linear-gradient(145deg,#102643,#091526);
  border:1px solid #315378;font-size:8px;font-weight:900;color:#84e6ff;
}
.hero-proof strong,.hero-proof small{display:block}
.hero-proof strong{font-size:12px;color:#d7e3ef}
.hero-proof small{font-size:10px;max-width:430px}
.hero-command{position:relative;z-index:3;perspective:1200px}
.command-window{
  min-height:500px;background:linear-gradient(180deg,rgba(10,25,49,.92),rgba(5,13,28,.95));
  border:1px solid rgba(75,135,204,.34);border-radius:20px;overflow:hidden;
  box-shadow:0 35px 90px rgba(0,0,0,.48),0 0 0 1px rgba(61,175,255,.04) inset,0 0 65px rgba(29,100,255,.10);
  transform:rotateY(-6deg) rotateX(2deg);
  transition:transform .35s ease;
}
.hero-command:hover .command-window{transform:rotateY(-2deg) rotateX(0)}
.command-top{
  height:46px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;
  padding:0 16px;background:rgba(10,22,42,.96);border-bottom:1px solid rgba(69,121,183,.22);
  color:#6482a3;font-size:9px;letter-spacing:.15em;
}
.command-top b{justify-self:end;color:#52e9b2;font-size:8px;border:1px solid rgba(82,233,178,.25);padding:4px 8px;border-radius:999px}
.window-dots{display:flex;gap:6px}.window-dots i{width:7px;height:7px;border-radius:50%;background:#2d4868}.window-dots i:nth-child(1){background:#ff6d7a}.window-dots i:nth-child(2){background:#ffcb64}.window-dots i:nth-child(3){background:#4fe0a2}
.command-body{display:grid;grid-template-columns:52px 1fr;min-height:454px}
.command-sidebar{padding:18px 12px;border-right:1px solid rgba(65,112,168,.18);display:flex;flex-direction:column;gap:14px}
.command-sidebar span{height:28px;border-radius:7px;background:#0e2440;border:1px solid transparent}
.command-sidebar span.active{background:linear-gradient(135deg,rgba(34,211,238,.22),rgba(29,100,255,.25));border-color:rgba(61,173,255,.35)}
.command-main{padding:25px}
.command-heading{display:flex;justify-content:space-between;align-items:center}
.command-heading small,.command-heading strong{display:block}.command-heading small{font-size:8px;color:#66829f;letter-spacing:.14em}.command-heading strong{font-size:25px;margin-top:4px}
.secure-ring{width:54px;height:54px;border-radius:50%;border:1px solid #1f4f78;display:grid;place-items:center;position:relative}
.secure-ring:before,.secure-ring:after{content:"";position:absolute;border-radius:50%;border:1px solid rgba(35,216,238,.26);inset:7px}.secure-ring:after{inset:15px}
.secure-ring i{width:8px;height:8px;border-radius:50%;background:#37e7a5;box-shadow:0 0 18px #37e7a5}
.metric-row{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:24px 0}
.metric-row>div{padding:14px;border-radius:12px;background:linear-gradient(180deg,rgba(17,42,73,.74),rgba(8,22,42,.72));border:1px solid rgba(58,103,160,.25)}
.metric-row small,.metric-row strong,.metric-row span{display:block}.metric-row small,.metric-row span{color:#6986a5;font-size:8px}.metric-row strong{font-size:22px;margin:4px 0}.metric-row div:nth-child(2) strong:after{content:"%"}
.command-chart{height:190px;border-radius:13px;background:linear-gradient(180deg,rgba(12,34,63,.72),rgba(6,17,34,.7));border:1px solid rgba(59,105,162,.22);padding:15px;overflow:hidden}
.chart-labels{display:flex;justify-content:space-between;color:#496785;font-size:7px}
.command-chart svg{width:100%;height:155px;overflow:visible}.chart-area{fill:url(#chartFill)}.chart-line{fill:none;stroke:url(#chartLine);stroke-width:4;stroke-linecap:round;stroke-dasharray:900;stroke-dashoffset:900;animation:drawLine 2.2s .5s ease forwards}.command-chart circle{fill:#22d3ee;filter:drop-shadow(0 0 8px #22d3ee)}
@keyframes drawLine{to{stroke-dashoffset:0}}
.command-events{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:13px}
.command-events div{display:grid;grid-template-columns:auto 1fr;gap:3px 8px;padding:10px;background:rgba(8,22,42,.78);border:1px solid rgba(55,99,153,.2);border-radius:10px}
.command-events i{grid-row:span 2;width:7px;height:7px;border-radius:50%;margin-top:4px}.command-events i.ok{background:#3be3a6;box-shadow:0 0 10px rgba(59,227,166,.7)}
.command-events span{font-size:8px;color:#7892ad}.command-events b{font-size:8px;color:#cbd8e6}
.floating-chip{
  position:absolute;display:flex;align-items:center;gap:10px;padding:11px 14px;
  background:rgba(7,18,37,.90);backdrop-filter:blur(15px);
  border:1px solid rgba(68,127,193,.34);border-radius:13px;
  box-shadow:0 18px 45px rgba(0,0,0,.32);animation:chipFloat 4.5s ease-in-out infinite;
}
.floating-chip>span{width:30px;height:30px;display:grid;place-items:center;border-radius:10px;background:linear-gradient(135deg,rgba(34,211,238,.22),rgba(29,100,255,.28));color:#5ee6ff}
.floating-chip small,.floating-chip strong{display:block}.floating-chip small{font-size:8px;color:#6d88a4}.floating-chip strong{font-size:11px}
.chip-one{left:-25px;top:76px}.chip-two{right:-20px;bottom:75px;animation-delay:-2s}
@keyframes chipFloat{50%{transform:translateY(-10px)}}
.stat-bar-v61{margin-top:5px;background:rgba(4,13,28,.72);box-shadow:0 25px 55px rgba(0,0,0,.22)}
.stat-bar-v61 strong{background:linear-gradient(90deg,#fff,#9edbff);-webkit-background-clip:text;background-clip:text;color:transparent}
.scroll-indicator{
  position:absolute;left:50%;bottom:22px;z-index:4;transform:translateX(-50%);
  display:flex;flex-direction:column;align-items:center;gap:6px;text-decoration:none;
  color:#617a98;font-size:8px;letter-spacing:.16em;text-transform:uppercase;
}
.scroll-indicator i{width:1px;height:34px;background:linear-gradient(#4bdcff,transparent);animation:scrollPulse 1.8s infinite}
@keyframes scrollPulse{50%{transform:scaleY(.45);transform-origin:top;opacity:.45}}
.landing-strip{overflow:hidden;background:#061122;border-top:1px solid rgba(69,119,181,.18);border-bottom:1px solid rgba(69,119,181,.18)}
.strip-track{width:max-content;display:flex;align-items:center;gap:28px;padding:13px 0;animation:tickerMove 28s linear infinite;color:#7187a2;font-size:9px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.strip-track i{width:5px;height:5px;border-radius:50%;background:#2bd7ef;box-shadow:0 0 10px rgba(43,215,239,.7)}
@keyframes tickerMove{to{transform:translateX(-45%)}}
.reveal{opacity:0;transform:translateY(26px);transition:opacity .75s ease,transform .75s cubic-bezier(.2,.75,.25,1)}
.reveal.active{opacity:1;transform:none}
.reveal-stagger>*{opacity:0;transform:translateY(25px);transition:opacity .65s ease,transform .65s ease}
.reveal-stagger.active>*{opacity:1;transform:none}
.reveal-stagger.active>*:nth-child(2){transition-delay:.08s}.reveal-stagger.active>*:nth-child(3){transition-delay:.16s}.reveal-stagger.active>*:nth-child(4){transition-delay:.24s}.reveal-stagger.active>*:nth-child(5){transition-delay:.32s}.reveal-stagger.active>*:nth-child(6){transition-delay:.40s}
.service-grid article,.project-card,.value-grid div{transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease}
.service-grid article:hover,.project-card:hover{transform:translateY(-8px);border-color:rgba(49,185,255,.48);box-shadow:0 25px 55px rgba(0,0,0,.28),0 0 38px rgba(29,100,255,.08)}
.value-grid div:hover{background:rgba(17,42,73,.4)}
@media(max-width:1100px){
  .hero-v61{min-height:980px}
  .hero-v61 .hero-content{grid-template-columns:1fr;padding-top:40px}
  .hero-command{max-width:760px;margin:0 auto;width:100%}
  .command-window{transform:none}
  .floating-chip{display:none}
}
@media(max-width:650px){
  .hero-v61{min-height:1080px;background-position:70% center}
  .hero-v61 .hero-content{gap:35px}
  .hero-v61 h1{font-size:47px;letter-spacing:-2.7px}
  .hero-status{font-size:8px}
  .hero-proof{align-items:flex-start}
  .command-window{min-height:auto;border-radius:15px}
  .command-body{grid-template-columns:38px 1fr;min-height:400px}
  .command-main{padding:15px}
  .command-sidebar{padding:14px 8px}
  .metric-row{gap:6px}.metric-row>div{padding:9px}.metric-row strong{font-size:17px}
  .command-events{grid-template-columns:1fr}
  .command-chart{height:150px}.command-chart svg{height:115px}
  .stat-bar-v61{margin-top:28px}
  .scroll-indicator{display:none}
}
@media(prefers-reduced-motion:reduce){
  *,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}
  .network-canvas{display:none}
  .reveal,.reveal-stagger>*{opacity:1!important;transform:none!important}
}
