/* =========================================================================
   Freespinix theme — global + component styles
   Compiled from the Lovable source. Tokens are frozen; sharp edges throughout.
   ========================================================================= */

/* ---- Design tokens ---------------------------------------------------- */
:root {
  --fs-bg: #FFFFFF;
  --fs-bg-soft: #F6F7F9;
  --fs-bg-hover: #F0F2F5;
  --fs-border: #E4E7EC;
  --fs-text: #0B0D12;
  --fs-text-muted: #4B5563;
  --fs-text-soft: #64748B;
  --fs-text-body: #374151;
  --fs-accent-no-deposit: #0E8F7E;
  --fs-accent-no-wagering: #4F7A00;
  --fs-accent-deposit: #6B3FCF;
  --fs-accent-default: #0E8F7E;
  --fs-font-heading: 'Space Grotesk', system-ui, sans-serif;
  --fs-font-body: Inter, system-ui, sans-serif;
}

/* ---- Reset / base ----------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
* { border-radius: 0 !important; }

body {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  background: var(--fs-bg);
  color: var(--fs-text);
  font-family: var(--fs-font-body);
}
img, svg { max-width: 100%; }
a { color: inherit; }
button { font-family: inherit; }

:focus-visible { outline: 2px solid var(--fs-text); outline-offset: 2px; }
::selection { background: #0E8F7E; color: #0B0D12; }

.fs-main { flex: 1 0 auto; width: 100%; }

/* ---- Typography helpers ---------------------------------------------- */
.fs-h1 { font-family: var(--fs-font-heading); font-weight: 700; font-size: 40px; color: var(--fs-text); margin: 0; }
.fs-h2 { font-family: var(--fs-font-heading); font-weight: 700; font-size: 32px; color: var(--fs-text); margin: 0; }
.fs-h3 { font-family: var(--fs-font-heading); font-weight: 600; font-size: 20px; color: var(--fs-text); margin: 0; }
.fs-h4 { font-family: var(--fs-font-heading); font-weight: 600; font-size: 16px; color: var(--fs-text); margin: 0; }
.fs-body { font-family: var(--fs-font-body); font-weight: 400; font-size: 16px; line-height: 1.7; color: var(--fs-text-body); }
.fs-eyebrow {
  font-family: var(--fs-font-body); font-weight: 600; font-size: 11px;
  letter-spacing: 0.15em; text-transform: uppercase; color: var(--fs-text-muted);
}
.fs-meta { font-family: var(--fs-font-body); font-weight: 400; font-size: 12px; color: var(--fs-text-muted); }

/* ---- Containers ------------------------------------------------------- */
.fs-container { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.fs-container-narrow { max-width: 760px; margin: 0 auto; padding: 0 24px; }
.fs-container-wide { max-width: 1280px; margin: 0 auto; padding: 0 24px; }
.fs-container-xwide { max-width: 1400px; margin: 0 auto; padding: 0 24px; }

/* ---- Sections --------------------------------------------------------- */
.fs-section { padding: 80px 0; }
@media (max-width: 767px) { .fs-section { padding: 64px 0; } }
.fs-section-h2 { font-family: var(--fs-font-heading); font-weight: 700; font-size: 36px; color: var(--fs-text); margin: 0; }
@media (max-width: 767px) { .fs-section-h2 { font-size: 28px; } }
.fs-section__head { text-align: center; margin-bottom: 40px; }
.fs-section__sub {
  margin-top: 8px; font-family: var(--fs-font-body); font-weight: 400;
  font-size: 14px; color: var(--fs-text-muted);
}

/* ---- Skip link -------------------------------------------------------- */
.fs-skip-link {
  position: absolute; top: -40px; left: 0;
  background: #0E8F7E; color: #0B0D12; padding: 8px 16px;
  font: 600 14px Inter, sans-serif; text-decoration: none;
  z-index: 9999; transition: top 150ms ease;
}
.fs-skip-link:focus, .fs-skip-link:focus-visible { top: 0; outline: 2px solid #0B0D12; outline-offset: 2px; }

/* ---- Animation: scroll fade-up --------------------------------------- */
.fs-fade-up {
  opacity: 0; transform: translateY(20px);
  transition: opacity 400ms ease, transform 400ms ease;
}
.fs-fade-up.fs-visible { opacity: 1; transform: translateY(0); }

/* ---- Animation: pulse dot -------------------------------------------- */
@keyframes fs-pulse { 0%, 100% { transform: scale(1); opacity: 1; } 50% { transform: scale(1.4); opacity: 0.6; } }
.fs-pulse { animation: fs-pulse 1.5s ease-in-out infinite; }

/* ---- Reduced motion ---------------------------------------------------
   v1.4.12 — Scoped per-element only (no more global * killer that was
   stopping the JUST VERIFIED marquee). Individual elements opt in. */
@media (prefers-reduced-motion: reduce) {
  .fs-fade-up { opacity: 1; transform: none; transition: none; }
  .fs-pulse { animation: none !important; }
}

/* ---- Breadcrumb ------------------------------------------------------- */
.fs-breadcrumb { background: #FFFFFF; padding: 20px 0 0; }
.fs-breadcrumb .fs-container {
  display: flex; align-items: center; gap: 8px;
  font-family: var(--fs-font-body); font-weight: 600; font-size: 11px;
  letter-spacing: 0.1em; text-transform: uppercase; color: var(--fs-text-soft);
}
.fs-breadcrumb__link { color: var(--fs-text-soft); text-decoration: none; transition: color 150ms ease; }
.fs-breadcrumb__link:hover { color: #0E8F7E; }
.fs-breadcrumb__sep { color: var(--fs-border); }
.fs-breadcrumb__current { color: var(--fs-text); }

/* ---- Logo ------------------------------------------------------------- */
.fs-logo__hex { flex-shrink: 0; }
.fs-logo__word {
  font-family: var(--fs-font-heading); font-weight: 700; font-size: 22px;
  line-height: 1; color: #0B0D12;
}
.fs-logo__word--lg { font-size: 32px; }

/* ---- Navigation ------------------------------------------------------- */
.fs-nav {
  position: sticky; top: 0; z-index: 50;
  background: #FFFFFF; border-bottom: 1px solid #0E8F7E;
  transition: border-color 300ms ease; width: 100%;
}
.fs-nav__inner {
  height: 64px; padding: 0 24px; display: flex; align-items: center;
  justify-content: space-between; max-width: 1280px; margin: 0 auto;
}
.fs-nav__brand { display: inline-flex; align-items: center; gap: 8px; text-decoration: none; }
.fs-nav__links { display: flex; align-items: center; gap: 0; }
.fs-nav__item { position: relative; }
.fs-nav__link {
  display: inline-block; font-family: var(--fs-font-body); font-weight: 500;
  font-size: 14px; padding: 8px 16px; text-decoration: none; color: #0B0D12;
  text-underline-offset: 4px; text-decoration-thickness: 2px;
}
.fs-nav__link--no-deposit { color: #0E8F7E; }
.fs-nav__link--no-wagering { color: #4F7A00; }
.fs-nav__link--deposit { color: #6B3FCF; }
.fs-nav__link:hover { text-decoration: underline; text-decoration-color: currentColor; }
.fs-nav__link--active { text-decoration: underline; text-decoration-color: currentColor; }

.fs-nav__menu {
  position: absolute; top: 100%; left: 50%;
  transform: translateX(-50%) translateY(10px);
  min-width: 260px; background: #FFFFFF;
  border: 1px solid #E4E7EC; border-top: 2px solid var(--fs-nav-accent, #0E8F7E);
  box-shadow: 0 18px 40px rgba(11, 13, 18, 0.12),
              0 0 24px color-mix(in oklab, var(--fs-nav-accent, #0E8F7E) 12%, transparent);
  display: none; flex-direction: column; z-index: 60;
}
.fs-nav__item:hover .fs-nav__menu,
.fs-nav__item:focus-within .fs-nav__menu { display: flex; }
.fs-nav__menu::before { content: ''; position: absolute; top: -14px; left: 0; right: 0; height: 14px; }
.fs-nav__menu-header {
  padding: 14px 18px 10px; font-family: var(--fs-font-body); font-size: 10px;
  font-weight: 700; letter-spacing: 0.18em; color: var(--fs-nav-accent, #0E8F7E);
  opacity: 0.9; border-bottom: 1px solid #E4E7EC; text-transform: uppercase;
}
.fs-nav__menu-list { display: flex; flex-direction: column; padding: 6px 0; max-height: 70vh; overflow-y: auto; }
.fs-nav__menu-item {
  display: flex; align-items: center; gap: 10px; padding: 10px 18px;
  font-family: var(--fs-font-body); font-size: 13px; font-weight: 500;
  color: #0B0D12; text-decoration: none; white-space: nowrap;
  transition: background 150ms, color 150ms, padding-left 150ms;
}
.fs-nav__bullet {
  width: 4px; height: 4px; background: #64748B; flex-shrink: 0;
  transition: background 150ms, box-shadow 150ms;
}
.fs-nav__label { border-bottom: 1px solid transparent; }
.fs-nav__menu-item:hover { background: #F6F7F9; color: var(--fs-nav-accent, #0E8F7E); padding-left: 22px; }
.fs-nav__menu-item:hover .fs-nav__bullet { background: var(--fs-nav-accent, #0E8F7E); box-shadow: 0 0 8px var(--fs-nav-accent, #0E8F7E); }
.fs-nav__menu-item:hover .fs-nav__label { border-bottom-color: currentColor; }
.fs-nav__menu-footer {
  display: flex; align-items: center; justify-content: center; padding: 12px 18px;
  font-family: var(--fs-font-body); font-size: 12px; font-weight: 600;
  letter-spacing: 0.04em; color: #4B5563; text-decoration: none;
  border-top: 1px solid #E4E7EC; text-transform: uppercase;
  transition: color 150ms, background 150ms;
}
.fs-nav__menu-footer:hover { background: #F6F7F9; color: var(--fs-nav-accent, #0E8F7E); }

.fs-nav__hamburger {
  display: none; background: transparent; border: 0; padding: 8px;
  cursor: pointer; color: #0B0D12; align-items: center; justify-content: center;
}
.fs-nav__hamburger-close { display: none; }
.fs-nav__hamburger[aria-expanded="true"] .fs-nav__hamburger-open { display: none; }
.fs-nav__hamburger[aria-expanded="true"] .fs-nav__hamburger-close { display: block; }

@media (max-width: 767px) {
  .fs-nav__links { display: none; }
  .fs-nav__hamburger { display: inline-flex; }
}

/* ---- Mobile menu ------------------------------------------------------ */
.fs-mobile-menu {
  position: fixed; top: 64px; left: 0; right: 0; bottom: 0;
  background: #FFFFFF; z-index: 49; overflow-y: auto;
  border-top: 1px solid #E4E7EC;
}
.fs-mobile-menu[hidden] { display: none; }
.fs-mobile-menu__inner { display: flex; flex-direction: column; padding: 8px 0; }
.fs-mobile-menu__hub {
  padding: 14px 24px; font-family: var(--fs-font-heading); font-weight: 700;
  font-size: 16px; color: #0B0D12; text-decoration: none;
  border-bottom: 1px solid #E4E7EC;
}
.fs-mobile-menu__hub--no-deposit { color: #0E8F7E; }
.fs-mobile-menu__hub--no-wagering { color: #4F7A00; }
.fs-mobile-menu__hub--deposit { color: #6B3FCF; }
.fs-mobile-menu__sub {
  padding: 11px 24px 11px 40px; font-family: var(--fs-font-body);
  font-size: 14px; font-weight: 500; color: #4B5563; text-decoration: none;
}
.fs-mobile-menu__hub:hover, .fs-mobile-menu__sub:hover { background: #F6F7F9; }
@media (min-width: 768px) { .fs-mobile-menu { display: none !important; } }

/* ---- Footer ----------------------------------------------------------- */
.fs-footer { background: #FFFFFF; border-top: 1px solid #E4E7EC; padding: 64px 24px 32px; width: 100%; flex-shrink: 0; }
.fs-footer__inner { max-width: 1200px; margin: 0 auto; }
.fs-footer__top { display: grid; grid-template-columns: 1fr; gap: 48px; }
.fs-footer__brand-col { max-width: 360px; }
.fs-footer__brand { display: inline-flex; align-items: center; gap: 8px; text-decoration: none; }
.fs-footer__tagline {
  font-family: var(--fs-font-body); font-weight: 500; font-size: 15px;
  color: #0B0D12; line-height: 1.5; margin: 16px 0 8px;
}
.fs-footer__blurb {
  font-family: var(--fs-font-body); font-weight: 400; font-size: 13px;
  color: #4B5563; line-height: 1.6; max-width: 320px;
}
.fs-footer__grid { display: grid; grid-template-columns: 1fr 1fr; column-gap: 24px; row-gap: 32px; }
.fs-footer__col { display: flex; flex-direction: column; }
.fs-footer__heading {
  font-family: var(--fs-font-body); font-weight: 700; font-size: 12px;
  letter-spacing: 0.12em; text-transform: uppercase; color: #0E8F7E; margin-bottom: 16px;
}
.fs-footer__link {
  color: #4B5563; font-family: var(--fs-font-body); font-weight: 500;
  font-size: 14px; text-decoration: none; transition: color 150ms ease; margin-bottom: 12px;
}
.fs-footer__link:last-child { margin-bottom: 0; }
.fs-footer__link:hover { color: #0E8F7E; }
.fs-footer__divider { border-top: 1px solid #E4E7EC; margin: 48px 0 32px; }
.fs-footer__rg {
  display: flex; flex-wrap: wrap; justify-content: center; align-items: center;
  gap: 12px; font-family: var(--fs-font-body); font-size: 13px; color: #0B0D12;
}
.fs-footer__age {
  display: inline-block; border: 1px solid #0E8F7E; color: #0E8F7E;
  padding: 4px 8px; font-size: 12px; font-weight: 700; letter-spacing: 0.05em;
}
.fs-footer__rg-eyebrow {
  font-family: var(--fs-font-body); font-weight: 700; font-size: 11px;
  letter-spacing: 0.12em; text-transform: uppercase; color: #4B5563;
}
.fs-footer__rg-link { color: #0B0D12; text-decoration: none; font-weight: 500; transition: opacity 150ms ease; }
.fs-footer__rg-link:hover { opacity: 0.8; }
.fs-footer__rg-sep { color: #E4E7EC; }
.fs-footer__motto {
  margin-top: 24px; text-align: center; font-family: var(--fs-font-body);
  font-weight: 400; font-size: 13px; color: #4B5563; font-style: italic;
}
.fs-footer__compliance {
  margin: 24px auto 0; max-width: 720px; font-family: var(--fs-font-body);
  font-weight: 400; font-size: 12px; color: #4B5563; line-height: 1.7; text-align: center;
}
.fs-footer__copyright {
  margin-top: 16px; text-align: center; font-family: var(--fs-font-body);
  font-weight: 400; font-size: 12px; color: #4B5563;
}
@media (min-width: 640px) { .fs-footer__grid { column-gap: 48px; } }
@media (min-width: 1024px) {
  .fs-footer { padding-left: 48px; padding-right: 48px; }
  .fs-footer__top { grid-template-columns: 360px 1fr; gap: 64px; align-items: start; }
  .fs-footer__grid { grid-template-columns: repeat(4, 1fr); gap: 48px; }
}

/* ---- Notched tile ----------------------------------------------------- */
.fs-notch { position: absolute; top: 0; right: 0; pointer-events: none; }
.fs-tile {
  position: relative; background: #F6F7F9; border: 1px solid #E4E7EC; padding: 24px;
  clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 0 100%);
}
.fs-tile--default { --fs-tile-accent: #0E8F7E; }
.fs-tile--no-deposit { --fs-tile-accent: #0E8F7E; }
.fs-tile--no-wagering { --fs-tile-accent: #4F7A00; }
.fs-tile--deposit { --fs-tile-accent: #6B3FCF; }

/* ---- Offer grid ------------------------------------------------------- */
.fs-offer-grid {
  display: grid; gap: 16px; grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-auto-rows: 1fr; align-items: stretch;
}
.fs-offer-grid > * { min-width: 0; min-height: 100%; }
@media (min-width: 600px) { .fs-offer-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 900px) { .fs-offer-grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1200px) { .fs-offer-grid { grid-template-columns: repeat(5, 1fr); } }

/* ---- Offer card ------------------------------------------------------- */
.fs-offer-card {
  position: relative; background: #F6F7F9; border: 1px solid #E4E7EC;
  padding: 14px; width: 100%; height: 100%; display: flex; flex-direction: column;
  clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 0 100%);
  transition: background 200ms;
}
.fs-offer-card:hover { background: #F0F2F5; }
.fs-offer-card__top { display: flex; justify-content: space-between; align-items: center; position: relative; z-index: 1; }
.fs-offer-card__rank { font-family: var(--fs-font-heading); font-weight: 700; font-size: 14px; color: var(--fs-card-accent, #0E8F7E); }
.fs-offer-card__rating {
  padding: 4px 10px; border: 1px solid var(--fs-card-accent, #0E8F7E);
  color: var(--fs-card-accent, #0E8F7E); font-family: var(--fs-font-heading);
  font-weight: 700; font-size: 14px; background: transparent;
}
.fs-offer-card__row2 { display: flex; gap: 10px; align-items: center; margin-top: 12px; min-height: 64px; }
.fs-offer-card__logo {
  width: 96px; height: 64px; background: #FFFFFF; border: 1px solid #E4E7EC;
  overflow: hidden; flex-shrink: 0; display: flex; align-items: center; justify-content: center;
}
.fs-offer-card__logo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fs-offer-card__info { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.fs-offer-card__name {
  font-family: var(--fs-font-heading); font-weight: 700; font-size: 15px; color: #0B0D12;
  line-height: 1.15; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.fs-offer-card__headline {
  font-family: var(--fs-font-body); font-weight: 500; font-size: 11px; color: #4B5563;
  margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.fs-offer-card__game {
  font-family: var(--fs-font-body); font-weight: 400; font-size: 10px; color: #64748B;
  margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.fs-offer-card__spins-wrap { margin-top: 14px; text-align: center; }
.fs-offer-card__spins { font-family: var(--fs-font-heading); font-weight: 700; font-size: 34px; line-height: 1; color: var(--fs-card-accent, #0E8F7E); }
.fs-offer-card__spins-label {
  font-family: var(--fs-font-body); font-weight: 600; font-size: 10px; letter-spacing: 0.1em;
  text-transform: uppercase; color: #4B5563; margin-top: 4px;
}
.fs-offer-card__data { margin-top: 14px; display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: #E4E7EC; }
.fs-offer-card__cell { padding: 8px 10px; background: #FFFFFF; }
.fs-offer-card__cell-label {
  font-family: var(--fs-font-body); font-weight: 600; font-size: 10px; letter-spacing: 0.1em;
  text-transform: uppercase; color: #4B5563;
}
.fs-offer-card__cell-value {
  font-family: var(--fs-font-body); font-weight: 600; font-size: 13px; color: #0B0D12;
  margin-top: 4px; line-height: 1.25; min-height: 32px; word-break: break-word; overflow-wrap: anywhere;
}
.fs-offer-card__verified {
  margin-top: auto; padding-top: 12px; text-align: center; font-family: var(--fs-font-body);
  font-weight: 500; font-size: 11px; color: #4B5563;
}
.fs-offer-card__cta { margin-top: 12px; }
.fs-offer-card__cta a, .fs-offer-card__cta button {
  width: 100%; display: block; background: var(--fs-card-accent, #0E8F7E); color: #FFFFFF;
  padding: 14px 0; font-family: var(--fs-font-body); font-weight: 700; font-size: 14px;
  letter-spacing: 0.05em; text-transform: uppercase; text-align: center; text-decoration: none;
  border: none; cursor: pointer; transition: filter 150ms;
}
.fs-offer-card__cta a:hover, .fs-offer-card__cta button:hover { filter: brightness(1.1); }
.fs-offer-card__tc {
  margin-top: 8px; text-align: center; font-family: var(--fs-font-body);
  font-weight: 400; font-size: 10px; color: #64748B;
}
.fs-offer-card__tc a { color: #4B5563; text-decoration: none; }
@media (max-width: 599px) {
  .fs-offer-card__row2 { flex-direction: column; align-items: center; text-align: center; gap: 8px; min-height: 0; margin-top: 8px; }
  .fs-offer-card__logo { width: 64px; height: 44px; }
  .fs-offer-card__info { width: 100%; align-items: center; flex: none; }
  .fs-offer-card__data { margin-top: 8px; }
  .fs-offer-card__cell { padding: 6px 6px; }
  .fs-offer-card__cell-label { font-size: 8px; letter-spacing: 0.06em; }
  .fs-offer-card__cell-value { font-size: 10px; min-height: 0; margin-top: 2px; line-height: 1.2; }
  .fs-offer-card__spins { font-size: 26px; }
  .fs-offer-card__spins-wrap { margin-top: 8px; }
  .fs-offer-card__verified { padding-top: 8px; font-size: 10px; }
  .fs-offer-card__cta { margin-top: 8px; }
  .fs-offer-card__cta a, .fs-offer-card__cta button { padding: 10px 0; font-size: 13px; }
  .fs-offer-card__tc { margin-top: 6px; font-size: 9px; }
}

/* ---- Hero ------------------------------------------------------------- */
.fs-hero {
  position: relative; background: #FFFFFF; padding: 40px 24px 32px;
  overflow: hidden; border-bottom: 1px solid #E4E7EC;
}
@media (max-width: 767px) { .fs-hero { padding: 32px 16px 28px; } }
.fs-hero__hex { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; animation: fs-hero-drift 60s linear infinite; }
.fs-hero__glow {
  position: absolute; inset: 0; pointer-events: none; transition: background 400ms ease;
  background: radial-gradient(circle at 75% 30%, color-mix(in srgb, var(--fs-hero-accent, #0E8F7E) 13%, transparent) 0%, transparent 55%);
}
@keyframes fs-hero-drift { 0% { transform: translateX(-10px); } 50% { transform: translateX(10px); } 100% { transform: translateX(-10px); } }
.fs-hero__inner { position: relative; max-width: 1280px; margin: 0 auto; }
.fs-hero__head { text-align: center; max-width: 1000px; margin: 0 auto 24px; }
.fs-hero__eyebrow {
  display: inline-flex; align-items: center; gap: 8px; font-family: var(--fs-font-body);
  font-weight: 600; font-size: 10px; letter-spacing: 0.15em; text-transform: uppercase;
  color: #4B5563; margin-bottom: 10px;
}
.fs-hero__dot { display: inline-block; width: 6px; height: 6px; background: var(--fs-hero-accent, #0E8F7E); animation: fs-pulse 1.5s ease-in-out infinite; }
.fs-hero__h1 {
  font-family: var(--fs-font-heading); font-weight: 700; font-size: clamp(1.75rem, 5vw, 3rem);
  line-height: 1.05; color: #0B0D12; margin: 0 0 8px 0; letter-spacing: -0.02em;
  text-wrap: balance; white-space: nowrap;
}
.fs-hero__h1-accent { color: var(--fs-hero-accent, #0E8F7E); transition: color 250ms ease; }
@media (max-width: 1023px) { .fs-hero__h1 { white-space: normal; } }
.fs-hero__sub {
  font-family: var(--fs-font-body); font-weight: 400; font-size: 14px; line-height: 1.5;
  color: #4B5563; margin: 0 auto; max-width: 620px;
}
@media (max-width: 767px) { .fs-hero__sub { font-size: 13px; } }
.fs-hero__grid { display: grid; grid-template-columns: 1fr; gap: 16px; align-items: stretch; }
@media (min-width: 960px) { .fs-hero__grid { grid-template-columns: 340px 1fr; gap: 20px; } }

.fs-hero__cats { display: flex; flex-direction: column; gap: 8px; }
.fs-cat-card {
  appearance: none; background: #FFFFFF; border: 1px solid #E4E7EC; padding: 12px;
  color: #0B0D12; text-align: left; cursor: pointer; font-family: var(--fs-font-body);
  transition: border-color 250ms ease, background 250ms ease, transform 200ms ease;
}
.fs-cat-card:hover { border-color: var(--fs-cat-accent); background: #F0F2F5; }
.fs-cat-card[data-active] {
  border-color: var(--fs-cat-accent);
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.03), transparent 60%), #FFFFFF;
  box-shadow: inset 0 0 0 1px var(--fs-cat-accent);
}
.fs-cat-card__row { display: flex; align-items: center; gap: 12px; }
.fs-cat-card__num { font-family: var(--fs-font-heading); font-weight: 700; font-size: 28px; line-height: 1; min-width: 36px; color: var(--fs-cat-accent); }
.fs-cat-card__meta { flex: 1; }
.fs-cat-card__label { font-weight: 700; font-size: 14px; color: #0B0D12; letter-spacing: 0.01em; }
.fs-cat-card__tag { font-size: 11px; color: #4B5563; margin-top: 2px; }
.fs-cat-card__arrow { color: #64748B; transition: transform 200ms ease, color 200ms ease; flex-shrink: 0; }
.fs-cat-card[data-active] .fs-cat-card__arrow { transform: translateX(4px); color: var(--fs-cat-accent); }
.fs-cat-card__top { display: flex; align-items: center; gap: 8px; margin-top: 10px; padding-top: 8px; border-top: 1px dashed #E4E7EC; font-size: 11px; }
.fs-cat-card__top img { width: 20px; height: 20px; object-fit: contain; }
.fs-cat-card__top-name { color: #0B0D12; font-weight: 600; }
.fs-cat-card__top-sep { color: #64748B; }
.fs-cat-card__top-spins { color: var(--fs-cat-accent); font-weight: 700; }

.fs-hero__feature-wrap { display: grid; }
.fs-hero-feature {
  position: relative; background: #FFFFFF; border: 1px solid var(--fs-hero-accent, #0E8F7E);
  padding: 18px; display: flex; flex-direction: column; gap: 14px; min-height: 100%;
}
.fs-hero-feature[hidden] { display: none; }
@media (max-width: 640px) { .fs-hero-feature { padding: 14px; } }
.fs-feature__tag {
  display: inline-block; font-family: var(--fs-font-body); font-weight: 700; font-size: 10px;
  letter-spacing: 0.12em; padding: 3px 6px; border: 1px solid var(--fs-hero-accent, #0E8F7E);
  color: var(--fs-hero-accent, #0E8F7E); width: fit-content;
}
.fs-feature__head { display: flex; align-items: center; gap: 12px; }
.fs-feature__logo { width: 80px; height: 40px; background: #F6F7F9; border: 1px solid #E4E7EC; overflow: hidden; flex-shrink: 0; }
.fs-feature__logo img { width: 100%; height: 100%; object-fit: fill; display: block; }
.fs-feature__name { font-family: var(--fs-font-heading); font-weight: 700; font-size: 18px; color: #0B0D12; line-height: 1.1; }
.fs-feature__headline { font-family: var(--fs-font-body); font-size: 12px; color: #4B5563; margin-top: 2px; }
.fs-feature__metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: #E4E7EC; border: 1px solid #E4E7EC; }
.fs-feature-metric { background: #FFFFFF; padding: 10px 8px; text-align: center; font-family: var(--fs-font-body); }
.fs-feature-metric__label { font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; color: #4B5563; margin-bottom: 6px; }
.fs-feature-metric__value { font-family: var(--fs-font-heading); font-weight: 700; font-size: 16px; color: var(--fs-hero-accent, #0E8F7E); line-height: 1.2; }

.fs-herocalc { background: #F0F2F5; border: 1px solid #E4E7EC; padding: 12px; }
.fs-herocalc__head {
  display: flex; align-items: center; gap: 6px; font-family: var(--fs-font-body);
  font-weight: 600; font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase;
  color: #4B5563; margin-bottom: 8px;
}
.fs-herocalc__slider-row { display: flex; justify-content: space-between; align-items: baseline; font-family: var(--fs-font-body); margin-bottom: 6px; }
.fs-herocalc__label { font-size: 12px; color: #0B0D12; font-weight: 500; }
.fs-herocalc__value { font-family: var(--fs-font-heading); font-weight: 700; font-size: 16px; color: var(--fs-hero-accent, #0E8F7E); }
.fs-herocalc__range {
  width: 100%; height: 4px; background: #E4E7EC; outline: none;
  -webkit-appearance: none; appearance: none; cursor: pointer; color: var(--fs-hero-accent, #0E8F7E);
}
.fs-herocalc__range::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 14px; height: 14px; background: currentColor; cursor: pointer; border: 0; }
.fs-herocalc__range::-moz-range-thumb { width: 14px; height: 14px; background: currentColor; cursor: pointer; border: 0; }
.fs-herocalc__results { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 10px; padding-top: 10px; border-top: 1px dashed #E4E7EC; }
@media (max-width: 480px) { .fs-herocalc__results { grid-template-columns: 1fr; } }
.fs-herocalc__result { display: flex; flex-direction: column; gap: 2px; }
.fs-herocalc__result-label { font-family: var(--fs-font-body); font-size: 10px; color: #4B5563; text-transform: uppercase; letter-spacing: 0.08em; }
.fs-herocalc__result-value { font-family: var(--fs-font-heading); font-weight: 700; font-size: 18px; }
.fs-herocalc__result-value--accent { color: var(--fs-hero-accent, #0E8F7E); }
.fs-herocalc__result-value--dark { color: #0B0D12; }

.fs-feature__foot { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: auto; }
.fs-feature__trust { display: flex; gap: 14px; flex-wrap: wrap; font-family: var(--fs-font-body); font-size: 11px; color: #4B5563; }
.fs-feature__trust-item { display: inline-flex; align-items: center; gap: 6px; }
.fs-feature__cta {
  display: inline-block; border: 0; padding: 9px 16px; font-family: var(--fs-font-body);
  font-weight: 700; font-size: 12px; letter-spacing: 0.1em; text-decoration: none;
  background: var(--fs-hero-accent, #0E8F7E); color: #FFFFFF; cursor: pointer;
  transition: filter 150ms;
}
.fs-feature__cta:hover { filter: brightness(1.1); }

.fs-hero__ticker {
  margin-top: 16px; display: flex; align-items: center; gap: 16px; padding: 12px 16px;
  border: 1px solid #E4E7EC; background: #FFFFFF; overflow: hidden;
}
.fs-hero__ticker-label { font-family: var(--fs-font-body); font-weight: 700; font-size: 10px; letter-spacing: 0.16em; color: #64748B; flex-shrink: 0; }
.fs-hero__ticker-viewport {
  flex: 1; min-width: 0; overflow: hidden; position: relative;
  -webkit-mask-image: linear-gradient(to right, transparent, #000 24px, #000 calc(100% - 24px), transparent);
  mask-image: linear-gradient(to right, transparent, #000 24px, #000 calc(100% - 24px), transparent);
}
.fs-hero__ticker-track { display: flex; width: max-content; will-change: transform; animation: fs-hero-ticker 14s linear infinite; }
.fs-hero__ticker:hover .fs-hero__ticker-track { animation-play-state: paused; }
.fs-hero__ticker-items { display: flex; gap: 24px; padding-right: 24px; flex-shrink: 0; }
.fs-hero__ticker-item { display: inline-flex; align-items: center; gap: 8px; font-family: var(--fs-font-body); font-size: 12px; white-space: nowrap; }
.fs-hero__ticker-item .fs-dot { display: inline-block; width: 6px; height: 6px; }
.fs-hero__ticker-name { color: #0B0D12; font-weight: 600; }
.fs-hero__ticker-sep { color: #64748B; }
.fs-hero__ticker-spins { font-weight: 600; }
@keyframes fs-hero-ticker { 0% { transform: translate3d(0, 0, 0); } 100% { transform: translate3d(-33.333%, 0, 0); } }
/* v1.4.9 — Keep the ticker scrolling even when the user has Reduce Motion
   enabled at the OS level. Matches Lovable's HeroSection.tsx override. */
@media (prefers-reduced-motion: reduce) {
	.fs-hero__ticker-track {
		animation: fs-hero-ticker 14s linear infinite !important;
		animation-duration: 14s !important;
		animation-iteration-count: infinite !important;
	}
}

/* v1.4.9 — Radar entrance animation (one-shot, on render) so the chart
   visibly draws in on page load, matching Recharts' default behaviour
   in Lovable's ComparisonChart.tsx. */
.fs-cmp__radar polygon[fill^="rgba(14"],
.fs-cmp__radar polygon[fill^="rgba(107"] {
	transform-origin: 200px 200px;
	animation: fs-radar-grow 900ms cubic-bezier(0.22, 1, 0.36, 1) both;
}
.fs-cmp__radar polygon[fill^="rgba(107"] { animation-delay: 150ms; }
@keyframes fs-radar-grow {
	0%   { transform: scale(0); opacity: 0; }
	100% { transform: scale(1); opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
	.fs-cmp__radar polygon[fill^="rgba(14"],
	.fs-cmp__radar polygon[fill^="rgba(107"] {
		animation: none;
	}
}

/* ---- Featured offers section ----------------------------------------- */
.fs-featured__inner { max-width: 1400px; margin: 0 auto; padding: 0 24px; }
.fs-featured__head { text-align: center; margin-bottom: 40px; }
.fs-featured__updated { margin-top: 8px; font-family: var(--fs-font-body); font-weight: 400; font-size: 14px; color: #4B5563; }

/* ---- Category hexagons ------------------------------------------------ */
.fs-hex-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; justify-items: center; align-items: center; }
.fs-hex-link { text-decoration: none; display: block; width: 100%; }
.fs-hex-wrap { max-width: 280px; width: 100%; position: relative; cursor: pointer; transition: transform 350ms ease; }
.fs-hex-link:hover .fs-hex-wrap { transform: rotate(8deg); }
.fs-hex-wrap > svg { display: block; }
.fs-hex__content {
  position: absolute; inset: 0; display: flex; flex-direction: column;
  align-items: center; justify-content: center; text-align: center; padding: 16px;
}
.fs-hex__label { margin-top: 16px; font-family: var(--fs-font-heading); font-weight: 700; font-size: 20px; letter-spacing: 0.05em; }
.fs-hex__count { margin-top: 8px; font-family: var(--fs-font-body); font-weight: 400; font-size: 14px; color: #0B0D12; }
.fs-hex__browse { margin-top: 16px; font-family: var(--fs-font-body); font-weight: 600; font-size: 13px; }
@media (max-width: 767px) { .fs-hex-grid { grid-template-columns: 1fr; gap: 24px; } .fs-hex-wrap { width: 80%; } }

/* ---- What Are Free Spins --------------------------------------------- */
.fs-wafs__grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: 64px; }
@media (max-width: 900px) { .fs-wafs__grid { grid-template-columns: 1fr; gap: 48px; } }
.fs-wafs__h2 { font-family: var(--fs-font-heading); font-weight: 700; font-size: 32px; color: #0B0D12; margin: 0 0 16px 0; }
@media (max-width: 767px) { .fs-wafs__h2 { font-size: 24px; } }
.fs-wafs__intro { font-family: var(--fs-font-body); font-size: 16px; line-height: 1.65; color: #374151; margin: 0; }
.fs-wafs__intro + .fs-wafs__intro { margin-top: 12px; }
.fs-wafs__long { margin-top: 32px; display: flex; flex-direction: column; gap: 12px; }
.fs-wafs__long p { font-family: var(--fs-font-body); font-size: 15px; line-height: 1.7; color: #374151; margin: 0; }
.fs-wafs__h3 { font-family: var(--fs-font-heading); font-weight: 700; font-size: 20px; color: #0B0D12; margin: 16px 0 4px 0; letter-spacing: -0.01em; }

.fs-tabs { display: flex; gap: 4px; margin-top: 28px; padding: 4px; background: #F6F7F9; border: 1px solid #E4E7EC; width: fit-content; max-width: 100%; flex-wrap: wrap; }
.fs-tab {
  display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px;
  background: transparent; border: none; color: #4B5563; font-family: var(--fs-font-heading);
  font-weight: 600; font-size: 13px; letter-spacing: 0.02em; cursor: pointer;
  transition: color 0.15s ease, background 0.15s ease;
}
.fs-tab:hover { color: #0B0D12; }
.fs-tab[data-active] { color: #0B0D12; background: #0E8F7E; }
.fs-tab-panel { position: relative; margin-top: 16px; padding: 24px; background: #F6F7F9; border: 1px solid #E4E7EC; clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 0 100%); }
.fs-tab-panel[hidden] { display: none; }
.fs-tab-panel__head { margin-bottom: 16px; }
.fs-tab-panel__title { display: inline-block; font-family: var(--fs-font-heading); font-weight: 700; font-size: 22px; color: #0E8F7E; text-decoration: none; border-bottom: 1px solid transparent; transition: border-color 0.15s ease; }
.fs-tab-panel__title:hover { border-bottom-color: #0E8F7E; }
.fs-tab-panel__tagline { margin-top: 6px; font-family: var(--fs-font-body); font-size: 14px; color: #4B5563; }
.fs-tab-panel__stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: 16px 0 20px; padding: 16px 0; border-top: 1px solid #E4E7EC; border-bottom: 1px solid #E4E7EC; }
.fs-tab-panel__stat { text-align: center; }
.fs-tab-panel__stat-v { font-family: var(--fs-font-heading); font-weight: 700; font-size: 18px; color: #0B0D12; }
.fs-tab-panel__stat-k { margin-top: 2px; font-family: var(--fs-font-body); font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; color: #6A6E78; }
.fs-tab-panel__body p { font-family: var(--fs-font-body); font-size: 14px; line-height: 1.65; color: #374151; margin: 0 0 12px 0; }
.fs-tab-panel__body p:last-child { margin-bottom: 0; }

.fs-steps { position: relative; display: flex; flex-direction: column; gap: 20px; }
.fs-steps__line { position: absolute; left: 27px; top: 28px; bottom: 28px; width: 1px; background-image: linear-gradient(to bottom, #E4E7EC 50%, transparent 50%); background-size: 1px 8px; z-index: 0; }
.fs-step-row { position: relative; z-index: 1; display: flex; gap: 16px; align-items: flex-start; }
.fs-step-hex { flex-shrink: 0; background: #FFFFFF; }
.fs-step__label { font-family: var(--fs-font-heading); font-weight: 700; font-size: 16px; color: #0B0D12; }
.fs-step__desc { margin-top: 4px; font-family: var(--fs-font-body); font-weight: 400; font-size: 13px; color: #4B5563; line-height: 1.5; }

/* ---- Comparison chart ------------------------------------------------- */
.fs-cmp__h2 { font-family: var(--fs-font-heading); font-weight: 700; font-size: 32px; color: #0B0D12; margin: 0; }
@media (max-width: 767px) { .fs-cmp__h2 { font-size: 24px; } }
.fs-cmp__intro { max-width: 820px; margin: 0 auto 40px; display: flex; flex-direction: column; gap: 16px; font-family: var(--fs-font-body); font-weight: 400; font-size: 16px; line-height: 1.65; color: #0B0D12; }
.fs-cmp__intro p { margin: 0; }
.fs-cmp__intro strong { color: #0B0D12; }
.fs-cmp__legend { display: flex; justify-content: center; gap: 24px; margin-bottom: 16px; }
.fs-cmp__legend-item { display: inline-flex; align-items: center; gap: 8px; font-family: var(--fs-font-body); font-weight: 600; font-size: 13px; color: #0B0D12; }
.fs-cmp__legend-swatch { width: 10px; height: 10px; display: inline-block; }
.fs-cmp__chart { position: relative; max-width: 720px; margin: 0 auto; background: #F6F7F9; padding: 32px; border: 1px solid #E4E7EC; clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 0 100%); overflow: visible; }
.fs-cmp__chart-wrap { width: 100%; max-width: 100%; }
.fs-cmp__chart svg.fs-cmp__radar { display: block; width: 100%; height: auto; max-width: 100%; }
.fs-cmp__cells { margin-top: 24px; display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; }
@media (max-width: 767px) { .fs-cmp__cells { grid-template-columns: repeat(2, 1fr); } }
.fs-cmp__cell { padding: 12px; border: 1px solid #E4E7EC; background: transparent; }
.fs-cmp__cell-axis { font-family: var(--fs-font-heading); font-weight: 700; font-size: 13px; color: #0B0D12; margin-bottom: 6px; }
.fs-cmp__cell-text { font-family: var(--fs-font-body); font-weight: 400; font-size: 12px; color: #4B5563; line-height: 1.5; }

/* ---- Wagering calculator (standalone) -------------------------------- */
.fs-wcalc-section { position: relative; overflow: hidden; }
.fs-wcalc__grid-bg {
  position: absolute; inset: 0; pointer-events: none;
  background-image:
    linear-gradient(rgba(0, 240, 200, 0.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 240, 200, 0.06) 1px, transparent 1px);
  background-size: 48px 48px;
  -webkit-mask-image: radial-gradient(ellipse at center, #000 30%, transparent 75%);
  mask-image: radial-gradient(ellipse at center, #000 30%, transparent 75%);
  animation: fs-wcalc-pan 24s linear infinite;
}
@keyframes fs-wcalc-pan { 0% { background-position: 0 0, 0 0; } 100% { background-position: 48px 48px, 48px 48px; } }
.fs-wcalc__glow { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 720px; height: 420px; background: radial-gradient(ellipse, rgba(0, 240, 200, 0.18), transparent 65%); filter: blur(40px); pointer-events: none; }
.fs-wcalc__eyebrow { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; border: 1px solid #E4E7EC; background: rgba(0, 240, 200, 0.04); font-family: var(--fs-font-body); font-weight: 600; font-size: 11px; letter-spacing: 0.18em; color: #0E8F7E; margin-bottom: 16px; }
.fs-wcalc__h2 { font-family: var(--fs-font-heading); font-weight: 700; font-size: 40px; color: #0B0D12; margin: 0; letter-spacing: -0.02em; }
.fs-wcalc__h2-accent { background: linear-gradient(90deg, #0E8F7E, #4F7A00); -webkit-background-clip: text; background-clip: text; color: transparent; }
@media (max-width: 767px) { .fs-wcalc__h2 { font-size: 28px; } }
.fs-wcalc__lead { margin-top: 12px; font-family: var(--fs-font-body); font-weight: 400; font-size: 14px; color: #4B5563; max-width: 540px; margin-inline: auto; }
.fs-wcalc__card { position: relative; max-width: 760px; margin: 0 auto; background: linear-gradient(180deg, #F6F7F9 0%, #FFFFFF 100%); padding: 40px; border: 1px solid #E4E7EC; clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 0 100%); box-shadow: 0 30px 80px -30px rgba(14, 143, 126, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.65); }
@media (max-width: 639px) { .fs-wcalc__card { padding: 24px; } }
.fs-wcalc__corner { position: absolute; width: 14px; height: 14px; border-color: #0E8F7E; border-style: solid; border-width: 0; }
.fs-wcalc__corner--tl { top: -1px; left: -1px; border-top-width: 2px; border-left-width: 2px; }
.fs-wcalc__corner--bl { bottom: -1px; left: -1px; border-bottom-width: 2px; border-left-width: 2px; }
.fs-wcalc__corner--br { bottom: -1px; right: -1px; border-bottom-width: 2px; border-right-width: 2px; }
.fs-wcalc__inputs { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
@media (max-width: 639px) { .fs-wcalc__inputs { grid-template-columns: 1fr; gap: 20px; } }
.fs-wcalc__label { font-family: var(--fs-font-body); font-weight: 600; font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: #4B5563; margin-bottom: 10px; display: flex; align-items: center; gap: 8px; }
.fs-wcalc__label-tick { width: 4px; height: 4px; display: inline-block; }
.fs-wcalc__input-wrap { position: relative; }
.fs-wcalc__input {
  width: 100%; background: #FFFFFF; border: 1px solid #E4E7EC; padding: 16px 18px 16px 44px;
  color: #0B0D12; font-family: var(--fs-font-heading); font-weight: 700; font-size: 28px;
  outline: none; transition: border-color 200ms, box-shadow 200ms;
}
.fs-wcalc__input:focus { border-color: #0E8F7E; box-shadow: 0 0 0 3px rgba(0, 240, 200, 0.15); }
.fs-wcalc__prefix { position: absolute; left: 16px; top: 50%; transform: translateY(-50%); font-family: var(--fs-font-heading); font-weight: 700; font-size: 22px; color: #0E8F7E; pointer-events: none; }
.fs-wcalc__prefix--lime { color: #4F7A00; }
.fs-wcalc__presets { display: flex; gap: 6px; margin-top: 10px; flex-wrap: wrap; }
.fs-wcalc__chip { background: transparent; border: 1px solid #E4E7EC; color: #4B5563; font-family: var(--fs-font-heading); font-weight: 600; font-size: 12px; padding: 6px 10px; cursor: pointer; transition: all 160ms ease; }
.fs-wcalc__chip:hover { border-color: #0E8F7E; color: #0B0D12; background: rgba(14, 143, 126, 0.06); }
.fs-wcalc__chip[data-active] { background: #0E8F7E; border-color: #0E8F7E; color: #0B0D12; }
.fs-wcalc__chip--lime[data-active] { background: #4F7A00; border-color: #4F7A00; color: #0B0D12; }
.fs-wcalc__hint { margin-top: 8px; font-family: var(--fs-font-body); font-weight: 400; font-size: 11px; color: #64748B; }
.fs-wcalc__meter { margin-top: 28px; display: flex; align-items: center; gap: 12px; }
.fs-wcalc__meter-track { flex: 1; display: flex; gap: 4px; height: 22px; padding: 3px; border: 1px solid #E4E7EC; background: #FFFFFF; }
.fs-wcalc__bar { flex: 1; background: #E4E7EC; border: 0; padding: 0; cursor: pointer; appearance: none; transition: background 160ms ease, box-shadow 160ms ease, transform 160ms ease; }
.fs-wcalc__bar:hover { background: color-mix(in oklab, #0E8F7E 24%, #E4E7EC); }
.fs-wcalc__bar[data-active] { background: linear-gradient(180deg, #0E8F7E, #4F7A00); box-shadow: 0 0 10px rgba(0, 240, 200, 0.55); }
.fs-wcalc__meter-label { font-family: var(--fs-font-body); font-weight: 600; font-size: 10px; letter-spacing: 0.14em; color: #64748B; }
@media (max-width: 639px) { .fs-wcalc__meter-label { display: none; } }
.fs-wcalc__output { margin-top: 28px; padding: 24px; background: #FFFFFF; border: 1px solid #E4E7EC; position: relative; }
.fs-wcalc__output::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 1px; background: linear-gradient(90deg, transparent, #0E8F7E, transparent); opacity: 0.5; }
.fs-wcalc__output-row { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; }
.fs-wcalc__output-label { font-family: var(--fs-font-body); font-weight: 600; font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: #4B5563; }
.fs-wcalc__output-big { font-family: var(--fs-font-heading); font-weight: 700; font-size: 48px; font-variant-numeric: tabular-nums; line-height: 1; color: #0E8F7E; text-shadow: 0 0 24px rgba(0, 240, 200, 0.35); }
.fs-wcalc__output-mid { font-family: var(--fs-font-heading); font-weight: 700; font-size: 24px; font-variant-numeric: tabular-nums; }
.fs-wcalc__output-mid .fs-wcalc__spins { color: #4F7A00; }
.fs-wcalc__output-mid .fs-wcalc__at { color: #4B5563; font-size: 16px; margin-left: 8px; }
.fs-wcalc__divider { height: 1px; background: #E4E7EC; margin: 16px 0; }
.fs-wcalc__footer { margin-top: 24px; display: flex; justify-content: center; align-items: center; gap: 8px; font-family: var(--fs-font-body); font-weight: 500; font-size: 12px; color: #4B5563; }
.fs-wcalc__footer-dot { width: 6px; height: 6px; background: #0E8F7E; display: inline-block; }
@media (max-width: 480px) {
  .fs-wcalc__output-big { font-size: 36px; }
  .fs-wcalc__output-mid { font-size: 20px; }
  .fs-wcalc__output-row { flex-direction: column; align-items: flex-start; gap: 6px; }
}

/* ---- How We Verify ---------------------------------------------------- */
.fs-hwv__h2 { font-family: var(--fs-font-heading); font-weight: 700; font-size: 32px; color: #0B0D12; margin: 0; }
@media (max-width: 767px) { .fs-hwv__h2 { font-size: 24px; } }
.fs-hwv__lead { margin-top: 16px; font-family: var(--fs-font-body); font-weight: 400; font-size: 16px; line-height: 1.65; color: #0B0D12; max-width: 820px; margin-left: auto; margin-right: auto; }
.fs-hwv__row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; }
.fs-hwv__step { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; padding: 0 12px; }
.fs-hwv__connector { position: absolute; top: 54px; left: 50%; right: -50%; height: 1px; background: #E4E7EC; z-index: 0; }
.fs-hwv__step-num { font-family: var(--fs-font-body); font-weight: 600; font-size: 10px; letter-spacing: 0.15em; text-transform: uppercase; color: #4B5563; margin-bottom: 12px; }
.fs-hwv__hex { position: relative; width: 64px; height: 64px; }
.fs-hwv__hex-icon { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; }
.fs-hwv__step-label { margin-top: 16px; font-family: var(--fs-font-heading); font-weight: 700; font-size: 18px; color: #0B0D12; }
.fs-hwv__step-desc { margin-top: 8px; font-family: var(--fs-font-body); font-weight: 500; font-size: 13px; color: #374151; line-height: 1.5; max-width: 240px; }
.fs-hwv__bullets { list-style: none; padding: 0; margin: 12px 0 0 0; max-width: 240px; display: flex; flex-direction: column; gap: 6px; text-align: left; }
.fs-hwv__bullets li { position: relative; padding-left: 14px; font-family: var(--fs-font-body); font-size: 12px; line-height: 1.5; color: #4B5563; }
.fs-hwv__bullets li::before { content: ''; position: absolute; left: 0; top: 8px; width: 6px; height: 1px; background: #0E8F7E; }
.fs-hwv__outro { max-width: 820px; margin: 48px auto 0; text-align: center; font-family: var(--fs-font-body); font-weight: 400; font-size: 16px; line-height: 1.65; color: #0B0D12; }
@media (max-width: 767px) { .fs-hwv__row { grid-template-columns: 1fr; gap: 32px; } .fs-hwv__connector { display: none; } }

/* ---- UK Regulations --------------------------------------------------- */
.fs-ukr__eyebrow { font-family: var(--fs-font-body); font-weight: 600; font-size: 11px; letter-spacing: 0.15em; text-transform: uppercase; color: #4B5563; margin-bottom: 8px; }
.fs-ukr__h2 { font-family: var(--fs-font-heading); font-weight: 700; font-size: 32px; color: #0B0D12; margin: 0; }
@media (max-width: 767px) { .fs-ukr__h2 { font-size: 24px; } }
.fs-ukr__lead { margin-top: 16px; font-family: var(--fs-font-body); font-weight: 400; font-size: 16px; line-height: 1.65; color: #0B0D12; max-width: 820px; margin-left: auto; margin-right: auto; }
.fs-ukr__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
@media (max-width: 767px) { .fs-ukr__grid { grid-template-columns: 1fr; } }
.fs-ukr__card { position: relative; background: #F6F7F9; border: 1px solid #E4E7EC; padding: 32px 24px; clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 0 100%); }
.fs-ukr__card-headline { font-family: var(--fs-font-heading); font-weight: 700; font-size: 20px; color: #0B0D12; margin: 16px 0 12px; }
.fs-ukr__card-lede { font-family: var(--fs-font-body); font-weight: 500; font-size: 14px; line-height: 1.55; color: #374151; margin-bottom: 12px; }
.fs-ukr__bullets { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.fs-ukr__bullets li { position: relative; padding-left: 18px; font-family: var(--fs-font-body); font-weight: 400; font-size: 13px; line-height: 1.6; color: #4B5563; }
.fs-ukr__bullets li::before { content: ''; position: absolute; left: 0; top: 8px; width: 8px; height: 1px; background: #0E8F7E; }
.fs-ukr__outro { max-width: 820px; margin: 32px auto 0; text-align: center; font-family: var(--fs-font-body); font-weight: 400; font-size: 16px; line-height: 1.65; color: #0B0D12; }
.fs-ukr__outro a { color: #0E8F7E; text-decoration: none; font-weight: 600; }

/* ---- FAQ accordion ---------------------------------------------------- */
.fs-faq-h2 { font-family: var(--fs-font-heading); font-weight: 700; font-size: 32px; color: #0B0D12; margin: 0; }
@media (max-width: 767px) { .fs-faq-h2 { font-size: 24px; } }
.fs-faq { max-width: 800px; margin: 0 auto; }
.fs-faq__item { background: #F6F7F9; border-bottom: 1px solid #E4E7EC; }
.fs-faq__q {
  display: flex; justify-content: space-between; align-items: center; gap: 16px;
  width: 100%; padding: 20px 24px; font-family: var(--fs-font-body); font-weight: 600;
  font-size: 16px; color: #0B0D12; background: #F6F7F9; cursor: pointer;
  list-style: none; text-align: left; transition: background 200ms;
}
.fs-faq__q::-webkit-details-marker { display: none; }
.fs-faq__item[open] .fs-faq__q { background: #F0F2F5; }
.fs-faq__chevron { flex-shrink: 0; color: #0E8F7E; transition: transform 200ms; }
.fs-faq__item[open] .fs-faq__chevron { transform: rotate(180deg); }
.fs-faq__a { padding: 0 24px 24px; background: #F6F7F9; font-family: var(--fs-font-body); font-weight: 400; font-size: 15px; line-height: 1.65; color: #4B5563; }

/* ---- Author box ------------------------------------------------------- */
.fs-authorbox { position: relative; max-width: 720px; margin: 0 auto; background: #F6F7F9; padding: 32px; border: 1px solid #E4E7EC; clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 0 100%); }
.fs-authorbox__row { display: flex; gap: 24px; align-items: flex-start; }
.fs-authorbox__col { display: flex; flex-direction: column; gap: 12px; flex: 1; }
.fs-authorbox__eyebrow { font-family: var(--fs-font-body); font-weight: 600; font-size: 11px; letter-spacing: 0.15em; text-transform: uppercase; color: #4B5563; }
.fs-authorbox__bio { font-family: var(--fs-font-body); font-weight: 400; font-size: 14px; line-height: 1.65; color: #0B0D12; }
.fs-authorbox__links { display: flex; gap: 16px; align-items: center; flex-wrap: wrap; }
.fs-authorbox__link { font-family: var(--fs-font-body); font-weight: 600; font-size: 13px; text-decoration: none; display: inline-flex; align-items: center; gap: 4px; }
.fs-authorbox__link--accent { color: #0E8F7E; }
.fs-authorbox__link--muted { color: #4B5563; }
@media (max-width: 639px) { .fs-authorbox__row { flex-direction: column; gap: 16px; } }

/* ---- Editorial byline ------------------------------------------------- */
.fs-byline { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; }
.fs-byline__avatar { width: 40px; height: 40px; background: #FFFFFF; border: 1px solid #0E8F7E; display: inline-flex; align-items: center; justify-content: center; overflow: hidden; flex-shrink: 0; }
.fs-byline__avatar img { width: 100%; height: 100%; object-fit: cover; }
.fs-byline__meta { display: inline-flex; flex-direction: column; line-height: 1.2; }
.fs-byline__name { font-family: var(--fs-font-body); font-weight: 600; font-size: 14px; color: #0B0D12; }
.fs-byline__role { font-family: var(--fs-font-body); font-weight: 400; font-size: 12px; color: #4B5563; margin-top: 2px; }

.fs-cta-arrow { display: inline-block; transition: transform 200ms; }
.fs-cta-link:hover .fs-cta-arrow { transform: translateX(4px); }

/* ---- Smooth anchor scrolling ----------------------------------------- */
html { scroll-behavior: smooth; }

/* ---- Page hero -------------------------------------------------------- */
.fs-page-hero { position: relative; padding: 72px 0 40px; overflow: hidden; background: #FFFFFF; }
@media (max-width: 767px) { .fs-page-hero { padding: 48px 0 32px; } }
.fs-page-hero__grid {
  position: absolute; inset: 0; pointer-events: none;
  background-image:
    linear-gradient(rgba(0, 0, 0, 0.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 0, 0, 0.06) 1px, transparent 1px);
  background-size: 48px 48px;
  -webkit-mask-image: radial-gradient(ellipse at top, #000 20%, transparent 75%);
  mask-image: radial-gradient(ellipse at top, #000 20%, transparent 75%);
}
.fs-page-hero__glow { position: absolute; left: 50%; top: -20%; transform: translateX(-50%); width: 720px; height: 320px; filter: blur(60px); pointer-events: none; opacity: 0.55; background: radial-gradient(ellipse, rgba(14, 143, 126, 0.13), transparent 65%); }
.fs-page-hero__inner { position: relative; max-width: 960px; margin: 0 auto; padding: 0 24px; }
.fs-page-eyebrow {
  display: inline-flex; align-items: center; gap: 10px; padding: 5px 10px 5px 6px;
  border: 1px solid #E4E7EC; background: rgba(0, 0, 0, 0.03); font-family: var(--fs-font-heading);
  font-weight: 600; font-size: 10.5px; letter-spacing: 0.18em; text-transform: uppercase;
  color: #0E8F7E; margin-bottom: 14px;
}
.fs-page-eyebrow__bracket { display: inline-block; width: 3px; height: 10px; background: #0E8F7E; }
.fs-page-h1 { font-family: var(--fs-font-heading); font-weight: 700; font-size: 40px; line-height: 1.05; letter-spacing: -0.025em; color: #0B0D12; margin: 0 0 14px 0; }
@media (max-width: 767px) { .fs-page-h1 { font-size: 28px; letter-spacing: -0.02em; } }
.fs-page-sub { font-family: var(--fs-font-body); font-weight: 400; font-size: 16px; line-height: 1.55; color: #374151; margin: 0; max-width: 640px; }
@media (max-width: 767px) { .fs-page-sub { font-size: 15px; } }
.fs-page-hero__rule { margin-top: 24px; height: 1px; background: #E4E7EC; position: relative; max-width: 96px; }
.fs-page-hero__rule span { position: absolute; left: 0; top: -1px; height: 2px; width: 32px; background: #0E8F7E; }

/* ---- Static page primitives ------------------------------------------ */
.fs-page-section { padding: 72px 0; position: relative; }
@media (max-width: 767px) { .fs-page-section { padding: 56px 0; } }
.fs-page-container { max-width: 960px; margin: 0 auto; padding: 0 24px; }
.fs-page-container-narrow { max-width: 760px; margin: 0 auto; padding: 0 24px; }
.fs-page-h2 { font-family: var(--fs-font-heading); font-weight: 700; font-size: 32px; letter-spacing: -0.015em; color: #0B0D12; margin: 0 0 28px 0; position: relative; padding-left: 16px; }
.fs-page-h2::before { content: ''; position: absolute; left: 0; top: 8px; bottom: 8px; width: 3px; background: #0E8F7E; }
@media (max-width: 767px) { .fs-page-h2 { font-size: 24px; padding-left: 12px; } }
.fs-page-h3 { font-family: var(--fs-font-heading); font-weight: 600; font-size: 20px; letter-spacing: -0.01em; color: #0B0D12; margin: 0 0 12px 0; }
.fs-page-p { font-family: var(--fs-font-body); font-weight: 400; font-size: 16px; line-height: 1.7; color: #374151; margin: 0 0 20px 0; }
.fs-page-p:last-child { margin-bottom: 0; }
.fs-page-p strong { color: #0B0D12; font-weight: 600; }
.fs-page-p a { color: #0E8F7E; text-decoration: none; border-bottom: 1px solid rgba(14, 143, 126, 0.3); transition: border-color 160ms ease; }
.fs-page-p a:hover { border-bottom-color: #0E8F7E; }
.fs-page-lead { font-family: var(--fs-font-body); font-size: 14px; color: #4B5563; margin: 0 0 32px 0; }
.fs-page-card { position: relative; background: linear-gradient(180deg, #F6F7F9 0%, #FFFFFF 100%); border: 1px solid #E4E7EC; padding: 28px; clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 0 100%); transition: border-color 200ms ease, transform 200ms ease, box-shadow 200ms ease; }
.fs-page-card:hover { border-color: #0E8F7E; transform: translateY(-2px); box-shadow: 0 18px 38px -24px rgba(11, 13, 18, 0.22); }
.fs-page-corner { position: absolute; top: 0; right: 0; pointer-events: none; }
.fs-page-card__h3 { font-family: var(--fs-font-heading); font-weight: 700; font-size: 18px; color: #0B0D12; margin: 0 0 8px 0; }
.fs-page-card__p { font-family: var(--fs-font-body); font-size: 14px; line-height: 1.55; color: #4B5563; margin: 0; }

/* ---- About page ------------------------------------------------------- */
.fs-about-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 767px) { .fs-about-grid { grid-template-columns: 1fr; } }
.fs-about-coverage { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; }
@media (max-width: 767px) { .fs-about-coverage { grid-template-columns: 1fr; } }
.fs-about-coverage h3 { font-family: var(--fs-font-heading); font-weight: 700; font-size: 16px; margin-bottom: 12px; }
.fs-about-coverage h3.fs-cover { color: #0E8F7E; }
.fs-about-coverage h3.fs-no-cover { color: #4B5563; }
.fs-about-coverage ul { margin: 0; padding: 0; list-style: none; }
.fs-about-coverage li { font-family: var(--fs-font-body); font-size: 15px; color: #0B0D12; line-height: 1.7; }
.fs-contact-cta { display: inline-block; background: #0E8F7E; color: #FFFFFF; padding: 14px 28px; font-family: var(--fs-font-body); font-weight: 700; font-size: 14px; text-transform: uppercase; letter-spacing: 0.05em; text-decoration: none; transition: filter 150ms; }
.fs-contact-cta:hover { filter: brightness(1.1); }

/* ---- Explained page journey ------------------------------------------ */
.fs-exp-journey { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; }
.fs-exp-step { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; padding: 0 12px; }
.fs-exp-step__num { font-family: var(--fs-font-body); font-weight: 600; font-size: 10px; letter-spacing: 0.15em; text-transform: uppercase; color: #4B5563; margin-bottom: 12px; }
.fs-exp-step__hex { position: relative; width: 64px; height: 64px; }
.fs-exp-step__hex-icon { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; }
.fs-exp-step__label { margin-top: 16px; font-family: var(--fs-font-heading); font-weight: 700; font-size: 18px; color: #0B0D12; }
.fs-exp-step__desc { margin-top: 8px; font-family: var(--fs-font-body); font-size: 13px; color: #4B5563; line-height: 1.5; max-width: 200px; }
.fs-exp-connector { position: absolute; top: 54px; left: 50%; right: -50%; height: 1px; background: #E4E7EC; }
@media (max-width: 767px) { .fs-exp-journey { grid-template-columns: 1fr; gap: 32px; } .fs-exp-connector { display: none; } }
.fs-prose { display: flex; flex-direction: column; gap: 18px; }
.fs-prose-narrow { max-width: 800px; margin: 0 auto; }
.fs-prose p { font-family: var(--fs-font-body); font-weight: 400; font-size: 16px; line-height: 1.7; color: #0B0D12; margin: 0; }
.fs-prose h3 { font-family: var(--fs-font-heading); font-weight: 700; font-size: 18px; color: #0B0D12; margin: 8px 0 0 0; }
.fs-prose strong { font-weight: 600; color: #0B0D12; }

/* ---- How We Rate page ------------------------------------------------- */
.fs-rate-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; justify-items: center; }
@media (max-width: 1023px) { .fs-rate-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 639px) { .fs-rate-grid { grid-template-columns: 1fr; } }
.fs-rate-hex-btn { background: transparent; border: none; padding: 0; cursor: pointer; width: 100%; display: flex; justify-content: center; }
.fs-rate-hex { position: relative; width: 100%; max-width: 240px; }
.fs-rate-hex > svg { display: block; width: 100%; height: auto; }
.fs-rate-hex__content { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 16px; }
.fs-rate-hex__label { margin-top: 16px; font-family: var(--fs-font-heading); font-weight: 700; font-size: 16px; letter-spacing: 0.03em; max-width: 180px; }
.fs-rate-hex__weight { margin-top: 4px; font-family: var(--fs-font-body); font-weight: 600; font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: #4B5563; }
.fs-rate-hex__toggle { margin-top: 12px; font-family: var(--fs-font-body); font-weight: 600; font-size: 12px; color: #4B5563; }
.fs-rate-detail { max-width: 800px; margin: 32px auto 0; }
.fs-rate-detail[hidden] { display: none; }
.fs-rate-detail__inner { position: relative; background: #F6F7F9; border: 1px solid #E4E7EC; padding: 32px; clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 0 100%); }
.fs-rate-detail__bar { position: absolute; top: 0; left: 0; right: 0; height: 4px; }
.fs-rate-detail__h3 { font-family: var(--fs-font-heading); font-weight: 700; font-size: 22px; color: #0B0D12; margin: 8px 0 16px 0; }
.fs-rate-detail__inner p { font-family: var(--fs-font-body); font-size: 15px; line-height: 1.65; color: #0B0D12; margin: 0 0 16px 0; }
.fs-rate-bands { margin-top: 24px; display: grid; gap: 1px; background: #E4E7EC; }
.fs-rate-band { background: #FFFFFF; padding: 12px 16px; display: grid; grid-template-columns: 64px 1fr; gap: 16px; align-items: baseline; }
.fs-rate-band__score { font-family: var(--fs-font-heading); font-weight: 700; font-size: 14px; }
.fs-rate-band__desc { font-family: var(--fs-font-body); font-size: 14px; color: #0B0D12; line-height: 1.5; }

/* ---- Legal page layout ------------------------------------------------ */
.fs-legal-section { padding: 16px 0 96px; }
.fs-legal-container { max-width: 1200px; margin: 0 auto; padding: 0 24px; display: grid; grid-template-columns: 240px 1fr; gap: 64px; position: relative; }
.fs-legal-container::before { content: ''; position: absolute; top: 0; bottom: 0; left: calc(240px + 24px + 32px); width: 1px; background: #E4E7EC; }
@media (max-width: 1023px) { .fs-legal-container { grid-template-columns: 1fr; gap: 24px; } .fs-legal-container::before { display: none; } }
.fs-legal-toc { position: sticky; top: 88px; align-self: start; max-width: 240px; }
@media (max-width: 1023px) { .fs-legal-toc { display: none; } }
.fs-legal-toc__label { font-family: var(--fs-font-body); font-weight: 600; font-size: 11px; letter-spacing: 0.15em; text-transform: uppercase; color: #4B5563; margin-bottom: 16px; }
.fs-legal-toc ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.fs-legal-toc a { display: block; font-family: var(--fs-font-body); font-weight: 500; font-size: 14px; color: #4B5563; padding: 6px 0 6px 14px; border-left: 2px solid transparent; text-decoration: none; transition: color 200ms ease, border-color 200ms ease; }
.fs-legal-toc a:hover { color: #0B0D12; }
.fs-legal-toc a.is-active { color: #0B0D12; border-left-color: #0E8F7E; }
.fs-legal-mobile-toc { display: none; position: sticky; top: 64px; z-index: 20; background: #FFFFFF; margin-bottom: 16px; }
@media (max-width: 1023px) { .fs-legal-mobile-toc { display: block; } }
.fs-legal-mobile-toc summary { width: 100%; background: #F6F7F9; border: 1px solid #E4E7EC; color: #0B0D12; font-family: var(--fs-font-body); font-weight: 600; font-size: 14px; padding: 12px 16px; cursor: pointer; list-style: none; }
.fs-legal-mobile-toc summary::-webkit-details-marker { display: none; }
.fs-legal-mobile-toc ul { list-style: none; margin: 0; padding: 0; background: #F6F7F9; border: 1px solid #E4E7EC; border-top: none; max-height: 320px; overflow-y: auto; }
.fs-legal-mobile-toc a { display: block; padding: 10px 16px; font-family: var(--fs-font-body); font-size: 14px; color: #0B0D12; text-decoration: none; border-top: 1px solid #E4E7EC; }
.fs-legal-main { min-width: 0; }
.fs-legal-block { margin-bottom: 48px; scroll-margin-top: 96px; }
.fs-legal-block:last-child { margin-bottom: 0; }
.fs-legal-h2 { font-family: var(--fs-font-heading); font-weight: 700; font-size: 28px; color: #0B0D12; margin: 0 0 20px 0; scroll-margin-top: 96px; }
@media (max-width: 767px) { .fs-legal-h2 { font-size: 22px; } }
.fs-legal-content p { font-family: var(--fs-font-body); font-weight: 400; font-size: 16px; line-height: 1.7; color: #0B0D12; margin: 0 0 16px 0; }
.fs-legal-content p:last-child { margin-bottom: 0; }
.fs-legal-content strong { font-weight: 700; color: #0B0D12; }
.fs-legal-content ul { list-style: none; margin: 0 0 16px 0; padding: 0; }
.fs-legal-content ul li { font-family: var(--fs-font-body); font-weight: 400; font-size: 15px; line-height: 1.8; color: #0B0D12; padding-left: 20px; position: relative; }
.fs-legal-content ul li::before { content: ''; position: absolute; left: 0; top: 12px; width: 6px; height: 6px; background: #4B5563; }
.fs-legal-content a { color: #0E8F7E; font-weight: 600; text-decoration: none; }
.fs-legal-content a:hover { text-decoration: underline; }
.fs-legal-updated { font-family: var(--fs-font-body); font-size: 13px; color: #4B5563; margin-top: 8px; }
.fs-cookie-table { margin: 16px 0; width: 100%; background: #F6F7F9; border: 1px solid #E4E7EC; }
.fs-cookie-table__row { display: grid; grid-template-columns: 1.2fr 1.2fr 2.4fr 1fr; border-top: 1px solid #E4E7EC; }
.fs-cookie-table__row:first-child { border-top: none; }
.fs-cookie-table__row--head { background: #FFFFFF; }
.fs-cookie-table__cell { padding: 12px 16px; font-family: var(--fs-font-body); font-weight: 400; font-size: 14px; color: #0B0D12; line-height: 1.5; }
.fs-cookie-table__row--head .fs-cookie-table__cell { font-weight: 600; font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; color: #4B5563; }
@media (max-width: 767px) { .fs-cookie-table__row { grid-template-columns: 1fr 1fr; } }
.fs-cookie-btn { margin-top: 16px; background: #0E8F7E; color: #FFFFFF; border: none; padding: 12px 24px; font-family: var(--fs-font-body); font-weight: 700; font-size: 14px; text-transform: uppercase; letter-spacing: 0.05em; cursor: pointer; transition: filter 200ms ease; }
.fs-cookie-btn:hover { filter: brightness(1.1); }

/* ---- Contact page ----------------------------------------------------- */
.fs-contact-section { padding: 0 0 96px; }
.fs-contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: start; }
@media (max-width: 1023px) { .fs-contact-grid { grid-template-columns: 1fr; gap: 48px; } }
.fs-contact-form-h3 { font-family: var(--fs-font-heading); font-weight: 700; font-size: 20px; color: #0B0D12; margin: 0 0 24px 0; }
.fs-contact-field { margin-bottom: 20px; }
.fs-contact-label { display: block; font-family: var(--fs-font-body); font-weight: 600; font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: #4B5563; margin-bottom: 6px; }
.fs-contact-input { width: 100%; background: #FFFFFF; border: 1px solid #E4E7EC; padding: 12px 14px; color: #0B0D12; font-family: var(--fs-font-body); font-weight: 400; font-size: 15px; outline: none; transition: border-color 200ms ease; box-sizing: border-box; }
.fs-contact-input:focus { border-color: #0E8F7E; }
.fs-contact-input.is-error { border-color: #FF6B6B; }
textarea.fs-contact-input { resize: vertical; min-height: 140px; }
.fs-contact-error { color: #FF6B6B; font-family: var(--fs-font-body); font-weight: 400; font-size: 12px; margin-top: 4px; }
.fs-contact-submit { width: 100%; margin-top: 24px; background: #0E8F7E; color: #0B0D12; border: none; padding: 14px 0; font-family: var(--fs-font-body); font-weight: 700; font-size: 14px; text-transform: uppercase; letter-spacing: 0.05em; cursor: pointer; transition: filter 200ms ease; }
.fs-contact-submit:hover { filter: brightness(1.1); }
.fs-contact-success { text-align: center; padding: 24px 0; }
.fs-contact-success h3 { font-family: var(--fs-font-heading); font-weight: 700; font-size: 22px; color: #0B0D12; margin: 16px 0 0 0; }
.fs-contact-success p { font-family: var(--fs-font-body); font-weight: 400; font-size: 15px; color: #4B5563; margin: 8px auto 0; max-width: 320px; }
.fs-contact-info { display: flex; flex-direction: column; gap: 32px; }
.fs-contact-small-label { font-family: var(--fs-font-body); font-weight: 600; font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: #4B5563; }
.fs-contact-info h3 { font-family: var(--fs-font-heading); font-weight: 700; font-size: 20px; color: #0B0D12; margin: 4px 0 0 0; }
.fs-contact-info p { font-family: var(--fs-font-body); font-weight: 400; font-size: 15px; line-height: 1.65; color: #4B5563; margin: 12px 0 0 0; }
.fs-contact-list { list-style: none; margin: 12px 0 0 0; padding: 0; }
.fs-contact-list li { font-family: var(--fs-font-body); font-weight: 400; font-size: 15px; line-height: 1.7; color: #0B0D12; padding: 4px 0; }
.fs-contact-list a { color: #0E8F7E; font-weight: 600; text-decoration: none; }
.fs-contact-note { background: #FFFFFF; border: 1px solid #E4E7EC; padding: 16px; font-family: var(--fs-font-body); font-weight: 400; font-size: 13px; color: #4B5563; line-height: 1.6; }
.fs-contact-note a { color: #0E8F7E; font-weight: 600; text-decoration: none; }

/* ---- Affiliate disclosure page --------------------------------------- */
.fs-aff-section { padding: 48px 0; }
.fs-aff-section--last { padding-bottom: 96px; }
.fs-aff-narrow { max-width: 720px; margin: 0 auto; padding: 0 24px; }
.fs-aff-wide { max-width: 1100px; margin: 0 auto; padding: 0 24px; }
.fs-aff-h2 { font-family: var(--fs-font-heading); font-weight: 700; font-size: 28px; color: #0B0D12; margin: 0 0 24px 0; }
.fs-aff-p { font-family: var(--fs-font-body); font-weight: 400; font-size: 16px; line-height: 1.7; color: #0B0D12; margin: 0 0 18px 0; }
.fs-aff-p:last-child { margin-bottom: 0; }
.fs-aff-p a { color: #0E8F7E; font-weight: 600; text-decoration: none; }
.fs-aff-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; }
@media (max-width: 767px) { .fs-aff-steps { grid-template-columns: 1fr; } }
.fs-aff-step { background: #F6F7F9; border: 1px solid #E4E7EC; padding: 28px; clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 0 100%); }
.fs-aff-hex { width: 56px; height: 56px; background: rgba(0, 240, 200, 0.08); border: 1px solid rgba(0, 240, 200, 0.3); display: flex; align-items: center; justify-content: center; clip-path: polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%); }
.fs-aff-step__n { font-family: var(--fs-font-body); font-weight: 600; font-size: 11px; letter-spacing: 0.15em; color: #4B5563; margin-top: 16px; }
.fs-aff-step__label { font-family: var(--fs-font-heading); font-weight: 700; font-size: 20px; color: #0B0D12; margin: 8px 0 12px 0; }
.fs-aff-step__desc { font-family: var(--fs-font-body); font-weight: 400; font-size: 15px; line-height: 1.65; color: #4B5563; margin: 0; }
.fs-aff-twocol { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; }
@media (max-width: 767px) { .fs-aff-twocol { grid-template-columns: 1fr; } }
.fs-aff-col-head { font-family: var(--fs-font-heading); font-weight: 700; font-size: 16px; margin-bottom: 12px; }
.fs-aff-col-head--yes { color: #0E8F7E; }
.fs-aff-col-head--no { color: #4B5563; }
.fs-aff-ul { list-style: none; margin: 0; padding: 0; }
.fs-aff-ul li { font-family: var(--fs-font-body); font-weight: 400; font-size: 15px; line-height: 1.7; color: #0B0D12; padding: 6px 0 6px 20px; position: relative; }
.fs-aff-ul li::before { content: ''; position: absolute; left: 0; top: 14px; width: 8px; height: 1px; background: #0E8F7E; }
.fs-aff-ul a { color: #0E8F7E; font-weight: 600; text-decoration: none; }
.fs-aff-section--center { text-align: center; }
.fs-aff-section--center .fs-aff-p { max-width: 600px; margin-left: auto; margin-right: auto; }

/* ---- Responsible gambling page --------------------------------------- */
.fs-rg-block { margin-top: 24px; }
.fs-rg-block h3 { font-family: var(--fs-font-heading); font-weight: 600; font-size: 16px; color: #0B0D12; margin: 0 0 6px 0; }
.fs-rg-block p { font-family: var(--fs-font-body); font-weight: 400; font-size: 15px; line-height: 1.7; color: #0B0D12; margin: 0; }
.fs-rg-block p a { color: #0B0D12; text-decoration: underline; }
.fs-rg-warn h3 { display: flex; align-items: center; gap: 10px; }
.fs-rg-warn-dot { display: inline-block; width: 8px; height: 8px; background: #FFB020; flex-shrink: 0; }
.fs-rg-warn p { padding-left: 18px; }
.fs-rg-org-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 767px) { .fs-rg-org-grid { grid-template-columns: 1fr; } }
.fs-rg-org { background: #F6F7F9; padding: 32px; border: 1px solid #E4E7EC; }
.fs-rg-org h3 { font-family: var(--fs-font-heading); font-weight: 700; font-size: 22px; color: #0B0D12; margin: 0; }
.fs-rg-org p { font-family: var(--fs-font-body); font-size: 14px; color: #0B0D12; margin: 12px 0 0 0; line-height: 1.7; }
.fs-rg-org__contact { margin-top: 16px; font-family: var(--fs-font-body); font-weight: 600; font-size: 15px; color: #0B0D12; }
.fs-rg-link { font-family: var(--fs-font-body); font-weight: 600; font-size: 14px; color: #0B0D12; text-decoration: underline; transition: opacity 150ms; display: inline-block; margin-top: 16px; }
.fs-rg-link:hover { opacity: 0.85; }
.fs-rg-check { background: #F6F7F9; padding: 32px; border: 1px solid #E4E7EC; }
.fs-rg-check__list { display: flex; flex-direction: column; gap: 16px; }
.fs-rg-check__row { display: flex; gap: 12px; align-items: flex-start; cursor: pointer; }
.fs-rg-check__box { flex-shrink: 0; margin-top: 2px; width: 16px; height: 16px; border: 1.5px solid #0B0D12; background: transparent; display: inline-flex; align-items: center; justify-content: center; color: #FFFFFF; font-size: 12px; font-weight: 700; line-height: 1; }
.fs-rg-check__row input { position: absolute; opacity: 0; pointer-events: none; }
.fs-rg-check__row input:checked + .fs-rg-check__box { background: #0B0D12; }
.fs-rg-check__q { font-family: var(--fs-font-body); font-size: 15px; color: #0B0D12; line-height: 1.55; }
.fs-rg-check__count { margin-top: 24px; font-family: var(--fs-font-heading); font-weight: 700; font-size: 16px; color: #0B0D12; }
.fs-rg-check__message { margin-top: 12px; background: #FFFFFF; border: 1px solid #E4E7EC; padding: 16px; font-family: var(--fs-font-body); font-size: 14px; color: #0B0D12; line-height: 1.55; }
.fs-rg-closing { font-family: var(--fs-font-body); font-size: 14px; color: #4B5563; font-style: italic; margin-top: 16px; }

/* ---- Author page ------------------------------------------------------ */
.fs-author-page { background: #FFFFFF; padding: 96px 0; }
@media (max-width: 767px) { .fs-author-page { padding: 64px 0; } }
.fs-author-inner { max-width: 880px; margin: 0 auto; padding: 0 24px; }
.fs-author-hero { display: flex; gap: 32px; align-items: flex-start; }
@media (max-width: 767px) { .fs-author-hero { flex-direction: column; gap: 24px; } }
.fs-author-photo-col { width: 160px; flex-shrink: 0; }
.fs-author-photo { width: 128px; height: 128px; background: #FFFFFF; border: 2px solid #0E8F7E; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.fs-author-photo img { width: 100%; height: 100%; object-fit: cover; }
.fs-author-verified { margin-top: 12px; display: flex; align-items: center; justify-content: center; gap: 6px; }
.fs-author-verified__dot { width: 6px; height: 6px; background: #0E8F7E; display: inline-block; }
.fs-author-verified__text { font-family: var(--fs-font-body); font-weight: 600; font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; color: #4B5563; }
.fs-author-text { flex: 1; }
.fs-author-eyebrow { font-family: var(--fs-font-body); font-weight: 600; font-size: 11px; letter-spacing: 0.15em; text-transform: uppercase; color: #4B5563; }
.fs-author-h1 { font-family: var(--fs-font-heading); font-weight: 700; font-size: 40px; color: #0B0D12; margin: 8px 0 0; }
@media (max-width: 767px) { .fs-author-h1 { font-size: 32px; } }
.fs-author-role { font-family: var(--fs-font-heading); font-weight: 500; font-size: 18px; color: #4B5563; margin-top: 4px; }
.fs-author-socials { margin-top: 12px; display: flex; flex-wrap: wrap; gap: 8px; }
.fs-author-social { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; background: #F6F7F9; border: 1px solid #E4E7EC; text-decoration: none; transition: background 200ms; }
.fs-author-social:hover { background: #F0F2F5; }
.fs-author-bio-short { max-width: 640px; margin-top: 16px; font-family: var(--fs-font-body); font-weight: 400; font-size: 15px; line-height: 1.65; color: #0B0D12; }
.fs-author-meta { margin-top: 16px; display: flex; flex-wrap: wrap; gap: 16px; }
.fs-author-tile { background: #F6F7F9; padding: 8px 12px; border: 1px solid #E4E7EC; }
.fs-author-tile__label { font-family: var(--fs-font-body); font-weight: 600; font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: #4B5563; }
.fs-author-tile__value { font-family: var(--fs-font-heading); font-weight: 700; font-size: 14px; color: #0B0D12; margin-top: 2px; }
.fs-author-section { margin-top: 64px; }
.fs-author-h2 { font-family: var(--fs-font-heading); font-weight: 700; font-size: 28px; color: #0B0D12; margin: 0 0 16px; }
@media (max-width: 767px) { .fs-author-h2 { font-size: 22px; } }
.fs-author-h3 { font-family: var(--fs-font-heading); font-weight: 600; font-size: 18px; color: #0B0D12; margin: 0; }
.fs-author-bio { max-width: 720px; }
.fs-author-bio p { font-family: var(--fs-font-body); font-weight: 400; font-size: 16px; line-height: 1.7; color: #0B0D12; margin: 16px 0 0; }
.fs-author-two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; }
@media (max-width: 767px) { .fs-author-two-col { grid-template-columns: 1fr; gap: 32px; } }
.fs-author-creds { list-style: none; padding: 0; margin: 16px 0 0; display: flex; flex-direction: column; gap: 12px; }
.fs-author-creds li { display: flex; align-items: center; gap: 12px; }
.fs-author-creds span { font-family: var(--fs-font-body); font-weight: 500; font-size: 14px; color: #0B0D12; }
.fs-author-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.fs-author-tag { padding: 6px 12px; border: 1px solid #0E8F7E; color: #0E8F7E; font-family: var(--fs-font-body); font-weight: 600; font-size: 12px; letter-spacing: 0.05em; text-transform: uppercase; }
.fs-author-standards { max-width: 720px; font-family: var(--fs-font-body); font-weight: 400; font-size: 16px; line-height: 1.7; color: #0B0D12; margin: 16px 0 0; }
.fs-author-standards a { color: #0E8F7E; text-decoration: none; }
.fs-author-cta-row { margin-top: 16px; display: flex; flex-wrap: wrap; gap: 12px; }
.fs-author-cta-row a { color: #0E8F7E; text-decoration: none; font-family: var(--fs-font-body); font-weight: 600; font-size: 14px; }

/* ---- 404 -------------------------------------------------------------- */
.fs-404__inner { max-width: 640px; margin: 0 auto; padding: 80px 24px; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 24px; }
.fs-404__hex { position: relative; width: 200px; height: 200px; }
.fs-404__hex svg { display: block; }
.fs-404__code { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-family: var(--fs-font-heading); font-weight: 700; font-size: 64px; color: #0E8F7E; }
.fs-404__title { font-family: var(--fs-font-heading); font-size: 36px; font-weight: 700; color: #0B0D12; margin: 0; }
.fs-404__text { font-family: var(--fs-font-body); font-size: 16px; color: #4B5563; max-width: 480px; margin: 0; }
.fs-404__actions { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; }
.fs-404__btn { padding: 12px 20px; font-family: var(--fs-font-body); font-weight: 600; font-size: 14px; text-decoration: none; }
.fs-404__btn--primary { background: #0E8F7E; color: #FFFFFF; }
.fs-404__btn--accent { background: transparent; border: 1px solid #0E8F7E; color: #0E8F7E; }
.fs-404__btn--ghost { background: transparent; border: 1px solid #E4E7EC; color: #0B0D12; }

/* =========================================================================
   v1.1 — Casino grid empty state
   ========================================================================= */
.fs-offer-grid--empty {
	display: block;
	padding: 32px 24px;
	border: 1px dashed #E4E7EC;
	background: #F6F7F9;
	text-align: center;
}
.fs-offer-grid--empty p {
	font-family: var(--fs-font-body);
	font-weight: 500;
	font-size: 14px;
	color: #4B5563;
	margin: 0;
}
.fs-offer-grid--empty em {
	color: #0B0D12;
	font-style: normal;
	font-weight: 600;
}

/* =========================================================================
   v1.2 — Body prose, sub-page layout, hub layout
   ========================================================================= */

.fs-prose { max-width: 100%; }
.fs-body-p {
	font-family: var(--fs-font-body);
	font-weight: 400;
	font-size: 16px;
	line-height: 1.75;
	color: #374151;
	margin: 0 0 18px 0;
}
.fs-body-p--lead        { font-size: 17px; line-height: 1.7; }
.fs-body-p--dark        { font-size: 17px; line-height: 1.7; color: #0B0D12; font-weight: 500; }
.fs-body-p--small-muted { font-size: 13px; color: #4B5563; line-height: 1.65; margin-top: 8px; }
.fs-body-p strong       { color: #0B0D12; font-weight: 600; }
.fs-body-p a            { color: #0E8F7E; text-decoration: none; border-bottom: 1px solid rgba(14, 143, 126, 0.3); }
.fs-body-p a:hover      { border-bottom-color: #0E8F7E; }

.fs-body-h3 {
	font-family: var(--fs-font-heading);
	font-weight: 700;
	font-size: 22px;
	line-height: 1.25;
	color: #0B0D12;
	margin: 36px 0 14px 0;
	letter-spacing: -0.01em;
}
.fs-body-h4 {
	font-family: var(--fs-font-heading);
	font-weight: 600;
	font-size: 18px;
	line-height: 1.3;
	color: #0B0D12;
	margin: 28px 0 10px 0;
}

.fs-body-table-wrap {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	margin: 8px 0 28px 0;
	border: 1px solid #E4E7EC;
	max-width: 100%;
}
.fs-body-table {
	width: 100%;
	min-width: 720px;
	border-collapse: collapse;
	font-family: var(--fs-font-body);
	font-size: 14px;
	color: #374151;
	background: #FFFFFF;
}
.fs-body-th {
	text-align: left;
	padding: 12px 14px;
	border-bottom: 1px solid #E4E7EC;
	color: #0B0D12;
	font-weight: 600;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	background: #F9FAFB;
	white-space: nowrap;
}
.fs-body-td {
	padding: 12px 14px;
	border-bottom: 1px solid #E4E7EC;
	vertical-align: top;
	white-space: nowrap;
}
.fs-body-img {
	display: block;
	width: 100%;
	height: auto;
	max-width: 720px;
	margin: 12px 0 16px 0;
	border: 1px solid #E4E7EC;
}
.fs-body-ul, .fs-body-ol {
	font-family: var(--fs-font-body);
	font-weight: 400;
	font-size: 16px;
	line-height: 1.75;
	color: #374151;
	margin: 0 0 18px 0;
	padding-left: 22px;
}
.fs-body-ul { list-style: disc; }
.fs-body-ol { list-style: decimal; }
.fs-body-ul li, .fs-body-ol li { margin-bottom: 4px; }

/* ---- Sub-page layout ---------------------------------------------------- */
.fs-subpage__intro     { padding: 24px 0 0; }
.fs-subpage__grid-wrap { margin-top: 64px; }
.fs-subpage__main      { padding: 64px 0 0; }
.fs-subpage__main-heading {
	font-family: var(--fs-font-heading);
	font-weight: 700;
	font-size: 28px;
	line-height: 1.2;
	color: #0B0D12;
	margin: 0 0 20px 0;
	letter-spacing: -0.01em;
}
.fs-subpage__faq       { margin-top: 96px; }
.fs-subpage__faq-heading {
	font-family: var(--fs-font-heading);
	font-weight: 700;
	font-size: 28px;
	color: #0B0D12;
	margin: 0 0 24px 0;
	text-align: center;
}
.fs-subpage__author    { margin-top: 96px; margin-bottom: 96px; }
.fs-subpage__eyebrow {
	font-family: var(--fs-font-body);
	font-weight: 600;
	font-size: 11px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	margin-bottom: 12px;
}

/* ---- Sub-page FAQ (native <details>) ------------------------------------ */
.fs-subpage-faq { max-width: 800px; margin: 0 auto; }
.fs-subpage-faq__item { background: #F6F7F9; border-bottom: 1px solid #E4E7EC; }
.fs-subpage-faq__q {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
	padding: 18px 24px;
	font-family: var(--fs-font-body);
	font-weight: 600;
	font-size: 16px;
	color: #0B0D12;
	background: #F6F7F9;
	cursor: pointer;
	list-style: none;
	text-align: left;
	transition: background 200ms;
}
.fs-subpage-faq__q::-webkit-details-marker { display: none; }
.fs-subpage-faq__item[open] .fs-subpage-faq__q { background: #F0F2F5; }
.fs-subpage-faq__chev { flex-shrink: 0; color: #0E8F7E; transition: transform 200ms; }
.fs-subpage-faq__item[open] .fs-subpage-faq__chev { transform: rotate(180deg); }
.fs-subpage-faq__a {
	padding: 0 24px 20px;
	background: #F6F7F9;
	font-family: var(--fs-font-body);
	font-weight: 400;
	font-size: 15px;
	line-height: 1.65;
	color: #4B5563;
}

/* ---- Hub layout --------------------------------------------------------- */
.fs-hub__trust { padding: 16px 0 0; }
.fs-hub__trust > .fs-container {
	display: flex;
	gap: 16px;
	flex-wrap: wrap;
	font-family: var(--fs-font-body);
	font-weight: 600;
	font-size: 12px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #4B5563;
}
.fs-hub__trust-sep { color: #E4E7EC; }
.fs-hub__intro     { padding: 40px 0 0; }
.fs-hub__intro .fs-body-p { font-size: 17px; line-height: 1.7; }
.fs-hub__grid-wrap { padding: 40px 0; }
.fs-hub__grid-meta { font-family: var(--fs-font-body); font-weight: 400; font-size: 14px; color: #4B5563; margin-bottom: 16px; padding: 0 24px; }
.fs-hub__h2 { font-family: var(--fs-font-heading); font-weight: 700; font-size: 28px; color: #0B0D12; margin: 0 0 24px 0; }
@media (max-width: 767px) { .fs-hub__h2 { font-size: 22px; } }

.fs-hub__subgrid { padding: 48px 0; background: #FFFFFF; }
.fs-hub__subgrid-heading { font-family: var(--fs-font-heading); font-weight: 700; font-size: 28px; margin: 0 0 24px 0; }
.fs-hub__subgrid-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 14px; }
@media (max-width: 599px) {
	.fs-hub__subgrid-list { grid-template-columns: 1fr 1fr !important; gap: 10px !important; }
	.fs-hub__subtile-desc { display: none !important; }
}
/* v1.4.3 — image-topped tiles, matching Lovable's SubPageGrid.tsx */
.fs-hub__subtile {
	position: relative; display: block; background: #F6F7F9; padding: 0;
	border: 1px solid #E4E7EC; text-decoration: none;
	clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 0 100%);
	overflow: hidden;
	transition: background 200ms ease;
}
.fs-hub__subtile:hover { background: #F0F2F5; }
.fs-hub__subtile-image {
	position: relative;
	width: 100%;
	height: 120px;
	overflow: hidden;
	border-bottom: 1px solid #E4E7EC;
}
.fs-hub__subtile-image img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.fs-hub__subtile-image-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(22,25,31,0) 40%, rgba(22,25,31,0.85) 100%);
}
.fs-hub__subtile-corner { position: absolute; top: 0; right: 0; pointer-events: none; z-index: 2; }
.fs-hub__subtile-inner  { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; padding: 20px; }
.fs-hub__subtile-text   { flex: 1; }
.fs-hub__subtile-name   { font-family: var(--fs-font-heading); font-weight: 700; font-size: 16px; margin-bottom: 6px; }
.fs-hub__subtile-desc   { font-family: var(--fs-font-body); font-weight: 400; font-size: 13px; line-height: 1.5; color: #4B5563; }
.fs-hub__subtile-arrow  { flex-shrink: 0; margin-top: 2px; }

.fs-hub__timeline { padding: 48px 0; }
.fs-hub__timeline-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 16px; }
.fs-hub__timeline-step {
	position: relative; background: #F6F7F9; border: 1px solid #E4E7EC;
	padding: 20px; text-align: center;
	clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 0 100%);
}
.fs-hub__timeline-num { display: inline-block; width: 32px; height: 32px; line-height: 32px; color: #0B0D12; font-family: var(--fs-font-body); font-weight: 700; font-size: 14px; margin-bottom: 12px; }
.fs-hub__timeline-label { font-family: var(--fs-font-heading); font-weight: 700; font-size: 14px; color: #0B0D12; }

.fs-hub__terms { padding: 48px 0; background: #FFFFFF; }
.fs-hub__terms-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; }
.fs-hub__term {
	position: relative; background: #F6F7F9; border: 1px solid #E4E7EC; padding: 20px;
	clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 0 100%);
}
.fs-hub__term-name { font-family: var(--fs-font-heading); font-weight: 700; font-size: 16px; margin-bottom: 8px; }
.fs-hub__term-desc { font-family: var(--fs-font-body); font-weight: 400; font-size: 14px; line-height: 1.55; color: #0B0D12; }

.fs-hub__compare { padding: 48px 0; }
.fs-hub__compare-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; }
.fs-hub__compare-tile {
	position: relative; background: #F6F7F9; border: 1px solid #E4E7EC; padding: 24px;
	clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 0 100%);
}
.fs-hub__compare-name { font-family: var(--fs-font-heading); font-weight: 700; font-size: 18px; margin-bottom: 8px; }
.fs-hub__compare-desc { font-family: var(--fs-font-body); font-weight: 400; font-size: 13px; line-height: 1.55; color: #4B5563; margin-bottom: 16px; }
.fs-hub__compare-link { font-family: var(--fs-font-body); font-weight: 700; font-size: 13px; text-decoration: none; }

.fs-hub__faq { padding: 48px 0; }
.fs-hub__faq .fs-subpage-faq { margin-top: 0; }
.fs-hub__author { padding: 48px 0 96px; }

/* =========================================================================
   v1.3 — Author page template (template-author.php) + AuthorBox shortcode
   Replaces Sprint 1's .fs-authorbox / .fs-author-* class families. The old
   Sprint 1 classes remain in this file (above) but are no longer used by
   any template that ships in v1.3.
   ========================================================================= */

/* ---- Shared MetaTile (used in author hero) ----------------------------- */
.fs-meta-tile {
	background: #F6F7F9;
	padding: 8px 12px;
	border: 1px solid #E4E7EC;
}
.fs-meta-tile__label {
	font-family: var(--fs-font-body);
	font-weight: 600;
	font-size: 10px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: #4B5563;
}
.fs-meta-tile__value {
	font-family: var(--fs-font-heading);
	font-weight: 700;
	font-size: 14px;
	color: #0B0D12;
	margin-top: 2px;
}

/* ---- Author page template ---------------------------------------------- */
.fs-author-page {
	background: #FFFFFF;
	padding: 96px 0;
}
@media (max-width: 767px) {
	.fs-author-page { padding: 64px 0; }
}
.fs-author-page__inner {
	max-width: 880px;
	margin: 0 auto;
	padding: 0 24px;
}

.fs-author-page__hero {
	display: flex;
	gap: 32px;
	align-items: flex-start;
}
@media (max-width: 767px) {
	.fs-author-page__hero { flex-direction: column; gap: 24px; }
}
.fs-author-page__hero-photo { width: 160px; flex-shrink: 0; }
.fs-author-page__avatar {
	width: 128px;
	height: 128px;
	background: #FFFFFF;
	border: 2px solid #0E8F7E;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}
.fs-author-page__avatar img { width: 100%; height: 100%; object-fit: cover; }
.fs-author-page__verified {
	margin-top: 12px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
}
.fs-author-page__verified-dot { width: 6px; height: 6px; background: #0E8F7E; display: inline-block; }
.fs-author-page__verified-text {
	font-family: var(--fs-font-body);
	font-weight: 600;
	font-size: 10px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: #4B5563;
}

.fs-author-page__hero-text { flex: 1; }
.fs-author-page__eyebrow {
	font-family: var(--fs-font-body);
	font-weight: 600;
	font-size: 11px;
	letter-spacing: 0.15em;
	text-transform: uppercase;
	color: #4B5563;
}
.fs-author-page__h1 {
	font-family: var(--fs-font-heading);
	font-weight: 700;
	font-size: 40px;
	color: #0B0D12;
	margin: 8px 0 0;
}
@media (max-width: 767px) { .fs-author-page__h1 { font-size: 32px; } }
.fs-author-page__role {
	font-family: var(--fs-font-heading);
	font-weight: 500;
	font-size: 18px;
	color: #4B5563;
	margin-top: 4px;
}
.fs-author-page__socials {
	margin-top: 12px;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}
.fs-author-page__social-link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 14px;
	background: #F6F7F9;
	border: 1px solid #E4E7EC;
	text-decoration: none;
	transition: background 200ms;
}
.fs-author-page__social-link:hover { background: #F0F2F5; }
.fs-author-page__social-x {
	font-family: var(--fs-font-body);
	font-weight: 800;
	font-size: 13px;
	line-height: 1;
	color: #0E8F7E;
}
.fs-author-page__intro {
	max-width: 640px;
	margin-top: 16px;
}
.fs-author-page__intro p {
	font-family: var(--fs-font-body);
	font-weight: 400;
	font-size: 15px;
	line-height: 1.65;
	color: #0B0D12;
	margin: 0;
}
.fs-author-page__intro a {
	color: #0E8F7E;
	text-decoration: none;
	border-bottom: 1px solid rgba(14, 143, 126, 0.3);
}
.fs-author-page__intro a:hover { border-bottom-color: #0E8F7E; }
.fs-author-page__meta-tiles {
	margin-top: 16px;
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
}

.fs-author-page__bio { margin-top: 64px; }
.fs-author-page__h2 {
	font-family: var(--fs-font-heading);
	font-weight: 700;
	font-size: 28px;
	color: #0B0D12;
	margin: 0 0 16px;
}
@media (max-width: 767px) { .fs-author-page__h2 { font-size: 22px; } }
.fs-author-page__bio-body { max-width: 720px; }
.fs-author-page__bio-body p {
	font-family: var(--fs-font-body);
	font-weight: 400;
	font-size: 16px;
	line-height: 1.7;
	color: #0B0D12;
	margin: 16px 0 0;
}
.fs-author-page__bio-body p:first-child { margin-top: 0; }

.fs-author-page__creds {
	margin-top: 64px;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 48px;
}
@media (max-width: 767px) {
	.fs-author-page__creds { grid-template-columns: 1fr; gap: 32px; }
}
.fs-author-page__h3 {
	font-family: var(--fs-font-heading);
	font-weight: 600;
	font-size: 18px;
	color: #0B0D12;
	margin: 0;
}
.fs-author-page__creds-list {
	list-style: none;
	padding: 0;
	margin: 16px 0 0;
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.fs-author-page__creds-item {
	display: flex;
	align-items: center;
	gap: 12px;
}
.fs-author-page__creds-item span {
	font-family: var(--fs-font-body);
	font-weight: 500;
	font-size: 14px;
	color: #0B0D12;
}
.fs-author-page__exp-list {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 16px;
}
.fs-author-page__exp-pill {
	padding: 6px 12px;
	border: 1px solid #0E8F7E;
	color: #0E8F7E;
	font-family: var(--fs-font-body);
	font-weight: 600;
	font-size: 12px;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}

.fs-author-page__standards { margin-top: 64px; }
.fs-author-page__standards-body { max-width: 720px; }
.fs-author-page__standards-body p {
	font-family: var(--fs-font-body);
	font-weight: 400;
	font-size: 16px;
	line-height: 1.7;
	color: #0B0D12;
	margin: 16px 0 0;
}
.fs-author-page__standards-body p:first-child { margin-top: 0; }
.fs-author-page__standards-body a { color: #0E8F7E; text-decoration: none; }
.fs-author-page__standards-body a:hover { text-decoration: underline; }
.fs-author-page__standards-cta {
	margin-top: 16px;
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}
.fs-author-page__standards-cta a {
	color: #0E8F7E;
	text-decoration: none;
	font-family: var(--fs-font-body);
	font-weight: 600;
	font-size: 14px;
}

/* ---- AuthorBox shortcode (auto-injected on home + hubs + sub-pages) ----- */
.fs-author-box {
	padding: 80px 0;
	background: #FFFFFF;
}
@media (max-width: 767px) { .fs-author-box { padding: 64px 0; } }
.fs-author-box__inner {
	position: relative;
	max-width: 720px;
	margin: 0 auto;
	background: #F6F7F9;
	padding: 32px;
	border: 1px solid #E4E7EC;
	clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 0 100%);
}
.fs-author-box__corner {
	position: absolute;
	top: 0;
	right: 0;
	pointer-events: none;
}
.fs-author-box__row {
	display: flex;
	gap: 24px;
	align-items: flex-start;
}
@media (max-width: 639px) { .fs-author-box__row { flex-direction: column; gap: 16px; } }
.fs-author-box__content {
	display: flex;
	flex-direction: column;
	gap: 12px;
	flex: 1;
}
.fs-author-box__eyebrow {
	font-family: var(--fs-font-body);
	font-weight: 600;
	font-size: 11px;
	letter-spacing: 0.15em;
	text-transform: uppercase;
	color: #4B5563;
}
.fs-author-box__byline {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	text-decoration: none;
}
.fs-author-box__avatar {
	width: 40px;
	height: 40px;
	background: #FFFFFF;
	border: 1px solid #0E8F7E;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	flex-shrink: 0;
}
.fs-author-box__avatar img { width: 100%; height: 100%; object-fit: cover; }
.fs-author-box__byline-text {
	display: inline-flex;
	flex-direction: column;
	line-height: 1.2;
}
.fs-author-box__byline-name {
	font-family: var(--fs-font-body);
	font-weight: 600;
	font-size: 14px;
	color: #0B0D12;
}
.fs-author-box__byline-title {
	font-family: var(--fs-font-body);
	font-weight: 400;
	font-size: 12px;
	color: #4B5563;
	margin-top: 2px;
}
.fs-author-box__intro p {
	font-family: var(--fs-font-body);
	font-weight: 400;
	font-size: 14px;
	line-height: 1.65;
	color: #0B0D12;
	margin: 0;
}
.fs-author-box__intro a {
	color: #0E8F7E;
	text-decoration: none;
	border-bottom: 1px solid rgba(14, 143, 126, 0.3);
}
.fs-author-box__intro a:hover { border-bottom-color: #0E8F7E; }
.fs-author-box__ctas {
	display: flex;
	gap: 16px;
	flex-wrap: wrap;
	align-items: center;
}
.fs-author-box__cta {
	font-family: var(--fs-font-body);
	font-weight: 600;
	font-size: 13px;
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: 4px;
}
.fs-author-box__cta--primary   { color: #0E8F7E; }
.fs-author-box__cta--secondary { color: #4B5563; }
.fs-author-box__cta-arrow {
	display: inline-block;
	transition: transform 200ms;
}
.fs-author-box__cta:hover .fs-author-box__cta-arrow { transform: translateX(4px); }


/* =========================================================================
   v1.4.1 — Hub page (.fs-hub-*) shared styles
   1:1 with Lovable NoDepositPage / NoWageringPage / DepositPage
   Per-hub accent is set via inline `--fs-hub-accent` on .fs-hub-page.
   ========================================================================= */

.fs-hub-page {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 24px;
	color: #0B0D12;
}

.fs-hub-hero { padding-top: 64px; }
.fs-hub-hero-inner { max-width: 820px; margin: 0 auto; text-align: center; }
.fs-hub-eyebrow {
	font-family: var(--fs-font-body, Inter), system-ui, sans-serif;
	font-weight: 600;
	font-size: 11px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--fs-hub-accent);
	margin-bottom: 14px;
}
.fs-hub-h1 {
	font-family: var(--fs-font-heading, 'Space Grotesk'), system-ui, sans-serif;
	font-weight: 700;
	font-size: 48px;
	line-height: 1.05;
	letter-spacing: -0.02em;
	color: #0B0D12;
	margin: 0;
}
@media (max-width: 767px) { .fs-hub-h1 { font-size: 32px; } }
.fs-hub-byline {
	margin-top: 12px;
	font-family: var(--fs-font-body, Inter), system-ui, sans-serif;
	font-weight: 500;
	font-size: 13px;
	color: #4B5563;
}
.fs-hub-byline a {
	color: #0B0D12;
	text-decoration: none;
}
.fs-hub-byline a:hover { text-decoration: underline; }
.fs-hub-subtitle {
	margin-top: 18px;
	font-family: var(--fs-font-body, Inter), system-ui, sans-serif;
	font-weight: 400;
	font-size: 16px;
	line-height: 1.6;
	color: #4B5563;
}

.fs-hub-edit {
	max-width: 800px;
	margin: 64px auto 0;
}
.fs-hub-page > section.fs-hub-edit:first-of-type { margin-top: 80px; }
.fs-hub-h2 {
	font-family: var(--fs-font-heading, 'Space Grotesk'), system-ui, sans-serif;
	font-weight: 700;
	font-size: 28px;
	color: #0B0D12;
	margin: 0 0 20px;
	letter-spacing: -0.01em;
}
@media (max-width: 767px) { .fs-hub-h2 { font-size: 22px; } }
.fs-hub-edit p {
	font-family: var(--fs-font-body, Inter), system-ui, sans-serif;
	font-weight: 400;
	font-size: 16px;
	line-height: 1.7;
	color: #374151;
	margin: 0 0 18px;
}
.fs-hub-edit p strong { color: #0B0D12; font-weight: 600; }
.fs-hub-edit a { color: #0E8F7E; text-decoration: none; }
.fs-hub-edit a:hover { text-decoration: underline; }

.fs-hub-list {
	margin: 0 0 18px;
	padding-left: 20px;
	font-family: var(--fs-font-body, Inter), system-ui, sans-serif;
	font-weight: 400;
	font-size: 16px;
	line-height: 1.7;
	color: #374151;
}
.fs-hub-list li { margin-bottom: 8px; }

.fs-hub-steps {
	list-style: none;
	padding: 0;
	margin: 8px 0 0;
}
.fs-hub-step {
	display: flex;
	gap: 16px;
	align-items: flex-start;
	margin-bottom: 20px;
}
.fs-hub-hex {
	position: relative;
	flex-shrink: 0;
	width: 32px;
	height: 32px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.fs-hub-hex svg { display: block; }
.fs-hub-hex-num {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--fs-font-heading, 'Space Grotesk'), system-ui, sans-serif;
	font-weight: 700;
	font-size: 14px;
	color: var(--fs-hub-accent);
}
.fs-hub-step-body {
	font-family: var(--fs-font-body, Inter), system-ui, sans-serif;
	font-weight: 400;
	font-size: 16px;
	line-height: 1.7;
	color: #374151;
}
.fs-hub-step-body strong { color: #0B0D12; font-weight: 600; }
.fs-hub-step-body a { color: var(--fs-hub-accent); text-decoration: none; }
.fs-hub-step-body a:hover { text-decoration: underline; }

.fs-hub-faq {
	max-width: 800px;
	margin: 80px auto 0;
}
.fs-hub-faq-heading {
	font-family: var(--fs-font-heading, 'Space Grotesk'), system-ui, sans-serif;
	font-weight: 700;
	font-size: 28px;
	color: #0B0D12;
	margin: 0 0 8px;
	letter-spacing: -0.01em;
}
@media (max-width: 767px) { .fs-hub-faq-heading { font-size: 22px; } }
.fs-hub-faq-subtitle {
	font-family: var(--fs-font-body, Inter), system-ui, sans-serif;
	font-weight: 400;
	font-size: 14px;
	color: #4B5563;
	margin: 0 0 24px;
}

.fs-hub-cross {
	margin-top: 64px;
	padding-bottom: 96px;
	text-align: center;
	font-family: var(--fs-font-body, Inter), system-ui, sans-serif;
	font-weight: 400;
	font-size: 14px;
	color: #4B5563;
}
.fs-hub-cross a:hover { text-decoration: underline; }

/* =========================================================================
   v1.4.3 — Static page (.spinix-page-*) styles
   1:1 with Lovable PageHero / PageStyles / CardCorner.
   Used by about, free-spins-explained, privacy-policy and other static pages.
   ========================================================================= */

.spinix-page-hero {
	position: relative;
	padding: 72px 0 40px;
	overflow: hidden;
	background: linear-gradient(180deg, #FFFFFF 0%, #FFFFFF 100%);
}
@media (max-width: 767px) {
	.spinix-page-hero { padding: 48px 0 32px; }
}
.spinix-page-hero-grid {
	position: absolute; inset: 0;
	background-image:
		linear-gradient(rgba(0,0,0,0.06) 1px, transparent 1px),
		linear-gradient(90deg, rgba(0,0,0,0.06) 1px, transparent 1px);
	background-size: 48px 48px;
	-webkit-mask-image: radial-gradient(ellipse at top, #000 20%, transparent 75%);
	mask-image: radial-gradient(ellipse at top, #000 20%, transparent 75%);
	pointer-events: none;
}
.spinix-page-hero-glow {
	position: absolute; left: 50%; top: -20%;
	transform: translateX(-50%);
	width: 720px; height: 320px;
	filter: blur(60px);
	pointer-events: none;
	opacity: 0.55;
}
.spinix-page-hero-inner {
	position: relative;
	max-width: 960px;
	margin: 0 auto;
	padding: 0 24px;
}
.spinix-page-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 5px 10px 5px 6px;
	border: 1px solid #E4E7EC;
	background: rgba(0,0,0,0.03);
	font-family: 'Space Grotesk', system-ui, sans-serif;
	font-weight: 600;
	font-size: 10.5px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	margin-bottom: 14px;
}
.spinix-page-eyebrow-bracket {
	display: inline-block;
	width: 3px;
	height: 10px;
}
.spinix-page-h1 {
	font-family: 'Space Grotesk', system-ui, sans-serif;
	font-weight: 700;
	font-size: 40px;
	line-height: 1.05;
	letter-spacing: -0.025em;
	color: #0B0D12;
	margin: 0 0 14px 0;
}
@media (max-width: 767px) {
	.spinix-page-h1 { font-size: 28px; letter-spacing: -0.02em; }
}
.spinix-page-sub {
	font-family: Inter, system-ui, sans-serif;
	font-weight: 400;
	font-size: 16px;
	line-height: 1.55;
	color: #374151;
	margin: 0;
	max-width: 640px;
}
@media (max-width: 767px) {
	.spinix-page-sub { font-size: 15px; }
}
.spinix-page-hero-rule {
	margin-top: 24px;
	height: 1px;
	background: #E4E7EC;
	position: relative;
	max-width: 96px;
}
.spinix-page-hero-rule span {
	position: absolute;
	left: 0; top: -1px;
	height: 2px;
	width: 32px;
	display: block;
}

.spinix-page-section {
	padding: 72px 0;
	position: relative;
}
@media (max-width: 767px) {
	.spinix-page-section { padding: 56px 0; }
}
.spinix-page-container {
	max-width: 960px;
	margin: 0 auto;
	padding: 0 24px;
}
.spinix-page-container-narrow {
	max-width: 760px;
	margin: 0 auto;
	padding: 0 24px;
}
.spinix-page-h2 {
	font-family: 'Space Grotesk', system-ui, sans-serif;
	font-weight: 700;
	font-size: 32px;
	letter-spacing: -0.015em;
	color: #0B0D12;
	margin: 0 0 28px 0;
	position: relative;
	padding-left: 16px;
}
.spinix-page-h2::before {
	content: '';
	position: absolute;
	left: 0; top: 8px; bottom: 8px;
	width: 3px;
	background: #0E8F7E;
}
@media (max-width: 767px) {
	.spinix-page-h2 { font-size: 24px; padding-left: 12px; }
}
.spinix-page-h3 {
	font-family: 'Space Grotesk', system-ui, sans-serif;
	font-weight: 600;
	font-size: 20px;
	letter-spacing: -0.01em;
	color: #0B0D12;
	margin: 0 0 12px 0;
}
.spinix-page-p {
	font-family: Inter, system-ui, sans-serif;
	font-weight: 400;
	font-size: 16px;
	line-height: 1.7;
	color: #374151;
	margin: 0 0 20px 0;
}
.spinix-page-p:last-child { margin-bottom: 0; }
.spinix-page-p strong { color: #0B0D12; font-weight: 600; }
.spinix-page-p a {
	color: #0E8F7E;
	text-decoration: none;
	border-bottom: 1px solid rgba(0,240,200,0.3);
	transition: border-color 160ms ease;
}
.spinix-page-p a:hover { border-bottom-color: #0E8F7E; }
.spinix-page-card {
	position: relative;
	background: linear-gradient(180deg, #F6F7F9 0%, #FFFFFF 100%);
	border: 1px solid #E4E7EC;
	padding: 28px;
	clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 0 100%);
	transition: border-color 200ms ease, transform 200ms ease, box-shadow 200ms ease;
}
.spinix-page-card:hover {
	border-color: #0E8F7E;
	transform: translateY(-2px);
	box-shadow: 0 18px 38px -24px rgba(11,13,18,0.22);
}
.spinix-page-card::after {
	content: '';
	position: absolute;
	left: 0; right: 0; top: 0;
	height: 1px;
	background: linear-gradient(90deg, transparent, rgba(0,0,0,0.08), transparent);
}
.spinix-page-corner {
	position: absolute;
	top: 0;
	right: 0;
	pointer-events: none;
}

/* About page — grids */
.spinix-about-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
}
@media (max-width: 767px) {
	.spinix-about-grid { grid-template-columns: 1fr; }
}
.spinix-about-coverage {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 32px;
}
@media (max-width: 767px) {
	.spinix-about-coverage { grid-template-columns: 1fr; }
}

/* Contact CTA button — Lovable spinix-contact-cta */
.spinix-contact-cta {
	display: inline-block;
	background: #0E8F7E;
	color: #FFFFFF !important;
	padding: 14px 28px;
	font-family: Inter, system-ui, sans-serif;
	font-weight: 700;
	font-size: 14px;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	text-decoration: none;
	border: none;
	transition: filter 150ms;
}
.spinix-contact-cta:hover { filter: brightness(1.1); }

/* Explained page — journey grid + step cards */
.spinix-journey-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 16px;
	margin-top: 8px;
}
@media (max-width: 767px) {
	.spinix-journey-grid { grid-template-columns: 1fr 1fr; }
}
.spinix-journey-step {
	position: relative;
	padding: 22px;
	background: linear-gradient(180deg, #F6F7F9 0%, #FFFFFF 100%);
	border: 1px solid #E4E7EC;
	clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 0 100%);
}
.spinix-journey-num {
	font-family: 'Space Grotesk', system-ui, sans-serif;
	font-weight: 700;
	font-size: 24px;
	color: #0E8F7E;
	margin-bottom: 8px;
}
.spinix-journey-title {
	font-family: 'Space Grotesk', system-ui, sans-serif;
	font-weight: 600;
	font-size: 15px;
	color: #0B0D12;
	margin-bottom: 6px;
}
.spinix-journey-body {
	font-family: Inter, system-ui, sans-serif;
	font-weight: 400;
	font-size: 13px;
	line-height: 1.5;
	color: #4B5563;
}

/* FAQ accordion shared (used by free-spins-explained.html) */
.spinix-faq { max-width: 800px; margin: 0 auto; }
.spinix-faq-item { background: #F6F7F9; border-bottom: 1px solid #E4E7EC; margin-bottom: 0; }
.spinix-faq-q {
	padding: 20px 24px;
	font-family: 'Space Grotesk', system-ui, sans-serif;
	font-weight: 600;
	font-size: 16px;
	color: #0B0D12;
	cursor: pointer;
	list-style: none;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
	user-select: none;
}
.spinix-faq-q::-webkit-details-marker { display: none; }
.spinix-faq-item[open] .spinix-faq-q { background: #F0F2F5; }
.spinix-faq-chev { color: #0E8F7E; transition: transform 200ms; flex-shrink: 0; }
.spinix-faq-item[open] .spinix-faq-chev { transform: rotate(180deg); }
.spinix-faq-a {
	padding: 0 24px 24px;
	font-family: Inter, system-ui, sans-serif;
	font-weight: 400;
	font-size: 15px;
	line-height: 1.7;
	color: #374151;
}

/* Legal page TOC sidebar (privacy, terms, cookie) */
.spinix-legal-page { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.spinix-legal-grid { display: grid; grid-template-columns: 240px 1fr; gap: 48px; align-items: start; padding: 48px 0; }
@media (max-width: 1023px) {
	.spinix-legal-grid { grid-template-columns: 1fr; gap: 24px; }
}
.spinix-legal-toc {
	position: sticky; top: 24px;
	font-family: Inter, system-ui, sans-serif;
	font-size: 13px;
	padding: 20px;
	background: #F6F7F9;
	border: 1px solid #E4E7EC;
}
@media (max-width: 1023px) {
	.spinix-legal-toc { position: relative; top: 0; }
}
.spinix-legal-toc-heading {
	font-family: 'Space Grotesk', system-ui, sans-serif;
	font-weight: 700;
	font-size: 11px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: #0E8F7E;
	margin-bottom: 12px;
}
.spinix-legal-toc ol { margin: 0; padding-left: 18px; }
.spinix-legal-toc li { margin-bottom: 6px; line-height: 1.5; }
.spinix-legal-toc a { color: #374151; text-decoration: none; }
.spinix-legal-toc a:hover { color: #0E8F7E; }
.spinix-legal-body { font-family: Inter, system-ui, sans-serif; }
.spinix-legal-body h2 {
	font-family: 'Space Grotesk', system-ui, sans-serif;
	font-weight: 700;
	font-size: 24px;
	color: #0B0D12;
	margin: 48px 0 16px 0;
	scroll-margin-top: 80px;
}
.spinix-legal-body h2:first-child { margin-top: 0; }
.spinix-legal-body p {
	font-size: 15px;
	line-height: 1.7;
	color: #374151;
	margin: 0 0 16px 0;
}
.spinix-legal-body p strong { color: #0B0D12; font-weight: 600; }
.spinix-legal-body ul, .spinix-legal-body ol {
	font-size: 15px;
	line-height: 1.7;
	color: #374151;
	margin: 0 0 16px 0;
	padding-left: 20px;
}
.spinix-legal-body li { margin-bottom: 6px; }
.spinix-legal-body a { color: #0E8F7E; text-decoration: none; border-bottom: 1px solid rgba(14,143,126,0.3); }
.spinix-legal-body a:hover { border-bottom-color: #0E8F7E; }
.spinix-legal-meta {
	font-size: 13px;
	color: #6B7280;
	margin-bottom: 32px;
	padding-bottom: 16px;
	border-bottom: 1px solid #E4E7EC;
}

/* v1.4.3 — Explained page journey diagram */
.spinix-exp-journey {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 0;
}
.spinix-exp-step {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	padding: 0 12px;
}
.spinix-exp-connector {
	position: absolute;
	top: calc(10px + 12px + 32px);
	left: 50%;
	right: -50%;
	height: 1px;
	background: #E4E7EC;
}
@media (max-width: 767px) {
	.spinix-exp-journey { grid-template-columns: 1fr; gap: 32px; }
	.spinix-exp-connector { display: none; }
}

/* v1.4.3 — Lovable LegalPageLayout (.spinix-legal-*) */
.spinix-legal-section { padding: 16px 0 96px; }
.spinix-legal-container {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 24px;
	display: grid;
	grid-template-columns: 240px 1fr;
	gap: 64px;
	position: relative;
}
.spinix-legal-container::before {
	content: '';
	position: absolute;
	top: 0; bottom: 0;
	left: calc(240px + 24px + 32px);
	width: 1px;
	background: #E4E7EC;
}
@media (max-width: 1023px) {
	.spinix-legal-container { grid-template-columns: 1fr; gap: 24px; }
	.spinix-legal-container::before { display: none; }
}
.spinix-legal-toc {
	position: sticky;
	top: 120px;
	align-self: start;
	max-width: 240px;
}
@media (max-width: 1023px) {
	.spinix-legal-toc { display: none; }
}
.spinix-legal-toc-label {
	font-family: Inter, system-ui, sans-serif;
	font-weight: 600;
	font-size: 11px;
	letter-spacing: 0.15em;
	text-transform: uppercase;
	color: #4B5563;
	margin-bottom: 16px;
}
.spinix-legal-toc ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 4px;
}
.spinix-legal-toc a {
	display: block;
	font-family: Inter, system-ui, sans-serif;
	font-weight: 500;
	font-size: 14px;
	color: #4B5563;
	padding: 6px 0 6px 14px;
	border-left: 2px solid transparent;
	text-decoration: none;
	transition: color 200ms ease, border-color 200ms ease, padding-left 200ms ease;
}
.spinix-legal-toc a:hover { color: #0B0D12; }
.spinix-legal-toc a.is-active { color: #0B0D12; border-left-color: #0E8F7E; }

.spinix-legal-mobile-toc {
	display: none;
	position: sticky;
	top: 96px;
	z-index: 20;
	background: #FFFFFF;
	border-bottom: 1px solid #E4E7EC;
	margin-bottom: 16px;
}
@media (max-width: 1023px) { .spinix-legal-mobile-toc { display: block; } }
.spinix-legal-mobile-trigger {
	width: 100%;
	background: #F6F7F9;
	border: 1px solid #E4E7EC;
	color: #0B0D12;
	font-family: Inter, system-ui, sans-serif;
	font-weight: 600;
	font-size: 14px;
	padding: 12px 16px;
	text-align: left;
	cursor: pointer;
}
.spinix-legal-mobile-list {
	list-style: none;
	margin: 0; padding: 0;
	background: #F6F7F9;
	border: 1px solid #E4E7EC;
	border-top: none;
	max-height: 320px;
	overflow-y: auto;
	display: none;
}
.spinix-legal-mobile-toc[data-open="true"] .spinix-legal-mobile-list { display: block; }
.spinix-legal-mobile-list a {
	display: block;
	padding: 10px 16px;
	font-family: Inter, system-ui, sans-serif;
	font-size: 14px;
	color: #0B0D12;
	text-decoration: none;
	border-top: 1px solid #E4E7EC;
}

.spinix-legal-main { min-width: 0; }
.spinix-legal-block {
	margin-bottom: 48px;
	scroll-margin-top: 120px;
}
.spinix-legal-block:last-child { margin-bottom: 0; }
.spinix-legal-h2 {
	font-family: 'Space Grotesk', system-ui, sans-serif;
	font-weight: 700;
	font-size: 28px;
	color: #0B0D12;
	margin: 0 0 20px 0;
	scroll-margin-top: 120px;
}
@media (max-width: 767px) { .spinix-legal-h2 { font-size: 22px; } }
.spinix-legal-content p {
	font-family: Inter, system-ui, sans-serif;
	font-weight: 400;
	font-size: 16px;
	line-height: 1.7;
	color: #0B0D12;
	margin: 0 0 16px 0;
}
.spinix-legal-content p:last-child { margin-bottom: 0; }
.spinix-legal-content strong { font-weight: 700; color: #0B0D12; }
.spinix-legal-content ul {
	list-style: none;
	margin: 0 0 16px 0;
	padding: 0;
}
.spinix-legal-content ul li {
	font-family: Inter, system-ui, sans-serif;
	font-weight: 400;
	font-size: 15px;
	line-height: 1.8;
	color: #0B0D12;
	padding-left: 20px;
	position: relative;
}
.spinix-legal-content ul li::before {
	content: '';
	position: absolute;
	left: 0; top: 12px;
	width: 6px; height: 6px;
	background: #4B5563;
}
.spinix-legal-content a {
	color: #0E8F7E;
	font-weight: 600;
	text-decoration: none;
}
.spinix-legal-content a:hover { text-decoration: underline; }