:root{
  color-scheme:dark;
  --bg:#061426; --bg-2:#091B31; --bg-3:#04101F;
  --panel:#0C213A; --panel-2:#102A48; --panel-3:#163454;
  --line:#1B3B5D; --line-2:#2B5478;
  --ink:#F4F9FF; --ink-2:#C7D6E5; --ink-3:#91A8BE; --ink-4:#6F88A2;
  --vang:#35BDF5; --vang-2:#76D7FF; --vang-3:#168BC1;
  --vang-mo:rgba(53,189,245,.13); --on-vang:#03111F;
  --shadow-s:0 1px 2px rgba(0,0,0,.5),0 14px 30px -18px rgba(0,0,0,.9);
  --shadow:0 2px 6px rgba(0,0,0,.5),0 34px 66px -30px rgba(0,0,0,1);
  --shadow-v:0 10px 30px -10px rgba(53,189,245,.52);
  --r:14px; --r-s:10px; --cao-dau:68px;
  --f-tit:"Bricolage Grotesque","Be Vietnam Pro",system-ui,sans-serif;
  --f-than:"Be Vietnam Pro",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --ease:cubic-bezier(.23,1,.32,1);
  --w:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--f-than);
  font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
section[id]{scroll-margin-top:calc(var(--cao-dau) + 10px)}
h1,h2,h3{font-family:var(--f-tit);line-height:1.14;margin:0;padding-top:.06em;
  letter-spacing:-.015em;font-weight:800}
h1{font-size:clamp(31px,5.2vw,55px)}
h2{font-size:clamp(25px,3.6vw,40px)}
h3{font-size:clamp(18px,2vw,21px);font-weight:700}
p{margin:0 0 14px}
.wrap{max-width:var(--w);margin:0 auto;padding:0 20px}
.phan{padding:clamp(56px,7vw,104px) 0;position:relative}
.mono{font-family:var(--f-mono);font-size:12px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--vang);font-weight:500}
.phan-dau{max-width:720px;margin:0 auto 44px;text-align:center}
.phan-dau .mono{display:block;margin-bottom:14px}
.phan-dau p{color:var(--ink-2);margin-top:16px;font-size:17px}

.phan-sang{
  color:#071629;background:#EDF7FF;
  --ink:#071629;--ink-2:#29445E;--ink-3:#4F6B84;--ink-4:#71879B;
  --line:#D0E2F0;--line-2:#A9C8DE;
  --bg:#EDF7FF;--bg-2:#F8FCFF;--bg-3:#E4F2FC;
  --panel:#FFFFFF;--panel-2:#F1F8FD;--panel-3:#DDEEF9;
  --vang:#087EB5;--vang-2:#056A9A;--vang-mo:rgba(8,126,181,.09);
  --shadow:0 2px 6px rgba(4,35,61,.08),0 24px 46px -26px rgba(4,35,61,.28);
  --shadow-s:0 1px 2px rgba(4,35,61,.07),0 10px 22px -14px rgba(4,35,61,.25);
}
.phan-sang h1,.phan-sang h2,.phan-sang h3{color:var(--ink)}

.nut{display:inline-flex;align-items:center;gap:10px;border-radius:999px;
  padding:14px 26px;font-weight:600;font-size:16px;text-decoration:none;
  border:1px solid transparent;cursor:pointer;font-family:var(--f-than);
  transition:transform .18s var(--ease),box-shadow .18s var(--ease),background .18s}
.nut-vang{background:linear-gradient(180deg,var(--vang-2),var(--vang));
  color:var(--on-vang);box-shadow:var(--shadow-v)}
.nut-vang:hover{transform:translateY(-2px);box-shadow:0 16px 34px -12px rgba(53,189,245,.58)}
.nut-vang:active{transform:translateY(0)}
.nut-lon{padding:17px 34px;font-size:17px}
.nut-day{width:100%;justify-content:center}

/* ---------- HEADER + MENU ---------- */
.dau{position:sticky;top:0;z-index:60;background:rgba(4,16,31,.88);
  backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.dau .wrap{display:flex;align-items:center;gap:18px;height:var(--cao-dau)}
.logo{display:flex;align-items:center;gap:11px;text-decoration:none;flex:none}
.logo-hieu{width:34px;height:34px;flex:none}
.logo-chu{display:block}
.logo b{font-family:var(--f-tit);font-size:17px;font-weight:800;display:block;line-height:1.15}
.logo-chu span{font-family:var(--f-mono);font-size:9.5px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--ink-3)}
.menu{display:flex;align-items:center;gap:26px;margin-left:auto}
.menu a{text-decoration:none;color:var(--ink-2);font-size:15px;font-weight:500;
  position:relative;padding:6px 0;transition:color .18s}
.menu a::after{content:"";position:absolute;left:0;right:100%;bottom:0;height:2px;
  background:var(--vang);border-radius:2px;transition:right .22s var(--ease)}
.menu a:hover{color:var(--ink)}
.menu a:hover::after,.menu a.dang-xem::after{right:0}
.menu a.dang-xem{color:var(--vang)}
.dau .nut{padding:11px 20px;font-size:14.5px;flex:none}
.nut-menu{display:none;margin-left:auto;background:transparent;border:1px solid var(--line-2);
  color:var(--ink);width:42px;height:42px;border-radius:11px;place-items:center;cursor:pointer}

/* ---------- HERO ---------- */
.hero-khoi{position:relative;overflow:hidden;background:
  radial-gradient(circle at 79% 26%,rgba(51,181,238,.24),transparent 23%),
  radial-gradient(circle at 10% 58%,rgba(25,111,175,.22),transparent 30%),
  linear-gradient(145deg,#0B2541 0%,#071A30 48%,#030D1A 100%)}
.hero-khoi::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.72;
  background-image:radial-gradient(circle,rgba(117,210,250,.34) 1px,transparent 1.5px),
    linear-gradient(120deg,transparent 0 48%,rgba(111,204,247,.07) 49% 50%,transparent 51% 100%);
  background-size:58px 58px,180px 180px;mask-image:linear-gradient(90deg,#000,transparent 46%,#000)}
.hero{padding:clamp(48px,6vw,86px) 0 clamp(40px,4vw,58px);position:relative;overflow:hidden;background:transparent}
.hero::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(90deg,rgba(2,11,22,.12),transparent 48%,rgba(2,10,20,.18))}
.hero-nen{position:absolute;inset:0;pointer-events:none}
.hero-nen .anh-su-kien{position:absolute;inset:0;background:url("assets/img/cd-workshop.webp") center/cover;
  opacity:.20;mix-blend-mode:screen;filter:saturate(.8) contrast(1.05) brightness(1.18)}
.hero-nen .manh{position:absolute;inset:0;opacity:.5;
  background:repeating-linear-gradient(112deg,rgba(255,255,255,.04) 0 1px,transparent 1px 30px)}
.hero-nen .toa-nha{position:absolute;left:0;right:0;bottom:0;height:52%;opacity:0;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='340' height='200' viewBox='0 0 340 200'><g fill='none' stroke='%23F2B14A' stroke-width='1.4'><path d='M8 200V96h44v104M18 108h10M34 108h10M18 126h10M34 126h10M18 144h10M34 144h10M18 162h10M34 162h10'/><path d='M64 200V58h56v142M76 72h12M100 72h12M76 92h12M100 92h12M76 112h12M100 112h12M76 132h12M100 132h12M76 152h12M100 152h12M76 172h12M100 172h12'/><path d='M132 200v-78h38v78M142 134h8M156 134h8M142 152h8M156 152h8M142 170h8M156 170h8'/><path d='M182 200V34h58v166M194 50h14M218 50h14M194 72h14M218 72h14M194 94h14M218 94h14M194 116h14M218 116h14M194 138h14M218 138h14M194 160h14M218 160h14M194 182h14M218 182h14M211 34V18'/><path d='M252 200v-96h44v96M262 118h10M278 118h10M262 138h10M278 138h10M262 158h10M278 158h10M262 178h10M278 178h10'/><path d='M308 200V70h30v130M316 84h6M328 84h6M316 104h6M328 104h6M316 124h6M328 124h6M316 148h6M328 148h6M316 172h6M328 172h6'/></g></svg>") repeat-x bottom left / auto 100%;
  -webkit-mask-image:linear-gradient(180deg,transparent,#000 55%);
  mask-image:linear-gradient(180deg,transparent,#000 55%)}
.hero .wrap{position:relative;z-index:2}
.hero-luoi{display:grid;grid-template-columns:1.04fr .96fr;gap:54px;align-items:center}
.hero h1{margin:16px 0 18px}
.hero h1 em{font-style:normal;color:var(--ink)}
.hero .dat{color:var(--ink-2);font-size:18px;max-width:52ch}
.hero-cta{display:flex;flex-wrap:wrap;align-items:center;gap:16px;margin-top:28px}
.mien-phi{display:inline-flex;align-items:center;gap:8px;background:rgba(53,189,245,.11);
  border:1px solid rgba(93,206,253,.34);color:#9DE4FF;border-radius:999px;
  padding:7px 15px;font-family:var(--f-mono);font-size:11.5px;letter-spacing:.14em;
  text-transform:uppercase;font-weight:500}

.hero-anh{position:relative;justify-self:center;width:100%;max-width:460px;
  display:grid;place-items:center;padding:18px 0 0}
.hero-anh::before{content:"";position:absolute;inset:2% 6% 6%;border-radius:26px;
  background:radial-gradient(58% 52% at 50% 46%,rgba(55,193,255,.40),transparent 72%);filter:blur(20px)}
.chan-dung-hero{position:relative;width:min(390px,88%);height:520px;display:flex;align-items:flex-end;justify-content:center}
.chan-dung-hero::before{content:"";position:absolute;inset:11% 2% 3%;border-radius:48% 48% 12px 12px;
  background:linear-gradient(155deg,rgba(38,117,177,.72),rgba(5,22,40,.14));border:1px solid rgba(118,215,255,.26);
  box-shadow:inset 0 0 70px rgba(70,185,240,.12),0 38px 70px -35px rgba(0,0,0,.9)}
.anh-coach-hero{position:relative;z-index:2;max-height:100%;width:auto;filter:drop-shadow(0 24px 30px rgba(0,0,0,.48))}
.vong{position:absolute;border:1px solid rgba(118,215,255,.25);border-radius:50%;z-index:1}
.vong-1{width:330px;height:330px;top:18%;right:-16%;box-shadow:0 0 60px rgba(53,189,245,.13)}
.vong-2{width:190px;height:190px;top:32%;right:-1%}
.ten-coach{position:absolute;z-index:4;left:3%;bottom:4%;padding:11px 15px;background:rgba(4,18,34,.82);
  border:1px solid rgba(118,215,255,.28);border-radius:10px;backdrop-filter:blur(10px)}
.ten-coach b{display:block;font-family:var(--f-tit);font-size:14px;text-transform:uppercase;letter-spacing:.06em}
.ten-coach span{display:block;color:var(--ink-3);font-family:var(--f-mono);font-size:8.5px;text-transform:uppercase;letter-spacing:.12em}
.sach{position:relative;width:min(322px,84%);aspect-ratio:3/4.05;
  transform:perspective(1100px) rotateY(-9deg) rotateX(2deg);
  filter:drop-shadow(0 30px 44px rgba(0,0,0,.7))}
.sach::before{content:"";position:absolute;left:-13px;top:6px;bottom:6px;width:15px;
  border-radius:5px 2px 2px 5px;background:linear-gradient(90deg,#020B15,#0B2844 60%,#245478)}
.sach-bia{position:absolute;inset:0;border-radius:4px 9px 9px 4px;overflow:hidden;
  padding:26px 22px 20px;display:flex;flex-direction:column;
  background:linear-gradient(155deg,#123B61 0%,#081C33 50%,#030C18 100%);
  border:1px solid rgba(83,199,249,.42);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.05),inset -18px 0 34px rgba(0,0,0,.5)}
.sach-bia::before{content:"";position:absolute;inset:11px;border:1px solid rgba(83,199,249,.38);
  border-radius:3px;pointer-events:none;z-index:4}
.sach-bia::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:repeating-linear-gradient(112deg,rgba(255,255,255,.045) 0 1px,transparent 1px 22px)}
.sach-mo{position:absolute;left:0;right:0;top:0;height:60%;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,rgba(3,12,24,.94) 0 42%,rgba(4,19,36,.58) 72%,transparent)}
.sach-nhan{font-family:var(--f-mono);font-size:9px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--vang);position:relative;z-index:3;margin-bottom:12px}
.sach-tit{font-family:var(--f-tit);font-weight:800;font-size:clamp(18px,2.2vw,22px);
  line-height:1.2;color:#FDF7EF;position:relative;z-index:3;letter-spacing:-.01em;
  text-shadow:0 2px 10px rgba(0,0,0,.7)}
.sach-tit em{font-style:normal;color:#76D7FF;display:block}
.sach-phu{font-size:10.5px;color:var(--ink-2);position:relative;z-index:3;margin-top:9px;
  max-width:19ch;line-height:1.45;text-shadow:0 1px 6px rgba(0,0,0,.7)}
.sach-anh{position:absolute;right:-4%;bottom:0;width:66%;z-index:0;
  filter:drop-shadow(-6px 10px 18px rgba(0,0,0,.6))}
.sach-ten{position:absolute;left:22px;bottom:20px;z-index:3;
  font-family:var(--f-mono);font-size:9px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--vang);background:rgba(3,14,27,.82);padding:5px 9px;border-radius:999px;
  border:1px solid rgba(83,199,249,.32)}
.the-noi{position:absolute;z-index:5;background:rgba(7,25,46,.90);
  border:1px solid var(--line-2);border-radius:var(--r);padding:12px 16px;
  backdrop-filter:blur(8px);box-shadow:var(--shadow);animation:troi 5.5s ease-in-out infinite}
.the-noi .so{font-family:var(--f-tit);font-weight:800;font-size:19px;color:var(--vang);line-height:1.1}
.the-noi .nhan{font-size:11.5px;color:var(--ink-3);white-space:nowrap}
.the-1{left:0;top:0}
.the-2{right:0;bottom:0;animation-delay:-2.6s}
@keyframes troi{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}

/* ---------- DẢI SỐ LIỆU ---------- */
.dai-tin{position:relative;background:transparent;border-top:1px solid rgba(106,199,241,.18);border-bottom:1px solid rgba(106,199,241,.18);
  padding:clamp(34px,4vw,52px) 0}
.tong{text-align:center;margin-bottom:26px}
.tong .so-lon{font-family:var(--f-tit);font-weight:800;color:var(--vang);
  font-size:clamp(40px,6.4vw,70px);line-height:1.05;letter-spacing:-.02em}
.tong .nhan-lon{color:var(--ink-2);font-size:clamp(15px,1.6vw,18px);margin-top:6px}
.kenh{display:grid;grid-template-columns:repeat(4,1fr);
  border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.kenh > div{padding:18px 22px;border-left:1px solid var(--line)}
.kenh > div:first-child{border-left:0}
.kenh .ten{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--vang);font-weight:600;display:block;margin-bottom:8px}
.kenh .so{font-family:var(--f-tit);font-weight:800;font-size:clamp(22px,2.6vw,30px);
  color:var(--ink);line-height:1.05}
.kenh .don{font-size:14px;color:var(--ink-3);font-family:var(--f-than);font-weight:400;
  margin-left:6px;letter-spacing:0}
.them{text-align:center;margin-top:20px;color:var(--ink-2);font-size:15px;
  display:flex;flex-wrap:wrap;gap:8px 26px;justify-content:center}
.them b{color:var(--vang);font-weight:700}
.nguon{text-align:center;margin-top:12px;color:var(--ink-4);font-size:13px}

/* ---------- thẻ ---------- */
.luoi-4{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.luoi-2{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.the{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);
  padding:24px;transition:transform .2s var(--ease),border-color .2s}
.the:hover{transform:translateY(-4px);border-color:var(--line-2)}
.the h3{margin-bottom:9px}
.the p{color:var(--ink-2);font-size:15px;margin:0}
.hieu{width:46px;height:46px;border-radius:12px;background:var(--vang-mo);
  display:grid;place-items:center;color:var(--vang);margin-bottom:15px}

.trich{background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--vang);
  border-radius:var(--r);padding:clamp(24px,3.4vw,38px);max-width:820px;margin:0 auto}
.trich p{font-size:clamp(17px,2vw,19.5px);color:var(--ink-2);line-height:1.72}
.trich p strong{color:var(--ink);font-weight:600}
.trich .ky{display:flex;align-items:center;gap:12px;margin-top:20px;
  font-family:var(--f-mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--vang)}
.trich .ky::before{content:"";width:32px;height:1px;background:var(--vang);flex:none}

.buoc{display:flex;gap:20px;padding:24px;background:var(--panel);
  border:1px solid var(--line);border-radius:var(--r);align-items:flex-start;
  transition:transform .2s var(--ease),border-color .2s}
.buoc:hover{transform:translateY(-4px);border-color:var(--line-2)}
.buoc .stt{font-family:var(--f-mono);font-weight:600;font-size:14px;color:var(--vang);
  background:var(--vang-mo);border:1px solid rgba(53,189,245,.28);
  width:42px;height:42px;border-radius:11px;display:grid;place-items:center;flex:none}
.phan-sang .buoc .stt{border-color:rgba(143,88,8,.24)}
.buoc h3{margin-bottom:7px}
.buoc p{color:var(--ink-2);font-size:15px;margin:0}

.cot-hop{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:26px}
.cot-hop h3{margin-bottom:16px}
.cot-hop ul{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.cot-hop li{display:flex;gap:11px;align-items:flex-start;font-size:15.5px;color:var(--ink-2)}
.cot-hop li svg{flex:none;margin-top:3px}
.hop-co li svg{color:#2F7A4C}
.hop-khong li svg{color:var(--ink-4)}

/* ---------- FORM ---------- */
.hop-form{background:linear-gradient(180deg,var(--panel-2),var(--panel));
  border:1px solid var(--line-2);border-radius:20px;padding:26px;
  box-shadow:var(--shadow);max-width:520px;margin:0 auto}
.hop-form h3{margin-bottom:6px}
.o{margin-bottom:13px}
.o label{display:block;font-size:13.5px;font-weight:600;margin-bottom:6px;color:var(--ink-2)}
.o input{width:100%;background:var(--bg-2);border:1px solid var(--line-2);color:var(--ink);
  border-radius:var(--r-s);padding:14px 15px;font-size:16px;font-family:var(--f-than);
  min-height:48px;transition:border-color .16s}
.o input::placeholder{color:var(--ink-4)}
.o input:focus{outline:none;border-color:var(--vang);box-shadow:0 0 0 3px var(--vang-mo)}
.o input[aria-invalid="true"]{border-color:#E4674B}
.loi{color:#F08A70;font-size:12.5px;margin-top:5px;display:none}
.loi.hien{display:block}
.bao-mat{display:flex;gap:8px;align-items:center;justify-content:center;
  color:var(--ink-4);font-size:12.5px;margin-top:13px;text-align:center}
.bao-mat svg{flex:none}
.xong{display:none;text-align:center;padding:6px 0}
.xong.hien{display:block;animation:len .45s var(--ease)}
@keyframes len{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.xong .dau-tick{width:60px;height:60px;margin:0 auto 16px;border-radius:50%;
  background:var(--vang-mo);border:1px solid rgba(53,189,245,.4);
  display:grid;place-items:center;color:var(--vang)}
.xong h3{margin-bottom:8px}
.xong p{color:var(--ink-2);font-size:15px}
.xong .nhac{background:var(--bg-2);border:1px dashed var(--line-2);border-radius:var(--r-s);
  padding:12px 14px;font-size:13.5px;color:var(--ink-3);margin-top:14px;text-align:left}

.khoi-cta{position:relative;overflow:hidden;border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  background:radial-gradient(80% 130% at 50% 0%,rgba(53,189,245,.20),transparent 64%),
             linear-gradient(180deg,var(--bg-3),var(--bg))}
.khoi-cta .wrap{position:relative;z-index:2}
.chot-cuoi{padding:clamp(52px,6vw,86px) 0}
.chot-luoi{display:grid;grid-template-columns:auto 1fr;gap:clamp(32px,5vw,64px);align-items:center;
  max-width:940px}
.chot-sach{display:grid;place-items:center}
.sach-nho{width:210px;aspect-ratio:3/4.05;
  transform:perspective(900px) rotateY(11deg) rotateX(2deg)}
.sach-nho::before{left:auto;right:-12px;border-radius:2px 5px 5px 2px;
  background:linear-gradient(270deg,#140F0D,#2E2620 60%,#514539)}
.sach-nho .sach-bia{padding:20px 17px 16px;border-radius:9px 4px 4px 9px;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.05),inset 18px 0 34px rgba(0,0,0,.5)}
.sach-nho .sach-tit{font-size:15px}
.sach-nho .sach-phu{font-size:9px}
.sach-nho .sach-ten{left:17px;bottom:16px;font-size:8px}
.chot-chu .mono{display:block;margin-bottom:12px}
.chot-chu h2{margin-bottom:14px}
.chot-dat{color:var(--ink-2);font-size:17px;max-width:46ch}
.chot-gom{list-style:none;padding:0;margin:20px 0 26px;display:grid;gap:11px}
.chot-gom li{display:flex;gap:11px;align-items:flex-start;color:var(--ink-2);font-size:15.5px}
.chot-gom svg{flex:none;margin-top:3px;color:var(--vang)}
.chot-ghi{display:flex;gap:8px;align-items:center;color:var(--ink-4);font-size:12.5px;margin-top:14px}
.chot-ghi svg{flex:none}

/* ---------- BỘ ẢNH VỀ COACH ---------- */
.ve-luoi{display:grid;grid-template-columns:1.02fr .98fr;gap:48px;align-items:center}
.bo-anh{position:relative;aspect-ratio:1/1.44;width:100%;max-width:480px;justify-self:center}
.bo-anh::before{content:"";position:absolute;left:12%;top:6%;width:70%;height:62%;
  border-radius:50%;background:radial-gradient(closest-side,rgba(53,189,245,.30),transparent 72%);
  filter:blur(20px)}
.bo-anh img{position:absolute;border-radius:var(--r-s)}
.bo-anh .anh-chinh{left:17%;top:0;width:64%;border-radius:0;
  filter:drop-shadow(0 26px 40px rgba(0,0,0,.66))}
.bo-anh .anh-p{border:1px solid var(--line-2);box-shadow:var(--shadow);object-fit:cover}
.bo-anh .anh-p1{left:0;top:47%;width:54%;aspect-ratio:16/10;z-index:3;transform:rotate(-2deg)}
.bo-anh .anh-p2{right:0;top:62%;width:52%;aspect-ratio:16/10;z-index:2;transform:rotate(2deg)}
.bo-anh .anh-p3{left:14%;bottom:0;width:50%;aspect-ratio:16/10;z-index:4;transform:rotate(-1deg)}
.so-lieu{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:24px}
.so-lieu div{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-s);padding:16px}
.so-lieu .so{font-family:var(--f-tit);font-weight:800;font-size:26px;color:var(--vang);line-height:1.1}
.so-lieu .nhan{font-size:13px;color:var(--ink-3);margin-top:3px}

/* ---------- FAQ ---------- */
.faq{max-width:800px;margin:0 auto;display:grid;gap:12px}
.faq details{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);
  padding:0 20px;transition:border-color .2s}
.faq details[open]{border-color:var(--line-2)}
.faq summary{cursor:pointer;list-style:none;padding:18px 0;font-weight:600;font-size:16.5px;
  display:flex;justify-content:space-between;align-items:center;gap:14px}
.faq summary::-webkit-details-marker{display:none}
.faq summary svg{flex:none;color:var(--vang);transition:transform .22s var(--ease)}
.faq details[open] summary svg{transform:rotate(45deg)}
.faq .tra{padding:16px 0 18px;color:var(--ink-2);font-size:15.5px;border-top:1px solid var(--line)}
.faq .tra p:last-child{margin-bottom:0}

/* ---------- FOOTER ---------- */
.chan{background:var(--bg-3);border-top:1px solid var(--line);padding:44px 0 96px}
.chan-luoi{display:grid;grid-template-columns:1.4fr 1fr;gap:34px;align-items:start}
.chan p{color:var(--ink-3);font-size:14.5px;max-width:44ch}
.chan-lien{display:grid;gap:10px;font-size:14.5px}
.chan-lien a{color:var(--ink-2);text-decoration:none;display:inline-flex;gap:9px;align-items:center}
.chan-lien a:hover{color:var(--vang)}
.chan-duoi{border-top:1px solid var(--line);margin-top:30px;padding-top:20px;
  color:var(--ink-4);font-size:13px;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap}

.dinh{position:fixed;left:0;right:0;bottom:0;z-index:70;display:none;
  padding:11px 16px calc(11px + env(safe-area-inset-bottom));
  background:rgba(4,16,31,.94);backdrop-filter:blur(12px);border-top:1px solid var(--line)}

.len{opacity:0;transform:translateY(22px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.len.vao{opacity:1;transform:none}

@media (max-width:1080px){
  .menu{gap:18px}
  .menu a{font-size:14px}
}
@media (max-width:960px){
  .menu{position:fixed;left:0;right:0;top:var(--cao-dau);flex-direction:column;
    align-items:stretch;gap:0;background:rgba(4,16,31,.97);backdrop-filter:blur(14px);
    border-bottom:1px solid var(--line);padding:8px 20px 16px;margin:0;
    transform:translateY(-12px);opacity:0;visibility:hidden;
    transition:opacity .2s var(--ease),transform .2s var(--ease),visibility .2s}
  .menu.mo{transform:none;opacity:1;visibility:visible}
  .menu a{padding:14px 0;border-bottom:1px solid var(--line);font-size:16px}
  .menu a::after{display:none}
  .nut-menu{display:grid}
  .dau .nut-vang{display:none}
  .hero-luoi,.ve-luoi{grid-template-columns:1fr;gap:34px}
  .hero-anh{max-width:360px;order:-1}
  .luoi-4{grid-template-columns:repeat(2,1fr)}
  .kenh{grid-template-columns:repeat(2,1fr)}
  .kenh > div:nth-child(3){border-left:0}
  .kenh > div:nth-child(n+3){border-top:1px solid var(--line)}
  .bo-anh{max-width:400px}
  .chot-luoi{grid-template-columns:1fr;gap:30px;text-align:center;justify-items:center}
  .chot-dat{margin-left:auto;margin-right:auto}
  .chot-gom li{text-align:left}
  .chot-ghi{justify-content:center}
}
@media (max-width:640px){
  .luoi-4,.luoi-2{grid-template-columns:1fr}
  .so-lieu{grid-template-columns:1fr}
  .dinh{display:block}
  .chan{padding-bottom:104px}
  .chan-luoi{grid-template-columns:1fr}
  .buoc{flex-direction:column;gap:14px}
  .hero-anh{max-width:300px;padding:4px 0}
  .chan-dung-hero{height:390px;width:min(290px,94%)}
  .sach{width:min(226px,80%)}
  .the-noi{display:none}
  .hero-cta{gap:12px}
  .hero-cta .nut{width:100%;justify-content:center}
  .chot-chu .nut{width:100%;justify-content:center}
  .sach-nho{width:180px}
  .kenh{grid-template-columns:1fr}
  .kenh > div{border-left:0}
  .kenh > div + div{border-top:1px solid var(--line)}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  .len{opacity:1;transform:none}
}

/* nội dung sửa được ở trang quản trị */
.richtext{color:var(--ink-2);font-size:17px}
.richtext p{margin:0 0 14px}
.richtext p:last-child{margin-bottom:0}
.richtext strong,.richtext b{color:var(--ink);font-weight:600}
.richtext ul,.richtext ol{margin:0 0 14px;padding-left:22px}
.richtext li{margin-bottom:6px}
.richtext a{color:var(--vang)}
.richtext img{border-radius:var(--r-s);margin:10px 0}
.trich .richtext{font-size:inherit}

/* Shared navy surfaces: one continuous hero photograph and restrained light. */
.phan-sang{color-scheme:dark;color:#EEF3F8;--ink:#EEF3F8;--ink-2:#BBC9D7;--ink-3:#96AABD;--ink-4:#8299AF;--bg:#081522;--bg-2:#0B1B2C;--bg-3:#06111D;--panel:#102234;--panel-2:#142A40;--panel-3:#183249;--line:#223A4E;--line-2:#38546B;--vang:#8ACDEB;--vang-2:#ACDEEF;--vang-mo:rgba(138,205,235,.09)}
.hero-khoi{isolation:isolate}
.hero-khoi > .hero-nen{z-index:-1}
.hero-khoi > .hero-nen .anh-su-kien{opacity:.27;background-position:center 35%;mix-blend-mode:luminosity}
.hero-khoi > .hero-nen::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,16,31,.68),rgba(5,24,43,.24) 65%,rgba(3,16,31,.40))}
.hero::after{display:none}
.dai-tin{border:0;padding-top:20px;padding-bottom:58px}
.hero h1 em{color:#88D7F4;display:block}
.hero-anh{padding:35px 0}
.hero .dat{font-size:17px;line-height:1.8}
.kenh{background:rgba(5,22,40,.38);border-color:rgba(165,212,238,.22)}
.phan:not(.phan-sang){isolation:isolate;overflow:hidden;background-image:radial-gradient(ellipse at 6% 15%,rgba(33,111,162,.16),transparent 48%),radial-gradient(ellipse at 95% 85%,rgba(50,140,191,.09),transparent 45%)}
.phan:not(.phan-sang)::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:radial-gradient(circle,rgba(143,205,236,.22) .8px,transparent 1.2px);background-size:42px 42px;mask-image:linear-gradient(100deg,#000,transparent 37%,transparent 65%,#000)}
.phan:not(.phan-sang)::after{content:"";position:absolute;width:520px;height:520px;right:-340px;top:12%;border:1px solid rgba(120,197,232,.15);border-radius:50%;box-shadow:0 0 0 48px rgba(120,197,232,.025),0 0 0 100px rgba(120,197,232,.02);z-index:-1;pointer-events:none}
.phan-sang{background-image:radial-gradient(ellipse at top right,rgba(57,117,150,.13),transparent 55%);background-color:#081522}
.bo-anh{isolation:isolate}
.bo-anh::before{left:3%;top:2%;width:95%;height:82%;background:radial-gradient(ellipse,rgba(134,218,250,.64) 0%,rgba(36,134,199,.36) 38%,transparent 70%);filter:blur(24px);z-index:-1}
.bo-anh::after{content:"";position:absolute;inset:8% 0 12%;border:1px solid rgba(149,216,246,.28);border-radius:48% 48% 20% 20%;background:linear-gradient(150deg,rgba(100,187,230,.16),transparent 65%);z-index:-1;transform:rotate(-8deg)}
.bo-anh .anh-chinh{filter:drop-shadow(0 12px 24px rgba(1,10,23,.32))}
.bo-anh .anh-p{border-color:rgba(161,219,243,.48)}
.nut-vang{background:linear-gradient(135deg,#A0E3FA,#55BCE6);box-shadow:0 8px 24px -12px rgba(109,210,249,.38)}
@media(max-width:960px){.hero-anh{order:0}.hero-luoi{gap:26px}.hero h1{max-width:700px}.hero-anh{max-width:390px}}
@media(max-width:640px){.hero{padding-top:36px;padding-bottom:24px}.hero h1{font-size:34px;line-height:1.16}.hero-anh{max-width:320px}.hero .sach{width:260px}.dai-tin{padding-top:12px}.kenh{grid-template-columns:repeat(2,minmax(0,1fr))}.kenh>div{padding:16px 12px}.kenh .so{font-size:23px}.kenh .don{display:block;margin:6px 0 0;font-size:12px}.kenh>div:nth-child(2){border-top:0}.kenh>div:nth-child(even){border-left:1px solid var(--line)}}