/* 1xslots-play.site — архетип column-rule, namespace cru */

:root{
  --bg:#1f1f1f;          /* основной тёмный фон */
  --bg-deep:#060606;     /* подвал, глубокие подложки */
  --surface:#262626;     /* панели, карточки */
  --surface-2:#303031;   /* вложенные блоки, строки таблиц */
  --line:#363636;        /* границы */
  --gold:#fde4a5;        /* фирменное шампанское золото, главный акцент */
  --gold-2:#c9a339;      /* насыщенное золото, обводки и цифры */
  --gold-3:#937527;      /* тёмное золото, тени и низ градиента */
  --blue:#23507d;        /* фирменный синий */
  --blue-2:#367aba;      /* светлый синий, ссылки и подсветка */
  --blue-deep:#19405f;   /* глубокий синий, подложки */
  --green:#088c4f;       /* успех, подтверждения */
  --text:#e8e8e8;
  --text-2:#d9d9d9;
  --muted:#9b9b9b;
  --muted-2:#878787;
}

*,*::before,*::after{box-sizing:border-box}

html{-webkit-text-size-adjust:100%}

body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:"Literata",Georgia,"Times New Roman",serif;
  font-size:17px;
  line-height:1.66;
  overflow-x:hidden;
}

img{max-width:100%;height:auto;display:block}

a{color:var(--blue-2);text-decoration:none}
a:hover{color:var(--gold)}

.cru-shell{max-width:1200px;margin:0 auto;padding:0 22px}

/* ---------- шапка: сетка 12 колонок, лого 3 / навигация 5 / кнопки 4 ---------- */

.cru-top{
  position:sticky;top:0;z-index:40;
  background:var(--surface);
  border-bottom:1px solid var(--line);
  box-shadow:0 1px 0 rgba(201,163,57,.28);
}
.cru-top-grid{
  display:grid;
  grid-template-columns:repeat(12,1fr);
  align-items:center;
  gap:14px;
  min-height:68px;
}
.cru-brandmark{grid-column:span 3;display:flex;align-items:center;gap:10px}
.cru-brandmark svg{flex:0 0 auto}
.cru-wordmark{
  font-family:"Russo One",Impact,sans-serif;
  font-size:19px;letter-spacing:.02em;color:var(--gold);
  line-height:1.1;white-space:nowrap;
}
.cru-wordmark span{display:block;font-family:"Literata",serif;font-size:10px;letter-spacing:.22em;color:var(--muted);text-transform:uppercase}

.cru-nav{
  grid-column:span 5;
  display:flex;flex-wrap:wrap;gap:0;
  font-size:13.5px;
}
.cru-nav a{
  color:var(--text-2);
  padding:2px 13px;
  border-left:1px solid var(--line);
  letter-spacing:.01em;
}
.cru-nav a:first-child{border-left:0;padding-left:0}
.cru-nav a:hover{color:var(--gold)}

.cru-acts{grid-column:span 4;display:flex;justify-content:flex-end;gap:10px}

.cru-btn{
  display:inline-block;
  font-family:"Russo One",Impact,sans-serif;
  font-size:13px;letter-spacing:.03em;
  padding:11px 20px;
  border-radius:2px;
  text-align:center;
  white-space:nowrap;
}
.cru-btn-main{
  background:linear-gradient(180deg,#fde4a5 0%,#c9a339 100%);
  color:var(--bg-deep);
  border:1px solid var(--gold-3);
  box-shadow:0 2px 0 var(--gold-3);
}
.cru-btn-main:hover{color:var(--bg-deep);filter:brightness(1.07)}
.cru-btn-ghost{
  background:transparent;
  color:var(--gold);
  border:1px solid var(--gold-2);
}
.cru-btn-ghost:hover{background:var(--surface-2);color:var(--gold)}
.cru-btn-wide{padding:15px 34px;font-size:15px}

/* ---------- типографика: газетная колонка ---------- */

h1,h2,h3{font-family:"Russo One",Impact,sans-serif;font-weight:400;letter-spacing:.01em;line-height:1.22}

h1{font-size:34px;margin:0 0 14px;color:var(--text)}
h2{font-size:24px;margin:0 0 6px;color:var(--gold)}
h3{font-size:17px;margin:22px 0 6px;color:var(--gold-2)}

.cru-kicker{
  font-family:"Literata",serif;
  font-size:11px;letter-spacing:.24em;text-transform:uppercase;
  color:var(--muted-2);margin:0 0 6px;
}

.cru-sec{
  padding:34px 0;
  border-top:1px solid var(--line);
}
.cru-sec-head{
  border-left:3px double var(--gold-2);
  padding-left:16px;
  margin-bottom:18px;
}

/* газетные колонки с вертикальными линейками */
.cru-cols{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0;
}
.cru-cols > div{padding:0 26px}
.cru-cols > div:first-child{padding-left:0}
.cru-cols > div + div{
  border-left:1px solid var(--line);
  padding-right:0;
}
.cru-cols-3{grid-template-columns:1fr 1fr 1fr}

p{margin:0 0 14px}
.cru-lead{font-size:19px;color:var(--text-2);margin-bottom:18px}
.cru-note{color:var(--muted);font-size:14.5px}
.cru-num{color:var(--gold-2)}
.cru-em{color:var(--gold)}
.cru-ok{color:var(--green)}

/* ---------- первый экран ---------- */

.cru-hero{
  padding:38px 0 30px;
  background:
    linear-gradient(180deg,rgba(35,80,125,.20),rgba(31,31,31,0)),
    repeating-linear-gradient(90deg,rgba(54,54,54,.55) 0 1px,transparent 1px 148px);
}
.cru-hero-grid{
  display:grid;
  grid-template-columns:1.25fr 1fr;
  gap:0;
}
.cru-hero-grid > div:first-child{padding-right:30px}
.cru-hero-grid > div + div{border-left:1px solid var(--line);padding-left:30px}

.cru-kpi{
  display:grid;grid-template-columns:repeat(5,1fr);
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:2px;
  margin:20px 0 22px;
}
.cru-kpi div{padding:14px 12px;border-left:1px solid var(--line)}
.cru-kpi div:first-child{border-left:0}
.cru-kpi b,.cru-kpi .cru-kpi-v{
  display:block;
  font-family:"Russo One",Impact,sans-serif;
  font-size:19px;color:var(--gold);line-height:1.2;
}
.cru-kpi span{display:block;font-size:12.5px;color:var(--muted);margin-top:5px}

.cru-figure{margin:0}
.cru-figure img{border:1px solid var(--line);border-radius:2px}
.cru-figure figcaption{
  font-size:13px;color:var(--muted);
  padding:8px 0 0;border-top:1px solid var(--line);margin-top:8px;
}

/* баннер «между колонками» */
.cru-gutter-fig{
  margin:22px 0;
  display:grid;grid-template-columns:1fr auto 1fr;
  align-items:center;gap:0;
}
.cru-gutter-fig::before,.cru-gutter-fig::after{
  content:"";height:100%;border-left:1px solid var(--line);
}
.cru-gutter-fig::before{border-left:0;border-right:1px solid var(--line)}
.cru-gutter-fig figure{margin:0;padding:0 24px}

.cru-aside-fig{float:right;margin:4px 0 14px 24px;max-width:188px;border-left:1px solid var(--line);padding-left:20px}
.cru-aside-fig figcaption{font-size:12.5px;color:var(--muted);margin-top:8px}

/* ---------- таблицы ---------- */

.cru-scroll{overflow-x:auto;margin:16px 0;border:1px solid var(--line);border-radius:2px}
table{border-collapse:collapse;width:100%;min-width:520px;font-size:15px}
caption{
  caption-side:top;text-align:left;
  padding:11px 14px;color:var(--muted);font-size:13px;
  border-bottom:1px solid var(--line);background:var(--surface);
}
th,td{padding:11px 14px;text-align:left;border-bottom:1px solid var(--line);border-left:1px solid var(--line)}
th:first-child,td:first-child{border-left:0}
thead th{
  background:var(--blue-deep);color:var(--text);
  font-family:"Russo One",Impact,sans-serif;font-weight:400;font-size:13.5px;letter-spacing:.02em;
}
tbody tr:nth-child(even){background:var(--surface-2)}
tbody tr:nth-child(odd){background:var(--surface)}
tfoot td{background:var(--blue-deep);color:var(--gold);font-size:15px}

/* ---------- карточки, плашки ---------- */

.cru-card{
  background:var(--surface);
  border:1px solid var(--line);
  border-left:3px solid var(--gold-2);
  border-radius:2px;
  padding:16px 18px;
  margin:14px 0;
}
.cru-flag{
  background:var(--blue-deep);
  border:1px solid var(--blue);
  border-radius:2px;
  padding:14px 18px;
  margin:16px 0;
  font-size:15.5px;color:var(--text-2);
}
.cru-grid-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:16px 0}
.cru-grid-cards .cru-card{margin:0}

.cru-tiers{display:grid;grid-template-columns:repeat(5,1fr);gap:0;margin:16px 0;border:1px solid var(--line);border-radius:2px;overflow:hidden}
.cru-tiers div{padding:14px 12px;background:var(--surface);border-left:1px solid var(--line)}
.cru-tiers div:first-child{border-left:0}
.cru-tiers .cru-tier-n{font-family:"Russo One",Impact,sans-serif;color:var(--gold);font-size:15px;display:block;margin-bottom:4px}
.cru-tiers span.cru-tier-c{font-size:13px;color:var(--muted);display:block}

.cru-provs{
  display:grid;grid-template-columns:repeat(4,1fr);gap:1px;
  background:var(--line);border:1px solid var(--line);border-radius:2px;margin:16px 0;
}
.cru-provs figure{margin:0;background:var(--surface-2);padding:14px;text-align:center}
.cru-provs img{margin:0 auto}
.cru-provs figcaption{font-size:12px;color:var(--muted);margin-top:8px}

ul,ol{margin:0 0 14px;padding-left:20px}
li{margin-bottom:7px}

/* ---------- FAQ ---------- */

.cru-faq details{
  background:var(--surface);
  border:1px solid var(--line);
  border-left:3px double var(--gold-2);
  border-radius:2px;
  padding:12px 16px;
  margin-bottom:10px;
}
.cru-faq summary{
  cursor:pointer;
  font-family:"Russo One",Impact,sans-serif;
  font-size:15px;color:var(--text);
  list-style:none;
  position:relative;padding-right:26px;
}
.cru-faq summary::-webkit-details-marker{display:none}
.cru-faq summary::after{
  content:"+";position:absolute;right:0;top:-2px;
  color:var(--gold-2);font-size:19px;
}
.cru-faq details[open] summary::after{content:"\2212"}
.cru-faq details p{margin:10px 0 0;color:var(--text-2);font-size:15.5px}

/* ---------- отзыв ---------- */

.cru-quote{
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  padding:16px 0 12px;margin:18px 0;
}
.cru-quote p{font-size:16.5px;color:var(--text-2);margin-bottom:8px}
.cru-quote footer{font-size:13px;color:var(--muted)}

/* ---------- финальный CTA ---------- */

.cru-final{
  background:var(--surface);
  border:1px solid var(--line);
  border-top:3px solid var(--gold-2);
  border-radius:2px;
  padding:24px;margin:22px 0 0;
  text-align:center;
}

/* ---------- подвал ---------- */

.cru-foot{
  background:var(--bg-deep);
  border-top:1px solid var(--line);
  margin-top:34px;
  padding:28px 0 34px;
  font-size:14px;color:var(--muted);
}
.cru-foot-grid{display:grid;grid-template-columns:1fr 1fr;gap:0}
.cru-foot-grid > div{padding:0 26px}
.cru-foot-grid > div:first-child{padding-left:0}
.cru-foot-grid > div + div{border-left:1px solid var(--line);padding-right:0}
.cru-foot dl{margin:0}
.cru-foot dt{color:var(--muted-2);font-size:12px;letter-spacing:.06em;text-transform:uppercase;margin-top:10px}
.cru-foot dd{margin:2px 0 0;color:var(--text-2)}
.cru-age{
  margin-top:20px;padding-top:14px;border-top:1px solid var(--line);
  color:var(--text-2);font-size:14px;
}

/* ---------- 640 px ---------- */

@media (max-width:900px){
  .cru-hero-grid,.cru-cols,.cru-cols-3,.cru-foot-grid{grid-template-columns:1fr}
  .cru-hero-grid > div:first-child{padding-right:0}
  .cru-hero-grid > div + div,.cru-cols > div + div,.cru-foot-grid > div + div{
    border-left:0;border-top:1px solid var(--line);padding-left:0;padding-top:20px;margin-top:20px;
  }
  .cru-cols > div{padding:0}
  .cru-foot-grid > div{padding:0}
  .cru-kpi{grid-template-columns:repeat(2,1fr)}
  .cru-kpi div{border-left:1px solid var(--line);border-top:1px solid var(--line)}
  .cru-grid-cards{grid-template-columns:1fr}
  .cru-tiers{grid-template-columns:1fr 1fr}
  .cru-tiers div{border-top:1px solid var(--line)}
  .cru-provs{grid-template-columns:repeat(2,1fr)}
  .cru-gutter-fig{grid-template-columns:1fr}
  .cru-gutter-fig::before,.cru-gutter-fig::after{display:none}
  .cru-gutter-fig figure{padding:0}
}

@media (max-width:640px){
  body{font-size:16px}
  .cru-shell{padding:0 14px}
  h1{font-size:25px}
  h2{font-size:20px}
  h3{font-size:16px}
  .cru-lead{font-size:17px}
  .cru-top-grid{grid-template-columns:repeat(12,1fr);row-gap:0;padding:8px 0;min-height:0}
  .cru-brandmark{grid-column:span 7}
  .cru-acts{grid-column:span 5;gap:6px}
  .cru-nav{grid-column:span 12;order:3;border-top:1px solid var(--line);padding-top:8px;margin-top:8px;font-size:12.5px}
  .cru-nav a{padding:2px 9px}
  .cru-btn{padding:9px 11px;font-size:11px;letter-spacing:0}
  .cru-btn-wide{padding:13px 18px;font-size:14px}
  .cru-wordmark{font-size:16px}
  .cru-aside-fig{float:none;margin:16px 0;max-width:100%;border-left:0;padding-left:0;border-top:1px solid var(--line);padding-top:14px}
  .cru-aside-fig img{margin:0 auto}
}