@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');

:root{--navy:#10223b;--navy-2:#18314f;--green:#198754;--green-dark:#116a40;--green-pale:#e9f7ef;--gold:#d4af37;--ink:#1d2b3e;--muted:#6e7a8d;--line:#e5eaf0;--surface:#fff;--surface-soft:#f7f9fc;--blue:#3c6fe8;--shadow:0 14px 38px rgba(18,43,72,.07);--sidebar-width:286px}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:105px}
body{margin:0;background:#f7f9fc;color:var(--ink);font-family:'DM Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;font-size:15px;line-height:1.72;-webkit-font-smoothing:antialiased}
button,input{font:inherit}
a{color:var(--green);text-decoration:none}
a:hover{color:var(--green-dark)}
button{cursor:pointer}
::selection{background:#c7f0d7;color:#10223b}
.skip-link{position:fixed;z-index:10000;top:-100px;left:16px;background:#fff;padding:10px 16px;border-radius:8px;box-shadow:var(--shadow)}.skip-link:focus{top:12px}
.reading-progress{height:3px;position:fixed;z-index:9999;inset:0 0 auto;background:transparent}.reading-progress span{display:block;width:0;height:100%;background:linear-gradient(90deg,var(--green),var(--gold));transition:width .08s linear}
.sidebar{position:fixed;z-index:1000;inset:0 auto 0 0;width:var(--sidebar-width);background:#fff;border-right:1px solid #e8edf2;display:flex;flex-direction:column;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#d7dfe7 transparent}
.brand-row{height:88px;flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;padding:0 23px;border-bottom:1px solid #edf0f4}.brand{display:flex;align-items:center;gap:11px;color:var(--navy)}.brand:hover{color:var(--navy)}.brand-mark{width:43px;height:43px;display:grid;place-items:center;position:relative;border-radius:13px;background:var(--green);color:#fff;font:800 21px/1 Manrope,sans-serif;letter-spacing:-2px;box-shadow:0 6px 16px #1987542e}.brand-mark span{font-size:13px;color:#f3d675;position:absolute;right:6px;top:5px;letter-spacing:0}.brand-words{display:flex;flex-direction:column;line-height:1.25}.brand-words strong{font:800 20px/1.1 Manrope,sans-serif;letter-spacing:-.8px}.brand-words strong span,.footer-brand strong span{color:var(--green)}.brand-words small{font-size:9px;letter-spacing:2px;color:#8a95a4;font-weight:700;margin-top:5px}.icon-button{width:38px;height:38px;border:1px solid var(--line);background:#fff;border-radius:10px;color:var(--navy);display:inline-grid;place-items:center;font-size:17px}.sidebar-close{display:none}
.sidebar-intro{padding:24px 25px 9px}.eyebrow,.nav-heading,.section-label{font-size:10px;letter-spacing:1.8px;font-weight:800;color:#8a96a6}.sidebar-intro p{margin:5px 0 0;font:700 17px/1.35 Manrope,sans-serif;color:var(--navy);letter-spacing:-.4px}
.guide-nav{padding:0 13px 18px}.nav-group{margin:19px 0 4px}.nav-heading{margin:0 11px 9px}.nav-link{display:flex;align-items:center;gap:11px;position:relative;min-height:38px;padding:8px 11px;margin:2px 0;border-radius:9px;color:#596779;font-size:12.5px;font-weight:600;line-height:1.35;transition:background .18s,color .18s}.nav-link:hover{background:#f5f8f7;color:var(--green)}.nav-link.active{background:#eaf7ef;color:var(--green-dark);font-weight:700}.nav-link.active:before{content:"";position:absolute;left:-13px;top:9px;bottom:9px;width:3px;border-radius:0 4px 4px 0;background:var(--green)}.nav-icon{flex:0 0 20px;width:20px;height:20px;display:grid;place-items:center;font-size:15px;color:#8b97a7}.nav-link.active .nav-icon{color:var(--green)}.sidebar-bottom{margin-top:auto;padding:12px 17px 21px}.sidebar-help-card{background:linear-gradient(135deg,#f0f8f3,#f8fbfa);border:1px solid #dcefe3;border-radius:13px;padding:14px 15px 13px;position:relative}.help-orb{width:26px;height:26px;border-radius:9px;display:grid;place-items:center;background:var(--green);color:#fff;font-weight:800;float:left;margin-right:9px}.sidebar-help-card strong{font:800 12px Manrope,sans-serif;color:var(--navy)}.sidebar-help-card p{clear:both;font-size:11px;line-height:1.55;color:#697b70;margin:12px 0}.sidebar-help-card a{font-size:11px;font-weight:800;color:var(--green-dark)}.sidebar-help-card a span{float:right}.sidebar-copyright{font-size:10px;color:#a2adba;line-height:1.7;margin:16px 4px 0}
.app-shell{margin-left:var(--sidebar-width);min-height:100vh}.topbar{height:78px;padding:0 clamp(22px,4vw,58px);background:rgba(255,255,255,.94);backdrop-filter:blur(14px);border-bottom:1px solid #e9eef3;display:flex;align-items:center;justify-content:space-between;gap:24px;position:sticky;top:0;z-index:900}.topbar-left,.topbar-actions{display:flex;align-items:center;gap:18px}.menu-toggle{display:none}.crumbs{display:flex;align-items:center;gap:11px;font-size:12px;color:#9aa4b1}.crumbs strong{color:#35465a;font-weight:700}.crumb-separator{color:#c6cdd5}.topbar-actions{gap:12px}.search-box{height:41px;width:min(300px,27vw);display:flex;align-items:center;gap:10px;border:1px solid #e0e6ed;background:#fafbfd;border-radius:11px;padding:0 10px 0 13px;color:#8994a3;transition:border .18s,box-shadow .18s}.search-box:focus-within{border-color:#7dc69f;box-shadow:0 0 0 3px #19875414;background:#fff}.search-symbol{font-size:22px;line-height:1;transform:rotate(-20deg)}.search-box input{width:100%;min-width:0;border:0;outline:0;background:transparent;font-size:12px;color:var(--ink)}.search-box input::placeholder{color:#a2adba}.search-box kbd{border:1px solid #e0e5ec;background:#fff;border-radius:5px;padding:1px 6px;font:11px 'DM Sans',sans-serif;color:#9aa4b1}.outline-button{height:41px;padding:0 14px;display:inline-flex;align-items:center;gap:8px;border:1px solid #e0e6ed;background:#fff;color:#45556a;border-radius:10px;font-size:12px;font-weight:700;white-space:nowrap}.outline-button:hover{border-color:#b4c4d2;background:#f9fbfc}.outline-button span{font-size:17px}
.main-content{padding:0 0 54px}.content-width{width:min(1040px,calc(100% - 88px));margin:0 auto}.hero{position:relative;overflow:hidden;min-height:420px;padding:54px clamp(42px,6vw,76px) 45px;background:linear-gradient(116deg,#10223b 0%,#142d48 58%,#153b43 100%);color:#fff;display:grid;grid-template-columns:1.08fr .92fr;align-items:center;gap:24px}.hero:before{content:"";position:absolute;width:550px;height:550px;border:1px solid #ffffff0b;border-radius:50%;right:9%;top:-46%;box-shadow:0 0 0 48px #ffffff04,0 0 0 96px #ffffff03}.hero-copy{position:relative;z-index:2;max-width:540px}.hero-kicker{display:flex;align-items:center;gap:9px;color:#b9d7c8;font-size:10px;font-weight:800;letter-spacing:2px}.pulse-dot{width:7px;height:7px;border-radius:50%;background:#61d897;box-shadow:0 0 0 5px #61d89720}.hero h1{font:800 clamp(31px,3.4vw,46px)/1.17 Manrope,sans-serif;letter-spacing:-2px;margin:20px 0 16px}.hero h1 span{color:#91d9b1}.hero-description{font-size:13px;line-height:1.9;color:#c4d0dc;max-width:500px;margin:0}.hero-buttons{display:flex;align-items:center;gap:22px;margin-top:27px}.primary-button{min-height:43px;padding:0 17px;display:inline-flex;align-items:center;justify-content:center;gap:20px;border:0;border-radius:9px;background:var(--green);color:#fff;font-size:12px;font-weight:800;box-shadow:0 8px 20px #19875435;transition:transform .18s,background .18s}.primary-button:hover{transform:translateY(-1px);background:#167849;color:#fff}.primary-button span{font-size:17px}.text-button{display:inline-flex;align-items:center;gap:9px;border:0;background:transparent;color:inherit;font-size:12px;font-weight:700;padding:8px 0}.text-button:hover{color:#83d7a7}.text-button span{font-size:16px}.hero-trust{display:flex;align-items:center;gap:8px;margin-top:23px;color:#9fb2c3;font-size:10px}.trust-check{color:#8ce0ad;font-weight:800}.trust-divider{color:#506479}
.hero-art{height:300px;position:relative;z-index:1;display:flex;align-items:center;justify-content:center}.art-glow{position:absolute;inset:15% 5% 8%;border-radius:50%;background:#54bc8e17;filter:blur(21px)}.art-window{position:relative;width:100%;max-width:365px;background:#f7fafc;border:5px solid #263f59;border-radius:14px;box-shadow:0 25px 65px #06121e83;overflow:hidden;transform:perspective(900px) rotateY(-8deg) rotateX(2deg)}.art-window-top{height:30px;background:#e8edf2;border-bottom:1px solid #d6dfe8;display:flex;align-items:center;gap:5px;padding:0 12px}.art-window-top>span{width:6px;height:6px;border-radius:50%;background:#bdc7d1}.art-window-top i{font-style:normal;font-size:7px;font-weight:800;letter-spacing:1.5px;color:#6d7b8c;margin-left:auto}.art-window-body{display:grid;grid-template-columns:48px 1fr;min-height:206px}.art-mini-nav{background:#13263f;display:flex;align-items:center;flex-direction:column;padding-top:17px;gap:13px}.art-mini-nav b{width:18px;height:12px;border-radius:3px;background:#54708b}.art-mini-nav b:first-child{background:#36a66a}.art-content{padding:17px 15px 12px}.art-welcome-line{height:8px;width:45%;border-radius:3px;background:#bec9d4;margin-bottom:14px}.art-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.art-metrics span{height:45px;border:1px solid #e5ebf0;background:#fff;border-radius:5px;display:flex;flex-direction:column;justify-content:center;gap:6px;padding:0 7px}.art-metrics i{height:4px;width:50%;background:#c8d2dd;border-radius:3px}.art-metrics b{height:8px;width:75%;background:#a2dbb8;border-radius:3px}.art-metrics span:nth-child(2) b{background:#d9c46c}.art-chart{height:78px;margin-top:10px;border-radius:5px;background:#fff;border:1px solid #e5ebf0;display:flex;align-items:end;justify-content:space-evenly;padding:12px 12px 0}.art-chart i{width:7%;border-radius:3px 3px 0 0;background:#70c596;height:40%}.art-chart i:nth-child(2n){height:66%;background:#acdcbf}.art-chart i:nth-child(3n){height:88%;background:#27975c}.art-chart i:nth-child(4n){height:50%}.art-lower{display:flex;gap:8px;margin-top:8px}.art-lower span{height:20px;flex:1;border-radius:4px;background:#e6edf3}.floating-chip{position:absolute;z-index:4;display:flex;align-items:center;gap:9px;padding:10px 13px;background:#fff;border:1px solid #e9eff2;border-radius:10px;box-shadow:0 13px 28px #07172535;color:var(--navy);min-width:160px}.floating-chip>span{height:30px;width:30px;border-radius:8px;background:#e8f7ed;color:var(--green);display:grid;place-items:center;font-size:18px;font-weight:800}.floating-chip div{display:flex;flex-direction:column;line-height:1.4}.floating-chip small{font-size:8px;letter-spacing:1.4px;color:#8c98a5;font-weight:800}.floating-chip b{font-size:10px}.chip-sales{top:44px;left:-5px}.chip-stock{bottom:27px;right:-6px}.chip-stock>span{background:#f7f1db;color:#a38313}.hero-sticker{position:absolute;bottom:35px;left:2%;width:67px;height:67px;border-radius:50%;background:var(--gold);color:#28344a;display:grid;place-content:center;text-align:center;font-size:8px;letter-spacing:1px;font-weight:800;line-height:1.3;transform:rotate(-13deg);box-shadow:0 8px 22px #0002}.hero-sticker b{font-size:8px}
.intro-note{display:flex;gap:13px;align-items:flex-start;margin:27px 0 39px;padding:17px 20px;border:1px solid #dcebe3;background:#f2faf5;border-radius:12px;color:#52685c}.note-icon{display:grid;place-items:center;flex:0 0 23px;height:23px;border-radius:50%;background:#d5efdf;color:var(--green);font-size:13px;font-weight:800}.intro-note p{margin:0;font-size:12px;line-height:1.8}.intro-note strong{color:#1c6f43}
.section-block{margin:0 0 52px;scroll-margin-top:104px}.section-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;margin-bottom:24px}.section-label{color:var(--green);display:block;margin-bottom:7px}.section-heading h2{margin:0;color:var(--navy);font:800 clamp(22px,2.4vw,29px)/1.25 Manrope,sans-serif;letter-spacing:-1px}.section-heading p{color:#748194;font-size:13px;margin:9px 0 0;line-height:1.7}.heading-index{font:800 25px/1 Manrope,sans-serif;color:#e2e7ed;letter-spacing:-1px;padding-top:8px}.setup-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}.setup-card{position:relative;min-height:170px;padding:21px 19px;background:#fff;border:1px solid #e8edf2;border-radius:12px;box-shadow:0 4px 15px #1c345308;color:var(--ink);transition:transform .18s,box-shadow .18s,border .18s;display:flex;flex-direction:column;align-items:flex-start}.setup-card:hover{transform:translateY(-3px);border-color:#c5dfd0;box-shadow:var(--shadow);color:var(--ink)}.step-number{position:absolute;right:17px;top:16px;color:#c3ccd6;font:800 12px Manrope,sans-serif}.setup-icon{width:37px;height:37px;border-radius:11px;display:grid;place-items:center;font-size:19px;margin-bottom:13px}.green-icon{background:#e6f6ec;color:#198754}.blue-icon{background:#e9efff;color:#3b66cc}.gold-icon{background:#fbf4d9;color:#a4871c}.purple-icon{background:#f0eafe;color:#8255cb}.orange-icon{background:#fff0e5;color:#d16b23}.teal-icon{background:#e2f6f3;color:#12877a}.setup-card strong{font:800 13px Manrope,sans-serif;color:var(--navy)}.setup-card p{font-size:11px;line-height:1.65;color:#778495;margin:7px 10px 0 0}.card-arrow{position:absolute;right:17px;bottom:15px;color:#a4b0bd;font-size:17px}.callout{display:flex;align-items:flex-start;gap:12px;padding:15px 17px;border-radius:10px;margin:20px 0;border:1px solid transparent}.callout>span{flex:0 0 21px;width:21px;height:21px;display:grid;place-items:center;border-radius:50%;font-weight:800;font-size:12px}.callout strong{display:block;font-size:12px;margin-bottom:3px}.callout p{margin:0;font-size:12px;line-height:1.7}.callout-warning{background:#fff9e9;border-color:#f2e4b5;color:#745d15}.callout-warning>span{background:#f5e6ae;color:#8a6b0d}.callout-info{background:#eef6ff;border-color:#dceafa;color:#3b5c80}.callout-info>span{background:#dcecff;color:#316ab0}
.map-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.map-grid>a{display:flex;align-items:center;gap:13px;min-height:77px;padding:14px 15px;border:1px solid #e6ebf0;border-radius:10px;background:#fff;color:var(--ink);transition:border .18s,transform .18s}.map-grid>a:hover{border-color:#b8dcc6;transform:translateY(-2px)}.map-icon{width:39px;height:39px;flex:0 0 39px;display:grid;place-items:center;border-radius:10px;background:#edf7f0;color:var(--green);font-size:19px}.map-grid div{display:flex;flex-direction:column;min-width:0}.map-grid strong{font:800 12px Manrope,sans-serif;color:var(--navy)}.map-grid small{font-size:10px;color:#8591a0;margin-top:2px;line-height:1.5}.map-grid>a>span:last-child{margin-left:auto;color:#9aa6b2;font-size:16px}
.guide-section{background:#fff;border:1px solid #e8edf2;border-radius:15px;padding:31px 34px;box-shadow:0 6px 24px #19345105}.guide-section .section-heading{margin-bottom:22px}.guide-section h3{font:800 15px/1.4 Manrope,sans-serif;color:var(--navy);letter-spacing:-.25px;margin:24px 0 10px}.guide-section h3:first-child{margin-top:0}.guide-section p{font-size:13px;color:#5d6b7d;line-height:1.85;margin:10px 0}.guide-section ul,.guide-section ol{padding-left:21px;color:#5d6b7d;font-size:12.5px;line-height:1.85;margin:10px 0 16px}.guide-section li{padding-left:3px;margin-bottom:5px}.guide-section li::marker{color:#26965d;font-weight:800}.guide-section strong{color:#324459}.article-columns{display:grid;grid-template-columns:1fr 1fr;gap:28px}.article-columns h3{margin-top:4px}.mini-tip{padding:13px 15px;background:#f3f8fb;border-left:3px solid #72a4d8;border-radius:0 8px 8px 0;margin:16px 0}.mini-tip strong{font-size:11px;color:#3e6995}.mini-tip p{font-size:11.5px;margin:3px 0 0;line-height:1.7}.table-wrap{width:100%;overflow-x:auto;border:1px solid #e8edf2;border-radius:9px;margin:16px 0 19px}table{width:100%;border-collapse:collapse;min-width:520px;font-size:11.5px;line-height:1.6}thead{background:#f6f8fb}th{font-size:10px;letter-spacing:.5px;color:#6b7789;text-align:left;padding:12px 14px;font-weight:800;border-bottom:1px solid #e3e9ef}td{padding:12px 14px;vertical-align:top;border-bottom:1px solid #edf0f4;color:#617083}tbody tr:last-child td{border-bottom:0}td:first-child{font-weight:700;color:#34475c}tbody tr:hover{background:#fbfcfd}
.screenshot-slot{margin:25px 0 2px;background:#fbfcfd;border:1px dashed #cbd5df;border-radius:11px;overflow:hidden;text-align:center}.image-placeholder{min-height:145px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:5px;padding:20px;background:radial-gradient(circle at 50% 0%,#f0f7f3,transparent 58%),#fbfcfd;color:#6d7d8e}.image-placeholder-icon{width:35px;height:35px;border-radius:9px;background:#e8f5ed;color:var(--green);font-size:21px;display:grid;place-items:center;margin-bottom:3px}.image-placeholder strong{font:800 12px Manrope,sans-serif;color:#42546a}.image-placeholder small{font-size:10px;color:#94a0ad}.screenshot-slot img{display:none;width:100%;height:auto;max-height:540px;object-fit:contain;background:#f4f7fa}.screenshot-slot.has-image .image-placeholder{display:none}.screenshot-slot.has-image img{display:block}.screenshot-slot figcaption{padding:9px 13px;border-top:1px solid #e9eef2;background:#fff;font-size:10px;color:#98a3af;text-align:left}.feature-grid{display:grid;gap:12px;margin:18px 0}.feature-grid.three-col{grid-template-columns:repeat(3,minmax(0,1fr))}.feature-grid.two-col{grid-template-columns:repeat(2,minmax(0,1fr))}.feature-card{border:1px solid #e7edf2;background:#fbfcfd;border-radius:10px;padding:16px}.feature-card>span{width:28px;height:28px;display:grid;place-items:center;background:#e9f6ee;color:var(--green);border-radius:8px;font-size:16px;margin-bottom:9px}.feature-card strong{display:block;font:800 12px Manrope,sans-serif;color:var(--navy)}.feature-card p{font-size:11px;line-height:1.7;margin:5px 0 0}.process-strip{display:flex;align-items:center;justify-content:space-between;gap:9px;background:#f5f9f7;border:1px solid #e2eee6;border-radius:11px;padding:15px;margin:22px 0}.process-strip>div{display:flex;align-items:center;flex-direction:column;text-align:center;gap:3px;flex:1}.process-strip>div span{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--green);color:#fff;font-size:11px;font-weight:800}.process-strip strong{font:800 11px Manrope,sans-serif;color:var(--navy)}.process-strip small{font-size:9px;color:#7f8c9c}.process-strip>i{font-style:normal;color:#a6b5ac}.prompt-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin:16px 0}.prompt-chip{display:flex;align-items:center;justify-content:space-between;gap:8px;text-align:left;padding:12px 13px;border:1px solid #e1e9e4;background:#f8fcf9;border-radius:8px;color:#375e48;font-size:11.5px;line-height:1.5}.prompt-chip:hover{border-color:#a7d5b8;background:#effaf3}.prompt-chip span{color:var(--green);font-size:16px}.small-muted{font-size:10.5px!important;color:#929eab!important}.troubleshoot-list{border:1px solid #e7edf2;border-radius:10px;overflow:hidden;margin:15px 0}.troubleshoot-list details{border-bottom:1px solid #e7edf2;background:#fff}.troubleshoot-list details:last-child{border-bottom:0}.troubleshoot-list summary{position:relative;cursor:pointer;list-style:none;padding:14px 42px 14px 16px;font:700 12px/1.5 Manrope,sans-serif;color:#34465b}.troubleshoot-list summary::-webkit-details-marker{display:none}.troubleshoot-list summary:after{content:"+";position:absolute;right:17px;top:50%;transform:translateY(-50%);width:22px;height:22px;display:grid;place-items:center;border-radius:6px;background:#eff7f2;color:var(--green);font-size:17px;font-weight:500}.troubleshoot-list details[open]>summary:after{content:"−"}.troubleshoot-list details>div{padding:0 17px 13px}.troubleshoot-list details p{font-size:12px;margin:0;line-height:1.8}.glossary-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-top:19px}.glossary-grid>div{padding:12px 14px;background:#f8fafc;border:1px solid #edf0f4;border-radius:8px}.glossary-grid strong{font:800 11px Manrope,sans-serif}.glossary-grid p{font-size:11px;margin:4px 0 0;line-height:1.6}.support-section{background:linear-gradient(135deg,#fff,#f9fcfa)}.support-card{display:grid;grid-template-columns:160px 1fr;align-items:center;gap:20px;border:1px solid #e2eee6;background:#f3faf6;border-radius:12px;padding:23px}.support-visual{height:135px;position:relative;display:grid;place-items:center;overflow:hidden}.support-visual>span{position:relative;z-index:2;display:grid;place-items:center;width:66px;height:66px;border-radius:20px;background:var(--green);color:#fff;font-size:32px;box-shadow:0 9px 24px #1987543b}.support-ring{position:absolute;border:1px solid #9bceb0;border-radius:50%;width:106px;height:106px}.ring-two{width:142px;height:142px;border-color:#c6e3d0}.support-copy h3{margin:0 0 5px}.support-copy p{font-size:11.5px;margin:0 0 13px}.support-copy .primary-button{font-size:11px;min-height:39px}.copy-status{font-size:10px;color:var(--green);margin-left:9px}.support-template{margin-top:14px;padding:17px;background:#fff;border:1px dashed #c9d7cd;border-radius:8px;color:#708093;font-size:11px;line-height:2.05;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.support-template strong{font-family:Manrope,sans-serif;color:#2a4b36}.checklist-card{padding:19px 21px;border:1px solid #e3e9ee;background:#fff;border-radius:12px;box-shadow:0 7px 20px #19345106}.checklist-card label{display:flex;align-items:flex-start;gap:11px;padding:11px 2px;border-bottom:1px solid #f0f3f6;color:#586a7d;font-size:12px;cursor:pointer}.checklist-card label:last-of-type{border-bottom:0}.checklist-card input[type=checkbox]{flex:0 0 auto;width:16px;height:16px;margin:2px 0 0;accent-color:var(--green)}.checklist-card label:has(input:checked){color:#82918a;text-decoration:line-through;text-decoration-color:#a8bcb0}.checklist-footer{display:flex;align-items:center;justify-content:space-between;margin-top:15px;color:#6f7e8e;font-size:11px;font-weight:700}.checklist-footer .text-button{color:var(--green);font-size:11px}.checklist-progress-track{height:5px;background:#edf1f4;border-radius:6px;overflow:hidden;margin-top:9px}.checklist-progress-track span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--green),#78c99c);border-radius:6px;transition:width .2s}.closing-note{padding:12px 16px;margin-top:17px!important;border-left:3px solid var(--gold);background:#fffcf2;color:#6a633f!important;font-size:12px!important}.guide-footer{padding:28px 0 6px;border-top:1px solid #e2e8ee;text-align:center;color:#8995a4}.footer-brand{display:inline-flex;align-items:center;gap:9px;color:var(--navy)}.footer-brand:hover{color:var(--navy)}.footer-brand strong{font:800 16px Manrope,sans-serif}.small-mark{height:29px;width:29px;border-radius:8px;font-size:14px;letter-spacing:-1px}.small-mark span{font-size:9px;top:3px;right:4px}.guide-footer>p{font-size:10.5px;margin:8px 0}.footer-links{display:flex;justify-content:center;gap:18px;margin:12px 0}.footer-links a{font-size:10.5px;font-weight:700}.guide-footer .fine-print{max-width:750px;margin:16px auto 0;line-height:1.75;color:#a1aab5;font-size:9.5px}.back-to-top{position:fixed;z-index:800;right:24px;bottom:23px;width:42px;height:42px;border-radius:12px;background:var(--navy);color:#fff;border:0;box-shadow:0 7px 20px #10223b35;font-size:20px;opacity:0;visibility:hidden;transform:translateY(8px);transition:all .2s}.back-to-top.visible{opacity:1;visibility:visible;transform:translateY(0)}.back-to-top:hover{background:var(--green)}.sidebar-overlay{display:none}.search-status{display:none}.search-status:not(:empty){display:block;margin:17px auto 0;width:min(1040px,calc(100% - 88px));font-size:12px;color:#637385}.guide-section[hidden],.section-block[hidden],.hero[hidden],.nav-link[hidden],.nav-group[hidden]{display:none!important}.toast{position:fixed;z-index:3000;bottom:24px;left:50%;transform:translate(-50%,20px);background:#122d46;color:#fff;padding:11px 17px;border-radius:9px;box-shadow:0 12px 30px #10223b35;font-size:12px;opacity:0;visibility:hidden;transition:all .25s}.toast.visible{opacity:1;visibility:visible;transform:translate(-50%,0)}
@media(min-width:1500px){.content-width{width:min(1100px,calc(100% - 100px))}.hero{padding-left:calc((100% - 1200px)/2);padding-right:calc((100% - 1200px)/2)}}
@media(max-width:1200px){:root{--sidebar-width:258px}.hero{padding-left:40px;padding-right:34px}.hero h1{letter-spacing:-1.5px}.hero-art{transform:scale(.92)}.content-width{width:calc(100% - 56px)}.search-status{width:calc(100% - 56px)}.topbar{padding:0 28px}.hero-trust{font-size:9px}}
@media(max-width:980px){:root{--sidebar-width:278px}.sidebar{transform:translateX(-101%);transition:transform .25s ease;box-shadow:none}.sidebar.open{transform:translateX(0);box-shadow:12px 0 40px #07172925}.sidebar-close,.menu-toggle{display:inline-grid}.sidebar-overlay{display:block;position:fixed;z-index:950;inset:0;background:#0c1b2c70;opacity:0;visibility:hidden;transition:opacity .25s}.sidebar-overlay.visible{opacity:1;visibility:visible}.app-shell{margin-left:0}.topbar{height:70px}.hero{min-height:auto;padding:44px 34px;grid-template-columns:1.15fr .85fr}.hero-art{transform:scale(.86);margin-left:-15px;margin-right:-25px}.hero h1{font-size:clamp(29px,4.1vw,40px)}.hero-trust{flex-wrap:wrap}.guide-section{padding:26px}.content-width{width:calc(100% - 50px)}}
@media(max-width:700px){body{font-size:14px}.topbar{height:64px;padding:0 15px;gap:10px}.topbar-left{gap:10px}.crumbs{font-size:11px;gap:7px}.topbar-actions{gap:7px}.search-box{width:clamp(140px,42vw,250px);height:38px;padding:0 8px}.search-box kbd{display:none}.outline-button{width:38px;padding:0;justify-content:center;font-size:0}.outline-button span{font-size:17px}.menu-toggle{width:35px;height:35px}.hero{grid-template-columns:1fr;padding:40px 25px 20px;gap:0}.hero-copy{max-width:600px}.hero h1{font-size:36px;letter-spacing:-1.5px}.hero-description{font-size:12px}.hero-art{height:215px;margin:10px auto 0;width:100%;max-width:440px;transform:none}.art-window{max-width:310px;transform:perspective(900px) rotateY(-4deg) rotateX(1deg)}.art-window-body{min-height:170px}.art-content{padding:12px}.art-chart{height:58px}.art-metrics span{height:38px}.chip-sales{top:15px;left:0;transform:scale(.83);transform-origin:left top}.chip-stock{right:0;bottom:12px;transform:scale(.83);transform-origin:right bottom}.hero-sticker{bottom:8px;left:5%;transform:scale(.8) rotate(-13deg)}.content-width{width:calc(100% - 30px)}.intro-note{margin:18px 0 31px;padding:14px}.intro-note p{font-size:11px}.section-block{margin-bottom:37px}.section-heading{gap:12px;margin-bottom:19px}.section-heading h2{font-size:23px}.section-heading p{font-size:12px}.heading-index{font-size:20px}.setup-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.setup-card{padding:16px 13px;min-height:159px}.setup-card strong{font-size:11px}.setup-card p{font-size:10.5px}.step-number{top:12px;right:12px;font-size:10px}.setup-icon{width:32px;height:32px;border-radius:9px;font-size:16px;margin-bottom:10px}.map-grid{grid-template-columns:1fr}.map-grid>a{min-height:68px}.guide-section{padding:21px 17px;border-radius:12px}.article-columns{grid-template-columns:1fr;gap:12px}.article-columns h3{margin-top:16px}.guide-section h3{font-size:14px}.guide-section p{font-size:12px}.guide-section ul,.guide-section ol{font-size:11.8px;padding-left:19px}.feature-grid.three-col{grid-template-columns:1fr}.feature-grid.two-col{grid-template-columns:repeat(2,minmax(0,1fr))}.feature-card{padding:13px}.feature-card p{font-size:10.5px}.process-strip{padding:11px 7px;gap:4px}.process-strip small{font-size:8px}.process-strip strong{font-size:10px}.prompt-grid{grid-template-columns:1fr}.glossary-grid{grid-template-columns:1fr}.support-card{grid-template-columns:1fr;padding:17px;gap:7px}.support-visual{height:95px}.support-visual>span{width:54px;height:54px;font-size:26px}.support-ring{width:85px;height:85px}.ring-two{width:115px;height:115px}.support-copy{text-align:center}.copy-status{display:block;margin:6px 0}.search-status{width:calc(100% - 30px);margin:12px auto 0}.guide-footer .fine-print{font-size:9px}.footer-links{gap:10px;flex-wrap:wrap}.back-to-top{right:14px;bottom:14px;width:38px;height:38px}}
@media(max-width:390px){.crumbs span:first-child,.crumb-separator{display:none}.topbar{gap:8px}.search-box{width:142px}.hero h1{font-size:31px}.hero-buttons{gap:14px;flex-wrap:wrap}.hero-trust{gap:5px;font-size:9px}.setup-grid{grid-template-columns:1fr}.setup-card{min-height:132px}.setup-icon{margin-bottom:8px}.section-heading h2{font-size:21px}.feature-grid.two-col{grid-template-columns:1fr}.process-strip>i{display:none}.process-strip{flex-wrap:wrap}.process-strip>div{min-width:65px}}
@media print{body{background:#fff;color:#111;font-size:11pt}.sidebar,.topbar,.reading-progress,.back-to-top,.sidebar-overlay,.hero-buttons,.hero-art,.prompt-chip,.support-card .primary-button,.checklist-footer button,.toast{display:none!important}.app-shell{margin:0}.main-content{padding:0}.hero{display:block;min-height:0;padding:25px;background:#10223b!important;color:#fff!important;print-color-adjust:exact;-webkit-print-color-adjust:exact}.hero h1{font-size:28pt}.content-width{width:100%;max-width:none}.intro-note,.guide-section,.section-block,.checklist-card{break-inside:avoid;box-shadow:none}.guide-section{padding:18px;margin-bottom:20px;border:1px solid #ccc}.section-heading h2{font-size:18pt}.section-block[hidden],.guide-section[hidden],.hero[hidden]{display:block!important}.screenshot-slot{break-inside:avoid}.image-placeholder{min-height:75px}.guide-footer{break-inside:avoid}.troubleshoot-list details{break-inside:avoid}.troubleshoot-list details>div{display:block!important}.guide-map .map-grid a{color:#111}.search-status{display:none!important}a{color:#111;text-decoration:none}}


/* MySale.pk premium glassmorphism refresh — accessible, readable, responsive */
:root{
  --glass-white:rgba(255,255,255,.76);
  --glass-border:rgba(255,255,255,.72);
  --glass-shadow:0 18px 55px rgba(16,34,59,.10);
  --sidebar-width:304px;
}
body{
  font-size:17px;
  line-height:1.82;
  background:
          radial-gradient(ellipse at 7% 4%,rgba(25,135,84,.11),transparent 31%),
          radial-gradient(ellipse at 94% 9%,rgba(212,175,55,.13),transparent 27%),
          linear-gradient(135deg,#f3f8f6 0%,#f3f6fc 48%,#fbf8ef 100%);
  background-attachment:fixed;
}
.brand-row{height:96px;padding:0 21px;background:rgba(255,255,255,.66);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);border-bottom:1px solid rgba(255,255,255,.8)}
.brand{gap:12px;min-width:0}
.brand-logo{display:block;width:138px;height:54px;max-width:48%;object-fit:contain;object-position:left center;flex:0 0 auto}
.brand-words strong{font-size:21px}
.brand-words small{font-size:11px;letter-spacing:2.1px}
.footer-logo{width:126px;height:42px;max-width:unset}
.sidebar{
  background:rgba(250,253,252,.78);
  backdrop-filter:blur(28px) saturate(150%);
  -webkit-backdrop-filter:blur(28px) saturate(150%);
  border-right:1px solid rgba(255,255,255,.9);
  box-shadow:12px 0 42px rgba(16,34,59,.045);
}
.sidebar-intro p{font-size:18px}
.eyebrow,.nav-heading,.section-label{font-size:11px;letter-spacing:1.7px}
.nav-link{font-size:14px;line-height:1.45;min-height:43px;border-radius:11px}
.nav-heading{margin-top:24px}
.sidebar-help-card{background:rgba(255,255,255,.65);border:1px solid rgba(255,255,255,.95);border-radius:18px;box-shadow:0 12px 32px rgba(16,34,59,.06);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.app-shell{min-height:100vh}
.topbar{
  background:rgba(250,252,255,.72);
  backdrop-filter:blur(24px) saturate(155%);
  -webkit-backdrop-filter:blur(24px) saturate(155%);
  border-bottom:1px solid rgba(255,255,255,.86);
  box-shadow:0 8px 32px rgba(16,34,59,.045);
}
.crumbs{font-size:14px}
.search-box{background:rgba(255,255,255,.77);border:1px solid rgba(255,255,255,.95);box-shadow:0 6px 22px rgba(16,34,59,.05);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.search-box input{font-size:15px}
.outline-button{font-size:14px}
.hero{
  position:relative;isolation:isolate;overflow:hidden;
  background:linear-gradient(125deg,rgba(10,35,57,.96),rgba(17,74,62,.94) 58%,rgba(25,92,68,.91));
  box-shadow:0 25px 75px rgba(16,34,59,.19);
}
.hero:before,.hero:after{content:"";position:absolute;z-index:-1;border-radius:50%;pointer-events:none;filter:blur(2px)}
.hero:before{width:410px;height:410px;right:-110px;top:-190px;background:radial-gradient(circle,rgba(255,255,255,.18),rgba(255,255,255,0) 70%)}
.hero:after{width:360px;height:360px;left:28%;bottom:-290px;background:radial-gradient(circle,rgba(212,175,55,.23),rgba(212,175,55,0) 70%)}
.hero h1{font-size:clamp(39px,3.3vw,56px);line-height:1.18;letter-spacing:-1.7px}
.hero-description{font-size:17px;line-height:1.85;max-width:650px}
.hero-kicker{font-size:12px;letter-spacing:2px}
.primary-button,.text-button{font-size:15px}
.hero-trust{font-size:12px}
.art-window{border:1px solid rgba(255,255,255,.6);box-shadow:0 28px 80px rgba(0,0,0,.28);backdrop-filter:blur(16px)}
.content-width{width:min(1120px,calc(100% - 88px))}
.intro-note,.guide-section,.setup-card,.feature-card,.checklist-card,.map-grid>a,.support-card,.glossary-grid>div{
  background:var(--glass-white);
  border:1px solid var(--glass-border);
  box-shadow:var(--glass-shadow);
  backdrop-filter:blur(18px) saturate(135%);
  -webkit-backdrop-filter:blur(18px) saturate(135%);
}
.intro-note{border-radius:20px;padding:21px 25px}
.intro-note p{font-size:15px;line-height:1.8}
.section-heading h2{font-size:clamp(26px,2.2vw,34px);letter-spacing:-.8px}
.section-heading p{font-size:15px;line-height:1.75}
.heading-index{font-size:25px}
.setup-card{border-radius:18px;min-height:185px;padding:22px;transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}
.setup-card:hover,.feature-card:hover,.map-grid>a:hover{transform:translateY(-4px);box-shadow:0 24px 54px rgba(16,34,59,.13);border-color:rgba(25,135,84,.3)}
.setup-card strong{font-size:15px;line-height:1.5}
.setup-card p{font-size:14px;line-height:1.75}
.setup-icon{width:43px;height:43px;border-radius:13px;font-size:20px}
.step-number{font-size:12px}
.guide-section{border-radius:22px;padding:clamp(24px,3vw,38px);box-shadow:0 18px 55px rgba(16,34,59,.075)}
.guide-section h3{font-size:19px;line-height:1.45}
.guide-section p{font-size:16px;line-height:1.85}
.guide-section ul,.guide-section ol{font-size:15.5px;line-height:1.9}
.guide-section li{padding-left:3px;margin:4px 0}
.guide-section .section-label{font-size:11px}
.feature-card{border-radius:16px;padding:20px}
.feature-card strong{font-size:15px}
.feature-card p{font-size:14px;line-height:1.75}
.map-grid>a{font-size:15px;border-radius:15px}
.process-strip{border-radius:17px;background:rgba(255,255,255,.65);border:1px solid rgba(255,255,255,.85);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.process-strip small{font-size:12px}
.process-strip strong{font-size:14px}
.prompt-chip{font-size:13px}
.glossary-grid strong{font-size:13px}
.glossary-grid p{font-size:13px;line-height:1.7}
.support-card{border-radius:20px}
.support-copy h3{font-size:21px}
.support-copy p{font-size:15px;line-height:1.8}
.support-template{font-size:13px;line-height:1.9;border-radius:12px}
.checklist-card{border-radius:18px;padding:23px}
.checklist-card label{font-size:15px;line-height:1.7}
.checklist-footer{font-size:13px}
.screenshot-slot{border-radius:18px;overflow:hidden}
.image-placeholder{border:1.5px dashed rgba(25,135,84,.45);background:linear-gradient(135deg,rgba(255,255,255,.72),rgba(233,247,239,.64));border-radius:15px;min-height:175px}
.image-placeholder strong{font-size:15px}
.image-placeholder small{font-size:13px}
.screenshot-slot figcaption{font-size:13px;line-height:1.7}
.guide-footer{font-size:13px}
.guide-footer>p,.footer-links a{font-size:13px}
.guide-footer .fine-print{font-size:12px;line-height:1.8}
.back-to-top{width:48px;height:48px;border-radius:15px;backdrop-filter:blur(14px);box-shadow:0 12px 30px rgba(16,34,59,.25)}
.toast{font-size:14px;border-radius:14px;padding:14px 20px;backdrop-filter:blur(18px)}
.brand-logo{filter:drop-shadow(0 3px 7px rgba(16,34,59,.08))}
@media(max-width:1200px){.content-width{width:calc(100% - 58px)}.hero h1{font-size:clamp(37px,4.3vw,50px)}}
@media(max-width:980px){.sidebar{background:rgba(248,252,250,.9)}.nav-link{font-size:14px}.hero-description{font-size:16px}.guide-section{padding:26px}.content-width{width:calc(100% - 50px)}}
@media(max-width:700px){
  body{font-size:16px;line-height:1.8;background-attachment:scroll}
  .brand-row{height:84px}.brand-logo{width:116px;height:47px}.footer-logo{width:116px;height:39px}
  .topbar{background:rgba(250,252,255,.88)}.crumbs{font-size:12px}
  .hero{padding:39px 24px 20px}.hero h1{font-size:clamp(34px,8vw,43px);line-height:1.2}.hero-description{font-size:15px;line-height:1.8}.hero-kicker{font-size:11px}.hero-trust{font-size:11px}
  .content-width{width:calc(100% - 28px)}.intro-note{padding:17px;border-radius:16px}.intro-note p{font-size:14px}
  .section-heading h2{font-size:25px}.section-heading p{font-size:14px}.setup-card{padding:17px;min-height:166px}.setup-card strong{font-size:14px}.setup-card p{font-size:13px}
  .guide-section{padding:22px 18px;border-radius:17px}.guide-section h3{font-size:18px}.guide-section p{font-size:15px}.guide-section ul,.guide-section ol{font-size:14.5px;line-height:1.85}
  .feature-card{padding:16px}.feature-card strong{font-size:14px}.feature-card p{font-size:13px}.process-strip small{font-size:10px}.process-strip strong{font-size:12px}
  .support-copy h3{font-size:19px}.support-copy p{font-size:14px}.checklist-card label{font-size:14px}.glossary-grid p{font-size:13px}
  .image-placeholder{min-height:145px}.image-placeholder strong{font-size:14px}.image-placeholder small{font-size:12px}.screenshot-slot figcaption{font-size:12px}
  .guide-footer .fine-print{font-size:11px}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
@media(prefers-reduced-transparency:reduce){.sidebar,.topbar,.intro-note,.guide-section,.setup-card,.feature-card,.checklist-card,.map-grid>a,.support-card{backdrop-filter:none;-webkit-backdrop-filter:none;background:#fff}}
@media print{body{font-size:12pt;background:#fff}.brand-logo{max-width:140px}.hero h1{font-size:28pt}.guide-section p{font-size:11pt}.guide-section ul,.guide-section ol{font-size:10.5pt}}

/* MYSALE.PK SIGNATURE UI — premium glass, stronger hierarchy and subtle motion */
:root{--ms-ink:#10243a;--ms-green:#087f5b;--ms-gold:#d8b65c}
html{scroll-padding-top:100px}
body{background:radial-gradient(ellipse at 14% 4%,rgba(18,168,121,.12),transparent 32%),radial-gradient(ellipse at 90% 16%,rgba(216,182,92,.13),transparent 28%),linear-gradient(145deg,#f4f9f7 0%,#f5f7fb 48%,#edf5f1 100%);background-attachment:fixed}
body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;background-image:radial-gradient(rgba(16,36,58,.065) .65px,transparent .65px);background-size:19px 19px;opacity:.22}
.sidebar{background:linear-gradient(165deg,rgba(250,253,252,.93),rgba(239,248,244,.82) 56%,rgba(248,250,253,.9));border-right:1px solid rgba(255,255,255,.92);box-shadow:14px 0 55px rgba(16,36,58,.055);backdrop-filter:blur(28px) saturate(160%);-webkit-backdrop-filter:blur(28px) saturate(160%)}
.brand-logo{object-fit:contain;transition:transform .35s ease,filter .35s ease}.brand:hover .brand-logo{transform:translateY(-2px) scale(1.025);filter:drop-shadow(0 8px 14px rgba(8,127,91,.17))}
.sidebar-intro{margin:8px 18px 18px;padding:17px;border-radius:18px;background:linear-gradient(135deg,rgba(8,127,91,.09),rgba(255,255,255,.6));border:1px solid rgba(8,127,91,.1)}
.nav-link{margin:3px 12px;border:1px solid transparent;border-radius:12px;transition:background .2s ease,transform .2s ease,border-color .2s ease}.nav-link:hover{transform:translateX(3px);background:rgba(255,255,255,.76);border-color:rgba(8,127,91,.12)}
.nav-link.active{color:#066c4c;font-weight:800;background:linear-gradient(100deg,rgba(18,168,121,.15),rgba(255,255,255,.84));border-color:rgba(8,127,91,.17);box-shadow:inset 3px 0 0 #0b9b6c,0 6px 18px rgba(8,127,91,.06)}
.topbar{background:rgba(247,251,249,.76);border-bottom:1px solid rgba(255,255,255,.86);box-shadow:0 8px 30px rgba(16,36,58,.035);backdrop-filter:blur(24px) saturate(160%);-webkit-backdrop-filter:blur(24px) saturate(160%)}
.search-box{border:1px solid rgba(16,36,58,.09);background:rgba(255,255,255,.78);box-shadow:inset 0 1px 0 #fff,0 8px 22px rgba(16,36,58,.045);transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease}.search-box:focus-within{border-color:rgba(8,127,91,.42);box-shadow:0 0 0 4px rgba(18,168,121,.1),0 12px 30px rgba(16,36,58,.07);transform:translateY(-1px)}
.outline-button,.icon-button{border:1px solid rgba(16,36,58,.11);background:rgba(255,255,255,.72);box-shadow:0 6px 20px rgba(16,36,58,.045);transition:transform .2s ease,box-shadow .2s ease}.outline-button:hover,.icon-button:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(16,36,58,.1)}
.hero{isolation:isolate;overflow:hidden;border-radius:0 0 34px 34px;background:radial-gradient(ellipse at 88% 8%,rgba(53,211,157,.23),transparent 33%),radial-gradient(ellipse at 65% 100%,rgba(216,182,92,.2),transparent 36%),linear-gradient(122deg,#0d263c 0%,#123d45 49%,#087f5b 100%);box-shadow:0 30px 80px rgba(13,38,60,.18)}
.hero:before{width:520px;height:520px;right:-130px;top:-245px;background:radial-gradient(circle,rgba(255,255,255,.2),transparent 70%)}.hero:after{width:480px;height:480px;left:34%;bottom:-360px;background:radial-gradient(circle,rgba(216,182,92,.24),transparent 70%)}
.hero-kicker{display:inline-flex;align-items:center;gap:10px;padding:9px 13px;border-radius:999px;border:1px solid rgba(255,255,255,.19);background:rgba(255,255,255,.08);backdrop-filter:blur(12px)}
.hero h1{max-width:760px;text-wrap:balance;text-shadow:0 5px 30px rgba(0,0,0,.12)}.hero h1 span{color:#a7f3cf;background:linear-gradient(90deg,#c7f7df,#e7d39b);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.primary-button{background:linear-gradient(135deg,#fff,#eaf8f0);color:#075c43;box-shadow:0 12px 32px rgba(0,0,0,.16),inset 0 1px 0 #fff;border:1px solid rgba(255,255,255,.75);transition:transform .22s ease,box-shadow .22s ease}.primary-button:hover{transform:translateY(-3px);box-shadow:0 18px 42px rgba(0,0,0,.22)}
.text-button{border:1px solid rgba(255,255,255,.2);border-radius:13px;background:rgba(255,255,255,.075);backdrop-filter:blur(12px)}
.art-window{border-radius:22px;transform:perspective(1100px) rotateY(-5deg) rotateX(2deg);background:rgba(255,255,255,.9);transition:transform .45s cubic-bezier(.2,.8,.2,1)}.hero-art:hover .art-window{transform:perspective(1100px) rotateY(0) rotateX(0) translateY(-4px)}
.floating-chip{border:1px solid rgba(255,255,255,.7);background:rgba(255,255,255,.85);backdrop-filter:blur(20px) saturate(150%);box-shadow:0 20px 48px rgba(0,0,0,.17)}.hero-sticker{border:1px solid rgba(255,255,255,.32);background:rgba(255,255,255,.1);backdrop-filter:blur(14px);box-shadow:0 14px 34px rgba(0,0,0,.12)}
.content-width{max-width:1240px}.intro-note,.guide-section,.setup-card,.feature-card,.checklist-card,.map-grid>a,.support-card,.glossary-grid>div{background:linear-gradient(145deg,rgba(255,255,255,.85),rgba(255,255,255,.6));border:1px solid rgba(255,255,255,.95);box-shadow:0 18px 55px rgba(16,36,58,.065),inset 0 1px 0 rgba(255,255,255,.9);backdrop-filter:blur(22px) saturate(145%);-webkit-backdrop-filter:blur(22px) saturate(145%)}
.intro-note{position:relative;overflow:hidden}.intro-note:before{content:"";position:absolute;left:0;top:14px;bottom:14px;width:4px;border-radius:4px;background:linear-gradient(#0b9b6c,#d8b65c)}
.section-heading h2{color:#112a40;text-wrap:balance}.heading-index{display:grid;place-items:center;flex:0 0 auto;width:54px;height:54px;border-radius:17px;color:#087f5b;font-size:22px;background:linear-gradient(145deg,rgba(18,168,121,.13),rgba(216,182,92,.13));border:1px solid rgba(8,127,91,.12)}
.setup-card,.feature-card,.map-grid>a{position:relative;overflow:hidden}.setup-card:before,.feature-card:before,.map-grid>a:before{content:"";position:absolute;inset:0 auto auto 0;width:100%;height:3px;background:linear-gradient(90deg,#0b9b6c,#d8b65c,transparent 85%);opacity:.7}
.setup-card:hover,.feature-card:hover,.map-grid>a:hover{transform:translateY(-5px);border-color:rgba(8,127,91,.27);box-shadow:0 25px 60px rgba(16,36,58,.12),inset 0 1px 0 rgba(255,255,255,.95)}
.guide-section{position:relative;overflow:hidden}.guide-section:after{content:"";position:absolute;top:0;right:0;width:190px;height:190px;pointer-events:none;background:radial-gradient(circle at top right,rgba(18,168,121,.055),transparent 72%)}.guide-section h3{color:#17374b}.guide-section a:not(.primary-button){color:#087f5b;text-underline-offset:3px}.steps-list li::marker{color:#0b9b6c;font-weight:800}
.callout{border-radius:16px;border:1px solid rgba(8,127,91,.12);box-shadow:0 8px 24px rgba(16,36,58,.035)}.table-wrap{border:1px solid rgba(16,36,58,.08);border-radius:15px;overflow:hidden;box-shadow:0 12px 30px rgba(16,36,58,.04)}table thead{background:linear-gradient(100deg,rgba(8,127,91,.1),rgba(216,182,92,.1))}tbody tr{transition:background .18s ease}tbody tr:hover{background:rgba(18,168,121,.045)}
.image-placeholder{background:radial-gradient(circle at 85% 15%,rgba(216,182,92,.13),transparent 27%),linear-gradient(135deg,rgba(255,255,255,.9),rgba(232,247,239,.68));border:1.5px dashed rgba(8,127,91,.36);transition:background .25s ease,border-color .25s ease,transform .25s ease}.screenshot-slot:hover .image-placeholder{border-color:rgba(8,127,91,.62);transform:translateY(-2px)}
.guide-footer{border-top:1px solid rgba(255,255,255,.9)}.back-to-top{background:rgba(8,127,91,.9);border:1px solid rgba(255,255,255,.45)}.reading-progress span{background:linear-gradient(90deg,#0b9b6c,#d8b65c);box-shadow:0 0 12px rgba(18,168,121,.3)}::selection{background:rgba(18,168,121,.22);color:#10243a}
@keyframes ms-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}.floating-chip{animation:ms-float 6s ease-in-out infinite}.chip-stock{animation-delay:-3s}
@media(max-width:980px){.hero{border-radius:0 0 26px 26px}.art-window{transform:none}.floating-chip{animation:none}}
@media(max-width:700px){body:before{opacity:.12}.hero{border-radius:0 0 22px 22px}.hero h1{letter-spacing:-1px}.hero-buttons{gap:10px}.primary-button,.text-button{min-height:46px}.section-heading{align-items:flex-start}.heading-index{width:42px;height:42px;border-radius:13px;font-size:17px}.guide-section{box-shadow:0 12px 34px rgba(16,36,58,.06),inset 0 1px 0 rgba(255,255,255,.85)}}
@media(prefers-reduced-motion:reduce){.floating-chip,.art-window{animation:none!important;transform:none!important}}
@media(prefers-reduced-transparency:reduce){.hero{background:#123d45}.sidebar,.topbar,.intro-note,.guide-section,.setup-card,.feature-card,.checklist-card,.map-grid>a,.support-card,.glossary-grid>div,.floating-chip{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:#fff}}



/* ── Bilingual English + Urdu guide tables ───────────────────── */
:root { --ms-urdu-line: rgba(8,127,91,.20); }
.hero-description-ur {
  direction:rtl; text-align:right; font-family:"Noto Nastaliq Urdu","Noto Naskh Arabic","Jameel Noori Nastaleeq",serif;
  color:rgba(255,255,255,.94); font-size:18px; line-height:2.15; max-width:680px; margin:10px 0 0;
}
.urdu-note,.urdu-heading,.urdu-inline,.nav-urdu,.sidebar-urdu,.urdu-panel-content {
  font-family:"Noto Nastaliq Urdu","Noto Naskh Arabic","Jameel Noori Nastaleeq",serif;
  direction:rtl; text-align:right; unicode-bidi:plaintext;
}
.urdu-note { color:#1c4e43; font-size:16px; line-height:2.2; margin-top:13px!important; padding:13px 15px 8px; border-radius:14px; background:linear-gradient(120deg,rgba(8,127,91,.065),rgba(255,255,255,.32)); border:1px solid rgba(8,127,91,.09); }
.urdu-heading { direction:rtl; text-align:right; color:#12634c; font-size:16px!important; line-height:2.15!important; margin:8px 0 0!important; font-weight:500; }
.standalone-urdu { margin-top:8px!important; }
.urdu-inline { display:block; margin:5px 0 0!important; color:#42665b; font-size:13px!important; line-height:2.05!important; font-weight:500; }
.map-grid .map-urdu { font-size:12px!important; color:#41685b; margin-top:6px!important; }
.checklist-urdu { color:#45685e; font-size:13px!important; padding-right:30px; }
.sidebar-urdu { color:#42665b; font-size:11px!important; line-height:2.0!important; }
.nav-bilingual-text { display:flex; flex-direction:column; align-items:stretch; gap:0; flex:1; min-width:0; }
.nav-english { display:block; line-height:1.45; }
.nav-urdu { display:block; color:#718479; font-size:10.5px; line-height:1.7; padding-top:1px; }
.nav-link.active .nav-urdu { color:#327461; }
.bilingual-table { width:100%; table-layout:fixed; border-collapse:separate; border-spacing:0; margin:18px 0 24px; overflow:hidden; border:1px solid rgba(15,55,64,.10); border-radius:19px; background:rgba(255,255,255,.35); box-shadow:0 15px 45px rgba(16,36,58,.065),inset 0 1px 0 rgba(255,255,255,.88); }
.bilingual-table thead th { width:50%; padding:15px 20px; color:#fff; text-align:left; font-size:12px; letter-spacing:1.5px; font-weight:850; background:linear-gradient(110deg,#123047,#087f5b); border:0; }
.bilingual-table thead th+th { text-align:right; background:linear-gradient(110deg,#087f5b,#123047); font-family:"Noto Nastaliq Urdu","Noto Naskh Arabic",serif; font-size:15px; letter-spacing:0; }
.bilingual-table tbody>tr>td { width:50%; vertical-align:top; padding:22px 23px; border:0; overflow-wrap:anywhere; }
.bilingual-table tbody>tr>td+td { border-left:1px solid var(--ms-urdu-line); background:linear-gradient(155deg,rgba(230,247,239,.53),rgba(255,255,255,.54)); }
.bilingual-table .language-content { min-width:0; }
.bilingual-table .english-content { direction:ltr; text-align:left; }
.bilingual-table .english-content>h3:first-child { margin-top:0; }
.bilingual-table .english-content>p:first-child { margin-top:0; }
.bilingual-table .english-content p { font-size:15px; line-height:1.85; }
.bilingual-table .english-content li { font-size:14.5px; line-height:1.85; margin:7px 0; }
.bilingual-table .english-content .article-columns { display:block; }
.bilingual-table .english-content .article-columns>div+div { margin-top:23px; padding-top:19px; border-top:1px solid rgba(16,36,58,.09); }
.bilingual-table .english-content .feature-grid { grid-template-columns:1fr; }
.bilingual-table .english-content .feature-card { padding:15px; }
.bilingual-table .english-content .table-wrap { max-width:100%; overflow-x:auto; }
.bilingual-table .english-content table { min-width:420px; }
.bilingual-table .english-content .process-strip { flex-wrap:wrap; }
.bilingual-table .english-content .prompt-grid { grid-template-columns:1fr; }
.bilingual-table .english-content .support-card { grid-template-columns:1fr; }
.urdu-panel-content { font-size:16px; line-height:2.15; color:#203e37; }
.urdu-panel-title { margin:0 0 10px!important; padding:0 0 13px; border-bottom:1px solid rgba(8,127,91,.16); color:#086548!important; font-family:"Noto Nastaliq Urdu","Noto Naskh Arabic",serif; font-size:23px!important; line-height:2.05!important; font-weight:700; }
.urdu-panel-intro { margin:0 0 20px!important; color:#43675b; background:rgba(255,255,255,.58); border-right:3px solid #0b9b6c; border-radius:10px 0 0 10px; padding:10px 13px 6px; font-size:15px!important; line-height:2.15!important; }
.urdu-panel-content h4 { margin:19px 0 8px!important; color:#153e35!important; font-family:"Noto Nastaliq Urdu","Noto Naskh Arabic",serif; font-size:18px!important; line-height:2.05!important; }
.urdu-steps,.urdu-bullets { padding-right:24px; padding-left:0; margin:6px 0 18px; }
.urdu-steps li,.urdu-bullets li { padding-right:4px; padding-left:0; margin:8px 0; font-size:15px; line-height:2.1; }
.urdu-steps li::marker,.urdu-bullets li::marker { color:#0b9b6c; font-weight:800; }
.bilingual-table .english-content .callout,.bilingual-table .english-content .mini-tip { margin:16px 0; }
.bilingual-table .english-content .screenshot-slot { display:none!important; }
@media(max-width:760px) {
  .bilingual-table { display:block; border-radius:15px; background:transparent; box-shadow:none; border:0; overflow:visible; }
  .bilingual-table thead { display:none; }
  .bilingual-table tbody,.bilingual-table tbody>tr { display:block; width:100%; }
  .bilingual-table tbody>tr>td { display:block; width:100%; padding:19px 17px; margin-bottom:12px; border:1px solid rgba(255,255,255,.94); border-radius:16px; box-shadow:0 12px 34px rgba(16,36,58,.065); }
  .bilingual-table tbody>tr>td:before { display:block; margin:-19px -17px 18px; padding:12px 17px; content:"ENGLISH GUIDE"; color:white; background:linear-gradient(110deg,#123047,#087f5b); font-size:11px; font-weight:850; letter-spacing:1.5px; border-radius:15px 15px 0 0; }
  .bilingual-table tbody>tr>td+td { border:1px solid rgba(8,127,91,.16); background:linear-gradient(150deg,rgba(230,247,239,.88),rgba(255,255,255,.82)); }
  .bilingual-table tbody>tr>td+td:before { content:"اردو رہنمائی"; text-align:right; direction:rtl; font-family:"Noto Nastaliq Urdu","Noto Naskh Arabic",serif; font-size:16px; letter-spacing:0; background:linear-gradient(110deg,#087f5b,#123047); }
  .bilingual-table .english-content p { font-size:15px; }
  .bilingual-table .english-content li { font-size:14px; }
  .urdu-panel-title { font-size:22px!important; }
  .urdu-panel-content h4 { font-size:17px!important; }
  .urdu-panel-intro,.urdu-steps li,.urdu-bullets li { font-size:15px!important; }
  .hero-description-ur { font-size:17px; line-height:2.05; }
  .nav-urdu { font-size:10px; }
}
@media print {
  .nav-urdu,.sidebar-urdu { display:none!important; }
  .bilingual-table { border:1px solid #bbb; box-shadow:none; background:#fff; }
  .bilingual-table thead th { background:#e9f0ed!important; color:#111!important; print-color-adjust:exact; -webkit-print-color-adjust:exact; }
  .bilingual-table tbody>tr>td+td { background:#f6faf8!important; }
  .bilingual-table .english-content p,.bilingual-table .english-content li,.urdu-steps li,.urdu-bullets li { font-size:10pt!important; }
  .urdu-panel-title { font-size:15pt!important; }
  .urdu-panel-content h4 { font-size:12pt!important; }
  .bilingual-table tbody>tr>td { padding:12px; }
  .urdu-note,.urdu-heading,.urdu-inline { color:#222!important; }
}

/* Final bilingual navigation polish */
.nav-group-urdu { display:block; margin-top:3px; direction:rtl; text-align:right; letter-spacing:0; font-family:"Noto Nastaliq Urdu","Noto Naskh Arabic",serif; font-size:10.5px; line-height:1.7; font-weight:500; color:#759083; }
.nav-heading { display:flex; flex-direction:column; gap:1px; }
.sidebar-intro-urdu { font-family:"Noto Nastaliq Urdu","Noto Naskh Arabic",serif; direction:rtl; text-align:right; font-size:12px; line-height:2; color:#4b7063; margin:4px 0 0; }
.footer-urdu-note { direction:rtl; text-align:center; font-family:"Noto Nastaliq Urdu","Noto Naskh Arabic",serif; font-size:13px!important; line-height:2.05!important; color:#537266; }
@media(max-width:700px){.nav-group-urdu{font-size:10px}.sidebar-intro-urdu{font-size:11.5px}}


/* MySale.pk bilingual table refinement — balanced columns, compact rhythm, zero duplicate headings */
.section-block { margin-bottom: 30px; }
.guide-section { padding: clamp(18px, 2.2vw, 28px); }
.section-heading { display:block; margin-bottom: 12px!important; }
.section-heading > div { width:100%; min-width:0; }
.section-heading .heading-index { display:none!important; }
.bilingual-heading-grid {
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:0;
  border:1px solid rgba(8,127,91,.16); border-radius:16px; overflow:hidden;
  background:rgba(255,255,255,.52); box-shadow:0 10px 28px rgba(16,36,58,.045), inset 0 1px 0 rgba(255,255,255,.9);
  margin:0 0 14px;
}
.chapter-heading-cell { min-width:0; padding:13px 17px 12px; }
.chapter-heading-english { text-align:left; background:linear-gradient(145deg,rgba(255,255,255,.82),rgba(247,251,249,.60)); }
.chapter-heading-urdu { text-align:right; border-left:1px solid rgba(8,127,91,.18); background:linear-gradient(145deg,rgba(225,246,235,.62),rgba(255,255,255,.6)); }
.chapter-language-label { display:block; margin:0 0 5px; font-size:9px; line-height:1.3; font-weight:900; letter-spacing:1.5px; color:#0b8a60; }
.chapter-heading-urdu .chapter-language-label { text-align:right; font-family:'Noto Nastaliq Urdu','Noto Naskh Arabic',serif; letter-spacing:0; font-size:13px; line-height:1.7; color:#087f5b; }
.chapter-heading-cell h2 { margin:0!important; color:#122b41; font:800 clamp(19px,1.8vw,26px)/1.28 Manrope,'DM Sans',sans-serif; letter-spacing:-.55px; overflow-wrap:anywhere; }
.chapter-heading-cell .chapter-title-urdu { margin:0!important; color:#0d684b; font:700 clamp(19px,1.9vw,25px)/1.85 'Noto Nastaliq Urdu','Noto Naskh Arabic',serif; letter-spacing:0; text-align:right; overflow-wrap:anywhere; }
.chapter-summary { margin:7px 0 0!important; color:#596d7c!important; font-size:13px!important; line-height:1.65!important; }
.chapter-heading-urdu .chapter-summary { font-family:'Noto Nastaliq Urdu','Noto Naskh Arabic',serif; font-size:14px!important; line-height:2!important; text-align:right; color:#45695c!important; }
.bilingual-table {
  display:grid!important; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:start;
  width:100%; margin:0 0 14px!important; border-spacing:0; table-layout:fixed; overflow:hidden;
  border:1px solid rgba(15,55,64,.12); border-radius:14px;
  background:rgba(255,255,255,.20); box-shadow:0 10px 27px rgba(16,36,58,.045),inset 0 1px 0 rgba(255,255,255,.8);
}
.bilingual-table > thead, .bilingual-table > tbody, .bilingual-table > thead > tr, .bilingual-table > tbody > tr { display:contents!important; }
.bilingual-table > thead > tr > th { display:block!important; width:auto!important; min-width:0; grid-row:1; padding:10px 15px!important; font-size:10px!important; letter-spacing:1.35px!important; }
.bilingual-table > thead > tr > th:first-child { grid-column:1; }
.bilingual-table > thead > tr > th:nth-child(2) { grid-column:2; }
.bilingual-table > tbody > tr > td {
  display:block!important; align-self:start; width:auto!important; min-width:0; min-height:0;
  padding:15px 16px!important; margin:0!important; overflow-wrap:anywhere; border:0!important;
}
.bilingual-table > tbody > tr > td:first-child { grid-column:1; grid-row:2; background:rgba(255,255,255,.30); }
.bilingual-table > tbody > tr > td:nth-child(2) { grid-column:2; grid-row:2; border-left:1px solid rgba(8,127,91,.17)!important; background:linear-gradient(155deg,rgba(230,247,239,.53),rgba(255,255,255,.42)); }
.bilingual-table .english-content p { margin:8px 0 10px!important; font-size:14px!important; line-height:1.72!important; }
.bilingual-table .english-content h3 { margin:15px 0 7px!important; font-size:16px!important; line-height:1.38!important; }
.bilingual-table .english-content h3:first-child { margin-top:0!important; }
.bilingual-table .english-content ul,.bilingual-table .english-content ol { margin:7px 0 12px!important; padding-left:21px; }
.bilingual-table .english-content li { margin:4px 0!important; font-size:13.5px!important; line-height:1.7!important; }
.bilingual-table .urdu-panel-content { font-size:15px; line-height:2; }
.bilingual-table .urdu-panel-content h4 { margin:12px 0 5px!important; font-size:16px!important; line-height:1.9!important; }
.bilingual-table .urdu-steps,.bilingual-table .urdu-bullets { margin:5px 0 10px!important; padding-right:20px; }
.bilingual-table .urdu-steps li,.bilingual-table .urdu-bullets li { margin:4px 0!important; font-size:14px!important; line-height:2!important; }
.bilingual-table .english-content .table-wrap { margin:10px 0 13px!important; }
.bilingual-table .english-content table { min-width:0!important; width:100%!important; table-layout:fixed; font-size:11px!important; }
.bilingual-table .english-content th,.bilingual-table .english-content td { padding:7px 8px!important; overflow-wrap:anywhere; }
.bilingual-table .english-content .feature-grid { gap:8px!important; }
.bilingual-table .english-content .feature-card { padding:11px!important; }
.bilingual-table .english-content .callout,.bilingual-table .english-content .mini-tip { margin:10px 0!important; padding:11px 12px!important; }
/* The heading and summary are now provided by the bilingual title grid, so only the detailed content remains inside the guide table. */
.section-heading .urdu-heading,.section-heading .section-label,.bilingual-table .urdu-panel-title,.bilingual-table .urdu-panel-intro { display:none!important; }
@media(max-width:760px) {
  .guide-section { padding:15px!important; border-radius:16px; }
  .section-block { margin-bottom:24px; }
  .bilingual-heading-grid { grid-template-columns:minmax(0,1fr); border-radius:13px; }
  .chapter-heading-cell { padding:12px 13px 11px; }
  .chapter-heading-urdu { border-left:0; border-top:1px solid rgba(8,127,91,.17); }
  .chapter-heading-cell h2 { font-size:20px; }
  .chapter-heading-cell .chapter-title-urdu { font-size:21px; }
  .bilingual-table { display:block!important; border:0; overflow:visible; border-radius:0; box-shadow:none; background:transparent; }
  .bilingual-table > thead { display:none!important; }
  .bilingual-table > tbody,.bilingual-table > tbody > tr { display:block!important; width:100%; }
  .bilingual-table > tbody > tr > td { display:block!important; width:100%!important; padding:13px 14px!important; margin:0 0 10px!important; border:1px solid rgba(255,255,255,.94)!important; border-radius:13px; box-shadow:0 8px 22px rgba(16,36,58,.055); }
  .bilingual-table > tbody > tr > td:first-child:before,.bilingual-table > tbody > tr > td:nth-child(2):before { display:block; margin:-13px -14px 12px; padding:9px 14px; content:'ENGLISH GUIDE'; color:#fff; background:linear-gradient(100deg,#123047,#087f5b); font-size:10px; font-weight:900; letter-spacing:1.2px; border-radius:12px 12px 0 0; }
  .bilingual-table > tbody > tr > td:nth-child(2) { border:1px solid rgba(8,127,91,.16)!important; background:linear-gradient(150deg,rgba(230,247,239,.88),rgba(255,255,255,.82)); }
  .bilingual-table > tbody > tr > td:nth-child(2):before { content:'اردو رہنمائی'; direction:rtl; text-align:right; font-family:'Noto Nastaliq Urdu','Noto Naskh Arabic',serif; font-size:15px; letter-spacing:0; background:linear-gradient(100deg,#087f5b,#123047); }
  .bilingual-table .english-content p { font-size:14px!important; }
  .bilingual-table .english-content li { font-size:13px!important; }
  .bilingual-table .urdu-steps li,.bilingual-table .urdu-bullets li { font-size:14px!important; }
}
@media(max-width:380px) {
  .chapter-heading-cell h2 { font-size:18px; }
  .chapter-heading-cell .chapter-title-urdu { font-size:19px; }
  .chapter-summary { font-size:12px!important; }
  .bilingual-table .english-content table { font-size:10px!important; }
}
@media print {
  .bilingual-heading-grid { break-inside:avoid; box-shadow:none; border-color:#bbb; }
  .bilingual-table { display:table!important; border:1px solid #bbb; box-shadow:none; }
  .bilingual-table > thead,.bilingual-table > tbody,.bilingual-table > thead > tr,.bilingual-table > tbody > tr { display:table-row-group!important; }
  .bilingual-table > thead > tr { display:table-row!important; }
  .bilingual-table > tbody > tr { display:table-row!important; }
  .bilingual-table > thead > tr > th,.bilingual-table > tbody > tr > td { display:table-cell!important; width:50%!important; padding:10px!important; }
  .bilingual-table > tbody > tr > td { align-self:auto; }
}


/* FINAL BILINGUAL LAYOUT POLISH — equal columns, compact spacing, mobile-first fit */
.bilingual-table {
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
  gap:0!important;
  width:100%!important;
  max-width:100%;
  margin:0 0 12px!important;
  border-spacing:0!important;
  table-layout:fixed!important;
  overflow:hidden;
}
.bilingual-table > thead > tr > th,
.bilingual-table > tbody > tr > td {
  box-sizing:border-box!important;
  min-width:0!important;
  max-width:100%;
  overflow-wrap:anywhere;
  word-break:normal;
}
.bilingual-table > thead > tr > th {
  padding:9px 12px!important;
  line-height:1.35!important;
}
.bilingual-table > tbody > tr > td {
  padding:12px 14px!important;
  vertical-align:top!important;
}
.bilingual-table > tbody > tr > td:nth-child(2) {
  border-left:1px solid rgba(8,127,91,.18)!important;
}
.bilingual-table .english-content p { margin:5px 0 8px!important; line-height:1.62!important; }
.bilingual-table .english-content h3 { margin:11px 0 5px!important; }
.bilingual-table .english-content h3:first-child { margin-top:0!important; }
.bilingual-table .english-content ul,
.bilingual-table .english-content ol { margin:5px 0 9px!important; }
.bilingual-table .english-content li { margin:3px 0!important; line-height:1.58!important; }
.bilingual-table .urdu-panel-content { line-height:1.9!important; }
.bilingual-table .urdu-panel-content h4 { margin:8px 0 4px!important; line-height:1.8!important; }
.bilingual-table .urdu-steps,
.bilingual-table .urdu-bullets { margin:4px 0 8px!important; }
.bilingual-table .urdu-steps li,
.bilingual-table .urdu-bullets li { margin:2px 0!important; line-height:1.9!important; }
.bilingual-table .english-content .table-wrap { max-width:100%; overflow-x:auto; }
.bilingual-table .english-content table { width:100%!important; min-width:0!important; table-layout:fixed!important; font-size:12px!important; }
.bilingual-table .english-content th,
.bilingual-table .english-content td { padding:6px!important; overflow-wrap:anywhere; }
.bilingual-heading-grid { grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important; }
.chapter-heading-cell { min-width:0; }
.chapter-heading-cell h2,.chapter-heading-cell h3,.chapter-summary { overflow-wrap:anywhere; }
/* Avoid decorative uppercase labels creating unwanted gaps in the chapter heading. */
.chapter-heading-cell .chapter-summary { margin-top:5px!important; }
@media (max-width:760px) {
  .bilingual-heading-grid { grid-template-columns:minmax(0,1fr)!important; }
  .bilingual-table { display:block!important; width:100%!important; overflow:visible!important; border:0!important; box-shadow:none!important; background:transparent!important; }
  .bilingual-table > thead { display:none!important; }
  .bilingual-table > tbody,.bilingual-table > tbody > tr { display:block!important; width:100%!important; }
  .bilingual-table > tbody > tr > td {
    display:block!important; width:100%!important; max-width:100%!important;
    margin:0 0 9px!important; padding:12px 13px!important;
    border:1px solid rgba(255,255,255,.96)!important; border-radius:13px!important;
  }
  .bilingual-table > tbody > tr > td:first-child:before,
  .bilingual-table > tbody > tr > td:nth-child(2):before {
    display:block; margin:-12px -13px 10px; padding:8px 13px;
    content:'ENGLISH GUIDE'; color:#fff;
    background:linear-gradient(100deg,#123047,#087f5b);
    font:800 10px/1.4 Manrope,'DM Sans',sans-serif; letter-spacing:1px;
    border-radius:12px 12px 0 0;
  }
  .bilingual-table > tbody > tr > td:nth-child(2) {
    border:1px solid rgba(8,127,91,.18)!important;
    background:linear-gradient(150deg,rgba(230,247,239,.92),rgba(255,255,255,.88))!important;
  }
  .bilingual-table > tbody > tr > td:nth-child(2):before {
    content:'اردو رہنمائی'; direction:rtl; text-align:right;
    font-family:'Noto Nastaliq Urdu','Noto Naskh Arabic',serif;
    font-size:15px; letter-spacing:0;
    background:linear-gradient(100deg,#087f5b,#123047);
  }
  .bilingual-table .english-content p { font-size:14px!important; }
  .bilingual-table .english-content li { font-size:13.5px!important; }
  .bilingual-table .urdu-steps li,.bilingual-table .urdu-bullets li { font-size:14px!important; }
  .bilingual-table .english-content table { font-size:11px!important; }
}
@media (max-width:380px) {
  .guide-section { padding:12px!important; }
  .chapter-heading-cell { padding:11px!important; }
  .bilingual-table > tbody > tr > td { padding:11px!important; }
  .bilingual-table > tbody > tr > td:first-child:before,
  .bilingual-table > tbody > tr > td:nth-child(2):before { margin:-11px -11px 9px; }
}
@media print {
  .bilingual-table { display:table!important; width:100%!important; }
  .bilingual-table > thead,.bilingual-table > tbody { display:table-row-group!important; }
  .bilingual-table > thead > tr,.bilingual-table > tbody > tr { display:table-row!important; }
  .bilingual-table > thead > tr > th,.bilingual-table > tbody > tr > td { display:table-cell!important; width:50%!important; }
}


/* Advanced hero image placeholder — ready for the owner's own artwork */
.hero-image-slot{position:relative;z-index:2;width:100%;max-width:590px;margin:18px 0 8px;align-self:center;min-width:0}
.hero-image-frame{position:relative;overflow:hidden;min-height:190px;border:1px solid rgba(255,255,255,.62);border-radius:25px;background:linear-gradient(145deg,rgba(255,255,255,.17),rgba(255,255,255,.055));box-shadow:0 28px 75px rgba(2,18,28,.26),inset 0 1px 0 rgba(255,255,255,.24);backdrop-filter:blur(22px) saturate(145%);-webkit-backdrop-filter:blur(22px) saturate(145%)}
.hero-image-topbar{height:42px;display:flex;align-items:center;gap:7px;padding:0 16px;border-bottom:1px solid rgba(255,255,255,.19);background:rgba(255,255,255,.09)}
.hero-image-topbar>span{width:8px;height:8px;border-radius:50%;background:#a6d8c0}.hero-image-topbar>span:first-child{background:#f3c5b8}.hero-image-topbar>span:nth-child(2){background:#e9d58e}.hero-image-topbar strong{margin-left:auto;color:rgba(255,255,255,.82);font-size:10px;letter-spacing:1.8px;font-weight:800}
.hero-image-empty{position:absolute;inset:42px 0 0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:13px;padding:25px;text-align:center;color:#fff;background:radial-gradient(ellipse at 50% 0,rgba(96,218,169,.18),transparent 55%)}
.hero-image-icon{width:64px;height:64px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.4);border-radius:20px;background:rgba(255,255,255,.12);font-size:30px;box-shadow:0 12px 32px rgba(0,0,0,.12)}
.hero-image-empty strong{font-size:clamp(16px,1.8vw,22px);font-weight:800;letter-spacing:-.3px}.hero-image-urdu{font-size:17px;color:#d8f5e6;font-family:'Noto Nastaliq Urdu','Noto Naskh Arabic',serif}
.hero-image-empty code{max-width:100%;overflow-wrap:anywhere;padding:9px 12px;border-radius:10px;border:1px solid rgba(255,255,255,.18);background:rgba(3,22,31,.22);color:#d6f8e6;font-size:11px}
.hero-user-image{display:none;width:100%;height:auto;max-height:440px;object-fit:contain;position:relative;z-index:2}
.hero-image-slot.has-image .hero-image-empty{display:none}.hero-image-slot.has-image .hero-user-image{display:block}.hero-image-slot figcaption{margin-top:9px;color:rgba(255,255,255,.72);font-size:11px;line-height:1.6}.hero-image-slot figcaption code{color:#fff}
@media(max-width:980px){.hero-image-slot{max-width:680px;margin:22px auto 4px}.hero-image-frame{min-height:280px}}
@media(max-width:700px){.hero-image-slot{width:100%;margin:20px auto 2px}.hero-image-frame{min-height:230px;border-radius:19px}.hero-image-topbar{height:36px;padding:0 12px}.hero-image-topbar strong{font-size:8px;letter-spacing:1px}.hero-image-empty{inset:36px 0 0;gap:10px;padding:17px}.hero-image-icon{width:48px;height:48px;border-radius:15px;font-size:24px}.hero-image-empty strong{font-size:16px}.hero-image-urdu{font-size:15px}.hero-image-empty code{font-size:9px}.hero-image-slot figcaption{font-size:10px}}
@media(prefers-reduced-transparency:reduce){.hero-image-frame{backdrop-filter:none;-webkit-backdrop-filter:none;background:#173c43}}
@media print{.hero-image-slot{display:none!important}}


/* Hero screenshot loader fix: preserve the glass frame and reveal a loaded image. */
.hero-image-slot { min-width: 0; }
.hero-image-frame { position: relative; overflow: hidden; }
.hero-user-image {
  display: none;
  width: 100%;
  height: auto;
  max-height: 440px;
  object-fit: contain;
  position: relative;
  z-index: 2;
}
.hero-image-slot.has-image .hero-image-empty { display: none !important; }
.hero-image-slot.has-image .hero-user-image { display: block !important; }
.hero-image-slot:not(.has-image) .hero-user-image { display: none; }
@media (max-width: 700px) {
  .hero-image-slot { width: 100%; max-width: 100%; }
  .hero-image-frame { min-height: 220px; }
  .hero-user-image { max-height: 320px; }
}

.support-contact-note{font-size:12px;line-height:1.8;margin:12px 0 14px;padding:12px 14px;background:#fff;border:1px solid #dcebe1;border-radius:9px;color:#42546a}.support-contact-note a{font-weight:800;color:#087f5b;text-decoration:underline;text-underline-offset:2px}.urdu-panel-content a{color:#087f5b;text-decoration:underline;text-underline-offset:2px;overflow-wrap:anywhere}


/* IMAGE DISPLAY FIX: show bundled screenshots directly, without depending on JS. */
.screenshot-slot img {
  display: block !important;
  width: 100%;
  height: auto;
  max-height: 540px;
  object-fit: contain;
  background: #f4f7fa;
}
.screenshot-slot .image-placeholder {
  display: none !important;
}
.hero-image-slot .hero-user-image {
  display: block !important;
  width: 100%;
  height: auto;
  max-height: 440px;
  object-fit: contain;
  position: relative;
  z-index: 2;
}
.hero-image-slot .hero-image-empty {
  display: none !important;
}

/* Final logo-size override: larger brand visibility on desktop and mobile */
.brand-row{height:112px!important;padding:0 21px!important}
.brand{flex:0 0 auto;min-width:0}
.brand-logo{display:block;width:220px!important;height:76px!important;max-width:none!important;object-fit:contain!important;object-position:left center!important}
.footer-logo{width:168px!important;height:54px!important;max-width:none!important}
@media(max-width:700px){
  .brand-row{height:102px!important;padding:0 18px!important}
  .brand-logo{width:195px!important;height:68px!important;max-width:calc(100vw - 60px)!important}
  .footer-logo{width:150px!important;height:48px!important;max-width:none!important}
}

/* ============================================================
   FINAL RESPONSIVE LAYER
   Layout-only overrides. All existing HTML text and functionality
   are intentionally preserved.
   ============================================================ */
*,
*::before,
*::after { box-sizing: border-box; }
html { width: 100%; max-width: 100%; overflow-x: clip; scroll-padding-top: 84px; }
body { width: 100%; max-width: 100%; overflow-x: clip; }
img, video, canvas, iframe, svg { max-width: 100%; }
img { height: auto; }
main, header, section, footer, figure, nav, aside { min-width: 0; }
.app-shell { min-width: 0; width: auto; max-width: 100%; }
.main-content { min-width: 0; max-width: 100%; }
.content-width, .search-status { min-width: 0; max-width: 100%; }
.content-width { width: min(1240px, calc(100% - 56px)); }
.hero, .guide-section, .intro-note, .setup-card, .feature-card,
.checklist-card, .support-card, .map-grid > a, .chapter-heading-cell,
.bilingual-table, .bilingual-table > tbody > tr > td { min-width: 0; }
.hero h1, .hero-description, .guide-section p, .guide-section li,
.chapter-heading-cell h2, .chapter-heading-cell h3, .chapter-summary,
.support-contact-note, .support-template, .footer-links a,
.nav-link, .nav-link span, .bilingual-table { overflow-wrap: anywhere; }
.table-wrap, .bilingual-table .english-content .table-wrap { width: 100%; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.table-wrap > table { max-width: 100%; }

/* Tablet and narrow laptop layouts */
@media (max-width: 980px) {
  :root { --sidebar-width: min(300px, 88vw); }
  .sidebar { width: var(--sidebar-width); max-width: 88vw; height: 100vh; height: 100dvh; }
  .sidebar-open { overflow: hidden; }
  .brand-row { gap: 8px; }
  .sidebar .brand { flex: 1 1 auto; min-width: 0; }
  .sidebar .brand-logo { width: min(190px, calc(100vw - 132px)) !important; height: auto !important; max-width: 100% !important; }
  .guide-nav { min-width: 0; }
  .topbar { min-width: 0; padding-inline: 22px; gap: 12px; }
  .topbar-left, .topbar-actions { min-width: 0; gap: 10px; }
  .topbar-actions { flex: 1 1 auto; justify-content: flex-end; }
  .search-box { flex: 0 1 290px; width: min(290px, 38vw); min-width: 0; }
  .hero { grid-template-columns: minmax(0, 1fr); gap: 18px; padding: clamp(30px, 5vw, 48px) clamp(24px, 5vw, 48px); }
  .hero-copy { max-width: 760px; }
  .hero h1 { max-width: 100%; font-size: clamp(32px, 5.2vw, 46px); }
  .hero-description, .hero-description-ur { max-width: 720px; }
  .hero-image-slot { width: 100%; max-width: 720px; margin: 8px auto 0; }
  .hero-image-frame { min-height: 0; }
  .hero-user-image { max-height: none; }
  .hero-image-slot .hero-user-image { max-height: 560px; object-fit: contain; }
  .content-width { width: calc(100% - 44px); }
  .setup-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .feature-grid.three-col { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .guide-section { padding: clamp(18px, 3vw, 28px); }
  .support-card { min-width: 0; }
}

/* Tablet portrait and large phones */
@media (max-width: 760px) {
  html { scroll-padding-top: 72px; }
  .topbar { height: 64px; padding-inline: 14px; gap: 9px; }
  .topbar-left { gap: 8px; }
  .menu-toggle { flex: 0 0 36px; width: 36px; height: 36px; }
  .crumbs { min-width: 0; max-width: 35vw; gap: 6px; font-size: 11px; }
  .crumbs span:first-child, .crumb-separator { display: none; }
  .crumbs strong { display: block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .topbar-actions { flex: 1 1 auto; gap: 7px; }
  .search-box { flex: 1 1 auto; width: auto; max-width: 340px; min-width: 0; height: 38px; padding-inline: 9px; }
  .search-box input { min-width: 0; font-size: 12px; }
  .search-box kbd { display: none; }
  .outline-button { flex: 0 0 38px; width: 38px; height: 38px; padding: 0; justify-content: center; }
  .hero { padding: 34px 22px 25px; gap: 16px; }
  .hero h1 { font-size: clamp(29px, 6vw, 40px); line-height: 1.18; letter-spacing: -1px; }
  .hero-description, .hero-description-ur { font-size: 14px; line-height: 1.85; }
  .hero-buttons { flex-wrap: wrap; gap: 10px 16px; }
  .hero-trust { flex-wrap: wrap; font-size: 11px; line-height: 1.7; }
  .hero-image-slot { margin-top: 6px; }
  .hero-image-frame { border-radius: 18px; }
  .hero-image-slot .hero-user-image { max-height: none; }
  .content-width { width: calc(100% - 28px); }
  .intro-note { margin: 20px 0 28px; padding: 15px; }
  .section-block { margin-bottom: 34px; }
  .section-heading { gap: 12px; }
  .section-heading h2 { font-size: clamp(21px, 4.5vw, 28px); }
  .section-heading p { font-size: 13px; }
  .setup-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .setup-card { min-width: 0; padding: 16px; }
  .map-grid { grid-template-columns: minmax(0, 1fr); }
  .feature-grid.three-col, .feature-grid.two-col { grid-template-columns: minmax(0, 1fr); }
  .article-columns { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .bilingual-heading-grid { grid-template-columns: minmax(0, 1fr) !important; }
  .chapter-heading-urdu { border-left: 0; border-top: 1px solid rgba(8,127,91,.18); }
  .bilingual-table { grid-template-columns: minmax(0, 1fr) !important; }
  .process-strip { flex-wrap: wrap; }
  .support-card { grid-template-columns: minmax(0, 1fr); }
  .support-visual { max-width: 100%; }
  .support-copy { min-width: 0; }
  .support-template, .support-contact-note { overflow-wrap: anywhere; }
  .glossary-grid { grid-template-columns: minmax(0, 1fr); }
  .guide-footer { min-width: 0; }
  .footer-links { flex-wrap: wrap; }
}

/* Phone width: make the toolbar fit without sideways scrolling */
@media (max-width: 520px) {
  .topbar { padding-inline: 10px; gap: 8px; }
  .topbar-left { flex: 0 0 auto; }
  .crumbs { display: none; }
  .topbar-actions { flex: 1 1 0; width: 0; }
  .search-box { width: auto; min-width: 0; max-width: none; }
  .search-box .search-symbol { flex: 0 0 auto; font-size: 19px; }
  .search-box input { font-size: 11px; }
  .outline-button { flex-basis: 36px; width: 36px; height: 36px; }
  .hero { padding: 29px 16px 20px; }
  .hero h1 { font-size: clamp(27px, 7.8vw, 36px); letter-spacing: -.7px; }
  .hero-kicker { flex-wrap: wrap; font-size: 9px; letter-spacing: 1.35px; }
  .hero-description, .hero-description-ur { font-size: 13px; }
  .hero-buttons { align-items: stretch; }
  .primary-button { gap: 9px; padding-inline: 13px; }
  .text-button { min-height: 42px; }
  .hero-image-topbar strong { font-size: 7px; letter-spacing: .7px; }
  .hero-image-slot .hero-user-image { max-height: none; }
  .content-width { width: calc(100% - 22px); }
  .setup-grid { grid-template-columns: minmax(0, 1fr); }
  .setup-card { min-height: 0; padding: 16px 15px; }
  .setup-card strong { font-size: 13px; }
  .setup-card p { font-size: 12px; }
  .section-heading h2 { font-size: 22px; letter-spacing: -.4px; }
  .guide-section { padding: 14px !important; border-radius: 14px; }
  .guide-section p { font-size: 13px; line-height: 1.8; }
  .guide-section ul, .guide-section ol { padding-left: 19px; font-size: 12.5px; }
  .chapter-heading-cell { padding: 12px !important; }
  .chapter-heading-cell h2 { font-size: clamp(18px, 5.5vw, 23px); }
  .chapter-heading-cell .chapter-title-urdu { font-size: clamp(18px, 5.5vw, 23px); }
  .bilingual-table > tbody > tr > td { padding: 12px !important; }
  .bilingual-table > tbody > tr > td:first-child:before,
  .bilingual-table > tbody > tr > td:nth-child(2):before { margin: -12px -12px 9px; }
  .bilingual-table .english-content p { font-size: 13px !important; }
  .bilingual-table .english-content li { font-size: 12.5px !important; }
  .bilingual-table .urdu-panel-content { font-size: 14px; }
  .bilingual-table .urdu-steps li, .bilingual-table .urdu-bullets li { font-size: 13px !important; }
  .bilingual-table .english-content th, .bilingual-table .english-content td { padding: 5px !important; font-size: 10.5px; }
  .support-card { padding: 15px; }
  .support-copy h3 { font-size: 18px; }
  .support-copy p { font-size: 13px; }
  .support-template { font-size: 11px; }
  .checklist-card { padding: 15px; }
  .checklist-footer { flex-wrap: wrap; gap: 8px; }
  .back-to-top { right: 12px; bottom: 12px; width: 42px; height: 42px; }
}

@media (max-width: 360px) {
  .menu-toggle { flex-basis: 33px; width: 33px; height: 33px; }
  .topbar { padding-inline: 8px; }
  .topbar-actions { gap: 5px; }
  .search-box { padding-inline: 6px; gap: 5px; }
  .search-box .search-symbol { font-size: 17px; }
  .outline-button { flex-basis: 34px; width: 34px; height: 34px; }
  .hero { padding-inline: 13px; }
  .hero h1 { font-size: 27px; }
  .hero-buttons { flex-direction: column; align-items: stretch; }
  .primary-button, .text-button { justify-content: center; }
  .hero-trust { align-items: flex-start; }
  .hero-image-frame { min-height: 0; }
  .hero-image-topbar { padding-inline: 8px; gap: 5px; }
  .hero-image-topbar strong { letter-spacing: .3px; }
  .content-width { width: calc(100% - 18px); }
  .chapter-heading-cell .chapter-language-label { font-size: 8px; }
}

/* Keep the print control icon-only on narrow screens, overriding older styles. */
@media (max-width: 700px) {
  .topbar .outline-button.print-button { font-size: 0 !important; letter-spacing: 0 !important; overflow: hidden; }
  .topbar .outline-button.print-button span { flex: 0 0 auto; font-size: 17px !important; }
}

/* MOBILE TABLE FIX — readable nested tables, without duplicate bilingual labels.
   Main English/Urdu panels stack vertically. Tables inside those panels keep their
   column labels and can be swiped horizontally instead of collapsing to tiny cells. */
.table-wrap {
  position: relative;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  overscroll-behavior-x: contain;
}
.table-wrap > table {
  max-width: none;
}
@media (max-width: 760px) {
  .table-wrap {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
  }

  .table-wrap > table {
    width: 560px !important;
    min-width: 560px !important;
    max-width: none !important;
    table-layout: fixed !important;
  }

  /* Override the old rule that forced nested tables to fit a very narrow screen. */
  .bilingual-table .english-content .table-wrap > table {
    display: table !important;
    width: 600px !important;
    min-width: 600px !important;
    max-width: none !important;
    table-layout: fixed !important;
    font-size: 12px !important;
  }

  /* Bilingual title bands belong only to the main English/Urdu panel cells.
     Do not repeat those bands on each nested-table cell. */
  .bilingual-table .english-content .table-wrap table tbody > tr > td::before {
    content: none !important;
    display: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .table-wrap > table th,
  .table-wrap > table td,
  .bilingual-table .english-content .table-wrap > table th,
  .bilingual-table .english-content .table-wrap > table td {
    min-width: 0 !important;
    padding: 8px !important;
    font-size: 12px !important;
    line-height: 1.55 !important;
    vertical-align: top !important;
    overflow-wrap: break-word;
    word-break: normal;
  }

  .table-wrap > table th {
    white-space: normal;
  }
}


/* Mobile: fit every nested table column on screen; no horizontal scrollbar. */
@media (max-width: 760px) {
  .table-wrap,
  .bilingual-table .english-content .table-wrap {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
    overflow-y: visible !important;
  }
  .table-wrap > table,
  .bilingual-table .english-content .table-wrap > table {
    display: table !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    table-layout: fixed !important;
    border-collapse: collapse !important;
  }
  .table-wrap > table th,
  .table-wrap > table td,
  .bilingual-table .english-content .table-wrap > table th,
  .bilingual-table .english-content .table-wrap > table td {
    min-width: 0 !important;
    width: auto !important;
    padding: 5px 4px !important;
    font-size: 10px !important;
    line-height: 1.45 !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
    vertical-align: top !important;
  }
}