/* ---- p_26_pf-about.css ---- */
/* =====================================================================
   ABOUT ME (.sk-ab) - bìa tạp chí / hồ sơ nhân vật
   Hình khối: bố cục lệch, ảnh cắt góc (dog-ear), số trang 02/08, đường kẻ mảnh như báo in, một khối nền giấy #f5f4f1.
   Hệ màu: cam #ff6a13 / đen / trắng (+ xám, giấy). Một font Be Vietnam Pro; Anton chỉ cho chữ KET và 3 tên bìa.
   Mobile trước; mở rộng ở 700px và 1025px.
   ===================================================================== */
.sk-ab{--r:10px;--bw:1px;--hfw:800;--hls:-.04em;--bg:#0a0a0c;--bg2:#101013;--card:#15151a;--ln:rgba(255,255,255,.15);--mut:#a9a9b3;--dim:#4d4d57}
.sk-ab .s-lt{--dim:#cdccc7}
.sk-ab h3{margin:0}
.ab-vh{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* số trang + đường kẻ đầu mục */
.ab-head{max-width:none}
.ab-head .s-h{max-width:19ch;text-wrap:balance}
.sk-ab .ab-pg{display:flex;align-items:center;gap:8px;margin:0 0 clamp(14px,2.4vw,24px);font:700 12px/1 var(--fb);letter-spacing:.16em;text-transform:uppercase;color:var(--mut)}
.ab-pg b{color:var(--ac);font-size:15px;letter-spacing:.04em}
.ab-pg i{font-style:normal;opacity:.6;margin-right:6px}
.ab-pg::after{content:"";flex:1;height:1px;background:var(--ln);margin-left:6px;transform-origin:0 50%;transition:transform 1.3s cubic-bezier(.16,1,.3,1) .2s}
.kx-js .ab-head[data-r]:not(.kx-in) .ab-pg::after{transform:scaleX(0)}

/* =====================  01 · HERO  ===================== */
.ab-hero{background:#0a0a0c;padding-top:clamp(100px,9vw,126px);padding-bottom:0}
.ab-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(60% 42% at 82% 26%,rgba(255,106,19,.24),transparent 70%),radial-gradient(44% 30% at 0 96%,rgba(255,106,19,.12),transparent 70%)}
.ab-hg{position:relative;display:grid;grid-template-columns:minmax(0,.72fr) minmax(0,1.6fr);column-gap:14px;align-items:end;
  grid-template-areas:"mast mast" "kick fig" "ttl ttl" "sub sub" "btn btn" "tel tel"}
.ab-hg>*{min-width:0}
.ab-mast{grid-area:mast}.ab-side{grid-area:side}.ab-fig{grid-area:fig}.ab-title{grid-area:ttl}.ab-kick{grid-area:kick}.ab-sub{grid-area:sub}.ab-btns{grid-area:btn}.ab-tel{grid-area:tel}

/* chữ KET viền chạy phía sau */
.ab-name{position:absolute;inset:0;z-index:0;pointer-events:none}
.ab-nr{position:absolute;left:0;top:6%;display:flex;gap:.3em;width:max-content;font-size:clamp(170px,56vw,420px);line-height:.86;color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.2);transform:translate3d(-8%,0,0);will-change:transform}
.ab-nr i{font-style:normal}
.ab-nr2{display:none;top:50%;transform:translate3d(-52%,0,0);-webkit-text-stroke-color:rgba(255,106,19,.38)}

.sk-ab .ab-mast{position:relative;z-index:3;display:flex;justify-content:space-between;gap:12px;margin:0 0 16px;padding:10px 0;border-block:1px solid var(--ln);font:700 12px/1 var(--fb);letter-spacing:.14em;text-transform:uppercase;color:var(--mut)}
.ab-mast b{color:var(--ac)}

/* cột "Trong số này" */
.ab-side{position:relative;z-index:3;align-self:stretch;display:none;flex-direction:column}
.sk-ab .ab-sl{margin:0 0 6px;font:700 12px/1.2 var(--fb);letter-spacing:.16em;text-transform:uppercase;color:var(--mut)}
.ab-side a{display:flex;align-items:center;gap:8px;min-height:44px;padding:4px 0;border-top:1px solid var(--ln);font:600 14px/1.2 var(--fb);color:var(--ink);transition:color .25s}
.ab-side a i{flex:none;min-width:20px;font-style:normal;font-size:12px;font-weight:700;color:var(--ac)}
.ab-tel{position:relative;z-index:3;display:flex;align-items:center;gap:12px;min-height:48px;margin-top:4px;border-bottom:1px solid var(--ln)}
.ab-tel small{font:600 13px/1.2 var(--fb);color:var(--mut)}
.ab-tel b{font:800 19px/1.1 var(--fb);color:var(--ac);letter-spacing:.01em}

/* chân dung 4:5 cắt góc + vòng cam nghiêng + tem */
.ab-fig{position:relative;z-index:2;margin:0;transform:translate3d(0,var(--py,0px),0)}
.ab-ph{position:relative}
.ab-ph .th{width:100%;aspect-ratio:4/5;clip-path:polygon(0 0,calc(100% - 38px) 0,100% 38px,100% 100%,0 100%)}
.ab-fold{position:absolute;top:0;right:0;width:38px;height:38px;background:linear-gradient(135deg,#ffc59a,var(--ac) 62%);clip-path:polygon(0 0,100% 100%,0 100%)}
.ab-ring{position:absolute;left:50%;top:50%;width:132%;height:auto;aspect-ratio:1;transform:translate(-50%,-50%) rotate(var(--rt,0deg));pointer-events:none;overflow:visible;fill:none;stroke:var(--ac);stroke-width:4.5;stroke-linecap:round}
.ab-rb{z-index:-1}.ab-rf{z-index:3}
.ab-badge{position:absolute;z-index:4;left:-52px;bottom:27%;width:clamp(86px,25vw,128px);height:auto;overflow:visible;transform:rotate(12deg)}
.ab-badge circle{fill:var(--ac)}
.ab-badge text{font:800 11.6px var(--fb);fill:#0a0a0c;letter-spacing:.05em}
.ab-badge .ab-b10{font-size:31px;letter-spacing:-.04em}
.ab-badge .ab-b11{font-size:10px;letter-spacing:.22em}
.ab-bt{transform-box:fill-box;transform-origin:50% 50%}
.ab-cap{position:absolute;z-index:4;left:10px;top:10px;margin:0;display:flex;align-items:center;gap:8px;font:600 12px/1.2 var(--fb);color:var(--mut)}
.ab-cap b{padding:6px 8px;border:1px solid rgba(255,255,255,.28);border-radius:4px;background:rgba(10,10,12,.78);color:#fff;letter-spacing:.1em;text-transform:uppercase}
.ab-cap span{display:none}

/* tiêu đề + mô tả + nút */
.sk-ab .ab-title{position:relative;z-index:6;margin:-56px 0 0;font-size:clamp(78px,25vw,150px);line-height:.84;letter-spacing:-.05em;text-transform:none}
.ab-title em{font-style:normal;color:var(--ac)}
.sk-ab .ab-kick{position:relative;align-self:stretch;margin:0;font:700 12px/1.25 var(--fb);letter-spacing:.2em;text-transform:uppercase;color:var(--ac)}
.ab-kick span{position:absolute;inset:0 auto 66px 0;writing-mode:vertical-rl;transform:rotate(180deg)}
.sk-ab .ab-sub{margin-top:12px;font-size:16px;line-height:1.55;color:#d6d6dc}
.ab-btns{margin-top:18px;position:relative;z-index:3}
.ab-btns .btn{min-height:48px}

/* dải tape chạy nghề */
.ab-tapes{position:relative;height:clamp(78px,16vw,124px);margin-top:clamp(22px,4vw,44px)}
.ab-tape{position:absolute;left:-4%;right:-4%;overflow:hidden;white-space:nowrap}
.ab-ta{top:clamp(8px,1.6vw,16px);z-index:2;background:var(--ac);color:#0a0a0c;transform:rotate(-1.7deg)}
.ab-tb{display:none;top:clamp(26px,4.6vw,44px);z-index:1;background:#0a0a0c;border-block:1px solid var(--ln);transform:rotate(1.3deg)}
.ab-tt{display:inline-flex;width:max-content}
.ab-tt span{display:inline-flex;align-items:center;gap:clamp(16px,3vw,34px);padding:clamp(10px,1.6vw,16px) 0 clamp(10px,1.6vw,16px) clamp(16px,3vw,34px);font:800 clamp(18px,4.6vw,34px)/1 var(--fb);letter-spacing:.04em;text-transform:uppercase}
.ab-tt span::after{content:"✦";font-size:.6em}
.ab-tb .ab-tt span{color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.7)}
.ab-tb .ab-tt span::after{-webkit-text-stroke:0;color:var(--ac)}

@media(min-width:700px){
  .ab-nr2,.ab-tb{display:flex}
  .ab-tb{display:block}
  .ab-hg{grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);column-gap:clamp(24px,4vw,64px);align-items:start;
    grid-template-areas:"mast mast" "ttl fig" "kick fig" "sub fig" "btn fig" "tel fig" "side fig";grid-template-rows:auto auto auto auto auto auto 1fr}
  .sk-ab .ab-title{margin:clamp(14px,2vw,28px) 0 0;font-size:clamp(96px,13.2vw,212px)}
  .sk-ab .ab-kick{position:static;align-self:auto;margin:18px 0 0}
  .ab-kick span{position:static;writing-mode:horizontal-tb;transform:none}
  .sk-ab .ab-sub{margin-top:18px;max-width:40ch;font-size:clamp(16px,1.7vw,19px)}
  .ab-side{align-self:end;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 22px;margin-top:clamp(22px,3vw,40px)}
  .ab-sl{grid-column:1/-1}
  .ab-tel{margin-top:6px;border-bottom:0}
  .ab-nr{-webkit-text-stroke-width:2px}
  .ab-cap{position:static;margin-top:14px}
  .ab-cap span{display:inline}
  .ab-fold{width:52px;height:52px}
  .ab-ph .th{clip-path:polygon(0 0,calc(100% - 52px) 0,100% 52px,100% 100%,0 100%)}
}
@media(min-width:1025px){
  .ab-nr{font-size:clamp(280px,29vw,420px);-webkit-text-stroke-color:rgba(255,255,255,.14)}
  .ab-nr:not(.ab-nr2){top:2%}
  .ab-badge{left:-64px;bottom:22%}
}

/* chuyển động hero: tên trượt vào, chân dung mở màn, vòng cam vẽ ra, tem xoay, tape chạy */
@media(prefers-reduced-motion:no-preference){
  .kx-js .ab-ph::after{content:"";position:absolute;inset:0;z-index:2;background:var(--ac);transform-origin:50% 0;animation:abCur 1.15s cubic-bezier(.7,0,.2,1) .35s both}
  .kx-js .ab-ph .th{animation:abZoom 1.8s cubic-bezier(.16,1,.3,1) .35s both}
  .kx-js .ab-ring path{stroke-dasharray:100;stroke-dashoffset:100;animation:abDraw 1.7s cubic-bezier(.5,0,.1,1) .75s forwards}
  .kx-js .ab-badge{animation:abPop .9s cubic-bezier(.34,1.56,.64,1) 1.1s backwards}
  .ab-bt{animation:abSpin 26s linear infinite}
  .kx-js .ab-nr{animation:abNm 1.6s cubic-bezier(.16,1,.3,1) .1s backwards}
  .ab-tt{animation:abTape 34s linear infinite}
  .ab-tb .ab-tt{animation-direction:reverse;animation-duration:42s}
}
@keyframes abCur{to{transform:scaleY(0)}}
@keyframes abZoom{from{transform:scale(1.18)}}
@keyframes abDraw{to{stroke-dashoffset:0}}
@keyframes abPop{from{opacity:0;transform:rotate(-70deg) scale(.3)}}
@keyframes abSpin{to{transform:rotate(360deg)}}
@keyframes abNm{from{opacity:0}}
@keyframes abTape{to{transform:translate3d(-50%,0,0)}}

/* =====================  02 · TUYÊN NGÔN  ===================== */
.ab-man-sec{padding-block:clamp(44px,8vw,104px)}
.ab-man{position:relative;padding-left:20px;max-width:1120px}
.ab-mbar{position:absolute;left:0;top:6px;bottom:6px;width:3px;border-radius:3px;background:var(--ln);overflow:hidden}
.ab-mbar::after{content:"";position:absolute;inset:0;background:var(--ac);transform-origin:50% 0;transform:scaleY(var(--q,1));transition:transform .3s linear}
.ab-mh{margin:0 0 clamp(20px,3vw,34px);font-size:clamp(38px,10.4vw,112px);line-height:1.06;letter-spacing:-.05em;font-weight:800}
.ab-w{color:var(--dim);transition:color .45s}
.ab-w.is-on{color:var(--ink)}
.ab-w.ab-k.is-on{color:var(--ac)}
.ab-mp{max-width:46ch;font-size:clamp(17px,1.9vw,24px);line-height:1.62;letter-spacing:-.012em;font-weight:500}
@media(min-width:1025px){
  .ab-man{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:0 clamp(32px,5vw,80px);align-items:end}
  .ab-mbar{top:10px;bottom:10px}
  .ab-mh{font-size:clamp(70px,calc(43.5px + 3.37vw),92px)}
  .ab-mh,.ab-mp{margin:0}
  .ab-mp{padding-bottom:10px}
}

/* =====================  03 · CON SỐ (giấy)  ===================== */
.ab-num-sec{padding-block:clamp(48px,8vw,108px)}
.ab-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 14px}
.ab-st{position:relative;padding:20px 0 26px;min-width:0}
.ab-st::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:var(--ink);transform-origin:0 50%;transition:transform 1.3s cubic-bezier(.16,1,.3,1) calc(var(--i)*.14s + .25s)}
.ab-st::after{content:"";position:absolute;left:0;top:0;width:44px;height:6px;background:var(--ac);transform-origin:0 50%;transition:transform .9s cubic-bezier(.16,1,.3,1) calc(var(--i)*.14s + .7s)}
.kx-js .ab-st[data-r]:not(.kx-in)::before,.kx-js .ab-st[data-r]:not(.kx-in)::after{transform:scaleX(0)}
.ab-n{display:flex;align-items:flex-start;margin:0;font-weight:800;font-size:clamp(50px,13.4vw,150px);line-height:1;letter-spacing:-.06em;font-variant-numeric:tabular-nums}
.ab-n u{text-decoration:none;color:var(--ac);font-size:.62em;line-height:1.1;margin-left:.04em;letter-spacing:0}
.ab-lb{display:block;margin-top:12px;font:700 15px/1.3 var(--fb)}
.ab-nt{display:block;margin-top:4px;font:400 15px/1.45 var(--fb);color:var(--mut)}
@media(min-width:1025px){
  .ab-stats{grid-template-columns:repeat(4,minmax(0,1fr));gap:0 clamp(18px,2.4vw,36px)}
  .ab-st{padding-top:26px}
  .ab-n{font-size:clamp(64px,8.2vw,116px)}
}

/* =====================  04 · MỘT NGÀY ĐIỀU PHỐI  ===================== */
.ab-day{display:grid;gap:14px;grid-template-columns:minmax(0,1fr)}
.ab-day>*{min-width:0}
.ab-scene{--s1:#0a0a0c;--s2:#1c110a;--n:1;--st:.9;--bm:1;--L:0;position:relative;overflow:hidden;border:1px solid var(--ln);border-radius:var(--r);background:linear-gradient(180deg,var(--s1),var(--s2))}
.ab-svg{display:block;width:100%;height:auto}
.ab-stars circle{fill:#fff;opacity:var(--n)}
.ab-arc{fill:none;stroke-width:3;stroke-dasharray:.1 9;stroke-linecap:round}
.ab-arc.w{stroke:#fff;opacity:calc(1 - var(--L)*.7)}
.ab-arc.d{stroke:#0a0a0c;opacity:calc(var(--L)*.6)}
.ab-prog{fill:none;stroke:var(--ac);stroke-width:5;stroke-linecap:round}
.ab-halo{opacity:calc(1 - var(--n)*.55)}
.ab-sun{opacity:calc(1 - var(--n))}
.ab-sun circle{fill:var(--ac)}
.ab-rays path{fill:none;stroke:var(--ac);stroke-width:4;stroke-linecap:round}
.ab-rays{transform-box:fill-box;transform-origin:50% 50%}
.ab-spot{opacity:var(--n)}
.ab-beam{fill:#fff;opacity:.3}
.ab-city{fill:#0a0a0c;opacity:.88}
.ab-venue{fill:#0a0a0c}
.ab-led{fill:var(--ac);opacity:calc(.18 + var(--st)*.82)}
.ab-win rect{fill:var(--ac);opacity:calc(var(--st)*.9)}
.ab-bm{fill:#fff;opacity:calc(var(--bm)*.24);transform-box:fill-box;transform-origin:50% 100%;transform:rotate(var(--a,0deg))}
.ab-dt{fill:rgba(10,10,12,.62);stroke:#fff;stroke-width:1.6}
.ab-dt.is-done{fill:var(--ac)}
.ab-dt.is-cur{fill:var(--ac);stroke-width:2.6}
.ab-clock{position:absolute;left:10px;top:10px;margin:0;display:flex;align-items:baseline;gap:8px;padding:7px 12px 7px 10px;border-radius:8px;background:rgba(10,10,12,.82);color:#fff;font-variant-numeric:tabular-nums}
.ab-clock b{font:800 clamp(24px,7vw,34px)/1 var(--fb);letter-spacing:-.03em}
.ab-clock span{font:700 12px/1 var(--fb);letter-spacing:.12em;text-transform:uppercase;color:var(--ac)}

.ab-ctl{display:grid;grid-template-columns:48px minmax(0,1fr);gap:0 12px;align-items:start}
.ab-play{width:48px;height:48px;margin-top:-2px;padding:0;border:0;border-radius:50%;display:grid;place-items:center;background:var(--ac);color:#fff;cursor:pointer;transition:transform .25s,background .25s}
.ab-play:active{transform:scale(.94)}
.ab-play:focus-visible{outline:2px solid #fff;outline-offset:3px}
.ab-play svg{width:20px;height:20px;fill:currentColor}
.ab-play .i-pause{display:none}
.ab-play[aria-pressed=true] .i-play{display:none}
.ab-play[aria-pressed=true] .i-pause{display:block}
.ab-play[hidden]{display:none}
.ab-rng{position:relative}
.ab-cues{position:absolute;left:14px;right:14px;top:22px;height:0;pointer-events:none}
.ab-cues i{position:absolute;top:-3px;width:6px;height:6px;margin-left:-3px;border-radius:50%;background:#fff;opacity:.5;transition:background .3s,opacity .3s}
.ab-cues i.is-done{background:#0a0a0c;opacity:.8}
.ab-ticks{position:relative;height:18px;margin:-4px 14px 0}
.ab-ticks i{position:absolute;top:0;transform:translateX(-50%);font:600 12px/1 var(--fb);font-style:normal;color:var(--mut);font-variant-numeric:tabular-nums}
.ab-ctl.is-np{grid-template-columns:minmax(0,1fr)}

.ab-card{position:relative;padding:16px 16px 18px;border:1px solid var(--ln);border-radius:var(--r);background:var(--card)}
.sk-ab .ab-mt{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 12px;margin:0 0 12px;padding-bottom:10px;border-bottom:1px solid var(--ln);font:700 12px/1 var(--fb);letter-spacing:.12em;text-transform:uppercase;color:var(--mut);font-variant-numeric:tabular-nums}
.ab-mt b{color:var(--ac)}
.ab-mt span:last-child{color:var(--ink)}
.ab-ms{display:grid;margin:0;padding:0;list-style:none}
.ab-ms>li{grid-area:1/1;opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity .3s,transform .5s cubic-bezier(.16,1,.3,1),visibility 0s .3s}
.ab-ms>li.is-on{opacity:1;visibility:visible;transform:none;transition-delay:.06s,.06s,0s}
.ab-ms h3{margin:0 0 8px;font-size:clamp(19px,2.2vw,24px);line-height:1.25}
.ab-ms p{margin:0;font-size:15.5px;line-height:1.6;color:color-mix(in srgb,var(--ink) 86%,transparent)}
.ab-ms p+p{margin-top:6px;color:var(--mut)}
.ab-chips .s-chip{font-variant-numeric:tabular-nums}

@media(min-width:1025px){
  .ab-day{grid-template-columns:minmax(0,7fr) minmax(0,5fr);grid-template-areas:"scene card" "scene chips" "ctl .";grid-template-rows:auto 1fr auto;gap:18px 28px;align-items:start}
  .ab-scene{grid-area:scene}.ab-ctl{grid-area:ctl}.ab-card{grid-area:card;align-self:start;padding:22px 24px 24px}.ab-chips{grid-area:chips;align-self:start}
  .ab-ms h3{font-size:clamp(24px,2.3vw,32px)}
  .ab-ms p{font-size:clamp(16px,1.25vw,18px);line-height:1.62}
}
@media(prefers-reduced-motion:no-preference){
  .ab-rays{animation:abSpin 22s linear infinite}
  .ab-bm{animation:abSway 5.5s ease-in-out infinite alternate}
  .ab-bms g:nth-child(2) .ab-bm{animation-duration:6.7s;animation-delay:-2s}
  .ab-bms g:nth-child(3) .ab-bm{animation-duration:4.9s;animation-delay:-1s}
  .ab-dt.is-cur{animation:abBeat 1.6s ease-in-out infinite;transform-box:fill-box;transform-origin:50% 50%}
  .ab-play[aria-pressed=false]{animation:abHalo 2.2s ease-out infinite}
}
@keyframes abSway{from{transform:rotate(calc(var(--a,0deg) - 6deg))}to{transform:rotate(calc(var(--a,0deg) + 6deg))}}
@keyframes abBeat{50%{transform:scale(1.35)}}
@keyframes abHalo{0%{box-shadow:0 0 0 0 rgba(255,106,19,.6)}100%{box-shadow:0 0 0 14px rgba(255,106,19,0)}}

/* =====================  05 · BA MẢNG (thẻ bìa)  ===================== */
.ab-area-sec{padding-block:clamp(48px,8vw,108px)}
.ab-cv{display:flex;flex-direction:column;position:relative;overflow:hidden;border:1px solid var(--ln);border-radius:var(--r);background:var(--card);color:inherit}
.ab-cv-pic{display:block;position:relative;aspect-ratio:5/4;overflow:hidden}
.ab-cv-pic .th{position:absolute;inset:0;transition:transform 1.3s cubic-bezier(.16,1,.3,1)}
.ab-cv-pic::after{content:"";position:absolute;inset:auto 0 0;height:60%;background:linear-gradient(0deg,rgba(10,10,12,.88),transparent);pointer-events:none}
.ab-cv-art{position:absolute;z-index:2;left:14px;bottom:4px;font-size:clamp(56px,18vw,84px);line-height:.95;color:transparent;-webkit-text-stroke:1.5px #fff}
.ab-cv-b{display:flex;flex:1;flex-direction:column;gap:8px;padding:16px 16px 14px}
.ab-cv-no{display:flex;align-items:center;gap:10px;font:700 12px/1 var(--fb);letter-spacing:.14em;text-transform:uppercase;color:var(--mut)}
.ab-cv-no b{padding:5px 8px;border-radius:4px;background:var(--ac);color:#0a0a0c;letter-spacing:.06em}
.ab-cv h3{font-size:clamp(20px,2.2vw,26px);line-height:1.2}
.ab-cv-it{font-size:15px;line-height:1.6;color:var(--mut)}
.ab-cv-go{display:inline-flex;align-items:center;gap:8px;min-height:44px;margin-top:auto;font:700 13px/1 var(--fb);letter-spacing:.08em;text-transform:uppercase;color:var(--ac)}
.ab-cv-go svg{transition:transform .4s cubic-bezier(.16,1,.3,1)}
@media(hover:hover){
  .ab-cv{transition:border-color .3s,transform .5s cubic-bezier(.16,1,.3,1)}
  .ab-cv:hover{border-color:var(--ac);transform:translateY(-6px)}
  .ab-cv:hover .th{transform:scale(1.07)}
  .ab-cv:hover .ab-cv-go svg{transform:translateX(5px)}
}
.kx-js .ab-covers[data-r]:not(.kx-in) .ab-cv{opacity:0;transform:translateX(46px) rotate(1.6deg)}
@media(prefers-reduced-motion:no-preference){
  .kx-js .ab-covers.kx-in .ab-cv{animation:abCv 1s cubic-bezier(.16,1,.3,1) calc(var(--i)*.15s + .1s) backwards}
}
@keyframes abCv{from{opacity:0;transform:translateX(46px) rotate(1.6deg)}}

/* =====================  06 · GIÁ TRỊ (thẻ lật)  ===================== */
.ab-val-sec{padding-block:clamp(48px,8vw,108px)}
.ab-vals{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.ab-vals .s-flip-f,.ab-vals .s-flip-b{min-height:244px;padding:16px 14px}
.ab-vals .s-flip-f h3{font-size:clamp(17px,4.6vw,22px);line-height:1.2}
.ab-vals .s-flip-b p{font-size:15px}
.ab-vt{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.ab-vt .s-ico{margin:0;width:40px;height:40px}
.ab-vn{font:800 13px/1 var(--fb);letter-spacing:.12em;color:var(--ac)}
.sk-ab .ab-hint{display:flex;align-items:center;gap:10px;margin:18px 0 0;font:500 13px/1.4 var(--fb);color:var(--mut)}
.ab-hint i{flex:none;width:10px;height:10px;border-radius:50%;background:var(--ac)}
.ab-hm{display:none}
@media(hover:hover) and (pointer:fine){.ab-ht{display:none}.ab-hm{display:inline}}
@media(min-width:1025px){
  .ab-vals{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
  .ab-vals .s-flip-f,.ab-vals .s-flip-b{min-height:300px;padding:22px 20px}
}
@media(prefers-reduced-motion:no-preference){
  .ab-hint i{animation:abHalo 1.8s ease-out infinite}
}

/* =====================  07 · TỪNG LÀM VIỆC CÙNG  ===================== */
.ab-cli-sec{padding-block:clamp(48px,8vw,108px)}
.ab-logos{display:grid;gap:12px;margin-bottom:clamp(30px,5vw,60px);-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.ab-lr{overflow:hidden;white-space:nowrap}
.ab-lt{display:inline-flex;width:max-content;gap:12px;padding-right:12px}
.ab-lt span{flex:none;display:inline-flex;align-items:center;min-height:56px;padding:0 26px;border:1px solid var(--ln);border-radius:99px;background:var(--card);font:800 clamp(16px,4.4vw,22px)/1 var(--fb);letter-spacing:.14em;text-transform:uppercase;color:var(--ink)}
.ab-lt span:nth-child(3n+2){letter-spacing:-.01em;text-transform:none;font-weight:700}
.ab-lt span:nth-child(3n){font-weight:300;letter-spacing:.3em}
.ab-lr2 .ab-lt span{background:transparent;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.62)}
.sk-ab .ab-ch{margin:0 0 16px;font:700 12px/1 var(--fb);letter-spacing:.16em;text-transform:uppercase;color:var(--mut)}
.ab-cards{margin-top:0}
@media(max-width:1024px){
  .ab-cards{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:calc(var(--gut)*-1);padding:4px var(--gut) 14px;scroll-padding-inline:var(--gut);scrollbar-width:none;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
  .ab-cards::-webkit-scrollbar{display:none}
  .ab-cards>.card{flex:0 0 min(78%,330px);scroll-snap-align:start;opacity:1!important;transform:none!important}
}
@media(prefers-reduced-motion:no-preference){
  .ab-lt{animation:abTape 46s linear infinite}
  .ab-lr2 .ab-lt{animation-direction:reverse;animation-duration:54s}
}
@media(hover:hover){.ab-logos:hover .ab-lt{animation-play-state:paused}}
@media(prefers-reduced-motion:reduce){
  .ab-logos{-webkit-mask-image:none;mask-image:none}
  .ab-lt{display:flex;flex-wrap:wrap;width:auto;padding:0 var(--gut)}
  .ab-lt span:nth-child(n+9){display:none}
}

/* =====================  08 · HỎI NHANH + TOÀ SOẠN  ===================== */
.ab-faq-sec{padding-block:clamp(48px,8vw,108px)}
.ab-faq{display:grid;gap:26px;grid-template-columns:minmax(0,1fr)}
.ab-faq>*{min-width:0}
.ab-imp{padding:18px;border:1px solid var(--ln);border-radius:var(--r);background:var(--card);border-top:3px solid var(--ac)}
.ab-imp p{font-size:15px;line-height:1.55;color:var(--mut)}
.ab-imp .ab-imp-k{font:700 12px/1 var(--fb);letter-spacing:.16em;text-transform:uppercase;color:var(--mut)}
.ab-imp-tel{display:block;margin:10px 0 6px;font:800 clamp(28px,7.4vw,40px)/1.1 var(--fb);letter-spacing:-.03em;color:var(--ac);min-height:44px}
.ab-imp .ab-imp-s{margin-top:6px}
@media(min-width:1025px){
  .ab-faq{grid-template-columns:minmax(0,4fr) minmax(0,7fr);grid-template-rows:auto 1fr;column-gap:clamp(36px,6vw,96px);align-items:start}
  .ab-faq .ab-head{grid-column:1;grid-row:1;margin-bottom:24px}
  .ab-faq .fq{grid-column:2;grid-row:1/3}
  .ab-faq .ab-imp{grid-column:1;grid-row:2}
}

/* khối chung của kit đặt lại cho gọn trên mobile */
@media(max-width:640px){
  .sk-ab .s-relw{padding-block:36px 12px}
  .sk-ab .s-rel{gap:10px}
  .sk-ab .s-rel a{min-height:92px;gap:12px;padding:16px 18px}
  .sk-ab .s-pager a{padding:16px 20px}
}

/* giảm chuyển động: kết quả đổi ngay, không chuyển pha */
@media(prefers-reduced-motion:reduce){
  .ab-w,.ab-mbar::after,.ab-ms>li,.ab-cues i,.ab-cv-pic .th,.ab-st::before,.ab-st::after,.ab-pg::after{transition:none!important}
  .ab-nr{will-change:auto}
}