/* assets/css/inner.css: inner pages in the reference design system (loaded after site.css).
   Two top-band families, as in the reference: pale sky (.ph-hero, in site.css) and deep navy (below). */

/* ═══ Deep navy top bands ═══ */
.hero,.mkt-hero,.blogs-hero,.pr-hero,.svh{position:relative;background:radial-gradient(110% 130% at 85% 20%,#0E2A63 0%,var(--navy-900) 58%)!important;color:#fff;}
.hero::before,.hero::after,.mkt-hero::before,.mkt-hero::after,.blogs-hero::before,.blogs-hero::after{display:none!important;}
.hero h1,.mkt-hero h1,.blogs-hero h1,.pr-hero h1,.svh h1{font-family:var(--f);font-weight:800;letter-spacing:-.02em;color:#fff!important;}
.hero h1 span,.mkt-hero h1 span,.blogs-hero h1 span,.pr-hero h1 span{color:#5B9BFF!important;background:none!important;-webkit-text-fill-color:#5B9BFF!important;}
.svh{padding:128px 0 64px;}
.svh .container{position:relative;}
.svh h1{font-size:clamp(32px,4vw,52px);line-height:1.08;margin:0 0 14px;max-width:20ch;}
.svh p{font-size:17px;line-height:1.65;color:rgba(255,255,255,.8);margin:0;max-width:60ch;}

/* industry pages: the industry photo stays, under a navy veil instead of the industry colour */
.mhero{position:relative;background-color:var(--navy-900)!important;padding-top:128px!important;padding-bottom:80px!important;}
.mhero::before{opacity:1!important;background:linear-gradient(90deg,rgba(6,17,39,.94) 0%,rgba(6,17,39,.78) 45%,rgba(6,17,39,.45) 100%)!important;}
.mhero::after{display:none!important;}
.mhero h1{color:#fff!important;font-weight:800;letter-spacing:-.02em;}
.mhero-cat{display:none!important;}

/* buttons used by the page templates */
.btn-solid,.sb1,.mkt-hero-cta,.cbtn,.mcta-btn1,.pkg-btn,.cf-submit,.gs-submit,.az-btn,.az-cta-pri,.lfw-submit,.wk-cta,.otp-verify-btn{
  background:var(--blue)!important;color:#fff!important;border:0!important;border-radius:var(--r-btn)!important;box-shadow:0 10px 24px -10px rgba(8,102,255,.6)!important;font-family:var(--f)!important;font-weight:600!important;}
.btn-solid:hover,.sb1:hover,.mkt-hero-cta:hover,.cbtn:hover,.mcta-btn1:hover,.pkg-btn:hover,.cf-submit:hover,.gs-submit:hover,.az-btn:hover,.az-cta-pri:hover,.lfw-submit:hover,.wk-cta:hover{background:var(--blue-600)!important;}
.btn-wa,.hc-wa-btn{background:#fff!important;color:var(--ink)!important;border:1px solid var(--line)!important;border-radius:var(--r-btn)!important;}
.btn-wa i,.hc-wa-btn i{color:var(--wa);}

/* ═══ Service page ═══ */
.hero .breadcrumb,.hero .breadcrumb a{color:rgba(255,255,255,.7)!important;}
.hero .hf{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);border-radius:10px;}
.hero .hf i{color:#5B9BFF;}
.svc-pack{background:#fff;color:var(--ink);border-radius:var(--r-card);overflow:hidden;box-shadow:0 30px 60px -30px rgba(0,0,0,.6);}
.svc-pack-band{padding:16px 20px 14px;border-bottom:1px solid var(--line);}
.svc-pack-name{display:block;font:800 20px/1.2 var(--f);color:var(--ink);}
.svc-pack-photo{background:#F4F7FC;}
.svc-pack-photo img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:contain;}
.svc-pack-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 20px 18px;border-top:1px solid var(--line);}
.svc-pack-mrp{display:flex;flex-direction:column;}
.svc-pack-mrp b{font:500 12.5px/1.2 var(--f);color:var(--muted);}
.svc-pack-mrp span{font:800 22px/1.15 var(--f);color:var(--ink);}
.svc-pack-cta{display:inline-flex;align-items:center;gap:8px;padding:12px 18px;border-radius:var(--r-btn);background:var(--blue);color:#fff;font:600 15px/1 var(--f);white-space:nowrap;}
.svc-pack-cta:hover{background:var(--blue-600);color:#fff;}
.hero-card{background:#fff!important;color:var(--ink)!important;border:0!important;border-radius:var(--r-card)!important;backdrop-filter:none!important;}
.hero-card *{color:var(--ink);}
.hero-card .hc-label{display:none!important;}
.hero-card .apply-btn{background:var(--blue)!important;color:#fff!important;border-radius:var(--r-btn)!important;}
.trust-row{border-bottom:1px solid var(--line)!important;}
.trust-item i{color:var(--blue)!important;}
.proc-circle{background:var(--blue)!important;color:#fff!important;}
.cta-final{background:radial-gradient(110% 140% at 85% 30%,#0B2558 0%,var(--navy-900) 58%)!important;color:#fff;}
.cta-final::before,.cta-final::after{display:none!important;}
.cta-final h2{color:#fff!important;font-weight:800;}
.cta-final p{color:rgba(255,255,255,.8)!important;}
.faq-cta{background:var(--navy-900)!important;}
.rel-card{border:1px solid var(--line)!important;border-radius:var(--r-card)!important;box-shadow:var(--sh-card);}

/* ═══ Services hub: cards in the homepage style ═══ */
.ct{border:1px solid var(--line)!important;color:var(--ink)!important;background:#fff!important;border-radius:999px!important;}
.ct.on,.ct:hover{background:var(--blue)!important;border-color:var(--blue)!important;color:#fff!important;}
.page .card{border:1px solid var(--line)!important;border-radius:var(--r-card)!important;box-shadow:var(--sh-card);transition:transform .45s var(--ease),box-shadow .45s var(--ease)!important;}
.page .card:hover{transform:translateY(-6px);box-shadow:var(--sh-lift)!important;}
.page .card-top{display:none!important;}
.card-photo{aspect-ratio:4/3;overflow:hidden;background:#F4F7FC;}
.card-photo img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease);}
.page .card:hover .card-photo img{transform:scale(1.04);}
.page .card:has(.card-photo) .card-ic{display:none;}
.page .am{font-weight:800;color:var(--ink);}
.why-ic{background:var(--blue-50)!important;color:var(--blue)!important;}
.results-sec{background:var(--navy-900)!important;}

/* ═══ Industries hub and pages ═══ */
.mkt-cta-strip{background:radial-gradient(110% 140% at 85% 30%,#0B2558 0%,var(--navy-900) 58%)!important;}
.so-ic{background:var(--blue-50)!important;color:var(--blue)!important;}
.so-ic i{color:var(--blue)!important;}

/* ═══ Pricing comparison ═══ */
.cmp-table th{background:var(--navy-900)!important;color:#fff!important;}
.cmp-table th.pop-col{background:var(--blue)!important;}
.cmp-table .pop-col{background:var(--blue-50)!important;}

/* ═══ Blog ═══ */
.cat-chip{border-radius:999px!important;}
.blog-content blockquote{border-left:3px solid var(--blue)!important;background:var(--sky)!important;}

@media(max-width:640px){
  /* pricing page: swipe between plans, the popular plan first */
  .pkg-w{display:grid!important;grid-auto-flow:column;grid-template-columns:none!important;grid-auto-columns:86%;gap:14px!important;overflow-x:auto;scroll-snap-type:x mandatory;
    scrollbar-width:none;margin:0 -24px;padding:22px 24px 8px;scroll-padding:0 24px;align-items:stretch;max-width:none!important;}
  .pkg-w::-webkit-scrollbar{display:none;}
  .pkg-w .pkg{scroll-snap-align:start;opacity:1;transform:none!important;margin:0!important;}
  .pkg-w .pkg.pop{order:-1;}
  .pkg-sec{padding-top:36px!important;}
  /* services hub: shorter cards */
  .card-photo{aspect-ratio:16/10;}
  .svh{padding:104px 0 52px;}.mhero{padding-top:104px!important;padding-bottom:56px!important;}}

/* ═══ Service page: "Why it matters" + the one price, in a sticky side card ═══ */
.sn{padding:96px 0;background:linear-gradient(180deg,#fff 0%,#F4F8FD 100%);}
.sn-in{max-width:1240px;margin:0 auto;padding:0 24px;display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:56px;align-items:start;}
.sn-main h2{margin:16px 0 18px;font:800 clamp(28px,3.2vw,44px)/1.1 var(--f);letter-spacing:-.02em;color:var(--ink);max-width:22ch;}
.sn-lead{margin:0 0 40px;font-size:18px;line-height:1.7;color:var(--ink-2);max-width:62ch;}
.sn-h{margin:0 0 16px;font:700 19px/1.3 var(--f);color:var(--ink);}
.sn-signs{list-style:none;margin:0 0 44px;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;counter-reset:none;}
.sn-signs li{display:grid;grid-template-columns:46px minmax(0,1fr);gap:14px;align-items:start;padding:18px;background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:var(--sh-card);
  transition:transform .4s var(--ease),box-shadow .4s var(--ease),border-color .3s ease;}
.sn-signs li:hover{transform:translateY(-4px);box-shadow:var(--sh-lift);border-color:#C9D9F5;}
.sn-num{width:46px;height:46px;border-radius:12px;display:grid;place-items:center;background:var(--blue-50);color:var(--blue-600);font:800 16px/1 var(--f);}
.sn-signs p{margin:0;font-size:15.5px;line-height:1.55;color:var(--ink);font-weight:500;align-self:center;}
.sn-compare{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-bottom:34px;}
.sn-col{padding:26px;border-radius:18px;}
.sn-col h3{display:flex;align-items:center;gap:12px;margin:0 0 16px;font:800 18px/1.2 var(--f);}
.sn-col h3 span{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;font-size:15px;}
.sn-col ul{list-style:none;margin:0;padding:0;display:grid;gap:12px;}
.sn-col li{position:relative;padding-left:26px;font-size:15.5px;line-height:1.55;}
.sn-col li::before{position:absolute;left:0;top:1px;font:900 13px/1.6 "Font Awesome 6 Free";}
.sn-without{background:#F5F6F9;border:1px solid #E6E9F0;color:var(--ink-2);}
.sn-without h3{color:var(--ink-2);}
.sn-without h3 span{background:#FDE8E8;color:#C93A3A;}
.sn-without li::before{content:"\f00d";color:#D25555;}
.sn-with{background:radial-gradient(120% 100% at 100% 0%,#14336F 0%,var(--navy-900) 65%);color:#fff;box-shadow:0 30px 60px -32px rgba(6,17,39,.7);}
.sn-with h3{color:#fff;}
.sn-with h3 span{background:rgba(34,197,94,.18);color:#4ADE80;}
.sn-with li{color:rgba(255,255,255,.88);}
.sn-with li::before{content:"\f00c";color:#4ADE80;}
.sn-close{margin:0;padding:20px 24px;border-left:3px solid var(--blue);background:#fff;border-radius:0 14px 14px 0;font:600 17px/1.55 var(--f);color:var(--ink);box-shadow:var(--sh-card);}

.sn-aside{position:sticky;top:calc(var(--hn-h,72px) + 24px);}
.sn-card{position:relative;padding:28px;border-radius:22px;background:#fff;border:1px solid var(--line);box-shadow:0 30px 60px -30px rgba(10,26,61,.35);overflow:hidden;}
.sn-card::before{content:"";position:absolute;inset:0 0 auto 0;height:4px;background:linear-gradient(90deg,var(--blue),#7FB0FF);}
.sn-card-tag{display:inline-flex;padding:5px 12px;border-radius:999px;background:var(--blue-50);color:var(--blue-600);font:700 12px/1.2 var(--f);margin-bottom:16px;}
.sn-card small{display:block;font:600 13px/1.2 var(--f);color:var(--muted);}
.sn-amt{margin:6px 0 12px;font:800 40px/1 var(--f);letter-spacing:-.02em;color:var(--ink);}
.sn-card > p{margin:0 0 18px;font-size:14.5px;line-height:1.6;color:var(--ink-2);}
.sn-btn{width:100%;justify-content:center;padding:14px 18px;margin-bottom:10px;}
.sn-card-pts{list-style:none;margin:10px 0 0;padding:16px 0 0;border-top:1px solid var(--line);display:grid;gap:10px;}
.sn-card-pts li{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--ink-2);}
.sn-card-pts i{width:16px;color:var(--blue);}
@media(max-width:1024px){
  .sn-in{grid-template-columns:minmax(0,1fr);gap:36px;}
  .sn-aside{position:static;max-width:520px;}
}
@media(max-width:640px){
  .sn{padding:60px 0;}
  .sn-main h2{font-size:28px;}
  .sn-lead{font-size:16px;margin-bottom:30px;}
  .sn-signs,.sn-compare{grid-template-columns:minmax(0,1fr);}
  .sn-col{padding:22px;}
  .sn-amt{font-size:34px;}
}
@media (prefers-reduced-motion: reduce){.sn-signs li{transition:none;}}

/* ═══ Service page hero: full width, bigger photo card, staggered entrance ═══ */
.hero{padding:128px 24px 96px!important;}
.hero .hero-inner{max-width:1240px;grid-template-columns:minmax(0,1fr) minmax(0,470px);gap:64px;}
.hero h1{font-size:clamp(34px,4.4vw,58px)!important;line-height:1.06!important;margin-bottom:16px!important;}
.hero .hero-tag,.hero .hero-short{font-size:17.5px;line-height:1.6;color:rgba(255,255,255,.8);max-width:56ch;}
.hero .hf{font-size:14px;padding:9px 13px;}
.hero::after{content:"";display:block!important;position:absolute;right:-8%;top:-30%;width:60%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(8,102,255,.32),transparent 65%);pointer-events:none;animation:lpDriftS 18s ease-in-out infinite alternate;}
@keyframes lpDriftS{to{transform:translate(-50px,40px) scale(1.06);}}
.hero .svc-pack{transform:rotate(-1.2deg);transition:transform .6s var(--ease),box-shadow .6s var(--ease);box-shadow:0 40px 80px -36px rgba(0,0,0,.75);}
.hero .svc-pack:hover{transform:rotate(0) translateY(-4px);}
.hero-inner > div:first-child > *:not(h1){animation:heroUp .8s var(--ease) both;}
.hero-inner > div:first-child > *:nth-child(2){animation-delay:.05s;}
.hero-inner > div:first-child > *:nth-child(4){animation-delay:.12s;}
.hero-inner > div:first-child > *:nth-child(5){animation-delay:.18s;}
.hero-inner > div:first-child > *:nth-child(6){animation-delay:.24s;}
.hero-inner > div:first-child > *:nth-child(7){animation-delay:.3s;}
.hero-inner > div:first-child > h1{animation:heroUpT .9s var(--ease) both;}
.hero-right{animation:heroIn 1s var(--ease) .15s both;}
@keyframes heroUp{from{opacity:0;transform:translateY(16px);}}
@keyframes heroUpT{from{transform:translateY(16px);}}
@keyframes heroIn{from{opacity:0;transform:translateY(24px) scale(.98);}}
.sec-inner{max-width:1120px!important;}
@media(max-width:1024px){.hero .hero-inner{grid-template-columns:minmax(0,1fr);gap:40px;}.hero .hero-right{max-width:480px;}}
@media(max-width:760px){.hero .hero-right{display:block!important;}.hero{padding:104px 20px 64px!important;}.hero .svc-pack{transform:none;}}
@media (prefers-reduced-motion: reduce){.hero::after,.hero-inner > div:first-child > *,.hero-right{animation:none!important;}.hero .svc-pack{transform:none;}}

/* contrast: white buttons on the service page use the darker blue */
.faq-cta a,.cta-final .bw{color:var(--blue-600)!important;}

/* ═══ Inner pages: motion and polish (heroes, cards, forms) ═══ */
/* pale page heroes: a slow drifting light, and the hero content rises in */
.ph-hero{position:relative;overflow:hidden;
  background:radial-gradient(40% 70% at 12% 20%,rgba(8,102,255,.12),transparent 70%),radial-gradient(35% 60% at 88% 80%,rgba(91,155,255,.14),transparent 70%),linear-gradient(180deg,#EEF4FD 0%,#F7FAFE 100%)!important;
  background-size:140% 140%,140% 140%,100% 100%!important;animation:phAurora 16s ease-in-out infinite alternate;}
@keyframes phAurora{to{background-position:30% 20%,70% 60%,0 0;}}
.ph-hero .container > *,.mkt-hero .container > *,.blogs-hero .container > *,.pr-hero .container > *,.svh .container > *,.mhero-inner > *,.blog-hero > * > *{animation:pgUp .8s var(--ease) both;}
.ph-hero .container > *:nth-child(2),.mkt-hero .container > *:nth-child(2),.blogs-hero .container > *:nth-child(2),.pr-hero .container > *:nth-child(2),.svh .container > *:nth-child(2),.mhero-inner > *:nth-child(2){animation-delay:.07s;}
.ph-hero .container > *:nth-child(3),.mkt-hero .container > *:nth-child(3),.blogs-hero .container > *:nth-child(3),.pr-hero .container > *:nth-child(3),.svh .container > *:nth-child(3),.mhero-inner > *:nth-child(3){animation-delay:.14s;}
.ph-hero .container > *:nth-child(n+4),.mkt-hero .container > *:nth-child(n+4),.blogs-hero .container > *:nth-child(n+4),.pr-hero .container > *:nth-child(n+4),.svh .container > *:nth-child(n+4),.mhero-inner > *:nth-child(n+4){animation-delay:.21s;}
@keyframes pgUp{from{opacity:0;transform:translateY(18px);}}
.ph-h1,.mkt-hero h1,.blogs-hero h1,.svh h1{animation-name:pgUpT!important;}
@keyframes pgUpT{from{transform:translateY(18px);}}

/* cards that rise in as you scroll (class added by footer.php) and lift on hover */
.ar{opacity:0;transform:translateY(28px) scale(.985);transition:opacity .7s ease,transform .9s var(--ease),box-shadow .4s ease,border-color .3s ease;transition-delay:calc(var(--n,0) * 70ms);}
.ar.vb{opacity:1;transform:none;}
.ar.vb:hover{transition-delay:0s;}
.mkt-card,.val-card,.ct-card,.hours-card,.blog-card,.pkg,.mz-opt,.pr-channel-card,.gs-side-card,.why-card,.side-card,.rel-item,.feat-item,.page .card{transition:transform .45s var(--ease),box-shadow .45s var(--ease),border-color .3s ease,opacity .7s ease!important;}
.val-card:hover,.ct-card:hover,.hours-card:hover,.blog-card:hover,.mz-opt:hover,.pr-channel-card:hover,.gs-side-card:hover,.why-card:hover,.side-card:hover{transform:translateY(-6px);box-shadow:var(--sh-lift);border-color:#C9D9F5;}

/* one accent: industry cards, values icons, blog and get-started heroes */
.mkt-card{--cc:#0866FF!important;}
.mkt-card:hover{border-color:#C9D9F5!important;box-shadow:var(--sh-lift)!important;}
.mkt-card-tag{color:var(--blue-600)!important;}
.mkt-btn{background:var(--blue)!important;color:#fff!important;border-radius:var(--r-btn)!important;}
.mkt-btn:hover{background:var(--blue-600)!important;}
.val-ic{background:linear-gradient(135deg,#0866FF,#3D8BFF)!important;color:#fff!important;box-shadow:0 12px 24px -12px rgba(8,102,255,.7);}
.blog-hero{background:radial-gradient(110% 130% at 85% 20%,#0E2A63 0%,var(--navy-900) 58%)!important;}
.gs-hero{background:radial-gradient(110% 130% at 85% 20%,#14336F 0%,var(--navy-900) 60%)!important;box-shadow:0 30px 70px -40px rgba(6,17,39,.7)!important;}


@media (prefers-reduced-motion: reduce){
  .ph-hero{animation:none;}
  .ph-hero .container > *,.mkt-hero .container > *,.blogs-hero .container > *,.pr-hero .container > *,.svh .container > *,.mhero-inner > *,.blog-hero > * > *{animation:none!important;}
  .ar{opacity:1;transform:none;transition:none;}
}
.mkt-card-img{height:200px!important;}
.mkt-card-img img{object-position:center 28%;}

/* ═══ Page top photos (sitePagePhoto): photo on the right, fading into the band; a card under the text on phones ═══ */
.has-photo{position:relative;overflow:hidden;}
.has-photo > .container{position:relative;z-index:1;}
.pg-photo{position:absolute;top:0;right:0;bottom:0;width:46%;z-index:0;pointer-events:none;animation:pgPhoto 1.1s var(--ease) .1s both;}
.pg-photo img{width:100%;height:100%;object-fit:cover;object-position:center;display:block;-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 34%);mask-image:linear-gradient(90deg,transparent 0%,#000 34%);}
.svh .pg-photo::after,.mkt-hero .pg-photo::after,.blogs-hero .pg-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(6,17,39,.55) 0%,rgba(6,17,39,0) 55%);}
@keyframes pgPhoto{from{opacity:0;transform:translateX(24px);}}
@media(min-width:901px){
  .has-photo .container > *{max-width:min(620px,52%);}
  .ph-hero.has-photo .container,.mkt-hero.has-photo .container{text-align:left!important;}
  .ph-hero.has-photo .container > *,.mkt-hero.has-photo .container > *{margin-left:0!important;margin-right:auto!important;}
  .ph-hero.has-photo .ph-btns,.ph-hero.has-photo [class*="btns"],.mkt-hero.has-photo [class*="btns"]{justify-content:flex-start!important;}
  .ph-hero.has-photo,.wk-hero.has-photo{min-height:min(560px,70vh);display:flex;align-items:center;}
  .ph-hero.has-photo > .container,.wk-hero.has-photo > .container{width:100%;}
}
@media(max-width:900px){
  .pg-photo{position:relative;width:auto;margin:28px 24px 0;aspect-ratio:16/10;border-radius:18px;overflow:hidden;box-shadow:0 24px 48px -26px rgba(10,26,61,.45);}
  .pg-photo img{-webkit-mask-image:none;mask-image:none;}
  .svh .pg-photo::after,.mkt-hero .pg-photo::after,.blogs-hero .pg-photo::after{display:none;}
}
@media (prefers-reduced-motion: reduce){.pg-photo{animation:none;}}
/* heroes whose content wrapper is not .container */
.has-photo > .mkt-hero-in,.has-photo > .blogs-shell{position:relative;z-index:1;}
@media(min-width:901px){
  .mkt-hero.has-photo{text-align:left;padding-left:max(24px,calc((100vw - 1240px) / 2 + 24px));padding-top:128px;padding-bottom:88px;}
  .mkt-hero.has-photo .mkt-hero-in{margin:0;max-width:min(600px,50%);}
  .mkt-hero.has-photo p{margin-left:0;}
  .blogs-hero.has-photo .blogs-shell > *{max-width:min(600px,52%);}
}
