/* template.css — Generated by Casino.ch Templater */
/* ============================================================
   NOVA TEMPLATE v3 — premium casino / iGaming design system
   Sentinel colors (rewritten by the builder):
     #000000 = accent   #f3f6f5 = page bg
     #1a1a1c = hero bg  #0d2b26 = footer bg
   ============================================================ */

:root{
  --nv-accent:#000000;
  --nv-accent-soft:color-mix(in srgb, #000000 10%, transparent);
  --nv-accent-line:color-mix(in srgb, #000000 30%, transparent);
  --nv-accent-deep:color-mix(in srgb, #000000 76%, #000);
  --nv-bg:#f3f6f5;
  --nv-hero:#1a1a1c;
  --nv-footer:#0d2b26;
  --nv-surface:#ffffff;
  --nv-text:#333333;
  --nv-muted:#5f6673;
  --nv-table:#ffffff;
  --nv-table-stripe:#f7f7f7;
  --nv-h1:#ffffff;
  --nv-heading:#101219;
  --nv-footer-sub:#2ab03c;
  --nv-faq-panel:#141b2e;

  --nv-gold:#f5c451;
  --nv-green:#22b356;

  --nv-max:117.5rem;
  --nv-read:92rem;
  --nv-gutter:2.4rem;
  --nv-logo-h:4rem;
  --nv-footer-img-h:4.2rem;

  --nv-ink:#101219;
  --nv-line:rgba(16,18,25,.09);
  --nv-line-2:rgba(16,18,25,.15);

  --nv-r-sm:.9rem;
  --nv-r-md:1.4rem;
  --nv-r-lg:2rem;
  --nv-r-pill:99rem;

  --nv-sh-1:0 .1rem .2rem rgba(16,18,25,.04), 0 .6rem 1.6rem rgba(16,18,25,.06);
  --nv-sh-2:0 .2rem .4rem rgba(16,18,25,.04), 0 1.6rem 3.6rem rgba(16,18,25,.08);
  --nv-sh-3:0 .4rem .8rem rgba(16,18,25,.06), 0 3rem 6.4rem rgba(16,18,25,.14);

  --nv-ease:cubic-bezier(.22,.61,.36,1);
  --nv-fast:.18s var(--nv-ease);
  --nv-slow:.4s var(--nv-ease);

  --nv-head-h:7.2rem;

  --nv-head-bg:#ffffff;
  --nv-head-fg:#101219;
  --nv-head-fg-2:#5f6673;
  --nv-head-line:rgba(16,18,25,.10);
  --nv-head-soft:rgba(16,18,25,.035);
}

/* ── reset ──────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box}
html{font-size:62.5%;-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;
  font-family:"Inter","Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  font-size:1.9rem;
  line-height:1.76;
  font-weight:400;
  font-feature-settings:"kern" 1,"liga" 1,"calt" 1;
  letter-spacing:-.006em;
  color:var(--nv-text);
  background:var(--nv-bg);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}
img{max-width:100%;height:auto;border:0;display:block}
ul,ol{margin:0;padding:0}
button,input,select,textarea{font:inherit;color:inherit}
a{color:var(--nv-accent);text-decoration:none}
table{border-collapse:collapse}
main{display:block}
hr{
  height:.1rem;border:0;margin:4.8rem 0;
  background:linear-gradient(90deg,transparent,var(--nv-line-2) 20%,var(--nv-line-2) 80%,transparent);
}
::selection{background:var(--nv-accent);color:#fff}
:focus-visible{outline:.2rem solid var(--nv-accent);outline-offset:.3rem;border-radius:.4rem}

.visually-hidden{
  position:absolute;width:1px;height:1px;margin:-1px;padding:0;
  overflow:hidden;border:0;clip:rect(0 0 0 0);white-space:nowrap;
}

/* ── layout ─────────────────────────────────────────────── */
.container{
  width:100%;
  max-width:var(--nv-max);
  margin:0 auto;
  padding:0 var(--nv-gutter);
}
.wrapper{display:block;padding-top:var(--nv-head-h);overflow-x:hidden}

/* ── header ─────────────────────────────────────────────── */
.header{
  position:fixed;
  top:0;right:0;left:0;
  z-index:80;
  height:var(--nv-head-h);
  background:color-mix(in srgb, var(--nv-head-bg) 88%, transparent);
  -webkit-backdrop-filter:blur(1.4rem) saturate(170%);
  backdrop-filter:blur(1.4rem) saturate(170%);
  border-bottom:.1rem solid var(--nv-head-line);
  -webkit-transform:translateZ(0);
  transform:translateZ(0);
}
.header::after{
  content:"";
  position:absolute;left:0;right:0;bottom:-.1rem;height:.1rem;
  background:linear-gradient(90deg,transparent,var(--nv-accent),transparent);
  opacity:.7;
}
/* Egor (2026-10-13): first tried re-theming the header dark for non-classic hero types (see gotcha below about the iframe-preview screenshot bug hit while building that) — Egor then said no, remove it entirely so the hero itself starts right at the top of the page. body gets nv-no-header (see buildPageShell) whenever heroStyle isn’t classic. */
/* Egor (2026-10-14): the theme toggle must stay visible even on these no-header heroes, so instead of hiding the whole <header> we strip its visible band (bg/blur/border, pointer-events) and hide only logo/nav/ burger — the hero still visually starts at the very top exactly as decided above, the toggle just floats transparently over it. */
body.nv-no-header .header{background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;border-bottom:0;pointer-events:none}
body.nv-no-header .header::after{display:none}
body.nv-no-header .logo,body.nv-no-header .header__nav,body.nv-no-header .header__menu-toggle{display:none}
body.nv-no-header .theme-toggle{margin-left:auto;pointer-events:auto}
body.nv-no-header .wrapper{padding-top:0}
.header .container{
  display:flex;
  align-items:center;
  gap:1rem;
  height:100%;
}
.logo{
  display:inline-flex;
  align-items:center;
  flex-shrink:0;
  margin-right:auto;
  transition:opacity var(--nv-fast);
}
.logo:hover{opacity:.82}
.logo__img{
  display:block;
  /* fixed height + auto width keeps any aspect ratio correct, including
     SVG logos that only carry a viewBox and no intrinsic size */
  height:var(--nv-logo-h);
  width:auto;
  max-width:24rem;
  object-fit:contain;
}

.header__menu-toggle{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  width:4.2rem;height:4.2rem;
  padding:0;
  border:.1rem solid var(--nv-head-line);
  border-radius:var(--nv-r-pill);
  background:var(--nv-head-soft);
  cursor:pointer;
  transition:border-color var(--nv-fast), background var(--nv-fast);
}
.header__menu-toggle:hover{
  border-color:var(--nv-accent);
  background:color-mix(in srgb, var(--nv-accent) 14%, transparent);
}
.header__menu-toggle span{
  position:absolute;left:50%;top:50%;
  width:1.7rem;height:.19rem;border-radius:.2rem;
  background:var(--nv-head-fg);
  transform:translate(-50%,-.45rem);
  transition:transform var(--nv-slow);
}
.header__menu-toggle span:last-child{transform:translate(-50%,.26rem)}
.header__menu-toggle--active span:first-child{transform:translate(-50%,-50%) rotate(45deg)}
.header__menu-toggle--active span:last-child{transform:translate(-50%,-50%) rotate(-45deg)}



.header__nav ul{list-style:none;display:flex;align-items:center;gap:.2rem}
.header__nav a{
  display:inline-flex;align-items:center;gap:.6rem;
  padding:.8rem 1.4rem;
  border-radius:var(--nv-r-pill);
  font-size:1.5rem;font-weight:600;
  color:var(--nv-head-fg);
  transition:background var(--nv-fast), color var(--nv-fast);
}
.header__nav a:hover,.header__nav a:focus{
  background:color-mix(in srgb, var(--nv-accent) 12%, transparent);
  color:var(--nv-accent);
}
.header__nav svg{max-width:1.9rem;max-height:1.9rem;flex-shrink:0}

/* ── HERO — full-bleed stage ────────────────────────────── */
.intro-home{
  position:relative;
  isolation:isolate;
  margin:0;
  padding:9.6rem 0 10.4rem;
  color:#fff;
  text-align:center;
  background:var(--nv-hero);
  border-top:.2rem solid var(--nv-accent);
  border-bottom:.1rem solid rgba(255,255,255,.12);
  overflow:hidden;
}
.intro-home .container{position:relative;z-index:2;max-width:var(--nv-max)}

.intro-home__title{
  position:relative;
  margin:0 auto;
  max-width:22ch;
  font-size:clamp(4.8rem, 7.4vw, 8.8rem);
  font-weight:800;
  line-height:1.02;
  letter-spacing:-.045em;
  color:var(--nv-h1);
  text-wrap:balance;
  text-shadow:0 .2rem .8rem rgba(0,0,0,.85), 0 .5rem 3rem rgba(0,0,0,.6);
}
.intro-home__title::after{
  content:"";
  display:block;
  width:6rem;height:.2rem;
  margin:3rem auto 0;
  background:var(--nv-accent);
}
.intro-home__text{
  margin:2.8rem auto 0;
  max-width:62ch;
  font-size:clamp(2.2rem, 2.1vw, 2.6rem);
  font-weight:400;
  line-height:1.66;
  color:rgba(255,255,255,.96);text-shadow:0 .2rem .6rem rgba(0,0,0,.75), 0 .4rem 2rem rgba(0,0,0,.5);
}
.hero-author{
  display:inline-flex;
  align-items:center;
  flex-wrap:wrap;
  gap:1.2rem 1.6rem;
  margin:4rem 0 0;
  padding-top:1.6rem;
  border-top:.1rem solid rgba(255,255,255,.16);
  text-align:left;
}
.hero-author__avatar{
  display:none;
}
.hero-author__body{display:flex;flex-direction:column;line-height:1.3}
.hero-author__name{
  font-size:1.75rem;font-weight:700;letter-spacing:-.015em;color:#fff;
}
.hero-author__role{
  font-size:1.48rem;font-weight:500;color:rgba(255,255,255,.6);
}
.hero-author__date{
  display:inline-flex;align-items:center;gap:.7rem;
  padding-left:1.6rem;
  border-left:.1rem solid rgba(255,255,255,.16);
  font-size:1.48rem;font-weight:600;
  color:rgba(255,255,255,.66);
  white-space:nowrap;
}
.hero-author__date::before{
  content:none;
}

.hero-badges{
  position:absolute;top:2.4rem;left:2.4rem;z-index:3;
  display:inline-flex;flex-wrap:wrap;align-items:center;gap:1rem;
  max-width:calc(100% - 4.8rem);
}
.hero-badge{
  display:inline-flex;align-items:center;gap:.6rem;
  padding:.6rem 1.4rem;border-radius:var(--nv-r-pill);
  border:.1rem solid rgba(255,255,255,.22);
  background:rgba(255,255,255,.07);
  font-size:1.2rem;font-weight:700;letter-spacing:.01em;
  color:rgba(255,255,255,.82);
  white-space:nowrap;
}
.hero-badge svg{flex-shrink:0;opacity:.85}
.hero-badge--age{letter-spacing:.04em}

.intro-home__list{
  list-style:none;display:flex;flex-wrap:wrap;justify-content:center;
  gap:1rem;margin:3.4rem 0 0;
}
.intro-home__list a{
  display:inline-flex;align-items:center;gap:1.1rem;
  padding:1.3rem 2.2rem;
  border-radius:var(--nv-r-pill);
  background:rgba(255,255,255,.95);
  color:var(--nv-ink);
  font-size:1.6rem;font-weight:700;
  transition:transform var(--nv-fast), box-shadow var(--nv-fast);
}
.intro-home__list a:hover{transform:translateY(-.2rem);box-shadow:0 1.4rem 3rem rgba(0,0,0,.3)}
.intro-home__list svg{width:2.6rem;height:2.6rem}

/* ── HERO variants — avantgarde / foodhouse / stratos / roohi ── */
.intro-home__bg{position:absolute;inset:-4% -4%;background-size:cover;background-position:center;filter:blur(1.6rem) brightness(.55) saturate(1.1);transform:scale(1.08);z-index:0}
.intro-home__grid{display:grid;gap:4rem;align-items:center;text-align:left}
.intro-home__grid>.intro-home__copy:only-child{grid-column:1/-1;text-align:center}
.intro-home--avantgarde .intro-home__title,.intro-home--stratos .intro-home__title,.intro-home--roohi .intro-home__title,.intro-home--diagonal .intro-home__title{margin:0;max-width:none}
.intro-home--avantgarde .intro-home__title::after,.intro-home--stratos .intro-home__title::after,.intro-home--roohi .intro-home__title::after,.intro-home--diagonal .intro-home__title::after{margin-left:0}
.intro-home--avantgarde .intro-home__text,.intro-home--stratos .intro-home__text,.intro-home--roohi .intro-home__text,.intro-home--diagonal .intro-home__text{margin-left:0;max-width:54ch}
.intro-home--avantgarde .intro-home__bg{filter:blur(1.5rem) saturate(1.4) brightness(.8);transform:scale(1.06)}
.intro-home--avantgarde{padding:4rem 0}
.intro-home--avantgarde .intro-home__title::after{display:none}
.intro-home__panel{position:relative;z-index:2;background:#0b0b0d;border-radius:2.8rem;padding:clamp(4rem,6vw,8rem);box-shadow:0 5rem 12rem rgba(0,0,0,.65),0 0 0 .1rem rgba(255,255,255,.07)}
.intro-home--avantgarde .intro-home__grid{gap:4.8rem}
.intro-home__art-group{position:relative;z-index:2;min-height:54rem;height:100%}
.intro-home__art-arch{position:absolute;top:0;left:0;width:68%;aspect-ratio:3/4;background-size:cover;background-position:center;border-radius:50% 50% 0 0/38% 38% 0 0;box-shadow:0 3.5rem 7rem rgba(0,0,0,.55);z-index:1}
.intro-home__art-oval{position:absolute;right:0;bottom:0;width:58%;aspect-ratio:4/5;background-size:cover;background-position:center;border-radius:50%;border:.6rem solid #0b0b0d;box-shadow:0 2.4rem 6rem rgba(0,0,0,.6);z-index:2}
.intro-home--avantgarde-trio .intro-home__title{margin:0 auto;max-width:68rem}
.intro-home--avantgarde-trio .intro-home__text{margin:2.4rem auto 0;max-width:62ch}
.intro-home__copy--trio{text-align:center}
.intro-home__trio-diag{position:relative;z-index:2;width:77rem;max-width:100%;height:48rem;margin:5.6rem auto 0}
.intro-home__trio-item{position:absolute;margin:0}
.intro-home__trio-item--1{top:0;left:0}
.intro-home__trio-item--2{top:10rem;left:28rem}
.intro-home__trio-item--3{top:20rem;left:56rem}
.intro-home__trio-frame{width:21rem;aspect-ratio:3/4;overflow:hidden;box-shadow:0 2.4rem 5rem rgba(0,0,0,.55);background:rgba(255,255,255,.03)}
.intro-home__trio-item--arch .intro-home__trio-frame{border-radius:50% 50% .8rem .8rem/34% 34% .8rem .8rem}
.intro-home__trio-item--oval .intro-home__trio-frame{border-radius:50%}
.intro-home__trio-img{display:block;width:100%;height:100%;object-fit:cover}
.intro-home__trio-img--empty{background:rgba(255,255,255,.04);border:.2rem dashed rgba(255,255,255,.3);display:flex;align-items:center;justify-content:center}
.intro-home__trio-meta{position:absolute;top:3rem;left:56rem;width:21rem;text-align:right}
.intro-home__trio-caption{margin:0 0 3rem;font-size:1.3rem;font-style:italic;letter-spacing:.01em;color:rgba(255,255,255,.62)}
.intro-home__trio-caption--empty{opacity:.7}
.intro-home__trio-meta .hero-author{margin-top:0}
.intro-home__strip{position:relative;margin:4.8rem auto 0;max-width:76rem;overflow:hidden;-webkit-mask-image:linear-gradient(90deg, transparent 0, #000 8%, #000 92%, transparent 100%);mask-image:linear-gradient(90deg, transparent 0, #000 8%, #000 92%, transparent 100%)}
.intro-home__strip-track{display:flex;align-items:flex-end;gap:1.4rem;width:max-content;animation:nv-drift 40s linear infinite}
.intro-home__strip-slot{flex:none;height:19rem}
.intro-home__strip-img{display:block;height:100%;width:auto;aspect-ratio:3/4;object-fit:cover;border-radius:var(--nv-r-lg);box-shadow:var(--nv-sh-3)}
@keyframes nv-drift{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.intro-home__stats{position:relative;z-index:2;display:grid;gap:.1rem;padding:2.8rem 2.4rem;border-radius:var(--nv-r-lg);background:rgba(255,255,255,.08);border:.1rem solid rgba(255,255,255,.16);-webkit-backdrop-filter:blur(1.8rem);backdrop-filter:blur(1.8rem);box-shadow:var(--nv-sh-3)}
.intro-home__stats--inline{display:flex;flex-wrap:wrap;gap:2.4rem 3.2rem;margin-top:3.2rem;padding:0;background:none;border:0;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
.intro-home__stat{padding:1.6rem 0;border-bottom:.1rem solid rgba(255,255,255,.14)}
.intro-home__stats--animated .intro-home__stat{opacity:0;transform:translateY(1.6rem);transition:opacity .6s ease, transform .6s ease}
.intro-home__stats--animated .intro-home__stat.intro-home__counter--in{opacity:1;transform:translateY(0)}
.intro-home__stats--inline .intro-home__stat{padding:0;border-bottom:0}
.intro-home__stat:last-child{border-bottom:0}
.intro-home__stat-num{display:block;font-size:3rem;font-weight:800;letter-spacing:-.03em;color:#fff}
.intro-home__stat-label{display:block;margin-top:.3rem;font-size:1.3rem;color:rgba(255,255,255,.64)}
.intro-home__tiers{position:relative;z-index:2;min-height:24rem}
.intro-home__tier{position:absolute;width:19rem;padding:2.4rem 2.2rem;border-radius:var(--nv-r-lg);font-size:1.9rem;font-weight:800;color:#fff;background:linear-gradient(155deg, color-mix(in srgb, var(--nv-accent) 70%, #000), var(--nv-accent-deep));box-shadow:var(--nv-sh-3);transition:transform var(--nv-fast)}
.intro-home__tier--1{top:0;left:0;transform:rotate(-7deg);z-index:1}
.intro-home__tier--2{top:4rem;left:8.2rem;transform:rotate(3deg);z-index:2}
.intro-home__tier--3{top:8.4rem;left:16.4rem;transform:rotate(-4deg);z-index:3;background:linear-gradient(155deg, var(--nv-gold), #c99a22);color:var(--nv-ink)}
.intro-home__tier:hover{transform:translateY(-.6rem) rotate(0deg);z-index:9}
.intro-home--roohi{background:linear-gradient(135deg, var(--nv-hero), color-mix(in srgb, var(--nv-accent) 38%, var(--nv-hero)))}

/* ── alpine: full-bleed mountain photo + stat-pill cluster (CH) ── */
.intro-home--alpine .intro-home__bg{filter:brightness(.6) saturate(1.05);transform:scale(1.04)}
.intro-home--alpine::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg, rgba(8,13,11,.32) 0%, rgba(8,13,11,.52) 100%);pointer-events:none}
.intro-home__stats--cluster{position:relative;z-index:2;display:flex;flex-wrap:wrap;justify-content:center;gap:1.4rem;margin-top:3.6rem;padding:0;background:none;border:0;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
.intro-home__stats--cluster .intro-home__stat{display:flex;flex-direction:column;align-items:center;gap:.3rem;padding:1.4rem 2.6rem;border-radius:var(--nv-r-pill);background:rgba(255,255,255,.12);border:.1rem solid rgba(255,255,255,.22);-webkit-backdrop-filter:blur(1.2rem);backdrop-filter:blur(1.2rem)}
.intro-home__stats--cluster .intro-home__stat-num{font-size:2.2rem}
.intro-home__stats--cluster .intro-home__stat--empty{min-height:5.6rem;padding:1.4rem 2.6rem;border:.15rem dashed rgba(255,255,255,.3);background:none;-webkit-backdrop-filter:none;backdrop-filter:none}

/* ── photo-banner: content-area visual block (photo + stat cluster) ── */
.photo-banner{position:relative;isolation:isolate;overflow:hidden;border-radius:var(--nv-r-lg);box-shadow:var(--nv-sh-3);color:#fff;margin:3.2rem 0}
.photo-banner__bg{position:absolute;inset:0;background-size:cover;background-position:center;z-index:0}
.photo-banner::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(120deg, rgba(8,13,11,.86) 0%, rgba(8,13,11,.6) 46%, rgba(8,13,11,.32) 100%);pointer-events:none}
.photo-banner__inner{position:relative;z-index:2;padding:clamp(3.2rem,5vw,5.6rem) clamp(2.4rem,5vw,5.6rem)}
.photo-banner .photo-banner__title{margin:0;padding-left:0;font-size:clamp(2.2rem,3vw,3rem);font-weight:800;letter-spacing:-.02em;color:#fff;max-width:36ch}
.photo-banner .photo-banner__title::after,.photo-banner .photo-banner__title::before{display:none}
.photo-banner .photo-banner__text{margin:1.6rem 0 0;max-width:56ch;font-size:1.6rem;line-height:1.6;color:rgba(255,255,255,.82)}
.photo-banner__stats{display:flex;flex-wrap:wrap;gap:1.4rem;margin-top:3.2rem}
.photo-banner__stat{display:flex;flex-direction:column;align-items:flex-start;gap:.3rem;padding:1.4rem 2.2rem;border-radius:var(--nv-r-pill);background:rgba(255,255,255,.12);border:.1rem solid rgba(255,255,255,.22);-webkit-backdrop-filter:blur(1rem);backdrop-filter:blur(1rem)}
.photo-banner__stat strong{font-size:2.1rem;font-weight:800;color:#fff}
.photo-banner__stat span{font-size:1.25rem;color:rgba(255,255,255,.68)}
@media (max-width:699px){.photo-banner__inner{padding:2.4rem}.photo-banner__stats{gap:1rem}.photo-banner__stat{padding:1.2rem 1.6rem}}


/* ── stratos: dark, blurred, patterned — reads as premium at a glance ── */
.intro-home--stratos .intro-home__bg{filter:blur(2.2rem) brightness(.16) saturate(.9);transform:scale(1.12)}
.intro-home--stratos::before{content:"";position:absolute;inset:-6rem;z-index:1;background:radial-gradient(120% 90% at 50% 0%, transparent 15%, rgba(0,0,0,.88) 100%),repeating-linear-gradient(90deg, rgba(212,168,75,.07) 0 .1rem, transparent .1rem 6rem),repeating-linear-gradient(0deg, rgba(212,168,75,.07) 0 .1rem, transparent .1rem 6rem);pointer-events:none}
.intro-home--stratos .intro-home__title{font-family:"Playfair Display",Georgia,"Times New Roman",serif!important;font-weight:600;font-style:italic;letter-spacing:-.01em}
.intro-home--stratos-counters .intro-home__copy{text-align:center}
.intro-home--stratos-counters .intro-home__title{margin:0 auto;max-width:68rem}
.intro-home--stratos-counters .intro-home__text{margin:2.4rem auto 0;max-width:62ch;margin-left:auto;margin-right:auto}
.intro-home__counters{position:relative;z-index:2;display:flex;justify-content:center;flex-wrap:wrap;margin-top:5.6rem;padding-top:3.2rem;border-top:.1rem solid rgba(255,255,255,.16)}
.intro-home__counter{flex:1 1 0;max-width:22rem;padding:0 2.8rem;text-align:center;opacity:0;transform:translateY(1.6rem);transition:opacity .6s ease, transform .6s ease}
.intro-home__counter:not(:last-child){border-right:.1rem solid rgba(255,255,255,.16)}
.intro-home__counter--in{opacity:1;transform:translateY(0)}
.intro-home__counter-num{display:block;font-size:clamp(3.2rem,4vw,4.4rem);font-weight:800;letter-spacing:-.03em;color:#fff;font-variant-numeric:tabular-nums}
.intro-home__counter-label{display:block;margin-top:.8rem;font-size:1.3rem;color:rgba(255,255,255,.64)}
.intro-home__counter--empty{border:.15rem dashed rgba(255,255,255,.3);border-radius:.9rem;min-height:9rem;display:flex;align-items:center;justify-content:center;opacity:1;transform:none}

/* ── placeholders — preview-only fill-me-in boxes, never exported ── */
.ph-inline{display:inline-flex;align-items:center;font-family:"SFMono-Regular",Consolas,"Liberation Mono",monospace;font-size:1.3rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:rgba(255,255,255,.55);border:.15rem dashed rgba(255,255,255,.4);border-radius:.8rem;padding:.6em 1.1em;background:rgba(255,255,255,.04)}
.ph-label{font-family:"SFMono-Regular",Consolas,"Liberation Mono",monospace;font-size:1.2rem;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.45)}
.intro-home__art-arch--empty,.intro-home__art-oval--empty{background-image:none!important;background:rgba(255,255,255,.04);border:.2rem dashed rgba(255,255,255,.3);display:flex;align-items:center;justify-content:center}
.intro-home__strip-img--empty{background:rgba(255,255,255,.03);border:.2rem dashed rgba(255,255,255,.3);display:flex;align-items:center;justify-content:center}
.intro-home__stat--empty{border:.15rem dashed rgba(255,255,255,.3);border-radius:.9rem;display:flex;align-items:center;justify-content:center;min-height:5.6rem}
.intro-home__stats--inline .intro-home__stat--empty{min-height:4.4rem;padding:0 1.6rem}
.intro-home__tier--empty{background:none;border:.2rem dashed rgba(255,255,255,.35);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.5)}

/* ── diagonal cascade ──────────────────────────────────── */
.intro-home__diagonal{position:relative;width:100%;height:38rem;max-width:46rem;margin:0 auto}
.intro-home__diag-img,.intro-home__diag-ph{position:absolute;width:23rem;aspect-ratio:4/3;border-radius:var(--nv-r-lg);object-fit:cover;box-shadow:0 2.2rem 5rem rgba(0,0,0,.45),0 0 7rem color-mix(in srgb, var(--nv-accent) 50%, transparent),0 0 0 .1rem rgba(255,255,255,.08)}
.intro-home__diag-ph{background:rgba(255,255,255,.03);border:.2rem dashed rgba(255,255,255,.3);display:flex;align-items:center;justify-content:center}
.intro-home__diag-1{top:0;left:0;transform:rotate(-6deg);z-index:1}
.intro-home__diag-2{top:9.6rem;left:9.6rem;transform:rotate(4deg);z-index:2}
.intro-home__diag-3{top:19.2rem;left:19.2rem;transform:rotate(-3deg);z-index:3}

/* ── bottom row ────────────────────────────────────────── */
.intro-home__bottomrow{display:flex;gap:1.4rem;margin-top:4.8rem}
.intro-home__bottomrow-img,.intro-home__bottomrow-ph{position:relative;flex:1;aspect-ratio:4/5;object-fit:cover;min-width:0;border-radius:var(--nv-r-lg);box-shadow:0 1.8rem 4.4rem rgba(0,0,0,.4),0 0 0 .1rem rgba(255,255,255,.07);transition:transform var(--nv-fast)}
.intro-home__bottomrow-img:hover{transform:translateY(-.6rem)}
.intro-home__bottomrow-ph{background:rgba(255,255,255,.03);border:.2rem dashed rgba(255,255,255,.3);display:flex;align-items:center;justify-content:center}

@media (min-width:900px){.intro-home{min-height:100vh;display:flex;align-items:center}.intro-home>.container{width:100%}.intro-home--avantgarde{align-items:center}.intro-home--avantgarde .intro-home__grid{grid-template-columns:.92fr 1.08fr}.intro-home--stratos .intro-home__grid,.intro-home--roohi .intro-home__grid,.intro-home--diagonal .intro-home__grid{grid-template-columns:1.1fr .9fr}}
@media (max-width:899px){.intro-home__grid{text-align:center}.intro-home--avantgarde .intro-home__text,.intro-home--stratos .intro-home__text,.intro-home--roohi .intro-home__text,.intro-home--diagonal .intro-home__text{margin-left:auto;margin-right:auto}.intro-home__tiers{margin:3.2rem auto 0;max-width:30rem}.intro-home__stats--inline{justify-content:center}.intro-home__bottomrow{flex-wrap:wrap}.intro-home__bottomrow-img,.intro-home__bottomrow-ph{flex:1 1 40%}.intro-home__art-group{min-height:34rem;margin:0 auto;max-width:36rem}}
@media (max-width:699px){.intro-home__trio-diag{width:auto;height:auto;display:flex;flex-direction:column;align-items:center;gap:2rem}.intro-home__trio-item{position:static}.intro-home__trio-frame{width:100%;max-width:26rem;margin:0 auto}.intro-home__trio-meta{position:static;width:100%;max-width:26rem;margin:0 auto;text-align:center}.intro-home__counters{flex-direction:column;gap:2.8rem}.intro-home__counter{max-width:100%;padding:0 0 2.4rem;border-right:0!important;border-bottom:.1rem solid rgba(255,255,255,.16)}.intro-home__counter:last-child{border-bottom:0;padding-bottom:0}}

/* the content sheet overlaps the hero for depth */
.content{
  position:relative;
  z-index:3;
  margin-top:-4.8rem;
  padding:0 0 7.2rem;
}
.content .container{
  max-width:min(var(--nv-max), var(--nv-read));
  /* clears the hero overlap and still leaves real breathing room
     before the first heading */
  padding-top:9.6rem;
}
/* ── breadcrumbs ────────────────────────────────────────── */
.breadcrumbs{padding:2.4rem 0 0;font-size:1.4rem}
.breadcrumbs ul{display:flex;flex-wrap:wrap;align-items:center;gap:.7rem;list-style:none}
.breadcrumbs li{display:inline-flex;align-items:center;gap:.7rem;color:var(--nv-muted)}
.breadcrumbs li:not(:last-child)::after{
  content:"";
  width:.45rem;height:.45rem;
  border-top:.14rem solid var(--nv-line-2);
  border-right:.14rem solid var(--nv-line-2);
  transform:rotate(45deg);
}
.breadcrumbs a{color:var(--nv-muted);font-weight:600;transition:color var(--nv-fast)}
.breadcrumbs a:hover{color:var(--nv-accent)}
.breadcrumbs span{color:var(--nv-text);font-weight:600}

/* ── headings ───────────────────────────────────────────── */
/* H2 opens a section with a hairline rule whose lead-in is accented —
   it reads as a real editorial divider instead of a bare bold line. */
.content h2,.heading{
  margin:7.2rem 0 2.4rem;
  font-size:clamp(2.8rem, 3.2vw, 3.6rem);
  font-weight:800;
  line-height:1.14;
  letter-spacing:-.036em;
  color:var(--nv-heading, var(--nv-ink));
  text-wrap:balance;
  scroll-margin-top:calc(var(--nv-head-h) + 2rem);
}
.content h2::before,.heading::before{
  content:"";
  display:block;
  height:.2rem;
  margin:0 0 2.4rem;
  border-radius:var(--nv-r-pill);
  background:linear-gradient(90deg,
    var(--nv-accent) 0, var(--nv-accent) 6.4rem,
    var(--nv-line) 6.4rem);
}
.content h2:first-child,.heading:first-child{margin-top:0}
.content h2::after,.heading::after{content:none}

/* H3 carries a small rotated accent marker on the baseline */
.content h3,.heading--grey{
  position:relative;
  margin:4.8rem 0 1.4rem;
  padding-left:2.6rem;
  font-size:clamp(2.1rem, 2.25vw, 2.5rem);
  font-weight:750;
  line-height:1.3;
  letter-spacing:-.028em;
  color:var(--nv-heading, var(--nv-ink));
  scroll-margin-top:calc(var(--nv-head-h) + 2rem);
}
.content h3::before,.heading--grey::before{
  content:"";
  position:absolute;
  left:0;top:.6em;
  width:.8rem;height:.8rem;
  border-radius:50%;
  background:var(--nv-accent);
}
.content h3::after,.heading--grey::after{display:none}

/* H4 sits on an accent rail */
.content h4{
  margin:3.6rem 0 1.2rem;
  padding-left:1.4rem;
  border-left:.3rem solid var(--nv-accent-line);
  font-size:2rem;
  font-weight:700;
  line-height:1.38;
  letter-spacing:-.022em;
  color:var(--nv-heading, var(--nv-ink));
  scroll-margin-top:calc(var(--nv-head-h) + 2rem);
}

/* H5/H6 act as small eyebrow labels */
.content h5,.content h6{
  display:flex;
  align-items:center;
  gap:1rem;
  margin:3.2rem 0 .9rem;
  font-size:1.5rem;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--nv-accent);
}
.content h5::after,.content h6::after{
  content:"";
  flex:1;
  height:.1rem;
  background:linear-gradient(90deg, var(--nv-accent-line), transparent);
}

.heading--alt{color:var(--nv-heading, var(--nv-ink))}
.heading--big{font-size:clamp(3.2rem, 4vw, 4.4rem)}

/* ── body copy ──────────────────────────────────────────── */
.content p{
  margin:0 0 2.1rem;
  max-width:74ch;
  text-wrap:pretty;
}
.content p:last-child{margin-bottom:0}
/* the opening paragraph of every section carries a little more weight */
.content h2 + p,
.content h3 + p{margin-top:0}
.content strong,.content b{font-weight:700;color:var(--nv-ink)}
.content em{font-style:italic}
.content small{font-size:1.45rem;color:var(--nv-muted)}
.content mark{
  padding:.1em .35em;
  border-radius:.4rem;
  background:color-mix(in srgb, var(--nv-gold) 34%, transparent);
  color:var(--nv-ink);
}
.content abbr[title]{text-decoration:underline dotted;cursor:help}
.content code{
  padding:.15em .45em;
  border-radius:.5rem;
  border:.1rem solid var(--nv-line);
  background:color-mix(in srgb, var(--nv-ink) 4%, transparent);
  font-family:"SFMono-Regular",Consolas,"Liberation Mono",monospace;
  font-size:.88em;
  color:var(--nv-ink);
}

.content a:not([class]){
  color:var(--nv-accent);
  font-weight:600;
  text-decoration:underline;
  text-decoration-thickness:.1rem;
  text-underline-offset:.32rem;
  text-decoration-color:var(--nv-accent-line);
  transition:text-decoration-color var(--nv-fast), color var(--nv-fast);
}
.content a:not([class]):hover{
  text-decoration-color:var(--nv-accent);
  text-decoration-thickness:.16rem;
}

/* ── lists ──────────────────────────────────────────────── */
.content ul:not([class]),
.content ol:not([class]){margin:0 0 2.6rem;padding:0;list-style:none;max-width:74ch}
.content ul:not([class]) li,
.content ol:not([class]) li{position:relative;padding-left:3.2rem;margin:0 0 1.3rem}
.content ul:not([class]) li:last-child,
.content ol:not([class]) li:last-child{margin-bottom:0}
.content ul:not([class]) li::before{
  content:"";
  position:absolute;
  left:.4rem;top:.72em;
  width:1.1rem;height:1.1rem;
  border-radius:50%;
  background:var(--nv-bullet, var(--nv-accent));
  box-shadow:0 0 0 .3rem var(--nv-bullet-soft, var(--nv-accent-soft));
}
.content ol:not([class]){counter-reset:nv-num}
.content ol:not([class]) li{counter-increment:nv-num;padding-left:4.2rem}
.content ol:not([class]) li::before{
  content:counter(nv-num);
  position:absolute;
  left:0;top:.18em;
  display:flex;align-items:center;justify-content:center;
  width:2.8rem;height:2.8rem;
  border-radius:.9rem;
  font-size:1.35rem;font-weight:800;line-height:1;
  color:#fff;
  background:linear-gradient(160deg, var(--nv-accent), var(--nv-accent-deep));
  box-shadow:0 .3rem .9rem color-mix(in srgb, var(--nv-accent) 26%, transparent);
}
.content li>ul,.content li>ol{margin:1.1rem 0 0}

/* ── blockquote ─────────────────────────────────────────── */
.content blockquote{
  position:relative;
  margin:3.8rem 0;
  padding:3rem 3.2rem 2.6rem;
  border-radius:var(--nv-r-lg);
  background:var(--nv-surface);
  border:.1rem solid var(--nv-line);
  border-left:.4rem solid var(--nv-accent);
  box-shadow:var(--nv-sh-1);
  font-size:1.9rem;
  line-height:1.66;
  letter-spacing:-.014em;
  color:var(--nv-ink);
}
.content blockquote::before{
  content:"\201C";
  position:absolute;
  top:.6rem;right:2.4rem;
  font-family:Georgia,"Times New Roman",serif;
  font-size:8rem;
  line-height:1;
  color:var(--nv-accent);
  opacity:.14;
}
.content blockquote p{max-width:none}
.content blockquote p:last-child{margin-bottom:0}
.content blockquote cite{
  display:block;
  margin-top:1.4rem;
  font-size:1.4rem;
  font-style:normal;
  font-weight:600;
  color:var(--nv-muted);
}

/* ── media ──────────────────────────────────────────────── */
.content img{margin:0 0 2.8rem;border-radius:var(--nv-r-lg);box-shadow:var(--nv-sh-1)}
.content figure{margin:0 0 2.8rem}
.content figcaption{margin-top:1.1rem;font-size:1.4rem;color:var(--nv-muted);text-align:center}
.content iframe{display:block;width:100%;border:0;border-radius:var(--nv-r-md)}

/* ── widget / ratings block ─────────────────────────────── */
.rating-table{margin:0 0 6.4rem}
.rating-table .heading{margin-top:0;margin-bottom:2.4rem}
.rating-table__wrap{width:100%;overflow-x:auto;border:.1rem solid var(--nv-line);border-radius:var(--nv-r-lg)}
.rating-table table{width:100%;min-width:62rem;border-collapse:collapse}
.rating-table thead tr{border-bottom:.2rem solid var(--nv-accent)}
.rating-table th{padding:1.8rem 2rem;font-size:1.3rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--nv-muted);text-align:left}
.rating-table th.rating-table__rank{width:6rem;text-align:center}
.rating-table tbody tr{border-bottom:.1rem solid var(--nv-line)}
.rating-table tbody tr:last-child{border-bottom:0}
.rating-table tbody tr:nth-child(even){background:var(--nv-table-stripe)}
.rating-table td{padding:2.4rem 2rem;vertical-align:middle;font-size:1.6rem}
.rating-table__rank{width:6rem;text-align:center;font-family:"SFMono-Regular",Consolas,"Liberation Mono",monospace;color:var(--nv-muted);font-weight:700}
.rating-table__name{font-weight:700;color:var(--nv-ink)}
.rating-table__score{font-weight:800;color:var(--nv-accent);font-family:"SFMono-Regular",Consolas,"Liberation Mono",monospace;white-space:nowrap}
.rating-table__bonus{color:var(--nv-muted)}
.rating-table__action{text-align:right;white-space:nowrap}
.rating-table__play{display:inline-flex;align-items:center;justify-content:center;padding:1.1rem 2.4rem;border-radius:var(--nv-r-pill);background:var(--nv-accent);color:#fff;font-size:1.4rem;font-weight:700;transition:background var(--nv-fast), transform var(--nv-fast)}
.rating-table__play:hover{background:var(--nv-accent-deep);transform:translateY(-.1rem)}
.rating-table__empty-row td{padding:3.6rem 2rem;text-align:center;color:var(--nv-muted);font-style:italic}

/* ── contact card ───────────────────────────────────────── */
.top-card{
  display:block;
  padding:2.6rem 2.4rem;
  border-radius:var(--nv-r-lg);
  border:.1rem solid var(--nv-line);
  background:var(--nv-surface);
  box-shadow:var(--nv-sh-1);
}
.contact-email-block{margin:0 0 3.6rem}
.contact-card{
  display:flex;
  align-items:center;
  gap:1.8rem;
  flex-wrap:wrap;
  padding:2.4rem 2.6rem;
  border-radius:var(--nv-r-lg);
  border:.1rem solid var(--nv-line);
  background:var(--nv-surface);
  box-shadow:var(--nv-sh-2);
}
.contact-card__icon{
  display:grid;place-items:center;
  flex-shrink:0;
  width:5.2rem;height:5.2rem;
  border-radius:var(--nv-r-md);
  background:linear-gradient(150deg, var(--nv-accent), var(--nv-accent-deep));
}
.contact-card__icon svg{width:2.4rem;height:2.4rem;fill:none;stroke:#fff;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.contact-card__label{
  margin:0;
  font-size:1.1rem;font-weight:800;
  letter-spacing:.14em;text-transform:uppercase;
  color:var(--nv-muted);
}
.contact-card__value{
  margin:.5rem 0 0;
  font-size:clamp(1.9rem,2.2vw,2.3rem);
  font-weight:700;letter-spacing:-.024em;
  color:var(--nv-ink);word-break:break-word;
}
.contact-card__value a{color:var(--nv-ink);transition:color var(--nv-fast)}
.contact-card__value a:hover{color:var(--nv-accent)}

/* ── buttons — glossy CTA ───────────────────────────────── */
.button,.referral-btn{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.8rem;
  padding:1.35rem 2.8rem;
  border:0;
  border-radius:var(--nv-r-pill);
  font-size:1.55rem;
  font-weight:800;
  letter-spacing:.01em;
  color:#fff;
  text-align:center;
  text-decoration:none;
  cursor:pointer;
  background:linear-gradient(160deg, var(--nv-accent) 0%, var(--nv-accent-deep) 100%);
  box-shadow:0 .8rem 2rem color-mix(in srgb, var(--nv-accent) 30%, transparent),
             inset 0 .1rem 0 rgba(255,255,255,.28);
  overflow:hidden;
  transition:transform var(--nv-fast), box-shadow var(--nv-fast);
}
.button::after,.referral-btn::after{
  content:"";
  position:absolute;inset:0;
  background:linear-gradient(115deg,transparent 34%,rgba(255,255,255,.32) 50%,transparent 66%);
  transform:translateX(-130%);
  transition:transform .7s var(--nv-ease);
}
.button:hover,.referral-btn:hover{
  transform:translateY(-.2rem);
  box-shadow:0 1.2rem 2.8rem color-mix(in srgb, var(--nv-accent) 40%, transparent),
             inset 0 .1rem 0 rgba(255,255,255,.3);
}
.button:hover::after,.referral-btn:hover::after{transform:translateX(130%)}
.button:active,.referral-btn:active{transform:translateY(0)}

/* ── tables — casino toplist ────────────────────────────── */
.table{
  position:relative;
  width:100%;
  margin:3.4rem 0 4.4rem;
  border-radius:var(--nv-r-lg);
  border:.1rem solid var(--nv-line);
  background:var(--nv-table);
  box-shadow:var(--nv-sh-2);
  overflow:auto hidden;
  -webkit-overflow-scrolling:touch;
}
.table table{
  width:100%;
  min-width:58rem;
  border-collapse:separate;
  border-spacing:0;
  background:transparent;
  color:var(--nv-text);
  font-size:1.6rem;
  text-align:left;
}
.table table caption{
  padding:1.6rem 2rem;
  text-align:left;
  font-size:1.4rem;font-weight:700;
  color:var(--nv-muted);
}
.table table th,
.table table td{
  padding:1.6rem 1.8rem;
  vertical-align:middle;
  line-height:1.5;
  overflow-wrap:break-word;
  border:0;
  border-bottom:.1rem solid var(--nv-line);
}
.table table thead th{
  position:sticky;
  top:0;
  z-index:2;
  font-size:1.2rem;
  font-weight:800;
  letter-spacing:.11em;
  text-transform:uppercase;
  color:#fff;
  background:linear-gradient(180deg, var(--nv-ink), color-mix(in srgb, var(--nv-ink) 82%, #000));
  border-bottom:0;
  white-space:nowrap;
}
.table table thead th::after{
  content:"";
  position:absolute;left:0;right:0;bottom:0;height:.2rem;
  background:linear-gradient(90deg, var(--nv-accent), var(--nv-gold));
}
.table table tbody tr{transition:background var(--nv-fast)}
.table table tbody tr:nth-child(even) td{background:var(--nv-table-stripe)}
.table table tbody tr:hover td{background:color-mix(in srgb, var(--nv-accent) 6%, var(--nv-table))}
.table table tbody tr:last-child td{border-bottom:0}
.table table tbody td:first-child{font-weight:700;color:var(--nv-ink)}
.table table img{max-width:6.4rem;margin:0;border-radius:.6rem}
.table table a{color:var(--nv-accent);font-weight:700}
.table table .button{width:auto;min-width:10.5rem;padding:.95rem 1.7rem;font-size:1.36rem}
.table--small table{min-width:52rem}
.table--info table td{text-align:left}

/* optional: add class "table--top" for a ranked toplist */
.table--top table tbody{counter-reset:nv-rank}
.table--top table tbody tr{counter-increment:nv-rank}
.table--top table tbody td:first-child{position:relative;padding-left:6.4rem}
.table--top table tbody td:first-child::before{
  content:counter(nv-rank);
  position:absolute;
  left:1.8rem;top:50%;
  transform:translateY(-50%);
  display:grid;place-items:center;
  width:3.2rem;height:3.2rem;
  border-radius:.9rem;
  font-size:1.4rem;font-weight:800;
  color:#fff;
  background:linear-gradient(160deg, var(--nv-accent), var(--nv-accent-deep));
  box-shadow:0 .4rem 1rem color-mix(in srgb, var(--nv-accent) 30%, transparent);
}
.table--top table tbody tr:first-child td:first-child::before{
  background:linear-gradient(160deg, var(--nv-gold), #c99a22);
  color:var(--nv-ink);
  box-shadow:0 .4rem 1.2rem rgba(245,196,81,.5);
}

/* ── table variant: dark/accent two-column contrast (e.g. "mit Lizenz
   vs. ohne Lizenz") — one column striped in the site accent colour, the
   other in near-black, so the two options read as visually opposed
   instead of a plain striped data table ──────────────────────────── */
.table--contrast table thead th:nth-child(2){
  color:#fff;
  background:linear-gradient(180deg, var(--nv-footer), color-mix(in srgb, var(--nv-footer) 82%, #000));
}
.table--contrast table thead th:nth-child(3){
  color:#fff;
  background:linear-gradient(180deg, var(--nv-footer), color-mix(in srgb, var(--nv-footer) 82%, #000));
}
.table--contrast table thead th:nth-child(2)::after{
  background:var(--nv-accent);
}
.table--contrast table thead th:nth-child(3)::after{
  background:color-mix(in srgb, var(--nv-accent) 65%, #000);
}
.table--contrast table tbody td:nth-child(2){
  background:color-mix(in srgb, var(--nv-accent) 7%, var(--nv-table));
  border-left:.3rem solid var(--nv-accent);
}
.table--contrast table tbody td:nth-child(3){
  background:color-mix(in srgb, var(--nv-accent) 16%, var(--nv-table));
  color:var(--nv-text);
  border-left:.3rem solid color-mix(in srgb, var(--nv-accent) 65%, #000);
}
.table--contrast table tbody tr:nth-child(even) td:nth-child(2){
  background:color-mix(in srgb, var(--nv-accent) 12%, var(--nv-table));
}
.table--contrast table tbody tr:nth-child(even) td:nth-child(3){
  background:color-mix(in srgb, var(--nv-accent) 22%, var(--nv-table));
}
.table--contrast table tbody td:nth-child(1){font-weight:700}
/* the generic ".table tbody tr:hover td" rule (near-white tint) would
   otherwise wash out the accent-tinted columns on hover — restore the
   same colours on hover instead of the generic one, at matching
   specificity */
.table--contrast table tbody tr:hover td:nth-child(2){background:color-mix(in srgb, var(--nv-accent) 7%, var(--nv-table))}
.table--contrast table tbody tr:hover td:nth-child(3){background:color-mix(in srgb, var(--nv-accent) 16%, var(--nv-table))}
.table--contrast table tbody tr:nth-child(even):hover td:nth-child(2){background:color-mix(in srgb, var(--nv-accent) 12%, var(--nv-table))}
.table--contrast table tbody tr:nth-child(even):hover td:nth-child(3){background:color-mix(in srgb, var(--nv-accent) 22%, var(--nv-table))}

/* table--contrast-deep: a second sibling-not-twin look, same ink-header
   style as every other table on the site (not a separately coloured
   header, per Egor: keep tables close to the site own colours) -- the
   only differences from the base contrast style are the accent border
   moving to the top edge of each cell instead of the left edge, and a
   slightly different tint curve */
.table--contrast-deep table tbody td:nth-child(2){
  background:color-mix(in srgb, var(--nv-accent) 10%, var(--nv-table));
  border-left:0;
  border-top:.3rem solid var(--nv-accent);
}
.table--contrast-deep table tbody td:nth-child(3){
  background:color-mix(in srgb, var(--nv-accent) 20%, var(--nv-table));
  color:var(--nv-text);
  border-left:0;
  border-top:.3rem solid color-mix(in srgb, var(--nv-accent) 65%, #000);
}
.table--contrast-deep table tbody tr:nth-child(even) td:nth-child(2){
  background:color-mix(in srgb, var(--nv-accent) 15%, var(--nv-table));
}
.table--contrast-deep table tbody tr:nth-child(even) td:nth-child(3){
  background:color-mix(in srgb, var(--nv-accent) 26%, var(--nv-table));
}
.table--contrast-deep table tbody tr:hover td:nth-child(2){background:color-mix(in srgb, var(--nv-accent) 10%, var(--nv-table))}
.table--contrast-deep table tbody tr:hover td:nth-child(3){background:color-mix(in srgb, var(--nv-accent) 20%, var(--nv-table))}
.table--contrast-deep table tbody tr:nth-child(even):hover td:nth-child(2){background:color-mix(in srgb, var(--nv-accent) 15%, var(--nv-table))}
.table--contrast-deep table tbody tr:nth-child(even):hover td:nth-child(3){background:color-mix(in srgb, var(--nv-accent) 26%, var(--nv-table))}

/* ── FAQ accordion ──────────────────────────────────────── */
.faq{margin:3.6rem 0 4.4rem}
.faq__card{
  position:relative;
  margin:0 0 1rem;
  border-radius:var(--nv-r-md);
  border:.1rem solid var(--nv-line);
  background:var(--nv-surface);
  box-shadow:var(--nv-sh-1);
  overflow:hidden;
  transition:border-color var(--nv-fast), box-shadow var(--nv-fast);
}
.faq__card:hover{border-color:var(--nv-accent-line);box-shadow:var(--nv-sh-2)}
.faq__card:last-child{margin-bottom:0}
.faq__input{position:absolute;opacity:0;width:0;height:0;pointer-events:none}
.faq__label{
  position:relative;
  display:block;
  padding:1.9rem 5.8rem 1.9rem 2.2rem;
  font-size:1.75rem;
  font-weight:700;
  line-height:1.45;
  letter-spacing:-.02em;
  color:var(--nv-ink);
  cursor:pointer;
  transition:color var(--nv-fast);
}
.faq__label:hover{color:var(--nv-accent)}
.faq__label::before{
  content:"";
  position:absolute;
  right:1.8rem;top:50%;
  width:2.8rem;height:2.8rem;
  margin-top:-1.4rem;
  border-radius:var(--nv-r-pill);
  background:var(--nv-accent-soft);
  transition:background var(--nv-fast);
}
.faq__label::after{
  content:"";
  position:absolute;
  right:2.85rem;top:50%;
  width:.85rem;height:.85rem;
  margin-top:-.62rem;
  border-right:.22rem solid var(--nv-accent);
  border-bottom:.22rem solid var(--nv-accent);
  transform:rotate(45deg);
  transition:transform var(--nv-slow), margin-top var(--nv-slow);
}
.faq__input:checked+.faq__label{color:var(--nv-accent)}
.faq__input:checked+.faq__label::before{background:color-mix(in srgb, var(--nv-accent) 20%, transparent)}
.faq__input:checked+.faq__label::after{transform:rotate(-135deg);margin-top:-.22rem}
.faq__body{
  display:grid;
  grid-template-rows:0fr;
  margin:0;
  padding:0 2.2rem;
  opacity:0;
  font-size:1.68rem;
  line-height:1.72;
  color:var(--nv-muted);
  overflow:hidden;
  transition:grid-template-rows var(--nv-slow), opacity var(--nv-slow), padding var(--nv-slow);
}
.faq__body>*{overflow:hidden;min-height:0}
.faq__body p{margin:0 0 1.2rem}
.faq__body p:last-child{margin-bottom:0}
.faq__input:checked~.faq__body{grid-template-rows:1fr;padding:0 2.2rem 2rem;opacity:1}

/* ── pros / cons ────────────────────────────────────────── */
.pros-cons{display:grid;gap:1.6rem;margin:3.4rem 0 4.4rem}
.pros-cons__item{
  padding:2.4rem;
  border-radius:var(--nv-r-lg);
  border:.1rem solid var(--nv-line);
  background:var(--nv-surface);
  box-shadow:var(--nv-sh-1);
}
.pros-cons__item--pros{border-top:.3rem solid var(--nv-green)}
.pros-cons__item--cons{border-top:.3rem solid var(--nv-accent)}
.pros-cons__title{margin:0 0 1.6rem;font-size:2rem;font-weight:800;line-height:1.25;letter-spacing:-.024em}
.pros-cons__item--pros .pros-cons__title{color:#1a8f45}
.pros-cons__item--cons .pros-cons__title{color:var(--nv-accent)}
.pros-cons__list{list-style:none}
.pros-cons__list li{position:relative;padding:0 0 0 3rem;margin:0 0 1.1rem;font-size:1.65rem}
.pros-cons__list li:last-child{margin-bottom:0}
.pros-cons__list li::before{content:"";position:absolute;left:0;top:.55em;width:1rem;height:1rem;border-radius:50%}
.pros-cons__item--pros .pros-cons__list li::before{background:var(--nv-green);box-shadow:0 0 0 .32rem rgba(34,179,86,.16)}
.pros-cons__item--cons .pros-cons__list li::before{background:var(--nv-accent);box-shadow:0 0 0 .32rem var(--nv-accent-soft)}

/* ── check list / stepper / info blocks ─────────────────── */
.check-list{margin:0 0 3.2rem}
.check-list ul,.check-list ol{list-style:none}
.check-list li{position:relative;padding-left:3.4rem;margin-bottom:1.6rem}
.check-list li::before{
  content:"";position:absolute;left:0;top:.3em;
  width:2.3rem;height:2.3rem;border-radius:.7rem;
  background:linear-gradient(160deg, var(--nv-green), #148a3d);
}
.check-list li::after{
  content:"";position:absolute;left:.82rem;top:.6em;
  width:.55rem;height:1rem;
  border-right:.2rem solid #fff;
  border-bottom:.2rem solid #fff;
  transform:rotate(42deg);
}
.check-list li a{color:var(--nv-accent);font-weight:600}

.stepper{margin:0 0 3.6rem}
.stepper__list{list-style:none;counter-reset:nv-step}
.stepper__list li{position:relative;padding:0 0 2.6rem 4.8rem;counter-increment:nv-step}
.stepper__list li::before{
  content:"";position:absolute;left:1.6rem;top:1.4rem;bottom:0;
  width:.2rem;background:var(--nv-line);
}
.stepper__list li:last-child{padding-bottom:0}
.stepper__list li:last-child::before{display:none}
.stepper__list li::after{
  content:counter(nv-step);
  position:absolute;left:0;top:0;
  display:grid;place-items:center;
  width:3.4rem;height:3.4rem;
  border-radius:var(--nv-r-pill);
  font-size:1.4rem;font-weight:800;color:#fff;
  background:linear-gradient(160deg, var(--nv-accent), var(--nv-accent-deep));
}
.stepper__title{margin:.3rem 0 .5rem;font-size:1.85rem;font-weight:700;color:var(--nv-ink)}
.stepper__list p{margin:0;color:var(--nv-muted)}

.info-blocks{display:grid;gap:1.6rem;margin:0 0 3.6rem}
.info-blocks__item{
  padding:2.2rem;
  border-radius:var(--nv-r-lg);
  border:.1rem solid var(--nv-line);
  background:var(--nv-surface);
  box-shadow:var(--nv-sh-1);
}
.info-blocks__head{display:flex;align-items:center;gap:1.4rem;margin:0 0 1rem}
.info-blocks__head img{width:5rem;flex-shrink:0;margin:0}
/* ── footer ─────────────────────────────────────────────── */
.footer{
  position:relative;
  margin-top:8rem;
  padding:6.4rem 0 4rem;
  color:rgba(255,255,255,.7);
  background:
    radial-gradient(80rem 36rem at 50% -40%, color-mix(in srgb, var(--nv-accent) 22%, transparent), transparent 68%),
    var(--nv-footer);
  overflow:hidden;
}
.footer::before{
  content:"";
  position:absolute;top:0;left:0;right:0;height:.2rem;
  background:linear-gradient(90deg,transparent,var(--nv-accent) 26%,var(--nv-gold) 50%,var(--nv-accent) 74%,transparent);
  opacity:.8;
}
.footer .container{position:relative;z-index:1;max-width:var(--nv-max)}
.footer a{color:rgba(255,255,255,.78);transition:color var(--nv-fast)}
.footer a:hover{color:#fff}

.footer__top{
  display:grid;
  gap:4rem 3.2rem;
  padding-bottom:4rem;
  border-bottom:.1rem solid rgba(255,255,255,.1);
}
.footer__col-title{
  margin:0 0 1.6rem;
  font-size:1.15rem;
  font-weight:800;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:rgba(255,255,255,.42);
}
.footer__brand{max-width:38rem}
.footer__logo{display:inline-flex;align-items:center;margin:0 0 1.8rem}
.footer__logo img{
  height:6.4rem;width:auto;max-width:30rem;
  object-fit:contain;
}
.footer__logo--text{
  font-size:2.8rem;font-weight:800;letter-spacing:-.03em;color:#fff;
}
.footer__subtitle{
  margin:0;
  font-size:1.7rem;
  font-weight:600;
  line-height:1.55;
  letter-spacing:-.018em;
  color:var(--nv-footer-sub);
  text-wrap:pretty;
}

.footer__nav ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:1rem}
.footer__nav a{
  display:inline-block;
  font-size:1.55rem;
  font-weight:600;
  transition:color var(--nv-fast), transform var(--nv-fast);
}
.footer__nav a:hover{transform:translateX(.3rem)}

.footer__info-imgs{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:1.4rem 2rem;
  margin:0;
  padding:0;
}
.footer__info-imgs a,
.footer__info-imgs img{display:inline-flex;align-items:center}
.footer__info-imgs img{
  height:var(--nv-footer-img-h);
  max-height:var(--nv-footer-img-h);
  width:auto;
  object-fit:contain;
  opacity:.62;
  transition:opacity var(--nv-fast), transform var(--nv-fast);
}
.footer__info-imgs a:hover img,
.footer__info-imgs img:hover{opacity:1;transform:translateY(-.2rem)}

.footer__desc{
  margin:3.2rem 0 0;
  font-size:1.32rem;
  line-height:1.82;
  color:rgba(255,255,255,.4);
}

@media (min-width:768px){
  .footer__top{grid-template-columns:1.7fr 1fr}
  .footer__badges{grid-column:1 / -1;padding-top:2.4rem;border-top:.1rem solid rgba(255,255,255,.07)}
}
@media (min-width:1100px){
  .footer__top{grid-template-columns:2fr 1fr 1.5fr;gap:4rem}
  .footer__badges{grid-column:auto;padding-top:0;border-top:0}
}

/* ── back to top ────────────────────────────────────────── */
.nv-top{
  position:fixed;
  right:2.4rem;bottom:2.4rem;
  z-index:70;
  display:grid;
  place-items:center;
  width:4.6rem;height:4.6rem;
  padding:0;
  border:0;
  border-radius:var(--nv-r-pill);
  background:linear-gradient(160deg, var(--nv-accent), var(--nv-accent-deep));
  box-shadow:0 .8rem 2.2rem color-mix(in srgb, var(--nv-accent) 42%, transparent);
  cursor:pointer;
  opacity:0;
  transform:translateY(1rem);
  pointer-events:none;
  transition:opacity var(--nv-slow), transform var(--nv-slow), box-shadow var(--nv-fast);
}
.nv-top--on{opacity:1;transform:none;pointer-events:auto}
.nv-top:hover{box-shadow:0 1.2rem 2.8rem color-mix(in srgb, var(--nv-accent) 55%, transparent)}
.nv-top::before{
  content:"";
  width:.9rem;height:.9rem;
  margin-top:.3rem;
  border-top:.24rem solid #fff;
  border-left:.24rem solid #fff;
  transform:rotate(45deg);
}

/* ── reading progress ───────────────────────────────────── */
.nv-progress{
  position:fixed;
  top:0;left:0;
  z-index:90;
  height:.3rem;
  width:0;
  background:linear-gradient(90deg, var(--nv-accent), var(--nv-gold));
  box-shadow:0 0 1.2rem color-mix(in srgb, var(--nv-accent) 60%, transparent);
  transition:width .1s linear;
}

/* ── responsive ─────────────────────────────────────────── */
@media (max-width:1199px){
  .header__nav{
    position:absolute;
    right:var(--nv-gutter);
    top:calc(var(--nv-head-h) - .6rem);
    display:none;
    min-width:20rem;
    padding:1rem;
    border-radius:var(--nv-r-md);
    border:.1rem solid var(--nv-head-line);
    background:var(--nv-head-bg);
    box-shadow:var(--nv-sh-3);
  }
  .header__nav--active{display:block}
  .header__nav ul{flex-direction:column;align-items:stretch;gap:.2rem}
}
@media (min-width:1200px){
  .header__menu-toggle{display:none}
}
@media (max-width:991px){
  :root{--nv-head-h:6.4rem;--nv-gutter:2rem}
  .intro-home{padding:7.2rem 0 8rem}
  .content{margin-top:-4rem;padding-bottom:5.6rem}
  .content .container{padding-top:8rem}
    .author-strip__date{margin-left:0}
}
@media (max-width:767px){
  :root{--nv-gutter:1.6rem}
  body{font-size:1.65rem;line-height:1.72}
  .intro-home{padding:5.2rem 0 6rem}
  .intro-home__title::after{margin-top:2.2rem;width:7.2rem}
  .intro-home__text{margin-top:2rem}
  .intro-home__meta{margin-top:2.6rem}
  .content{margin-top:-3.2rem;padding-bottom:4.4rem}
  .content .container{padding-top:6.4rem}
  .content h2,.heading{margin-top:5.2rem}
  .content h2::before,.heading::before{margin-bottom:1.8rem}
  .content h3,.heading--grey{margin-top:3.6rem;padding-left:2.2rem}
  .table{border-radius:var(--nv-r-md);margin:2.8rem 0 3.4rem}
  .table table{min-width:48rem;font-size:1.5rem}
  .table table th,.table table td{padding:1.25rem 1.2rem}
  .table--top table tbody td:first-child{padding-left:5.4rem}
  .table--top table tbody td:first-child::before{left:1.2rem;width:2.8rem;height:2.8rem;font-size:1.3rem}
  .faq__label{padding:1.6rem 5rem 1.6rem 1.6rem;font-size:1.66rem}
  .faq__body,.faq__input:checked~.faq__body{padding-left:1.6rem;padding-right:1.6rem}
  .author-strip__inner{padding:1.5rem 1.6rem;gap:1.3rem}
  .contact-card{padding:2rem}
  .content blockquote{padding:2rem}
  .footer{margin-top:5.2rem;padding:4.4rem 0 3rem}
  .footer__top{gap:3.2rem;padding-bottom:3.2rem}
  .footer__logo img{height:5.2rem}
  .footer__subtitle{font-size:1.6rem}
  .footer__desc{margin-top:2.6rem}
  .nv-top{right:1.4rem;bottom:1.4rem;width:4.2rem;height:4.2rem}
}
@media (min-width:768px){
  .pros-cons{grid-template-columns:1fr 1fr}
  .info-blocks{grid-template-columns:1fr 1fr}
}

/* ── Статистика: топ-картки з номером (1st/2nd/3rd + фото) ──────── */
.stat-rank{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:2.4rem;
  margin:3.6rem 0 4.4rem;
}
.stat-rank__item{
  position:relative;
  padding:2.8rem 2.2rem 2.4rem;
  border-radius:var(--nv-r-lg);
  background:var(--nv-surface);
  border:.1rem solid var(--nv-line);
  box-shadow:var(--nv-sh-1);
  overflow:hidden;
}
.stat-rank__num{
  position:absolute;
  top:.2rem;left:2rem;
  font-size:7.2rem;
  font-weight:800;
  line-height:1;
  color:transparent;
  -webkit-text-stroke:.1rem var(--nv-line-2);
  letter-spacing:-.03em;
  pointer-events:none;
  z-index:0;
}
.stat-rank__frame{
  position:relative;
  z-index:1;
  margin-top:3.4rem;
  border-radius:var(--nv-r-md);
  overflow:hidden;
  aspect-ratio:1/1;
  box-shadow:var(--nv-sh-2);
  background:var(--nv-table-stripe);
}
.stat-rank__img{width:100%;height:100%;object-fit:cover;display:block}
.stat-rank__title{
  position:relative;z-index:1;
  margin:1.8rem 0 .4rem;
  font-size:1.9rem;font-weight:800;color:var(--nv-ink);
}
.stat-rank__sub{
  position:relative;z-index:1;
  margin:0;font-size:1.4rem;color:var(--nv-muted);
}
.stat-rank__stats{
  position:relative;z-index:1;
  display:flex;gap:1.6rem;flex-wrap:wrap;
  margin-top:1.4rem;padding-top:1.2rem;
  border-top:.1rem solid var(--nv-line);
}
.stat-rank__stat{display:flex;flex-direction:column}
.stat-rank__stat-num{font-size:1.6rem;font-weight:800;color:var(--nv-accent);line-height:1.2}
.stat-rank__stat-label{margin-top:.2rem;font-size:1.1rem;color:var(--nv-muted)}
@media (max-width:699px){
  .stat-rank{grid-template-columns:1fr;gap:1.8rem}
}

/* ── Рейтинг: картка у стилі топ-листа (фото/бейдж + назва + оцінка) ── */
.rank-card{
  margin:3.6rem 0 4.4rem;
  padding:2.8rem 2.8rem 1rem;
  border-radius:var(--nv-r-lg);
  background:var(--nv-surface);
  border:.1rem solid var(--nv-line);
  box-shadow:var(--nv-sh-1);
}
.rank-card__cols{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 0 1.4rem;
  font-size:1.2rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.04em;
  color:var(--nv-muted);
}
.rank-card__rows{display:flex;flex-direction:column}
.rank-card__row{
  display:flex;
  align-items:center;
  gap:1.8rem;
  padding:1.6rem 0;
  border-top:.1rem solid var(--nv-line);
}
.rank-card__row:first-child{border-top:0}
.rank-card__thumb{
  flex-shrink:0;
  width:6rem;height:6rem;
  border-radius:var(--nv-r-md);
  overflow:hidden;
  background:var(--nv-table-stripe);
}
.rank-card__thumb img{width:100%;height:100%;object-fit:cover;display:block}
.rank-card__thumb--num{
  display:grid;place-items:center;
  font-size:1.8rem;font-weight:800;
  color:var(--rank-card-accent, var(--nv-rank-num, var(--nv-accent)));
  background:var(--rank-card-accent-soft, var(--nv-rank-num-soft, var(--nv-accent-soft)));
  border:.1rem solid var(--rank-card-accent, var(--nv-rank-num, var(--nv-accent-line)));
}
.rank-card__info{flex:1 1 auto;min-width:0}
.rank-card__name{font-size:1.8rem;font-weight:800;color:var(--nv-ink)}
.rank-card__sub{margin-top:.2rem;font-size:1.3rem;color:var(--nv-muted)}
.rank-card__stat{flex-shrink:0;display:flex;align-items:center;gap:.7rem}
.rank-card__stat-icon{font-size:1.5rem;color:var(--rank-card-accent, var(--nv-accent))}
.rank-card__stat-num{font-size:1.8rem;font-weight:800;color:var(--nv-ink)}
.rank-card__btn{flex-shrink:0;padding:.95rem 1.9rem;font-size:1.36rem;white-space:nowrap}
@media (max-width:699px){
  .rank-card{padding:2.2rem 1.8rem 1rem}
  .rank-card__thumb{width:4.8rem;height:4.8rem}
  .rank-card__name{font-size:1.6rem}
  .rank-card__row{flex-wrap:wrap}
  .rank-card__btn{flex:1 1 100%;margin-top:.4rem}
}

/* ── Статистика: іконка + текст (без картки / у картках) ─────────── */
.feature-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(22rem,1fr));
  gap:3.2rem 2.8rem;
  margin:3.6rem 0 4.4rem;
}
.feature-grid--card .feature-grid__item{
  padding:2.6rem 2.4rem;
  border-radius:var(--nv-r-lg);
  border:.1rem solid var(--nv-line);
  background:var(--nv-surface);
  box-shadow:var(--nv-sh-1);
}
.feature-grid__icon{
  display:flex;align-items:center;justify-content:center;
  width:4.8rem;height:4.8rem;
  margin-bottom:1.6rem;
  border-radius:var(--nv-r-md);
  background:var(--nv-accent-soft);
}
.feature-grid__icon img{width:2.4rem;height:2.4rem;object-fit:contain}
.feature-grid__title{margin:0 0 .8rem;font-size:1.8rem;font-weight:800;color:var(--nv-ink)}
.feature-grid__text{margin:0;font-size:1.5rem;line-height:1.6;color:var(--nv-muted)}

/* ── Заголовок секції (для статистики/FAQ) ───────────────────────── */
.section-head{margin:4.4rem 0 2.4rem}
.section-head__eyebrow{
  display:inline-flex;align-items:center;
  padding:.5rem 1.4rem;
  margin-bottom:1.2rem;
  border-radius:var(--nv-r-pill);
  background:var(--nv-accent-soft);
  color:var(--nv-accent-deep);
  font-size:1.2rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;
}
.section-head__top{display:flex;align-items:center;gap:1.2rem}
.section-head__icon{
  display:flex;align-items:center;justify-content:center;
  width:4rem;height:4rem;flex-shrink:0;
  border-radius:var(--nv-r-md);
  background:var(--nv-accent-soft);
}
.section-head__icon img{width:2.2rem;height:2.2rem;object-fit:contain}
.section-head__title{margin:0}
.section-head__intro{margin:1.2rem 0 0;color:var(--nv-muted);font-size:1.6rem;max-width:68rem}

/* ── FAQ: варіант з плюсиком замість стрілки ─────────────────────── */
.faq--plus .faq__label::after{
  content:'';
  border:0;
  width:1.5rem;height:1.5rem;
  right:2.45rem;
  margin-top:-.75rem;
  background:
    linear-gradient(var(--nv-accent),var(--nv-accent)) center / 100% .2rem no-repeat,
    linear-gradient(var(--nv-accent),var(--nv-accent)) center / .2rem 100% no-repeat;
  transform:rotate(0deg);
  transition:transform var(--nv-slow);
}
.faq--plus .faq__input:checked+.faq__label::after{transform:rotate(45deg);margin-top:-.75rem}

/* ── FAQ: варіант з 2 контрастними кольорами (опційно, через inline-змінні) ── */
.faq--duo .faq__card{
  background:var(--faq-c1, var(--nv-surface));
  color:var(--faq-c1-text, var(--nv-ink));
  transition:background var(--nv-fast), color var(--nv-fast), border-color var(--nv-fast);
}
.faq--duo .faq__card:has(.faq__input:checked){
  background:var(--faq-c2, var(--nv-ink));
  color:var(--faq-c2-text, #ffffff);
  border-color:transparent;
}
.faq--duo .faq__label{color:inherit}
.faq--duo .faq__label:hover{color:inherit;opacity:.82}
.faq--duo .faq__input:checked+.faq__label{color:inherit}
.faq--duo .faq__body{color:inherit;opacity:.82}
.faq--duo .faq__label::before{background:rgba(127,127,127,.18)}
.faq--duo .faq__input:checked+.faq__label::before{background:rgba(127,127,127,.28)}
.faq--duo .faq__label::after{border-color:currentColor}
.faq--duo.faq--plus .faq__label::after{
  background:
    linear-gradient(currentColor,currentColor) center / 100% .2rem no-repeat,
    linear-gradient(currentColor,currentColor) center / .2rem 100% no-repeat;
}

/* ── FAQ: варіант з бічною панеллю (список питань + відповідь поруч) ── */
.faq-side{
  display:flex;
  gap:2.8rem;
  margin:3.6rem 0 4.4rem;
  align-items:flex-start;
}
.faq-side__list{
  display:flex;flex-direction:column;gap:1rem;
  flex:0 0 36%;
  min-width:0;
}
.faq-side__q{
  display:flex;align-items:center;justify-content:space-between;gap:1.2rem;
  width:100%;
  padding:1.6rem 1.8rem;
  border-radius:var(--nv-r-lg);
  border:.1rem solid var(--nv-line);
  background:var(--faq-side-inactive, var(--nv-surface));
  color:var(--faq-side-inactive-text, var(--nv-ink));
  font-size:1.6rem;font-weight:700;text-align:left;
  cursor:pointer;
  transition:background var(--nv-fast), color var(--nv-fast), border-color var(--nv-fast);
}
.faq-side__q-arrow{flex-shrink:0;font-size:1.4rem;line-height:1}
.faq-side__q--active{
  background:var(--faq-side-active, var(--nv-accent));
  color:var(--faq-side-active-text, #ffffff);
  border-color:transparent;
}
.faq-side__panels{
  flex:1 1 0;
  min-width:0;
  max-width:100%;
  position:relative;
  border-radius:var(--nv-r-lg);
  background:var(--faq-side-panel, var(--nv-faq-panel));
  color:var(--faq-side-panel-text, #ffffff);
  display:grid;
  grid-template-rows:0fr;
  opacity:0;
  transform:translateX(1.6rem);
  overflow:hidden;
  padding:0 3rem;
  transition:grid-template-rows var(--nv-slow), opacity var(--nv-slow), transform var(--nv-slow), padding var(--nv-slow), margin-top var(--nv-slow);
}
.faq-side__panels>*{overflow:hidden;min-height:0}
.faq-side__panels--open{
  grid-template-rows:1fr;
  opacity:1;
  transform:translateX(0);
  padding:2.8rem 3rem;
}
.faq-side__panel{display:none}
.faq-side__panel--active{display:block}
@keyframes nv-faq-side-in{
  from{opacity:0;transform:translateX(1rem)}
  to{opacity:1;transform:translateX(0)}
}
.faq-side__panel--active{animation:nv-faq-side-in .28s var(--nv-ease)}
.faq-side__panel-title{margin:0 0 1.2rem;font-size:2rem;font-weight:800}
.faq-side__panel-text{margin:0;font-size:1.6rem;line-height:1.7;opacity:.88}
.content .faq-side__panel-title{margin:0 0 1.2rem;padding-left:0;border-left:0;color:inherit}

/* ── Статистика: звичайний ряд цифр (без картки/фото) ───────────── */
.stats-row{display:flex;flex-wrap:wrap;margin:3.6rem 0 4.4rem;border:.1rem solid var(--nv-line);border-radius:var(--nv-r-lg);overflow:hidden;background:var(--nv-surface)}
.stats-row__item{flex:1 1 0;min-width:14rem;padding:2.4rem 2rem;text-align:center;border-right:.1rem solid var(--nv-line)}
.stats-row__item:last-child{border-right:0}
.stats-row__num{display:block;font-size:3.6rem;font-weight:800;color:var(--nv-accent);line-height:1.1}
.stats-row__label{display:block;margin-top:.6rem;font-size:1.4rem;color:var(--nv-muted)}
@media (max-width:699px){
  .stats-row{flex-direction:column}
  .stats-row__item{border-right:0;border-bottom:.1rem solid var(--nv-line)}
  .stats-row__item:last-child{border-bottom:0}
}

/* ── FAQ: звичайний список без розгортання ───────────────────────── */
.faq-plain{margin:3.6rem 0 4.4rem}
.faq-plain__item{position:relative;border-bottom:.1rem solid var(--nv-line)}
.faq-plain__item:last-child{border-bottom:0}
.faq-plain__input{position:absolute;opacity:0;width:0;height:0;pointer-events:none}
.faq-plain__q{
  display:flex;align-items:center;justify-content:space-between;gap:1.2rem;
  margin:0;padding:1.8rem 0;
  font-size:1.8rem;font-weight:800;color:var(--nv-ink);
  cursor:pointer;transition:color var(--nv-fast);
}
.faq-plain__q:hover{color:var(--nv-accent)}
.faq-plain__arrow{
  flex-shrink:0;width:1rem;height:1rem;margin-top:-.3rem;
  border-right:.2rem solid var(--nv-muted);border-bottom:.2rem solid var(--nv-muted);
  transform:rotate(45deg);
  transition:transform var(--nv-slow), border-color var(--nv-fast);
}
.faq-plain__input:checked+.faq-plain__q{color:var(--nv-accent)}
.faq-plain__input:checked+.faq-plain__q .faq-plain__arrow{transform:rotate(-135deg);border-color:var(--nv-accent)}
.faq-plain__body{
  display:grid;grid-template-rows:0fr;overflow:hidden;opacity:0;
  margin:0;font-size:1.6rem;line-height:1.72;color:var(--nv-muted);
  transition:grid-template-rows var(--nv-slow), opacity var(--nv-slow), padding var(--nv-slow);
}
.faq-plain__body>*{overflow:hidden;min-height:0}
.faq-plain__body p{margin:0 0 1.2rem}
.faq-plain__body p:last-child{margin-bottom:0}
.faq-plain__input:checked~.faq-plain__body{grid-template-rows:1fr;opacity:1;padding-bottom:1.8rem}
@media (max-width:767px){
  .faq-side{flex-direction:column}
  .faq-side__list{flex:none;width:100%}
}


@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
    scroll-behavior:auto !important;
  }
}

@media print{
  .header,.footer,.nv-top,.nv-progress{display:none !important}
  .wrapper{padding-top:0}
  .intro-home{background:none;color:#000;padding:0}
  .intro-home::before,.intro-home::after{display:none}
  .intro-home__title{color:#000;text-shadow:none}
  .intro-home__text{color:#333}
  .content{margin-top:0;padding:0}
  .content .container{padding-top:0}
  .table{box-shadow:none}
}


/* ─── Nova theme overrides: editable colour scheme ─── */
:root{
  --nv-accent:#000000;
  --nv-accent-soft:color-mix(in srgb, #000000 10%, transparent);
  --nv-accent-line:color-mix(in srgb, #000000 30%, transparent);
  --nv-accent-deep:color-mix(in srgb, #000000 76%, #000);
  --nv-bg:#f3f6f5;
  --nv-surface:#fdfcf9;
  --nv-hero:#1a1a1c;
  --nv-footer:#0d2b26;
  --nv-footer-sub:#d9a441;
  --nv-text:#1f2e2b;
  --nv-muted:#5c6b67;
  --nv-table:#fdfcf9;
  --nv-table-stripe:#edf2f1;
  --nv-h1:#ffffff;
  --nv-heading:#0f201d;
  --nv-max:1152px;
  --nv-logo-h:64px;
  --nv-footer-img-h:56px;
  /* header adapts to its own background so any logo stays legible */
  --nv-head-bg:#fdfcf9;
  --nv-head-fg:#101219;
  --nv-head-fg-2:#5f6673;
  --nv-head-line:rgba(16,18,25,.10);
  --nv-head-soft:rgba(16,18,25,.035);
  --nv-topbar-h:3.8rem;
  --nv-topbar-bg:#100a0a;
  --nv-topbar-fg:#ffffff;
  --nv-bullet:#d9a441;
  --nv-bullet-soft:color-mix(in srgb, #d9a441 30%, transparent);
  --nv-rank-num:#d9a441;
  --nv-rank-num-soft:color-mix(in srgb, #d9a441 16%, transparent);
}
body{background:var(--nv-bg);color:var(--nv-text)}
a{color:var(--nv-accent)}
.container{max-width:var(--nv-max)}
.logo__img{max-height:var(--nv-logo-h)}
.footer__info-imgs img{max-height:var(--nv-footer-img-h)}
.intro-home__title{color:var(--nv-h1)}
.footer__subtitle{color:var(--nv-footer-sub)}

/* ─── Dark theme (site-wide, see "Тема сайту" + "Кольори темної теми"
   in Унікалізація) ─── Independently recolourable, same as the light
   palette above — each field here has its own admin colour picker
   (bgColorDark, surfaceColorDark, etc.), defaulting to the original
   hand-picked dark palette so an untouched site looks identical.
   Accent / hero / footer / H1 / footer-subtitle stay whatever the admin
   already chose — those are brand colours and the hero/footer band is
   already dark-toned by default in both themes, so nothing there needs
   a theme-specific override. Scoped to html[data-theme="dark"] — same
   element as :root, so plain higher selector-specificity (0,1,1 vs
   :root's 0,1,0) wins regardless of source order; the attribute is only
   ever present when the admin picked "Тільки темна" (baked at export)
   or the visitor toggled it on in "Перемикач" mode (see
   novaInlineScript's .theme-toggle handler). */
html[data-theme="dark"]{
  --nv-bg:#0b1320;
  --nv-surface:#15202e;
  --nv-ink:#f2f5f4;
  --nv-heading:#f2f5f4;
  --nv-text:#d7ddda;
  --nv-muted:#93a19c;
  --nv-table:#15202e;
  --nv-table-stripe:#1d2a3a;
  --nv-line:rgba(255,255,255,.09);
  --nv-line-2:rgba(255,255,255,.16);
  --nv-head-bg:#15202e;
  --nv-head-fg:#ffffff;
  --nv-head-fg-2:rgba(255,255,255,.72);
  --nv-head-line:rgba(255,255,255,.12);
  --nv-head-soft:rgba(255,255,255,.06);
  /* Links/CTAs use --nv-accent directly (a{color:var(--nv-accent)}), and
     the light-theme accent is tuned for contrast against a light surface —
     on a near-black dark background the same hex can read as barely
     legible. Lighten it here so link text stays readable in dark mode,
     and recompute the soft/line/deep variants from that lightened value
     (not the raw light accent) so glows/borders stay in the same family. */
  --nv-accent: color-mix(in srgb, #000000 55%, white);
  --nv-accent-soft: color-mix(in srgb, var(--nv-accent) 10%, transparent);
  --nv-accent-line: color-mix(in srgb, var(--nv-accent) 30%, transparent);
  --nv-accent-deep: color-mix(in srgb, var(--nv-accent) 76%, #000);
}

/* ─── Theme toggle button (only emitted when mode = "Перемикач") ─── */
.theme-toggle{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  width:4.2rem;height:4.2rem;
  padding:0;
  border:.1rem solid var(--nv-head-line);
  border-radius:var(--nv-r-pill);
  background:var(--nv-head-soft);
  color:var(--nv-head-fg);
  cursor:pointer;
  transition:border-color var(--nv-fast), background var(--nv-fast);
}
.theme-toggle:hover{background:var(--nv-head-line)}
.theme-toggle__icon{display:block;font-size:1.7rem;line-height:1;pointer-events:none}
.theme-toggle__icon--moon{display:none}
html[data-theme="dark"] .theme-toggle__icon--sun{display:none}
html[data-theme="dark"] .theme-toggle__icon--moon{display:block}

/* ─── Topbar ("чёлка", off by default — see buildTopbarHtml()) ───
   A thin bar above <header> carrying the header's own nav links plus the
   theme toggle, so both stay reachable even on hero types that hide the
   whole <header> (see the .nv-no-header exception above — the topbar is
   a sibling of <header>, not inside it, so it's unaffected by that rule
   and always renders when switched on). Colour/height are admin-picked
   (topbarColor / topbarSize), everything else follows the site's tokens. */
.nv-topbar{
  position:fixed;
  top:0;left:0;right:0;
  z-index:90;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:2rem;
  height:var(--nv-topbar-h);
  padding:0 2.4rem;
  background:var(--nv-topbar-bg);
  color:var(--nv-topbar-fg);
}
.nv-topbar__nav{
  display:flex;
  align-items:center;
  gap:1.8rem;
  list-style:none;
  margin:0;padding:0;
  overflow-x:auto;
  flex:1 1 auto;
  justify-content:flex-end;
}
.nv-topbar__nav a{
  color:inherit;
  opacity:.82;
  font-size:1.3rem;
  font-weight:600;
  text-decoration:none;
  white-space:nowrap;
  transition:opacity var(--nv-fast);
}
.nv-topbar__nav a:hover{opacity:1}
.nv-topbar .theme-toggle{
  flex-shrink:0;
  width:2.8rem;height:2.8rem;
  border-color:color-mix(in srgb, var(--nv-topbar-fg) 25%, transparent);
  background:color-mix(in srgb, var(--nv-topbar-fg) 10%, transparent);
  color:var(--nv-topbar-fg);
}
.nv-topbar .theme-toggle:hover{background:color-mix(in srgb, var(--nv-topbar-fg) 20%, transparent)}
.nv-topbar .theme-toggle__icon{font-size:1.3rem}
/* <header> and the content wrapper shift down by the topbar's own height
   only when it's actually present — body.nv-topbar-on is only added in
   buildPageShell() when buildTopbarHtml() returned something. The second,
   more specific rule covers hero types that also hide <header> entirely
   (.nv-no-header): there, content must still clear the topbar even though
   it no longer needs to clear a (now invisible) header band too. */
body.nv-topbar-on .header{top:var(--nv-topbar-h)}
body.nv-topbar-on .wrapper{padding-top:calc(var(--nv-head-h) + var(--nv-topbar-h))}
body.nv-topbar-on.nv-no-header .wrapper{padding-top:var(--nv-topbar-h)}
@media (max-width:699px){
  .nv-topbar{padding:0 1.6rem;gap:1.2rem}
  .nv-topbar__nav{gap:1.2rem}
  .nv-topbar__nav a{font-size:1.2rem}
}

/* ─── Font override ─── */
body, html { font-family: 'Playfair Display', serif !important; }

.demo-slot-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(38rem,1fr));gap:3rem;margin:2.8rem 0 3.6rem;align-items:start}
.demo-game{background:var(--nv-surface);border:1px solid var(--nv-line);border-radius:var(--nv-r-lg);padding:2.4rem 2.4rem 2.6rem;box-shadow:var(--nv-sh-2);border-top:5px solid var(--demo-accent,var(--nv-accent));display:flex;flex-direction:column;gap:1.7rem}
.demo-game__head{display:flex;align-items:center;gap:1.2rem}
.demo-game__logo{width:5rem;height:5rem;border-radius:1rem;object-fit:cover;flex:none;box-shadow:0 0 0 2px var(--nv-surface),0 0 0 3px var(--demo-accent,var(--nv-accent))}
.demo-game__name{font-size:2.2rem;margin:0;color:var(--nv-heading);line-height:1.25;font-weight:700}
.demo-game__type{display:block;font-size:1.2rem;color:var(--demo-accent,var(--nv-accent));text-transform:uppercase;letter-spacing:.05em;font-weight:700;margin-top:.2rem}

.demo-game__screen{position:relative;border-radius:1.4rem;padding:2.4rem 2rem;overflow:hidden;min-height:23rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.1rem;background:radial-gradient(120% 140% at 50% -10%, color-mix(in srgb, var(--demo-accent,var(--nv-accent)) 38%, #0b0d14) 0%, #0b0d14 62%);box-shadow:inset 0 0 0 1px rgba(255,255,255,.07), inset 0 2rem 4rem rgba(0,0,0,.55)}
.demo-game__screen::before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,255,255,.09),transparent 42%);pointer-events:none}
.demo-game__banner{position:absolute;inset:auto 0 0 0;text-align:center;padding:1.1rem .8rem;font-weight:800;font-size:1.7rem;color:#fff;background:linear-gradient(0deg, rgba(0,0,0,.8), transparent);opacity:0;transform:translateY(8px);transition:opacity .25s, transform .25s;pointer-events:none;z-index:4}
.demo-game__banner.is-show{opacity:1;transform:translateY(0)}
.demo-game__banner.demo-game__banner--win{background:linear-gradient(0deg, rgba(34,179,86,.92), rgba(34,179,86,.25) 75%, transparent)}
.demo-game__banner.demo-game__banner--lose{background:linear-gradient(0deg, rgba(209,69,59,.88), rgba(209,69,59,.2) 75%, transparent)}

.demo-game__bets-label{font-size:1.1rem;color:var(--nv-muted);text-transform:uppercase;letter-spacing:.04em;font-weight:700;margin:0 0 -.6rem}
.demo-game__legend{font-size:1.15rem;color:var(--nv-muted);margin:0;text-align:center;line-height:1.5}
.demo-game__legend strong{color:var(--nv-heading)}

.demo-game__bar{display:flex;align-items:center;justify-content:space-between;gap:1.2rem}
.demo-game__stat{text-align:center;flex:1;min-width:0}
.demo-game__stat label{display:block;font-size:1.05rem;color:var(--nv-muted);text-transform:uppercase;letter-spacing:.04em}
.demo-game__stat span{display:block;font-size:2rem;font-weight:700;color:var(--nv-heading);font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.demo-game__spin{flex:none;width:8.2rem;height:8.2rem;border-radius:50%;border:0;background:linear-gradient(145deg,var(--demo-accent,var(--nv-accent)),color-mix(in srgb,var(--demo-accent,var(--nv-accent)) 65%,#000));color:#fff;font-weight:800;font-size:1.5rem;cursor:pointer;box-shadow:0 .8rem 1.8rem color-mix(in srgb,var(--demo-accent,var(--nv-accent)) 55%,transparent);transition:transform .1s}
.demo-game__spin:disabled{opacity:.5;cursor:default;box-shadow:none}
.demo-game__spin:active:not(:disabled){transform:scale(.94)}

.demo-game__bets{display:flex;gap:.8rem}
.demo-game__bets button{flex:1;padding:1rem 0;border:1px solid var(--nv-line);border-radius:.8rem;background:transparent;color:var(--nv-text);font-weight:600;cursor:pointer;font-size:1.5rem}
.demo-game__bets button.is-active{background:var(--demo-accent,var(--nv-accent));border-color:var(--demo-accent,var(--nv-accent));color:#fff}

.demo-game__foot{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;font-size:1.3rem;color:var(--nv-muted)}
.demo-game__foot button{border:1px solid var(--nv-line);border-radius:.8rem;background:transparent;color:var(--nv-text);padding:.6rem 1.2rem;font-weight:600;cursor:pointer;font-size:1.3rem}
.demo-game__note{font-size:1.1rem;color:var(--nv-muted);margin:0;text-align:center}

/* ── slot reels ──────────────────────────────────────── */
.demo-slotreel{display:flex;gap:.9rem;background:#000;border-radius:1.1rem;padding:1.4rem;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08), 0 .6rem 1.4rem rgba(0,0,0,.4);position:relative}
.demo-slotreel__col{position:relative;width:7.6rem;height:9.6rem;overflow:hidden;border-radius:.8rem;background:linear-gradient(180deg,#05060a,#13151f)}
.demo-slotreel__col::before,.demo-slotreel__col::after{content:"";position:absolute;left:0;right:0;height:2.2rem;z-index:2;pointer-events:none}
.demo-slotreel__col::before{top:0;background:linear-gradient(180deg,#000,transparent)}
.demo-slotreel__col::after{bottom:0;background:linear-gradient(0deg,#000,transparent)}
.demo-slotreel__strip{position:absolute;left:0;right:0;top:0;will-change:transform}
.demo-slotreel__item{height:9.6rem;display:flex;align-items:center;justify-content:center;font-size:4.6rem;line-height:1}
.demo-slotreel__item.is-blur{filter:blur(.2rem)}
.demo-slotreel__payline{position:absolute;left:1.2rem;right:1.2rem;top:50%;height:3px;background:color-mix(in srgb,var(--demo-accent,var(--nv-accent)) 75%,#fff);box-shadow:0 0 1rem color-mix(in srgb,var(--demo-accent,var(--nv-accent)) 80%,#fff);pointer-events:none;z-index:3;opacity:0;transform:scaleX(.4);transform-origin:center;transition:opacity .3s,transform .3s}
.demo-slotreel__payline.is-show{opacity:1;transform:scaleX(1);animation:demoPaylinePulse 1.1s ease-in-out infinite}
@keyframes demoPaylinePulse{0%,100%{box-shadow:0 0 1rem color-mix(in srgb,var(--demo-accent,var(--nv-accent)) 80%,#fff)}50%{box-shadow:0 0 2rem color-mix(in srgb,var(--demo-accent,var(--nv-accent)) 95%,#fff)}}
.demo-slot-cab__jackpot{font-size:1.3rem;letter-spacing:.04em;text-transform:uppercase;color:var(--nv-gold,#f5c451);font-weight:800;text-shadow:0 0 1rem rgba(245,196,81,.55)}

/* ── roulette ────────────────────────────────────────── */
.demo-roulette__wheel-wrap{position:relative;width:20rem;height:20rem}
.demo-roulette__wheel{width:100%;height:100%;border-radius:50%;box-shadow:0 0 0 .4rem #0b0d14,0 0 0 .5rem rgba(255,255,255,.14),0 1rem 2rem rgba(0,0,0,.55);transition:transform 3.2s cubic-bezier(.12,.72,.14,1)}
.demo-roulette__hub{position:absolute;left:50%;top:50%;width:4.2rem;height:4.2rem;border-radius:50%;background:radial-gradient(circle at 35% 30%,#eee,#8a8a8a 60%,#444);transform:translate(-50%,-50%);box-shadow:0 .2rem .6rem rgba(0,0,0,.6)}
.demo-roulette__pointer{position:absolute;left:50%;top:-.6rem;width:0;height:0;border-left:1rem solid transparent;border-right:1rem solid transparent;border-top:1.5rem solid #fff;transform:translateX(-50%);filter:drop-shadow(0 .2rem .3rem rgba(0,0,0,.5));z-index:3}
.demo-roulette__result{font-size:1.7rem;font-weight:800;color:#fff;min-height:2.4rem}
.demo-roulette__result-dot{display:inline-block;width:1.2rem;height:1.2rem;border-radius:50%;margin-right:.5rem;vertical-align:middle}
.demo-game__bets--color{display:flex;gap:.8rem}
.demo-roulette__chip{flex:1;padding:1rem 0;border-radius:.8rem;border:1px solid transparent;font-weight:700;cursor:pointer;font-size:1.5rem}
.demo-roulette__chip--red{background:#c0273a;color:#fff}
.demo-roulette__chip--black{background:#1b1d22;color:#fff}
.demo-roulette__chip--green{background:#1f8a4c;color:#fff}
.demo-roulette__chip.is-active{outline:3px solid #fff;outline-offset:-4px}

/* ── crash ───────────────────────────────────────────── */
.demo-crash__chart{width:100%;height:18rem;display:block}
.demo-crash__chart polyline{fill:none;stroke:var(--demo-accent,var(--nv-accent));stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.demo-crash__mult{position:absolute;top:1.8rem;left:50%;transform:translateX(-50%);font-size:3.6rem;font-weight:800;color:#fff;text-shadow:0 0 1.2rem color-mix(in srgb,var(--demo-accent,var(--nv-accent)) 80%,#fff);z-index:3}
.demo-crash__mult.is-crashed{color:#ff4d5e;text-shadow:0 0 1.2rem rgba(255,77,94,.7)}
.demo-crash__hint{font-size:1.1rem;color:var(--nv-muted);margin:0;text-align:center}

@media (max-width:640px){
  .demo-game{padding:1.8rem 1.6rem 2rem}
  .demo-game__screen{min-height:19rem;padding:1.8rem 1.2rem}
  .demo-slotreel__col{width:6rem;height:7.6rem}
  .demo-slotreel__item{height:7.6rem;font-size:3.6rem}
  .demo-game__spin{width:7rem;height:7rem;font-size:1.3rem}
  .demo-roulette__wheel-wrap{width:16rem;height:16rem}
}

.intro-home--classic{overflow:hidden}
.intro-home__carbon-bg{position:absolute;inset:0;z-index:0;pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.07) 1px, transparent 1px);
  background-size:4.8rem 4.8rem;
  -webkit-mask-image:radial-gradient(ellipse 70% 70% at 50% 45%, #000 0%, transparent 85%);
  mask-image:radial-gradient(ellipse 70% 70% at 50% 45%, #000 0%, transparent 85%);
}
.intro-home__marquee-field{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.intro-home__marquee-lane{position:absolute;left:0;right:0;white-space:nowrap;overflow:hidden}
.intro-home__marquee-track{display:inline-flex;gap:5.6rem;animation-name:nvMarqueeL;animation-timing-function:linear;animation-iteration-count:infinite;will-change:transform}
.intro-home__marquee-lane--rev .intro-home__marquee-track{animation-name:nvMarqueeR}
.intro-home__marquee-item{display:inline-flex;align-items:center;gap:.8rem;font-size:1.7rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#ff8a3d;text-shadow:0 0 1.2rem rgba(255,138,61,.55),0 0 .3rem rgba(255,138,61,.4);opacity:.4}
.intro-home__marquee-item span{font-size:2rem}
@keyframes nvMarqueeL{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes nvMarqueeR{from{transform:translateX(-50%)}to{transform:translateX(0)}}
.intro-home--classic .container{position:relative;z-index:1}
@media (prefers-reduced-motion: reduce){
  .intro-home__marquee-track{animation:none}
}