:root {
  --bg-main: #181828;
  --bg-header: #22223b;
  --text-main: #fafaff;
  --accent: #f72585;
  --bg-popup: rgba(30,30,45,0.97);
  --border: #303045;
  --shadow: 0 4px 24px rgba(0,0,0,0.35);
}

html, body {
  margin: 0; padding: 0;
  font-family: 'Inter', Arial, sans-serif;
  background: var(--bg-main);
  color: var(--text-main);
  min-height: 100vh;
}

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

header {
  background: var(--bg-header) url('../img/header-bg.jpg') center/cover no-repeat;
  box-shadow: var(--shadow);
  padding-bottom: 2.5rem;
  position: relative;
}
.header__wrap {
  max-width: 1100px; margin: 0 auto;
  padding: 1rem 1.5rem;
  display: flex; align-items: flex-start; justify-content: space-between;
  position: relative;
}
.header__logo {
  width: 100px; height: 44px;
  display: flex; align-items: center; cursor: pointer;
}
.header__nav {
  display: flex; align-items: center; gap: 2.5rem;
}
.header__nav a {
  text-decoration: none; color: var(--text-main);
  font-weight: 500; font-size: 1.1rem; transition: color .15s;
}
.header__nav a:hover { color: var(--accent); }
.burger {
  display: none; background: none; border: none; cursor: pointer; padding: 6px; margin-left: 1rem;
}
.burger span {
  display: block; width: 28px; height: 3px; background: var(--text-main);
  margin: 6px 0; border-radius: 2px;
  transition: .2s;
}

/* Burger menu mobile */
@media (max-width: 800px) {
  .header__nav {
    position: absolute; top: 56px; right: 2rem; background: var(--bg-header);
    flex-direction: column; gap: 1.5rem;
    min-width: 180px;
    box-shadow: var(--shadow);
    border-radius: 1rem;
    padding: 1rem 0;
    opacity: 0; pointer-events: none; transition: .25s;
    z-index: 10;
  }
  .header__nav.open {
    opacity: 1; pointer-events: auto;
  }
  .burger { display: block; }
}

/* Header H1 and description */
.header__main {
  max-width: 1100px; margin: 0 auto; padding: 2.5rem 1.5rem 0 1.5rem;
}
.header__main h1 {
  font-size: 2.6rem; font-weight: 700; margin: 0 0 0.7rem 0;
  color: var(--accent); letter-spacing: -2px;
}
.header__main p {
  font-size: 1.2rem; color: #dddbe5; margin: 0;
}

/* Main content styles */
main {
  max-width: 900px; margin: 2.5rem auto; padding: 1.5rem;
  background: #232345; border-radius: 1.2rem;
  box-shadow: 0 4px 32px rgba(15, 10, 40, 0.1);
}

h2, h3, h4 { color: var(--accent); margin-top: 2rem; margin-bottom: 1rem; }
h2 { font-size: 2rem; }
h3 { font-size: 1.4rem; }
h4 { font-size: 1.15rem; }

ul, ol { margin: 1rem 0 1rem 2.2rem; }
li { margin-bottom: .5em; }

table {
  width: 100%; border-collapse: collapse; background: #232345;
  margin: 2rem 0; border-radius: 12px; overflow: hidden; box-shadow: var(--shadow);
}
th, td {
  padding: 0.8rem 1rem; border-bottom: 1px solid var(--border);
  text-align: left; font-size: 1rem;
}
th { background: #29295e; color: var(--accent); font-weight: 600; }
tr:last-child td { border-bottom: none; }

.info-block {
  background: #312351; border-left: 4px solid var(--accent);
  padding: 1.2rem 1.5rem; margin: 2rem 0; border-radius: .8rem; color: #e1dbf5;
  font-size: 1.05rem;
}

/* FAQ accordion */
.faq {
  margin: 2rem 0;
}

.faq__card {
  background: #222248;
  border-radius: 0.9rem;
  margin-bottom: 0.7rem;   
  overflow: hidden;
  box-shadow: 0 2px 10px rgba(32,32,64,0.10);
}

.faq__input { display: none; }

.faq__label {
  display: block;
  padding: 1rem 1.2rem;
  cursor: pointer;
  font-weight: 500;
  color: var(--accent);
  border-radius: 0.9rem;  
  background: transparent;
  transition: background .16s;
}
.faq__label:hover {
  background: rgba(247,37,133,0.07);
}

.faq__body {
  max-height: 0;
  overflow: hidden;
  background: #191932;
  color: #d2cef1;
  font-size: 1.06rem;
  padding: 0 1.2rem;
  border-radius: 0.9rem;
  transition: max-height 0.3s, padding 0.3s;
  margin: 0;   /* Нет внешних отступов */
  box-sizing: border-box;
}
.faq__input:checked ~ .faq__body {
  max-height: 120px;
  padding: 1.1rem 1.2rem;
}


/* Carousel */
.carousel {
  width: 100%; max-width: 700px; margin: 2.5rem auto;
  position: relative; overflow: hidden; border-radius: 1.2rem;
  box-shadow: var(--shadow);
}
.carousel__track {
  display: flex; transition: transform .4s cubic-bezier(.7,.3,.4,1);
  will-change: transform;
  touch-action: pan-x;
}
.carousel__item {
  flex: 0 0 100%; min-width: 100%; max-width: 100%;
  text-align: center; background: #24244b;
}
.carousel__item img { width: 100%; height: 320px; object-fit: cover; }
.carousel__arrows {
  position: absolute; top: 50%; width: 100%;
  display: flex; justify-content: space-between; align-items: center;
  transform: translateY(-50%);
  pointer-events: none;
}
.carousel__arrow {
  background: rgba(36,36,75,0.9); border: none; pointer-events: all;
  width: 40px; height: 40px; border-radius: 50%; color: var(--accent);
  font-size: 1.6rem; display: flex; align-items: center; justify-content: center;
  cursor: pointer; box-shadow: 0 2px 16px rgba(20,15,30,0.16);
  transition: background .18s;
}
.carousel__arrow:hover { background: var(--accent); color: #fff; }

/* Footer */
footer {
  margin-top: 3.5rem; padding: 2.2rem 1.5rem 1.2rem 1.5rem;
  background: #191928; text-align: center;
}
.footer__partners {
  display: flex; justify-content: center; gap: 2.2rem; align-items: center;
  margin-bottom: 1.1rem;
}
.footer__partners img { width: 68px; height: 34px; object-fit: contain; opacity: .90; transition: opacity .18s; }
.footer__partners img:hover { opacity: 1; }
.footer__copyright { color: #8887a8; font-size: .92rem; margin-bottom: 0.5rem; }
.footer__links a {
  color: #a7a5ce; font-size: 0.85rem; text-decoration: underline;
  margin: 0 0.6rem;
}

@media (max-width: 600px) {
  main, .header__main { padding: 1rem; }
  .carousel__item img { height: 180px; }
  .footer__partners img { width: 48px; height: 24px; }
}