.btn {
  --bg_btn: var(--primary_color);
  --fg_btn: var(--on_primary_color);
  --bd_btn: transparent;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: clamp(12px, calc(11.32px + 0.23vw), 14px) clamp(18px, calc(15.27px + 0.91vw), 26px);
  border: 2px solid var(--bd_btn);
  border-radius: 999px;
  background: var(--bg_btn);
  color: var(--fg_btn);
  font-size: 16px;
  font-weight: 600;
  white-space: nowrap;
  cursor: pointer;
  transition:
    transform .18s var(--ease),
    background .18s var(--ease),
    box-shadow .18s var(--ease),
    border-color .18s var(--ease);
}
.btn:hover {
  transform: translateY(-2px);
}
.btn:active {
  transform: translateY(0);
}

.btn_primary {
  box-shadow: 0 8px 24px rgba(255, 204, 0, .18);
}
.btn_primary:hover {
  --bg_btn: #ffd633;
  box-shadow: 0 12px 32px rgba(255, 204, 0, .26);
}

.btn_ghost {
  --bg_btn: transparent;
  --fg_btn: var(--text_primary_color);
  --bd_btn: var(--border_strong_color);
}
.btn_ghost:hover {
  --bd_btn: var(--primary_color);
  --fg_btn: var(--primary_color);
  background: var(--primary_wash_color);
}

.btn_sm {
  padding: clamp(9px, calc(8.66px + 0.11vw), 10px) clamp(15px, calc(13.3px + 0.57vw), 20px);
  font-size: 16px;
}
.btn_lg {
  padding: clamp(14px, calc(13.32px + 0.23vw), 16px) clamp(20px, calc(15.91px + 1.36vw), 32px);
  font-size: clamp(16px, calc(14.49px + 0.17vw), 16.5px);
}
.btn_block {
  display: flex;
  width: 100%;
}

.stores {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 34px;
}
.stores_center {
  justify-content: center;
}

.store {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  padding: 10px clamp(14px, calc(11.95px + 0.68vw), 20px) 10px clamp(12px, calc(10.3px + 0.57vw), 17px);
  border: 1px solid var(--border_strong_color);
  border-radius: 12px;
  background: var(--surface_inverse_color);
  color: var(--text_primary_color);
  transition: transform .18s var(--ease), border-color .18s var(--ease), box-shadow .18s var(--ease);
}
.store:hover {
  transform: translateY(-2px);
  border-color: var(--primary_color);
  box-shadow: var(--shadow);
}
.store_glyph {
  width: clamp(20px, calc(18.64px + 0.45vw), 24px);
  height: clamp(20px, calc(18.64px + 0.45vw), 24px);
  fill: var(--text_primary_color);
  flex: none;
}
.store_glyph_play {
  fill: none;
}
.store span {
  display: flex;
  flex-direction: column;
  line-height: 1.15;
  min-width: 0;
}
.store small {
  font-size: 16px;
  letter-spacing: .04em;
  color: var(--text_secondary_color);
}
.store b {
  font-size: 16px;
  font-weight: 600;
  letter-spacing: -.01em;
}

.store_light {
  background: var(--on_primary_color);
  border-color: var(--on_primary_color);
}
.store_light:hover {
  border-color: #000;
}

.feature {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: center;
}
.feature_text h2 {
  font-size: clamp(24px, calc(17.86px + 2.05vw), 42px);
  margin-bottom: 20px;
}
.feature_text > p {
  font-size: clamp(16px, calc(14.82px + 0.23vw), 17.5px);
  margin-bottom: 30px;
}

.feature_box {
  padding: clamp(30px, calc(25.23px + 1.59vw), 44px) clamp(22px, calc(15.86px + 2.05vw), 40px);
  border-radius: var(--r_xl);
  background: var(--surface_container_low_color);
  border: 1px solid var(--border_color);
  border-left: 4px solid var(--primary_color);
  text-align: center;
}
.bignum {
  font-size: clamp(36px, calc(23.73px + 4.09vw), 72px);
  font-weight: 900;
  font-style: italic;
  line-height: 1;
  letter-spacing: -.045em;
  color: var(--primary_color);
}
.bignum_sub {
  margin-top: 14px;
  font-size: clamp(16px, calc(15.32px + 0.23vw), 18px);
  font-weight: 500;
  color: var(--text_primary_color);
}
.bignum_note {
  margin-top: 22px;
  padding-top: 20px;
  border-top: 1px solid var(--border_color);
  font-size: 16px;
  color: var(--text_secondary_color);
  text-align: left;
}

.perks {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  align-items: start;
}
.perk {
  --perk_accent: var(--border_strong_color);
  --perk_surface: var(--surface_container_color);
  position: relative;
  overflow: hidden;
  padding: clamp(26px, calc(24.64px + 0.45vw), 30px) clamp(22px, calc(20.64px + 0.45vw), 26px) clamp(28px, calc(26.64px + 0.45vw), 32px);
  border-radius: var(--r_xl);
  background: var(--surface_container_lowest_color);
  border: 1px solid var(--border_color);
  transition: transform .25s var(--ease), border-color .25s var(--ease);
}
.perk::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 3px;
  background: var(--perk_accent);
}
.perk:hover {
  transform: translateY(-6px);
  border-color: var(--perk_accent);
}
.perk:nth-child(even) {
  margin-top: 34px;
}

.perk_yellow {
  --perk_accent: var(--primary_color);
  --perk_surface: var(--primary_surface_color);
}
.perk_neutral {
  --perk_accent: var(--border_strong_color);
  --perk_surface: var(--surface_container_color);
}
.perk_green {
  --perk_accent: var(--success_color);
  --perk_surface: var(--success_surface_color);
}
.perk_red {
  --perk_accent: var(--secondary_color);
  --perk_surface: var(--secondary_surface_color);
}

.perk_icon {
  display: grid;
  place-items: center;
  width: clamp(46px, calc(43.27px + 0.91vw), 54px);
  height: clamp(46px, calc(43.27px + 0.91vw), 54px);
  margin-bottom: 20px;
  border-radius: 50%;
  background: var(--perk_surface);
  font-size: clamp(22px, calc(20.64px + 0.45vw), 26px);
  color: var(--perk_accent);
}
.perk_neutral .perk_icon {
  color: var(--text_secondary_color);
}
.perk h3 {
  font-size: clamp(17px, calc(16.32px + 0.23vw), 19px);
  margin-bottom: 10px;
}
.perk p {
  font-size: 16px;
  color: var(--text_secondary_color);
}

.who {
  display: grid;
  grid-template-columns: 7fr 5fr;
  gap: 60px;
  align-items: center;
}
.who_text .sec_lead {
  max-width: 46ch;
}

.pensum {
  display: flex;
  flex-direction: column;
}
.pensum li {
  display: flex;
  align-items: baseline;
  gap: 16px;
  padding: 20px 0;
  border-top: 1px solid var(--border_color);
}
.pensum li:last-child {
  border-bottom: 1px solid var(--border_color);
}
.pensum b {
  min-width: clamp(74px, calc(59px + 5vw), 118px);
  font-size: clamp(23px, calc(21.64px + 0.45vw), 27px);
  font-weight: 700;
  letter-spacing: -.03em;
  color: var(--primary_color);
}
.pensum span {
  font-size: 16px;
  color: var(--text_secondary_color);
}

.vs {
  border: 1px solid var(--border_color);
  border-radius: var(--r_xl);
  background: var(--surface_container_low_color);
  overflow-x: auto;
}
.vs_table {
  min-width: min(100%, clamp(440px, calc(378.64px + 20.45vw), 620px));
}
.vs_table th,
.vs_table td {
  padding: clamp(11px, calc(8.95px + 0.68vw), 17px) clamp(8px, calc(2.55px + 1.82vw), 24px);
  text-align: left;
  font-size: 16px;
  hyphens: auto;
  overflow-wrap: break-word;
}
.vs_table thead th {
  font-size: 16px;
  font-weight: 600;
  color: var(--text_tertiary_color);
  letter-spacing: .04em;
  border-bottom: 1px solid var(--border_color);
}
.vs_table thead th.is_us {
  color: var(--primary_color);
}
.vs_table tbody th {
  font-weight: 500;
  color: var(--text_primary_color);
}
.vs_table tbody tr + tr th,
.vs_table tbody tr + tr td {
  border-top: 1px solid var(--border_subtle_color);
}
.vs_table .is_us {
  background: var(--primary_wash_color);
}
.vs_table td {
  color: var(--text_secondary_color);
}

.ja,
.nein {
  display: inline-flex;
  align-items: center;
  gap: clamp(6px, calc(4.98px + 0.34vw), 9px);
}
.ja {
  color: var(--success_color);
  font-weight: 500;
}
.nein {
  color: var(--text_tertiary_color);
}
.ja::before {
  content: "";
  flex: none;
  border-radius: 50%;
  width: clamp(15px, calc(13.64px + 0.45vw), 19px);
  height: clamp(15px, calc(13.64px + 0.45vw), 19px);
  background: var(--success_surface_color) center/10px no-repeat;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='%234ade80' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 6.4l2.6 2.6L10 3'/%3E%3C/svg%3E");
}
.nein::before {
  content: "";
  flex: none;
  border-radius: 50%;
  width: clamp(15px, calc(13.64px + 0.45vw), 19px);
  height: clamp(15px, calc(13.64px + 0.45vw), 19px);
  background: var(--surface_container_color) center/9px no-repeat;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='%23757575' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M3 3l6 6M9 3l-6 6'/%3E%3C/svg%3E");
}
.vs_price th,
.vs_price td {
  font-size: clamp(16px, calc(12.31px + 0.4vw), 17px);
}
.vs_price b {
  color: var(--primary_color);
  font-size: clamp(16px, calc(12.3px + 0.57vw), 19px);
}

.finds {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}
.find {
  padding: clamp(24px, calc(22.64px + 0.45vw), 28px) clamp(20px, calc(17.95px + 0.68vw), 26px);
  border-radius: var(--r_xl);
  border: 1px solid var(--border_color);
  background: var(--surface_container_low_color);
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.find_tag {
  align-self: flex-start;
  padding: 5px 13px;
  border-radius: 999px;
  background: var(--surface_container_color);
  color: var(--text_secondary_color);
  font-size: 16px;
  font-weight: 600;
}
.find_tag_warn {
  background: var(--primary_surface_color);
  color: var(--primary_color);
}
.find_tag_bad {
  background: var(--secondary_surface_color);
  color: var(--secondary_text_color);
}
.find h3 {
  font-size: clamp(17px, calc(16.32px + 0.23vw), 19px);
}
.find p {
  font-size: 16px;
}
.find_sum {
  margin-top: auto;
  padding-top: 14px;
  border-top: 1px solid var(--border_subtle_color);
  font-weight: 600;
  color: var(--secondary_text_color) !important;
}
.find_sum_good {
  color: var(--success_color) !important;
}
.finds_note {
  margin-top: 24px;
  text-align: center;
  font-size: 16px;
  color: var(--text_tertiary_color);
}

.maker {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 44px;
  align-items: start;
  padding: clamp(34px, calc(27.86px + 2.05vw), 52px) clamp(24px, calc(15.82px + 2.73vw), 48px);
  border-radius: var(--r_xl);
  background: var(--surface_container_lowest_color);
  border: 1px solid var(--border_color);
}
.maker_mono {
  display: grid;
  place-items: center;
  width: clamp(72px, calc(61.09px + 3.64vw), 104px);
  height: clamp(72px, calc(61.09px + 3.64vw), 104px);
  border-radius: clamp(22px, calc(19.27px + 0.91vw), 30px);
  background: var(--primary_surface_color);
  border: 1px solid var(--primary_border_color);
  color: var(--primary_color);
  font-weight: 600;
  font-size: clamp(30px, calc(25.91px + 1.36vw), 42px);
}
.maker_body h2 {
  font-size: clamp(22px, calc(17.23px + 1.59vw), 36px);
  margin-bottom: 20px;
}
.maker_body p {
  font-size: clamp(16px, calc(15.16px + 0.11vw), 16.5px);
  max-width: 64ch;
}
.maker_body p + p {
  margin-top: 16px;
}
.maker_sign {
  margin-top: 26px !important;
  padding-top: 20px;
  border-top: 1px solid var(--border_color);
  font-weight: 600;
  color: var(--text_primary_color) !important;
}

.plan {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
  gap: 48px;
  align-items: start;
}
.plan_card {
  padding: clamp(30px, calc(27.27px + 0.91vw), 38px) clamp(22px, calc(17.23px + 1.59vw), 36px);
  text-align: center;
  border: 1px solid var(--border_color);
  border-top: 4px solid var(--primary_color);
  border-radius: var(--r_xl);
  background: var(--surface_container_lowest_color);
  box-shadow: var(--shadow_lg);
}
.plan_badge {
  display: inline-block;
  padding: 5px 14px;
  border-radius: 999px;
  background: var(--primary_surface_color);
  color: var(--primary_color);
  font-size: 16px;
  font-weight: 600;
  letter-spacing: .04em;
}
.plan_name {
  margin-top: 16px;
  font-size: clamp(20px, calc(18.64px + 0.45vw), 24px);
}

.plan_price {
  margin-top: 18px;
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 10px;
}
.plan_price b {
  font-size: clamp(44px, calc(33.09px + 3.64vw), 76px);
  font-weight: 900;
  font-style: italic;
  line-height: 1;
  letter-spacing: -.05em;
  color: var(--text_primary_color);
}
.plan_price span {
  font-size: clamp(16px, calc(15.32px + 0.23vw), 18px);
  color: var(--text_secondary_color);
}
.plan_per {
  margin-top: 8px;
  font-size: 16px;
  color: var(--text_tertiary_color);
}
.plan_cta {
  margin-top: 26px;
}

.plan_trust {
  display: inline-grid;
  gap: 9px;
  margin-top: 22px;
  text-align: left;
}
.plan_trust li {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 16px;
  color: var(--text_secondary_color);
}
.plan_trust li::before {
  content: "";
  flex: none;
  border-radius: 50%;
  width: clamp(16px, calc(15.32px + 0.23vw), 18px);
  height: clamp(16px, calc(15.32px + 0.23vw), 18px);
  background: var(--success_surface_color) center/10px no-repeat;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='%234ade80' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 6.4l2.6 2.6L10 3'/%3E%3C/svg%3E");
}

.qa {
  border-bottom: 1px solid var(--border_subtle_color);
}
.qa:first-child {
  border-top: 1px solid var(--border_subtle_color);
}
.qa summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: clamp(16px, calc(14.64px + 0.45vw), 20px) 0;
  cursor: pointer;
  list-style: none;
  font-size: clamp(16px, calc(14.99px + 0.17vw), 17px);
  font-weight: 600;
  color: var(--text_primary_color);
}
.qa summary::-webkit-details-marker {
  display: none;
}
.qa summary::after {
  --bar: linear-gradient(#000 0 0);
  content: "";
  flex: none;
  width: clamp(13px, calc(12.32px + 0.23vw), 15px);
  height: clamp(13px, calc(12.32px + 0.23vw), 15px);
  background: var(--primary_color);
  -webkit-mask: var(--bar) 50%/100% 2px no-repeat, var(--bar) 50%/2px 100% no-repeat;
  mask: var(--bar) 50%/100% 2px no-repeat, var(--bar) 50%/2px 100% no-repeat;
}
.qa[open] summary::after {
  -webkit-mask: var(--bar) 50%/100% 2px no-repeat;
  mask: var(--bar) 50%/100% 2px no-repeat;
}
.qa summary:hover {
  color: var(--primary_color);
}
.qa p {
  padding-bottom: 22px;
  font-size: 16px;
  color: var(--text_secondary_color);
}

@media (max-width: 1020px) {
  .feature,
  .who,
  .maker {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .plan {
    grid-template-columns: 1fr;
    gap: 40px;
    max-width: 560px;
    margin-inline: auto;
  }
  .maker {
    justify-items: start;
  }
  .perks {
    grid-template-columns: repeat(2, 1fr);
  }
  .perk:nth-child(even) {
    margin-top: 0;
  }
  .perk:nth-child(2),
  .perk:nth-child(4) {
    margin-top: 24px;
  }
  .finds {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px) {
  .nav_cta {
    margin-left: auto;
    flex-shrink: 0;
  }
  .perks {
    grid-template-columns: 1fr;
  }
  .perk:nth-child(2),
  .perk:nth-child(4) {
    margin-top: 0;
  }
  .pensum li {
    flex-direction: column;
    gap: 2px;
    padding: 16px 0;
  }
  .pensum b {
    min-width: 0;
  }
  .plan_cta {
    white-space: normal;
  }
  .stores {
    justify-content: center;
  }
  .store {
    flex: 1 1 auto;
    justify-content: center;
  }
}

@media (max-width: 420px) {
  .maker_mono {
    justify-self: center;
  }

  .plan_cta {
    padding: clamp(11px, calc(2.78px + 2.74vw), 14.29px) clamp(12px, calc(-12px + 8vw), 21.6px);
    line-height: 1.25;
  }
}

@media (max-width: 400px) {
  .nav_cta {
    padding: clamp(7px, calc(0.7px + 2.1vw), 9.1px) clamp(11px, calc(-2.74px + 4.58vw), 15.58px);
  }
}