/* ==========================================================================
   HimeraVPN — design system
   Dark "operator console" aesthetic. Mobile-first.
   ========================================================================== */

/* --- metric-compatible fallbacks: kill CLS while webfonts load --- */
@font-face{
  font-family:'Manrope Fallback';
  src:local('Arial');
  size-adjust:104%;
  ascent-override:97%;
  descent-override:24%;
  line-gap-override:0%;
}
@font-face{
  font-family:'Inter Fallback';
  src:local('Arial');
  size-adjust:107%;
  ascent-override:90%;
  descent-override:22%;
  line-gap-override:0%;
}

:root{
  /* surfaces */
  --void:#06080F;
  --surface:#0B1018;
  --surface-2:#111927;
  --surface-3:#182335;

  /* edges */
  --edge:rgba(255,255,255,0.07);
  --edge-2:rgba(255,255,255,0.13);

  /* text */
  --fg:#F0F4FA;
  --fg-2:#AEBBCE;
  --fg-3:#7A8AA3;

  /* accents */
  --cy:#22D3EE;
  --cy-2:#67E8F9;
  --cy-dim:rgba(34,211,238,0.12);
  --flame:#FF6B4A;
  --flame-2:#FF8F72;
  --ok:#4ADE80;

  /* type */
  --display:'Manrope','Manrope Fallback',system-ui,sans-serif;
  --body:'Inter','Inter Fallback',system-ui,sans-serif;
  --mono:ui-monospace,'SF Mono',SFMono-Regular,Menlo,Consolas,'Liberation Mono',monospace;

  --r-sm:12px;
  --r:18px;
  --r-lg:26px;
  --maxw:1200px;
}

*,*::before,*::after{box-sizing:border-box;}
*{margin:0;padding:0;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{
  font-family:var(--body);
  font-size:16px;
  line-height:1.6;
  background:var(--void);
  color:var(--fg-2);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
h1,h2,h3,h4{
  font-family:var(--display);
  font-weight:800;
  letter-spacing:-0.028em;
  line-height:1.08;
  color:var(--fg);
  text-wrap:balance;
}
a{color:inherit;text-decoration:none;}
img,svg,video{display:block;max-width:100%;}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer;}
ul,ol{list-style:none;}
::selection{background:rgba(34,211,238,0.28);color:#fff;}

:focus-visible{outline:2px solid var(--cy);outline-offset:3px;border-radius:4px;}

.wrap{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:20px;}
.wrap-narrow{width:100%;max-width:820px;margin-inline:auto;padding-inline:20px;}
@media(min-width:768px){
  .wrap,.wrap-narrow{padding-inline:32px;}
}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;}
.skip{
  position:absolute;left:-9999px;top:0;z-index:200;
  background:var(--flame);color:#fff;padding:12px 20px;
  border-radius:0 0 var(--r-sm) 0;font-weight:700;
}
.skip:focus{left:0;}

/* ==========================================================================
   HEADER
   ========================================================================== */
.site-header{
  position:sticky;top:0;z-index:100;
  background:rgba(6,8,15,0.72);
  backdrop-filter:blur(16px) saturate(140%);
  -webkit-backdrop-filter:blur(16px) saturate(140%);
  border-bottom:1px solid var(--edge);
}
.hdr-inner{
  display:flex;align-items:center;gap:16px;
  height:64px;
}
@media(min-width:768px){ .hdr-inner{height:72px;} }

.brand{
  display:inline-flex;align-items:center;gap:9px;
  font-family:var(--display);font-weight:800;font-size:18px;
  letter-spacing:-0.03em;color:var(--fg);
  flex-shrink:0;
}
.brand-mark{
  width:32px;height:32px;border-radius:9px;flex-shrink:0;
  background:linear-gradient(140deg,var(--cy) 0%,#0EA5E9 100%);
  display:grid;place-items:center;
  box-shadow:0 0 0 1px rgba(34,211,238,0.25),0 6px 18px -6px rgba(34,211,238,0.5);
}
.brand-mark svg{width:18px;height:18px;}

.nav{
  display:none;
  margin-inline:auto;
  align-items:center;gap:4px;
  min-width:0;
}
.nav a{
  padding:8px 13px;border-radius:100px;
  font-size:14px;font-weight:500;color:var(--fg-3);
  white-space:nowrap;
  transition:color .18s ease,background .18s ease;
}
.nav a:hover{color:var(--fg);background:rgba(255,255,255,0.05);}
.nav a[aria-current="page"]{color:var(--fg);background:rgba(255,255,255,0.07);}
@media(min-width:1000px){ .nav{display:flex;} }

.hdr-actions{display:flex;align-items:center;gap:10px;margin-left:auto;flex-shrink:0;}
@media(min-width:1000px){ .hdr-actions{margin-left:0;} }

.burger{
  display:grid;place-items:center;
  width:40px;height:40px;border-radius:11px;flex-shrink:0;
  background:rgba(255,255,255,0.05);border:1px solid var(--edge);
  color:var(--fg);
}
.burger svg{width:19px;height:19px;}
.burger .ico-x{display:none;}
.burger[aria-expanded="true"] .ico-bar{display:none;}
.burger[aria-expanded="true"] .ico-x{display:block;}
@media(min-width:1000px){ .burger{display:none;} }

.mnav{
  display:none;
  position:absolute;left:0;right:0;top:100%;
  background:rgba(8,11,19,0.98);
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  border-bottom:1px solid var(--edge);
  padding:8px 0 14px;
  max-height:calc(100dvh - 64px);overflow-y:auto;
}
.mnav.is-open{display:block;}
.mnav a{
  display:block;padding:14px 20px;
  font-size:16px;font-weight:600;color:var(--fg-2);
  border-bottom:1px solid rgba(255,255,255,0.045);
}
@media(min-width:768px){ .mnav a{padding-inline:32px;} }
.mnav a:last-child{border-bottom:none;}
.mnav a:hover{color:var(--cy-2);}

/* ==========================================================================
   BUTTONS
   ========================================================================== */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  padding:13px 24px;border-radius:100px;
  font-family:var(--display);font-weight:700;font-size:15px;letter-spacing:-0.01em;
  white-space:nowrap;text-align:center;
  transition:transform .16s cubic-bezier(.2,.8,.3,1),box-shadow .2s ease,background .2s ease,border-color .2s ease;
}
.btn svg{width:18px;height:18px;flex-shrink:0;}
.btn--primary{
  background:linear-gradient(135deg,var(--flame) 0%,#F0562F 100%);
  color:#fff;
  box-shadow:0 8px 26px -10px rgba(255,107,74,0.7),inset 0 1px 0 rgba(255,255,255,0.22);
}
.btn--primary:hover{transform:translateY(-2px);box-shadow:0 14px 34px -10px rgba(255,107,74,0.8),inset 0 1px 0 rgba(255,255,255,0.22);}
.btn--primary:active{transform:translateY(0);}
.btn--outline{
  background:rgba(255,255,255,0.04);color:var(--fg);
  border:1px solid var(--edge-2);
}
.btn--outline:hover{background:rgba(255,255,255,0.09);border-color:rgba(255,255,255,0.22);}
.btn--cy{
  background:rgba(34,211,238,0.1);color:var(--cy-2);
  border:1px solid rgba(34,211,238,0.3);
}
.btn--cy:hover{background:rgba(34,211,238,0.17);}
.btn--lg{padding:16px 32px;font-size:16.5px;}
.btn--sm{padding:9px 17px;font-size:14px;}
.btn--block{width:100%;}

/* ==========================================================================
   BACKDROP PRIMITIVES
   ========================================================================== */
.aurora{
  position:absolute;inset:0;pointer-events:none;z-index:0;
  background:
    radial-gradient(ellipse 70% 55% at 78% -8%,rgba(34,211,238,0.20),transparent 62%),
    radial-gradient(ellipse 55% 45% at 8% 12%,rgba(255,107,74,0.13),transparent 60%),
    radial-gradient(ellipse 60% 50% at 50% 105%,rgba(14,165,233,0.10),transparent 65%);
}
.grid-bg{
  position:absolute;inset:0;pointer-events:none;z-index:0;
  background-image:
    linear-gradient(rgba(255,255,255,0.028) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,0.028) 1px,transparent 1px);
  background-size:64px 64px;
  mask-image:radial-gradient(ellipse 80% 70% at 50% 30%,#000 30%,transparent 78%);
  -webkit-mask-image:radial-gradient(ellipse 80% 70% at 50% 30%,#000 30%,transparent 78%);
}

/* ==========================================================================
   HERO
   ========================================================================== */
.hero{position:relative;overflow:hidden;padding:56px 0 72px;}
@media(min-width:768px){ .hero{padding:84px 0 104px;} }
.hero-inner{position:relative;z-index:2;display:grid;gap:48px;}
@media(min-width:1000px){
  .hero-inner{grid-template-columns:1.08fr 0.92fr;gap:56px;align-items:center;}
}

.pill{
  display:inline-flex;align-items:center;gap:9px;
  padding:7px 15px 7px 12px;border-radius:100px;
  background:var(--cy-dim);border:1px solid rgba(34,211,238,0.26);
  color:var(--cy-2);font-size:12.5px;font-weight:600;letter-spacing:-0.005em;
  margin-bottom:22px;
}
.pill-dot{
  width:7px;height:7px;border-radius:50%;background:var(--cy-2);flex-shrink:0;
  box-shadow:0 0 0 0 rgba(34,211,238,0.6);
  animation:ping 2.4s cubic-bezier(0,0,.2,1) infinite;
}
@keyframes ping{
  0%{box-shadow:0 0 0 0 rgba(34,211,238,0.55);}
  70%{box-shadow:0 0 0 8px rgba(34,211,238,0);}
  100%{box-shadow:0 0 0 0 rgba(34,211,238,0);}
}

.hero-title{
  font-size:clamp(34px,7.4vw,64px);
  margin-bottom:20px;
}
.grad{
  background:linear-gradient(96deg,var(--cy-2) 0%,#7DD3FC 40%,var(--flame-2) 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.hero-lead{
  font-size:clamp(15.5px,2.4vw,18.5px);
  line-height:1.62;color:var(--fg-2);max-width:540px;margin-bottom:32px;
}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:30px;}
@media(max-width:520px){ .hero-cta .btn{width:100%;} }

.hero-facts{
  display:flex;flex-wrap:wrap;gap:12px 26px;
  font-size:13.5px;color:var(--fg-3);
}
.hero-facts li{display:flex;align-items:center;gap:8px;}
.hero-facts svg{width:16px;height:16px;color:var(--cy);flex-shrink:0;}

/* ---------- console panel ---------- */
.console{
  position:relative;
  background:linear-gradient(168deg,var(--surface-2) 0%,var(--surface) 100%);
  border:1px solid var(--edge-2);
  border-radius:var(--r-lg);
  padding:20px;
  box-shadow:0 40px 90px -40px rgba(0,0,0,0.9),inset 0 1px 0 rgba(255,255,255,0.06);
}
@media(min-width:480px){ .console{padding:26px;} }
.console::before{
  content:'';position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;
  background:linear-gradient(150deg,rgba(34,211,238,0.35),transparent 40%);
  mask:linear-gradient(#000,#000) content-box,linear-gradient(#000,#000);
  -webkit-mask:linear-gradient(#000,#000) content-box,linear-gradient(#000,#000);
  mask-composite:exclude;-webkit-mask-composite:xor;
  padding:1px;
}
.console-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px;}
.console-label{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--fg-3);
}
.chip-ok{
  display:inline-flex;align-items:center;gap:7px;
  padding:5px 12px;border-radius:100px;
  font-size:11.5px;font-weight:700;letter-spacing:-0.01em;
  color:var(--ok);background:rgba(74,222,128,0.1);border:1px solid rgba(74,222,128,0.24);
}
.chip-ok i{width:6px;height:6px;border-radius:50%;background:var(--ok);display:block;}

.wave{
  display:flex;align-items:flex-end;gap:4px;
  height:88px;margin-bottom:20px;
}
@media(min-width:480px){ .wave{height:104px;gap:5px;} }
.wave i{
  flex:1;border-radius:4px 4px 0 0;height:10px;
  background:linear-gradient(180deg,rgba(122,138,163,0.4),rgba(122,138,163,0.1));
  transition:height 1.05s cubic-bezier(.22,.8,.24,1),background 1.05s ease;
}
.wave i.lit{background:linear-gradient(180deg,var(--cy-2),rgba(34,211,238,0.25));}

.rows{display:flex;flex-direction:column;gap:8px;}
.row{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:11px 13px;border-radius:var(--r-sm);
  background:rgba(255,255,255,0.028);border:1px solid var(--edge);
  font-size:13px;
}
.row-k{display:flex;align-items:center;gap:9px;color:var(--fg);font-weight:600;min-width:0;}
.row-k svg{width:15px;height:15px;color:var(--cy);flex-shrink:0;}
.row-v{
  font-family:var(--mono);font-size:12.5px;color:var(--ok);
  font-variant-numeric:tabular-nums;
  min-width:88px;text-align:right;
}

/* ==========================================================================
   TICKER (locations marquee)
   ========================================================================== */
.ticker{
  border-block:1px solid var(--edge);
  background:var(--surface);
  overflow:hidden;
  padding:14px 0;
  position:relative;
  mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
}
.ticker-track{
  display:flex;gap:34px;width:max-content;
  animation:slide 42s linear infinite;
}
.ticker:hover .ticker-track{animation-play-state:paused;}
@keyframes slide{ from{transform:translateX(0);} to{transform:translateX(-50%);} }
.ticker span{
  display:inline-flex;align-items:center;gap:9px;
  font-size:13.5px;color:var(--fg-3);white-space:nowrap;font-weight:500;
}
.ticker b{font-size:17px;line-height:1;}

/* ==========================================================================
   SECTIONS
   ========================================================================== */
.sec{position:relative;padding:72px 0;}
@media(min-width:768px){ .sec{padding:104px 0;} }
.sec--tint{background:var(--surface);border-block:1px solid var(--edge);}
.sec--deep{background:linear-gradient(180deg,var(--void),var(--surface) 60%,var(--void));}

.sec-head{max-width:660px;margin:0 auto 48px;text-align:center;}
@media(min-width:768px){ .sec-head{margin-bottom:64px;} }
.kicker{
  display:inline-block;
  font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--cy);margin-bottom:16px;
}
.sec-title{font-size:clamp(26px,4.6vw,42px);margin-bottom:14px;}
.sec-sub{font-size:clamp(15px,2vw,17px);color:var(--fg-3);line-height:1.65;}

/* vertical rhythm for stacked blocks inside one section */
.stack > * + *{margin-top:26px;}
@media(min-width:768px){ .stack > * + *{margin-top:34px;} }

/* ==========================================================================
   BENTO GRID (features)
   ========================================================================== */
.bento{display:grid;gap:14px;grid-template-columns:1fr;}
@media(min-width:640px){ .bento{grid-template-columns:repeat(2,1fr);gap:16px;} }
@media(min-width:1000px){ .bento{grid-template-columns:repeat(6,1fr);} }

/* two-column stage: hero always full width, and a lone trailing tile
   stretches instead of leaving half a row empty */
@media(min-width:640px) and (max-width:999.98px){
  .bento > .tile--hero{grid-column:1 / -1;}
  .bento > .tile:last-child:nth-child(even){grid-column:1 / -1;}
}

.tile{
  position:relative;overflow:hidden;
  background:linear-gradient(165deg,var(--surface-2) 0%,var(--surface) 100%);
  border:1px solid var(--edge);
  border-radius:var(--r-lg);
  padding:26px 24px;
  transition:border-color .25s ease,transform .25s cubic-bezier(.2,.8,.2,1);
}
@media(min-width:768px){ .tile{padding:30px 28px;} }
.tile:hover{border-color:rgba(34,211,238,0.3);transform:translateY(-3px);}
@media(min-width:1000px){
  .tile{grid-column:span 2;}
  .tile--hero{grid-column:span 4;}
  .tile--half{grid-column:span 3;}
  .tile--full{grid-column:1 / -1;}
}
.tile h3{font-size:19px;margin-bottom:9px;}
.tile p{font-size:14.5px;line-height:1.62;color:var(--fg-3);}
.tile p a{color:var(--cy-2);font-weight:600;}
.tile p a:hover{text-decoration:underline;}
.tile-ico{
  width:44px;height:44px;border-radius:13px;
  display:grid;place-items:center;margin-bottom:18px;
  background:var(--cy-dim);color:var(--cy-2);
  border:1px solid rgba(34,211,238,0.2);
}
.tile-ico svg{width:22px;height:22px;}
.tile-ico.flame{background:rgba(255,107,74,0.11);color:var(--flame-2);border-color:rgba(255,107,74,0.22);}
.tile-glow{
  position:absolute;width:220px;height:220px;border-radius:50%;
  right:-70px;top:-70px;pointer-events:none;
  background:radial-gradient(circle,rgba(34,211,238,0.16),transparent 70%);
}

.stat-line{
  display:flex;flex-wrap:wrap;gap:22px 34px;margin-top:22px;
  padding-top:20px;border-top:1px solid var(--edge);
}
.stat-line div{min-width:76px;}
.stat-line b{
  display:block;font-family:var(--display);font-weight:800;font-size:26px;
  color:var(--fg);letter-spacing:-0.03em;line-height:1.1;
}
.stat-line span{font-size:12.5px;color:var(--fg-3);}

/* ==========================================================================
   RAIL (steps)
   ========================================================================== */
.rail{display:grid;gap:32px;max-width:960px;margin-inline:auto;}
@media(min-width:820px){ .rail{grid-template-columns:repeat(3,1fr);gap:26px;} }
.rail-item{position:relative;padding-top:26px;}
.rail-item::before{
  content:'';position:absolute;top:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg,var(--cy),rgba(34,211,238,0.05));
}
.rail-num{
  font-family:var(--mono);font-size:11px;letter-spacing:.14em;
  color:var(--cy);margin-bottom:14px;display:block;
}
.rail-item h3{font-size:18px;margin-bottom:9px;}
.rail-item p{font-size:14.5px;color:var(--fg-3);line-height:1.62;}
.rail-cta{text-align:center;margin-top:52px;}
.rail-cta .after{margin-top:16px;font-size:14px;color:var(--fg-3);}
.rail-cta .after a{color:var(--cy-2);font-weight:600;}
.rail-cta .after a:hover{text-decoration:underline;}

/* ==========================================================================
   SPLIT (Telegram access)
   ========================================================================== */
.split{
  display:grid;grid-template-columns:1fr;gap:14px;
  max-width:1000px;margin-inline:auto;
}
@media(min-width:880px){ .split{grid-template-columns:1fr 1fr;gap:16px;} }
.pane{
  background:linear-gradient(165deg,var(--surface-2),var(--surface));
  border:1px solid var(--edge);border-radius:var(--r-lg);
  padding:28px 24px;
  display:flex;flex-direction:column;
}
@media(min-width:768px){ .pane{padding:34px 32px;} }
.pane--accent{border-color:rgba(34,211,238,0.24);box-shadow:0 0 60px -30px rgba(34,211,238,0.5);}
.badge{
  display:inline-flex;align-items:center;gap:7px;align-self:flex-start;
  padding:5px 12px;border-radius:100px;margin-bottom:16px;
  font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;
  background:rgba(255,107,74,0.11);color:var(--flame-2);border:1px solid rgba(255,107,74,0.22);
}
.badge--cy{background:var(--cy-dim);color:var(--cy-2);border-color:rgba(34,211,238,0.25);}
.pane h3{font-size:20px;margin-bottom:12px;}
.pane > p{font-size:14.5px;color:var(--fg-3);line-height:1.65;margin-bottom:20px;}
.ticks{display:flex;flex-direction:column;gap:10px;margin-bottom:24px;}
.ticks li{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--fg-3);line-height:1.55;}
.ticks svg{width:16px;height:16px;color:var(--cy);flex-shrink:0;margin-top:3px;}
.pane .btn{margin-top:auto;}

.kv{
  background:rgba(0,0,0,0.3);border:1px solid var(--edge);
  border-radius:var(--r);padding:16px 18px;margin-bottom:18px;
}
.kv-label{
  font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--cy);margin-bottom:11px;
}
.kv-row{
  display:flex;justify-content:space-between;align-items:baseline;gap:14px;
  padding:6px 0;font-size:13px;color:var(--fg-3);
  border-bottom:1px dashed rgba(255,255,255,0.07);
}
.kv-row:last-child{border-bottom:none;}
.kv-row b{font-family:var(--mono);font-size:12.5px;color:var(--fg);word-break:break-all;text-align:right;}
.hint{
  display:flex;gap:9px;align-items:flex-start;
  font-size:12.5px;color:var(--fg-3);line-height:1.6;margin-top:16px;
}
.hint svg{width:15px;height:15px;color:var(--cy);flex-shrink:0;margin-top:2px;}

/* ==========================================================================
   PRICING
   ========================================================================== */
.plans{display:grid;gap:16px;grid-template-columns:1fr;max-width:1020px;margin-inline:auto;}
@media(min-width:860px){ .plans{grid-template-columns:repeat(3,1fr);align-items:start;} }
.plan{
  position:relative;
  background:linear-gradient(165deg,var(--surface-2),var(--surface));
  border:1px solid var(--edge);border-radius:var(--r-lg);
  padding:30px 26px;
  display:flex;flex-direction:column;
}
.plan--best{
  border-color:rgba(34,211,238,0.4);
  background:linear-gradient(165deg,#152233,var(--surface-2));
  box-shadow:0 0 70px -30px rgba(34,211,238,0.65);
}
@media(min-width:860px){ .plan--best{padding-block:40px;margin-block:-10px;} }
.plan-tag{
  position:absolute;top:-11px;left:50%;transform:translateX(-50%);
  background:linear-gradient(135deg,var(--flame),#F0562F);color:#fff;
  font-size:11px;font-weight:700;letter-spacing:.02em;
  padding:5px 14px;border-radius:100px;white-space:nowrap;
  box-shadow:0 6px 18px -6px rgba(255,107,74,0.7);
}
.plan-name{
  font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--fg-3);margin-bottom:14px;
}
.plan--best .plan-name{color:var(--cy);}
.plan-price{display:flex;align-items:baseline;gap:7px;margin-bottom:6px;}
.plan-price b{
  font-family:var(--display);font-weight:800;font-size:38px;
  color:var(--fg);letter-spacing:-0.035em;line-height:1;
}
.plan-price span{font-size:13.5px;color:var(--fg-3);}
.plan-note{font-size:12.5px;color:var(--fg-3);min-height:20px;margin-bottom:22px;}
.plan-note s{opacity:.75;}
.plan-feats{display:flex;flex-direction:column;gap:11px;margin-bottom:26px;flex:1;}
.plan-feats li{display:flex;gap:9px;align-items:flex-start;font-size:14px;color:var(--fg-3);line-height:1.5;}
.plan-feats svg{width:15px;height:15px;color:var(--cy);flex-shrink:0;margin-top:3px;}

/* ==========================================================================
   FAQ
   ========================================================================== */
.faq{max-width:800px;margin-inline:auto;}
.faq-item{border-bottom:1px solid var(--edge);}
.faq-q{
  width:100%;text-align:left;
  display:flex;align-items:center;justify-content:space-between;gap:18px;
  padding:22px 2px;
  font-family:var(--display);font-weight:700;font-size:16px;color:var(--fg);
  letter-spacing:-0.015em;line-height:1.35;
}
@media(min-width:768px){ .faq-q{font-size:17px;padding:24px 4px;} }
.faq-q svg{width:19px;height:19px;color:var(--cy);flex-shrink:0;transition:transform .28s cubic-bezier(.2,.8,.2,1);}
.faq-item.is-open .faq-q svg{transform:rotate(45deg);}
.faq-a{
  display:grid;grid-template-rows:0fr;
  transition:grid-template-rows .3s cubic-bezier(.2,.8,.2,1);
}
.faq-item.is-open .faq-a{grid-template-rows:1fr;}
.faq-a > div{overflow:hidden;}
.faq-a p{
  font-size:15px;line-height:1.7;color:var(--fg-3);
  padding:0 2px 24px;
}
.faq-a a{color:var(--cy-2);font-weight:600;}
.faq-a a:hover{text-decoration:underline;}

/* ==========================================================================
   CTA BAND
   ========================================================================== */
.cta-band{position:relative;overflow:hidden;text-align:center;padding:80px 0;}
@media(min-width:768px){ .cta-band{padding:110px 0;} }
.cta-band .wrap{position:relative;z-index:2;}
.cta-band h2{font-size:clamp(26px,5vw,44px);margin-bottom:16px;}
.cta-band p{font-size:16.5px;color:var(--fg-3);max-width:520px;margin:0 auto 32px;}

/* ==========================================================================
   PAGE HEAD (subpages)
   ========================================================================== */
.page-head{position:relative;overflow:hidden;padding:40px 0 52px;}
@media(min-width:768px){ .page-head{padding:56px 0 72px;} }
.page-head .wrap{position:relative;z-index:2;}
.page-head h1{font-size:clamp(28px,5.6vw,48px);margin-bottom:16px;}
.page-head .lead{font-size:clamp(15px,2.2vw,17.5px);color:var(--fg-2);max-width:660px;line-height:1.65;}
.crumbs{
  display:flex;flex-wrap:wrap;align-items:center;gap:8px;
  font-size:12.5px;color:var(--fg-3);margin-bottom:20px;
}
.crumbs a{color:var(--fg-3);transition:color .18s ease;}
.crumbs a:hover{color:var(--cy-2);}
.crumbs .sep{opacity:.45;}
.crumbs [aria-current]{color:var(--fg-2);}
.meta-line{
  display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:22px;
  font-family:var(--mono);font-size:11.5px;color:var(--fg-3);
}
.meta-line span{display:inline-flex;align-items:center;gap:7px;}
.meta-line svg{width:14px;height:14px;color:var(--cy);}

/* ==========================================================================
   PROSE
   ========================================================================== */
.prose{max-width:760px;margin-inline:auto;font-size:16px;line-height:1.78;color:var(--fg-2);}
.prose > * + *{margin-top:18px;}
.prose h2{font-size:clamp(22px,3.4vw,28px);margin-top:46px;line-height:1.22;}
.prose h3{font-size:clamp(18px,2.6vw,21px);margin-top:34px;line-height:1.3;}
.prose h2:first-child,.prose h3:first-child{margin-top:0;}
.prose ul,.prose ol{padding-left:4px;display:flex;flex-direction:column;gap:11px;}
.prose ul li{position:relative;padding-left:24px;}
.prose ul li::before{
  content:'';position:absolute;left:4px;top:11px;
  width:6px;height:6px;border-radius:50%;background:var(--cy);
}
.prose ol{counter-reset:pl;}
.prose ol li{position:relative;padding-left:32px;counter-increment:pl;}
.prose ol li::before{
  content:counter(pl);position:absolute;left:0;top:2px;
  font-family:var(--mono);font-size:12px;color:var(--cy);
}
.prose a{color:var(--cy-2);font-weight:600;text-underline-offset:3px;}
.prose a:hover{text-decoration:underline;}
.prose strong{color:var(--fg);font-weight:600;}
.prose em{color:var(--fg-3);}
.prose table{width:100%;border-collapse:collapse;font-size:14.5px;}
.prose th,.prose td{padding:12px 14px;border-bottom:1px solid var(--edge);text-align:left;}
.prose th{color:var(--fg);font-weight:700;font-family:var(--display);font-size:13.5px;}
.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;}

.note{
  background:rgba(34,211,238,0.06);
  border:1px solid rgba(34,211,238,0.2);
  border-radius:var(--r);padding:18px 22px;font-size:15px;line-height:1.7;
}
.note--warn{background:rgba(255,107,74,0.06);border-color:rgba(255,107,74,0.22);}
.note--warn strong{color:var(--flame-2);}

/* ==========================================================================
   TABS (setup guides)
   ========================================================================== */
.tabs{
  display:flex;gap:8px;margin-bottom:26px;
  overflow-x:auto;-webkit-overflow-scrolling:touch;
  padding-bottom:4px;scrollbar-width:none;
}
.tabs::-webkit-scrollbar{display:none;}
@media(min-width:768px){ .tabs{flex-wrap:wrap;justify-content:center;overflow:visible;} }
.tab{
  display:inline-flex;align-items:center;gap:8px;flex-shrink:0;
  padding:10px 18px;border-radius:100px;
  border:1px solid var(--edge);background:rgba(255,255,255,0.03);
  font-family:var(--display);font-weight:700;font-size:13.5px;color:var(--fg-3);
  white-space:nowrap;
  transition:all .2s ease;
}
.tab svg{width:16px;height:16px;}
.tab:hover{color:var(--fg);border-color:var(--edge-2);}
.tab[aria-selected="true"]{
  background:rgba(34,211,238,0.12);color:var(--cy-2);border-color:rgba(34,211,238,0.35);
}
.panel[hidden]{display:none;}
.panel{animation:rise .35s cubic-bezier(.2,.8,.2,1);}
@keyframes rise{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:none;}}

.guide{
  max-width:820px;margin-inline:auto;
  background:linear-gradient(165deg,var(--surface-2),var(--surface));
  border:1px solid var(--edge);border-radius:var(--r-lg);
  padding:28px 22px;
}
@media(min-width:768px){ .guide{padding:36px 34px;} }
.guide h3{font-size:20px;margin-bottom:8px;}
.guide-apps{font-size:14px;color:var(--fg-3);line-height:1.65;margin-bottom:26px;}
.guide-apps b{color:var(--fg);}
.steps{counter-reset:st;display:flex;flex-direction:column;gap:16px;}
.steps li{
  counter-increment:st;display:flex;gap:14px;align-items:flex-start;
  font-size:14.5px;line-height:1.65;color:var(--fg-2);
}
.steps li::before{
  content:counter(st,decimal-leading-zero);flex-shrink:0;
  width:32px;height:32px;border-radius:10px;
  background:var(--cy-dim);border:1px solid rgba(34,211,238,0.22);color:var(--cy-2);
  display:grid;place-items:center;
  font-family:var(--mono);font-size:11px;font-weight:700;
}
.steps b{color:var(--fg);font-weight:600;}

/* ==========================================================================
   LOCATION GRID
   ========================================================================== */
/* flex, not grid: full rows fill edge to edge, and a trailing partial row
   is centred instead of leaving a lopsided gap on the right. max-width keeps
   the last cards from ballooning to 2.5x the others. */
.locs{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;}
.loc{
  flex:1 1 200px;max-width:280px;
  display:flex;align-items:center;gap:13px;
  background:linear-gradient(165deg,var(--surface-2),var(--surface));
  border:1px solid var(--edge);border-radius:var(--r);
  padding:15px 17px;
  transition:border-color .2s ease,transform .2s ease;
}
@media(max-width:639.98px){ .loc{max-width:none;} }
.loc:hover{border-color:rgba(34,211,238,0.3);transform:translateY(-2px);}
.loc-name{font-family:var(--display);font-weight:700;font-size:14.5px;color:var(--fg);letter-spacing:-0.015em;}
.loc-meta{font-family:var(--mono);font-size:11px;color:var(--fg-3);margin-top:3px;}

/* ==========================================================================
   FLAGS
   Drawn as SVG data-URIs: Windows has no country-flag emoji font and would
   otherwise render bare "NL"/"DE" letter pairs.
   ========================================================================== */
.flag{
  display:block;flex-shrink:0;
  width:28px;height:18.7px;border-radius:3px;
  background-size:cover;background-position:center;background-repeat:no-repeat;
  box-shadow:0 0 0 1px rgba(255,255,255,0.16),0 2px 5px rgba(0,0,0,0.45);
}
.ticker .flag{width:24px;height:16px;}

.f-nl{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 16'%3E%3Crect width='24' height='16' fill='%2321468B'/%3E%3Crect width='24' height='10.67' fill='%23fff'/%3E%3Crect width='24' height='5.33' fill='%23AE1C28'/%3E%3C/svg%3E");}
.f-de{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 16'%3E%3Crect width='24' height='16' fill='%23FFCE00'/%3E%3Crect width='24' height='10.67' fill='%23DD0000'/%3E%3Crect width='24' height='5.33'/%3E%3C/svg%3E");}
.f-ru{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 16'%3E%3Crect width='24' height='16' fill='%23D52B1E'/%3E%3Crect width='24' height='10.67' fill='%230039A6'/%3E%3Crect width='24' height='5.33' fill='%23fff'/%3E%3C/svg%3E");}
.f-pl{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 16'%3E%3Crect width='24' height='16' fill='%23DC143C'/%3E%3Crect width='24' height='8' fill='%23fff'/%3E%3C/svg%3E");}
.f-bg{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 16'%3E%3Crect width='24' height='16' fill='%23D62612'/%3E%3Crect width='24' height='10.67' fill='%2300966E'/%3E%3Crect width='24' height='5.33' fill='%23fff'/%3E%3C/svg%3E");}
.f-lt{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 16'%3E%3Crect width='24' height='16' fill='%23C1272D'/%3E%3Crect width='24' height='10.67' fill='%23006A44'/%3E%3Crect width='24' height='5.33' fill='%23FDB913'/%3E%3C/svg%3E");}
.f-ee{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 16'%3E%3Crect width='24' height='16' fill='%23fff'/%3E%3Crect width='24' height='10.67'/%3E%3Crect width='24' height='5.33' fill='%230072CE'/%3E%3C/svg%3E");}
.f-lv{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 16'%3E%3Crect width='24' height='16' fill='%239E3039'/%3E%3Crect y='6.4' width='24' height='3.2' fill='%23fff'/%3E%3C/svg%3E");}
.f-es{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 16'%3E%3Crect width='24' height='16' fill='%23AA151B'/%3E%3Crect y='4' width='24' height='8' fill='%23F1BF00'/%3E%3C/svg%3E");}
.f-ua{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 16'%3E%3Crect width='24' height='16' fill='%23FFD700'/%3E%3Crect width='24' height='8' fill='%230057B7'/%3E%3C/svg%3E");}
.f-fr{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 16'%3E%3Crect width='24' height='16' fill='%23ED2939'/%3E%3Crect width='16' height='16' fill='%23fff'/%3E%3Crect width='8' height='16' fill='%23002395'/%3E%3C/svg%3E");}
.f-md{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 16'%3E%3Crect width='24' height='16' fill='%23CC092F'/%3E%3Crect width='16' height='16' fill='%23FFD200'/%3E%3Crect width='8' height='16' fill='%230046AE'/%3E%3Ccircle cx='12' cy='8' r='2.7' fill='none' stroke='%23A4763B' stroke-width='.9'/%3E%3C/svg%3E");}
.f-se{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 16'%3E%3Crect width='24' height='16' fill='%23006AA7'/%3E%3Crect x='7' width='3.2' height='16' fill='%23FECC00'/%3E%3Crect y='6.4' width='24' height='3.2' fill='%23FECC00'/%3E%3C/svg%3E");}
.f-fi{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 16'%3E%3Crect width='24' height='16' fill='%23fff'/%3E%3Crect x='7' width='3.2' height='16' fill='%23003580'/%3E%3Crect y='6.4' width='24' height='3.2' fill='%23003580'/%3E%3C/svg%3E");}
.f-gr{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 16'%3E%3Crect width='24' height='16' fill='%23fff'/%3E%3Cg fill='%230D5EAF'%3E%3Crect width='24' height='1.78'/%3E%3Crect y='3.56' width='24' height='1.78'/%3E%3Crect y='7.11' width='24' height='1.78'/%3E%3Crect y='10.67' width='24' height='1.78'/%3E%3Crect y='14.22' width='24' height='1.78'/%3E%3C/g%3E%3Crect width='8.89' height='8.89' fill='%230D5EAF'/%3E%3Cpath d='M4.44 0v8.89M0 4.44h8.89' stroke='%23fff' stroke-width='1.78'/%3E%3C/svg%3E");}
.f-jp{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 16'%3E%3Crect width='24' height='16' fill='%23fff'/%3E%3Ccircle cx='12' cy='8' r='4.8' fill='%23BC002D'/%3E%3C/svg%3E");}
.f-cz{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 16'%3E%3Crect width='24' height='16' fill='%23D7141A'/%3E%3Crect width='24' height='8' fill='%23fff'/%3E%3Cpath d='M0 0l9.6 8L0 16z' fill='%2311457E'/%3E%3C/svg%3E");}
.f-tr{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 16'%3E%3Crect width='24' height='16' fill='%23E30A17'/%3E%3Ccircle cx='9.4' cy='8' r='3.7' fill='%23fff'/%3E%3Ccircle cx='10.9' cy='8' r='2.95' fill='%23E30A17'/%3E%3Cpath d='M15.3 5.9l.62 1.9h2l-1.62 1.18.62 1.9-1.62-1.18-1.62 1.18.62-1.9-1.62-1.18h2z' fill='%23fff'/%3E%3C/svg%3E");}
.f-gb{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 16'%3E%3Crect width='24' height='16' fill='%23012169'/%3E%3Cpath d='M0 0l24 16M24 0L0 16' stroke='%23fff' stroke-width='3.2'/%3E%3Cpath d='M0 0l24 16M24 0L0 16' stroke='%23C8102E' stroke-width='1.6'/%3E%3Cpath d='M12 0v16M0 8h24' stroke='%23fff' stroke-width='5.3'/%3E%3Cpath d='M12 0v16M0 8h24' stroke='%23C8102E' stroke-width='3.2'/%3E%3C/svg%3E");}
.f-us{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 16'%3E%3Crect width='24' height='16' fill='%23fff'/%3E%3Cg fill='%23B22234'%3E%3Crect width='24' height='1.23'/%3E%3Crect y='2.46' width='24' height='1.23'/%3E%3Crect y='4.92' width='24' height='1.23'/%3E%3Crect y='7.38' width='24' height='1.23'/%3E%3Crect y='9.85' width='24' height='1.23'/%3E%3Crect y='12.31' width='24' height='1.23'/%3E%3Crect y='14.77' width='24' height='1.23'/%3E%3C/g%3E%3Crect width='9.6' height='8.62' fill='%233C3B6E'/%3E%3Cg fill='%23fff'%3E%3Ccircle cx='2' cy='2' r='.52'/%3E%3Ccircle cx='4.8' cy='2' r='.52'/%3E%3Ccircle cx='7.6' cy='2' r='.52'/%3E%3Ccircle cx='3.4' cy='4.3' r='.52'/%3E%3Ccircle cx='6.2' cy='4.3' r='.52'/%3E%3Ccircle cx='2' cy='6.6' r='.52'/%3E%3Ccircle cx='4.8' cy='6.6' r='.52'/%3E%3Ccircle cx='7.6' cy='6.6' r='.52'/%3E%3C/g%3E%3C/svg%3E");}
.f-al{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 16'%3E%3Crect width='24' height='16' fill='%23E41E20'/%3E%3Cpath d='M12 4.6c-.66-.95-1.8-1.33-2.75-.95.47.47.66 1.14.57 1.8L7.7 4.4l.57 1.62-1.52-.19 1.14 1.33-1.05.85 1.52.48-.38 1.24 1.52-.29.47 1.43 1.24-.95.79 1.24.79-1.24 1.24.95.47-1.43 1.52.29-.38-1.24 1.52-.48-1.05-.85 1.14-1.33-1.52.19.57-1.62-2.12 1.05c-.09-.66.1-1.33.57-1.8-.95-.38-2.09 0-2.75.95z'/%3E%3C/svg%3E");}
.f-kz{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 16'%3E%3Crect width='24' height='16' fill='%2300AFCA'/%3E%3Ccircle cx='12' cy='6.8' r='2.5' fill='%23FEC50C'/%3E%3Cg stroke='%23FEC50C' stroke-width='.62' stroke-linecap='round'%3E%3Cpath d='M12 2.6v1.3M12 9.7v1.3M7.5 6.8h1.3M15.2 6.8h1.3M8.9 3.7l.9.9M14.2 9l.9.9M15.1 3.7l-.9.9M9.8 9l-.9.9'/%3E%3C/g%3E%3Cpath d='M8.4 12.6q3.6-1.7 7.2 0' fill='none' stroke='%23FEC50C' stroke-width='.75' stroke-linecap='round'/%3E%3C/svg%3E");}

/* ==========================================================================
   FOOTER
   ========================================================================== */
.site-footer{
  background:var(--surface);border-top:1px solid var(--edge);
  padding:52px 0 32px;font-size:14px;color:var(--fg-3);
}
.foot-grid{
  display:grid;gap:32px;grid-template-columns:1fr;
  padding-bottom:34px;border-bottom:1px solid var(--edge);
}
@media(min-width:720px){ .foot-grid{grid-template-columns:1.6fr 1fr 1fr;gap:40px;} }
.foot-about p{margin-top:14px;font-size:13.5px;line-height:1.65;max-width:320px;}
.foot-col h4{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--fg-3);margin-bottom:16px;font-weight:600;
}
.foot-col ul{display:flex;flex-direction:column;gap:11px;}
.foot-col a{font-size:14px;color:var(--fg-3);transition:color .18s ease;}
.foot-col a:hover{color:var(--cy-2);}
.foot-base{
  display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 24px;
  padding-top:26px;font-size:12.5px;
}
.foot-base a{text-decoration:underline;text-underline-offset:3px;}
.foot-base a:hover{color:var(--fg-2);}

/* ==========================================================================
   MOTION
   ========================================================================== */
.rv{opacity:0;transform:translateY(20px);transition:opacity .65s ease,transform .65s cubic-bezier(.2,.8,.2,1);}
.rv.in{opacity:1;transform:none;}
.no-js .rv{opacity:1;transform:none;}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;}
  .rv{opacity:1;transform:none;}
  .ticker-track{animation:none;}
}

/* below-the-fold rendering budget */
.defer-paint{content-visibility:auto;contain-intrinsic-size:auto 900px;}