/* Matching Crew — lớp hiệu ứng động: màn chào, hero video theo mùa, trang trí mùa, chữ chạy, số đếm, video, hành trình ngang, kết trang.
   Mọi hiệu ứng chỉ chạy khi <html> có .mc-motion (mc-motion.js bật); tắt hiệu ứng → nội dung hiện tĩnh bình thường. */

/* ---------- màn chào ---------- */
.mc-intro { position: fixed; inset: 0; z-index: 99999; display: flex; align-items: center; justify-content: center; overflow: hidden; color: #fff; cursor: pointer; }
.mc-intro[hidden] { display: none; }
html.mc-intro-on, html.mc-intro-on body { overflow: hidden; }
.mc-intro__half { position: absolute; top: 0; bottom: 0; width: 50.5%; background-color: var(--mc-intro-bg, var(--mc-pri)); background-image: linear-gradient(90deg, rgba(255, 255, 255, .05) 50%, transparent 50%), linear-gradient(rgba(255, 255, 255, .05) 50%, transparent 50%); background-size: 36px 36px; transition: transform 1s cubic-bezier(.76, 0, .24, 1); }
.mc-intro__half--l { left: 0; border-right: 2px dashed rgba(255, 255, 255, .25); }
.mc-intro__half--r { right: 0; }
.mc-intro__in { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; text-align: center; padding: 24px; transition: opacity .45s, transform .6s; }
.mc-intro__pols { position: relative; width: 300px; height: 176px; margin-bottom: 34px; }
.mc-intro__pol { position: absolute; top: 0; left: 50%; width: 132px; padding: 7px 7px 26px; background: #fff; border-radius: 4px; box-shadow: 0 14px 30px rgba(0, 0, 0, .35); opacity: 0; animation: mcPolDrop .8s cubic-bezier(.2, .9, .3, 1.15) forwards; }
.mc-intro__pol img { display: block; width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; border-radius: 2px; }
.mc-intro__pol i { position: absolute; left: 0; right: 0; bottom: 5px; font: italic 500 12px/1 var(--mc-disp); color: var(--mc-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding: 0 6px; }
.mc-intro__pol--1 { --r: -12deg; --tx: -150%; animation-delay: .15s; }
.mc-intro__pol--2 { --r: 3deg; --tx: -50%; animation-delay: .35s; z-index: 2; top: -10px; }
.mc-intro__pol--3 { --r: 13deg; --tx: 50%; animation-delay: .55s; }
@keyframes mcPolDrop { 0% { opacity: 0; transform: translate(var(--tx), -120vh) rotate(calc(var(--r) * -3)); } 100% { opacity: 1; transform: translate(var(--tx), 0) rotate(var(--r)); } }
.mc-intro__brand { margin: 0; font: 600 clamp(40px, 8vw, 92px)/1 var(--mc-disp); letter-spacing: -.02em; }
.mc-intro__brand span { display: inline-block; opacity: 0; transform: translateY(60%) rotate(8deg); animation: mcRise .7s cubic-bezier(.2, .8, .2, 1) forwards; animation-delay: calc(.7s + var(--i) * .04s); }
.mc-intro__tag { margin: 14px 0 0; font: italic 500 clamp(18px, 2.4vw, 26px)/1.2 var(--mc-disp); color: #f3b48e; opacity: 0; animation: mcFadeUp .7s 1.35s forwards; }
.mc-intro__emoji { margin: 14px 0 0; font-size: 26px; letter-spacing: .3em; opacity: 0; animation: mcFadeUp .7s 1.6s forwards; }
.mc-intro__skip { position: absolute; z-index: 2; right: 20px; bottom: 20px; padding: 8px 16px; border: 1px solid rgba(255, 255, 255, .4); border-radius: 999px; background: transparent; color: #fff; font-size: 13px; font-weight: 600; cursor: pointer; }
html.mc-intro-open .mc-intro__half--l { transform: translateX(-102%); }
html.mc-intro-open .mc-intro__half--r { transform: translateX(102%); }
html.mc-intro-open .mc-intro__in { opacity: 0; transform: scale(1.08); }
html.mc-intro-open .mc-intro__skip { opacity: 0; }
@keyframes mcRise { to { opacity: 1; transform: none; } }
@keyframes mcFadeUp { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }

/* ---------- hero video theo mùa ---------- */
.mc-shero { position: relative; overflow: hidden; background: var(--mc-ink); color: #fff; isolation: isolate; }
.mc-shero__slide { --mc-acc: var(--mc-clay); position: relative; display: flex; align-items: center; min-height: clamp(560px, calc(100svh - 100px), 920px); }
.mc-shero__slide[hidden] { display: none; }
.mc-shero__bg { position: absolute; inset: 0; z-index: -3; background: #17131a center / cover no-repeat; }
.mc-shero__video { width: 100%; height: 100%; object-fit: cover; display: block; opacity: 0; transition: opacity 1.2s; }
.mc-shero__video.is-playing { opacity: 1; }
html.mc-motion .mc-shero__bg { animation: mcKen 22s ease-in-out infinite alternate; }
@keyframes mcKen { from { transform: scale(1.04); } to { transform: scale(1.14) translate(-1.5%, -1%); } }
.mc-shero__shade { position: absolute; inset: 0; z-index: -2; background: linear-gradient(90deg, rgba(23, 19, 26, .86) 0%, rgba(23, 19, 26, .55) 46%, rgba(23, 19, 26, .12) 100%), linear-gradient(0deg, rgba(23, 19, 26, .7), transparent 40%); }
.mc-shero__fx { position: absolute; inset: 0; z-index: -1; pointer-events: none; overflow: hidden; }
.mc-shero__in { position: relative; padding-top: 64px; padding-bottom: 96px; }
.mc-shero__kicker { display: inline-flex; align-items: center; gap: 10px; margin: 0 0 18px; padding: 7px 14px 7px 10px; border-radius: 999px; background: rgba(255, 255, 255, .1); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .22); backdrop-filter: blur(6px); font-size: 12px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; }
.mc-shero__kicker i { width: 9px; height: 9px; border-radius: 50%; background: var(--mc-acc); box-shadow: 0 0 0 0 var(--mc-acc); animation: mcPulse 1.8s infinite; }
@keyframes mcPulse { 70% { box-shadow: 0 0 0 10px transparent; } 100% { box-shadow: 0 0 0 0 transparent; } }
.mc-shero__title { max-width: 13ch; margin: 0 0 18px; font: 600 clamp(48px, 9vw, 112px)/.98 var(--mc-disp); letter-spacing: -.025em; color: #fff; text-shadow: 0 4px 30px rgba(0, 0, 0, .25); }
.mc-shero__title em { display: block; font-family: var(--mc-disp); font-style: italic; font-weight: 500; color: color-mix(in srgb, var(--mc-acc) 55%, #fff); }
.mc-split-w { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .08em; margin-bottom: -.08em; }
.mc-split-w > span { display: inline-block; }
html.mc-motion .mc-split-w > span { transform: translateY(105%) rotate(4deg); transition: transform .9s cubic-bezier(.2, .8, .2, 1); transition-delay: calc(var(--i) * .07s + .1s); }
html.mc-motion .is-in .mc-split-w > span, html.mc-motion .mc-split-w.is-in > span { transform: none; }
.mc-shero__sub { max-width: 48ch; margin: 0 0 24px; font-size: clamp(16px, 1.5vw, 19px); line-height: 1.55; color: rgba(255, 255, 255, .86); }
.mc-shero__count { display: flex; gap: 10px; margin: 0 0 26px; }
.mc-shero__count[hidden] { display: none; }
.mc-shero__count span { display: grid; justify-items: center; min-width: 74px; padding: 12px 8px 9px; border-radius: 16px; background: rgba(255, 255, 255, .09); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .2); backdrop-filter: blur(8px); }
.mc-shero__count b { font: 600 34px/1 var(--mc-disp); font-variant-numeric: tabular-nums; }
.mc-shero__count b.is-tick { animation: mcTick .35s; }
@keyframes mcTick { 0% { transform: translateY(-30%); opacity: .2; } 100% { transform: none; opacity: 1; } }
.mc-shero__count small { margin-top: 5px; font-size: 10.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; opacity: .75; }
.mc-shero__cta { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px; }
.mc-shero__ghost { color: #fff; font-weight: 700; text-decoration: none; border-bottom: 2px dashed rgba(255, 255, 255, .55); padding-bottom: 3px; }
.mc-shero__ghost:hover { color: #fff; border-color: #fff; }
.mc-shero__note { display: flex; align-items: center; gap: 8px; margin: 20px 0 0; font-size: 14px; color: rgba(255, 255, 255, .8); max-width: 60ch; }
.mc-shero__note svg { width: 18px; height: 18px; flex: none; color: color-mix(in srgb, var(--mc-acc) 60%, #fff); }
.mc-shero__scroll { position: absolute; z-index: 3; left: 50%; bottom: 22px; width: 26px; height: 42px; margin-left: -13px; border: 2px solid rgba(255, 255, 255, .6); border-radius: 14px; }
.mc-shero__scroll span { position: absolute; left: 50%; top: 8px; width: 4px; height: 8px; margin-left: -2px; border-radius: 2px; background: #fff; animation: mcScrollCue 1.6s infinite; }
@keyframes mcScrollCue { 0% { opacity: 0; transform: translateY(-4px); } 40% { opacity: 1; } 100% { opacity: 0; transform: translateY(12px); } }
@media (max-width: 767.98px) { .mc-shero__scroll { display: none; } .mc-shero__in { padding-bottom: 84px; } .mc-shero__count span { min-width: 64px; } .mc-shero__count b { font-size: 26px; } .mc-shero__shade { background: linear-gradient(0deg, rgba(23, 19, 26, .9) 10%, rgba(23, 19, 26, .45) 70%, rgba(23, 19, 26, .3)); } }
html.mc-motion .mc-shero__kicker, html.mc-motion .mc-shero__sub, html.mc-motion .mc-shero__count, html.mc-motion .mc-shero__cta, html.mc-motion .mc-shero__note { opacity: 0; transform: translateY(18px); transition: opacity .8s, transform .8s cubic-bezier(.2, .8, .2, 1); }
html.mc-motion .is-in .mc-shero__kicker { opacity: 1; transform: none; }
html.mc-motion .is-in .mc-shero__sub { opacity: 1; transform: none; transition-delay: .45s; }
html.mc-motion .is-in .mc-shero__count { opacity: 1; transform: none; transition-delay: .6s; }
html.mc-motion .is-in .mc-shero__cta { opacity: 1; transform: none; transition-delay: .75s; }
html.mc-motion .is-in .mc-shero__note { opacity: 1; transform: none; transition-delay: .9s; }

/* trang trí theo mùa */
.mc-fog { position: absolute; left: -20%; right: -20%; height: 46%; bottom: -8%; background: radial-gradient(ellipse at 30% 60%, rgba(220, 210, 230, .35), transparent 60%), radial-gradient(ellipse at 75% 50%, rgba(220, 210, 230, .25), transparent 55%); filter: blur(18px); animation: mcFog 26s linear infinite alternate; }
.mc-fog--2 { bottom: 10%; opacity: .6; animation-duration: 34s; animation-direction: alternate-reverse; }
@keyframes mcFog { from { transform: translateX(-8%); } to { transform: translateX(8%); } }
.mc-lantern { position: absolute; right: 7%; bottom: 9%; width: clamp(110px, 15vw, 210px); filter: drop-shadow(0 0 40px rgba(255, 140, 30, .55)); animation: mcBob 5s ease-in-out infinite; }
.mc-lantern__face { animation: mcFlicker 2.4s infinite; }
@keyframes mcFlicker { 0%, 100% { opacity: 1; } 45% { opacity: .75; } 50% { opacity: .95; } 55% { opacity: .65; } }
@keyframes mcBob { 0%, 100% { transform: translateY(0) rotate(-2deg); } 50% { transform: translateY(-10px) rotate(2deg); } }
.mc-lights { position: absolute; left: 0; top: -6px; width: 100%; height: 70px; }
.mc-lights circle { filter: drop-shadow(0 0 8px var(--c)); animation: mcTwinkle 2.4s infinite; animation-delay: calc(var(--d) * .45s); }
@keyframes mcTwinkle { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
.mc-shero__year { position: absolute; right: 4%; bottom: 6%; font: 600 clamp(110px, 22vw, 340px)/.8 var(--mc-disp); color: transparent; -webkit-text-stroke: 2px rgba(255, 220, 150, .55); letter-spacing: -.04em; animation: mcGlow 3s ease-in-out infinite alternate; }
@keyframes mcGlow { from { text-shadow: 0 0 0 transparent; } to { text-shadow: 0 0 40px rgba(255, 210, 120, .45); } }
.mc-star { position: absolute; left: var(--x); top: var(--y); font-style: normal; color: #ffe7a8; font-size: 16px; animation: mcTwinkle 2.6s infinite; animation-delay: var(--d); }

/* ---------- chữ chạy ---------- */
.mc-marq { overflow: hidden; background: var(--mc-pri); color: #fff; padding: 18px 0; border-top: 2px dashed rgba(255, 255, 255, .18); border-bottom: 2px dashed rgba(255, 255, 255, .18); }
.mc-marq__track { display: flex; width: max-content; transform: skewX(var(--mc-skew, 0deg)); transition: transform .3s; }
.mc-marq__row { display: flex; flex: none; animation: mcMarq var(--mc-marq-t, 32s) linear infinite; }
.mc-marq__row span { display: inline-flex; align-items: center; gap: 28px; padding-right: 28px; font: italic 500 clamp(26px, 4vw, 48px)/1.1 var(--mc-disp); white-space: nowrap; }
.mc-marq__row span:nth-child(even) { font-style: normal; font-weight: 600; color: transparent; -webkit-text-stroke: 1.2px rgba(255, 255, 255, .85); }
.mc-marq__row b { font-size: .55em; color: #f3b48e; -webkit-text-stroke: 0; }
@keyframes mcMarq { to { transform: translateX(-100%); } }
html:not(.mc-motion) .mc-marq__row { animation-duration: calc(var(--mc-marq-t, 32s) * 2); }

/* ---------- số đếm ---------- */
.mc-stats { background: var(--mc-white); border-bottom: 1px solid var(--mc-line); }
.mc-stats__in { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px 16px; padding-top: 40px; padding-bottom: 40px; }
@media (min-width: 990px) { .mc-stats__in { grid-template-columns: repeat(4, minmax(0, 1fr)); padding-top: 56px; padding-bottom: 56px; } }
.mc-stat { text-align: center; }
.mc-stat__num { font: 600 clamp(44px, 6vw, 76px)/1 var(--mc-disp); color: var(--mc-pri); letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.mc-stat__num small { font-size: .5em; color: var(--mc-clay); margin-left: 2px; }
.mc-stat p { margin: 8px 0 0; font-size: 13px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--mc-muted); }

/* ---------- dải video ---------- */
.mc-band { position: relative; display: flex; align-items: center; min-height: clamp(440px, 76vh, 760px); overflow: hidden; background: #17131a center / cover no-repeat; color: #fff; isolation: isolate; }
.mc-band__video { position: absolute; inset: -8% 0; width: 100%; height: 116%; object-fit: cover; z-index: -3; transform: translateY(var(--mc-par, 0)); }
.mc-band__shade { position: absolute; inset: 0; z-index: -2; background: linear-gradient(180deg, rgba(23, 19, 26, .35), rgba(23, 19, 26, .72)); }
.mc-band__spot { position: absolute; inset: 0; z-index: -1; background: radial-gradient(420px circle at var(--mx, 50%) var(--my, 50%), rgba(255, 210, 160, .22), transparent 70%); opacity: 0; transition: opacity .4s; }
.mc-band:hover .mc-band__spot { opacity: 1; }
.mc-band__in { text-align: center; padding-top: 72px; padding-bottom: 72px; }
.mc-band .mc-eyebrow { color: #f3b48e; }
.mc-band__quote { max-width: 22ch; margin: 0 auto 30px; font: 500 clamp(32px, 5.4vw, 70px)/1.08 var(--mc-disp); letter-spacing: -.02em; color: #fff; }
.mc-word { display: inline-block; white-space: pre; }
html.mc-motion .mc-word { opacity: .12; transition: opacity .5s, filter .5s; filter: blur(3px); }
html.mc-motion .mc-word.is-lit { opacity: 1; filter: none; }
.mc-pp { position: absolute; z-index: 3; right: 16px; bottom: 16px; width: 42px; height: 42px; border: 0; border-radius: 50%; background: rgba(23, 19, 26, .55); backdrop-filter: blur(6px); cursor: pointer; }
.mc-pp::before, .mc-pp::after { content: ""; position: absolute; top: 14px; width: 4px; height: 14px; border-radius: 2px; background: #fff; }
.mc-pp::before { left: 15px; } .mc-pp::after { right: 15px; }
.mc-pp[aria-pressed="true"]::before { left: 17px; width: 0; height: 0; border-radius: 0; background: none; border-left: 12px solid #fff; border-top: 7px solid transparent; border-bottom: 7px solid transparent; }
.mc-pp[aria-pressed="true"]::after { display: none; }

/* ---------- video chia đôi ---------- */
.mc-vsplit__in { display: grid; gap: 30px; align-items: center; }
@media (min-width: 990px) { .mc-vsplit__in { grid-template-columns: 1fr 1fr; gap: 72px; } .mc-vsplit--rev .mc-vsplit__frame { order: 2; } }
.mc-vsplit__frame { position: relative; aspect-ratio: 4 / 3; border-radius: 26px; overflow: hidden; background: var(--mc-sand); box-shadow: var(--mc-shadow); transform-style: preserve-3d; transition: transform .25s ease-out; }
.mc-vsplit__frame video, .mc-vsplit__frame img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mc-vsplit__frame::after { content: ""; position: absolute; inset: 10px; border: 1.5px dashed rgba(255, 255, 255, .7); border-radius: 18px; pointer-events: none; }
.mc-vsplit__pin { position: absolute; left: 18px; top: 18px; z-index: 2; padding: 7px 14px; border-radius: 999px; background: #fff; color: var(--mc-ink); font-size: 13px; font-weight: 700; box-shadow: var(--mc-shadow); }
.mc-vsplit__links { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.mc-vsplit__links a { display: inline-flex; align-items: center; gap: 8px; padding: 10px 18px; border-radius: 999px; background: #fff; box-shadow: inset 0 0 0 1px var(--mc-line); color: var(--mc-ink); font-weight: 700; font-size: 14px; text-decoration: none; transition: background .2s, color .2s; }
.mc-vsplit__links a svg { width: 16px; height: 16px; transition: transform .2s; }
.mc-vsplit__links a:hover { background: var(--mc-pri); color: #fff; }
.mc-vsplit__links a:hover svg { transform: translateX(3px); }

/* ---------- hành trình: lưới thẻ tĩnh ---------- */
.mc-journey { background: var(--mc-sand); }
.mc-journey__head { margin-bottom: 26px; }
.mc-journey__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
@media (min-width: 990px) { .mc-journey__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; } }
.mc-journey__panel { position: relative; padding: 10px 10px 16px; border-radius: 20px; background: #fff; box-shadow: var(--mc-shadow); transition: transform .4s cubic-bezier(.2, .8, .2, 1.2), box-shadow .3s; }
.mc-journey__no { position: absolute; z-index: 2; right: 18px; top: 16px; font: italic 600 clamp(30px, 3.4vw, 46px)/1 var(--mc-disp); color: #fff; text-shadow: 0 4px 18px rgba(0, 0, 0, .35); }
.mc-journey__img { display: block; aspect-ratio: 4 / 5; border-radius: 14px; overflow: hidden; background: var(--mc-sand-2); margin-bottom: 14px; }
.mc-journey__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s; }
.mc-journey__panel:hover .mc-journey__img img { transform: scale(1.05); }
.mc-journey__panel h3 { margin: 0 4px 6px; font: 600 clamp(18px, 1.8vw, 22px)/1.15 var(--mc-disp); }
.mc-journey__panel p { margin: 0 4px 12px; color: var(--mc-body); font-size: 14px; }
.mc-journey__panel .mc-more { margin-left: 4px; font-size: 13px; white-space: normal; }
@media (max-width: 600px) { .mc-journey__panel p { display: none; } }
@media (min-width: 990px) {
  .mc-journey__panel:nth-child(4n+1) { --rot: -1.4deg; }
  .mc-journey__panel:nth-child(4n+2) { --rot: 1.1deg; margin-top: 34px; }
  .mc-journey__panel:nth-child(4n+3) { --rot: -.8deg; }
  .mc-journey__panel:nth-child(4n+4) { --rot: 1.5deg; margin-top: 34px; }
  .mc-journey__panel { transform: rotate(var(--rot, 0deg)); }
  html.mc-motion .mc-journey__panel.mc-rv.is-in { transform: rotate(var(--rot, 0deg)); }
  .mc-journey__panel:hover, html.mc-motion .mc-journey__panel.mc-rv.is-in:hover { transform: rotate(0) translateY(-6px); box-shadow: 0 22px 40px rgba(42, 32, 48, .18); }
}

/* ---------- kết trang ---------- */
.mc-outro { position: relative; overflow: hidden; background: var(--mc-ink); color: #e9dde6; text-align: center; }
.mc-outro__in { padding-top: 90px; padding-bottom: 90px; }
.mc-outro .mc-eyebrow { color: #f3b48e; }
.mc-outro__big { margin: 0 0 18px; font: italic 500 clamp(52px, 12vw, 210px)/.9 var(--mc-disp); letter-spacing: -.035em; color: #fff; white-space: nowrap; transform: scale(calc(.82 + var(--mc-op, 1) * .18)); opacity: calc(.25 + var(--mc-op, 1) * .75); }
@media (max-width: 767.98px) { .mc-outro__big { white-space: normal; } }
.mc-outro__text { max-width: 52ch; margin: 0 auto 28px; font-size: 17px; }

/* ---------- xuất hiện khi cuộn ---------- */
html.mc-motion .mc-rv { opacity: 0; transform: translateY(34px); transition: opacity .9s cubic-bezier(.2, .7, .2, 1), transform .9s cubic-bezier(.2, .7, .2, 1); transition-delay: var(--rd, 0s); }
html.mc-motion .mc-rv--scale { transform: scale(.9) translateY(20px); }
html.mc-motion .mc-rv--tilt { transform: translateY(46px) rotate(var(--rt, 3deg)); }
html.mc-motion .mc-rv--left { transform: translateX(-40px); }
html.mc-motion .mc-rv--right { transform: translateX(40px); }
html.mc-motion .mc-rv--pop { transform: scale(.6); }
html.mc-motion .mc-rv.is-in { opacity: 1; transform: none; }
html.mc-motion .mc-card .mc-card__media { transform: perspective(800px) rotateX(var(--tx, 0deg)) rotateY(var(--ty, 0deg)); transition: transform .3s ease-out, box-shadow .3s; }
html.mc-motion .mc-card .mc-card__media::before { content: ""; position: absolute; inset: 0; z-index: 2; background: radial-gradient(circle at var(--gx, 50%) var(--gy, 0%), rgba(255, 255, 255, .35), transparent 55%); opacity: 0; transition: opacity .3s; pointer-events: none; }
html.mc-motion .mc-card.is-tilt .mc-card__media { box-shadow: 0 18px 34px rgba(42, 32, 48, .18); }
html.mc-motion .mc-card.is-tilt .mc-card__media::before { opacity: 1; }
html.mc-motion .mc-pol { transition: transform .5s cubic-bezier(.2, .8, .2, 1.2), box-shadow .35s; }

/* ---------- toàn trang ---------- */
.mc-progress { position: fixed; left: 0; top: 0; z-index: 1032; height: 3px; width: 100%; background: var(--mc-clay); transform-origin: 0 50%; transform: scaleX(var(--mc-sp, 0)); pointer-events: none; }
html.mc-motion .mc-header { transition: transform .35s cubic-bezier(.2, .7, .2, 1), border-color .2s, box-shadow .2s; }
html.mc-motion .mc-header.is-hidden { transform: translateY(-110%); }
/* header ẩn khi cuộn xuống → các thanh/khối dính theo header kéo lên sát đỉnh, không để khe hở */
html.mc-motion .mc-toolbar, html.mc-motion .mc-gal, html.mc-motion .mc-faq__head { transition: top .35s cubic-bezier(.2, .7, .2, 1); }
html.mc-head-off .mc-toolbar { top: 0; }
@media (min-width: 990px) { html.mc-head-off .mc-gal { top: 16px; } html.mc-head-off .mc-faq__head { top: 24px; } }
@media (prefers-reduced-motion: reduce) { html.mc-motion .mc-shero__bg { animation: none; } }

/* ---------- điện thoại ---------- */
@media (max-width: 600px) {
  .mc-intro__pols { transform: scale(.72); margin-bottom: 6px; }
  .mc-tile__cap { padding: 14px; }
  .mc-tile__cap b { font-size: 18px; }
  .mc-tile__cap small { font-size: 12px; }
}