/* Shell777, the long-scroll offer landing. A near-white page with white cards, navy ink, a cerise
   primary button and amber as the figure colour. Round corners, soft shadows, sentence-case
   headings, a thin amber rule over every section head, and one pinned CTA strip that stays on a
   phone. A bright page you read, rather than a dark floor you browse.
   Hand written, not generated by the build. Namespaced .vn- so it cannot collide with anything else. */
:root{
  --navy:#111A33; --navy-2:#1B2547; --navy-3:#27335C;
  --cer:#D11E57; --cer-d:#A8143F; --cer-l:#FDE8EF;
  --amb:#F0A418; --amb-d:#B97A06; --amb-l:#FEF3DF;
  --page:#F7F8FB; --page-2:#EDF0F7; --sheet:#FFFFFF;
  --txt:#1C2340; --mut:#5A6480; --line:#DDE2EC; --line-2:rgba(247,248,251,.18);
  --bar:60px; --r:14px; --r-sm:10px;
  --sh:0 1px 2px rgba(17,26,51,.05),0 10px 26px rgba(17,26,51,.06);
  --font:system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans SC","PingFang SC",sans-serif;
  --disp:"Trebuchet MS","Segoe UI",Roboto,"Noto Sans SC","PingFang SC",sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;overflow-x:clip;max-width:100%;scroll-behavior:smooth}
body{margin:0;color:var(--txt);font-family:var(--font);line-height:1.7;background:var(--page)}
a{color:var(--cer-d);text-decoration:none}
img{max-width:100%;height:auto;display:block;min-width:0}
h1,h2,h3,h4{margin:0;line-height:1.24;font-family:var(--disp);font-weight:700}
table{border-collapse:collapse;width:100%}
.w{max-width:1120px;margin:0 auto;padding:0 22px}
.note{display:block;margin-top:16px;font-size:12.5px;color:var(--mut)}

/* ---------- buttons: pills, not plates ---------- */
.vn-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;
  padding:0 24px;border-radius:999px;font-weight:700;font-size:14.5px;border:2px solid transparent;
  text-align:center;line-height:1.2;font-family:var(--disp)}
.vn-btn.p{background:var(--cer);color:#fff;border-color:var(--cer);
  box-shadow:0 8px 20px rgba(209,30,87,.22)}
.vn-btn.p:hover{background:var(--cer-d);border-color:var(--cer-d)}
.vn-btn.g{background:var(--sheet);color:var(--navy);border-color:var(--navy)}
.vn-btn.g:hover{background:var(--navy);color:#fff}
.vn-btn.o{background:transparent;color:var(--cer-d);border-color:var(--line)}
.vn-btn.o:hover{border-color:var(--cer)}
.vn-btn.sm{min-height:42px;padding:0 18px;font-size:13px}
.vn-btn.lg{min-height:56px;font-size:16px;padding:0 30px}

/* ---------- header: white, sticky, a sign-in pill on the right ---------- */
.vn-head{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.96);
  backdrop-filter:saturate(140%) blur(6px);border-bottom:1px solid var(--line)}
.vn-head .w{display:flex;align-items:center;gap:16px;padding-top:10px;padding-bottom:10px}
.vn-logo{display:flex;align-items:center;gap:10px;flex:none;min-width:0;color:var(--navy)}
.vn-logo svg{width:34px;height:34px;flex:none}
.vn-logo .wm{font-family:var(--disp);font-size:21px;font-weight:700;letter-spacing:.01em;
  white-space:nowrap;min-width:0;color:inherit}
.vn-logo .wm span{color:var(--cer)}
.vn-pills{display:flex;flex:1;flex-wrap:wrap;gap:3px;min-width:0}
.vn-pills a{display:inline-flex;align-items:center;justify-content:center;min-height:40px;
  min-width:44px;padding:0 12px;border-radius:999px;font-family:var(--disp);font-size:13px;
  font-weight:700;color:var(--mut);white-space:nowrap}
.vn-pills a:hover{background:var(--cer-l);color:var(--cer-d)}
.vn-lang{display:flex;gap:4px;flex:none}
.vn-lang a{display:inline-flex;align-items:center;justify-content:center;min-width:42px;
  min-height:44px;border-radius:999px;background:var(--page-2);color:var(--mut);font-size:11.5px;
  font-weight:700;padding:0 8px;white-space:nowrap}
.vn-lang a.on{background:var(--navy);color:#fff}
.vn-head .vn-btn{flex:none}
.vn-burger{display:none;background:var(--page-2);border:0;color:var(--cer);font-size:18px;
  min-width:44px;min-height:44px;border-radius:999px;cursor:pointer}
.vn-drawer{display:none;flex-wrap:wrap;gap:6px;padding:0 22px 14px;background:var(--sheet);
  border-bottom:1px solid var(--line)}
.vn-open .vn-drawer{display:flex}
.vn-drawer a{display:inline-flex;align-items:center;min-height:42px;padding:0 16px;
  border-radius:999px;background:var(--page-2);color:var(--navy);font-size:13px;font-weight:700;
  font-family:var(--disp)}

/* ---------- hero: copy column, figure strip, then a wide picture ----------
   The selling block finishes before the media starts, which keeps the H1, the lead and both
   buttons inside the thumb arc on a 375x667 screen. */
.vn-hero{padding:32px 0 0}
.vn-hero.big{padding:40px 0 0}
.vn-hero .w{display:grid;gap:26px}
.vn-hero .bd{display:grid;gap:18px;align-content:start;max-width:800px;min-width:0}
.vn-hero .eb{display:inline-flex;align-self:start;align-items:center;min-height:30px;
  padding:0 14px;background:var(--amb-l);color:var(--amb-d);font-family:var(--disp);
  font-size:12px;font-weight:700;border-radius:999px}
.vn-hero h1{font-size:44px;line-height:1.12;color:var(--navy);letter-spacing:-.015em}
.vn-hero.big h1{font-size:49px}
.vn-hero .lead{margin:0;font-size:17.5px;color:#333E5C;max-width:62ch}
.vn-hero a:not(.vn-btn){color:var(--cer-d);text-decoration:underline;text-underline-offset:3px}
.vn-hero .act{display:flex;flex-wrap:wrap;gap:12px}
.vn-hero .fig{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;
  padding:18px 0 0;border-top:1px solid var(--line)}
.vn-hero .fig>div{display:grid;gap:3px;min-width:0}
.vn-hero .fig b{font-family:var(--disp);font-size:27px;line-height:1.05;color:var(--cer)}
.vn-hero .fig span{font-size:12px;color:var(--mut);line-height:1.5}
.vn-hero .ph{position:relative;margin:0;min-width:0}
.vn-hero .ph>img{width:100%;aspect-ratio:21/8;object-fit:cover;border-radius:var(--r)}
.vn-hero .chips{display:flex;flex-wrap:wrap;gap:10px;min-width:0;margin-top:14px}
.vn-hero .chips span{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;
  flex:0 1 auto;min-width:0;font-size:12.5px;color:var(--navy);font-weight:700;
  background:var(--sheet);border:1px solid var(--line);border-radius:999px}
.vn-hero .chips i{font-style:normal;color:var(--amb-d);font-size:13px;flex:none;font-weight:700}

/* ---------- the jump index: the long-scroll signature ---------- */
.vn-jump{padding:30px 0 6px}
.vn-jump .w{display:grid;gap:14px}
.vn-jump>.w>b{font-family:var(--disp);font-size:12px;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;color:var(--mut)}
.vn-jump .ls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.vn-jump .ls a{display:flex;align-items:center;gap:12px;min-height:48px;padding:8px 16px;
  border-radius:var(--r-sm);background:var(--sheet);border:1px solid var(--line);
  color:var(--navy);font-size:14px;font-weight:700;min-width:0;line-height:1.4}
.vn-jump .ls a:hover{border-color:var(--cer);color:var(--cer-d)}
.vn-jump .ls em{font-style:normal;font-family:var(--disp);font-size:13px;color:var(--amb-d);
  flex:none}

/* ---------- generic section ---------- */
.vn-sec{padding:34px 0}
.vn-sec.pad{padding-top:42px}
.vn-sec.tint{background:var(--page-2)}
.vn-sec .sh{margin-bottom:24px;padding-top:16px;border-top:3px solid var(--amb);max-width:900px}
.vn-sec .sh h2{font-size:27px;color:var(--navy);letter-spacing:-.01em}
.vn-sec .sh p{margin:10px 0 0;color:var(--mut);font-size:15px;max-width:70ch}

/* kpi strip: four white cards, figures in cerise */
.vn-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.vn-kpis>div{display:grid;gap:5px;align-content:start;padding:20px 18px;border-radius:var(--r-sm);
  background:var(--sheet);border:1px solid var(--line);min-width:0}
.vn-kpis b{font-family:var(--disp);font-size:28px;color:var(--cer);line-height:1.05}
.vn-kpis span{font-size:12.5px;color:var(--mut);line-height:1.5}

/* the offer board: rows with the turnover chip beside the rate */
.vn-offers{display:grid;gap:14px}
.vn-offers .of{display:grid;grid-template-columns:54px minmax(0,1fr) auto;gap:18px;
  align-items:center;padding:20px 22px;border-radius:var(--r);background:var(--sheet);
  border:1px solid var(--line);box-shadow:var(--sh)}
.vn-offers .ic{display:flex;align-items:center;justify-content:center;width:54px;height:54px;
  border-radius:50%;background:var(--cer-l);color:var(--cer);flex:none}
.vn-offers .ic svg{width:28px;height:28px}
.vn-offers .bd{display:grid;gap:7px;min-width:0}
.vn-offers .bd b{font-family:var(--disp);font-size:19px;color:var(--navy);line-height:1.3}
.vn-offers .cap{font-style:normal;justify-self:start;font-size:12.5px;font-weight:700;
  color:var(--mut)}
.vn-offers .to{justify-self:start;display:inline-flex;align-items:center;min-height:26px;
  padding:0 12px;border-radius:999px;background:var(--amb-l);color:var(--amb-d);font-size:12px;
  font-weight:700;line-height:1.3}
.vn-offers .bd p{margin:2px 0 0;font-size:13.5px;color:var(--mut);line-height:1.65}
.vn-offers .vn-btn{flex:none}

/* badged room cards */
.vn-cats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.vn-cats .tl{display:grid;gap:12px;align-content:start;padding:22px;border-radius:var(--r);
  background:var(--sheet);border:1px solid var(--line);box-shadow:var(--sh);min-width:0;
  color:var(--txt)}
.vn-cats .tl:hover{border-color:var(--cer)}
.vn-cats .ic{display:flex;align-items:center;justify-content:center;width:48px;height:48px;
  border-radius:var(--r-sm);background:var(--navy);color:var(--amb)}
.vn-cats .ic svg{width:28px;height:28px}
.vn-cats .bg{font-style:normal;justify-self:start;display:inline-flex;align-items:center;
  min-height:26px;padding:0 12px;border-radius:999px;background:var(--cer-l);color:var(--cer-d);
  font-size:11.5px;font-weight:700;letter-spacing:.03em}
.vn-cats .tl b{font-family:var(--disp);font-size:20px;color:var(--navy)}
.vn-cats .tg{display:flex;flex-wrap:wrap;gap:8px;min-width:0}
.vn-cats .tg span{font-size:11.5px;font-weight:700;color:var(--mut);background:var(--page-2);
  padding:5px 10px;border-radius:999px;min-width:0}
.vn-cats .tl p{margin:0;font-size:13.5px;color:var(--mut);line-height:1.68}
.vn-cats .go{font-size:13px;font-weight:700;color:var(--cer-d)}
.vn-cats .go::after{content:" \203A"}

/* the rebate panel: the site's signature element */
.vn-reb{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:26px;
  padding:28px;border-radius:var(--r);background:var(--navy);align-items:center}
.vn-reb .big{display:grid;gap:14px;align-content:start;justify-items:start;min-width:0}
.vn-reb .big em{font-style:normal;font-family:var(--disp);font-size:68px;font-weight:700;
  line-height:1;color:var(--amb)}
.vn-reb .big b{font-family:var(--disp);font-size:23px;color:#fff;line-height:1.32;max-width:30ch}
.vn-reb .big p{margin:0;font-size:14.5px;color:#A6B0C9;max-width:52ch}
.vn-reb .rows{display:grid;gap:10px;min-width:0}
.vn-reb .rr{display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:14px 18px;border-radius:var(--r-sm);background:var(--navy-2);min-width:0}
.vn-reb .rr span{font-size:13px;color:#A6B0C9;min-width:0}
.vn-reb .rr b{font-family:var(--disp);font-size:19px;color:var(--amb);white-space:nowrap}

/* the ladder: four white columns, the tier name on a navy plate */
.vn-ladder{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.vn-ladder .vt{display:grid;gap:10px;align-content:start;padding:0 0 20px;border-radius:var(--r);
  background:var(--sheet);border:1px solid var(--line);min-width:0;overflow:hidden}
.vn-ladder .vt>b{font-family:var(--disp);font-size:17px;color:#fff;background:var(--navy);
  padding:14px 18px;border-bottom:3px solid var(--amb)}
.vn-ladder .rw{display:grid;gap:2px;padding:0 18px;min-width:0}
.vn-ladder .rw span{font-size:11px;color:var(--mut);letter-spacing:.05em;text-transform:uppercase;
  min-width:0}
.vn-ladder .rw em{font-style:normal;font-family:var(--disp);font-size:20px;font-weight:700;
  color:var(--cer)}
.vn-ladder .vt p{margin:4px 0 0;padding:0 18px;font-size:12.5px;color:var(--mut);line-height:1.6}

/* turnover weighting rows */
.vn-weights{display:grid;gap:10px}
.vn-weights .wr{display:grid;grid-template-columns:minmax(0,1fr) 92px minmax(0,1.3fr);gap:18px;
  align-items:center;padding:16px 20px;border-radius:var(--r-sm);background:var(--sheet);
  border:1px solid var(--line)}
.vn-weights .wr b{font-family:var(--disp);font-size:16.5px;color:var(--navy);min-width:0}
.vn-weights .wr em{font-style:normal;font-family:var(--disp);font-size:22px;font-weight:700;
  color:var(--cer);text-align:right}
.vn-weights .wr span{font-size:13px;color:var(--mut);min-width:0}

/* what each budget buys: three columns read across */
.vn-budgets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.vn-budgets .bc{display:grid;gap:12px;align-content:start;padding:24px 22px;border-radius:var(--r);
  background:var(--sheet);border:1px solid var(--line);box-shadow:var(--sh);min-width:0}
.vn-budgets .bc em{font-style:normal;font-family:var(--disp);font-size:34px;font-weight:700;
  color:var(--cer);line-height:1}
.vn-budgets .bc b{font-family:var(--disp);font-size:13px;color:var(--mut);letter-spacing:.06em;
  text-transform:uppercase}
.vn-budgets .ls{display:grid;gap:9px;min-width:0}
.vn-budgets .ls span{position:relative;padding-left:22px;font-size:13.5px;color:var(--txt);
  line-height:1.55;min-width:0}
.vn-budgets .ls span::before{content:"";position:absolute;left:0;top:8px;width:10px;height:10px;
  border-radius:50%;background:var(--amb)}

/* live tables: picture on top, white body under it */
.vn-live{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.vn-live .lc{display:grid;align-content:start;border-radius:var(--r);overflow:hidden;
  background:var(--sheet);border:1px solid var(--line);box-shadow:var(--sh);min-width:0}
.vn-live .lc img{width:100%;aspect-ratio:16/10;object-fit:cover}
.vn-live .bd{display:grid;gap:12px;padding:20px;min-width:0;justify-items:start}
.vn-live .bd b{font-family:var(--disp);font-size:18px;color:var(--navy)}
.vn-live .mt{display:flex;flex-wrap:wrap;gap:8px;min-width:0}
.vn-live .mt span{font-size:11.5px;font-weight:700;color:var(--amb-d);background:var(--amb-l);
  padding:5px 11px;border-radius:999px;min-width:0}
.vn-live .bd p{margin:0;font-size:13.5px;color:var(--mut);line-height:1.68}

/* 4D draw cards */
.vn-draws{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.vn-draws .dc{display:grid;gap:10px;align-content:start;padding:24px 22px;border-radius:var(--r);
  background:var(--sheet);border:1px solid var(--line);border-top:4px solid var(--cer);
  min-width:0}
.vn-draws .dc b{font-family:var(--disp);font-size:21px;color:var(--navy)}
.vn-draws .dc em{font-style:normal;justify-self:start;font-size:11.5px;font-weight:700;
  letter-spacing:.05em;text-transform:uppercase;color:var(--amb-d);background:var(--amb-l);
  padding:5px 11px;border-radius:999px}
.vn-draws .dc p{margin:0;font-size:13.5px;color:var(--mut);line-height:1.68}

/* fishing control cards */
.vn-fish{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.vn-fish .fc{display:grid;gap:10px;align-content:start;padding:24px 22px;border-radius:var(--r);
  background:var(--navy);min-width:0}
.vn-fish .fc em{font-style:normal;font-family:var(--disp);font-size:32px;font-weight:700;
  color:var(--amb);line-height:1}
.vn-fish .fc b{font-family:var(--disp);font-size:18px;color:#fff;line-height:1.32}
.vn-fish .fc p{margin:0;font-size:13.5px;color:#A6B0C9;line-height:1.68}

/* reviews: three white cards, stars in amber, city under the name */
.vn-reviews{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.vn-reviews .rv{display:grid;gap:12px;align-content:start;padding:24px 22px;
  border-radius:var(--r);background:var(--sheet);border:1px solid var(--line);
  box-shadow:var(--sh);min-width:0}
.vn-reviews .st{color:var(--amb);font-size:16px;letter-spacing:.14em;line-height:1}
.vn-reviews .st i{color:var(--line);font-style:normal}
.vn-reviews .rv p{margin:0;font-size:14px;color:var(--txt);line-height:1.68}
.vn-reviews .by{display:grid;gap:1px;padding-top:4px;border-top:1px solid var(--line);
  min-width:0}
.vn-reviews .by b{font-family:var(--disp);font-size:14.5px;color:var(--navy)}
.vn-reviews .by span{font-size:12px;color:var(--mut)}

/* payment rail: white chips, label under the mark */
.vn-rail{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.vn-rail .rc{display:grid;justify-items:center;align-content:center;gap:9px;min-height:86px;
  padding:14px 10px;border-radius:var(--r-sm);background:var(--sheet);border:1px solid var(--line);
  min-width:0}
.vn-rail .rc img{max-height:24px;max-width:100%;width:auto;height:auto;object-fit:contain;
  flex:0 1 auto;min-width:0}
.vn-rail .rc em{font-style:normal;font-size:11px;font-weight:700;color:var(--mut);min-width:0;
  text-align:center;line-height:1.35}

/* studio wall: navy chips, the one chip this site uses for vendor artwork */
.vn-provs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
.vn-provs.six{grid-template-columns:repeat(6,minmax(0,1fr))}
.vn-provs .pg{display:flex;align-items:center;justify-content:center;min-height:62px;padding:12px;
  border-radius:var(--r-sm);background:var(--navy);min-width:0}
.vn-provs .pg img{max-height:26px;max-width:100%;width:auto;height:auto;object-fit:contain;
  flex:0 1 auto;min-width:0}
.vn-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.vn-chips .pc{display:inline-flex;align-items:center;min-height:36px;padding:0 14px;
  border-radius:999px;background:var(--sheet);border:1px solid var(--line);color:var(--navy);
  font-size:12.5px;font-weight:700;font-family:var(--disp)}

/* game card wall */
.vn-gt{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}
.vn-gt .gt{display:grid;gap:6px;align-content:start;padding:0 0 12px;border-radius:var(--r-sm);
  background:var(--sheet);border:1px solid var(--line);min-width:0;overflow:hidden}
.vn-gt .gt img{width:100%;aspect-ratio:1/1;object-fit:cover;min-width:0}
.vn-gt .gt em{font-style:normal;font-size:11.5px;font-weight:700;color:var(--navy);
  line-height:1.35;padding:6px 12px 0;font-family:var(--disp)}
.vn-gt .gt small{font-size:10px;color:var(--mut);padding:0 12px;letter-spacing:.04em;
  text-transform:uppercase}

/* trust badges */
.vn-trust{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px}
.vn-trust .tb{display:grid;justify-items:center;align-content:center;gap:9px;min-height:86px;
  padding:14px 10px;border-radius:var(--r-sm);background:var(--navy);min-width:0}
.vn-trust .tb img{max-height:28px;max-width:100%;width:auto;height:auto;object-fit:contain;
  min-width:0}
.vn-trust .tb em{font-style:normal;font-size:10px;font-weight:700;color:#A6B0C9;
  text-align:center;line-height:1.35;min-width:0;letter-spacing:.05em;text-transform:uppercase}

/* cashier rows */
.vn-cash{display:grid;gap:12px}
.vn-cash .cr{display:grid;grid-template-columns:12px minmax(0,1fr);gap:18px;align-items:stretch;
  padding:18px 20px;border-radius:var(--r-sm);background:var(--sheet);border:1px solid var(--line)}
.vn-cash .dot{width:12px;border-radius:999px;background:var(--cer)}
.vn-cash .bd{display:grid;gap:6px;min-width:0}
.vn-cash .bd b{font-family:var(--disp);font-size:17px;color:var(--navy)}
.vn-cash .bd em{font-style:normal;justify-self:start;font-size:11.5px;font-weight:700;
  letter-spacing:.05em;text-transform:uppercase;color:var(--amb-d);background:var(--amb-l);
  padding:4px 11px;border-radius:999px}
.vn-cash .bd p{margin:2px 0 0;font-size:13.5px;color:var(--mut);line-height:1.65}

/* support rows */
.vn-support{display:grid;gap:12px}
.vn-support .sr{display:grid;grid-template-columns:52px minmax(0,1fr);gap:18px;align-items:start;
  padding:20px;border-radius:var(--r-sm);background:var(--sheet);border:1px solid var(--line)}
.vn-support .ic{display:flex;align-items:center;justify-content:center;width:52px;height:52px;
  border-radius:50%;background:var(--page-2);color:var(--navy);flex:none}
.vn-support .ic svg{width:27px;height:27px}
.vn-support .bd{display:grid;gap:6px;min-width:0}
.vn-support .bd b{font-family:var(--disp);font-size:17px;color:var(--navy)}
.vn-support .bd em{font-style:normal;justify-self:start;font-size:12px;font-weight:700;
  color:var(--cer-d)}
.vn-support .bd p{margin:2px 0 0;font-size:13.5px;color:var(--mut);line-height:1.65}

/* four steps */
.vn-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.vn-steps .sp{display:grid;gap:12px;align-content:start;padding:22px 20px;border-radius:var(--r);
  background:var(--sheet);border:1px solid var(--line);min-width:0}
.vn-steps em{font-style:normal;display:flex;align-items:center;justify-content:center;width:38px;
  height:38px;border-radius:50%;background:var(--cer);color:#fff;font-family:var(--disp);
  font-size:17px;font-weight:700}
.vn-steps p{margin:0;font-size:13.5px;color:var(--txt);line-height:1.68}

/* full-width photographic band, caption on a navy plate */
.vn-band{position:relative;margin:20px 0;background:var(--navy)}
.vn-band>img{width:100%;aspect-ratio:21/8;object-fit:cover;object-position:center 45%}
.vn-band .w{position:absolute;left:0;right:0;bottom:0;padding-bottom:0}
.vn-band p{margin:0;display:inline-block;max-width:36ch;padding:16px 20px;background:var(--navy);
  color:#fff;font-family:var(--disp);font-weight:700;font-size:21px;
  border-left:4px solid var(--amb);line-height:1.34;border-radius:0 var(--r-sm) 0 0}

/* ---------- prose ---------- */
.vn-prose{max-width:880px}
.vn-prose h1{font-size:35px;color:var(--navy);margin-bottom:16px}
.vn-prose h2{font-size:24px;color:var(--navy);margin:36px 0 14px;scroll-margin-top:88px;
  padding-left:16px;border-left:4px solid var(--cer)}
.vn-prose h2:first-child{margin-top:0}
.vn-prose p{margin:0 0 16px;color:#2C3550}
.vn-prose .lead{font-size:17.5px;color:var(--mut);margin-bottom:24px}
.vn-prose ul{margin:0 0 18px;padding-left:22px;display:grid;gap:8px;color:#2C3550}
.vn-prose .act{display:flex;flex-wrap:wrap;gap:12px;margin:0 0 28px}
.vn-tw{overflow-x:auto;margin:8px 0 28px;border-radius:var(--r-sm);border:1px solid var(--line)}
.vn-tbl{font-size:13.5px;min-width:480px}
.vn-tbl th{background:var(--navy);color:var(--amb);text-align:left;padding:13px 16px;
  font-size:11.5px;letter-spacing:.07em;text-transform:uppercase;font-family:var(--disp)}
.vn-tbl td{padding:13px 16px;border-bottom:1px solid var(--line);color:#2C3550;
  background:var(--sheet)}
.vn-tbl tbody tr:last-child td{border-bottom:0}
.vn-tbl tbody tr:nth-child(even) td{background:var(--page)}
.vn-faq{display:grid;gap:0;margin:0 0 10px}
.vn-faq details{border-bottom:1px solid var(--line)}
.vn-faq summary{cursor:pointer;padding:16px 0;font-weight:700;font-size:15.5px;color:var(--navy);
  font-family:var(--disp);list-style:none}
.vn-faq summary::-webkit-details-marker{display:none}
.vn-faq summary::before{content:"+";display:inline-block;width:22px;color:var(--cer);
  font-weight:700}
.vn-faq details[open] summary::before{content:"\2013"}
.vn-faq p{margin:0;padding:0 0 18px 22px;color:#2C3550}

/* closing band */
.vn-close{padding:12px 0 44px}
.vn-close .w{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:22px;
  padding:28px 30px;border-radius:var(--r);background:var(--navy);
  border-left:5px solid var(--cer)}
.vn-close b{font-family:var(--disp);font-size:20px;line-height:1.45;max-width:64ch;color:#fff;
  font-weight:700}

/* ---------- footer ---------- */
.vn-foot{background:var(--navy);margin-top:16px}
.vn-foot .w{padding-top:38px;padding-bottom:32px;display:grid;gap:26px}
.vn-foot .top{display:grid;grid-template-columns:1.6fr repeat(4,1fr);gap:26px}
.vn-foot .ab{display:grid;gap:14px;align-content:start;min-width:0}
.vn-foot .ab p{margin:0;font-size:12.5px;color:#99A3BE;line-height:1.75}
.vn-foot .vn-logo{color:#fff}
.vn-foot .vn-logo .wm span{color:var(--amb)}
.vn-foot .top>div{display:grid;gap:8px;align-content:start;min-width:0}
.vn-foot h4{font-size:10.5px;letter-spacing:.17em;text-transform:uppercase;color:var(--amb)}
.vn-foot a{display:inline-flex;align-items:center;min-height:34px;color:#99A3BE;font-size:13px}
.vn-foot a:hover{color:#fff}
.vn-foot .pay,.vn-foot .trust{display:flex;flex-wrap:wrap;gap:10px;padding-top:22px;
  border-top:1px solid var(--line-2)}
.vn-foot .pay span,.vn-foot .trust span{display:flex;align-items:center;justify-content:center;
  height:40px;padding:0 14px;border-radius:999px;background:var(--navy-2);min-width:0}
.vn-foot .pay img{max-height:19px;width:auto;object-fit:contain;min-width:0}
.vn-foot .trust img{max-height:22px;width:auto;object-fit:contain;min-width:0}
.vn-foot .legal{display:flex;flex-wrap:wrap;align-items:center;gap:14px;padding-top:20px;
  border-top:1px solid var(--line-2)}
.vn-foot .legal p{margin:0;flex:1;min-width:250px;font-size:12.5px;color:#99A3BE}
.vn-foot .legal small{font-size:12px;color:#8590AC}
.vn-foot .age{display:inline-flex;align-items:center;justify-content:center;flex:none;width:38px;
  height:38px;border-radius:50%;background:var(--cer);color:#fff;font-weight:700;font-size:12px;
  font-family:var(--disp)}

/* ---------- the one pinned strip: it stays on a phone, in the thumb arc ---------- */
.vn-sticky{position:fixed;left:0;right:0;bottom:0;z-index:60;display:flex;align-items:center;
  justify-content:center;gap:18px;padding:10px 18px;background:var(--navy);
  box-shadow:0 -10px 26px rgba(17,26,51,.26)}
.vn-sticky.off{display:none}
.vn-sticky>span{font-size:13.5px;color:#fff;font-weight:700}
.vn-sticky .bt{display:flex;gap:10px;flex:none}
.vn-sticky .vn-btn{min-height:44px;padding:0 20px;font-size:13.5px}
.vn-sticky .vn-btn.g{background:transparent;color:#fff;border-color:rgba(247,248,251,.5)}
.vn-sticky .vn-btn.g:hover{background:#fff;color:var(--navy)}
.vn-sticky .x{width:44px;height:44px;border-radius:50%;border:0;flex:none;background:var(--navy-2);
  color:#99A3BE;font-size:18px;line-height:1;cursor:pointer}

/* ---------- paged entry modal ---------- */
.vn-pop[hidden]{display:none}
.vn-pop{position:fixed;inset:0;z-index:80;display:flex;align-items:center;justify-content:center;
  padding:18px;background:rgba(17,26,51,.72)}
.vn-pop .bx{position:relative;width:min(360px,100%);max-height:92vh;overflow:auto;
  border-radius:var(--r);background:var(--sheet);box-shadow:0 24px 54px rgba(17,26,51,.45);
  padding:0 0 18px}
.vn-pop .x{position:absolute;top:10px;right:10px;width:36px;height:36px;border:0;
  border-radius:50%;cursor:pointer;font-size:21px;line-height:1;color:#fff;
  background:rgba(17,26,51,.6);z-index:3}
.vn-pop .tp{display:grid;gap:5px;padding:18px;background:var(--navy);text-align:center}
.vn-pop .tp .wm{font-family:var(--disp);font-weight:700;font-size:21px;color:#fff;
  letter-spacing:.04em}
.vn-pop .tp em{font-style:normal;font-size:11px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--amb)}
.vn-pop .pn{display:grid;gap:13px;padding:22px 22px 6px}
.vn-pop .pn[hidden]{display:none!important}
.vn-pop .pn b{font-family:var(--disp);font-size:21px;color:var(--navy);line-height:1.3}
.vn-pop .pn p{margin:0;font-size:13.5px;color:var(--mut);line-height:1.65}
.vn-pop .pg{display:flex;justify-content:center;gap:10px;padding:16px 0 8px}
.vn-pop .pg .dt{width:30px;height:5px;border-radius:999px;border:0;cursor:pointer;padding:0;
  background:var(--line)}
.vn-pop .pg .dt.on{background:var(--cer)}
.vn-pop .later{display:block;margin:0 auto;border:0;background:none;cursor:pointer;font:inherit;
  font-size:12.5px;color:var(--mut);text-decoration:underline;padding:6px 10px}

/* ---------- responsive ---------- */
@media(max-width:1060px){
  .vn-trust{grid-template-columns:repeat(4,minmax(0,1fr))}
  .vn-provs{grid-template-columns:repeat(4,minmax(0,1fr))}
  .vn-provs.six{grid-template-columns:repeat(3,minmax(0,1fr))}
  .vn-ladder{grid-template-columns:repeat(2,minmax(0,1fr))}
  .vn-gt{grid-template-columns:repeat(4,minmax(0,1fr))}
  .vn-rail{grid-template-columns:repeat(4,minmax(0,1fr))}
  .vn-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .vn-cats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .vn-steps{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:1000px){
  .vn-hero h1,.vn-hero.big h1{font-size:33px}
  .vn-hero .lead{font-size:15.5px;line-height:1.62}
  .vn-hero .ph>img{aspect-ratio:16/9}
  .vn-hero .fig{grid-template-columns:repeat(2,minmax(0,1fr))}
  .vn-pills{display:none}
  .vn-burger{display:inline-flex;align-items:center;justify-content:center}
  /* The header row is logo + language chips + sign-in pill + burger. Below the pills breakpoint
     those four add up to 440px at a 375px viewport and the whole document scrolls sideways. The
     sign-in pill is the one that goes: the pinned strip already carries it, in the thumb arc. */
  .vn-head .w{justify-content:space-between;gap:10px}
  .vn-head>.w>.vn-btn{display:none}
  .vn-logo svg{width:30px;height:30px}
  .vn-live,.vn-draws,.vn-fish,.vn-reviews,.vn-budgets{grid-template-columns:repeat(2,minmax(0,1fr))}
  .vn-reb{grid-template-columns:1fr;gap:22px}
  .vn-foot .top{grid-template-columns:1fr 1fr}
  .vn-band>img{aspect-ratio:16/8}
}
@media(max-width:760px){
  body{padding-bottom:calc(var(--bar) + 18px)}
  .vn-hero{padding:22px 0 0}
  .vn-hero.big{padding:24px 0 0}
  .vn-sec{padding:26px 0}
  .vn-trust,.vn-provs,.vn-rail{grid-template-columns:repeat(3,minmax(0,1fr))}
  .vn-gt{grid-template-columns:repeat(3,minmax(0,1fr))}
  .vn-weights .wr{grid-template-columns:minmax(0,1fr) 76px;row-gap:6px}
  .vn-weights .wr span{grid-column:1/-1}
  .vn-sec .sh h2{font-size:23px}
  .vn-prose h1{font-size:28px}
  .vn-prose h2{font-size:21px;scroll-margin-top:74px}
  .vn-band p{font-size:16.5px;padding:13px 16px}
  .vn-close b{font-size:17.5px}
  .vn-reb .big em{font-size:54px}
  /* The pinned strip keeps the CTA in the thumb arc, so the sentence beside it goes and the two
     buttons take the full width. Nothing else is pinned at the bottom of a phone screen. */
  .vn-sticky{gap:10px;padding:9px 14px}
  .vn-sticky>span{display:none}
  .vn-sticky .bt{flex:1;min-width:0}
  .vn-sticky .bt .vn-btn{flex:1 1 0;min-width:0;padding:0 10px}
}
@media(max-width:560px){
  .w{padding:0 16px}
  .vn-hero h1,.vn-hero.big h1{font-size:28px}
  .vn-hero .w{gap:20px}
  .vn-hero .bd{gap:15px}
  .vn-hero .act .vn-btn{flex:1 1 100%}
  .vn-hero .fig{grid-template-columns:1fr;gap:12px}
  .vn-hero .chips span{flex:1 1 100%}
  .vn-logo .wm{font-size:18px}
  .vn-lang a{min-width:36px;padding:0 5px;font-size:11px}
  .vn-head .w{gap:8px}
  .vn-jump .ls{grid-template-columns:1fr}
  .vn-cats,.vn-live,.vn-draws,.vn-fish,.vn-reviews,.vn-budgets,.vn-steps,.vn-ladder{
    grid-template-columns:1fr}
  .vn-rail,.vn-trust,.vn-provs,.vn-provs.six{grid-template-columns:repeat(2,minmax(0,1fr))}
  .vn-gt{grid-template-columns:repeat(2,minmax(0,1fr))}
  .vn-kpis{grid-template-columns:1fr}
  .vn-band>img{aspect-ratio:4/3}
  .vn-offers .of{grid-template-columns:48px minmax(0,1fr);row-gap:14px}
  .vn-offers .ic{width:48px;height:48px}
  .vn-offers .vn-btn{grid-column:1/-1;width:100%}
  .vn-support .sr{grid-template-columns:1fr}
  .vn-weights .wr{grid-template-columns:minmax(0,1fr) auto}
  .vn-reb{padding:22px}
  .vn-close .w{padding:22px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
}

/* Near-black third-party artwork disappears on the navy chips, so the measured DARK_INK set is
   lifted to a white mark. Only that set: a SOLID badge (a coloured field with the wordmark
   knocked out) silhouettes into a featureless block. On the white payment chips the artwork is
   left exactly as the vendor ships it. */
.vn-provs .pg img.lift,
.vn-trust .tb img.lift,
.vn-foot .pay img.lift,
.vn-foot .trust img.lift{filter:brightness(0) invert(1);opacity:.92}

/* which offers run together: a tick or a cross, then the pairing and the reason */
.vn-stack{display:grid;gap:12px}
.vn-stack .sk{display:grid;grid-template-columns:46px minmax(0,1fr);gap:18px;align-items:start;
  padding:20px 22px;border-radius:var(--r-sm);background:var(--sheet);border:1px solid var(--line);
  border-left:4px solid var(--amb)}
.vn-stack .sk.no{border-left-color:var(--cer)}
.vn-stack .yn{display:flex;align-items:center;justify-content:center;width:46px;height:46px;
  border-radius:50%;background:var(--amb-l);color:var(--amb-d);font-size:20px;font-weight:700;
  flex:none;line-height:1}
.vn-stack .sk.no .yn{background:var(--cer-l);color:var(--cer-d)}
.vn-stack .bd{display:grid;gap:6px;min-width:0}
.vn-stack .bd b{font-family:var(--disp);font-size:17px;color:var(--navy);line-height:1.32}
.vn-stack .bd p{margin:0;font-size:13.5px;color:var(--mut);line-height:1.65}
@media(max-width:560px){.vn-stack .sk{grid-template-columns:38px minmax(0,1fr);gap:14px;
  padding:18px}.vn-stack .yn{width:38px;height:38px;font-size:17px}}
