/* Shared product presentation. Scoped to product pages. */
body.single-product {
  --qkh-product-ink: #142e52;
  --qkh-product-blue: #1249a6;
  --qkh-product-line: #dfe7f0;
  --qkh-product-muted: #55677d;
}
body.single-product .qkh-real-product {max-width:1420px;margin-inline:auto;color:var(--qkh-product-ink)}
body.single-product .qkh-ar15-path {font-size:13px;line-height:1.65;margin:0 0 12px;color:var(--qkh-product-muted)}
body.single-product .qkh-ar15-path a {text-decoration:none;font-weight:600;color:var(--qkh-product-blue)}
body.single-product .qkh-ar15-path span {display:none}
body.single-product .qkh-ar15-hero {grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:start}
body.single-product .qkh-ar15-gallery {min-width:0;position:sticky;top:120px}
body.single-product .qkh-ar15-main img {border:1px solid var(--qkh-product-line);border-radius:20px;background:#f7f9fc;box-shadow:0 8px 28px #142e5208}
body.single-product .qkh-ar15-main figcaption {font-size:12px;line-height:1.65;margin:12px 2px 16px;color:var(--qkh-product-muted)}
body.single-product .qkh-ar15-thumbs {gap:10px}
body.single-product .qkh-ar15-thumbs button {padding:3px;border:1px solid #d5dfeb;border-radius:11px;transition:border-color .18s,box-shadow .18s}
body.single-product .qkh-ar15-thumbs button:hover {border-color:#7a9dce}
body.single-product .qkh-ar15-thumbs button[aria-pressed=true] {border-color:var(--qkh-product-blue);box-shadow:0 0 0 2px #1249a620}
body.single-product .qkh-ar15-thumbs img {object-fit:contain;border-radius:7px}
body.single-product .qkh-ar15-summary {display:flex;flex-direction:column;min-width:0}
body.single-product .qkh-ar15-summary .eyebrow {order:0;font-size:11px;letter-spacing:.1em;margin:2px 0 12px;line-height:1.6}
body.single-product .qkh-ar15-summary h1 {order:1;font-size:clamp(27px,2.4vw,34px);line-height:1.24;letter-spacing:-.025em;margin:0 0 16px;color:var(--qkh-product-ink);overflow-wrap:break-word}
body.single-product .qkh-ar15-intro {order:2;font-size:16px;line-height:1.8;margin:0;color:#43556a}
body.single-product .qkh-ar15-price {order:3;margin:24px 0 18px;padding:20px 22px;background:linear-gradient(120deg,#f0f5ff,#f7faff);border:1px solid #dce6f8;border-radius:16px}
body.single-product .qkh-ar15-price>span {font-size:12px;font-weight:600;letter-spacing:.035em;color:var(--qkh-product-muted)}
body.single-product .qkh-ar15-price strong {font-size:clamp(24px,2.1vw,30px);font-weight:750;letter-spacing:-.025em;line-height:1.4;color:var(--qkh-product-blue);margin:7px 0 0;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
body.single-product .qkh-ar15-price p {font-size:13px;line-height:1.7;color:var(--qkh-product-muted);margin:10px 0 0}
body.single-product .qkh-ar15-summary>.qkh-ar15-actions {order:4;display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:12px;margin:0 0 22px}
body.single-product .qkh-ar15-actions .btn {min-height:48px;padding:12px 20px;border-radius:10px;line-height:1.45;font-size:14px;box-shadow:none;text-decoration:none;white-space:normal}
body.single-product .qkh-ar15-actions .btn:not(.secondary) {background:#1249a6;border:1px solid #1249a6;box-shadow:0 5px 12px #1249a618;color:#fff}
body.single-product .qkh-ar15-actions .btn:not(.secondary):hover {background:#0c387e;border-color:#0c387e}
body.single-product .qkh-ar15-actions .btn.secondary {background:#fff;color:#1249a6;border:1px solid #b9ccec}
body.single-product .qkh-ar15-actions .btn.secondary:hover {background:#f1f5fc;border-color:#1249a6}
body.single-product .qkh-ar15-specs {order:5;margin:0;border:1px solid var(--qkh-product-line);border-radius:12px;padding:0 18px;overflow:hidden}
body.single-product .qkh-ar15-specs:before {content:'Thông tin sản phẩm';display:block;padding:15px 0 12px;font-weight:650;font-size:13px;letter-spacing:.02em;border-bottom:1px solid var(--qkh-product-line)}
body.single-product .qkh-ar15-specs>div {grid-template-columns:minmax(105px,.4fr) minmax(0,1fr);gap:18px;padding:12px 0;font-size:14px;line-height:1.65;border-bottom:1px solid #e9eef5}
body.single-product .qkh-ar15-specs>div:last-child {border-bottom:0}
body.single-product .qkh-ar15-specs dt {color:var(--qkh-product-muted);font-weight:500}
body.single-product .qkh-ar15-specs dd {color:var(--qkh-product-ink);overflow-wrap:break-word}
body.single-product .qkh-ar15-note {order:6;font-size:12px;line-height:1.7;margin:14px 0 0;color:var(--qkh-product-muted)}
body.single-product .qkh-product-sections {display:flex;gap:28px;flex-wrap:wrap;padding:19px 0;margin:48px 0 0;border-top:1px solid var(--qkh-product-line);border-bottom:1px solid var(--qkh-product-line)}
body.single-product .qkh-product-sections a {display:inline-flex;align-items:center;min-height:24px;font-size:14px;font-weight:650;color:var(--qkh-product-ink);text-decoration:none}
body.single-product .qkh-product-sections a:first-child {color:var(--qkh-product-blue)}
body.single-product .qkh-product-sections a:hover {color:var(--qkh-product-blue);text-decoration:underline;text-underline-offset:5px}
body.single-product .qkh-ar15-body {max-width:1240px;margin:38px auto 0;font-size:17px;line-height:1.85;color:#2e4056;scroll-margin-top:140px}
body.single-product .qkh-ar15-body h2 {font-size:clamp(22px,2vw,28px);line-height:1.35;letter-spacing:-.02em;color:var(--qkh-product-ink);margin:46px 0 18px}
body.single-product .qkh-ar15-body>h2:first-child {margin-top:0}
body.single-product .qkh-ar15-body p {margin-bottom:20px}
body.single-product .qkh-ar15-body figure {max-width:960px;margin:30px auto 38px}
body.single-product .qkh-ar15-body figure img {border-radius:16px;border:1px solid #e5ecf5}
body.single-product .qkh-ar15-body figcaption {font-size:12px;line-height:1.75;color:var(--qkh-product-muted);margin:12px 2px 0}
body.single-product .qkh-ar15-inquiry {max-width:1240px;background:#f3f7fd;border:1px solid #dbe5f3;border-radius:18px;padding:32px;margin:48px auto 0;scroll-margin-top:130px}
body.single-product .qkh-ar15-inquiry h2 {font-size:25px;line-height:1.35;letter-spacing:-.02em;color:var(--qkh-product-ink);margin:0 0 14px}
body.single-product .qkh-ar15-inquiry>p {font-size:15px;line-height:1.8;color:var(--qkh-product-muted)}
body.single-product .qkh-ar15-inquiry textarea {font-size:14px;line-height:1.7;min-height:170px;border:1px solid #cad7e9;background:#fff;border-radius:10px;margin:8px 0 20px;padding:16px;color:#334b67}
body.single-product .qkh-ar15-inquiry .text-link {font-size:14px}
body.single-product :is(.qkh-ar15-actions .btn,.qkh-ar15-thumbs button,.qkh-product-sections a):focus-visible {outline:3px solid #ed9c38;outline-offset:4px}
/* Existing idea pages share the same typography, panel and spacing system. */
body.single-product .product-detail {max-width:1420px;margin-inline:auto;gap:32px 48px;align-items:start}
body.single-product .product-heading {padding:0;background:none;border:0}
body.single-product .product-heading h1 {font-size:clamp(27px,2.4vw,34px);line-height:1.3;letter-spacing:-.025em;color:var(--qkh-product-ink)}
body.single-product .product-heading .summary {font-size:16px;line-height:1.8;color:#43556a;max-width:820px}
body.single-product .product-detail>figure {margin:0;border:1px solid var(--qkh-product-line);border-radius:18px;padding:16px;background:#f7f9fc}
body.single-product .product-detail>figure img {border-radius:12px}
body.single-product .product-detail>figure figcaption {font-size:12px;line-height:1.7;color:var(--qkh-product-muted);margin-top:12px}
body.single-product .product-configuration {border:1px solid var(--qkh-product-line);border-radius:16px;padding:24px;background:#fff}
body.single-product .product-configuration .option-list li {padding:14px 0;border-bottom:1px solid #e9eef5;font-size:14px;line-height:1.75}
body.single-product .product-configuration .option-list li strong {color:var(--qkh-product-ink)}
body.single-product .product-configuration .btn {border-radius:10px;font-size:14px;line-height:1.5;white-space:normal}
body.single-product .product-detail~.editorial-body {max-width:1240px;font-size:17px;line-height:1.85}
@media(max-width:1023px) {
  body.single-product .qkh-ar15-hero {gap:30px}
  body.single-product .qkh-ar15-gallery {position:static}
  body.single-product .qkh-ar15-summary h1 {font-size:28px}
  body.single-product .qkh-ar15-price {padding:18px}
  body.single-product .qkh-ar15-price strong {font-size:25px}
  body.single-product .qkh-ar15-specs {padding-inline:14px}
  body.single-product .qkh-ar15-specs>div {gap:12px;grid-template-columns:minmax(85px,.4fr) minmax(0,1fr)}
}
@media(max-width:760px) {
  body.single-product .qkh-ar15-path {margin-bottom:16px;font-size:12px}
  body.single-product .qkh-ar15-hero {display:flex;flex-direction:column;gap:0}
  body.single-product .qkh-ar15-summary {display:contents}
  body.single-product .qkh-ar15-gallery {order:3;width:100%;margin:22px 0 4px}
  body.single-product .qkh-ar15-main img {border-radius:16px}
  body.single-product .qkh-ar15-main figcaption {margin-bottom:13px}
  body.single-product .qkh-ar15-thumbs {gap:7px}
  body.single-product .qkh-ar15-thumbs button {padding:2px;border-radius:8px}
  body.single-product .qkh-ar15-summary h1 {font-size:27px;line-height:1.3;margin-bottom:14px}
  body.single-product .qkh-ar15-intro {font-size:15px;line-height:1.8}
  body.single-product .qkh-ar15-price {order:4;width:100%;margin:20px 0 16px;padding:18px 16px}
  body.single-product .qkh-ar15-price strong {font-size:25px;letter-spacing:-.035em}
  body.single-product .qkh-ar15-price p {font-size:12px}
  body.single-product .qkh-ar15-summary>.qkh-ar15-actions {order:5;width:100%;gap:9px;margin-bottom:20px;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)}
  body.single-product .qkh-ar15-actions .btn {width:auto;min-width:0;font-size:13px;padding:12px 10px;min-height:48px}
  body.single-product .qkh-ar15-specs {order:6;width:100%}
  body.single-product .qkh-ar15-note {order:7}
  body.single-product .qkh-ar15-specs>div {grid-template-columns:minmax(95px,.4fr) minmax(0,1fr);font-size:13px;gap:12px;padding-block:11px}
  body.single-product .qkh-product-sections {margin-top:32px;padding:15px 0;gap:16px 24px}
  body.single-product .qkh-product-sections a {font-size:13px;min-height:28px}
  body.single-product .qkh-ar15-body {margin-top:28px;font-size:16px;line-height:1.85;scroll-margin-top:90px}
  body.single-product .qkh-ar15-body h2 {font-size:23px;margin-top:34px}
  body.single-product .qkh-ar15-body figure {margin:24px auto 30px}
  body.single-product .qkh-ar15-body figure img {border-radius:12px}
  body.single-product .qkh-ar15-inquiry {padding:22px 18px;margin-top:32px;scroll-margin-top:90px}
  body.single-product .qkh-ar15-inquiry h2 {font-size:22px}
  body.single-product .qkh-ar15-inquiry>p {font-size:14px}
  body.single-product .qkh-ar15-inquiry .qkh-ar15-actions {display:grid;grid-template-columns:1fr;width:100%}
  body.single-product .qkh-ar15-inquiry textarea {font-size:13px;padding:12px}
  body.single-product .product-detail {gap:24px}
  body.single-product .product-heading h1 {font-size:27px}
  body.single-product .product-configuration {padding:20px}
  body.single-product .product-detail~.editorial-body {font-size:16px}
}
@media(max-width:359px) {
  body.single-product .qkh-ar15-summary h1 {font-size:25px}
  body.single-product .qkh-ar15-price strong {font-size:22px}
  body.single-product .qkh-ar15-specs>div {grid-template-columns:85px minmax(0,1fr);gap:10px}
  body.single-product .qkh-ar15-summary>.qkh-ar15-actions {grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce) {
  body.single-product .qkh-ar15-thumbs button {transition:none}
}

/* Align the product shell to the header and remove stacked top spacing. */
body.single-product .qkh-site-main > .wrap,
body.single-product .qkh-site-main > .section > .wrap {
  width:min(calc(100% - 48px),1420px);
}
body.single-product .qkh-site-main .crumbs {margin:12px 0 8px}
body.single-product .qkh-site-main > .section {padding-top:0}
@media(max-width:760px) {
  body.single-product .qkh-site-main > .wrap,
  body.single-product .qkh-site-main > .section > .wrap {width:calc(100% - 32px)}
  body.single-product .qkh-site-main .crumbs {margin:10px 0 8px}
  body.single-product .qkh-ar15-path {margin-bottom:10px}
}
@media(max-width:359px) {
  body.single-product .qkh-site-main > .wrap,
  body.single-product .qkh-site-main > .section > .wrap {width:calc(100% - 28px)}
}
