:root {
  --gold: #ffb80c;
  --dark: #1e1e1e;
  --btn-primary: #3e3e3e;
  --btn-secondary: #d0d0d0;
  --text-light: #f0f0f0;
  --text-muted: #b0b0b0;
  --card: #2a2a2a;
}
* {
  box-sizing: border-box;
}
body {
  margin: 0;
  background: var(--dark);
  color: var(--text-light);
  font:
    16px Roboto,
    Arial,
    sans-serif;
  line-height: 1.6;
}
a {
  color: inherit;
}
h1,
h2,
h3 {
  line-height: 1.2;
}
h1 {
  font-size: clamp(2rem, 5vw, 3.5rem);
}
h2 {
  color: var(--gold);
  margin-top: 2rem;
}
.site-header {
  position: sticky;
  top: 0;
  z-index: 9;
  background: var(--gold);
  color: #1e1e1e;
}
.header-in {
  max-width: 1280px;
  margin: auto;
  min-height: 74px;
  padding: 8px 18px;
  display: flex;
  align-items: center;
  gap: 12px;
}
.brand {
  display: flex;
  align-items: center;
  gap: 7px;
  text-decoration: none;
  white-space: nowrap;
}
.brand img {
  width: 52px;
  height: 40px;
  object-fit: cover;
  border-radius: 5px;
}
.main-nav {
  display: flex;
  gap: 12px;
  flex: 1;
}
.main-nav a {
  text-decoration: none;
  font-weight: 700;
}
.review-badge {
  font-size: 0.75rem;
  font-weight: 700;
}
.header-actions {
  display: flex;
  gap: 6px;
  align-items: center;
}
.btn,
.login,
.register {
  border: 0;
  border-radius: 7px;
  padding: 9px 13px;
  text-decoration: none;
  display: inline-block;
  font-weight: 700;
  cursor: pointer;
}
.dark,
.register {
  background: var(--btn-primary);
  color: #fff;
}
.light,
.login {
  background: var(--btn-secondary);
  color: #222;
}
.gold {
  background: var(--gold);
  color: #222;
}
.burger {
  display: none;
  background: none;
  border: 0;
}
.hero {
  background:
    linear-gradient(#000a, #000c),
    url("/faban.jpg") center/cover;
}
.hero-in,
.container,
.info-page {
  max-width: 1200px;
  margin: auto;
  padding: 48px 20px;
}
.hero p {
  max-width: 720px;
  font-size: 1.15rem;
}
.eyebrow {
  color: var(--gold);
  font-weight: bold;
  letter-spacing: 0.1em;
}
.hero table {
  margin-top: 24px;
  max-width: 740px;
}
.rating,
.stars {
  color: var(--gold);
  margin-top: 20px;
}
table {
  border-collapse: collapse;
  background: #242424;
  margin: 15px auto;
  width: 100%;
}
td,
th {
  border: 1px solid #666;
  padding: 10px;
  text-align: left;
}
th {
  background: #353535;
}
.notice,
.reward {
  background: #40310b;
  border-left: 4px solid var(--gold);
  padding: 15px;
  border-radius: 7px;
}
.bonus-grid,
.review-grid {
  display: grid;
  gap: 18px;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
}
.card,
.review-card {
  background: var(--card);
  border-radius: 12px;
  padding: 20px;
  border: 1px solid #444;
}
.card .btn {
  margin-top: 14px;
}
.reward {
  margin: 30px 0;
  font-size: 1.15rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}
.filters button,
.text-btn,
.review-actions button,
.faq-item button {
  background: #353535;
  color: #fff;
  border: 1px solid #666;
  padding: 8px;
  border-radius: 5px;
  cursor: pointer;
}
.review-head {
  display: flex;
  gap: 10px;
  align-items: center;
}
.review-head img {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  object-fit: cover;
}
.review-head small,
.proscons span {
  display: block;
  color: var(--text-muted);
}
.review-head .stars {
  margin-left: auto;
}
.review-body {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.review-card.expanded .review-body {
  -webkit-line-clamp: unset;
}
.rating-details,
.reply-form {
  display: none;
}
.review-card.ratings .rating-details,
.reply-form.open {
  display: block;
}
.proscons {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.pro {
  color: #91db85 !important;
}
.con {
  color: #ff9b9b !important;
}
.media-slot {
  margin: 15px 0;
  padding: 15px;
  background: #202020;
  color: #aaa;
  border-radius: 6px;
  font-size: 0.85rem;
}
.review-actions {
  display: flex;
  gap: 7px;
}
.reply-form label {
  display: block;
}
.reply-form textarea,
form input,
form textarea {
  display: block;
  width: 100%;
  margin: 5px 0 12px;
  padding: 10px;
  border-radius: 5px;
  border: 1px solid #777;
  background: #161616;
  color: #fff;
}
.faq-item {
  border-bottom: 1px solid #555;
}
.faq-item button {
  width: 100%;
  text-align: left;
  background: none;
  border: 0;
  font-size: 1rem;
}
.faq-item p {
  display: none;
  color: var(--text-muted);
}
.faq-item.open p {
  display: block;
}
.table-wrap {
  overflow: auto;
}
.slider {
  display: flex;
  overflow: hidden;
  gap: 15px;
}
.slider img {
  min-width: 78%;
  border-radius: 10px;
}
.entry-content {
  margin-top: 28px;
}
.info-page {
  min-height: 60vh;
  max-width: 850px;
}
form {
  max-width: 650px;
  padding: 20px;
  background: var(--card);
  border-radius: 10px;
}
footer {
  background: #151515;
  border-top: 5px solid var(--gold);
  padding: 40px 20px;
  color: #ddd;
}
.foot-grid {
  max-width: 1200px;
  margin: auto;
  display: grid;
  grid-template-columns: 2fr 1fr 2fr;
  gap: 30px;
}
.foot-grid a:not(.brand) {
  display: block;
  margin: 5px 0;
}
.badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.badges b,
.license {
  background: #333;
  border: 1px solid #777;
  padding: 4px 7px;
  border-radius: 4px;
  font-size: 0.75rem;
}
.social,
.legal,
.trust {
  max-width: 1200px;
  margin: 22px auto 0;
}
.legal {
  font-size: 0.85rem;
  color: #aaa;
}
.xf7k2 {
  letter-spacing: 0.02em;
}
.b9q3m {
  display: none;
}
.wp-block-paragraph,
.entry-content {
  max-width: 900px;
}
.site-header.is-scrolled {
  box-shadow: 0 3px 16px #0008;
}
@media (max-width: 1024px) {
  .main-nav {
    position: absolute;
    top: 74px;
    left: 0;
    right: 0;
    background: var(--gold);
    display: none;
    padding: 15px;
    flex-direction: column;
  }
  .main-nav.open {
    display: flex;
  }
  .burger {
    display: block;
    order: 1;
  }
  .main-nav {
    order: 2;
  }
  .review-badge {
    display: none;
  }
  .header-actions {
    margin-left: auto;
  }
  .header-actions .btn {
    display: none;
  }
}
@media (max-width: 768px) {
  .header-in {
    gap: 6px;
    padding: 7px;
  }
  .brand b {
    display: none;
  }
  .header-actions {
    gap: 3px;
  }
  .login,
  .register {
    padding: 7px 8px;
    font-size: 0.75rem;
  }
  .burger i {
    display: block;
    width: 20px;
    height: 2px;
    margin: 4px;
    background: #222;
  }
  .foot-grid {
    grid-template-columns: 1fr;
  }
  .reward {
    align-items: flex-start;
    flex-direction: column;
  }
  .hero-in,
  .container {
    padding: 34px 16px;
  }
}
@media (min-width: 1200px) {
  .hero-in {
    padding-top: 80px;
    padding-bottom: 80px;
  }
}


:root {
  --gold: #ffb80c;
  --dark: #101214;
  --dark-2: #171a1d;
  --panel: #1d2125;
  --panel-2: #24292e;
  --line: rgba(255,255,255,.11);
  --text-light: #f5f7f8;
  --text-muted: #aeb7bf;
  --card: #1d2125;
}

html,
body {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
}

body {
  background: #101214 !important;
  color: var(--text-light) !important;
}

.site-header {
  background: #15191d !important;
  color: #fff !important;
  border-bottom: 1px solid var(--line) !important;
  box-shadow: 0 5px 24px rgba(0,0,0,.25) !important;
}

.header-in {
  max-width: 1280px !important;
  min-height: 76px !important;
  padding: 10px 18px !important;
  flex-wrap: nowrap !important;
}

.brand {
  flex: 0 0 auto !important;
  overflow: visible !important;
}

.brand img {
  display: block !important;
  width: 172px !important;
  max-width: 172px !important;
  height: 54px !important;
  object-fit: contain !important;
  object-position: left center !important;
  border-radius: 0 !important;
  filter: brightness(0) invert(1) !important;
}

.main-nav a {
  color: #eef2f4 !important;
  padding: 9px 10px !important;
  border-radius: 8px !important;
}

.main-nav a:hover {
  background: rgba(255,255,255,.07) !important;
  color: #fff !important;
}

.review-badge {
  color: #cfd6db !important;
}

.header-actions .dark,
.header-actions .register {
  background: #2b3035 !important;
  color: #fff !important;
}

.header-actions .light,
.header-actions .login {
  background: #f2f4f5 !important;
  color: #17191b !important;
}

.hero {
  min-height: 560px !important;
  display: flex !important;
  align-items: center !important;
  background:
    linear-gradient(90deg, rgba(10,12,14,.94) 0%, rgba(10,12,14,.78) 48%, rgba(10,12,14,.56) 100%),
    url("/faban.jpg") center/cover no-repeat !important;
}

.hero-in {
  width: 100% !important;
  max-width: 1200px !important;
}

.hero h1 {
  max-width: 850px !important;
  color: #fff !important;
  margin: 8px 0 18px !important;
}

.hero p {
  color: #d1d7dc !important;
}

.hero table {
  width: min(760px, 100%) !important;
  margin: 28px 0 0 !important;
  background: rgba(20,23,26,.88) !important;
  border-radius: 12px !important;
  overflow: hidden !important;
}

.hero td,
.hero th {
  border-color: rgba(255,255,255,.11) !important;
}

.container {
  width: min(1200px, 100%) !important;
}

.container > h2,
.faq > h2 {
  margin-top: 0 !important;
  margin-bottom: 20px !important;
}

.bonus-grid,
.review-grid {
  grid-template-columns: repeat(2, minmax(0,1fr)) !important;
}

.card,
.review-card,
.faq,
.content-panel,
.info-shell {
  background: var(--panel) !important;
  border: 1px solid var(--line) !important;
  border-radius: 16px !important;
  box-shadow: 0 14px 34px rgba(0,0,0,.22) !important;
}

.card,
.review-card {
  padding: 22px !important;
}

.card h3,
.review-card h3 {
  color: #fff !important;
}

.card p,
.review-card p,
.review-body,
.review-head small {
  color: #c8d0d6 !important;
}

.notice,
.reward {
  background: linear-gradient(135deg, rgba(255,184,12,.14), rgba(255,184,12,.06)) !important;
  border: 1px solid rgba(255,184,12,.28) !important;
  border-left: 4px solid var(--gold) !important;
}

.filters {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin-bottom: 18px !important;
}

.filters button {
  min-width: 52px !important;
  background: #22272b !important;
  border-color: var(--line) !important;
}

.faq {
  padding: 26px !important;
  margin-top: 35px !important;
  margin-bottom: 35px !important;
}

.faq-item {
  border: 1px solid var(--line) !important;
  border-radius: 10px !important;
  margin-bottom: 10px !important;
  overflow: hidden !important;
  background: #171b1e !important;
}

.faq-item button {
  padding: 14px 16px !important;
  color: #fff !important;
  font-weight: 700 !important;
}

.faq-item p {
  padding: 0 16px 15px !important;
  margin: 0 !important;
}

.table-wrap {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch !important;
  border: 1px solid var(--line) !important;
  border-radius: 12px !important;
}

.table-wrap table {
  margin: 0 !important;
  min-width: 720px !important;
}

.screenshots-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0,1fr)) !important;
  gap: 16px !important;
  width: 100% !important;
  margin: 18px 0 34px !important;
}

.screenshot-card {
  margin: 0 !important;
  min-width: 0 !important;
  aspect-ratio: 16 / 10 !important;
  overflow: hidden !important;
  border: 1px solid var(--line) !important;
  border-radius: 14px !important;
  background: #15181b !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.25) !important;
}

.screenshot-card img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

.content-panel {
  max-width: none !important;
  margin: 30px 0 0 !important;
  padding: 30px 32px !important;
  overflow: hidden !important;
}

.content-panel > :first-child {
  margin-top: 0 !important;
}

.content-panel > :last-child {
  margin-bottom: 0 !important;
}

.content-panel h2,
.content-panel h3,
.content-panel h4 {
  color: #fff !important;
}

.content-panel p,
.content-panel li,
.content-panel td {
  color: #cbd2d8 !important;
}

.content-panel a {
  color: #ffc94a !important;
}

.content-panel table {
  width: 100% !important;
  border-collapse: collapse !important;
}

.content-panel th {
  background: #2a3035 !important;
  color: #fff !important;
}

.content-panel td {
  background: #191d20 !important;
}

.info-page {
  max-width: none !important;
  min-height: 60vh !important;
  padding: 40px 20px !important;
  background: #101214 !important;
}

.info-shell {
  width: min(920px, 100%) !important;
  margin: 0 auto !important;
  padding: 34px 38px !important;
}

.info-shell > h1 {
  margin: 0 0 24px !important;
  color: #fff !important;
}

.info-content h2,
.info-content h3,
.info-content h4 {
  color: #fff !important;
}

.info-content p,
.info-content li,
.info-content td {
  color: #cbd2d8 !important;
}

.info-content a {
  color: #ffc94a !important;
}

.info-content table {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
}

.info-content th,
.info-content td {
  min-width: 130px !important;
}

form {
  width: 100% !important;
  max-width: 700px !important;
  background: #171b1e !important;
  border: 1px solid var(--line) !important;
  border-radius: 12px !important;
}

footer {
  background: #0c0f11 !important;
  border-top: 1px solid var(--line) !important;
  padding: 42px 20px !important;
}

footer .brand img {
  width: 190px !important;
  max-width: 190px !important;
  height: 60px !important;
  filter: brightness(0) invert(1) !important;
}

.badges b,
.license {
  background: #1b2024 !important;
  border-color: #343b41 !important;
}

@media (max-width: 1024px) {
  .main-nav {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    height: 100dvh !important;
    background: #15191d !important;
    padding: 90px 18px 28px !important;
    z-index: 1000 !important;
    flex-direction: column !important;
    gap: 8px !important;
    overflow-y: auto !important;
  }

  .main-nav.open {
    display: flex !important;
  }

  .main-nav a {
    width: 100% !important;
    padding: 13px 14px !important;
    background: rgba(255,255,255,.05) !important;
    border: 1px solid rgba(255,255,255,.08) !important;
  }

  .burger {
    position: relative !important;
    z-index: 1002 !important;
  }
}

@media (max-width: 768px) {
  .header-in {
    min-height: 68px !important;
    padding: 7px 12px !important;
    flex-wrap: nowrap !important;
  }

  .brand img {
    width: 132px !important;
    max-width: 132px !important;
    height: 44px !important;
  }

  .header-actions {
    margin-left: auto !important;
  }

  .login,
  .register {
    padding: 7px 8px !important;
    font-size: .72rem !important;
  }

  .hero {
    min-height: 0 !important;
    height: auto !important;
  }

  .hero-in,
  .container {
    width: 100% !important;
    max-width: 100% !important;
    padding: 28px 14px !important;
  }

  .hero h1 {
    font-size: clamp(1.85rem, 9vw, 2.5rem) !important;
    line-height: 1.08 !important;
  }

  .hero p {
    font-size: .96rem !important;
  }

  .hero table {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }

  .bonus-grid,
  .review-grid,
  .foot-grid {
    grid-template-columns: minmax(0,1fr) !important;
  }

  .reward {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  .reward .btn {
    width: 100% !important;
    text-align: center !important;
  }

  .faq,
  .content-panel {
    padding: 22px 16px !important;
  }

  .screenshots-grid {
    grid-template-columns: minmax(0,1fr) !important;
    gap: 12px !important;
  }

  .content-panel table {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }

  .info-page {
    padding: 26px 14px !important;
  }

  .info-shell {
    padding: 24px 18px !important;
  }

  footer .brand img {
    width: 170px !important;
    max-width: 170px !important;
    height: 56px !important;
  }
}

@media (max-width: 430px) {
  .brand img {
    width: 112px !important;
    max-width: 112px !important;
    height: 40px !important;
  }

  .login {
    display: none !important;
  }

  .register {
    font-size: .68rem !important;
    padding: 6px 7px !important;
  }

  .hero-in,
  .container {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
}


/* FINAL LIGHT PAGE / YELLOW HEADER / DARK CARDS THEME */

:root {
  --gold: #ffb80c;
  --dark: #ffffff;
  --panel: #1d2125;
  --panel-2: #24292e;
  --line: rgba(255,255,255,.12);
  --page-text: #171a1d;
  --card: #1d2125;
  --text-light: #f5f7f8;
  --text-muted: #aeb7bf;
}

html,
body {
  background: #ffffff !important;
  color: var(--page-text) !important;
}

body > main {
  background: #ffffff !important;
}

.site-header {
  background: var(--gold) !important;
  color: #171717 !important;
  border-bottom: 1px solid #e3a100 !important;
  box-shadow: 0 3px 16px rgba(0,0,0,.16) !important;
}

.site-header .brand img {
  filter: brightness(0) saturate(100%) !important;
}

.site-header .main-nav a {
  color: #171717 !important;
}

.site-header .main-nav a:hover {
  background: rgba(0,0,0,.09) !important;
  color: #000 !important;
}

.site-header .review-badge {
  color: #29220d !important;
}

.site-header .burger i {
  background: #171717 !important;
}

.site-header .header-actions .dark,
.site-header .header-actions .register {
  background: #242424 !important;
  color: #fff !important;
}

.site-header .header-actions .light,
.site-header .header-actions .login {
  background: #fff !important;
  color: #171717 !important;
}

.container > h2,
.container > h3 {
  color: #171a1d !important;
}

.hero {
  color: #fff !important;
}

.hero h1,
.hero h2,
.hero h3 {
  color: #fff !important;
}

.hero .eyebrow,
.hero .rating {
  color: var(--gold) !important;
}

.card,
.review-card,
.faq,
.content-panel,
.info-shell,
form {
  background: #1d2125 !important;
  color: #f5f7f8 !important;
  border: 1px solid #343b41 !important;
}

.card h2,
.card h3,
.review-card h2,
.review-card h3,
.faq h2,
.content-panel h2,
.content-panel h3,
.info-shell h1,
.info-shell h2,
.info-shell h3 {
  color: #fff !important;
}

.card p,
.card li,
.review-card p,
.review-card li,
.content-panel p,
.content-panel li,
.info-content p,
.info-content li {
  color: #cbd2d8 !important;
}

.review-grid {
  align-items: stretch !important;
}

.review-card {
  min-width: 0 !important;
  padding: 22px !important;
  overflow: hidden !important;
}

.review-head {
  display: grid !important;
  grid-template-columns: 48px minmax(0,1fr) auto !important;
  align-items: center !important;
  gap: 12px !important;
}

.review-head img {
  display: block !important;
  width: 48px !important;
  height: 48px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  background: #2b3136 !important;
  border: 2px solid #495159 !important;
}

.review-author-meta {
  min-width: 0 !important;
}

.review-author-meta b {
  display: block !important;
  color: #fff !important;
  font-size: 1rem !important;
  overflow-wrap: anywhere !important;
}

.review-author-meta small {
  display: block !important;
  margin-top: 2px !important;
  color: #aeb7bf !important;
}

.review-head .stars {
  margin: 0 !important;
  color: var(--gold) !important;
  white-space: nowrap !important;
  align-self: start !important;
}

.review-card > h3 {
  margin: 4px 0 0 !important;
  font-size: 1.2rem !important;
}

.review-card .source {
  display: inline-flex !important;
  width: fit-content !important;
  color: #ffc94a !important;
  font-size: .82rem !important;
}

.review-body {
  display: -webkit-box !important;
  -webkit-line-clamp: 4 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  color: #d3d9de !important;
  line-height: 1.65 !important;
}

.review-body p {
  margin: 0 !important;
  color: inherit !important;
}

.review-card.expanded .review-body {
  display: block !important;
  -webkit-line-clamp: unset !important;
}

.text-btn,
.review-actions button,
.reply-form button {
  background: #292e33 !important;
  color: #f6f7f8 !important;
  border: 1px solid #4a5259 !important;
  border-radius: 8px !important;
}

.text-btn:hover,
.review-actions button:hover {
  border-color: var(--gold) !important;
  color: var(--gold) !important;
}

.rating-details {
  margin-top: 10px !important;
  padding: 10px 12px !important;
  background: #16191c !important;
  border: 1px solid #353c42 !important;
  border-radius: 8px !important;
  color: #cbd2d8 !important;
}

.proscons {
  margin-top: 8px !important;
  gap: 18px !important;
}

.proscons > div {
  min-width: 0 !important;
}

.proscons > div > b {
  display: block !important;
  margin-bottom: 7px !important;
  color: #fff !important;
}

.pro,
.con,
.review-empty {
  padding: 3px 0 !important;
  overflow-wrap: anywhere !important;
}

.review-empty {
  display: block !important;
  color: #8d969e !important;
  font-size: .85rem !important;
}

.review-actions {
  margin-top: auto !important;
  padding-top: 8px !important;
  flex-wrap: wrap !important;
}

.reply-form {
  max-width: none !important;
  margin-top: 8px !important;
  padding: 14px !important;
  background: #16191c !important;
}

.info-page {
  background: #ffffff !important;
}

.info-shell {
  color: #fff !important;
}

footer {
  background: #111416 !important;
  color: #d7dce0 !important;
}

footer .brand img {
  filter: brightness(0) invert(1) !important;
}

@media (max-width: 1024px) {
  .main-nav {
    background: var(--gold) !important;
  }

  .main-nav a {
    color: #171717 !important;
    background: rgba(0,0,0,.06) !important;
    border-color: rgba(0,0,0,.1) !important;
  }
}

@media (max-width: 768px) {
  .review-grid {
    grid-template-columns: minmax(0,1fr) !important;
  }

  .review-head {
    grid-template-columns: 44px minmax(0,1fr) !important;
  }

  .review-head img {
    width: 44px !important;
    height: 44px !important;
  }

  .review-head .stars {
    grid-column: 1 / -1 !important;
    justify-self: start !important;
  }

  .proscons {
    grid-template-columns: minmax(0,1fr) !important;
  }
}


/* FINAL REVIEW CARD FIX */
.review-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 22px !important;
  align-items: stretch !important;
}

.review-card {
  display: flex !important;
  flex-direction: column !important;
  min-width: 0 !important;
  height: 100% !important;
  padding: 24px !important;
  background: #1d2125 !important;
  border: 1px solid #394047 !important;
  border-radius: 16px !important;
  box-shadow: 0 12px 28px rgba(0,0,0,.16) !important;
  overflow: hidden !important;
}

.review-head {
  display: grid !important;
  grid-template-columns: 52px minmax(0, 1fr) auto !important;
  gap: 12px !important;
  align-items: center !important;
}

.review-head img {
  width: 52px !important;
  height: 52px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  background: #2b3136 !important;
  border: 2px solid #4a535b !important;
}

.review-author-meta {
  min-width: 0 !important;
}

.review-author-meta b {
  display: block !important;
  color: #fff !important;
  font-size: 1rem !important;
  line-height: 1.25 !important;
  overflow-wrap: anywhere !important;
}

.review-author-meta small {
  display: block !important;
  margin-top: 4px !important;
  color: #aeb7bf !important;
  line-height: 1.35 !important;
}

.review-score {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  gap: 2px !important;
  white-space: nowrap !important;
}

.review-score .stars {
  margin: 0 !important;
  color: #ffb80c !important;
  font-size: 1rem !important;
  letter-spacing: 1px !important;
}

.review-score span {
  color: #bfc7cd !important;
  font-size: .78rem !important;
}

.review-card > h3 {
  margin: 18px 0 8px !important;
  color: #fff !important;
  font-size: 1.25rem !important;
  line-height: 1.25 !important;
}

.review-card .source {
  width: fit-content !important;
  margin-bottom: 10px !important;
  color: #ffca45 !important;
  font-size: .8rem !important;
  text-decoration: none !important;
}

.review-body {
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 4 !important;
  overflow: hidden !important;
  margin: 0 0 14px !important;
  color: #d1d7dc !important;
  line-height: 1.65 !important;
}

.review-body p {
  margin: 0 !important;
  color: inherit !important;
}

.review-card.expanded .review-body {
  display: block !important;
  -webkit-line-clamp: unset !important;
}

.review-toolbar {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin-bottom: 14px !important;
}

.text-btn,
.review-actions button {
  min-height: 38px !important;
  padding: 8px 12px !important;
  background: #292f34 !important;
  color: #f5f7f8 !important;
  border: 1px solid #4b545c !important;
  border-radius: 8px !important;
}

.rating-details {
  margin: 0 0 14px !important;
  padding: 10px 12px !important;
  background: #14181b !important;
  color: #cbd2d8 !important;
  border: 1px solid #343c42 !important;
  border-radius: 8px !important;
}

.proscons {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
  margin: 0 0 18px !important;
}

.proscons > div {
  min-width: 0 !important;
  padding: 14px !important;
  border-radius: 10px !important;
  background: #171b1e !important;
  border: 1px solid #32393f !important;
}

.proscons b {
  display: block !important;
  margin-bottom: 8px !important;
  color: #fff !important;
}

.pro,
.con,
.review-empty {
  display: block !important;
  padding: 3px 0 !important;
  line-height: 1.45 !important;
  overflow-wrap: anywhere !important;
}

.pro {
  color: #8fe58a !important;
}

.con {
  color: #ff9292 !important;
}

.review-empty {
  color: #879199 !important;
  font-size: .85rem !important;
}

.review-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin-top: auto !important;
  padding-top: 4px !important;
}

.reply-form {
  width: 100% !important;
  max-width: none !important;
  margin-top: 12px !important;
  padding: 14px !important;
  background: #15191c !important;
  border: 1px solid #343c42 !important;
  border-radius: 10px !important;
}

.reply-form textarea {
  min-height: 90px !important;
}

@media (max-width: 768px) {
  .review-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 16px !important;
  }

  .review-card {
    padding: 18px 16px !important;
  }

  .review-head {
    grid-template-columns: 46px minmax(0, 1fr) !important;
  }

  .review-head img {
    width: 46px !important;
    height: 46px !important;
  }

  .review-score {
    grid-column: 1 / -1 !important;
    align-items: flex-start !important;
  }

  .proscons {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}


/* FINAL CONTRAST + OFFER BUTTONS + MOBILE MENU FIX */

.card,
.review-card,
.faq,
.content-panel,
.info-shell,
.proscons > div,
.rating-details,
.reply-form {
  color: #f5f7f8 !important;
}

.card h1,
.card h2,
.card h3,
.card h4,
.card strong,
.card b,
.card small,
.review-card h1,
.review-card h2,
.review-card h3,
.review-card h4,
.review-card strong,
.review-card b,
.faq h1,
.faq h2,
.faq h3,
.content-panel h1,
.content-panel h2,
.content-panel h3,
.content-panel h4,
.info-shell h1,
.info-shell h2,
.info-shell h3,
.info-shell h4 {
  color: #ffffff !important;
}

.card p,
.card li,
.card span,
.card small,
.review-card p,
.review-card li,
.review-card .review-body,
.review-card .review-author-meta small,
.content-panel p,
.content-panel li,
.info-content p,
.info-content li {
  color: #cbd2d8 !important;
}

.card > small {
  display: block !important;
  margin-top: auto !important;
  padding-top: 18px !important;
  color: #eef1f3 !important;
  font-size: .88rem !important;
  line-height: 1.45 !important;
}

.bonus-grid .card {
  display: flex !important;
  flex-direction: column !important;
  min-height: 310px !important;
  padding: 26px !important;
}

.bonus-grid .card h3 {
  margin: 18px 0 12px !important;
}

.bonus-grid .card p {
  margin: 0 !important;
}

.bonus-grid .card .btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: fit-content !important;
  min-width: 150px !important;
  min-height: 44px !important;
  margin: 16px 0 0 !important;
  padding: 10px 18px !important;
  background: #ffb80c !important;
  color: #171717 !important;
  border: 1px solid #e3a100 !important;
  border-radius: 9px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  box-shadow: none !important;
  align-self: flex-start !important;
}

.bonus-grid .card .btn:hover {
  background: #ffc63d !important;
  color: #111 !important;
}

@media (max-width: 1024px) {
  .burger {
    display: inline-flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: 44px !important;
    height: 44px !important;
    padding: 8px !important;
    margin-left: 4px !important;
    background: rgba(0,0,0,.08) !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    z-index: 10002 !important;
    position: relative !important;
  }

  .burger i {
    display: block !important;
    width: 24px !important;
    height: 2px !important;
    margin: 3px 0 !important;
    background: #171717 !important;
    transition: transform .2s ease, opacity .2s ease !important;
  }

  .burger.open {
    position: fixed !important;
    top: 14px !important;
    right: 14px !important;
    background: rgba(0,0,0,.16) !important;
  }

  .burger.open i:nth-child(1) {
    transform: translateY(8px) rotate(45deg) !important;
  }

  .burger.open i:nth-child(2) {
    opacity: 0 !important;
  }

  .burger.open i:nth-child(3) {
    transform: translateY(-8px) rotate(-45deg) !important;
  }

  .main-nav {
    display: flex !important;
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100dvh !important;
    padding: 86px 18px 28px !important;
    background: #ffb80c !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 8px !important;
    z-index: 10000 !important;
    overflow-y: auto !important;
    box-sizing: border-box !important;
    transform: translateX(100%) !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transition:
      transform .25s ease,
      opacity .2s ease,
      visibility .2s ease !important;
  }

  .main-nav.open {
    transform: translateX(0) !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }

  .main-nav a {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    min-height: 48px !important;
    padding: 13px 15px !important;
    background: rgba(0,0,0,.07) !important;
    color: #171717 !important;
    border: 1px solid rgba(0,0,0,.12) !important;
    border-radius: 9px !important;
  }
}

@media (max-width: 768px) {
  .bonus-grid {
    grid-template-columns: minmax(0,1fr) !important;
  }

  .bonus-grid .card {
    min-height: 0 !important;
    padding: 20px 18px !important;
  }

  .bonus-grid .card .btn {
    width: 100% !important;
    align-self: stretch !important;
  }
}

.table-wrap table,
.table-wrap th,
.table-wrap td,
#comparison table,
#comparison th,
#comparison td,
.container table,
.container table th,
.container table td {
  color: #f5f7f8 !important;
}

.table-wrap th,
#comparison th,
.container table th {
  background: #343434 !important;
  color: #ffffff !important;
}

.table-wrap td,
#comparison td,
.container table td {
  background: #232323 !important;
  color: #e8ecef !important;
}

.table-wrap a,
#comparison table a,
.container table a {
  color: #ffffff !important;
}
