.home-hero { position: relative; min-height: 780px; width: 100%; margin: 0 0 2vw; overflow: hidden; color: var(--ink); display: grid; grid-template-columns: 43% 57%; align-items: center; background: #d9e1d6; }
.hero-slides { position: absolute; inset: 0 0 0 43%; }
.hero-slide { position: absolute; inset: 0; }
.hero-slide { opacity: 0; transform: scale(1.035); background-position: center; background-size: cover; animation: heroCycle 30s infinite; }
.hero-slide-1 { background-image: url('https://images.unsplash.com/photo-1486406146926-c627a92ad1ab?auto=format&fit=crop&w=2200&q=88'); animation-delay: 0s; }
.hero-slide-2 { background-image: url('https://images.unsplash.com/photo-1509391366360-2e959784a276?auto=format&fit=crop&w=2200&q=88'); animation-delay: 6s; }
.hero-slide-3 { background-image: url('https://images.unsplash.com/photo-1500530855697-b586d89ba3ee?auto=format&fit=crop&w=2200&q=88'); animation-delay: 12s; }
.hero-slide-4 { background-image: url('https://images.unsplash.com/photo-1625246333195-78d9c38ad449?auto=format&fit=crop&w=2200&q=88'); animation-delay: 18s; }
.hero-slide-5 { background-image: url('https://images.unsplash.com/photo-1508514177221-188b1cf16e9d?auto=format&fit=crop&w=2200&q=88'); animation-delay: 24s; }
.hero-shade { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(15,12,18,.35), transparent 48%); z-index: 1; pointer-events: none; clip-path: inset(0 0 0 43%); }
.hero-content { position: absolute; z-index: 2; inset: 0 auto 0 0; width: 50%; padding: 5vw; display: flex; flex-direction: column; justify-content: center; background: #d9e1d6; clip-path: polygon(0 0,82% 0,100% 50%,82% 100%,0 100%); }
.hero-content h1 {max-width: 760px; margin: 24px 0 24px; letter-spacing: -.06em; font-family:var(--display);font-size:var(--type-h1);font-weight:600;line-height:.94;}
.hero-subtitle { max-width: 650px; margin: 0 0 16px; font: 500 clamp(17px, 1.35vw, 21px)/1.42 var(--display); letter-spacing: -.02em; }
.hero-body { max-width: 620px; margin: 0; color: #55535a; font-size: 14px; line-height: 1.62; }
.hero-actions { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; margin-top: 35px; }
.hero-primary { background: var(--violet); border-color: var(--violet); color: #fff; }
.hero-primary:hover { background: #2d185e; border-color: #2d185e; color: #fff; }
.hero-secondary { border-color: rgba(23,21,28,.55); color: var(--ink); }
.hero-secondary:hover { background: rgba(255,255,255,.35); border-color: var(--ink); color: var(--ink); }
.hero-meta { position: absolute; z-index: 2; left: 53%; right: 3vw; bottom: 26px; display: flex; align-items: center; justify-content: space-between; font-size: 9px; letter-spacing: .14em; text-transform: uppercase; color: rgba(255,255,255,.78); }
.hero-progress { display: flex; gap: 7px; }
.hero-progress i { width: 34px; height: 2px; overflow: hidden; background: rgba(255,255,255,.32); }
.hero-progress i::after { content: ''; display: block; width: 100%; height: 100%; background: #d8cfee; transform: scaleX(0); transform-origin: left; animation: progressCycle 30s infinite; }
.hero-progress i:nth-child(2)::after { animation-delay: 6s; }.hero-progress i:nth-child(3)::after { animation-delay: 12s; }.hero-progress i:nth-child(4)::after { animation-delay: 18s; }.hero-progress i:nth-child(5)::after { animation-delay: 24s; }
@keyframes heroCycle { 0% { opacity: 0; transform: scale(1.035); } 3%, 20% { opacity: 1; } 23%, 100% { opacity: 0; transform: scale(1); } }
@keyframes progressCycle { 0% { transform: scaleX(0); } 3%, 20% { transform: scaleX(1); } 23%, 100% { transform: scaleX(0); } }
@media (prefers-reduced-motion: reduce) { .hero-slide { animation: none; } .hero-slide:first-child { opacity: 1; } .hero-progress i::after { animation: none; } }
@media (max-width: 800px) { .home-hero { min-height: 980px; display: block; margin: 0 0 18px; } .hero-slides { inset: auto 0 0; height: 43%; } .hero-content { width: 100%; height: 62%; padding: 58px 7vw 90px; justify-content: flex-start; clip-path: polygon(0 0,100% 0,100% 88%,50% 100%,0 88%); } .hero-content h1 { font-family:var(--display);font-size:var(--type-h1);font-weight:600;line-height:.94;} .hero-body { font-size: 13px; } .hero-actions { flex-direction: column; align-items: stretch; max-width: 390px; } .hero-actions .btn { text-align: center; } .hero-meta { left: 7vw; right: 7vw; bottom: 22px; } .hero-meta > span { display: none; } .hero-shade { inset: auto 0 0; height: 43%; clip-path: none; background: linear-gradient(0deg, rgba(15,12,18,.4), transparent); } }

/* Homepage-only typography and height trial. */
.home-page .home-hero { min-height: 540px; margin-bottom: 0; }
.home-page .home-hero .hero-content { padding-top: 18px; padding-bottom: 18px; }
.home-page .home-hero .hero-content h1 {max-width: 690px; margin: 20px 0; letter-spacing: -.045em; font-family:var(--display);font-size:var(--type-h1);font-weight:600;line-height:.94;}
.home-page .home-hero .hero-subtitle { margin-bottom: 13px; font-family: "Geist", sans-serif; font-size: clamp(17px,1.25vw,20px); }
.home-page .home-hero .hero-actions { margin-top: 27px; }
.home-page .home-hero .hero-actions .btn { font-size: 13.5px; line-height: 14px; }
@media (max-width: 800px) { .home-page .home-hero { min-height: 760px; } .home-page .home-hero .hero-content { padding-top: 28px; padding-bottom: 38px; } .home-page .home-hero .hero-content h1 { font-family:var(--display);font-size:var(--type-h1);font-weight:600;line-height:.94;} }

/* Homepage-only type hierarchy trial. */
.home-page .home-hero .hero-content h1 { font-family:var(--display);font-size:var(--type-h1);font-weight:600;line-height:.94;}
.home-page .problem-content h2,
.home-page .challenge-section h2,
.home-page .lxc-intro h2,
.home-page .aws-content h2,
.home-page .applications-head h2,
.home-page .final-cta-content h2 {letter-spacing: -.052em; font-family:var(--display);font-size:var(--type-h2);font-weight:600;line-height:.98;}
.home-page .final-cta-content h2 { font-family:var(--display);font-size:var(--type-h2);font-weight:600;line-height:.98;}
.home-page .why-heading h2::before {letter-spacing: -.058em; font-family:var(--display);font-size:var(--type-h2);font-weight:600;line-height:.98;}
.home-page .approach-steps h3,
.home-page .application-content h3,
.home-page .why-capabilities h3 {letter-spacing: -.032em; font-family:var(--display);font-size:var(--type-h3);font-weight:600;line-height:1.16;}
.home-page .approach-steps h3 { font-family:var(--display);font-size:var(--type-h3);font-weight:600;line-height:1.16;}
.home-page .application-content h3 { font-family:var(--display);font-size:var(--type-h3);font-weight:600;line-height:1.16;}
.home-page .why-capabilities h3 { font-family:var(--display);font-size:var(--type-h3);font-weight:600;line-height:1.16;}
@media (max-width: 800px) {
  .home-page .home-hero .hero-content h1 { font-family:var(--display);font-size:var(--type-h1);font-weight:600;line-height:.94;}
  .home-page .problem-content h2,
  .home-page .challenge-section h2,
  .home-page .lxc-intro h2,
  .home-page .aws-content h2,
  .home-page .applications-head h2,
  .home-page .final-cta-content h2 { font-family:var(--display);font-size:var(--type-h2);font-weight:600;line-height:.98;}
  .home-page .why-heading h2::before { font-family:var(--display);font-size:var(--type-h2);font-weight:600;line-height:.98;}
}

/* Homepage hero image set supplied by the client. */
.home-page .hero-slides { background: #687078 url('assets/hero-industry.webp') 53% 48%/cover no-repeat; }
.home-page .hero-slide { transform: none; animation-name: homeHeroCycle; animation-duration: 24s; animation-timing-function: linear; will-change: opacity; backface-visibility: hidden; }
.home-page .hero-slide-1 { background-image: url('assets/hero-industry.webp'); background-position: 53% 48%; animation-delay: 0s; }
.home-page .hero-slide-2 { background-image: url('assets/home-hero-logistics.webp'); background-position: 52% 50%; animation-delay: 6s; }
.home-page .hero-slide-3 { background-image: url('assets/home-hero-port.webp'); background-position: 52% 54%; animation-delay: 12s; }
.home-page .hero-slide-4 { background-image: url('assets/home-hero-water-treatment.webp'); background-position: 52% 50%; animation-delay: 18s; }
.home-page .hero-progress i::after { animation-name: homeProgressCycle; animation-duration: 24s; }
@keyframes homeHeroCycle { 0%{opacity:0} 4%,25%{opacity:1} 29%,100%{opacity:0} }
@keyframes homeProgressCycle { 0%{transform:scaleX(0)} 4%,25%{transform:scaleX(1)} 29%,100%{transform:scaleX(0)} }

/* Approved compact spacing system — homepage only. */
.home-page .problem-section { min-height: 0; align-items: stretch; padding-top: 34px; padding-bottom: 40px; }
.home-page .problem-visual { align-self: stretch; height: auto; min-height: 0; margin: 0 0 0 2vw; }
.home-page .problem-content { justify-content: flex-start; padding-top: 0; padding-bottom: 0; }
.home-page .problem-content h2,
.home-page .challenge-section h2,
.home-page .lxc-intro h2,
.home-page .aws-content h2,
.home-page .applications-head h2 {margin-top: 24px; margin-bottom: 19px; font-family:var(--display);font-size:var(--type-h2);font-weight:600;line-height:.98;}
.home-page .problem-subtitle,
.home-page .lxc-subtitle,
.home-page .aws-subtitle { margin-bottom: 30px; }
.home-page .problem-copy .problem-pivot { margin-top: 22px; margin-bottom: 22px; }
.home-page .challenge-section { padding-top: 60px; padding-bottom: 60px; }
.home-page .approach-steps article { padding-top: 16px; padding-bottom: 16px; }
.home-page .approach-steps h3 {margin-bottom: 7px; font-family:var(--display);font-size:var(--type-h3);font-weight:600;line-height:1.16;}
.home-page .approach-steps p { max-width: 520px; font-size: 14px; line-height: 1.52; }
.home-page .approach-steps article {
  position: relative;
  isolation: isolate;
  padding-right: 22px;
  transition: padding-left .28s ease, border-color .28s ease;
}
.home-page .approach-steps article::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 5px 0;
  background: rgba(109, 79, 159, .08);
  transform: scaleX(0);
  transform-origin: right;
  transition: transform .32s cubic-bezier(.22,.61,.36,1);
}
.home-page .approach-steps article span,
.home-page .approach-steps article h3 {transition: color .25s ease, transform .28s ease; font-family:var(--display);font-size:var(--type-h3);font-weight:600;line-height:1.16;}
.home-page .approach-steps article:hover,
.home-page .approach-steps article:focus-within { padding-left: 12px; border-color: rgba(61,35,124,.45); }
.home-page .approach-steps article:hover::before,
.home-page .approach-steps article:focus-within::before { transform: scaleX(1); transform-origin: left; }
.home-page .approach-steps article:hover span,
.home-page .approach-steps article:focus-within span { color: #3d237c; transform: translateX(2px); }
.home-page .approach-steps article:hover h3,
.home-page .approach-steps article:focus-within h3 {color: #3d237c; transform: translateX(3px); font-family:var(--display);font-size:var(--type-h3);font-weight:600;line-height:1.16;}
@media (prefers-reduced-motion: reduce) {
  .home-page .approach-steps article,
  .home-page .approach-steps article::before,
  .home-page .approach-steps article span,
  .home-page .approach-steps article h3 {transition: none; font-family:var(--display);font-size:var(--type-h3);font-weight:600;line-height:1.16;}
}
.home-page .home-lxc { min-height: 620px; gap: 4vw; padding-top: 54px; padding-bottom: 54px; }
.home-page .lxc-visual { width: min(440px,36vw); }
.home-page .lxc-subtitle { margin-bottom: 22px; }
.home-page .lxc-actions { margin-top: 20px; }
.home-page .lxc-visual-note { margin-top: 26px; }
.home-page .home-aws { min-height: 700px; padding-top: 78px; padding-bottom: 78px; }
.home-page .aws-canvas { width: min(560px,42vw); }
.home-page .aws-cta { margin-top: 28px; }
.home-page .applications-section { padding-top: 58px; padding-bottom: 58px; }
.home-page .carousel-controls { margin-top: 34px; }
.home-page .application-image { height: 310px; }
.home-page .application-content { min-height: 250px; padding-top: 22px; padding-bottom: 22px; }
.home-page .why-section { grid-template-columns: .72fr 1.28fr; min-height: 620px; }
.home-page .why-heading,
.home-page .why-detail { padding-top: 54px; padding-bottom: 54px; }
.home-page .why-heading h2 {margin-top: 25px; margin-bottom: 20px; font-family:var(--display);font-size:var(--type-h2);font-weight:600;line-height:.98;}
.home-page .why-capabilities { margin-top: 36px; }
.home-page .why-capabilities article { min-height: 124px; }
.home-page .final-cta,
.home-page .final-cta-image { min-height: 620px; }
.home-page .final-cta-content { padding-top: 72px; padding-bottom: 72px; }
.home-page .final-cta-content h2 {margin-top: 25px; margin-bottom: 22px; font-family:var(--display);font-size:var(--type-h2);font-weight:600;line-height:.98;}
.home-page .final-cta-actions { margin-top: 28px; }
@media (max-width: 800px) {
  .home-page .problem-content,
  .home-page .challenge-section,
  .home-page .home-lxc,
  .home-page .home-aws,
  .home-page .applications-section,
  .home-page .why-heading,
  .home-page .why-detail,
  .home-page .final-cta-content { padding-top: 64px; padding-bottom: 64px; }
  .home-page .applications-section { padding-top: 52px; padding-bottom: 52px; }
  .home-page .carousel-controls { margin-top: 30px; }
  .home-page .problem-section { padding-top: 28px; padding-bottom: 48px; }
  .home-page .problem-visual { width: auto; height: 340px; min-height: 0; margin: 0 7vw; }
  .home-page .problem-content { padding-top: 48px; padding-bottom: 0; }
  .home-page .home-lxc { min-height: 0; padding-top: 52px; padding-bottom: 52px; }
  .home-page .lxc-visual { margin-top: 34px; }
  .home-page .why-section { grid-template-columns: 1fr; }
  .home-page .why-heading,
  .home-page .why-detail { padding-top: 52px; padding-bottom: 52px; }
  .home-page .lxc-visual,
  .home-page .aws-canvas { width: min(520px,86vw); }
}
@media (min-width: 801px) and (max-width: 1050px) {
  .home-page .home-lxc { padding-top: 54px; padding-bottom: 54px; }
  .home-page .lxc-visual { width: min(460px,78vw); margin-top: 36px; }
}
