/* ============================================================
   sme.gaas.com.vn · TRANG ĐẦY ĐỦ, dựng trên nền phương án hero A
   Thứ tự mục: hero · dải chạy 7 trạm · chỗ đứt · vòng 7 trạm ·
               nhóm (tạm ẩn) · kêu gọi cuối · chân trang
   Token mau va bo goc theo refs/DESIGN.md muc 2 va muc 4
   ============================================================ */

:root{
  --sky:#1A6DB5;
  --sky-deep:#00264D;
  --sky-mist:#D9E6F3;
  --paper:#F6F9FC;
  --ink:#0E1B2A;
  --ink-soft:#5C6C7E;
  --scarlet:#C8102E;
  --glass:rgba(255,255,255,.55);
  --glass-line:rgba(255,255,255,.7);

  /* Bo goc theo cap bac, DESIGN.md muc 4 */
  --r-frame:32px;
  --r-card:24px;
  --r-glass:18px;
  --r-pill:999px;
  --r-input:14px;

  --ease:cubic-bezier(0.22,1,0.36,1);
  --wrap:1240px;
}

*,*::before,*::after{box-sizing:border-box}
html{
  -webkit-text-size-adjust:100%;scroll-behavior:smooth;
  scroll-padding-top:110px;      /* thanh dau trang noi cao 82px */
  scroll-padding-bottom:88px;    /* thanh dinh day tren dien thoai */
}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:'Be Vietnam Pro',system-ui,sans-serif;
  font-size:16px;line-height:1.6;overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:var(--sky)}
:focus-visible{outline:2px solid var(--sky);outline-offset:3px;border-radius:4px}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 48px}

/* Nhieu hat 3%, phu toan trang */
.grain{
  position:fixed;inset:0;pointer-events:none;z-index:60;opacity:.03;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ---------- Kieu chu dung chung ---------- */
.h2{
  margin:0;font-family:'Be Vietnam Pro',sans-serif;
  
  font-size:clamp(28px,3.3vw,46px);line-height:1.2;letter-spacing:-.01em;color:var(--sky-deep);font-weight:600
}
.h3{
  margin:0;font-family:'Be Vietnam Pro',sans-serif;
  
  font-size:20px;line-height:1.25;letter-spacing:-.01em;color:var(--sky-deep);font-weight:600
}
.lede{margin:18px 0 0;font-size:18px;line-height:1.6;color:color-mix(in srgb,var(--ink) 72%,var(--ink-soft));max-width:62ch}

.tag{
  display:inline-flex;align-items:center;gap:8px;height:32px;padding:0 14px;
  border-radius:var(--r-pill);background:rgba(255,255,255,.72);border:1px solid var(--glass-line);
  font-size:14px;font-weight:500;letter-spacing:.01em;color:var(--sky-deep);
}
.tag svg{width:16px;height:16px;color:var(--sky)}

/* ============================ HEADER ============================ */
.topbar{position:fixed;top:18px;left:0;right:0;z-index:40;transition:top .25s var(--ease)}
/* menu di theo khi cuon; qua khoi dau trang thi nen kinh dac hon de doc duoc tren nen xanh dam */
.topbar.is-scrolled{top:10px}
.topbar.is-scrolled .topbar__frame{background:rgba(255,255,255,.9);box-shadow:0 1px 0 var(--glass-line) inset,0 14px 34px -20px rgba(0,38,77,.45)}
.topbar__frame{
  display:flex;align-items:center;gap:32px;height:64px;padding:0 12px 0 24px;
  border-radius:var(--r-frame);
  background:rgba(255,255,255,.62);border:1px solid var(--glass-line);
  box-shadow:0 1px 0 var(--glass-line) inset,0 18px 40px -26px rgba(26,109,181,.35);
  backdrop-filter:blur(16px) saturate(140%);-webkit-backdrop-filter:blur(16px) saturate(140%);
}
.brand{display:flex;align-items:center;flex:0 0 auto}
.brand img{height:30px;width:auto}
.nav{display:flex;align-items:center;gap:26px;margin-left:auto}
.nav a{
  font-size:16px;font-weight:500;color:var(--ink);text-decoration:none;
  padding:6px 2px;border-bottom:1px solid transparent;transition:border-color .2s var(--ease),color .2s var(--ease);
}
.nav a:hover{color:var(--sky);border-bottom-color:var(--sky)}
.nav a[aria-current="page"]{color:var(--sky)}

/* ---------- Nut ---------- */
.btn{
  display:inline-flex;align-items:center;gap:10px;
  font-family:'Be Vietnam Pro',sans-serif;font-size:16px;font-weight:600;line-height:1;
  white-space:nowrap;text-decoration:none;cursor:pointer;
  border-radius:var(--r-pill);border:1px solid transparent;
  transition:background-color .2s var(--ease),border-color .2s var(--ease),color .2s var(--ease);
}
.btn__ring{
  display:inline-flex;align-items:center;justify-content:center;
  width:26px;height:26px;border-radius:999px;background:#fff;color:var(--sky);flex:0 0 26px;
}
.btn__ring svg{width:15px;height:15px}
.btn-primary{background:var(--scarlet);color:#fff;height:46px;padding:0 6px 0 20px}
.btn-primary .btn__ring{color:var(--scarlet)}
.btn-primary:hover{background:color-mix(in srgb, var(--scarlet) 80%, var(--ink))}
.btn-ghost{background:transparent;color:var(--sky-deep);height:48px;padding:0 6px 0 22px;border-color:rgba(26,109,181,.42)}
.btn-ghost:hover{background:rgba(26,109,181,.08);border-color:var(--sky)}
.btn-ghost .btn__ring{background:var(--sky);color:#fff}
/* Nut khoi: KHONG BAO GIO de chu bi cat.
   Mui ten 26px + khoang cach chiem 70px co dinh, nen chu dai trong the hep se tran.
   Hai lop: (1) siet khoang cach de giu mot dong trong hau het truong hop,
   (2) cho xuong dong lam luoi an toan — chu xuong dong van doc duoc, chu bi cat thi khong. */
.btn-block{width:100%;justify-content:center;height:auto;min-height:50px;padding:10px 14px;
  font-size:16px;gap:8px;white-space:normal;line-height:1.25;text-align:center;
  /* Chia dong CAN hai ben thay vi de mot hai chu le loi o dong duoi.
     Trinh duyet cu bo qua thuoc tinh nay, chu van xuong dong binh thuong. */
  text-wrap:balance}
.btn-block .btn__ring{margin-left:0}
/* Thanh dinh day luon mot dong: cho hep, xuong dong se lam thanh cao len che mat trang. */
.stickybar .btn-block{white-space:nowrap;height:48px;min-height:48px;padding:0 14px}

/* ============================ 1 · HERO ============================ */
.hero{position:relative;padding:112px 0 0;isolation:isolate;overflow:hidden}
.hero::before{
  content:"";position:absolute;inset:0;z-index:-2;
  background:
    radial-gradient(120% 90% at 52% 8%, var(--sky-mist) 0%, rgba(217,230,243,.55) 42%, var(--paper) 78%),
    var(--paper);
}
.hero__ticks{position:absolute;inset:0;z-index:-1;pointer-events:none}
.hero__ticks i{position:absolute;width:24px;height:1px;background:rgba(26,109,181,.26);transform:rotate(-24deg);display:block}
.hero__ticks i:nth-child(1){top:22%;left:6%}
.hero__ticks i:nth-child(2){top:64%;left:3%;transform:rotate(18deg)}
.hero__ticks i:nth-child(3){top:14%;right:8%;transform:rotate(12deg)}
.hero__ticks i:nth-child(4){top:76%;right:5%;transform:rotate(-16deg)}
.hero__ticks i:nth-child(5){top:47%;left:47%;transform:rotate(30deg)}

.wordmark{
  position:absolute;left:50%;transform:translateX(-50%);
  z-index:-1;pointer-events:none;user-select:none;white-space:nowrap;
  font-family:'Be Vietnam Pro',sans-serif;
  
  line-height:.8;letter-spacing:-.04em;color:#fff;font-weight:200
}
.hero .wordmark{top:-84px;font-size:48vw;opacity:.78;animation:wm-in 1.2s var(--ease) both}

.hero__grid{
  position:relative;display:grid;grid-template-columns:repeat(12,1fr);gap:24px;
  align-items:start;padding-bottom:104px;
}
.hero__copy{grid-column:1 / span 5;position:relative;z-index:3}
.hero__formcol{grid-column:9 / span 4;position:relative;z-index:4}
.hero__copy .tag{animation:rise .6s var(--ease) both}

.hero-h1{
  margin:20px 0 0;max-width:500px;
  font-family:'Be Vietnam Pro',sans-serif;
  
  font-size:clamp(34px,3.5vw,50px);
  line-height:1.18;letter-spacing:-.01em;color:var(--sky-deep);
  animation:rise .7s var(--ease) .12s both;font-weight:600
}
/* Chu trong vien thuoc, dung dung 1 lan tren toan trang */
.pill-word{display:inline-block;background:var(--scarlet);color:#fff;border-radius:var(--r-pill);padding:.02em .3em .1em;margin-top:.06em}

.hero-lead{margin:20px 0 0;max-width:500px;font-size:18px;line-height:1.6;color:color-mix(in srgb,var(--ink) 72%,var(--ink-soft));animation:rise .7s var(--ease) .2s both}
.benefits{list-style:none;margin:26px 0 0;padding:0;display:grid;gap:14px;animation:rise .7s var(--ease) .28s both}
.benefits li{display:flex;gap:12px;align-items:flex-start;font-size:16px;color:var(--ink);max-width:540px}
.benefits li span{text-wrap:balance}
.benefits svg{width:22px;height:22px;flex:0 0 22px;margin-top:2px;color:var(--sky)}
.hero-secondary{margin-top:30px;animation:rise .7s var(--ease) .36s both}

/* Hinh xem truoc to so do A3 (297x420), chen giua hai cot.
   Minh hoa san pham tu dung: mot to giay that, nghieng nhe, co to thu hai lap lo phia sau.
   Giay la vat the in, nen bo goc 6px theo giay that, khong theo cap bo goc cua the giao dien. */
.stage{position:absolute;top:128px;left:calc(50% + 50px);transform:translateX(-50%);width:248px;z-index:2}
.sheet{position:relative;margin:0;animation:rise .8s var(--ease) .1s both}
.sheet__back,.sheet__paper{border-radius:6px;aspect-ratio:297 / 420}
.sheet__back{
  position:absolute;inset:0;transform:translate(-16px,12px) rotate(-4deg);
  background:color-mix(in srgb, var(--sky-mist) 60%, #fff);
  border:1px solid rgba(14,27,42,.08);
  box-shadow:0 30px 50px -34px rgba(0,38,77,.42);
}
.sheet__paper{
  position:relative;background:#fff;transform:rotate(2.6deg);overflow:hidden;
  border:1px solid rgba(14,27,42,.1);
  box-shadow:0 1px 0 #fff inset,0 2px 6px rgba(26,109,181,.1),0 42px 70px -34px rgba(0,38,77,.52);
}
.sheet__paper svg{display:block;width:100%;height:100%}
/* chu va hinh tren to giay, gan vao bien mau da chot */
.sheet text{font-family:'Be Vietnam Pro',sans-serif}
.sheet .sv-h{font-family:'Be Vietnam Pro',sans-serif;font-size:15.5px;letter-spacing:-.01em;fill:var(--sky-deep);font-weight:700}
.sheet .sv-s{font-size:7.4px;font-weight:500;fill:var(--ink-soft)}
.sheet .sv-f{font-size:6.4px;font-weight:500;fill:var(--ink-soft)}
.sheet .sv-rule{stroke:rgba(14,27,42,.12);stroke-width:.8}
.sheet .sv-cell{fill:#fff;stroke:color-mix(in srgb, var(--sky) 34%, #fff);stroke-width:.8}
.sheet .sv-mist{fill:var(--sky-mist)}
.sheet .sv-deep{fill:var(--sky-deep)}
.sheet .sv-no{font-family:'Be Vietnam Pro',sans-serif;font-size:11px;fill:var(--sky);font-weight:700}
.sheet .sv-chip{fill:var(--sky-deep)}
.sheet .sv-chipt{font-size:6.4px;font-weight:700;fill:#fff;text-anchor:middle}
.sheet .sv-nm{font-size:7px;font-weight:600;fill:var(--sky-deep)}
.sheet .sv-box{fill:none;stroke:var(--sky);stroke-width:1.1}
.sheet .sv-rise{font-family:'Be Vietnam Pro',sans-serif;font-size:21px;letter-spacing:1px;fill:var(--sky);text-anchor:middle;font-weight:700}
.sheet .sv-rs{font-size:6.6px;font-weight:600;fill:var(--sky-deep);text-anchor:middle}
.sheet .sv-lp{font-size:7px;font-weight:600;fill:#fff}
.sheet .sv-w{fill:#fff}
.sheet .sv-arr{fill:var(--sky)}
/* duong quay ve 7 ve 1, luot do thu 2 tren trang */
.sheet .sv-back{color:var(--scarlet)}

/* ---------- The kinh noi ---------- */
.glass{
  background:var(--glass);border:1px solid var(--glass-line);
  box-shadow:0 1px 0 var(--glass-line) inset,0 24px 48px -24px rgba(26,109,181,.28);
  backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%);
}
@supports not ((backdrop-filter:blur(2px)) or (-webkit-backdrop-filter:blur(2px))){
  .glass,.topbar__frame{background:rgba(255,255,255,.88)}
  .cta .glass{background:#fff}
}
@media (prefers-reduced-transparency:reduce){
  .glass,.topbar__frame{background:rgba(255,255,255,.93);backdrop-filter:none;-webkit-backdrop-filter:none}
  .cta .glass{background:#fff}
}

.gcard{position:absolute;border-radius:var(--r-glass);animation:drift 7s ease-in-out infinite}
.gcard__in{display:block;padding:14px 16px;border-radius:var(--r-glass);animation:rise .6s var(--ease) both}
.gcard__k{
  display:block;font-family:'Be Vietnam Pro',sans-serif;
  
  font-size:28px;line-height:1;letter-spacing:-.01em;color:var(--sky-deep);font-weight:600
}
.gcard__t{display:block;margin-top:6px;font-size:14px;font-weight:500;color:var(--ink-soft);line-height:1.35}
.gcard__lab{display:flex;align-items:center;gap:7px;margin-bottom:8px;font-size:14px;font-weight:500;color:var(--sky)}
.gcard__lab svg{width:18px;height:18px}

.gcard--a{--rot:-2.4deg;top:-120px;right:-26px;width:168px;animation-delay:-1.4s}
.gcard--a .gcard__in{animation-delay:.42s}
.gcard--b{--rot:1.8deg;bottom:-104px;left:-10px;width:150px;animation-delay:-4.2s}
.gcard--b .gcard__in{animation-delay:.54s}
.gcard{transform:rotate(var(--rot))}
/* chống rớt một chữ xuống dòng cuối */
p,li,label,.gcard__t,.st__q,.cta__p,.hero-lead{text-wrap:pretty}
.gcard__lab{text-wrap:balance}
/* tiêu đề và nhãn ngắn: chia đều dòng, không để một chữ đứng riêng */
h1,h2,h3,.h2{text-wrap:balance}

/* ---------- Bieu mau ---------- */
.fcard{border-radius:var(--r-card);padding:22px 22px 20px;animation:rise .7s var(--ease) .18s both}
.fcard__title{
  margin:0;font-family:'Be Vietnam Pro',sans-serif;
  
  font-size:20px;line-height:1.25;letter-spacing:-.01em;color:var(--sky-deep);font-weight:600
}
.fcard__lead{margin:8px 0 14px;font-size:14px;line-height:1.55;color:var(--ink-soft)}
.field{display:grid;gap:6px}
.field + .field,.field-row + .field,.field + .field-row{margin-top:12px}
.field-row{display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);gap:12px;align-items:end}
.field-row label{white-space:nowrap}
/* o thu hai trong hang khong an margin cua luat .field + .field, nen hai nhan nam cung mot dong */
.field-row > .field + .field{margin-top:0}
.field label{font-size:14px;font-weight:500;color:var(--sky-deep)}
.field input,.field select{
  width:100%;height:46px;padding:0 14px;border-radius:var(--r-input);
  border:1px solid rgba(14,27,42,.18);background:#fff;color:var(--ink);
  font-family:'Be Vietnam Pro',sans-serif;font-size:16px;
  transition:border-color .18s var(--ease);
}
.field select{appearance:none;-webkit-appearance:none;padding-right:40px;cursor:pointer}
.field input:hover,.field select:hover{border-color:rgba(14,27,42,.34)}
.field input:focus-visible,.field select:focus-visible{outline:2px solid var(--sky);outline-offset:2px;border-color:var(--sky)}
.select-wrap{position:relative;display:block}
.select-wrap svg{position:absolute;right:14px;top:50%;transform:translateY(-50%);width:18px;height:18px;color:var(--ink-soft);pointer-events:none}
.consent{display:flex;gap:10px;align-items:flex-start;margin:14px 0 0;cursor:pointer}
.consent input{width:18px;height:18px;flex:0 0 18px;margin:2px 0 0;accent-color:var(--sky)}
.consent span{font-size:14px;line-height:1.5;color:var(--ink-soft)}
.consent a{color:var(--sky);text-underline-offset:2px}
.lead-form .btn-block{margin-top:14px}
.pledge{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:8px}
.pledge li{display:flex;gap:8px;align-items:flex-start;font-size:14px;line-height:1.45;color:var(--ink-soft)}
.pledge svg{width:16px;height:16px;flex:0 0 16px;margin-top:2px;color:var(--sky)}

/* Mep duoi hero, duong cong loi, do mau cua dai chay ngay ben duoi */
.hero__curve{position:relative;display:block;width:100%;height:60px;margin-bottom:-1px}
.hero__curve svg{display:block;width:100%;height:100%}
.hero__curve path{fill:var(--sky)}

/* ============================ 2 · DAI CHAY 7 TRAM ============================ */
.marquee{position:relative;background:var(--sky);color:#fff;overflow:hidden;padding:20px 0;margin-top:-2px}
.marquee__track{display:flex;width:max-content;animation:marq 40s linear infinite}
/* mép dải chạy: chữ mờ dần thay vì bị cắt phẳng; mép phải có nền đặc để nút dừng không đè lên chữ */
.marquee::before,.marquee::after{content:"";position:absolute;top:0;bottom:0;z-index:1;pointer-events:none}
.marquee::before{left:0;width:72px;background:linear-gradient(90deg,var(--sky) 15%,rgba(26,109,181,0))}
.marquee::after{right:0;width:72px;background:linear-gradient(270deg,var(--sky) 15%,rgba(26,109,181,0))}
.marquee__row{display:flex;align-items:center;gap:0;list-style:none;margin:0;padding:0}
.marquee__row li{display:flex;align-items:center;gap:28px;padding-right:28px}
.marquee__row span{
  font-family:'Be Vietnam Pro',sans-serif;
  
  font-size:18px;letter-spacing:-.01em;white-space:nowrap;font-weight:500
}
.marquee__row svg{width:16px;height:16px;flex:0 0 16px;opacity:.75}
/* WCAG 2.2.2 Pause Stop Hide: dai chay tu di hon 5 giay nen phai co cach dung lai */
.marquee:hover .marquee__track,
.marquee:focus-within .marquee__track{animation-play-state:paused}
/* ============================ 3 · CHO DUT ============================ */
/* nen xanh rat nhat, khoang dem tren duoi; mat o ban 26 khi go nut dung, lay lai tu ban 25 */
.gapsec{background:color-mix(in srgb, var(--sky-mist) 44%, var(--paper));padding:104px 0 112px}
.gapsec__grid{display:grid;grid-template-columns:repeat(12,1fr);gap:24px;align-items:start}
/* cot trai dinh khi cuon, nen khong de mang trong duoi hinh */
/* cot trai rong 6 cot tren man lon: tieu de 46px "lai ve vach xuat phat" vua mot dong */
.gapsec__left{grid-column:1 / span 6;position:sticky;top:112px}
.gapsec__right{grid-column:7 / span 6}

.gapart{margin:36px 0 0;max-width:430px}
.gapart svg{display:block;width:100%;height:auto;color:var(--sky)}
.gapart .ga-halo{fill:rgba(255,255,255,.6)}
.gapart .ga-arc{fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round}
.gapart .ga-dash{fill:none;stroke:currentColor;stroke-width:3;stroke-dasharray:6 4.5;stroke-linecap:round}
/* doan cung 7 ve 1 bi dut, luot do thu 3 tren trang */
.gapart .ga-cut{color:var(--scarlet)}
.gapart .ga-dot{fill:#fff;stroke:var(--sky);stroke-width:2}
.gapart .ga-no{font-family:'Be Vietnam Pro',sans-serif;font-size:17px;fill:var(--sky-deep);text-anchor:middle;font-weight:700}
.gapart .ga-lab{font-family:'Be Vietnam Pro',sans-serif;font-size:14px;font-weight:600;fill:var(--sky-deep)}
.gapart .ga-big{font-family:'Be Vietnam Pro',sans-serif;font-size:40px;letter-spacing:-.01em;fill:var(--sky-deep);text-anchor:middle;font-weight:600}
.gapart .ga-sub{font-family:'Be Vietnam Pro',sans-serif;font-size:14px;font-weight:500;fill:var(--ink-soft);text-anchor:middle}

.k2p{margin:20px 0 0;font-size:18px;line-height:1.68;color:var(--ink)}
.k2p--first{margin-top:26px}
.k2close{
  margin:30px 0 0;padding:22px 26px;border-radius:var(--r-card);
  background:rgba(255,255,255,.72);border:1px solid rgba(14,27,42,.08);
  font-size:18px;line-height:1.55;font-weight:600;color:var(--sky-deep);
}

/* ============================ 4 · VONG 7 TRAM ============================ */
.tramsec{background:var(--paper);padding:112px 0 100px}
.tramsec__head{max-width:760px}
.howto{
  display:flex;gap:12px;align-items:flex-start;margin:34px 0 30px;
  padding:16px 20px;border-radius:var(--r-glass);
  background:var(--sky-mist);font-size:16px;line-height:1.55;color:var(--sky-deep);max-width:820px;
}
.howto svg{width:20px;height:20px;flex:0 0 20px;margin-top:2px;color:var(--sky)}

/* Vong tren luoi 3x3. Thu tu trong ma: RISE, 01 toi 07, o quay ve.
   Vi tri tren man hinh dat bang grid-area, nen trinh doc man hinh van doc dung 01 toi 07. */
.ring{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:44px;
  grid-template-areas:"s1 s2 s3" "lp rs s4" "s7 s6 s5";
}
.ring > *{position:relative;border-radius:var(--r-card)}
.st--1{grid-area:s1}.st--2{grid-area:s2}.st--3{grid-area:s3}.st--4{grid-area:s4}
.st--5{grid-area:s5}.st--6{grid-area:s6}.st--7{grid-area:s7}
.ring__rise{grid-area:rs}
.ring__loop{grid-area:lp}

/* 7 o tram cung mot khuon */
.st{
  display:flex;flex-direction:column;padding:22px 24px 22px;
  background:#fff;border:1px solid rgba(14,27,42,.08);
  box-shadow:0 22px 40px -34px rgba(26,109,181,.6);
  transition:border-color .2s var(--ease);
}
.st:hover{border-color:rgba(26,109,181,.36)}
.st__top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 12px}
.st__no{
  font-family:'Be Vietnam Pro',sans-serif;
  font-size:28px;line-height:1;letter-spacing:-.01em;color:var(--sky);font-weight:600
}
.chip{
  display:inline-flex;align-items:center;gap:7px;height:28px;padding:0 12px 0 4px;
  border-radius:var(--r-pill);background:var(--sky-mist);color:var(--sky-deep);
  font-size:14px;font-weight:600;white-space:nowrap;
}
.chip b{
  display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:999px;
  background:var(--sky-deep);color:#fff;
  font-family:'Be Vietnam Pro',sans-serif;font-size:14px;font-weight:700
}
.st .h3{margin-top:18px;font-size:20px}
.st__q{margin:8px 0 0;flex:1;font-size:16px;line-height:1.55;color:var(--ink)}
.st__box{display:block;margin-top:18px;width:22px;height:22px;border-radius:5px;border:2px solid var(--sky);background:rgba(26,109,181,.05)}

/* Dai RISE: khoi neo mat cua muc 7 tram (anh An chon phuong an C, 23/09/2026).
   Nam ngay tren vong, 4 cot R I S E, moi cot ghi so tram thuoc chang do. */
.rband{
  margin:0 0 48px;border-radius:var(--r-card);overflow:hidden;background:var(--sky-deep);color:#fff;
  box-shadow:0 34px 60px -34px rgba(0,38,77,.8);
}
.rband__lab{margin:0;padding:16px 26px;border-bottom:1px solid rgba(255,255,255,.14);font-size:14px;font-weight:600;color:var(--sky-mist)}
.rband__list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.rband__list li{padding:26px 26px 24px;border-left:1px solid rgba(255,255,255,.14)}
.rband__list li:first-child{border-left:0}
.rband__list b{display:block;font-size:72px;line-height:1;font-weight:700;letter-spacing:-.01em}
.rband__list span{display:block;margin-top:10px;font-size:18px;font-weight:600;line-height:1.3}
.rband__list small{display:block;margin-top:4px;font-size:14px;color:var(--sky-mist)}

/* O tam cua vong: chi con dong chu thich chieu di */
.ring__rise{background:#fff;border:1px dashed rgba(26,109,181,.4);padding:24px 26px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.ring__rise b{display:block;font-size:40px;line-height:1.1;font-weight:700;color:var(--sky-deep)}
.ring__rise span{display:block;margin-top:6px;font-size:16px;line-height:1.5;color:var(--ink-soft)}

/* O quay ve, khong phai tram */
.ring__loop{background:var(--sky-deep);color:#fff;padding:26px 26px;display:flex;flex-direction:column;justify-content:center;gap:12px}
.ring__loop .loopico{
  width:48px;height:48px;border-radius:999px;
  background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.3);
  display:flex;align-items:center;justify-content:center;color:#fff;
}
.ring__loop .loopico svg{width:24px;height:24px}
.ring__loop h3{
  margin:0;font-family:'Be Vietnam Pro',sans-serif;
  
  font-size:20px;line-height:1.2;letter-spacing:-.01em;color:#fff;font-weight:600
}
.ring__loop p{margin:0;font-size:16px;line-height:1.55;color:var(--sky-mist)}

/* Mui ten chieu di cua vong, nam giua khe 44px */
.ring__arr{
  position:absolute;z-index:2;width:30px;height:30px;border-radius:999px;
  display:flex;align-items:center;justify-content:center;
  background:#fff;border:1px solid rgba(26,109,181,.32);color:var(--sky);
}
.ring__arr svg{width:16px;height:16px}
.ring__arr .ar-m{display:none}
.arr-r{right:-37px;top:50%;margin-top:-15px}
.arr-d{bottom:-37px;left:50%;margin-left:-15px}
.arr-l{left:-37px;top:50%;margin-top:-15px}
.arr-u{top:-37px;left:50%;margin-left:-15px}
.ring__loop .ring__arr{background:var(--sky-deep);border-color:var(--sky-deep);color:#fff}

/* ============================ 5 · NHOM, TAM AN ============================ */
.groupsec{background:#fff;padding:120px 0 132px}
.groupsec__grid{display:grid;grid-template-columns:repeat(12,1fr);gap:24px;align-items:start}
.groupsec__left{grid-column:1 / span 5}
.groupsec__right{grid-column:7 / span 6}
.gpt{margin:26px 0 0}
.gpt h3{margin:0 0 8px;font-size:18px;font-weight:600;color:var(--sky-deep);display:flex;gap:10px;align-items:flex-start}
.gpt h3 svg{width:22px;height:22px;flex:0 0 22px;margin-top:1px;color:var(--sky)}
.gpt p{margin:0 0 0 32px;font-size:16px;line-height:1.62;color:var(--ink-soft)}
.nosell{
  margin:30px 0 0 0;padding:18px 22px;border-left:3px solid var(--sky);
  background:var(--sky-mist);border-radius:0 var(--r-glass) var(--r-glass) 0;
  font-size:16px;font-weight:500;color:var(--sky-deep);
}
.teamshot{
  position:relative;margin:0;aspect-ratio:4 / 3;border-radius:var(--r-card);overflow:hidden;
  background:linear-gradient(150deg, var(--sky-deep) 0%, var(--sky) 58%, var(--sky-mist) 100%);
  box-shadow:0 1px 0 rgba(255,255,255,.3) inset,0 34px 60px -30px rgba(0,38,77,.4);
}
.teamshot figcaption{
  position:absolute;left:16px;bottom:16px;white-space:nowrap;
  display:inline-flex;align-items:center;height:28px;padding:0 12px;border-radius:var(--r-pill);
  background:rgba(0,38,77,.44);border:1px solid rgba(255,255,255,.32);
  color:#fff;font-size:14px;font-weight:500;
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
}

/* ============================ 6 · KEU GOI CUOI ============================ */
/* Khoi toi gom ca keu goi cuoi va chan trang, mot nen duy nhat nen khong the co vet noi */
.darkzone{position:relative;background:var(--sky-deep);color:#fff;isolation:isolate}

.cta{position:relative;padding:96px 0 80px;overflow:hidden;isolation:isolate}
/* phủ hàng pixel lẻ cuối khối: không để lớp chuyển sắc sáng lộ thành vệt ở mối nối với chân trang */
.cta::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--sky-deep);z-index:-1}
.cta::before{
  content:"";position:absolute;inset:0;z-index:-2;
  background:
    /* lop tren: keo phang ve dung --sky-deep truoc khi cham chan trang */
    linear-gradient(to bottom, color-mix(in srgb, var(--sky-deep), transparent 100%) 0%, color-mix(in srgb, var(--sky-deep), transparent 100%) 58%, var(--sky-deep) 88%, var(--sky-deep) 100%),
    /* lop duoi: gradient toi theo dung DESIGN.md muc 2, goc 160 do */
    linear-gradient(160deg, var(--sky-deep) 0%, var(--sky) 100%);
}
.cta .wordmark{top:56px;left:max(24px, calc((100% - var(--wrap)) / 2 + 36px));transform:none;font-size:clamp(160px,15vw,230px);opacity:.08}  /* nằm sau cột chữ trái, hiện đủ cả chữ, không bị thẻ biểu mẫu che */
.cta__grid{position:relative;display:grid;grid-template-columns:repeat(12,1fr);gap:24px;align-items:start}
.cta__left{grid-column:1 / span 6}
.cta__right{grid-column:8 / span 5}
.cta .h2{color:#fff}
.cta .lede{color:var(--sky-mist)}
.cta__p{margin:24px 0 0;font-size:16px;line-height:1.68;color:var(--sky-mist);max-width:56ch}
.cta .tag{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.3);color:#fff}
.cta .tag svg{color:var(--sky-mist)}

.minicard{border-radius:var(--r-card);padding:26px 28px 24px;background:rgba(255,255,255,.93);border:1px solid var(--glass-line);box-shadow:0 1px 0 #fff inset,0 40px 80px -38px rgba(0,17,36,.75);backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%)}
.minicard .fcard__title{font-size:20px}

/* ============================ 7 · CHAN TRANG ============================ */
.site-footer{position:relative;padding:75px 0 13vw;overflow:hidden;background:var(--sky-deep);margin-top:-3px;isolation:isolate}  /* nền riêng + chồng 3px lên khối trên: phủ hàng pixel lẻ ở mối nối */
.site-footer .wordmark{
  top:auto;bottom:-7vw;font-size:26vw;opacity:.13;      /* lộ khoảng 2/3 chữ trong khoảng trống riêng dưới dòng bản quyền, DESIGN.md 5.11 */;font-weight:300
}
.fgrid{position:relative;display:grid;grid-template-columns:2.2fr 1fr 1fr 1.4fr;gap:40px}
/* logo lon hon, khau hieu nam ngay duoi logo (anh An, 23/09) */
.fbrand{display:flex;flex-direction:column;align-items:flex-start}
.fbrand img{height:52px;width:auto;margin-bottom:14px;filter:brightness(0) invert(1)}
.fbrand p{margin:0;font-size:14px;line-height:1.64;color:var(--sky-mist);max-width:38ch}
.ftagline{
  display:inline-flex;align-items:center;height:30px;padding:0 14px;margin:0 0 20px;
  border-radius:var(--r-pill);background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.26);
  font-size:14px;font-weight:600;color:#fff;
}
.fcol h4{margin:0 0 14px;font-size:14px;font-weight:600;color:#fff}
.fcol ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.fcol a{font-size:14px;color:var(--sky-mist);text-decoration:none;transition:color .2s var(--ease)}
.fcol a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}
.faddr{margin:16px 0 0;font-size:14px;line-height:1.6;color:var(--sky-mist);opacity:.9}
.fbot{
  position:relative;display:flex;flex-wrap:wrap;gap:16px 28px;align-items:center;justify-content:space-between;
  margin-top:56px;padding:24px 0 30px;border-top:1px solid rgba(255,255,255,.16);
}
.fbot p{margin:0;font-size:14px;color:var(--sky-mist)}
.fbot nav{display:flex;flex-wrap:wrap;gap:24px}
.fbot a{font-size:14px;color:var(--sky-mist);text-decoration:none}
.fbot a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}

/* ============================ 8 · THANH DINH DAY ============================ */
.stickybar{
  display:none;position:fixed;left:0;right:0;bottom:0;z-index:50;
  padding:12px 16px calc(12px + env(safe-area-inset-bottom));
  background:rgba(255,255,255,.9);border-top:1px solid rgba(14,27,42,.1);
  box-shadow:0 -12px 30px -22px rgba(0,38,77,.5);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  transform:translateY(0);transition:transform .28s var(--ease);
}
.stickybar.is-off{transform:translateY(120%)}
.stickybar .btn-block{height:48px}

.totop{
  position:fixed;right:24px;bottom:24px;z-index:45;width:48px;height:48px;border-radius:999px;
  display:flex;align-items:center;justify-content:center;border:0;cursor:pointer;
  background:var(--sky);color:#fff;border:2px solid #fff;box-shadow:0 14px 30px -12px rgba(0,38,77,.65);
  opacity:0;visibility:hidden;transform:translateY(12px);
  transition:opacity .25s var(--ease),transform .25s var(--ease),visibility 0s linear .25s,background-color .2s;
}
.totop.is-on{opacity:1;visibility:visible;transform:none;transition-delay:0s}
.totop:hover{background:var(--sky-deep)}
.totop svg{width:20px;height:20px}

/* ============================ CHUYEN DONG ============================ */
@keyframes wm-in{from{opacity:0}to{opacity:.78}}
@keyframes rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes drift{
  0%,100%{transform:rotate(var(--rot)) translateY(-6px)}
  50%{transform:rotate(var(--rot)) translateY(6px)}
}
@keyframes marq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none !important;transition:none !important}
  .hero .wordmark{opacity:.78}
  /* Dải chữ chạy là một phần của nhận diện, đứng im thì mục này trông như ảnh tĩnh.
     Giữ cho nó chạy nhưng chậm lại một nửa, thay vì tắt hẳn. */
  .marquee__track{animation:marq 80s linear infinite !important}
}

/* ============================================================
   NHIP TRUNG GIAN · 981px toi 1240px
   Laptop 1366 va may tinh bang nam ngang roi vao day
   ============================================================ */
@media (max-width:1240px){
  .wrap{padding:0 36px}

  /* Hero ve hai cot, to so do xuong duoi cot chu */
  /* dat hang ro rang: bieu mau chiem 2 hang ben phai, nen khong bi day xuong duoi to so do */
  .hero__copy{grid-column:1 / span 6;grid-row:1}
  .hero__formcol{grid-column:7 / span 6;grid-row:1 / span 2}
  .hero-h1,.hero-lead,.benefits li{max-width:100%}
  .hero-h1{font-size:clamp(34px,4vw,44px)}
  .stage{position:relative;top:0;left:0;transform:none;width:100%;max-width:250px;margin:124px 0 0 64px;grid-column:1 / span 6;grid-row:2}
  .gcard--a{top:-112px;right:-60px;width:166px}
  .gcard--b{bottom:-100px;left:-40px;width:152px}
  .gcard__k{font-size:28px}
  .gcard__in{padding:12px 14px}
  .hero__grid{padding-bottom:88px}

  /* Cho dut van bat doi xung, chi thu hep hai cot */
  .gapsec{padding:100px 0 108px}
  .gapsec__left{grid-column:1 / span 5}
  .gapsec__right{grid-column:6 / span 7}

  .tramsec{padding:108px 0 100px}
  .ring{gap:40px}
  .arr-r{right:-35px}.arr-l{left:-35px}.arr-d{bottom:-35px}.arr-u{top:-35px}
  .st{padding:20px 20px 20px}
  .ring__rise,.ring__loop{padding:22px 20px}
  .rband__list li{padding:22px 20px 20px}
  .rband__list b{font-size:60px}

  .groupsec{padding:104px 0 112px}
  .cta{padding:84px 0 108px}
  .cta__left{grid-column:1 / span 6}
  .cta__right{grid-column:7 / span 6}

  .fgrid{grid-template-columns:1.8fr 1fr 1fr;gap:32px}
  .fbrand{grid-column:1 / -1}
}

/* ============================================================
   MOT COT · toi 980px, khoa o 390px
   ============================================================ */
@media (max-width:980px){
  .wrap{padding:0 20px}
  .topbar{top:12px}
  .topbar.is-scrolled{top:8px}
  .topbar__frame{height:56px;gap:10px;padding:0 8px 0 14px}
  .nav{display:none}
  .brand img{height:24px}
  .topbar__frame .btn-primary{margin-left:auto;height:40px;padding:0 5px 0 14px;font-size:14px;gap:8px}
  .topbar__frame .btn__ring{width:24px;height:24px;flex-basis:24px}

  .hero{padding-top:92px}
  .hero .wordmark{top:-14px;font-size:54vw}
  .hero__grid{grid-template-columns:1fr;gap:0;padding-bottom:64px}
  .hero__copy,.hero__formcol{grid-column:1 / -1;grid-row:auto}
  .hero-h1{font-size:clamp(30px,8.6vw,40px)}
  .hero-lead{font-size:18px}
  .hero-secondary{margin-top:24px}
  .hero__ticks{display:none}
  .stage{width:100%;max-width:236px;margin:124px auto 0;grid-column:1 / -1;grid-row:auto}
  .gcard--a{top:-110px;right:-40px;width:156px}
  .gcard--b{bottom:-96px;left:-42px;width:146px}
  .hero__formcol{margin-top:124px}
  .fcard{padding:22px 20px 20px}
  .field-row{grid-template-columns:1fr;gap:14px}
  .hero__curve{height:36px}

  .marquee{padding:16px 0}
  .marquee__row span{font-size:18px}
    .marquee::before{width:36px}
  .marquee::after{width:36px}
  .marquee__row li{gap:20px;padding-right:20px}

  .gapsec{padding:72px 0 80px}
  .gapsec__grid{grid-template-columns:1fr;gap:0}
  .gapsec__left,.gapsec__right{grid-column:1 / -1}
  .gapsec__left{position:static}
  .gapart{margin:28px auto 36px;max-width:320px}
  .k2p{font-size:16px}
  .k2close{font-size:16px;padding:18px 20px}

  .tramsec{padding:76px 0 72px}
  .howto{margin:26px 0 22px;font-size:14px}

  .groupsec{padding:80px 0 88px}
  .groupsec__grid{grid-template-columns:1fr;gap:0}
  .groupsec__left,.groupsec__right{grid-column:1 / -1}
  .groupsec__right{margin-top:34px}

  .cta{padding:76px 0 96px}
  .cta .wordmark{font-size:30vw;top:56px;left:50%;transform:translateX(-50%)}
  .cta__grid{grid-template-columns:1fr;gap:0}
  .cta__left,.cta__right{grid-column:1 / -1}
  .cta__right{margin-top:34px}
  .minicard{padding:22px 20px 20px}

  .site-footer{padding-top:59px;padding-bottom:0}
  .site-footer .wordmark{font-size:40vw;bottom:-10vw}
  .fgrid{grid-template-columns:1fr 1fr;gap:30px}
  .fbrand{grid-column:1 / -1}
  .fbot{flex-direction:column;align-items:flex-start;margin-top:40px;padding-bottom:100px}  /* chua thanh dinh day */

  /* Thanh dinh day chi co tren man hep */
  .stickybar{display:block}
  /* nut ve dau trang dung tren thanh dinh day */
  .totop{right:16px;bottom:calc(84px + env(safe-area-inset-bottom));width:44px;height:44px}
}

/* ============================================================
   VONG 7 TRAM XEP DOC · duoi 900px
   RISE ngay duoi dong huong dan, roi 01 toi 07, cuoi la o quay ve
   ============================================================ */
@media (max-width:899px){
  .ring{grid-template-columns:1fr;grid-template-areas:none;gap:44px}
  .ring > *{grid-area:auto !important}
  .ring__arr{left:50%;right:auto;top:auto;bottom:-37px;margin:0 0 0 -15px}
  .ring__arr .ar-d{display:none}
  .ring__arr .ar-m{display:block}
  .ring__loop .ring__arr{display:none}
  .st{padding:20px 20px}
  .st .h3{margin-top:14px}
  /* vong xep doc thi khong con chieu kim dong ho, o tam an di; dai RISE da noi du */
  .ring__rise{display:none}
  .rband{margin-bottom:40px}
  .rband__lab{padding:14px 20px}
  .rband__dot{display:none}
  .rband__sub{display:block;font-weight:500}
  .rband__list{grid-template-columns:1fr 1fr}
  .rband__list li{padding:20px;border-left:0}
  .rband__list li:nth-child(even){border-left:1px solid rgba(255,255,255,.14)}
  .rband__list li:nth-child(n+3){border-top:1px solid rgba(255,255,255,.14)}
  .rband__list b{font-size:48px}
  .rband__list span{font-size:16px}
  .ring__loop{padding:22px 20px}
  .ring__loop h3{font-size:20px}
}

/* ---------- Cong cu tu cham diem 7 tram ---------- */
.quiz{max-width:760px;margin:40px auto 0;background:rgba(255,255,255,.72);border:1px solid var(--glass-line);
  border-radius:var(--r-card);padding:32px 32px 26px;
  box-shadow:0 1px 0 var(--glass-line) inset,0 22px 48px -30px rgba(26,109,181,.4);
  backdrop-filter:blur(16px) saturate(140%);-webkit-backdrop-filter:blur(16px) saturate(140%)}
.quiz__top{margin-bottom:22px}
.quiz__dem{margin:0 0 10px;font-size:14px;font-weight:500;color:var(--ink-soft)}
.quiz__dem b{color:var(--sky);font-size:16px}
.quiz__cham{opacity:.5}
.quiz__thanh{height:4px;border-radius:999px;background:rgba(26,109,181,.16);overflow:hidden}
.quiz__thanh span{display:block;height:100%;width:14.28%;border-radius:999px;background:var(--sky);
  transition:width .32s var(--ease)}
.quiz__hoi{margin:0 0 20px;font-size:21px;line-height:1.45;font-weight:600;color:var(--sky-deep);letter-spacing:-.01em}
.quiz__chon{display:grid;gap:10px}
.quiz__chon button{display:block;width:100%;text-align:left;cursor:pointer;
  font-family:'Be Vietnam Pro',sans-serif;font-size:16px;line-height:1.5;color:var(--ink);
  background:#fff;border:1px solid rgba(14,27,42,.14);border-radius:var(--r-glass);
  padding:15px 18px;transition:border-color .18s var(--ease),background-color .18s var(--ease),transform .12s var(--ease)}
.quiz__chon button:hover{border-color:var(--sky);background:rgba(26,109,181,.05)}
.quiz__chon button:active{transform:translateY(1px)}
.quiz__lui{display:block;margin:18px auto 0;background:none;border:0;cursor:pointer;
  font-family:'Be Vietnam Pro',sans-serif;font-size:14px;color:var(--ink-soft);text-decoration:underline;
  text-underline-offset:3px;padding:6px}
.quiz__lui:hover{color:var(--sky)}

.quiz__ket{max-width:760px;margin:40px auto 0;border-radius:var(--r-card);padding:34px 32px 28px;text-align:center}
.qk__nhan{margin:0;font-size:14px;font-weight:500;color:var(--ink-soft)}
.qk__diem{margin:6px 0 0;display:flex;align-items:baseline;justify-content:center;gap:10px}
.qk__diem b{font-size:64px;line-height:1;font-weight:600;letter-spacing:-.03em;color:var(--sky-deep)}
.qk__diem span{font-size:16px;color:var(--ink-soft)}
.qk__thanh{height:6px;border-radius:999px;background:rgba(26,109,181,.14);overflow:hidden;margin:18px auto 22px;max-width:420px}
.qk__thanh span{display:block;height:100%;width:0;border-radius:999px;background:var(--sky);transition:width .5s var(--ease)}
.qk__tram{margin:0 0 6px;font-size:19px;line-height:1.45;font-weight:600;color:var(--scarlet)}
.qk__chang{margin:0 0 20px;font-size:16px;line-height:1.5;color:var(--ink-soft)}
.qk__doan{text-align:left;border-top:1px solid var(--glass-line);padding-top:20px}
.qk__doan p{margin:0 0 12px;font-size:17px;line-height:1.68;color:var(--ink)}
.qk__doan p:last-child{margin-bottom:0}
.qk__form{text-align:left;margin-top:24px;border-top:1px solid var(--glass-line);padding-top:22px}
.qk__formtit{margin:0 0 14px;font-size:18px;font-weight:600;color:var(--sky-deep)}
.qk__mat{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.qk__dong{display:flex;gap:10px;align-items:flex-start;margin:14px 0 4px;font-size:14px;line-height:1.55;color:var(--ink-soft)}
.qk__dong input{margin-top:3px;flex:0 0 auto}
.qk__loi{margin:12px 0 0;font-size:14px;line-height:1.5;color:var(--scarlet);font-weight:500}
.qk__form .btn{margin-top:16px}
.quiz__lam-lai{display:block;margin:18px auto 0;background:none;border:0;cursor:pointer;
  font-family:'Be Vietnam Pro',sans-serif;font-size:14px;color:var(--ink-soft);text-decoration:underline;
  text-underline-offset:3px;padding:6px}
.quiz__lam-lai:hover{color:var(--sky)}

@media (max-width:760px){
  .quiz,.quiz__ket{padding:24px 20px 20px;margin-top:28px;border-radius:var(--r-glass)}
  .quiz__hoi{font-size:18px}
  .quiz__chon button{font-size:15px;padding:13px 15px}
  .qk__diem b{font-size:52px}
  .qk__tram{font-size:17px}
  .qk__doan p{font-size:16px}
}
.form-loi{margin:12px 0 0;font-size:14px;line-height:1.5;color:var(--scarlet);font-weight:500}
.dan__y{list-style:none;margin:0 0 20px;padding:0;display:grid;gap:11px}
.dan__y li{display:flex;gap:10px;align-items:flex-start;font-size:15px;line-height:1.55;color:var(--ink)}
.dan__tick{flex:0 0 19px;width:19px;height:19px;margin-top:1px;border-radius:999px;
  background:rgba(26,109,181,.12);color:var(--sky);display:inline-flex;align-items:center;justify-content:center}
.dan__tick svg{width:11px;height:11px}