:root{
  --bg:#EAF2FF;
  --bg-gradient:linear-gradient(180deg, #DCEBFF 0%, #9CC3F5 14%, #4C82D6 32%, #2456A6 50%, #17407F 68%, #0E2B5C 86%, #081B3D 100%);
  --surface:#F0F5FB;
  --surface-2:#E6EDF6;
  --ink:#0F172A;
  --muted:#57606F;
  --muted-2:#8992A3;
  --line:rgba(15,23,42,0.12);
  --line-strong:rgba(15,23,42,0.24);
  --accent:#123B67;
  --accent-bright:#1457D9;
  --accent-bright-2:#0E44B0;
  --accent-cyan:#8fe0d2;
  --hero-bg:#07111F;
  --max:1180px;
  --radius-sm:10px;
  --radius-md:16px;
  --radius-lg:24px;
}
*{box-sizing:border-box;}
body{-webkit-user-select:none;-moz-user-select:none;user-select:none;}
input,textarea,select{-webkit-user-select:text;-moz-user-select:text;user-select:text;}
html{scroll-behavior:smooth;}
html.snap-scroll{ scroll-snap-type:y proximity; }
@media (prefers-reduced-motion: reduce){ html.snap-scroll{ scroll-snap-type:none; } }
body{
  margin:0;
  background:var(--bg-gradient) var(--bg);
  color:var(--ink);
  font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%; display:block;}
a{color:inherit;}
.container{ max-width:var(--max); margin:0 auto; padding:0 7vw; }
@media (min-width:1400px){ .container{ padding:0 40px; } }

/* ===== Scroll progress bar ===== */
.scroll-progress{
  position:fixed;
  top:0; left:0;
  height:3px;
  width:0%;
  background:var(--accent-bright);
  z-index:200;
  transition:width .05s linear;
}

/* ===== Background schematic (parallax grid) ===== */
.bg-grid{
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background-image:
    linear-gradient(rgba(20,87,217,0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(20,87,217,0.05) 1px, transparent 1px);
  background-size:56px 56px;
  background-position:0 0;
  opacity:0.7;
  will-change:transform;
}
.bg-grid-shine{
  position:fixed;
  z-index:-1;
  pointer-events:none;
  opacity:0;
}
.bg-grid-shine-h{
  left:0; right:0; top:24%; height:1px;
  background:linear-gradient(90deg, transparent, rgba(124,172,255,.55), transparent);
  animation:shineH 10s ease-in-out infinite;
}
.bg-grid-shine-v{
  top:0; bottom:0; left:68%; width:1px;
  background:linear-gradient(180deg, transparent, rgba(124,172,255,.5), transparent);
  animation:shineV 13s ease-in-out 4s infinite;
}
@keyframes shineH{ 0%,91%{ opacity:0; } 94%{ opacity:.6; } 100%{ opacity:0; } }
@keyframes shineV{ 0%,90%{ opacity:0; } 93%{ opacity:.5; } 100%{ opacity:0; } }
@media (prefers-reduced-motion: reduce){ .bg-grid-shine{ display:none; } }

/* ===== Immersive interaction layer ===== */
.ambient-cursor{
  position:fixed;
  left:0; top:0;
  width:440px; height:440px;
  margin:-220px 0 0 -220px;
  border-radius:50%;
  pointer-events:none;
  z-index:0;
  opacity:.3;
  background:radial-gradient(circle, rgba(50,137,255,.14) 0, rgba(53,224,181,.045) 34%, transparent 70%);
  transform:translate3d(var(--cursor-x, 50vw), var(--cursor-y, 50vh), 0);
  transition:opacity .3s ease;
  will-change:transform;
}
.section-rail{
  position:fixed;
  right:18px; top:50%;
  width:2px; height:112px;
  transform:translateY(-50%);
  background:rgba(124,172,255,.2);
  border-radius:2px;
  z-index:80;
  overflow:hidden;
}
.section-rail-fill{
  position:absolute; inset:0;
  background:linear-gradient(#7cacff,#35e0b5);
  transform:scaleY(var(--page-progress,0));
  transform-origin:top;
  box-shadow:0 0 12px #35e0b5;
}
[data-tilt]{
  --rx:0deg; --ry:0deg;
  transform:perspective(1000px) rotateX(var(--rx)) rotateY(var(--ry)) translateZ(0);
  transform-style:preserve-3d;
  transition:transform .35s cubic-bezier(.16,1,.3,1), box-shadow .35s ease;
  will-change:transform;
}
[data-tilt]:hover{ box-shadow:0 30px 70px -28px rgba(8,35,71,.4), inset 0 1px 0 rgba(255,255,255,.9); }

/* Live security topology: meaningful motion instead of a placeholder block */
.media-slot.security-orbit{
  position:relative;
  min-height:360px;
  overflow:hidden;
  border:1px solid rgba(20,87,217,.18);
  border-radius:var(--radius-lg);
  background:linear-gradient(145deg,rgba(7,17,31,.97),rgba(18,59,103,.94));
  box-shadow:0 34px 80px -38px rgba(7,17,31,.75);
}
.orbit-grid{ position:absolute; inset:0; opacity:.22; background-image:linear-gradient(rgba(124,172,255,.22) 1px,transparent 1px),linear-gradient(90deg,rgba(124,172,255,.22) 1px,transparent 1px); background-size:34px 34px; transform:perspective(400px) rotateX(58deg) scale(1.55) translateY(25%); }
.orbit-ring{ position:absolute; left:50%; top:48%; border:1px solid rgba(124,172,255,.34); border-radius:50%; transform:translate(-50%,-50%); }
.orbit-ring-a{ width:230px;height:230px; animation:orbitPulse 4s ease-in-out infinite; }
.orbit-ring-b{ width:145px;height:145px; border-style:dashed; animation:orbitSpin 18s linear infinite; }
.orbit-core{ position:absolute; left:50%;top:48%; width:72px;height:72px; transform:translate(-50%,-50%); border-radius:18px; border:1px solid rgba(53,224,181,.55); display:grid;place-items:center; background:rgba(53,224,181,.08); box-shadow:0 0 45px rgba(53,224,181,.2); }
.orbit-core span{ width:18px;height:18px;border-radius:50%;background:#35e0b5;box-shadow:0 0 20px #35e0b5; animation:coreBeat 2s ease-in-out infinite; }
.orbit-node{ position:absolute;width:9px;height:9px;border-radius:50%;background:#7cacff;box-shadow:0 0 14px #7cacff; }
.node-a{left:19%;top:27%;}.node-b{right:17%;top:38%;}.node-c{left:29%;bottom:22%;}
.orbit-node::after{ content:"";position:absolute;inset:-7px;border:1px solid rgba(124,172,255,.38);border-radius:50%;animation:nodePing 2.8s ease-out infinite; }
.orbit-status{position:absolute;left:24px;bottom:22px;display:flex;flex-direction:column;color:#fff;}
.orbit-status span{font:10px ui-monospace,Menlo,monospace;letter-spacing:.18em;color:#35e0b5;margin-bottom:5px}.orbit-status b{font-size:13px;font-weight:500;color:rgba(255,255,255,.74)}
.orbit-scan{position:absolute;inset:-35% 0 auto;height:35%;background:linear-gradient(transparent,rgba(53,224,181,.12),transparent);animation:scanLine 5s linear infinite;}
@keyframes orbitPulse{50%{transform:translate(-50%,-50%) scale(1.08);opacity:.62}}
@keyframes orbitSpin{to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes coreBeat{50%{transform:scale(.72);opacity:.72}}
@keyframes nodePing{to{transform:scale(2.3);opacity:0}}
@keyframes scanLine{to{transform:translateY(470%)}}
@media (max-width:760px){ .media-slot.security-orbit{ min-height:260px; } .orbit-ring-a{ width:170px;height:170px; } .orbit-ring-b{ width:108px;height:108px; } }

@media (max-width:800px){
  .ambient-cursor,.section-rail{display:none}
  [data-tilt]{transform:none!important}
  .security-orbit{min-height:300px}
}

/* ===== Ambient light blobs (give the glass panels something to refract) ===== */
.bg-orb{
  position:fixed;
  z-index:0;
  pointer-events:none;
  border-radius:50%;
  filter:blur(90px);
  opacity:0.4;
}
.bg-orb-1{ width:560px; height:560px; top:-140px; right:-120px; background:radial-gradient(circle, rgba(20,87,217,0.55), transparent 70%); }
.bg-orb-2{ width:620px; height:620px; bottom:6%; left:-180px; background:radial-gradient(circle, rgba(18,59,103,0.45), transparent 70%); }
.bg-orb-3{ width:440px; height:440px; top:58%; right:6%; background:radial-gradient(circle, rgba(124,172,255,0.4), transparent 70%); }
@media (max-width:800px){ .bg-orb{ opacity:0.28; } }

/* ===== Film grain (subtle tactile texture, sits above everything) ===== */
.bg-noise{
  position:fixed;
  inset:0;
  z-index:150;
  pointer-events:none;
  opacity:0.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ===== Cards — refined "liquid glass": frosted, layered, specular top edge ===== */
.glass, .content-card{
  position:relative;
  background:rgba(255,255,255,0.64);
  backdrop-filter:blur(14px) saturate(150%);
  -webkit-backdrop-filter:blur(14px) saturate(150%);
  border:1px solid rgba(15,23,42,0.08);
  border-radius:var(--radius-md);
  box-shadow:
    0 1px 1px rgba(15,23,42,0.03),
    0 20px 44px -16px rgba(15,23,42,0.16),
    inset 0 1px 0 rgba(255,255,255,0.85);
}
.content-card{ padding:34px 32px; }

/* ===== Reveal-on-scroll ===== */
.reveal-up{
  opacity:0;
  transform:translateY(28px);
  transition:opacity .6s cubic-bezier(.16,1,.3,1), transform .6s cubic-bezier(.16,1,.3,1);
}
.reveal-up.in-view{ opacity:1; transform:translateY(0); }
@media (prefers-reduced-motion: reduce){
  .reveal-up{ opacity:1; transform:none; transition:none; }
}

/* ===== Nav ===== */
.site-nav{
  position:sticky;
  top:0;
  z-index:50;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:18px max(7vw,calc((100vw - var(--max))/2));
  background:rgba(255,255,255,0.55);
  backdrop-filter:blur(12px) saturate(150%);
  -webkit-backdrop-filter:blur(12px) saturate(150%);
  border-bottom:1px solid rgba(15,23,42,0.06);
  box-shadow:none;
  transition:background .3s ease, backdrop-filter .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.site-nav.scrolled{
  background:rgba(255,255,255,0.78);
  backdrop-filter:blur(16px) saturate(160%);
  -webkit-backdrop-filter:blur(16px) saturate(160%);
  border-bottom-color:rgba(15,23,42,0.08);
  box-shadow:0 1px 0 rgba(255,255,255,0.7) inset, 0 12px 32px -18px rgba(15,23,42,0.28);
}
.site-nav .wordmark{
  display:inline-flex;
  align-items:center;
  gap:9px;
  font-weight:700;
  font-size:18px;
  letter-spacing:.01em;
  text-decoration:none;
  color:var(--ink);
}
.site-nav .wordmark span{ color:var(--accent-bright); font-weight:400; }
.wordmark-logo{ width:40px; height:auto; flex-shrink:0; display:block; }
.nav-links{
  display:flex;
  align-items:center;
  gap:28px;
  list-style:none;
  margin:0;
  padding:0;
}
.nav-links a{
  position:relative;
  font-size:14px;
  text-decoration:none;
  color:var(--muted);
  transition:color .15s ease;
}
.nav-links a::after{
  content:"";
  position:absolute;
  left:0; right:100%;
  bottom:-4px;
  height:2px;
  background:linear-gradient(90deg, var(--accent-bright), #35E0B5);
  transition:right .25s cubic-bezier(.16,1,.3,1);
}
.nav-links a:hover, .nav-links a[aria-current="page"]{ color:var(--ink); }
.nav-links a:hover::after, .nav-links a[aria-current="page"]::after{ right:0; }
.nav-links a.nav-cta::after{ display:none; }
.nav-cta{
  font-size:13.5px;
  font-weight:600;
  padding:10px 20px;
  border-radius:var(--radius-sm);
  text-decoration:none;
  white-space:nowrap;
}
.nav-toggle{
  display:none;
  background:none;
  border:1px solid var(--line-strong);
  color:var(--ink);
  padding:8px 12px;
  font-size:13px;
  border-radius:var(--radius-sm);
  cursor:pointer;
}
@media (max-width:920px){
  .nav-links{
    position:absolute;
    top:100%; left:0; right:0;
    box-shadow:0 24px 40px -24px rgba(15,23,42,.35);
    flex-direction:column;
    align-items:flex-start;
    gap:0;
    background:#fff;
    padding:10px 7vw 30px;
    transform:translateY(-8px);
    opacity:0;
    pointer-events:none;
    transition:opacity .2s ease, transform .2s ease;
  }
  .nav-links.open{ opacity:1; transform:translateY(0); pointer-events:auto; }
  .nav-links li{ width:100%; flex:0 0 auto; }
  .nav-links a{ display:block; padding:14px 0; border-bottom:1px solid var(--line); width:100%; }
  .nav-links a::after{ display:none; }
  .nav-links .nav-cta{ display:inline-flex; width:auto; margin:16px 0 4px; padding:13px 22px; border-bottom:1px solid rgba(10,27,51,.22); }
  .nav-toggle{ display:inline-block; }
}

/* ===== Page header (inner pages) ===== */
.page-hero{
  padding:80px max(7vw,calc((100vw - var(--max))/2)) 64px;
  border-bottom:1px solid var(--line);
  position:relative;
  overflow:hidden;
  scroll-snap-align:start;
  background:linear-gradient(180deg, #DCEBFF 0%, #C3DBFA 100%);
}
.hero-card{
  max-width:820px;
  padding:0;
  background:none;
  border:none;
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
.page-hero .eyebrow{
  font-family:ui-monospace, Menlo, Consolas, monospace;
  font-size:12.5px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--accent-bright);
  margin:0 0 18px;
}
.page-hero h1{
  font-size:clamp(34px,5.4vw,60px);
  line-height:1.06;
  margin:0 0 22px;
  max-width:20ch;
  text-wrap:balance;
  color:var(--ink);
  letter-spacing:-.02em;
}
.page-hero h1 em{ font-style:normal; color:var(--accent-cyan); }
.page-hero .lede{
  font-size:clamp(16.5px,1.4vw,19px);
  line-height:1.65;
  color:var(--muted);
  max-width:62ch;
  margin:0 0 32px;
}
.hero-pitch{ display:flex; flex-wrap:wrap; gap:5px 14px; align-items:baseline; max-width:54ch; margin:-12px 0 30px; padding-left:16px; border-left:2px solid var(--accent-cyan); font-size:15.5px; line-height:1.6; }
.hero-pitch b{ flex-shrink:0; font-size:10px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--accent-cyan); }
.page-hero-video .hero-pitch{ color:rgba(244,247,251,.85); text-shadow:0 1px 12px rgba(0,0,0,.5); }
.hero-ctas{ display:flex; gap:16px; flex-wrap:wrap; }

.btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:14px;
  font-weight:600;
  text-decoration:none;
  padding:14px 28px;
  border-radius:var(--radius-sm);
}

/* ===== Unified glass buttons: transparent everywhere, text color inverts on hover ===== */
.btn, .nav-cta{
  position:relative;
  background:rgba(255,255,255,.08);
  backdrop-filter:blur(14px) saturate(160%);
  -webkit-backdrop-filter:blur(14px) saturate(160%);
  border:1px solid rgba(255,255,255,.32);
  color:#fff;
  transition:background .3s ease, color .3s ease, border-color .3s ease, box-shadow .3s ease;
}
.btn-arrow{ display:inline-block; margin-left:2px; transition:transform .25s cubic-bezier(.16,1,.3,1); }
.btn:hover .btn-arrow, .nav-cta:hover .btn-arrow{ transform:translateX(4px); }
.btn-label{ position:relative; font-variant-numeric:tabular-nums; }

.btn:hover, .nav-cta:hover{
  background:#fff;
  color:#0A1B33;
  border-color:#fff;
  box-shadow:0 10px 26px -14px rgba(255,255,255,.35);
}
.btn.is-scanning, .nav-cta.is-scanning{ color:#BFDBFF; }
.btn.is-verified, .nav-cta.is-verified{ color:#35E0B5; }

/* Buttons on a light surface (the site nav bar, a plain page-hero with no video/image,
   or the offer form card) invert the other way: dark glass at rest, solid dark on hover. */
.site-nav .nav-cta,
.page-hero:not(.page-hero-video):not(.page-hero-image) .btn,
.offer-form-card .btn{
  background:rgba(10,27,51,.05);
  border-color:rgba(10,27,51,.22);
  color:#0A1B33;
}
.site-nav .nav-cta:hover,
.page-hero:not(.page-hero-video):not(.page-hero-image) .btn:hover,
.offer-form-card .btn:hover{
  background:#0A1B33;
  color:#fff;
  border-color:#0A1B33;
  box-shadow:0 10px 26px -14px rgba(10,27,51,.5);
}
.site-nav .nav-cta.is-scanning,
.page-hero:not(.page-hero-video):not(.page-hero-image) .btn.is-scanning,
.offer-form-card .btn.is-scanning{ color:var(--accent-bright); }
.site-nav .nav-cta.is-verified,
.page-hero:not(.page-hero-video):not(.page-hero-image) .btn.is-verified,
.offer-form-card .btn.is-verified{ color:#0EA371; }

/* ===== Sections ===== */
section{ padding:72px 7vw; scroll-snap-align:start; }
.section-tight{ padding:56px 7vw; }
.section-alt{ position:relative; z-index:5; isolation:isolate; background:var(--surface); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.section-inner{ max-width:var(--max); margin:0 auto; }
.eyebrow{
  font-family:ui-monospace, Menlo, Consolas, monospace;
  font-size:12.5px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--accent-bright);
  margin:0 0 16px;
}
h2{ font-size:clamp(24px,2.8vw,34px); line-height:1.2; margin:0 0 20px; text-wrap:balance; color:var(--ink); }
h3{ font-size:19px; margin:0 0 10px; color:var(--ink); }
p{ margin:0 0 16px; }
.lede-text{ font-size:17px; line-height:1.7; color:var(--muted); max-width:70ch; }
.two-col{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px;
  align-items:start;
}
@media (max-width:860px){ .two-col{ grid-template-columns:1fr; } }
.three-col{ grid-template-columns:repeat(3,1fr); }
@media (max-width:920px){ .three-col{ grid-template-columns:1fr 1fr; } }
@media (max-width:600px){ .three-col{ grid-template-columns:1fr; } }

/* ===== Lists ===== */
.check-list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:14px; }
.check-list li{
  padding-left:36px;
  min-height:24px;
  position:relative;
  color:var(--muted);
  line-height:1.55;
}
.check-list li::before{
  content:"";
  position:absolute;
  left:0; top:0;
  width:24px; height:24px;
  border-radius:7px;
  border:1px solid var(--line);
  background:var(--surface-2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231457D9' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='4 12 9 17 20 6'/%3E%3C/svg%3E") center/14px no-repeat;
}

/* ===== Methodology steps (plays once as a connected pipeline on scroll) ===== */
.method-grid{
  display:grid;
  grid-template-columns:1fr 28px 1fr 28px 1fr 28px 1fr;
  column-gap:0;
  row-gap:16px;
}
.method-step{
  position:relative;
  background:rgba(255,255,255,0.64);
  backdrop-filter:blur(12px) saturate(150%);
  -webkit-backdrop-filter:blur(12px) saturate(150%);
  border:1px solid var(--line);
  border-radius:var(--radius-md);
  padding:30px 26px;
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.method-step:hover{
  transform:translateY(-4px);
  border-color:rgba(20,87,217,.35);
  box-shadow:0 16px 32px -18px rgba(20,87,217,.35);
}
.method-step .n{
  position:relative;
  display:inline-block;
  font-family:ui-monospace, Menlo, Consolas, monospace;
  font-size:12.5px;
  color:var(--accent-bright);
  padding-bottom:5px;
  margin-bottom:9px;
}
.method-step .n::after{
  content:"";
  position:absolute;
  left:0; bottom:0;
  height:2px;
  width:0%;
  background:var(--accent-bright);
}
.method-step h3{ font-size:17px; margin-bottom:10px; }
.method-step p{ font-size:14px; color:var(--muted); margin:0; }

.method-pipe{
  position:relative;
  align-self:center;
  height:2px;
  background:var(--line);
}
.method-pipe::before{
  content:"";
  position:absolute;
  top:50%; left:0;
  width:0%;
  height:2px;
  background:linear-gradient(90deg, rgba(20,87,217,0), var(--accent-bright) 55%, #7CACFF);
  box-shadow:0 0 8px rgba(20,87,217,.55);
  transform:translateY(-50%);
}

/* Sequence: step 1 lights up, pulse travels the pipe, step 2 lights up, and so on — once. */
.method-grid.is-playing .method-step:nth-child(1){ animation:stepActivate .5s ease-out 0s forwards; }
.method-grid.is-playing .method-step:nth-child(3){ animation:stepActivate .5s ease-out .8s forwards; }
.method-grid.is-playing .method-step:nth-child(5){ animation:stepActivate .5s ease-out 1.6s forwards; }
.method-grid.is-playing .method-step:nth-child(7){ animation:stepActivate .5s ease-out 2.4s forwards; }
.method-grid.is-playing .method-step:nth-child(1) .n::after{ animation:nFill .5s ease-out 0s forwards; }
.method-grid.is-playing .method-step:nth-child(3) .n::after{ animation:nFill .5s ease-out .8s forwards; }
.method-grid.is-playing .method-step:nth-child(5) .n::after{ animation:nFill .5s ease-out 1.6s forwards; }
.method-grid.is-playing .method-step:nth-child(7) .n::after{ animation:nFill .5s ease-out 2.4s forwards; }
.method-grid.is-playing .method-pipe:nth-child(2)::before{ animation:pipeTravel .3s linear .5s forwards; }
.method-grid.is-playing .method-pipe:nth-child(4)::before{ animation:pipeTravel .3s linear 1.3s forwards; }
.method-grid.is-playing .method-pipe:nth-child(6)::before{ animation:pipeTravel .3s linear 2.1s forwards; }
@keyframes stepActivate{
  0%{ box-shadow:none; }
  30%,85%{ box-shadow:0 0 0 1px rgba(20,87,217,.3), 0 16px 32px -18px rgba(20,87,217,.45); border-color:var(--accent-bright); }
  100%{ box-shadow:0 0 0 1px rgba(20,87,217,.14); border-color:rgba(20,87,217,.3); }
}
@keyframes nFill{ to{ width:100%; } }
@keyframes pipeTravel{ to{ width:100%; } }

@media (max-width:920px){
  .method-grid{ grid-template-columns:1fr 1fr; gap:16px; }
  .method-pipe{ display:none; }
}
@media (max-width:560px){ .method-grid{ grid-template-columns:1fr; } }
@media (prefers-reduced-motion: reduce){
  .method-grid .method-step{ animation:none !important; border-color:rgba(20,87,217,.3); }
  .method-step .n::after{ animation:none !important; width:100%; }
  .method-pipe::before{ animation:none !important; width:100%; }
}

/* ===== Card grid (homepage services) ===== */
.card-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
}
.service-card{
  background:rgba(255,255,255,0.64);
  backdrop-filter:blur(12px) saturate(150%);
  -webkit-backdrop-filter:blur(12px) saturate(150%);
  border:1px solid var(--line);
  border-radius:var(--radius-md);
  padding:30px 26px;
  text-decoration:none;
  color:inherit;
  display:flex;
  flex-direction:column;
  transition:background .15s ease, transform .2s ease, box-shadow .2s ease;
}
a.service-card:hover{ background:rgba(255,255,255,0.85); transform:translateY(-4px); box-shadow:0 20px 40px -22px rgba(15,23,42,0.28); }
.service-card h3{ font-size:18px; margin-bottom:10px; }
.service-card p{ font-size:14px; color:var(--muted); margin:0 0 16px; flex:1; }
.service-card .link{ font-size:13px; font-weight:600; color:var(--accent-bright); }
.service-card .link::after{ content:" \2192"; }
@media (max-width:920px){ .card-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:600px){ .card-grid{ grid-template-columns:1fr; } }

/* ===== Stat counters ===== */
.stat-row{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
  margin-top:40px;
}
.stat{
  background:rgba(255,255,255,0.64);
  backdrop-filter:blur(12px) saturate(150%);
  -webkit-backdrop-filter:blur(12px) saturate(150%);
  border:1px solid var(--line);
  border-radius:var(--radius-md);
  padding:28px 24px;
}
.stat .num{
  font-family:ui-monospace, Menlo, Consolas, monospace;
  font-weight:600;
  font-size:clamp(32px,4vw,44px);
  color:var(--accent-bright);
  font-variant-numeric:tabular-nums;
  display:block;
  line-height:1;
  margin-bottom:10px;
  opacity:0;
  transform:translateY(10px) scale(.94);
  transition:opacity .5s ease, transform .6s cubic-bezier(.34,1.56,.64,1);
}
.stat .num.is-live{ opacity:1; transform:translateY(0) scale(1); }
.stat .label{ font-size:13.5px; color:var(--muted); line-height:1.5; }
@media (max-width:700px){ .stat-row{ grid-template-columns:1fr; } }
.stat-row.stat-row-plain{ margin-top:0; }
.stat-row-plain .stat{
  background:none; border:none; border-radius:0; padding:0 0 0 24px;
  border-left:1px solid var(--line);
  backdrop-filter:none; -webkit-backdrop-filter:none;
}
.stat-row-plain .stat:first-child{ border-left:none; padding-left:0; }
@media (max-width:700px){
  .stat-row-plain .stat{ border-left:none; border-top:1px solid var(--line); padding:20px 0 0; }
  .stat-row-plain .stat:first-child{ border-top:none; padding-top:0; }
}

/* ===== "Open Section" system: no cards — whitespace, typography, and one recurring
   interactive line motif. A thin rule that, once scrolled into view, plays a traveling
   dot once and settles into a very faint, permanently-lit line. ===== */
.open-section{ padding:76px 7vw; }
.open-line{
  position:relative;
  height:1px;
  background:rgba(15,23,42,.09);
  margin:0 0 30px;
  transition:background 1.2s ease;
}
.open-line::before{
  content:"";
  position:absolute; top:50%; left:0%;
  width:7px; height:7px; border-radius:50%;
  background:var(--accent-bright);
  box-shadow:0 0 0 4px rgba(20,87,217,.16), 0 0 12px rgba(20,87,217,.6);
  transform:translate(-50%,-50%);
  opacity:0;
}
.open-line::after{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(90deg, var(--accent-bright), #35E0B5);
  transform:scaleX(0);
  transform-origin:left;
  opacity:0;
}
.open-line.is-active::before{ animation:openDotTravel 1.05s cubic-bezier(.45,0,.2,1) forwards; }
.open-line.is-active::after{ animation:openLineFill 1.05s cubic-bezier(.45,0,.2,1) forwards, openLineFade .5s ease .85s forwards; }
.open-line.is-done{ background:rgba(20,87,217,.15); }
@keyframes openDotTravel{
  0%{ left:0%; opacity:1; }
  90%{ opacity:1; }
  100%{ left:100%; opacity:0; }
}
@keyframes openLineFill{ from{ transform:scaleX(0); opacity:1; } to{ transform:scaleX(1); opacity:1; } }
@keyframes openLineFade{ to{ opacity:0; } }
@media (prefers-reduced-motion: reduce){
  .open-line::before, .open-line::after{ animation:none !important; opacity:0 !important; }
}

.open-head{ display:flex; align-items:baseline; gap:14px; margin-bottom:20px; }
.open-head .open-index{ font-size:13px; font-weight:700; letter-spacing:.04em; color:var(--accent-bright); font-variant-numeric:tabular-nums; }
.open-head .open-label{ font-size:12px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--muted-2); }

.open-grid{ display:grid; grid-template-columns:minmax(200px,360px) 1fr; gap:48px; align-items:start; }
.open-grid h2, .open-grid h3{ margin:0; font-size:27px; line-height:1.28; letter-spacing:-.01em; }
.open-grid h3{ font-size:20px; }
.open-grid h3 a{ color:var(--ink); text-decoration:none; }
.open-grid h3 a:hover{ color:var(--accent-bright); }
.open-desc{ color:var(--muted); font-size:16px; line-height:1.75; max-width:62ch; }
.open-desc p{ margin:0 0 12px; }
.open-desc p:last-child{ margin-bottom:0; }
.open-desc .link{ color:var(--accent-bright); font-weight:600; text-decoration:none; }
.open-desc .link:hover{ text-decoration:underline; }
.open-more{ display:inline-flex; align-items:center; gap:6px; margin-top:16px; font-size:14px; font-weight:600; color:var(--accent-bright); text-decoration:none; }
.open-more svg{ width:15px; height:15px; transition:transform .2s ease; }
.open-more:hover svg{ transform:translateX(4px); }
@media (max-width:760px){
  .open-grid{ grid-template-columns:1fr; gap:14px; }
}

.open-list{ display:flex; flex-direction:column; }
.open-item{ padding:32px 0; }
.open-item:first-child{ padding-top:0; }

/* Every .open-section sits directly on the page's blue gradient background
   (no card behind it), so its text is set light/white for real contrast —
   with a soft shadow to stay legible even in the gradient's lighter top range. */
/* The ambient body gradient runs from pale (near the top of a page) to deep navy
   (near the bottom), so a fixed white text color is only reliably readable low on
   very long pages. A subtle, borderless veil keeps the gradient as "the container"
   while guaranteeing contrast regardless of how far down a section happens to sit. */
.open-section{ position:relative; color:#fff; isolation:isolate; }
.open-section::before{
  content:"";
  position:absolute; inset:0;
  background:rgba(6,16,34,.58);
  z-index:-1;
  pointer-events:none;
}
.open-section .eyebrow{ color:#BFDBFF; text-shadow:0 1px 10px rgba(6,16,36,.35); }
.open-section h2, .open-section h3{ color:#fff; text-shadow:0 1px 14px rgba(6,16,36,.3); }
.open-section em, .services-section em{ font-style:normal; color:var(--accent-cyan); }
.open-section h3 a{ color:#fff; }
.open-section h3 a:hover{ color:#BFDBFF; }
.open-section .open-head .open-index{ color:#7CACFF; }
.open-section .open-head .open-label{ color:rgba(255,255,255,.6); }
.open-section .open-desc{ color:rgba(255,255,255,.86); text-shadow:0 1px 12px rgba(6,16,36,.3); }
.open-section .open-desc .link{ color:#BFDBFF; }
.open-section .open-more{ color:#BFDBFF; }
.open-section .check-list li{ color:rgba(255,255,255,.86); }
.open-section .lede-text{ color:rgba(255,255,255,.86); text-shadow:0 1px 12px rgba(6,16,34,.3); }
.open-section .quote{ color:#fff; text-shadow:0 1px 12px rgba(6,16,34,.3); }
.open-section .line{ background:rgba(255,255,255,.14); }

.open-section .open-line{ background:rgba(255,255,255,.16); }
.open-section .open-line.is-done{ background:rgba(124,172,255,.4); }

.open-section .stat-row-plain .stat{ border-left-color:rgba(255,255,255,.22); }
.open-section .stat-row-plain .stat:first-child{ border-left:none; }
@media (max-width:700px){ .open-section .stat-row-plain .stat{ border-top-color:rgba(255,255,255,.22); } }
.open-section .stat .num{ color:var(--accent-cyan); }
.open-section .stat .label{ color:rgba(255,255,255,.68); }

/* ===== Expert bios ===== */
.experts{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
@media (max-width:760px){ .experts{ grid-template-columns:1fr; } }
.expert-card{
  background:rgba(255,255,255,0.64);
  backdrop-filter:blur(12px) saturate(150%);
  -webkit-backdrop-filter:blur(12px) saturate(150%);
  border:1px solid var(--line);
  border-radius:var(--radius-md);
  padding:34px 30px;
}
.expert-card .name{ font-size:19px; font-weight:700; margin-bottom:4px; }
.expert-card .role{ font-size:13.5px; color:var(--accent-bright); margin-bottom:18px; }
.expert-card .certs{ font-size:13px; color:var(--muted); line-height:1.7; }
.quote{
  border-top:1px solid var(--line);
  margin-top:40px;
  padding-top:32px;
  font-size:19px;
  line-height:1.6;
  color:var(--ink);
  max-width:78ch;
}
.quote::before{ content:"\201C"; }
.quote::after{ content:"\201D"; }
.content-card .quote{ border-top:none; margin-top:0; padding-top:0; }

/* ===== FAQ ===== */
.faq-item{ border-top:1px solid var(--line); }
.faq-item:last-child{ border-bottom:1px solid var(--line); }
.faq-q{
  width:100%;
  text-align:left;
  background:none;
  border:none;
  color:var(--ink);
  font-family:inherit;
  font-size:16.5px;
  font-weight:600;
  padding:22px 0;
  cursor:pointer;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
}
.faq-q .icon{ font-size:20px; color:var(--accent-bright); transition:transform .2s ease; flex-shrink:0; }
.faq-item[data-open="true"] .icon{ transform:rotate(45deg); }
.faq-a{
  overflow:hidden;
  max-height:0;
  transition:max-height .3s ease;
}
.faq-item[data-open="true"] .faq-a{ max-height:none; }
.faq-a p{ padding-bottom:22px; color:var(--muted); font-size:15px; line-height:1.65; max-width:70ch; }

/* ===== CTA band (spotlight + marquee) ===== */
.cta-band{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(600px circle at var(--mx,50%) var(--my,20%), rgba(124,172,255,.16), transparent 60%),
    linear-gradient(160deg, #0A1B33 0%, #0C2140 55%, #0A1B33 100%);
  padding:72px 7vw 0;
  text-align:left;
  scroll-snap-align:start;
  isolation:isolate;
}
.cta-band::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(rgba(124,172,255,.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(124,172,255,.08) 1px, transparent 1px);
  background-size:44px 44px;
  -webkit-mask-image:radial-gradient(700px circle at var(--mx,50%) var(--my,20%), #000 0%, transparent 70%);
  mask-image:radial-gradient(700px circle at var(--mx,50%) var(--my,20%), #000 0%, transparent 70%);
  pointer-events:none;
  z-index:0;
}
.cta-band .section-inner{ position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between; gap:32px; flex-wrap:wrap; padding-bottom:56px; }
.cta-band h2{ margin:0 0 8px; color:#fff; }
.cta-band p{ margin:0; color:rgba(244,247,251,0.7); }
.cta-marquee{
  position:relative;
  z-index:1;
  overflow:hidden;
  border-top:1px solid rgba(124,172,255,.16);
  -webkit-mask-image:linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
  mask-image:linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.cta-marquee-track{
  display:flex;
  align-items:center;
  width:max-content;
  gap:0;
  animation:ctaMarquee 34s linear infinite;
}
.cta-marquee-item{
  display:flex;
  align-items:center;
  gap:10px;
  padding:20px 34px;
  font-size:14px;
  font-weight:600;
  letter-spacing:.01em;
  color:rgba(244,247,251,.78);
  white-space:nowrap;
}
.cta-marquee-item svg{ flex-shrink:0; color:var(--accent-bright); }
.cta-marquee-dot{ width:4px; height:4px; border-radius:50%; background:rgba(124,172,255,.4); flex-shrink:0; }
@keyframes ctaMarquee{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
@media (max-width:640px){
  .cta-marquee-item{ padding:16px 22px; font-size:13px; }
}
@media (prefers-reduced-motion: reduce){
  .cta-band::before{ mask-image:none; -webkit-mask-image:none; opacity:.4; }
  .cta-marquee-track{ animation:none; }
}

/* ===== Footer ===== */
.site-footer{
  padding:28px max(7vw,calc((100vw - var(--max))/2)) 22px;
  border-top:1px solid var(--line);
  background:#fff;
  display:flex;
  flex-direction:column;
  gap:16px;
}
.footer-badges{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:26px;
}
.footer-badge{
  height:92px;
  width:auto;
  opacity:.95;
  transition:opacity .2s ease, transform .2s ease;
}
.footer-badge:hover{ opacity:1; transform:translateY(-2px); }
.footer-bottom{
  font-size:13.5px;
  color:var(--muted-2);
  display:flex;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:16px;
}
.footer-bottom a{ color:var(--muted); text-decoration:none; }
.footer-bottom a:hover{ color:var(--accent-bright); }
.footer-credit{ color:var(--muted-2); }
.footer-credit a{ color:var(--muted); text-decoration:none; font-weight:600; }
.footer-credit a:hover{ color:var(--accent-bright); }

/* ===== Forms ===== */
.form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.form-grid .full{ grid-column:1 / -1; }
@media (max-width:700px){ .form-grid{ grid-template-columns:1fr; } }
label{ display:block; font-size:13px; color:var(--muted); margin-bottom:8px; }
label .req{ color:var(--accent-bright); }
input, select, textarea{
  width:100%;
  background:#fff;
  border:1px solid var(--line-strong);
  color:var(--ink);
  font-family:inherit;
  font-size:15px;
  padding:13px 14px;
  border-radius:var(--radius-sm);
}
input:focus, select:focus, textarea:focus{
  outline:2px solid var(--accent-bright);
  outline-offset:1px;
  border-color:var(--accent-bright);
}
textarea{ resize:vertical; min-height:110px; }
.field{ margin-bottom:0; }
.form-note{ font-size:12.5px; color:var(--muted-2); margin-top:10px; }

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *{ transition-duration:.01ms !important; animation-duration:.01ms !important; }
  .ambient-cursor,.section-rail{ display:none; }
  [data-tilt]{ transform:none !important; }
}

/* ===== Preloader (scan-reveal intro, real artwork) ===== */
#preloader{
  position:fixed;
  inset:0;
  z-index:9999;
  overflow:hidden;
  background:#050f22;
  animation:preloaderOut .4s ease forwards .75s;
}
.preloader-bg{
  position:absolute;
  inset:0;
  background:url("preloader-bg.webp") center/cover no-repeat;
}
.preloader-bg-ghost{
  opacity:0;
  filter:brightness(0.32) saturate(0.6);
  animation:ghostIn .3s ease-out .15s forwards;
}
.preloader-bg-reveal{
  clip-path:inset(0 100% 0 0);
  will-change:clip-path;
  animation:revealClip .5s linear .25s forwards;
}
@keyframes ghostIn{ to{ opacity:1; } }
@keyframes revealClip{ to{ clip-path:inset(0 0% 0 0); } }
.preloader-scan{
  position:absolute;
  top:0; bottom:0;
  left:0%;
  width:5px;
  background:linear-gradient(180deg, transparent, #EAF5FF 35%, #EAF5FF 65%, transparent);
  box-shadow:0 0 26px 6px rgba(190,227,255,0.6);
  opacity:0;
  animation:scanMove .5s linear .25s forwards;
  pointer-events:none;
}
@keyframes scanMove{
  0%{ left:0%; opacity:1; }
  92%{ opacity:1; }
  100%{ left:100%; opacity:0; }
}
@keyframes preloaderOut{
  to{ opacity:0; transform:translateY(-26px); visibility:hidden; }
}
@media (prefers-reduced-motion: reduce){
  #preloader{ animation:preloaderOut .4s ease forwards .5s; }
  .preloader-bg-ghost{ animation:none; opacity:0; }
  .preloader-bg-reveal{ animation:none; clip-path:inset(0 0% 0 0); }
  .preloader-scan{ animation:none; opacity:0; }
}

/* ===== Mobile smoothness: cheaper compositing on phones ===== */
@media (max-width:760px){
  .btn,.glass,.content-card,.stat,.offer-trust span{ -webkit-backdrop-filter:none; backdrop-filter:none; }
  .reveal-up{ transition-duration:.45s; }
  html{ scroll-behavior:auto; }
}
