/* ==========================================================================
   pages/home.css
   ========================================================================== */
.hero {
  position: relative; overflow: hidden; isolation: isolate; color: #fff;
  background: var(--grad-hero);
  padding: calc(var(--header-h) + 80px) 0 clamp(70px, 8vw, 110px);
  min-height: 100vh; display: flex; align-items: center;
}
.hero > .container { width: 100%; }
.hero-eyebrow {
  display: inline-flex; align-items: center; gap: 10px; padding: 8px 16px 8px 12px; margin-bottom: 26px;
  font: 600 .78rem/1 var(--font-head); letter-spacing: .14em; text-transform: uppercase; color: var(--b-cyan);
  background: rgba(103,232,249,.08); border: 1px solid rgba(103,232,249,.25); border-radius: 999px;
}
.hero-title { font-size: clamp(2.5rem, 5.8vw, 4.7rem); line-height: 1.06; color: #fff; margin-bottom: 22px; }
.hero-title .t-line { display: block; }
.hero-sub { font: 600 clamp(1.1rem, 1.7vw, 1.4rem)/1.4 var(--font-head); color: #E6EEFB; margin-bottom: 14px; }
.hero-text { max-width: 600px; font-size: 1.06rem; color: #A9BDDD; margin-bottom: 34px; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 14px; }

.hero-services { margin-top: 44px; padding-top: 26px; border-top: 1px solid rgba(255,255,255,.1); }
.hs-label { display: block; margin-bottom: 14px; font: 600 .72rem/1 var(--font-head); letter-spacing: .16em; text-transform: uppercase; color: #7F93B6; }
.hero-services ul { display: flex; flex-wrap: wrap; gap: 9px; list-style: none; margin: 0; padding: 0; }
.hero-services a {
  display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 999px;
  font-size: .82rem; font-weight: 500; color: #CFE0F7; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.1);
  transition: background .3s, border-color .3s, transform .3s var(--ease), color .3s;
}
.hero-services a i { color: var(--b-cyan); font-size: .78rem; }
.hero-services a:hover { color: #fff; background: rgba(8,124,240,.3); border-color: var(--b-cyan); transform: translateY(-3px); }

/* Hero visual */
.hero-visual { position: relative; padding: 24px; }
.hero-card {
  position: relative; overflow: hidden; border-radius: var(--radius-lg);
  border: 1px solid rgba(103,232,249,.3); box-shadow: var(--glow), 0 40px 90px rgba(2,8,24,.6);
  animation: cardFloat 7s ease-in-out infinite; transform-origin: center;
}
.hero-card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(135deg, rgba(255,255,255,.1), transparent 40%); pointer-events: none; }
.hero-card img { display: block; width: 100%; }
@keyframes cardFloat { 0%,100% { transform: translateY(0) rotate(-1deg); } 50% { transform: translateY(-14px) rotate(1deg); } }
.float-chip {
  position: absolute; display: inline-flex; align-items: center; gap: 9px; padding: 10px 16px;
  font: 600 .8rem/1 var(--font-head); color: #fff; white-space: nowrap;
  background: rgba(10,20,44,.82); border: 1px solid rgba(103,232,249,.3); border-radius: 999px;
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); box-shadow: 0 14px 34px rgba(2,8,24,.5);
  animation: chipFloat 6s ease-in-out infinite;
}
.float-chip i { color: var(--b-cyan); }
.chip-1 { top: 0; left: -4px; }
.chip-2 { top: 22%; right: -10px; animation-delay: -1.5s; }
.chip-3 { bottom: 20%; left: -18px; animation-delay: -3s; }
.chip-4 { bottom: 0; right: 6px; animation-delay: -4.5s; }
@keyframes chipFloat { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }

/* Ticker */
.ticker { overflow: hidden; background: #060D20; border-top: 1px solid rgba(103,232,249,.15); border-bottom: 1px solid rgba(103,232,249,.15); padding: 18px 0; }
.ticker-track { display: flex; width: max-content; gap: 56px; animation: tick 38s linear infinite; }
.ticker span { display: inline-flex; align-items: center; gap: 12px; white-space: nowrap; font: 600 .95rem/1 var(--font-head); letter-spacing: .06em; text-transform: uppercase; color: #8FA6CA; }
.ticker i { color: var(--b-blue); }
@keyframes tick { to { transform: translateX(-50%); } }
.ticker:hover .ticker-track { animation-play-state: paused; }

/* Intro tiles */
.intro-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
.intro-tile { padding: 28px 24px; background: #fff; border: 1px solid var(--b-line); border-radius: var(--radius); box-shadow: var(--shadow-sm); transition: transform .5s var(--ease), box-shadow .5s var(--ease); }
.intro-tile:nth-child(even) { translate: 0 26px; }
.intro-tile:hover { box-shadow: var(--shadow); }
.intro-tile i { display: grid; place-items: center; width: 50px; height: 50px; margin-bottom: 16px; border-radius: 14px; color: #fff; font-size: 1.1rem; background: var(--grad-primary); }
.intro-tile h3 { font-size: 1.05rem; margin-bottom: 6px; }
.intro-tile p { margin: 0; font-size: .9rem; }

/* Why choose */
.why { background: linear-gradient(180deg, #0B1730, #08112A); }

/* Industries chips */
.industry-chips { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; list-style: none; margin: 0; padding: 0; }
.industry-chips li {
  display: flex; align-items: center; gap: 14px; padding: 18px 20px; background: #fff; border: 1px solid var(--b-line); border-radius: var(--radius-sm);
  font: 600 .92rem/1.3 var(--font-head); color: var(--b-navy); box-shadow: var(--shadow-sm);
  transition: transform .4s var(--ease), border-color .3s, box-shadow .4s;
}
.industry-chips li:hover { transform: translateY(-5px); border-color: rgba(8,124,240,.45); box-shadow: var(--shadow); }
.industry-chips i { flex-shrink: 0; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; font-size: 1rem; color: var(--b-blue); background: rgba(8,124,240,.1); }

/* Process (short) */
.process-short { position: relative; display: grid; grid-template-columns: repeat(5, 1fr); gap: 22px; list-style: none; margin: 0; padding: 0; counter-reset: ps; }
.process-short::before { content: ""; position: absolute; top: 58px; left: 10%; right: 10%; height: 2px; background: repeating-linear-gradient(90deg, rgba(8,124,240,.4) 0 8px, transparent 8px 16px); }
.process-short li { position: relative; text-align: center; padding: 0 6px; }
.ps-num { display: block; margin-bottom: 10px; font: 700 .78rem/1 var(--font-head); letter-spacing: .14em; color: var(--b-blue); }
.ps-icon { position: relative; z-index: 1; display: grid; place-items: center; width: 76px; height: 76px; margin: 0 auto 22px; border-radius: 50%; font-size: 1.5rem; color: #fff; background: var(--grad-primary); box-shadow: 0 0 0 8px #EAF1FB, 0 14px 30px rgba(8,124,240,.35); transition: transform .5s var(--ease); }
.process-short li:hover .ps-icon { transform: scale(1.1) rotate(-6deg); }
.process-short h3 { font-size: 1.05rem; margin-bottom: 8px; }
.process-short p { font-size: .9rem; margin: 0; }
