:root{
  --indigo: #1F2A44;
  --indigo-soft: #29365A;
  --paper: #FAF7F0;
  --card: #FFFFFF;
  --blue: #2657A6;
  --blue-deep: #1D4480;
  --amber: #E0A63E;
  --amber-soft: #F2D9A6;
  --brick: #B23A2E;
  --brick-soft: #F4E1DD;
  --text-dark: #23262B;
  --text-dim: #5B6270;
  --text-on-indigo: #F3F0E8;
  --text-on-indigo-dim: #AAB2C6;

  --font-display: "Space Grotesk", "Arial Narrow", sans-serif;
  --font-body: "Source Sans 3", -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, monospace;

  --radius-s: 8px;
  --radius-m: 14px;
  --radius-l: 24px;

  --shadow-card: 0 1px 2px rgba(31,42,68,0.06), 0 12px 28px -14px rgba(31,42,68,0.22);
  --shadow-pop: 0 32px 84px -22px rgba(31,42,68,0.5);

  --maxw: 1180px;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; }
}

body{
  margin:0;
  background:var(--paper);
  color:var(--text-dark);
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.62;
  -webkit-font-smoothing:antialiased;
}

img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }

h1,h2,h3{
  font-family:var(--font-display);
  font-weight:600;
  line-height:1.12;
  margin:0;
  color:var(--indigo);
  letter-spacing:-0.01em;
}
p{ margin:0; }

.wrap{ max-width:var(--maxw); margin:0 auto; padding:0 28px; }
.wrap--narrow{ max-width:800px; }

.eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-family:var(--font-mono);
  font-size:0.76rem;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:var(--blue);
  margin:0 0 12px;
}
.eyebrow::before{
  content:""; width:16px; height:2px; background:var(--amber);
}

section{ padding:88px 0; }
@media (max-width:760px){ section{ padding:56px 0; } }

.section-head{ max-width:640px; margin:0 auto 48px; text-align:center; }
.section-head--left{ margin-left:0; text-align:left; }
.section-head h2{ font-size:clamp(1.6rem,3vw,2.3rem); margin-bottom:14px; }
.section-lede{ color:var(--text-dim); font-size:1.03rem; margin-top:12px; }

.btn{
  display:inline-flex; align-items:center; justify-content:center;
  gap:8px;
  padding:14px 26px;
  border-radius:var(--radius-s);
  font-family:var(--font-body);
  font-weight:600;
  font-size:0.94rem;
  border:1.5px solid transparent;
  cursor:pointer;
  transition:transform .16s ease, background .16s ease, border-color .16s ease, color .16s ease;
}
.btn:active{ transform:translateY(1px); }
.btn--primary{ background:var(--blue); color:#fff; }
.btn--primary:hover{ background:var(--blue-deep); }
.btn--ghost{ background:transparent; color:var(--text-dim); border-color:#00000022; }
.btn--ghost:hover{ border-color:#00000044; color:var(--text-dark); }
.btn--outline-light{ background:transparent; color:var(--text-on-indigo); border-color:#ffffff50; }
.btn--outline-light:hover{ background:#ffffff14; }
.btn--sm{ padding:9px 16px; font-size:0.84rem; }

.site-header{
  position:sticky; top:0; z-index:100;
  background:var(--paper)ee;
  backdrop-filter:blur(10px);
  border-bottom:1px solid #00000012;
}
.site-header__inner{
  display:flex; align-items:center; justify-content:space-between;
  height:78px;
}
.logo{ display:flex; align-items:center; gap:10px; color:var(--indigo); }
.logo__mark{ width:32px; height:32px; flex:none; }
.logo__text{ font-family:var(--font-display); font-weight:600; font-size:1.16rem; letter-spacing:-0.01em; }
.logo__accent{ color:var(--blue); }

.primary-nav{ display:flex; gap:32px; }
.primary-nav a{
  font-size:0.94rem; font-weight:600; color:var(--text-dim);
  position:relative; padding:4px 0;
  transition:color .15s ease;
}
.primary-nav a:hover, .primary-nav a[aria-current="page"]{ color:var(--indigo); }
.primary-nav a::after{
  content:""; position:absolute; left:0; right:100%; bottom:-2px; height:2px;
  background:var(--amber); transition:right .2s ease;
}
.primary-nav a:hover::after{ right:0; }

.nav-toggle{
  display:none; flex-direction:column; gap:5px;
  width:38px; height:38px; border:none; background:none; cursor:pointer;
  padding:0; align-items:center; justify-content:center;
}
.nav-toggle span{ width:22px; height:2px; background:var(--indigo); border-radius:2px; }

.compliance-bar{
  background:#7A2E28;
  border-bottom:1px solid #ffffff22;
  padding:10px 0;
}
.compliance-bar__inner{
  max-width:var(--maxw); margin:0 auto; padding:0 28px;
  display:flex; gap:14px; align-items:center;
}
.compliance-bar__age{
  flex:none; width:36px; height:36px; border-radius:8px;
  background:var(--indigo); color:var(--amber-soft);
  font-family:var(--font-mono); font-weight:700; font-size:0.82rem;
  display:flex; align-items:center; justify-content:center;
}
.compliance-bar p{
  margin:0; color:#F8E4E0; font-size:0.82rem; line-height:1.45;
}
.compliance-bar a{ color:#fff; font-weight:700; text-decoration:underline; text-underline-offset:2px; }
.compliance-bar a:hover{ color:var(--amber-soft); }
@media (max-width:720px){
  .compliance-bar__inner{ align-items:flex-start; }
}

.affiliate-note{
  margin-top:18px; font-size:0.88rem; color:var(--text-dim); max-width:70ch;
}
.affiliate-note a{ color:var(--blue); text-decoration:underline; text-underline-offset:2px; }
.cta-affiliate{
  display:block; margin-top:6px; font-size:0.78rem; color:var(--text-dim);
}
.cta-affiliate a{ color:var(--blue); text-decoration:underline; }

.skip-link{
  position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden;
}
.skip-link:focus{
  position:fixed; left:12px; top:12px; z-index:10001; width:auto; height:auto;
  padding:10px 14px; background:#fff; color:var(--indigo); border-radius:8px;
  box-shadow:var(--shadow-card);
}

@media (max-width:820px){
  .nav-toggle{ display:flex; }
  .primary-nav{
    position:fixed; top:78px; left:0; right:0;
    background:var(--paper); border-bottom:1px solid #00000012;
    flex-direction:column; gap:0; padding:8px 28px 20px;
    transform:translateY(-8px); opacity:0; pointer-events:none;
    transition:opacity .18s ease, transform .18s ease;
  }
  .primary-nav.is-open{ opacity:1; transform:translateY(0); pointer-events:auto; }
  .primary-nav a{ padding:12px 0; border-bottom:1px solid #00000010; }
}

section.hero{
  position:relative;
  padding:28px 0 36px;
  overflow:hidden;
  background:
    radial-gradient(ellipse 65% 80% at 100% 0%, rgba(224,166,62,0.35) 0%, transparent 55%),
    radial-gradient(ellipse 50% 70% at 0% 100%, rgba(38,87,166,0.28) 0%, transparent 50%),
    linear-gradient(160deg, #B8C8E4 0%, #D5DEF0 42%, #EDE8DC 100%);
}
section.hero::before{
  content:"";
  position:absolute; inset:0;
  background-image:
    linear-gradient(rgba(31,42,68,0.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(31,42,68,0.07) 1px, transparent 1px);
  background-size:40px 40px;
  mask-image:linear-gradient(180deg, #000 0%, transparent 90%);
  pointer-events:none;
}
.hero__inner{
  position:relative;
  z-index:1;
  display:grid; grid-template-columns:1.05fr 0.95fr; align-items:center; gap:28px;
}
.hero__title{ font-size:clamp(1.65rem,3.4vw,2.5rem); margin-bottom:12px; }
.hero__text{ color:var(--text-dim); font-size:0.98rem; max-width:50ch; margin-bottom:16px; }
.hero__actions{ display:flex; flex-direction:column; align-items:flex-start; gap:10px; }
.hero__note{ font-size:0.85rem; color:var(--text-dim); text-decoration:underline; text-underline-offset:3px; }

.hero__visual{ display:flex; justify-content:center; }
.route{ width:100%; max-width:280px; }

.card-grid{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(270px,1fr)); gap:22px;
}
#platformGrid{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:24px;
}
@media (max-width:760px){
  #platformGrid{ grid-template-columns:1fr; }
}
.p-card{
  background:var(--card);
  border-radius:var(--radius-m);
  padding:26px 24px 24px;
  box-shadow:var(--shadow-card);
  display:flex; flex-direction:column; gap:14px;
}
.p-card__top{
  display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
}
.p-card__logo{
  width:160px; height:72px; flex:none;
  border-radius:12px;
  background:#F3F5F9;
  border:1px solid #0000000d;
  display:flex; align-items:center; justify-content:center;
  overflow:hidden; padding:10px;
}
.p-card__logo img{
  max-width:100%; max-height:100%;
  width:auto; height:auto;
  object-fit:contain;
}
.p-card__stars{ font-family:var(--font-mono); font-size:0.78rem; color:var(--amber); letter-spacing:0.02em; }
.p-card__category{
  font-family:var(--font-mono); font-size:0.72rem; letter-spacing:0.07em; text-transform:uppercase;
  color:var(--blue); font-weight:500;
}
.p-card__desc{ color:var(--text-dim); font-size:0.93rem; flex:1; }
.p-card__meta{ font-size:0.83rem; color:var(--text-dim); border-top:1px solid #00000010; padding-top:12px; }
.p-card__meta strong{ display:block; color:var(--indigo); font-weight:600; font-size:0.76rem; letter-spacing:0.03em; text-transform:uppercase; margin-bottom:4px; }
.p-card__actions{ display:flex; gap:10px; flex-wrap:wrap; margin-top:2px; }

.why{ background:var(--indigo); color:var(--text-on-indigo); }
.why .eyebrow{ color:var(--amber-soft); }
.why .eyebrow::before{ background:var(--amber-soft); }
.why h2{ color:var(--text-on-indigo); }
.why__grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:28px; margin-top:16px; }
.why__item h3{ color:var(--text-on-indigo); font-size:1.02rem; margin:14px 0 6px; }
.why__item p{ color:var(--text-on-indigo-dim); font-size:0.9rem; }
.why__icon{
  width:44px; height:44px; border-radius:12px;
  background:#ffffff10; color:var(--amber-soft);
  display:flex; align-items:center; justify-content:center;
}
.why__icon svg{ width:22px; height:22px; }
@media (max-width:860px){ .why__grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .why__grid{ grid-template-columns:1fr; } }

.table-scroll{ overflow-x:auto; border-radius:var(--radius-m); box-shadow:var(--shadow-card); background:var(--card); }
.compare-table{ width:100%; border-collapse:collapse; min-width:720px; font-size:0.92rem; }
.compare-table thead th{
  text-align:left; padding:16px 20px;
  font-family:var(--font-mono); font-size:0.72rem; letter-spacing:0.06em; text-transform:uppercase;
  color:var(--text-on-indigo-dim); background:var(--indigo);
}
.compare-table thead th:first-child{ border-top-left-radius:var(--radius-m); }
.compare-table thead th:last-child{ border-top-right-radius:var(--radius-m); }
.compare-table tbody td{ padding:16px 20px; border-bottom:1px solid #00000010; color:var(--text-dark); vertical-align:top; }
.compare-table tbody tr:last-child td{ border-bottom:none; }
.compare-table tbody tr:nth-child(even){ background:#2657A608; }
.compare-table td.cell-name{
  min-width:140px;
}
.cell-name__logo{
  width:112px; height:40px; flex:none;
  border-radius:8px; background:#F3F5F9; border:1px solid #0000000d;
  display:inline-flex; align-items:center; justify-content:center;
  overflow:hidden; padding:4px 8px;
}
.cell-name__logo img{
  max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain;
}
.compare-table td.cell-note{ font-family:var(--font-mono); color:var(--blue-deep); font-weight:500; }
.badge-ok{ display:inline-flex; align-items:center; gap:6px; font-size:0.84rem; color:var(--blue-deep); }
.badge-ok::before{ content:""; width:7px; height:7px; border-radius:50%; background:var(--blue); }

.review-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:22px; }
.review{ background:var(--card); border-radius:var(--radius-m); padding:24px; box-shadow:var(--shadow-card); }
.review__head{ display:flex; align-items:center; gap:12px; margin-bottom:14px; }
.review__avatar{ width:42px; height:42px; border-radius:50%; flex:none; }
.review__name{ font-weight:700; color:var(--indigo); font-size:0.95rem; }
.review__date{ font-size:0.78rem; color:var(--text-dim); font-family:var(--font-mono); }
.review__text{ color:var(--text-dim); font-size:0.93rem; }

.accordion{ display:flex; flex-direction:column; border-top:1px solid #00000014; }
.acc-item{ border-bottom:1px solid #00000014; }
.acc-item__q{
  width:100%; text-align:left; background:none; border:none; cursor:pointer;
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:22px 4px; font-family:var(--font-display); font-size:1.03rem; font-weight:600; color:var(--indigo);
}
.acc-item__icon{
  flex:none; width:26px; height:26px; border-radius:50%;
  border:1.5px solid var(--blue); color:var(--blue);
  display:flex; align-items:center; justify-content:center;
  position:relative;
}
.acc-item__icon::before,.acc-item__icon::after{ content:""; position:absolute; background:currentColor; }
.acc-item__icon::before{ width:10px; height:1.6px; }
.acc-item__icon::after{ width:1.6px; height:10px; transition:transform .2s ease; }
.acc-item.is-open .acc-item__icon::after{ transform:scaleY(0); }
.acc-item__a{ max-height:0; overflow:hidden; transition:max-height .28s ease; }
.acc-item__a p{ padding:0 4px 22px; color:var(--text-dim); font-size:0.95rem; max-width:70ch; }
.acc-item__a a{ color:var(--blue); text-decoration:underline; }

.regulator-grid{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:16px;
  align-items:stretch;
}
@media (max-width:980px){
  .regulator-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width:640px){
  .regulator-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
.regulator{
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px;
  padding:18px 14px 16px; border-radius:var(--radius-m);
  background:var(--card); box-shadow:var(--shadow-card);
  text-align:center;
  font-size:0.82rem; font-weight:600; color:var(--text-dark);
  transition:transform .15s ease, box-shadow .15s ease;
}
.regulator:hover{ transform:translateY(-2px); box-shadow:0 16px 30px -16px rgba(31,42,68,0.3); }
.regulator__logo{
  width:100%; height:52px;
  display:flex; align-items:center; justify-content:center;
  border-radius:10px;
  background:#0B0B0B;
  padding:8px 12px;
}
.regulator__logo img{
  max-width:100%; max-height:100%;
  width:auto; height:auto;
  object-fit:contain;
}

.responsible{ background:linear-gradient(160deg, var(--indigo) 0%, #241A2E 100%); color:var(--text-on-indigo); }
.responsible__inner{ display:grid; grid-template-columns:auto 1fr; gap:36px; align-items:start; max-width:820px; }
.responsible__mark{
  width:68px; height:68px; border-radius:50%;
  background:var(--brick); color:#fff;
  font-family:var(--font-mono); font-weight:700; font-size:1.05rem;
  display:flex; align-items:center; justify-content:center; flex:none;
}
.responsible h2{ color:#fff; font-size:clamp(1.45rem,2.6vw,2rem); margin-bottom:16px; }
.responsible p{ color:var(--text-on-indigo-dim); margin-bottom:14px; font-size:0.98rem; }
.responsible p strong{ color:#fff; }
.responsible .btn{ margin-top:8px; }
@media (max-width:600px){ .responsible__inner{ grid-template-columns:1fr; } }

.page-hero{ padding:56px 0 40px; border-bottom:1px solid #00000012; }
.page-hero .eyebrow{ margin-bottom:14px; }
.page-hero h1{ font-size:clamp(1.9rem,3.6vw,2.7rem); margin-bottom:16px; }
.page-hero p{ color:var(--text-dim); font-size:1.03rem; max-width:70ch; }

.prose{ max-width:760px; }
.prose h2{ font-size:1.4rem; margin:36px 0 14px; }
.prose h2:first-child{ margin-top:0; }
.prose h3{ font-size:1.1rem; margin:24px 0 10px; color:var(--indigo); }
.prose p{ color:var(--text-dim); margin-bottom:14px; font-size:1rem; }
.prose ul{ margin:0 0 16px; padding-left:20px; color:var(--text-dim); }
.prose li{ margin-bottom:8px; }
.prose a{ color:var(--blue); text-decoration:underline; text-underline-offset:2px; }
.prose a.btn,
.hbdeuHSBJb3 > a.btn{
  color:#fff;
  text-decoration:none;
}
.prose a.btn--primary,
.hbdeuHSBJb3 > a.btn--primary{
  background:var(--blue);
  color:#fff;
}
.prose a.btn--primary:hover,
.hbdeuHSBJb3 > a.btn--primary:hover{
  background:var(--blue-deep);
  color:#fff;
}
.prose strong{ color:var(--indigo); }

.disclaimer{
  background:var(--brick-soft); border-left:3px solid var(--brick);
  border-radius:var(--radius-s); padding:18px 20px; margin-top:32px;
}
.disclaimer p{ color:#7A3226; font-size:0.9rem; margin:0; }
.disclaimer strong{ color:var(--brick); }

.brand-page__head{ display:flex; align-items:center; gap:18px; margin-bottom:26px; flex-wrap:wrap; }
.brand-page__logo{
  width:168px; height:80px; flex:none;
  border-radius:12px;
  background:#F3F5F9;
  border:1px solid #0000000d;
  display:flex; align-items:center; justify-content:center;
  overflow:hidden; padding:10px;
}
.brand-page__logo img{
  max-width:100%; max-height:100%;
  width:auto; height:auto;
  object-fit:contain;
}
.brand-page__rating{ font-family:var(--font-mono); font-size:0.86rem; color:var(--amber); }

.contact-box{
  background:var(--card); border-radius:var(--radius-m); padding:32px;
  box-shadow:var(--shadow-card); max-width:480px; text-align:center;
}
.contact-box__email{
  display:inline-block; margin:18px 0; font-family:var(--font-mono);
  font-size:1.05rem; color:var(--blue-deep); font-weight:600;
  border:1.5px dashed var(--blue); border-radius:var(--radius-s); padding:14px 22px;
}

.site-footer{ background:var(--indigo-soft); color:var(--text-on-indigo-dim); padding-top:56px; }
.footer__risk{
  max-width:var(--maxw); margin:0 auto; padding:0 28px 40px;
  font-size:0.92rem; color:var(--text-on-indigo);
  border-bottom:1px solid #ffffff14; padding-bottom:36px;
}
.footer__risk strong{ color:#fff; }
.footer__inner{ max-width:var(--maxw); margin:0 auto; padding:36px 28px; display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:48px; }
.footer__col h3{ color:var(--text-on-indigo); font-family:var(--font-body); font-size:0.78rem; letter-spacing:0.08em; text-transform:uppercase; font-weight:700; margin-bottom:14px; }
.footer__legal-block p{ font-size:0.88rem; margin-bottom:12px; }
.footer__legal-block h4{
  color:var(--text-on-indigo);
  font-family:var(--font-body);
  font-size:0.92rem;
  font-weight:700;
  margin:18px 0 8px;
  letter-spacing:0;
  text-transform:none;
}
.footer__legal-block h4:first-of-type{ margin-top:4px; }
.footer__legal-block a{ color:var(--amber-soft); text-decoration:underline; text-underline-offset:2px; }
.footer__legal-block a:hover{ color:#fff; }
.footer__help-links{
  list-style:none; padding:0; margin:0 0 8px;
  display:flex; flex-direction:column; gap:6px;
}
.footer__help-links a{ font-size:0.88rem; }
.footer__license-note{
  margin-top:1rem;
  padding:0.75rem 0 0;
  border-top:1px solid rgba(255,255,255,0.12);
  font-size:0.88rem;
  color:rgba(255,255,255,0.78);
  line-height:1.5;
}
.footer__nav{ display:flex; flex-direction:column; gap:10px; }
.footer__nav a{ font-size:0.9rem; }
.footer__nav a:hover{ color:var(--text-on-indigo); }
.footer__bottom{
  border-top:1px solid #ffffff14; padding:20px 28px 28px; max-width:var(--maxw); margin:0 auto;
  display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px;
  font-size:0.8rem; color:var(--text-on-indigo-dim);
}
@media (max-width:820px){
  .footer__inner{ grid-template-columns:1fr; gap:32px; }
  .hero{ padding:28px 0 32px; }
  .hero__inner{ grid-template-columns:1fr; text-align:left; gap:20px; }
  .hero__visual{ order:-1; max-width:200px; margin:0 auto 4px; }
}