* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: 'Poppins', sans-serif;
  font-style: normal;
  font-weight: 400;
}

html {
  scroll-behavior: smooth;
}

body {
  background: #fff;
  color: #1a1f2b;
  line-height: 1.6;
  padding-top: 70px;
}

.container {
  width: 90%;
  max-width: 1200px;
  margin: auto;
}

h1, h2 { font-weight: 500; }
h3, h4, h5 { font-weight: 500; }
p, li { font-weight: 400; }
strong, b { font-weight: 600; }

/* ---------- header/nav ---------- */
.site-header {
  background: #fff;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1000;
  height: 70px;
  border-bottom: 1px solid #eef0f4;
}

.header-grid {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

a.logo {
  padding: 20px 0;
}

.nav-toggle {
  display: none;
  background: none;
  border: none;
  color: #1a1f2b;
  font-size: 24px;
  cursor: pointer;
}

/* ---------- shared structure devices ---------- */
.kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #0066ff;
  margin-bottom: 18px;
}

.kicker::before {
  content: "";
  width: 18px;
  height: 2px;
  background: #0066ff;
  display: inline-block;
}

.kicker.on-dark {
  color: #7fb0ff;
}

.kicker.on-dark::before {
  background: #7fb0ff;
}

/* Shared positioning context so the sticky form can align with the hero snapshot card */
.page-shell {
  position: relative;
}

/* ---------- HERO ---------- */
.hero-apo {
  position: relative;
  background-image: linear-gradient(180deg, rgba(6, 12, 28, 0.55) 0%, rgba(6, 12, 28, 0.82) 100%), url("images/landingimage.webp");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  padding: 100px 0 110px;
  overflow: hidden;
  color: #fff;
}

.hero-grid {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 60px;
  position: relative;
  z-index: 2;
}

.hero-left {
  max-width: 640px;
}

.hero-apo h1 {
  font-size: 2.4rem;
  letter-spacing: -0.0625rem;
  font-weight: 500;
  line-height: 1.25;
  margin-bottom: 22px;
  color: #fff;
}

.hero-apo h1 .blue-light {
  color: #6ba3ff;
}

.hero-apo .subtitle {
  font-size: 1.05rem;
  color: #d6ddec;
  margin-bottom: 0;
  max-width: 560px;
}

.hero-right {
  flex: 0 0 380px;
}

/* Report snapshot card - hero signature element (replaces PEAK Matrix graphic) */
.snapshot-card {
  background: rgba(255, 255, 255, 0.07);
  border: 1px solid rgba(255, 255, 255, 0.18);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-radius: 18px;
  padding: 30px 32px;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.35);
}

.snapshot-eyebrow {
  font-size: 12px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: #9fb4d8;
  margin-bottom: 18px;
  font-weight: 600;
}

.snapshot-row {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 14px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.snapshot-row:first-of-type {
  padding-top: 0;
}

.snapshot-row:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.snapshot-label {
  font-size: 12px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: #9fb4d8;
}

.snapshot-value {
  font-size: 17px;
  font-weight: 500;
  color: #fff;
}

.snapshot-row.highlight .snapshot-value {
  color: #6ba3ff;
  font-weight: 600;
}

/* HERO BUTTON */
.discover-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 12px 22px;
  border: 2px solid #0f1a2b;
  border-radius: 50px;
  font-size: 17px;
  font-weight: 500;
  color: #0f1a2b;
  text-decoration: none;
  transition: all .25s ease;
  margin-top: 8px;
}

.discover-btn .arrow {
  font-size: 18px;
  color: #0f1a2b;
}

.discover-btn:hover {
  color: #0066ff;
  border-color: #0066ff;
}

.discover-btn:hover .arrow {
  color: #0066ff;
}

.hero-btn {
  margin-top: 30px;
  border: 2px solid #fff;
  color: #fff;
}

.hero-btn .arrow {
  color: #fff;
}

.hero-btn:hover {
  border-color: #6ba3ff;
  color: #6ba3ff;
}

.hero-btn:hover .arrow {
  color: #6ba3ff;
}

/* ---------- CONTENT SECTIONS ---------- */
.content-scroll-zone {
  position: relative;
}

.section-block {
  padding: 64px 0;
}

.section-block.alt-bg {
  background: #f6f8fc;
}

.section-inner {
  max-width: calc(100% - 440px);
}

.section-block h2 {
  font-size: 2rem;
  letter-spacing: -0.0625rem;
  line-height: 1.25;
  font-weight: 500;
  color: #0f1a2b;
  margin-bottom: 22px;
}

.section-block h2 .blue {
  color: #0066ff;
}

.section-block p.copy {
  font-size: 16px;
  color: #4b5563;
  margin-bottom: 18px;
  max-width: 640px;
}

.list-label {
  font-size: 15px;
  font-weight: 600;
  color: #0f1a2b;
  margin: 8px 0 16px;
}

/* Icon checklist - used for supporting capability/coverage lists */
.icon-list {
  list-style: none;
  margin: 0 0 8px;
  padding: 0;
  max-width: 640px;
}

.icon-list li {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 10px 0;
  color: #33394a;
  font-size: 15.5px;
  line-height: 1.55;
  border-bottom: 1px solid #edf0f5;
}

.icon-list li:last-child {
  border-bottom: none;
}

.icon-list li i {
  color: #0066ff;
  font-size: 15px;
  margin-top: 4px;
  flex-shrink: 0;
}

/* Callout box */
.callout {
  margin-top: 24px;
  max-width: 640px;
  background: #eef4ff;
  border-left: 3px solid #0066ff;
  border-radius: 8px;
  padding: 20px 24px;
  color: #24344d;
  font-size: 15.5px;
  line-height: 1.65;
}

/* Differentiator grid - signature element for "why Neutrinos" section */
.diff-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  max-width: 680px;
  margin: 28px 0 40px;
}

.diff-card {
  background: #fff;
  border: 1px solid #e8ecf3;
  border-radius: 14px;
  padding: 24px;
  transition: box-shadow .25s ease, transform .25s ease;
}

.diff-card:hover {
  box-shadow: 0 12px 30px rgba(15, 26, 43, 0.08);
  transform: translateY(-2px);
}

.diff-icon {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: #eef4ff;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 14px;
}

.diff-icon i {
  color: #0066ff;
  font-size: 16px;
}

.diff-card h4 {
  font-size: 16px;
  font-weight: 600;
  color: #0f1a2b;
  margin-bottom: 8px;
  line-height: 1.35;
}

.diff-card p {
  font-size: 14.5px;
  color: #5b6473;
  line-height: 1.55;
}

/* Quote card */
.quote-card {
  display: flex;
  gap: 22px;
  align-items: flex-start;
  background: #0b1428;
  padding: 32px;
  border-radius: 16px;
  max-width: 680px;
  color: #fff;
}

.quote-mark {
  font-size: 42px;
  line-height: 1;
  color: #6ba3ff;
  font-weight: 700;
  flex-shrink: 0;
  font-family: Georgia, serif;
}

.quote-card .quote {
  font-size: 17px;
  line-height: 1.6;
  color: #e7ecf5;
  margin-bottom: 16px;
}

.quote-avatar {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: #0066ff;
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  font-size: 14px;
  margin-right: 10px;
  flex-shrink: 0;
  vertical-align: middle;
}

.quote-attrib {
  display: flex;
  align-items: center;
}

.quote-name {
  font-weight: 600;
  color: #fff;
  font-size: 14.5px;
  display: block;
}

.quote-role {
  font-size: 13px;
  color: #9fb4d8;
}

/* ---------- FINAL CTA SECTION ---------- */
.cta-final {
  background: linear-gradient(135deg, #060c1c 0%, #0d1b3a 100%);
  color: #fff;
  padding: 72px 0;
  text-align: left;
}

.cta-final .section-inner {
  max-width: 640px;
}

.cta-final h2 {
  color: #fff;
  font-size: 2rem;
}

.cta-final p.copy {
  color: #cdd6e8;
}

.cta-final .discover-btn {
  border-color: #fff;
  color: #fff;
}

.cta-final .discover-btn .arrow {
  color: #fff;
}

.cta-final .discover-btn:hover {
  border-color: #6ba3ff;
  color: #6ba3ff;
}

.cta-final .discover-btn:hover .arrow {
  color: #6ba3ff;
}

/* ---------- STICKY FORM ---------- */
.form-wrapper.desktop-sticky {
  position: absolute;
  /* .container is width:90% capped at max-width:1200px, centered — so its
     right edge sits (100vw - containerWidth)/2 in from the browser edge.
     This matches that exact offset so the form's right edge lines up with
     the container's right edge (same edge the Report Snapshot card sits on),
     instead of sitting a fixed 30px from the browser edge. */
  right: max(5vw, calc(50vw - 600px));
  /* 100px matches hero-apo's top padding, so this box starts level with the
     Report Snapshot card in the hero rather than after it */
  top: 100px;
  bottom: 30px;
  width: 400px;
  pointer-events: none;
  z-index: 1000;
}

.form-wrapper.desktop-sticky .floating-form {
  position: sticky !important;
  top: 100px !important;
  pointer-events: auto !important;
  right: auto !important;
}

.floating-form {
  background: #fff;
  border-radius: 18px;
  padding: 2.1rem 2rem 2rem;
  box-shadow: 0 20px 55px rgba(15, 26, 43, 0.16);
  border-top: 4px solid #0066ff;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

.floating-form .form-kicker {
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: #0066ff;
  margin-bottom: 10px;
  display: block;
}

.floating-form h3 {
  text-align: left;
  font-size: 20px;
  font-weight: 700;
  color: #0f1a2b;
  margin: 0 0 1rem;
  letter-spacing: -0.2px;
}

.floating-form .hs-form-field {
  margin-bottom: 0.2rem !important;
}

.floating-form .hs-form label {
  display: block;
  font-size: 15px;
  font-weight: 550;
  color: #0f1a2b;
  margin-bottom: 0.9rem;
}

.floating-form .hs-input,
.floating-form .hs-form-field input[type="text"],
.floating-form .hs-form-field input[type="email"],
.floating-form .hs-form-field input[type="tel"],
.floating-form .hs-form-field select {
  width: 100% !important;
  border: none !important;
  border-bottom: 1px solid #d1d5db !important;
  background: transparent !important;
  font-size: 15px !important;
  color: #111 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  -webkit-appearance: none;
}

.floating-form .hs-input:focus,
.floating-form .hs-form-field input:focus,
.floating-form .hs-form-field select:focus {
  border-bottom-color: #0066ff !important;
  outline: none !important;
}

.floating-form .hs-form-field select {
  background: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%236B7280' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 8px center !important;
  background-size: 12px !important;
  padding-right: 28px !important;
  appearance: none !important;
}

.floating-form p,
.floating-form .hs-richtext,
.floating-form .hs-dependent-field,
.floating-form .hs-form .hs-richtext p {
  font-size: 12.5px !important;
  line-height: 1.5 !important;
  color: #6b7280 !important;
  text-align: left !important;
}

.floating-form .hs-button.primary,
.floating-form input[type="submit"],
.floating-form .hs-form .hs-submit input {
  width: 100% !important;
  background: linear-gradient(90deg, #0066ff, #3d8bff) !important;
  border: none !important;
  color: #fff !important;
  font-size: 15.5px !important;
  font-weight: 600 !important;
  padding: 14px 24px !important;
  border-radius: 9px !important;
  cursor: pointer !important;
  transition: filter 0.2s ease !important;
  text-transform: none !important;
  box-shadow: 0 10px 24px rgba(0, 102, 255, 0.28) !important;
  margin-top: 8px;
}

.floating-form .hs-button.primary:hover,
.floating-form input[type="submit"]:hover {
  filter: brightness(1.08);
}

/* Highlight pulse when a "Get the report" CTA scrolls the form into view */
.floating-form.form-highlight {
  animation: formHighlightPulse 1.5s ease;
}

@keyframes formHighlightPulse {
  0% {
    box-shadow: 0 0 0 0 rgba(0, 102, 255, 0.55), 0 20px 55px rgba(15, 26, 43, 0.16);
  }
  55% {
    box-shadow: 0 0 0 16px rgba(0, 102, 255, 0), 0 20px 55px rgba(15, 26, 43, 0.16);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(0, 102, 255, 0), 0 20px 55px rgba(15, 26, 43, 0.16);
  }
}

/* ---------- DISCLAIMER ---------- */
.disclaimer-section {
  background: #f9f9f9;
  padding: 40px 20px;
  border-top: 1px solid #ddd;
}

.disclaimer-section .container {
  font-size: 12px;
  color: #666;
  line-height: 1.6;
  text-align: left;
}

.disclaimer-section a {
  color: #0066ff;
}

/* ---------- FOOTER ---------- */
.site-footer {
  background: #fff;
  border-top: 1px solid #e5e5e5;
  padding: 30px 0;
  font-family: 'Poppins', sans-serif;
}

.footer-wrapper {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 40px;
}

.footer-desc {
  font-size: 14px;
  line-height: 1.6;
  color: #555;
  margin: 18px 0 20px;
  max-width: 300px;
}

.footer-social {
  display: flex;
  gap: 15px;
}

.footer-social a {
  color: #999;
  font-size: 16px;
  transition: 0.3s;
}

.footer-social a:hover {
  color: #0066ff;
}

.footer-links {
  font-size: 14px;
  margin-top: 16px;
}

.footer-links a {
  color: #555;
  text-decoration: none;
  margin-right: 5px;
}

.footer-links a:hover {
  color: #0066ff;
}

/* ---------- RESPONSIVE ---------- */
@media (max-width: 1100px) {
  .form-wrapper.desktop-sticky {
    position: relative;
    right: auto;
    top: auto;
    bottom: auto;
    width: 100%;
    pointer-events: auto;
  }

  .form-wrapper.desktop-sticky .floating-form {
    position: static !important;
    margin: 20px auto 0 !important;
    max-width: 460px;
  }

  .section-inner,
  .cta-final .section-inner {
    max-width: 100%;
  }
}

@media (max-width: 1024px) {
  .container { width: 94%; }

  .hero-grid {
    flex-direction: column;
    text-align: left;
    gap: 44px;
  }

  .hero-left { max-width: 100%; }
  .hero-right { flex: 0 0 auto; width: 100%; max-width: 420px; }
}

@media (max-width: 768px) {
  body { padding-top: 65px; }

  .hero-apo { padding: 56px 0 48px; }
  .hero-apo h1 { font-size: 1.9rem; }
  .hero-apo .subtitle { font-size: 1rem; }

  .section-block { padding: 48px 0; }
  .section-block h2, .cta-final h2 { font-size: 1.7rem; }

  .diff-grid {
    grid-template-columns: 1fr;
  }

  .quote-card {
    flex-direction: column;
  }

  .nav-toggle { display: block; }
}

@media (max-width: 480px) {
  .hero-apo h1 { font-size: 1.6rem; }
  .floating-form { padding: 28px 22px; }
  .floating-form h3 { font-size: 19px; }
  .discover-btn { font-size: 15px; }
  .snapshot-card { padding: 24px 22px; }
}