/* Shared chrome + page-base styles for QBIS subpages. Load after styles.css. */
body { background:#fff; color:var(--text-body); font-family:var(--font-sans); overflow-x:hidden; margin:0; padding-top:62px; }
img { max-width:100%; display:block; }
.qcontainer { max-width:var(--container-max); margin:0 auto; padding:0 var(--container-pad); }
.qsec { padding:72px 0; position:relative; }
.qsec-alt { background:var(--qbis-surface-100); }
.qcenter { text-align:center; }
.qeyebrow { font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--qbis-orange-500); display:block; margin-bottom:12px; }
.qtitle { font-size:clamp(25px,3vw,37px); font-weight:800; line-height:1.15; color:var(--text-strong); margin:0 0 14px; text-wrap:balance; }
.qtitle em { color:var(--color-primary); font-style:normal; }
.qlead { font-size:14px; line-height:1.7; color:var(--text-body); max-width:560px; }
.qcenter .qlead { margin-left:auto; margin-right:auto; }
.qbtn { display:inline-flex; align-items:center; justify-content:center; gap:8px; font-family:var(--font-sans); font-weight:600; font-size:14px; line-height:1; padding:12px 24px; border-radius:8px; cursor:pointer; border:1px solid transparent; text-decoration:none; transition:filter .2s,transform .12s; }
.qbtn:hover { filter:brightness(.96); }
.qbtn:active { transform:scale(.98); }
.qbtn-accent { background:var(--qbis-yellow-500); color:var(--qbis-navy-900); }
.qbtn-primary { background:var(--color-primary); color:#fff; }
.qbtn-outline { background:transparent; color:var(--color-primary); border-color:var(--qbis-blue-300); }

/* ===== NAV ===== */
.qnav { position:fixed; top:0; left:0; right:0; width:100%; box-sizing:border-box; z-index:200; background:var(--qbis-navy-800); display:flex; align-items:center; gap:32px; padding:13px 40px; box-shadow:0 2px 16px rgba(11,22,54,.18); }
.qnav-logo img { height:25px; }
.qnav-links { display:flex; align-items:center; gap:26px; flex:1; }
.qnav-links > a, .qnav-links .has-menu > a { display:inline-flex; align-items:center; gap:5px; font-size:14px; color:rgba(255,255,255,.82); text-decoration:none; cursor:pointer; }
.qnav-links > a:hover, .qnav-links .has-menu > a:hover { color:#fff; }
.qnav-links > a.active, .qnav-links .has-menu > a.active { color:#fff; font-weight:600; }
.qnav-links .has-menu { position:relative; padding:20px 0; margin:-20px 0; }
.qnav-links .mega-pop { position:absolute; top:100%; left:0; transform:translateY(8px); background:#0e2460; border:1px solid rgba(255,255,255,.12); border-radius:14px; box-shadow:0 24px 64px rgba(0,0,10,.5); width:920px; max-width:calc(100vw - 200px); max-height:calc(100vh - 120px); overflow-y:auto; opacity:0; visibility:hidden; transition:opacity .2s,transform .2s; z-index:300; }
.qnav-links .has-menu:hover .mega-pop { opacity:1; visibility:visible; transform:translateY(0); }
.qnav-links .mega-header { padding:12px 16px 9px; border-bottom:1px solid rgba(255,255,255,.06); }
.qnav-links .mega-header-title { font-size:11px; font-weight:700; color:var(--qbis-yellow-500); text-transform:uppercase; letter-spacing:1.5px; margin-bottom:2px; }
.qnav-links .mega-header-sub { font-size:11px; color:rgba(255,255,255,.55); }
.qnav-links .mega-all-body { padding:8px 12px; }
.qnav-links .mega-section-title { font-size:10px; font-weight:700; color:var(--qbis-yellow-500); text-transform:uppercase; letter-spacing:1.5px; padding:9px 12px 4px; border-top:1px solid rgba(255,255,255,.05); margin-top:4px; }
.qnav-links .mega-cols-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:2px; }
.qnav-links .mega-cols-2 { display:grid; grid-template-columns:1fr 1fr; gap:2px; }
.qnav-links .mega-prod-item { display:flex; align-items:flex-start; gap:10px; padding:8px 12px; border-radius:7px; text-decoration:none; transition:background .15s; }
.qnav-links .mega-prod-item:hover { background:rgba(250,220,16,.07); }
.qnav-links .mega-prod-ico { width:32px; height:32px; border-radius:7px; display:flex; align-items:center; justify-content:center; flex-shrink:0; margin-top:1px; }
.qnav-links .mega-prod-ico svg { width:18px; height:18px; }
.qnav-links .mega-prod-name { font-size:13px; font-weight:700; color:#fff; margin-bottom:2px; line-height:1.2; }
.qnav-links .mega-prod-desc { font-size:11px; color:rgba(255,255,255,.55); line-height:1.4; }
.qnav-links .mega-prod-item:hover .mega-prod-name { color:var(--qbis-yellow-500); }
.qnav-links .mega-ind-item { display:flex; align-items:center; gap:8px; padding:6px 12px; border-radius:6px; text-decoration:none; transition:background .15s; }
.qnav-links .mega-ind-item:hover { background:rgba(250,220,16,.07); }
.qnav-links .mega-ind-ico { width:24px; height:24px; border-radius:6px; flex-shrink:0; display:flex; align-items:center; justify-content:center; }
.qnav-links .mega-ind-ico svg { width:16px; height:16px; }
.qnav-links .mega-ind-ico.mit-pos{background:rgba(12,158,110,.15);} .qnav-links .mega-ind-ico.mit-tour{background:rgba(250,220,16,.12);} .qnav-links .mega-ind-ico.mit-sale{background:rgba(255,150,100,.14);} .qnav-links .mega-ind-ico.mit-gara{background:rgba(77,158,232,.16);} .qnav-links .mega-ind-ico.mit-desk{background:rgba(180,120,240,.16);}
.qnav-links .mega-ind-name { font-size:12px; font-weight:500; color:rgba(255,255,255,.9); flex:1; }
.qnav-links .mega-ind-item:hover .mega-ind-name { color:var(--qbis-yellow-500); }
.qnav-links .mega-ind-tag { font-size:9px; font-weight:700; padding:2px 6px; border-radius:3px; margin-left:auto; flex-shrink:0; white-space:nowrap; }
.qnav-links .mit-pos{background:rgba(12,158,110,.15);color:#0fd48e;} .qnav-links .mit-tour{background:rgba(250,220,16,.10);color:var(--qbis-yellow-500);} .qnav-links .mit-sale{background:rgba(255,150,100,.12);color:#ffb384;} .qnav-links .mit-gara{background:rgba(77,158,232,.15);color:#4d9ee8;} .qnav-links .mit-desk{background:rgba(180,120,240,.15);color:#c48cf5;}
.qnav-links .mega-footer { border-top:1px solid rgba(255,255,255,.07); padding:10px 14px; display:flex; justify-content:space-between; align-items:center; gap:12px; margin-top:6px; }
.qnav-links .mega-footer-text { font-size:11px; color:rgba(255,255,255,.55); }
.qnav-links .mega-footer-link { font-size:12px; font-weight:600; color:var(--qbis-yellow-500); text-decoration:none; }
.qnav-cta { display:flex; align-items:center; gap:14px; }
.qnav-phone { color:#fff; font-size:14px; text-decoration:none; display:inline-flex; align-items:center; gap:6px; }
.qnav-btn { background:var(--qbis-yellow-500); color:var(--qbis-navy-900); font-weight:600; font-size:14px; padding:10px 18px; border-radius:8px; text-decoration:none; }
.qnav-btn:hover { filter:brightness(.95); }
.qnav-toggle { display:none; margin-left:auto; width:42px; height:42px; border:none; background:rgba(255,255,255,.1); border-radius:10px; color:#fff; cursor:pointer; align-items:center; justify-content:center; }
.qnav-toggle svg { width:22px; height:22px; }
.qnav-scrim { position:fixed; inset:0; background:rgba(6,12,32,.55); z-index:399; opacity:0; visibility:hidden; transition:opacity .26s; }
.qnav-scrim.open { opacity:1; visibility:visible; }
.qnav-drawer { position:fixed; top:0; right:0; bottom:0; width:min(330px,86vw); background:var(--qbis-navy-800); z-index:400; transform:translateX(100%); transition:transform .28s ease; box-shadow:-10px 0 44px rgba(0,0,10,.55); overflow-y:auto; -webkit-overflow-scrolling:touch; padding:16px 18px 30px; }
.qnav-drawer.open { transform:translateX(0); }
.qnav-dr-top { display:flex; align-items:center; justify-content:space-between; padding:4px 2px 14px; margin-bottom:8px; border-bottom:1px solid rgba(255,255,255,.1); }
.qnav-dr-top img { height:24px; }
.qnav-dr-close { width:38px; height:38px; border:none; background:rgba(255,255,255,.08); border-radius:9px; color:#fff; font-size:20px; cursor:pointer; line-height:1; }
.qnav-dr a { display:block; color:rgba(255,255,255,.9); text-decoration:none; font-size:15.5px; font-weight:600; padding:13px 10px; border-radius:9px; }
.qnav-dr a:hover, .qnav-dr a.active { background:rgba(250,220,16,.09); color:var(--qbis-yellow-500); }
.qnav-dr-sec { font-size:10px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:rgba(255,255,255,.4); padding:14px 10px 4px; }
.qnav-dr-prod { display:grid; grid-template-columns:1fr 1fr; gap:4px; }
.qnav-dr-prod a { font-size:13px; padding:10px; }
.qnav-dr-cta { display:flex; flex-direction:column; gap:10px; margin-top:18px; padding-top:16px; border-top:1px solid rgba(255,255,255,.1); }
.qnav-dr-cta .qnav-btn { text-align:center; padding:13px; font-size:15px; }
.qnav-dr-cta .qnav-phone { justify-content:center; padding:12px; border:1px solid rgba(255,255,255,.22); border-radius:9px; }

/* ===== PAGE HERO ===== */
.qhero { position:relative; overflow:hidden; background:linear-gradient(170deg,#1a3381 0%,#14296b 100%); clip-path:polygon(0 0,100% 0,100% 94%,0 100%); padding:74px 0 104px; color:#fff; }
.qhero-grid { position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px); background-size:46px 46px; pointer-events:none; }
.qhero .qcontainer { position:relative; z-index:1; }
.qhero h1 { font-size:clamp(26px,3.4vw,44px); font-weight:900; line-height:1.12; margin:0 0 16px; letter-spacing:-.01em; color:#fff; }
.qhero h1 em { color:var(--qbis-yellow-500); font-style:normal; }
.qhero .qtitle { color:#fff; }
.qhero .qhero-sub { font-size:14px; line-height:1.7; color:rgba(255,255,255,.82); }
.qhero .qeyebrow { color:var(--qbis-cyan-500); }
.qhero-cta { display:flex; gap:13px; flex-wrap:wrap; margin-top:26px; }
.qhero-cta .qbtn-outline { color:#fff; border-color:rgba(255,255,255,.5); background:transparent; }

/* ===== CARDS / GRID ===== */
.qgrid-2 { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.qgrid-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.qgrid-4 { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.qcard { background:#fff; border:1px solid var(--border-subtle); border-radius:16px; padding:28px; box-shadow:var(--shadow-card); }
.qcard-ico { width:50px; height:50px; border-radius:13px; background:var(--qbis-blue-100); color:var(--color-primary); display:flex; align-items:center; justify-content:center; margin-bottom:16px; }
.qcard h3 { font-size:17px; font-weight:800; color:var(--text-strong); margin:0 0 9px; }
.qcard p { font-size:13.5px; line-height:1.65; color:var(--text-body); margin:0; }
.qfeat { display:flex; gap:10px; font-size:13.5px; line-height:1.55; color:var(--text-body); margin-top:11px; }
.qfeat .qcheck { flex:none; width:20px; height:20px; border-radius:50%; background:var(--qbis-blue-100); color:var(--color-primary); display:flex; align-items:center; justify-content:center; font-size:11px; font-weight:800; margin-top:1px; }
.qstat-num { font-size:34px; font-weight:900; color:var(--color-primary); line-height:1; }
.qstat-lbl { font-size:13px; color:var(--text-muted); margin-top:6px; }

/* ===== CTA band (light, matches homepage final CTA) ===== */

.qcta { background:linear-gradient(120deg,var(--qbis-blue-100) 0%,#fff 45%,var(--qbis-cream-100,#fdf6e3) 100%); color:var(--text-body); border:1px solid var(--border-subtle); border-radius:22px; padding:56px 48px; text-align:center; position:relative; overflow:hidden; box-shadow:var(--shadow-card); }
.qcta { width:100vw; margin-left:calc(50% - 50vw); background:linear-gradient(120deg,var(--qbis-blue-100) 0%,#fff 45%,var(--qbis-cream-100,#fdf6e3) 100%); color:var(--text-body); border:none; border-radius:0; padding:96px 48px 72px; text-align:center; position:relative; overflow:hidden; clip-path:polygon(0 42px,100% 0,100% 100%,0 100%); }
.qsec:has(> .qcontainer > .qcta) { padding:0; }
.qcta::before { content:"★ ✦ ♥ ◆ ✦ ★"; position:absolute; left:0; top:0; bottom:0; width:200px; display:flex; align-items:center; justify-content:center; flex-direction:column; gap:34px; font-size:30px; line-height:1; letter-spacing:8px; color:rgba(46,111,219,.16); writing-mode:vertical-rl; text-orientation:upright; pointer-events:none; }
.qcta::after { content:"♥ ◆ ★ ✦ ★ ♥"; position:absolute; right:0; top:0; bottom:0; width:200px; display:flex; align-items:center; justify-content:center; flex-direction:column; gap:34px; font-size:30px; line-height:1; letter-spacing:8px; color:rgba(252,218,12,.3); writing-mode:vertical-rl; text-orientation:upright; pointer-events:none; }
.qcta .qtitle { color:var(--text-strong); }
.qcta h2 em, .qcta .qtitle em { color:var(--color-primary); font-style:normal; }
.qcta .qeyebrow { color:var(--qbis-orange-500) !important; }
.qcta p { font-size:14px; color:var(--text-muted); max-width:500px; margin:0 auto 24px; line-height:1.6; }
.qcta .qbtn-accent { background:var(--qbis-purple-500); color:#fff; }
.qcta .qbtn-outline { background:#fff !important; color:var(--color-primary) !important; border-color:var(--qbis-blue-300) !important; }

/* ===== FOOTER ===== */
.qfoot { background:#2f6bf0; color:rgba(255,255,255,.85); position:relative; }
.qf-wave { position:absolute; left:0; right:0; top:0; transform:translateY(-99%); line-height:0; pointer-events:none; }
.qf-wave svg { display:block; width:100%; height:auto; }
.qf-inner { max-width:var(--container-max); margin:0 auto; padding:0 var(--container-pad); position:relative; }
.qf-grid { display:grid; grid-template-columns:1.6fr 1fr 1fr 1.2fr; gap:40px; padding:56px 0 32px; align-items:start; }
.qf-logo { display:inline-flex; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.1); border-radius:10px; padding:9px 14px; margin-bottom:14px; }
.qf-logo img { height:28px; display:block; }
.qf-tag { font-size:14px; line-height:1.6; max-width:300px; color:rgba(255,255,255,.85); margin:0; }
.qf-act { display:flex; gap:10px; margin-top:16px; flex-wrap:wrap; }
.qf-btn { background:var(--qbis-yellow-500); color:var(--qbis-navy-900); font-weight:700; font-size:12px; padding:9px 18px; border-radius:8px; text-decoration:none; }
.qf-phone { display:inline-flex; align-items:center; gap:6px; font-size:12px; padding:8px 16px; border-radius:8px; border:1px solid rgba(255,255,255,.25); color:#fff; text-decoration:none; }
.qf-phone:hover, .qf-btn:hover { filter:brightness(.96); }
.qf-col-t { color:#fff; font-weight:700; font-size:15px; margin-bottom:12px; }
.qf-links { display:flex; flex-direction:column; gap:9px; }
.qf-links a { color:rgba(255,255,255,.9); font-size:14px; text-decoration:none; display:inline-flex; align-items:flex-start; gap:8px; }
.qf-links a:hover { color:var(--qbis-yellow-500); }
.qf-bottom { border-top:1px solid rgba(255,255,255,.22); padding:18px 0; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; align-items:center; font-size:13px; color:rgba(255,255,255,.75); }
.qf-lang select { font-family:inherit; font-size:13px; padding:5px 10px; border-radius:7px; border:1px solid rgba(255,255,255,.2); background:rgba(255,255,255,.08); color:#fff; }
.qf-lang select option { color:#14296b; }

@media(max-width:960px){
  .qnav { padding:11px 20px; gap:14px; }
  .qnav-links { display:none; }
  .qnav-cta { display:none; }
  .qnav-toggle { display:flex; }
  body { padding-top:58px; }
  .qhero { padding:52px 0 74px; }
  .qcontainer { padding:0 20px; }
  .qsec { padding:56px 0; }
  .qcta { padding:64px 24px 54px; }
  .qgrid-2,.qgrid-3,.qgrid-4,.qf-grid { grid-template-columns:1fr; }
  .qhero-cta { flex-direction:column; align-items:stretch; }
  .qhero-cta .qbtn { width:100%; }
  .qf-grid { gap:28px; padding:48px 0 28px; }
  .qf-bottom { flex-direction:column; align-items:flex-start; gap:8px; }
  .qcta::before, .qcta::after { display:none; }
  section [aria-hidden="true"], .qhero [aria-hidden="true"] { display:none !important; }
}
@media(max-width:560px){
  .qnav-logo img { height:22px; }
  .qhero h1 { font-size:clamp(25px,7.4vw,34px); }
  .qtitle { font-size:clamp(23px,6.4vw,30px); }
  .qlead { font-size:13px; }
  .qcard { padding:22px; }
  .qsec { padding:48px 0; }
}
