/* FastPrintPortal SEO Kit v2.0 — site.css
 * Light = white cards · Night mode = dark cards · card-type services */
:root{
  --bg:#f4f7fc; --bg2:#eaf0fa; --card:#ffffff; --ink:#0f1b33; --ink2:#4a5874; --line:#e1e8f3;
  --brand:#0b3f91; --brand2:#2563eb; --accent:#f59e0b; --gold:#ffd166; --ok:#15803d; --bad:#b91c1c;
  --shadow:0 1px 2px rgba(15,27,51,.05),0 8px 24px rgba(15,27,51,.07);
  --shadow2:0 18px 40px rgba(15,27,51,.14);
  --r:16px; --font:"Segoe UI",system-ui,-apple-system,"Noto Sans","Noto Sans Devanagari",Roboto,sans-serif;
}
:root[data-theme="dark"]{
  --bg:#0a1120; --bg2:#0e182b; --card:#121c31; --ink:#e7eef9; --ink2:#a0b1cd; --line:#223250;
  --brand:#6aa5ff; --brand2:#8cbaff; --shadow:0 1px 2px rgba(0,0,0,.35),0 10px 26px rgba(0,0,0,.28); --shadow2:0 18px 40px rgba(0,0,0,.45);
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#0a1120; --bg2:#0e182b; --card:#121c31; --ink:#e7eef9; --ink2:#a0b1cd; --line:#223250;
    --brand:#6aa5ff; --brand2:#8cbaff; --shadow:0 1px 2px rgba(0,0,0,.35),0 10px 26px rgba(0,0,0,.28); --shadow2:0 18px 40px rgba(0,0,0,.45);
  }
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.65 var(--font);overflow-x:hidden;transition:background .25s,color .25s}
a{color:var(--brand)}
img,svg{max-width:100%}
h1,h2,h3,h4,h5{line-height:1.25;margin:0 0 .6em}
h1{font-size:clamp(1.75rem,4.3vw,2.8rem);letter-spacing:-.01em}
h2{font-size:clamp(1.35rem,2.9vw,1.9rem);letter-spacing:-.005em}
h3{font-size:1.1rem}
p{margin:0 0 1em}
.wrap{max-width:1200px;margin:0 auto;padding:0 16px}
.narrow{max-width:840px}
.muted{color:var(--ink2)} .small{font-size:.85rem} .center{text-align:center} .mt{margin-top:18px}
.ic{width:24px;height:24px;flex:none} .ic-s{width:18px;height:18px;flex:none;vertical-align:-3px} .ic-xs{width:14px;height:14px;vertical-align:-2px}
.skip{position:absolute;left:-999px;top:0;background:#fff;padding:8px 12px;z-index:99}.skip:focus{left:8px}

/* ---------- colour system (service-wise) ---------- */
.c-blue{--ic:#1d4ed8;--icbg:#e0ecff;--g1:#1d4ed8;--g2:#3b82f6}
.c-orange{--ic:#c2410c;--icbg:#ffedd5;--g1:#ea580c;--g2:#fb923c}
.c-green{--ic:#15803d;--icbg:#dcfce7;--g1:#16a34a;--g2:#4ade80}
.c-red{--ic:#b91c1c;--icbg:#fee2e2;--g1:#dc2626;--g2:#f87171}
.c-purple{--ic:#7e22ce;--icbg:#f3e8ff;--g1:#7c3aed;--g2:#c084fc}
.c-teal{--ic:#0f766e;--icbg:#ccfbf1;--g1:#0d9488;--g2:#2dd4bf}
.c-lime{--ic:#4d7c0f;--icbg:#ecfccb;--g1:#65a30d;--g2:#a3e635}
.c-indigo{--ic:#4338ca;--icbg:#e0e7ff;--g1:#4f46e5;--g2:#818cf8}
.c-pink{--ic:#be185d;--icbg:#fce7f3;--g1:#db2777;--g2:#f472b6}
.c-cyan{--ic:#0e7490;--icbg:#cffafe;--g1:#0891b2;--g2:#22d3ee}
.c-amber{--ic:#b45309;--icbg:#fef3c7;--g1:#d97706;--g2:#fbbf24}
.c-rose{--ic:#be123c;--icbg:#ffe4e6;--g1:#e11d48;--g2:#fb7185}
.c-slate{--ic:#334155;--icbg:#e2e8f0;--g1:#334155;--g2:#64748b}
.is-dark .c-blue{--ic:#8cb8ff}.is-dark .c-orange{--ic:#fdba74}.is-dark .c-green{--ic:#86efac}.is-dark .c-red{--ic:#fca5a5}
.is-dark .c-purple{--ic:#d8b4fe}.is-dark .c-teal{--ic:#5eead4}.is-dark .c-lime{--ic:#bef264}.is-dark .c-indigo{--ic:#a5b4fc}
.is-dark .c-pink{--ic:#f9a8d4}.is-dark .c-cyan{--ic:#67e8f9}.is-dark .c-amber{--ic:#fcd34d}.is-dark .c-rose{--ic:#fda4af}.is-dark .c-slate{--ic:#cbd5e1}
.is-dark [class*="c-"]{--icbg:rgba(255,255,255,.07)}
.svc-ic[class*="c-"],.wi[class*="c-"],.mi[class*="c-"]{color:var(--ic);background:var(--icbg)}

/* ---------- notice + header ---------- */
.notice-bar{background:#fff7e6;color:#7a4b00;font-size:.86rem;text-align:center;padding:7px 16px;border-bottom:1px solid #fde3a7}
.is-dark .notice-bar{background:#271f0f;color:#f5d48a;border-color:#4a3a14}
.notice-bar a{color:inherit;font-weight:700}
.hdr{position:sticky;top:0;z-index:40;background:color-mix(in srgb,var(--card) 88%,transparent);-webkit-backdrop-filter:saturate(1.6) blur(12px);backdrop-filter:saturate(1.6) blur(12px);border-bottom:1px solid var(--line);transition:box-shadow .2s}
.hdr.scrolled{box-shadow:0 6px 20px rgba(15,27,51,.08)}
.hdr-in{display:flex;align-items:center;gap:10px;min-height:68px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);margin-right:auto}
.logo-svg{flex:none;border-radius:12px;box-shadow:0 4px 12px rgba(11,63,145,.25)}
.logo-txt{display:flex;flex-direction:column;line-height:1.1}
.logo-txt b{font-size:1.12rem;letter-spacing:-.01em}
.logo-txt b i{font-style:normal;color:var(--accent)}
.logo-txt small{font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink2);margin-top:2px}
.nav{display:flex;align-items:center;gap:2px}
.nav>a,.dd-t{padding:9px 12px;border-radius:10px;text-decoration:none;color:var(--ink);font-weight:550;display:inline-flex;align-items:center;gap:4px}
.nav>a:hover,.dd-t:hover,.nav a.on{background:var(--bg2);color:var(--brand)}
.nav .nav-btn{margin-left:6px;color:#fff}
.nav .nav-btn.btn-ghost{color:var(--brand)}
.dd{position:relative}
.mega{position:absolute;left:50%;top:calc(100% + 10px);transform:translateX(-50%) translateY(6px);width:min(900px,92vw);display:grid;grid-template-columns:repeat(4,1fr);gap:8px;background:var(--card);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow2);padding:18px;opacity:0;visibility:hidden;transition:.18s}
.mega::before{content:"";position:absolute;left:0;right:0;top:-12px;height:12px}
.dd:hover .mega,.dd:focus-within .mega{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.mega h5{font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink2);margin:4px 8px 8px}
.mega a{display:flex;align-items:center;gap:10px;padding:8px;border-radius:10px;color:var(--ink);text-decoration:none;font-size:.93rem;font-weight:500}
.mega a:hover{background:var(--bg2)}
.mi{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;flex:none}
.mega-cta{background:var(--bg2);border-radius:12px;padding:4px}
.icon-btn{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;border:1px solid var(--line);background:var(--card);color:var(--ink);cursor:pointer;flex:none}
.icon-btn:hover{border-color:var(--brand);color:var(--brand)}
.theme-btn .i-sun{display:none}.is-dark .theme-btn .i-sun{display:block}.is-dark .theme-btn .i-moon{display:none}
.menu-btn{display:none}
@media (max-width:980px){
  .menu-btn{display:grid}
  .nav{position:absolute;left:0;right:0;top:100%;flex-direction:column;align-items:stretch;background:var(--card);border-bottom:1px solid var(--line);padding:10px 16px 18px;display:none;max-height:calc(100vh - 110px);overflow:auto;box-shadow:var(--shadow2)}
  .nav.open{display:flex}
  .nav>a,.dd-t{padding:12px}
  .nav .nav-btn{margin:6px 0 0;justify-content:center}
  .mega{position:static;transform:none;width:auto;grid-template-columns:1fr;box-shadow:none;border:0;padding:0 0 0 8px;display:none;opacity:1;visibility:visible}
  .dd.open .mega{display:grid}
  .dd:hover .mega{transform:none}
}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 18px;border-radius:12px;background:linear-gradient(135deg,var(--brand),var(--brand2));color:#fff;text-decoration:none;font-weight:650;border:1px solid transparent;cursor:pointer;font:inherit;font-weight:650;transition:transform .15s,box-shadow .15s,filter .15s}
.btn:hover{transform:translateY(-1px);box-shadow:0 8px 20px rgba(37,99,235,.28);filter:brightness(1.05)}
.is-dark .btn:not(.btn-ghost):not(.btn-white):not(.btn-outline-white){color:#06132b}
.btn-ghost{background:transparent;color:var(--brand);border-color:var(--brand)}
.btn-ghost:hover{background:var(--bg2);box-shadow:none}
.btn-lg{padding:13px 24px;font-size:1.02rem}
.btn-sm{padding:7px 14px;font-size:.9rem}
.btn-block{display:flex;width:100%;margin-top:10px}
.btn-white{background:#fff;color:#0b3f91}
.btn-outline-white{background:transparent;color:#fff;border-color:rgba(255,255,255,.65)}
.btn-outline-white:hover{background:rgba(255,255,255,.12)}

/* ---------- hero ---------- */
.hero-v2{position:relative;overflow:hidden;background:linear-gradient(135deg,#061f4d 0%,#0b3f91 48%,#1d5fe0 100%);color:#fff;padding:64px 0 84px}
.hero-glow{position:absolute;inset:0;background:radial-gradient(620px 320px at 88% 6%,rgba(255,255,255,.2),transparent 60%),radial-gradient(520px 320px at 0% 100%,rgba(245,158,11,.22),transparent 60%);pointer-events:none}
.hero-grid{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:44px 44px;mask-image:radial-gradient(ellipse at 70% 30%,#000 20%,transparent 70%);-webkit-mask-image:radial-gradient(ellipse at 70% 30%,#000 20%,transparent 70%);pointer-events:none}
.hero-in{position:relative;display:grid;grid-template-columns:1.1fr 1fr;gap:44px;align-items:center}
.hero-v2 h1{color:#fff}.hl{color:var(--gold)}
.lead{font-size:1.1rem;color:var(--ink2)}
.hero-v2 .lead{color:rgba(255,255,255,.88);margin-bottom:.3em}
.lead-hi{color:rgba(255,255,255,.75);font-size:1rem}
.pill{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:999px;padding:5px 12px;font-size:.85rem;font-weight:650;margin-bottom:14px}
.pill-dark{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.28);color:#bbf7d0}
.hsearch{display:flex;align-items:center;gap:8px;background:#fff;border-radius:14px;padding:6px 6px 6px 14px;margin:18px 0 4px;max-width:540px;box-shadow:0 12px 30px rgba(0,0,0,.2)}
.hsearch .ic-s{color:#64748b}
.hsearch input{flex:1;min-width:0;border:0;outline:0;font:inherit;font-size:.98rem;color:#0f1b33;background:transparent;padding:8px 0}
.hsearch .btn{padding:10px 16px}
.hero-btns{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0}
.ticks{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:8px 18px;font-size:.93rem}
.ticks li{display:flex;align-items:center;gap:6px}
.hero-v2 .ticks{color:rgba(255,255,255,.88)}.hero-v2 .ticks .ic-s{color:#86efac}

/* dashboard mockup */
.mock{position:relative;padding:12px 0 12px 12px}
.mock-win{background:#fff;color:#0f1b33;border-radius:18px;box-shadow:0 30px 70px rgba(3,15,40,.5);overflow:hidden;transform:perspective(1300px) rotateY(-7deg) rotateX(3deg)}
.mock-bar{display:flex;align-items:center;gap:6px;padding:10px 14px;background:#eef2f9;border-bottom:1px solid #e2e8f2}
.mock-bar i{width:10px;height:10px;border-radius:50%;background:#f87171}.mock-bar i:nth-child(2){background:#fbbf24}.mock-bar i:nth-child(3){background:#34d399}
.mock-bar span{margin-left:10px;font-size:.74rem;color:#64748b;background:#fff;border-radius:6px;padding:2px 10px}
.mock-body{padding:16px}
.mock-top{display:flex;justify-content:space-between;align-items:center;background:linear-gradient(135deg,#0b3f91,#2563eb);color:#fff;border-radius:12px;padding:14px 16px}
.mock-top small{display:block;opacity:.8;font-size:.74rem}.mock-top b{font-size:1.35rem}
.mock-add{background:#fff;color:#0b3f91;font-weight:700;font-size:.78rem;padding:6px 10px;border-radius:8px}
.mock-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:14px 0}
.mt{display:flex;flex-direction:column;align-items:center;gap:4px;border-radius:11px;padding:10px 4px;font-size:.72rem;font-weight:650;color:var(--ic);background:var(--icbg)}
.mt .ic{width:22px;height:22px}.mt span{color:#334155}
.is-dark .mock-win .mt{--icbg:transparent}
.mock-win .mt.c-blue{--ic:#1d4ed8;--icbg:#e0ecff}.mock-win .mt.c-orange{--ic:#c2410c;--icbg:#ffedd5}.mock-win .mt.c-green{--ic:#15803d;--icbg:#dcfce7}
.mock-win .mt.c-red{--ic:#b91c1c;--icbg:#fee2e2}.mock-win .mt.c-purple{--ic:#7e22ce;--icbg:#f3e8ff}.mock-win .mt.c-teal{--ic:#0f766e;--icbg:#ccfbf1}
.mock-win .mt.c-lime{--ic:#4d7c0f;--icbg:#ecfccb}.mock-win .mt.c-indigo{--ic:#4338ca;--icbg:#e0e7ff}
.mock-rows div{display:flex;align-items:center;gap:8px;font-size:.8rem;padding:8px 2px;border-top:1px solid #eef2f7;color:#334155}
.mock-rows em{margin-left:auto;font-style:normal;font-size:.72rem;font-weight:700;color:#15803d;background:#dcfce7;padding:2px 8px;border-radius:99px}
.mock-rows em.w{color:#b45309;background:#fef3c7}
.dot{width:8px;height:8px;border-radius:50%;background:#22c55e}.dot.wait{background:#f59e0b}
.pvc-float{position:absolute;right:-18px;bottom:-26px;width:150px;height:94px;border-radius:12px;background:linear-gradient(135deg,var(--gold),#f59e0b);box-shadow:0 18px 40px rgba(3,15,40,.45);transform:rotate(8deg);animation:fl 5s ease-in-out infinite;padding:14px}
.pvc-float .chipm{position:static;display:block}
.pvc-float .l1,.pvc-float .l2,.pvc-float .l3{display:block;height:6px;border-radius:4px;background:rgba(11,63,145,.55);margin-top:8px}
.pvc-float .l1{width:70%}.pvc-float .l2{width:50%}.pvc-float .l3{width:60%;background:rgba(255,255,255,.7)}
.float-chip{position:absolute;display:flex;align-items:center;gap:6px;background:#fff;color:#0f1b33;font-size:.8rem;font-weight:700;padding:9px 12px;border-radius:12px;box-shadow:0 12px 30px rgba(3,15,40,.35);animation:fl 4s ease-in-out infinite}
.float-chip .ic-s{color:#15803d}
.fc1{left:-14px;bottom:34px}.fc2{right:-6px;top:-6px;animation-delay:1.5s}
@keyframes fl{0%,100%{translate:0 0}50%{translate:0 -8px}}
@media (prefers-reduced-motion:reduce){.float-chip,.pvc-float{animation:none}}
@media (max-width:980px){
  .hero-v2{padding:40px 0 64px}
  .hero-in{grid-template-columns:1fr;gap:30px}
  .mock{padding:0}.mock-win{transform:none}
  .fc1{left:6px;bottom:-16px}.fc2{right:6px;top:-16px}
  .pvc-float{display:none}
}

/* stats */
.stats{margin-top:-40px;position:relative;z-index:2}
.stats-in{display:grid;grid-template-columns:repeat(4,1fr);background:var(--card);border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow2);overflow:hidden}
.stats-in div{padding:22px 14px;text-align:center;border-right:1px solid var(--line)}
.stats-in div:last-child{border-right:0}
.stats-in b{display:block;font-size:1.7rem;line-height:1.2;background:linear-gradient(135deg,var(--brand),var(--brand2));-webkit-background-clip:text;background-clip:text;color:transparent}
.stats-in span{font-size:.86rem;color:var(--ink2)}
@media (max-width:640px){.stats-in{grid-template-columns:1fr 1fr}.stats-in div:nth-child(2){border-right:0}.stats-in div:nth-child(-n+2){border-bottom:1px solid var(--line)}}

/* sections */
.sec{padding:56px 0}.sec-tight{padding-top:24px}
.sec-alt{background:var(--bg2)}
.sec-hd{text-align:center;max-width:740px;margin:0 auto 30px}
.sec-hd p{color:var(--ink2)}
.eyebrow{display:inline-block;font-size:.76rem;font-weight:750;letter-spacing:.12em;text-transform:uppercase;color:var(--brand);background:color-mix(in srgb,var(--brand) 12%,transparent);padding:5px 12px;border-radius:99px;margin-bottom:10px}
.page-hd{padding:36px 0 14px}
.page-hd-c{text-align:center}
.crumb{font-size:.86rem;color:var(--ink2);margin-bottom:10px}.crumb a{color:var(--ink2)}

/* filters + search */
.filters{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:0 0 24px}
.fchip{border:1px solid var(--line);background:var(--card);color:var(--ink);padding:8px 16px;border-radius:99px;font:inherit;font-size:.92rem;font-weight:600;cursor:pointer}
.fchip:hover{border-color:var(--brand)}
.fchip.on{background:var(--brand);border-color:var(--brand);color:#fff}
.is-dark .fchip.on{color:#06132b}
.ssearch{display:flex;align-items:center;gap:8px;max-width:560px;margin:18px auto 0;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:4px 14px;box-shadow:var(--shadow)}
.ssearch .ic-s{color:var(--ink2)}
.ssearch input{flex:1;border:0;outline:0;background:transparent;color:var(--ink);font:inherit;padding:10px 0}
.noresult{text-align:center;color:var(--ink2);margin-top:20px}

/* ---------- CARD-TYPE SERVICE CARDS ---------- */
.sgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:18px}
.scard{display:flex;flex-direction:column;text-decoration:none;color:var(--ink);background:var(--card);border:1px solid var(--line);border-radius:18px;overflow:hidden;box-shadow:var(--shadow);transition:transform .2s,box-shadow .2s,border-color .2s}
.scard:hover{transform:translateY(-5px);box-shadow:var(--shadow2);border-color:color-mix(in srgb,var(--g1) 45%,transparent)}
.scard[hidden]{display:none}
.scard-top{position:relative;height:118px;background:radial-gradient(circle at 100% 0,rgba(255,255,255,.17) 0 78px,transparent 79px),radial-gradient(circle at 0 100%,rgba(255,255,255,.13) 0 46px,transparent 47px),linear-gradient(135deg,var(--g1),var(--g2))}
.chipm{position:absolute;left:16px;top:16px;width:34px;height:26px;border-radius:6px;background:linear-gradient(135deg,#ffe8a3,#e6b84a);box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}
.chipm::before{content:"";position:absolute;inset:6px 10px;border:1px solid rgba(0,0,0,.18);border-radius:3px}
.scard-tag{position:absolute;right:12px;top:12px;font-size:.7rem;font-weight:750;letter-spacing:.04em;text-transform:uppercase;background:rgba(255,255,255,.22);color:#fff;padding:4px 9px;border-radius:99px;backdrop-filter:blur(4px)}
.scard-ic{position:absolute;left:16px;bottom:-22px;display:grid;place-items:center;width:58px;height:58px;border-radius:16px;background:var(--card);color:var(--g1);box-shadow:0 8px 20px rgba(15,27,51,.18);z-index:1}
.is-dark .scard-ic{color:var(--ic)}
.scard-ic .ic{width:30px;height:30px}
.scard-body{display:flex;flex-direction:column;gap:4px;padding:32px 18px 18px;flex:1}
.scard-cat{font-size:.72rem;font-weight:750;letter-spacing:.1em;text-transform:uppercase;color:var(--ic)}
.scard-t{font-size:1.08rem;font-weight:750}
.scard-d{color:var(--ink2);font-size:.92rem}
.scard-go{margin-top:auto;padding-top:10px;color:var(--ic);font-weight:700;font-size:.9rem;display:flex;align-items:center;gap:6px}
.scard:hover .scard-go .ic-s{transform:translateX(3px)}.scard-go .ic-s{transition:transform .2s}

/* service page hero */
.svc-hero{background:radial-gradient(700px 300px at 85% 0%,color-mix(in srgb,var(--g2) 22%,transparent),transparent 70%),var(--bg);padding-bottom:30px}
.svc-hero-in{display:grid;grid-template-columns:1.4fr 1fr;gap:34px;align-items:center}
.bigcard{position:relative;justify-self:center;width:min(330px,100%);aspect-ratio:85.6/54;border-radius:20px;background:linear-gradient(135deg,var(--g1),var(--g2));box-shadow:0 26px 50px color-mix(in srgb,var(--g1) 40%,transparent);color:#fff;overflow:hidden;transform:rotate(-4deg)}
.bigcard::after{content:"";position:absolute;width:220px;height:220px;right:-70px;top:-90px;border-radius:50%;background:rgba(255,255,255,.15)}
.bigcard .chipm{left:22px;top:24px;width:44px;height:34px}
.bigcard-ic{position:absolute;right:22px;bottom:22px;width:64px;height:64px;border-radius:18px;background:rgba(255,255,255,.2);display:grid;place-items:center}
.bigcard-ic .ic{width:36px;height:36px;color:#fff}
.bigcard-t{position:absolute;left:22px;top:74px;font-weight:800;font-size:1.15rem}
.bigcard .l1,.bigcard .l2{position:absolute;left:22px;height:7px;border-radius:4px;background:rgba(255,255,255,.55)}
.bigcard .l1{bottom:44px;width:45%}.bigcard .l2{bottom:28px;width:30%}
@media (max-width:860px){.svc-hero-in{grid-template-columns:1fr}.bigcard{width:min(300px,86%)}}

/* generic cards */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:22px;box-shadow:var(--shadow)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px}
.grid-3{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.post{display:flex;flex-direction:column;gap:6px;text-decoration:none;color:var(--ink);transition:transform .2s,border-color .2s}
.post:hover{transform:translateY(-3px);border-color:var(--brand)}
.svc-ic{display:grid;place-items:center;width:48px;height:48px;border-radius:13px;background:var(--bg2);color:var(--brand);margin-bottom:6px;flex:none}
.svc-ic-sm{width:32px;height:32px;border-radius:9px;margin:0}.svc-ic-sm .ic{width:18px;height:18px}
.svc-t{font-weight:750;font-size:1.04rem}.svc-d{color:var(--ink2);font-size:.93rem}
.date{font-size:.82rem;color:var(--ink2);margin-top:auto}

/* steps */
.steps{list-style:none;counter-reset:s;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.steps li{counter-increment:s;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:20px 20px 20px 70px;position:relative;display:flex;flex-direction:column;box-shadow:var(--shadow)}
.steps li::before{content:counter(s);position:absolute;left:18px;top:18px;width:36px;height:36px;border-radius:12px;background:linear-gradient(135deg,var(--brand),var(--brand2));color:#fff;display:grid;place-items:center;font-weight:800}
.is-dark .steps li::before{color:#06132b}
.steps li span{color:var(--ink2)}
.steps-v{grid-template-columns:1fr}

/* why */
.why{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.why-i{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:22px;box-shadow:var(--shadow);transition:transform .2s}
.why-i:hover{transform:translateY(-3px)}
.why-i b{display:block;margin:12px 0 4px;font-size:1.03rem}
.why-i p{margin:0;color:var(--ink2);font-size:.92rem}
.wi{display:grid;place-items:center;width:50px;height:50px;border-radius:14px}
@media (max-width:980px){.why{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.why{grid-template-columns:1fr}}

/* two-col */
.two{display:grid;grid-template-columns:1.3fr 1fr;gap:32px;align-items:start}
.two-wide{grid-template-columns:2fr 1fr}
@media (max-width:900px){.two,.two-wide{grid-template-columns:1fr}}
.feat{list-style:none;padding:0;margin:0 0 1.2em}
.feat li{display:flex;gap:8px;align-items:flex-start;padding:6px 0}
.feat .ic-s{color:var(--ok);margin-top:4px}
.feat-grid{display:grid;grid-template-columns:1fr 1fr;gap:4px 18px}
@media (max-width:600px){.feat-grid{grid-template-columns:1fr}}
.warn{border-left:4px solid var(--accent)}
.dom-ok{margin:10px 0}.dom-ok .ic-s{color:var(--ok)}
.note{border-left:4px solid var(--brand);margin:24px 0;font-size:.95rem}
.side{display:flex;flex-direction:column;gap:16px}
.sticky{position:sticky;top:92px}
.rel{display:flex;align-items:center;gap:10px;padding:9px 0;color:var(--ink);text-decoration:none;border-bottom:1px solid var(--line)}
.rel:last-child{border-bottom:0}.rel:hover{color:var(--brand)}
.more{margin-top:28px}

/* prose */
.prose h2{margin-top:1.6em}
.prose ul,.prose ol{padding-left:1.3em}
.prose li{margin:.3em 0}

/* keyword chips */
.kwbox{margin-top:30px;padding:20px;border:1px dashed var(--line);border-radius:var(--r);background:var(--card)}
.kwbox h3{font-size:.95rem;color:var(--ink2);margin-bottom:12px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{display:inline-block;font-size:.84rem;padding:6px 12px;border-radius:99px;background:var(--bg2);color:var(--ink);text-decoration:none;border:1px solid var(--line)}
a.chip:hover{border-color:var(--brand);color:var(--brand)}

/* faq */
.faq details{background:var(--card);border:1px solid var(--line);border-radius:14px;margin-bottom:10px;padding:0 18px;box-shadow:var(--shadow)}
.faq summary{cursor:pointer;font-weight:650;padding:15px 0;list-style:none;display:flex;justify-content:space-between;gap:12px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:1.3rem;color:var(--brand);line-height:1}
.faq details[open] summary::after{content:"–"}
.faq details p{color:var(--ink2);padding-bottom:6px}

/* contact / official */
.contact-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px;margin:18px 0}
.contact{display:flex;flex-direction:column;gap:4px;text-decoration:none;color:var(--ink)}
.dom-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px;margin:12px 0 20px}
.dom{display:flex;flex-direction:column;gap:2px}
.dom b{font-size:1.05rem;word-break:break-all}
.dom.ok{border-left:4px solid var(--ok)}.dom.ok span{color:var(--ok)}
.dom.bad{border-left:4px solid var(--bad)}.dom.bad span{color:var(--bad)}

/* cta */
.cta{padding:24px 0 56px}
.cta-in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px;background:linear-gradient(135deg,#061f4d,#0b3f91 50%,#2563eb);color:#fff;border-radius:24px;padding:36px;position:relative;overflow:hidden}
.cta-in::after{content:"";position:absolute;right:-60px;top:-80px;width:260px;height:260px;border-radius:50%;background:rgba(255,209,102,.18)}
.cta-in h2{color:#fff}.cta-in p{margin:0;opacity:.9}
.cta-btns{display:flex;flex-wrap:wrap;gap:10px;position:relative;z-index:1}

/* footer */
.ftr{background:var(--card);border-top:1px solid var(--line);padding-top:44px}
.ftr-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:28px}
.ftr h4{font-size:.92rem;margin-bottom:12px}
.ftr-grid a:not(.logo){display:block;color:var(--ink2);text-decoration:none;padding:4px 0;font-size:.92rem}
.ftr-grid a:not(.logo):hover{color:var(--brand)}
.ftr .logo{margin-bottom:12px}
.soc{display:flex;gap:8px}
.soc a{display:grid!important;place-items:center;width:40px;height:40px;border-radius:12px;border:1px solid var(--line);padding:0!important}
.ftr-kw{border-top:1px solid var(--line);margin-top:28px;padding-top:22px}
.ftr-kw .chip{font-size:.78rem;padding:4px 10px}
.ftr-bot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;border-top:1px solid var(--line);margin-top:22px;padding:16px;font-size:.84rem;color:var(--ink2)}
@media (max-width:900px){.ftr-grid{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.ftr-grid{grid-template-columns:1fr}.cta-in{padding:26px}}

/* floating */
.fab{position:fixed;right:18px;bottom:22px;z-index:30;display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:#229ed9;color:#fff;box-shadow:0 10px 24px rgba(34,158,217,.45)}
.fab .ic{width:26px;height:26px}
.totop{position:fixed;right:24px;bottom:90px;z-index:30;display:grid;place-items:center;width:44px;height:44px;border-radius:14px;border:1px solid var(--line);background:var(--card);color:var(--ink);box-shadow:var(--shadow);cursor:pointer;opacity:0;visibility:hidden;transform:translateY(8px);transition:.2s}
.totop.show{opacity:1;visibility:visible;transform:none}
.mbar{display:none}
@media (max-width:760px){
  .mbar{display:flex;gap:10px;position:fixed;left:0;right:0;bottom:0;z-index:29;background:var(--card);border-top:1px solid var(--line);padding:10px 16px calc(10px + env(safe-area-inset-bottom));box-shadow:0 -6px 20px rgba(15,27,51,.08)}
  .mbar .btn{flex:1}
  .fab{bottom:84px}.totop{bottom:150px;right:24px}
  body{padding-bottom:72px}
}

/* reveal animation (sirf JS ho tab) */
.js-reveal .reveal{opacity:0;transform:translateY(18px);transition:opacity .5s ease,transform .5s ease}
.js-reveal .reveal.in{opacity:1;transform:none}
/* grid children kabhi screen se bahar na jaayein */
.hero-in>*,.svc-hero-in>*,.two>*,.ftr-grid>*{min-width:0}
@media (max-width:420px){.hsearch .btn{padding:10px 12px}.hsearch input{font-size:.9rem}}