/* ============================================================
   home.css — homepage-specific styles
   ============================================================ */

/* ===================== HERO ===================== */
.hero { position: relative; height: 100vh; min-height: 640px; overflow: hidden; }
.hero-swiper, .hero-swiper .swiper-wrapper, .hero-slide { height: 100%; }

.hero-slide { position: relative; display: flex; align-items: center; overflow: hidden; }

.hero-slide__bg {
  position: absolute; inset: 0;
  background-size: cover; background-position: center;
  transform: scale(1.06);
  transition: transform 7s ease-out;
}
.hero-slide.is-active .hero-slide__bg { transform: scale(1.16); } /* cinematic zoom */

/* CSS-generated cinematic backgrounds (drop a photo into background-image to override) */
.hero-slide--infra .hero-slide__bg {
  background-image:
    radial-gradient(90% 80% at 75% 30%, rgba(141,198,63,.16), transparent 60%),
    radial-gradient(60% 60% at 20% 80%, rgba(40,120,180,.18), transparent 60%),
    linear-gradient(120deg, #060a12, #0a1320 60%, #05080e);
}
.hero-slide--security .hero-slide__bg {
  background-image:
    radial-gradient(70% 70% at 30% 35%, rgba(141,198,63,.14), transparent 55%),
    radial-gradient(80% 90% at 80% 70%, rgba(200,40,60,.16), transparent 60%),
    linear-gradient(135deg, #07060a, #120a10 55%, #05080e);
}
.hero-slide--cloud .hero-slide__bg {
  background-image:
    radial-gradient(80% 80% at 70% 35%, rgba(44,160,200,.22), transparent 60%),
    radial-gradient(60% 70% at 25% 75%, rgba(141,198,63,.14), transparent 60%),
    linear-gradient(125deg, #04080e, #08141f 55%, #05080e);
}

/* Digital grid + node texture overlay on every slide */
.hero-slide__overlay {
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px);
  background-size: 56px 56px;
  -webkit-mask-image: radial-gradient(ellipse 70% 80% at 60% 50%, #000, transparent 75%);
          mask-image: radial-gradient(ellipse 70% 80% at 60% 50%, #000, transparent 75%);
}
.hero-slide::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(90deg, rgba(5,8,14,.92) 0%, rgba(5,8,14,.55) 45%, rgba(5,8,14,.25) 100%);
  pointer-events: none;
}

.hero-slide__content { position: relative; z-index: 2; max-width: 760px; }
.hero-slide__content .eyebrow { margin-bottom: 1.4rem; }
.hero-slide__content .h-display { margin-bottom: 1.4rem; text-wrap: balance; }
.hero-slide__content .lead { max-width: 54ch; margin-bottom: 2.2rem; }
.hero-actions { display: flex; gap: 1rem; flex-wrap: wrap; }

/* Text intro animation per active slide */
.hero-slide [data-hero] { opacity: 0; transform: translateY(28px); }
.hero-slide.is-active [data-hero] { animation: heroIn .9s var(--ease) forwards; }
.hero-slide.is-active [data-hero="eyebrow"] { animation-delay: .15s; }
.hero-slide.is-active [data-hero="title"]   { animation-delay: .3s; }
.hero-slide.is-active [data-hero="sub"]      { animation-delay: .48s; }
.hero-slide.is-active [data-hero="actions"]  { animation-delay: .64s; }
@keyframes heroIn { to { opacity: 1; transform: none; } }

/* Hero controls */
.hero-controls {
  position: absolute; left: 0; right: 0; bottom: clamp(28px, 5vh, 48px); z-index: 5;
  display: flex; align-items: center; gap: 1.4rem;
}
.hero-prev, .hero-next {
  width: 46px; height: 46px; border: 1px solid var(--line-2); border-radius: 50%;
  display: grid; place-items: center; color: var(--white);
  transition: border-color .25s, color .25s, background .25s;
}
.hero-prev svg, .hero-next svg { width: 20px; height: 20px; }
.hero-prev:hover, .hero-next:hover { border-color: var(--green); color: var(--green); }
.hero-pagination { display: flex; gap: .55rem; align-items: center; }
.hero-pagination .swiper-pagination-bullet {
  width: 30px; height: 3px; border-radius: 2px; background: rgba(255,255,255,.25);
  opacity: 1; transition: background .3s, width .3s; cursor: pointer;
}
.hero-pagination .swiper-pagination-bullet-active { background: var(--green); width: 48px; box-shadow: 0 0 10px var(--green-glow); }

.hero-scroll {
  position: absolute; right: clamp(20px, 5vw, 64px); bottom: clamp(28px, 5vh, 48px); z-index: 5;
  display: flex; flex-direction: column; align-items: center; gap: .8rem;
  font-size: .64rem; letter-spacing: .3em; color: var(--mute);
}
.hero-scroll__line { width: 1px; height: 40px; background: linear-gradient(var(--green), transparent); position: relative; overflow: hidden; }
.hero-scroll__line::after { content: ""; position: absolute; top: -40px; left: 0; width: 1px; height: 40px; background: var(--green); animation: scrollPulse 2s ease-in-out infinite; }
@keyframes scrollPulse { 0% { top: -40px; } 60%,100% { top: 40px; } }
@media (max-width: 700px) { .hero-scroll { display: none; } }

/* ===================== INTRO ===================== */
.intro-grid { display: grid; grid-template-columns: 1.05fr 1fr; gap: clamp(2.5rem, 6vw, 6rem); align-items: center; }
.intro-lead .h1 { margin: 1.1rem 0 1.4rem; text-wrap: balance; }
.intro-lead .lead { margin-bottom: 1.8rem; }

/* word-split spans */
[data-split] .word { display: inline-block; overflow: hidden; vertical-align: top; }
[data-split] .word__i { display: inline-block; }

.intro-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.pillar { padding: 1.6rem; display: flex; flex-direction: column; gap: .7rem; transition: transform .4s var(--ease), border-color .4s; }
.pillar:hover { transform: translateY(-4px); border-color: var(--line-2); }
.pillar__tag { font-size: .68rem; letter-spacing: .2em; color: var(--green); }
.pillar p { font-size: .92rem; color: var(--mute); }
.pillar--accent { background: linear-gradient(150deg, rgba(141,198,63,.14), rgba(141,198,63,.02)); border-color: rgba(141,198,63,.3); }
.pillar__stat { font-family: var(--display); font-weight: 700; font-size: 2.6rem; color: var(--white); line-height: 1; }
@media (max-width: 920px) { .intro-grid { grid-template-columns: 1fr; } }
@media (max-width: 460px) { .intro-cards { grid-template-columns: 1fr; } }

/* ===================== WHY CHOOSE ===================== */
.section--why { background: var(--ink-2); border-block: 1px solid var(--line); }
.why-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.1rem; }
.why-card { padding: 2rem 1.8rem; position: relative; overflow: hidden; transition: transform .4s var(--ease), border-color .4s; }
.why-card::before { content: ""; position: absolute; inset: 0; background: radial-gradient(120% 80% at 0% 0%, rgba(141,198,63,.1), transparent 55%); opacity: 0; transition: opacity .4s; }
.why-card:hover { transform: translateY(-6px); border-color: rgba(141,198,63,.35); }
.why-card:hover::before { opacity: 1; }
.why-card__icon { width: 52px; height: 52px; border-radius: 12px; display: grid; place-items: center; background: rgba(141,198,63,.1); border: 1px solid rgba(141,198,63,.25); margin-bottom: 1.3rem; }
.why-card__icon svg { width: 26px; height: 26px; color: var(--green); }
.why-card h3 { margin-bottom: .6rem; }
.why-card h3 [data-count] { color: var(--green); }
.why-card p { font-size: .94rem; }
@media (max-width: 900px) { .why-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .why-grid { grid-template-columns: 1fr; } }

/* ===================== SERVICES ===================== */
.services-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 2rem; flex-wrap: wrap; margin-bottom: clamp(2.5rem, 5vw, 3.5rem); }
.services-head .section-head { margin-bottom: 0; }
.svc-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.1rem; }
.svc-card { padding: 2rem 1.8rem; position: relative; display: flex; flex-direction: column; gap: .7rem; transition: transform .4s var(--ease), border-color .4s, background .4s; }
.svc-card__num { font-size: .8rem; color: var(--green); letter-spacing: .1em; }
.svc-card h3 { font-size: 1.25rem; }
.svc-card p { font-size: .92rem; }
.svc-card__go { position: absolute; top: 1.6rem; right: 1.8rem; font-size: 1.3rem; color: var(--mute-2); transition: transform .35s var(--ease), color .35s; }
.svc-card:hover { transform: translateY(-6px); border-color: rgba(141,198,63,.35); background: var(--panel-2); }
.svc-card:hover .svc-card__go { color: var(--green); transform: translate(4px, -4px); }
@media (max-width: 900px) { .svc-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .svc-grid { grid-template-columns: 1fr; } }

/* ===================== INDUSTRIES ===================== */
.section--industries { background: var(--ink-2); border-block: 1px solid var(--line); }
.industries { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.industry { display: flex; align-items: center; gap: 1rem; padding: 1.8rem 2rem; background: var(--ink); font-family: var(--display); font-size: 1.3rem; font-weight: 500; transition: background .3s, color .3s; }
.industry__dot { width: 8px; height: 8px; border-radius: 50%; background: var(--green); box-shadow: 0 0 10px var(--green); flex-shrink: 0; transition: transform .3s; }
.industry:hover { background: var(--charcoal); }
.industry:hover .industry__dot { transform: scale(1.5); }
@media (max-width: 760px) { .industries { grid-template-columns: 1fr 1fr; } }
@media (max-width: 460px) { .industries { grid-template-columns: 1fr; } .industry { font-size: 1.1rem; padding: 1.4rem 1.6rem; } }

/* ===================== AFFILIATIONS PREVIEW ===================== */
.affil-grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: clamp(2.5rem, 6vw, 5rem); align-items: center; }
.affil-copy .h2 { margin: 1rem 0 1.2rem; max-width: 18ch; }
.affil-copy .lead { margin-bottom: 1.6rem; }
.affil-flags { display: grid; gap: .6rem; }
.affil-flags li { display: flex; align-items: center; gap: 1.2rem; padding: 1.1rem 1.4rem; border: 1px solid var(--line); border-radius: var(--radius-sm); font-family: var(--display); font-size: 1.15rem; transition: border-color .3s, transform .3s, background .3s; }
.affil-flags li:hover { border-color: rgba(141,198,63,.35); transform: translateX(6px); background: var(--panel); }
.affil-flags .mono { font-size: .82rem; color: var(--green); letter-spacing: .12em; background: rgba(141,198,63,.1); border: 1px solid rgba(141,198,63,.25); padding: .4em .7em; border-radius: 6px; min-width: 46px; text-align: center; }
@media (max-width: 860px) { .affil-grid { grid-template-columns: 1fr; } }