/* Bright indigo visual direction inspired by the supplied references. */
:root {
  --ref-ink: #20243a;
  --ref-copy: #626981;
  --ref-blue: #5368dc;
  --ref-blue-dark: #304493;
  --ref-blue-deep: #253777;
  --ref-lilac: #eef0ff;
  --ref-cloud: #f8f9ff;
  --ref-border: #e6e9f5;
  --ref-shadow: 0 18px 45px rgba(48, 68, 147, .12);
}

body { background: #fff; color: var(--ref-ink); }
body::before { opacity: .012; }
.site-header { background: rgba(5,16,32,.97); border-bottom-color: rgba(108,170,255,.15); }
.site-header.scrolled,.site-header.nav-open { background: rgba(5,16,32,.98); border-color: rgba(108,170,255,.18); box-shadow: 0 8px 28px rgba(4,12,27,.22); }
.brand { display: flex; align-items: center; width: 245px; height: 76px; overflow: hidden; }
.brand img { width: 245px; height: auto; object-fit: contain; }
.site-nav { color: #d8e1ef; }
.site-header .button-outline { color: #fff; border-color: rgba(110,169,240,.45); background: rgba(255,255,255,.03); }
.site-nav>a:not(.button)::after { background: var(--ref-blue); }
.button { border-radius: 3px; }
.button-primary { background: linear-gradient(135deg,#6579e6,#4c61d2); box-shadow: 0 12px 28px rgba(83,104,220,.28); }
.button-primary:hover { box-shadow: 0 15px 34px rgba(83,104,220,.38); }
.button-outline { border-color: #cfd5eb; color: #303851; background: #fff; }

/* Full-bleed image hero with left-aligned overlay copy. */
.hero { min-height: 900px; padding: 84px 0 0; background: #0b1833; }
.hero::after { z-index: 1; background: linear-gradient(90deg,rgba(7,18,42,.98) 0%,rgba(12,28,57,.92) 34%,rgba(9,23,50,.48) 59%,rgba(8,20,43,.12) 100%); mask-image: none; }
.hero-grid.container { width: 100%; max-width: none; min-height: 720px; display: block; padding-inline: max(32px,calc((100vw - 1200px)/2)); }
.hero-copy { position: relative; z-index: 5; display: flex; min-height: 720px; width: min(49%,650px); flex-direction: column; justify-content: center; color: #fff; }
.hero-copy h1 { color: #fff; }
.hero-copy h1 em { color: #a9c93e; }
.hero-lead { color: #d7deed; }
.hero-visual { position: absolute; z-index: 0; inset: 0; max-width: none; margin: 0; overflow: hidden; }
.hero-visual>img { width: 100%; height: 100%; max-width: none; margin: 0; object-fit: cover; object-position: 55% center; filter: none; mix-blend-mode: normal; transform: scale(1.03); }
.visual-glow { display: none; }
.status-chip { z-index: 4; background: rgba(15,31,62,.74); border-color: rgba(160,181,239,.35); color: #fff; }
.chip-one { left: 58%; top: 28%; }
.chip-two { right: 10%; bottom: 20%; }
.hero-proof { z-index: 5; margin-top: 0; color: #fff; border-color: rgba(255,255,255,.18); }
.hero-proof p,.hero-proof div { color: rgba(255,255,255,.65); }
.trust-row { color: #c7d0e2; }
.trust-row i,.status-chip i { background: #b0ce45; box-shadow: 0 0 10px #b0ce45; }

.section { padding: 110px 0; }
.kicker,.eyebrow { color: var(--ref-blue); }
.section-heading h2,.split-heading h2,.benefit-intro h2,.contact-panel h2 { color: var(--ref-ink); }
.section-heading h2 span,.split-heading h2 span,.benefit-intro h2 span,.contact-panel h2 span { color: var(--ref-blue); }
.section-heading>p:last-child,.split-heading>p,.benefit-intro>p,.contact-panel>div>p { color: var(--ref-copy); }

.challenges { background: #fff; }
.surface-card,.value-card,.feature-card { border: 1px solid var(--ref-border); background: #fff; box-shadow: var(--ref-shadow); }
.surface-card::before,.feature-card::before { display: none; }
.surface-card:hover,.value-card:hover,.feature-card:hover { border-color: #cbd2f6; box-shadow: 0 23px 55px rgba(48,68,147,.17); }
.surface-card h3,.value-card h3,.feature-card h3 { color: var(--ref-ink); }
.surface-card p,.value-card p,.feature-card p { color: var(--ref-copy); }
.card-index,.feature-card>span { color: #aeb5cb; }
.challenge-grid .surface-card:nth-child(3) { color: #fff; border-color: var(--ref-blue); background: linear-gradient(155deg,#6174df,#5064d4); }
.challenge-grid .surface-card:nth-child(3) h3,.challenge-grid .surface-card:nth-child(3) p,.challenge-grid .surface-card:nth-child(3) .card-index { color: #fff; }
.challenge-grid .surface-card:nth-child(3) .line-icon { color: #fff; border-color: rgba(255,255,255,.4); background: rgba(255,255,255,.1); }
.statement { border-color: var(--ref-border); color: var(--ref-ink); }
.official-shield { position: relative; display: block; flex: 0 0 auto; overflow: visible; background: transparent; aspect-ratio: 420 / 470; clip-path: none !important; }
.official-shield img { position: static; display: block; width: 100%; height: auto; max-width: none; object-fit: contain; filter: none !important; opacity: 1; mix-blend-mode: normal; clip-path: none !important; }
.statement-mark { width: 90px; height: auto; }
.card-shield { width: 72px; height: auto; margin-bottom: 38px; }
.core-shield { width: 72px; height: auto; margin-bottom: 13px; }

.why { background: var(--ref-cloud); }
.value-card { box-shadow: 0 14px 35px rgba(48,68,147,.09); }
.value-grid .value-card:nth-child(n) { background: #fff; }
.value-card a,.text-link { color: var(--ref-blue-dark); }
.value-card a span,.text-link span { color: var(--ref-blue); }

.coverage { background: #fff; }
.coverage-map { border-color: var(--ref-border); background: radial-gradient(circle at 50% 50%,rgba(83,104,220,.12),transparent 31%),linear-gradient(rgba(83,104,220,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(83,104,220,.045) 1px,transparent 1px); background-size:auto,45px 45px,45px 45px; box-shadow: inset 0 0 80px rgba(83,104,220,.04); }
.connections path { stroke: var(--ref-blue); filter: drop-shadow(0 0 4px rgba(83,104,220,.5)); }
.core { border-color: rgba(83,104,220,.35); background: #fff; box-shadow: 0 18px 50px rgba(48,68,147,.2); }
.core b,.node b { color: var(--ref-ink); }
.node { border-color: var(--ref-border); background: #fff; box-shadow: 0 12px 26px rgba(48,68,147,.1); }
.core small,.node small { color: #8189a1; }

/* Indigo feature band echoes the large blue panel in the references. */
.workflow { background: var(--ref-blue-dark); }
.workflow .kicker { color: #cbd3ff; }
.workflow .split-heading h2,.workflow .split-heading h2 span { color: #fff; }
.workflow .split-heading>p { color: #c8d0ec; }
.workflow-line::before { background: rgba(255,255,255,.3); }
.workflow-line li { border-left-color: rgba(255,255,255,.16); }
.workflow-line li>span { color: #aeb9e1; }
.workflow-icon,.workflow-line li:nth-child(n) .workflow-icon { color: #fff; border-color: rgba(255,255,255,.3); background: rgba(255,255,255,.08); }
.workflow-line h3 { color: #fff; }
.workflow-line p { color: #c5cde8; }

.features { background: #fff; }
.feature-grid .feature-card { border-top-width: 1px; }
.feature-grid .feature-card:nth-child(3) { color: #fff; border-color: var(--ref-blue); background: linear-gradient(155deg,#6174df,#5064d4); }
.feature-grid .feature-card:nth-child(3) h3,.feature-grid .feature-card:nth-child(3) p,.feature-grid .feature-card:nth-child(3)>span { color: #fff; }

.benefits { background: var(--ref-cloud); }
.benefit-panel { border: 0; background: var(--ref-blue-dark); box-shadow: var(--ref-shadow); }
.benefit-intro h2,.benefit-intro h2 span { color: #fff; }
.benefit-intro>p { color: #cbd3ec; }
.benefit-intro .kicker { color: #cbd3ff; }
.benefit-intro .text-link { color: #fff; }
.benefit-list { border-left-color: rgba(255,255,255,.16); }
.benefit-list article { border-bottom-color: rgba(255,255,255,.14); }
.benefit-list h3 { color: #fff; }
.benefit-list p { color: #c4cde7; }

.security-section { background: #fff; }
.security-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 18px; }
.security-card { position: relative; padding: 34px 30px; border: 1px solid var(--ref-border); border-top: 3px solid var(--ref-blue); background: #fff; box-shadow: var(--ref-shadow); }
.security-card:nth-child(2) { border-top-color: #21aeb0; }
.security-card:nth-child(3) { border-top-color: #dda21f; }
.security-card:nth-child(4) { border-top-color: #765fc3; }
.security-card>span { color: #a9b0c5; font-size: 11px; font-weight: 700; }
.security-card h3 { margin: 34px 0 22px; color: var(--ref-ink); font-size: 18px; }
.security-card ul { margin: 0; padding: 0; list-style: none; }
.security-card li { position: relative; padding: 7px 0 7px 20px; color: var(--ref-copy); font-size: 13px; }
.security-card li::before { content: "✓"; position: absolute; left: 0; color: var(--ref-blue); font-weight: 700; }
.standards-strip { display: flex; align-items: center; justify-content: space-between; gap: 22px; margin-top: 22px; padding: 25px 30px; color: #fff; background: var(--ref-blue-dark); }
.standards-strip span { color: #bfc9ed; font-size: 10px; text-transform: uppercase; letter-spacing: .14em; }
.standards-strip strong { font: 600 13px Poppins,sans-serif; }

/* Content remains readable when scripts are unavailable or blocked. */
.reveal { opacity: 1; transform: none; }

.contact { background: var(--ref-cloud); }
.contact-panel { border: 0; background: linear-gradient(135deg,#6579df,#5064cf); box-shadow: var(--ref-shadow); }
.contact-panel h2,.contact-panel h2 span { color: #fff; }
.contact-panel>div>p { color: #dbe0f6; }
.contact-panel .kicker { color: #e7eaff; }
.contact-panel .button-primary { background: #fff; color: var(--ref-blue-dark); box-shadow: none; }
.contact-panel .button-ghost { color: #fff; border-color: rgba(255,255,255,.45); }
.contact-panel address { border-left-color: rgba(255,255,255,.25); }
.contact-panel address div { border-bottom-color: rgba(255,255,255,.2); }
.contact-panel address span { color: #c9d0ee; }
.contact-panel address a,.contact-panel address p { color: #fff; }

.site-footer { background: var(--ref-blue-deep); }
.footer-main { grid-template-columns: 2fr repeat(3,.6fr); gap: 55px; }
.footer-main a,.footer-brand p { color: #c7cfea; }
.footer-brand strong { color: #fff; }
.footer-bottom { border-color: rgba(255,255,255,.14); color: #aab5dc; }

@media(max-width:1024px) {
  .hero { min-height: 820px; }
  .hero-grid.container,.hero-copy { min-height: 650px; }
  .hero-copy { width: 58%; }
  .hero-visual { margin: 0; }
  .hero-visual>img { width: 100%; margin: 0; object-position: 60% center; }
  .security-grid { grid-template-columns: repeat(2,1fr); }
}

@media(max-width:780px) {
  .site-nav { background: rgba(5,16,32,.99); color: #fff; }
  .menu-toggle { color: #fff; }
  .brand { width: 205px; }
  .brand img { width: 205px; }
  .hero { min-height: 760px; padding-top: 72px; }
  .hero::after { background: linear-gradient(90deg,rgba(7,18,42,.98),rgba(8,22,48,.78)); }
  .hero-grid.container,.hero-copy { min-height: 600px; }
  .hero-copy { width: 82%; }
  .hero-visual>img { object-position: 64% center; opacity: .62; transform: scale(1.08); }
  .hero-proof { display: none; }
  .section { padding: 82px 0; }
  .benefit-list { border-left: 0; border-top: 1px solid rgba(255,255,255,.16); }
  .contact-panel address { border-top-color: rgba(255,255,255,.25); }
  .standards-strip { align-items: flex-start; flex-direction: column; }
}

@media(max-width:480px) {
  .hero-copy { width: 100%; }
  .hero-visual>img { object-position: 68% center; opacity: .48; }
  .security-grid { grid-template-columns: 1fr; }
}
