/* buildcontrol — Shared layout for the module detail pages. */
.fhero{background:var(--screen-bg-alt);border-bottom:1px solid var(--n-150);padding:66px 0 60px;position:relative;overflow:hidden}
.fhero::before{content:"";position:absolute;inset:0;background-image:linear-gradient(var(--n-150) 1px,transparent 1px),linear-gradient(90deg,var(--n-150) 1px,transparent 1px);background-size:44px 44px;opacity:.34;-webkit-mask-image:radial-gradient(ellipse 60% 90% at 92% 25%,#000 0%,transparent 72%);mask-image:radial-gradient(ellipse 60% 90% at 92% 25%,#000 0%,transparent 72%)}
.fhero-in{position:relative;display:grid;grid-template-columns:1fr;gap:0;align-items:center}
.fhero h1{max-width:820px;font-family:var(--f-header);font-weight:700;font-size:40px;line-height:1.14;letter-spacing:-.02em;color:var(--navy-900);margin:0 0 16px}
.fhero p{font-size:17px;color:var(--n-600);max-width:680px;margin-bottom:28px}
.fhero-btns{display:flex;gap:12px;flex-wrap:wrap}
.btn-p{display:inline-flex;align-items:center;height:50px;padding:0 26px;border-radius:var(--r-md);background:var(--brand-grad);color:#fff;font-family:var(--f-header);font-weight:600;font-size:15px;box-shadow:0 4px 14px rgba(31,88,174,.28);transition:filter .15s ease,transform .08s ease}
.btn-p:hover{filter:brightness(1.06)}.btn-p:active{transform:translateY(1px)}
.btn-s{display:inline-flex;align-items:center;height:50px;padding:0 24px;border-radius:var(--r-md);background:#fff;border:1px solid var(--n-200);color:var(--navy-900);font-family:var(--f-header);font-weight:600;font-size:15px;transition:border-color .15s ease}
.btn-s:hover{border-color:var(--brand-600);color:var(--brand-700)}
/* hero mock */














@media(max-width:900px){.fhero-in{grid-template-columns:1fr;gap:40px}}
@media(max-width:640px){.fhero{padding:48px 0 44px}.fhero h1{font-size:29px}.fhero p{font-size:16px}}

.fsec{padding:66px 0}
.fsec-alt{background:var(--screen-bg-alt)}
.fsec-head{max-width:620px;margin:0 auto 44px;text-align:center}
.fsec-head h2{font-family:var(--f-header);font-weight:700;font-size:29px;letter-spacing:-.015em;color:var(--navy-900);margin-bottom:12px}
.fsec-head p{font-size:16px;color:var(--n-600)}
@media(max-width:640px){.fsec{padding:50px 0}.fsec-head h2{font-size:24px}}

.fgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.fcard{background:#fff;border:1px solid var(--n-150);border-radius:var(--r-xl);box-shadow:var(--shadow-2);padding:26px;transition:transform .18s ease,box-shadow .18s ease}
.fcard:hover{transform:translateY(-3px);box-shadow:var(--shadow-3)}
.fcard-ic{width:44px;height:44px;border-radius:var(--r-lg);background:var(--info-bg);display:grid;place-items:center;margin-bottom:14px}
.fcard-ic svg{width:21px;height:21px;fill:var(--brand-700)}
.fcard h3{font-family:var(--f-header);font-weight:600;font-size:16.5px;color:var(--navy-900);margin-bottom:7px}
.fcard p{font-size:14px;color:var(--n-500);line-height:1.55}
@media(max-width:900px){.fgrid{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.fgrid{grid-template-columns:1fr}}

/* benefits */
.fben{display:grid;grid-template-columns:repeat(3,1fr);gap:34px;max-width:960px;margin:0 auto}
.fben-item{text-align:center}
.fben-n{font-family:var(--f-header);font-weight:700;font-size:15px;color:var(--brand-700);width:44px;height:44px;border-radius:50%;background:var(--info-bg);display:grid;place-items:center;margin:0 auto 14px}
.fben-item h3{font-family:var(--f-header);font-weight:600;font-size:17px;color:var(--navy-900);margin-bottom:8px}
.fben-item p{font-size:14.5px;color:var(--n-500);line-height:1.6}
@media(max-width:760px){.fben{grid-template-columns:1fr;gap:28px;max-width:420px}}

/* faq */
.ffaq{max-width:740px;margin:0 auto}
.ff-item{background:#fff;border:1px solid var(--n-150);border-radius:var(--r-lg);box-shadow:var(--shadow-2);margin-bottom:12px;overflow:hidden}
.ff-q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px;text-align:left;background:none;border:none;cursor:pointer;padding:20px 22px;font-family:var(--f-header);font-weight:600;font-size:15.5px;color:var(--navy-900);transition:background .15s ease}
.ff-q:hover{background:var(--n-50)}
.ff-ic{flex:none;width:26px;height:26px;border-radius:50%;background:var(--info-bg);display:grid;place-items:center;transition:transform .22s ease,background .15s ease}
.ff-ic svg{width:13px;height:13px;fill:var(--brand-700)}
.ff-item.open .ff-ic{transform:rotate(45deg);background:var(--brand-600)}
.ff-item.open .ff-ic svg{fill:#fff}
.ff-a{max-height:0;overflow:hidden;transition:max-height .28s ease}
.ff-a-in{padding:0 22px 20px;font-size:14.8px;color:var(--n-600);line-height:1.68}

/* related */
.frel{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;max-width:820px;margin:0 auto}
.frel a{display:inline-flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--n-150);border-radius:var(--r-full);padding:9px 16px;font-family:var(--f-header);font-weight:600;font-size:13.5px;color:var(--navy-900);transition:border-color .15s ease,color .15s ease}
.frel a:hover{border-color:var(--brand-600);color:var(--brand-700)}
.frel a svg{width:15px;height:15px;fill:var(--brand-700)}

/* cta */
.fcta{padding:66px 0}
.fcta-in{background:var(--header-grad);border-radius:24px;padding:50px 40px;text-align:center;position:relative;overflow:hidden}
.fcta-in::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px);background-size:38px 38px}
.fcta-in>*{position:relative}
.fcta-in h2{font-family:var(--f-header);font-weight:700;font-size:29px;color:#fff;letter-spacing:-.015em;margin-bottom:12px}
.fcta-in p{font-size:16px;color:var(--text-on-dark);opacity:.9;max-width:460px;margin:0 auto 26px}
.fcta-btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.btn-l{display:inline-flex;align-items:center;height:50px;padding:0 26px;border-radius:var(--r-md);background:#fff;color:var(--brand-700);font-family:var(--f-header);font-weight:600;font-size:15px}
.btn-l:hover{filter:brightness(.97)}
.btn-g{display:inline-flex;align-items:center;height:50px;padding:0 26px;border-radius:var(--r-md);background:transparent;border:1.5px solid rgba(255,255,255,.5);color:#fff;font-family:var(--f-header);font-weight:600;font-size:15px;transition:background .15s ease}
.btn-g:hover{background:rgba(255,255,255,.12)}
@media(max-width:640px){.fcta-in{padding:38px 24px}.fcta-in h2{font-size:23px}}

/* ---------- hero card (homepage style) ---------- */
.fhx{position:relative;min-height:430px;display:flex;align-items:center;justify-content:center;padding:34px 0 30px}
.fhx-card{position:relative;width:100%;max-width:440px;background:#fff;border-radius:18px;
  box-shadow:var(--shadow-3);overflow:hidden;border:1px solid var(--n-150)}
.fhx-top{background:var(--header-grad);padding:16px 18px;display:flex;align-items:center;justify-content:space-between}
.fhx-l{display:flex;align-items:center;gap:10px}
.fhx-av{width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.16);display:grid;place-items:center;
  font-family:var(--f-header);font-weight:700;font-size:13px;color:#fff}
.fhx-t{font-family:var(--f-header);font-weight:700;font-size:14px;color:#fff;line-height:1.25}
.fhx-t small{display:block;font-weight:400;font-size:11px;color:#B7C8DE}

.fhx-body{padding:18px}
.fhx-kpis{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;margin-bottom:16px}
.fhx-kpi{background:var(--n-50);border-radius:10px;padding:12px 10px;text-align:center}
.fhx-kpi .k{font-family:var(--f-header);font-weight:700;font-size:19px;color:var(--navy-900)}
.fhx-kpi .l{font-size:10.5px;color:var(--n-500);margin-top:2px}
.fhx-row{display:flex;align-items:center;gap:11px;padding:11px 0;border-bottom:1px solid var(--n-100)}
.fhx-row:last-child{border-bottom:none}
.fhx-ic{width:34px;height:34px;border-radius:9px;background:var(--info-bg);display:grid;place-items:center;flex:none}
.fhx-ic svg{width:18px;height:18px;fill:var(--info)}
.fhx-ic.g{background:var(--success-bg)}.fhx-ic.g svg{fill:var(--success)}
.fhx-ic.w{background:var(--warning-bg)}.fhx-ic.w svg{fill:var(--warning)}
.fhx-tx{flex:1;min-width:0}
.fhx-tx .t{font-family:var(--f-header);font-weight:600;font-size:13.5px;color:var(--navy-900)}
.fhx-tx .s{font-size:11.5px;color:var(--n-500);margin-top:1px}
.fhx-b{font-family:var(--f-header);font-weight:600;font-size:11px;padding:3px 10px;border-radius:var(--r-full);
  white-space:nowrap;position:relative}
.fhx-b.done{background:var(--success-bg);color:var(--success)}
.fhx-b.prog{background:var(--info-bg);color:var(--info)}
.fhx-b.wait{background:var(--warning-bg);color:var(--warning)}
.fhx-chip{position:absolute;background:#fff;border-radius:12px;box-shadow:var(--shadow-2);padding:9px 13px;
  display:flex;align-items:center;gap:9px;z-index:3;white-space:nowrap}
.fhx-chip .ff{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;flex:none}
.fhx-chip .ff svg{width:16px;height:16px;fill:#fff}
.fhx-chip .ft b{display:block;font-family:var(--f-header);font-weight:700;font-size:12.5px;color:var(--navy-900);line-height:1.2}
.fhx-chip .ft span{font-size:10.5px;color:var(--n-500)}
.fhx-c1{top:-6px;right:-14px}.fhx-c1 .ff{background:var(--success)}
.fhx-c2{bottom:-6px;left:-18px}.fhx-c2 .ff{background:var(--brand-600)}
@media(max-width:1040px){.fhx-c1{right:-4px}.fhx-c2{left:-4px}}
@media(max-width:900px){.fhx{min-height:0}.fhx-chip{position:static;margin:10px auto 0;width:max-content}}

/* ---------- live data sequence ---------- */
@keyframes fx-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@keyframes fx-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
@keyframes fx-count{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
@keyframes fx-rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@keyframes fx-chip{from{opacity:0;transform:translateY(8px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes fx-pulse{0%,100%{box-shadow:0 0 0 0 rgba(45,107,200,.3)}50%{box-shadow:0 0 0 6px rgba(45,107,200,0)}}
@keyframes fx-flipbg{0%,55%{background:var(--warning-bg);color:var(--warning)}
                     70%,100%{background:var(--success-bg);color:var(--success)}}
@keyframes fx-out{0%,55%{opacity:1}70%,100%{opacity:0}}
@keyframes fx-on{0%,55%{opacity:0}70%,100%{opacity:1}}

.fhx-card{animation:fx-in .55s cubic-bezier(.2,.7,.3,1) both}
.fhx-kpi .k{animation:fx-count .5s cubic-bezier(.2,.7,.3,1) both}
.fhx-kpi:nth-child(1) .k{animation-delay:.45s}
.fhx-kpi:nth-child(2) .k{animation-delay:.62s}
.fhx-kpi:nth-child(3) .k{animation-delay:.79s}
.fhx-row{animation:fx-rise .5s cubic-bezier(.2,.7,.3,1) both}
.fhx-row:nth-child(1){animation-delay:1.0s}
.fhx-row:nth-child(2){animation-delay:1.17s}
.fhx-row:nth-child(3){animation-delay:1.34s}
.fhx-chip{animation:fx-chip .5s cubic-bezier(.2,.7,.3,1) both}
.fhx-c1{animation:fx-chip .5s cubic-bezier(.2,.7,.3,1) 1.6s both,fx-bob 4.2s ease-in-out 2.4s infinite}
.fhx-c2{animation:fx-chip .5s cubic-bezier(.2,.7,.3,1) 1.78s both,fx-bob 4.8s ease-in-out 3.1s infinite}
.fhx-c1 .ff{animation:fx-pulse 2.8s ease-out 2.6s infinite}
/* the beat: last row status flips */
.fhx-flip .fhx-b{animation:fx-flipbg 1.6s ease-in-out 2.6s both}
.fhx-flip .fhx-b .w1{animation:fx-out 1.6s ease-in-out 2.6s both}
.fhx-flip .fhx-b .w2{position:absolute;left:10px;top:3px;animation:fx-on 1.6s ease-in-out 2.6s both}

@media(prefers-reduced-motion:reduce){
  .fhx-card,.fhx-kpi .k,.fhx-row,.fhx-chip,.fhx-c1,.fhx-c2,.fhx-c1 .ff,
  .fhx-flip .fhx-b,.fhx-flip .fhx-b .w1,.fhx-flip .fhx-b .w2{animation:none!important}
  .fhx-flip .fhx-b .w2{display:none}
}

.tldr{max-width:760px;margin:0 auto;padding:20px 24px;background:#F5F9FE;border:1px solid #CFE0F6;
  border-left:4px solid #2D6BC8;border-radius:0 12px 12px 0}
.tldr .lab{font-family:var(--f-header);font-weight:700;font-size:11px;letter-spacing:.12em;
  text-transform:uppercase;color:#1F58AE;margin-bottom:7px}
.tldr p{font-size:15.5px;line-height:1.6;color:#2A2E33;margin:0}
.tldr-wrap{padding:26px 0 0;background:var(--screen-bg-alt)}

.fps{padding:64px 0;background:#fff}
.fps-head{max-width:640px;margin:0 auto 40px;text-align:center}
.fps-head .eyebrow{display:inline-flex;font-family:var(--f-header);font-weight:600;font-size:12.5px;
  letter-spacing:.14em;text-transform:uppercase;color:#1F58AE;margin-bottom:12px}
.fps-head h2{font-family:var(--f-header);font-weight:700;font-size:29px;line-height:1.2;
  color:var(--navy-900);letter-spacing:-.015em}
.fps-head p{font-size:15px;line-height:1.6;color:var(--n-600);margin-top:11px}
.fps-cmp{position:relative;max-width:960px;margin:0 auto;display:grid;
  grid-template-columns:1fr 1fr;gap:22px;align-items:stretch}
.fps-col{position:relative;border-radius:20px;padding:30px 30px 26px}
.fps-before{background:var(--n-50);border:1px solid var(--n-150)}
.fps-after{background:var(--header-grad);box-shadow:0 26px 60px rgba(9,32,64,.26);overflow:hidden}
.fps-after::before{content:"";position:absolute;inset:0;opacity:.09;
  background-image:linear-gradient(#fff 1px,transparent 1px),linear-gradient(90deg,#fff 1px,transparent 1px);
  background-size:52px 52px}
.fps-hd{position:relative;display:flex;align-items:center;gap:12px;padding-bottom:18px;margin-bottom:20px;
  border-bottom:1px solid var(--n-150)}
.fps-after .fps-hd{border-bottom-color:rgba(255,255,255,.18)}
.fps-hd .ic{flex:none;width:34px;height:34px;border-radius:11px;display:grid;place-items:center}
.fps-hd .ic svg{width:16px;height:16px}
.fps-before .fps-hd .ic{background:#FBEAE8}
.fps-before .fps-hd .ic svg{fill:#C7443C}
.fps-after .fps-hd .ic{background:rgba(255,255,255,.16)}
.fps-after .fps-hd .ic svg{fill:#fff}
.fps-hd b{display:block;font-family:var(--f-header);font-weight:700;font-size:16.5px;letter-spacing:-.01em}
.fps-hd small{display:block;margin-top:3px;font-size:12px}
.fps-before .fps-hd b{color:var(--navy-900)}
.fps-before .fps-hd small{color:var(--n-500)}
.fps-after .fps-hd b{color:#fff}
.fps-after .fps-hd small{color:#B9CCE4}
.fps-col ul{position:relative;list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:16px}
.fps-col li{display:flex;gap:12px;font-size:14.6px;line-height:1.58}
.fps-col li i{flex:none;width:19px;height:19px;border-radius:50%;margin-top:2px;display:grid;place-items:center}
.fps-col li i svg{width:11px;height:11px}
.fps-before li{color:var(--n-600)}
.fps-before li i{background:#F3DBD8}
.fps-before li i svg{fill:#C7443C}
.fps-after li{color:#E7EFFA}
.fps-after li i{background:rgba(255,255,255,.18)}
.fps-after li i svg{fill:#fff}
.fps-arrow{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:2;
  width:44px;height:44px;border-radius:50%;background:#fff;border:1px solid var(--n-150);
  box-shadow:0 10px 26px rgba(11,40,80,.16);display:grid;place-items:center;color:var(--brand-700)}
.fps-arrow svg{width:20px;height:20px}
@media(prefers-reduced-motion:no-preference){
  .fps-after{transition:transform .25s ease,box-shadow .25s ease}
  .fps-after:hover{transform:translateY(-4px);box-shadow:0 32px 70px rgba(9,32,64,.30)}
}
@media(max-width:820px){
  .fps-cmp{grid-template-columns:1fr;gap:34px}
  .fps-arrow{position:static;justify-self:center;transform:rotate(90deg);margin:-6px 0}
  .fps-col{padding:26px 22px 24px}
}