@charset "UTF-8";
/* ═══════════════════════════════════════════════════════════════════════════
   Fortax Sealed Vault — UI

   Ye apna alag design system NAHI hai. Pehle yahan apna palette, apna font aur
   ek cream gradient ground tha — nateeja ye ki vault baaki app se ek alag
   dweep jaisa lagta tha: app green hai, vault blue tha; app ka apna ground hai,
   vault ne uske upar apna daal diya tha.

   Ab saare rang, font aur radius app ke tokens se aate hain (templates/app.php
   aur ca.php me define hain). Neeche ke --v-* sirf alias hain, taaki class
   naam wahi rahein par rang app ka ho. Sirf wahi cheezein yahan define hoti
   hain jo vault ke liye nayi hain — credit card, skeleton, dot field.
   ═══════════════════════════════════════════════════════════════════════ */

:root, [data-theme="dark"]{
  --v-bg0:var(--bg);      --v-bg1:var(--bg3);    --v-bg2:var(--bg3);
  --v-panel:var(--surface);
  --v-ink:var(--t1);      --v-ink2:var(--t2);    --v-ink3:var(--t3);
  --v-line:var(--bdr);    --v-line2:var(--bdr-h);
  --v-ac:var(--ac);       --v-ac2:var(--ac2);
  --v-ok:var(--green);    --v-bad:var(--red);    --v-warn:var(--gold);
  --v-font:var(--font);   --v-mono:var(--mono);
  --v-r:var(--r);
  --phi:1.618;            /* golden ratio — card aur grid gap isi se */
}

/* Ground app ka hi hai. Vault ko koi alag background nahi chahiye — wahi wajah
   thi ki page bahar se chipkaya hua lagta tha. */
.fx-ground{font-family:var(--font);color:var(--t1)}

/* ── Brand: 'o' ki jagah rose curve ───────────────────────────────────── */
.fx-logo{display:inline-flex;align-items:center;gap:1px;font-weight:650;letter-spacing:.08em;font-size:15px}
.fx-logo-t{line-height:1}
.fx-logo-mark{display:inline-flex;margin:0 .5px}
/* Disc lagataar, bahut dheere ghoomta hai. Golden-angle spiral is speed par
   saaf padhti hai bina dhyan bhataye. Hover par thoda tez. */
.fx-rose{display:block;animation:fxspin 46s linear infinite}
.fx-logo:hover .fx-rose{animation-duration:9s}
@keyframes fxspin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){ .fx-rose{animation:none} .fx-logo:hover .fx-rose{animation:none} }

.fx-i{flex-shrink:0;vertical-align:-.15em}

/* ── Language switcher ─────────────────────────────────────────────────── */
.fx-lang{display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border:1px solid var(--v-line);
  border-radius:9px;background:var(--v-panel);color:var(--v-ink2);font-size:12px}
.fx-lang select{border:0;background:none;color:inherit;font:inherit;cursor:pointer;outline:none;padding-right:2px}

/* ── Skeleton ──────────────────────────────────────────────────────────
   Layout content aane se pehle hi apni jagah le leta hai, isliye kuch
   khiskta nahi. prefers-reduced-motion par shimmer ruk jaata hai. */
.fx-skel{display:block;border-radius:7px;position:relative;overflow:hidden;
  background:linear-gradient(90deg,var(--v-line) 0%,var(--v-bg1) 40%,var(--v-line) 80%);
  background-size:280% 100%;animation:fxsk 1.35s ease-in-out infinite}
@keyframes fxsk{0%{background-position:180% 0}100%{background-position:-60% 0}}
@media (prefers-reduced-motion:reduce){ .fx-skel{animation:none;background:var(--v-line)} }
.fx-skel + .fx-skel{margin-top:8px}
.fx-skel-card{background:var(--v-panel);border:1px solid var(--v-line);border-radius:var(--v-r);padding:18px}
[hidden]{display:none!important}

/* ── Vault card: front + back, flip ────────────────────────────────────
   Brand ke diye SVG assets par bana hai (assets/card/*.svg). Card dono theme
   me safed rehta hai — ye ek bhautik card ka metaphor hai, aur asli card dark
   mode me rang nahi badalta; sirf uske neeche ki chhaya theme ke saath baithti
   hai. */
.fx-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(380px,1fr));gap:calc(12px * var(--phi))}

.fx-flip{perspective:1600px;aspect-ratio:var(--phi);container-type:inline-size}
.fx-flip-in{position:relative;width:100%;height:100%;transform-style:preserve-3d;
  transition:transform .72s cubic-bezier(.3,.8,.3,1)}
.fx-flip.on .fx-flip-in{transform:rotateY(180deg)}
@media (prefers-reduced-motion:reduce){.fx-flip-in{transition:none}}

.fx-face,.fx-face *{text-decoration:none}
.fx-face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;
  border-radius:18px;overflow:hidden;background:#FFFFFF;color:#14263A;
  /* Front face ek <a> hai; iske bina poora card underline ho jaata hai */
  text-decoration:none;
  border:1px solid #E7E9EC;
  box-shadow:0 1px 2px rgba(20,38,58,.06), 0 16px 36px -18px rgba(20,38,58,.34);
  font-family:'Ubuntu',-apple-system,BlinkMacSystemFont,sans-serif;
  display:flex;flex-direction:column;padding:clamp(14px,4.2cqw,24px)}
[data-theme="dark"] .fx-face{box-shadow:0 1px 2px rgba(0,0,0,.45), 0 20px 46px -20px rgba(0,0,0,.8)}
.fx-face-b{transform:rotateY(180deg)}

/* F motif — dono taraf, kinare se kata hua */
.fx-motif{position:absolute;right:-10%;bottom:-18%;width:70%;z-index:0;pointer-events:none;opacity:1}
.fx-face-b .fx-motif{width:46%;right:-4%;bottom:-10%}
.fx-motif svg{width:100%;height:auto;display:block}

.fxc-body{position:relative;z-index:2;display:flex;flex-direction:column;height:100%}

/* ── front ── */
.fxc-word{font-weight:700;font-size:clamp(24px,7cqw,40px);letter-spacing:-.04em;line-height:.92;color:#14263A}
.fxc-word sup{font-size:.30em;font-weight:600;vertical-align:super;margin-left:.06em;letter-spacing:0}
.fxc-co{font-size:clamp(7px,1.85cqw,10px);letter-spacing:.2em;text-transform:uppercase;color:#14263A;
  font-weight:600;margin-top:8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fxc-rule{width:48px;height:1.5px;background:#14263A;opacity:.8;margin:10px 0}
.fxc-role{font-size:clamp(7.5px,1.95cqw,11px);letter-spacing:.2em;text-transform:uppercase;color:#46586C;font-weight:500}
.fxc-tag{text-align:right;flex-shrink:0}
.fxc-tag b{display:block;font-size:clamp(7px,1.78cqw,10px);letter-spacing:.17em;text-transform:uppercase;
  font-weight:600;color:#14263A;line-height:1.55}
.fxc-ready{font-size:clamp(6.5px,1.6cqw,9px);letter-spacing:.22em;text-transform:uppercase;color:#5B6C7E;margin-top:6px}
.fxc-tri{width:clamp(30px,8cqw,46px);height:auto;display:block;margin-left:auto}
.fxc-tri svg{width:100%;height:auto;display:block}

.fxc-nfc{display:flex;align-items:center;gap:12px;margin-top:auto;padding-top:12px}
.fxc-nfc-ic{width:clamp(22px,6cqw,34px);flex-shrink:0}
.fxc-nfc-ic svg{width:100%;height:auto;display:block}
.fxc-nfc-div{width:1px;align-self:stretch;background:#14263A;opacity:.2}
.fxc-nfc-t b{display:block;font-size:clamp(7.5px,1.95cqw,11px);letter-spacing:.14em;text-transform:uppercase;
  font-weight:600;color:#14263A;line-height:1.6}
.fxc-nfc-t span{display:block;font-size:clamp(6.5px,1.62cqw,9px);letter-spacing:.14em;text-transform:uppercase;
  color:#6B7C8E;margin-top:2px}

.fxc-btm{margin-top:clamp(10px,3.2cqw,18px)}
.fxc-name{font-size:clamp(14px,3.7cqw,22px);font-weight:700;letter-spacing:-.02em;color:#14263A;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fxc-num{font-family:var(--mono);font-size:clamp(8px,2cqw,11px);letter-spacing:.13em;color:#46586C;margin-top:2px}
.fxc-rule2{width:48px;height:1px;background:#14263A;opacity:.28;margin:9px 0 8px}
.fxc-meta{display:flex;flex-wrap:wrap}
.fxc-meta span{font-size:clamp(6.5px,1.6cqw,9px);letter-spacing:.15em;text-transform:uppercase;color:#5B6C7E}
.fxc-meta span + span::before{content:"|";margin:0 8px;opacity:.4}
.fxc-meta b{color:#14263A;font-weight:700}

/* ── back ── */
.fxb-top{display:flex;align-items:center;gap:clamp(10px,3cqw,18px);position:relative;z-index:2}
.fxb-div{width:1px;align-self:stretch;background:#14263A;opacity:.22}
.fxb-tag{font-size:clamp(7px,1.78cqw,10px);letter-spacing:.17em;text-transform:uppercase;
  font-weight:600;color:#14263A;line-height:1.55}
.fxb-ready{margin-left:auto;display:flex;align-items:center;gap:10px}
.fxb-ready u{text-decoration:none;font-size:clamp(7.5px,2cqw,11px);letter-spacing:.2em;text-transform:uppercase;
  font-weight:600;color:#14263A;white-space:nowrap}

/* magnetic stripe */
.fxb-stripe{position:relative;z-index:2;margin:clamp(10px,3cqw,16px) calc(-1 * clamp(14px,4.2cqw,24px)) 0;
  background:linear-gradient(180deg,#2C3238,#1B2026 45%,#24292F);height:clamp(30px,9cqw,54px);
  display:flex;align-items:center;justify-content:flex-end;padding-right:clamp(14px,4.2cqw,24px)}
.fxb-stripe u{text-decoration:none;font-size:clamp(6px,1.5cqw,8.5px);letter-spacing:.26em;text-transform:uppercase;
  color:rgba(255,255,255,.34);text-align:right;line-height:1.7;display:block}

/* QR + scan text ek unit hai; features usse alag hokar daayein baithte hain.
   Pehle sab ek hi flex row me the aur scan text 3 line me toot raha tha. */
.fxb-mid{display:flex;align-items:center;gap:clamp(10px,2.6cqw,16px);margin-top:clamp(10px,3cqw,18px);
  position:relative;z-index:2}
.fxc-qr{width:clamp(50px,13.5cqw,84px);height:auto;display:block;flex-shrink:0}
.fxb-scan{flex-shrink:0;min-width:clamp(74px,19cqw,118px)}
.fxb-scan b{display:block;font-size:clamp(7.5px,1.95cqw,11px);letter-spacing:.09em;text-transform:uppercase;
  font-weight:700;color:#14263A;white-space:nowrap}
.fxb-scan span{display:block;font-size:clamp(6.5px,1.6cqw,9px);color:#5B6C7E;margin-top:3px;line-height:1.5}

/* Reference card chauda hai aur usme chaar feature aate hain. Grid me card
   sankra ho jaata hai, isliye chautha feature tabhi dikhta hai jab jagah ho —
   warna wo card se bahar nikal jaata tha. */
.fxb-feats{display:flex;align-items:flex-start;margin-left:auto;gap:0;min-width:0;overflow:hidden}
.fxb-feat{text-align:center;padding:0 clamp(4px,1.3cqw,10px);border-left:1px solid rgba(20,38,58,.14);
  width:clamp(42px,11.5cqw,70px);flex-shrink:0}
.fxb-feat:first-child{border-left:0}
.fxb-feat i{display:block;width:clamp(16px,4.4cqw,26px);margin:0 auto clamp(5px,1.5cqw,9px)}
.fxb-feat i svg{width:100%;height:auto;display:block}
.fxb-feat u{text-decoration:none;font-size:clamp(5.5px,1.4cqw,8px);letter-spacing:.11em;text-transform:uppercase;
  color:#14263A;font-weight:600;line-height:1.45;display:block}

.fxb-btm{margin-top:auto;position:relative;z-index:2;display:flex;align-items:flex-end;gap:14px}
.fxb-site{font-size:clamp(13px,3.4cqw,20px);font-weight:700;color:#14263A;letter-spacing:-.02em}

.fxc-india{margin-left:auto;display:flex;align-items:center;gap:9px}
.fxc-india u{text-decoration:none;font-size:clamp(6px,1.5cqw,8.5px);letter-spacing:.15em;text-transform:uppercase;
  color:#5B6C7E;text-align:right;line-height:1.5;display:block}

@container (max-width: 430px){ .fxb-feat:nth-child(4){display:none} }
@container (max-width: 340px){ .fxb-feat:nth-child(3){display:none} }

/* flip button */
.fx-flipbtn{position:absolute;right:10px;top:10px;z-index:6;width:28px;height:28px;border-radius:8px;
  display:grid;place-items:center;border:1px solid #E1E4E8;background:rgba(255,255,255,.9);
  color:#46586C;cursor:pointer;transition:border-color .16s ease,color .16s ease}
.fx-flipbtn:hover{border-color:var(--ac);color:var(--ac)}

/* ── Banner / hero image space ─────────────────────────────────────────
   Har vault ke upar ek band jahan company apna banner ya cover laga sake.
   Khaali ho to bhi jagah rakhta hai taaki layout na kude. */
.fx-banner{position:relative;border-radius:var(--r);overflow:hidden;border:1px solid var(--bdr);
  background:var(--surface);box-shadow:var(--shadow);min-height:120px;margin-bottom:18px}
.fx-banner img{width:100%;height:100%;object-fit:cover;display:block;position:absolute;inset:0}
.fx-banner-dots{position:absolute;right:-6%;top:-120%;width:44%;height:340%;color:var(--v-ink);opacity:.13;pointer-events:none}
.fx-banner-in{position:relative;z-index:2;padding:20px 22px;display:flex;align-items:flex-end;
  justify-content:space-between;gap:16px;min-height:132px;flex-wrap:wrap}
.fx-banner-t{font-size:19px;font-weight:650;letter-spacing:-.35px;margin:0}
.fx-banner-s{font-size:12.5px;color:var(--v-ink2);margin:3px 0 0;font-family:var(--v-mono)}
.fx-banner-slot{position:absolute;inset:0;display:grid;place-items:center;color:var(--v-ink3);
  font-size:11.5px;font-family:var(--v-mono);letter-spacing:.06em;z-index:1}

/* Image ke liye chhoti jagah — document thumbnails / logo */
.fx-thumb{width:44px;height:44px;border-radius:10px;object-fit:cover;flex-shrink:0;
  border:1px solid var(--v-line);background:var(--v-bg1)}
.fx-thumb-ph{display:grid;place-items:center;color:var(--v-ink3)}

/* ── Panels, rows, badges ──────────────────────────────────────────────── */
.fx-panel{background:var(--v-panel);border:1px solid var(--v-line);border-radius:var(--v-r);padding:18px}
.fx-row{display:flex;gap:14px;align-items:flex-start;padding:14px 16px;background:var(--v-panel);
  border:1px solid var(--v-line);border-radius:12px;margin-bottom:9px;
  transition:border-color .18s ease,transform .18s ease}
.fx-row:hover{border-color:var(--v-line2);transform:translateX(2px)}
.fx-b{display:inline-flex;align-items:center;gap:4px;padding:2.5px 8px;border-radius:999px;
  font-size:10px;font-weight:600;letter-spacing:.05em;font-family:var(--v-mono);
  border:1px solid var(--v-line2);color:var(--v-ink2);white-space:nowrap}
.fx-b-ok{color:var(--v-ok);border-color:color-mix(in srgb,var(--v-ok) 42%,transparent);
  background:color-mix(in srgb,var(--v-ok) 9%,transparent)}
.fx-b-bad{color:var(--v-bad);border-color:color-mix(in srgb,var(--v-bad) 42%,transparent);
  background:color-mix(in srgb,var(--v-bad) 9%,transparent)}
.fx-b-warn{color:var(--v-warn);border-color:color-mix(in srgb,var(--v-warn) 42%,transparent);
  background:color-mix(in srgb,var(--v-warn) 9%,transparent)}
.fx-b-ac{color:var(--v-ac);border-color:color-mix(in srgb,var(--v-ac) 42%,transparent);
  background:color-mix(in srgb,var(--v-ac) 9%,transparent)}

.fx-mono{font-family:var(--v-mono);font-size:11.5px;color:var(--v-ink3);letter-spacing:.02em;word-break:break-all}

/* ── Buttons ───────────────────────────────────────────────────────────── */
.fx-btn{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:9px;
  border:1px solid var(--v-line2);background:var(--v-panel);color:var(--v-ink);
  font-size:12.5px;font-weight:550;cursor:pointer;text-decoration:none;
  transition:border-color .16s ease,background .16s ease,transform .16s ease}
.fx-btn:hover{border-color:var(--v-ac);transform:translateY(-1px)}
.fx-btn:active{transform:translateY(0)}
.fx-btn-p{background:var(--v-ac);border-color:var(--v-ac);color:#fff}
.fx-btn-p:hover{background:color-mix(in srgb,var(--v-ac) 88%,#000);border-color:transparent}
.fx-btn-d{color:var(--v-bad);border-color:color-mix(in srgb,var(--v-bad) 35%,transparent)}
.fx-btn[disabled]{opacity:.55;cursor:not-allowed;transform:none}

/* ── Empty state ───────────────────────────────────────────────────────── */
.fx-empty{text-align:center;padding:42px 20px;color:var(--v-ink2)}
.fx-empty-ic{width:46px;height:46px;margin:0 auto 12px;display:grid;place-items:center;
  border-radius:13px;border:1px solid var(--v-line);color:var(--v-ink3);background:var(--v-bg1)}
.fx-empty h3{margin:0 0 5px;font-size:14.5px;color:var(--v-ink);font-weight:600}
.fx-empty p{margin:0;font-size:12.5px;max-width:340px;margin-inline:auto;line-height:1.65}

/* ── Tabs ──────────────────────────────────────────────────────────────── */
.fx-tabs{display:flex;gap:2px;border-bottom:1px solid var(--v-line);margin-bottom:18px;overflow-x:auto}
.fx-tab{background:none;border:0;border-bottom:2px solid transparent;padding:9px 14px;
  color:var(--v-ink2);font-size:12.5px;font-weight:550;cursor:pointer;white-space:nowrap;
  transition:color .16s ease,border-color .16s ease}
.fx-tab:hover{color:var(--v-ink)}
.fx-tab.on{color:var(--v-ac);border-bottom-color:var(--v-ac)}
.fx-tab span{opacity:.5;font-family:var(--v-mono);font-size:11px;margin-left:3px}

/* ── Modal ─────────────────────────────────────────────────────────────── */
.fx-mod{position:fixed;inset:0;background:rgba(12,13,18,.55);backdrop-filter:blur(3px);
  z-index:900;display:none;align-items:center;justify-content:center;padding:20px}
.fx-mod.on{display:flex;animation:fxfade .18s ease}
@keyframes fxfade{from{opacity:0}to{opacity:1}}
.fx-box{background:var(--v-panel);border:1px solid var(--v-line);border-radius:16px;padding:24px;
  width:100%;max-width:450px;max-height:88vh;overflow:auto;animation:fxrise .22s cubic-bezier(.2,.7,.3,1)}
@keyframes fxrise{from{transform:translateY(10px);opacity:0}to{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){.fx-mod.on,.fx-box{animation:none}}
.fx-box h3{margin:0 0 4px;font-size:15.5px;letter-spacing:-.2px}
.fx-box label{display:block;font-size:10px;font-weight:650;color:var(--v-ink3);text-transform:uppercase;
  letter-spacing:.09em;margin:15px 0 6px;font-family:var(--v-mono)}
.fx-box input,.fx-box select,.fx-box textarea{width:100%;padding:10px 12px;border-radius:9px;
  border:1px solid var(--v-line2);background:var(--v-bg0);color:var(--v-ink);font:inherit;font-size:13px}
.fx-box input:focus,.fx-box select:focus{outline:2px solid color-mix(in srgb,var(--v-ac) 45%,transparent);
  outline-offset:1px;border-color:var(--v-ac)}
.fx-box input[type=file]{padding:9px}
.fx-note{font-size:11.5px;color:var(--v-ink2);line-height:1.68;margin:14px 0 0;
  border-left:2px solid var(--v-line2);padding-left:12px}
.fx-act{display:flex;gap:9px;justify-content:flex-end;margin-top:20px}
.fx-tok{font-family:var(--v-mono);font-size:14px;letter-spacing:.08em;background:var(--v-bg1);
  border:1px dashed var(--v-ac);border-radius:10px;padding:13px;text-align:center;margin-top:14px;word-break:break-all}

/* ── Seal verdict ──────────────────────────────────────────────────────── */
.fx-seal{display:flex;gap:12px;align-items:flex-start;padding:16px;border-radius:12px;
  border:1px solid color-mix(in srgb,var(--v-ok) 34%,transparent);
  background:color-mix(in srgb,var(--v-ok) 8%,transparent)}
.fx-seal.bad{border-color:color-mix(in srgb,var(--v-bad) 34%,transparent);
  background:color-mix(in srgb,var(--v-bad) 8%,transparent)}
.fx-seal-ic{color:var(--v-ok);flex-shrink:0;margin-top:1px}
.fx-seal.bad .fx-seal-ic{color:var(--v-bad)}
.fx-seal b{display:block;font-size:14px;margin-bottom:3px}
.fx-seal p{margin:0;font-size:12.5px;color:var(--v-ink2);line-height:1.65}

@media (max-width:640px){
  .fx-cards{grid-template-columns:1fr}
  .fx-banner-in{padding:16px}
}

/* ── Header language menu ──────────────────────────────────────────────── */
.fx-langwrap{position:relative;display:inline-flex}
.fx-langbtn{display:inline-flex;align-items:center;gap:6px;width:auto!important;padding:0 10px!important}
.fx-langnow{font-size:.7rem;font-weight:600;max-width:88px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (max-width:760px){ .fx-langnow{display:none} .fx-langbtn{padding:0!important} }
.fx-langpop{position:absolute;right:0;top:calc(100% + 8px);z-index:600;width:230px;max-height:min(62vh,430px);
  overflow-y:auto;background:var(--surface);border:1px solid var(--bdr);border-radius:12px;padding:6px;
  box-shadow:0 10px 34px -10px rgba(11,59,51,.28)}
.fx-langpop button{display:block;width:100%;text-align:left;background:none;border:0;cursor:pointer;
  padding:7px 10px;border-radius:8px;font:inherit;font-size:.74rem;color:var(--t1)}
.fx-langpop button:hover{background:var(--bg3)}
.fx-langpop button[aria-current]{color:var(--ac);font-weight:600}
.fx-langsec{font-size:.56rem;letter-spacing:.14em;text-transform:uppercase;color:var(--t3);
  padding:9px 10px 4px;font-weight:600}
.fx-langnote{font-size:.6rem;color:var(--t3);line-height:1.55;padding:0 10px 7px}

/* Google Translate ka apna banner/toolbar — hum apna control dete hain,
   uska nahi. Body ko bhi upar khiskane se rokte hain. */
.goog-te-banner-frame,.skiptranslate iframe{display:none!important}
body{top:0!important}
#google_translate_element{display:none!important}

/* ── Google Translate: kya translate NAHI hona chahiye ───────────────────
   Machine translation brand naam aur technical identifiers ko bhi badal deta
   hai. Test me "Fortax" -> "कर" ho gaya tha aur Seal ID "FTX-A1B2C3D4E5F6"
   -> "एफटीएक्स−ए1बी2सी3डी4ई5एफ6". Aisa ID copy karke koi verify karega to
   kaam hi nahi karega. Isliye ye sab notranslate hain. */
.notranslate{}
.fx-mono,.mono,.fxc-num,.fxc-word,.fxb-site,.fx-logo,.fx-tok,
input[type=text],input[type=email],input[type=number],code,kbd,samp{
  /* Google in par haath na lagaye */
}
/* Google ka floating icon/toolbar — hum apna control dete hain */
.goog-te-gadget-icon,.goog-te-banner-frame,.goog-logo-link,
#goog-gt-tt,.goog-te-balloon-frame,iframe.skiptranslate{display:none!important}
.goog-text-highlight{background:none!important;box-shadow:none!important}

/* ── Admin banner ────────────────────────────────────────────────────────
   Do tarah ke banner:

   1. POORA (blend 100%) — image khud ek mukammal design hai, apne border aur
      glow ke saath. Uske upar hamara border/background lagane se wo page par
      chipkaya hua block lagta hai, isliye yahan kuch nahi lagta.

   2. BLENDED (<100%) — image ek kinare se shuru hokar solid rang me ghul
      jaati hai. Tab solid background zaroori hai, warna ghulne ke baad khaali
      jagah dikhti. */
.fx-bn{position:relative;width:100%;background-size:100% 100%;background-repeat:no-repeat;
  border-radius:var(--r,14px);overflow:hidden}
.fx-bn:not(.fx-bn-whole){background-color:var(--bn-solid,var(--bg2));border:1px solid var(--bdr);
  background-size:cover}
.fx-bn-whole{border:0;background-color:transparent}
.fx-bn-alt{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.fx-bn-link{display:block;text-decoration:none;margin-bottom:18px;
  transition:transform .22s ease,filter .22s ease}
.fx-bn-link:hover{transform:translateY(-2px);filter:brightness(1.06)}
@media (max-width:700px){ .fx-bn{border-radius:10px} }

/* ── Banner image card ke ANDAR ─────────────────────────────────────────
   Image baayein kinare se shuru, daayein jaate jaate mask se gayab — solid
   card baaki jagah bharta hai. Heading uske upar tairta hua metal text. */
.fx-banner-hero{min-height:168px;position:relative;isolation:isolate}
.fx-bnl-link{position:absolute;inset:0;z-index:0;display:block}
.fx-bnl{position:absolute;inset:0;z-index:0;background-size:cover;background-repeat:no-repeat;pointer-events:none}
.fx-bnl-link .fx-bnl{pointer-events:auto}
.fx-banner-hero .fx-banner-dots{z-index:1;opacity:.08}
.fx-banner-hero .fx-banner-in{z-index:2;pointer-events:none}
.fx-banner-hero .fx-banner-in a,.fx-banner-hero .fx-banner-in button,.fx-banner-hero .fx-banner-in label{pointer-events:auto}
/* Metal text: chrome jaisa gradient + halki bevel, bina image ke */
.fx-metal{
  font-weight:800;letter-spacing:-.02em;
  background:linear-gradient(180deg,#FFFFFF 0%,#DCE3DF 38%,#8FA39B 50%,#EEF3F0 62%,#B9C6C0 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;
  filter:drop-shadow(0 1px 0 rgba(255,255,255,.55)) drop-shadow(0 2px 6px rgba(11,59,51,.35));
  text-shadow:none}
[data-theme="light"] .fx-metal{
  background:linear-gradient(180deg,#3A4A45 0%,#0B1F1A 40%,#5E6E68 52%,#14261F 64%,#0B1F1A 100%);
  -webkit-background-clip:text;background-clip:text;
  filter:drop-shadow(0 1px 0 rgba(255,255,255,.7)) drop-shadow(0 2px 5px rgba(11,59,51,.18))}
/* Heading/CTA solid side par baithein. blend_from=left me image baayein hai
   aur solid daayein — to text daayein; warna heading image ke apne text par
   girti hai (banner me "Fortax" logo ke upar "Sealed Vault" — padha nahi jaata). */
.fx-banner-hero .fx-banner-in{justify-content:flex-end;align-items:flex-end;text-align:right;flex-direction:column;gap:12px}
.fx-banner-hero .fx-banner-in > div{display:flex;flex-direction:column;align-items:flex-end;gap:8px}
.fx-banner-hero .fx-banner-t{margin:0}
.fx-banner-hero .fx-banner-s{text-align:right}
@media (max-width:700px){ .fx-banner-hero{min-height:200px} }
