/* SPAROW server-rendered front-end — only what inline styles cannot do
   (pseudo-states, keyframes, responsive). Visual values mirror the design. */

:root { --sp-accent:#2A78F2; }
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{background:#eaf2fe;color:#0e1726;font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden;}
a{color:inherit;}
img{max-width:100%;}

/* fixed header offset */
.sp-ssr-main{position:relative;z-index:1;}

/* primary nav hover */
.sp-navlink{position:relative;text-decoration:none;transition:color .25s ease;}
.sp-navlink:hover{color:var(--sp-accent)!important;}

/* secondary nav dropdowns */
.sp-pmenu{position:relative;}
.sp-pdrop{position:absolute;top:100%;left:-14px;padding-top:6px;opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .26s cubic-bezier(.16,1,.3,1),transform .26s cubic-bezier(.16,1,.3,1),visibility .26s;z-index:50;}
.sp-pmenu:hover .sp-pdrop{opacity:1;visibility:visible;transform:translateY(0);}
.sp-pmenu:hover .sp-pchev{transform:rotate(180deg);}
.sp-pdd-item{text-decoration:none;transition:background .2s ease;}
.sp-pdd-item:hover{background:rgba(42,120,242,0.07);}
.sp-pdd-item:hover .sp-pdd-arrow{opacity:1!important;transform:translateX(0)!important;}

/* card surface — glass depth is intrinsic to every .sp-card (resting shadow +
   inset top highlight) so no card can fall back to a flat white box, whether or
   not it also carries .sp-glass or an inline shadow. */
.sp-card{position:relative;overflow:hidden;transition:box-shadow .4s cubic-bezier(.16,1,.3,1),transform .25s cubic-bezier(.16,1,.3,1);text-decoration:none;color:inherit;display:block;box-shadow:0 26px 56px -34px rgba(18,46,92,0.26),0 10px 28px -16px rgba(42,120,242,0.22),inset 0 1px 0 rgba(255,255,255,0.95);}
.sp-card:hover{box-shadow:0 32px 64px -32px rgba(18,46,92,0.3),0 14px 34px -20px rgba(42,120,242,0.28),inset 0 1px 0 rgba(255,255,255,0.95);}
.sp-hwrap{position:relative;overflow:hidden;}
.sp-hzoom{transition:transform 1.1s cubic-bezier(.16,1,.3,1);}
.sp-hwrap:hover .sp-hzoom{transform:scale(1.06);}

/* sweep + ripple keyframes */
@keyframes spSweep{0%{transform:translateX(-130%) skewX(-16deg);opacity:0;}16%{opacity:1;}60%{opacity:0.55;}100%{transform:translateX(130%) skewX(-16deg);opacity:0;}}
@keyframes spRipple{0%{transform:translate(-50%,-50%) scale(0.4);opacity:0.5;}100%{transform:translate(-50%,-50%) scale(2.8);opacity:0;}}

/* glass reflection: top gloss + diagonal sweep on hover */
.sp-glass{position:relative;overflow:hidden;}
.sp-glass::before,.sp-card::before{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(180deg,rgba(207,234,255,0.4),rgba(255,255,255,0) 12%);opacity:0.6;z-index:2;}
.sp-glass::after,.sp-card::after{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(105deg,transparent 32%,rgba(255,255,255,0.16) 48%,rgba(191,232,255,0.10) 52%,transparent 68%);transform:translateX(-130%) skewX(-16deg);opacity:0;z-index:3;}
.sp-glass:hover::after,.sp-card:hover::after{animation:spSweep 0.9s ease-out;}

/* button shine: light-sweep on hover + top gloss */
.sp-btn{position:relative;overflow:hidden;transition:box-shadow .35s cubic-bezier(.16,1,.3,1),transform .2s cubic-bezier(.16,1,.3,1);}
.sp-btn::before{content:'';position:absolute;inset:0;pointer-events:none;z-index:5;border-radius:inherit;background:linear-gradient(105deg,transparent 32%,rgba(255,255,255,0.5) 48%,rgba(255,255,255,0.18) 54%,transparent 72%);transform:translateX(-130%) skewX(-18deg);opacity:0;}
.sp-btn:hover::before{animation:spSweep 0.75s ease-out;}
.sp-btn::after{content:'';position:absolute;left:0;right:0;top:0;height:48%;pointer-events:none;border-radius:inherit;background:linear-gradient(180deg,rgba(255,255,255,0.22),transparent);opacity:0.5;}
.sp-btn:hover{transform:translateY(-1px);}
.sp-btn:active{transform:translateY(1px);}

/* JS ripple dot (click feedback on image cards) */
.sp-ripple{position:absolute;width:140px;height:140px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,0.55),rgba(255,255,255,0) 70%);pointer-events:none;z-index:4;animation:spRipple .7s ease-out forwards;}

/* footer link hover */
.sp-foot-link{text-decoration:none;transition:color .2s ease;}
.sp-foot-link:hover{color:#fff!important;}

/* Scroll reveal — content is VISIBLE BY DEFAULT. The hide-then-reveal only
   engages under html.sp-reveal-ready, a class the reveal script adds the moment
   before it starts observing (see sparow-ui.js). Because that class is set from
   inside the script itself — not from the early <head> sp-js flag — the content
   is never hidden while we are merely *waiting* for the script to load. A
   missing / slow / blocked / errored script therefore leaves the real content
   fully visible instead of a blank white page (this was the Industries "blank
   for seconds" cause: sp-js hid everything in <head>, then a footer script had
   to run on DOMContentLoaded to reveal it).

   Belt-and-braces: even once hidden, each element auto-reveals via a CSS
   animation after 1.2s, so if the IntersectionObserver ever fails to fire on an
   element it still cannot stay invisible. */
html.sp-reveal-ready .sp-reveal{opacity:0;transform:translateY(26px);transition:opacity .8s cubic-bezier(.16,1,.3,1),transform .8s cubic-bezier(.16,1,.3,1);animation:spRevealFailsafe 0s linear 1.2s forwards;}
html.sp-reveal-ready .sp-reveal.in{opacity:1;transform:none;animation:none;}
@keyframes spRevealFailsafe{to{opacity:1;transform:none;}}

/* animated background */
#sp-bg{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;background:linear-gradient(180deg,#eaf2fe 0%,#dfecfd 50%,#eaf2fe 100%);}
@keyframes spCaustA{0%,100%{transform:translate(0,0) scale(1);}50%{transform:translate(3%,2%) scale(1.05);}}
@keyframes spCaustB{0%,100%{transform:translate(0,0) scale(1.05);}50%{transform:translate(-3%,-2%) scale(1);}}
@keyframes spCaustC{0%,100%{transform:translate(0,0);}50%{transform:translate(2%,-3%);}}
@keyframes spWave{0%{background-position-x:0;}100%{background-position-x:1440px;}}
@keyframes spMenuIn{from{opacity:0;}to{opacity:1;}}
@keyframes spMenuItem{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:none;}}

/* article (the_content) typography */
.sp-article > *:first-child{margin-top:0;}
.sp-article > *:last-child{margin-bottom:0;}
.sp-article h2{font-family:'Montserrat',sans-serif;font-weight:700;font-size:clamp(22px,2.4vw,30px);line-height:1.18;letter-spacing:-0.02em;color:#0e1726;margin:36px 0 14px;}
.sp-article h3{font-family:'Montserrat',sans-serif;font-weight:700;font-size:clamp(18px,2vw,23px);line-height:1.22;color:#0e1726;margin:28px 0 12px;}
.sp-article p{margin:0 0 18px;}
.sp-article a{color:var(--sp-accent);text-decoration:underline;text-underline-offset:2px;}
.sp-article ul,.sp-article ol{margin:0 0 18px;padding-left:24px;}
.sp-article li{margin:0 0 8px;}
.sp-article blockquote{margin:24px 0;padding:16px 24px;border-left:3px solid var(--sp-accent);background:rgba(42,120,242,0.05);border-radius:0 12px 12px 0;font-style:italic;color:rgba(20,32,52,0.86);}
.sp-article img{border-radius:16px;height:auto;margin:18px 0;}
.sp-article figure{margin:18px 0;}
.sp-article figcaption{font-size:13px;color:rgba(44,62,90,0.7);margin-top:8px;text-align:center;}
.sp-article code{background:rgba(16,42,82,0.06);padding:2px 7px;border-radius:6px;font-size:0.9em;}
.sp-article pre{background:#0c1016;color:#e6eefc;padding:18px;border-radius:14px;overflow:auto;margin:0 0 18px;}

/* pagination */
.pagination,.nav-links{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:14px;}
.pagination .page-numbers,.nav-links .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:42px;padding:0 14px;border-radius:100px;background:#fff;border:1px solid rgba(16,42,82,0.1);color:#0e1726;font-weight:600;font-size:14px;text-decoration:none;box-shadow:0 8px 22px -14px rgba(18,46,92,0.3);}
.pagination .page-numbers.current,.nav-links .page-numbers.current{background:linear-gradient(135deg,var(--sp-accent),#155fe0);color:#fff;border-color:transparent;}

/* mobile menu */
.sp-mobile{display:none;}
.sp-burger{display:none;}

/* Partners pillar: native FAQ accordion (no JS needed) */
.sp-faq summary{list-style:none;cursor:pointer;}
.sp-faq summary::-webkit-details-marker{display:none;}
.sp-faq .sp-faq-plus{transition:transform .3s cubic-bezier(.16,1,.3,1);}
.sp-faq[open] .sp-faq-plus{transform:rotate(45deg);}
.sp-faq[open]{border-color:rgba(42,120,242,0.28)!important;background:linear-gradient(152deg,#ffffff,#eef5ff)!important;}

@media (max-width:980px){
  [data-desk="1"]{display:none!important;}
  .sp-burger{display:block!important;}
  .sp-mobile.open{display:flex!important;}
  [data-2col="1"]{grid-template-columns:1fr!important;}
  [data-footgrid="1"]{grid-template-columns:1fr 1fr!important;}
  [data-bento] [style*="span 4"],[data-bento] [style*="span 3"],[data-bento] [style*="span 2"]{grid-column:1 / -1!important;}
  [data-statgrid="1"]{grid-template-columns:1fr 1fr!important;}
  [data-tcols="1"]{grid-template-columns:1fr 1fr!important;}
  [data-faqcols="1"]{grid-template-columns:1fr!important;}
  [data-stepwrap="1"]{flex-wrap:wrap!important;gap:24px 0!important;}
  [data-stepwrap="1"] > div:not([data-stepcon]){flex:0 0 50%!important;}
  [data-stepcon]{display:none!important;}
}
@media (max-width:620px){
  [data-footgrid="1"]{grid-template-columns:1fr!important;}
  [data-tcols="1"]{grid-template-columns:1fr!important;}
  [data-stepwrap="1"] > div:not([data-stepcon]){flex:0 0 100%!important;}
  [data-indwrap="1"]{padding-top:104px!important;gap:36px!important;}
  [data-indwrap="1"] [data-statgrid="1"]{grid-template-columns:1fr 1fr!important;gap:2px!important;}
}
