:root {
  --q-bg: #f4f6fa;
  --q-bg-2: #ffffff;
  --q-panel: #ffffff;
  --q-panel-2: #f8fafc;
  --q-navy: #071b3a;
  --q-navy-2: #0d2d5f;
  --q-blue: #2f8cff;
  --q-orange: #ff6a00;
  --q-orange-2: #ff8a2b;
  --q-text: #16233a;
  --q-muted: #64748b;
  --q-line: #dfe5ee;
  --q-orange-line: rgba(255,106,0,.34);
  --q-shadow: 0 16px 38px rgba(15,38,76,.10);
  --q-radius: 14px;
}

* { box-sizing: border-box; }
html, body { overflow-x: hidden; }
body.qs88-v3 {
  margin: 0;
  color: var(--q-text);
  background: var(--q-bg);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif !important;
  font-size: 16px;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}
body.qs88-v3 h1, body.qs88-v3 h2, body.qs88-v3 h3, body.qs88-v3 h4, body.qs88-v3 h5, body.qs88-v3 h6,
body.qs88-v3 p, body.qs88-v3 li, body.qs88-v3 a, body.qs88-v3 span, body.qs88-v3 button, body.qs88-v3 input, body.qs88-v3 textarea, body.qs88-v3 select { font-family: inherit !important; }
body.qs88-v3 h1, body.qs88-v3 h2, body.qs88-v3 h3 { text-transform: none; letter-spacing: normal; word-break: normal; overflow-wrap: anywhere; }
a { color: inherit; }
.qs88-shell { width: min(1120px, calc(100% - 40px)); margin-inline: auto; }
#qs88-main { min-height: 55vh; }

/* Header */
.qs88-site-header { position: sticky; top: 0; z-index: 999; background: rgba(7,27,58,.97); border-bottom: 1px solid rgba(255,255,255,.10); backdrop-filter: blur(14px); }
.admin-bar .qs88-site-header { top: 32px; }
.qs88-header-row { min-height: 72px; display: flex; align-items: center; gap: 24px; }
.qs88-brand { display: flex; flex: 0 0 auto; }
.qs88-brand img { width: 128px; height: auto; display: block; object-fit: contain; }
.qs88-primary-nav { min-width: 0; flex: 1; }
.qs88-nav-list { list-style: none; display: flex; align-items: center; justify-content: center; gap: clamp(12px,1.4vw,22px); margin: 0; padding: 0; }
.qs88-nav-list a { color: #fff; font-size: 12px; font-weight: 800; text-decoration: none; text-transform: uppercase; white-space: nowrap; }
.qs88-nav-list a:hover, .qs88-nav-list .current-menu-item > a { color: var(--q-orange); }
.qs88-header-actions { display: flex; gap: 9px; flex: 0 0 auto; }
.qs88-action-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: 9px 16px; border-radius: 7px; font-weight: 800; font-size: 13px; line-height: 1; text-decoration: none; border: 1px solid transparent; transition: .2s ease; }
.qs88-action-btn.is-primary { background: linear-gradient(135deg,var(--q-orange),var(--q-orange-2)); color: #fff; box-shadow: 0 9px 24px rgba(255,106,0,.22); }
.qs88-action-btn.is-ghost { border-color: rgba(255,255,255,.38); background: rgba(255,255,255,.03); color: #fff; }
.qs88-action-btn.is-large { min-height: 44px; padding-inline: 20px; }
.qs88-action-btn:not(.is-disabled):hover { transform: translateY(-1px); }
.qs88-action-btn.is-disabled { opacity: .82; cursor: default; }
.qs88-menu-toggle { display: none; width: 42px; height: 42px; padding: 8px; border: 0; background: transparent; margin-left: auto; }
.qs88-menu-toggle span { display: block; height: 2px; margin: 6px 0; background: #fff; }

/* Shared */
.qs88-section { padding: 68px 0; border-top: 1px solid var(--q-line); }
.qs88-kicker { display: inline-block; color: var(--q-orange); font-size: 12px; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.qs88-section h2 { color: #fff; margin: 6px 0 18px; font-size: clamp(28px,3vw,42px); line-height: 1.15; }
.qs88-section-heading { max-width: 720px; margin-bottom: 26px; }
.qs88-text-link, .qs88-outline-link { display: inline-flex; align-items: center; min-height: 38px; padding: 8px 14px; border: 1px solid var(--q-orange-line); border-radius: 6px; color: var(--q-navy); text-decoration: none; font-weight: 800; font-size: 13px; }
.qs88-text-link:hover, .qs88-outline-link:hover { background: rgba(255,106,0,.09); }

/* Homepage intro */
.qs88-intro-section { padding: 74px 0 62px; background: radial-gradient(circle at 90% 20%, rgba(47,140,255,.13), transparent 32%), radial-gradient(circle at 8% 18%, rgba(255,106,0,.12), transparent 34%), linear-gradient(135deg,#ffffff 0%,#f7f9fd 56%,#fff7f1 100%); border-bottom: 1px solid var(--q-line); }
.qs88-intro-grid { display: grid; grid-template-columns: minmax(0,1.15fr) minmax(320px,.85fr); gap: 46px; align-items: center; }
.qs88-intro-copy h1 { max-width: 720px; color: #fff; margin: 8px 0 18px; font-size: clamp(42px,5vw,66px); line-height: 1.02; }
.qs88-intro-copy > p { max-width: 720px; color: var(--q-muted); margin: 22px 0 0; font-size: 16px; }
.qs88-intro-actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 20px 0; }
.qs88-chip-row { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 18px; }
.qs88-chip-row span { color: var(--q-navy); border: 1px solid var(--q-line); background: #fff; border-radius: 99px; padding: 7px 11px; font-size: 12px; }
.qs88-brand-panel { padding: 28px; border-radius: var(--q-radius); background: linear-gradient(145deg,#ffffff,#f7f9fc); border: 1px solid var(--q-orange-line); box-shadow: var(--q-shadow); }
.qs88-brand-panel > span { color: var(--q-navy); font-size: 34px; font-weight: 900; }
.qs88-brand-panel h2 { margin: 12px 0 14px; color: var(--q-orange); font-size: 18px; }
.qs88-brand-panel p { margin: 0; color: var(--q-muted); }

/* About and feature list */
.qs88-section-black { background: #ffffff; }
.qs88-about-grid { display: grid; grid-template-columns: minmax(0,1.05fr) minmax(360px,.95fr); gap: 48px; align-items: start; }
.qs88-about-copy p { max-width: 680px; color: var(--q-muted); }
.qs88-feature-stack { display: grid; gap: 12px; }
.qs88-feature-stack article { display: grid; grid-template-columns: 42px 1fr; gap: 16px; align-items: start; padding: 18px; border-radius: 10px; background: #ffffff; border: 1px solid var(--q-line); }
.qs88-feature-stack article > span { width: 34px; height: 34px; display: grid; place-items: center; color: #fff; background: var(--q-orange); border-radius: 50%; font-size: 11px; font-weight: 900; }
.qs88-feature-stack h3 { color: var(--q-navy); font-size: 15px; margin: 0 0 4px; }
.qs88-feature-stack p { color: var(--q-muted); font-size: 13px; margin: 0; }

/* Hubs */
.qs88-hubs-section { background: linear-gradient(180deg,#f6f8fc,#ffffff); }
.qs88-hub-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; }
.qs88-hub-card { display: grid; grid-template-columns: 50px 1fr auto; gap: 15px; align-items: center; min-height: 98px; padding: 18px; border-radius: 11px; color: var(--q-navy); text-decoration: none; background: #ffffff; border: 1px solid var(--q-line); transition: .2s ease; }
.qs88-hub-card:hover { transform: translateY(-2px); border-color: var(--q-orange-line); box-shadow: var(--q-shadow); }
.qs88-hub-icon { width: 46px; height: 46px; display: grid; place-items: center; color: var(--q-blue); background: rgba(47,140,255,.08); border: 1px solid rgba(47,140,255,.24); border-radius: 10px; font-weight: 900; }
.qs88-hub-card strong { display: block; font-size: 15px; }
.qs88-hub-card small { display: block; color: var(--q-muted); font-size: 12px; margin-top: 3px; }
.qs88-hub-card b { color: var(--q-orange); }

/* Posts carousel */
.qs88-posts-section { background: #ffffff; }
.qs88-section-row { display: flex; justify-content: space-between; align-items: end; gap: 20px; margin-bottom: 24px; }
.qs88-section-row h2 { margin-bottom: 0; }
.qs88-carousel-tools { display: flex; align-items: center; gap: 8px; }
.qs88-carousel-tools a { color: var(--q-navy); text-decoration: none; font-size: 13px; font-weight: 800; margin-right: 8px; }
.qs88-carousel-tools button { width: 38px; height: 38px; border-radius: 7px; color: var(--q-navy); background: #ffffff; border: 1px solid var(--q-line); cursor: pointer; }
.qs88-post-carousel { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(260px,31%); gap: 18px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: thin; scrollbar-color: var(--q-orange) #eef2f7; padding-bottom: 8px; }
.qs88-post-card { scroll-snap-align: start; overflow: hidden; border-radius: 10px; background: #ffffff; border: 1px solid var(--q-line); }
.qs88-post-image { display: block; aspect-ratio: 16/9; overflow: hidden; background: #eef2f7; }
.qs88-post-image img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .25s ease; }
.qs88-post-card:hover .qs88-post-image img { transform: scale(1.03); }
.qs88-post-card > div { padding: 16px; }
.qs88-post-card small { color: #7a879a; }
.qs88-post-card h3 { margin: 7px 0 0; font-size: 16px; line-height: 1.4; }
.qs88-post-card h3 a { color: var(--q-navy); text-decoration: none; }
.qs88-post-placeholder { height: 100%; display: grid; place-items: center; font-size: 32px; font-weight: 900; color: var(--q-orange); }

/* FAQ */
.qs88-faq-section { background: #f6f8fc; }
.qs88-faq-grid { display: grid; grid-template-columns: minmax(300px,.78fr) minmax(0,1.22fr); gap: 28px; align-items: start; }
.qs88-faq-intro { min-height: 100%; padding: 24px; border: 1px solid var(--q-orange-line); background: #ffffff; border-radius: 12px; }
.qs88-faq-intro p { color: var(--q-muted); }
.qs88-faq-list { display: grid; gap: 10px; }
.qs88-faq-list details { border: 1px solid rgba(255,106,0,.30); border-radius: 8px; background: #ffffff; overflow: hidden; }
.qs88-faq-list summary { position: relative; cursor: pointer; list-style: none; padding: 16px 50px 16px 18px; color: var(--q-navy); font-weight: 800; }
.qs88-faq-list summary::-webkit-details-marker { display: none; }
.qs88-faq-list summary::after { content: '+'; position: absolute; right: 18px; top: 50%; transform: translateY(-50%); color: var(--q-orange); font-size: 20px; }
.qs88-faq-list details[open] summary::after { content: '−'; }
.qs88-faq-list details p { margin: 0; padding: 0 18px 18px; color: var(--q-muted); font-size: 14px; }

/* Content */
.qs88-content-section { background: linear-gradient(180deg,#ffffff,#f7f9fc); }
.qs88-article-body { max-width: 930px; margin-inline: auto; color: var(--q-text); font-size: 16px; }
.qs88-article-body h2 { margin: 42px 0 18px; padding-left: 14px; border-left: 3px solid var(--q-orange); color: var(--q-navy); font-size: clamp(25px,3vw,34px); }
.qs88-article-body h3 { margin: 30px 0 12px; color: var(--q-orange); font-size: 21px; }
.qs88-article-body h4 { color: #fff; }
.qs88-article-body a { color: #e85d00; font-weight: 700; }
.qs88-article-body p, .qs88-article-body li { color: #334155; }
.qs88-article-body img { max-width: 100%; height: auto; border-radius: 10px; }
.qs88-article-body table { display: block; width: 100%; max-width: 100%; overflow-x: auto; border-collapse: collapse; }
.qs88-article-body th, .qs88-article-body td { border: 1px solid var(--q-line); padding: 10px 12px; }
.qs88-featured { width: 100%; max-height: 560px; object-fit: cover; margin-bottom: 28px; border-radius: 12px; }

/* Inner pages */
.qs88-inner-hero { padding: 48px 0 38px; background: radial-gradient(circle at 90% 10%,rgba(47,140,255,.12),transparent 34%),linear-gradient(135deg,#fff7f1,#ffffff 62%); border-bottom: 1px solid var(--q-line); }
.qs88-inner-hero h1 { max-width: 950px; color: var(--q-navy); margin: 12px 0 0; font-size: clamp(36px,4.5vw,58px); line-height: 1.08; }
.qs88-breadcrumb { display: flex; flex-wrap: wrap; gap: 8px; color: var(--q-muted); font-size: 13px; }
.qs88-breadcrumb a { color: var(--q-navy); text-decoration: none; }
.qs88-meta { color: var(--q-muted); }
.qs88-archive-desc { max-width: 920px; margin-top: 20px; color: var(--q-muted); }

/* Archive */
.qs88-archive-section { background: #f6f8fc; }
.qs88-archive-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.qs88-archive-card { overflow: hidden; border-radius: 10px; background: #ffffff; border: 1px solid var(--q-line); }
.qs88-archive-image { display: block; aspect-ratio: 16/9; overflow: hidden; }
.qs88-archive-image img { width: 100%; height: 100%; object-fit: cover; display: block; }
.qs88-archive-card > div { padding: 16px; }
.qs88-archive-card small { color: #7a879a; }
.qs88-archive-card h2 { margin: 7px 0 9px; font-size: 18px; line-height: 1.38; }
.qs88-archive-card h2 a { color: var(--q-navy); text-decoration: none; }
.qs88-archive-card p { color: var(--q-muted); font-size: 14px; }
.navigation.pagination { grid-column: 1/-1; }
.nav-links { display: flex; flex-wrap: wrap; gap: 8px; }
.page-numbers { display: grid; place-items: center; min-width: 38px; height: 38px; padding: 0 10px; border-radius: 6px; color: var(--q-navy); text-decoration: none; background: #ffffff; border: 1px solid var(--q-line); }
.page-numbers.current { background: var(--q-orange); border-color: var(--q-orange); color:#fff; }

/* Footer */
.qs88-footer { background: radial-gradient(circle at 10% 0%,rgba(47,140,255,.16),transparent 34%),linear-gradient(135deg,#071b3a,#0d2d5f 58%,#081a35); border-top: 3px solid var(--q-orange); padding-top: 44px; }
.qs88-footer-grid { display: grid; grid-template-columns: 1.55fr repeat(3,1fr); gap: 34px; }
.qs88-footer-brand img { width: 138px; height: auto; }
.qs88-footer-brand p { max-width: 420px; color: #cbd5e1; font-size: 14px; }
.qs88-footer h3 { color: #fff; margin: 0 0 14px; font-size: 15px; }
.qs88-footer section:not(.qs88-footer-brand) { display: flex; flex-direction: column; align-items: flex-start; }
.qs88-footer section a { color: #d5deeb; text-decoration: none; font-size: 14px; margin: 4px 0; }
.qs88-footer section a:hover { color: #fff; }
.qs88-footer-badges { display: flex; flex-wrap: wrap; gap: 8px; }
.qs88-footer-badges span { border-radius: 99px; padding: 5px 9px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); color: #fff; font-size: 11px; }
.qs88-disclaimer { margin-top: 32px; padding: 14px 16px; border-radius: 8px; color: #d8e2ef; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); font-size: 12px; }
.qs88-footer-bottom { margin-top: 28px; border-top: 1px solid rgba(255,255,255,.09); }
.qs88-footer-bottom .qs88-shell { min-height: 58px; display: flex; align-items: center; justify-content: space-between; gap: 16px; color: #c5d0df; font-size: 12px; }

@media (max-width: 1080px) {
  .qs88-header-actions { display: none; }
  .qs88-nav-list { gap: 12px; }
  .qs88-intro-grid, .qs88-about-grid { grid-template-columns: 1fr; }
  .qs88-brand-panel { max-width: 680px; }
}

@media (max-width: 900px) {
  .admin-bar .qs88-site-header { top: 46px; }
  .qs88-header-row { min-height: 66px; }
  .qs88-menu-toggle { display: block; }
  .qs88-primary-nav { position: absolute; top: 100%; left: 0; right: 0; display: none; background: var(--q-navy); border-top: 1px solid var(--q-line); border-bottom: 1px solid rgba(255,255,255,.10); }
  .qs88-primary-nav.is-open { display: block; }
  .qs88-nav-list { display: block; padding: 10px 20px 18px; }
  .qs88-nav-list a { padding: 12px 0; border-bottom: 1px solid rgba(255,255,255,.07); }
  .qs88-hub-grid, .qs88-archive-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .qs88-faq-grid { grid-template-columns: 1fr; }
  .qs88-footer-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .qs88-post-carousel { grid-auto-columns: minmax(260px,52%); }
}

@media (max-width: 640px) {
  .qs88-shell { width: min(100% - 24px,1120px); }
  .qs88-brand img { width: 112px; }
  .qs88-intro-section { padding: 46px 0 42px; }
  .qs88-intro-copy h1 { font-size: clamp(36px,11vw,48px); }
  .qs88-intro-actions { flex-direction: column; align-items: stretch; }
  .qs88-action-btn.is-large { width: 100%; }
  .qs88-section { padding: 48px 0; }
  .qs88-hub-grid, .qs88-archive-grid { grid-template-columns: 1fr; }
  .qs88-section-row { align-items: start; flex-direction: column; }
  .qs88-post-carousel { grid-auto-columns: 84%; }
  .qs88-faq-intro, .qs88-brand-panel { padding: 20px; }
  .qs88-inner-hero { padding: 36px 0 30px; }
  .qs88-inner-hero h1 { font-size: 36px; }
  .qs88-footer-grid { grid-template-columns: 1fr; }
  .qs88-footer-bottom .qs88-shell { align-items: flex-start; flex-direction: column; justify-content: center; padding-block: 14px; }
}


/* ===== V3.1 white-orange refinements ===== */
body.qs88-v3 { background: var(--q-bg); color: var(--q-text); }
.qs88-section h2,
.qs88-section h3,
.qs88-section h4 { color: var(--q-navy); }
.qs88-kicker { color: var(--q-orange); }
.qs88-text-link,
.qs88-outline-link { color: var(--q-navy); background:#fff; }
.qs88-action-btn.is-ghost { color:#fff; border-color:rgba(255,255,255,.45); background:rgba(255,255,255,.04); }
.qs88-intro-copy h1 { color: var(--q-navy); }
.qs88-brand-panel { box-shadow: var(--q-shadow); }
.qs88-feature-stack article,
.qs88-hub-card,
.qs88-post-card,
.qs88-faq-intro,
.qs88-faq-list details,
.qs88-archive-card { box-shadow: 0 10px 26px rgba(15,38,76,.06); }
.qs88-post-card h3 a,
.qs88-archive-card h2 a { color: var(--q-navy); }
.qs88-post-placeholder { color: var(--q-orange); }
.qs88-faq-list summary::after { color: var(--q-orange); }
.qs88-article-body h2 { color: var(--q-navy); }
.qs88-article-body h3 { color: var(--q-orange); }
.qs88-article-body h4 { color: var(--q-navy); }
.qs88-inner-hero h1 { color: var(--q-navy); }
.qs88-footer h3 { color:#fff; }
.qs88-footer a { color:#d5deeb; }
.qs88-footer a:hover { color:#fff; }
.qs88-page-layout .qs88-content-section,
.qs88-single-layout .qs88-content-section { background:#fff; }


/* ===== V3.2 darker, cleaner typography and visible actions ===== */
:root {
  --q-bg: #e9eef5;
  --q-bg-2: #f7f9fc;
  --q-panel: #ffffff;
  --q-panel-2: #f4f7fb;
  --q-navy: #071b3a;
  --q-navy-2: #0c2c5d;
  --q-blue: #2b86ff;
  --q-orange: #ff6900;
  --q-orange-2: #ff8a2b;
  --q-text: #10213d;
  --q-muted: #68788f;
  --q-line: #d8e0eb;
  --q-shadow: 0 18px 42px rgba(4, 23, 53, .12);
}

body.qs88-v3,
body.qs88-v3 h1,
body.qs88-v3 h2,
body.qs88-v3 h3,
body.qs88-v3 h4,
body.qs88-v3 h5,
body.qs88-v3 h6,
body.qs88-v3 p,
body.qs88-v3 li,
body.qs88-v3 a,
body.qs88-v3 span,
body.qs88-v3 button,
body.qs88-v3 input,
body.qs88-v3 textarea,
body.qs88-v3 select {
  font-family: "Segoe UI Variable", "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
}

body.qs88-v3 {
  background: var(--q-bg);
  color: var(--q-text);
  font-size: 15.5px;
  line-height: 1.68;
  font-weight: 400;
  font-kerning: normal;
  text-rendering: optimizeLegibility;
}

body.qs88-v3 h1,
body.qs88-v3 h2,
body.qs88-v3 h3,
body.qs88-v3 h4 {
  font-weight: 780;
  letter-spacing: -.025em;
}

.qs88-site-header {
  background: rgba(5, 20, 45, .98);
  border-bottom-color: rgba(255, 255, 255, .08);
  box-shadow: 0 8px 26px rgba(0, 13, 36, .20);
}

.qs88-header-row {
  min-height: 70px;
}

.qs88-nav-list a {
  font-size: 12.5px;
  letter-spacing: .015em;
}

.qs88-header-actions .qs88-action-btn.is-ghost {
  color: #ffffff;
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.48);
  opacity: 1;
}

.qs88-header-actions .qs88-action-btn.is-primary {
  color: #ffffff;
  opacity: 1;
}

.qs88-intro-section {
  padding: 68px 0 58px;
  background:
    radial-gradient(circle at 82% 18%, rgba(43,134,255,.25), transparent 31%),
    radial-gradient(circle at 8% 25%, rgba(255,105,0,.18), transparent 30%),
    linear-gradient(135deg, #061a38 0%, #0a2855 52%, #071c3b 100%);
  border-bottom: 1px solid rgba(255,255,255,.08);
}

.qs88-intro-grid {
  grid-template-columns: minmax(0, 1.2fr) minmax(300px, .8fr);
  gap: 54px;
}

.qs88-intro-copy h1 {
  max-width: 680px;
  margin: 9px 0 18px;
  color: #ffffff;
  font-size: clamp(39px, 4.35vw, 58px);
  line-height: 1.06;
  letter-spacing: -.04em;
  font-weight: 800;
}

.qs88-intro-copy h1 span {
  color: var(--q-orange-2);
}

.qs88-intro-copy > p {
  max-width: 680px;
  margin-top: 18px;
  color: #c8d5e7;
  font-size: 15.5px;
  line-height: 1.75;
}

.qs88-intro-actions {
  gap: 11px;
  margin: 22px 0 18px;
}

.qs88-intro-actions .qs88-action-btn {
  min-width: 148px;
  min-height: 44px;
  border-radius: 8px;
  font-size: 13.5px;
  opacity: 1;
}

.qs88-intro-actions .qs88-action-btn.is-primary {
  color: #ffffff;
  background: linear-gradient(135deg, var(--q-orange), var(--q-orange-2));
  border-color: transparent;
  box-shadow: 0 12px 28px rgba(255,105,0,.26);
}

.qs88-intro-actions .qs88-action-btn.is-ghost {
  color: var(--q-navy);
  background: #ffffff;
  border-color: #ffffff;
  box-shadow: 0 12px 28px rgba(0, 12, 35, .22);
}

.qs88-intro-actions .qs88-action-btn.is-disabled {
  opacity: 1;
}

.qs88-chip-row span {
  color: #e2eaf5;
  background: rgba(255,255,255,.055);
  border-color: rgba(255,255,255,.16);
  padding: 7px 12px;
}

.qs88-brand-panel {
  padding: 30px;
  color: #ffffff;
  background:
    linear-gradient(145deg, rgba(255,255,255,.095), rgba(255,255,255,.035));
  border: 1px solid rgba(255,138,43,.52);
  box-shadow: 0 22px 48px rgba(0,10,31,.28);
  backdrop-filter: blur(10px);
}

.qs88-brand-panel > span {
  color: #ffffff;
  font-size: 31px;
  letter-spacing: -.03em;
}

.qs88-brand-panel h2 {
  margin: 10px 0 12px;
  color: var(--q-orange-2) !important;
  font-size: 18px;
  letter-spacing: -.01em;
}

.qs88-brand-panel p {
  color: #c5d2e4;
  line-height: 1.75;
}

.qs88-section {
  padding: 62px 0;
}

.qs88-section h2 {
  font-size: clamp(27px, 2.55vw, 38px);
  line-height: 1.16;
}

.qs88-section-black {
  background:
    radial-gradient(circle at 90% 10%, rgba(43,134,255,.12), transparent 28%),
    linear-gradient(180deg, #0b244a 0%, #081c3a 100%);
  border-top: 0;
}

.qs88-section-black .qs88-kicker {
  color: var(--q-orange-2);
}

.qs88-section-black h2 {
  color: #ffffff !important;
  max-width: 690px;
}

.qs88-section-black .qs88-about-copy p {
  color: #c5d2e4;
  max-width: 700px;
}

.qs88-section-black .qs88-text-link {
  color: #ffffff;
  background: rgba(255,255,255,.06);
  border-color: rgba(255,138,43,.55);
}

.qs88-section-black .qs88-text-link:hover {
  background: rgba(255,138,43,.16);
}

.qs88-section-black .qs88-feature-stack article {
  background: rgba(255,255,255,.055);
  border-color: rgba(255,255,255,.12);
  box-shadow: 0 14px 34px rgba(0, 9, 28, .18);
}

.qs88-section-black .qs88-feature-stack h3 {
  color: #ffffff;
  font-size: 15.5px;
}

.qs88-section-black .qs88-feature-stack p {
  color: #afbdd1;
}

.qs88-section-black .qs88-feature-stack article > span {
  background: linear-gradient(135deg, var(--q-orange), var(--q-orange-2));
}

.qs88-hubs-section,
.qs88-posts-section,
.qs88-faq-section,
.qs88-content-section {
  background: var(--q-bg-2);
}

.qs88-hub-card,
.qs88-post-card,
.qs88-faq-intro,
.qs88-faq-list details,
.qs88-archive-card {
  border-color: #d6dfeb;
  box-shadow: 0 12px 28px rgba(9, 34, 73, .07);
}

.qs88-hub-card:hover,
.qs88-post-card:hover,
.qs88-archive-card:hover {
  border-color: rgba(255,105,0,.45);
  box-shadow: 0 17px 38px rgba(9, 34, 73, .12);
}

.qs88-post-card h3 {
  font-size: 15.5px;
  letter-spacing: -.012em;
}

.qs88-faq-list summary {
  font-size: 14.5px;
}

.qs88-inner-hero {
  background:
    radial-gradient(circle at 86% 18%, rgba(43,134,255,.18), transparent 28%),
    linear-gradient(135deg, #071c3c, #0a2b59);
}

.qs88-inner-hero h1 {
  color: #ffffff !important;
  font-size: clamp(34px, 4vw, 52px);
  letter-spacing: -.035em;
}

.qs88-inner-hero p,
.qs88-inner-hero .qs88-breadcrumbs {
  color: #c7d3e5;
}

@media (max-width: 900px) {
  .qs88-intro-grid {
    gap: 28px;
  }
  .qs88-intro-copy h1 {
    max-width: 760px;
  }
}

@media (max-width: 640px) {
  .qs88-intro-section {
    padding: 42px 0 38px;
  }
  .qs88-intro-copy h1 {
    font-size: clamp(34px, 10.2vw, 45px);
    line-height: 1.08;
  }
  .qs88-intro-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .qs88-action-btn.is-large {
    width: 100%;
    padding-inline: 12px;
  }
  .qs88-brand-panel {
    padding: 22px;
  }
}

@media (max-width: 390px) {
  .qs88-intro-actions {
    grid-template-columns: 1fr;
  }
}


/* ===== V3.3 ===== */
.qs88-header-row { grid-template-columns: auto 1fr; }
.qs88-header-actions { display: none !important; }
.qs88-primary-nav { justify-self: end; }

.qs88-overview-section {
  padding: 68px 0;
  background:
    radial-gradient(circle at 8% 12%, rgba(255,105,0,.08), transparent 28%),
    linear-gradient(180deg, #edf2f7 0%, #e8eef5 100%);
  border-top: 1px solid #d9e1eb;
  border-bottom: 1px solid #d5deea;
}
.qs88-overview-grid {
  display: grid;
  grid-template-columns: minmax(330px,.92fr) minmax(0,1.08fr);
  gap: 48px;
  align-items: center;
}
.qs88-overview-brand {
  padding: 36px 34px;
  border-radius: 22px;
  background: linear-gradient(145deg,#fff7f1 0%,#f9f2ee 100%);
  border: 1px solid rgba(255,105,0,.16);
  box-shadow: 0 18px 42px rgba(22,42,72,.08);
}
.qs88-overview-brand img {
  display:block;
  width:min(240px,78%);
  height:auto;
  margin:0 0 22px;
}
.qs88-overview-brand > p {
  margin:0 0 18px;
  color:#334155;
  font-size:15px;
  line-height:1.72;
}
.qs88-overview-brand ul { list-style:none; padding:0; margin:0; }
.qs88-overview-brand li {
  position:relative;
  margin:12px 0;
  padding-left:30px;
  color:#425168;
  font-size:14.5px;
  line-height:1.55;
}
.qs88-overview-brand li::before {
  content:"✓";
  position:absolute;
  left:0;
  top:1px;
  display:grid;
  place-items:center;
  width:20px;
  height:20px;
  border-radius:50%;
  color:#fff;
  background:linear-gradient(135deg,var(--q-orange),var(--q-orange-2));
  font-size:12px;
  font-weight:800;
}
.qs88-overview-copy { padding:8px 0; }
.qs88-overview-copy .qs88-kicker {
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-bottom:12px;
  color:var(--q-orange);
}
.qs88-overview-copy .qs88-kicker::before {
  content:"";
  width:20px;
  height:2px;
  background:var(--q-orange);
}
.qs88-overview-copy h2 {
  max-width:660px;
  margin:0 0 22px;
  color:var(--q-navy)!important;
  font-size:clamp(31px,3.2vw,45px);
  line-height:1.12;
  letter-spacing:-.035em;
}
.qs88-overview-copy p {
  max-width:690px;
  color:#58687f;
  font-size:15.5px;
  line-height:1.8;
}
.qs88-overview-button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  margin-top:12px;
  padding:0 20px;
  border-radius:9px;
  color:#fff!important;
  background:linear-gradient(135deg,var(--q-orange),var(--q-orange-2));
  box-shadow:0 12px 26px rgba(255,105,0,.22);
  font-size:13.5px;
  font-weight:750;
  text-decoration:none;
}
.qs88-overview-button:hover {
  color:#fff!important;
  transform:translateY(-1px);
  box-shadow:0 15px 30px rgba(255,105,0,.28);
}

/* Softer backgrounds */
.qs88-hubs-section, .qs88-faq-section { background:#f1f4f8; }
.qs88-posts-section { background:#eaf0f6; }
.qs88-content-section { background:#e9eef4; }
.qs88-hub-card, .qs88-post-card, .qs88-faq-intro,
.qs88-faq-list details, .qs88-archive-card { background:#f9fbfd; }
.qs88-page-layout .qs88-content-section,
.qs88-single-layout .qs88-content-section { background:#edf2f7; }

@media (max-width:900px) {
  .qs88-header-row { grid-template-columns:auto auto; }
  .qs88-overview-grid { grid-template-columns:1fr; gap:28px; }
  .qs88-overview-brand { max-width:720px; }
}
@media (max-width:640px) {
  .qs88-overview-section { padding:46px 0; }
  .qs88-overview-brand { padding:26px 22px; border-radius:16px; }
  .qs88-overview-brand img { width:min(210px,74%); }
  .qs88-overview-copy h2 { font-size:clamp(30px,9vw,39px); }
}


/* ===== V3.4 APP GAME DARK UI ===== */
:root {
  --game-bg: #05132b;
  --game-bg-2: #071b38;
  --game-bg-3: #0a2348;
  --game-panel: #0d2a52;
  --game-panel-2: #102f5c;
  --game-card: #0d274d;
  --game-card-hover: #123665;
  --game-line: rgba(91, 145, 222, .28);
  --game-line-strong: rgba(43, 134, 255, .58);
  --game-text: #f7fbff;
  --game-muted: #aebed4;
  --game-blue: #2b86ff;
  --game-cyan: #53c7ff;
  --game-orange: #ff730d;
  --game-orange-2: #ff9b3d;
  --game-shadow: 0 18px 42px rgba(0, 9, 28, .28);
}

html {
  background: var(--game-bg);
}

body.qs88-v3 {
  background:
    radial-gradient(circle at 8% 0%, rgba(43, 134, 255, .10), transparent 28%),
    linear-gradient(180deg, var(--game-bg) 0%, #061833 100%);
  color: var(--game-text);
}

#qs88-main {
  background: transparent;
}

/* Header stays compact like an app navigation bar */
.qs88-site-header {
  background: rgba(4, 16, 36, .96);
  border-bottom: 1px solid rgba(83, 199, 255, .15);
  box-shadow: 0 10px 28px rgba(0, 8, 24, .28);
}

.qs88-header-row {
  min-height: 66px;
}

.qs88-nav-list a {
  color: #dce8f7;
}

.qs88-nav-list a:hover,
.qs88-nav-list .current-menu-item > a {
  color: var(--game-orange-2);
}

/* Hero */
.qs88-intro-section {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background:
    linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px),
    radial-gradient(circle at 82% 15%, rgba(43,134,255,.30), transparent 30%),
    radial-gradient(circle at 7% 24%, rgba(255,115,13,.18), transparent 30%),
    linear-gradient(135deg, #06152f 0%, #0a2a59 52%, #071a38 100%);
  background-size: 38px 38px, 38px 38px, auto, auto, auto;
  border-bottom: 1px solid rgba(91,145,222,.24);
}

.qs88-intro-section::after {
  content: "";
  position: absolute;
  inset: auto -80px -150px auto;
  width: 430px;
  height: 430px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(83,199,255,.16), transparent 68%);
  z-index: -1;
}

.qs88-intro-copy h1,
.qs88-intro-copy > p {
  color: var(--game-text);
}

.qs88-intro-copy > p {
  color: #c1d1e5;
}

.qs88-intro-actions .qs88-action-btn.is-primary {
  background: linear-gradient(135deg, var(--game-orange), var(--game-orange-2));
  box-shadow: 0 12px 30px rgba(255,115,13,.28);
}

.qs88-intro-actions .qs88-action-btn.is-ghost {
  color: #ffffff;
  background: linear-gradient(135deg, #1671e8, #2b86ff);
  border-color: rgba(83,199,255,.56);
  box-shadow: 0 12px 30px rgba(43,134,255,.22);
}

.qs88-chip-row span {
  color: #d8e6f7;
  background: rgba(255,255,255,.045);
  border: 1px solid rgba(83,199,255,.18);
}

.qs88-brand-panel {
  background:
    linear-gradient(145deg, rgba(18,54,101,.92), rgba(9,33,68,.92));
  border: 1px solid rgba(83,199,255,.28);
  box-shadow: var(--game-shadow);
}

.qs88-brand-panel > span,
.qs88-brand-panel h2 {
  color: #ffffff !important;
}

.qs88-brand-panel h2 {
  color: var(--game-orange-2) !important;
}

.qs88-brand-panel p {
  color: var(--game-muted);
}

/* App-like overview */
.qs88-overview-section {
  background:
    radial-gradient(circle at 92% 20%, rgba(43,134,255,.12), transparent 28%),
    linear-gradient(180deg, #071a37 0%, #06152f 100%);
  border-top: 1px solid rgba(83,199,255,.12);
  border-bottom: 1px solid rgba(83,199,255,.14);
}

.qs88-overview-brand,
.qs88-overview-copy {
  min-height: 100%;
}

.qs88-overview-brand {
  background:
    linear-gradient(145deg, rgba(18,51,96,.96), rgba(10,35,71,.96));
  border: 1px solid rgba(83,199,255,.26);
  box-shadow: var(--game-shadow);
}

.qs88-overview-brand > p,
.qs88-overview-brand li,
.qs88-overview-copy p {
  color: var(--game-muted);
}

.qs88-overview-brand li::before {
  background: linear-gradient(135deg, var(--game-blue), var(--game-cyan));
  box-shadow: 0 0 18px rgba(43,134,255,.28);
}

.qs88-overview-copy h2 {
  color: var(--game-text) !important;
}

.qs88-overview-copy .qs88-kicker {
  color: var(--game-orange-2);
}

.qs88-overview-button {
  background: linear-gradient(135deg, var(--game-orange), var(--game-orange-2));
}

/* All major sections become dark app screens */
.qs88-hubs-section,
.qs88-posts-section,
.qs88-faq-section,
.qs88-content-section,
.qs88-archive-section {
  background:
    radial-gradient(circle at 8% 0%, rgba(43,134,255,.08), transparent 24%),
    linear-gradient(180deg, #081c3b 0%, #06152f 100%);
  border-top: 1px solid rgba(83,199,255,.12);
}

.qs88-section h2,
.qs88-section h3,
.qs88-section h4 {
  color: var(--game-text);
}

.qs88-section .qs88-kicker {
  color: var(--game-orange-2);
}

/* Game room cards */
.qs88-hub-grid {
  gap: 16px;
}

.qs88-hub-card {
  position: relative;
  overflow: hidden;
  min-height: 108px;
  color: var(--game-text);
  background:
    radial-gradient(circle at 95% 0%, rgba(43,134,255,.18), transparent 35%),
    linear-gradient(145deg, var(--game-panel-2), var(--game-card));
  border: 1px solid var(--game-line);
  box-shadow: 0 14px 32px rgba(0, 9, 28, .20);
}

.qs88-hub-card::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  background: linear-gradient(var(--game-cyan), var(--game-blue));
  opacity: .72;
}

.qs88-hub-card:hover {
  transform: translateY(-3px);
  color: #ffffff;
  background:
    radial-gradient(circle at 95% 0%, rgba(83,199,255,.22), transparent 38%),
    linear-gradient(145deg, #143d72, #0f315d);
  border-color: var(--game-line-strong);
  box-shadow: 0 18px 42px rgba(0, 10, 32, .30), 0 0 0 1px rgba(43,134,255,.10);
}

.qs88-hub-icon {
  color: #ffffff;
  background: linear-gradient(145deg, rgba(43,134,255,.30), rgba(83,199,255,.12));
  border-color: rgba(83,199,255,.38);
  box-shadow: inset 0 0 20px rgba(43,134,255,.10);
}

.qs88-hub-card strong {
  color: #ffffff;
  font-size: 15.5px;
}

.qs88-hub-card small {
  color: #aebed4;
}

.qs88-hub-card b {
  color: var(--game-orange-2);
}

/* Content cards */
.qs88-post-card,
.qs88-archive-card,
.qs88-faq-intro,
.qs88-faq-list details {
  background:
    linear-gradient(145deg, rgba(16,47,92,.97), rgba(11,36,73,.97));
  border-color: var(--game-line);
  box-shadow: 0 14px 34px rgba(0, 9, 28, .20);
}

.qs88-post-card:hover,
.qs88-archive-card:hover {
  border-color: var(--game-line-strong);
  box-shadow: 0 18px 42px rgba(0, 9, 28, .30);
}

.qs88-post-image,
.qs88-archive-image {
  background: #071a38;
}

.qs88-post-card small,
.qs88-archive-card small {
  color: #8fa4bf;
}

.qs88-post-card h3 a,
.qs88-archive-card h2 a {
  color: #f7fbff;
}

.qs88-archive-card p,
.qs88-faq-intro p,
.qs88-faq-list details p {
  color: var(--game-muted);
}

.qs88-carousel-tools a {
  color: #d9e6f7;
}

.qs88-carousel-tools button {
  color: #ffffff;
  background: rgba(43,134,255,.18);
  border-color: rgba(83,199,255,.30);
}

.qs88-post-carousel {
  scrollbar-color: var(--game-orange) #081a36;
}

/* Support center */
.qs88-faq-intro {
  border-color: rgba(255,115,13,.34);
}

.qs88-outline-link,
.qs88-text-link {
  color: #ffffff;
  background: rgba(255,255,255,.045);
  border-color: rgba(255,115,13,.42);
}

.qs88-faq-list summary {
  color: #f4f8ff;
}

.qs88-faq-list details[open] {
  border-color: rgba(255,115,13,.48);
  background: linear-gradient(145deg, #133666, #0d294f);
}

/* Long SEO content is now a dark in-app reader panel */
.qs88-content-section .qs88-shell {
  width: min(1180px, calc(100% - 40px));
}

.qs88-article-body {
  max-width: 980px;
  padding: clamp(24px, 4vw, 48px);
  color: #dce7f5;
  background:
    linear-gradient(145deg, rgba(15,45,87,.98), rgba(9,31,64,.98));
  border: 1px solid rgba(83,199,255,.20);
  border-radius: 18px;
  box-shadow: var(--game-shadow);
}

.qs88-article-body h2 {
  color: #ffffff;
  border-left-color: var(--game-orange);
}

.qs88-article-body h3 {
  color: var(--game-orange-2);
}

.qs88-article-body h4 {
  color: #bcd8ff;
}

.qs88-article-body p,
.qs88-article-body li {
  color: #c8d6e8;
}

.qs88-article-body a {
  color: #6fcfff;
}

.qs88-article-body blockquote {
  color: #dfeaff;
  background: rgba(43,134,255,.10);
  border-left-color: var(--game-blue);
}

.qs88-article-body table {
  color: #dce7f5;
}

.qs88-article-body th,
.qs88-article-body td {
  border-color: rgba(83,199,255,.20);
}

.qs88-article-body th {
  background: rgba(43,134,255,.14);
}

.qs88-article-body img {
  box-shadow: 0 14px 32px rgba(0, 7, 22, .24);
}

/* Inner pages */
.qs88-inner-hero {
  background:
    linear-gradient(rgba(255,255,255,.014) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.014) 1px, transparent 1px),
    radial-gradient(circle at 88% 12%, rgba(43,134,255,.20), transparent 30%),
    linear-gradient(135deg, #06152f, #0b2c5b);
  background-size: 38px 38px, 38px 38px, auto, auto;
  border-bottom-color: rgba(83,199,255,.18);
}

.qs88-inner-hero h1 {
  color: #ffffff !important;
}

.qs88-inner-hero p,
.qs88-inner-hero .qs88-breadcrumbs,
.qs88-archive-desc {
  color: #b8c8dc;
}

/* Pagination */
.page-numbers {
  color: #dce8f7;
  background: var(--game-card);
  border-color: var(--game-line);
}

.page-numbers.current {
  background: linear-gradient(135deg, var(--game-orange), var(--game-orange-2));
}

/* Footer deeper and app-like */
.qs88-footer {
  background:
    radial-gradient(circle at 10% 0%, rgba(43,134,255,.16), transparent 34%),
    linear-gradient(135deg, #031027, #071d3d 58%, #04142c);
  border-top: 2px solid rgba(43,134,255,.45);
}

.qs88-disclaimer {
  background: rgba(43,134,255,.08);
  border-color: rgba(83,199,255,.18);
}

/* Keep native widgets/forms dark */
body.qs88-v3 input,
body.qs88-v3 select,
body.qs88-v3 textarea {
  color: #ffffff;
  background: var(--game-card);
  border-color: var(--game-line);
}

body.qs88-v3 input::placeholder,
body.qs88-v3 textarea::placeholder {
  color: #8ea1bb;
}

@media (max-width: 640px) {
  .qs88-article-body {
    padding: 22px 18px;
    border-radius: 14px;
  }

  .qs88-hub-card {
    min-height: 94px;
  }
}


/* ===== V3.4.1 MOBILE RESPONSIVE FIX ===== */
.qs88-header-row {
  position: relative;
}

body.qs88-v3 h1,
body.qs88-v3 h2,
body.qs88-v3 h3 {
  word-break: normal !important;
  overflow-wrap: normal !important;
  hyphens: none !important;
  white-space: normal !important;
}

.qs88-intro-grid > *,
.qs88-overview-grid > *,
.qs88-faq-grid > * {
  min-width: 0;
}

@media (max-width: 1080px) {
  .qs88-intro-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 28px !important;
  }

  .qs88-intro-copy,
  .qs88-brand-panel {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
  }

  .qs88-intro-copy h1 {
    max-width: 760px !important;
  }
}

@media (max-width: 900px) {
  .qs88-primary-nav {
    z-index: 1001;
    width: 100%;
  }

  .qs88-intro-section {
    padding-top: 42px !important;
  }

  .qs88-brand-panel {
    order: 2;
  }
}

@media (max-width: 640px) {
  .qs88-shell {
    width: calc(100% - 28px) !important;
    max-width: 100% !important;
  }

  .qs88-intro-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100% !important;
    gap: 22px !important;
  }

  .qs88-intro-copy {
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
  }

  .qs88-intro-copy h1 {
    width: 100% !important;
    max-width: 100% !important;
    margin: 8px 0 16px !important;
    font-size: clamp(32px, 9.8vw, 42px) !important;
    line-height: 1.08 !important;
    letter-spacing: -0.025em !important;
  }

  .qs88-intro-copy > p {
    width: 100% !important;
    max-width: 100% !important;
    font-size: 15px !important;
  }

  .qs88-intro-actions {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    gap: 10px !important;
    width: 100% !important;
  }

  .qs88-intro-actions .qs88-action-btn {
    width: 100% !important;
    min-width: 0 !important;
    padding-inline: 10px !important;
    white-space: nowrap !important;
    font-size: 12.5px !important;
  }

  .qs88-brand-panel {
    width: 100% !important;
    max-width: 100% !important;
    padding: 22px !important;
  }

  .qs88-brand-panel > span {
    font-size: 28px !important;
  }

  .qs88-brand-panel h2 {
    font-size: 17px !important;
  }

  .qs88-overview-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .qs88-overview-brand,
  .qs88-overview-copy {
    width: 100% !important;
    max-width: 100% !important;
  }

  .qs88-overview-copy h2 {
    font-size: clamp(28px, 8.6vw, 38px) !important;
  }

  .qs88-inner-hero h1 {
    width: 100% !important;
    max-width: 100% !important;
    font-size: clamp(30px, 9vw, 38px) !important;
    line-height: 1.12 !important;
  }
}

@media (max-width: 430px) {
  .qs88-intro-actions {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .qs88-intro-actions .qs88-action-btn {
    min-height: 44px !important;
    font-size: 13px !important;
  }

  .qs88-chip-row {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }

  .qs88-chip-row span {
    width: 100% !important;
    text-align: center !important;
  }
}


/* ===== V3.4.2 BREADCRUMB FIX ===== */

/* Child theme đã có breadcrumb riêng, ẩn breadcrumb bị chèn thêm bởi plugin/Flatsome. */
body.qs88-v3 .rank-math-breadcrumb,
body.qs88-v3 .yoast-breadcrumb,
body.qs88-v3 .woocommerce-breadcrumb,
body.qs88-v3 nav.breadcrumbs:not(.qs88-breadcrumb),
body.qs88-v3 .breadcrumbs:not(.qs88-breadcrumb),
body.qs88-v3 .breadcrumb:not(.qs88-breadcrumb) {
  display: none !important;
}

/* Breadcrumb chính: dễ đọc trên nền navy, gọn và đồng bộ màu cam. */
body.qs88-v3 .qs88-inner-hero .qs88-breadcrumb {
  display: inline-flex !important;
  align-items: center;
  flex-wrap: wrap;
  gap: 7px;
  width: auto;
  max-width: 100%;
  margin: 0 0 14px;
  padding: 9px 13px;
  border: 1px solid rgba(255, 115, 13, .48);
  border-radius: 8px;
  color: #dbe7f6 !important;
  background: rgba(2, 15, 36, .58);
  box-shadow: 0 10px 24px rgba(0, 0, 0, .12);
  font-size: 13px;
  line-height: 1.35;
}

body.qs88-v3 .qs88-inner-hero .qs88-breadcrumb a {
  color: #ff7a16 !important;
  font-weight: 700;
  text-decoration: none;
}

body.qs88-v3 .qs88-inner-hero .qs88-breadcrumb a:hover {
  color: #ffa14c !important;
  text-decoration: underline;
}

body.qs88-v3 .qs88-inner-hero .qs88-breadcrumb span {
  color: #dbe7f6 !important;
}

body.qs88-v3 .qs88-inner-hero .qs88-breadcrumb span:last-child {
  color: #ffffff !important;
  font-weight: 700;
}

@media (max-width: 640px) {
  body.qs88-v3 .qs88-inner-hero .qs88-breadcrumb {
    width: 100%;
    padding: 8px 11px;
    margin-bottom: 12px;
    font-size: 12px;
  }
}


/* ==================================================================
   QS88 V3.5 — PREMIUM ORANGE REDESIGN
   Palette: orange / charcoal / warm white
   ================================================================== */

:root {
  --q-bg: #f3efe8;
  --q-bg-2: #faf8f4;
  --q-panel: #ffffff;
  --q-panel-2: #f7f3ed;
  --q-navy: #191a1e;
  --q-navy-2: #26282d;
  --q-blue: #ff6a00;
  --q-orange: #ff6a00;
  --q-orange-2: #ff9a3c;
  --q-text: #24262b;
  --q-muted: #6b6e75;
  --q-line: #e6ddd2;
  --q-orange-line: rgba(255, 106, 0, .34);
  --q-shadow: 0 22px 55px rgba(35, 27, 20, .10);
  --q-shadow-soft: 0 12px 30px rgba(35, 27, 20, .07);
  --q-radius: 18px;
}

html,
body {
  background: var(--q-bg) !important;
}

body.qs88-v3 {
  background:
    radial-gradient(circle at 8% 0%, rgba(255,106,0,.055), transparent 28%),
    var(--q-bg) !important;
  color: var(--q-text) !important;
}

/* ===== HEADER ===== */
body.qs88-v3 .qs88-site-header {
  position: sticky;
  top: 0;
  z-index: 999;
  background: rgba(24, 25, 29, .97) !important;
  border-top: 3px solid var(--q-orange) !important;
  border-bottom: 1px solid rgba(255,255,255,.08) !important;
  box-shadow: 0 12px 30px rgba(14, 12, 10, .18) !important;
  backdrop-filter: blur(16px);
}

body.qs88-v3 .qs88-header-row {
  min-height: 76px !important;
  gap: 28px !important;
}

body.qs88-v3 .qs88-brand {
  position: relative;
  align-items: center;
  padding-right: 24px;
}

body.qs88-v3 .qs88-brand::after {
  content: "";
  position: absolute;
  top: 9px;
  right: 0;
  bottom: 9px;
  width: 1px;
  background: rgba(255,255,255,.12);
}

body.qs88-v3 .qs88-brand img {
  width: 130px !important;
  filter: drop-shadow(0 5px 14px rgba(0,0,0,.18));
}

body.qs88-v3 .qs88-nav-list {
  gap: clamp(14px, 1.6vw, 26px) !important;
}

body.qs88-v3 .qs88-nav-list a {
  position: relative;
  display: block;
  padding: 28px 0 25px;
  color: #f7f3ed !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  letter-spacing: .035em !important;
}

body.qs88-v3 .qs88-nav-list a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 18px;
  height: 2px;
  border-radius: 99px;
  background: var(--q-orange);
  transform: scaleX(0);
  transform-origin: center;
  transition: transform .22s ease;
}

body.qs88-v3 .qs88-nav-list a:hover,
body.qs88-v3 .qs88-nav-list .current-menu-item > a,
body.qs88-v3 .qs88-nav-list .current_page_item > a {
  color: var(--q-orange-2) !important;
}

body.qs88-v3 .qs88-nav-list a:hover::after,
body.qs88-v3 .qs88-nav-list .current-menu-item > a::after,
body.qs88-v3 .qs88-nav-list .current_page_item > a::after {
  transform: scaleX(1);
}

body.qs88-v3 .qs88-menu-toggle {
  border: 1px solid rgba(255,255,255,.13) !important;
  border-radius: 11px !important;
  background: rgba(255,255,255,.05) !important;
}

body.qs88-v3 .qs88-menu-toggle span {
  background: #fff !important;
}

/* ===== SHARED ===== */
body.qs88-v3 .qs88-shell {
  width: min(1180px, calc(100% - 44px)) !important;
}

body.qs88-v3 .qs88-section {
  padding: 78px 0 !important;
}

body.qs88-v3 .qs88-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--q-orange) !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  letter-spacing: .13em !important;
}

body.qs88-v3 .qs88-kicker::before {
  content: "";
  width: 22px;
  height: 2px;
  border-radius: 99px;
  background: var(--q-orange);
}

body.qs88-v3 .qs88-section h2,
body.qs88-v3 .qs88-section-heading h2,
body.qs88-v3 .qs88-section-row h2 {
  color: #1d1e22 !important;
  font-weight: 850 !important;
  letter-spacing: -.035em !important;
}

body.qs88-v3 .qs88-text-link,
body.qs88-v3 .qs88-outline-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 10px 17px;
  border: 1px solid rgba(255,106,0,.42) !important;
  border-radius: 11px !important;
  color: #24262b !important;
  background: #fff !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  box-shadow: 0 9px 22px rgba(35,27,20,.06);
}

body.qs88-v3 .qs88-text-link:hover,
body.qs88-v3 .qs88-outline-link:hover {
  color: #fff !important;
  background: var(--q-orange) !important;
  border-color: var(--q-orange) !important;
}

/* ===== HOME HERO ===== */
body.qs88-v3 .qs88-intro-section {
  position: relative;
  overflow: hidden;
  padding: 100px 0 92px !important;
  background:
    radial-gradient(circle at 84% 20%, rgba(255,106,0,.16), transparent 28%),
    radial-gradient(circle at 12% 100%, rgba(255,154,60,.10), transparent 32%),
    linear-gradient(135deg, #fbf8f3 0%, #f3eee6 52%, #ede5db 100%) !important;
  border-bottom: 1px solid var(--q-line) !important;
}

body.qs88-v3 .qs88-intro-section::before {
  content: "";
  position: absolute;
  top: -120px;
  right: -80px;
  width: 420px;
  height: 420px;
  border: 1px solid rgba(255,106,0,.17);
  border-radius: 50%;
  box-shadow:
    0 0 0 55px rgba(255,106,0,.035),
    0 0 0 110px rgba(255,106,0,.022);
}

body.qs88-v3 .qs88-intro-grid {
  position: relative;
  z-index: 1;
  display: grid !important;
  grid-template-columns: minmax(0, 1.25fr) minmax(340px, .75fr) !important;
  gap: clamp(46px, 7vw, 92px) !important;
  align-items: center !important;
}

body.qs88-v3 .qs88-intro-copy {
  min-width: 0 !important;
}

body.qs88-v3 .qs88-intro-copy h1 {
  max-width: 780px !important;
  margin: 14px 0 24px !important;
  color: #1c1d20 !important;
  font-size: clamp(48px, 6vw, 76px) !important;
  line-height: .99 !important;
  letter-spacing: -.052em !important;
  font-weight: 900 !important;
}

body.qs88-v3 .qs88-intro-copy h1 span {
  color: var(--q-orange) !important;
}

body.qs88-v3 .qs88-intro-copy > p {
  max-width: 720px !important;
  margin-top: 24px !important;
  color: #5f6269 !important;
  font-size: 17px !important;
  line-height: 1.75 !important;
}

body.qs88-v3 .qs88-intro-actions {
  display: flex !important;
  flex-wrap: wrap;
  gap: 12px !important;
  margin: 30px 0 0 !important;
}

body.qs88-v3 .qs88-action-btn {
  min-height: 48px !important;
  padding: 12px 22px !important;
  border-radius: 12px !important;
  font-weight: 850 !important;
  box-shadow: none !important;
}

body.qs88-v3 .qs88-action-btn.is-primary {
  color: #fff !important;
  background: linear-gradient(135deg, #ff6400, #ff8c25) !important;
  box-shadow: 0 13px 28px rgba(255,106,0,.25) !important;
}

body.qs88-v3 .qs88-action-btn.is-ghost {
  color: #24262b !important;
  background: #fff !important;
  border-color: #d9cfc3 !important;
  box-shadow: 0 10px 24px rgba(35,27,20,.07) !important;
}

body.qs88-v3 .qs88-action-btn:not(.is-disabled):hover {
  transform: translateY(-2px) !important;
}

body.qs88-v3 .qs88-chip-row {
  display: flex !important;
  flex-wrap: wrap;
  gap: 10px !important;
  margin-top: 26px !important;
}

body.qs88-v3 .qs88-chip-row span {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 7px 12px;
  border: 1px solid #e2d8cc !important;
  border-radius: 999px !important;
  color: #55585f !important;
  background: rgba(255,255,255,.70) !important;
  font-size: 12px !important;
  font-weight: 750 !important;
  box-shadow: 0 7px 18px rgba(35,27,20,.04);
}

body.qs88-v3 .qs88-chip-row span::before {
  content: "✓";
  margin-right: 7px;
  color: var(--q-orange);
  font-weight: 900;
}

body.qs88-v3 .qs88-brand-panel {
  position: relative;
  overflow: hidden;
  width: 100% !important;
  max-width: 440px !important;
  justify-self: end;
  min-height: 390px;
  padding: 44px 38px !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 26px !important;
  color: #fff !important;
  background:
    radial-gradient(circle at 82% 12%, rgba(255,106,0,.26), transparent 28%),
    linear-gradient(145deg, #1a1b1f, #2a2c31) !important;
  box-shadow: 0 30px 70px rgba(34,25,18,.22) !important;
}

body.qs88-v3 .qs88-brand-panel::before {
  content: "";
  position: absolute;
  right: -92px;
  bottom: -105px;
  width: 250px;
  height: 250px;
  border: 1px solid rgba(255,154,60,.28);
  border-radius: 50%;
  box-shadow:
    0 0 0 34px rgba(255,106,0,.035),
    0 0 0 68px rgba(255,106,0,.022);
}

body.qs88-v3 .qs88-brand-panel::after {
  content: "18+";
  position: absolute;
  right: 28px;
  bottom: 26px;
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 50%;
  color: #fff;
  background: rgba(255,255,255,.06);
  font-size: 14px;
  font-weight: 900;
}

body.qs88-v3 .qs88-brand-panel > span {
  position: relative;
  z-index: 1;
  color: var(--q-orange-2) !important;
  font-size: 62px !important;
  font-weight: 950 !important;
  letter-spacing: -.06em !important;
}

body.qs88-v3 .qs88-brand-panel h2 {
  position: relative;
  z-index: 1;
  max-width: 320px;
  margin: 20px 0 12px !important;
  color: #fff !important;
  font-size: 29px !important;
  line-height: 1.16 !important;
}

body.qs88-v3 .qs88-brand-panel p {
  position: relative;
  z-index: 1;
  max-width: 310px;
  color: #cfcfd2 !important;
  font-size: 15px !important;
}

/* ===== OVERVIEW ===== */
body.qs88-v3 .qs88-overview-section {
  background: #fff !important;
}

body.qs88-v3 .qs88-overview-grid {
  display: grid !important;
  grid-template-columns: minmax(330px, .86fr) minmax(0, 1.14fr) !important;
  gap: 64px !important;
  align-items: center !important;
}

body.qs88-v3 .qs88-overview-brand {
  position: relative;
  overflow: hidden;
  padding: 38px !important;
  border: 0 !important;
  border-radius: 22px !important;
  color: #fff;
  background:
    linear-gradient(145deg, #1c1d21, #2c2e33) !important;
  box-shadow: 0 24px 54px rgba(30,23,18,.18) !important;
}

body.qs88-v3 .qs88-overview-brand::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 110px;
  height: 5px;
  border-radius: 0 0 99px 0;
  background: var(--q-orange);
}

body.qs88-v3 .qs88-overview-brand img {
  width: 154px !important;
  margin-bottom: 20px !important;
}

body.qs88-v3 .qs88-overview-brand p,
body.qs88-v3 .qs88-overview-brand li {
  color: #d4d4d7 !important;
}

body.qs88-v3 .qs88-overview-brand ul {
  display: grid;
  gap: 10px;
  margin: 24px 0 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

body.qs88-v3 .qs88-overview-brand li {
  position: relative;
  padding-left: 24px;
}

body.qs88-v3 .qs88-overview-brand li::before {
  content: "•";
  position: absolute;
  left: 3px;
  color: var(--q-orange-2);
  font-size: 22px;
  line-height: 1.1;
}

body.qs88-v3 .qs88-overview-copy {
  padding: 10px 0 !important;
}

body.qs88-v3 .qs88-overview-copy h2 {
  max-width: 650px;
  margin: 12px 0 22px !important;
  color: #1f2024 !important;
  font-size: clamp(38px, 4.4vw, 58px) !important;
  line-height: 1.05 !important;
}

body.qs88-v3 .qs88-overview-copy p {
  color: #61646b !important;
  font-size: 16px !important;
}

body.qs88-v3 .qs88-overview-button {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  margin-top: 12px;
  padding: 12px 20px !important;
  border: 0 !important;
  border-radius: 12px !important;
  color: #fff !important;
  background: var(--q-orange) !important;
  font-weight: 850 !important;
  text-decoration: none !important;
  box-shadow: 0 12px 25px rgba(255,106,0,.22);
}

/* ===== HUBS ===== */
body.qs88-v3 .qs88-hubs-section {
  background:
    linear-gradient(180deg, #f5f1ea, #eee7de) !important;
  border-block: 1px solid #e4d9cc;
}

body.qs88-v3 .qs88-section-heading {
  margin-bottom: 32px !important;
}

body.qs88-v3 .qs88-hub-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 18px !important;
}

body.qs88-v3 .qs88-hub-card {
  position: relative;
  overflow: hidden;
  min-height: 132px;
  padding: 24px 22px !important;
  border: 1px solid #e4dbd0 !important;
  border-radius: 17px !important;
  color: #24262b !important;
  background: rgba(255,255,255,.92) !important;
  box-shadow: var(--q-shadow-soft) !important;
  transition: transform .23s ease, box-shadow .23s ease, border-color .23s ease !important;
}

body.qs88-v3 .qs88-hub-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 22px;
  right: 22px;
  height: 3px;
  border-radius: 0 0 99px 99px;
  background: linear-gradient(90deg, var(--q-orange), var(--q-orange-2));
}

body.qs88-v3 .qs88-hub-card:hover {
  transform: translateY(-5px) !important;
  border-color: rgba(255,106,0,.48) !important;
  box-shadow: 0 22px 45px rgba(35,27,20,.12) !important;
}

body.qs88-v3 .qs88-hub-icon {
  display: grid !important;
  place-items: center;
  flex: 0 0 auto;
  width: 54px !important;
  height: 54px !important;
  border: 1px solid rgba(255,106,0,.16) !important;
  border-radius: 15px !important;
  color: #fff !important;
  background: linear-gradient(145deg, #ff6900, #ff9537) !important;
  box-shadow: 0 11px 23px rgba(255,106,0,.20);
  font-size: 20px !important;
  font-weight: 900 !important;
}

body.qs88-v3 .qs88-hub-card strong {
  display: block;
  color: #202125 !important;
  font-size: 17px !important;
  font-weight: 900 !important;
}

body.qs88-v3 .qs88-hub-card small {
  display: block;
  margin-top: 5px;
  color: #74777d !important;
  line-height: 1.5;
}

body.qs88-v3 .qs88-hub-card > b {
  color: var(--q-orange) !important;
  font-size: 18px;
}

/* ===== POSTS ===== */
body.qs88-v3 .qs88-posts-section {
  background: #fff !important;
}

body.qs88-v3 .qs88-carousel-tools a,
body.qs88-v3 .qs88-carousel-tools button {
  border: 1px solid #e2d7ca !important;
  color: #24262b !important;
  background: #fff !important;
  box-shadow: 0 8px 18px rgba(35,27,20,.05);
}

body.qs88-v3 .qs88-carousel-tools button:hover,
body.qs88-v3 .qs88-carousel-tools a:hover {
  color: #fff !important;
  background: var(--q-orange) !important;
  border-color: var(--q-orange) !important;
}

body.qs88-v3 .qs88-post-carousel {
  gap: 20px !important;
}

body.qs88-v3 .qs88-post-card {
  overflow: hidden;
  border: 1px solid #e6ddd2 !important;
  border-radius: 18px !important;
  background: #fff !important;
  box-shadow: var(--q-shadow-soft) !important;
  transition: transform .22s ease, box-shadow .22s ease !important;
}

body.qs88-v3 .qs88-post-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 20px 42px rgba(35,27,20,.12) !important;
}

body.qs88-v3 .qs88-post-image {
  border-radius: 0 !important;
}

body.qs88-v3 .qs88-post-card > div {
  padding: 18px !important;
}

body.qs88-v3 .qs88-post-card small {
  color: var(--q-orange) !important;
  font-weight: 800;
}

body.qs88-v3 .qs88-post-card h3 a {
  color: #25262a !important;
  font-weight: 850 !important;
}

/* ===== FAQ ===== */
body.qs88-v3 .qs88-faq-section {
  background:
    radial-gradient(circle at 5% 20%, rgba(255,106,0,.09), transparent 24%),
    #f3eee7 !important;
  border-top: 1px solid #e3d9cc;
}

body.qs88-v3 .qs88-faq-grid {
  gap: 34px !important;
}

body.qs88-v3 .qs88-faq-intro {
  position: sticky;
  top: 110px;
  overflow: hidden;
  min-height: 310px !important;
  padding: 34px !important;
  border: 0 !important;
  border-radius: 20px !important;
  color: #fff;
  background:
    radial-gradient(circle at 85% 10%, rgba(255,106,0,.24), transparent 30%),
    linear-gradient(145deg, #1b1c20, #292b30) !important;
  box-shadow: 0 24px 54px rgba(30,23,18,.18) !important;
}

body.qs88-v3 .qs88-faq-intro .qs88-kicker {
  color: var(--q-orange-2) !important;
}

body.qs88-v3 .qs88-faq-intro h2 {
  color: #fff !important;
  font-size: 36px !important;
  line-height: 1.1;
}

body.qs88-v3 .qs88-faq-intro p {
  color: #d0d0d3 !important;
}

body.qs88-v3 .qs88-faq-intro .qs88-outline-link {
  color: #fff !important;
  border-color: rgba(255,154,60,.45) !important;
  background: rgba(255,255,255,.055) !important;
}

body.qs88-v3 .qs88-faq-list {
  gap: 12px !important;
}

body.qs88-v3 .qs88-faq-list details {
  border: 1px solid #e2d8cc !important;
  border-radius: 14px !important;
  background: #fff !important;
  box-shadow: 0 10px 25px rgba(35,27,20,.06) !important;
}

body.qs88-v3 .qs88-faq-list summary {
  padding: 19px 55px 19px 20px !important;
  color: #25262a !important;
}

body.qs88-v3 .qs88-faq-list summary::after {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  right: 17px !important;
  border-radius: 50%;
  color: #fff !important;
  background: var(--q-orange) !important;
  font-size: 18px !important;
}

body.qs88-v3 .qs88-faq-list details p {
  color: #686b72 !important;
}

/* ===== INNER PAGES ===== */
body.qs88-v3 .qs88-inner-hero {
  position: relative;
  overflow: hidden;
  padding: 64px 0 54px !important;
  border-bottom: 3px solid var(--q-orange) !important;
  background:
    radial-gradient(circle at 82% 18%, rgba(255,106,0,.24), transparent 29%),
    linear-gradient(145deg, #1a1b1f, #2b2d32) !important;
}

body.qs88-v3 .qs88-inner-hero::after {
  content: "";
  position: absolute;
  right: -85px;
  bottom: -130px;
  width: 330px;
  height: 330px;
  border: 1px solid rgba(255,154,60,.22);
  border-radius: 50%;
  box-shadow:
    0 0 0 52px rgba(255,106,0,.035),
    0 0 0 104px rgba(255,106,0,.02);
}

body.qs88-v3 .qs88-inner-hero .qs88-shell {
  position: relative;
  z-index: 1;
}

body.qs88-v3 .qs88-inner-hero h1 {
  max-width: 980px !important;
  margin: 17px 0 0 !important;
  color: #fff !important;
  font-size: clamp(38px, 5vw, 64px) !important;
  line-height: 1.06 !important;
  letter-spacing: -.045em !important;
  font-weight: 900 !important;
}

body.qs88-v3 .qs88-inner-hero .qs88-breadcrumb {
  display: inline-flex !important;
  width: auto !important;
  margin: 0 !important;
  padding: 9px 13px !important;
  border: 1px solid rgba(255,154,60,.35) !important;
  border-radius: 999px !important;
  color: #dedee0 !important;
  background: rgba(255,255,255,.055) !important;
  box-shadow: none !important;
}

body.qs88-v3 .qs88-inner-hero .qs88-breadcrumb a {
  color: var(--q-orange-2) !important;
}

body.qs88-v3 .qs88-inner-hero .qs88-breadcrumb span,
body.qs88-v3 .qs88-inner-hero .qs88-breadcrumb span:last-child {
  color: #fff !important;
}

body.qs88-v3 .qs88-content-section {
  padding: 58px 0 82px !important;
  background: #f3efe8 !important;
}

body.qs88-v3 .qs88-article-body {
  max-width: 980px !important;
  padding: 38px 44px !important;
  border: 1px solid #e4dbcf !important;
  border-radius: 20px !important;
  color: #34363b !important;
  background: #fff !important;
  box-shadow: 0 22px 55px rgba(35,27,20,.09) !important;
}

body.qs88-v3 .qs88-article-body > :first-child {
  margin-top: 0;
}

body.qs88-v3 .qs88-article-body h2 {
  margin: 44px 0 18px !important;
  padding: 0 0 12px !important;
  border-left: 0 !important;
  border-bottom: 2px solid rgba(255,106,0,.28) !important;
  color: var(--q-orange) !important;
  font-size: clamp(27px, 3vw, 36px) !important;
  font-weight: 900 !important;
}

body.qs88-v3 .qs88-article-body h3 {
  margin: 30px 0 12px !important;
  color: var(--q-orange) !important;
  font-size: 22px !important;
  font-weight: 850 !important;
}

body.qs88-v3 .qs88-article-body h4 {
  color: #24262b !important;
}

body.qs88-v3 .qs88-article-body p,
body.qs88-v3 .qs88-article-body li {
  color: #44474d !important;
}

body.qs88-v3 .qs88-article-body a {
  color: var(--q-orange) !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  text-underline-offset: 3px;
}

body.qs88-v3 .qs88-article-body a:hover {
  text-decoration: underline !important;
}

body.qs88-v3 .qs88-article-body img,
body.qs88-v3 .qs88-featured {
  border: 1px solid #e5dbcf !important;
  border-radius: 16px !important;
  box-shadow: 0 14px 34px rgba(35,27,20,.10) !important;
}

body.qs88-v3 .qs88-article-body blockquote {
  margin: 26px 0;
  padding: 20px 22px;
  border-left: 4px solid var(--q-orange);
  border-radius: 0 12px 12px 0;
  color: #55585f;
  background: #f8f3ed;
}

body.qs88-v3 .qs88-article-body th {
  color: #fff;
  background: #24262b;
}

body.qs88-v3 .qs88-article-body th,
body.qs88-v3 .qs88-article-body td {
  border-color: #e1d7cb !important;
}

/* ===== ARCHIVE ===== */
body.qs88-v3 .qs88-archive-section {
  background: #f3efe8 !important;
}

body.qs88-v3 .qs88-archive-grid {
  gap: 22px !important;
}

body.qs88-v3 .qs88-archive-card {
  overflow: hidden;
  border: 1px solid #e3d9cd !important;
  border-radius: 18px !important;
  background: #fff !important;
  box-shadow: var(--q-shadow-soft) !important;
  transition: transform .22s ease, box-shadow .22s ease;
}

body.qs88-v3 .qs88-archive-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 20px 42px rgba(35,27,20,.12) !important;
}

body.qs88-v3 .qs88-archive-card > div {
  padding: 19px !important;
}

body.qs88-v3 .qs88-archive-card small {
  color: var(--q-orange) !important;
  font-weight: 800;
}

body.qs88-v3 .qs88-archive-card h2 a {
  color: #24262b !important;
}

body.qs88-v3 .page-numbers {
  border-color: #ddd2c5 !important;
  color: #24262b !important;
  background: #fff !important;
  border-radius: 10px !important;
}

body.qs88-v3 .page-numbers.current {
  color: #fff !important;
  background: var(--q-orange) !important;
  border-color: var(--q-orange) !important;
}

/* ===== FOOTER ===== */
body.qs88-v3 .qs88-footer {
  padding-top: 58px !important;
  border-top: 4px solid var(--q-orange) !important;
  background:
    radial-gradient(circle at 10% 0%, rgba(255,106,0,.16), transparent 27%),
    linear-gradient(145deg, #18191d, #282a2f) !important;
}

body.qs88-v3 .qs88-footer-grid {
  gap: 42px !important;
}

body.qs88-v3 .qs88-footer-brand img {
  width: 150px !important;
}

body.qs88-v3 .qs88-footer-brand p,
body.qs88-v3 .qs88-footer section a,
body.qs88-v3 .qs88-disclaimer,
body.qs88-v3 .qs88-footer-bottom .qs88-shell {
  color: #cfcfd2 !important;
}

body.qs88-v3 .qs88-footer h3 {
  color: #fff !important;
  font-size: 16px !important;
}

body.qs88-v3 .qs88-footer section a:hover {
  color: var(--q-orange-2) !important;
}

body.qs88-v3 .qs88-footer-badges span {
  border-color: rgba(255,154,60,.25) !important;
  color: #fff !important;
  background: rgba(255,106,0,.08) !important;
}

body.qs88-v3 .qs88-disclaimer {
  border-color: rgba(255,255,255,.10) !important;
  background: rgba(255,255,255,.045) !important;
}

body.qs88-v3 .qs88-footer-bottom {
  border-top-color: rgba(255,255,255,.08) !important;
}

/* ===== REMOVE ALL BLUE-STYLE RESIDUE ===== */
body.qs88-v3 .qs88-section-black,
body.qs88-v3 .qs88-feature-stack article {
  background: #fff !important;
  border-color: #e4dbcf !important;
  color: #24262b !important;
}

body.qs88-v3 .qs88-post-placeholder {
  color: var(--q-orange) !important;
  background: #f4eee7 !important;
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1080px) {
  body.qs88-v3 .qs88-intro-grid {
    grid-template-columns: minmax(0, 1fr) minmax(300px, .72fr) !important;
    gap: 42px !important;
  }

  body.qs88-v3 .qs88-intro-copy h1 {
    font-size: clamp(46px, 6vw, 64px) !important;
  }

  body.qs88-v3 .qs88-overview-grid {
    gap: 42px !important;
  }
}

@media (max-width: 900px) {
  body.qs88-v3 .qs88-header-row {
    min-height: 68px !important;
  }

  body.qs88-v3 .qs88-brand::after {
    display: none;
  }

  body.qs88-v3 .qs88-primary-nav {
    top: calc(100% + 1px) !important;
    border-top: 0 !important;
    border-bottom: 3px solid var(--q-orange) !important;
    background: #1b1c20 !important;
    box-shadow: 0 18px 35px rgba(0,0,0,.22);
  }

  body.qs88-v3 .qs88-nav-list {
    padding: 10px 22px 20px !important;
  }

  body.qs88-v3 .qs88-nav-list a {
    padding: 13px 0 !important;
    border-bottom: 1px solid rgba(255,255,255,.08) !important;
  }

  body.qs88-v3 .qs88-nav-list a::after {
    display: none;
  }

  body.qs88-v3 .qs88-intro-section {
    padding: 70px 0 64px !important;
  }

  body.qs88-v3 .qs88-intro-grid,
  body.qs88-v3 .qs88-overview-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.qs88-v3 .qs88-brand-panel {
    max-width: none !important;
    justify-self: stretch !important;
    min-height: 320px;
  }

  body.qs88-v3 .qs88-overview-brand {
    max-width: none !important;
  }

  body.qs88-v3 .qs88-hub-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body.qs88-v3 .qs88-faq-intro {
    position: static !important;
    min-height: auto !important;
  }
}

@media (max-width: 640px) {
  body.qs88-v3 .qs88-shell {
    width: calc(100% - 28px) !important;
  }

  body.qs88-v3 .qs88-section {
    padding: 52px 0 !important;
  }

  body.qs88-v3 .qs88-intro-section {
    padding: 52px 0 48px !important;
  }

  body.qs88-v3 .qs88-intro-copy h1 {
    font-size: clamp(38px, 11vw, 50px) !important;
    line-height: 1.02 !important;
  }

  body.qs88-v3 .qs88-intro-copy > p {
    font-size: 15px !important;
  }

  body.qs88-v3 .qs88-intro-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }

  body.qs88-v3 .qs88-action-btn {
    width: 100% !important;
  }

  body.qs88-v3 .qs88-chip-row {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }

  body.qs88-v3 .qs88-chip-row span {
    justify-content: center;
  }

  body.qs88-v3 .qs88-brand-panel {
    min-height: 290px;
    padding: 28px 24px !important;
    border-radius: 20px !important;
  }

  body.qs88-v3 .qs88-brand-panel > span {
    font-size: 48px !important;
  }

  body.qs88-v3 .qs88-brand-panel h2 {
    font-size: 24px !important;
  }

  body.qs88-v3 .qs88-overview-brand {
    padding: 28px 24px !important;
  }

  body.qs88-v3 .qs88-overview-copy h2 {
    font-size: 38px !important;
  }

  body.qs88-v3 .qs88-hub-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.qs88-v3 .qs88-hub-card {
    min-height: 116px;
  }

  body.qs88-v3 .qs88-inner-hero {
    padding: 42px 0 36px !important;
  }

  body.qs88-v3 .qs88-inner-hero h1 {
    font-size: clamp(34px, 10vw, 44px) !important;
  }

  body.qs88-v3 .qs88-inner-hero .qs88-breadcrumb {
    width: auto !important;
    max-width: 100%;
    border-radius: 10px !important;
  }

  body.qs88-v3 .qs88-content-section {
    padding: 22px 0 54px !important;
  }

  body.qs88-v3 .qs88-article-body {
    padding: 24px 19px !important;
    border-radius: 15px !important;
  }

  body.qs88-v3 .qs88-article-body h2 {
    font-size: 27px !important;
  }

  body.qs88-v3 .qs88-article-body h3 {
    font-size: 21px !important;
  }
}


/* ==================================================================
   QS88 V3.5.1 — ROBOTO + CHECK ICON FIX
   Giữ nguyên toàn bộ thiết kế V3.5
   ================================================================== */

body.qs88-v3,
body.qs88-v3 p,
body.qs88-v3 li,
body.qs88-v3 a,
body.qs88-v3 span,
body.qs88-v3 button,
body.qs88-v3 input,
body.qs88-v3 textarea,
body.qs88-v3 select,
body.qs88-v3 h1,
body.qs88-v3 h2,
body.qs88-v3 h3,
body.qs88-v3 h4,
body.qs88-v3 h5,
body.qs88-v3 h6 {
  font-family: "Roboto", Arial, sans-serif !important;
}

/* Thay chấm xanh trong khối giới thiệu bằng dấu tích cam-trắng */
body.qs88-v3 .qs88-overview-brand li {
  position: relative;
  padding-left: 34px !important;
}

body.qs88-v3 .qs88-overview-brand li::before {
  content: "✓" !important;
  position: absolute !important;
  left: 0 !important;
  top: 1px !important;
  display: grid !important;
  place-items: center !important;
  width: 22px !important;
  height: 22px !important;
  border-radius: 50% !important;
  color: #ffffff !important;
  background: linear-gradient(135deg, #ff6a00, #ff9a3c) !important;
  box-shadow: 0 7px 16px rgba(255,106,0,.24) !important;
  font-family: Arial, sans-serif !important;
  font-size: 13px !important;
  line-height: 1 !important;
  font-weight: 900 !important;
}

/* Dấu tích trong các chip đầu trang đồng bộ */
body.qs88-v3 .qs88-chip-row span::before {
  content: "✓" !important;
  color: #ff6a00 !important;
  font-family: Arial, sans-serif !important;
  font-weight: 900 !important;
}


/* ==================================================================
   QS88 V3.5.3 — NEWS HUB
   ================================================================== */

body.qs88-v3 .qs88-news-hero .qs88-kicker {
  margin-top: 24px;
  color: #ff9a3c !important;
}

body.qs88-v3 .qs88-news-hero-copy {
  max-width: 760px;
  margin: 20px 0 0;
  color: #d5d5d8 !important;
  font-size: 16px;
  line-height: 1.7;
}

body.qs88-v3 .qs88-news-page {
  background: #f3efe8;
}

body.qs88-v3 .qs88-news-intro-section {
  padding-bottom: 38px !important;
  background: #fff !important;
}

body.qs88-v3 .qs88-news-intro {
  display: grid;
  grid-template-columns: minmax(280px, .72fr) minmax(0, 1.28fr);
  gap: 58px;
  align-items: start;
  padding: 34px;
  border: 1px solid #e3d9cc;
  border-radius: 20px;
  background: #faf7f2;
}

body.qs88-v3 .qs88-news-intro h2 {
  margin: 10px 0 0 !important;
  color: #202125 !important;
  font-size: clamp(30px, 4vw, 46px) !important;
  line-height: 1.08 !important;
}

body.qs88-v3 .qs88-news-intro-copy p {
  margin: 0;
  color: #60636a !important;
  font-size: 16px;
  line-height: 1.75;
}

body.qs88-v3 .qs88-news-categories {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-top: 22px;
}

body.qs88-v3 .qs88-news-categories a {
  position: relative;
  min-height: 116px;
  padding: 22px;
  border: 1px solid #e2d8cc;
  border-radius: 16px;
  color: #25262a !important;
  background: #fff;
  box-shadow: 0 10px 25px rgba(35,27,20,.06);
  text-decoration: none !important;
}

body.qs88-v3 .qs88-news-categories a::before {
  content: "✓";
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  margin-bottom: 14px;
  border-radius: 50%;
  color: #fff;
  background: #ff6a00;
  font-weight: 900;
}

body.qs88-v3 .qs88-news-categories strong {
  display: block;
  color: #232428;
  font-size: 16px;
}

body.qs88-v3 .qs88-news-categories span {
  display: block;
  margin-top: 6px;
  color: #74777e;
  font-size: 13px;
  line-height: 1.5;
}

body.qs88-v3 .qs88-news-list-section {
  background: #f3efe8 !important;
}

body.qs88-v3 .qs88-news-heading {
  margin-bottom: 28px;
}

body.qs88-v3 .qs88-news-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
}

body.qs88-v3 .qs88-news-card {
  overflow: hidden;
  border: 1px solid #e3d9cc;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 14px 34px rgba(35,27,20,.08);
  transition: transform .22s ease, box-shadow .22s ease;
}

body.qs88-v3 .qs88-news-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 22px 46px rgba(35,27,20,.13);
}

body.qs88-v3 .qs88-news-card.is-featured {
  grid-column: span 2;
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(280px, .95fr);
}

body.qs88-v3 .qs88-news-image {
  display: block;
  min-height: 215px;
  overflow: hidden;
  background: #eee7df;
}

body.qs88-v3 .qs88-news-card.is-featured .qs88-news-image {
  min-height: 100%;
}

body.qs88-v3 .qs88-news-image img {
  width: 100%;
  height: 100%;
  min-height: 215px;
  object-fit: cover;
  transition: transform .35s ease;
}

body.qs88-v3 .qs88-news-card:hover .qs88-news-image img {
  transform: scale(1.035);
}

body.qs88-v3 .qs88-news-card-body {
  padding: 21px;
}

body.qs88-v3 .qs88-news-card.is-featured .qs88-news-card-body {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 30px;
}

body.qs88-v3 .qs88-news-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  color: #85878c;
  font-size: 12px;
  font-weight: 700;
}

body.qs88-v3 .qs88-news-meta span {
  color: #ff6a00;
}

body.qs88-v3 .qs88-news-card h3 {
  margin: 13px 0 10px;
  font-size: 21px;
  line-height: 1.27;
}

body.qs88-v3 .qs88-news-card.is-featured h3 {
  font-size: 29px;
}

body.qs88-v3 .qs88-news-card h3 a {
  color: #232428 !important;
  text-decoration: none !important;
}

body.qs88-v3 .qs88-news-card p {
  margin: 0;
  color: #6c6f75 !important;
  line-height: 1.65;
}

body.qs88-v3 .qs88-news-readmore {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-top: 18px;
  color: #ff6a00 !important;
  font-weight: 800 !important;
  text-decoration: none !important;
}

body.qs88-v3 .qs88-news-pagination {
  margin-top: 34px;
}

body.qs88-v3 .qs88-news-pagination ul {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

body.qs88-v3 .qs88-news-pagination a,
body.qs88-v3 .qs88-news-pagination span {
  display: grid;
  place-items: center;
  min-width: 40px;
  min-height: 40px;
  padding: 7px 11px;
  border: 1px solid #ded3c6;
  border-radius: 10px;
  color: #25262a !important;
  background: #fff;
  text-decoration: none !important;
}

body.qs88-v3 .qs88-news-pagination .current {
  color: #fff !important;
  border-color: #ff6a00;
  background: #ff6a00;
}

body.qs88-v3 .qs88-news-empty {
  padding: 28px;
  border: 1px dashed #d9caba;
  border-radius: 16px;
  color: #5f6268;
  background: #fff;
}

body.qs88-v3 .qs88-news-empty strong {
  display: block;
  margin-bottom: 7px;
  color: #232428;
}

body.qs88-v3 .qs88-news-check-section {
  padding-top: 0 !important;
  background: #f3efe8 !important;
}

body.qs88-v3 .qs88-news-check {
  display: grid;
  grid-template-columns: minmax(280px, .8fr) minmax(0, 1.2fr);
  gap: 54px;
  align-items: center;
  padding: 36px;
  border-radius: 20px;
  color: #fff;
  background:
    radial-gradient(circle at 85% 10%, rgba(255,106,0,.24), transparent 30%),
    linear-gradient(145deg, #1b1c20, #292b30);
  box-shadow: 0 22px 50px rgba(30,23,18,.18);
}

body.qs88-v3 .qs88-news-check h2 {
  margin: 10px 0 0 !important;
  color: #fff !important;
  font-size: clamp(29px, 3.5vw, 42px) !important;
}

body.qs88-v3 .qs88-news-check ul {
  display: grid;
  gap: 13px;
  margin: 0;
  padding: 0;
  list-style: none;
}

body.qs88-v3 .qs88-news-check li {
  position: relative;
  padding-left: 34px;
  color: #d8d8db !important;
}

body.qs88-v3 .qs88-news-check li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 0;
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  color: #fff;
  background: #ff6a00;
  font-size: 12px;
  font-weight: 900;
}

@media (max-width: 900px) {
  body.qs88-v3 .qs88-news-intro,
  body.qs88-v3 .qs88-news-check {
    grid-template-columns: minmax(0, 1fr);
    gap: 24px;
  }

  body.qs88-v3 .qs88-news-categories,
  body.qs88-v3 .qs88-news-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.qs88-v3 .qs88-news-card.is-featured {
    grid-column: 1 / -1;
  }
}

@media (max-width: 640px) {
  body.qs88-v3 .qs88-news-intro {
    padding: 24px 20px;
  }

  body.qs88-v3 .qs88-news-categories,
  body.qs88-v3 .qs88-news-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  body.qs88-v3 .qs88-news-card.is-featured {
    display: block;
  }

  body.qs88-v3 .qs88-news-card.is-featured .qs88-news-card-body {
    padding: 21px;
  }

  body.qs88-v3 .qs88-news-card.is-featured h3 {
    font-size: 23px;
  }

  body.qs88-v3 .qs88-news-check {
    padding: 27px 21px;
  }
}