/* plinko-slots.pro — архетип pachinko-rail, namespace pcr */

:root{
  --bg:#FFFFFF;          /* фон страницы — светлая тема, как на оригинале */
  --bg-soft:#FFF6F9;     /* очень светлая розовая подложка */
  --surface:#FFE6EF;     /* заливка секций и карточек */
  --surface-2:#FFD3E2;   /* вторая заливка, таблицы и выделенные блоки */
  --line:#FFB9D0;        /* границы, разделители, рамки таблиц */
  --pink:#FF6FA3;        /* основной акцент, фон главной кнопки */
  --pink-soft:#FF9FBD;   /* ховер, второстепенные акценты */
  --pink-mid:#E85F91;    /* активное состояние */
  --pink-deep:#D94F85;   /* нажатие */
  --plum:#4A1D2C;        /* основной текст */
  --plum-soft:#4E3441;   /* подписи, второстепенный текст */
  --gold:#FFBF19;        /* рейтинг, значки, акцент в цифрах */
  --green:#15AC24;       /* «да» в таблицах сравнения */
  --red:#E40539;         /* «нет» в таблицах сравнения */

  --pcr-rail: 4px;
  --pcr-tilt: -1.4deg;
  --pcr-gap: clamp(1rem, 2.4vw, 2rem);
}

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

html{ scroll-behavior:smooth; }

body{
  margin:0;
  background:var(--bg);
  color:var(--plum);
  font-family:"PT Serif", Georgia, serif;
  font-size:17px;
  line-height:1.66;
  overflow-x:hidden;
}

h1,h2,h3,.pcr-word,.pcr-kpi-num,.pcr-btn{
  font-family:"Tektur", "Trebuchet MS", sans-serif;
  font-weight:600;
  letter-spacing:.01em;
}

a{ color:var(--pink-mid); }
a:hover{ color:var(--pink-deep); }

.pcr-shell{
  width:min(1120px, 100% - 2rem);
  margin-inline:auto;
}

/* ---------- шапка: наклонные рельсы ---------- */

.pcr-top{
  position:sticky;
  top:0;
  z-index:40;
  background:var(--bg-soft);
  border-bottom:var(--pcr-rail) solid var(--pink);
  box-shadow:0 2px 0 var(--line);
}

.pcr-top::before{
  content:"";
  display:block;
  height:6px;
  background:repeating-linear-gradient(
    90deg, var(--line) 0 14px, transparent 14px 34px);
}

.pcr-top-in{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--pcr-gap);
  padding:.6rem 0 .9rem;
}

.pcr-word{
  display:inline-flex;
  align-items:baseline;
  gap:.35rem;
  font-size:clamp(1.15rem, 3.1vw, 1.6rem);
  text-decoration:none;
  color:var(--plum);
  transform:rotate(var(--pcr-tilt));
  transform-origin:left center;
  border-bottom:3px solid var(--pink);
  padding-bottom:.1rem;
}
.pcr-word span{ color:var(--pink-mid); }
.pcr-word i{ font-style:normal; font-size:.62em; color:var(--plum-soft); letter-spacing:.14em; }

.pcr-rails{
  display:flex;
  align-items:center;
  gap:.6rem;
}

.pcr-btn{
  display:inline-block;
  border-radius:20px;
  padding:.625rem 1.25rem;
  text-transform:uppercase;
  text-decoration:none;
  font-size:.82rem;
  white-space:nowrap;
  transition:background .16s ease, color .16s ease, transform .16s ease;
}

.pcr-btn-main{
  background:var(--pink);
  color:#FFFFFF;
  border:2px solid var(--pink);
}
.pcr-btn-main:hover{ background:var(--pink-mid); border-color:var(--pink-mid); color:#FFFFFF; }
.pcr-btn-main:active{ background:var(--pink-deep); border-color:var(--pink-deep); }

.pcr-btn-ghost{
  background:transparent;
  color:var(--pink);
  border:2px solid var(--pink);
}
.pcr-btn-ghost:hover{ background:var(--surface); color:var(--pink-deep); }

/* сдвиг кнопок по вертикали — «рельсы» уходят под уклон */
.pcr-rails .pcr-btn-ghost{ transform:translateY(-7px) rotate(var(--pcr-tilt)); }
.pcr-rails .pcr-btn-main{ transform:translateY(7px) rotate(var(--pcr-tilt)); }
.pcr-rails .pcr-btn-ghost:hover,
.pcr-rails .pcr-btn-main:hover{ transform:translateY(0) rotate(0deg); }

/* ---------- общая раскладка секций ---------- */

.pcr-sec{ padding:2.4rem 0; }
.pcr-sec-soft{ background:var(--bg-soft); }
.pcr-sec-fill{ background:var(--surface); }

.pcr-sec h2{
  font-size:clamp(1.25rem, 3.2vw, 1.75rem);
  line-height:1.24;
  margin:0 0 .9rem;
  padding-left:.85rem;
  border-left:var(--pcr-rail) solid var(--pink);
}

.pcr-sec h3{
  font-size:1.06rem;
  margin:1.5rem 0 .45rem;
  color:var(--plum);
}
.pcr-sec h3::before{
  content:"▚ ";
  color:var(--pink-soft);
}

p{ margin:0 0 .9rem; }

.pcr-lede{ font-size:1.08rem; }
.pcr-note{ color:var(--plum-soft); font-size:.92rem; }
.pcr-hl{ color:var(--pink-mid); font-weight:700; }
.pcr-num{ color:var(--gold); font-weight:700; font-family:"Tektur", sans-serif; }
.pcr-yes{ color:var(--green); font-weight:700; }
.pcr-no{ color:var(--red); font-weight:700; }

/* ---------- hero ---------- */

.pcr-hero{
  background:
    linear-gradient(112deg, var(--surface) 0%, var(--bg-soft) 52%, var(--bg) 100%);
  border-bottom:2px solid var(--line);
  padding:2.2rem 0 2.6rem;
}

.pcr-hero h1{
  font-size:clamp(1.55rem, 5vw, 2.5rem);
  line-height:1.16;
  margin:0 0 .8rem;
}

.pcr-hero-grid{
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);
  gap:var(--pcr-gap);
  align-items:center;
}

.pcr-kpi{
  display:grid;
  grid-template-columns:repeat(5, minmax(0,1fr));
  gap:.5rem;
  margin:1.2rem 0 1.3rem;
}

.pcr-kpi div{
  background:var(--bg);
  border:2px solid var(--line);
  border-bottom:var(--pcr-rail) solid var(--pink-soft);
  border-radius:4px 4px 14px 14px;
  padding:.55rem .4rem;
  text-align:center;
}
.pcr-kpi div:nth-child(even){ transform:translateY(8px); }

.pcr-kpi-num{
  display:block;
  font-size:1.02rem;
  color:var(--pink-mid);
}
.pcr-kpi-cap{
  display:block;
  font-size:.72rem;
  color:var(--plum-soft);
  line-height:1.3;
}

.pcr-cta-row{ display:flex; flex-wrap:wrap; gap:.7rem; align-items:center; }

/* ---------- SVG ---------- */

.pcr-art{
  background:var(--bg);
  border:2px solid var(--line);
  border-radius:16px;
  padding:.8rem;
}
.pcr-art svg{ display:block; width:100%; max-width:100%; height:auto; }
.pcr-cap{
  margin:.5rem 0 0;
  font-size:.82rem;
  color:var(--plum-soft);
  text-align:center;
}

.pcr-art-tilt{ transform:rotate(1deg); }

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

.pcr-scroll{ overflow-x:auto; margin:1rem 0; }

table{
  border-collapse:collapse;
  width:100%;
  min-width:420px;
  background:var(--bg);
  font-size:.93rem;
}
caption{
  caption-side:top;
  text-align:left;
  font-size:.86rem;
  color:var(--plum-soft);
  padding-bottom:.4rem;
}
th,td{
  border:1px solid var(--plum);
  padding:.45rem .55rem;
  text-align:center;
}
thead th{ background:var(--surface-2); font-family:"Tektur", sans-serif; font-size:.84rem; }
tbody tr:nth-child(even) td{ background:var(--bg-soft); }
tfoot td{ background:var(--surface-2); }

/* ---------- карточки и списки ---------- */

.pcr-cards{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(210px, 1fr));
  gap:.8rem;
  margin:1rem 0;
}
.pcr-card{
  background:var(--bg);
  border:2px solid var(--line);
  border-radius:16px 4px 16px 4px;
  padding:.8rem .9rem;
}
.pcr-card h3{ margin-top:0; }

.pcr-steps{
  list-style:none;
  counter-reset:pcrstep;
  margin:1rem 0;
  padding:0;
}
.pcr-steps li{
  counter-increment:pcrstep;
  position:relative;
  padding:.35rem 0 .35rem 2.3rem;
  border-bottom:1px dashed var(--line);
}
.pcr-steps li::before{
  content:counter(pcrstep);
  position:absolute;
  left:0;
  top:.35rem;
  width:1.65rem;
  height:1.65rem;
  border-radius:50%;
  background:var(--pink);
  color:#FFFFFF;
  font-family:"Tektur", sans-serif;
  font-size:.82rem;
  display:grid;
  place-items:center;
}

.pcr-club{
  display:flex;
  flex-wrap:wrap;
  gap:.4rem;
  margin:1rem 0;
  padding:0;
  list-style:none;
}
.pcr-club li{
  background:var(--surface-2);
  border:2px solid var(--line);
  border-radius:20px;
  padding:.3rem .85rem;
  font-family:"Tektur", sans-serif;
  font-size:.82rem;
}
.pcr-club li:nth-child(odd){ transform:translateY(-5px); }

.pcr-quote{
  margin:1.2rem 0;
  padding:.9rem 1rem;
  background:var(--bg);
  border:2px solid var(--line);
  border-left:var(--pcr-rail) solid var(--gold);
  border-radius:0 16px 16px 0;
}
.pcr-quote p{ margin:0 0 .4rem; }
.pcr-quote footer{ font-size:.85rem; color:var(--plum-soft); }

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

details{
  background:var(--bg);
  border:2px solid var(--line);
  border-radius:12px;
  padding:.55rem .85rem;
  margin:0 0 .55rem;
}
details[open]{ border-color:var(--pink-soft); background:var(--bg-soft); }
summary{
  cursor:pointer;
  font-family:"Tektur", sans-serif;
  font-size:.96rem;
  color:var(--plum);
}
summary::marker{ color:var(--pink); }
details p{ margin:.55rem 0 .2rem; }

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

.pcr-foot{
  background:var(--surface);
  border-top:var(--pcr-rail) solid var(--pink);
  padding:1.8rem 0 2.2rem;
  font-size:.9rem;
  color:var(--plum-soft);
}
.pcr-foot p{ margin:0 0 .5rem; }
.pcr-age{
  font-family:"Tektur", sans-serif;
  color:var(--plum);
  border:2px solid var(--pink);
  border-radius:20px;
  padding:.45rem .9rem;
  display:inline-block;
}

/* ---------- мобильная раскладка ---------- */

@media (max-width:900px){
  .pcr-hero-grid{ grid-template-columns:1fr; }
  .pcr-kpi{ grid-template-columns:repeat(3, minmax(0,1fr)); }
}

@media (max-width:640px){
  body{ font-size:16px; }
  .pcr-shell{ width:calc(100% - 1.4rem); }
  .pcr-top-in{ flex-wrap:nowrap; gap:.4rem; padding:.5rem 0 .7rem; }
  .pcr-word{ font-size:1rem; transform:none; }
  .pcr-word i{ display:none; }
  .pcr-rails{ gap:.35rem; }
  .pcr-btn{ padding:.5rem .7rem; font-size:.66rem; }
  .pcr-rails .pcr-btn-ghost,
  .pcr-rails .pcr-btn-main{ transform:none; }
  .pcr-kpi{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .pcr-kpi div:nth-child(even){ transform:none; }
  .pcr-art-tilt{ transform:none; }
  .pcr-club li:nth-child(odd){ transform:none; }
  table{ min-width:380px; font-size:.86rem; }
  th,td{ padding:.35rem .3rem; }
}
