/* typefaces ............................................... */
@import url("https://fonts.googleapis.com/css2?family=Outfit:wght@400;600;700;800&family=Lora:ital,wght@0,400;0,500;0,600;1,400&display=swap");

/* reset ................................................... */
*,*::before,*::after{box-sizing:border-box}
html,body,h1,h2,h3,h4,p,ul,ol,li,figure,blockquote,dl,dd,table,th,td{margin:0;padding:0}
ul,ol{list-style:none}
img,svg{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
table{border-collapse:collapse;width:100%}

/* tokens .................................................. */
:root{
  --bg-base:#0B1226;
  --bg-card:#141D3A;
  --accent:#2BA6F5;
  --highlight:#F7B23B;
  --text:#EBF1FB;
  --muted:#93A2C2;
  --border:#24314F;

  --font-head:"Outfit",system-ui,-apple-system,sans-serif;
  --font-read:"Lora",Georgia,"Times New Roman",serif;
  --step-xs:.78rem; --step-sm:.9rem; --step-0:1rem;
  --step-1:1.18rem; --step-2:1.44rem; --step-3:1.78rem; --step-4:2.3rem;
  --round-s:5px; --round-m:11px; --round-l:22px;
  --ease:.2s cubic-bezier(.4,0,.2,1);
  --shell:1160px;
  --gut:18px;
}

/* page surface ............................................ */
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  background:var(--bg-base);
  color:var(--text);
  font-family:var(--font-read);
  font-size:var(--step-0);
  line-height:1.72;
  overflow-x:hidden;
  padding-bottom:68px;
}
body::-webkit-scrollbar{width:11px}
body::-webkit-scrollbar-track{background:var(--bg-base)}
body::-webkit-scrollbar-thumb{background:var(--border);border-radius:99px}
body::-webkit-scrollbar-thumb:hover{background:var(--accent)}
::selection{background:var(--highlight);color:var(--bg-base)}
:focus-visible{outline:2px solid var(--highlight);outline-offset:2px}

/* type .................................................... */
h1,h2,h3,h4{font-family:var(--font-head);line-height:1.17;font-weight:800;letter-spacing:-.015em}
h1{font-size:var(--step-4);margin-bottom:.55em}
h2{font-size:var(--step-3);margin:1.9em 0 .6em}
h3{font-size:var(--step-1);font-weight:700;margin:1.5em 0 .4em}
h4{font-size:var(--step-0);font-weight:700;margin:1.2em 0 .3em}
p{margin-bottom:1.05em}
p a,li a{color:var(--accent);border-bottom:1px solid rgba(43,166,245,.38)}
p a:hover,li a:hover{color:var(--highlight);border-bottom-color:var(--highlight)}
strong{font-weight:600;color:#fff}
small{font-size:var(--step-xs)}

/* shell ................................................... */
.q7v_shell{width:100%;max-width:var(--shell);margin-inline:auto;padding-inline:var(--gut)}
.q7v_narrow{max-width:760px;margin-inline:auto}

/* buttons ................................................. */
.q7v_btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5em;
  font-family:var(--font-head);font-weight:700;letter-spacing:.012em;
  min-height:46px;padding:12px 22px;border-radius:var(--round-m);
  text-align:center;transition:transform var(--ease),box-shadow var(--ease),background var(--ease);
}
.q7v_btn:active{transform:translateY(1px)}
.q7v_btn--primary{background:var(--accent);color:#04101F;box-shadow:0 6px 20px rgba(43,166,245,.3)}
.q7v_btn--primary:hover{background:#56BCFA;box-shadow:0 9px 26px rgba(43,166,245,.42)}
.q7v_btn--gold{background:var(--highlight);color:#2A1A02;box-shadow:0 6px 20px rgba(247,178,59,.3)}
.q7v_btn--gold:hover{background:#FFC55F;box-shadow:0 9px 26px rgba(247,178,59,.44)}
.q7v_btn--outline{border:2px solid var(--border);color:var(--text)}
.q7v_btn--outline:hover{border-color:var(--accent);color:var(--accent)}
.q7v_btn--ghost{color:var(--muted);padding:10px 8px;min-height:44px}
.q7v_btn--ghost:hover{color:var(--highlight)}
.q7v_btn--sm{min-height:44px;padding:9px 16px;font-size:var(--step-sm)}
.q7v_btn--lg{min-height:56px;padding:16px 30px;font-size:var(--step-1)}
.q7v_btn--full{display:flex;width:100%}

/* navigation .............................................. */
.q7v_hdr{
  position:sticky;top:0;z-index:50;
  background:rgba(11,18,38,.94);
  border-bottom:1px solid var(--border);
  backdrop-filter:blur(9px);
}
.q7v_hdr-row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:62px}
.q7v_logo{display:flex;align-items:center}
.q7v_logo img{width:116px;height:43px}
.q7v_nav{display:none}
.q7v_nav ul{display:flex;align-items:center;gap:4px}
.q7v_nav a{
  display:block;padding:9px 11px;border-radius:var(--round-s);
  font-family:var(--font-head);font-size:var(--step-sm);font-weight:600;color:var(--muted);
  transition:color var(--ease),background var(--ease);
}
.q7v_nav a:hover,.q7v_nav a[aria-current="page"]{color:var(--text);background:var(--bg-card)}
.q7v_burger{
  display:flex;align-items:center;justify-content:center;
  width:46px;height:46px;border:1px solid var(--border);border-radius:var(--round-s);
}
.q7v_burger span{position:relative;display:block;width:19px;height:2px;background:var(--text)}
.q7v_burger span::before,.q7v_burger span::after{content:"";position:absolute;left:0;width:19px;height:2px;background:var(--text)}
.q7v_burger span::before{top:-6px}
.q7v_burger span::after{top:6px}
.q7v_mnav{display:none;border-top:1px solid var(--border);padding:10px 0 16px}
.q7v_mnav.open{display:block}
.q7v_mnav a{
  display:block;padding:12px 4px;min-height:46px;
  font-family:var(--font-head);font-weight:600;color:var(--muted);
  border-bottom:1px solid var(--border);
}
.q7v_mnav a:hover{color:var(--highlight)}
.q7v_hdr-cta{display:none}

/* ticker .................................................. */
.q7v_ticker{
  background:linear-gradient(90deg,var(--bg-card),rgba(43,166,245,.12));
  border-bottom:1px solid var(--border);
  font-family:var(--font-head);font-size:var(--step-xs);font-weight:600;
  color:var(--muted);letter-spacing:.04em;text-transform:uppercase;
}
.q7v_ticker p{margin:0;padding:8px 0;text-align:center}
.q7v_ticker b{color:var(--highlight);font-weight:700}

/* hero .................................................... */
.q7v_hero{position:relative;overflow:hidden;padding:40px 0 34px;text-align:center}
.q7v_hero::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:
    radial-gradient(60% 55% at 50% 0%,rgba(43,166,245,.26),transparent 70%),
    radial-gradient(50% 45% at 82% 88%,rgba(247,178,59,.17),transparent 72%),
    linear-gradient(180deg,#0E1731,var(--bg-base));
}
.q7v_hero-kick{
  display:inline-block;margin-bottom:14px;padding:6px 13px;
  border:1px solid var(--highlight);border-radius:99px;
  font-family:var(--font-head);font-size:var(--step-xs);font-weight:700;
  letter-spacing:.07em;text-transform:uppercase;color:var(--highlight);
}
.q7v_hero p{color:var(--muted);font-size:var(--step-1)}
.q7v_hero-lede{max-width:620px;margin-inline:auto}
.q7v_hero-actions{display:flex;flex-direction:column;gap:11px;margin:22px auto 0;max-width:340px}

/* offer banner — rebuilt in brand colours, never a blank gradient */
.q7v_offer{
  max-width:560px;margin:26px auto 0;padding:22px 18px;
  border:1px solid var(--highlight);border-radius:var(--round-l);
  background:linear-gradient(165deg,rgba(247,178,59,.14),rgba(43,166,245,.1) 58%,var(--bg-card));
  box-shadow:0 18px 46px rgba(4,9,22,.6);
}
.q7v_offer img{margin:0 auto 12px;width:132px;height:49px}
.q7v_offer-big{
  display:block;font-family:var(--font-head);font-weight:800;
  font-size:clamp(1.9rem,8.4vw,2.9rem);line-height:1.08;color:var(--highlight);
}
.q7v_offer-sub{display:block;margin-top:6px;font-family:var(--font-head);font-weight:600;font-size:var(--step-1);color:var(--text)}
.q7v_offer-fine{margin:12px 0 16px;font-size:var(--step-xs);color:var(--muted);line-height:1.5}

/* trust strip ............................................. */
.q7v_trust{border-block:1px solid var(--border);background:var(--bg-card)}
.q7v_trust ul{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--border)}
.q7v_trust li{background:var(--bg-card);padding:14px 12px;text-align:center}
.q7v_trust dt,.q7v_trust b{
  display:block;font-family:var(--font-head);font-weight:800;font-size:var(--step-1);color:var(--highlight);
}
.q7v_trust span{display:block;font-size:var(--step-xs);color:var(--muted);letter-spacing:.03em;text-transform:uppercase}

/* article body ............................................ */
.q7v_main{padding:8px 0 30px}
.q7v_sec{padding:6px 0 10px}
.q7v_sec--boxed{
  margin:26px 0;padding:22px 18px;
  background:var(--bg-card);border:1px solid var(--border);border-radius:var(--round-l);
}
.q7v_lead{font-size:var(--step-1);color:var(--text)}
.q7v_note{
  margin:20px 0;padding:15px 16px 15px 18px;
  border-left:3px solid var(--accent);border-radius:0 var(--round-m) var(--round-m) 0;
  background:rgba(43,166,245,.08);font-size:var(--step-sm);
}
.q7v_note--warn{border-left-color:var(--highlight);background:rgba(247,178,59,.09)}
.q7v_note p:last-child{margin-bottom:0}

.q7v_list{margin:0 0 1.1em}
.q7v_list li{position:relative;padding-left:24px;margin-bottom:.52em}
.q7v_list li::before{
  content:"";position:absolute;left:4px;top:.68em;
  width:7px;height:7px;border-radius:2px;background:var(--accent);transform:rotate(45deg);
}
.q7v_list--gold li::before{background:var(--highlight)}

.q7v_steps{counter-reset:q7v 0;margin:0 0 1.2em}
.q7v_steps li{counter-increment:q7v;position:relative;padding-left:46px;margin-bottom:1em}
.q7v_steps li::before{
  content:counter(q7v);position:absolute;left:0;top:1px;
  display:flex;align-items:center;justify-content:center;width:32px;height:32px;
  border-radius:50%;background:var(--accent);color:#04101F;
  font-family:var(--font-head);font-weight:800;font-size:var(--step-sm);
}

.q7v_tablewrap{overflow-x:auto;margin:18px 0 22px;border:1px solid var(--border);border-radius:var(--round-m)}
.q7v_tablewrap table{min-width:460px;font-size:var(--step-sm)}
.q7v_tablewrap caption{
  padding:11px 14px;text-align:left;background:var(--bg-card);
  font-family:var(--font-head);font-weight:700;font-size:var(--step-sm);color:var(--muted);
  border-bottom:1px solid var(--border);
}
th,td{padding:11px 14px;text-align:left;border-bottom:1px solid var(--border);vertical-align:top}
thead th{background:rgba(43,166,245,.1);font-family:var(--font-head);font-weight:700;color:var(--text);white-space:nowrap}
tbody tr:last-child td{border-bottom:0}
tbody tr:nth-child(even){background:rgba(255,255,255,.018)}
td b{color:var(--highlight);font-weight:600}

/* slot tiles */
.q7v_tiles{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:18px 0 10px}
.q7v_tile{
  overflow:hidden;background:var(--bg-card);
  border:1px solid var(--border);border-radius:var(--round-m);
}
.q7v_tile img{width:100%;height:auto;aspect-ratio:16/11;object-fit:cover}
.q7v_tile b,.q7v_tile span{
  display:block;padding:9px 11px;font-family:var(--font-head);font-weight:600;font-size:var(--step-sm);
}
.q7v_tile span{color:var(--muted);font-size:var(--step-xs);padding-top:0}
.q7v_tile--text{display:flex;flex-direction:column;justify-content:center;min-height:118px;padding:14px 13px;text-align:left}
.q7v_tile--text b{padding:0;font-size:var(--step-0);color:var(--text)}
.q7v_tile--text span{padding:4px 0 0}

/* provider + payment chips */
.q7v_chips{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0 20px;padding:0}
.q7v_chips li{
  display:flex;align-items:center;gap:7px;
  padding:8px 13px;border:1px solid var(--border);border-radius:99px;
  background:var(--bg-card);font-family:var(--font-head);font-size:var(--step-sm);font-weight:600;
}
.q7v_chips svg{flex:none;width:16px;height:16px}
.q7v_chips--pay li{border-color:rgba(43,166,245,.34)}
.q7v_chips--pay li:first-child{border-color:var(--highlight);color:var(--highlight)}

/* screenshot figures */
.q7v_shot{margin:22px 0}
.q7v_shot img{
  width:100%;height:auto;border:1px solid var(--border);border-radius:var(--round-m);
  box-shadow:0 14px 36px rgba(4,9,22,.5);
}
.q7v_shot figcaption{margin-top:9px;font-size:var(--step-xs);color:var(--muted);text-align:center}

/* faq ..................................................... */
.q7v_faq{margin:16px 0 8px}
.q7v_faq-item{margin-bottom:9px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--round-m)}
.q7v_faq-btn{
  display:flex;align-items:flex-start;justify-content:space-between;gap:14px;
  width:100%;min-height:52px;padding:14px 16px;text-align:left;
  font-family:var(--font-head);font-weight:700;font-size:var(--step-0);line-height:1.38;
}
.q7v_faq-btn::after{content:"+";flex:none;font-size:1.4rem;line-height:1;color:var(--accent);transition:transform var(--ease)}
.q7v_faq-item.open .q7v_faq-btn::after{content:"\2013";transform:translateY(2px)}
.q7v_faq-a{display:none;padding:0 16px 15px;font-size:var(--step-sm);color:var(--muted)}
.q7v_faq-item.open .q7v_faq-a{display:block}
.q7v_faq-a p:last-child{margin-bottom:0}

/* cta band ................................................ */
.q7v_band{
  margin:30px 0 6px;padding:28px 18px;text-align:center;
  border:1px solid var(--border);border-radius:var(--round-l);
  background:linear-gradient(150deg,rgba(43,166,245,.17),rgba(247,178,59,.1) 70%,var(--bg-card));
}
.q7v_band h2{margin-top:0;font-size:var(--step-2)}
.q7v_band p{color:var(--muted);max-width:500px;margin-inline:auto}
.q7v_band .q7v_btn{margin-top:6px}

/* footer .................................................. */
.q7v_ftr{border-top:1px solid var(--border);background:#070C1B;padding:30px 0 26px;font-size:var(--step-sm)}
.q7v_ftr h2,.q7v_ftr p,.q7v_ftr li{color:var(--muted)}
.q7v_ftr-grid{display:grid;gap:24px}
.q7v_ftr-links{display:flex;flex-wrap:wrap;gap:6px 16px}
.q7v_ftr-links a{font-family:var(--font-head);font-weight:600;color:var(--muted)}
.q7v_ftr-links a:hover{color:var(--highlight)}
.q7v_badges{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 16px}
.q7v_badges a,.q7v_badges span{
  display:inline-flex;align-items:center;gap:6px;
  padding:7px 12px;min-height:38px;
  border:1px solid var(--border);border-radius:var(--round-s);
  background:var(--bg-card);font-family:var(--font-head);font-size:var(--step-xs);font-weight:600;color:var(--muted);
}
.q7v_badges a:hover{border-color:var(--highlight);color:var(--highlight)}
.q7v_badges .q7v_age{border-color:var(--highlight);color:var(--highlight)}
.q7v_ftr-fine{margin-top:18px;padding-top:16px;border-top:1px solid var(--border);font-size:var(--step-xs);line-height:1.6}
.q7v_stamp{font-family:var(--font-head);font-weight:600;color:var(--highlight)}

/* sticky bar .............................................. */
.q7v_sticky{
  position:fixed;left:0;right:0;bottom:0;z-index:60;
  display:flex;align-items:center;gap:11px;
  padding:9px 14px calc(9px + env(safe-area-inset-bottom));
  background:rgba(11,18,38,.97);border-top:1px solid var(--border);backdrop-filter:blur(9px);
}
.q7v_sticky p{flex:1;margin:0;font-size:var(--step-xs);line-height:1.36;color:var(--muted)}
.q7v_sticky b{display:block;color:var(--highlight);font-family:var(--font-head);font-size:var(--step-sm)}
.q7v_sticky .q7v_btn{flex:none}

/* motion .................................................. */
@keyframes q7v-glow{0%,100%{opacity:.85}50%{opacity:1}}
.q7v_offer-big{animation:q7v-glow 3.4s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  html{scroll-behavior:auto}
}

/* breakpoints ............................................. */
@media (min-width:480px){
  :root{--gut:22px}
  .q7v_hero-actions{flex-direction:row;justify-content:center;max-width:none}
  .q7v_hero-actions .q7v_btn{flex:0 1 220px}
  .q7v_trust ul{grid-template-columns:repeat(4,1fr)}
  .q7v_tiles{grid-template-columns:repeat(3,1fr)}
}
@media (min-width:768px){
  :root{--step-3:2.05rem;--step-4:3rem}
  .q7v_burger,.q7v_mnav{display:none!important}
  .q7v_nav{display:block}
  .q7v_hdr-cta{display:inline-flex}
  .q7v_sticky{display:none}
  body{padding-bottom:0}
  .q7v_hero{padding:60px 0 48px}
  .q7v_sec--boxed{padding:28px 26px}
  .q7v_band{padding:40px 30px}
  .q7v_ftr-grid{grid-template-columns:1.6fr 1fr}
  .q7v_offer{padding:30px 28px}
}
@media (min-width:1024px){
  :root{--step-4:3.5rem;--gut:28px}
  .q7v_tiles{grid-template-columns:repeat(4,1fr)}
  .q7v_hero{padding:76px 0 56px}
  .q7v_narrow{max-width:800px}
}