:root{--navy:#041631;--navy2:#0a2547;--gold:#ffc415;--gold2:#fddd4c;--ink:#231f1f;--muted:#525254;--light:#f5f7fa;--line:#e2e8f0}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;color:var(--ink);line-height:1.65;background:#fff}
img{max-width:100%;height:auto}
a{color:var(--navy2)}
.wrap{max-width:1120px;margin:0 auto;padding:0 20px}
/* header */
.site-header{background:var(--navy);position:sticky;top:0;z-index:50;box-shadow:0 2px 10px rgba(0,0,0,.25)}
.header-in{display:flex;align-items:center;gap:24px;padding-top:12px;padding-bottom:12px;flex-wrap:wrap}
.logo img{height:52px;width:auto;display:block}
.main-nav{display:flex;gap:18px;flex-wrap:wrap;margin-left:auto}
.main-nav a{color:#fff;text-decoration:none;font-weight:600;font-size:15px}
.main-nav a:hover{color:var(--gold)}
.btn{display:inline-block;text-decoration:none;font-weight:700;border-radius:999px;padding:10px 22px;font-size:15px;border:2px solid transparent}
.btn.gold{background:var(--gold);color:var(--navy)}
.btn.gold:hover{background:var(--gold2)}
.btn.big{padding:14px 34px;font-size:17px}
.btn.outline{border-color:var(--navy);color:var(--navy);background:#fff}
.btn.outline-light{border-color:#fff;color:#fff;background:transparent}
/* content */
.content{padding:44px 20px 56px}
.content h1{font-size:40px;line-height:1.15;color:var(--navy);margin:0 0 18px}
.content h2{font-size:27px;line-height:1.25;color:var(--navy);margin:34px 0 10px}
.content h3{font-size:21px;color:var(--navy2);margin:24px 0 8px}
.content h4{font-size:18px;color:var(--navy2);margin:22px 0 6px}
.content h5{font-size:16px;color:var(--navy);margin:18px 0 4px}
.content p{margin:0 0 14px;color:#333}
.content-list{margin:0 0 18px;padding-left:22px}
.content-list li{margin-bottom:8px}
.page-img{margin:26px 0;text-align:center}
.page-img img{border-radius:12px;box-shadow:0 6px 24px rgba(4,22,49,.14)}
.video-wrap{margin:30px 0;text-align:center}
.video-wrap video{width:100%;max-width:820px;border-radius:12px;background:#000}
.industry-link a{text-decoration:none;color:var(--navy)}
.industry-link a:hover{color:#b8860b}
.static-form{background:var(--light);border:1px solid var(--line);border-radius:14px;padding:26px;margin:30px 0}
.static-form h2{margin-top:0}
.cta-center{text-align:center;margin:28px 0}
/* CTA band */
.cta-band{background:var(--navy);color:#fff;text-align:center;padding:52px 20px}
.cta-band h2{color:#fff;font-size:30px;margin:0 0 18px}
/* footer */
.site-footer{background:var(--navy);color:#dbe4f0;padding:44px 0 10px;margin-top:0}
.footer-in{display:flex;gap:36px;flex-wrap:wrap;align-items:flex-start}
.footer-logo{height:56px;width:auto}
.footer-contact p{margin:0 0 6px}
.site-footer a{color:#fff;text-decoration:none}
.site-footer a:hover{color:var(--gold)}
.footer-social{display:flex;flex-direction:column;gap:8px;margin-left:auto}
.copyright{border-top:1px solid rgba(255,255,255,.18);margin-top:26px;padding-top:14px;padding-bottom:8px;font-size:14px;color:#aebfd4}
@media (max-width:760px){
 .content h1{font-size:31px}
 .content h2{font-size:23px}
 .header-in{gap:12px}
 .main-nav{margin-left:0;gap:12px}
 .main-nav a{font-size:14px}
 .logo img{height:42px}
 .footer-social{margin-left:0}
}
/* pricing comparison table (text version of the Wix table image) */
.pricing-table{width:100%;border-collapse:collapse;margin:26px 0;font-size:16px}
.pricing-table caption{text-align:left;font-weight:600;color:var(--navy);margin-bottom:10px}
.pricing-table th,.pricing-table td{border:1px solid var(--line);padding:10px 14px;text-align:left}
.pricing-table thead th{background:var(--navy);color:#fff}
.pricing-table thead th:nth-child(2),.pricing-table thead th:nth-child(3){background:var(--gold);color:var(--navy);text-align:center}
.pricing-table td:nth-child(2),.pricing-table td:nth-child(3){text-align:center}
.pricing-table tbody tr:nth-child(even){background:var(--light)}

/* ===== Animation layer (added 2026-10-12) — recreates Wix motion: Reveal/FadeIn
   entrances, ZoomIn hero settle, parallax, hover micro-interactions.
   ALL initial hidden states live under the .anim gate, which assets/anim.js
   adds only when JS runs and motion is allowed. No-JS = everything visible. */
@keyframes heroUp{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
.anim .hero-el{animation:heroUp .85s ease-out both}
.anim .hero-fig img{animation:heroUp 1s ease-out .15s both}
.anim .rv{opacity:0;transform:translateY(26px)}
.anim .rv.rv-in{opacity:1;transform:translateY(0);transition:opacity .8s ease-out var(--rvd,0ms),transform .8s ease-out var(--rvd,0ms)}
/* hover micro-interactions */
.btn{transition:background .25s ease}
.main-nav a{position:relative;transition:color .25s ease}
.main-nav a::after{content:"";position:absolute;left:0;bottom:-5px;height:2px;width:100%;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .3s ease}
.main-nav a:hover::after{transform:scaleX(1)}
.main-nav a.active{color:var(--gold)}
.main-nav a.active::after{transform:scaleX(1)}
.site-footer a{transition:color .25s ease}
.footer-social a{transition:color .25s ease}
@media (prefers-reduced-motion: reduce){
 .anim .rv{opacity:1;transform:none}
 .anim .hero-el,.anim .hero-fig img{animation:none}
 *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}
}