/* DigiBot CMS — khối bài viết. Theme ghi đè biến --cms-* (màu, font, bo góc). */
.cms-blocks {
  --cms-accent: #f26b1d; --cms-accent-ink: #fff; --cms-text: inherit; --cms-muted: #6b6259;
  --cms-line: rgba(0, 0, 0, .1); --cms-bg-soft: rgba(0, 0, 0, .035); --cms-radius: 16px;
  --cms-font-heading: inherit; --cms-gap: 1.4em; --cms-wide: 1100px;
  color: var(--cms-text); line-height: 1.7; font-size: 1rem;
}
.cms-blocks > .cms-b, .cms-col > .cms-b { margin: 0 0 var(--cms-gap); }
.cms-blocks img, .cms-blocks video { max-width: 100%; height: auto; display: block; }
.cms-b p { margin: 0 0 .8em; } .cms-b p:last-child { margin-bottom: 0; }
.cms-b a { color: var(--cms-accent); }
.cms-b-heading h2, .cms-b-heading h3 { font-family: var(--cms-font-heading); line-height: 1.2; margin: 1.6em 0 .2em; }
.cms-b-heading h2 { font-size: 1.75em; } .cms-b-heading h3 { font-size: 1.3em; }
.cms-b-list ul, .cms-b-list ol { padding-left: 1.3em; margin: 0; } .cms-b-list li { margin: .25em 0; }
.cms-b-quote blockquote { margin: 0; padding: 1em 1.2em; border-left: 4px solid var(--cms-accent); background: var(--cms-bg-soft); border-radius: 0 var(--cms-radius) var(--cms-radius) 0; font-size: 1.08em; }
.cms-b-quote cite { display: block; margin-top: .5em; color: var(--cms-muted); font-style: normal; font-size: .9em; }
.cms-table-wrap { overflow-x: auto; border: 1px solid var(--cms-line); border-radius: var(--cms-radius); }
.cms-b-table table { width: 100%; border-collapse: collapse; font-size: .95em; }
.cms-b-table th, .cms-b-table td { padding: .65em .9em; border-bottom: 1px solid var(--cms-line); text-align: left; vertical-align: top; }
.cms-b-table thead th { background: var(--cms-bg-soft); font-weight: 700; }
.cms-b-table tr:last-child td { border-bottom: 0; }
.cms-b figure { margin: 0; }
.cms-b figure img, .cms-b figure video, .cms-embed { border-radius: var(--cms-radius); width: 100%; }
.cms-b figcaption { margin-top: .5em; color: var(--cms-muted); font-size: .88em; text-align: center; }
.cms-size-wide { width: min(var(--cms-wide), 100vw - 32px); margin-left: 50% !important; transform: translateX(-50%); }
.cms-size-full { width: 100vw; margin-left: 50% !important; transform: translateX(-50%); }
.cms-size-full img { border-radius: 0 !important; }
.cms-gallery { display: grid; gap: .6em; grid-template-columns: repeat(var(--cms-cols, 3), minmax(0, 1fr)); }
.cms-cols-2 { --cms-cols: 2; } .cms-cols-3 { --cms-cols: 3; } .cms-cols-4 { --cms-cols: 4; }
.cms-gallery img { aspect-ratio: 1; object-fit: cover; width: 100%; border-radius: calc(var(--cms-radius) * .6) !important; }
.cms-embed { position: relative; aspect-ratio: 16 / 9; overflow: hidden; background: #000; }
.cms-embed-vertical { aspect-ratio: 9 / 16; max-width: 360px; margin: 0 auto; }
.cms-embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.cms-b-video video { background: #000; }
.cms-columns { display: grid; gap: 1.5em; grid-template-columns: 1fr 1fr; align-items: start; }
.cms-ratio-2-1 { grid-template-columns: 2fr 1fr; } .cms-ratio-1-2 { grid-template-columns: 1fr 2fr; }
.cms-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 46px; padding: .6em 1.5em; border-radius: 999px; font-weight: 700; text-decoration: none; border: 2px solid var(--cms-accent); }
.cms-btn-primary { background: var(--cms-accent); color: var(--cms-accent-ink) !important; }
.cms-btn-outline { background: transparent; color: var(--cms-accent) !important; }
.cms-b-cta { text-align: center; } .cms-cta-note { margin-top: .5em !important; color: var(--cms-muted); font-size: .9em; }
.cms-product { display: grid; grid-template-columns: 180px 1fr; gap: 1.2em; align-items: center; padding: 1em; border: 1px solid var(--cms-line); border-radius: var(--cms-radius); background: var(--cms-bg-soft); }
.cms-product-media img { width: 100%; aspect-ratio: 1; object-fit: contain; }
.cms-product-name { margin: 0 0 .3em; font-family: var(--cms-font-heading); font-size: 1.2em; }
.cms-product-summary { color: var(--cms-muted); }
.cms-product-price { margin: .5em 0 .8em !important; } .cms-product-price del { color: var(--cms-muted); }
.cms-product-price strong { color: var(--cms-accent); font-size: 1.3em; }
.cms-product-out { color: #b42318; font-weight: 700; font-size: .85em; }
.cms-timeline-list, .cms-steps-list { list-style: none; margin: 0; padding: 0; }
.cms-timeline-list { position: relative; padding-left: 1.6em; border-left: 3px solid var(--cms-line); }
.cms-timeline-list > li { position: relative; margin: 0 0 1.4em; }
.cms-timeline-list > li::before { content: ""; position: absolute; left: calc(-1.6em - 9px); top: .35em; width: 15px; height: 15px; border-radius: 50%; background: var(--cms-accent); box-shadow: 0 0 0 4px #fff; }
.cms-item-label { display: inline-block; margin-bottom: .2em; color: var(--cms-accent); font-weight: 800; font-family: var(--cms-font-heading); font-size: 1.15em; }
.cms-item-body h3 { margin: 0 0 .2em; font-size: 1.1em; }
.cms-item-body img { margin-top: .6em; border-radius: calc(var(--cms-radius) * .7); }
.cms-steps-list { counter-reset: cms-step; display: grid; gap: 1em; }
.cms-steps-list > li { counter-increment: cms-step; display: grid; grid-template-columns: 2.4em 1fr; gap: .9em; padding: 1em; border: 1px solid var(--cms-line); border-radius: var(--cms-radius); }
.cms-steps-list > li::before { content: counter(cms-step); display: grid; place-items: center; width: 2.4em; height: 2.4em; border-radius: 50%; background: var(--cms-accent); color: var(--cms-accent-ink); font-weight: 800; }
.cms-b-divider hr { border: 0; border-top: 1px solid var(--cms-line); margin: 2em 0; }
/* Template */
.cms-tpl-story > .cms-b-paragraph:first-of-type p:first-child { font-size: 1.18em; }
.cms-tpl-story .cms-b-quote blockquote { border: 0; background: none; text-align: center; font-size: 1.35em; font-family: var(--cms-font-heading); }
.cms-tpl-vlog > .cms-b-video:first-child { margin-bottom: 2em; }
.cms-tpl-landing .cms-b-heading { text-align: center; }
.cms-tpl-landing .cms-b-heading h2 { font-size: 2.1em; }
@media (max-width: 720px) {
  .cms-columns, .cms-ratio-2-1, .cms-ratio-1-2 { grid-template-columns: 1fr; }
  .cms-cols-3, .cms-cols-4 { --cms-cols: 2; }
  .cms-product { grid-template-columns: 1fr; }
  .cms-size-wide { width: 100%; margin-left: 0 !important; transform: none; }
}