.hero-section { background:#bd6177; color:#fff; max-height:652px; margin:0 0 88px; }
.hero-container { padding:88px 0; }
.hero { display:flex; }
.hero-section h1 { margin-bottom:24px !important; color:#fff !important; }
.hero-section .p20 { margin-bottom:48px; }
.hero-section .text { flex:0 0 680px; }
.hero-section .image-container { position:relative; }
.hero-section .image { position:absolute; bottom:-88px; }
.hero-buttons { display:flex; gap:24px; }
.hero-buttons a:hover { text-decoration:none;}

@media (max-width:1024px) {
  .hero-section { margin:0 0 60px; }
  .hero-container { padding:60px 0; }
  .hero { gap:24px; }
  .hero-section .text { flex:0 0 59%; }
  .hero-section .image { height:auto; max-width:360px; bottom:-64px; }
}
@media (max-width:991px) {
  .hero-section { max-height:none; }
  .hero-container { padding:48px 0; }
  .hero { flex-direction:column; align-items:center; text-align:center; }
  .hero-section .image-container { display:none; }
  .hero-section .p20 { margin-bottom:32px; }
  .hero-buttons { justify-content:center; }
}
@media (max-width:576px) {
  .hero-container { padding:36px 0; }
  .hero-buttons { gap:12px; flex-direction:column; align-items:center; }
  .hero-buttons a { width:220px; }
}

.section-cost { margin:88px 0; }
.section-cost h2 { text-align:left; }
.cost-panels { display:grid; grid-template-columns:1fr 1fr; gap:40px; margin-top:12px; }
.cost-panel { background:#EDF2FF; border-radius:16px; padding:32px; }
.cost-panel__title { font-size:40px; line-height:48px; font-weight:700; letter-spacing:-0.02em; color:#212529; margin-bottom:8px; }
.cost-link { display:inline-block; margin-top:16px; color:#337ab7; text-decoration:none; }
.cost-link:hover { text-decoration:underline; }

@media (max-width:1024px) {
  .section-cost { margin:60px 0; }
  .cost-panel { padding:28px 32px; border-radius:24px; }
  .cost-panel__title { font-size:36px; }
}
@media (max-width:768px) {
  .cost-panels { grid-template-columns:1fr; gap:20px; }
  .cost-panel__title { font-size:36px; }
}

.section-features { margin:88px 0; }
.section-features h2 { text-align:left;}
.features-grid { display:grid; grid-template-columns:1fr 1fr; gap:36px 64px; }
.feature { display:flex; align-items:center; gap:24px; }
.feature__icon { flex:0 0 72px; width:72px; height:72px; border-radius:50%; background:#bd6177; display:flex; align-items:center; justify-content:center; }
.feature__icon img { width:75px; height:75px; filter:brightness(0) invert(1); }
.feature__text { font-size:20px; line-height:1.45; color:#212529; margin:0; }

@media (max-width:1024px) {
  .features-grid { gap:28px 40px; }
  .feature__icon { flex:0 0 64px; width:64px; height:64px; }
  .feature__icon img { width:64px; height:64px; }
}
@media (max-width:991px) {
  .features-grid { grid-template-columns:1fr; gap:24px; }
  .section-features { margin:60px 0; }
}

@media (max-width:576px) {
  .feature { gap: 12px; }
  .feature__icon { flex:0 0 48px; width:48px; height:48px; }
  .feature__icon img { width:48px; height:48px; }
}

.section-workflow { margin:88px 0; }
.container-workflow { background:#f2f3f5; padding:42px 16px 36px 72px; border-radius:16px; }
.section-workflow .info { display:flex; align-items:center; gap:56px; }
.section-workflow img { width:262px; }
.section-workflow .list { display:flex; flex-direction:column; gap:18px; }

@media (max-width:1024px) {
  .section-workflow { margin:60px 0; }
  .container-workflow { padding:36px 16px 32px 36px; }
  .section-workflow .info { gap:36px; }
  .section-workflow img { width:200px; }
}
@media (max-width:991px) {
  .container-workflow { padding:28px 20px; }
  .section-workflow .info { flex-direction:column; align-items:flex-start; gap:20px; }
  .section-workflow .image-container { display:none; }
}
@media (max-width:576px) {
  .container-workflow { padding:20px; }
  .section-workflow .list { gap:12px; }
}

.container-howworks { padding-bottom:88px; }
.container-howworks h2 { text-align:left; }
.howworks-media { background: #f6edff; border-radius:16px;}
.howworks-media-2 { background: #edf2ff; }
.howworks-list { display:grid; gap:64px; margin-top:16px; }
.howworks-item { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:56px; }
.howworks-item:nth-child(even) .howworks-media { order:2; }
.howworks-item:nth-child(even) .howworks-content { order:1; }
.howworks-media img { display:block; width:100%; height:auto; border-radius:16px; box-shadow:0 10px 24px rgba(0,0,0,.06); }
.howworks-content .h3 { margin-bottom:12px; font-weight: 400;}


@media (max-width:1024px) {
  .howworks-item { align-items:flex-start; gap:72px; }
  .howworks-item:nth-child(even) .howworks-media,
  .howworks-item:nth-child(even) .howworks-content { order:initial; }
}

@media (max-width:991px) {
  .howworks-item { grid-template-columns:1fr; }
  .howworks-media img { display: none; }
  .howworks-list { gap:48px; }
  .howworks-item { gap:0; }
}

@media (max-width:576px) {
  .howworks-list { gap:32px; }
  .container-howworks { padding-bottom:60px; }
}

.section-payments { background-color:#edf2ff; text-align:center; margin:0 0 88px; }
.container-payments { padding:48px 0 88px; }
.payments-logos { display:flex; justify-content:center; align-items:center; gap:28px; }
.payments-logo { max-height:52px; width:auto; display:block; }

.section-howto { --howto-gap:56px; --howto-badge-size:80px; --howto-badge-bg:#bd6177; --howto-badge-num:#ffffff; margin: 88px 0;}
.container-howto h2 { text-align: left; }
.howto-steps { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:var(--howto-gap); list-style:none; margin-bottom:64px; padding:0; }
.howto-badge { position:relative; width:var(--howto-badge-size); height:var(--howto-badge-size); display:inline-grid; place-items:center; }
.howto-badge-hex { width:100%; height:100%; fill:var(--howto-badge-bg); }
.howto-badge-num { position:absolute; font-family: "ProximaNova-Light", Arial, sans-serif; font-size:48px; font-weight:400; color:var(--howto-badge-num); }
.howto-cta { margin-top:16px; }
.container-howto a:hover { text-decoration: none; }

@media (max-width:1024px) {
  .section-howto { --howto-badge-size:80px; --howto-gap:32px; }
  .howto-steps { grid-template-columns:repeat(1, minmax(0, 1fr)); }
  .howto-step { display: flex; align-items: center; gap: 24px; }
  .howto-badge { width:var(--howto-badge-size); height:var(--howto-badge-size); }
}
@media (max-width:576px) {
  .howto-steps { grid-template-columns:1fr; }
  .howto-badge { width:80px; height:80px; }
  .howto-badge-hex { width:80px; height:80px; }
  .payments-logos { flex-wrap: wrap; }
}

.section-faq { margin:88px 0; }
.section-faq .item { border-top:1px solid #e1e1e1; cursor:pointer; padding:22px 110px 10px 20px; }
.section-faq .item.active { padding:22px 110px 24px 20px; }
.section-faq .item-last { border-bottom:1px solid #e1e1e1; }
.section-faq .item .p16 { overflow:hidden; height:0; transition:height .3s ease; }
.section-faq .item .p22 { position:relative; user-select:none; margin-bottom:12px; }
.section-faq .item .icon { background:url("https://payanyway.ru/info/w/ru/public/w/kassa/images/drop.png"); width:24px; height:12px; position:absolute; right:-72px; top:8px; transform:rotate(180deg); transition:transform .3s ease; }
.section-faq .item.active .icon { transform:rotate(0deg); }
.section-faq .item a { color:#007bff; }
.section-faq .item a:hover { text-decoration:underline; }
.section-faq .item ol { margin-left:28px; }
.section-faq .item ol li { margin-bottom:6px; }
.section-faq .item ul { list-style:none; margin:8px 0 8px 24px; padding:0; }
.section-faq .item ul li { position:relative; margin-bottom:6px; padding-left:14px; }
.section-faq .item ul li::before { content:"–"; position:absolute; left:0; color:currentColor; }
.section-faq .faq { padding-bottom: 0; }
.section-faq h2 { text-align: left; }

@media (max-width:1024px) {
  .section-faq { margin:60px 0; }
  .section-faq .item { padding:20px 90px 10px 16px; }
  .section-faq .item.active { padding:20px 90px 20px 16px; }
  .section-faq .item .icon { right:-56px; }
}
@media (max-width:991px) {
  .section-faq .item { padding:18px 72px 8px 16px; }
  .section-faq .item.active { padding:18px 72px 18px 16px; }
  .section-faq .item .icon { right:-48px; }
}
@media (max-width:576px) {
  .section-faq .item { padding:16px 44px 6px 12px; }
  .section-faq .item.active { padding:16px 44px 16px 12px; }
  .section-faq .item .icon { right:-28px; transform:scale(.9) rotate(180deg); }
}

.section-contacts { background-color:#bd6177; text-align:center; color:#fff; }
.container-contacts { display:grid; justify-items:center; padding:64px 0 88px; }
.section-contacts .contacts-link { font-weight:400; color:#fff; text-decoration:none; }
.section-contacts .contacts-link:hover { text-decoration:underline; }
.contacts-link--email { margin-bottom:16px; font-size:24px; line-height:34px;}
.contacts-link--phone { font-size:18px; line-height:24px;}

#layout { padding:0; }
#outer { margin:0; padding:0; max-width:100%; }
