
@font-face{font-family:"League Gothic Soft";src:url(/blob/7d1f6f5cb97a203e486d88ed9f0e8cc6.woff2) format("woff2");font-display:swap}
@font-face{font-family:"Inter Soft";src:url(/blob/4a1f9df1b0cbfefa7e28933f39c86d8d.woff2) format("woff2");font-weight:300;font-display:swap}
@font-face{font-family:"Inter Soft";src:url(/blob/acebb9b5b57439ac94ece30c0c33037e.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Inter Soft";src:url(/blob/f4f7813531a2034bd7900e62d52e9b07.woff2) format("woff2");font-weight:600;font-display:swap}
body{margin:0}
a{color:inherit;text-decoration:none}a:hover{text-decoration:underline}
/* Thai's grid: 12 columns, 20px gutters, 40px side margins (95px columns at 1440) */
/* the site slides half a screen left and blurs behind a light veil; the detail or schedule page slides in
   on the right half (ECO / ATA panel); clicking or scrolling the veil, or Esc, closes it */
.pages{position:absolute;inset:0;overflow:hidden}
.side{position:absolute;top:0;bottom:0;right:0;z-index:40;width:50%;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;background:#FFFFFF;color:#001040;scroll-behavior:smooth;transform:translateX(100%);visibility:hidden;transition:transform .45s cubic-bezier(.16,1,.3,1),visibility 0s linear .45s}
.pages.alt .side{transform:none;visibility:visible;transition:transform .45s cubic-bezier(.16,1,.3,1),visibility 0s}
.veil{position:absolute;top:0;bottom:0;left:0;right:50%;z-index:35;background:rgba(255,255,255,.25);opacity:0;pointer-events:none;transition:opacity .35s ease}
.pages.alt .veil{opacity:1;pointer-events:auto;cursor:pointer}
.pages.alt .scroller{transform:translateX(-50%);filter:blur(3px)}
.scroller{position:absolute;top:0;bottom:0;left:0;width:100%;transition:transform .45s cubic-bezier(.16,1,.3,1),filter .35s ease;overflow-y:auto;overflow-x:hidden;scroll-behavior:smooth}
.top{display:flex;justify-content:space-between;align-items:center;gap:24px;height:40px;padding:0 204px 0 40px;background:#001040;color:#FFFFFF;font-size:14px;font-weight:500;white-space:nowrap}
.topics{display:flex;gap:24px;font-family:'League Gothic Soft',sans-serif;font-size:18px;letter-spacing:.02em}
.nav{position:sticky;top:0;z-index:20;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 40px}
.herowrap{position:relative;background:#001040}
.shade{position:absolute;left:0;right:0;top:0;height:240px;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(0,16,64,.72),rgba(0,16,64,.38) 50%,rgba(0,16,64,0));animation:shadeIn 1s cubic-bezier(.16,1,.3,1) both}
@keyframes shadeIn{from{transform:translateY(-100%);opacity:0}to{transform:none;opacity:1}}
.logo{position:relative;display:block}
.logo img{position:absolute;inset:0;width:100%;height:100%}
.links{display:flex;gap:44px;font-weight:500}
.links a{display:inline-flex;align-items:center;transition:opacity .25s}
.links .ar{display:inline-block;width:0;overflow:hidden;opacity:0;transition:width .35s cubic-bezier(.16,1,.3,1),opacity .35s,margin .35s cubic-bezier(.16,1,.3,1)}
.links a:hover{text-decoration:none}
.nav:not(.solid) .links a:hover{opacity:.75}
.nav.solid .links a:hover .ar{width:1em;margin-right:6px;opacity:1}
.book{position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:center;width:180px;height:40px;margin:0 0 -40px auto;font-size:17px;font-weight:500}
.book{transition:background-color .25s,color .25s}
.book:hover{text-decoration:none}
.hero{display:block;width:100%;height:max(240px,calc(100dvh - 80px));object-fit:cover;object-position:50% 50%;background:#001040}
.band{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:20px;row-gap:40px;align-items:stretch;padding:82px 40px 52px;background:#001040;color:#FFFFFF}
.count{grid-column:1 / span 4;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:20px}
.cell{display:flex;flex-direction:column;align-items:center;justify-content:space-between;gap:12px}
.box{display:flex;align-items:center;justify-content:center;width:100%;aspect-ratio:95 / 142;background:#FFFFFF;color:#001040;font-size:44px;font-weight:300;font-variant-numeric:tabular-nums}
.lab{margin:0;font-size:17px;font-weight:500;line-height:1.25}
.stats{grid-column:5 / span 4;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));text-align:center}
.stat{display:flex;flex-direction:column;justify-content:space-between;align-items:center}
.num{margin:0;font-family:'League Gothic Soft',sans-serif;font-size:100px;line-height:.9;letter-spacing:normal}
.acts{grid-column:9 / span 4;display:flex;flex-direction:column}
/* ATA row fill (Sponsor/Programme/Register rows): a white fill slides in from the edge the pointer enters
   and out through the edge it leaves; meanwhile the text turns pink and insets 14px */
.sched{position:relative;overflow:hidden;display:flex;align-items:center;flex:1;min-height:65px;padding:0 24px;border-top:1px solid rgba(255,255,255,.7);font-size:26px;font-weight:500}
.sched:hover{text-decoration:none}
.pk-bg{position:absolute;inset:0;background:#FFFFFF;z-index:0;pointer-events:none}
.pk-c{position:relative;z-index:1;transition:color .2s,padding .3s}
.sched.on .pk-c{color:#001040;padding-left:14px}
@media (hover:none){.pk-bg{display:none}}
/* one animation only: on hover an arrow slides in from the left, on the left of the text, pushing the text in */
.cta{display:flex;align-items:center;height:92px;box-sizing:border-box;padding:0 24px;background:#FFFFFF;color:#001040;font-family:'League Gothic Soft',sans-serif;font-size:32px;letter-spacing:normal}
.cta:hover,.cta:focus-visible{text-decoration:none}
.arw{display:inline-block;width:0;overflow:hidden;transition:width .35s cubic-bezier(.16,1,.3,1),margin .35s cubic-bezier(.16,1,.3,1)}
.arw i{display:inline-block;font-style:normal;opacity:0;transform:translateX(-100%);transition:transform .35s cubic-bezier(.16,1,.3,1),opacity .3s}
.cta:hover .arw,.cta:focus-visible .arw{width:1em;margin-right:12px}
.cta:hover .arw i,.cta:focus-visible .arw i{opacity:1;transform:none}
.split{position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
.split img{display:block;width:100%;height:clamp(360px,43vw,620px);object-fit:cover}
.over{position:absolute;inset:auto 0 -40px 0;z-index:2;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:20px;padding:0 40px;pointer-events:none}
.card{grid-column:4 / span 6;box-sizing:border-box;padding:32px 36px 28px;background:#FFFFFF;color:#001040;pointer-events:auto}
/* card link: navy at 40%; on hover it goes solid and a right-to-left arrow slides in on the right, pushing the text left */
.more{display:flex;justify-content:flex-end;align-items:center;color:#001040;opacity:.4;font-size:20px;font-weight:600;transition:opacity .25s}
.more .ar{display:inline-block;width:0;overflow:hidden;opacity:0;transition:width .35s cubic-bezier(.16,1,.3,1),opacity .35s,margin .35s cubic-bezier(.16,1,.3,1)}
.more:hover,.more:focus-visible{opacity:1;text-decoration:none}
.more:hover .ar,.more:focus-visible .ar{width:1em;margin-left:6px;opacity:1}
/* section titles: League Gothic Soft in navy over a thin navy rule */
.stitle{margin:0;padding-bottom:6px;border-bottom:1px solid rgba(0,16,64,.35);font-family:'League Gothic Soft',sans-serif;font-weight:400;font-size:48px;line-height:1.1;letter-spacing:normal;color:#550000}
/* events: a sideways row of 4-column cards running off the right edge */
.evts{padding:200px 0 0}
.ehead{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin:0 40px;padding-bottom:10px;border-bottom:1px solid rgba(0,16,64,.35)}
.ehead .stitle{padding:0;border:0}
.arws{display:flex;gap:10px}
.arws button{width:44px;height:44px;display:flex;align-items:center;justify-content:center;padding:0;border:1px solid #001040;border-radius:50%;background:#FFFFFF;color:#001040;font-size:20px;line-height:1;cursor:pointer;transition:background .25s,color .25s,opacity .25s}
.arws button:hover,.arws button:focus-visible{background:#001040;color:#FFFFFF}
.arws button.off{opacity:.25;pointer-events:none}
.track{display:flex;gap:20px;overflow-x:auto;padding:24px 40px 0;scrollbar-width:none}
.track::-webkit-scrollbar{display:none}
.ev{flex:0 0 calc((100% - 220px) / 12 * 4 + 60px);color:#001040}
.ev:hover{text-decoration:none}
/* the picture is the button (ECO sector lift): inside its frame the picture rises and the text button slides up under it */
.pic{position:relative;display:block;overflow:hidden;border-radius:6px;aspect-ratio:440 / 268}
.pic img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.16,1,.3,1)}
.go{position:absolute;left:0;right:0;bottom:0;height:56px;display:flex;align-items:center;padding:0 16px;background:#FFFFFF;color:rgba(0,16,64,.4);font-size:20px;font-weight:600;text-transform:uppercase;transform:translateY(100%);transition:transform .5s cubic-bezier(.16,1,.3,1)}
.go svg{width:.8em;margin-right:.3em;flex:none}
.ev:hover .pic img,.ev:focus-visible .pic img{transform:translateY(-56px)}
.ev:hover .go,.ev:focus-visible .go{transform:none}
.evt{margin:18px 0 0;font-size:18px;font-weight:600;line-height:1.3}
/* venue: centred title, image across columns 2-11 with the address card on it, copy across columns 3-10 */
.venue{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:20px;padding:150px 40px}
.venue .stitle{grid-column:4 / span 6;text-align:center}
.vpic{grid-column:2 / span 10;position:relative;margin-top:18px}
.vpic img{display:block;width:100%;aspect-ratio:1130 / 797;object-fit:cover;border-radius:6px}
.vcard{position:absolute;left:24px;bottom:22px;width:min(417px,calc(100% - 48px));box-sizing:border-box;padding:24px 28px 20px;background:#FFFFFF;color:#001040}
.vcard p{margin:0 0 26px;font-size:24px;line-height:1.25}
/* map link: the arrow comes in on the left and pushes the text right */
.vcard .more:hover .ar,.vcard .more:focus-visible .ar{margin:0 6px 0 0}
.vcard .more{justify-content:flex-start;font-size:16px;font-weight:500;text-transform:uppercase}
.vtext{grid-column:3 / span 8;margin:14px 0 0;font-size:24px;font-weight:600;line-height:1.35;color:#001040}
/* VIP: the three cards as on the showcase board, copy on columns 3-7, perks on 8-10 */
.vip,.join{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:20px;padding:0 40px 150px;color:#001040}
.vip .stitle,.join .stitle{grid-column:4 / span 6;text-align:center}
.vstage{grid-column:1 / -1;position:relative;height:650px}
.vset{position:absolute;left:50%;top:-30px;width:1440px;height:900px;margin-left:-720px;transform:scale(.8);transform-origin:50% 0;perspective:1800px;perspective-origin:50% 35%}
.vc{position:absolute;top:0;left:0;width:300px;height:475px;transform-style:preserve-3d}
.k1{transform:translate(330px,330px) rotateX(42deg) rotateZ(-24deg)}
.k2{transform:translate(570px,190px) rotateX(42deg) rotateZ(-24deg)}
.k3{transform:translate(810px,50px) rotateX(42deg) rotateZ(-24deg)}
.vc.hot{z-index:2}
.face{position:absolute;inset:0;overflow:hidden;border-radius:16px;box-shadow:0 60px 80px -40px rgba(20,20,40,.35),inset 0 1px 0 rgba(255,255,255,.25),inset 0 0 0 1px rgba(255,255,255,.06);transition:transform .7s cubic-bezier(.16,1,.3,1),box-shadow .7s}
.vc.hot .face{transform:translateZ(70px);box-shadow:0 90px 90px -40px rgba(20,20,40,.3),inset 0 1px 0 rgba(255,255,255,.35),inset 0 0 0 1px rgba(255,255,255,.1)}
.face::before{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;background:radial-gradient(120% 80% at 18% 0%,rgba(255,255,255,.14),rgba(255,255,255,0) 55%),linear-gradient(180deg,rgba(255,255,255,0) 60%,rgba(0,0,0,.06))}
.face::after{content:"";position:absolute;inset:0;z-index:4;pointer-events:none;background:linear-gradient(115deg,rgba(255,255,255,0) 35%,rgba(255,255,255,.2) 47%,rgba(255,255,255,.05) 53%,rgba(255,255,255,0) 65%);background-size:300% 100%;background-position:100% 0;transition:background-position 1.1s cubic-bezier(.16,1,.3,1)}
.vc.hot .face::after{background-position:0% 0}
.face .wv{position:absolute;left:0;top:0;width:300px;height:603px;opacity:0;transition:opacity .6s ease}
.vc.hot .wv{opacity:.2}
.face .lg{position:absolute;left:22px;top:22px;width:78px;height:82px}
.face .vn{position:absolute;left:22px;top:398px;margin:0;font-family:'League Gothic Soft',sans-serif;font-size:38px;line-height:1;letter-spacing:normal;color:#FFFFFF;white-space:nowrap}
.face .vk{position:absolute;left:22px;top:438px;margin:0;font-size:14px;font-weight:600;line-height:1.2;color:#FFFFFF}
.zone{position:absolute;top:0;height:900px;width:260px;z-index:5;padding:0;border:0;background:none;cursor:pointer}
.zone:focus-visible{outline:2px solid #001040;outline-offset:-6px}
.vcopy{grid-column:3 / span 5;margin-top:24px}
.vcopy p{margin:0 0 24px;font-size:20px;font-weight:500;line-height:1.35}
.perks{grid-column:8 / span 3;margin:24px 0 0;padding:0;list-style:none}
.perks li{display:flex;align-items:center;gap:12px;height:48px;border-bottom:1px solid rgba(0,16,64,.35);font-size:16px;font-weight:600}
.perks li:first-child{border-top:1px solid rgba(0,16,64,.35)}
.perks svg{width:20px;height:20px;flex:none}
.vbtn,.send{display:flex;align-items:center;justify-content:center;height:52px;padding:0 32px;border:1px solid #001040;font:600 15px/1 'Inter Soft',sans-serif;letter-spacing:-0.5px;text-transform:uppercase;cursor:pointer;transition:background .25s,color .25s}
.vbtn{grid-column:1 / -1;justify-self:center;margin-top:32px;background:#001040;color:#FFFFFF}
.vbtn:hover,.vbtn:focus-visible{background:#FFFFFF;color:#001040;text-decoration:none}
/* event cards are buttons */
.ev{padding:0;border:0;background:none;font:inherit;letter-spacing:inherit;text-align:left;cursor:pointer}
.ev .evt{display:block}
/* side page: back bar, event detail (picture cols 1-7, text cols 8-12) or the schedule rows, then a full pink ĐĂNG KÝ NGAY box */
.sbar{position:sticky;top:0;z-index:5;display:flex;align-items:center;justify-content:space-between;height:72px;padding:0 40px;background:#FFFFFF;box-shadow:0 1px 0 rgba(0,16,64,.12)}
.back{display:flex;align-items:center;gap:10px;padding:0;border:0;background:none;color:#001040;font:600 18px 'Inter Soft',sans-serif;letter-spacing:-0.5px;cursor:pointer}
.back svg{width:22px;transition:transform .35s cubic-bezier(.16,1,.3,1)}
.back:hover svg,.back:focus-visible svg{transform:translateX(-6px)}
.sbar img{width:40px;height:42px}
.det{padding:40px 40px 80px}
.dimg{display:block;width:100%;aspect-ratio:1000 / 610;object-fit:cover;border-radius:6px}
.dtext{margin-top:32px}
.dmeta{margin:0 0 14px;font-size:16px;font-weight:600;text-transform:uppercase;opacity:.6}
.dtitle{margin:0 0 24px;font-family:'League Gothic Soft',sans-serif;font-weight:400;font-size:48px;line-height:1.02;letter-spacing:normal}
.dhead{margin:0 0 20px;font-size:24px;font-weight:600;line-height:1.3}
.dplace{margin:0 0 20px;padding-bottom:20px;border-bottom:1px solid rgba(0,16,64,.35);font-size:18px;font-weight:500}
.dpts{margin:0;padding:0;list-style:none;font-size:20px;font-weight:500;line-height:1.4}
.dpts li{margin-top:12px;padding-left:22px;text-indent:-22px}
.sch{padding:40px 40px 80px}
.sch-lead{max-width:30em;margin:32px 0 0;font-size:22px;font-weight:600;line-height:1.3}
.sch-h{margin:80px 0 24px;font-family:'League Gothic Soft',sans-serif;font-weight:400;font-size:44px;line-height:1;letter-spacing:normal}
.ag-h{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:20px;padding-bottom:10px;border-bottom:1px solid rgba(0,16,64,.35);font-size:16px;font-weight:500;text-transform:uppercase;color:rgba(0,16,64,.6)}
.ag{border-bottom:1px solid rgba(0,16,64,.35)}
.ag-row{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:20px;align-items:center;width:100%;min-height:64px;padding:14px 0;border:0;background:none;color:inherit;font:500 21px/1.25 'Inter Soft',sans-serif;letter-spacing:-0.5px;text-align:left;cursor:pointer;transition:background-color .25s,color .25s,padding .3s ease}
.ag-row:hover,.ag-row:focus-visible{background:#001040;color:#FFFFFF;padding:14px 24px}
.ag-x{grid-column:12;justify-self:end;font-size:32px;line-height:1;transition:transform .4s cubic-bezier(.33,1,.68,1)}
.ag.open .ag-x{transform:rotate(45deg)}
.ag-body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s cubic-bezier(.33,1,.68,1)}
.ag-body>div{min-height:0;overflow:hidden}
.ag.open .ag-body{grid-template-rows:1fr}
.ag-in{max-width:56em;padding:18px 0 36px}
.ag-in h4{margin:0;font-size:26px;font-weight:600;line-height:1.15}
.ag-in p{margin:10px 0 0;font-size:18px;opacity:.6}
.ag-in ul{margin:0;padding:0;list-style:none;font-size:18px;line-height:1.4}
.ag-in li{margin-top:12px;padding-left:22px;text-indent:-22px}
.dgo{display:flex;align-items:center;justify-content:center;width:100%;height:150px;padding:0;border:0;background:#001040;color:#FFFFFF;font-family:'League Gothic Soft',sans-serif;font-size:60px;letter-spacing:normal;cursor:pointer}
.dgo:hover .arw,.dgo:focus-visible .arw{width:1em;margin-right:20px}
.dgo:hover .arw i,.dgo:focus-visible .arw i{opacity:1;transform:none}
/* footer: contact / event / links, organiser + media logos, footnotes; then the big navy logo */
.foot{padding:60px 40px 0;border-top:1px solid rgba(0,16,64,.35);color:#001040}
.fgrid,.flogos{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:20px}
.fcol{grid-column:span 4}
.fcol:last-child{grid-column:9 / span 4}
.fh{margin:0 0 20px;font-family:'League Gothic Soft',sans-serif;font-weight:400;font-size:32px;line-height:1;letter-spacing:normal}
.fcol p{margin:0 0 12px;font-size:18px;font-weight:500;line-height:1.4}
.fcol a{display:flex;align-items:center;width:fit-content;margin-bottom:12px;font-size:18px;font-weight:600;line-height:1.4}
.fcol a:hover{text-decoration:none}
.fcol a{border-radius:2px;transition:background-color .4s ease,color .4s ease,box-shadow .4s ease}
.fcol .ar{display:inline-block;width:0;overflow:hidden;opacity:0;transition:width .35s cubic-bezier(.16,1,.3,1),opacity .35s,margin .35s cubic-bezier(.16,1,.3,1)}
.fcol a:hover .ar,.fcol a:focus-visible .ar{width:1em;margin-right:6px;opacity:1}
.flogos{margin-bottom:60px;padding-bottom:40px;border-bottom:1px solid rgba(0,16,64,.15)}
.g1{grid-column:1 / span 4}
.g2{grid-column:5 / span 8}
.fcap{margin:0 0 18px;font-size:13px;font-weight:500;text-transform:uppercase;opacity:.6}
.frow{display:flex;align-items:center;flex-wrap:wrap;gap:20px 40px}
.frow img{display:block;height:56px;width:auto;max-width:180px;object-fit:contain}
.fnotes{margin-top:40px;padding:24px 0;border-top:1px solid rgba(0,16,64,.15);font-size:14px;font-weight:500;line-height:1.5;opacity:.6}
.fnotes p{margin:0 0 6px}
.biglogo{width:min(905px,calc(100% - 80px));aspect-ratio:600 / 634;margin:60px auto 80px;background:#001040;-webkit-mask:url(/blob/02b7f606e623da811efb1a1919b0cc52.svg) center / contain no-repeat;mask:url(/blob/02b7f606e623da811efb1a1919b0cc52.svg) center / contain no-repeat}
/* FAQ chatbot: a round button bottom-right opens a small panel that only answers the FAQ and sends everything else to Liên Hệ */
.cb-btn{position:absolute;right:24px;bottom:24px;z-index:61;display:flex;align-items:center;justify-content:center;width:60px;height:60px;padding:0;border:0;border-radius:50%;background:#550000;color:#FFFFFF;box-shadow:0 12px 30px -10px rgba(85,0,0,.6);cursor:pointer;transition:transform .35s cubic-bezier(.16,1,.3,1)}
.cb-btn:hover,.cb-btn:focus-visible{transform:scale(1.06)}
.cb-btn svg{position:absolute;width:28px;height:28px;transition:opacity .25s,transform .45s cubic-bezier(.16,1,.3,1)}
.cb-btn .ic-x{opacity:0;transform:rotate(-90deg)}
.cb-btn.on .ic-chat{opacity:0;transform:rotate(90deg)}
.cb-btn.on .ic-x{opacity:1;transform:none}
/* the white panel grows out of the pink button: a circle clip from the bottom-right corner to the top-left;
   its bottom-right corner is rounded to sit around the button */
.cb{position:absolute;right:16px;bottom:16px;z-index:60;display:flex;flex-direction:column;width:min(380px,calc(100% - 32px));height:min(580px,calc(100% - 32px));overflow:hidden;border-radius:14px 14px 38px 14px;background:#FFFFFF;color:#001040;box-shadow:0 30px 60px -20px rgba(0,16,64,.45),0 0 0 1px rgba(0,16,64,.08);clip-path:circle(30px at calc(100% - 38px) calc(100% - 38px));visibility:hidden;pointer-events:none;transition:clip-path .6s cubic-bezier(.65,0,.35,1),visibility 0s linear .6s}
.cb.open{clip-path:circle(150% at calc(100% - 38px) calc(100% - 38px));visibility:visible;pointer-events:auto;transition:clip-path .6s cubic-bezier(.65,0,.35,1),visibility 0s}
.cb-head{padding:18px 20px 14px;border-bottom:1px solid rgba(0,16,64,.12)}
.cb-head b{display:block;font-family:'League Gothic Soft',sans-serif;font-weight:400;font-size:28px;line-height:1;letter-spacing:normal}
.cb-head small{display:block;margin-top:4px;font-size:12px;font-weight:500;opacity:.6}
.cb-note{margin:0;padding:10px 18px;background:#FDE6F1;font-size:13px;font-weight:500;line-height:1.4}
.cb-log{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:16px 18px;display:flex;flex-direction:column;gap:10px}
.cb-m{max-width:85%;margin:0;padding:10px 14px;border-radius:14px;font-size:15px;font-weight:500;line-height:1.4}
.cb-m.bot{align-self:flex-start;background:#F1F2F6;border-bottom-left-radius:4px}
.cb-m.me{align-self:flex-end;background:#001040;color:#FFFFFF;border-bottom-right-radius:4px}
.cb-go{display:inline-flex;align-items:center;gap:6px;margin-top:8px;padding:0;border:0;background:none;color:#550000;font:600 14px 'Inter Soft',sans-serif;letter-spacing:-0.5px;cursor:pointer}
.cb-chips{display:flex;flex-wrap:wrap;gap:6px;padding:0 18px 12px}
.cb-chip{padding:7px 12px;border:1px solid rgba(0,16,64,.25);border-radius:16px;background:#FFFFFF;color:#001040;font:500 13px 'Inter Soft',sans-serif;letter-spacing:-0.5px;cursor:pointer;transition:border-color .25s}
.cb-chip:hover,.cb-chip:focus-visible{border-color:#001040}
.cb-in{display:flex;gap:8px;padding:12px 92px 22px 18px;border-top:1px solid rgba(0,16,64,.12)}
.cb-in input{flex:1;min-width:0;height:42px;padding:0 14px;border:1px solid rgba(0,16,64,.25);border-radius:21px;outline:0;font:500 15px 'Inter Soft',sans-serif;letter-spacing:-0.5px;color:#001040}
.cb-in input:focus{border-color:#001040}
.cb-in button{height:42px;padding:0 16px;border:0;border-radius:21px;background:#550000;color:#FFFFFF;font:600 14px 'Inter Soft',sans-serif;letter-spacing:-0.5px;cursor:pointer}
/* FAQ: the Main board's line rows in navy on white; hover fills the row navy */
.faq{padding:0 40px 150px;color:#001040}
.faq .stitle{width:calc((100% - 220px) / 12 * 6 + 100px);margin:0 auto 40px;text-align:center}
.qa{border-bottom:1px solid rgba(0,16,64,.35)}
.qa:first-of-type{border-top:1px solid rgba(0,16,64,.35)}
.qa-row{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:20px;align-items:center;width:100%;min-height:72px;padding:14px 0;border:0;background:none;color:inherit;font:500 28px/1.2 'Inter Soft',sans-serif;letter-spacing:-0.5px;text-align:left;cursor:pointer;transition:background-color .25s,color .25s,padding .3s ease}
.qa-row:hover,.qa-row:focus-visible{background:#001040;color:#FFFFFF;padding:14px 24px}
.qa-row span:first-child{grid-column:1 / 12}
.qa-x{grid-column:12;justify-self:end;font-size:32px;line-height:1;transition:transform .4s cubic-bezier(.33,1,.68,1)}
.qa.open .qa-x{transform:rotate(45deg)}
.qa-body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s cubic-bezier(.33,1,.68,1)}
.qa-body>div{min-height:0;overflow:hidden}
.qa.open .qa-body{grid-template-rows:1fr}
.qa-body p{margin:0;padding:18px 0 36px;max-width:34em;font-size:24px;line-height:1.3}
/* Tham Gia Ngay: underline fields on columns 3-10, the send button on 8-10 beside the email */
.jlead{grid-column:3 / span 8;margin:32px 0 16px;font-size:24px;font-weight:600;line-height:1.35}
.fld{display:flex;flex-direction:column;margin-top:40px;border-bottom:1px solid rgba(0,16,64,.35)}
.fld span{font-size:13px;font-weight:500;opacity:.6}
.fld input{width:100%;box-sizing:border-box;height:40px;padding:0;border:0;outline:0;background:none;font:500 20px 'Inter Soft',sans-serif;letter-spacing:-0.5px;color:#001040}
.fld:focus-within{border-bottom-color:#001040}
.f-name{grid-column:3 / span 8}
.f-mail{grid-column:3 / span 4}
.f-tel{grid-column:3 / span 4;flex-direction:row;align-items:center;gap:12px}
.f-tel b{padding-right:12px;border-right:1px solid rgba(0,16,64,.35);font-size:20px;font-weight:600;line-height:1}
.send{grid-column:8 / span 3;margin-top:40px;background:#FFFFFF;color:#001040}
/* event tab: click to open the list (grid rows 0fr -> 1fr), pick one and it closes */
.pick{grid-column:3 / span 8;margin-top:40px;border-bottom:1px solid rgba(0,16,64,.35)}
.ptab{display:flex;align-items:center;justify-content:space-between;width:100%;padding:0 0 8px;border:0;background:none;color:#001040;text-align:left;cursor:pointer}
.ptab small{display:block;font:500 13px 'Inter Soft',sans-serif;letter-spacing:-0.5px;opacity:.6}
.ptab b{display:block;margin-top:10px;font:500 20px 'Inter Soft',sans-serif;letter-spacing:-0.5px}
.ptab svg{width:24px;flex:none;transition:transform .4s cubic-bezier(.16,1,.3,1)}
.pick.open .ptab svg{transform:rotate(180deg)}
.drop,.cpanel{display:grid;grid-template-rows:0fr;transition:grid-template-rows .45s cubic-bezier(.16,1,.3,1)}
.pick.open .drop,.cpanel.open{grid-template-rows:1fr}
.dropin{overflow:hidden;min-height:0}
.opt{display:flex;align-items:center;width:100%;height:52px;padding:0;border:0;border-top:1px solid rgba(0,16,64,.15);background:none;color:rgba(0,16,64,.55);font:500 18px 'Inter Soft',sans-serif;letter-spacing:-0.5px;text-align:left;cursor:pointer;transition:color .25s}
.opt svg{width:0;height:20px;margin-right:0;opacity:0;flex:none;transition:width .35s cubic-bezier(.16,1,.3,1),margin .35s cubic-bezier(.16,1,.3,1),opacity .35s}
.opt:hover,.opt:focus-visible,.opt.on{color:#001040}
.opt:hover svg,.opt:focus-visible svg,.opt.on svg{width:20px;margin-right:12px;opacity:1}
.opt.on svg{opacity:1}
/* card checkbox: ticking it drops the colour + name fields with a live preview */
.cbox{grid-column:3 / span 8;display:flex;align-items:center;gap:14px;margin-top:40px;padding:0;border:0;background:none;color:#001040;font:600 20px 'Inter Soft',sans-serif;letter-spacing:-0.5px;text-align:left;cursor:pointer}
.tick{position:relative;width:26px;height:26px;flex:none;box-sizing:border-box;border:1.5px solid #001040;border-radius:50%}
.tick svg{position:absolute;inset:-2px;width:28px;height:28px;opacity:0;transform:scale(.6);transition:opacity .25s,transform .35s cubic-bezier(.16,1,.3,1)}
.cbox.on .tick svg{opacity:1;transform:none}
.cpanel{grid-column:3 / span 8}
.cgrid{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));column-gap:20px;padding-top:28px}
.cfields{grid-column:1 / span 5}
.clab{margin:0 0 12px;font-size:13px;font-weight:500;opacity:.6}
.sws{display:flex;gap:12px}
.sw{display:flex;align-items:center;gap:10px;height:44px;padding:0 18px 0 8px;border:1px solid rgba(0,16,64,.25);border-radius:22px;background:#FFFFFF;color:#001040;font:600 16px 'Inter Soft',sans-serif;letter-spacing:-0.5px;cursor:pointer;transition:border-color .25s}
.sw i{width:28px;height:28px;border-radius:50%}
.sw:hover,.sw.on{border-color:#001040}
.sw.on{box-shadow:inset 0 0 0 1px #001040}
.cfields .fld{margin-top:28px}
.mini{grid-column:6 / span 3;position:relative;justify-self:end;width:160px;height:253px;border-radius:9px;overflow:hidden;box-shadow:0 30px 40px -24px rgba(20,20,40,.4);transition:background .35s}
.mini img{position:absolute;left:12px;top:12px;width:42px;height:44px}
.mini .mn{position:absolute;left:12px;bottom:34px;margin:0;font-family:'League Gothic Soft',sans-serif;font-size:21px;line-height:1;letter-spacing:normal;color:#FFFFFF}
.mini .mk{position:absolute;left:12px;right:12px;bottom:14px;margin:0;overflow:hidden;font-size:10px;font-weight:600;line-height:1.2;color:#FFFFFF;text-transform:uppercase;white-space:nowrap;text-overflow:ellipsis}
.send:hover,.send:focus-visible{background:#001040;color:#FFFFFF}
.jmsg{grid-column:3 / span 8;min-height:24px;margin:24px 0 0;font-size:16px;font-weight:500}
@media (max-width:1100px){.vip .stitle,.join .stitle{grid-column:2 / span 10}.vcopy{grid-column:2 / span 6}.perks{grid-column:8 / span 4}.jlead,.f-name,.jmsg,.pick,.cbox,.cpanel{grid-column:2 / span 10}.f-mail,.f-tel{grid-column:2 / span 5}.venue .stitle{grid-column:2 / span 10}.vtext{grid-column:2 / span 10}.topics{display:none}.count,.stats,.acts{grid-column:1 / -1}.acts{flex-direction:row;align-items:stretch}.sched,.cta{flex:1}.card{grid-column:2 / span 10}}
@media (max-width:860px){.dimg,.dtext,.fcol,.fcol:last-child,.g1,.g2{grid-column:1 / -1}.dtext{margin-top:32px}.fcol{margin-bottom:32px}.g2{margin-top:32px}.side{width:100%}.dgo{height:120px;font-size:48px}.faq .stitle{width:auto}.qa-row{font-size:22px}.vstage{height:400px}.vset{top:-14px;transform:scale(.45)}.vip>*,.join>*{grid-column:1 / -1 !important}.send{margin-top:32px}.ev{flex-basis:70%}.vpic,.vtext,.venue .stitle{grid-column:1 / -1}.links{display:none}.num{font-size:72px}}
@media (max-width:700px){.welcome{display:none}.split{grid-template-columns:minmax(0,1fr)}.over{position:static;padding:0}.card{grid-column:1 / -1}.acts{flex-direction:column}}

.card h2,.fh,.dtitle,.sch-h{color:#550000}
