/* DigiMark Quick Fixes — hub + details. Everything is scoped to .qfh */
.qfh{--navy:#0d2142;--navy2:#16345f;--ink:#14213a;--steel:#5a6a82;--line:#dde3ee;--paper:#f4f6fb;--amber:rgb(237, 100, 39);--ok:#17a34a;--bad:#e5484d;color:var(--ink);line-height:1.55}
.qfh *,.qfh *::before,.qfh *::after{box-sizing:border-box}
.qfh [hidden]{display:none!important}
.qfh [lang="bn"]{font-family:"Hind Siliguri","Noto Sans Bengali",Kalpurush,system-ui,sans-serif}
.qfh a{color:inherit;text-decoration:none}
.qfh button{font:inherit}
.qfh :focus-visible{outline:3px solid var(--amber);outline-offset:2px;border-radius:6px}
.qfh-wrap{max-width:1180px;margin:0 auto;padding:0 22px}
.qfh svg{display:block}

/* ===== Breadcrumb bar ===== */
.qfh-crumbbar{background:#f4f6fb;font-size:.86rem;color:#5a6a82;font-family:inherit}
.qfh-crumbbar .in{max-width:1180px;margin:0 auto;padding:9px 22px;display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.qfh-crumbbar a{color:#12304c;text-decoration:none}
.qfh-crumbbar a:hover{text-decoration:underline}
.qfh-crumbbar span{color:#9aa7ba}
/* hero */
.qfh-hero{background: linear-gradient(158deg, var(--navy) 0%, var(--brand-dk) 65%, #1565a8 100%);color:#fff;position:relative;overflow:hidden;padding:58px 0 118px}
.qfh-hero::before{}
.qfh-hero-in{position:relative;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.85fr);gap:52px;align-items:center}
.qfh-hero h1{line-height:1.08;margin:0 0 14px;font-weight:700;color:#fff}
.qfh-bn-sub{color:var(--amber);margin:0 0 14px;font-weight:500}
.qfh-sub{color:#c3d0e6;max-width:58ch;margin:0 0 28px;}
.qfh-search{display:flex;align-items:center;background:#fff;border-radius:16px;padding:6px 6px 6px 16px;max-width:660px;box-shadow:0 14px 34px rgba(3,10,25,.38);transition:box-shadow .15s}
.qfh-search:focus-within{box-shadow:0 0 0 3px var(--amber),0 14px 34px rgba(3,10,25,.38)}
.qfh-search>svg{width:22px;height:22px;color:var(--steel);flex:none}
.qfh-search input{flex:1;min-width:0;border:0;outline:0;background:transparent;font:inherit;color:var(--ink);padding:14px 10px}
.qfh-search input::placeholder{color:#8795ab}
.qfh-search kbd{font:600 .75rem ui-monospace,Menlo,Consolas,monospace;color:var(--steel);border:1px solid var(--line);border-bottom-width:2px;border-radius:6px;padding:1px 7px;margin-right:8px}
.qfh-search button{border:0;cursor:pointer;background:var(--amber);color:#2a1a00;font-weight:700;border-radius:11px;padding:13px 24px;transition:transform .12s,filter .12s}
.qfh-search button:hover{filter:brightness(1.06)}.qfh-search button:active{transform:scale(.97)}
.qfh-pop{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:18px;color:#9fb2d1;}
.qfh-pop a{border:1px solid rgba(255,255,255,.2);color:#e6eefb;border-radius:99px;padding:4px 13px;transition:background .15s,border-color .15s}
.qfh-pop a:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.45)}

/* diagnostic panel (hero) */
.qfh-panel{background:#091830;border:1px solid rgba(255,255,255,.14);border-radius:18px;overflow:hidden;box-shadow:0 28px 56px rgba(2,8,20,.5)}
.qfh-pbar{display:flex;align-items:center;gap:7px;padding:12px 18px;border-bottom:1px solid rgba(255,255,255,.1);color:#9fb2d1}
.qfh-pbar i{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.2)}
.qfh-pbar b{margin-left:auto;font-weight:500}
.qfh-pbody{padding:24px 24px 22px;min-height:248px;display:flex;flex-direction:column;transition:opacity .28s}
.qfh-pbody.swap{opacity:0}
.qfh-status{display:flex;align-items:center;gap:11px;font-weight:600;color:#ffb3b5;margin-bottom:16px}
.qfh-led{width:14px;height:14px;border-radius:50%;background:var(--bad);box-shadow:0 0 0 4px rgba(229,72,77,.2),0 0 18px rgba(229,72,77,.75);animation:qfhPulse 1.6s ease-in-out infinite;flex:none}
.qfh-pbody.ok .qfh-status{color:#9be7b5}
.qfh-pbody.ok .qfh-led{background:var(--ok);box-shadow:0 0 0 4px rgba(23,163,74,.24),0 0 18px rgba(34,197,94,.75);animation:none}
@keyframes qfhPulse{50%{box-shadow:0 0 0 7px rgba(229,72,77,.08),0 0 8px rgba(229,72,77,.4)}}
.qfh-ptitle{line-height:1.3;font-weight:650;margin:0 0 8px;color:#fff;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.qfh-pbn{color:#b6c5df;margin:0;}
.qfh-pres{margin-top:auto;padding-top:20px;display:flex;align-items:center;justify-content:space-between;gap:12px;opacity:.28;transition:opacity .4s}
.qfh-pbody.ok .qfh-pres{opacity:1}
.qfh-pres span{color:#c3d0e6;}
.qfh-pres a{background:#fff;color:var(--navy);font-weight:700;border-radius:10px;padding:8px 16px;white-space:nowrap}
.qfh-pres a:hover{background:var(--amber)}

/* stats strip */
.qfh-statswrap{margin-top:-64px;position:relative;z-index:2}
.qfh-stats{display:grid;grid-template-columns:repeat(4,1fr);background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:0 16px 40px rgba(13,33,66,.12)}
.qfh-stat{padding:20px 24px;display:flex;flex-direction:column;gap:2px}
.qfh-stat+.qfh-stat{border-left:1px solid var(--line)}
.qfh-stat b{line-height:1.15;color:var(--navy)}
.qfh-stat span{color:var(--steel);}

/* sections */
.qfh-sec{padding:70px 0 8px}
.qfh-sec.alt{background:var(--paper);padding:70px 0;margin-top:62px}
.qfh-sec.last{padding-bottom:80px}
.qfh-h{line-height:1.2;margin:0 0 8px;color:var(--navy);font-weight:700}
.qfh-lead{color:var(--steel);margin:0 0 28px;max-width:62ch}

/* category bento */
.qfh-cats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.qfh-cat{position:relative;display:flex;flex-direction:column;gap:6px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:22px 22px 18px;overflow:hidden;text-align:left;cursor:pointer;color:inherit;transition:border-color .18s,transform .18s,box-shadow .18s}
.qfh-cat:first-child{grid-column:span 2}
.qfh-cat::before{content:"";position:absolute;left:0;top:0;height:4px;width:44px;background:var(--c);border-radius:0 0 4px 0;transition:width .25s}
.qfh-cat:hover{border-color:var(--c);transform:translateY(-3px);box-shadow:0 14px 30px rgba(13,33,66,.1)}
.qfh-cat:hover::before{width:100%}
.qfh-cat .ic{width:46px;height:46px;border-radius:12px;background:color-mix(in srgb,var(--c) 11%,#fff);color:var(--c);display:grid;place-items:center;margin-bottom:8px}
.qfh-cat .ic svg{width:26px;height:26px}
.qfh-cat h3{margin:0;line-height:1.3;color:var(--navy)}
.qfh-cat p{margin:0;color:var(--steel);}
.qfh-cat .ct{margin-top:auto;padding-top:14px;font-weight:600;color:var(--c)}
.qfh-cat:first-child h3{}
.qfh-cat:first-child .ct{}
.qfh-cat.soon{cursor:default;background:var(--paper);border-style:dashed}
.qfh-cat.soon:hover{transform:none;box-shadow:none;border-color:var(--line)}
.qfh-cat.soon:hover::before{width:44px}
.qfh-cat.soon .ct{color:var(--steel);font-weight:500}
.qfh-cat.soon .ic{background:#e9edf4;color:#8795ab}

/* filters */
.qfh-bar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:10px}
.qfh-chip{border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:99px;padding:7px 15px;cursor:pointer;font-weight:500;display:inline-flex;gap:8px;align-items:center;transition:background .15s,border-color .15s,color .15s}
.qfh-chip:hover{border-color:var(--navy)}
.qfh-chip .n{color:var(--steel);background:var(--paper);border-radius:99px;padding:0 8px}
.qfh-chip[aria-pressed="true"]{background:var(--navy);border-color:var(--navy);color:#fff}
.qfh-chip[aria-pressed="true"] .n{background:rgba(255,255,255,.18);color:#fff}
.qfh-chip.vid svg{width:14px;height:14px}
.qfh-count{margin:0 0 18px;color:var(--steel);min-height:1.5em}

/* fix cards */
.qfh-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:16px}
.qfh-fix{position:relative;display:flex;flex-direction:column;gap:9px;background:#fff;border:1px solid var(--line);border-left:4px solid var(--c);border-radius:6px 14px 14px 6px;padding:18px 20px 16px;transition:transform .18s,box-shadow .18s,border-color .18s}
.qfh-fix:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(13,33,66,.1);border-top-color:var(--c);border-right-color:var(--c);border-bottom-color:var(--c)}
.qfh-fix-top{display:flex;align-items:center;gap:10px;color:var(--steel)}
.qfh-id{font-weight:600;color:var(--c)}
.qfh-vid{margin-left:auto;display:inline-flex;align-items:center;gap:5px;color:var(--navy);background:#fff4d6;border-radius:99px;padding:1px 10px 1px 8px;font-weight:600}
.qfh-vid svg{width:12px;height:12px}
.qfh-fix h3{margin:0;line-height:1.38;color:var(--navy);font-weight:650}
.qfh-bn{margin:0;color:var(--steel);}
.qfh-brands{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:2px 0 0;padding:0}
.qfh-brands li{background:var(--paper);border-radius:6px;padding:1px 8px;color:#33445f}
.qfh-foot{display:flex;align-items:center;gap:16px;margin-top:auto;padding-top:12px;border-top:1px solid var(--line);color:var(--steel)}
.qfh-foot svg{width:15px;height:15px}
.qfh-time{display:inline-flex;align-items:center;gap:6px}
.qfh-lvl{display:inline-flex;align-items:center;gap:3px}
.qfh-lvl i{width:5px;height:12px;border-radius:2px;background:#d3dae7}
.qfh-lvl i.on{background:var(--c)}
.qfh-lvl em{font-style:normal;margin-left:5px}
.qfh-go{margin-left:auto;color:var(--c);transition:transform .18s}
.qfh-fix:hover .qfh-go{transform:translateX(4px)}
.qfh-none{padding:34px;text-align:center;border:1px dashed #b9c4d8;border-radius:14px;background:#fff;color:var(--steel)}
.qfh-none a{color:var(--navy);font-weight:600;text-decoration:underline}

/* videos */
.qfh-vids{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.qfh-vcard{display:flex;flex-direction:column;gap:12px}
.qfh-thumb{position:relative;display:block;width:100%;aspect-ratio:16/9;border:0;padding:0;border-radius:14px;overflow:hidden;cursor:pointer;background:var(--navy)}
.qfh-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s,opacity .2s;opacity:.92}
.qfh-thumb:hover img{transform:scale(1.04);opacity:1}
.qfh-play{position:absolute;left:50%;top:50%;width:62px;height:62px;margin:-31px 0 0 -31px;border-radius:50%;background:var(--amber);display:grid;place-items:center;box-shadow:0 8px 22px rgba(0,0,0,.4);transition:transform .15s}
.qfh-thumb:hover .qfh-play{transform:scale(1.1)}
.qfh-play svg{width:24px;height:24px;margin-left:3px;color:#2a1a00}
.qfh-len{position:absolute;right:10px;bottom:10px;background:rgba(9,24,48,.86);color:#fff;border-radius:6px;padding:1px 8px;font-weight:600}
.qfh-vcard h3{margin:0;line-height:1.4;color:var(--navy)}
.qfh-vcard h3 a:hover{text-decoration:underline}
.qfh-vcard p{margin:0;color:var(--steel);}
.qfh-btn{display:inline-flex;align-items:center;gap:9px;border-radius:12px;padding:12px 22px;font-weight:700;border:1px solid transparent;transition:transform .12s,filter .12s}
.qfh-btn:hover{filter:brightness(1.07)}.qfh-btn:active{transform:scale(.98)}
.qfh-btn.ghost{border-color:var(--navy);color:var(--navy);background:#fff}
.qfh-btn.wa{background:#25d366;color:#05301a}
.qfh-btn.line{border-color:rgba(255,255,255,.5);color:#fff}
.qfh-btn svg{width:20px;height:20px}

/* help band */
.qfh-help{background:var(--navy);color:#fff;border-radius:20px;padding:38px 42px;display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap;position:relative;overflow:hidden}
.qfh-help::after{content:"";position:absolute;right:-40px;top:-40px;width:180px;height:180px;border-radius:50%;border:2px solid rgba(255,255,255,.08);box-shadow:0 0 0 28px rgba(255,255,255,.03),0 0 0 56px rgba(255,255,255,.02)}
.qfh-help h2{margin:0 0 6px;color:#fff}
.qfh-help p{margin:0;color:#c3d0e6;max-width:54ch}
.qfh-help .row{display:flex;gap:12px;flex-wrap:wrap;position:relative;z-index:1}

/* faq */
.qfh-faq{max-width:820px}
.qfh-faq details{border-bottom:1px solid var(--line)}
.qfh-faq summary{list-style:none;cursor:pointer;padding:18px 40px 18px 0;font-weight:600;color:var(--navy);position:relative}
.qfh-faq summary::-webkit-details-marker{display:none}
.qfh-faq summary::after{content:"";position:absolute;right:6px;top:50%;width:10px;height:10px;border-right:2px solid var(--steel);border-bottom:2px solid var(--steel);transform:translateY(-70%) rotate(45deg);transition:transform .2s}
.qfh-faq details[open] summary::after{transform:translateY(-30%) rotate(-135deg)}
.qfh-faq details p{margin:0 0 18px;color:#33445f;max-width:68ch}

/* video modal */
.qfh-modal{position:fixed;inset:0;z-index:9999;background:rgba(5,12,26,.82);display:grid;place-items:center;padding:20px}
.qfh-modal-box{position:relative;width:min(960px,100%);aspect-ratio:16/9;background:#000;border-radius:14px;overflow:hidden;box-shadow:0 30px 70px rgba(0,0,0,.6)}
.qfh-modal-box iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.qfh-x{position:absolute;right:14px;top:-48px;border:0;background:#fff;color:var(--navy);width:38px;height:38px;border-radius:50%;line-height:1;cursor:pointer}
.qfh-modal-box .qfh-x{top:auto}
.qfh-modal-wrap{position:relative;width:min(960px,100%)}
.qfh-modal-wrap .qfh-x{top:-48px}

/* empty state */
.qfh-empty{border:1px dashed #b9c4d8;border-radius:18px;background:#fff;padding:46px 28px;text-align:center;color:var(--steel)}
.qfh-empty h3{margin:0 0 6px;color:var(--navy);}

@media (max-width:980px){
  .qfh-hero{padding:44px 0 108px}
  .qfh-hero-in{grid-template-columns:1fr;gap:34px}
  .qfh-cats{grid-template-columns:repeat(2,1fr)}
  .qfh-vids{grid-template-columns:repeat(2,1fr)}
  .qfh-stats{grid-template-columns:repeat(2,1fr)}
  .qfh-stat:nth-child(3){border-left:0}
  .qfh-stat:nth-child(n+3){border-top:1px solid var(--line)}
}
@media (max-width:620px){
  .qfh-wrap{padding:0 16px}
  .qfh-search kbd{display:none}
  .qfh-search button{padding:13px 16px}
  .qfh-cats,.qfh-vids{grid-template-columns:1fr}
  .qfh-cat:first-child{grid-column:auto}
  .qfh-grid{grid-template-columns:1fr}
  .qfh-help{padding:28px 22px}
  .qfh-stat{padding:16px 18px}
  .qfh-stat b{}
}
@media (prefers-reduced-motion:reduce){
  .qfh *,.qfh *::before,.qfh *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}

/* ================= Details page (.qfd-*) ================= */
.qfd-hero{background: linear-gradient(158deg, var(--navy) 0%, var(--brand-dk) 65%, #1565a8 100%);color:#fff;position:relative;overflow:hidden;padding:30px 0 46px}
.qfd-hero::before{}
.qfd-hero .qfh-wrap{position:relative}
.qfd-crumb{display:flex;flex-wrap:wrap;gap:6px;align-items:center;color:#9fb2d1;margin-bottom:22px}
.qfd-crumb a{color:#c3d0e6}.qfd-crumb a:hover{color:#fff;text-decoration:underline}
.qfd-chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.qfd-chip{border:1px solid rgba(255,255,255,.22);border-radius:99px;padding:3px 13px;color:#e6eefb}
.qfd-chip.cat{background:var(--c);border-color:var(--c);color:#fff;font-weight:600}
.qfd-hero h1{line-height:1.14;margin:0 0 10px;color:#fff;font-weight:700;}
.qfd-hero .qfh-bn-sub{margin:0 0 20px}
.qfd-facts{display:flex;flex-wrap:wrap;gap:10px 26px;color:#c3d0e6;align-items:center}
.qfd-facts span{display:inline-flex;align-items:center;gap:8px}
.qfd-facts svg{width:17px;height:17px;color:var(--amber)}
.qfd-facts .qfh-lvl i{background:rgba(255,255,255,.25)}.qfd-facts .qfh-lvl i.on{background:var(--amber)}
.qfd-verify{display:flex;align-items:center;gap:12px;margin-top:22px;padding-top:18px;border-top:1px solid rgba(255,255,255,.14);color:#c3d0e6;flex-wrap:wrap}
.qfd-av{width:36px;height:36px;border-radius:50%;background:var(--amber);color:#2a1a00;display:grid;place-items:center;font-weight:700;flex:none}
.qfd-verify b{color:#fff}
.qfd-verify .tick{display:inline-flex;align-items:center;gap:6px;color:#9be7b5;font-weight:600}
.qfd-verify .tick svg{width:16px;height:16px}

.qfd-layout{display:grid;grid-template-columns:minmax(0,1fr) 318px;gap:44px;padding:40px 0 70px;align-items:start}
.qfd-sec{margin:0 0 44px;scroll-margin-top:24px}
.qfd-sec>h2{line-height:1.25;color:var(--navy);margin:0 0 16px}
.qfd-answer{background:#fff;border:1px solid var(--line);border-left:5px solid var(--amber);border-radius:8px 16px 16px 8px;padding:22px 26px;box-shadow:0 10px 26px rgba(13,33,66,.07)}
.qfd-answer .lab{display:inline-flex;align-items:center;gap:9px;font-weight:700;color:var(--navy);margin-bottom:8px}
.qfd-answer .qfh-led{width:11px;height:11px;animation:none;background:var(--ok);box-shadow:0 0 0 3px rgba(23,163,74,.2),0 0 12px rgba(34,197,94,.6)}
.qfd-answer p{margin:0;line-height:1.65;color:#1b2c4a}

.qfd-need{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px}
.qfd-need li{display:flex;gap:11px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 15px}
.qfd-need svg{width:20px;height:20px;flex:none;color:var(--ok);margin-top:2px}

.qfd-video{position:relative;aspect-ratio:16/9;border-radius:16px;overflow:hidden;background:var(--navy);box-shadow:0 14px 34px rgba(13,33,66,.18)}
.qfd-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.qfd-video .qfh-thumb{border-radius:0;height:100%}
.qfd-chapters{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.qfd-chapters button{border:1px solid var(--line);background:#fff;border-radius:99px;padding:5px 14px;cursor:pointer;color:var(--ink);display:inline-flex;gap:9px;transition:border-color .15s,background .15s}
.qfd-chapters button:hover{border-color:var(--navy);background:var(--paper)}
.qfd-chapters b{color:var(--c)}

.qfd-steps{list-style:none;margin:0;padding:0;position:relative}
.qfd-step{position:relative;display:grid;grid-template-columns:44px minmax(0,1fr);gap:18px;padding-bottom:26px;scroll-margin-top:24px}
.qfd-step::before{content:"";position:absolute;left:21px;top:46px;bottom:4px;width:2px;background:var(--line)}
.qfd-step:last-child{padding-bottom:0}.qfd-step:last-child::before{display:none}
.qfd-step>.n{width:44px;height:44px;border-radius:50%;background:var(--navy);color:#fff;display:grid;place-items:center;font-weight:700;position:relative;z-index:1;box-shadow:0 0 0 5px #fff}
.qfd-step>.b{background:#fff;border:1px solid var(--line);border-radius:16px;padding:20px 24px}
.qfd-step h3{margin:0 0 10px;line-height:1.35;color:var(--navy)}
.qfd-body{color:#26365a}
.qfd-body p{margin:0 0 10px}.qfd-body>*:last-child{margin-bottom:0}
.qfd-body ul,.qfd-body ol{margin:0 0 10px;padding-left:22px}
.qfd-body code,.qfd-body kbd{background:#eef2f9;border:1px solid #dbe3f0;border-radius:6px;padding:1px 7px;color:var(--navy)}
.qfd-body img{max-width:100%;height:auto;border-radius:10px}
.qfd-body .bd-tip{margin:12px 0 0;background:#fff8e6;border:1px solid #f6dd9b;border-left:4px solid var(--amber);border-radius:6px 12px 12px 6px;padding:11px 15px;}
.qfd-expect{display:flex;gap:11px;align-items:flex-start;margin:14px 0 0;background:#e9f7ee;border:1px solid #bde5cb;border-radius:12px;padding:11px 15px;color:#14573a}
.qfd-expect svg{width:20px;height:20px;flex:none;margin-top:2px}
.qfd-fig{margin:14px 0 0}.qfd-fig img{width:100%;height:auto;border-radius:12px;border:1px solid var(--line);display:block}

.qfd-tablewrap{overflow-x:auto;border:1px solid var(--line);border-radius:14px;background:#fff}
.qfd-causes{width:100%;border-collapse:collapse;min-width:520px}
.qfd-causes th,.qfd-causes td{padding:13px 18px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
.qfd-causes th{background:var(--paper);color:var(--steel);font-weight:600}
.qfd-causes tr:last-child td{border-bottom:0}
.qfd-causes td:first-child{font-weight:600;color:var(--navy)}
.qfd-causes a{display:inline-block;background:var(--navy);color:#fff;border-radius:8px;padding:2px 12px;font-weight:600;}
.qfd-causes a:hover{background:var(--amber);color:#2a1a00}

.qfd-stop{background:#fff1f0;border:1px solid #f5c2be;border-left:5px solid var(--bad);border-radius:8px 16px 16px 8px;padding:20px 24px}
.qfd-stop h2{display:flex;align-items:center;gap:10px;color:#8a1b12!important;margin-bottom:10px!important}
.qfd-stop h2 svg{width:24px;height:24px}
.qfd-stop .qfd-body{color:#5a2420}

.qfd-bn{background:#fff;border:1px solid var(--line);border-radius:16px;padding:22px 26px}
.qfd-bn ol{margin:0;padding-left:26px;display:grid;gap:9px;}

.qfd-help{background:var(--paper);border:1px solid var(--line);border-radius:16px;padding:24px 26px;text-align:center}
.qfd-help h2{margin:0 0 4px;color:var(--navy)}
.qfd-help p{margin:0 0 16px;color:var(--steel)}
.qfd-help .row{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.qfd-vote{border:1px solid var(--navy);background:#fff;color:var(--navy);border-radius:12px;padding:11px 22px;font-weight:700;cursor:pointer;transition:background .15s,color .15s,transform .1s}
.qfd-vote:hover{background:var(--navy);color:#fff}.qfd-vote:active{transform:scale(.97)}
.qfd-vote[disabled]{opacity:.5;cursor:default}
.qfd-res{margin-top:16px;font-weight:600;color:var(--navy)}
.qfd-res .qfh-btn{margin-top:10px}

.qfd-rel{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.qfd-prod{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.qfd-prod a{border:1px solid var(--navy);color:var(--navy);border-radius:99px;padding:6px 16px;font-weight:600;transition:background .15s,color .15s}
.qfd-prod a:hover{background:var(--navy);color:#fff}

.qfd-side{position:sticky;top:22px;display:grid;gap:16px}
.qfd-box{background:#fff;border:1px solid var(--line);border-radius:16px;padding:20px 22px}
.qfd-box h3{margin:0 0 12px;color:var(--navy)}
.qfd-toc{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.qfd-toc a{display:block;padding:6px 12px;border-left:3px solid var(--line);color:var(--steel);transition:color .15s,border-color .15s,background .15s}
.qfd-toc a:hover{color:var(--navy)}
.qfd-toc a.on{border-left-color:var(--c);color:var(--navy);font-weight:600;background:var(--paper)}
.qfd-dl{margin:0;display:grid;gap:12px}
.qfd-dl dt{color:var(--steel)}.qfd-dl dd{margin:0;font-weight:600;color:var(--navy)}
.qfd-wa{background:var(--navy);color:#fff;border-color:var(--navy)}
.qfd-wa h3{color:#fff}.qfd-wa p{margin:0 0 14px;color:#c3d0e6;}
.qfd-wa .qfh-btn{width:100%;justify-content:center}
.qfd-share{display:flex;gap:8px;flex-wrap:wrap}
.qfd-share .qfh-btn{padding:8px 15px;border-radius:10px;cursor:pointer;background:#fff}
.qfd-banner{background:#fff4d6;border-bottom:2px solid var(--amber);padding:10px 22px;text-align:center;font-weight:600;color:#5a3a00}
.qfd-404{padding:90px 0;text-align:center}
.qfd-404 h1{color:var(--navy);margin:0 0 10px}.qfd-404 p{color:var(--steel);margin:0 0 22px}

@media (max-width:980px){
  .qfd-layout{grid-template-columns:1fr;gap:30px}
  .qfd-side{position:static}
  .qfd-toc{display:none}
}
@media (max-width:620px){
  .qfd-step{grid-template-columns:34px minmax(0,1fr);gap:12px}
  .qfd-step>.n{width:34px;height:34px;}
  .qfd-step::before{left:16px;top:36px}
  .qfd-step>.b{padding:16px 16px}
  .qfd-answer{padding:18px 18px}.qfd-answer p{}
}
@media print{
  .subnav,.crumb,.qfd-side,.qfd-help,.qfd-video,.qfd-chapters,.qfd-share,.qfd-rel,#related{display:none!important}
  .qfd-hero{background:#fff;color:#000;padding:0}.qfd-hero h1,.qfd-hero .qfh-bn-sub,.qfd-facts,.qfd-verify,.qfd-verify b{color:#000!important}
  .qfd-layout{display:block}.qfd-step>.b,.qfd-answer{box-shadow:none}
}
/* ===== Quick Fixes — responsive fixes =====
   Paste at the END of quick-fixes.css (after the details-page block). */

/* 1. Hero: fallback colours. If --brand-dk is not defined, the whole gradient is dropped
      and the white hero text becomes invisible. */
.qfd-hero{background:linear-gradient(158deg,var(--navy,#12304c) 0%,var(--brand-dk,#0c2238) 65%,#1565a8 100%)}

/* 3. Fixed site header: keep the sidebar and #anchors from hiding under it.
      Set --qf-sticky to your header height. */
:root{--qf-sticky:84px}
.qfd-side{top:calc(var(--qf-sticky) + 16px)}
.qfd-sec,.qfd-step{scroll-margin-top:calc(var(--qf-sticky) + 16px)}
@media (max-height:760px){.qfd-side{position:static}}

/* 4. Content typed in the admin (steps / "when to stop") must never push the page sideways */
.qfd-body{min-width:0;overflow-wrap:anywhere}
.qfd-body table{display:block;max-width:100%;overflow-x:auto}
.qfd-body pre{max-width:100%;overflow-x:auto}
.qfd-body iframe,.qfd-body video{max-width:100%}
.qfd-body img{height:auto}

/* 5. Tablet / phone: hide the whole "On this page" box (the old rule hid the list but left an empty box) */
@media (max-width:980px){
  .qfd-side>nav.qfd-box{display:none}
}

/* 6. Phone */
@media (max-width:620px){
  .qfd-hero{padding:22px 0 34px}
  .qfd-crumb{margin-bottom:14px}
  .qfd-layout{padding:28px 0 50px;gap:26px}
  .qfd-sec{margin-bottom:34px}
  .qfd-chapters button{min-height:40px}

  /* symptom table -> stacked cards (no sideways scrolling) */
  .qfd-tablewrap{border:0;background:none;overflow:visible}
  .qfd-causes{min-width:0}
  .qfd-causes thead{display:none}
  .qfd-causes tr{display:block;background:#fff;border:1px solid var(--line);border-radius:12px;margin-bottom:10px;padding:6px 0}
  .qfd-causes td,.qfd-causes tr:last-child td{display:block;border:0;padding:6px 16px}
  .qfd-causes td::before{display:block;font-size:.78rem;font-weight:600;color:var(--steel);margin-bottom:1px}
  .qfd-causes td:nth-child(1)::before{content:"What you see"}
  .qfd-causes td:nth-child(2)::before{content:"Likely cause"}
  .qfd-causes td:nth-child(3)::before{content:"Go to"}
}

/* 7. Print: the sub-nav and breadcrumb now use new class names */
@media print{
  .qfh-subnav,.qfh-crumbbar{display:none!important}
}


/* =====================================================================
   ROUND 2 — add these two blocks at the END of quick-fixes.css
   (from the phone screenshot: cards cut off on the right, footer showing through)
   ===================================================================== */

/* 8. Cards cut off on the right.
      A plain "1fr" column can grow wider than the screen when something inside is wide
      (symptom table, long code, chips). minmax(0,1fr) forces it to stay inside the screen. */
@media (max-width:980px){
  .qfd-layout,.qfh-hero-in{grid-template-columns:minmax(0,1fr)}
  .qfh-cats,.qfh-vids,.qfh-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:620px){
  .qfh-cats,.qfh-vids,.qfh-grid,.qfd-need,.qfd-rel{grid-template-columns:minmax(0,1fr)}
}
.qfd-layout>*,.qfd-side>*{min-width:0}

/* 9. Site footer showing through between the cards.
      Your footer is fixed behind the page (reveal style). Our wrapper had no background,
      so the footer was visible in every empty gap. Give the page an opaque layer on top. */
.qfh{position:relative;z-index:1;background:#fff}